/* =========================================================
   Goldschakalprojekt Österreich – Redesign
   Design-System / Globales Stylesheet
   ========================================================= */

:root {
  /* Farben */
  --gold:        #c08a2d;
  --gold-dark:   #85601c; /* dunkel genug für Text auf hellem Grund (Kontrast ≥ 4,5:1) */
  --gold-light:  #e9c87d;
  --brown:       #3a2e1f;
  --brown-soft:  #5a4a35;
  --green:       #5b7553;
  --cream:       #faf6ee;
  --cream-2:     #f1e9da;
  --ink:         #2b2620;
  --muted:       #6f6557;
  --white:       #ffffff;
  --line:        #e3d8c4;

  /* Typografie */
  --font-head: "Georgia", "Times New Roman", serif;
  --font-body: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;

  /* Maße */
  --maxw: 1140px;
  --radius: 14px;
  --shadow: 0 10px 30px rgba(58, 46, 31, .12);
  --shadow-sm: 0 4px 14px rgba(58, 46, 31, .10);
}

* { box-sizing: border-box; }

html { scroll-behavior: smooth; }
[id] { scroll-margin-top: 160px; } /* Sprungziele nicht unter Menü und Sprungleiste verstecken */

body {
  margin: 0;
  font-family: var(--font-body);
  color: var(--ink);
  background: var(--cream);
  line-height: 1.65;
  font-size: 17px;
}

h1, h2, h3, h4 {
  font-family: var(--font-head);
  color: var(--brown);
  line-height: 1.2;
  font-weight: 700;
}

h1 { font-size: clamp(2rem, 4vw, 3.1rem); }
h2 { font-size: clamp(1.6rem, 3vw, 2.3rem); }
h3 { font-size: 1.3rem; }

a { color: var(--gold-dark); text-decoration: none; }
a:hover { text-decoration: underline; }

img { max-width: 100%; height: auto; display: block; }
[hidden] { display: none !important; }

/* Tastatur-Fokus gut sichtbar */
:focus-visible { outline: 3px solid var(--gold); outline-offset: 2px; }

/* „Zum Inhalt springen“ – nur bei Tastaturbedienung sichtbar */
.skip-link {
  position: absolute; left: 12px; top: -60px; z-index: 300;
  background: var(--brown); color: #fff; padding: 10px 16px; border-radius: 8px; font-weight: 700;
}
.skip-link:focus { top: 12px; }

.container {
  max-width: var(--maxw);
  margin: 0 auto;
  padding: 0 24px;
}

.section { padding: 76px 0; }
.section--tight { padding: 48px 0; }
.section--cream2 { background: var(--cream-2); }
.section--folge { padding-top: 0; } /* weiterer Abschnitt im selben Kapitel */
.section:has(+ .section--folge) { padding-bottom: 36px; }

