:root{
  --stone:#E8E6E1;
  --ink:#0B0B0B;
  --soft:#6F6B65;
  --hair:#C7C3BC;
  --white:#F7F6F4;
  --ease:cubic-bezier(.22,.61,.36,1);

  /* Ueberschriften: Archivo, breite Schnittweite */
  --display:'Archivo';
  --dw:500;
  --dls:.02em;
  --dcase:uppercase;
  --dlh:1.06;
  --dstretch:118%;
  --dscale:.88;

  /* Fliesstext, Navigation, Labels: Montserrat */
  --body:'Montserrat';
}

*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth;background:#000}
body{
  background:var(--stone);color:var(--ink);
  font-family:var(--body),'Helvetica Neue',Arial,sans-serif;font-size:16px;line-height:1.62;
  -webkit-font-smoothing:antialiased;overflow-x:hidden;
}
a{color:inherit;text-decoration:none}
:focus-visible{outline:1px solid currentColor;outline-offset:5px}

.d{
  font-family:var(--display),'Helvetica Neue',Arial,sans-serif;
  font-weight:var(--dw);letter-spacing:var(--dls);
  text-transform:var(--dcase);line-height:var(--dlh);
  font-stretch:var(--dstretch);
  transition:letter-spacing .4s var(--ease);
}
.u{font-family:var(--body),sans-serif;font-size:10px;font-weight:500;letter-spacing:.3em;text-transform:uppercase}
.wrap{max-width:1320px;margin:0 auto;padding:0 40px}

