/* Sitzmöbelmanufaktur, Variante "Stoffmusterbuch" */
@font-face{font-family:"Instrument Sans";src:url(fonts/instrumentsans.woff2) format("woff2");font-weight:400 700;font-stretch:75% 100%;font-style:normal;font-display:swap}

:root{
  --linen:#f2ebe0;--paper:#fbf7f0;--sand:#e6dccb;
  --ink:#1e1813;--ink-2:#4b4037;--ink-3:#7a6c5f;
  --cognac:#a0501d;--cognac-d:#7d3b13;--leather:#5e2b15;
  --moss:#2b3628;--moss-2:#3b4a36;--brass:#c79d57;--brass-l:#e6c486;
  --tape:#e3b64a;--line:rgba(30,24,19,.14);
  --display:"Instrument Sans",system-ui,sans-serif;--body:"Instrument Sans",system-ui,sans-serif;
  --section-py:6rem;--r:14px;--wrap:1240px;
  --ease:cubic-bezier(.2,.7,.2,1);
}
*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:90px;-webkit-text-size-adjust:100%}
body{margin:0;font:400 17px/1.6 var(--body);color:var(--ink);background:var(--linen);overflow-x:hidden;-webkit-font-smoothing:antialiased}
body::after{content:"";position:fixed;inset:0;pointer-events:none;z-index:90;opacity:.07;mix-blend-mode:multiply;
  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='.85' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E")}
img,video{display:block;max-width:100%;height:auto}
a{color:inherit}
h1,h2,h3{margin:0;font-family:var(--display);font-weight:600;line-height:1.02;letter-spacing:-.035em}
h2{font-size:clamp(2.1rem,4.6vw,3.9rem);text-wrap:balance}
h2 em,h1 em{font-style:normal}
h3{font-size:1.3rem;line-height:1.2;letter-spacing:-.02em}
p{margin:0}
.wrap{width:100%;max-width:var(--wrap);margin-inline:auto;padding-inline:32px}
.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.skip-link{position:absolute;left:16px;top:-60px;z-index:200;background:var(--ink);color:var(--paper);padding:10px 16px;border-radius:8px}
.skip-link:focus{top:12px}
:focus-visible{outline:2px solid var(--cognac);outline-offset:3px}

.eyebrow{display:inline-flex;align-items:center;gap:12px;font:700 12px/1 var(--body);letter-spacing:.2em;text-transform:uppercase;color:var(--cognac);margin-bottom:22px}
.eyebrow::before{content:"";width:34px;border-top:1.5px dashed currentColor}
.eyebrow-light{color:var(--brass-l)}
.lead{font-size:1.1rem;color:var(--ink-2);max-width:38em;margin-top:20px}
.section-head{max-width:760px;margin-bottom:56px}
.section-head-light .lead{color:rgba(242,235,224,.78)}
.stars{color:#f0b429;letter-spacing:2px}

/* Buttons: Lederpatch mit Ziernaht */
.btn{position:relative;display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:52px;padding:0 26px;border-radius:12px;font:700 15.5px/1 var(--body);text-decoration:none;border:0;cursor:pointer;transition:transform .25s var(--ease),background .25s,box-shadow .25s,color .25s;white-space:nowrap}
.btn svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round}
.btn-primary{background:var(--cognac);color:#fff;box-shadow:0 1px 0 rgba(255,255,255,.18) inset,0 10px 24px -12px rgba(125,59,19,.8)}
.btn-primary::after{content:"";position:absolute;inset:4px;border:1.2px dashed rgba(255,236,210,.6);border-radius:9px;pointer-events:none}
.btn-primary:hover{background:var(--cognac-d);transform:translateY(-2px)}
.btn-primary:disabled{background:#b9ab9c;box-shadow:none;cursor:not-allowed;transform:none}
.btn-primary:disabled::after{border-color:rgba(255,255,255,.35)}
.btn-ghost{background:rgba(255,248,238,.08);color:#fff;border:1.5px solid rgba(255,248,238,.5);backdrop-filter:blur(6px)}
.btn-ghost:hover{background:rgba(255,248,238,.18);transform:translateY(-2px)}
.btn-outline{background:transparent;color:var(--ink);border:1.5px solid var(--ink)}
.btn-outline:hover{background:var(--ink);color:var(--paper)}
.btn-text{background:none;color:var(--ink-2);padding:0 12px;text-decoration:underline;text-underline-offset:4px}
.btn-lg{min-height:58px;padding:0 32px;font-size:16.5px}
.btn-sm{min-height:44px;padding:0 18px;font-size:14px}
.btn-block{width:100%}

/* Navigation */
.nav{position:fixed;inset:0 0 auto;z-index:100;color:#fff;transition:background .35s,color .35s,box-shadow .35s}
.nav-row{display:flex;align-items:center;gap:28px;height:84px;transition:height .35s}
.nav.is-solid{background:rgba(242,235,224,.92);backdrop-filter:blur(14px) saturate(1.2);color:var(--ink);box-shadow:0 1px 0 var(--line)}
.nav.is-solid .nav-row{height:70px}
.brand{display:flex;align-items:center;gap:12px;text-decoration:none;margin-right:auto;min-width:0}
.brand img{width:56px;height:56px;object-fit:contain}
.brand-dark{display:none}
.nav.is-solid .brand-dark{display:block}.nav.is-solid .brand-light{display:none}
.brand-word{display:flex;flex-direction:column;line-height:1.1}
.brand-word b{font:700 18px/1.1 var(--display);letter-spacing:-.025em}
.brand-word small{font-size:11px;letter-spacing:.18em;text-transform:uppercase;opacity:.7;margin-top:3px}
.nav-links{display:flex;gap:26px}
.nav-links a{font-weight:600;font-size:15px;text-decoration:none;position:relative;padding:6px 0}
.nav-links a::after{content:"";position:absolute;left:0;right:0;bottom:0;border-bottom:1.5px dashed currentColor;transform:scaleX(0);transform-origin:left;transition:transform .3s var(--ease)}
.nav-links a:hover::after{transform:scaleX(1)}
.nav-cta{display:flex;align-items:center;gap:16px}
.nav-phone{display:flex;align-items:center;gap:8px;font-weight:700;font-size:15px;text-decoration:none;min-height:44px}
.nav-phone svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:1.9}
.burger{display:none;width:48px;height:48px;border-radius:12px;border:1.5px solid currentColor;background:transparent;color:inherit;cursor:pointer;position:relative}
.burger span{position:absolute;left:13px;right:13px;height:2px;background:currentColor;transition:transform .3s,top .3s}
.burger span:first-child{top:18px}.burger span:last-child{top:27px}
.burger[aria-expanded="true"] span:first-child{top:22px;transform:rotate(45deg)}
.burger[aria-expanded="true"] span:last-child{top:22px;transform:rotate(-45deg)}
.mobile-menu{display:flex;flex-direction:column;gap:6px;padding:12px 24px 28px;background:var(--linen);color:var(--ink);border-top:1px dashed var(--line)}
.mobile-menu[hidden]{display:none}
.mobile-menu a:not(.btn){font:600 1.4rem/1 var(--display);letter-spacing:-.025em;padding:14px 0;text-decoration:none;border-bottom:1px dashed var(--line)}
.mobile-menu .btn{margin-top:12px}

/* Hero */
.hero{position:relative;min-height:100vh;min-height:100svh;display:flex;align-items:flex-end;color:#fff;overflow:hidden;background:#241a13}
.hero-video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:65% center;filter:saturate(.85) sepia(.18) contrast(1.06)}
.hero-grade{position:absolute;inset:0;background:linear-gradient(90deg,rgba(24,16,11,.9) 0%,rgba(24,16,11,.66) 42%,rgba(24,16,11,.18) 78%),linear-gradient(0deg,rgba(24,16,11,.75) 0%,transparent 45%)}
.hero-inner{position:relative;display:flex;align-items:flex-end;justify-content:space-between;gap:40px;padding-top:150px;padding-bottom:92px}
.hero-copy{max-width:60rem}
.hero h1{font-size:clamp(2.1rem,6.6vw,6.2rem);line-height:.98;letter-spacing:-.038em;font-weight:600}
.hero h1 .line{display:block;overflow:hidden;padding-bottom:.08em}
.hero h1 .line:nth-child(2){padding-bottom:.26em;margin-bottom:-.12em}
.hero h1 em{position:relative;display:inline-block;color:var(--brass-l);padding-right:.08em}
.seam{position:absolute;left:0;right:0;bottom:-.2em;width:100%;height:.16em;overflow:visible}
.seam path{fill:none;stroke:var(--brass);stroke-width:2.5;stroke-linecap:round;stroke-dasharray:11 8;vector-effect:non-scaling-stroke}
.js .seam{clip-path:inset(0 100% 0 0);animation:sew 1.6s .9s var(--ease) forwards}
@keyframes sew{to{clip-path:inset(0 0 0 0)}}
.hero-lead{font-size:clamp(1.05rem,1.4vw,1.28rem);max-width:34em;margin-top:26px;color:rgba(255,248,238,.9)}
.hero-bullets{list-style:none;display:flex;flex-wrap:wrap;gap:10px 26px;padding:0;margin:22px 0 0;font-weight:600;font-size:15px}
.hero-bullets li{display:flex;align-items:center;gap:10px}
.hero-bullets li::before{content:"";width:9px;height:9px;border-radius:50%;background:var(--brass);box-shadow:0 0 0 3px rgba(199,157,87,.25)}
.hero-actions{display:flex;flex-wrap:wrap;gap:14px;margin-top:34px}
.google-trust{display:inline-flex;align-items:center;gap:14px;margin-top:26px;padding:10px 16px 10px 12px;border-radius:14px;text-decoration:none;background:rgba(255,248,238,.08);border:1px solid rgba(255,248,238,.18);backdrop-filter:blur(8px);transition:background .25s}
.google-trust:hover{background:rgba(255,248,238,.16)}
.g-avatars{display:flex;padding-left:8px}
.g-avatars img{width:36px;height:36px;border-radius:50%;object-fit:cover;margin-left:-9px;border:2px solid #2a1f17}
.g-copy{display:flex;flex-direction:column;line-height:1.25;font-size:13.5px}
.g-line{display:flex;gap:8px;align-items:center}
.g-line b{font-size:14.5px}
.g-sub{opacity:.8}
.g-arrow{opacity:.7}
.hero-note{position:absolute;right:100px;bottom:14px;font-size:11px;color:rgba(255,248,238,.5)}
.js .hero-in{opacity:0;transform:translateY(40%);animation:rise 1s calc(var(--d)*.09s + .15s) var(--ease) forwards}
.js .hero h1 .hero-in{display:inline-block;transform:translateY(105%)}
@keyframes rise{to{opacity:1;transform:none}}

/* Maßband */
.tape{position:relative;z-index:2;background:var(--tape);color:var(--ink);overflow:hidden;box-shadow:0 12px 24px -16px rgba(0,0,0,.5);
  background-image:repeating-linear-gradient(90deg,rgba(30,24,19,.75) 0 1.5px,transparent 1.5px 100px),repeating-linear-gradient(90deg,rgba(30,24,19,.55) 0 1px,transparent 1px 10px);
  background-size:100% 16px,100% 8px;background-repeat:no-repeat;background-position:0 0,0 0}
.tape-track{display:flex;width:max-content;animation:tape 42s linear infinite}
.tape-group{display:flex;flex:none}
.tape-group span{display:flex;align-items:center;gap:26px;padding:26px 26px 18px 0;font:700 13px/1 var(--body);letter-spacing:.16em;text-transform:uppercase;white-space:nowrap}
.tape-group span::after{content:"";width:8px;height:8px;border-radius:50%;background:var(--cognac)}
@keyframes tape{to{transform:translateX(-50%)}}

/* Reveal */
.js .reveal{opacity:0;transform:translateY(28px);transition:opacity .9s var(--ease),transform .9s var(--ease)}
.js .reveal.is-in{opacity:1;transform:none}

/* Vorteile + Konfigurator */
.benefits{padding-block:var(--section-py);background:var(--linen)}
.benefits-grid{display:grid;grid-template-columns:1fr 1fr;gap:72px;align-items:center}
.benefit-list{list-style:none;padding:0;margin:40px 0 0;display:grid;gap:0}
.benefit-list li{display:grid;grid-template-columns:48px 1fr;gap:18px;padding:24px 0;border-top:1.5px dashed rgba(30,24,19,.2)}
.benefit-list li:last-child{border-bottom:1.5px dashed rgba(30,24,19,.2)}
.num{font:600 13px/1 var(--body);letter-spacing:.14em;color:var(--cognac);padding-top:6px;font-variant-numeric:tabular-nums}
.benefit-list p{color:var(--ink-2);margin-top:6px;font-size:15.5px}
.studio{position:relative}
.compare{position:relative;aspect-ratio:928/1152;border-radius:22px;overflow:hidden;background:#ddd3c4;box-shadow:0 40px 80px -40px rgba(60,35,15,.55),0 0 0 1px rgba(30,24,19,.08);touch-action:pan-y}
.compare img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.compare-after{opacity:0;transition:opacity .6s var(--ease)}
.compare-after.is-active{opacity:1}
.compare-before{position:absolute;inset:0;clip-path:inset(0 calc(100% - var(--pos)) 0 0)}
.compare-handle{position:absolute;top:0;bottom:0;left:var(--pos);width:0;border-left:2px dashed rgba(255,255,255,.95);pointer-events:none}
.compare-handle span{position:absolute;top:50%;left:-26px;width:52px;height:52px;border-radius:50%;background:var(--paper);box-shadow:0 8px 20px rgba(0,0,0,.3);transform:translateY(-50%)}
.compare-handle span::before,.compare-handle span::after{content:"";position:absolute;top:50%;width:9px;height:9px;border-top:2px solid var(--ink);border-left:2px solid var(--ink)}
.compare-handle span::before{left:13px;transform:translateY(-50%) rotate(-45deg)}
.compare-handle span::after{right:13px;transform:translateY(-50%) rotate(135deg)}
.compare-range{position:absolute;inset:0;width:100%;height:100%;opacity:0;cursor:ew-resize;margin:0;-webkit-appearance:none;appearance:none}
.compare-range:focus-visible + *{outline:none}
.compare:has(.compare-range:focus-visible){outline:3px solid var(--cognac);outline-offset:4px}
.compare-tag{position:absolute;top:18px;padding:8px 12px;border-radius:8px;font:700 11px/1 var(--body);letter-spacing:.16em;text-transform:uppercase;background:rgba(30,24,19,.72);color:#fff;backdrop-filter:blur(6px);pointer-events:none}
.tag-before{left:18px}.tag-after{right:18px;background:var(--cognac)}
.swatches{display:flex;flex-wrap:wrap;gap:10px;border:0;padding:0;margin:22px 0 0}
.swatches legend{font:700 12px/1 var(--body);letter-spacing:.18em;text-transform:uppercase;color:var(--ink-3);margin-bottom:14px;padding:0}
.swatch{position:relative;display:flex;align-items:center;gap:10px;padding:6px 16px 6px 6px;min-height:52px;border-radius:999px;background:var(--paper);border:1.5px solid var(--line);cursor:pointer;transition:border-color .25s,transform .25s}
.swatch:hover{transform:translateY(-2px)}
.swatch input{position:absolute;opacity:0;pointer-events:none}
.swatch b{font-size:14px}
.swatch:has(input:checked){border-color:var(--ink);box-shadow:0 0 0 1px var(--ink)}
.swatch:has(input:focus-visible){outline:2px solid var(--cognac);outline-offset:3px}
.chip{width:40px;height:40px;border-radius:50%;background-size:900%;box-shadow:inset 0 0 0 1px rgba(0,0,0,.12),inset 0 -6px 10px rgba(0,0,0,.18)}
.ai-note{font-size:12px;color:var(--ink-3);margin-top:14px}

/* Leistungen: scrollgesteuert */
.services{padding-block:var(--section-py);background:var(--paper)}
.svc-layout{display:grid;grid-template-columns:1fr 1fr;gap:72px;align-items:start}
.svc-list{list-style:none;margin:0;padding:0}
.svc{position:relative;display:grid;grid-template-columns:56px 1fr;gap:0 16px;padding:44px 0;border-top:1px solid rgba(30,24,19,.12);transition:opacity .45s var(--ease)}
.svc:last-child{border-bottom:1px solid rgba(30,24,19,.12)}
.js .svc-layout .svc{opacity:.38}
.js .svc-layout .svc.is-active{opacity:1}
.svc-thumb{display:none}
.svc-num{font:600 13px/1 var(--body);letter-spacing:.14em;color:var(--ink-3);padding-top:9px;font-variant-numeric:tabular-nums;transition:color .35s}
.svc.is-active .svc-num{color:var(--cognac)}
.svc-body h3{font-size:clamp(1.5rem,2.2vw,2rem)}
.svc-body p{color:var(--ink-2);margin-top:10px;font-size:16px;max-width:32em}
.svc-link{display:inline-flex;align-items:center;gap:8px;margin-top:14px;min-height:44px;font-weight:700;color:var(--cognac);text-decoration:none}
.svc-link::after{content:"\2192";transition:transform .25s}
.svc-link:hover::after{transform:translateX(5px)}
.svc-stage{position:sticky;top:calc(50vh - min(34vh,310px));align-self:start}
.svc-frame{position:relative;height:min(68vh,620px);border-radius:18px;overflow:hidden;background:var(--sand);box-shadow:0 40px 80px -40px rgba(60,35,15,.5)}
.svc-frame img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:0;transform:scale(1.03);transition:opacity .7s var(--ease),transform 1.4s var(--ease)}
.svc-frame img.is-active{opacity:1;transform:none}
.svc-caption{display:flex;justify-content:space-between;align-items:baseline;gap:16px;margin-top:16px;font-size:14px;color:var(--ink-3)}
.svc-caption b{color:var(--ink);font-weight:600}
.svc-progress{position:absolute;left:18px;right:18px;bottom:18px;display:grid;grid-template-columns:repeat(6,1fr);gap:6px;z-index:2}
.svc-progress span{height:3px;border-radius:3px;background:rgba(255,255,255,.35);transition:background .35s}
.svc-progress span.is-on{background:#fff}

/* Ablauf */
.process{padding-block:var(--section-py);color:var(--linen);background:var(--moss)}
.process .section-head{display:grid;grid-template-columns:1fr 1fr;gap:48px;max-width:none;align-items:end}
.process .section-head .lead{margin-top:0}
.steps{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(3,1fr);gap:28px;counter-reset:step}
.step{display:flex;flex-direction:column}
.step-img{position:relative;margin:0;aspect-ratio:4/3;border-radius:16px;overflow:hidden;background:#233020}
.step-img img{width:100%;height:100%;object-fit:cover;transition:transform 1.2s var(--ease)}
.step:hover .step-img img{transform:scale(1.04)}
.step-meta{display:flex;align-items:center;gap:14px;margin-top:26px}
.step-no{font:600 13px/1 var(--body);letter-spacing:.14em;color:var(--brass-l);font-variant-numeric:tabular-nums}
.step-line{flex:1;height:1px;background:rgba(242,235,224,.18);position:relative;overflow:hidden}
.step-line::after{content:"";position:absolute;inset:0;background:var(--brass);transform:scaleX(0);transform-origin:left;transition:transform 1.2s .2s var(--ease)}
.step.is-in .step-line::after,.no-js .step-line::after{transform:scaleX(1)}
.step h3{margin-top:18px;font-size:1.55rem;color:#fff}
.step p{margin-top:10px;color:rgba(242,235,224,.74);font-size:15.5px}
.process-cta{display:flex;flex-wrap:wrap;gap:14px;margin-top:56px}

/* Schnellanfrage */
.inquiry{padding-block:var(--section-py);background:var(--linen)}
.inquiry-grid{display:grid;grid-template-columns:.85fr 1.15fr;gap:72px;align-items:center}
.inq-steps{list-style:none;padding:0;margin:36px 0 0;display:grid;gap:12px}
.inq-steps li{display:flex;align-items:center;gap:14px;font-weight:600;color:var(--ink-3);transition:color .3s}
.inq-steps span{display:grid;place-items:center;width:38px;height:38px;border-radius:50%;border:1.5px dashed currentColor;font-size:13px}
.inq-steps li.is-current{color:var(--ink)}
.inq-steps li.is-current span{background:var(--cognac);border:0;color:#fff}
.ticket{position:relative;background:var(--paper);border-radius:6px 6px 18px 18px;padding:34px 34px 30px;box-shadow:0 40px 70px -40px rgba(60,35,15,.5),0 0 0 1px rgba(30,24,19,.06);
  -webkit-mask:radial-gradient(circle 9px at 50% 0,#0000 98%,#000) 0 0/28px 100%;mask:radial-gradient(circle 9px at 50% 0,#0000 98%,#000) 0 0/28px 100%}
.ticket::after{content:"";position:absolute;inset:18px 12px 12px;border:1.5px dashed rgba(30,24,19,.18);border-radius:4px 4px 12px 12px;pointer-events:none}
.ticket-head{display:flex;justify-content:space-between;align-items:baseline;gap:12px;font:700 12px/1 var(--body);letter-spacing:.18em;text-transform:uppercase;color:var(--ink-3)}
.ticket-head span:first-child{font:600 1.15rem/1 var(--display);letter-spacing:0;text-transform:none;color:var(--ink)}
.ticket-progress{height:3px;background:var(--sand);border-radius:3px;margin:18px 0 26px;overflow:hidden}
.ticket-progress span{display:block;height:100%;width:33.3%;background:var(--cognac);transition:width .5s var(--ease)}
.t-step{border:0;margin:0;padding:0}
.t-step legend{font:600 1.4rem/1.2 var(--display);letter-spacing:-.025em;margin-bottom:20px;padding:0}
.chips{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
.opt{position:relative;cursor:pointer}
.opt input{position:absolute;opacity:0}
.opt span{display:flex;align-items:center;min-height:56px;padding:12px 16px;border-radius:12px;border:1.5px solid var(--line);background:#fff;font-weight:600;font-size:15px;line-height:1.25;transition:all .25s}
.opt span::before{content:"";flex:none;width:18px;height:18px;margin-right:12px;border-radius:50%;border:1.5px solid rgba(30,24,19,.35);transition:all .25s}
.opt:hover span{border-color:rgba(30,24,19,.4)}
.opt input:checked + span{border-color:var(--cognac);background:rgba(160,80,29,.07)}
.opt input:checked + span::before{border:5px solid var(--cognac)}
.opt input:focus-visible + span{outline:2px solid var(--cognac);outline-offset:2px}
.t-actions{display:flex;justify-content:flex-end;align-items:center;gap:8px;margin-top:24px}
.fields{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.field{display:flex;flex-direction:column;gap:8px;font-weight:600;font-size:14px}
.field input,.field textarea{font:inherit;font-weight:400;font-size:16px;padding:14px 16px;border-radius:12px;border:1.5px solid var(--line);background:#fff;color:var(--ink);min-height:52px;resize:vertical}
.field input:focus,.field textarea:focus{outline:none;border-color:var(--cognac);box-shadow:0 0 0 3px rgba(160,80,29,.15)}
.demo-note{font-size:12.5px;color:var(--ink-3);margin-top:14px}
.t-result{text-align:center;padding:26px 8px 10px}
.t-stamp{display:inline-block;font:700 14px/1 var(--body);letter-spacing:.24em;text-transform:uppercase;color:var(--cognac);border:2.5px solid var(--cognac);padding:12px 18px;border-radius:8px;transform:rotate(-6deg);margin-bottom:22px}
.t-result h3{font-size:1.6rem}
.t-result p{color:var(--ink-2);margin-top:10px}

/* Über mich */
.about{padding-block:var(--section-py);background:var(--paper)}
.about-grid{display:grid;grid-template-columns:.9fr 1.1fr;gap:80px;align-items:center}
.about-figure{position:relative;margin:0}
.about-figure img{width:100%;aspect-ratio:4/5;object-fit:cover;border-radius:999px 999px 22px 22px;box-shadow:0 40px 80px -40px rgba(60,35,15,.55)}
.about-label{position:absolute;left:-18px;bottom:44px;display:flex;flex-direction:column;gap:4px;padding:16px 22px 16px 20px;background:var(--leather);color:var(--linen);border-radius:4px 14px 14px 4px;box-shadow:0 18px 30px -14px rgba(0,0,0,.55);transform:rotate(-3deg)}
.about-label::after{content:"";position:absolute;inset:5px;border:1.2px dashed rgba(230,196,134,.6);border-radius:2px 10px 10px 2px}
.about-label b{font:600 1.1rem/1.1 var(--display)}
.about-label span{font-size:12px;letter-spacing:.14em;text-transform:uppercase;opacity:.75}
.about blockquote{margin:30px 0 0;font:500 clamp(1.4rem,2.2vw,1.9rem)/1.25 var(--display);letter-spacing:-.02em;color:var(--cognac);padding-left:22px;border-left:2px dashed var(--brass)}
.about-copy > p:not(.eyebrow){margin-top:22px;color:var(--ink-2);max-width:36em}
.facts{list-style:none;padding:0;margin:26px 0 0;display:flex;flex-wrap:wrap;gap:10px}
.facts li{padding:10px 16px;border-radius:999px;background:var(--linen);font-weight:600;font-size:14px;border:1px dashed rgba(30,24,19,.25)}
.btn-row{display:flex;flex-wrap:wrap;gap:12px;margin-top:32px}

/* Bewertungen: Chesterfield-Leder */
.reviews{position:relative;padding-block:var(--section-py);color:var(--linen);background-color:var(--leather);overflow:hidden;
  background-image:
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='88' height='88'%3E%3Cpath d='M0 44L44 0L88 44L44 88Z' fill='none' stroke='rgba(0,0,0,.35)' stroke-width='1.4'/%3E%3Cg fill='rgba(20,8,2,.55)'%3E%3Ccircle cx='44' cy='0' r='3.6'/%3E%3Ccircle cx='88' cy='44' r='3.6'/%3E%3Ccircle cx='44' cy='88' r='3.6'/%3E%3Ccircle cx='0' cy='44' r='3.6'/%3E%3C/g%3E%3C/svg%3E"),
    radial-gradient(circle at 50% 50%,rgba(255,200,150,.13),transparent 58%),
    radial-gradient(120% 80% at 50% 0%,#7b3a1b,var(--leather) 70%);
  background-size:88px 88px,88px 88px,100% 100%}
.reviews-head{display:grid;grid-template-columns:auto 1fr;gap:56px;align-items:end;margin-bottom:60px}
.score{display:flex;flex-direction:column;align-items:flex-start;gap:6px;padding:26px 30px;background:rgba(20,8,2,.35);border-radius:18px;border:1.5px dashed rgba(230,196,134,.45)}
.score strong{font:600 5.2rem/.9 var(--display);letter-spacing:-.05em;color:#fff}
.score small{font-size:13px;opacity:.8}

.reviews-link{display:inline-flex;min-height:44px;align-items:center;margin-top:16px;font-weight:700;color:var(--brass-l);text-decoration:none}
.tags{display:grid;grid-template-columns:repeat(3,1fr);gap:28px;align-items:start}
.tag{position:relative;background:var(--paper);color:var(--ink);padding:44px 28px 28px;border-radius:10px 10px 18px 18px;box-shadow:0 30px 50px -24px rgba(0,0,0,.6)}
.tag::after{content:"";position:absolute;inset:8px;border:1.3px dashed rgba(30,24,19,.18);border-radius:6px 6px 12px 12px;pointer-events:none}
.tag:nth-child(1){rotate:-1.6deg}.tag:nth-child(2){rotate:1.2deg;translate:0 18px}.tag:nth-child(3){rotate:-.6deg}
.js .tag.reveal:not(.is-in){transform:translateY(40px)}
.tag-hole{position:absolute;top:14px;left:50%;width:14px;height:14px;margin-left:-7px;border-radius:50%;background:var(--leather);box-shadow:0 0 0 4px var(--sand)}
.tag p{margin-top:14px;font-size:1.02rem;line-height:1.6}
.tag b{display:block;margin-top:18px;font-size:14px;letter-spacing:.06em}

/* Einsatzgebiet */
.area{position:relative;padding-block:calc(var(--section-py) * 1.4);color:#fff;overflow:hidden;background:#2a2019}
.area-bg{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.area-veil{position:absolute;inset:0;background:linear-gradient(90deg,rgba(24,16,11,.86),rgba(24,16,11,.45) 60%,rgba(24,16,11,.1))}
.area-inner{position:relative;max-width:var(--wrap)}
.area-inner h2,.area-inner > p{max-width:640px}
.area-inner > p:not(.eyebrow){margin-top:18px;font-size:1.1rem;color:rgba(255,248,238,.88)}
.area-tags{display:flex;flex-wrap:wrap;gap:10px;margin:26px 0 30px}
.area-tags span{padding:9px 16px;border-radius:999px;border:1.5px dashed rgba(230,196,134,.6);font-weight:600;font-size:14px}
.area-note{position:absolute;right:20px;bottom:14px;font-size:11px;color:rgba(255,255,255,.55)}

/* FAQ */
.faq{padding-block:var(--section-py);background:var(--linen)}
.faq-grid{display:grid;grid-template-columns:.8fr 1.2fr;gap:72px;align-items:start}
.faq-intro{position:sticky;top:110px}
.call-card{display:flex;flex-direction:column;gap:4px;margin-top:32px;padding:20px 24px;border-radius:16px;background:var(--ink);color:var(--linen);text-decoration:none;max-width:320px;transition:transform .25s}
.call-card:hover{transform:translateY(-3px)}
.call-card span{font-size:13px;opacity:.7}
.call-card b{font:600 1.45rem/1.1 var(--display);letter-spacing:-.02em}
.faq-list details{border-bottom:1.5px dashed rgba(30,24,19,.22)}
.faq-list details:first-child{border-top:1.5px dashed rgba(30,24,19,.22)}
.faq-list summary{display:flex;justify-content:space-between;align-items:center;gap:20px;min-height:44px;padding:24px 0;cursor:pointer;list-style:none;font:600 1.2rem/1.3 var(--display);letter-spacing:-.015em}
.faq-list summary::-webkit-details-marker{display:none}
.faq-list summary::after{content:"";flex:none;width:36px;height:36px;border-radius:50%;background:var(--paper) linear-gradient(var(--ink),var(--ink)) center/14px 2px no-repeat;box-shadow:inset 0 0 0 1.5px var(--line);transition:transform .35s var(--ease),background-color .3s}
.faq-list details:not([open]) summary::after{background-image:linear-gradient(var(--ink),var(--ink)),linear-gradient(var(--ink),var(--ink));background-size:14px 2px,2px 14px;background-position:center;background-repeat:no-repeat}
.faq-list details[open] summary::after{transform:rotate(180deg);background-color:var(--cognac);background-image:linear-gradient(#fff,#fff)}
.faq-list details p{padding:0 56px 26px 0;color:var(--ink-2)}

/* Kontakt */
.final{position:relative;padding-block:var(--section-py);color:var(--linen);background:#1b140f;overflow:hidden}
.final-bg{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:20% center;opacity:.9}
.final-veil{position:absolute;inset:0;background:linear-gradient(90deg,rgba(22,16,12,.94) 20%,rgba(22,16,12,.62) 60%,rgba(22,16,12,.35))}
.final-grid{position:relative;display:grid;grid-template-columns:1fr 1fr;gap:72px;align-items:center}
.final .lead{color:rgba(242,235,224,.8)}
.contact-list{list-style:none;padding:0;margin:34px 0 0;display:grid;gap:12px}
.contact-list a,.contact-list div{display:flex;flex-direction:column;gap:4px;padding:16px 20px;border-radius:14px;background:rgba(255,248,238,.06);border:1px dashed rgba(230,196,134,.35);text-decoration:none;transition:background .25s}
.contact-list a:hover{background:rgba(255,248,238,.12)}
.contact-list small{font-size:11.5px;letter-spacing:.16em;text-transform:uppercase;color:var(--brass-l)}
.contact-list b{font-size:1.05rem;overflow-wrap:anywhere}
.final-form{position:relative;background:var(--paper);color:var(--ink);border-radius:20px;padding:32px;display:grid;gap:16px;box-shadow:0 40px 80px -30px rgba(0,0,0,.7)}
.final-form::after{content:"";position:absolute;inset:9px;border:1.3px dashed rgba(30,24,19,.16);border-radius:14px;pointer-events:none}
.final-form-title{font:600 1.45rem/1.1 var(--display);letter-spacing:-.025em}
.final-form .demo-note{margin-top:0}
.final-result h3{font-size:1.3rem}

/* Footer */
.footer{background:#16110d;color:rgba(242,235,224,.78);padding:72px 0 28px;font-size:15px}
.ft-grid{display:grid;grid-template-columns:1.3fr 1fr 1fr 1.2fr;gap:44px}
.ft-brand img{width:92px;height:92px;object-fit:contain}
.ft-brand p{margin-top:16px;max-width:26em}
.footer h3{font:700 12px/1 var(--body);letter-spacing:.18em;text-transform:uppercase;color:var(--brass-l);margin-bottom:18px}
.footer ul{list-style:none;padding:0;margin:0;display:grid;gap:4px}
.footer li{min-height:32px;display:flex;align-items:center;overflow-wrap:anywhere}
.footer li:last-child{align-items:flex-start}
.footer a{text-decoration:none}
.footer a:hover{color:#fff}
.ft-bottom{display:flex;justify-content:space-between;flex-wrap:wrap;gap:16px;margin-top:56px;padding-top:24px;border-top:1px dashed rgba(242,235,224,.18);font-size:13px}
.ft-bottom nav{display:flex;gap:22px}
.ft-bottom a{min-height:44px;display:inline-flex;align-items:center}

/* WhatsApp */
.whatsapp{position:fixed;right:22px;bottom:22px;z-index:95;display:grid;place-items:center;width:60px;height:60px;border-radius:50%;background:#25D366;color:#fff;box-shadow:0 12px 28px -8px rgba(0,0,0,.45);transition:transform .25s}
.whatsapp:hover{transform:scale(1.07)}
.whatsapp svg{width:30px;height:30px;fill:currentColor}

/* Rechtliches */
.legal-page{background:var(--linen)}
.legal-shell{max-width:760px;margin:0 auto;padding:80px 24px}
.legal-shell h1{font-size:2.6rem;margin:24px 0}
.legal-shell h2{font-size:1.4rem;margin:24px 0 8px}
.legal-shell p{margin-top:8px}

/* Responsive */
@media (max-width:1100px){
  .nav-links{display:none}
  .burger{display:block}
}
@media (max-width:1020px){
  :root{--section-py:5rem}
  .benefits-grid,.inquiry-grid,.about-grid,.final-grid,.faq-grid{grid-template-columns:1fr;gap:48px}
  .studio{max-width:560px}
  .svc-layout{grid-template-columns:1fr}
  .svc-stage{display:none}
  .svc-list{display:grid;grid-template-columns:1fr 1fr;gap:36px 28px}
  .svc,.svc:last-child{grid-template-columns:1fr;padding:0;border:0}
  .js .svc-layout .svc{opacity:1}
  .svc-thumb{display:block;width:100%;aspect-ratio:3/2;object-fit:cover;border-radius:16px;margin-bottom:18px}
  .svc-num{padding:0 0 10px;color:var(--cognac)}
  .process .section-head{grid-template-columns:1fr;gap:0}
  .process .section-head .lead{margin-top:20px}
  .steps{grid-template-columns:1fr 1fr 1fr;gap:20px}
  .faq-intro{position:static}
  .about-figure{max-width:520px}
  .tags{grid-template-columns:1fr;max-width:620px}
  .tag:nth-child(n){rotate:none;translate:none}
  .reviews-head{grid-template-columns:1fr;gap:32px}
  .ft-grid{grid-template-columns:1fr 1fr}
}
@media (max-width:700px){
  :root{--section-py:4rem}
  body{font-size:16px}
  .wrap{padding-inline:20px}
  .nav-row{height:70px;gap:12px}
  .brand img{width:46px;height:46px}
  .brand-word b{font-size:16px}
  .nav-phone span,.nav-action{display:none}
  .nav-phone{width:48px;height:48px;justify-content:center;border-radius:12px;border:1.5px solid currentColor}
  .hero-inner{padding-top:120px;padding-bottom:70px}
  .hero h1{font-size:clamp(1.9rem,8.9vw,3rem)}
  .hero-actions{flex-direction:column}
  .hero-actions .btn{width:100%}
  .hero-bullets{flex-direction:column;gap:8px}
  .google-trust{width:100%}
  .hero-note{left:20px;right:auto}
  .svc-list{grid-template-columns:1fr}
  .steps{grid-template-columns:1fr;gap:44px}
  .process-cta .btn,.btn-row .btn{width:100%}
  .ticket{padding:30px 20px 24px}
  .chips{grid-template-columns:1fr}
  .fields{grid-template-columns:1fr}
  .t-actions .t-next,.t-actions .t-submit{flex:1}
  .about-label{left:12px}
  .score strong{font-size:4rem}
  .faq-list summary{font-size:1.12rem}
  .faq-list details p{padding-right:0}
  .final-form{padding:24px 20px}
  .ft-grid{grid-template-columns:1fr}
  .whatsapp{right:16px;bottom:16px;width:56px;height:56px}
}
@media (max-width:360px){
  .wrap{padding-inline:16px}
  .brand-word small{display:none}
  .swatch{padding-right:12px}
}
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}
  html{scroll-behavior:auto}
}

/* ---- Ergänzungen für die fertige Seite (Entwurf-Layout unverändert) ---- */
html,body{overflow-anchor:none}
/* Vorher/Nachher: mehrere echte Arbeiten */
.compare-before img{opacity:0;transition:opacity .6s var(--ease)}
.compare-before img.is-active{opacity:1}
.chip-sessel{background-image:url(img/echt/vn-sessel-nachher.webp);background-position:55% 55%}
.chip-sofa{background-image:url(img/echt/vn-sofa-nachher.webp);background-position:45% 60%}
/* Foto-Upload im Auftragszettel */
.upload{display:grid;gap:12px}
.drop{position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;min-height:132px;padding:22px;border-radius:12px;border:1.5px dashed rgba(160,80,29,.5);background:#fff;text-align:center;cursor:pointer;transition:background-color .25s,border-color .25s}
.drop:hover,.drop.is-over{background:rgba(160,80,29,.06);border-color:var(--cognac)}
.drop:has(input:focus-visible){outline:2px solid var(--cognac);outline-offset:3px}
.drop input{position:absolute;inset:0;width:100%;height:100%;opacity:0;cursor:pointer}
.drop b{font-size:16px;color:var(--cognac)}
.drop small{font-size:13.5px;color:var(--ink-3);max-width:30em}
.thumbs{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(auto-fill,minmax(72px,1fr));gap:10px}
.thumbs:empty{display:none}
.thumbs li{position:relative;aspect-ratio:1;border-radius:10px;overflow:hidden;background:var(--sand)}
.thumbs img{width:100%;height:100%;object-fit:cover}
.thumbs .file-name{display:grid;place-items:center;height:100%;padding:6px;font-size:11px;line-height:1.2;text-align:center;overflow-wrap:anywhere;color:var(--ink-2)}
.thumbs button{position:absolute;top:4px;right:4px;display:grid;place-items:center;width:28px;height:28px;border-radius:50%;border:0;background:rgba(30,24,19,.78);color:#fff;font:700 16px/1 var(--body);cursor:pointer}
.upload-msg{font-size:13px;color:var(--ink-3)}
.upload-msg:empty{display:none}
.upload-compact .drop{min-height:0;flex-direction:row;gap:10px;padding:14px 16px;justify-content:flex-start;text-align:left}
.upload-compact .drop b{font-size:15px}
.upload-compact .thumbs{grid-template-columns:repeat(auto-fill,minmax(58px,1fr))}
.t-hint{font-size:14px;color:var(--ink-3);margin-top:14px}
.t-hint a{color:var(--cognac);font-weight:700}
/* Einwilligung, Honeypot, Fehlermeldung */
.consent{display:flex;gap:12px;align-items:flex-start;margin-top:16px;font-size:13.5px;line-height:1.5;color:var(--ink-2);cursor:pointer}
.final-form .consent{margin-top:0}
.consent input{flex:none;width:20px;height:20px;margin:1px 0 0;accent-color:var(--cognac)}
.consent a{color:var(--cognac);font-weight:600}
.hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
.form-error{margin-top:14px;padding:12px 16px;border-radius:12px;background:#f7e3d6;color:#7a2a10;font-size:14px;line-height:1.5}
.form-error a{font-weight:700;color:inherit}
.form-error[hidden]{display:none}
.final-form .form-error{margin-top:0}
/* Blitzwebsite-Hinweis im Footer */
.ft-bottom .ft-partner{display:inline-flex;align-items:center;gap:8px;opacity:.85;white-space:nowrap}
.ft-bottom .ft-partner:hover{opacity:1}
.ft-partner img{width:72px;height:auto}
/* Rechtliches: Unterseiten mit Kopf und Fuß der Startseite */
.legal-page .nav{position:sticky;top:0}
.legal-main{padding:64px 0 96px}
.legal-shell{max-width:820px;margin:0 auto;padding:48px 44px;background:var(--paper);border-radius:20px;box-shadow:0 30px 60px -40px rgba(60,35,15,.4)}
.legal-shell h1{font-size:clamp(2rem,1.3rem + 2.6vw,3.1rem);margin:0 0 24px}
.legal-shell h2{font-size:1.3rem;letter-spacing:-.02em;line-height:1.25;margin:32px 0 8px;text-wrap:balance}
.legal-shell p,.legal-shell li{color:var(--ink-2);margin-top:8px}
.legal-shell ul{padding-left:20px;margin:8px 0 0}
.legal-shell a{color:var(--cognac);font-weight:600;overflow-wrap:anywhere}
.legal-shell dl{display:grid;grid-template-columns:minmax(0,150px) minmax(0,1fr);gap:8px 20px;margin:0;align-items:center}
.legal-shell dt{font-weight:600}
.legal-shell dd{margin:0;color:var(--ink-2)}
.legal-shell dd a{display:inline-flex;align-items:center;min-height:44px}
.legal-back{display:flex;width:max-content;align-items:center;min-height:44px;margin-bottom:6px;font-weight:700;color:var(--cognac);text-decoration:none}
.err-page{min-height:70vh;display:grid;place-items:center;text-align:center;padding:140px 24px 96px}
.err-page h1{font-size:clamp(2rem,1.3rem + 2.6vw,3.1rem);text-wrap:balance}
.err-page p{color:var(--ink-2);margin:18px auto 0;max-width:30em}
.err-page .btn-row{justify-content:center}
@media (max-width:700px){
  .legal-main{padding:36px 0 72px}
  .legal-shell{padding:30px 20px;border-radius:16px}
  .legal-shell dl{grid-template-columns:minmax(0,1fr);gap:2px}
  .legal-shell dd{margin-bottom:10px}
}
/* Navigation: Menüpunkte mittig (nur wenn genug Platz, darunter wie im Entwurf) */
@media (min-width:1281px){
  .nav-row{display:grid;grid-template-columns:minmax(0,1fr) auto minmax(0,1fr)}
  .brand{margin-right:0;justify-self:start}
  .nav-cta{justify-self:end}
}
/* ---- Feinschliff 29.09. ---- */
/* Dachzeilen ohne Strich */
.eyebrow::before{content:none}
/* Hero exakt Bildschirmhöhe, Inhalt passt sich der Höhe an */
.hero{height:var(--vh1,100svh);min-height:0}
.hero-inner{padding-top:clamp(84px,calc(var(--vu,1vh)*13),150px);padding-bottom:clamp(28px,calc(var(--vu,1vh)*8),92px)}
.hero h1{font-size:clamp(2.1rem,min(6.6vw,calc(var(--vu,1vh)*9.4)),6.2rem)}
.hero-lead{margin-top:clamp(12px,calc(var(--vu,1vh)*2.6),26px)}
.hero-bullets{margin-top:clamp(10px,calc(var(--vu,1vh)*2.2),22px)}
.hero-actions{margin-top:clamp(14px,calc(var(--vu,1vh)*3.4),34px)}
.google-trust{margin-top:clamp(12px,calc(var(--vu,1vh)*2.6),26px)}
@media (max-width:700px){
  .hero h1{font-size:clamp(1.75rem,min(8.9vw,calc(var(--vu,1vh)*5.2)),3rem)}
  .hero-lead{font-size:clamp(.98rem,calc(var(--vu,1vh)*2.1),1.05rem)}
  .hero-bullets{flex-direction:row;gap:6px 18px}
  .hero-actions{gap:10px}
}
@media (max-width:700px){
  .vh-720 .hero-actions{flex-direction:row}
  .vh-720 .hero-actions .btn{width:auto;flex:1;padding-inline:14px}
}
/* Vorher/Nachher kompakter, Section niedriger */
@media (min-width:1021px){
  .studio{width:100%;max-width:440px;justify-self:end}
  .about blockquote{font-size:clamp(1.15rem,1.65vw,1.55rem);white-space:nowrap}
}

/* Danke-Popup: Auftragszettel mit Lederpatch, Ziernaht, Stempel und Konfetti */
.party{position:fixed;inset:0;z-index:300;display:grid;place-items:center;padding:20px}
.party[hidden]{display:none}
.party-backdrop{position:absolute;inset:0;background:radial-gradient(120% 90% at 50% 40%,rgba(94,43,21,.78),rgba(22,16,12,.92));opacity:0;transition:opacity .45s var(--ease)}
.party.is-open .party-backdrop{opacity:1}
.party-confetti{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;z-index:2}
.party-card{position:relative;z-index:1;width:min(460px,100%);max-height:calc(100dvh - 40px);overflow:auto;background:var(--paper);color:var(--ink);text-align:center;border-radius:8px 8px 24px 24px;padding:34px 30px 30px;box-shadow:0 50px 90px -30px rgba(0,0,0,.7);
  -webkit-mask:radial-gradient(circle 9px at 50% 0,#0000 98%,#000) 0 0/28px 100%;mask:radial-gradient(circle 9px at 50% 0,#0000 98%,#000) 0 0/28px 100%;
  opacity:0;transform:translateY(-60px) rotate(-4deg) scale(.86)}
.party-card::after{content:"";position:absolute;inset:18px 12px 12px;border:1.5px dashed rgba(30,24,19,.18);border-radius:4px 4px 16px 16px;pointer-events:none}
.party.is-open .party-card{animation:party-drop .8s cubic-bezier(.2,1.25,.35,1) forwards}
@keyframes party-drop{60%{opacity:1;transform:translateY(8px) rotate(1deg) scale(1.02)}100%{opacity:1;transform:none}}
.party-x{position:absolute;top:20px;right:18px;z-index:2;width:44px;height:44px;border-radius:50%;border:0;background:transparent;color:var(--ink-3);font:400 28px/1 var(--body);cursor:pointer}
.party-x:hover{color:var(--ink)}
.party-patch{position:relative;width:132px;height:132px;margin:10px auto 0;border-radius:26px;background:radial-gradient(120% 90% at 30% 20%,#7b3a1b,var(--leather) 70%);box-shadow:0 18px 30px -14px rgba(60,25,8,.7),inset 0 1px 0 rgba(255,220,180,.18);transform:scale(.4) rotate(-12deg);opacity:0}
.party.is-open .party-patch{animation:party-patch .7s .25s cubic-bezier(.2,1.4,.4,1) forwards}
@keyframes party-patch{to{opacity:1;transform:none}}
.party-patch img{position:absolute;inset:6px;width:calc(100% - 12px);height:calc(100% - 12px)}
.party-stitch{position:absolute;inset:0;width:100%;height:100%}
.party-seam{fill:none;stroke:var(--brass-l);stroke-width:3;stroke-dasharray:7 6;stroke-linecap:round}
.party-seam-draw{fill:none;stroke:#fff;stroke-width:8;stroke-dasharray:100;stroke-dashoffset:100}
.party.is-open .party-seam-draw{animation:party-sew 1.1s .6s var(--ease) forwards}
@keyframes party-sew{to{stroke-dashoffset:0}}
.party-stamp{display:inline-block;margin-top:20px;font:700 14px/1 var(--body);letter-spacing:.24em;text-transform:uppercase;color:var(--cognac);border:2.5px solid var(--cognac);padding:11px 16px;border-radius:8px;opacity:0;transform:rotate(-8deg) scale(2.4)}
.party.is-open .party-stamp{animation:party-stamp .5s 1.05s cubic-bezier(.3,1.6,.5,1) forwards,party-shake .3s 1.5s ease-in-out}
@keyframes party-stamp{to{opacity:1;transform:rotate(-8deg) scale(1)}}
@keyframes party-shake{25%{translate:-3px 1px}50%{translate:3px -1px}75%{translate:-2px 0}}
.party-card .party-title{margin:18px 0 0;font-family:var(--display);font-weight:600;font-size:clamp(1.55rem,5vw,2rem);line-height:1.1;letter-spacing:-.03em;text-wrap:balance}
.party-card .party-title:focus{outline:none}
.party-sum{display:inline-flex;flex-wrap:wrap;justify-content:center;gap:6px;margin-top:14px}
.party-sum span{padding:6px 12px;border-radius:999px;background:var(--linen);border:1px dashed rgba(30,24,19,.25);font-weight:600;font-size:13.5px}
.party-text{margin-top:14px;color:var(--ink-2);font-size:15.5px;line-height:1.55}
.party-text a{color:var(--cognac);font-weight:700;white-space:nowrap}
.party-ok{margin-top:22px;min-width:180px}
.party-card > :not(.party-patch):not(.party-stamp):not(.party-x){opacity:0;transform:translateY(12px)}
.party.is-open .party-card > :not(.party-patch):not(.party-stamp):not(.party-x){animation:party-in .55s var(--ease) forwards}
.party.is-open .party-card .party-title{animation-delay:.55s!important}
.party.is-open .party-sum{animation-delay:.68s!important}
.party.is-open .party-text{animation-delay:.78s!important}
.party.is-open .party-ok{animation-delay:.9s!important}
@keyframes party-in{to{opacity:1;transform:none}}
@media (prefers-reduced-motion:reduce){
  .party-card,.party-patch,.party-stamp,.party-card > *{opacity:1!important;transform:none!important;animation:none!important}
  .party-seam-draw{stroke-dashoffset:0}
}
.party-sum[hidden]{display:none}
/* Hero auf kleinen Handys: Stichpunkte weg statt Überlappung mit der Nav, ganz kleine Screens dürfen wachsen */
/* Höhen-Stufen als Klassen (einmal beim Laden gemessen), NICHT als max-height-Media-Query:
   Chrome auf dem iPhone ändert die Viewport-Höhe beim Scrollen, dann sprang der Hero um */
@media (max-width:700px){
  .vh-700 .hero-inner{padding-top:80px;padding-bottom:22px}
  .vh-700 .google-trust{padding-block:6px}
  .vh-650 .hero-bullets{display:none}
}
.vh-600 .hero{height:auto;min-height:var(--vh1,100svh)}
.party-card [data-party-hi]{display:block}
/* Google-Bewertungen: echtes G-Logo + Google-Profilbild der Rezensenten */
.g-inline{display:inline-block;width:14px;height:14px;margin-right:6px;vertical-align:-2px}
.tag-top{display:flex;justify-content:space-between;align-items:center}
.tag .g-logo{width:20px;height:20px}
.tag-author{display:flex;align-items:center;gap:12px;margin-top:18px}
.tag-author img{flex:none;width:38px;height:38px;border-radius:50%}
.tag-author b{margin-top:0}
.tag-author small{display:block;margin-top:2px;font-size:12px;color:var(--ink-3)}

/* ---- Anfrage frischer: Icon-Kacheln, Naht-Fortschritt, genähte Schrittliste ---- */
.ticket-fresh .chips{grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}
.ticket-fresh .opt span{position:relative;display:flex;flex-direction:column;align-items:flex-start;justify-content:space-between;gap:12px;min-height:108px;padding:14px 14px 13px;border-radius:14px;border:1.5px solid var(--line);background:#fff;transition:transform .25s var(--ease),border-color .25s,box-shadow .25s,background-color .25s}
.ticket-fresh .opt span::before{content:"";position:absolute;top:10px;right:10px;width:22px;height:22px;margin:0;border-radius:50%;border:1.5px solid rgba(30,24,19,.2);background:#fff;transition:transform .3s cubic-bezier(.3,1.6,.5,1),background-color .2s,border-color .2s}
.ticket-fresh .opt:hover span{border-color:rgba(160,80,29,.45);transform:translateY(-2px);box-shadow:0 12px 22px -16px rgba(60,35,15,.5)}
.ticket-fresh .opt input:checked + span{border-color:var(--cognac);background:#fffaf4;transform:translateY(-2px);box-shadow:0 14px 26px -16px rgba(125,59,19,.7)}
.ticket-fresh .opt input:checked + span::before{border:0;background:var(--cognac) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M6 12.5l4 4L18 8' fill='none' stroke='%23fff' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/14px no-repeat;transform:scale(1.12)}
.ticket-fresh .opt input:checked + span::after{content:"";position:absolute;inset:5px;border:1.3px dashed rgba(160,80,29,.5);border-radius:10px;pointer-events:none}
.ticket-fresh .opt b{font:600 15px/1.25 var(--body);color:var(--ink);padding-right:4px}
.opt-ico{display:grid;place-items:center;width:44px;height:44px;border-radius:12px;background:var(--linen);color:var(--cognac);transition:background-color .25s,color .25s,transform .35s cubic-bezier(.3,1.5,.5,1)}
.opt-ico svg{width:25px;height:25px;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}
.ticket-fresh .opt input:checked + span .opt-ico{background:var(--cognac);color:#fff;transform:rotate(-6deg)}
.ticket-fresh .ticket-progress{height:3px;overflow:visible;border-radius:0;background:repeating-linear-gradient(90deg,rgba(30,24,19,.2) 0 7px,transparent 7px 12px)}
.ticket-fresh .ticket-progress span{position:relative;border-radius:3px}
.ticket-fresh .ticket-progress span::after{content:"";position:absolute;right:-6px;top:50%;width:12px;height:12px;border-radius:50%;background:#fff;border:3px solid var(--cognac);transform:translateY(-50%);box-shadow:0 2px 6px rgba(125,59,19,.35)}
.ticket-fresh .t-step:not([hidden]){animation:t-step-in .45s var(--ease)}
@keyframes t-step-in{from{opacity:0;transform:translateX(18px)}}
.drop-ico{display:grid;place-items:center;width:52px;height:52px;border-radius:50%;background:var(--linen);margin-bottom:4px}
.drop-ico svg{width:28px;height:28px;fill:none;stroke:var(--cognac);stroke-width:1.6;stroke-linejoin:round}
/* Schrittliste links als Naht */
.inq-steps{gap:16px}
.inq-steps li{position:relative}
.inq-steps li:not(:last-child)::after{content:"";position:absolute;left:18px;top:40px;height:12px;border-left:1.5px dashed rgba(160,80,29,.45)}
.inq-steps li.is-done{color:var(--ink-2)}
.inq-steps li.is-done span{border:0;background:rgba(160,80,29,.14) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M6 12.5l4 4L18 8' fill='none' stroke='%23a0501d' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/16px no-repeat;color:transparent}
.inq-steps li.is-current span{animation:inq-pulse 2.2s ease-out infinite}
@keyframes inq-pulse{0%{box-shadow:0 0 0 0 rgba(160,80,29,.4)}70%,100%{box-shadow:0 0 0 12px rgba(160,80,29,0)}}
.inq-wa{display:inline-flex;align-items:center;gap:12px;margin-top:30px;padding:10px 20px 10px 10px;border-radius:999px;background:#fff;border:1.5px dashed rgba(30,24,19,.18);color:var(--ink-2);font-size:14.5px;line-height:1.3;text-decoration:none;transition:transform .25s var(--ease),border-color .25s,box-shadow .25s}
.inq-wa:hover{transform:translateY(-2px);border-color:#25D366;box-shadow:0 12px 22px -16px rgba(20,90,40,.6)}
.inq-wa svg{flex:none;width:36px;height:36px;padding:8px;border-radius:50%;background:#25D366;fill:#fff}
.inq-wa b{color:var(--ink)}
@media (max-width:700px){
  .ticket-fresh .chips{grid-template-columns:repeat(2,minmax(0,1fr))}
  .ticket-fresh .opt span{min-height:98px;padding:12px}
  .ticket-fresh .opt b{font-size:14.5px}
}

/* ---- Handy-Menü: vollflächig, nummeriert, mit Kontakt-Fuß ---- */
.mobile-menu{position:absolute;top:100%;left:0;right:0;height:calc(var(--vh1,100svh) - 70px);overflow-y:auto;overscroll-behavior:contain;gap:0;padding:6px 24px calc(22px + env(safe-area-inset-bottom));background:var(--linen)}
.mm-links{list-style:none;margin:0;padding:0}
.mobile-menu .mm-links a{display:flex;align-items:center;gap:14px;padding:17px 2px;font:600 clamp(1.65rem,7.4vw,2.2rem)/1.05 var(--display);letter-spacing:-.03em;text-decoration:none;border-bottom:1.5px dashed rgba(30,24,19,.16)}
.mm-no{flex:none;min-width:24px;font:600 12px/1 var(--body);letter-spacing:.14em;color:var(--cognac);align-self:flex-start;margin-top:.35em}
.mm-arrow{margin-left:auto;font-size:1.2rem;color:var(--cognac);opacity:.6;transition:transform .25s var(--ease),opacity .25s}
.mobile-menu .mm-links a:hover .mm-arrow,.mobile-menu .mm-links a:active .mm-arrow{opacity:1;transform:translateX(5px)}
.mm-foot{margin-top:auto;padding-top:24px;display:grid;gap:10px}
.mobile-menu .mm-foot .btn{margin-top:0}
.mm-quick{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
.mm-quick .btn{min-height:52px;padding:0 12px}
.mm-quick .btn svg{width:18px;height:18px}
.mm-quick .mm-wa svg{fill:#25D366;stroke:none}
.mobile-menu:not([hidden]) .mm-links li,.mobile-menu:not([hidden]) .mm-foot{animation:mm-in .5s var(--ease) both;animation-delay:calc(var(--i) * 55ms + 60ms)}
@keyframes mm-in{from{opacity:0;transform:translateY(14px)}}
.ticket-fresh .chips{grid-auto-rows:1fr}
.ticket-fresh .opt{display:block;height:100%}
.ticket-fresh .opt span{height:100%}

/* ---- Echtes Logo als Plakette (Header + Footer), Popup-Logo mittig ---- */
.brand-badge{position:relative;display:grid;place-items:center;flex:none;height:56px;padding:6px 11px;border-radius:12px;background:#fbf7f0;box-shadow:0 8px 18px -10px rgba(0,0,0,.5),inset 0 0 0 1px rgba(30,24,19,.08)}
.brand-badge::after{content:"";position:absolute;inset:3px;border:1.2px dashed rgba(160,80,29,.35);border-radius:9px;pointer-events:none}
.brand .brand-badge img{display:block;width:auto;height:44px;object-fit:contain}
.party-patch img{inset:auto;left:50%;top:50%;width:72%;height:auto;transform:translate(-50%,-50%)}
@media (max-width:700px){
  .brand-badge{height:48px;padding:5px 9px}
  .brand .brand-badge img{width:auto;height:37px}
}

/* ---- Footer lebendiger ---- */
.footer{position:relative;background:radial-gradient(90% 60% at 0% 0%,rgba(125,59,19,.3),transparent 62%),radial-gradient(60% 50% at 100% 100%,rgba(43,54,40,.35),transparent 70%),#16110d}
.footer::before{content:"";position:absolute;left:0;right:0;top:10px;border-top:1.5px dashed rgba(199,157,87,.35)}
.ft-badge{position:relative;display:inline-grid;place-items:center;padding:10px 15px;border-radius:16px;background:#fbf7f0;box-shadow:0 16px 32px -18px rgba(0,0,0,.85)}
.ft-badge::after{content:"";position:absolute;inset:4px;border:1.3px dashed rgba(160,80,29,.38);border-radius:12px;pointer-events:none}
.ft-brand .ft-badge img{display:block;width:auto;height:66px}
.ft-actions{display:flex;flex-wrap:wrap;align-items:center;gap:10px;margin-top:22px}
.ft-round{display:grid;place-items:center;flex:none;width:44px;height:44px;border-radius:50%;border:1.5px solid rgba(242,235,224,.28);color:#f2ebe0;transition:background-color .25s,border-color .25s,transform .25s var(--ease)}
.ft-round:hover{transform:translateY(-2px);background:rgba(255,248,238,.08)}
.ft-round svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round}
.ft-round.ft-wa{border-color:rgba(37,211,102,.55)}
.ft-round.ft-wa svg{fill:#25D366;stroke:none;width:20px;height:20px}
.ft-google{display:inline-flex;align-items:center;gap:8px;margin-top:18px;padding:9px 14px;border-radius:999px;background:rgba(255,248,238,.06);border:1px dashed rgba(230,196,134,.3);font-size:13px;line-height:1.2;color:rgba(242,235,224,.82)}
.ft-brand .ft-google img{width:16px;height:16px}
.ft-google b{color:#fff}
.ft-google .stars{font-size:12px;letter-spacing:1px}
.ft-contact ul{gap:6px}
.ft-contact a,.ft-contact .ft-li{display:inline-flex;align-items:flex-start;gap:10px;min-height:32px}
.ft-contact svg{flex:none;width:18px;height:18px;margin-top:3px;fill:none;stroke:var(--brass-l);stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
@media (max-width:700px){
  .footer{padding:60px 0 26px}
  .ft-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:34px 18px}
  .ft-brand,.ft-contact{grid-column:1/-1}
  .ft-brand p{font-size:15px}
  .ft-actions .btn{flex:1}
  .footer h3{margin-bottom:12px}
  .ft-col li{min-height:30px;font-size:15px}
  .ft-contact ul{padding:14px 16px;border-radius:16px;background:rgba(255,248,238,.05);border:1px dashed rgba(230,196,134,.25)}
  .ft-contact a,.ft-contact .ft-li{min-height:40px;align-items:center}
  .ft-contact svg{margin-top:0}
  .ft-bottom{flex-direction:column;align-items:center;text-align:center;gap:10px}
  .ft-bottom nav{flex-wrap:wrap;justify-content:center;gap:4px 18px}
}
.ft-google{white-space:nowrap}
@media (max-width:480px){
  .nav .brand-word{display:none}
}

/* ---- iPhone/Chrome: automatische Dunkel-Umfärbung sperren, Hero am Handy ---- */
:root{color-scheme:light only}
@media (max-width:700px){
  .hero-note{display:none}
  .hero-grade{background:linear-gradient(0deg,rgba(24,16,11,.9) 0%,rgba(24,16,11,.72) 45%,rgba(24,16,11,.5) 100%)}
}

/* ---- Abnahme-Fixes: iPhone-Performance, Scrollen, Tippflächen, Größen ---- */
html{scroll-behavior:auto}
.nav.is-solid{-webkit-backdrop-filter:none;backdrop-filter:none;background:#f2ebe0}
.btn-ghost{-webkit-backdrop-filter:none;backdrop-filter:none}
.hero .btn-ghost,.process .btn-ghost{background:rgba(20,14,10,.28)}
.google-trust{-webkit-backdrop-filter:none;backdrop-filter:none;background:rgba(20,14,10,.4)}
.google-trust:hover{background:rgba(20,14,10,.55)}
.ft-google{min-height:44px}
@media (min-width:2000px){
  .hero-video{filter:saturate(.85) sepia(.18) contrast(1.06) blur(1px)}
}
@media (max-width:700px){
  .footer .ft-col li a{display:inline-flex;align-items:center;min-height:44px}
  .ft-col li{min-height:44px}
}
@media (max-width:380px){
  h2{font-size:clamp(1.6rem,8vw,1.9rem)}
}
/* Handy-Header: nur Logo + Menü, kein Telefon-Kasten */
@media (max-width:700px){
  .nav .nav-phone{display:none}
}
/* Hero-Headline zweizeilig: "Dein Lieblingsstück / neu bezogen in Berlin" */
.hero h1 .line{white-space:nowrap}
/* Bewertungen: echtes Werkstattfoto statt gezeichnetem Chesterfield-Muster, Parallaxe.
   Bild hängt auf Bildschirmhöhe (fixed, per clip-path auf die Section begrenzt), damit es am Handy nicht hochskaliert wird. */
.reviews{background-image:none;clip-path:inset(0)}
.reviews-bg{position:fixed;left:0;right:0;top:calc(var(--vh1,100vh)*-.25);height:calc(var(--vh1,100vh)*1.6);z-index:0;pointer-events:none;will-change:transform}
.reviews-bg img{display:block;width:100%;height:100%;object-fit:cover;object-position:50% 22%;opacity:0;transition:opacity .8s var(--ease)}
.reviews-bg img.is-loaded{opacity:1}
.reviews-veil{position:absolute;inset:0;z-index:0;pointer-events:none;background:linear-gradient(180deg,rgba(52,23,9,.82) 0%,rgba(74,34,15,.58) 45%,rgba(46,20,8,.76) 100%)}
.reviews > .wrap{position:relative;z-index:1}
@media (prefers-reduced-motion:reduce){.reviews-bg{position:absolute;top:0;height:100%;will-change:auto}}
.ticket-head [data-step-count]{white-space:nowrap}
/* Handy-Menü als normales Dropdown (30.09.): nur so hoch wie der Inhalt, Buttons direkt unter den Links.
   Vorher volle Höhe mit Buttons unten -> in iPhone-Chrome (Übersetzungsleiste + Toolbar) abgeschnitten */
.mobile-menu{height:auto;max-height:calc(100vh - 70px);padding:2px 20px 18px;border-radius:0 0 18px 18px;
  box-shadow:0 0 0 100vmax rgba(22,16,12,.5);clip-path:inset(0 0 -100vmax 0)}
@supports (height:1dvh){.mobile-menu{max-height:calc(100dvh - 70px)}}
.mobile-menu .mm-links a{padding:13px 2px;font-size:clamp(1.2rem,5.4vw,1.4rem)}
.mm-no{align-self:center;margin-top:0}
.mm-foot{margin-top:0;padding-top:16px}
.mm-quick .btn{min-height:48px}
.menu-open .whatsapp{opacity:0;visibility:hidden;pointer-events:none}
@media (max-width:700px){.whatsapp{transition:transform .25s,opacity .25s,visibility .25s}.whatsapp.is-off{opacity:0;visibility:hidden;pointer-events:none}}
/* Hinweis aus der Verwaltung (z. B. Betriebsurlaub), sitzt über der Dachzeile im Hero */
.hero-hinweis{display:flex;width:fit-content;align-items:center;gap:10px;max-width:100%;margin:0 0 16px;padding:9px 16px 9px 12px;border-radius:999px;background:rgba(20,14,10,.55);border:1px solid rgba(230,196,134,.55);color:#fff;font:600 14px/1.35 var(--body);animation:hinweis-in .5s var(--ease) both}
.hero-hinweis[hidden]{display:none}
.hero-hinweis::before{content:"";flex:none;width:8px;height:8px;border-radius:50%;background:var(--brass-l);box-shadow:0 0 0 4px rgba(230,196,134,.22)}
@keyframes hinweis-in{from{opacity:0;transform:translateY(6px)}}
@media (max-width:700px){.hero-hinweis{font-size:13px;margin-bottom:12px}}