/* ==========================================================================
   upclients · Offerten & Rechnungen
   Hero mit entstehendem Dokument · Kapitel Rechnungen / Offerten / Auftritt ·
   Ablauf mit klebendem Dokument · Fragen · Feierabend
   Klassen tragen das Präfix oz- (neu.css belegt viele kurze Namen).
   ========================================================================== */

@keyframes ozType{from{clip-path:inset(0 100% 0 0)}to{clip-path:inset(0 0 0 0)}}
@keyframes ozRing{0%,60%,100%{transform:rotate(0)}10%{transform:rotate(14deg)}20%{transform:rotate(-12deg)}30%{transform:rotate(9deg)}40%{transform:rotate(-6deg)}50%{transform:rotate(3deg)}}
@keyframes ozFly{0%{opacity:0;transform:translate(-50%,-50%) scale(.4)}10%{opacity:1;transform:translate(-50%,-50%) scale(1.15)}22%{transform:translate(calc(-50% + 20px),calc(-50% - 22px)) scale(1)}85%{opacity:1}100%{opacity:0;transform:translate(calc(-50% + 300px),calc(-50% - 330px)) scale(.75)}}
@keyframes ozRing2{0%{opacity:.75;transform:translate(-50%,-50%) scale(.3)}100%{opacity:0;transform:translate(-50%,-50%) scale(2.6)}}
@keyframes ozPop{0%{opacity:0;transform:translateY(14px) scale(.9)}60%{opacity:1;transform:translateY(-3px) scale(1.03)}100%{opacity:1;transform:none}}
@keyframes ozRipple{from{opacity:.5;transform:scale(.2)}to{opacity:0;transform:scale(2.4)}}

/* =====================================================================
   1 · HERO
   ===================================================================== */
.oz-hero{position:relative;color:#fff;overflow:clip;isolation:isolate;padding:calc(var(--hdr) + clamp(20px,4vh,50px)) 0 clamp(50px,8vh,90px)}
.oz-hero::before{content:"";position:absolute;left:50%;bottom:-6%;width:150vw;height:70vh;transform:translateX(-50%);background:radial-gradient(48% 40% at 50% 70%,rgba(121,164,242,.4),rgba(92,136,215,.14) 48%,rgba(92,136,215,0) 74%);pointer-events:none;z-index:-1;animation:dawn 9s ease-in-out infinite alternate}
.oz-hero__grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,.92fr);gap:clamp(24px,4vw,70px);align-items:center;min-height:min(78vh,760px)}
.oz-hero__text{max-width:620px}
.oz-eb{color:var(--p200);letter-spacing:.2em}
.oz-eb .dot{width:7px;height:7px;flex:none;border-radius:50%;background:var(--p300);box-shadow:0 0 0 4px rgba(154,190,255,.18),0 0 14px var(--p300);animation:pulseDot 2.4s ease-in-out infinite}
.oz-title{font-size:clamp(34px,3.9vw,62px);line-height:1.03;letter-spacing:-.042em;font-weight:800;margin-top:24px;text-wrap:balance;opacity:0;animation:fadeUp 1.1s var(--ease) .1s forwards}
.oz-sub{font-size:clamp(17px,1.4vw,21px);line-height:1.55;color:var(--p200);margin-top:24px;max-width:40ch;opacity:0;animation:fadeUp 1s var(--ease) .4s forwards}
.oz-cta{display:flex;gap:12px;flex-wrap:wrap;margin-top:32px;opacity:0;animation:fadeUp 1s var(--ease) .55s forwards}
.oz-fine{font-size:13px;color:rgba(197,218,255,.72);margin-top:16px;opacity:0;animation:fadeUp 1s var(--ease) .7s forwards}
.rm .oz-title,.rm .oz-sub,.rm .oz-cta,.rm .oz-fine{opacity:1}

