/* Sarah Cookie Company: Firmenbox-Landingpage
   Werte aus wiki/projekte/Design/DESIGN.md und dem Entwurf "Final Desktop" (Oktober 2026).
   Flach: keine Schatten, keine Verläufe, keine Pill-Formen. */

/* ---------- Schriften (selbst gehostet, nur westliche Zeichen) ---------- */
@font-face{font-family:'Cormorant Garamond';font-style:normal;font-weight:500 600;font-display:swap;src:url(../fonts/cormorant-garamond.woff2) format('woff2')}
@font-face{font-family:'Cormorant Garamond';font-style:italic;font-weight:500;font-display:swap;src:url(../fonts/cormorant-garamond-italic.woff2) format('woff2')}
@font-face{font-family:'Inter';font-style:normal;font-weight:400 600;font-display:swap;src:url(../fonts/inter.woff2) format('woff2')}

/* ---------- Tokens ---------- */
:root{
  --color-burgundy:#5B1A2A;--color-burgundy-deep:#451320;--color-cream:#F6EEE0;--color-parchment:#EDE2CE;
  --color-espresso:#2A1A16;--color-muted:#6B5A50;--color-caramel:#B87A3D;--color-terracotta:#A4502F;--color-stone:#CFC4B2;
  --bg:var(--color-cream);--surface:var(--color-parchment);--text:var(--color-espresso);--text-muted:var(--color-muted);
  --border:var(--color-stone);--primary:var(--color-burgundy);--primary-hover:var(--color-burgundy-deep);--on-primary:var(--color-cream);
  --accent:var(--color-terracotta);--focus-ring:var(--color-burgundy);
  --font-display:'Cormorant Garamond','Cormorant',Georgia,'Times New Roman',serif;
  --font-body:'Inter',system-ui,-apple-system,'Segoe UI',Roboto,sans-serif;
  --radius-sm:2px;--radius-md:4px;
  --gutter:max(64px,calc((100% - 1312px) / 2));
  --ease:cubic-bezier(.2,.6,.2,1);
}

/* ---------- Grundlagen ---------- */
*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
body{margin:0;background:var(--bg);color:var(--text);font-family:var(--font-body);font-size:16px;line-height:1.6;overflow-x:clip;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
img{max-width:100%}
a:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible{outline:2px solid var(--focus-ring);outline-offset:2px}
.dark a:focus-visible,.dark button:focus-visible,.dark input:focus-visible,.hero a:focus-visible{outline-color:var(--color-cream)}
.skip{position:absolute;left:16px;top:-80px;z-index:10;padding:12px 20px;background:var(--color-cream);color:var(--color-burgundy);border-radius:var(--radius-md);font:500 16px/1.2 var(--font-body)}
.skip:focus{top:16px}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}
.sec{padding-left:var(--gutter);padding-right:var(--gutter)}
section[id]{scroll-margin-top:24px}

/* ---------- Komponenten (aus dem Design-System) ---------- */
.sc-btn{display:inline-block;font:500 16px/1.2 var(--font-body);padding:14px 28px;border:0;border-radius:var(--radius-md);cursor:pointer;background:var(--primary);color:var(--on-primary);text-decoration:none;text-align:center;transition:background-color .2s var(--ease),transform .2s var(--ease)}
.sc-btn:hover{background:var(--primary-hover)}
.sc-btn:active{transform:translateY(1px)}
.sc-btn--secondary{background:var(--color-parchment);color:var(--color-burgundy)}
.sc-btn--secondary:hover{background:var(--color-stone)}
.sc-btn--on-dark{background:var(--color-cream);color:var(--color-burgundy)}
.sc-btn--on-dark:hover{background:var(--color-parchment)}
.sc-eyebrow{font:600 12px/16px var(--font-body);letter-spacing:.18em;text-transform:uppercase;color:var(--accent);margin:0 0 16px}
.sc-wordmark{font:500 24px/1 var(--font-display);letter-spacing:.22em;text-transform:uppercase;color:var(--color-burgundy);margin:0;white-space:nowrap}
.sc-wordmark--light{color:var(--color-cream)}
.sc-quote{margin:0;padding:0 0 0 24px;border-left:2px solid var(--color-caramel)}
.sc-quote p{font:italic 500 24px/34px var(--font-display);color:var(--color-espresso);margin:0}
.sc-input{display:block;width:100%;height:48px;background:var(--color-parchment);border:1px solid var(--color-stone);border-radius:var(--radius-md);padding:0 16px;font:400 16px/1.2 var(--font-body);color:var(--color-espresso);transition:border-color .2s var(--ease)}
.sc-input::placeholder{color:var(--color-muted);opacity:1}
.sc-input:focus,.sc-input:focus-visible{outline:none;border:2px solid var(--color-burgundy);padding:0 15px}
select.sc-input{appearance:none;-webkit-appearance:none;padding-right:44px;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='9' viewBox='0 0 14 9'%3E%3Cpath d='M1 1l6 6 6-6' fill='none' stroke='%235B1A2A' stroke-width='1.5'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 18px center}
.sc-table{width:100%;border-collapse:collapse;font:400 18px/26px var(--font-body);color:var(--color-espresso)}
.sc-table th{background:var(--color-burgundy);color:var(--color-cream);font:600 13px/18px var(--font-body);letter-spacing:.06em;text-transform:uppercase;text-align:left;padding:14px 20px}
.sc-table td{padding:16px 20px;border-bottom:1px solid var(--color-stone)}
.sc-table .num{text-align:right;font-weight:600;white-space:nowrap;font-variant-numeric:tabular-nums}

