/* ================= Waldgold — Design-Layer =================
   Farb-DNA: Tierhotel-Logo Braun #897468 + Beige #E0D1BE,
   Moor-Braun als Ink, Wiesengrün als frischer Akzent. */

@font-face{font-family:'Newsreader';src:url('assets/fonts/Newsreader-var.woff2') format('woff2');font-weight:200 800;font-style:normal;font-display:swap}
@font-face{font-family:'Newsreader';src:url('assets/fonts/Newsreader-italic.woff2') format('woff2');font-weight:200 800;font-style:italic;font-display:swap}
@font-face{font-family:'Albert Sans';src:url('assets/fonts/AlbertSans-var.woff2') format('woff2');font-weight:100 900;font-style:normal;font-display:swap}

img{max-width:100%;height:auto}
:root{
  --paper:#F4ECDF;
  --beige:#E0D1BE;
  --beige-tief:#D3C0A8;
  --braun:#897468;
  --braun-text:#6B584C;
  --moor:#3A2C22;
  --moor-soft:#54453A;
  --wiese:#71763A;
  --wiese-dunkel:#585E2C;
  --cream:#FAF5EC;
  --rot:#9A4A32;
  --line:#CBB99F;
  --line-strong:#B9A88E;
  --accent:var(--moor);
  --serif:'Newsreader',Georgia,serif;
  --sans:'Albert Sans',system-ui,sans-serif;
  --r:22px;
  --shadow:0 18px 44px rgba(58,44,34,.14);
}

html{font-size:16px}
body{
  font-family:var(--sans);
  color:var(--moor-soft);
  background:var(--paper);
  line-height:1.65;
  -webkit-font-smoothing:antialiased;
  overflow-x:hidden;
}
body strong{color:var(--moor);font-weight:700}
h1,h2,h3{font-family:var(--serif);color:var(--moor);line-height:1.08;font-weight:500}
a{color:var(--moor)}
.wrap{max-width:1160px;margin:0 auto;padding:0 22px}

/* Eyebrow = Welt-Marke: kleines Oval + gesperrte Schrift */
.welt-marke{
  display:inline-flex;align-items:center;gap:10px;
  font-size:.72rem;letter-spacing:.22em;text-transform:uppercase;
  color:var(--braun-text);font-weight:700;
}
.welt-marke::before{
  content:"";width:26px;height:16px;border:2px solid var(--braun);
  border-radius:50%;flex:none;
}
.welt-marke.gruen{color:var(--wiese-dunkel)}
.welt-marke.gruen::before{border-color:var(--wiese-dunkel)}

/* Buttons: oval, moorbraun, grüner Hover */
.btn{
  display:inline-flex;align-items:center;justify-content:center;gap:9px;
  font-family:var(--sans);font-weight:700;font-size:.98rem;
  padding:15px 30px;border-radius:999px;border:2px solid var(--moor);
  background:var(--moor);color:var(--cream);text-decoration:none;
  cursor:pointer;transition:background .25s ease,border-color .25s ease,transform .25s ease;
  min-height:48px;
}
.btn:hover{background:var(--wiese-dunkel);border-color:var(--wiese-dunkel);transform:translateY(-1px)}
.btn.ghost{background:transparent;color:var(--moor)}
.btn.ghost:hover{background:var(--moor);color:var(--cream);transform:translateY(-1px)}
.btn.hell{background:var(--cream);border-color:var(--cream);color:var(--moor)}
.btn.hell:hover{background:var(--beige);border-color:var(--beige)}

