/* ==========================================================================
   Kindertagespflege "Kükennest" – Stylesheet v6 (eigenständige Schlüpf-Szene)
   ========================================================================== */

:root{
  --cream:        #FBF5E9;
  --cream-deep:   #F1E7D3;
  --teal:         #1F4A4C;
  --teal-deep:    #12302F;
  --teal-mid:     #2E6669;
  --rust:         #A9713C;
  --rust-deep:    #8A5A2C;
  --gold:         #E7A93B;
  --gold-deep:    #C98D24;
  --sage:         #7C8A5E;
  --ink:          #2B2B27;
  --white:        #FFFFFF;
  --shadow-soft:  0 18px 40px -20px rgba(31,74,76,0.35);
  --shadow-lift:  0 24px 48px -18px rgba(31,74,76,0.45);
  --radius-organic: 26px 26px 26px 4px;
}

*, *::before, *::after{ box-sizing:border-box; }
html{ scroll-behavior:smooth; }
body{ margin:0; background:var(--cream); color:var(--ink); font-family:'Karla','Segoe UI',sans-serif; font-size:1.05rem; line-height:1.65; -webkit-font-smoothing:antialiased; overflow-x:hidden; }
img{ max-width:100%; display:block; }
h1,h2,h3,h4{ font-family:'Fraunces', Georgia, serif; color:var(--teal); line-height:1.15; margin:0 0 0.6em 0; font-weight:600; }
h1{ font-size:clamp(2.2rem, 5.2vw, 3.6rem); letter-spacing:-0.01em; }
h2{ font-size:clamp(1.7rem, 3.4vw, 2.5rem); }
h3{ font-size:1.35rem; }
p{ margin:0 0 1em 0; max-width:62ch; }
a{ color:var(--rust-deep); }
.container{ width:100%; max-width:1120px; margin:0 auto; padding:0 1.5rem; position:relative; z-index:2; }
.section{ padding:6rem 0; position:relative; overflow:hidden; }
.section-tight{ padding:3rem 0; }
.bg-cream{ background:var(--cream); }
.bg-cream-deep{ background:var(--cream-deep); }
.bg-teal{ background:var(--teal); color:#EFE7D6; }
.bg-teal h2, .bg-teal h3{ color:#F7EFDD; }
.bg-teal p{ color:#D9E4E1; }
.eyebrow-italic{ font-family:'Fraunces', serif; font-style:italic; color:var(--rust-deep); font-size:1.15rem; display:block; margin-bottom:0.35rem; position:relative; }
.center{ text-align:center; margin-left:auto; margin-right:auto; }

/* -------------------- Sichtbarkeits-/Fokus-Grundlagen -------------------- */
a:focus-visible, button:focus-visible, .btn:focus-visible, .highlight-card:focus-visible, .nav-links a:focus-visible{
  outline:3px solid var(--gold-deep); outline-offset:3px; border-radius:6px;
}
:focus:not(:focus-visible){ outline:none; }

.reveal{ opacity:0; transform:translateY(22px); transition:opacity .7s ease, transform .7s ease; }
.reveal.in-view{ opacity:1; transform:none; }
.highlight-grid.in-view .highlight-card, .concept-grid.in-view .concept-card, .facts-grid.in-view .fact{ animation:fadeUp .6s ease both; }
.highlight-grid .highlight-card:nth-child(1){animation-delay:.05s}
.highlight-grid .highlight-card:nth-child(2){animation-delay:.12s}
.highlight-grid .highlight-card:nth-child(3){animation-delay:.19s}
.highlight-grid .highlight-card:nth-child(4){animation-delay:.26s}
.highlight-grid .highlight-card:nth-child(5){animation-delay:.33s}
.highlight-grid .highlight-card:nth-child(6){animation-delay:.40s}
@keyframes fadeUp{ from{ opacity:0; transform:translateY(18px);} to{ opacity:1; transform:none;} }

.decor{ position:absolute; z-index:1; pointer-events:none; }
.feather{ width:30px; height:30px; opacity:0.5; animation:floatDrift 8s ease-in-out infinite; }
@keyframes floatDrift{ 0%{ transform:translate(0,0) rotate(0deg);} 50%{ transform:translate(10px,-20px) rotate(14deg);} 100%{ transform:translate(0,0) rotate(0deg);} }
.blob{ position:absolute; border-radius:50%; filter:blur(50px); z-index:0; animation:driftBlob 16s ease-in-out infinite alternate; }
@keyframes driftBlob{ 0%{ transform:translate(0,0) scale(1);} 100%{ transform:translate(26px,-22px) scale(1.08);} }

.btn{ display:inline-flex; align-items:center; gap:0.5rem; padding:0.85rem 1.7rem; border-radius:999px; font-family:'Karla',sans-serif; font-weight:700; text-decoration:none; font-size:1rem; transition:transform .18s ease, background .18s ease, box-shadow .18s ease; border:2px solid transparent; cursor:pointer; }
.btn:hover{ transform:translateY(-3px); box-shadow:var(--shadow-soft); }
.btn-gold{ background:var(--gold); color:var(--teal-deep); }
.btn-gold:hover{ background:var(--gold-deep); }
.btn-outline-light{ border-color:#EFE7D6; color:#EFE7D6; }
.btn-outline-light:hover{ background:rgba(239,231,214,0.12); }
.btn-outline-dark{ border-color:var(--teal); color:var(--teal); }
.btn-outline-dark:hover{ background:var(--teal); color:#fff; }

/* -------------------- Brand mark (Inline-SVG statt Base64-PNG) -------------------- */
.brand-mark{ width:44px; height:44px; flex:none; display:block; filter:drop-shadow(0 6px 12px rgba(31,74,76,0.25)); transition:transform .3s ease; }
.brand:hover .brand-mark{ transform:rotate(-6deg) scale(1.08); }

.hero-figure{ display:flex; justify-content:center; align-items:center; position:relative; }

.site-header{ position:sticky; top:0; z-index:50; background:rgba(251,245,233,0.92); backdrop-filter:blur(6px); border-bottom:1px solid rgba(31,74,76,0.1); transition:padding .25s ease, box-shadow .25s ease; }
.site-header.scrolled{ box-shadow:0 6px 20px -12px rgba(31,74,76,0.35); }
.nav-wrap{ display:flex; align-items:center; justify-content:space-between; padding:0.7rem 0; gap:1rem; transition:padding .25s ease; }
.site-header.scrolled .nav-wrap{ padding:0.4rem 0; }
.brand{ display:flex; align-items:center; gap:0.7rem; text-decoration:none; }
.brand-word{ font-family:'Fraunces', serif; font-weight:600; color:var(--teal); font-size:1.25rem; line-height:1.1; }
.brand-word small{ display:block; font-family:'Karla', sans-serif; font-weight:400; font-size:0.72rem; letter-spacing:0.02em; color:var(--rust-deep); }
.nav-links{ display:flex; align-items:center; gap:1.4rem; list-style:none; margin:0; padding:0; }
.nav-links a{ color:var(--teal); text-decoration:none; font-weight:600; font-size:0.94rem; position:relative; padding-bottom:3px; white-space:nowrap; }
.nav-links a.active{ color:var(--rust-deep); }
.nav-links a::after{ content:""; position:absolute; left:0; bottom:0; width:0; height:2px; background:var(--gold-deep); transition:width .2s ease; }
.nav-links a:hover::after, .nav-links a.active::after{ width:100%; }
.nav-toggle{ display:none; }
@media(max-width:980px){
  .nav-links{ position:absolute; top:100%; left:0; right:0; background:var(--cream); flex-direction:column; align-items:flex-start; padding:1.2rem 1.5rem 1.6rem; gap:1rem; border-bottom:1px solid rgba(31,74,76,0.12); display:none; }
  .nav-links.open{ display:flex; }
  .nav-toggle{ display:inline-flex; background:none; border:none; font-size:1.6rem; color:var(--teal); cursor:pointer; }
}

.hero{ background:linear-gradient(160deg, var(--teal-deep) 0%, var(--teal) 62%, var(--teal-mid) 100%); color:#EFE7D6; padding:4.5rem 0 8.5rem; position:relative; }
.hero-grid{ display:grid; grid-template-columns:1.15fr 0.85fr; gap:3rem; align-items:center; }
.hero h1{ color:#FBF5E9; }
.hero .lede{ color:#D9E4E1; font-size:1.15rem; max-width:46ch; }
.hero-actions{ display:flex; gap:1rem; flex-wrap:wrap; margin-top:1.8rem; }
.hero-badge{ display:inline-flex; align-items:center; gap:0.5rem; background:rgba(251,245,233,0.12); border:1px solid rgba(251,245,233,0.3); color:#F7EFDD; padding:0.4rem 1rem; border-radius:999px; font-size:0.85rem; margin-bottom:1.4rem; animation:pulseBadge 3s ease-in-out infinite; }
@keyframes pulseBadge{ 0%,100%{ box-shadow:0 0 0 0 rgba(231,169,59,0.35);} 50%{ box-shadow:0 0 0 8px rgba(231,169,59,0);} }
@media(max-width:880px){ .hero-grid{ grid-template-columns:1fr; text-align:center; } .hero .lede{ margin-left:auto; margin-right:auto; } .hero-actions{ justify-content:center; } }

/* Organischer Wellen-Übergang unter Hero/Page-Hero statt harter Kante */
.hero-divider{ position:absolute; left:0; right:0; bottom:-1px; width:100%; height:auto; line-height:0; z-index:1; }
.hero-divider path{ fill:var(--cream); }

.page-hero{ background:linear-gradient(160deg, var(--teal-deep) 0%, var(--teal) 100%); color:#F7EFDD; padding:3.8rem 0 6rem; position:relative; overflow:hidden; }
.page-hero h1{ color:#FBF5E9; margin-bottom:0.4rem; }
.page-hero p{ color:#D9E4E1; }

.highlight-grid{ display:grid; grid-template-columns:repeat(3, 1fr); gap:1.8rem; margin-top:2.5rem; perspective:1000px; }
.highlight-card{ background:var(--white); border-radius:var(--radius-organic); padding:2rem 1.6rem; box-shadow:var(--shadow-soft); text-decoration:none; display:block; transition:transform .3s ease, box-shadow .3s ease; }
.highlight-card:hover{ transform:translateY(-8px) rotateX(4deg) rotateY(-3deg); box-shadow:var(--shadow-lift); }
.highlight-card .hc-icon-wrap{ width:56px; height:56px; border-radius:50%; background:var(--cream-deep); display:flex; align-items:center; justify-content:center; margin-bottom:1.1rem; transition:transform .3s ease, background .3s ease; }
.highlight-card:hover .hc-icon-wrap{ transform:scale(1.12) rotate(-6deg); background:var(--gold); }
.highlight-card .hc-icon{ width:28px; height:28px; }
.highlight-card h3{ color:var(--teal); font-size:1.15rem; margin-bottom:0.4rem; }
.highlight-card p{ font-size:0.95rem; color:#4A4A42; margin-bottom:0.6rem; }
.highlight-card .hc-more{ color:var(--rust-deep); font-weight:700; font-size:0.9rem; }
@media(max-width:880px){ .highlight-grid{ grid-template-columns:1fr; } }

.intro-grid{ display:grid; grid-template-columns:0.95fr 1.05fr; gap:3.5rem; align-items:center; }
.intro-quote{ font-family:'Fraunces', serif; font-style:italic; font-size:1.5rem; color:var(--teal); border-left:4px solid var(--gold); padding-left:1.2rem; margin:1.4rem 0; }
@media(max-width:880px){ .intro-grid{ grid-template-columns:1fr; } }

.concept-grid{ display:grid; grid-template-columns:repeat(3, 1fr); gap:2rem; margin-top:2.5rem; }
.concept-card{ background:var(--white); border-radius:var(--radius-organic); padding:2rem 1.7rem; box-shadow:var(--shadow-soft); transition:transform .3s ease, box-shadow .3s ease; }
.concept-card:hover{ transform:translateY(-8px); box-shadow:var(--shadow-lift); }
.concept-card .hc-icon-wrap{ width:60px; height:60px; border-radius:50%; background:var(--cream-deep); display:flex; align-items:center; justify-content:center; margin-bottom:1.1rem; transition:transform .3s ease, background .3s ease; }
.concept-card:hover .hc-icon-wrap{ transform:scale(1.12) rotate(-6deg); background:var(--gold); }
.concept-icon{ width:30px; height:30px; }
.concept-card h3{ margin-bottom:0.5rem; }
.concept-card p{ font-size:0.98rem; color:#4A4A42; }
@media(max-width:880px){ .concept-grid{ grid-template-columns:1fr; } }

.timeline{ display:grid; grid-template-columns:repeat(3,1fr); gap:2rem; margin-top:3rem; position:relative; }
.timeline::before{ content:""; position:absolute; top:24px; left:8%; right:8%; height:2px; background:repeating-linear-gradient(90deg, var(--gold) 0 10px, transparent 10px 20px); }
.timeline-step{ position:relative; padding-top:3.4rem; }
.timeline-num{ position:absolute; top:0; left:0; width:50px; height:50px; border-radius:50%; background:var(--teal); color:#F7EFDD; display:flex; align-items:center; justify-content:center; font-family:'Fraunces', serif; font-weight:600; font-size:1.2rem; box-shadow:var(--shadow-soft); transition:transform .3s ease; }
.timeline-step:hover .timeline-num{ transform:scale(1.12); }
.timeline-step h3{ font-size:1.15rem; }
.timeline-step p{ font-size:0.95rem; color:#4A4A42; }
@media(max-width:880px){ .timeline{ grid-template-columns:1fr; gap:2.6rem; } .timeline::before{ display:none; } }

/* -------------------- Konzept-Illustration: ruhiges "Wachstums-Atmen" -------------------- */
.concept-visual{ display:flex; justify-content:center; }
.concept-visual img{ display:block; width:100%; max-width:220px; transform-origin:50% 90%; animation:growBreathe 5.5s ease-in-out infinite; }
@keyframes growBreathe{ 0%,100%{ transform:scale(1) rotate(0deg);} 50%{ transform:scale(1.035) rotate(-1.1deg);} }
@media(max-width:880px){ .concept-visual img{ max-width:170px; margin:0 auto 1rem; } }

/* ==========================================================================
   Ei-Schlüpf-Szene — eigenständige Illustration + Animation (v2)
   Schale bricht in zwei Hälften auseinander, Küken wächst mit
   Squash-and-Stretch heraus, Augen öffnen sich, Funken-Explosion,
   danach ruhiges Kopf-/Körper-Wackeln als Idle-Zustand.
   ========================================================================== */
.hatch-scene{ position:relative; width:min(360px, 82vw); margin:0 auto; }
.hatch-scene svg{ width:100%; height:auto; overflow:visible; display:block; }
.hatch-scene--compact{ width:min(190px, 58vw); }

/* -------------------- Verdichtete Sektion (weniger Weißraum) -------------------- */
.section-tight-top{ padding-top:2.6rem; }

.hatch-glow{ transform-origin:150px 150px; filter:blur(30px); animation:driftBlob 8s ease-in-out infinite alternate; }

.hatch-grass{ transform-origin:0 26px; animation:grassSway 4.2s ease-in-out infinite; }
.hatch-grass-right{ animation-delay:0.6s; }
@keyframes grassSway{ 0%,100%{ transform:rotate(-3deg);} 50%{ transform:rotate(3deg);} }

.egg-hatch-wrap{ margin:0 0 1rem; }

.hatch-chick{ opacity:0; }
.hatch-crack{ opacity:0; }
.hatch-eye-l, .hatch-eye-r{ transform:scaleY(0.15); }

/* Auto-Play: Hero (immer above the fold sichtbar, startet automatisch) */
.hero-figure .hatch-egg{ animation:eggWobble 0.9s ease-in-out both; }
.hero-figure .hatch-crack{ animation:crackGrow 1.3s ease 0.5s both; }
.hero-figure .hatch-cap-left{ animation:capLeftOpen 1.15s cubic-bezier(.34,1.56,.64,1) 1.1s both; }
.hero-figure .hatch-cap-right{ animation:capRightOpen 1.15s cubic-bezier(.34,1.56,.64,1) 1.1s both; }
.hero-figure .hatch-chick{ animation:chickEmerge 1.05s cubic-bezier(.34,1.56,.64,1) 1.3s both, chickShakeOff .6s ease 2.4s both, chickIdleBob2 4.2s ease-in-out 3.1s infinite; }
.hero-figure .hatch-eye-l, .hero-figure .hatch-eye-r{ animation:eyeOpenOnce .5s ease 1.9s both, blinkIdle 4.6s ease-in-out 3.3s infinite; }
.hero-figure .hatch-wing-l{ animation:wingFlapOnceL 1s ease 1.35s both, wingIdleL 2.8s ease-in-out 3.2s infinite; }
.hero-figure .hatch-wing-r{ animation:wingFlapOnceR 1s ease 1.35s both, wingIdleR 2.8s ease-in-out 3.2s infinite; }
.hero-figure .hatch-spark{ animation:sparkPop 1s ease-out 1.4s both; }
.hero-figure .hatch-spark-2{ animation-delay:1.5s; }
.hero-figure .hatch-spark-3{ animation-delay:1.6s; }
.hero-figure .hatch-spark-4{ animation-delay:1.7s; }
.hero-figure .hatch-scene{ animation:heroFloat 6s ease-in-out 3.4s infinite; }

/* Getriggert: Eingewöhnung-Seite (erst wenn beim Scrollen sichtbar) */
.egg-hatch-wrap.in-view .hatch-egg{ animation:eggWobble 0.9s ease-in-out both; }
.egg-hatch-wrap.in-view .hatch-crack{ animation:crackGrow 1.3s ease 0.5s both; }
.egg-hatch-wrap.in-view .hatch-cap-left{ animation:capLeftOpen 1.15s cubic-bezier(.34,1.56,.64,1) 1.1s both; }
.egg-hatch-wrap.in-view .hatch-cap-right{ animation:capRightOpen 1.15s cubic-bezier(.34,1.56,.64,1) 1.1s both; }
.egg-hatch-wrap.in-view .hatch-chick{ animation:chickEmerge 1.05s cubic-bezier(.34,1.56,.64,1) 1.3s both, chickShakeOff .6s ease 2.4s both, chickIdleBob2 4.2s ease-in-out 3.1s infinite; }
.egg-hatch-wrap.in-view .hatch-eye-l, .egg-hatch-wrap.in-view .hatch-eye-r{ animation:eyeOpenOnce .5s ease 1.9s both, blinkIdle 4.6s ease-in-out 3.3s infinite; }
.egg-hatch-wrap.in-view .hatch-wing-l{ animation:wingFlapOnceL 1s ease 1.35s both, wingIdleL 2.8s ease-in-out 3.2s infinite; }
.egg-hatch-wrap.in-view .hatch-wing-r{ animation:wingFlapOnceR 1s ease 1.35s both, wingIdleR 2.8s ease-in-out 3.2s infinite; }
.egg-hatch-wrap.in-view .hatch-spark{ animation:sparkPop 1s ease-out 1.4s both; }
.egg-hatch-wrap.in-view .hatch-spark-2{ animation-delay:1.5s; }
.egg-hatch-wrap.in-view .hatch-spark-3{ animation-delay:1.6s; }
.egg-hatch-wrap.in-view .hatch-spark-4{ animation-delay:1.7s; }
.egg-hatch-wrap.in-view .hatch-scene{ animation:heroFloat 6s ease-in-out 3.4s infinite; }

@keyframes eggWobble{ 0%,100%{ transform:rotate(0deg);} 20%{ transform:rotate(-4deg);} 40%{ transform:rotate(3deg);} 60%{ transform:rotate(-3deg);} 80%{ transform:rotate(2deg);} }
@keyframes crackGrow{ 0%,20%{ opacity:0;} 35%,60%{ opacity:1;} 75%,100%{ opacity:0;} }
@keyframes capLeftOpen{
  0%{ transform:translate(0,0) rotate(0deg); opacity:1; }
  70%{ transform:translate(-38px,-46px) rotate(-55deg); opacity:1; }
  100%{ transform:translate(-46px,-30px) rotate(-70deg); opacity:0; }
}
@keyframes capRightOpen{
  0%{ transform:translate(0,0) rotate(0deg); opacity:1; }
  70%{ transform:translate(38px,-46px) rotate(55deg); opacity:1; }
  100%{ transform:translate(46px,-30px) rotate(70deg); opacity:0; }
}
@keyframes chickEmerge{
  0%,30%{ opacity:0; transform:translateY(24px) scale(0.4); }
  55%{ opacity:1; transform:translateY(-8px) scale(1.12); }
  70%{ transform:translateY(3px) scale(0.94); }
  85%{ transform:translateY(-2px) scale(1.04); }
  100%{ opacity:1; transform:translateY(0) scale(1); }
}
@keyframes chickShakeOff{ 0%,100%{ transform:rotate(0deg);} 25%{ transform:rotate(-6deg);} 50%{ transform:rotate(5deg);} 75%{ transform:rotate(-3deg);} }
@keyframes chickIdleBob2{ 0%,100%{ transform:translateY(0) rotate(0deg);} 50%{ transform:translateY(-5px) rotate(-2deg);} }
@keyframes eyeOpenOnce{ 0%{ transform:scaleY(0.15);} 80%{ transform:scaleY(1.2);} 100%{ transform:scaleY(1);} }
@keyframes blinkIdle{ 0%,92%,100%{ transform:scaleY(1);} 96%{ transform:scaleY(0.15);} }
@keyframes wingFlapOnceL{ 0%,35%{ transform:rotate(0deg);} 52%{ transform:rotate(-26deg);} 64%{ transform:rotate(6deg);} 78%{ transform:rotate(-12deg);} 100%{ transform:rotate(0deg);} }
@keyframes wingFlapOnceR{ 0%,35%{ transform:rotate(0deg);} 52%{ transform:rotate(26deg);} 64%{ transform:rotate(-6deg);} 78%{ transform:rotate(12deg);} 100%{ transform:rotate(0deg);} }
@keyframes wingIdleL{ 0%,100%{ transform:rotate(0deg);} 50%{ transform:rotate(-9deg);} }
@keyframes wingIdleR{ 0%,100%{ transform:rotate(0deg);} 50%{ transform:rotate(9deg);} }
@keyframes sparkPop{
  0%,10%{ opacity:0; transform:scale(0.3) rotate(0deg); }
  50%{ opacity:1; transform:scale(1.3) rotate(20deg); }
  80%{ opacity:.6; transform:scale(1) rotate(30deg); }
  100%{ opacity:0; transform:scale(0.8) rotate(40deg); }
}
@keyframes heroFloat{ 0%,100%{ transform:translateY(0);} 50%{ transform:translateY(-10px);} }

.day-list{ list-style:none; margin:2.2rem 0 0; padding:0; }
.day-list li{ display:grid; grid-template-columns:110px 1fr; gap:1.4rem; padding:1rem 0; border-bottom:1px dashed rgba(31,74,76,0.22); opacity:0; transform:translateX(-14px); transition:opacity .5s ease, transform .5s ease; }
.day-list.in-view li{ opacity:1; transform:none; }
.day-list li:nth-child(1){transition-delay:.03s} .day-list li:nth-child(2){transition-delay:.09s} .day-list li:nth-child(3){transition-delay:.15s} .day-list li:nth-child(4){transition-delay:.21s} .day-list li:nth-child(5){transition-delay:.27s} .day-list li:nth-child(6){transition-delay:.33s} .day-list li:nth-child(7){transition-delay:.39s} .day-list li:nth-child(8){transition-delay:.45s}
.day-list li:first-child{ border-top:1px dashed rgba(31,74,76,0.22); }
.day-time{ font-family:'Fraunces', serif; font-weight:600; color:var(--rust-deep); font-size:1.05rem; }
.day-list p{ margin:0; }
@media(max-width:600px){ .day-list li{ grid-template-columns:1fr; gap:0.2rem; } }

.facts-grid{ display:grid; grid-template-columns:repeat(2,1fr); gap:1.6rem 2.4rem; margin-top:2.2rem; }
.fact{ background:var(--cream-deep); border-radius:18px; padding:1.4rem 1.6rem; transition:transform .25s ease, box-shadow .25s ease; }
.fact:hover{ transform:translateY(-5px); box-shadow:var(--shadow-soft); }
.fact h3{ font-size:1.05rem; margin-bottom:0.35rem; }
.fact p{ margin:0; font-size:0.95rem; color:#4A4A42; }
@media(max-width:700px){ .facts-grid{ grid-template-columns:1fr; } }

.contact-grid{ display:grid; grid-template-columns:1fr 1fr; gap:3rem; align-items:start; }
.contact-card{ background:var(--white); border-radius:26px 4px 26px 4px; padding:2.2rem; box-shadow:var(--shadow-soft); }
.contact-card h3{ margin-bottom:1rem; }
.contact-line{ display:flex; gap:0.7rem; margin-bottom:0.9rem; align-items:flex-start; }
.contact-line svg{ flex:none; margin-top:3px; }
@media(max-width:880px){ .contact-grid{ grid-template-columns:1fr; } }

/* -------------------- Kontaktformular -------------------- */
.contact-form{ display:grid; gap:1.1rem; margin-top:1.6rem; }
.form-row{ display:grid; gap:0.4rem; }
.form-row label{ font-weight:700; color:var(--teal); font-size:0.92rem; }
.form-row input, .form-row textarea{ font-family:inherit; font-size:1rem; padding:0.75rem 1rem; border:1.5px solid rgba(31,74,76,0.22); border-radius:12px; background:var(--white); color:var(--ink); width:100%; }
.form-row input:focus, .form-row textarea:focus{ outline:none; border-color:var(--gold-deep); box-shadow:0 0 0 3px rgba(231,169,59,0.28); }
.form-row textarea{ resize:vertical; min-height:120px; }
.form-grid-2{ display:grid; grid-template-columns:1fr 1fr; gap:1rem; }
@media(max-width:600px){ .form-grid-2{ grid-template-columns:1fr; } }
.form-hint{ font-size:0.82rem; color:#6B6B60; margin:0; }
.form-consent{ display:flex; gap:0.6rem; align-items:flex-start; font-size:0.88rem; color:#4A4A42; }
.form-consent input{ margin-top:3px; width:auto; }
.form-consent a{ color:var(--rust-deep); }
.hp-field{ position:absolute; left:-9999px; width:1px; height:1px; overflow:hidden; }
.form-notice{ padding:0.9rem 1.2rem; border-radius:12px; font-size:0.95rem; margin:0 0 1.2rem; }
.form-notice.success{ background:#E4EFE1; color:#2E4A28; border:1px solid #B9D6AF; }
.form-notice.error{ background:#F6E4DC; color:#7A3420; border:1px solid #E4B7A4; }

.site-footer{ background:var(--teal-deep); color:#CFE0DD; padding:3rem 0 2rem; font-size:0.92rem; }
.footer-grid{ display:grid; grid-template-columns:1.3fr 1fr 1fr; gap:2rem; margin-bottom:2rem; }
.footer-grid h4{ color:#F7EFDD; font-family:'Fraunces', serif; font-size:1.05rem; margin-bottom:0.8rem; }
.footer-grid a{ color:#CFE0DD; text-decoration:none; }
.footer-grid a:hover{ text-decoration:underline; }
.footer-links{ list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:0.5rem; }
.footer-bottom{ border-top:1px solid rgba(207,224,221,0.18); padding-top:1.2rem; display:flex; justify-content:space-between; flex-wrap:wrap; gap:0.6rem; color:#9FB8B4; font-size:0.85rem; }
@media(max-width:700px){ .footer-grid{ grid-template-columns:1fr; } }

.legal h2{ margin-top:2.2rem; }
.legal p, .legal li{ color:#3A3A33; }
.legal{ padding:3rem 0 5rem; }

.simple-nav-inline{ display:flex; position:static; background:none; padding:0; flex-direction:row; }

/* -------------------- Bewegungspräferenz respektieren -------------------- */
@media (prefers-reduced-motion: reduce){
  *, *::before, *::after{
    animation-duration:0.001ms !important;
    animation-iteration-count:1 !important;
    transition-duration:0.001ms !important;
    scroll-behavior:auto !important;
  }
  .hatch-scene, .hatch-egg, .hatch-glow, .hatch-grass{ animation:none !important; }
  .hatch-cap-left, .hatch-cap-right{ animation:none !important; opacity:0 !important; }
  .hatch-chick{ animation:none !important; opacity:1 !important; transform:none !important; }
  .hatch-eye-l, .hatch-eye-r{ animation:none !important; transform:scaleY(1) !important; }
  .hatch-wing-l, .hatch-wing-r{ animation:none !important; }
  .hatch-crack{ animation:none !important; opacity:0 !important; }
  .hatch-spark{ animation:none !important; opacity:0 !important; }
}