/* ---------- Fullscreen Hero ---------- */
.hero{--lx:var(--gutter);position:relative;overflow:hidden;background:var(--color-espresso);padding-bottom:120px}
.hero-bg{position:absolute;inset:0;z-index:0;will-change:transform}
.hero-bg img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:50% 38%;display:block}
.hero-tint{position:absolute;inset:0;background:rgba(42,26,22,.5)}
.hero-top{position:relative;z-index:1;display:flex;flex-direction:column;min-height:100vh;min-height:100svh}
.hd{display:flex;align-items:center;justify-content:space-between;gap:24px;height:96px;flex:none}
.nav{display:flex;align-items:center;gap:32px}
.nav .nl{font:500 16px/1 var(--font-body);color:var(--color-cream);text-decoration:none;padding:14px 0;text-decoration:underline;text-decoration-color:transparent;text-underline-offset:6px;text-decoration-thickness:1px;transition:text-decoration-color .25s var(--ease)}
.nav .nl:hover{text-decoration-color:currentColor}
.hero-main{margin-top:auto;padding:0 var(--lx) 72px;max-width:calc(860px + var(--lx))}
.hero-h1{margin:0 0 36px;font:500 clamp(56px,6.7vw,96px)/.96 var(--font-display);letter-spacing:-.02em;color:var(--color-cream);text-wrap:balance}
.hero-act,.btns{display:flex;flex-wrap:wrap;gap:16px 28px;align-items:center}
.lk{color:var(--color-cream);font:500 16px/24px var(--font-body);text-underline-offset:5px;text-decoration-thickness:1px}
.lk:hover{text-decoration-thickness:2px}
.facts{display:flex;flex-wrap:wrap;gap:8px 0;margin:28px 0 0;font:500 15px/24px var(--font-body);color:var(--color-cream)}
.facts span+span{border-left:1px solid rgba(246,238,224,.45);margin-left:20px;padding-left:20px}
.hero-s2{position:relative;z-index:1;margin-left:var(--lx);width:min(600px,calc(100% - 2 * var(--lx)));padding:40px;background:rgba(42,26,22,.74);border-radius:var(--radius-md);color:var(--color-cream)}
.intro-a{margin:0 0 20px;font:500 36px/42px var(--font-display);letter-spacing:-.01em;color:var(--color-cream)}
.intro-b{margin:0 0 32px;font:400 18px/28px var(--font-body);color:var(--color-cream)}

/* ---------- Abschnitte ---------- */
.blk{padding-top:120px;padding-bottom:120px}
.blk--tight{padding-top:40px}
.h2{margin:0 0 32px;font:600 48px/52px var(--font-display);letter-spacing:-.01em;color:var(--color-burgundy);text-wrap:balance}
.lead{margin:0 0 40px;max-width:600px;font:400 20px/32px var(--font-body)}
.prob{padding-top:140px;padding-bottom:120px}
.prob-big{margin:0 0 72px;max-width:1120px;font:500 clamp(56px,6.7vw,96px)/1 var(--font-display);letter-spacing:-.02em;color:var(--color-espresso)}
.rw{display:inline-block}
.prob-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:64px;align-items:start}
.prob-2{margin:0 0 20px;font:600 40px/46px var(--font-display);letter-spacing:-.01em;color:var(--color-burgundy)}
.prob-3{margin:0;max-width:560px;font:400 20px/32px var(--font-body)}
.prob-4{margin:0;padding-left:24px;border-left:2px solid var(--color-caramel);font:italic 500 44px/50px var(--font-display);color:var(--color-burgundy)}