/* ================= Header ================= */
.site-head{
  position:sticky;top:0;z-index:50;
  background:rgba(244,236,223,.92);
  backdrop-filter:blur(10px);
  border-bottom:1px solid var(--line);
}
.head-inner{display:flex;align-items:center;justify-content:space-between;gap:18px;padding:14px 22px;max-width:1240px;margin:0 auto}
.wordmark{font-family:var(--serif);font-weight:700;font-size:1.32rem;color:var(--moor);text-decoration:none;letter-spacing:.01em;line-height:1;padding:6px 0}
.wordmark em{font-style:italic;font-weight:500;color:var(--braun-text)}
.wordmark small{display:block;font-family:var(--sans);font-weight:700;font-size:.6rem;letter-spacing:.24em;text-transform:uppercase;color:var(--braun-text);margin-top:3px}
.main-nav{display:flex;align-items:center;gap:26px}
.main-nav a{font-size:.92rem;font-weight:500;text-decoration:none;color:var(--moor-soft);position:relative;padding:12px 0}
.main-nav a::after{content:"";position:absolute;left:0;bottom:0;height:2px;width:0;background:var(--wiese);transition:width .3s ease}
.main-nav a:hover::after{width:100%}
.head-tel{font-weight:700;color:var(--moor);text-decoration:none;font-size:.95rem;white-space:nowrap;padding:12px 0}
.nav-toggle{display:none;background:none;border:2px solid var(--moor);border-radius:999px;width:46px;height:46px;cursor:pointer;position:relative}
.nav-toggle span,.nav-toggle span::before,.nav-toggle span::after{content:"";position:absolute;left:12px;right:12px;height:2px;background:var(--moor);transition:transform .25s ease,opacity .2s ease}
.nav-toggle span{top:21px}
.nav-toggle span::before{left:0;right:0;top:-7px}
.nav-toggle span::after{left:0;right:0;top:7px}
.nav-open .nav-toggle span{background:transparent}
.nav-open .nav-toggle span::before{transform:translateY(7px) rotate(45deg)}
.nav-open .nav-toggle span::after{transform:translateY(-7px) rotate(-45deg)}

/* ================= Hero ================= */
.hero{position:relative;min-height:92svh;display:flex;align-items:flex-start;isolation:isolate}
.hero-bild{position:absolute;inset:0;z-index:-2}
.hero-bild img{width:100%;height:100%;object-fit:cover;object-position:48% 100%}
.hero::after{
  content:"";position:absolute;inset:0;z-index:-1;
  background:linear-gradient(180deg,rgba(244,232,210,.34) 0%,rgba(244,232,210,0) 46%);
}
.hero-inhalt{width:100%;max-width:1240px;margin:0 auto;padding:104px 22px 60px;color:var(--moor);display:flex;flex-direction:column;align-items:flex-end}
.hero h1{color:var(--moor);font-size:clamp(2.6rem,5.8vw,4.9rem);font-weight:500;letter-spacing:-.01em;text-align:left}
.hero h1 .zeile{display:block;overflow:hidden;padding:.15em 0 .18em;margin:-.15em 0 -.18em}
.hero h1 .zeile>span{display:block}
.has-js .hero h1 .zeile>span{transform:translateY(110%);animation:zeile-rein .9s cubic-bezier(.165,.84,.44,1) forwards}
.has-js .hero h1 .zeile:nth-child(2)>span{animation-delay:.14s}
.has-js .hero h1 .zeile:nth-child(3)>span{animation-delay:.28s}
@keyframes zeile-rein{to{transform:translateY(0)}}
.hero h1 em{font-style:italic;color:var(--rot)}
.hero h1 .versatz{padding-left:.9em}
.hero-sub{width:min(520px,100%);font-size:1.06rem;margin-top:18px;color:var(--moor-soft);text-align:left}
.hero-sub strong{color:var(--moor)}
/* Welten-Kompass = die eine CTA-Zeile des Heros */
.welten-kompass{display:flex;flex-wrap:wrap;gap:12px;margin-top:28px;justify-content:flex-end}
.welten-kompass a{
  display:inline-flex;align-items:center;gap:10px;
  font-weight:700;font-size:.95rem;color:var(--moor);text-decoration:none;
  border:2px solid rgba(58,44,34,.45);border-radius:999px;padding:12px 22px;
  background:rgba(250,245,236,.5);backdrop-filter:blur(3px);-webkit-backdrop-filter:blur(3px);
  transition:background .25s ease,border-color .25s ease,color .25s ease;min-height:48px;
}
.welten-kompass a small{font-weight:500;font-size:.72rem;letter-spacing:.16em;text-transform:uppercase;color:var(--braun-text)}
.welten-kompass a:hover{background:var(--moor);border-color:transparent;color:var(--cream)}
.welten-kompass a:hover small{color:var(--beige)}