/* Sprungleiste unter dem Titelbild der Hauptseiten */
.subnav {
  position: sticky; top: var(--kopf, 97px); z-index: 90;
  background: rgba(250, 246, 238, .97); border-bottom: 1px solid var(--line);
  backdrop-filter: blur(8px);
}
.subnav .container { display: flex; gap: 8px; overflow-x: auto; padding-top: 10px; padding-bottom: 10px; scrollbar-width: none; }
.subnav .container::-webkit-scrollbar { display: none; }
.subnav a {
  flex: none; padding: 7px 14px; border-radius: 50px; border: 1px solid var(--line);
  background: #fff; color: var(--brown); font-weight: 600; font-size: .9rem; white-space: nowrap;
}
.subnav a:hover { background: var(--cream-2); text-decoration: none; }
.subnav a.aktuell { background: var(--brown); border-color: var(--brown); color: #fff; }
.section--brown { background: var(--brown); color: #f3ece0; }
.section--brown h2, .section--brown h3 { color: var(--gold-light); }

.lead { font-size: 1.2rem; color: var(--brown-soft); max-width: 760px; }
.center { text-align: center; }
.center .lead { margin-left: auto; margin-right: auto; }

.eyebrow {
  text-transform: uppercase;
  letter-spacing: .18em;
  font-size: .78rem;
  font-weight: 700;
  color: var(--gold-dark);
  font-family: var(--font-body);
}

/* ---------- Buttons ---------- */
.btn {
  display: inline-block;
  padding: 14px 26px;
  border-radius: 50px;
  font-weight: 700;
  font-family: var(--font-body);
  font-size: 1rem;
  cursor: pointer;
  border: 2px solid transparent;
  transition: transform .15s ease, box-shadow .15s ease, background .15s ease;
}
.btn:hover { text-decoration: none; transform: translateY(-2px); }
.btn-primary { background: var(--gold); color: var(--ink); box-shadow: var(--shadow-sm); }
.btn-primary:hover { background: var(--gold-dark); color: #fff; }
.btn-ghost { background: transparent; color: var(--brown); border-color: var(--brown); }
.btn-ghost:hover { background: var(--brown); color: #fff; }
.btn-light { background: #fff; color: var(--brown); }
.btn-light:hover { background: var(--cream-2); color: var(--brown); }

/* ---------- Header / Nav ---------- */
.site-header {
  position: sticky; top: 0; z-index: 100;
  background: rgba(250, 246, 238, .95);
  backdrop-filter: blur(8px);
  border-bottom: 1px solid var(--line);
}
.nav {
  display: flex; align-items: center; justify-content: space-between;
  gap: 16px; padding: 12px 24px; max-width: var(--maxw); margin: 0 auto;
}
.brand { display: flex; align-items: center; gap: 12px; }
.brand img { height: 72px; width: auto; }
.brand strong {
  font-family: var(--font-head); color: var(--brown);
  font-size: 1.05rem; line-height: 1.1; max-width: 200px;
}
.nav-links { display: flex; align-items: center; gap: 4px; list-style: none; margin: 0; padding: 0; }
.nav-links a {
  display: block; padding: 9px 14px; border-radius: 8px;
  color: var(--brown); font-weight: 600; font-size: .97rem; white-space: nowrap;
}
.nav-links a:hover { background: var(--cream-2); text-decoration: none; }
.nav-links a.active { color: var(--gold-dark); }
.nav-cta { margin-left: 6px; }
/* Home-Knopf: am Computer nur das Haus-Symbol, im Handy-Menü mit Text */
.nav-home a { display: flex; align-items: center; gap: 8px; padding: 9px 10px; }
.nav-home svg { width: 20px; height: 20px; }
.nav-home-text { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.nav-links a.btn-primary { color: var(--ink); }
.nav-links a.btn-primary:hover { background: var(--gold-dark); color: #fff; }
.lang { display: flex; gap: 2px; align-items: center; margin-left: 6px; }
.lang a { padding: 6px 8px; font-size: .85rem; color: var(--muted); }
.lang a.active { color: var(--brown); font-weight: 700; text-decoration: underline; text-underline-offset: 3px; }
.nav-toggle {
  display: none; background: none; border: 0; cursor: pointer;
  font-size: 1.7rem; color: var(--brown); padding: 4px 8px;
}

@media (max-width: 1200px) {
  .nav-toggle { display: block; }
  .brand img { height: 52px; }
  .subnav { --kopf: 77px; }
  .nav-links {
    display: none; position: absolute; top: 100%; left: 0; right: 0;
    flex-direction: column; align-items: stretch;
    background: var(--cream); border-bottom: 1px solid var(--line);
    padding: 12px 16px; gap: 2px; box-shadow: var(--shadow);
  }
  .nav-links.open { display: flex; }
  .nav-links a { padding: 12px 14px; }
  .nav-cta { margin: 8px 0 0; }
  .nav-home a { padding: 12px 14px; }
  .nav-home-text { position: static; width: auto; height: auto; overflow: visible; clip: auto; }
  .lang { margin: 8px 0 0; }
}

/* ---------- Dropdown-Menü ---------- */
.has-dd { position: relative; }
.has-dd > a::after { content: "\2009\25BE"; color: var(--muted); font-size: .8em; }
.dd-menu {
  position: absolute; top: 100%; left: 0; min-width: 220px; margin: 0;
  list-style: none; padding: 8px;
  background: #fff; border: 1px solid var(--line); border-radius: 12px;
  box-shadow: var(--shadow);
  opacity: 0; visibility: hidden; transform: translateY(-6px);
  transition: opacity .16s ease, transform .16s ease; z-index: 200;
}
.has-dd:hover > .dd-menu, .has-dd:focus-within > .dd-menu { opacity: 1; visibility: visible; transform: translateY(0); }
.dd-menu li { margin: 0; }
.dd-menu a { display: block; padding: 9px 12px; border-radius: 8px; white-space: nowrap; font-weight: 600; font-size: .95rem; color: var(--brown); }
.dd-menu a:hover { background: var(--cream-2); color: var(--gold-dark); }
.dd-menu a[aria-current="page"] { color: var(--gold-dark); }
.dd-toggle { display: none; }

@media (max-width: 1200px) {
  .has-dd > a::after { content: ""; }
  /* Handy: Untermenüs auf- und zuklappbar */
  .has-dd { display: flex; flex-wrap: wrap; align-items: center; }
  .has-dd > a { flex: 1; }
  .dd-toggle {
    display: block; background: none; border: 0; cursor: pointer;
    width: 48px; height: 44px; border-radius: 8px; color: var(--brown); font-size: 1.1rem;
  }
  .dd-toggle:hover { background: var(--cream-2); }
  .dd-toggle span { display: inline-block; transition: transform .15s ease; }
  .has-dd.dd-open .dd-toggle span { transform: rotate(180deg); }
  .dd-menu {
    display: none; flex-basis: 100%;
    position: static; opacity: 1; visibility: visible; transform: none;
    box-shadow: none; border: none; background: transparent; padding: 0 0 4px 14px;
  }
  .has-dd.dd-open > .dd-menu { display: block; }
  .nav-links { max-height: calc(100vh - 80px); overflow-y: auto; }
  .dd-menu a { padding: 8px 14px; }
}

/* ---------- Hero ---------- */
.hero {
  position: relative;
  background:
    linear-gradient(90deg, rgba(40,30,18,.62) 0%, rgba(40,30,18,.38) 45%, rgba(40,30,18,.08) 80%),
    url("../images/hero-welpe.jpg") 60% 30%/cover no-repeat,
    var(--brown);
  color: #fff;
  padding: clamp(70px, 13vw, 150px) 0;
}
.hero h1 { color: #fff; max-width: 760px; }
.hero p { font-size: 1.25rem; max-width: 600px; color: #f5eedf; margin: 18px 0 30px; }
.btn-row { display: flex; flex-wrap: wrap; gap: 14px; align-items: center; }
.hero .btn-row { display: flex; flex-wrap: wrap; gap: 14px; }

/* page hero (smaller) */
.page-hero {
  background: linear-gradient(135deg, var(--brown), var(--brown-soft));
  color: #fff; padding: 64px 0 56px;
}
.page-hero h1 { color: #fff; }
.page-hero p { color: var(--cream-2); max-width: 720px; font-size: 1.15rem; }
.breadcrumb { font-size: .85rem; color: var(--gold-light); margin-bottom: 10px; }
.breadcrumb a { color: var(--gold-light); }
.page-hero--photo {
  position: relative;
  background-color: var(--brown);
  background-position: center 42%;
  background-size: cover;
  background-repeat: no-repeat;
  padding: clamp(78px, 12vw, 130px) 0;
}
.page-hero--photo::before {
  content: ""; position: absolute; inset: 0; pointer-events: none;
  background: linear-gradient(100deg, rgba(40,30,18,.78) 0%, rgba(40,30,18,.45) 55%, rgba(40,30,18,.32) 100%);
}
.page-hero--photo .container { position: relative; z-index: 1; }
.page-hero--hell::before { background: linear-gradient(90deg, rgba(40,30,18,.62) 0%, rgba(40,30,18,.32) 45%, rgba(40,30,18,.06) 80%); }
@media (max-width:700px){ .page-hero--hell::before { background: rgba(40,30,18,.45); } }
.page-hero--hell p { max-width: 470px; }

/* Team: Kurzbeschreibung unter der Rolle */
.member .bio { font-size: .88rem; line-height: 1.5; color: var(--muted); margin: 10px 0 0; }

/* World Jackal Day: Titelbild mit Logo */
.page-hero--wjd { background-position: center 60%; }
.hero-wjd { display: flex; align-items: center; gap: 28px; }
.hero-logo { width: 150px; height: auto; flex: none; filter: drop-shadow(0 6px 18px rgba(0,0,0,.35)); }
@media (max-width: 640px) { .hero-wjd { flex-direction: column; align-items: flex-start; gap: 16px; } .hero-logo { width: 104px; } }

/* ---------- Cards / Grid ---------- */
.grid { display: grid; gap: 26px; }
.grid-2 { grid-template-columns: repeat(2, 1fr); }
.grid-3 { grid-template-columns: repeat(3, 1fr); }
.grid-4 { grid-template-columns: repeat(4, 1fr); }
@media (max-width: 900px) { .grid-3, .grid-4 { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 640px) { .grid-2, .grid-3, .grid-4 { grid-template-columns: 1fr; } }

.card {
  background: #fff; border-radius: var(--radius); overflow: hidden;
  box-shadow: var(--shadow-sm); border: 1px solid var(--line);
  display: flex; flex-direction: column;
  transition: transform .18s ease, box-shadow .18s ease;
}
.card:hover { transform: translateY(-4px); box-shadow: var(--shadow); }
.card--clickable { position: relative; }
.card--clickable .card-link::after { content: ""; position: absolute; inset: 0; }
.card .thumb { height: 168px; background: var(--cream-2) center/cover no-repeat; }
.card .thumb--contain { height: 200px; background-size: contain; background-position: center; padding: 14px; }
.card .thumb--news { height: 200px; }
.card .card-body { padding: 22px; display: flex; flex-direction: column; gap: 8px; flex: 1; }
.card h3 { margin: 0; }
.card p { margin: 0; color: var(--muted); font-size: .98rem; }
.card .card-link { margin-top: auto; font-weight: 700; padding-top: 8px; }

/* Spotlight-Sektion (Wissen & Umfragen) */
.section--spotlight { background: linear-gradient(135deg, var(--brown), var(--brown-soft)); color: #fff; }
.section--spotlight h2 { color: #fff; }
.section--spotlight .eyebrow { color: var(--gold-light); }
.section--spotlight .lead { color: rgba(255,255,255,.82); }

/* Icon-Badge auf Karten */
.card .icon {
  width: 56px; height: 56px; border-radius: 50%; display: flex;
  align-items: center; justify-content: center; font-size: 1.7rem;
  background: linear-gradient(135deg, var(--gold-light), var(--gold));
  box-shadow: var(--shadow-sm); margin-bottom: 6px;
}
.card .card-meta { font-size: .82rem; color: var(--gold-dark); font-weight: 700; letter-spacing: .02em; }
.card .btn { margin-top: auto; }

/* feature row */
.feature { display: grid; grid-template-columns: 1fr 1fr; gap: 48px; align-items: center; }
.feature img { border-radius: var(--radius); box-shadow: var(--shadow); }
@media (max-width: 800px) { .feature { grid-template-columns: 1fr; gap: 28px; } }

/* stats */
.stats { display: grid; grid-template-columns: repeat(4,1fr); gap: 20px; text-align: center; }
.stat .num { font-family: var(--font-head); font-size: 2.4rem; color: var(--gold); font-weight: 700; }
.stat .label { color: var(--muted); font-size: .95rem; }
@media (max-width: 640px) { .stats { grid-template-columns: repeat(2,1fr); } }

/* fact list (Biologie) */
.facts { list-style: none; padding: 0; margin: 0; display: grid; grid-template-columns: repeat(2,1fr); gap: 14px; }
.facts li { background: #fff; border: 1px solid var(--line); border-radius: 12px; padding: 16px 18px; }
.facts .k { display: block; font-size: .8rem; text-transform: uppercase; letter-spacing: .08em; color: var(--gold-dark); font-weight: 700; }
.facts .v { font-size: 1.1rem; color: var(--brown); }
@media (max-width: 640px) { .facts { grid-template-columns: 1fr; } }

/* CTA band */
.cta-band {
  background: linear-gradient(135deg, var(--gold), var(--gold-dark));
  color: #fff; border-radius: var(--radius); padding: 48px; text-align: center;
}
.cta-band h2 { color: #fff; }
.cta-band--left { text-align: left; }
.cta-band--left p { margin-left: 0; }
.cta-band p { color: #fff; opacity: .95; max-width: 640px; margin: 10px auto 24px; }

/* news list */
.news-item {
  display: grid; grid-template-columns: 120px 1fr; gap: 22px; align-items: start;
  padding: 22px 0; border-bottom: 1px solid var(--line);
}
.news-item .date {
  font-family: var(--font-head); color: var(--gold-dark); font-weight: 700;
  font-size: 1rem; line-height: 1.3;
}
.news-item h3 { margin: 0 0 6px; }
.tag { display: inline-block; background: var(--cream-2); color: var(--brown-soft); font-size: .72rem; font-weight: 700; text-transform: uppercase; letter-spacing: .06em; padding: 3px 10px; border-radius: 20px; }
@media (max-width: 600px) { .news-item { grid-template-columns: 1fr; gap: 6px; } }

/* prose */
.prose { max-width: 760px; }
.prose p { margin: 0 0 18px; }
.prose h2 { margin-top: 40px; }
.prose h3 { margin-top: 28px; color: var(--gold-dark); }
.prose ul { padding-left: 20px; }
.prose li { margin-bottom: 6px; }
.prose img { border-radius: var(--radius); margin: 18px 0; box-shadow: var(--shadow-sm); }
figure { margin: 18px 0; }
figcaption { font-size: .85rem; color: var(--muted); margin-top: 6px; }

/* team */
.member { text-align: center; }
.member .avatar {
  width: 120px; height: 120px; border-radius: 50%; margin: 0 auto 14px;
  background: var(--cream-2) center/cover no-repeat; border: 3px solid var(--gold-light);
}
.member h3 { margin: 0; font-size: 1.1rem; }
.member .role { color: var(--muted); font-size: .92rem; }

/* badges/partners */
.logos { display: flex; flex-wrap: wrap; gap: 18px; align-items: center; justify-content: center; }
.logos .logo-box {
  background: #fff; border: 1px solid var(--line); border-radius: 12px;
  padding: 18px 26px; color: var(--muted); font-weight: 600; min-width: 150px; text-align: center;
}

/* form */
.form-card { background: #fff; border: 1px solid var(--line); border-radius: var(--radius); padding: 30px; box-shadow: var(--shadow-sm); }
.form-row { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }
@media (max-width: 640px) { .form-row { grid-template-columns: 1fr; } }
label { display: block; font-weight: 600; font-size: .9rem; margin-bottom: 6px; color: var(--brown); }
input, textarea, select {
  width: 100%; padding: 12px 14px; border: 1px solid var(--line); border-radius: 10px;
  font-family: inherit; font-size: 1rem; background: var(--cream); margin-bottom: 16px;
}
input:focus, textarea:focus, select:focus { outline: 2px solid var(--gold-light); border-color: var(--gold); }
.check { display: flex; gap: 10px; align-items: flex-start; font-weight: 400; font-size: .88rem; color: var(--ink); margin: 0 0 16px; }
.check input { width: auto; margin: 4px 0 0; flex: none; }
.visually-hidden { position: absolute !important; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }

/* placeholder note */
.placeholder {
  border: 1px dashed var(--gold); background: #fff8ea; color: var(--brown-soft);
  border-radius: 10px; padding: 10px 14px; font-size: .85rem; margin: 10px 0;
}

/* ---------- Chronik / Timeline ---------- */
.timeline { position: relative; max-width: 820px; margin: 0 auto; padding: 8px 0; }
.timeline::before {
  content: ""; position: absolute; left: 26px; top: 0; bottom: 0; width: 3px;
  background: linear-gradient(var(--gold-light), var(--gold), var(--gold-light));
}
@media (min-width: 720px) { .timeline::before { left: 50%; transform: translateX(-50%); } }

.tl-item { position: relative; padding: 0 0 34px 64px; }
@media (min-width: 720px) {
  .tl-item { width: 50%; padding: 0 40px 40px; }
  .tl-item:nth-child(odd) { left: 0; text-align: right; }
  .tl-item:nth-child(even) { left: 50%; }
}
.tl-item .dot {
  position: absolute; left: 16px; top: 4px; width: 24px; height: 24px; border-radius: 50%;
  background: var(--gold); border: 4px solid var(--cream); box-shadow: 0 0 0 2px var(--gold);
  z-index: 2;
}
@media (min-width: 720px) {
  .tl-item:nth-child(odd) .dot { left: auto; right: -12px; }
  .tl-item:nth-child(even) .dot { left: -12px; }
}
.tl-year { font-family: var(--font-head); font-size: 1.9rem; font-weight: 700; color: var(--gold-dark); line-height: 1; }
.tl-card {
  background: #fff; border: 1px solid var(--line); border-radius: var(--radius);
  padding: 16px 18px; box-shadow: var(--shadow-sm); margin-top: 8px; text-align: left;
}
.tl-card h3 { margin: 0 0 6px; font-size: 1.12rem; }
.tl-card p { margin: 0; color: var(--muted); font-size: .95rem; }
.tl-item.future .dot { background: var(--cream); }
.tl-item.future .tl-year { color: var(--brown-soft); }

/* ---------- Quiz ---------- */
.quiz { max-width: 720px; margin: 0 auto; }
.quiz-levels { display: grid; grid-template-columns: repeat(3,1fr); gap: 18px; }
@media (max-width: 640px){ .quiz-levels { grid-template-columns: 1fr; } }
.level-btn {
  background: #fff; border: 1px solid var(--line); border-radius: var(--radius);
  box-shadow: var(--shadow-sm); padding: 24px 18px; text-align: center; cursor: pointer;
  transition: transform .15s ease, box-shadow .15s ease; font-family: inherit;
}
.level-btn:hover { transform: translateY(-4px); box-shadow: var(--shadow); }
.level-btn .lv-ic { font-size: 2rem; }
.level-btn h3 { margin: 8px 0 4px; }
.level-btn p { margin: 0; color: var(--muted); font-size: .9rem; }

.quiz-card { background:#fff; border:1px solid var(--line); border-radius: var(--radius); box-shadow: var(--shadow-sm); padding: 26px; }
.quiz-bar { height: 8px; background: var(--cream-2); border-radius: 20px; overflow: hidden; margin-bottom: 18px; }
.quiz-bar > span { display:block; height:100%; background: var(--gold); width:0; transition: width .3s ease; }
.quiz-meta { font-size:.85rem; color: var(--muted); margin-bottom: 6px; }
.quiz-q { font-family: var(--font-head); font-size: 1.3rem; color: var(--brown); margin: 0 0 18px; }
.quiz-answers { display: grid; gap: 12px; }
.quiz-answers button {
  text-align: left; padding: 14px 16px; border:1.5px solid var(--line); border-radius: 12px;
  background: var(--cream); cursor: pointer; font-family: inherit; font-size: 1rem; transition: border-color .15s, background .15s;
}
.quiz-answers button:hover:not(:disabled){ border-color: var(--gold); }
.quiz-answers button:disabled { cursor: default; }
.quiz-answers button.correct { background: #e7f0e2; border-color: var(--green); color:#2f4a2a; font-weight:600; }
.quiz-answers button.wrong { background: #f7e3e0; border-color: #b5483a; color:#7d2e25; }
.quiz-foot { margin-top: 18px; display:flex; justify-content: space-between; align-items:center; gap:12px; }
.quiz-result { text-align:center; }
.quiz-score { font-family: var(--font-head); font-size: 3rem; color: var(--gold); font-weight:700; }

/* ---------- Footer ---------- */
.site-footer { background: var(--brown); color: #d8cdb8; padding: 56px 0 28px; margin-top: 40px; }
.site-footer h4 { color: var(--gold-light); margin: 0 0 14px; font-size: 1rem; }
.footer-grid { display: grid; grid-template-columns: 1.7fr repeat(5, 1fr); gap: 28px; }
.site-footer h4 a { color: inherit; }
.site-footer h4 a:hover { color: #fff; }
.footer-grid a { color: #d8cdb8; }
.footer-grid a:hover { color: #fff; }
.footer-bottom a { color: var(--gold-light); }
.footer-bottom a:hover { color: #fff; }
.footer-grid ul { list-style: none; padding: 0; margin: 0; }
.footer-grid li { margin-bottom: 8px; font-size: .95rem; }
.social-row { display: flex; gap: 12px; margin-top: 14px; }
.social-row a {
  width: 38px; height: 38px; border-radius: 50%; background: rgba(255,255,255,.1);
  display: grid; place-items: center; color: #fff; cursor: pointer;
}
.social-row svg { width: 19px; height: 19px; }
.social-row a:hover { background: var(--gold); color: var(--ink); text-decoration: none; }
.footer-bottom {
  border-top: 1px solid rgba(255,255,255,.15); margin-top: 36px; padding-top: 20px;
  display: flex; flex-wrap: wrap; gap: 12px; justify-content: space-between;
  font-size: .85rem; color: #b5a98f;
}
@media (max-width: 1000px) { .footer-grid { grid-template-columns: repeat(3, 1fr); } .footer-grid > div:first-child { grid-column: 1 / -1; } }
@media (max-width: 800px) { .footer-grid { grid-template-columns: 1fr 1fr; } }
@media (max-width: 480px) { .footer-grid { grid-template-columns: 1fr; } }
.news-fig { margin: 14px 0 0; max-width: 340px; }
.news-fig img { border-radius: var(--radius); box-shadow: var(--shadow-sm); }

/* Handgezeichnete Skizzen (Tusche) statt Emoji-Icons – Dateien in assets/images/skizzen/ */
.card .skizze { display: block; width: 76px; height: 76px; margin: 0 0 10px -6px; }
.card .skizze--logo { width: 80px; height: auto; margin-left: -4px; }
.card .titelkopf { display: block; width: 100%; height: auto; border-radius: 6px; margin-bottom: 12px; }
.level-btn .lv-ic img { width: 64px; height: 64px; display: inline-block; }
.social-row--hell a { background: var(--cream-2); color: var(--brown); }


/* ================================================================
   FELDBUCH-STIL (seit 05.11.2026)
   Papier, Tusche, Buchschrift und sparsame Bleistift-Notizen.
   Schriften liegen lokal in assets/fonts/ (SIL Open Font License),
   es werden keine Daten an Google übertragen.
   ================================================================ */
@font-face{font-family:'EB Garamond';font-style:normal;font-weight:400 700;font-display:swap;src:url('../fonts/eb-garamond-latin.woff2') format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD}
@font-face{font-family:'EB Garamond';font-style:normal;font-weight:400 700;font-display:swap;src:url('../fonts/eb-garamond-latin-ext.woff2') format('woff2');unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF}
@font-face{font-family:'Caveat';font-style:normal;font-weight:400 700;font-display:swap;src:url('../fonts/caveat-latin.woff2') format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD}
@font-face{font-family:'Caveat';font-style:normal;font-weight:400 700;font-display:swap;src:url('../fonts/caveat-latin-ext.woff2') format('woff2');unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF}
:root{
  --paper:#f3ead8; --paper-2:#ebdfc6; --tinte:#3a2c1e; --ink-soft:#6b5640;
  --pencil:#7d6a55; --font-head:"EB Garamond", Georgia, serif; --hand:"Caveat", cursive;
}
/* Papier: warmer Ton + feine Faser-Struktur */
body{
  background-color:var(--paper);
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='300' height='300'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='3' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 .35 0 0 0 0 .27 0 0 0 0 .18 0 0 0 .07 0'/%3E%3C/filter%3E%3Crect width='300' height='300' filter='url(%23n)'/%3E%3C/svg%3E");
  color:var(--tinte);
}
.section{background:transparent}
.section--cream2{background:var(--paper-2);position:relative}
/* Überschriften: Buchschrift */
h1,h2,h3{font-family:var(--font-head);font-weight:600;letter-spacing:-.005em;color:var(--tinte)}
h2{font-size:clamp(2rem,3.4vw,2.7rem)}
h3{font-size:1.4rem}
/* kleine Großbuchstaben-Überschriften -> Bleistift-Notiz */
.eyebrow{font-family:var(--hand);text-transform:none;letter-spacing:0;font-size:1.7rem;font-weight:500;
  color:var(--pencil);display:inline-block;transform:rotate(-2.5deg);margin-bottom:2px}
.hero .eyebrow{font-size:2rem;color:#f0d9a8 !important}
/* Tuschestrich unter Abschnittstiteln */
.center h2::after{content:"";display:block;width:150px;height:12px;margin:10px auto 0;
  background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 150 12'%3E%3Cpath d='M3 7 C30 3 55 9 80 6 C105 3 125 8 147 5' fill='none' stroke='%233a2c1e' stroke-width='1.6' stroke-linecap='round' opacity='.75'/%3E%3Cpath d='M20 9 C50 7 90 10 130 8' fill='none' stroke='%233a2c1e' stroke-width='.7' stroke-linecap='round' opacity='.45'/%3E%3C/svg%3E") no-repeat center/contain}
/* Karten: eingeklebte Fotos auf Papier statt glatter App-Kacheln */
.card{background:#fbf6ea;border:1px solid rgba(58,44,30,.14);border-radius:3px;
  box-shadow:0 1px 0 rgba(58,44,30,.06),0 6px 14px -8px rgba(58,44,30,.35);position:relative;overflow:visible}
.grid-3>.card:nth-child(3n+1){transform:rotate(-.7deg)}
.grid-3>.card:nth-child(3n+2){transform:rotate(.5deg) translateY(6px)}
.grid-3>.card:nth-child(3n){transform:rotate(-.3deg)}
.card:hover{transform:rotate(0) translateY(-3px)}
.card .thumb{margin:10px 10px 0;border-radius:1px;box-shadow:inset 0 0 0 1px rgba(0,0,0,.08)}
.card .thumb::after{content:"";position:absolute;top:-9px;left:50%;width:84px;height:22px;margin-left:-42px;
  background:rgba(232,220,190,.78);transform:rotate(-3deg);box-shadow:0 1px 2px rgba(0,0,0,.08)}
.card .thumb{position:relative}
.card h3{margin-top:4px}
/* Termine: Datum handschriftlich */
[data-termine] .tag{background:none;padding:0;font-family:var(--hand);font-size:1.55rem;text-transform:none;letter-spacing:0;color:#9a6b1f;font-weight:600}
.tag{border-radius:2px}
/* Links ohne Pfeil-Gewitter, dafür unterstrichen wie mit Feder */
.card-link{text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:4px;text-decoration-color:rgba(154,107,31,.55)}
/* Knöpfe: weniger "App", eher Etikett */
.btn{border-radius:3px;letter-spacing:.01em}
.btn-primary{background:var(--tinte);color:#f6efe0;border:1px solid var(--tinte);box-shadow:3px 3px 0 #c9a24a}
.btn-primary:hover{background:#4a3826;box-shadow:1px 1px 0 #c9a24a;transform:translate(2px,2px)}
.btn-ghost{border:1px solid var(--tinte);color:var(--tinte);background:transparent}
/* "Forschung aktuell": statt Goldverlauf eine Notizbuchseite mit Linien */
.cta-band{background:
   repeating-linear-gradient(to bottom,transparent 0 31px,rgba(80,110,150,.16) 31px 32px),
   #fbf6ea !important;
  color:var(--tinte) !important;border:1px solid rgba(58,44,30,.18);border-radius:3px;
  box-shadow:0 10px 24px -14px rgba(58,44,30,.45);position:relative;padding-left:clamp(28px,8vw,110px) !important}
.cta-band::before{content:"";position:absolute;left:clamp(16px,5vw,70px);top:0;bottom:0;width:1px;background:rgba(190,80,70,.35)}
.cta-band h2,.cta-band p{color:var(--tinte) !important}
.cta-band .eyebrow{color:#9a6b1f !important}
.cta-band .btn-light{background:var(--tinte);color:#f6efe0}
.cta-band .btn-ghost{color:var(--tinte) !important;border-color:var(--tinte) !important}
/* Fotos im Mitmachen-Block: wie eingeklebter Abzug */
.feature>img:not(.rand):not(.freigestellt){background:#fff;padding:10px 10px 34px;border-radius:2px;transform:rotate(1.2deg);
  box-shadow:0 12px 26px -14px rgba(0,0,0,.5)}
/* Randskizzen und Notizen (nur in der Vorschau eingesetzt) */
.rand{position:absolute;pointer-events:none;opacity:.9;box-shadow:none !important;border-radius:0 !important;background:none !important}
.notiz{position:absolute;font-family:var(--hand);font-size:1.45rem;color:var(--pencil);line-height:1.1;transform:rotate(-4deg);pointer-events:none}
.faehrte-trenner{display:block;margin:10px auto;width:min(620px,84%);height:30px;opacity:.6;
  background:url("../images/skizzen/schnuerspur-quer.svg") space no-repeat center/82px 30px;background-repeat:space no-repeat}
.section{position:relative}
@media (max-width:900px){.rand,.notiz{display:none}.grid-3>.card{transform:none !important}}
/* Fußzeile: dunkles Leder statt glattem Braun */
.site-footer{background:#33261a}
.nav-links a.btn-primary{color:#f6efe0}
/* Handschriftlicher Gruß in der Fußzeile */
.footer-gruss{font-family:var(--hand);font-size:1.75rem;color:#e6c98a;margin:34px 0 0;transform:rotate(-1.5deg);text-align:right;line-height:1.2}
@media (max-width:700px){.footer-gruss{text-align:left;font-size:1.5rem}}
/* Jahreszeiten-Notiz im Titelbild der Startseite */
.hero .notiz-saison{font-family:var(--hand);font-size:2rem;line-height:1.15;color:#f3dfae;max-width:400px;
  position:absolute;right:4%;bottom:46px;transform:rotate(-3deg);text-shadow:0 1px 6px rgba(0,0,0,.55);margin:0}
.hero{position:relative}
@media (max-width:700px){.hero{background:linear-gradient(rgba(40,30,18,.5),rgba(40,30,18,.5)),url("../images/hero-welpe.jpg") 62% 30%/cover no-repeat,var(--brown)}}
@media (max-width:900px){.hero .notiz-saison{position:static;transform:rotate(-2deg);margin-top:22px;font-size:1.7rem}}
.saison-kopf{display:block;font-size:.72em;letter-spacing:.02em;color:#e9c56f;border-bottom:1px solid rgba(233,197,111,.6);padding-bottom:2px;margin-bottom:6px;width:max-content;max-width:100%}

/* FELDBUCH-DETAILS (übernommen 2026-11-05): 1 Reiter · 4 Bestimmungskarte · 5 Chronik-Fährte · 6 Strichliste · 7 Notizzettel · 9 Initiale */

/* 1 · Register-Reiter statt runder Knöpfe */
.subnav{background:#efe5cf;border-bottom:2px solid rgba(58,44,30,.25);box-shadow:none;padding-top:10px}
.subnav .container{gap:4px;align-items:flex-end;padding-bottom:0}
.subnav a{border-radius:7px 7px 0 0;border:1px solid rgba(58,44,30,.28);border-bottom:none;
  padding:9px 18px 7px;margin-bottom:-2px;font-family:var(--font-head);font-size:1.02rem;font-weight:600;
  color:#3a2c1e;box-shadow:inset 0 -6px 8px -6px rgba(58,44,30,.18)}
.subnav a:nth-child(4n+1){background:#e4cf9c}
.subnav a:nth-child(4n+2){background:#d9c2a0;transform:translateY(2px)}
.subnav a:nth-child(4n+3){background:#cdd3b4}
.subnav a:nth-child(4n){background:#e8d8bd;transform:translateY(1px)}
.subnav a:hover,.subnav a.aktuell{background:#f3ead8 !important;transform:translateY(-3px);color:#3a2c1e}

/* 9 · Initiale */
.initiale>p:first-of-type::first-letter{float:left;font-family:var(--font-head);font-weight:600;
  font-size:4.6rem;line-height:.82;margin:6px 10px 0 0;color:#9a6b1f;
  text-shadow:2px 2px 0 rgba(201,162,74,.25)}

/* 4 · Steckbrief als Bestimmungskarte */
.bestimmung{background:#fbf6ea;border:1px solid rgba(58,44,30,.35);outline:1px solid rgba(58,44,30,.25);outline-offset:-8px;
  padding:34px 40px 30px;max-width:900px;margin:0 auto;position:relative;box-shadow:0 14px 30px -18px rgba(58,44,30,.55)}
.bestimmung .kopf{display:flex;justify-content:space-between;align-items:baseline;border-bottom:1px solid rgba(58,44,30,.3);padding-bottom:8px;margin-bottom:6px;gap:14px;flex-wrap:wrap}
.bestimmung .kopf h2{margin:0;font-size:2rem}
.bestimmung .kopf h2 em{font-weight:500}
.bestimmung .kopf span{font-family:var(--hand);font-size:1.4rem;color:#7d6a55}
.bestimmung .tafel{display:block;width:100%;height:auto;margin:6px 0 14px}
.bestimmung .masse{display:grid;grid-template-columns:1fr 1fr;gap:4px 40px;margin:0;padding:0;list-style:none}
.bestimmung .masse li{display:flex;align-items:baseline;gap:8px;font-size:1rem}
.bestimmung .masse li::after{content:"";order:2;flex:1;border-bottom:1px dotted rgba(58,44,30,.5);transform:translateY(-4px)}
.bestimmung .masse .k{order:1;font-family:var(--font-head);font-size:1.12rem}
.bestimmung .masse .v{order:3;font-family:var(--hand);font-size:1.45rem;color:#7a4f12}
.bestimmung .tafel text{font-family:Caveat,cursive;fill:#7a4f12}
@media (max-width:700px){.bestimmung{padding:24px 18px}.bestimmung .masse{grid-template-columns:1fr}}

/* 6 · Projekt in Zahlen als Strichliste / eingekreist */
.stats .stat{background:transparent;border:none;box-shadow:none;text-align:center}
.stats .stat .num{font-family:var(--hand);font-weight:600;font-size:3.2rem;color:#3a2c1e;display:inline-block;
  padding:4px 22px;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 160 80' preserveAspectRatio='none'%3E%3Cpath d='M20 42 C18 18 70 8 112 14 C150 20 154 52 120 66 C84 78 30 72 18 50 C14 40 26 26 40 22' fill='none' stroke='%239a6b1f' stroke-width='2.2' stroke-linecap='round' opacity='.75'/%3E%3C/svg%3E") no-repeat center/100% 100%}
.stats .stat .label{font-family:var(--font-head);font-size:1.05rem;color:#5a4632}
.strich{display:block;height:62px;margin:6px auto 4px;width:130px;
  background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 140 30'%3E%3Cg stroke='%233a2c1e' stroke-width='1.8' stroke-linecap='round' fill='none'%3E%3Cpath d='M8 4 L9 26 M17 3 L17 27 M25 4 L26 26 M33 3 L33 26 M3 22 L39 8'/%3E%3Cpath d='M58 4 L59 26 M67 3 L67 27 M75 4 L76 26 M83 3 L83 26 M53 22 L89 8'/%3E%3Cpath d='M104 4 L105 26'/%3E%3C/g%3E%3C/svg%3E") no-repeat center/contain}

/* 7 · Termine als angeheftete Notizzettel */
[data-termine] .card{overflow:visible;position:relative;background:#fdf3c9;border:none;border-radius:1px;
  box-shadow:0 1px 1px rgba(0,0,0,.08),0 12px 18px -12px rgba(58,44,30,.55);
  background-image:repeating-linear-gradient(to bottom,transparent 0 27px,rgba(110,140,170,.18) 27px 28px);background-position:0 54px}
[data-termine] .card:nth-child(2){background-color:#f6ead4}
[data-termine] .card:nth-child(3){background-color:#e9efd9}
[data-termine] .card::before{content:"";position:absolute;top:-8px;left:50%;width:18px;height:18px;margin-left:-9px;border-radius:50%;
  background:radial-gradient(circle at 35% 35%,#e97b6a,#a8352a 60%,#6d1f18);box-shadow:1px 3px 3px rgba(0,0,0,.3);z-index:2}
[data-termine] .card .tag{font-size:2rem !important;display:block;margin:6px 0 2px}

/* 5 · Chronik als Fährte statt Linie */
.timeline::before{width:44px;background:url("../images/skizzen/schnuerspur.svg") repeat-y center top/40px 110px;opacity:.75;left:6px}
@media (min-width:720px){.timeline::before{left:50%;width:60px}}
.tl-item .dot{width:30px;height:30px;border:none;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'%3E%3Cpath d='M15 3 C23 2 28 9 27 16 C26 24 18 28 11 26 C4 24 2 15 5 9 C7 5 11 3 16 3' fill='%23f3ead8' stroke='%239a6b1f' stroke-width='2' stroke-linecap='round'/%3E%3C/svg%3E") no-repeat center/contain;box-shadow:none}
.tl-year{font-family:var(--hand) !important;font-size:2.2rem !important;color:#9a6b1f !important;font-weight:600}
.tl-card{background:#fbf6ea;border:1px solid rgba(58,44,30,.15);border-radius:2px}
.tl-item .dot{left:13px}
@media (min-width:720px){.tl-item:nth-child(odd) .dot{right:-15px}.tl-item:nth-child(even) .dot{left:-15px}}
.tl-card{box-shadow:0 10px 18px -14px rgba(58,44,30,.6)}
.tl-item:nth-child(odd) .tl-card{transform:rotate(-.6deg)}.tl-item:nth-child(even) .tl-card{transform:rotate(.5deg)}
[data-termine] .card:nth-child(1){transform:rotate(-1.2deg)}[data-termine] .card:nth-child(2){transform:rotate(.9deg)}[data-termine] .card:nth-child(3){transform:rotate(-.5deg)}

/* Platzhalter-Avatar (bis Fotos da sind) */
.member .avatar--platzhalter{display:flex;flex-direction:column;align-items:center;justify-content:center;
  background:#f6eedb;border:2px dashed rgba(154,107,31,.55);color:#9a6b1f}
.avatar--platzhalter span{font-family:var(--font-head);font-size:2.3rem;font-weight:600;line-height:1}
.avatar--platzhalter small{font-family:var(--hand);font-size:1.05rem;color:#7d6a55;margin-top:2px}
/* Freigestellte Bilder (Buch-Mockups mit transparentem Hintergrund): kein Foto-Rahmen */
img.freigestellt{background:none !important;padding:0 !important;border-radius:0 !important;box-shadow:none !important;
  transform:none;filter:drop-shadow(0 14px 18px rgba(58,44,30,.28))}
/* Hervorgehobene Abschnitte (Quiz, Umfragen): im Feldbuch-Stil Papier statt dunkler Fläche –
   daher dunkle Tinte statt weißer Schrift */
.section.section--spotlight{background:var(--paper-2);color:var(--tinte);
  border-top:1px solid rgba(58,44,30,.12);border-bottom:1px solid rgba(58,44,30,.12)}
.section--spotlight h2,.section--spotlight h3{color:var(--tinte)}
.section--spotlight .eyebrow{color:var(--pencil)}
.section--spotlight p,.section--spotlight .lead{color:var(--ink-soft)}
/* Gruppenfoto als eingeklebter Abzug mit Klebestreifen und Bildunterschrift in Handschrift */
.feldfoto{position:relative;max-width:760px;margin:0 auto 46px;padding:12px 12px 8px;background:#fff;
  transform:rotate(-1deg);box-shadow:0 16px 30px -16px rgba(0,0,0,.5)}
.feldfoto img{display:block;width:100%;height:auto}
.feldfoto figcaption{font-family:var(--hand);font-size:1.6rem;color:var(--pencil);text-align:center;margin:6px 0 0}
.feldfoto::before,.feldfoto::after{content:"";position:absolute;top:-12px;width:110px;height:28px;
  background:rgba(228,207,156,.75);box-shadow:0 1px 2px rgba(0,0,0,.12)}
.feldfoto::before{left:8%;transform:rotate(-6deg)}
.feldfoto::after{right:8%;transform:rotate(5deg)}
@media (max-width:640px){.feldfoto{transform:none}.feldfoto figcaption{font-size:1.35rem}}
.member .hund{font-family:var(--hand);font-size:1.3rem;color:#9a6b1f;line-height:1.1;margin-top:2px}
/* Kriterien-Seite: Hörbeispiele und Video-Vorschau */
.hoerbeispiele audio{width:100%;margin-top:10px}
.video-vorschau{display:block;position:relative;background:#fff;padding:10px 10px 30px;transform:rotate(1deg);box-shadow:0 12px 26px -14px rgba(0,0,0,.5)}
.video-vorschau img{display:block;width:100%;height:auto}
.video-vorschau::after{content:"";position:absolute;left:50%;top:calc(50% - 10px);width:64px;height:64px;margin:-32px 0 0 -32px;border-radius:50%;
  background:rgba(58,44,30,.8) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M9 6l9 6-9 6z' fill='%23f3ead8'/%3E%3C/svg%3E") no-repeat 55% 50%/30px}
.video-vorschau:hover::after{background-color:#9a6b1f}

/* SchakalMelder aufs Handy holen: QR-Code + Installationsschritte (mitmachen.html, DE/EN) */
.app-qr{margin-top:28px}
.app-qr .card-body{flex-direction:row;gap:28px;align-items:flex-start}
.app-qr__code{flex:0 0 auto;margin:0;text-align:center}
.app-qr__code img{display:block;width:180px;height:180px;background:#fff;border:1px solid var(--line);border-radius:10px}
.app-qr__code figcaption{margin-top:8px;font-size:.85rem;color:var(--muted);max-width:180px}
.app-qr__text{display:flex;flex-direction:column;gap:8px;min-width:0}
.app-qr ol{margin:4px 0 0;padding-left:1.3em;color:var(--ink)}
.app-qr ol li{margin-bottom:8px}
.app-qr ul{margin:6px 0 0;padding-left:1.1em}
.app-qr ul li{margin-bottom:4px}
@media (max-width:640px){.app-qr .card-body{flex-direction:column;gap:12px}.app-qr__code{display:none}}

/* Mitmachen gestrafft (2026-11-08): Melde-Arten, Hinweisbox, Jäger-Kontakt, aufklappbare Schritte */
.melde-arten{list-style:none;display:flex;flex-wrap:wrap;gap:8px;padding:0;margin:20px 0 0}
.melde-arten li{background:#fff;border:1px solid var(--line);border-radius:20px;padding:5px 14px;font-size:.92rem;font-weight:600;color:var(--brown-soft)}
.melde-hinweis{margin:14px 0 0;font-size:.95rem;color:var(--brown-soft)}
.melde-info{max-width:760px;margin:28px 0 0;padding:18px 22px;border-left:4px solid var(--gold);background:rgba(255,255,255,.6);border-radius:0 var(--radius) var(--radius) 0;font-size:.95rem;color:var(--brown-soft)}
.melde-info p{margin:0 0 8px}.melde-info p:last-child{margin:0}
.jaeger-intro{max-width:760px;margin:16px 0 0}
.jaeger-kontakt{display:grid;grid-template-columns:1.4fr 1fr;gap:28px;margin-top:28px;align-items:start}
.jaeger-kontakt h3{margin:0 0 10px}
.jaeger-kontakt p{margin:0 0 12px}
.jaeger-kontakt__wege{font-size:1.15rem;font-weight:700;line-height:1.7}
.jaeger-kontakt__infoblatt{display:flex;flex-direction:column;gap:6px;align-items:flex-start;padding:18px;background:var(--cream-2);border-radius:var(--radius)}
.jaeger-kontakt__infoblatt span{font-size:.88rem;color:var(--muted)}
.jaeger-kontakt__infoblatt .btn{margin-top:8px}
@media (max-width:760px){.jaeger-kontakt{grid-template-columns:1fr;gap:18px}}
.aufklapp{max-width:760px;margin-top:28px}
.aufklapp details{background:#fff;border:1px solid var(--line);border-radius:var(--radius);margin-bottom:10px;box-shadow:var(--shadow-sm)}
.aufklapp summary{padding:14px 20px;cursor:pointer;font-weight:700;color:var(--brown);font-size:1.05rem}
.aufklapp details>div{padding:0 20px 8px}
.aufklapp ul{padding-left:20px}.aufklapp li{margin-bottom:6px}