.offer{display:grid;grid-template-columns:5fr 7fr;gap:64px;align-items:center}
.draw{display:block;width:100%;height:auto;border-radius:var(--radius-md)}
.lrow{margin:0;padding:20px 0;border-top:1px solid var(--color-stone);font:400 20px/32px var(--font-body)}
.lrow:last-of-type{border-bottom:1px solid var(--color-stone)}
.lrow b{font-weight:600}
.pull{margin:32px 0 0;font:italic 500 40px/46px var(--font-display);color:var(--color-burgundy)}

/* Ablauf: Foto etwas schmaler und nach unten versetzt, damit es nicht wie das Angebot darüber wirkt */
.ablauf{display:grid;grid-template-columns:5fr 6fr;gap:96px;align-items:center}
.ablauf .photo{margin-top:64px}
.photo{display:block;width:100%;height:auto;aspect-ratio:4/5;object-fit:cover;border-radius:var(--radius-md)}
.steps{list-style:none;margin:0 0 40px;padding:0}
.steps li{display:flex;gap:24px;align-items:baseline;padding:22px 0;border-top:1px solid var(--color-stone);font:400 20px/32px var(--font-body)}
.steps li:last-child{border-bottom:1px solid var(--color-stone)}
.steps .num{flex:0 0 56px;font:500 56px/1 var(--font-display);color:var(--color-caramel)}

/* ---------- Sorten ---------- */
.sorten-head{display:flex;justify-content:space-between;align-items:flex-end;gap:32px;flex-wrap:wrap;margin-bottom:72px}
.count{margin:0;font:600 16px/24px var(--font-body);color:var(--color-burgundy);font-variant-numeric:tabular-nums}
.hint{margin:4px 0 0;font:500 14px/20px var(--font-body);color:var(--color-terracotta);min-height:20px}
/* Abwechselnd große und kleine Bildspalte statt immer 50/50 */
.sorte{display:grid;grid-template-columns:minmax(0,7fr) minmax(0,5fr);gap:96px;align-items:center;margin-bottom:96px}
.sorte--rev{grid-template-columns:minmax(0,5fr) minmax(0,7fr)}
.sorte--rev .sorte-img{order:2}
.sorte-img{overflow:hidden;border-radius:var(--radius-md)}
.sorte-img img{display:block;width:100%;height:auto;aspect-ratio:4/5;object-fit:cover;transition:transform 1.2s var(--ease)}
.sorte:hover .sorte-img img{transform:scale(1.03)}
/* Keks-Stapel: Kekse fallen auf die leere Fläche, erst danach blendet das echte Foto (mit Hintergrund) ein. Nur mit Bewegung (.fx). */
[data-stack]{position:relative}
.stack{display:none}
.fx .stack{display:block;position:absolute;inset:0;overflow:hidden}
.fx [data-stack] > img{opacity:0}
.fx .stack.is-done{visibility:hidden}
.sorte-img .stack img{position:absolute;inset:0;width:100%;height:100%;aspect-ratio:auto;object-fit:cover;transition:none}
.stack-k{opacity:0;will-change:transform}
/* Desktop: Sorte bleibt stehen, solange die Kekse fallen (100vh Scrollweg) */
@media (min-width:761px){
  .fx .sorte-pin{height:240vh;margin-bottom:96px}
  .fx .sorte-stick{position:sticky;top:0;height:100vh;display:flex;align-items:center}
  .fx .sorte-stick .sorte{width:100%;margin-bottom:0}
  .fx .sorte-pin .sorte-img img{max-height:88vh}
}
.sorte-name{margin:0 0 20px;font:600 52px/56px var(--font-display);letter-spacing:-.01em;color:var(--color-burgundy)}
.sorte-text{margin:0 0 32px;max-width:520px;font:400 20px/32px var(--font-body)}
.klass{padding-top:48px;border-top:1px solid var(--color-stone)}
.klass h3{margin:0 0 24px;font:600 32px/38px var(--font-display);color:var(--color-espresso)}
.sw-row{display:flex;flex-wrap:wrap;gap:16px 48px}
.sw{display:flex;align-items:center;gap:14px;padding:8px 0;min-height:44px;background:none;border:0;cursor:pointer;font:500 18px/24px var(--font-body);color:var(--color-espresso)}
.sw-track{position:relative;flex:none;width:48px;height:28px;border-radius:var(--radius-md);background:var(--color-stone);border:1.5px solid var(--color-muted);transition:background-color .25s var(--ease),border-color .25s var(--ease)}
.sw-knob{position:absolute;left:3px;top:3px;width:18px;height:18px;border-radius:var(--radius-sm);background:var(--color-cream);border:1.5px solid var(--color-muted);transition:transform .25s var(--ease),border-color .25s var(--ease)}
.sw[aria-checked="true"] .sw-track{background:var(--color-burgundy);border-color:var(--color-burgundy)}
.sw[aria-checked="true"] .sw-knob{transform:translateX(20px);border-color:var(--color-cream)}

