/* Startseite Spagnolo Digital, Stil "Cinematic Organic Tech". Tokens: css/tokens.css.
   Aufbau: 1 Basis · 2 Kopf · 3 Hero · 4 Leistungen · 5 Sektionen · 6 Formular · 7 Footer · 8 Bewegung/Reduced Motion */

/* ===== 1 Basis ===== */
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth;scroll-padding-top:calc(var(--header-h) + 12px);--kopf-h:var(--header-h)}
body{margin:0;background:var(--forest-deep);color:var(--text-dim);font-family:var(--font-sans);font-size:var(--fs-text);line-height:1.65;
  -webkit-font-smoothing:antialiased;font-kerning:normal;font-variant-numeric:lining-nums;overflow-x:hidden;text-wrap:pretty}
p,ul,ol,figure,h1,h2,h3{margin:0}ul,ol{padding:0;list-style:none}
img,svg,video{display:block;max-width:100%}
img{height:auto}
a{color:inherit;text-decoration:none}
:focus-visible{outline:2px solid var(--light-gold);outline-offset:3px;border-radius:4px}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.container{width:100%;max-width:var(--container);margin-inline:auto;padding-inline:var(--gutter)}
.skip{position:absolute;left:var(--space-4);top:-80px;z-index:var(--z-skip);background:var(--cream-light);color:var(--forest-deep);padding:var(--space-3) var(--space-4);border-radius:var(--radius-sm);font-weight:600}
.skip:focus{top:var(--space-4)}
h1,h2,h3{font-family:var(--font-serif);font-weight:500;color:var(--cream-light);letter-spacing:-.018em;text-wrap:balance}
h2{font-size:var(--fs-h2);line-height:1.06}
h3{font-size:var(--fs-h3);line-height:1.15}
em{font-style:italic;font-weight:400;color:var(--moss)}
.label{font-size:var(--fs-label);font-weight:600;letter-spacing:.18em;text-transform:uppercase;color:var(--sage);margin-bottom:var(--space-5)}
.lead-dim{font-size:var(--fs-lead);line-height:1.6;color:var(--text-dim);max-width:36rem;margin-top:var(--space-5)}
section{position:relative}
.dunkel,.hell,.leistungen,.hero{isolation:isolate}
.dunkel{background:var(--forest-deep);padding-block:var(--section-y)}
.hell{background:var(--cream);color:#31403a;padding-block:var(--section-y)}
.hell h2,.hell h3{color:var(--ink-on-cream)}
.hell em{color:#4d6b52}
.hell .label,.label.dunkel-text{color:#4d6b52}

/* Buttons */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:var(--space-3);min-height:52px;padding:14px 26px;border-radius:var(--radius-pill);
  font:600 .78rem/1 var(--font-sans);letter-spacing:.14em;text-transform:uppercase;border:1px solid transparent;cursor:pointer;
  transition:background var(--dur-base) var(--ease-soft),color var(--dur-base) var(--ease-soft),border-color var(--dur-base) var(--ease-soft),transform var(--dur-base) var(--ease-out)}
.btn .ico{width:18px;height:18px;transition:transform var(--dur-base) var(--ease-out)}
.btn:hover .ico{transform:translateX(4px)}
.btn-light{background:var(--cream-light);color:var(--forest-deep)}
.btn-light:hover{background:var(--white)}
.btn-ghost{border-color:var(--line-strong);color:var(--cream-light);background:rgba(5,29,25,.25)}
.btn-ghost:hover{border-color:rgba(248,245,239,.55)}
.btn-dark{background:var(--forest);color:var(--cream-light);margin-top:var(--space-6)}
.btn-dark:hover{background:var(--forest-deep)}
.text-link{min-height:44px;display:inline-flex;align-items:center;gap:var(--space-3);margin-top:var(--space-6);font:600 .78rem/1 var(--font-sans);letter-spacing:.14em;text-transform:uppercase;color:var(--cream-light);border-bottom:1px solid var(--line-strong);padding-bottom:6px}
.text-link .ico{width:16px;height:16px}
.text-link:hover{border-color:var(--light-gold)}

/* ===== 2 Kopf ===== */
.kopf{position:fixed;inset:0 0 auto 0;z-index:var(--z-header);height:var(--header-h);transition:background var(--dur-base) ease,border-color var(--dur-base) ease}
.kopf.fest{background:rgba(5,29,25,.82);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);border-bottom:1px solid var(--line)}
.kopf-innen{height:100%;display:flex;align-items:center;gap:var(--space-6)}
.wortmarke{display:inline-block;padding-block:14px;font:500 .95rem/1 var(--font-sans);letter-spacing:.34em;text-transform:uppercase;color:var(--cream-light);white-space:nowrap}
.wortmarke span{color:var(--sage);font-weight:400}
.nav{display:none;margin-inline:auto;gap:clamp(14px,1.9vw,34px)}
.nav a{white-space:nowrap;font-size:.9rem;color:var(--text-dim);padding:12px 0;border-bottom:1px solid transparent;transition:color var(--dur-fast),border-color var(--dur-fast)}
.nav a:hover,.nav a.hier{color:var(--cream-light);border-color:var(--cream-light)}
.kopf-claim{display:none;font-size:.7rem;letter-spacing:.2em;text-transform:uppercase;color:var(--sage);white-space:nowrap}
.btn-kopf{display:none;min-height:46px;padding:12px 22px;font-size:.72rem;white-space:nowrap}
.schalter{margin-left:auto;width:48px;height:48px;display:grid;place-items:center;background:none;border:1px solid var(--line-strong);border-radius:50%;color:var(--cream-light);cursor:pointer}
.schalter svg{width:22px;height:22px;grid-area:1/1}.schalter .zu{display:none}
.schalter[aria-expanded="true"] .auf{display:none}.schalter[aria-expanded="true"] .zu{display:block}
.mobil-menue{position:fixed;inset:var(--header-h) 0 0 0;z-index:var(--z-menu);background:var(--forest-deep);padding:var(--space-6) var(--gutter);display:none;flex-direction:column;gap:var(--space-2);overflow-y:auto}
.mobil-menue.offen{display:flex}
.mobil-menue a:not(.btn){font:500 1.9rem/1.2 var(--font-serif);color:var(--cream-light);padding:12px 0;border-bottom:1px solid var(--line)}
.mobil-menue a.sekundaer{font:500 1rem/1.4 var(--font-sans);color:var(--text-dim);border:0;padding:8px 0}
.mobil-menue .btn{margin-top:var(--space-5)}
@media(min-width:1100px){.nav{display:flex}.schalter{display:none}.btn-kopf{display:inline-flex}.mobil-menue{display:none!important}}
.kopf .container{max-width:var(--container-wide)}
@media(min-width:1560px){.kopf-claim{display:block}}

/* ===== 3 Hero ===== */
.hero{min-height:max(92svh,700px);display:flex;align-items:center;padding:calc(var(--header-h) + var(--space-7)) 0 clamp(120px,14vw,200px);background:var(--forest-deep);overflow:hidden}
.hero-bg{position:absolute;inset:0;z-index:var(--z-bg);will-change:transform}
.hero-bg img,.hero-video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:50% 55%;filter:brightness(1.1) contrast(1.05) saturate(1.05)}
.hero-video,.band-video video,.kv-fokus video{opacity:0;transition:opacity 1.2s ease}
.hero-video.laeuft,.band-video video.laeuft,.kv-fokus video.laeuft{opacity:1}
.hero-shade{position:absolute;inset:0;z-index:var(--z-bg-fx);pointer-events:none;
  background:
   radial-gradient(28% 34% at 50% 44%,rgba(226,168,114,.30),rgba(226,168,114,.07) 55%,rgba(226,168,114,0) 78%),
   linear-gradient(90deg,rgba(5,29,25,.9) 0%,rgba(5,29,25,.72) 32%,rgba(5,29,25,.4) 50%,rgba(5,29,25,.08) 68%,rgba(5,29,25,0) 100%),
   linear-gradient(180deg,rgba(5,29,25,.7) 0,rgba(5,29,25,0) 16%),
   linear-gradient(0deg,var(--forest-deep) 0,rgba(5,29,25,.7) 20%,rgba(5,29,25,0) 46%)}