.oz-stage{position:relative;width:100%;max-width:520px;margin-left:auto;opacity:0;animation:fadeUp 1.2s var(--ease) .3s forwards}
.rm .oz-stage{opacity:1}
.oz-docwrap{container-type:inline-size;position:relative;width:100%}
.oz-docwrap--hero{width:min(100%,440px);margin:0 auto;aspect-ratio:1/1.36;perspective:1900px;transform:rotateX(var(--rx,0deg)) rotateY(var(--ry,0deg));transition:transform .35s var(--ease)}
.oz-flip{position:absolute;inset:0;transform-style:preserve-3d;transition:transform 1.1s var(--ease)}
.oz-stage [data-face="r"].oz-flip{transform:rotateY(180deg)}
.oz-face{position:absolute;inset:0;backface-visibility:hidden;-webkit-backface-visibility:hidden}
.oz-face--r{transform:rotateY(180deg)}
.oz-plane{position:absolute;left:50%;top:44%;z-index:6;width:72px;height:72px;border-radius:50%;display:grid;place-items:center;background:linear-gradient(160deg,#fff,#DCE8FF);color:var(--p800);box-shadow:0 0 0 6px rgba(154,190,255,.28),0 20px 44px -10px rgba(3,10,30,.7),0 0 46px 6px rgba(154,190,255,.7);opacity:0;pointer-events:none;transform:translate(-50%,-50%)}
.oz-plane svg{position:relative;z-index:1;width:36px;height:36px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
.oz-plane::before{content:"";position:absolute;left:50%;top:50%;width:260px;height:6px;margin-top:-3px;border-radius:6px;transform-origin:left center;transform:rotate(131deg);background:linear-gradient(90deg,rgba(220,232,255,.95),rgba(154,190,255,.45) 40%,rgba(154,190,255,0));filter:blur(1.5px)}
.oz-plane::after{content:"";position:absolute;left:50%;top:50%;width:72px;height:72px;border-radius:50%;box-shadow:inset 0 0 0 2px rgba(220,232,255,.9);opacity:0}
.oz-plane.fly{animation:ozFly 2.6s cubic-bezier(.45,.05,.3,1) forwards}
.oz-plane.fly::after{animation:ozRing2 1.3s ease-out .1s}
.oz-docwrap--hero{transition:transform .35s var(--ease),opacity .8s var(--ease),filter .8s}
.oz-docwrap--hero.is-out{opacity:0;filter:blur(6px)}
.oz-docwrap--hero.is-send .oz-flip{animation:ozLift 2.4s var(--ease)}
@keyframes ozLift{0%{transform:none}25%{transform:translateY(-16px) scale(1.015)}70%{transform:translateY(-8px) scale(1.005)}100%{transform:none}}
.oz-steps{display:flex;justify-content:center;flex-wrap:wrap;gap:10px;margin-top:28px}
.oz-steps li{display:inline-flex;align-items:center;gap:9px;padding:7px 15px 7px 8px;border-radius:999px;font-size:13.5px;font-weight:700;color:var(--p200);background:rgba(255,255,255,.07);box-shadow:inset 0 0 0 1px rgba(255,255,255,.16);transition:background .4s,color .4s,box-shadow .4s}
.oz-steps li i{font-style:normal;display:grid;place-items:center;width:22px;height:22px;border-radius:50%;font-size:11.5px;font-weight:800;background:rgba(255,255,255,.14);transition:background .4s,color .4s}
.oz-steps li.is-on{color:var(--i950);background:#fff;box-shadow:0 12px 26px -10px rgba(154,190,255,.8)}
.oz-steps li.is-on i{background:var(--p800);color:#fff}
.oz-steps li.is-done{color:#fff}
.oz-steps li.is-done i{background:var(--ok-mid);color:#0A2A1C}
.oz-demo{text-align:center;font-size:12px;color:rgba(197,218,255,.6);margin-top:14px}

.oz-feats{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;margin-top:clamp(36px,6vh,64px)}
.oz-feat{display:flex;gap:16px;align-items:flex-start;padding:22px 24px;border-radius:24px}
.oz-feat .gi{--s:54px}
.oz-feat h3{font-size:18px;font-weight:800;letter-spacing:-.02em}
.oz-feat p{font-size:14.5px;line-height:1.55;color:var(--p200);margin-top:5px}

/* =====================================================================
   Dokument (Papier)
   ===================================================================== */
.oz-doc{--acc:#315392;--ink:#141E30;--muted:#656E7D;--line:#E9EDF4;position:absolute;inset:0;overflow:hidden;display:flex;flex-direction:column;background:#fff;color:var(--ink);
  border-radius:clamp(8px,2.6cqw,14px);padding:5.4cqw 5.4cqw 4.8cqw;font-size:clamp(8.5px,2.4cqw,12.5px);line-height:1.35;font-variant-numeric:tabular-nums;
  box-shadow:0 50px 90px -40px rgba(3,10,30,.75),0 0 0 1px rgba(20,30,48,.07)}
.oz-doc small{display:block;font-size:.8em;color:var(--muted)}
.oz-doc__head{display:flex;justify-content:space-between;align-items:flex-start;gap:3cqw;padding-bottom:3.2cqw;border-bottom:1.5px solid var(--ink)}
.oz-doc__firm{display:flex;gap:2.4cqw;align-items:center;min-width:0}
.oz-doc__logo{flex:none;display:grid;place-items:center;width:9cqw;height:9cqw;border-radius:2.2cqw;background:var(--acc)}
.oz-doc__logo svg{width:58%;height:58%;fill:#fff}
.oz-doc__firmtx b{display:block;font-size:1.06em;letter-spacing:-.01em}
.oz-doc__meta{text-align:right;flex:none}
.oz-doc__kind{display:block;font-size:.76em;letter-spacing:.16em;text-transform:uppercase;color:var(--acc);font-weight:800}
.oz-doc__no{display:block;font-size:1.75em;line-height:1.05;letter-spacing:-.03em}
.oz-doc__addr{display:flex;justify-content:space-between;gap:4cqw;margin-top:4cqw}
.oz-doc__to small{text-transform:uppercase;letter-spacing:.12em;font-weight:800;font-size:.72em}
.oz-doc__to b{display:block;font-size:1.1em;margin-top:.2em}
.oz-doc__to span{display:block;color:var(--muted)}
.oz-doc__from{text-align:right}
.oz-doc__subject{margin-top:3.4cqw;font-weight:800;font-size:1.08em;letter-spacing:-.01em}
.oz-t{margin-top:2.6cqw;flex:0 0 auto}
.oz-doc__note{margin-top:3cqw;font-size:.9em;color:var(--muted);max-width:70%}
.oz-t__h,.oz-r{display:grid;grid-template-columns:5cqw minmax(0,1fr) 9.5cqw 10.5cqw 13cqw;gap:1.6cqw;align-items:center}
.oz-t__h{padding:1.3cqw 0;border-bottom:1px solid var(--line);font-size:.72em;letter-spacing:.09em;text-transform:uppercase;font-weight:800;color:#4E5663}
.oz-r{padding:1.95cqw 0;border-bottom:1px solid var(--line);transition:opacity .45s var(--ease),transform .55s var(--ease),background .6s}
.oz-r span:nth-child(n+3),.oz-t__h span:nth-child(n+3),.oz-r b{text-align:right}
.oz-r span:nth-child(2){min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.oz-r.is-flash{background:linear-gradient(90deg,rgba(121,164,242,.28),rgba(121,164,242,0))}
.oz-doc__sum{margin-top:auto;align-self:flex-end;width:54%;padding-top:2.6cqw}
.oz-doc__sum>div{display:flex;justify-content:space-between;gap:2cqw;padding:.5cqw 0}
.oz-doc__grand{border-top:1.5px solid var(--ink);margin-top:1.2cqw;padding-top:1.4cqw!important;font-size:1.16em}
.oz-doc__grand b{font-size:1.06em;letter-spacing:-.02em}
.oz-pay{display:flex;align-items:center;gap:3cqw;margin-top:3cqw;padding-top:3cqw;border-top:1px dashed #C5CCDA}
.oz-pay b{display:block}
.oz-qr{flex:none;width:13.5cqw;height:13.5cqw;fill:var(--ink)}
.oz-stamp{position:absolute;left:6cqw;bottom:9cqw;display:flex;align-items:center;gap:.5em;padding:.45em .9em;border:2px solid var(--ok);border-radius:.6em;color:var(--ok);font-weight:800;font-size:1.08em;letter-spacing:.14em;text-transform:uppercase;background:rgba(255,255,255,.72);opacity:0;transform:rotate(-12deg) scale(1.7);transition:opacity .3s,transform .55s var(--spring);pointer-events:none}
.oz-stamp svg{width:1.15em;height:1.15em;fill:none;stroke:currentColor;stroke-width:2.6;stroke-linecap:round;stroke-linejoin:round}
.oz-doc.is-stamped .oz-stamp--sent{opacity:.95;transform:rotate(-12deg) scale(1)}

/* Aufbau der Offerte im Hero (nur mit Skript) */
.js .oz-doc--offerte .oz-r:not(.is-on){opacity:0;transform:translateY(8px)}
.js .oz-doc--offerte:not(.s-kunde) .oz-type{opacity:0}
.oz-doc--offerte.s-kunde .oz-type{animation:ozType 1.7s steps(26) both}
.js .oz-doc--offerte:not(.s-sum) .oz-doc__sum{opacity:0;transform:translateY(6px)}
.oz-doc--offerte .oz-doc__sum{transition:opacity .5s,transform .5s var(--ease)}

/* PDF-Designs (Vorschau wechselt per Auswahl) */
.oz-doc[data-design="2"]{--acc:#315392}
.oz-doc[data-design="2"] .oz-doc__head{margin:-5.4cqw -5.4cqw 0;padding:4.6cqw 5.4cqw;background:var(--acc);color:#fff;border-bottom:0}
.oz-doc[data-design="2"] .oz-doc__head small,.oz-doc[data-design="2"] .oz-doc__kind{color:rgba(255,255,255,.78)}
.oz-doc[data-design="2"] .oz-doc__logo{background:#fff}.oz-doc[data-design="2"] .oz-doc__logo svg{fill:var(--acc)}
.oz-doc[data-design="3"]{--acc:#141E30}
.oz-doc[data-design="3"] .oz-doc__head{border-bottom:1px solid var(--line)}
.oz-doc[data-design="3"] .oz-doc__logo{background:transparent;box-shadow:inset 0 0 0 1.5px var(--ink)}.oz-doc[data-design="3"] .oz-doc__logo svg{fill:var(--ink)}
.oz-doc[data-design="3"] .oz-doc__no{font-weight:500}
.oz-doc[data-design="3"] .oz-t__h{border-bottom-color:var(--ink)}
.oz-doc[data-design="4"]{--acc:#4E5663;font-size:clamp(8px,2.2cqw,11.5px)}
.oz-doc[data-design="4"] .oz-t__h{background:#F5F7FB;padding:1.4cqw 1.6cqw;border-bottom:0;border-radius:1.2cqw}
.oz-doc[data-design="4"] .oz-r{padding:1.1cqw 1.6cqw}
.oz-doc[data-design="5"]{--acc:#446BB4}
.oz-doc[data-design="5"]::before{content:"";position:absolute;left:0;right:0;top:0;height:1.8cqw;background:linear-gradient(90deg,#203B6E,#79A4F2)}
.oz-doc[data-design="5"] .oz-doc__head{border-bottom-width:0;padding-top:1.6cqw}
.oz-doc[data-design="5"] .oz-t__h{border-bottom:2px solid var(--acc)}
.oz-doc[data-design="6"]{--acc:#141E30}
.oz-doc[data-design="6"] .oz-doc__head{margin:-5.4cqw -5.4cqw 0;padding:4.8cqw 5.4cqw;background:#141E30;color:#fff;border-bottom:0}
.oz-doc[data-design="6"] .oz-doc__head small{color:rgba(255,255,255,.65)}
.oz-doc[data-design="6"] .oz-doc__kind{color:#F5C451}
.oz-doc[data-design="6"] .oz-doc__logo{background:#F5C451}.oz-doc[data-design="6"] .oz-doc__logo svg{fill:#141E30}
.oz-doc[data-design="6"] .oz-t__h{background:#141E30;color:#fff;padding:1.4cqw 1.6cqw;border-radius:1.2cqw;border-bottom:0}
.oz-doc[data-design="6"] .oz-r{padding-left:1.6cqw;padding-right:1.6cqw}
.oz-doc[data-design="7"]{--acc:#187A54}
.oz-doc[data-design="7"] .oz-doc__head{border-bottom-color:var(--acc)}
.oz-doc[data-design="7"] .oz-t__h{background:#DDF5E5;color:#0F5A3D;padding:1.4cqw 1.6cqw;border-bottom:0;border-radius:1.4cqw}
.oz-doc[data-design="7"] .oz-r{padding-left:1.6cqw;padding-right:1.6cqw}
.oz-doc[data-design="7"] .oz-doc__grand{border-top-color:var(--acc)}
.oz-doc[data-design="8"]{--acc:#C2691A}
.oz-doc[data-design="8"] .oz-doc__head{border-bottom:0;background:linear-gradient(90deg,#FFF1E2,#fff);margin:-5.4cqw -5.4cqw 0;padding:5.4cqw 5.4cqw 3.2cqw}
.oz-doc[data-design="8"] .oz-t__h{border-bottom:2px solid var(--acc)}
.oz-doc[data-design="9"]{--acc:#8A6D2B;font-family:Georgia,'Times New Roman',serif}
.oz-doc[data-design="9"] .oz-doc__head{flex-direction:column;align-items:center;text-align:center;border-bottom:1px solid var(--acc)}
.oz-doc[data-design="9"] .oz-doc__meta{text-align:center}
.oz-doc[data-design="9"] .oz-doc__firm{flex-direction:column;gap:1cqw}
.oz-doc[data-design="9"] .oz-doc__firmtx{text-align:center}
.oz-doc[data-design="9"] .oz-doc__no{font-weight:400;font-size:1.5em}
.oz-doc[data-design="9"] .oz-t__h{font-family:inherit;border-bottom-color:var(--acc)}
.oz-doc[data-design="10"]{--acc:#B2414C}
.oz-doc[data-design="10"] .oz-doc__head{border-bottom:0;padding-bottom:1cqw}
.oz-doc[data-design="10"] .oz-doc__no{font-size:2.6em;font-weight:800;color:var(--acc)}
.oz-doc[data-design="10"] .oz-doc__kind{font-size:.9em}
.oz-doc[data-design="10"] .oz-t__h{background:var(--acc);color:#fff;padding:1.4cqw 1.6cqw;border-bottom:0;border-radius:1.2cqw}
.oz-doc[data-design="10"] .oz-r{padding-left:1.6cqw;padding-right:1.6cqw}
.oz-doc[data-design="10"] .oz-doc__grand{background:var(--acc);color:#fff;border:0;padding:1.6cqw 2cqw!important;border-radius:1.2cqw}
.oz-doc,.oz-doc *{transition-property:background-color,color,border-color,font-size;transition-duration:.35s}

/* =====================================================================
   Abschnitte
   ===================================================================== */
.oz-sec{position:relative;padding:clamp(90px,12vh,140px) 0}
.oz-sec--tight{padding:clamp(50px,8vh,90px) 0}
.oz-split{display:grid;grid-template-columns:minmax(0,.86fr) minmax(0,1.14fr);gap:clamp(28px,5vw,84px);align-items:center}
.oz-split--rev{grid-template-columns:minmax(0,1.14fr) minmax(0,.86fr)}
.oz-split--gap{margin-top:clamp(70px,11vh,130px)}
.oz-split__text .h2{margin-top:18px;font-size:clamp(32px,3.7vw,54px)}
.oz-split__text .oz-p{font-size:clamp(15.5px,1.15vw,17px);line-height:1.7;color:var(--i800);margin-top:16px;max-width:56ch;text-wrap:pretty}
.oz-tag{display:inline-flex;align-items:center;font-size:10.5px;font-weight:800;letter-spacing:.1em;text-transform:uppercase;padding:4px 10px;border-radius:999px;background:rgba(154,190,255,.18);color:var(--p200);box-shadow:inset 0 0 0 1px rgba(154,190,255,.32);white-space:nowrap}
.oz-tag--dark{background:var(--i100);color:var(--i800);box-shadow:none;margin-left:6px}
.oz-hint{margin-top:22px;font-size:14px;color:var(--i700)}
.oz-cap{margin-top:14px;font-size:11.5px;color:var(--i700);text-align:center}
.oz-cap--c{margin-top:18px}
.oz-checks{display:grid;gap:12px;margin-top:26px}
.oz-checks li{display:flex;gap:12px;align-items:flex-start;font-size:15.5px;line-height:1.5;color:var(--i800)}
.oz-checks svg{flex:none;width:24px;height:24px;padding:4px;border-radius:50%;background:var(--ok-soft);fill:none;stroke:var(--ok);stroke-width:2.6;stroke-linecap:round;stroke-linejoin:round}

/* Tabs (Rechnungskachel) */
.oz-tabs{display:flex;flex-wrap:wrap;gap:10px;margin-top:28px}
.oz-tab{display:inline-flex;align-items:center;gap:12px;padding:8px 22px 8px 8px;border-radius:999px;background:#fff;color:var(--i800);font-weight:700;font-size:14px;box-shadow:inset 0 0 0 1px rgba(20,30,48,.09),0 10px 20px -16px rgba(20,30,48,.4);transition:background .3s,color .3s,box-shadow .3s,transform .4s var(--spring)}
.oz-tab .gi{--s:32px}
.oz-tab.is-on>.gi{transform:none}
.oz-tab.is-on>.gi::after{opacity:.55}
.oz-tab:hover{transform:translateY(-2px)}
.oz-tab.is-on{background:var(--p800);color:#fff;box-shadow:0 16px 30px -14px rgba(49,83,146,.8)}

/* Fenster mit Kacheln */
.oz-win{max-width:560px;margin-left:auto;padding-bottom:18px;background:linear-gradient(180deg,#fff,#F7F9FD);border-radius:28px;box-shadow:0 50px 90px -50px rgba(20,40,90,.6),inset 0 0 0 1px rgba(20,30,48,.07)}
.oz-win__bar{display:flex;align-items:center;gap:6px;padding:14px 18px;border-bottom:1px solid var(--i100);font-size:12.5px;font-weight:700;color:var(--i700)}
.oz-win__bar i{width:9px;height:9px;border-radius:50%;background:var(--i200)}
.oz-win__bar span{margin-left:10px}
.oz-tile{position:relative;margin:16px 18px 0;padding:16px 18px 18px;border-radius:20px;background:#fff;box-shadow:0 16px 30px -20px rgba(20,30,48,.4),inset 0 0 0 1px rgba(20,30,48,.08);overflow:hidden}
.oz-tile__top{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.oz-tile__top b{font-size:15px;letter-spacing:-.01em}
.oz-tile__k{font-size:12.5px;color:var(--i700)}
.oz-tile__top .av{margin-left:auto;width:28px;height:28px;font-style:normal;font-size:10px}
.oz-tile__cust{margin-top:8px;font-size:13.5px;color:var(--i800)}
.oz-tile__amt{margin-top:14px}
.oz-tile__amt small{display:block;font-size:10.5px;font-weight:800;letter-spacing:.12em;text-transform:uppercase;color:var(--i700)}
.oz-tile__amt b{display:block;margin-top:2px;font-size:clamp(26px,2.6vw,34px);letter-spacing:-.035em}
.oz-tile__paid{display:flex;align-items:center;gap:7px;margin-top:10px;font-size:13px;font-weight:700;color:var(--ok)}
.oz-ic{fill:none;stroke:currentColor;stroke-width:2.6;stroke-linecap:round;stroke-linejoin:round}
.oz-tile--paid .oz-tile__paid svg{stroke:var(--ok);fill:none;stroke-width:2.6;stroke-linecap:round}
.oz-pane{display:none;margin-top:16px;padding-top:16px;border-top:1px dashed rgba(20,30,48,.14)}
.oz-pane.is-on{display:block;animation:fadeUp .5s var(--ease) both}
.oz-slip{display:flex;gap:14px;align-items:center}
.oz-slip .oz-qr{width:64px;height:64px;padding:5px;border-radius:8px;box-shadow:inset 0 0 0 1px rgba(20,30,48,.14);fill:var(--i950)}
.oz-slip small{display:block;font-size:10.5px;font-weight:800;letter-spacing:.12em;text-transform:uppercase;color:var(--i700)}
.oz-slip b{display:block;font-size:14px;margin-top:2px}
.oz-slip span{display:block;font-size:12.5px;color:var(--i700);margin-top:2px}
.oz-parts__bar{height:9px;border-radius:9px;background:var(--i100);overflow:hidden}
.oz-parts__bar i{display:block;height:100%;width:var(--w);border-radius:9px;background:linear-gradient(90deg,var(--p600),var(--p400))}
.oz-pane.is-on .oz-parts__bar i{animation:ozGrow 1.1s var(--ease) both}
@keyframes ozGrow{from{transform:scaleX(0);transform-origin:left}to{transform:scaleX(1);transform-origin:left}}
.oz-parts ul{margin-top:12px;display:grid;gap:8px}
.oz-parts li{display:flex;justify-content:space-between;font-size:13.5px;color:var(--i800)}
.oz-parts li b{font-variant-numeric:tabular-nums}
.oz-parts li.is-open{padding-top:8px;border-top:1px solid var(--i100);font-weight:800;color:var(--i950)}
.oz-skonto{display:flex;align-items:center;gap:16px}
.oz-skonto__ring{position:relative;flex:none;width:64px;height:64px;display:grid;place-items:center;text-align:center}
.oz-skonto__ring svg{position:absolute;inset:0;width:100%;height:100%;transform:rotate(-90deg)}
.oz-skonto__ring .bg{fill:none;stroke:var(--i100);stroke-width:4}
.oz-skonto__ring .fg{fill:none;stroke:var(--warn-mid);stroke-width:4;stroke-linecap:round;stroke-dasharray:100;stroke-dashoffset:60}
.oz-pane.is-on .oz-skonto__ring .fg{animation:ozGrow2 1.2s var(--ease) both}
@keyframes ozGrow2{from{stroke-dashoffset:100}to{stroke-dashoffset:60}}
.oz-skonto__ring b{font-size:19px;line-height:1;letter-spacing:-.03em}
.oz-skonto__ring small{position:absolute;left:0;right:0;bottom:15px;font-size:8.5px;color:var(--i700);font-weight:700}
.oz-skonto b:not(.oz-skonto__ring b){display:block;font-size:15px}
.oz-skonto span:not(.oz-skonto__ring){display:block;font-size:13px;color:var(--i700);margin-top:2px}
.oz-mini-series{display:flex;gap:14px;align-items:center}
.oz-mini-series b{display:block;font-size:14.5px}
.oz-mini-series span:not(.gi){display:block;font-size:12.5px;line-height:1.45;color:var(--i700);margin-top:2px}

/* Wiederkehrende Rechnungen */
.oz-series{max-width:600px;padding:24px;border-radius:28px;background:#fff;box-shadow:0 50px 90px -50px rgba(20,40,90,.55),inset 0 0 0 1px rgba(20,30,48,.07)}
.oz-series__top{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.oz-series__top b{font-size:17px;letter-spacing:-.02em}
.oz-series__top .oz-tag{margin-left:auto;background:var(--i100);color:var(--i800);box-shadow:none}
.oz-series__meta{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-top:16px}
.oz-series__meta div{padding:10px 12px;border-radius:12px;background:var(--i50)}
.oz-series__meta dt{font-size:10px;font-weight:800;letter-spacing:.12em;text-transform:uppercase;color:var(--i700)}
.oz-series__meta dd{margin:2px 0 0;font-weight:800;font-size:15px;font-variant-numeric:tabular-nums}
.oz-months{display:grid;grid-template-columns:repeat(8,minmax(0,1fr));gap:8px;margin-top:18px}
.oz-mon{position:relative;aspect-ratio:.74;display:flex;flex-direction:column;gap:6px;padding:9px 7px;border-radius:11px;background:#fff;box-shadow:0 10px 16px -12px rgba(20,30,48,.45),inset 0 0 0 1px rgba(20,30,48,.1)}
.oz-mon small{font-size:10.5px;font-weight:800;color:var(--i800)}
.oz-mon i{display:block;height:5px;border-radius:4px;background:var(--i100)}
.oz-mon i:nth-of-type(2){width:64%}
.oz-mon em{margin-top:auto;font-style:normal;font-size:8.5px;font-weight:800;letter-spacing:.05em;color:var(--ok);opacity:0}
.oz-mon:not(.oz-mon--next) em::before{content:"✓";opacity:1}
.oz-mon:not(.oz-mon--next) em{opacity:.9}
.oz-mon--next{background:rgba(227,237,255,.55);box-shadow:inset 0 0 0 1.5px var(--p600);border:0;background-image:repeating-linear-gradient(135deg,transparent 0 6px,rgba(92,136,215,.08) 6px 12px)}
.oz-mon--next small{color:var(--p800)}
.oz-mon--next em{opacity:1;color:var(--p800)}
.oz-mon--next.is-made{animation:ozPop .6s var(--spring) both;background:#fff;background-image:none;box-shadow:0 10px 16px -12px rgba(20,30,48,.45),inset 0 0 0 1.5px var(--p600)}
.oz-mon--next.is-off{opacity:.45;box-shadow:inset 0 0 0 1.5px var(--i300);background-image:none}
.oz-mon--next.is-off small,.oz-mon--next.is-off em{color:var(--i700)}
.oz-toggle{display:inline-flex;align-items:center;gap:12px;margin-top:20px;cursor:pointer;user-select:none}
.oz-toggle input{position:absolute;opacity:0;width:1px;height:1px}
.oz-toggle__ui{position:relative;width:46px;height:26px;border-radius:26px;background:var(--i300);transition:background .3s;box-shadow:inset 0 1px 3px rgba(20,30,48,.25)}
.oz-toggle__ui::after{content:"";position:absolute;left:3px;top:3px;width:20px;height:20px;border-radius:50%;background:#fff;box-shadow:0 2px 6px rgba(20,30,48,.35);transition:transform .35s var(--spring)}
.oz-toggle input:checked+.oz-toggle__ui{background:var(--p800)}
.oz-toggle input:checked+.oz-toggle__ui::after{transform:translateX(20px)}
.oz-toggle input:focus-visible+.oz-toggle__ui{outline:2px solid var(--p700);outline-offset:3px}
.oz-toggle__lbl{font-weight:700;font-size:14.5px}

/* Offerten: Liste + Detail */
.oz-offers{display:grid;grid-template-columns:minmax(0,1.12fr) minmax(0,.88fr);gap:clamp(18px,2.4vw,30px);margin-top:clamp(36px,5vh,56px);align-items:start}
.oz-filter{display:flex;flex-wrap:wrap;gap:8px}
.oz-filter button{display:inline-flex;align-items:center;gap:8px;padding:8px 14px;border-radius:999px;background:#fff;font-size:13.5px;font-weight:700;color:var(--i800);box-shadow:inset 0 0 0 1px rgba(20,30,48,.1);transition:background .3s,color .3s,box-shadow .3s}
.oz-filter button i{font-style:normal;min-width:20px;padding:1px 6px;border-radius:999px;text-align:center;font-size:11.5px;background:var(--i100);color:var(--i800)}
.oz-filter button.is-on{background:var(--p800);color:#fff;box-shadow:0 12px 24px -12px rgba(49,83,146,.9)}
.oz-filter button.is-on i{background:rgba(255,255,255,.22);color:#fff}
.oz-olist{display:grid;gap:10px;margin-top:16px}
.oz-olist li{display:grid;grid-template-columns:auto minmax(0,1fr) auto;gap:14px;align-items:center;padding:14px 18px;border-radius:18px;background:#fff;box-shadow:0 14px 26px -20px rgba(20,30,48,.45),inset 0 0 0 1px rgba(20,30,48,.07);transition:transform .45s var(--ease),box-shadow .3s,opacity .3s}
.oz-olist li[hidden]{display:none}
.oz-olist li.is-sel{box-shadow:0 14px 26px -20px rgba(20,30,48,.45),inset 0 0 0 1.5px var(--p700)}
.oz-olist li b{display:block;font-size:14.5px;letter-spacing:-.01em}
.oz-olist li small{display:block;margin-top:2px;font-size:12.5px;color:var(--i700)}
.oz-olist li em{font-style:normal;font-weight:800;font-size:14px;font-variant-numeric:tabular-nums}
.oz-olist li:hover{transform:translateX(4px)}
.oz-olist .s-chip{min-width:96px;justify-content:center}
.oz-detail{padding:22px 24px 20px;border-radius:26px;background:#fff;box-shadow:0 40px 80px -50px rgba(20,40,90,.55),inset 0 0 0 1px rgba(20,30,48,.07)}
.oz-detail header>div{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.oz-detail header b{font-size:18px;letter-spacing:-.02em}
.oz-detail header small{display:block;margin-top:4px;font-size:13px;color:var(--i700)}
.oz-detail dl{display:grid;grid-template-columns:1fr 1fr;gap:16px 18px;margin-top:18px;padding-top:18px;border-top:1px solid var(--i100)}
.oz-detail dt{font-size:10.5px;font-weight:800;letter-spacing:.12em;text-transform:uppercase;color:var(--i700)}
.oz-detail dd{margin:4px 0 0;font-size:14px;line-height:1.5;color:var(--i950)}
.oz-detail__wide{grid-column:1/-1}

/* Erinnerungen: Warnzeichen + Glocke */
.oz-alert{display:grid;gap:18px;max-width:520px;margin-left:auto}
.oz-tile--late{margin:0}
.oz-warn{position:absolute;right:0;top:0;width:56px;height:56px;background:linear-gradient(225deg,var(--bad) 50%,transparent 50%)}
.oz-warn svg{position:absolute;right:8px;top:6px;width:20px;height:20px;fill:none;stroke:#fff;stroke-width:2.6;stroke-linecap:round}
.oz-tile--late .oz-tile__top .av{margin-right:34px}
.oz-tile__due{display:inline-flex;margin-top:10px;padding:4px 10px;border-radius:999px;font-size:12px;font-weight:800;background:var(--bad-soft);color:var(--bad)}
.oz-bell-wrap{position:relative;padding-left:26px}
.oz-bell{position:absolute;left:0;top:-8px;z-index:2;display:grid;place-items:center;width:52px;height:52px;border-radius:50%;background:linear-gradient(160deg,#fff,#E3EDFF);box-shadow:0 16px 30px -12px rgba(49,83,146,.6),inset 0 0 0 1px rgba(68,107,180,.25);transform-origin:50% 12%;animation:ozRing 5s ease-in-out infinite}
.oz-bell svg{width:24px;height:24px;fill:none;stroke:var(--p800);stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.oz-bell i{position:absolute;right:-2px;top:-2px;min-width:20px;height:20px;padding:0 5px;border-radius:999px;display:grid;place-items:center;font-style:normal;font-size:11px;font-weight:800;background:var(--bad);color:#fff;box-shadow:0 0 0 3px #fff}
.oz-notes{display:grid;gap:8px;padding:8px 8px 8px 38px;border-radius:22px;background:#fff;box-shadow:0 30px 60px -40px rgba(20,40,90,.55),inset 0 0 0 1px rgba(20,30,48,.07)}
.oz-notes li{display:flex;gap:12px;align-items:center;padding:12px 14px;border-radius:14px;background:var(--i50)}
.oz-notes svg{flex:none;width:32px;height:32px;padding:7px;border-radius:10px;background:var(--p100);fill:none;stroke:var(--p800);stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.oz-notes b{display:block;font-size:14px}
.oz-notes small{display:block;font-size:12.5px;color:var(--i700);margin-top:1px}

/* Antwort per Klick */
.oz-reply{display:grid;grid-template-columns:minmax(0,1.15fr) 46px minmax(0,1fr);gap:8px;align-items:start;max-width:640px;padding:20px;border-radius:28px;background:linear-gradient(180deg,#fff,#F4F7FC);box-shadow:0 50px 90px -50px rgba(20,40,90,.55),inset 0 0 0 1px rgba(20,30,48,.07)}
.oz-reply__lbl{margin-bottom:10px;font-size:11px;font-weight:800;letter-spacing:.14em;text-transform:uppercase;color:var(--i700)}
.oz-mailwrap{position:relative;min-height:212px}
.oz-mail,.oz-thanks{position:absolute;inset:0;padding:16px;border-radius:18px;background:#fff;box-shadow:0 18px 34px -22px rgba(20,30,48,.5),inset 0 0 0 1px rgba(20,30,48,.09);transition:opacity .5s var(--ease),transform .6s var(--ease)}
.oz-mail__hd{display:flex;gap:10px;align-items:center}
.oz-mail__hd b{display:block;font-size:13.5px}
.oz-mail__hd small{display:block;font-size:12px;color:var(--i700)}
.oz-mail p{margin-top:12px;font-size:12.5px;line-height:1.55;color:var(--i800)}
.oz-mail__btns{display:flex;gap:8px;margin-top:14px}
.oz-btn{position:relative;padding:9px 14px;border-radius:10px;font-weight:800;font-size:12.5px}
.oz-btn--yes{background:var(--ok);color:#fff}
.oz-btn--no{background:var(--i100);color:var(--i800)}
.oz-btn--yes::after{content:"";position:absolute;left:50%;top:50%;width:46px;height:46px;margin:-23px 0 0 -23px;border-radius:50%;background:rgba(255,255,255,.7);opacity:0}
.oz-cursor{position:absolute;left:78%;top:106%;z-index:4;width:22px;height:22px;pointer-events:none;transition:left 1.5s cubic-bezier(.45,.05,.25,1),top 1.5s cubic-bezier(.45,.05,.25,1);filter:drop-shadow(0 3px 4px rgba(20,30,48,.4))}
.oz-cursor svg{width:100%;height:100%;fill:#141E30;stroke:#fff;stroke-width:1.6;stroke-linejoin:round}
.oz-thanks{display:flex;flex-direction:column;justify-content:center;text-align:center;opacity:0;transform:translateY(14px) scale(.96)}
.oz-thanks b{font-size:20px;letter-spacing:-.02em}
.oz-thanks p{margin-top:8px;font-size:12.5px;line-height:1.5;color:var(--i800)}
.oz-thanks small{margin-top:10px;font-size:11.5px;color:var(--i700)}
.oz-reply__arrow{display:grid;place-items:center;height:100%}
.oz-reply__arrow i{width:2px;height:70px;background:repeating-linear-gradient(180deg,var(--p600) 0 5px,transparent 5px 10px);border-radius:2px;opacity:.35;transition:opacity .4s}
.oz-tile--reply{margin:0;transition:box-shadow .5s}
.oz-tile__from{display:flex;align-items:center;gap:7px;margin-top:12px;font-size:12.5px;font-weight:700;color:var(--ok);opacity:0;transform:translateY(6px);transition:opacity .5s,transform .5s}
.oz-tile__from svg{stroke:var(--ok)}
/* Ablauf der Vorführung */
.oz-btn--yes{transition:transform .25s var(--ease),box-shadow .3s}
.oz-reply.s-click .oz-btn--yes{transform:scale(.93);box-shadow:0 0 0 5px rgba(24,122,84,.22)}
.oz-reply.s-click .oz-cursor{transform:scale(.88)}
.oz-reply.s-click .oz-btn--yes::after{animation:ozRipple .9s ease-out}
.oz-reply.s-thanks .oz-mail{opacity:0;transform:translateY(-12px) scale(.97)}
.oz-reply.s-thanks .oz-thanks{opacity:1;transform:none}
.oz-reply.s-thanks .oz-reply__arrow i{opacity:1;animation:fxMarch2 .7s linear infinite}
@keyframes fxMarch2{to{background-position:0 10px}}
.oz-reply.s-done .oz-status{background:var(--ok-soft);color:var(--ok)}
.oz-reply.s-done .oz-tile--reply{box-shadow:0 16px 30px -20px rgba(24,122,84,.55),inset 0 0 0 2px var(--ok-mid)}
.oz-reply.s-done .oz-tile__from{opacity:1;transform:none}

/* PDF-Designs */
.oz-designs{max-width:560px;margin-left:auto;display:grid;gap:22px}
.oz-docwrap--pdf{width:min(100%,400px);margin:0 auto;aspect-ratio:1/1.36}
.oz-dchips{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:8px}
.oz-dchips button{display:grid;gap:3px;justify-items:start;padding:10px 10px 9px;border-radius:14px;background:#fff;text-align:left;font-weight:800;font-size:12.5px;letter-spacing:-.01em;color:var(--i950);box-shadow:inset 0 0 0 1px rgba(20,30,48,.09);transition:box-shadow .3s,transform .4s var(--spring),background .3s}
.oz-dchips button i{width:18px;height:6px;border-radius:4px;background:var(--sw,var(--p800));margin-bottom:3px}
.oz-dchips button small{font-size:10px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--i700)}
.oz-dchips button:hover{transform:translateY(-2px)}
.oz-dchips button.is-on{box-shadow:inset 0 0 0 2px var(--p700),0 14px 24px -16px rgba(49,83,146,.7)}
.oz-dchips button:nth-child(1){--sw:#203B6E}.oz-dchips button:nth-child(2){--sw:#315392}.oz-dchips button:nth-child(3){--sw:#141E30}.oz-dchips button:nth-child(4){--sw:#9CA5B6}.oz-dchips button:nth-child(5){--sw:#79A4F2}
.oz-dchips button:nth-child(6){--sw:#141E30}.oz-dchips button:nth-child(7){--sw:#187A54}.oz-dchips button:nth-child(8){--sw:#C2691A}.oz-dchips button:nth-child(9){--sw:#8A6D2B}.oz-dchips button:nth-child(10){--sw:#B2414C}

/* Nova */
.oz-nova{display:grid;grid-template-columns:auto minmax(0,1fr) minmax(0,1fr);gap:clamp(20px,3.4vw,52px);align-items:center;padding:clamp(24px,3.4vw,44px) clamp(24px,4vw,56px);border-radius:36px;overflow:hidden;color:var(--i950);
  background:radial-gradient(700px 420px at 82% 20%,rgba(245,247,251,.95),rgba(245,247,251,0) 62%),radial-gradient(800px 520px at 6% 96%,rgba(92,136,215,.3),rgba(92,136,215,0) 62%),linear-gradient(160deg,#F5F7FB 0%,#E3EDFF 100%);
  box-shadow:0 50px 90px -56px rgba(32,59,110,.65),inset 0 0 0 1px rgba(255,255,255,.9);transition:transform .5s var(--ease),box-shadow .5s}
.oz-nova:hover{transform:translateY(-4px)}
.oz-nova .orb{width:clamp(96px,10vw,132px);margin:0}
.oz-nova__chat{display:grid;gap:10px}
.oz-bub{max-width:34ch;padding:12px 16px;border-radius:18px;font-size:14.5px;line-height:1.45;font-weight:600;box-shadow:0 14px 28px -18px rgba(20,30,48,.5)}
.oz-bub--du{justify-self:end;border-bottom-right-radius:5px;background:var(--p800);color:#fff}
.oz-bub--nova{justify-self:start;border-bottom-left-radius:5px;background:#fff;color:var(--i800)}
.oz-bub svg{display:inline-block;vertical-align:-3px;width:16px;height:16px;fill:none;stroke:var(--ok);stroke-width:2.8;stroke-linecap:round;stroke-linejoin:round}
.js .oz-nova .oz-bub{opacity:0;transform:translateY(12px);transition:opacity .7s,transform .8s var(--ease)}
.js .oz-nova.is-in .oz-bub{opacity:1;transform:none}
.js .oz-nova.is-in .oz-bub--du{transition-delay:.4s}
.js .oz-nova.is-in .oz-bub--nova{transition-delay:1.3s}
.oz-nova__text h3{font-size:clamp(22px,2vw,28px);font-weight:800;letter-spacing:-.03em;margin-top:12px}
.oz-nova__text p{font-size:15px;line-height:1.6;color:var(--i800);margin-top:8px;max-width:38ch}
.oz-nova__text .lnk-arrow{margin-top:16px}

/* =====================================================================
   Ablauf — Dokument klebt, Schritte laufen
   ===================================================================== */
.oz-flow{position:relative;color:#fff;padding:clamp(100px,14vh,160px) 0 clamp(60px,9vh,100px)}
.oz-flow__grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,.9fr);gap:clamp(30px,5vw,90px);margin-top:clamp(30px,5vh,60px);align-items:stretch}
.oz-flow__stage{position:relative}
.oz-flow__sticky{position:sticky;top:calc(var(--hdr) + 14px);display:grid;gap:18px}
.oz-docwrap--flow{width:min(100%,450px);margin:0 auto;aspect-ratio:1/1.27}
.oz-flow__cap{display:flex;justify-content:center;align-items:baseline;gap:12px;font-size:15px;color:var(--p200)}
.oz-flow__cap b{font-size:13px;font-weight:800;letter-spacing:.14em;color:var(--p300)}
.oz-flow__cap span{font-weight:700;color:#fff}
.oz-fsteps{display:grid}
.oz-fstep{min-height:62vh;display:flex;flex-direction:column;justify-content:center;opacity:.32;transition:opacity .5s var(--ease)}
.oz-fstep:last-child{min-height:48vh}
.oz-fstep.is-on{opacity:1}
.oz-fstep__n{font-size:13px;font-weight:800;letter-spacing:.16em;color:var(--p300)}
.oz-fstep h3{font-size:clamp(26px,3vw,42px);font-weight:800;letter-spacing:-.035em;line-height:1.05;margin-top:10px}
.oz-fstep p{font-size:clamp(16px,1.35vw,19px);line-height:1.55;color:var(--p200);margin-top:12px;max-width:34ch}
.oz-flow__outro{margin-top:clamp(40px,6vh,70px);text-align:center;font-size:clamp(20px,2.4vw,30px);line-height:1.3;font-weight:800;letter-spacing:-.03em;text-wrap:balance}
/* Zustände des Dokuments */
.oz-kinds{position:relative;min-width:24cqw}
.oz-kinds__i{position:absolute;right:0;top:0;opacity:0;transform:translateY(6px);transition:opacity .45s,transform .5s var(--ease);text-align:right;white-space:nowrap}
.oz-kinds__i[data-k="1"]{position:relative}
[data-state="1"] .oz-kinds__i[data-k="1"],
:is([data-state="2"],[data-state="3"],[data-state="4"]) .oz-kinds__i[data-k="2"],
:is([data-state="5"],[data-state="6"]) .oz-kinds__i[data-k="5"]{opacity:1;transform:none}
.oz-r--extra{display:none}
:is([data-state="4"],[data-state="5"],[data-state="6"]) .oz-r--extra{display:grid;animation:ozPop .6s var(--spring) both}
.oz-flow__chips{display:flex;flex-wrap:wrap;gap:1.6cqw;margin-top:2.6cqw;min-height:6cqw}
.oz-fchip{display:none;align-items:center;gap:1.2cqw;padding:1cqw 2.2cqw;border-radius:99px;background:#E3EDFF;color:#203B6E;font-weight:700;font-size:.9em}
.oz-fchip svg{width:1.2em;height:1.2em;fill:none;stroke:currentColor;stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round}
:is([data-state="3"],[data-state="4"],[data-state="5"],[data-state="6"]) .oz-fchip[data-k="3"],
:is([data-state="4"],[data-state="5"],[data-state="6"]) .oz-fchip[data-k="4"],
[data-state="6"] .oz-fchip[data-k="6"]{display:inline-flex;animation:ozPop .6s var(--spring) both}
[data-state="6"] .oz-fchip[data-k="6"]{background:var(--ok-soft);color:var(--ok)}
.oz-total{position:relative;display:inline-block;min-width:8em;text-align:right}
.oz-total__b{display:none}
:is([data-state="4"],[data-state="5"],[data-state="6"]) .oz-total__a{display:none}
:is([data-state="4"],[data-state="5"],[data-state="6"]) .oz-total__b{display:inline}
.oz-pay--flow{display:none}
:is([data-state="5"],[data-state="6"]) .oz-pay--flow{display:flex;animation:ozPop .6s var(--spring) both}
.oz-stamp[data-k]{opacity:0}
[data-state="1"] .oz-stamp--acc,[data-state="6"] .oz-stamp--paid{opacity:.95;transform:rotate(-12deg) scale(1)}
.oz-stamp--paid{left:auto;bottom:auto;right:5.4cqw;top:19cqw}


/* Schluss */
#cta .finale__title{max-width:none;font-size:clamp(40px,6vw,96px)}
#cta .finale__title .glow{display:block}

/* =====================================================================
   Responsiv
   ===================================================================== */
@media (max-width:1100px){
  .oz-hero__grid{grid-template-columns:minmax(0,1fr) minmax(0,.9fr)}
  .oz-dchips{grid-template-columns:repeat(5,minmax(0,1fr))}
  .oz-nova{grid-template-columns:auto minmax(0,1fr)}
  .oz-nova__text{grid-column:1/-1}
}
@media (max-width:900px){
  .oz-hero__grid{grid-template-columns:minmax(0,1fr);min-height:0;gap:36px}
  .oz-hero__text{max-width:none}
  .oz-stage{margin:0 auto}
  .oz-feats{grid-template-columns:minmax(0,1fr)}
  .oz-split,.oz-split--rev{grid-template-columns:minmax(0,1fr)}
  .oz-split--rev .oz-split__text{order:-1}
  .oz-win,.oz-series,.oz-alert,.oz-designs{margin:0 auto}
  .oz-offers{grid-template-columns:minmax(0,1fr)}
  .oz-flow__grid{grid-template-columns:minmax(0,1fr)}
  .oz-flow__sticky{top:calc(var(--hdr) + 6px);z-index:3;padding:8px 0 10px;background:linear-gradient(180deg,rgba(30,58,110,.94) 70%,rgba(30,58,110,0));border-radius:20px}
  .oz-docwrap--flow{width:min(100%,360px)}
  .oz-fstep{min-height:56vh;justify-content:flex-end;padding-bottom:12vh}
  .oz-fstep:last-child{min-height:40vh}
}
@media (max-width:700px){
  .oz-months{grid-template-columns:repeat(4,minmax(0,1fr))}
  .oz-series__meta{grid-template-columns:1fr 1fr 1fr}
  .oz-detail dl{grid-template-columns:minmax(0,1fr)}
  .oz-reply{grid-template-columns:minmax(0,1fr);padding:16px}
  .oz-reply__arrow{height:34px}
  .oz-reply__arrow i{width:70px;height:2px;background:repeating-linear-gradient(90deg,var(--p600) 0 5px,transparent 5px 10px)}
  .oz-dchips{grid-template-columns:repeat(2,minmax(0,1fr))}
  .oz-olist li{grid-template-columns:minmax(0,1fr) auto;row-gap:8px}
  .oz-olist li>.s-chip{grid-column:1;justify-self:start}
  .oz-olist li>div{grid-column:1/-1}
  .oz-olist li>em{grid-column:2;grid-row:1}
  .oz-nova{grid-template-columns:minmax(0,1fr);justify-items:start}
  .oz-nova__chat{width:100%}
  .oz-tile__top{gap:8px}
}
@media (max-width:460px){
  .oz-steps li{font-size:12.5px;padding-right:12px}
  .oz-tab{font-size:13px}
}
@media (prefers-reduced-motion:reduce){
  .oz-bell,.oz-cursor{animation:none}
}

/* Zeilenhöhe je Dokumentart: Offerte füllt die Seite, Rechnung braucht Platz für den Zahlteil */
.oz-doc--offerte .oz-r{padding:2.7cqw 0}
.oz-doc--rechnung .oz-r{padding:1.5cqw 0}
.oz-doc--flow .oz-r{padding:2.5cqw 0}
.oz-reply__arrow{align-self:center}
/* Hinweis unter der Tabelle im Ablauf-Dokument nur in den frühen Stationen */
:is([data-state="5"],[data-state="6"]) .oz-flow__note{display:none}

/* Ablauf auf Tablet/Handy: Dokument klebt oben über die ganze Länge der Schritte */
@media (max-width:900px){
  .oz-flow__grid{display:block}
  .oz-flow__stage{position:sticky;top:calc(var(--hdr) + 6px);z-index:3}
  .oz-flow__sticky{position:static;padding:10px 0 14px;background:linear-gradient(180deg,rgba(28,54,104,.97) 78%,rgba(28,54,104,0));border-radius:22px}
  .oz-docwrap--flow{width:min(78%,290px);aspect-ratio:1/1.34}
  .oz-fstep{min-height:52vh;justify-content:flex-start;padding-top:22vh}
  .oz-fstep:last-child{min-height:44vh}
}
@media (max-width:460px){
  .oz-docwrap--flow{width:min(72%,258px)}
  .oz-fstep{padding-top:14vh}
}
@media (max-width:900px){
  .oz-flow__sticky{background:linear-gradient(180deg,rgb(28,54,104) 0,rgb(28,54,104) 90%,rgba(28,54,104,0));backdrop-filter:none}
  .oz-flow__cap{display:none}
}
@media (max-width:900px){ .oz-docwrap--flow{aspect-ratio:1/1.46} }

/* Offerten-Detail: kurz und ruhig */
.oz-detail{padding:24px 26px 20px}
.oz-detail__amt{margin-top:18px}
.oz-detail__amt small{display:block;font-size:10.5px;font-weight:800;letter-spacing:.12em;text-transform:uppercase;color:var(--i700)}
.oz-detail__amt b{display:block;margin-top:2px;font-size:clamp(28px,3vw,38px);letter-spacing:-.04em;font-variant-numeric:tabular-nums}
.oz-detail__cust{display:flex;align-items:center;gap:12px;margin-top:18px;padding:12px 14px;border-radius:16px;background:var(--i50)}
.oz-detail__cust b{display:block;font-size:15px}
.oz-detail__cust small{display:block;font-size:12.5px;color:var(--i700)}
.oz-detail__facts{display:grid;grid-template-columns:1fr 1fr;gap:14px 18px;margin-top:20px;padding-top:18px;border-top:1px solid var(--i100)}
.oz-detail__facts small{display:block;font-size:10.5px;font-weight:800;letter-spacing:.12em;text-transform:uppercase;color:var(--i700)}
.oz-detail__facts b{display:block;margin-top:3px;font-size:14.5px}
.oz-cap--l{text-align:left;margin-top:16px}
.oz-detail header small{margin-top:4px}
.oz-detail .oz-cap{text-align:center}
@media (max-width:700px){ .oz-detail__facts{grid-template-columns:1fr 1fr} }