/* ================= Marlene / Vertrauen ================= */
.vertrauen{padding:96px 0 90px;position:relative}
.vertrauen-lage{display:grid;grid-template-columns:1.05fr .95fr;gap:0;align-items:center}
.vertrauen-foto{position:relative}
.vertrauen-foto img{width:100%;height:auto;border-radius:var(--r) 120px var(--r) var(--r)}
.vertrauen-panel{
  background:var(--cream);border-radius:var(--r);box-shadow:var(--shadow);
  padding:44px 42px;margin-left:-70px;position:relative;z-index:2;
}
.vertrauen-panel h2{font-size:clamp(1.9rem,3.4vw,2.7rem);margin:12px 0 16px}
.vertrauen-panel h2 em{font-style:italic;color:var(--wiese-dunkel)}
.trust-zeile{display:flex;flex-wrap:wrap;gap:10px 26px;margin-top:22px;padding-top:20px;border-top:1px solid var(--line)}
.trust-zeile span{display:inline-flex;align-items:center;gap:8px;font-size:.86rem;font-weight:700;color:var(--moor)}
.trust-zeile span::before{content:"";width:9px;height:9px;border-radius:50%;background:var(--wiese);flex:none}

/* ================= Welten-Kapitel gemeinsame Basis ================= */
.welt{padding:92px 0}
.welt-kopf{max-width:720px;margin-bottom:44px}
.welt-kopf h2{font-size:clamp(2rem,4vw,3.1rem);margin:12px 0 14px}
.welt-kopf h2 em{font-style:italic}

/* --- Welt I: Hundeschule (cremeweißer Unterton) --- */
.welt-schule{background:var(--cream)}
.schule-buehne{display:grid;grid-template-columns:.9fr 1.1fr;gap:0;align-items:stretch;margin-bottom:54px}
.schule-buehne .foto{position:relative}
.schule-buehne .foto img{width:100%;height:100%;object-fit:cover;border-radius:var(--r) 0 0 var(--r);min-height:420px}
.schule-buehne .inhalt{
  background:var(--moor);color:var(--beige);border-radius:0 var(--r) var(--r) 0;
  padding:48px 46px;display:flex;flex-direction:column;justify-content:center;
}
.schule-buehne .inhalt h3{color:var(--cream);font-size:1.7rem;margin-bottom:14px}
.schule-buehne .inhalt p{color:rgba(224,209,190,.92)}
.schule-buehne .inhalt strong{color:var(--cream)}
.leistungs-liste{display:grid;grid-template-columns:1fr 1fr;gap:10px 22px;margin-top:22px;list-style:none}
.leistungs-liste li{display:flex;gap:10px;align-items:flex-start;font-size:.92rem;color:rgba(224,209,190,.92)}
.leistungs-liste li::before{content:"";width:8px;height:8px;border-radius:50%;background:var(--wiese);flex:none;margin-top:8px}

/* Kurs-Karten */
.kurs-raster{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}
.kurs-karte{
  background:var(--paper);border:1px solid var(--line);border-radius:var(--r);
  padding:28px 26px;display:flex;flex-direction:column;gap:12px;position:relative;
}
.kurs-karte h3{font-size:1.32rem}
.kurs-karte .fakt{font-size:.86rem;color:var(--moor-soft)}
.kurs-karte .preis{font-family:var(--serif);font-size:1.5rem;color:var(--moor);margin-top:auto}
.kurs-karte .preis small{font-family:var(--sans);font-size:.8rem;color:var(--braun-text)}