.hero-grain{position:absolute;inset:0;z-index:var(--z-bg-fx);pointer-events:none;opacity:.07;mix-blend-mode:overlay;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='180' height='180'%3E%3Cfilter id='k'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.8' numOctaves='3'/%3E%3C/filter%3E%3Crect width='180' height='180' filter='url(%23k)'/%3E%3C/svg%3E")}
.hero-grid{position:relative;z-index:var(--z-content);display:grid;gap:var(--space-8);align-items:center}
.hero-text .label{margin-bottom:var(--space-5);font-size:.68rem}
h1{font-size:var(--fs-h1);line-height:.98;letter-spacing:-.024em}
h1 .zeile{display:block;overflow:hidden;padding:.06em .08em .14em 0;margin:-.06em 0 -.14em}
h1 .zeile>span{display:inline-block}
.hero .lead{font-size:var(--fs-lead);color:var(--cream-light);max-width:28rem;margin-top:var(--space-5);text-shadow:0 1px 14px rgba(5,29,25,.6)}
.cta-row{display:flex;flex-wrap:wrap;gap:var(--space-3);margin-top:var(--space-6)}
.versprechen{display:grid;grid-template-columns:repeat(3,auto);justify-content:start;gap:var(--space-5) var(--space-6);margin-top:var(--space-7)}
.versprechen li{display:flex;gap:var(--space-3);align-items:center;font-size:.8rem;line-height:1.35;color:var(--cream-light)}
.v-ico{width:34px;height:34px;flex:none;padding:7px;border:1px solid var(--line-strong);border-radius:50%;color:var(--sage)}

/* Rahmen wie im Mockup: Hero-Ebenen sind in eine abgerundete Fläche geschnitten (nur Desktop) */
@media(min-width:1000px){
  .hero-bg,.hero-shade,.hero-grain{clip-path:inset(14px clamp(12px,3.6vw,56px) 0 clamp(12px,3.6vw,56px) round 30px 30px 0 0)}
  .hero{background:radial-gradient(120% 90% at 50% 0%,#0a2b25,var(--forest-deep))}
}
/* Räumliche Screens */
.screens{position:relative;display:grid;gap:var(--space-4)}
.screen{position:relative;border-radius:var(--radius-md);padding:12px;background:var(--glass),rgba(5,29,25,.46);border:1px solid var(--glass-border);box-shadow:var(--shadow-deep);color:var(--cream-light);overflow:hidden}
.screen::after{content:"";position:absolute;inset:0;border-radius:inherit;pointer-events:none;box-shadow:inset 0 1px 0 rgba(226,168,114,.7),inset 0 0 0 1px rgba(226,168,114,.14),inset 0 -18px 30px -22px rgba(226,168,114,.35)}
.screen{box-shadow:var(--shadow-deep),0 0 38px rgba(226,168,114,.12)}
.s-titel{display:block;font:italic 400 1.15rem/1.1 var(--font-serif);margin-bottom:8px;color:var(--cream-light)}
.s-bild{aspect-ratio:16/10;background-size:cover;background-position:center;border-radius:8px;position:relative}
.s-cream{background:var(--cream-light);border-radius:8px;aspect-ratio:16/10;display:flex;flex-direction:column;align-items:flex-start;justify-content:space-between;padding:10px 12px;color:var(--forest-deep)}
.s-cream b{font:500 2.6rem/1 var(--font-serif)}
.chips{display:flex;gap:6px}.chips i,.bb-farbe i,.bd-farben i{width:20px;height:20px;border-radius:50%;background:var(--c);border:1px solid rgba(0,0,0,.18)}
.s-site{background:var(--cream-light);border-radius:8px;overflow:hidden;color:var(--forest-deep)}
.s-nav{display:flex;gap:8px;padding:6px 10px;border-bottom:1px solid rgba(5,29,25,.1)}.s-nav i{height:3px;width:20px;background:rgba(5,29,25,.3);border-radius:2px}
.s-hero{aspect-ratio:16/8;background-size:cover;background-position:center;display:flex;align-items:center;padding:0 12px;position:relative}
.s-hero::before{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(5,29,25,.75),transparent 80%)}
.s-hero b{position:relative;font:500 1.15rem/1.05 var(--font-serif);color:var(--cream-light)}
.s-rows{display:grid;grid-template-columns:repeat(3,1fr);gap:6px;padding:8px 10px}.s-rows i{height:22px;background:rgba(5,29,25,.12);border-radius:3px}
.s-bars{display:flex;align-items:flex-end;gap:7px;height:78px;padding:6px 4px 0;border-bottom:1px solid var(--line)}
.s-bars i{flex:1;height:var(--h);background:linear-gradient(0deg,rgba(148,166,135,.35),var(--moss));border-radius:3px 3px 0 0}
.s-play{position:absolute;inset:0;margin:auto;width:46px;height:46px;border-radius:50%;display:grid;place-items:center;background:rgba(248,245,239,.18);border:1px solid rgba(248,245,239,.55);color:var(--cream-light);backdrop-filter:blur(2px)}
.s-play svg{width:22px;height:22px}
.s-graph{width:100%;height:auto;color:var(--sage)}
.lichtlinie{display:none}
@media(min-width:1000px){
  .hero-grid{grid-template-columns:minmax(0,1.2fr) minmax(0,.85fr);gap:var(--space-6)}
  .screens{width:min(100%,500px);justify-self:end;grid-template-columns:repeat(12,1fr);grid-template-rows:repeat(2,auto);gap:14px;perspective:1300px;transform-style:preserve-3d;min-height:520px;align-content:center}
  .screen{transform-style:preserve-3d;transition:transform var(--dur-slow) var(--ease-out)}
  .s-pos{grid-column:1/5;grid-row:1;transform:translate3d(0,26px,-30px) rotateY(16deg) rotateX(3deg)}
  .s-brand{grid-column:5/8;grid-row:1;transform:translate3d(0,-4px,10px) rotateY(10deg)}
  .s-web{grid-column:8/13;grid-row:1;align-self:start;transform:translate3d(6px,-34px,50px) rotateY(-8deg) rotateX(2deg) scale(1.08)}
  .s-mkt{grid-column:1/5;grid-row:2;transform:translate3d(0,14px,-10px) rotateY(14deg)}
  .s-motion{grid-column:5/8;grid-row:2;transform:translate3d(0,28px,20px) rotateY(6deg)}
  .s-ki{grid-column:8/13;grid-row:2;align-self:end;transform:translate3d(14px,30px,50px) rotateY(-10deg) rotateX(-2deg)}  .s-web .s-hero{aspect-ratio:16/9}
  .lichtlinie{display:block;position:absolute;inset:-6% -4% -4% -6%;width:110%;height:110%;z-index:-1;pointer-events:none;overflow:visible}
  .lichtlinie .ll-core{fill:none;stroke:var(--light-gold);stroke-width:2.2;stroke-dasharray:1;stroke-dashoffset:0;stroke-linecap:round}
  .lichtlinie .ll-glow{fill:none;stroke:var(--gold-glow);stroke-width:18;opacity:.5;stroke-dasharray:1;stroke-dashoffset:0;stroke-linecap:round}
}
@media(max-width:999px){
  .screens{display:flex;overflow-x:auto;scroll-snap-type:x mandatory;gap:12px;padding:6px var(--gutter) 18px;margin-inline:calc(var(--gutter) * -1);scrollbar-width:none}
  .screens::-webkit-scrollbar{display:none}
  .screen{flex:0 0 min(64vw,260px);scroll-snap-align:start}
  .versprechen{grid-template-columns:1fr;gap:var(--space-4)}
}
@media(max-width:759px){
  .hero{align-items:flex-end;padding-top:calc(var(--header-h) + 38svh)}.cta-row .btn{flex:1 1 100%}
  .hero-bg{inset:0 0 auto 0;height:74svh;clip-path:none}
  .hero-bg img{object-position:60% 78%}
  .hero-shade{background:linear-gradient(180deg,rgba(5,29,25,.55) 0,rgba(5,29,25,0) 14svh,rgba(5,29,25,0) 32svh,rgba(5,29,25,.62) 48svh,rgba(5,29,25,.92) 62svh,var(--forest-deep) 74svh,var(--forest-deep) 100%)}
}

/* Organischer Übergang */
.uebergang{position:absolute;left:0;right:0;bottom:-1px;width:100%;height:clamp(90px,13vw,200px);z-index:var(--z-content);display:block;pointer-events:none}
.u-fill{fill:var(--forest)}
.u-licht{fill:none;stroke:var(--light-gold);stroke-width:1.4;opacity:.55;vector-effect:non-scaling-stroke}
.uebergang-oben{top:-1px;bottom:auto;height:clamp(60px,8vw,120px);z-index:0}
.uebergang-oben path{fill:var(--forest)}

/* ===== 4 Leistungen ===== */
.leistungen{background:var(--forest);padding-block:clamp(48px,6vw,96px) var(--section-y);overflow:hidden}
.leistungen::after{content:"";position:absolute;inset:auto 0 0 0;height:36%;z-index:-1;background:linear-gradient(0deg,var(--forest-deep),transparent)}
.l-kopf{display:grid;gap:var(--space-5);align-items:end;margin-bottom:var(--space-8)}
.l-titel{text-align:center}.blatt{width:30px;height:30px;margin:0 auto var(--space-3);color:var(--moss)}
.l-titel .label{margin-bottom:var(--space-4)}
.l-sub{max-width:28rem;font-size:.95rem;color:var(--text-dim);justify-self:center;text-align:center}
@media(min-width:1000px){.l-kopf{grid-template-columns:1fr minmax(0,24rem);text-align:left;margin-bottom:var(--space-7)}.l-titel{grid-column:1/-1;grid-row:1}.l-sub{grid-column:2;grid-row:2;text-align:left;justify-self:end}}
.leistungen .container{max-width:var(--container-wide)}
.karten{display:grid;gap:var(--space-4);grid-template-columns:1fr}
@media(min-width:640px){.karten{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(min-width:1100px){.karten{grid-template-columns:repeat(6,minmax(0,1fr));gap:14px}}
.karte-link{display:flex;flex-direction:column;height:100%;border-radius:var(--radius-md);overflow:hidden;background:linear-gradient(170deg,rgba(248,245,239,.07),rgba(248,245,239,.02));border:1px solid var(--glass-border);
  transition:transform var(--dur-slow) var(--ease-out),border-color var(--dur-base) ease,box-shadow var(--dur-slow) var(--ease-out)}
.karte-link:hover,.karte-link:focus-visible{transform:translateY(-6px);border-color:rgba(226,168,114,.45);box-shadow:0 24px 50px rgba(0,0,0,.45)}
.karte-visual{position:relative;flex:none;aspect-ratio:4/3.1;overflow:hidden;background:var(--forest-dark)}
.karte-visual>img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:transform 1.2s var(--ease-out)}
.karte-link:hover .karte-visual>img{transform:scale(1.05)}
.karte-visual::after{content:"";position:absolute;inset:0;background:linear-gradient(0deg,rgba(5,29,25,.55),transparent 55%);pointer-events:none}
.k-nr{position:absolute;left:14px;top:12px;z-index:2;font:500 .8rem/1 var(--font-sans);letter-spacing:.12em;color:var(--cream-light)}
.karte-visual>svg{position:absolute;inset:0;width:100%;height:100%;z-index:1}
.k-licht{fill:none;stroke:var(--light-gold);stroke-width:2.2;stroke-linecap:round;stroke-dasharray:1;filter:drop-shadow(0 0 4px rgba(226,168,114,.7))}
.karte-body{display:flex;justify-content:space-between;align-items:flex-end;gap:var(--space-2);padding:14px 14px 16px;flex:1}
.karte-body h3{font-size:clamp(1.2rem,1.05rem + .3vw,1.45rem);margin-bottom:6px;overflow-wrap:normal;hyphens:manual}
.karte-body p{font-size:.84rem;line-height:1.45;color:var(--text-dim)}
.pfeil-kreis{flex:none;width:38px;height:38px;border-radius:50%;border:1px solid var(--line-strong);display:grid;place-items:center;color:var(--cream-light);transition:background var(--dur-base),color var(--dur-base),transform var(--dur-base) var(--ease-out)}
.pfeil-kreis svg{width:18px;height:18px}
.karte-link:hover .pfeil-kreis{background:var(--cream-light);color:var(--forest-deep);transform:translateX(3px)}
/* Key Visuals aus Code (Bildserie mit den Foto-Karten: gleiche Farbwelt, Licht, Körnung) */
.v-brand,.v-mkt,.v-motion{background:radial-gradient(120% 90% at 70% 20%,#12453a 0%,var(--forest) 55%,var(--forest-dark) 100%)}
.bb{position:absolute;inset:0;padding:14px}
.bb-karte{position:absolute;border-radius:8px;background:var(--cream-light);color:var(--forest-deep);box-shadow:0 14px 28px rgba(0,0,0,.4)}
.bb-aa{left:8%;top:24%;width:40%;height:50%;display:flex;flex-direction:column;justify-content:space-between;padding:10px 12px;transform:rotate(-5deg)}
.bb-aa b{font:500 2.7rem/1 var(--font-serif)}.bb-aa small,.bb-wort small{font:600 .64rem/1 var(--font-sans);letter-spacing:.14em;text-transform:uppercase;color:#5a6b63}
.bb-farbe{left:50%;top:14%;width:40%;height:22%;display:flex;gap:5px;align-items:center;padding:0 10px;transform:rotate(3deg);background:var(--forest-dark);border:1px solid var(--glass-border)}
.bb-farbe i{width:18px;height:18px}
.bb-wort{left:50%;top:44%;width:42%;padding:9px 10px;font:500 .95rem/1.1 var(--font-serif);transform:rotate(-2deg)}
.bb-wort small{display:block;margin-top:4px}
.bb-bild{left:20%;top:62%;width:36%;height:30%;background:url(../assets/img/home/card-positionierung.webp) center/cover;border:3px solid var(--cream-light);transform:rotate(4deg)}
.netz{position:absolute;inset:0;width:100%;height:100%;color:var(--cream-light)}
.netz-knoten circle{fill:rgba(248,245,239,.08);stroke:var(--light-gold);stroke-width:1;stroke-opacity:.6}
.phone-mini{position:absolute;left:50%;top:50%;width:34%;aspect-ratio:9/16;transform:translate(-50%,-50%) rotate(-3deg);border-radius:14px;overflow:hidden;border:2px solid rgba(248,245,239,.4);box-shadow:0 18px 34px rgba(0,0,0,.5)}
.phone-mini img{width:100%;height:100%;object-fit:cover}.phone-mini .s-play{width:34px;height:34px}
.motion-linien{opacity:.9}
.fakten{display:flex;flex-wrap:wrap;justify-content:center;gap:var(--space-6) var(--space-8);margin-top:var(--space-8);padding-top:var(--space-6);border-top:1px solid var(--line)}
.fakten li{text-align:center}.fakten b{display:block;font:500 1.7rem/1.1 var(--font-serif);color:var(--cream-light)}.fakten span{font-size:.82rem;color:var(--sage)}

@media(max-width:639px){
  .karten{display:flex;overflow-x:auto;scroll-snap-type:x mandatory;gap:12px;margin-inline:calc(var(--gutter) * -1);padding:4px var(--gutter) 18px;scrollbar-width:none}
  .karten::-webkit-scrollbar{display:none}
  .karte{flex:0 0 min(78vw,300px);scroll-snap-align:start}
  .phones{display:flex;overflow-x:auto;scroll-snap-type:x mandatory;gap:14px;margin-inline:calc(var(--gutter) * -1);padding:4px var(--gutter) 18px;scrollbar-width:none}
  .phones::-webkit-scrollbar{display:none}
  .phone{flex:0 0 min(62vw,240px);scroll-snap-align:start}
}
/* ===== 5 Sektionen ===== */
.idee-grid,.pos-grid,.brand-grid,.web-grid,.diag-grid,.mkt-grid,.ueber-grid{display:grid;gap:var(--space-7);align-items:center}
@media(min-width:1000px){.idee-grid{grid-template-columns:5fr 7fr}.pos-grid{grid-template-columns:5fr 6fr}.brand-grid{grid-template-columns:7fr 5fr}.web-grid{grid-template-columns:5fr 7fr}.diag-grid{grid-template-columns:5fr 6fr}.mkt-grid{grid-template-columns:5fr 7fr}.ueber-grid{grid-template-columns:7fr 5fr}}
.idee-text p:not(.label){margin-top:var(--space-5);max-width:32rem;font-size:var(--fs-lead)}
.idee{padding-bottom:calc(var(--section-y) + 40px)}
.idee-bild{position:relative;border-radius:var(--radius-lg);overflow:hidden;box-shadow:0 30px 60px rgba(5,29,25,.18)}
.idee-bild img{width:100%;aspect-ratio:21/10;object-fit:cover}
.idee-pfad{position:absolute;inset:0;width:100%;height:100%}
.pfad{fill:none;stroke:var(--light-gold);stroke-width:2.4;stroke-dasharray:1;stroke-linecap:round;filter:drop-shadow(0 0 5px rgba(226,168,114,.6))}
.fragen li{position:absolute;left:var(--x);top:var(--y);transform:translate(-50%,-100%);max-width:44%;padding:6px 10px;border-radius:var(--radius-pill);background:rgba(248,245,239,.9);color:var(--ink-on-cream);font:600 .66rem/1.2 var(--font-sans);letter-spacing:.1em;text-transform:uppercase;white-space:nowrap;box-shadow:0 6px 16px rgba(5,29,25,.2)}
@media(max-width:759px){.fragen li{font-size:.62rem;padding:4px 7px;white-space:normal;max-width:84px;text-align:center}.idee-bild img{aspect-ratio:4/3}}

.positionierung{background:linear-gradient(180deg,var(--forest-deep),var(--forest-dark))}
.stufen{margin-top:var(--space-6);position:relative;padding-left:22px;display:grid;gap:14px}
.stufen::before{content:"";position:absolute;left:4px;top:8px;bottom:8px;width:1px;background:var(--line-strong)}
.stufen li{position:relative;font:600 .74rem/1 var(--font-sans);letter-spacing:.16em;text-transform:uppercase;color:var(--text-faint)}
.stufen li::before{content:"";position:absolute;left:-22px;top:50%;width:9px;height:9px;margin-top:-4.5px;border-radius:50%;background:var(--forest-deep);border:1px solid var(--line-strong)}
.stufen li.aktiv{color:var(--cream-light)}.stufen li.aktiv::before{background:var(--light-gold);border-color:var(--light-gold);box-shadow:0 0 12px var(--gold-glow)}
.konvergenz{position:relative;aspect-ratio:3/2;perspective:1100px}
.kv{position:absolute;border-radius:12px;background:var(--glass);border:1px solid var(--glass-border);box-shadow:var(--shadow-deep);background-image:linear-gradient(150deg,rgba(248,245,239,.1),rgba(248,245,239,.02))}
.kv-1{left:0;top:6%;width:26%;height:34%;transform:rotateY(28deg)}.kv-2{left:4%;top:50%;width:26%;height:34%;transform:rotateY(26deg)}
.kv-3{left:26%;top:0;width:24%;height:30%;transform:rotateY(22deg);opacity:.8}.kv-4{left:28%;top:62%;width:24%;height:30%;transform:rotateY(20deg);opacity:.8}
.kv{background-size:cover;background-position:center;overflow:hidden}
.kv::after{content:"";position:absolute;inset:0;background:linear-gradient(0deg,rgba(5,29,25,.55),rgba(5,29,25,.25))}
.kv-1{background-image:url(../assets/img/home/poster-2.webp)}.kv-2{background-image:url(../assets/img/home/card-webdesign.webp)}.kv-3{background-image:url(../assets/img/home/poster-3.webp)}.kv-4{background-image:url(../assets/img/home/card-ki.webp)}
.kv-fokus::after{display:none}
.kv-fokus{right:0;top:10%;width:50%;height:80%;overflow:hidden;transform:rotateY(-12deg);border-color:rgba(226,168,114,.5)}
.kv-fokus img,.kv-fokus video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.konvergenz>svg{position:absolute;inset:0;width:100%;height:100%;pointer-events:none}

.brand-board{position:relative;aspect-ratio:7/5;border-radius:var(--radius-lg);background:radial-gradient(100% 100% at 30% 20%,#12453a,var(--forest) 60%,var(--forest-dark));border:1px solid var(--glass-border);overflow:hidden}
.bd{position:absolute;border-radius:12px;box-shadow:0 18px 36px rgba(0,0,0,.45)}
.bd-bekannt{left:4%;top:7%;width:60%;height:64%;background:var(--forest-dark);border:1px solid var(--glass-border);color:var(--cream-light);padding:12px;display:flex;flex-direction:column;gap:10px;transform:rotate(-1.5deg);overflow:hidden}
.bd-bekannt picture{flex:1;min-height:0;border-radius:8px;overflow:hidden;display:block}
.bd-bekannt img{width:100%;height:100%;object-fit:cover;object-position:top left}
.bk-label{font:600 .66rem/1.2 var(--font-sans);letter-spacing:.14em;text-transform:uppercase;color:var(--light-gold)}
.bk-fuss{display:flex;justify-content:space-between;align-items:baseline;gap:12px;flex-wrap:wrap}
.bk-name{font:italic 600 clamp(1.5rem,2.6vw,2.2rem)/1 var(--font-serif);color:var(--cream-light)}
.bk-hinweis{font-size:.74rem;color:var(--text-dim)}.bd-aa{left:60%;top:5%;width:34%;height:38%;background:var(--cream-light);color:var(--forest-deep);padding:12px;display:flex;flex-direction:column;justify-content:space-between;transform:rotate(3deg)}
.bd-aa b{font:500 clamp(2.4rem,5vw,4rem)/1 var(--font-serif)}.bd-aa small{font:600 .6rem/1 var(--font-sans);letter-spacing:.14em;text-transform:uppercase;color:#5a6b63}
.bd-farben{left:62%;top:50%;width:32%;display:flex;gap:7px;padding:12px;background:var(--forest-dark);border:1px solid var(--glass-border);transform:rotate(-2deg)}.bd-farben i{width:24px;height:24px}
.bd-ton{left:10%;top:76%;width:56%;padding:14px 16px;background:var(--cream);color:var(--forest-deep);font:italic 500 1.25rem/1.2 var(--font-serif);transform:rotate(-1deg)}.liste{margin-top:var(--space-6);display:grid;gap:0;border-top:1px solid var(--line)}
.liste li{padding:14px 0;border-bottom:1px solid var(--line);font:600 .78rem/1 var(--font-sans);letter-spacing:.16em;text-transform:uppercase;color:var(--cream-light);display:flex;gap:14px;align-items:center}
.liste li::before{content:"";width:6px;height:6px;border-radius:50%;background:var(--light-gold);box-shadow:0 0 8px var(--gold-glow)}

.rahmen-gross{border-radius:var(--radius-lg);overflow:hidden;border:1px solid var(--glass-border);box-shadow:var(--shadow-deep);position:relative}
.rahmen-gross img{width:100%;aspect-ratio:16/9;object-fit:cover}
.rahmen-gross::after{content:"";position:absolute;inset:0;border-radius:inherit;box-shadow:inset 0 1px 0 rgba(226,168,114,.4);pointer-events:none}
.website{background:linear-gradient(180deg,var(--forest-dark),var(--forest-deep))}

.diagnose{padding-bottom:calc(var(--section-y) + 20px)}
.diagnose p:not(.label){margin-top:var(--space-5);max-width:30rem;font-size:var(--fs-lead)}
.analyse{position:relative;border-radius:var(--radius-lg);overflow:hidden;min-height:320px;box-shadow:0 30px 60px rgba(5,29,25,.2)}
.analyse>img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.analyse::before{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(5,29,25,.2),rgba(5,29,25,.65));z-index:1}
.layer{position:relative;z-index:2;margin:var(--space-6) var(--space-5) var(--space-6) auto;max-width:360px;border-radius:var(--radius-md);background:linear-gradient(150deg,rgba(5,29,25,.78),rgba(5,29,25,.6));border:1px solid var(--glass-border);backdrop-filter:blur(8px);overflow:hidden;box-shadow:var(--shadow-deep)}
.layer li{display:flex;justify-content:space-between;align-items:center;padding:14px 18px;border-bottom:1px solid var(--line);font:600 .74rem/1 var(--font-sans);letter-spacing:.14em;text-transform:uppercase;color:var(--cream-light)}
.layer li:last-child{border:0}.layer svg{width:20px;height:20px}
.layer .ok svg{color:var(--moss)}.layer .frage svg{color:var(--light-gold)}.layer .frage span{color:var(--cream-light)}

.marketing{background:var(--forest-dark)}
.kanaele{display:flex;flex-wrap:wrap;gap:10px;margin-top:var(--space-6)}
.kanaele li{padding:9px 16px;border-radius:var(--radius-pill);border:1px solid var(--line-strong);font:600 .7rem/1 var(--font-sans);letter-spacing:.14em;text-transform:uppercase;color:var(--cream-light)}

.motion{background:linear-gradient(180deg,var(--forest-dark),var(--forest-deep))}
.motion-kopf{margin-bottom:var(--space-7)}
.phones{display:grid;grid-template-columns:repeat(2,1fr);gap:var(--space-5) var(--space-4)}
@media(min-width:760px){.phones{grid-template-columns:repeat(3,1fr)}}
@media(min-width:1100px){.phones{grid-template-columns:repeat(6,1fr);gap:var(--space-4)}}
.phone-rahmen{position:relative;aspect-ratio:9/16;border-radius:22px;overflow:hidden;border:1px solid rgba(248,245,239,.3);box-shadow:var(--shadow-deep);background:var(--forest)}
.phone-rahmen img,.phone-rahmen video{width:100%;height:100%;object-fit:cover}
.phone-rahmen::after{content:"";position:absolute;inset:0;background:linear-gradient(0deg,rgba(5,29,25,.5),transparent 45%);pointer-events:none}
.phone .s-play{z-index:2;transition:opacity var(--dur-base),transform var(--dur-base) var(--ease-out)}
.phone:hover .s-play{transform:scale(1.1)}
.phone.echt.spielt .s-play{opacity:0}
.phone h3{font-size:1.2rem;margin-top:14px}.phone p{font-size:.78rem;line-height:1.4;color:var(--text-faint);margin-top:4px}
.tag{position:absolute;left:10px;top:10px;z-index:3;padding:5px 10px;border-radius:var(--radius-pill);background:rgba(5,29,25,.7);border:1px solid var(--line-strong);font:600 .66rem/1 var(--font-sans);letter-spacing:.14em;text-transform:uppercase;color:var(--sage)}
.tag-echt{border-color:rgba(226,168,114,.6);color:var(--light-gold)}
.legende{margin-top:var(--space-7);font-size:.82rem;color:var(--text-faint);display:flex;flex-wrap:wrap;gap:8px 10px;align-items:center}
.legende .tag{position:static}

.ki{overflow:hidden;background:var(--forest-deep)}
.ki-bg{position:absolute;inset:0;z-index:-1;opacity:.28}.ki-bg img{width:100%;height:100%;object-fit:cover}
.ki-bg::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,var(--forest-deep),transparent 30%,transparent 70%,var(--forest-deep))}
.ki-diagramm{margin-top:var(--space-7);color:var(--sage)}
.ki-diagramm svg{width:100%;height:auto;overflow:visible}
.ki-diagramm .pfad{stroke-width:1.3;filter:none}
.ki-diagramm .box rect{fill:rgba(248,245,239,.05);stroke:var(--glass-border)}.ki-diagramm .box text{fill:var(--cream-light)}
.ki-diagramm .out rect{stroke:rgba(226,168,114,.4)}
.ki-diagramm .kern circle{fill:var(--forest);stroke:var(--light-gold);stroke-width:1.2}.ki-diagramm .kern .ring{fill:none;stroke-opacity:.35}.ki-diagramm .kern text{fill:var(--cream-light)}
@media(max-width:759px){.ki-diagramm{overflow-x:auto;margin-inline:calc(var(--gutter) * -1);padding-inline:var(--gutter)}.ki-diagramm svg{min-width:640px}}

.ueber p:not(.label):not(.hintergrund){margin-top:var(--space-5);max-width:32rem;font-size:var(--fs-lead)}
.hintergrund{margin-top:var(--space-6);padding-top:var(--space-4);border-top:1px solid rgba(5,29,25,.18);font-size:.9rem;color:#31403a;max-width:32rem}
.hintergrund b{font-family:var(--font-serif);font-size:1.3rem;font-weight:500;color:var(--ink-on-cream);margin-right:6px}
.portraet{border-radius:var(--radius-lg);overflow:hidden;box-shadow:0 30px 60px rgba(5,29,25,.25);max-width:420px;justify-self:end}
.portraet img{width:100%;aspect-ratio:4/5;object-fit:cover}
@media(max-width:999px){.portraet{justify-self:start}}

/* ===== 6 Final CTA + Formular ===== */
.final{overflow:hidden;padding-block:calc(var(--section-y) + 20px)}
.final-bg{position:absolute;inset:0;z-index:-1}.final-bg img{width:100%;height:100%;object-fit:cover;object-position:70% 40%;opacity:.55}
.final-bg::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(5,29,25,.92),rgba(5,29,25,.6) 55%,rgba(5,29,25,.85)),linear-gradient(0deg,var(--forest-deep),transparent 30%)}
.final-grid{display:grid;gap:var(--space-8);align-items:start}
@media(min-width:1000px){.final-grid{grid-template-columns:5fr 6fr}}
.final h2{font-size:var(--fs-h1);line-height:1}
.final-sub{margin-top:var(--space-5);font:500 clamp(1.4rem,1.1rem + 1.2vw,2rem)/1.25 var(--font-serif);color:var(--cream-light);max-width:26rem}
.claim{margin-top:var(--space-7);font:500 var(--fs-h2)/1.05 var(--font-serif);color:var(--cream-light);letter-spacing:-.015em}
.formular{display:grid;gap:var(--space-4);padding:clamp(20px,3vw,36px);border-radius:var(--radius-lg);background:linear-gradient(150deg,rgba(248,245,239,.09),rgba(248,245,239,.03));border:1px solid var(--glass-border);box-shadow:var(--shadow-deep);backdrop-filter:blur(6px)}
.form-titel{font-size:1.6rem}
.reihe{display:grid;gap:var(--space-4)}@media(min-width:640px){.reihe{grid-template-columns:1fr 1fr}}
.feld-zeile{display:grid;gap:6px}
.formular label{font-size:.78rem;font-weight:500;color:var(--cream-light);letter-spacing:.02em}
.noetig{margin-left:6px;font-size:.68rem;color:var(--light-gold);font-weight:500}
.formular input,.formular textarea,.formular select{width:100%;min-height:48px;padding:12px 14px;border-radius:var(--radius-sm);background:rgba(5,29,25,.55);border:1px solid var(--line-strong);color:var(--cream-light);font:inherit;font-size:1rem}
.formular textarea{min-height:96px;resize:vertical}
.formular input::placeholder{color:var(--text-faint)}
.formular input:focus,.formular textarea:focus,.formular select:focus{outline:2px solid var(--light-gold);outline-offset:1px;border-color:transparent}
.formular select option{background:var(--forest-deep);color:var(--cream-light)}
.feld-hinweis{font-size:.8rem;line-height:1.5;color:var(--text-faint)}
.feld-hinweis a{display:inline-block;padding:4px 0;text-decoration:underline;text-underline-offset:3px;color:var(--text-dim)}
.formular .btn{justify-self:start}
.direkt{display:grid;gap:8px;margin-top:var(--space-3);padding-top:var(--space-4);border-top:1px solid var(--line);font-size:.9rem}
.direkt li{display:flex;gap:14px}.direkt span{width:70px;color:var(--sage);font-size:.74rem;letter-spacing:.12em;text-transform:uppercase;padding-top:2px}
.direkt a{display:inline-block;padding:10px 0;color:var(--cream-light);text-decoration:underline;text-decoration-color:var(--line-strong);text-underline-offset:3px}

/* ===== 7 Footer ===== */
.fuss{background:var(--forest-deep);border-top:1px solid var(--line);padding-block:var(--space-8) var(--space-6);font-size:.9rem}
.fuss-gitter{display:grid;gap:var(--space-7)}@media(min-width:760px){.fuss-gitter{grid-template-columns:1.2fr 1fr 1fr 1fr}}
.fuss .wortmarke{font-size:.9rem}.fuss-claim{margin-top:var(--space-4);font:italic 400 1.4rem/1.2 var(--font-serif);color:var(--moss)}
.fuss-titel{font:600 .7rem/1 var(--font-sans);letter-spacing:.18em;text-transform:uppercase;color:var(--sage);margin-bottom:var(--space-4);letter-spacing:.18em}
.fuss li a{display:inline-block;padding:11px 0;color:var(--text-dim)}.fuss li a:hover{color:var(--cream-light)}
.fuss-unten{display:flex;flex-wrap:wrap;justify-content:space-between;gap:8px;margin-top:var(--space-8);padding-top:var(--space-5);border-top:1px solid var(--line);font-size:.8rem;color:var(--text-faint)}
.kontaktleiste{position:fixed;left:0;right:0;bottom:0;z-index:var(--z-header);display:none;gap:10px;padding:10px var(--gutter) calc(10px + env(safe-area-inset-bottom));background:rgba(5,29,25,.92);backdrop-filter:blur(10px);border-top:1px solid var(--line)}
.kontaktleiste.da{display:flex}.kontaktleiste .btn{flex:1;min-height:48px;padding:12px 14px}
@media(min-width:1000px){.kontaktleiste{display:none!important}}

/* ===== 8 Bewegung ===== */
html.bewegung [data-in],html.bewegung [data-reveal]{opacity:0}
html.bewegung h1 .zeile>span{transform:translateY(110%)}
html.bewegung .karte-visual .k-licht,html.bewegung .pfad,html.bewegung .ll-core,html.bewegung .ll-glow{stroke-dashoffset:1}
html.bewegung .screen{opacity:0;translate:0 56px}
html.bewegung .screens.bereit .screen{opacity:1;translate:0 0;transition:translate 1.2s var(--ease-out),opacity 1s ease,transform var(--dur-slow) var(--ease-out)}
html.bewegung .screens.bereit .screen:nth-child(2){transition-delay:.08s}html.bewegung .screens.bereit .screen:nth-child(3){transition-delay:.16s}html.bewegung .screens.bereit .screen:nth-child(4){transition-delay:.24s}html.bewegung .screens.bereit .screen:nth-child(5){transition-delay:.32s}html.bewegung .screens.bereit .screen:nth-child(6){transition-delay:.4s}
@media(prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  html.bewegung [data-in],html.bewegung [data-reveal]{opacity:1}
  html.bewegung h1 .zeile>span{transform:none}
  html.bewegung .k-licht,html.bewegung .pfad,html.bewegung .ll-core,html.bewegung .ll-glow{stroke-dashoffset:0}
  html.bewegung .screen{opacity:1;translate:none}
  *,*::before,*::after{transition-duration:.01ms!important;animation-duration:.01ms!important}
}

/* Video-Bänder als Übergänge (Vorschau-Videos mit Kling-Wasserzeichen) */
.band-video{position:relative;height:clamp(190px,32vw,440px);overflow:hidden;background:var(--forest)}
.band-video img,.band-video video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.band-video::before,.band-video::after{content:"";position:absolute;left:0;right:0;z-index:2;pointer-events:none}
.band-video::before{top:0;height:55%}.band-video::after{bottom:0;height:60%}
.band-ueber{margin-top:calc(-1 * clamp(48px,6vw,96px));margin-bottom:var(--space-7)}
.band-ueber::before{background:linear-gradient(180deg,var(--forest) 0,rgba(12,51,43,0))}
.band-ueber::after{background:linear-gradient(0deg,var(--forest) 0,rgba(12,51,43,0))}
.band-hell{background:var(--forest-deep)}
.band-hell::before{background:linear-gradient(180deg,var(--forest-deep) 0,rgba(5,29,25,0))}
.band-hell::after{background:linear-gradient(0deg,var(--cream) 0,rgba(242,238,229,0))}
.idee{padding-top:0}
.idee-grid{padding-top:var(--space-7)}

/* Motion-Kacheln ohne Inhalt: Coming soon */
.phone.kommt .phone-rahmen img{filter:brightness(.5) saturate(.75)}
.soon{position:absolute;left:50%;top:50%;z-index:3;transform:translate(-50%,-50%);padding:10px 16px;border-radius:999px;background:rgba(5,29,25,.72);border:1px solid var(--line-strong);font:600 .68rem/1 var(--font-sans);letter-spacing:.16em;text-transform:uppercase;color:var(--cream-light);white-space:nowrap;backdrop-filter:blur(2px)}
.phone.kommt h3,.phone.kommt p{opacity:.78}

/* Arbeitsweise, Preise, Fragen */
.weg{background:linear-gradient(180deg,var(--forest-deep),var(--forest-dark))}
.schritte{display:grid;gap:var(--space-6);margin-top:var(--space-8);grid-template-columns:1fr}
@media(min-width:640px){.schritte{grid-template-columns:repeat(2,1fr)}}
@media(min-width:1100px){.schritte{grid-template-columns:repeat(4,1fr);gap:var(--space-5)}}
.schritte li{position:relative;padding-top:var(--space-5);border-top:1px solid var(--line-strong)}
.schritte li::before{content:"";position:absolute;left:0;top:-4px;width:7px;height:7px;border-radius:50%;background:var(--light-gold);box-shadow:0 0 10px var(--gold-glow)}
.s-nr{display:block;font:italic 400 clamp(2.6rem,4vw,3.6rem)/1 var(--font-serif);color:var(--moss);margin-bottom:var(--space-3)}
.schritte h3{margin-bottom:var(--space-3)}
.schritte p{font-size:.95rem;color:var(--text-dim);max-width:24rem}

.faq details{border-bottom:1px solid var(--line)}
.faq details:first-child{border-top:1px solid var(--line)}
.faq summary{display:flex;justify-content:space-between;align-items:center;gap:var(--space-4);padding:20px 0;cursor:pointer;list-style:none;font:500 clamp(1.15rem,1.05rem + .5vw,1.5rem)/1.25 var(--font-serif);color:var(--cream-light);min-height:56px}
.faq summary::-webkit-details-marker{display:none}
.faq summary:hover{color:#fff}
.kreuz{position:relative;flex:none;width:18px;height:18px}
.kreuz::before,.kreuz::after{content:"";position:absolute;left:0;right:0;top:50%;height:1.5px;background:var(--light-gold);transition:transform var(--dur-base) var(--ease-out)}
.kreuz::after{transform:rotate(90deg)}
.faq details[open] .kreuz::after{transform:rotate(0)}
.antwort{padding:0 0 22px;max-width:44rem;color:var(--text-dim)}
.antwort p+p{margin-top:var(--space-3)}
.antwort strong{color:var(--cream-light);font-weight:600}
.faq-schmal{margin-top:var(--space-8);max-width:52rem}
.fragen-grid{display:grid;gap:var(--space-7)}
@media(min-width:1000px){.fragen-grid{grid-template-columns:4fr 7fr;gap:var(--space-8)}.fragen-grid>div:first-child{position:sticky;top:calc(var(--header-h) + 24px);align-self:start}}
.fragen-sektion{background:var(--forest-deep)}

.lead-hell{font-size:var(--fs-lead);line-height:1.6;color:#31403a;max-width:40rem;margin-top:var(--space-5)}
.preise{margin-top:var(--space-8);border-bottom:1px solid rgba(5,29,25,.18)}
.preise li{display:grid;gap:var(--space-4);padding:var(--space-6) 0;border-top:1px solid rgba(5,29,25,.18);align-items:start}
@media(min-width:760px){.preise li{grid-template-columns:minmax(220px,300px) 1fr;gap:var(--space-7)}}
.preis{font:500 clamp(2.3rem,1.6rem + 2.4vw,3.6rem)/1 var(--font-serif);color:var(--ink-on-cream);letter-spacing:-.02em}
.preis small{display:block;margin-top:8px;font:600 .68rem/1 var(--font-sans);letter-spacing:.16em;text-transform:uppercase;color:#4d6b52}
.preise h3{margin-bottom:var(--space-2)}
.preise p:not(.preis){max-width:34rem;color:#31403a}
.warum{margin-top:var(--space-8);font:600 .72rem/1 var(--font-sans);letter-spacing:.18em;text-transform:uppercase;color:#4d6b52}
.gruende{display:grid;gap:var(--space-5);margin-top:var(--space-5);grid-template-columns:1fr}
@media(min-width:1000px){.gruende{grid-template-columns:repeat(3,1fr);gap:var(--space-6)}}
.gruende li{padding-top:var(--space-4);border-top:1px solid rgba(5,29,25,.18);color:#31403a;font-size:.98rem}
.gruende strong{display:block;margin-bottom:6px;font:500 1.3rem/1.2 var(--font-serif);color:var(--ink-on-cream)}
.preise-sektion .btn-dark{margin-top:var(--space-7)}

/* Projektbeispiele: NATURMAN und ZYNORA */
.brand-board.brand-projekte{aspect-ratio:auto;display:grid;gap:20px;padding:22px;overflow:visible}
.projekt-karte{min-width:0;padding:16px;border:1px solid var(--glass-border);border-radius:12px;background:var(--forest-dark);box-shadow:0 12px 28px rgba(0,0,0,.18);display:grid;gap:12px}
.projekt-bild{display:block;position:relative;aspect-ratio:2.17;overflow:hidden;border-radius:8px;background:#101214}
.projekt-bild>img{display:block;width:100%;height:100%;object-fit:cover;object-position:top left}
.projekt-zynora{border-color:rgba(248,185,40,.24)}
.projekt-zynora .bk-label{color:#f8b928}
.zynora-bild::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(16,18,20,.9),rgba(16,18,20,.25));pointer-events:none}
.projekt-bild>.zynora-infrastruktur{object-position:center}
.projekt-bild>.zynora-logo{position:absolute;z-index:1;left:7%;top:50%;transform:translateY(-50%);width:62%;height:auto;object-fit:contain}
.projekt-beschreibung{margin:0;font-size:.85rem;line-height:1.6;color:var(--text-dim)}
@media(max-width:600px){.brand-board.brand-projekte{padding:14px;gap:14px}.projekt-karte{padding:12px}.projekt-karte .bk-fuss{gap:8px}.projekt-karte .bk-label{font-size:.6rem;letter-spacing:.08em}}

/* Navigation: Projekte statt Motion Graphics */
#projekte{scroll-margin-top:110px}
.brand-projekte .projekte-label{margin:0;font-family:var(--font-sans);font-size:.75rem;line-height:1.4;font-weight:600}
.projekt-link{display:inline-flex;align-items:center;gap:10px;justify-self:start;min-height:44px;color:var(--cream-light);font-size:.85rem;text-decoration:underline;text-underline-offset:5px}
.projekt-link:hover{color:var(--light-gold)}
.projekt-link:focus-visible{outline:2px solid var(--light-gold);outline-offset:5px;border-radius:3px}