/* ---------- Preise ---------- */
.preise{display:grid;grid-template-columns:7fr 5fr;gap:96px;align-items:start}
.sum-ex{margin:32px 0 0;font:500 20px/32px var(--font-body)}
.tip{margin:16px 0 0;padding-left:24px;border-left:2px solid var(--color-caramel);font:italic 500 28px/34px var(--font-display);color:var(--color-burgundy)}
.small{margin:24px 0 0;max-width:560px;font:400 16px/26px var(--font-body)}
.dl{margin:112px 0 0}
.dl div{display:flex;gap:24px;padding:16px 0;border-top:1px solid var(--color-stone)}
.dl div:last-child{border-bottom:1px solid var(--color-stone)}
.dl dt{flex:0 0 150px;font:600 13px/24px var(--font-body);letter-spacing:.06em;text-transform:uppercase;color:var(--color-muted)}
.dl dd{margin:0;font:400 17px/24px var(--font-body);color:var(--color-espresso)}
.two{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:64px;margin-top:96px;padding-top:40px;border-top:1px solid var(--color-stone)}
.h3{margin:0 0 16px;font:600 28px/34px var(--font-display);letter-spacing:-.01em;color:var(--color-espresso)}
.txt{margin:0 0 16px;font:400 16px/26px var(--font-body);color:var(--color-espresso);max-width:560px}
.ph{margin:0;font:500 14px/22px var(--font-body);color:var(--color-terracotta)}

/* ---------- Bestellformular ---------- */
.order{display:grid;grid-template-columns:4fr 8fr;gap:80px;align-items:start}
.sticky{position:sticky;top:32px}
.sumbox{margin-top:32px;padding:32px;background:var(--color-parchment);border-radius:var(--radius-md)}
.sumbox p{margin:0}
.sum-l{font:600 13px/18px var(--font-body);letter-spacing:.06em;text-transform:uppercase;color:var(--color-muted)}
.sum-v{margin:4px 0 20px!important;font:500 44px/48px var(--font-display);color:var(--color-burgundy);font-variant-numeric:lining-nums tabular-nums}
.sum-v.is-empty{font-size:28px;line-height:48px;color:var(--color-muted)}
.sum-n{margin-top:16px!important;font:400 14px/22px var(--font-body);color:var(--color-muted)}
.form{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0 32px}
.full{grid-column:1 / -1}
.fld{margin:0 0 28px}
.fl{display:block;font:500 14px/20px var(--font-body);letter-spacing:.01em;color:var(--color-espresso);margin:0 0 8px}
.fl i,.fs legend i{font-style:normal;font-weight:400;color:var(--color-muted)}
.sc-input.ta{height:auto;min-height:120px;padding:12px 16px;resize:vertical;line-height:1.5}
.sc-input.ta:focus{padding:11px 15px}
.sc-input[aria-invalid="true"]{border:2px solid var(--color-terracotta);padding-left:15px}
.err{margin:8px 0 0;font:500 14px/20px var(--font-body);color:var(--color-terracotta)}
.err:empty{display:none}
.fs{margin:0 0 28px;padding:0;border:0;min-width:0}
.fs legend{padding:0;margin:0 0 12px;font:500 14px/20px var(--font-body);color:var(--color-espresso)}
.sortgrid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:4px 24px}
.ck{display:flex;gap:12px;align-items:flex-start;min-height:44px;padding:10px 0;font:400 16px/24px var(--font-body);color:var(--color-espresso);cursor:pointer}
.ck input{flex:none;width:22px;height:22px;margin:1px 0 0;accent-color:var(--color-burgundy);cursor:pointer}
.ck.is-off{color:var(--color-muted);cursor:not-allowed}
.ck a{color:var(--color-terracotta)}
.cnt{margin:8px 0 0;text-align:right;font:400 13px/18px var(--font-body);color:var(--color-muted);font-variant-numeric:tabular-nums}
.pay{margin:0 0 24px;font:400 15px/24px var(--font-body);color:var(--color-muted)}
.fmsg{margin:16px 0 0;font:500 15px/22px var(--font-body);color:var(--color-terracotta)}
.fmsg:empty{display:none}
.thanks{padding:56px 0;border-top:1px solid var(--color-stone);border-bottom:1px solid var(--color-stone)}
.thanks p{margin:0;font:500 44px/50px var(--font-display);letter-spacing:-.01em;color:var(--color-burgundy);max-width:720px}
[hidden]{display:none!important}