/* Letterbox-Auftakt */
.lb{position:fixed;left:0;right:0;background:#000;z-index:95;pointer-events:none;height:14vh;transition:height 1.6s var(--ease) .3s}
.lb.top{top:0}.lb.bot{bottom:0}
body.opened .lb{height:0}
@media(prefers-reduced-motion:reduce){.lb{height:0;transition:none}}

/* Navigation */
.nav{
  position:fixed;top:26px;left:0;right:0;z-index:80;
  display:flex;justify-content:center;pointer-events:none;
}
.nav-in{
  display:inline-flex;align-items:center;gap:20px;
  height:48px;padding:0 6px 0 14px;border-radius:24px;line-height:1;
  color:var(--white);pointer-events:auto;max-width:calc(100vw - 48px);
  /* --nb laeuft gleitend von 0 (dunkler Abschnitt) bis 1 (heller Abschnitt) */
  background:rgba(14,14,14,calc(.82 + .14 * var(--nb, 0)));
  border:1px solid rgba(247,246,244,calc(.22 - .08 * var(--nb, 0)));
}
.nav-in .brand{display:flex;align-items:center;gap:10px;white-space:nowrap}
.nlogo{height:34px;width:auto;display:block;flex:none}
.ntype{display:flex;flex-direction:column;justify-content:center}
.nname{font-family:var(--display),sans-serif;font-weight:var(--dw);font-stretch:var(--dstretch);font-size:11px;letter-spacing:.18em;text-transform:uppercase;line-height:1.1}
.nsub{font-family:var(--body),sans-serif;font-weight:500;font-size:7px;letter-spacing:.24em;text-transform:uppercase;color:rgba(247,246,244,.55);margin-top:4px;line-height:1.1}
@media(max-width:900px){.nlogo{height:28px}.nname{font-size:9.5px;letter-spacing:.14em}.nsub{display:none}}
.nav-in .links{display:flex;gap:18px}
.nav-in .links a{font-size:8.5px;letter-spacing:.16em;text-transform:uppercase;opacity:.65;transition:opacity .25s}
.nav-in .links a:hover{opacity:1}
.pill{display:inline-flex;align-items:center;height:28px;font-size:8.5px;font-weight:500;letter-spacing:.16em;text-transform:uppercase;padding:0 14px;border-radius:999px;background:var(--white);color:var(--ink);white-space:nowrap;transition:opacity .3s}
.pill:hover{opacity:.82}

/* Platten */
.plate{position:relative;min-height:100svh;display:flex;flex-direction:column;justify-content:center;align-items:center;text-align:center;color:var(--white);overflow:hidden;padding:132px 40px 92px}
.plate .bg{position:absolute;inset:0;z-index:0;filter:saturate(.4) contrast(1.05);overflow:hidden}
.plate .bg video{width:100%;height:100%;object-fit:cover}
.plate .bg::after{content:"";position:absolute;inset:0;background:radial-gradient(120% 90% at 50% 45%,transparent 0%,rgba(0,0,0,.36) 58%,rgba(0,0,0,.84) 100%)}
.plate .grain{position:absolute;inset:0;z-index:1;opacity:.055;mix-blend-mode:overlay;pointer-events:none;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='3'/%3E%3C/filter%3E%3Crect width='160' height='160' filter='url(%23n)'/%3E%3C/svg%3E")}
.plate .inner{position:relative;z-index:2;max-width:1180px;width:100%}

.b1{background:radial-gradient(118% 96% at 60% 42%,#7C6247 0%,#3A2A1B 44%,#0A0706 100%)}
.b2{background:linear-gradient(154deg,#1E3346 0%,#345A79 42%,#070C12 100%)}
.b3{background:radial-gradient(96% 88% at 34% 54%,#37544F 0%,#182A27 50%,#070B0B 100%)}
.b4{background:radial-gradient(130% 76% at 74% 58%,#61646B 0%,#1F2226 40%,#000 100%)}
.b5{background:radial-gradient(120% 90% at 50% 55%,#2A2C30 0%,#111214 50%,#000 100%)}

/* Showreel-Auftakt */
.reel{padding:0;min-height:100svh;justify-content:flex-end;align-items:stretch;text-align:left}
.reel video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:0;filter:saturate(.62) contrast(1.04) brightness(.92)}
.reel .veil{position:absolute;inset:0;z-index:1;background:linear-gradient(180deg,rgba(0,0,0,.5) 0%,transparent 26%,transparent 58%,rgba(0,0,0,.72) 100%)}
.reel .foot{position:relative;z-index:3;display:flex;justify-content:space-between;align-items:flex-end;gap:28px;flex-wrap:wrap;padding:0 44px 44px}
.reel .foot .u{opacity:.72}
.reel .foot .rt{display:flex;gap:26px;align-items:center}
.mute{display:flex;align-items:center;gap:9px;font-size:9.5px;letter-spacing:.24em;text-transform:uppercase;opacity:.72;cursor:pointer;background:none;border:none;color:inherit;font-family:inherit;padding:0}
.mute i{display:block;width:6px;height:6px;border-radius:50%;background:currentColor}
.cue{display:flex;flex-direction:column;align-items:center;gap:10px;opacity:.6}
.cue i{width:1px;height:40px;background:linear-gradient(var(--white),transparent)}
@media(prefers-reduced-motion:no-preference){.cue i{animation:drop 2.6s var(--ease) infinite}}
@keyframes drop{0%{transform:scaleY(.15);transform-origin:top}45%{transform:scaleY(1);transform-origin:top}46%{transform-origin:bottom}100%{transform:scaleY(0);transform-origin:bottom}}

/* Statement */
.stmt{background:#080808;min-height:auto;padding:180px 40px}
.stmt h1{font-size:calc(clamp(1.5rem,4.6vw,4rem) * var(--dscale));max-width:none;margin:0 auto;text-wrap:balance}
.stmt h1 br{display:inline}
@media(max-width:560px){.stmt h1{font-size:calc(clamp(1.35rem,7vw,2.4rem) * var(--dscale))}}
.stmt .sub{margin:36px auto 0;max-width:44ch;font-size:15px;color:rgba(247,246,244,.66)}
.stmt .sub.threeline{max-width:64ch;line-height:1.85}
@media(max-width:760px){.stmt .sub.threeline{max-width:40ch;line-height:1.7}.stmt .sub.threeline br{display:none}}

/* Werke */
.work .idx{display:block;opacity:.6;margin-bottom:26px}
.work h2{font-size:calc(clamp(1.9rem,5.6vw,4.6rem) * var(--dscale))}
.work .line{margin:26px auto 0;max-width:40ch;font-size:15px;color:rgba(247,246,244,.72)}
.work .facts{position:absolute;left:0;right:0;bottom:0;z-index:2;display:flex;justify-content:space-between;gap:20px;flex-wrap:wrap;padding:22px 44px;border-top:1px solid rgba(247,246,244,.18)}
.work .facts span{font-size:9.5px;letter-spacing:.24em;text-transform:uppercase;color:rgba(247,246,244,.6)}
.work .facts span b{color:var(--white);font-weight:400}

/* Arbeiten: Film startet erst auf Knopfdruck, vorher nur Standbild */
.plate .bg::after{pointer-events:none;transition:opacity .5s var(--ease)}
.plate .bg{transition:filter .5s var(--ease)}
.wplay{display:inline-flex;align-items:center;gap:14px;margin-top:34px;background:none;border:none;color:var(--white);font-family:inherit;cursor:pointer;padding:0}
.wplay i{position:relative;display:block;width:52px;height:52px;border-radius:50%;border:1px solid rgba(247,246,244,.6);transition:background .3s,border-color .3s}
.wplay i::after{content:"";position:absolute;left:21px;top:18px;border-style:solid;border-width:8px 0 8px 12px;border-color:transparent transparent transparent var(--white);transition:border-color .3s}
.wplay:hover i{background:var(--white);border-color:var(--white)}
.wplay:hover i::after{border-left-color:var(--ink)}
.wplay span{font-size:9.5px;font-weight:500;letter-spacing:.24em;text-transform:uppercase;opacity:.8}
.wclose{display:none;position:absolute;top:96px;right:44px;z-index:3;height:34px;padding:0 16px;border-radius:17px;border:1px solid rgba(247,246,244,.5);background:rgba(0,0,0,.35);color:var(--white);font-family:inherit;font-size:9px;font-weight:500;letter-spacing:.18em;text-transform:uppercase;cursor:pointer;transition:background .3s,color .3s}
.wclose:hover{background:var(--white);color:var(--ink)}
.work .inner,.work .facts,.work .grain{transition:opacity .5s var(--ease)}
.work.playing .bg{filter:none;z-index:2}
.work.playing .bg::after{opacity:0}
.work.playing .bg video{object-fit:contain;background:#000}
.work.playing .inner,.work.playing .facts,.work.playing .grain{opacity:0;pointer-events:none}
.work.playing .wclose{display:inline-flex;align-items:center}
@media(max-width:900px){.wclose{top:70px;right:24px}}

/* Helle Abschnitte */
.light{background:var(--stone);color:var(--ink);padding:150px 0}
.head{display:flex;justify-content:space-between;align-items:baseline;gap:30px;border-bottom:1px solid var(--hair);padding-bottom:16px;margin-bottom:76px}
.head .u{color:var(--soft);white-space:nowrap}
h3.big{font-size:calc(clamp(1.5rem,3.4vw,2.7rem) * var(--dscale));max-width:16ch}
h3.big.name{max-width:none;white-space:nowrap}
@media(max-width:560px){h3.big.name{white-space:normal}}
.about{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,.86fr);gap:88px;align-items:start}
.about p{font-size:17px;color:#3B3934;margin-bottom:22px;max-width:44ch}
.about p:first-child{font-size:clamp(1.15rem,1.9vw,1.5rem);line-height:1.42;color:var(--ink)}
.reg div{display:flex;justify-content:space-between;gap:24px;padding:15px 0;border-bottom:1px solid var(--hair)}
.reg div:first-child{border-top:1px solid var(--ink)}
.reg dt{font-size:11px;font-weight:500;letter-spacing:.14em;text-transform:uppercase;color:var(--soft);padding-top:2px}
.reg dd{font-size:12.5px;text-align:right}

/* Stimmen — Rezensionen in Text- und Videoform */
.voices{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:56px;align-items:start}
.quotes blockquote{margin:0 0 30px;padding-bottom:30px;border-bottom:1px solid var(--hair)}
.quotes blockquote:last-child{border-bottom:none;padding-bottom:0;margin-bottom:0}
.quotes p{font-size:clamp(1.02rem,1.6vw,1.24rem);line-height:1.5;color:var(--ink);margin-bottom:16px}
.quotes .who{display:flex;align-items:baseline;gap:10px;flex-wrap:wrap;font-size:9.5px;letter-spacing:.2em;text-transform:uppercase;color:var(--soft)}
.quotes .who b{color:var(--ink);font-weight:500}
.vids{display:grid;grid-template-columns:1fr 1fr;gap:18px}
.vtile{position:relative;aspect-ratio:4/5;overflow:hidden;background:#15171B;display:block}
.vtile video,.vtile img{width:100%;height:100%;object-fit:cover;display:block;filter:saturate(.5) contrast(1.03) brightness(.86)}
.vtile .ph{position:absolute;inset:0;background:radial-gradient(120% 100% at 50% 35%,#3E434A 0%,#1A1D21 52%,#0B0C0E 100%)}
.vtile .play{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:44px;height:44px;border-radius:50%;border:1px solid rgba(247,246,244,.6);display:flex;align-items:center;justify-content:center;color:#F7F6F4;font-size:11px;transition:background .3s,color .3s}
.vtile:hover .play{background:#F7F6F4;color:#0B0B0B}
.vtile figcaption{position:absolute;left:0;right:0;bottom:0;z-index:2;padding:12px 13px;font-size:9px;letter-spacing:.18em;text-transform:uppercase;color:rgba(247,246,244,.8);background:linear-gradient(transparent,rgba(0,0,0,.75))}
.leave{margin-top:52px;padding-top:26px;border-top:1px solid var(--ink);display:flex;justify-content:space-between;align-items:center;gap:24px;flex-wrap:wrap}
.leave p{font-size:16px;color:#3B3934;max-width:44ch;margin:0}
.leave .acts{display:flex;gap:10px;flex-wrap:wrap}
.lbtn{display:inline-flex;align-items:center;height:38px;padding:0 18px;border-radius:19px;border:1px solid var(--ink);font-size:9px;font-weight:500;letter-spacing:.18em;text-transform:uppercase;transition:background .3s,color .3s}
.lbtn:hover{background:var(--ink);color:var(--stone)}
.lbtn.fill{background:var(--ink);color:var(--stone)}
.lbtn.fill:hover{background:transparent;color:var(--ink)}
@media(max-width:900px){.voices{grid-template-columns:1fr;gap:38px}.leave{flex-direction:column;align-items:flex-start;gap:18px}}

/* Signet — ruhige Bildtafel zwischen den Abschnitten */
.ident{background:#000;min-height:100svh;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:110px 40px;position:relative;overflow:hidden}
.ident .grain{position:absolute;inset:0;z-index:1;opacity:.05;mix-blend-mode:overlay;pointer-events:none}
.ilock{position:relative;z-index:2;display:flex;align-items:center;gap:clamp(20px,3.4vw,44px)}
.ilock img{height:min(42vh,300px);width:auto;display:block;flex:none}
.itype{text-align:left}
.iname{font-family:var(--display),sans-serif;font-weight:var(--dw);font-stretch:var(--dstretch);font-size:clamp(1.05rem,2.9vw,2.3rem);letter-spacing:.16em;text-transform:uppercase;color:var(--white);line-height:1.12}
.isub{font-family:var(--body),sans-serif;font-weight:500;font-size:clamp(8px,.95vw,11px);letter-spacing:.3em;text-transform:uppercase;color:rgba(247,246,244,.5);margin-top:clamp(10px,1.3vw,16px)}
@media(max-width:640px){.ilock{flex-direction:column;gap:26px}.itype{text-align:center}.ilock img{height:min(30vh,200px)}}
.ident .line{position:relative;z-index:2;margin-top:38px;font-size:10px;font-weight:500;letter-spacing:.34em;text-transform:uppercase;color:rgba(247,246,244,.5)}
.ident-cue{position:absolute;left:50%;bottom:44px;transform:translateX(-50%);z-index:3;opacity:.45}
.ident-cue i{display:block;width:1px;height:44px;background:linear-gradient(rgba(247,246,244,.9),transparent)}
@media(prefers-reduced-motion:no-preference){.ident-cue i{animation:drop 2.6s var(--ease) infinite}}
@media(max-width:900px){.ident{min-height:100svh;padding:80px 24px}.ident img{height:min(34vh,220px)}}

/* Briefing — Auswahl und vorbereitete Fragen */
.bf{border-top:1px solid var(--ink)}
.bfield{padding:26px 0;border-bottom:1px solid var(--hair)}
.bfield legend,.blabel{display:block;font-size:11px;font-weight:500;letter-spacing:.14em;text-transform:uppercase;color:var(--soft);margin-bottom:15px;padding:0}
.bopts{display:flex;flex-wrap:wrap;gap:8px}
.bopt{position:relative}
.bopt input{position:absolute;opacity:0;width:0;height:0}
.bopt span{display:inline-flex;align-items:center;height:38px;padding:0 16px;border:1px solid var(--hair);border-radius:19px;font-size:13.5px;cursor:pointer;transition:background .25s,color .25s,border-color .25s;user-select:none}
.bopt span:hover{border-color:var(--soft)}
.bopt input:checked+span{background:var(--ink);color:var(--stone);border-color:var(--ink)}
.bopt input:focus-visible+span{outline:1px solid var(--ink);outline-offset:3px}
.bhint{margin-top:13px;font-size:13.5px;line-height:1.55;color:var(--soft);max-width:52ch}
.bq{display:grid;grid-template-columns:1fr 1fr;gap:0 48px}
.bq .q{padding:22px 0;border-bottom:1px solid var(--hair)}
.bq .q label{display:block;font-size:13.5px;color:var(--ink);margin-bottom:9px;line-height:1.45}
.bq .q .sub{display:block;font-size:12.5px;color:var(--soft);margin-top:3px}
.bin{width:100%;background:transparent;border:none;border-bottom:1px solid var(--hair);padding:9px 0;font-family:var(--body),sans-serif;font-size:15px;color:var(--ink);resize:vertical}
.bin:focus{outline:none;border-bottom-color:var(--ink)}
.bin::placeholder{color:#A9A59D}
textarea.bin{min-height:62px;line-height:1.55}
.bsend{margin-top:34px;display:flex;justify-content:space-between;align-items:center;gap:24px;flex-wrap:wrap;padding-top:26px;border-top:1px solid var(--ink)}
.bsend p{font-size:14px;color:var(--soft);max-width:46ch;margin:0}
.bbtn{display:inline-flex;align-items:center;height:44px;padding:0 26px;border-radius:22px;background:var(--ink);color:var(--stone);border:1px solid var(--ink);font-family:var(--body),sans-serif;font-size:9.5px;font-weight:500;letter-spacing:.18em;text-transform:uppercase;cursor:pointer;transition:background .25s,color .25s}
.bbtn:hover{background:transparent;color:var(--ink)}
@media(max-width:900px){.bq{grid-template-columns:1fr;gap:0}.bsend{flex-direction:column;align-items:flex-start}}

/* Unternehmen — zweispaltiger Fließtext */
.company{display:grid;grid-template-columns:1fr 1fr;gap:64px;align-items:start}
.company p{font-size:16.5px;color:#3B3934;margin-bottom:18px;max-width:46ch}
.company .lead{font-size:clamp(1.1rem,1.8vw,1.42rem);line-height:1.4;color:var(--ink);margin-bottom:22px}
@media(max-width:900px){.company{grid-template-columns:1fr;gap:0}}

/* Gründer — Porträt & Fließtext */
.founder{grid-template-columns:minmax(0,.5fr) minmax(0,1fr) minmax(0,.62fr);gap:52px}
.portrait{position:relative;aspect-ratio:4/5;overflow:hidden;background:#14161A}
.portrait img{width:100%;height:100%;object-fit:cover;display:block}
.portrait figcaption{position:absolute;left:0;right:0;bottom:0;padding:14px 15px;font-size:9px;letter-spacing:.2em;text-transform:uppercase;color:rgba(247,246,244,.72);background:linear-gradient(transparent,rgba(0,0,0,.72))}
.about .lead{font-size:clamp(1.1rem,1.8vw,1.42rem);line-height:1.4;color:var(--ink);margin-bottom:22px}
@media(max-width:900px){.founder{grid-template-columns:1fr;gap:32px}.portrait{max-width:280px}}

/* Ablauf — Prozessschritte */
.steps{margin-top:2px}
.steps .step{padding:24px 0;border-bottom:1px solid var(--hair)}
.steps .step:first-child{border-top:1px solid var(--ink)}
.steps .num{display:block;font-size:9.5px;font-weight:500;letter-spacing:.2em;text-transform:uppercase;color:var(--soft);margin-bottom:11px}
.steps h4{font-size:clamp(1.05rem,2vw,1.35rem);letter-spacing:-.01em;margin-bottom:7px}
.about .steps p{font-size:15px;color:var(--soft);max-width:38ch;margin:0}

.svc{border-top:1px solid var(--ink)}
.svc a{display:grid;grid-template-columns:66px minmax(0,1fr) minmax(0,.9fr) 34px;gap:34px;align-items:center;padding:32px 0;border-bottom:1px solid var(--hair);transition:padding .45s var(--ease)}
.svc a:hover{padding-left:22px}
.svc .n{font-size:9.5px;letter-spacing:.2em;color:var(--soft)}
.svc h4{font-size:calc(clamp(1.05rem,2vw,1.6rem) * var(--dscale))}
.svc p{font-size:15.5px;color:var(--soft);max-width:38ch}
.svc .arw{justify-self:end;font-size:17px;color:var(--soft);transition:transform .45s var(--ease)}
.svc a:hover .arw{transform:translateX(8px);color:var(--ink)}

.end h2{font-size:calc(clamp(1.8rem,5vw,4rem) * var(--dscale))}
.end .sub{margin:30px auto 0;max-width:42ch;font-size:15px;color:rgba(247,246,244,.7)}
.end .addr{display:inline-block;margin-top:44px;font-size:clamp(.95rem,1.7vw,1.3rem);letter-spacing:.16em;text-transform:uppercase;padding-bottom:10px;border-bottom:1px solid rgba(247,246,244,.4)}
.end .addr:hover{border-bottom-color:var(--white)}

footer{background:var(--ink);color:rgba(247,246,244,.55);padding:64px 0 54px}
.fg{display:grid;grid-template-columns:2fr 1fr 1fr 1fr;gap:34px;margin-bottom:52px}
.fg h5{font-size:9px;font-weight:500;letter-spacing:.26em;text-transform:uppercase;color:rgba(247,246,244,.4);margin-bottom:16px}
.fg a{display:block;padding:4px 0;font-size:14.5px}
.fg a:hover{color:var(--white)}
.flock{display:flex;align-items:center;gap:16px}
.flogo{display:block;height:92px;width:auto;flex:none}
.ftype .fname{font-family:var(--display),sans-serif;font-weight:var(--dw);font-stretch:var(--dstretch);font-size:16px;letter-spacing:.2em;text-transform:uppercase;color:var(--white);line-height:1.15;white-space:nowrap}
.ftype .fsub{font-size:9px;font-weight:500;letter-spacing:.26em;text-transform:uppercase;color:rgba(247,246,244,.5);margin-top:7px;white-space:nowrap}
@media(max-width:900px){.flogo{height:74px}.ftype .fname{font-size:14px;letter-spacing:.16em}.ftype .fsub{font-size:8.5px;letter-spacing:.2em}}
.fmark{font-family:var(--display),sans-serif;font-weight:var(--dw);font-size:15px;letter-spacing:.24em;text-transform:uppercase;color:var(--white)}
.fe{display:flex;justify-content:space-between;gap:20px;flex-wrap:wrap;border-top:1px solid rgba(247,246,244,.12);padding-top:24px;font-size:9.5px;letter-spacing:.22em;text-transform:uppercase}

.rv{opacity:0;transform:translateY(24px);transition:opacity 1.1s var(--ease),transform 1.1s var(--ease)}
.rv.in{opacity:1;transform:none}
@media(prefers-reduced-motion:reduce){.rv{opacity:1;transform:none;transition:none}}


@media(max-width:900px){
  .wrap{padding:0 24px}
  .nav{top:12px}
  .nav-in{gap:10px;height:42px;padding:0 5px 0 12px;border-radius:21px;max-width:calc(100vw - 24px)}
  .pill{font-size:9px;height:26px;padding:0 12px;letter-spacing:.18em}
  .nav-in .links{display:none}
  .plate{padding:118px 24px 96px}
  .stmt{padding:110px 24px}
  .reel .foot{padding:0 24px 30px;gap:16px}
  .work .facts{padding:16px 24px;gap:8px 18px;justify-content:flex-start}
  .light{padding:84px 0}
  .head{margin-bottom:42px;flex-direction:column;align-items:flex-start;gap:14px}
  .about{grid-template-columns:1fr;gap:44px}
  .svc a{grid-template-columns:44px 1fr;gap:6px 16px}
  .svc p{grid-column:2}
  .svc .arw{display:none}
  .fg{grid-template-columns:1fr 1fr}
  }

/* Rechtstexte und Fehlerseite */
.legalpage{background:var(--stone)}
.lhead{background:var(--ink);color:var(--white);padding:22px 0}
.lhead .wrap{display:flex;justify-content:space-between;align-items:center;gap:20px}
.lhead .brand{display:flex;align-items:center;gap:10px}
.lback{font-size:9px;font-weight:500;letter-spacing:.18em;text-transform:uppercase;opacity:.7;transition:opacity .25s}
.lback:hover{opacity:1}
.legal{padding:110px 0 130px}
.legal .wrap{max-width:820px}
.legal h1{font-size:calc(clamp(1.6rem,4vw,2.8rem) * var(--dscale));margin-bottom:56px;padding-bottom:18px;border-bottom:1px solid var(--ink)}
.legal h2{font-family:var(--body),sans-serif;font-size:11px;font-weight:500;letter-spacing:.14em;text-transform:uppercase;color:var(--soft);margin:44px 0 12px}
.legal p{font-size:16px;color:#3B3934;margin-bottom:14px;max-width:68ch}
.legal p.lead{font-size:clamp(1.05rem,1.6vw,1.25rem);line-height:1.5;color:var(--ink)}
.legal a{border-bottom:1px solid var(--hair)}
.legal a:hover{border-bottom-color:var(--ink)}
.legal .lbtn{border-bottom:1px solid var(--ink)}
.legal .stand{margin-top:48px;font-size:13px;color:var(--soft)}
.legalpage footer{padding:32px 0}
.legalpage footer .fe{border-top:none;padding-top:0}
.legalpage footer a:hover{color:var(--white)}
/* Offene Angabe: muss vor dem Livegang ersetzt werden */
mark.todo{background:#FFE58A;color:#0B0B0B;padding:0 4px}