/* Vault Footprints – Entwurf 1. Gesamtes Design hier; Inhalte (auch Blog) liefern nur HTML-Struktur. */
:root{
  /* Farben Entwurf 1.2 (Olivers Vorgabe 10.11.: kein Beige/Creme; Weiß, Hellgrau, helles Petrol, gedämpftes Grün; dunkel = tiefes Petrol).
     Alle Farben nur hier. Kontraste geprüft (WCAG AA), siehe tools/kontrast.py */
  --c-weiss:#FFFFFF;
  --c-hellgrau:#F1F3F4;
  --c-petrol-hell:#E4EFF1;
  --c-gruen-hell:#E7EEE8;
  --c-petrol-tief:#123F4D;
  --c-petrol-tief-2:#0E3340;
  --c-petrol:#1F5A68;        /* Links, Akzente auf hell */
  --c-gruen:#4E6E5A;         /* gedämpftes Grün: Buttons, Kicker */
  --c-gruen-dunkel:#3D5A48;  /* Hover */
  --c-gruen-auf-dunkel:#A9CDBE; /* Kicker/Links auf tiefem Petrol */
  --c-terra:#B5683A;         /* nur sehr sparsam: Kicker-Linie */
  --c-text:#1F2A2E;
  --c-text-2:#3E4C52;
  --c-text-3:#5A676C;        /* Credits, Sekundär */
  --c-auf-dunkel:#FFFFFF;
  --c-auf-dunkel-2:#D3E2E6;
  --c-linie:#D5DCDF;
  --c-linie-stark:#A9B5BA;
  --c-platzhalter-1:#E6EAEC; --c-platzhalter-2:#DADFE2;
  --c-offen-bg:#FFF4B8; --c-offen-rand:#B08A00; --c-offen-text:#3A3000;
  --c-rechte:#B3261E;        /* Etikett „Rechte in Klärung“ */
  /* alte Namen auf neue Farben gemappt */
  --kalk:var(--c-weiss); --sand:var(--c-petrol-hell); --tinte:var(--c-text); --tinte-2:var(--c-text-2);
  --terra:var(--c-gruen); --terra-text:var(--c-gruen); --aegaeis:var(--c-petrol); --beton:var(--c-text-3); --olive:var(--c-gruen);
  --nacht:var(--c-petrol-tief);
  --vf-ink:var(--c-text); --vf-kalk:var(--c-hellgrau); --vf-sand:var(--c-petrol-hell); --vf-aeg:var(--c-petrol); --vf-terra:var(--c-gruen);
  --vf-rule:var(--c-linie); --vf-rule-strong:var(--c-linie-stark);
  --f-label:"Oswald","Arial Narrow",sans-serif; --f-head:"Playfair Display",Georgia,serif; --f-text:"Source Serif Pro",Georgia,serif;
  --max:1180px; --text:68ch; --r:0px;
  --c-marker:#F2C14E; --c-marker-2:#E9B438; --c-deaktiviert:#6B777C;
}
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--kalk);color:var(--tinte);font:1.125rem/1.55 var(--f-text);}
img{max-width:100%;height:auto;display:block}
a{color:var(--aegaeis);text-underline-offset:.18em}
a:hover{color:var(--terra-text)}
:focus-visible{outline:3px solid var(--terra);outline-offset:3px}
h1,h2,h3{font-family:var(--f-head);line-height:1.15;margin:0 0 .5em;font-weight:700}
h1{font-size:clamp(2.2rem,5vw,4rem)} h2{font-size:clamp(1.6rem,3vw,2.4rem)} h3{font-size:1.35rem}
p{margin:0 0 1em}
.label{font-family:var(--f-label);text-transform:uppercase;letter-spacing:.14em;font-size:.8rem;font-weight:500;color:var(--terra-text)}
.wrap{max-width:var(--max);margin:0 auto;padding:0 1.25rem}
.skip{position:absolute;left:-999px;top:0;background:var(--tinte);color:#fff;padding:.6rem 1rem;z-index:99}
.skip:focus{left:1rem}

/* Entwurfsband */
.entwurf-band{background:repeating-linear-gradient(-45deg,var(--c-marker) 0 14px,var(--c-marker-2) 14px 28px);color:var(--c-text);font:600 .78rem/1.3 var(--f-label);letter-spacing:.1em;text-transform:uppercase;text-align:center;padding:.45rem 1rem}

/* Kopf */
.kopf{background:var(--nacht);color:var(--kalk);position:sticky;top:0;z-index:50;border-bottom:3px solid var(--terra)}
.kopf .wrap{display:flex;align-items:center;gap:1.5rem;min-height:72px}
.marke{display:flex;align-items:center;gap:.6rem;color:var(--kalk);text-decoration:none}
.marke img{height:52px;width:auto}
.marke span{font:600 1.25rem/1 var(--f-label);letter-spacing:.06em;text-transform:uppercase}
.nav{margin-left:auto}
.nav ul{list-style:none;margin:0;padding:0;display:flex;gap:1.3rem;align-items:center}
.nav a{color:var(--kalk);text-decoration:none;font:500 .95rem/1 var(--f-label);letter-spacing:.1em;text-transform:uppercase;padding:.4rem 0;border-bottom:2px solid transparent}
.nav a:hover,.nav a[aria-current="page"]{border-color:var(--terra);color:#fff}
.nav a.btn{border:0}
.nav-toggle{display:none;margin-left:auto;background:none;border:2px solid var(--kalk);color:var(--kalk);font:600 .85rem var(--f-label);letter-spacing:.1em;text-transform:uppercase;padding:.45rem .8rem;border-radius:var(--r);cursor:pointer}

/* Buttons */
.btn{display:inline-block;background:var(--terra);color:var(--c-text) !important;font:600 .9rem/1 var(--f-label);letter-spacing:.12em;text-transform:uppercase;text-decoration:none;padding:.85rem 1.2rem;border-radius:var(--r);border:0;cursor:pointer}
.btn:hover{background:var(--c-gruen-dunkel)}
.btn.ghost{background:transparent;color:var(--kalk) !important;box-shadow:inset 0 0 0 2px var(--kalk)}
.btn.dunkel{background:var(--aegaeis);color:#fff !important}
.btn[aria-disabled="true"],.btn:disabled{background:var(--beton);color:#fff !important;cursor:not-allowed}

/* Hero */
.hero{position:relative;color:#fff;min-height:min(86vh,760px);display:grid;align-items:end;background:var(--nacht);overflow:hidden}
.hero figure.bild{position:absolute;inset:0;margin:0;background:none}
.hero figure.bild img{width:100%;height:100%;aspect-ratio:auto;object-fit:cover;filter:saturate(.85) contrast(1.05)}
.hero::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(14,51,64,.15) 0%,rgba(14,51,64,.25) 45%,rgba(14,51,64,.88) 100%)}
.hero .wrap{position:relative;z-index:2;padding-bottom:3.5rem;padding-top:6rem;width:100%}
.hero .logo-gross{width:min(300px,60vw);margin-bottom:1.2rem;filter:drop-shadow(0 2px 10px rgba(0,0,0,.4))}
.hero h1{font-size:clamp(2.4rem,6.5vw,5.4rem);max-width:14ch;text-shadow:0 2px 18px rgba(0,0,0,.45)}
.hero .unter{font:500 clamp(.95rem,1.6vw,1.15rem)/1.4 var(--f-label);letter-spacing:.2em;text-transform:uppercase;color:var(--sand)}
.hero .aktionen{display:flex;gap:.8rem;flex-wrap:wrap;margin-top:1.6rem}
.hero .credit{position:absolute;right:.8rem;bottom:.6rem;z-index:3;font:.72rem var(--f-label);letter-spacing:.06em;color:rgba(255,255,255,.8)}

/* Seitenkopf (Unterseiten) */
.seitenkopf{background:var(--nacht);color:var(--kalk);padding:4rem 0 3rem;position:relative;overflow:hidden}
.seitenkopf::before{content:"";position:absolute;right:-60px;top:-40px;width:340px;height:340px;border:2px solid rgba(169,205,190,.35);border-radius:50% 50% 0 0}
.seitenkopf h1{max-width:20ch}
.seitenkopf p{max-width:60ch;color:var(--sand);font-size:1.15rem}
.seitenkopf .label{color:var(--terra)}

/* Abschnitte */
section.block{padding:4.5rem 0}
section.block.sand{background:var(--sand)}
section.block.dunkel{background:var(--nacht);color:var(--kalk)}
section.block.dunkel a{color:var(--c-gruen-auf-dunkel)}
.intro{display:grid;grid-template-columns:1.1fr .9fr;gap:3rem;align-items:start}
.intro .gross{font-family:var(--f-head);font-size:clamp(1.35rem,2.4vw,1.9rem);line-height:1.35}
.leitsatz{border-left:4px solid var(--terra);padding:.2rem 0 .2rem 1.2rem;font-style:italic;color:var(--tinte-2)}
.fliesstext{max-width:var(--text)}
.fliesstext h2{margin-top:1.6em;font-size:1.7rem}
.fliesstext ul{padding-left:1.2em}
.fliesstext li{margin:.25em 0}

/* Kacheln / Karten */
.raster{display:grid;gap:1.6rem;grid-template-columns:repeat(auto-fill,minmax(280px,1fr))}
.karte{background:#fff;border:1px solid var(--c-linie);display:flex;flex-direction:column;position:relative}
.karte .inhalt{padding:1.2rem 1.3rem 1.4rem;display:flex;flex-direction:column;gap:.4rem;flex:1}
.karte h3{margin:0}
.karte h3 a{color:var(--tinte);text-decoration:none}
.karte h3 a::after{content:"";position:absolute;inset:0}
.karte h3 a:hover{color:var(--terra-text)}
.karte p{margin:0;color:var(--tinte-2);font-size:.98rem}
.karte .meta{font:500 .78rem var(--f-label);letter-spacing:.1em;text-transform:uppercase;color:var(--beton)}
.karte:hover{box-shadow:0 10px 28px rgba(18,63,77,.14)}

/* Teaser-Streifen (Start) */
.teaser3{display:grid;grid-template-columns:repeat(3,1fr);gap:0;border-top:1px solid rgba(255,255,255,.15)}
.teaser3 > div{padding:2.2rem 1.6rem;border-right:1px solid rgba(255,255,255,.15)}
.teaser3 > div:last-child{border-right:0}
.teaser3 .nr{font:700 3.2rem/1 var(--f-label);color:var(--terra)}

/* Bilder & Platzhalter */
figure.bild{margin:0;position:relative;background:var(--sand)}
figure.bild img{width:100%;aspect-ratio:4/3;object-fit:cover}
figure.bild.hoch img{aspect-ratio:3/4}
figure.bild.breit img{aspect-ratio:16/9}
figure.bild figcaption{font:.78rem/1.4 var(--f-label);letter-spacing:.04em;color:var(--tinte-2);padding:.45rem .1rem}
.dunkel figure.bild figcaption{color:var(--sand)}
.platzhalter{aspect-ratio:4/3;display:grid;place-items:center;text-align:center;padding:1rem;background:repeating-linear-gradient(45deg,var(--c-platzhalter-1) 0 12px,var(--c-platzhalter-2) 12px 24px);border:2px dashed var(--beton);color:var(--tinte-2);font:600 .95rem/1.3 var(--f-label);letter-spacing:.1em;text-transform:uppercase}
.platzhalter small{display:block;font-weight:400;letter-spacing:.04em;text-transform:none;margin-top:.3rem}
.marker{position:absolute;top:.6rem;left:.6rem;z-index:2;background:var(--c-marker);color:var(--c-text);font:600 .72rem/1 var(--f-label);letter-spacing:.1em;text-transform:uppercase;padding:.35rem .5rem}
.marker.rechte{background:var(--c-rechte);color:#fff}
.marker.ki{background:var(--aegaeis);color:#fff}
.marker.beispiel{background:var(--c-marker)}
.offen{background:var(--c-offen-bg);border:1px dashed var(--c-offen-rand);padding:.1rem .35rem;font-family:var(--f-label);font-size:.9em;letter-spacing:.03em}

/* Video 2-Klick */
.video{position:relative;aspect-ratio:16/9;background:var(--nacht);color:var(--kalk);display:grid;place-items:center;text-align:center;padding:1.5rem;margin:1.5rem 0;border:1px solid #000}
.video .play{width:64px;height:64px;border-radius:50%;border:2px solid var(--terra);display:grid;place-items:center;margin:0 auto .8rem}
.video .play::before{content:"";border-left:18px solid var(--terra);border-top:11px solid transparent;border-bottom:11px solid transparent;margin-left:5px}
.video p{margin:.3rem 0;font-size:.9rem;color:var(--sand);max-width:44ch}
.video .titel{font:600 1.05rem var(--f-label);letter-spacing:.06em;text-transform:uppercase;color:#fff}

/* Touren-Liste */
.touren{display:grid;gap:2.5rem}
.tour{display:grid;grid-template-columns:1fr 1.2fr;gap:2rem;align-items:center;padding-bottom:2.5rem;border-bottom:1px solid var(--c-linie)}
.tour:nth-child(even) .tour-bild{order:2}
.region{display:inline-block;font:500 .78rem var(--f-label);letter-spacing:.12em;text-transform:uppercase;background:var(--olive);color:#fff;padding:.3rem .55rem;margin-bottom:.6rem}
.region.ost{background:var(--c-petrol)}.region.west{background:var(--olive)}.region.offen{background:var(--beton)}

/* Blog */
.blog-layout{display:grid;grid-template-columns:1fr 260px;gap:3rem;align-items:start}
.kategorien{list-style:none;padding:0;margin:0;display:flex;flex-direction:column;gap:.3rem;position:sticky;top:100px}
.kategorien a{display:flex;justify-content:space-between;padding:.6rem .8rem;background:#fff;border:1px solid var(--c-linie);text-decoration:none;color:var(--tinte);font:500 .9rem var(--f-label);letter-spacing:.08em;text-transform:uppercase}
.kategorien a[aria-current="true"]{background:var(--tinte);color:#fff;border-color:var(--tinte)}
.angeheftet{display:grid;grid-template-columns:1.2fr 1fr;background:var(--nacht);color:var(--kalk);margin-bottom:2.5rem;position:relative}
.angeheftet .inhalt{padding:2rem;display:flex;flex-direction:column;gap:.6rem;justify-content:center}
.angeheftet h2 a{color:#fff;text-decoration:none}
.angeheftet h2 a::after{content:"";position:absolute;inset:0}
.angeheftet p{color:var(--sand);margin:0}
.angeheftet figure.bild figcaption{position:absolute;bottom:0;right:0;background:rgba(0,0,0,.55);color:#eee;padding:.25rem .5rem}
.pin{font:600 .75rem var(--f-label);letter-spacing:.14em;text-transform:uppercase;color:var(--terra)}
.beitrag-kopf{background:var(--nacht);color:var(--kalk);padding:3.5rem 0 2.5rem}
.beitrag-kopf .kurz{font-size:1.2rem;color:var(--sand);max-width:60ch}
.beitrag-bild{max-width:960px;margin:-0.5rem auto 0;padding:0 1.25rem}
.beitrag{padding:3rem 1.25rem 4rem;max-width:calc(var(--text) + 2.5rem);margin:0 auto}
.beitrag h2{font-size:1.6rem;margin-top:1.6em}
.beispiel-hinweis{background:var(--c-offen-bg);border:2px dashed var(--c-offen-rand);padding:.8rem 1rem;font:500 .9rem/1.4 var(--f-label);letter-spacing:.03em;margin:0 0 2rem}

/* Formulare */
form.formular{display:grid;gap:1rem;max-width:620px}
form.formular label{font:500 .85rem var(--f-label);letter-spacing:.08em;text-transform:uppercase;display:block;margin-bottom:.3rem}
form.formular input,form.formular textarea,form.formular select{width:100%;font:1rem var(--f-text);padding:.7rem .8rem;border:1px solid var(--c-linie-stark);background:#fff;border-radius:var(--r)}
form.formular .check{display:flex;gap:.6rem;align-items:flex-start;font-size:.95rem}
form.formular .check input{width:auto;margin-top:.35rem}
fieldset{border:1px solid var(--c-linie);padding:1rem}
legend{font:500 .85rem var(--f-label);letter-spacing:.08em;text-transform:uppercase;padding:0 .3rem}

/* Team */
.person{display:grid;grid-template-columns:320px 1fr;gap:2rem;align-items:start;margin-bottom:3rem}
.schritte{counter-reset:s;list-style:none;padding:0;display:grid;gap:1rem;grid-template-columns:repeat(auto-fit,minmax(200px,1fr))}
.schritte li{counter-increment:s;background:#fff;border-top:4px solid var(--terra);padding:1rem 1.1rem}
.schritte li::before{content:counter(s,decimal-leading-zero);display:block;font:700 2rem/1 var(--f-label);color:var(--terra);margin-bottom:.4rem}
table.daten{border-collapse:collapse;width:100%;max-width:640px;margin:1rem 0 1.5rem}
table.daten th,table.daten td{text-align:left;padding:.6rem .5rem;border-bottom:1px solid var(--c-linie)}
table.daten th{font:500 .8rem var(--f-label);letter-spacing:.1em;text-transform:uppercase}

/* Fuß */
.fuss{background:var(--nacht);color:var(--sand);padding:3.5rem 0 2rem;font-size:.95rem}
.fuss .wrap{display:grid;grid-template-columns:1.3fr 1fr 1fr;gap:2rem}
.fuss a{color:var(--kalk)}
.fuss ul{list-style:none;padding:0;margin:0;display:grid;gap:.4rem}
.fuss h2{font:500 .85rem var(--f-label);letter-spacing:.14em;text-transform:uppercase;color:var(--terra);margin-bottom:.8rem}
.fuss .klein{grid-column:1/-1;border-top:1px solid rgba(255,255,255,.12);padding-top:1.2rem;font-size:.8rem;color:var(--beton)}
.fuss img{height:70px;width:auto;margin-bottom:.8rem}

/* Responsiv */
@media (max-width:900px){
  .intro,.tour,.blog-layout,.angeheftet,.person{grid-template-columns:1fr}
  .tour:nth-child(even) .tour-bild{order:0}
  .teaser3{grid-template-columns:1fr}
  .teaser3 > div{border-right:0;border-bottom:1px solid rgba(255,255,255,.15)}
  .kategorien{position:static;flex-direction:row;flex-wrap:wrap}
  .kategorien a{gap:.6rem}
  .fuss .wrap{grid-template-columns:1fr}
  .person figure{max-width:420px}
}
@media (max-width:1060px){
  .nav-toggle{display:inline-block}
  .nav{display:none;position:absolute;left:0;right:0;top:100%;background:var(--nacht);border-bottom:3px solid var(--terra)}
  .nav.offen{display:block}
  .nav ul{flex-direction:column;align-items:stretch;gap:0;padding:.5rem 1.25rem 1.2rem}
  .nav li a{display:block;padding:.9rem 0;border-bottom:1px solid rgba(255,255,255,.1)}
  .nav li a.btn{margin-top:.8rem;text-align:center;padding:.9rem}
  .kopf .wrap{position:relative}
}
@media (max-width:480px){
  body{font-size:1rem}
  .marke img{height:42px}
  .marke span{font-size:1rem}
  section.block{padding:3rem 0}
  .hero{min-height:620px}
}
@media (prefers-reduced-motion:reduce){*{transition:none!important;scroll-behavior:auto!important}}
.karte > .marker.beispiel{left:auto;right:.6rem}
.angeheftet figure.bild{min-height:100%}
.angeheftet figure.bild img{height:100%;aspect-ratio:auto;min-height:320px}
.offen{color:var(--c-offen-text)}
.nav a.btn{padding:.6rem .85rem}
@media (max-width:900px){.blog-layout aside{order:-1}}
@media (max-width:480px){.video{aspect-ratio:auto;min-height:240px}}
/* Fix: Grid-Spalten und fieldset dürfen schrumpfen (kein Überlauf bei 390 px) */
.intro > *,.tour > *,.blog-layout > *,.person > *,.angeheftet > *,.raster > *{min-width:0}
fieldset{min-width:0}
form.formular{grid-template-columns:minmax(0,1fr)} form.formular > *{min-width:0}

/* ===== Entwurf 1.1: Bausteine nach Artwork (detail-hefte.png, detail-kontakt.png) ===== */
.kicker{display:flex;align-items:center;gap:.6rem;font:600 .72rem/1 var(--f-label);letter-spacing:.14em;text-transform:uppercase;color:var(--terra);margin:0 0 .9rem}
.kicker::before{content:"";width:28px;height:1px;background:var(--terra)}
.h2{font-size:clamp(2.1rem,3.4vw,2.9rem);line-height:1.12}
.h3{font-size:1.45rem}
.lede{font-size:1.25rem;line-height:1.45}
.muted{color:var(--c-text-3);font-size:.875rem;margin-top:.8rem}
.ph{display:inline-block;border:1px dashed var(--terra);color:var(--terra-text);font:600 .68rem/1.2 var(--f-label);letter-spacing:.1em;text-transform:uppercase;padding:.2rem .4rem;vertical-align:middle}
.ph.hell{color:var(--sand);border-color:var(--sand)}
.btn-ink{background:var(--vf-ink);color:#fff !important}
.btn-ink:hover{background:#000}
.hefte-bg{background:var(--kalk);padding:5rem 0}
.heft1{display:grid;grid-template-columns:340px 1fr;gap:2.5rem;align-items:start}
.heft1 > *{min-width:0}
figure.bild.cover img{aspect-ratio:auto;box-shadow:0 18px 40px rgba(18,63,77,.28)}
figure.bild.cover{background:none}
.heft-actions{margin:1.4rem 0;display:flex;gap:.8rem;align-items:center;flex-wrap:wrap}
.form-box{background:#fff;border:1px solid var(--vf-rule);padding:1.4rem 1.2rem}
.form-box .hint{margin:.2rem 0 1rem}
.fields{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.9rem}
.fields .voll{grid-column:1/-1}
.lab{display:block;font:600 .62rem/1 var(--f-label);letter-spacing:.14em;text-transform:uppercase;color:var(--c-text-3);margin-bottom:.45rem}
.fields input,.fields textarea,.form-stack input,.form-stack textarea,.amt input{width:100%;font:1rem var(--f-text);padding:.65rem .75rem;border:1px solid var(--vf-rule-strong);background:#fff;border-radius:0;color:var(--tinte)}
.fields textarea,.form-stack textarea{min-height:90px;resize:vertical}
.more-hefte{margin-top:4rem}
.shelf{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:.9rem;margin-top:1.5rem}
.ph-cover{background:var(--sand);border:1px solid var(--vf-rule);aspect-ratio:3/4.2;padding:.6rem;display:flex;flex-direction:column;position:relative}
.ph-cover.hell{background:#fff}
.ph-badge{align-self:flex-start;background:var(--terra);color:#fff;font:600 .58rem/1 var(--f-label);letter-spacing:.1em;text-transform:uppercase;padding:.25rem .35rem}
.ph-cover .nr{font:700 2.1rem/1 var(--f-label);color:var(--aegaeis);margin-top:.5rem}
.ph-cover .nr.klein{font-size:1.6rem;padding-top:.4rem}
.ph-cover .series{margin-top:auto;font:500 .6rem/1.3 var(--f-label);letter-spacing:.1em;text-transform:uppercase;color:var(--c-text-3)}
.ph-cover .amazon{font:600 .62rem/1.3 var(--f-label);letter-spacing:.1em;text-transform:uppercase;margin-top:.5rem}
.kontakt .split{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1rem}
.panel{padding:2.2rem 1.6rem}
.panel.kalk{background:var(--c-petrol-hell)}
.panel.ink{background:var(--vf-ink);color:#fff}
.panel.ink p{color:var(--c-auf-dunkel-2)}
.form-stack{display:grid;gap:.9rem;grid-template-columns:minmax(0,1fr);margin-top:1.2rem}
.checks{display:grid;gap:.5rem;font-size:.9rem}
.checks label{display:flex;gap:.55rem;align-items:flex-start}
.checks input{margin-top:.3rem;flex:none}
.amt{display:flex;align-items:center;gap:.6rem;margin:1rem 0;max-width:260px}
.amt .euro{font:700 1.1rem var(--f-label)}
.legal-note{border-top:1px solid rgba(255,255,255,.2);padding-top:1rem;margin-top:1.4rem;font-size:.85rem}
.foerderer{font-size:.85rem;color:var(--beton)}
@media (max-width:900px){
  .heft1{grid-template-columns:1fr}
  .heft1 figure.bild.cover{max-width:300px}
  .shelf{grid-template-columns:repeat(3,minmax(0,1fr))}
  .kontakt .split{grid-template-columns:1fr}
  .fields{grid-template-columns:1fr}
}
@media (max-width:480px){.hefte-bg{padding:3.5rem 0}.panel{padding:1.8rem 1.1rem}.shelf{grid-template-columns:repeat(2,minmax(0,1fr))}}
.checks input{width:auto;padding:0}

/* ===== Entwurf 1.2 ===== */
.marker-box{position:absolute;top:.6rem;left:.6rem;z-index:2;display:flex;flex-wrap:wrap;gap:.35rem;max-width:calc(100% - 1.2rem)}
.marker-box .marker{position:static}
.marker.vermerk{background:var(--c-marker);color:var(--c-text);border:1px solid var(--c-text)}
.marker.ki{background:var(--aegaeis);color:#fff;font-size:.8rem;padding:.4rem .6rem}
figure.bild.karte img{aspect-ratio:auto}
.shelf-cover{display:flex;flex-direction:column;gap:.4rem;min-width:0}
.shelf-cover figure.bild.cover img{box-shadow:0 6px 16px rgba(18,63,77,.2)}
.shelf-cover figcaption{display:none}
.shelf-cover .amazon{font:600 .62rem/1.3 var(--f-label);letter-spacing:.1em;text-transform:uppercase}
.shelf-cover .marker{font-size:.55rem;padding:.25rem .35rem}


/* ===== Entwurf 1.2: Farbwelt Petrol/Grau/Grün ===== */
.btn{background:var(--c-gruen);color:#fff !important}
.btn:hover{background:var(--c-gruen-dunkel)}
.btn.ghost{background:transparent;color:#fff !important;box-shadow:inset 0 0 0 2px #fff}
.btn.dunkel,.btn-ink{background:var(--c-petrol-tief);color:#fff !important}
.dunkel .btn,.kopf .btn,.panel.ink .btn{background:var(--c-gruen-auf-dunkel);color:var(--c-petrol-tief) !important}
.btn[aria-disabled="true"],.btn:disabled,.dunkel .btn[aria-disabled="true"],.panel.ink .btn[aria-disabled="true"]{background:var(--c-deaktiviert);color:#fff !important}
.label,.kicker,.pin{color:var(--c-gruen)}
.kicker::before{background:var(--c-terra)}
.dunkel .label,.seitenkopf .label,.angeheftet .pin,.panel.ink .kicker,.fuss h2,.beitrag-kopf .label,.beitrag-kopf .label a,.teaser3 .nr{color:var(--c-gruen-auf-dunkel) !important}
.seitenkopf p,.beitrag-kopf .kurz,.angeheftet p,.hero .unter{color:var(--c-auf-dunkel-2)}
.fuss{color:var(--c-auf-dunkel-2);background:var(--c-petrol-tief-2)}
.fuss .klein{color:var(--c-auf-dunkel-2)}
.kopf{border-bottom-color:var(--c-gruen-auf-dunkel)}
.nav a:hover,.nav a[aria-current="page"]{border-color:var(--c-gruen-auf-dunkel)}
figure.bild{background:transparent}
figure.bild figcaption{color:var(--c-text-3)}
.dunkel figure.bild figcaption,.panel.ink figcaption{color:var(--c-auf-dunkel-2)}
body{background:var(--c-weiss)}
main > section.block:not(.dunkel):not(.sand):nth-of-type(even){background:var(--c-hellgrau)}
main > section.block.sand{background:var(--c-petrol-hell)}
main > section.block.sand:nth-of-type(4n+1),main > section.block.sand:nth-of-type(4n+3){background:var(--c-gruen-hell)}
.hefte-bg{background:var(--c-hellgrau)}
.panel.kalk{background:var(--c-petrol-hell)}
.panel.ink{background:var(--c-petrol-tief)}
.ph-cover{background:var(--c-petrol-hell)}
.ph-badge{background:var(--c-petrol)}
.ph{border-color:var(--c-petrol);color:var(--c-petrol)}
.ph.hell{color:var(--c-auf-dunkel-2);border-color:var(--c-auf-dunkel-2)}
.leitsatz{border-left-color:var(--c-gruen)}
.schritte li{border-top-color:var(--c-gruen)}
.schritte li::before{color:var(--c-petrol)}
.region{background:var(--c-gruen)}
.region.ost{background:var(--c-petrol)}
.region.offen{background:var(--c-text-3)}
.video .play{border-color:var(--c-gruen-auf-dunkel)}
.video .play::before{border-left-color:var(--c-gruen-auf-dunkel)}
.video p{color:var(--c-auf-dunkel-2)}
.kategorien a[aria-current="true"]{background:var(--c-petrol-tief);border-color:var(--c-petrol-tief)}
.entwurf-band{color:var(--c-text)}
.foerderer{color:var(--c-text-3)}