/* ---------- Über Sarah, Stimmen, Fragen ---------- */
.about{display:grid;grid-template-columns:7fr 5fr;gap:96px;align-items:center}
.about .txt{font-size:20px;line-height:32px;max-width:640px}
.voices{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:72px 96px;align-items:start;margin-top:64px}
.voice{margin:0}
.voice--r{margin-top:64px}
.stars{display:flex;gap:4px;margin:0 0 16px 26px}
.star{width:22px;height:22px;stroke:var(--color-caramel);stroke-width:1;stroke-linejoin:round;display:block}
.star.on{fill:var(--color-caramel)}
.star.off{fill:none}
.voice-who{margin:16px 0 0 26px;font:400 14px/20px var(--font-body);color:var(--color-muted)}
.vn{display:block;font-weight:600;font-size:16px;line-height:24px;color:var(--color-espresso)}
.faq{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:48px 96px;margin-top:48px}
.faq div{padding-top:24px;border-top:1px solid var(--color-stone)}
.faq .txt{margin:0}

/* ---------- Schluss, Newsletter, Fuß ---------- */
.dark{background:var(--color-burgundy);color:var(--color-cream);padding-top:120px;padding-bottom:48px}
.end-grid{display:grid;grid-template-columns:7fr 5fr;gap:80px;align-items:center}
.end-h{margin:0 0 40px;font:500 56px/60px var(--font-display);letter-spacing:-.02em;color:var(--color-cream);text-wrap:balance}
.nlbox{display:grid;grid-template-columns:5fr 7fr;gap:48px;margin-top:104px;padding-top:48px;border-top:1px solid rgba(246,238,224,.25);align-items:start}
.nl-h{margin:0;font:600 32px/38px var(--font-display);color:var(--color-cream)}
.nlform{display:flex;flex-wrap:wrap;gap:16px;align-items:flex-end}
.nlf{flex:1 1 280px;max-width:380px}
.nl-label{display:block;font:500 13px/18px var(--font-body);letter-spacing:.02em;color:var(--color-cream);margin:0 0 8px}
.nl-note{margin:16px 0 0;font:400 13px/18px var(--font-body);letter-spacing:.02em;color:var(--color-stone)}
.nl-err{margin:8px 0 0;font:500 14px/20px var(--font-body);color:var(--color-cream)}
.nl-err:empty{display:none}
.nl-done{margin:0;font:italic 500 28px/36px var(--font-display);color:var(--color-cream)}
.ft{display:flex;justify-content:space-between;flex-wrap:wrap;gap:16px 32px;margin-top:72px;padding-top:24px;border-top:1px solid rgba(246,238,224,.25);font:400 14px/20px var(--font-body);color:var(--color-stone)}
.ft nav{display:flex;flex-wrap:wrap;gap:8px 28px}
.ft a{color:var(--color-cream);text-underline-offset:4px}