/* ================= SIGNATURE: Belegungs-Ampel ================= */
.ampel-sektion{background:var(--moor);color:var(--beige);padding:88px 0;position:relative;isolation:isolate}
.ampel-sektion::before{content:"";position:absolute;inset:0;z-index:-1;background:url(assets/nachtfeld-2200.jpg) center bottom/cover no-repeat;opacity:.85}
.ampel-sektion::after{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(180deg,rgba(38,27,19,.55),rgba(38,27,19,.25) 40%,rgba(38,27,19,.6))}
.ampel-sektion .welt-marke{color:var(--beige)!important}
.ampel-sektion .welt-marke::before{border-color:var(--beige)}
.ampel-sektion h2{color:var(--cream);font-size:clamp(1.9rem,3.6vw,2.9rem);margin:12px 0 10px}
.ampel-sektion h2 em{font-style:italic;color:var(--beige)}
.ampel-intro{max-width:640px;color:rgba(224,209,190,.9)}
.ampel-intro strong{color:var(--cream)}
.ampel-brett{display:grid;grid-template-columns:repeat(2,1fr);gap:14px;margin-top:38px}
.ampel-zeile{
  display:grid;grid-template-columns:auto 1fr auto;gap:16px;align-items:center;
  background:rgba(250,245,236,.06);border:1px solid rgba(224,209,190,.22);
  border-radius:16px;padding:18px 22px;
}
.ampel-licht{width:16px;height:16px;border-radius:50%;flex:none;position:relative}
.ampel-licht.frei{background:#8FBF5A;box-shadow:0 0 0 0 rgba(143,191,90,.5)}
.has-js .ampel-licht.frei{animation:puls 2.4s ease-out infinite}
.ampel-licht.knapp{background:#E0B34C}
.ampel-licht.voll{background:#C4573B}
@keyframes puls{0%{box-shadow:0 0 0 0 rgba(143,191,90,.45)}70%{box-shadow:0 0 0 11px rgba(143,191,90,0)}100%{box-shadow:0 0 0 0 rgba(143,191,90,0)}}
.ampel-was{min-width:0}
.ampel-was b{display:block;color:var(--cream);font-size:1rem}
.ampel-was span{font-size:.83rem;color:rgba(224,209,190,.78)}
.ampel-status{font-size:.72rem;font-weight:700;letter-spacing:.14em;text-transform:uppercase;white-space:nowrap}
.ampel-status.frei{color:#A9D47A}
.ampel-status.knapp{color:#E8C36B}
.ampel-status.voll{color:#E08A6F}
.ampel-fuss{margin-top:26px;display:flex;flex-wrap:wrap;align-items:center;gap:18px}
.ampel-fuss p{font-size:.85rem;color:rgba(224,209,190,.75);max-width:420px}

/* --- Welt II: Zucht (heller Wiesen-Unterton) --- */
.welt-zucht{background:linear-gradient(180deg,var(--paper) 0%,#EDE8D6 100%)}
.zucht-buehne{display:grid;grid-template-columns:1.08fr .92fr;gap:34px;align-items:center;margin-bottom:56px}
.zucht-buehne .foto{position:relative}
.zucht-buehne .foto img{width:100%;height:auto;border-radius:120px 120px var(--r) var(--r)}
.zucht-ghost{
  position:absolute;left:20px;bottom:24px;z-index:2;
  font-family:var(--serif);font-style:italic;font-size:clamp(3rem,6vw,4.6rem);
  color:var(--cream);line-height:1;padding:.15em .1em .18em;
  text-shadow:0 2px 6px rgba(35,28,16,.55),0 6px 26px rgba(35,28,16,.45);
}
.dwurf-band{
  display:flex;flex-wrap:wrap;align-items:center;gap:16px;
  background:var(--wiese-dunkel);color:var(--cream);border-radius:999px;
  padding:16px 16px 16px 30px;margin:0 0 46px;
}
.dwurf-band p{font-size:.98rem}
.dwurf-band p strong{color:#fff}
.dwurf-band .btn{margin-left:auto}
.hunde-raster{display:grid;grid-template-columns:repeat(3,1fr);gap:22px;margin-bottom:52px}
.hund-karte{position:relative;border-radius:var(--r);overflow:hidden;min-height:380px;display:flex;align-items:flex-end}
.hund-karte img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:transform 1s ease}
.hund-karte:hover img{transform:scale(1.045)}
.hund-karte figcaption{
  position:relative;z-index:2;width:100%;padding:24px 24px 20px;color:var(--cream);
  background:linear-gradient(0deg,rgba(38,27,19,.82) 0%,rgba(38,27,19,0) 100%);
}
.hund-karte figcaption b{font-family:var(--serif);font-size:1.25rem;display:block}
.hund-karte figcaption span{font-size:.83rem;color:var(--beige)}
.wurf-zeitleiste{border-top:1px solid var(--line-strong);display:grid;grid-template-columns:repeat(4,1fr)}
.wurf-punkt{padding:26px 22px 0;border-left:1px solid var(--line-strong)}
.wurf-punkt:first-child{border-left:0;padding-left:0}
.wurf-punkt b{font-family:var(--serif);font-size:1.9rem;color:var(--moor);display:block;line-height:1.1}
.wurf-punkt span{font-size:.86rem}
.wurf-punkt.geplant b{color:var(--wiese-dunkel);font-style:italic}

/* --- Welt III: Pension (Beige-Unterton, Tierhotel-Logo) --- */
.welt-pension{background:var(--beige)}
.pension-grid{display:grid;grid-template-columns:.95fr 1.05fr;gap:44px;align-items:center}
.pension-logo{
  background:#fff;border-radius:50%/44%;padding:26px 34px;box-shadow:var(--shadow);
  max-width:330px;margin:0 0 26px;
}
.pension-logo img{width:100%;height:auto}
.pension-fakten{list-style:none;display:grid;gap:12px;margin:22px 0 26px}
.pension-fakten li{display:flex;gap:12px;align-items:flex-start}
.pension-fakten li::before{content:"";width:9px;height:9px;border-radius:50%;background:var(--braun);flex:none;margin-top:9px}
.pension-foto{position:relative}
.pension-foto img{width:100%;height:auto;border-radius:var(--r)}
.pension-preiskarte{
  position:absolute;right:-18px;bottom:-30px;background:var(--moor);color:var(--beige);
  border-radius:18px;padding:22px 26px;box-shadow:var(--shadow);max-width:290px;
}
.pension-preiskarte b{color:var(--cream);font-family:var(--serif);font-size:1.35rem;display:block;margin-bottom:4px}
.pension-preiskarte span{font-size:.84rem}
.neu-chip{display:inline-block;background:var(--wiese-dunkel);color:#fff;font-size:.7rem;font-weight:700;letter-spacing:.14em;text-transform:uppercase;border-radius:999px;padding:5px 12px;margin-left:8px;vertical-align:middle}

/* ================= Preise ================= */
.preise{padding:96px 0}
.preis-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:22px;margin-top:40px}
.preis-block{background:var(--cream);border-radius:var(--r);padding:30px 28px;border:1px solid var(--line)}
.preis-block h3{font-size:1.2rem;padding-bottom:12px;margin-bottom:6px;border-bottom:2px solid var(--beige)}
.preis-block dl{margin:0}
.preis-block .pz{display:flex;justify-content:space-between;gap:14px;padding:11px 0;border-bottom:1px dashed var(--line);font-size:.93rem}
.preis-block .pz:last-child{border-bottom:0}
.preis-block dd{font-weight:700;color:var(--moor);white-space:nowrap}
.gratis-band{margin-top:30px;text-align:center;font-family:var(--serif);font-size:1.25rem;color:var(--moor)}
.gratis-band em{color:var(--wiese-dunkel)}

/* ================= Stimmen (Beispiel-Ansicht) ================= */
.stimmen{background:var(--moor);padding:92px 0}
.stimmen h2{color:var(--cream)}
.stimmen h2 em{color:var(--beige)}
.stimmen>.wrap>p{color:var(--beige)}
.stimmen .ausgebucht-beweis p,.stimmen .ausgebucht-beweis{color:var(--beige)}
.stimmen .ausgebucht-beweis strong{color:var(--cream)}
.beispiel-label{
  display:inline-flex;align-items:center;gap:8px;background:var(--beige);
  border:1px dashed var(--braun);border-radius:999px;padding:8px 18px;
  font-size:.8rem;font-weight:700;color:var(--moor);margin-bottom:16px;
}
.stimmen-raster{display:grid;grid-template-columns:repeat(3,1fr);gap:22px;margin-top:36px}
.stimme{background:var(--paper);border-radius:var(--r);padding:30px 28px;border:1px solid var(--line)}
.sterne{color:#7D550C;font-size:1.05rem;letter-spacing:2px;margin-bottom:12px}
.stimme blockquote{font-family:var(--serif);font-size:1.06rem;color:var(--moor);line-height:1.5}
.stimme figcaption{margin-top:14px;font-size:.83rem;color:var(--braun-text);font-weight:700}
.ausgebucht-beweis{margin-top:34px;display:flex;align-items:center;gap:16px;flex-wrap:wrap}
.ausgebucht-stempel{
  font-family:var(--serif);font-style:italic;font-size:1.35rem;color:var(--rot);
  border:2px solid var(--rot);border-radius:10px;padding:8px 18px;transform:rotate(-3deg);
}

/* ================= Anfrage ================= */
.anfrage{padding:96px 0 220px;background:linear-gradient(180deg,var(--paper),#EFE5D2);position:relative}
.anfrage::after{content:"";position:absolute;left:0;right:0;bottom:0;height:200px;background:url(assets/aehrenband-2400.jpg) center bottom/cover no-repeat;pointer-events:none}
.anfrage-grid{display:grid;grid-template-columns:1fr 1.1fr;gap:52px;align-items:start}
.anfrage-info h2{font-size:clamp(1.9rem,3.6vw,2.8rem);margin:12px 0 16px}
.anfrage-info h2 em{font-style:italic;color:var(--wiese-dunkel)}
.kontakt-punkte{list-style:none;display:grid;gap:14px;margin-top:26px}
.kontakt-punkte li{display:flex;gap:12px;align-items:baseline;min-height:40px}
.kontakt-punkte b{min-width:86px;font-size:.8rem;letter-spacing:.1em;text-transform:uppercase;color:var(--braun-text)}
.kontakt-punkte a{font-weight:700;display:inline-block;padding:8px 0}
.booking-form{background:var(--cream);border-radius:var(--r);box-shadow:var(--shadow);padding:40px 38px}
.booking-form h3{font-size:1.4rem;margin-bottom:20px}
.feld{margin-bottom:18px}
.feld label{display:block;font-size:.8rem;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--braun-text);margin-bottom:7px}
.feld input,.feld select,.feld textarea{
  width:100%;font-family:var(--sans);font-size:1rem;color:var(--moor);
  background:var(--paper);border:0;border-bottom:2px solid var(--line-strong);
  border-radius:10px 10px 0 0;padding:13px 14px;outline:none;
}
.feld input:focus,.feld select:focus,.feld textarea:focus{border-bottom-color:var(--wiese-dunkel)}
.booking-form .btn{width:100%;margin-top:6px}
.form-hinweis{font-size:.78rem;color:var(--braun-text);margin-top:12px;text-align:center}
.booking-success{text-align:center;padding:30px 6px}
.booking-success .haken{width:64px;height:64px;border-radius:50%;background:var(--wiese-dunkel);color:#fff;font-size:1.8rem;display:flex;align-items:center;justify-content:center;margin:0 auto 18px}
.booking-success h3{margin-bottom:8px}

/* ================= Kontakt / Karte ================= */
.kontakt{padding:64px 0 96px}
.karte-rahmen{position:relative;border-radius:var(--r);overflow:hidden;box-shadow:var(--shadow)}
.karte-rahmen img{width:100%;height:auto}
.karte-karte{
  position:absolute;left:26px;bottom:26px;background:var(--cream);border-radius:16px;
  padding:20px 24px;box-shadow:var(--shadow);max-width:320px;
}
.karte-karte b{font-family:var(--serif);font-size:1.15rem;color:var(--moor);display:block;margin-bottom:4px}
.karte-karte span{font-size:.88rem}

/* ================= Footer ================= */
.site-foot{background:var(--moor);color:var(--beige);padding:64px 0 34px}
.foot-grid{display:grid;grid-template-columns:1.2fr 1fr 1fr 1fr;gap:36px;padding-bottom:38px;border-bottom:1px solid rgba(224,209,190,.2)}
.site-foot h4{font-family:var(--serif);color:var(--cream);font-size:1.05rem;margin-bottom:14px}
.site-foot ul{list-style:none;display:grid;gap:0}
.site-foot a{color:var(--beige);text-decoration:none;font-size:.9rem;display:inline-block;padding:11px 0}
.site-foot a:hover{color:#fff;text-decoration:underline}
.site-foot p{font-size:.9rem;color:rgba(224,209,190,.85)}
.foot-wordmark{font-family:var(--serif);font-size:1.5rem;color:var(--cream);margin-bottom:10px}
.foot-wordmark em{font-style:italic;color:var(--beige)}
.foot-logo{width:150px;height:auto;border-radius:12px;margin-top:14px;background:#fff;padding:8px}
.foot-unten{display:flex;flex-wrap:wrap;justify-content:space-between;gap:12px;padding-top:24px;font-size:.8rem;color:rgba(224,209,190,.65)}
.foot-unten a{color:rgba(224,209,190,.8);font-size:.8rem;display:inline-block;padding:13px 2px}

/* Rechtsseiten */
.recht{padding:70px 0 90px;max-width:760px}
.recht h1{font-size:2.2rem;margin-bottom:26px}
.recht h2{font-size:1.3rem;margin:30px 0 10px}
.recht p{margin-bottom:12px}

/* Swipe-Hinweis (nur mobil) */
.swipe-hinweis{display:none;align-items:center;gap:14px;font-size:.78rem;color:var(--braun-text);margin:16px 0 0;font-weight:700}
.swipe-hinweis::before,.swipe-hinweis::after{content:"";height:1px;background:var(--line-strong);flex:1}

/* ================= Responsive ================= */
@media (max-width:980px){
  .vertrauen-lage{grid-template-columns:1fr}
  .vertrauen-panel{margin-left:0;margin-top:-60px;margin-right:22px}
  .schule-buehne{grid-template-columns:1fr}
  .schule-buehne .foto img{border-radius:var(--r) var(--r) 0 0;min-height:300px}
  .schule-buehne .inhalt{border-radius:0 0 var(--r) var(--r);padding:36px 28px}
  .zucht-buehne{grid-template-columns:1fr}
  .pension-grid{grid-template-columns:1fr}
  .pension-preiskarte{right:10px;bottom:-24px}
  .anfrage-grid{grid-template-columns:1fr}
  .ampel-brett{grid-template-columns:1fr}
  .foot-grid{grid-template-columns:1fr 1fr}
}
@media (max-width:760px){
  body{padding-bottom:96px}
  .main-nav{
    position:fixed;inset:73px 0 auto 0;z-index:49;
    flex-direction:column;align-items:flex-start;gap:0;
    background:var(--cream);border-bottom:1px solid var(--line);
    padding:10px 22px 18px;
    opacity:0;pointer-events:none;transition:opacity .25s ease;
  }
  .nav-open .main-nav{opacity:1;pointer-events:auto}
  .main-nav a{padding:13px 0;font-size:1.05rem;width:100%;border-bottom:1px solid var(--line)}
  .main-nav a:last-of-type{border-bottom:0}
  .head-tel{display:none}
  .nav-toggle{display:block}
  .hero{min-height:88svh}
  .hero-bild img{object-position:center bottom}
  .hero-inhalt{padding-top:56px;padding-bottom:14px;min-height:calc(88svh - 73px)}
  .hero h1,.hero-sub{text-align:left;align-self:flex-start}
  .hero::after{background:linear-gradient(180deg,rgba(246,236,214,.62) 0%,rgba(246,236,214,.42) 38%,rgba(246,236,214,0) 60%)}
  .hero-sub{background:rgba(250,245,236,.82);backdrop-filter:blur(3px);-webkit-backdrop-filter:blur(3px);border-radius:18px;padding:14px 16px;margin-top:14px}
  .welten-kompass{gap:8px;margin-top:auto;padding-top:26px;flex-direction:column;align-items:stretch;width:100%}
  .welten-kompass a{padding:10px 18px;font-size:.9rem;justify-content:space-between;background:rgba(250,245,236,.82);min-height:44px}
  .welt,.preise,.stimmen{padding:64px 0}
  .anfrage{padding:64px 0 190px}
  .anfrage::after{height:150px}
  .vertrauen{padding:64px 0 70px}
  .vertrauen-panel{padding:30px 24px}
  .vertrauen-foto img{border-radius:var(--r) 70px var(--r) var(--r)}
  .leistungs-liste{grid-template-columns:1fr}
  .dwurf-band{border-radius:26px;padding:20px 22px}
  .dwurf-band .btn{margin-left:0}
  .wurf-zeitleiste{grid-template-columns:1fr 1fr;gap:0 0}
  .wurf-punkt{padding:22px 0 0 18px}
  .wurf-punkt:nth-child(3){border-left:0;padding-left:0}
  .zucht-ghost{left:14px;bottom:16px}
  .pension-logo{max-width:270px;margin-left:auto;margin-right:auto}
  .pension-preiskarte{position:static;margin:16px 0 0;max-width:none}
  .karte-karte{position:static;margin-top:0;border-radius:0 0 var(--r) var(--r);max-width:none;box-shadow:none}
  .karte-rahmen{box-shadow:var(--shadow)}
  .foot-grid{grid-template-columns:1fr}
  .booking-form{padding:30px 22px}
  .swipe-hinweis{display:flex}

  /* Mobile-Swiper für Kurs-, Hunde- und Stimmen-Karten */
  .kurs-raster,.hunde-raster,.stimmen-raster,.preis-grid{
    display:flex;overflow-x:auto;scroll-snap-type:x mandatory;
    gap:14px;margin-left:-22px;margin-right:-22px;
    padding:4px 22px 10px;scrollbar-width:none;
    scroll-padding-left:22px;scroll-padding-right:22px;
  }
  .kurs-raster::-webkit-scrollbar,.hunde-raster::-webkit-scrollbar,.stimmen-raster::-webkit-scrollbar,.preis-grid::-webkit-scrollbar{display:none}
  .kurs-karte,.hund-karte,.stimme,.preis-block{flex:0 0 80%;scroll-snap-align:start}
  .hund-karte{min-height:340px}
}

/* Reveals: eigenes Design-Timing */
.has-js :where(.reveal-item){opacity:0;transform:translateY(24px);transition:opacity .6s cubic-bezier(.165,.84,.44,1),transform .6s cubic-bezier(.165,.84,.44,1)}
.has-js :where(.reveal-item).is-in{opacity:1;transform:none}
.has-js :where(.stagger)>*{transition-delay:0s}
.has-js :where(.stagger).is-in>*{transition:none}

@media (prefers-reduced-motion: reduce){
  .hero h1 .zeile>span{animation:none!important;transform:none!important}
  .ampel-licht.frei{animation:none!important}
  .has-js :where(.reveal-item){opacity:1;transform:none}
}

.welt-marke.gruen{color:#3E5528}
.welt-pension .welt-marke{color:#5C4A3F}

.karte-rahmen{max-width:900px;margin:0 auto}

.hund-karte .pos-nala{object-position:50% 68%}
.hund-karte .pos-rose{object-position:50% 12%}