/* ---------- Bewegung: nur wenn JS sie freigibt (Klasse .fx) ---------- */
.fx [data-fx]{opacity:0;transform:translateY(24px);transition:opacity .9s var(--ease),transform .9s var(--ease)}
.fx [data-fx].is-in{opacity:1;transform:none}
.fx [data-rv] .rw{opacity:0;transform:translateY(.45em);transition:opacity .8s var(--ease),transform .8s var(--ease)}
.fx [data-rv].is-in .rw{opacity:1;transform:none}
@media (prefers-reduced-motion:reduce){
  .fx [data-fx],.fx [data-rv] .rw{opacity:1;transform:none;transition:none}
  .hero-bg{transform:none!important}
  .sorte-img img,.sc-btn,.sw-track,.sw-knob,.nav .nl{transition:none}
  .sorte:hover .sorte-img img{transform:none}
  .stack{display:none!important}
}

/* ---------- Tablet ---------- */
@media (max-width:1100px){
  .sorte,.sorte--rev,.about,.ablauf,.preise{gap:56px}
  .order{grid-template-columns:5fr 7fr;gap:48px}
  .nav{gap:24px}
}

/* ---------- Mobil: Standbild hochkant, eine Spalte ---------- */
@media (max-width:760px){
  :root{--gutter:24px}
  .hero{background:var(--bg);padding-bottom:0}
  .hero-bg{bottom:auto;height:min(780px,100svh);transform:none!important}
  .hero-bg img{object-position:50% 50%}
  .hero-top{min-height:0;height:min(780px,100svh)}
  .hd{height:auto;padding-top:24px}
  .hd .sc-wordmark{white-space:normal;line-height:1.25;font-size:20px}
  .nav{display:none}
  .hero-main{padding-bottom:40px;max-width:none}
  .hero-h1{font-size:48px;line-height:50px;margin-bottom:28px}
  .facts{margin-top:24px;font-size:14px}
  .facts{gap:4px 20px}
  .facts span+span{border-left:0;margin-left:0;padding-left:0}
  .hero-s2{margin:0;width:auto;padding:56px 24px 8px;background:transparent;color:var(--color-espresso);border-radius:0}
  .intro-a{color:var(--color-espresso);font-size:30px;line-height:36px}
  .intro-b{color:var(--color-espresso)}
  .hero-s2 .sc-btn--on-dark{background:var(--color-burgundy);color:var(--color-cream)}
  .hero-s2 .sc-btn--on-dark:hover{background:var(--color-burgundy-deep)}
  .hero-s2 .lk{color:var(--color-burgundy)}
  .hero-s2 a:focus-visible{outline-color:var(--focus-ring)}
  .blk{padding-top:64px;padding-bottom:64px}
  .blk--tight{padding-top:24px}
  .h2{font-size:36px;line-height:40px}
  .prob{padding-top:72px;padding-bottom:64px}
  .prob-big{font-size:48px;line-height:50px;margin-bottom:40px}
  .prob-grid,.offer,.ablauf,.preise,.two,.order,.about,.voices,.faq,.end-grid,.nlbox,.form,.sortgrid,.sorte,.sorte--rev{grid-template-columns:minmax(0,1fr);gap:32px}
  .ablauf .photo{margin-top:0}
  .prob-2{font-size:32px;line-height:38px}
  .prob-4,.pull{font-size:32px;line-height:38px}
  .lrow,.steps li,.lead,.prob-3{font-size:18px;line-height:28px}
  .steps .num{font-size:44px;flex-basis:44px}
  .sorten-head{margin-bottom:48px}
  .sorte{margin-bottom:64px}
  .sorte--rev .sorte-img{order:0}
  .sorte-name{font-size:40px;line-height:44px}
  .sorte-text{font-size:18px;line-height:28px}
  .sc-btn{width:auto}
  .dl{margin-top:0}
  .dl div{flex-direction:column;gap:4px}
  .dl dt{flex:none}
  .tip{font-size:24px;line-height:30px}
  .two{margin-top:64px}
  .sticky{position:static}
  .form{gap:0}
  .sumbox{padding:24px}
  .sum-v{font-size:36px;line-height:40px}
  .thanks p{font-size:32px;line-height:38px}
  .voices{margin-top:40px;gap:48px}
  .voice--r{margin-top:0}
  .sc-quote p{font-size:22px;line-height:31px}
  .dark{padding-top:72px;padding-bottom:40px}
  .end-h{font-size:38px;line-height:42px}
  .nlbox{margin-top:64px}
  .ft{margin-top:48px}
}