/* =========================================================================
   SAZ LAND v3 — content cloud, documents, lead hub, 3-step brief.
   Design read: B2B manufacturing landing for EU sourcing managers and small
   brand founders; quiet editorial precision (brand book); native CSS + IO
   motion + real factory video. Dials: variance 6 / motion 5 / density 4.
   Loaded after styles.css and brand-v2.css.
   ========================================================================= */

/* ---------- Browser surfaces (impeccable craft floor) ---------- */
html{caret-color:var(--ochre-text);accent-color:var(--ink);scrollbar-color:var(--steel) var(--chalk);scrollbar-width:thin}
::-webkit-scrollbar{width:10px;height:10px}
::-webkit-scrollbar-track{background:var(--chalk)}
::-webkit-scrollbar-thumb{background:var(--steel);border:3px solid var(--chalk)}
h1,h2,h3,.display,.h1,.h2,.h3{text-wrap:balance}
p,li,dd{text-wrap:pretty}
.top-sentinel{position:absolute;top:0;left:0;width:1px;height:1px;pointer-events:none}

/* calmer default reveal: opacity only; the authored motion lives in hero, curtain, media wipes */
.js .rv{transform:none;transition:opacity 600ms var(--ease)}
.js figure.rv,.js .cell--img.rv,.js .case__img{clip-path:inset(0 0 0 0)}
.js .cell--img.rv:not(.in),.js figure.rv:not(.in):not(.hero__media){clip-path:inset(0 0 100% 0);opacity:1}
.js .cell--img.rv,.js figure.rv{transition:clip-path 900ms var(--ease),opacity 600ms var(--ease)}

/* tactile buttons */
.btn{transition:background-color var(--d1) var(--ease),color var(--d1) var(--ease),transform 120ms var(--ease),border-color var(--d1)}
.btn:active{transform:translateY(1px) scale(.99)}
.btn[disabled]{opacity:.6;cursor:progress}
.btn.is-loading span{opacity:.5}
.btn svg{width:18px;height:18px}
.linkish{font:inherit;font-size:15px;color:inherit;text-decoration:none;border-bottom:1px solid transparent;padding:2px 0;cursor:pointer}
.linkish:hover{border-bottom-color:var(--ink)}
.sec-title{max-width:16ch;margin-bottom:clamp(36px,4.5vw,64px)}

/* ---------- Hero v3 ---------- */
.hero--v3{padding-top:calc(var(--header-h) + clamp(20px,3.5vw,48px));padding-bottom:clamp(40px,5vw,72px);min-height:min(100dvh,980px);display:flex;align-items:center}
.hero--v3 > .wrap{width:100%}
.hero--v3 .grid{align-items:center}
.hero--v3 .eyebrow{color:var(--steel-text)}
.hero--v3 h1{font-size:clamp(44px,5.2vw,88px);max-width:14ch;padding-bottom:.06em;line-height:1.02}
.hero--v3 .lead{max-width:30rem}
.hero__cap{margin-top:12px;max-width:34rem}
.vid{position:relative;overflow:hidden;background:var(--ink)}
.vid--45{aspect-ratio:4/5}
.vid__el{display:block;width:100%;height:100%;object-fit:cover}
.hero--v3 .vid{max-height:calc(100dvh - var(--header-h) - 96px)}
@media (max-width:1023px){.hero--v3 .vid{max-height:none;aspect-ratio:4/5}}
.vid__toggle{position:absolute;right:14px;bottom:14px;width:44px;height:44px;display:grid;place-items:center;background:rgba(28,27,25,.55);color:var(--chalk);border:1px solid rgba(243,239,230,.4);transition:background var(--d1)}
.vid__toggle:hover{background:var(--ink)}
.vid__toggle svg{width:18px;height:18px}
.vid .i-play{display:none}.vid.paused .i-play{display:block}.vid.paused .i-pause{display:none}

/* ---------- Proof strip ---------- */
.proof{padding-bottom:var(--sec)}
.stat__l{font-size:14px;font-weight:500;letter-spacing:.02em;text-transform:none}
.stats--ink{margin-top:clamp(40px,5vw,64px)}
.stats--ink .stat__n{color:var(--ink)}
.stat__n .unit{font-size:.42em;margin-left:6px}

/* ---------- Bento (why) ---------- */
.bento{display:grid;grid-template-columns:1fr;gap:var(--gutter)}
.cell{position:relative;overflow:hidden;min-height:260px}
.cell--paper{background:var(--surface-2);padding:clamp(28px,3vw,44px);display:flex;flex-direction:column;gap:14px;justify-content:flex-end}
.cell--loden{background:var(--loden);color:var(--on-loden);padding:clamp(28px,3vw,44px);display:flex;flex-direction:column;gap:14px;justify-content:flex-end}
.cell--loden p{color:var(--on-loden-muted)}
.cell--loden .h3{color:var(--on-loden)}
.cell--line{border:1px solid var(--ink);padding:clamp(28px,3vw,44px);display:grid;grid-template-columns:auto 1fr;gap:28px;align-items:end}
.cell--img img{width:100%;height:100%;object-fit:cover;display:block;transition:transform 1200ms var(--ease)}
.cell--img:hover img{transform:scale(1.025)}
.cell__icon{width:40px;height:40px;color:var(--ink);margin-bottom:auto}
.cell__num{display:flex;align-items:baseline;gap:12px;margin-bottom:auto}
.cell__num span{font-family:var(--f-mono);font-size:clamp(64px,7vw,112px);line-height:.9;color:var(--on-loden)}
.cell__num small{font-family:var(--f-mono);font-size:13px;letter-spacing:.06em;color:var(--on-loden-muted)}
.cell__mark{width:clamp(64px,6vw,88px);height:auto}
.cell p{max-width:34rem}
.cell .arrow-link{margin-top:8px;align-self:flex-start}
@media (min-width:768px){
  .bento{grid-template-columns:repeat(12,1fr);grid-auto-rows:minmax(150px,auto)}
  .bento__a{grid-column:1/6;grid-row:span 2}
  .bento__b{grid-column:6/13;grid-row:span 2;min-height:360px}
  .bento__c{grid-column:1/5;grid-row:span 3}
  .bento__d{grid-column:5/9;grid-row:span 3}
  .bento__e{grid-column:9/13;grid-row:span 3}
  .bento__f{grid-column:1/7;grid-row:span 2}
  .bento__g{grid-column:7/13;grid-row:span 2;min-height:320px}
}
@media (max-width:767px){.bento__b,.bento__g{aspect-ratio:16/10;min-height:0}.bento__c{aspect-ratio:3/4}.cell--line{grid-template-columns:1fr}}

/* ---------- Capability cards with real photos ---------- */
.card__img{position:relative;aspect-ratio:3/4;overflow:hidden;background:var(--surface-2)}
.card__img img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:opacity 500ms var(--ease),transform 1200ms var(--ease)}
.card__img .alt{opacity:0}
.card:hover .card__img .alt,.card:focus-visible .card__img .alt{opacity:1}
.card:hover .card__img img{transform:scale(1.02)}
.card h3{margin-top:20px}
.rail-head .lead{max-width:34rem}

/* ---------- Process: photo follows the active step ---------- */
.process__frame{position:relative;aspect-ratio:16/10;margin-top:28px;overflow:hidden;background:var(--surface-2)}
.process__frame img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:0;transform:scale(1.04);transition:opacity 600ms var(--ease),transform 1400ms var(--ease)}
.process__frame img.on{opacity:1;transform:none}
@media (max-width:1023px){.process__frame{display:none}}
.counter{margin-top:24px}
.step__num{display:block;color:var(--steel-text)}
.process__note{margin-top:24px;color:var(--steel-text);max-width:40rem}

/* ---------- Factory ---------- */
.tour{position:relative;aspect-ratio:16/9;overflow:hidden;background:var(--ink)}
@media (min-width:1024px){.tour{aspect-ratio:21/9}}
.tour__el{width:100%;height:100%;object-fit:cover;display:block}
.tour.playing .tour__el{object-fit:contain}
.tour__play{position:absolute;inset:0;display:flex;align-items:flex-end;gap:18px;padding:clamp(20px,3vw,40px);background:rgba(28,27,25,.18);color:var(--chalk);text-align:left;transition:background var(--d2) var(--ease)}
.tour__play:hover{background:rgba(28,27,25,.32)}
.tour.playing .tour__play{display:none}
.tour__btn{width:clamp(64px,6vw,84px);height:clamp(64px,6vw,84px);display:grid;place-items:center;background:var(--chalk);color:var(--ink);transition:transform var(--d2) var(--ease)}
.tour__play:hover .tour__btn{transform:scale(1.05)}
.tour__btn svg{width:26px;height:26px}
.tour__lbl{display:grid;gap:4px}
.tour__lbl b{font-family:var(--f-serif);font-weight:400;font-size:clamp(24px,2.4vw,36px);line-height:1.1}
.tour__lbl small{color:var(--on-loden-muted)}
.loops figcaption{display:flex;gap:12px;justify-content:flex-start}
.loops .vid__el{cursor:pointer}
.fac2{display:grid;grid-template-columns:1fr;gap:40px var(--gutter);margin-top:clamp(48px,6vw,88px);align-items:start}
@media (min-width:1024px){.fac2{grid-template-columns:7fr 5fr}}
.fac2__eq .flow{margin-top:20px}
.fac2__eq .chips{margin-top:24px}
.verified{border:1px solid var(--ink);background:var(--chalk)}
.verified img{width:100%;height:auto;aspect-ratio:16/9;object-fit:cover;display:block}
.verified__body{padding:clamp(24px,2.6vw,36px);display:grid;gap:18px}
.verified__dl{display:grid;gap:0}
.verified__dl div{display:grid;grid-template-columns:140px 1fr;gap:12px;padding:10px 0;border-top:1px solid rgba(138,143,148,.5)}
.verified__dl dt{color:var(--steel-text);font-size:14px}
.verified__dl dd{font-family:var(--f-mono);font-size:14px}
.verified .arrow-link{justify-self:start}

/* ---------- Collection teaser: real photos ---------- */
.peek{display:block;aspect-ratio:3/4;overflow:hidden;background:var(--chalk)}
.peek img{width:100%;height:100%;object-fit:cover;display:block;transition:transform 900ms var(--ease)}
.peek:hover img{transform:scale(1.04)}
@media (max-width:767px){.coll__peek .peek:nth-child(n+6){display:none}}

/* ---------- Estimate ---------- */
.est__img{margin-top:32px;aspect-ratio:4/5;max-width:340px;overflow:hidden;display:none}
.est__img img{width:100%;height:100%;object-fit:cover;display:block}
@media (min-width:1024px){.est__img{display:block}}

/* ---------- Documents & certificates ---------- */
.docs__head{display:grid;gap:28px;margin-top:clamp(40px,5vw,72px);align-items:end}
@media (min-width:1024px){.docs__head{grid-template-columns:7fr 5fr}}
.docs__head .h1{max-width:14ch}
.docs__head .body{margin-top:20px}
.docs__filters{display:flex;flex-wrap:wrap;gap:6px;justify-content:flex-start}
@media (min-width:1024px){.docs__filters{justify-content:flex-end}}
.docs__grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:36px var(--gutter);margin-top:clamp(32px,4vw,56px)}
@media (min-width:768px){.docs__grid{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media (min-width:1280px){.docs__grid{grid-template-columns:repeat(4,minmax(0,1fr))}}
.doc{display:flex;flex-direction:column;min-width:0}
.doc__sheet{display:block;width:100%;aspect-ratio:1/1.414;background:var(--surface-2);padding:clamp(12px,1.6vw,22px);overflow:hidden;cursor:zoom-in;transition:background var(--d2) var(--ease)}
.doc__sheet:hover{background:#E2DBCC}
.doc__sheet > img{width:100%;height:100%;object-fit:contain;background:#fff}
.paper{position:relative;width:100%;height:100%;background:#FBF9F4;border:1px solid rgba(138,143,148,.45);display:flex;flex-direction:column;gap:8px;padding:14% 12% 12%;transition:transform 500ms var(--ease)}
.doc__sheet:hover .paper{transform:translateY(-4px)}
.paper::before{content:"";position:absolute;inset:6px;border:1px solid rgba(196,119,43,.55);pointer-events:none}
.paper__mark{width:30%;height:auto;align-self:center;opacity:.9;margin-bottom:10%}
.paper__t{font-family:var(--f-serif);font-size:clamp(14px,1.2vw,18px);line-height:1.2;text-align:center;color:var(--ink);margin-bottom:8%}
.paper__l{height:1px;background:rgba(138,143,148,.5)}
.paper__l.s{width:60%}
.paper__seal{position:absolute;right:12%;bottom:9%;width:22%;height:auto;aspect-ratio:1;color:var(--ochre)}
.doc__body{padding-top:14px;display:grid;gap:6px}
.doc__type{display:flex;align-items:center;gap:8px;font-size:13px;font-weight:500;color:var(--steel-text)}
.doc__type svg{width:18px;height:18px}
.doc__title{font-family:var(--f-serif);font-weight:500;font-size:clamp(19px,1.5vw,22px);line-height:1.2}
.doc__st{justify-self:start;font-family:var(--f-mono);font-size:12px;letter-spacing:.04em;padding:4px 8px;border:1px solid var(--steel)}
.doc__st--valid{border-color:var(--loden);color:var(--loden)}
.doc__st--progress{border-color:var(--ochre-text);color:var(--ochre-text)}
.doc__st--upload{border-style:dashed;color:var(--steel-text)}
.docs__foot{margin-top:clamp(32px,4vw,48px);display:flex;flex-wrap:wrap;gap:16px 24px;align-items:center}

.docv{width:min(1100px,calc(100vw - 32px));max-width:none;max-height:calc(100dvh - 32px);padding:0;border:1px solid var(--ink);background:var(--chalk);color:var(--ink);overflow:hidden}
.docv[open]{display:flex;flex-direction:column;animation:pdIn 420ms var(--ease)}
.docv::backdrop{background:rgba(28,27,25,.72)}
.docv__bar{display:flex;justify-content:space-between;align-items:center;padding:10px 12px 10px 20px;border-bottom:1px solid var(--ink)}
.docv__bar button{width:44px;height:44px;border:1px solid var(--steel);display:grid;place-items:center}
.docv__bar svg{width:20px;height:20px}
.docv__body{overflow-y:auto;display:grid;grid-template-columns:1fr;gap:28px;padding:20px}
@media (min-width:900px){.docv__body{grid-template-columns:6fr 5fr;gap:44px;padding:32px}}
.docv__sheet{aspect-ratio:1/1.414;background:var(--surface-2);padding:18px}
.docv__sheet iframe{width:100%;height:100%;border:0;background:#fff}
.docv__sheet > img{width:100%;height:100%;object-fit:contain}
.docv__meta{margin:24px 0}
.docv__meta div{display:grid;grid-template-columns:120px 1fr;gap:12px;padding:12px 0;border-top:1px solid rgba(138,143,148,.5)}
.docv__meta dt{color:var(--steel-text);font-size:14px}
@media (max-width:640px){.docv{width:100vw;max-height:100dvh;height:100dvh;border:0}}

/* ---------- Cases with images ---------- */
.case__img{aspect-ratio:4/5;overflow:hidden;background:var(--surface-2)}
.case__img img{width:100%;height:100%;object-fit:cover;display:block;transition:transform 1200ms var(--ease)}
.case:hover .case__img img{transform:scale(1.03)}

/* ---------- First run: horizontal programme strip ---------- */
.firstrun{padding:clamp(56px,7vw,112px) 0;background:var(--surface-2);margin-bottom:var(--sec)}
.firstrun__in{display:grid;gap:40px}
@media (min-width:1024px){.firstrun__in{grid-template-columns:5fr 7fr;align-items:end}}
.firstrun__head{display:grid;gap:22px;justify-items:start}
.firstrun__head .h1{max-width:13ch}
.firstrun__steps{display:grid;grid-template-columns:1fr 1fr;gap:0;border-top:1px solid var(--ink)}
@media (min-width:768px){.firstrun__steps{grid-template-columns:repeat(4,1fr)}}
.firstrun__steps li{padding:20px 18px 0 0;display:grid;gap:12px;align-content:start}
.firstrun__steps li + li{padding-left:18px;border-left:1px solid rgba(138,143,148,.6)}
@media (max-width:767px){.firstrun__steps li:nth-child(3){border-left:0;padding-left:0}.firstrun__steps li:nth-child(n+3){margin-top:20px}}
.firstrun__steps .mono{color:var(--ochre-text)}
.firstrun__steps b{font-family:var(--f-serif);font-weight:500;font-size:clamp(20px,1.6vw,24px);line-height:1.2}

/* ---------- Terms: grouped clusters instead of a long table ---------- */
.terms3 .h1{max-width:12ch;margin-top:16px}
.tgroups{display:grid;grid-template-columns:1fr;gap:var(--gutter);margin-top:clamp(36px,4.5vw,64px)}
@media (min-width:768px){.tgroups{grid-template-columns:1fr 1fr}}
@media (min-width:1280px){.tgroups{grid-template-columns:4fr 5fr 5fr 5fr}}
.tg{border-top:2px solid var(--ink);padding-top:20px;display:flex;flex-direction:column;gap:16px}
.tg__h{font-family:var(--f-serif);font-weight:500;font-size:clamp(24px,2vw,30px);line-height:1.1}
.tg dl{display:grid;gap:18px}
.tg dt{font-size:14px;color:var(--steel-text)}
.tg dd{margin-top:4px;display:flex;flex-wrap:wrap;align-items:baseline;gap:8px}
.tg dd b{font-family:var(--f-mono);font-weight:400;font-size:clamp(26px,2.2vw,34px);line-height:1;letter-spacing:.01em}
.tg dd span{font-size:14px;color:var(--steel-text)}
.tg--dark{background:var(--ink);color:var(--chalk);border-top-color:var(--ink);padding:20px clamp(18px,2vw,26px) 26px}
.tg--dark dt,.tg--dark dd span{color:var(--on-loden-muted)}
.tg__list{display:grid;gap:10px}
.tg__list li{position:relative;padding-left:22px;font-size:15px;line-height:1.5}
.tg__list li::before{content:"";position:absolute;left:0;top:.62em;width:12px;height:1px;background:var(--ochre)}

/* ---------- Quote: 3-step brief ---------- */
.quote3__grid{display:grid;grid-template-columns:1fr;gap:48px var(--gutter)}
@media (min-width:1024px){.quote3__grid{grid-template-columns:5fr 7fr}.quote3__aside{position:sticky;top:calc(var(--header-h) + 32px);align-self:start}}
.quote3__aside .h1{max-width:12ch}
.quote3__aside .body{margin-top:20px}
.qch{margin-top:28px;display:grid;grid-template-columns:1fr 1fr;gap:8px}
.qch a,.qch button{display:flex;align-items:center;gap:10px;min-height:52px;padding:0 14px;border:1px solid var(--steel);font-size:15px;font-weight:500;text-decoration:none;color:var(--ink);width:100%;transition:border-color var(--d1),background var(--d1)}
.qch a:hover,.qch button:hover{border-color:var(--ink);background:var(--ink-06)}
.qch svg{width:22px;height:22px;flex:none}
.qnext{margin-top:32px;counter-reset:qn;display:grid;gap:0}
.qnext li{display:grid;gap:4px;padding:14px 0 14px 40px;position:relative;border-top:1px solid rgba(138,143,148,.5)}
.qnext li::before{counter-increment:qn;content:counter(qn);position:absolute;left:0;top:14px;width:26px;height:26px;border:1px solid var(--ink);display:grid;place-items:center;font-family:var(--f-mono);font-size:12px}
.qnext b{font-weight:600;font-size:15px}
.qnext span{font-size:15px;color:var(--steel-text)}
.qclock{margin-top:20px}
.qf{border:1px solid var(--ink);padding:clamp(22px,3vw,40px);display:grid;gap:22px;background:var(--chalk)}
.qf__progress{display:grid;grid-template-columns:repeat(3,1fr);gap:6px}
.qf__progress i{height:2px;background:var(--steel);opacity:.35;transition:background var(--d2),opacity var(--d2)}
.qf__progress i.on{background:var(--ochre);opacity:1}
.qf__stepname{margin-top:-8px}
.qf__step{border:0;margin:0;padding:0;display:grid;grid-template-columns:1fr;gap:22px var(--gutter);min-width:0}
@media (min-width:640px){.qf__step{grid-template-columns:1fr 1fr}.qf__step .full,.qf__step legend{grid-column:1/-1}}
.qf__step legend{padding:0;margin-bottom:6px;float:left;width:100%}
.qf__step[hidden]{display:none}
.field__help{margin-top:-2px}
.field.err .field__help{display:none}
.qf__nav{display:flex;flex-wrap:wrap;gap:12px;align-items:center;padding-top:8px;border-top:1px solid rgba(138,143,148,.5)}
.qf__nav [hidden]{display:none}
.qf__saved{margin-left:auto;opacity:0;transition:opacity var(--d2)}
.qf__saved.show{opacity:1}
.form-ok{border:1px solid var(--ink);padding:clamp(24px,3vw,40px)}
.form-ok .lead__ok{width:48px;height:48px;color:var(--loden)}
@media (max-width:639px){.qf__nav .btn{flex:1 1 auto}.qf__saved{width:100%;margin-left:0}}

/* ---------- Floating contact button + sticky bar ---------- */
.msg{display:none!important}
.fab{position:fixed;right:24px;bottom:24px;z-index:95;height:48px;display:none;align-items:center;gap:10px;padding:0 18px;background:var(--ink);color:var(--chalk);font-weight:600;font-size:14px;letter-spacing:.02em;transition:transform var(--d2) var(--ease)}
.fab:hover{transform:translateY(-2px)}
.fab svg{width:20px;height:20px}
@media (min-width:1024px){.fab{display:flex}}
.lead-open .fab{opacity:0;pointer-events:none}
.sticky > *{display:flex;align-items:center;justify-content:center;gap:10px;color:var(--chalk);text-decoration:none;font-weight:600;font-size:15px;background:none;border:0}
.sticky > :first-child{flex:1}
.sticky > * + *{width:64px;border-left:1px solid rgba(243,239,230,.25)}

/* ---------- Lead drawer ---------- */
.ld{position:fixed;inset:0;z-index:300}
.ld[hidden]{display:none}
.lead__scrim{position:absolute;inset:0;background:rgba(28,27,25,.55);opacity:0;transition:opacity 320ms var(--ease)}
.lead__panel{position:absolute;top:0;right:0;bottom:0;width:min(520px,100vw);background:var(--chalk);display:flex;flex-direction:column;overflow-y:auto;transform:translateX(100%);transition:transform 420ms var(--ease);overscroll-behavior:contain}
.ld.open .lead__scrim{opacity:1}
.ld.open .lead__panel{transform:none}
.lead-open{overflow:hidden}
.lead__head{display:grid;grid-template-columns:auto 1fr auto;gap:16px;align-items:start;padding:24px 24px 20px;border-bottom:1px solid var(--ink);position:sticky;top:0;background:var(--chalk);z-index:1}
.lead__head img{width:40px;height:auto}
.lead__title{font-family:var(--f-serif);font-weight:500;font-size:28px;line-height:1.1}
.lead__x{width:44px;height:44px;border:1px solid var(--steel);display:grid;place-items:center}
.lead__x:hover{border-color:var(--ink)}
.lead__x svg{width:20px;height:20px}
.lead__step{padding:24px;display:grid;gap:18px;align-content:start}
.lead__step[hidden]{display:none}
.lead__ch{display:grid;gap:8px}
.lead__ch a,.lead__ch button{width:100%;display:grid;grid-template-columns:28px 1fr 20px;gap:16px;align-items:center;padding:16px 18px;border:1px solid var(--steel);text-decoration:none;color:var(--ink);text-align:left;transition:border-color var(--d1),background var(--d1),transform 120ms var(--ease)}
.lead__ch a:hover,.lead__ch button:hover{border-color:var(--ink);background:var(--ink-06)}
.lead__ch a:active,.lead__ch button:active{transform:translateY(1px)}
.lead__ch svg{width:28px;height:28px}
.lead__ch .go{width:20px;height:20px;color:var(--steel-text)}
.lead__ch b{display:block;font-weight:600;font-size:16px}
.lead__ch small{display:block;font-size:14px;color:var(--steel-text);line-height:1.4;margin-top:2px}
.lead__or{display:flex;align-items:center;gap:12px;color:var(--steel-text);font-size:14px}
.lead__or::before,.lead__or::after{content:"";flex:1;height:1px;background:rgba(138,143,148,.6)}
.lead__brief{width:100%}
.lead__ref{color:var(--steel-text);text-align:center}
.lead__back{display:inline-flex;align-items:center;gap:8px;font-size:14px;font-weight:500;color:var(--steel-text);justify-self:start}
.lead__back svg{width:18px;height:18px}
.lead__back:hover{color:var(--ink)}
.lead__form .btn{width:100%}
.lead__done{justify-items:start}
.lead__ok{width:56px;height:56px;color:var(--loden)}
.lead__next{display:grid;gap:10px;counter-reset:ln}
.lead__next li{position:relative;padding-left:32px;font-size:15px}
.lead__next li::before{counter-increment:ln;content:counter(ln);position:absolute;left:0;top:0;width:22px;height:22px;border:1px solid var(--ink);display:grid;place-items:center;font-family:var(--f-mono);font-size:11px}
@media (prefers-reduced-motion:reduce){.lead__panel,.lead__scrim{transition:none}}

/* ---------- Catalogue v3 ---------- */
.chero__collage{grid-column:1/-1;position:relative;aspect-ratio:1/1;max-width:560px;width:100%;justify-self:center}
@media (min-width:1024px){.chero__collage{grid-column:8/-1}}
.cc{position:absolute;width:44%;height:auto;aspect-ratio:3/4;object-fit:cover;transition:transform 900ms var(--ease)}
.cc--1{left:0;top:16%;z-index:2}
.cc--2{left:30%;top:0;z-index:1}
.cc--3{left:56%;top:26%;z-index:3}
.chero__collage:hover .cc--1{transform:translate(-6px,4px)}
.chero__collage:hover .cc--3{transform:translate(6px,-4px)}
.cc__bee{position:absolute;right:-2%;top:-6%;width:28%;z-index:4;animation:beeHover 6s ease-in-out infinite}
.cc__mark{position:absolute;left:4%;bottom:-2%;width:20%;z-index:4;background:var(--chalk);padding:10px}
.cc__trail{position:absolute;inset:0;width:100%;height:100%;z-index:4;overflow:visible;pointer-events:none}
.cc__trail path{fill:none;stroke:var(--ink);stroke-width:1.25;stroke-dasharray:4 3;vector-effect:non-scaling-stroke}
@media (prefers-reduced-motion:reduce){.cc__bee{animation:none}}
.chero__stats{margin-top:clamp(40px,5vw,64px);display:grid;grid-template-columns:repeat(2,1fr);border-top:1px solid var(--steel)}
@media (min-width:640px){.chero__stats{grid-template-columns:repeat(4,1fr)}}
.chero__stats dd{padding:18px 16px 0 0;display:grid;gap:8px}
.chero__stats b{font-family:var(--f-mono);font-weight:400;font-size:clamp(28px,2.6vw,40px);line-height:1;color:var(--ochre)}
.chero__stats span{font-size:14px;font-weight:500}
.pc__slide img{display:block;width:100%;aspect-ratio:3/4;object-fit:cover;background:var(--surface-2)}
.pc__slide .ph{width:100%}
.pc__colour{margin-top:2px}
.pc--empty .pc__name{color:var(--steel-text)}
.pgrid__empty{display:grid;justify-items:start;gap:18px}
.pgrid__empty img{width:72px}
.pd__cust-h{margin-top:28px;font-weight:600}
.pc__media .todo{position:absolute;left:10px;right:10px;bottom:34px;z-index:6;top:auto}

/* ---------- Your label: 3D hang tag ---------- */
.tag3d{padding:var(--sec) 0;background:var(--surface-2)}
.tag3d__grid{display:grid;grid-template-columns:1fr;gap:40px var(--gutter);align-items:center}
@media (min-width:1024px){.tag3d__grid{grid-template-columns:5fr 7fr}}
.tag3d__text{display:grid;gap:22px;justify-items:start}
.tag3d__text .h1{max-width:12ch}
.tag3d__text .h1 em{font-style:italic}
.tag3d__text .field{width:100%;max-width:420px}
.tag3d__stage{position:relative;aspect-ratio:4/5;max-height:760px;width:100%;cursor:grab;background:var(--chalk)}
.tag3d__stage.grabbing{cursor:grabbing}
.tag3d__stage canvas{position:absolute;inset:0;width:100%!important;height:100%!important;display:block}
.tag3d__fallback{position:absolute;inset:0;display:grid;place-items:center;transition:opacity 500ms var(--ease)}
.tag3d__fallback .paper{width:min(46%,260px);aspect-ratio:1/1.8;height:auto;transform:rotate(-6deg)}
.tag3d__stage.ready .tag3d__fallback{opacity:0;pointer-events:none}
.tag3d__hint{position:absolute;left:16px;bottom:12px}

/* ---------- Legal + 404 ---------- */
.legal{padding:calc(var(--header-h) + 48px) 0 var(--sec)}
.legal__grid{display:grid;gap:40px}
@media (min-width:1024px){.legal__grid{grid-template-columns:3fr 9fr}.legal__nav{position:sticky;top:calc(var(--header-h) + 32px);align-self:start}}
.legal__nav{display:flex;flex-direction:column;gap:10px}
.legal__nav a{font-weight:500;text-decoration:none;border-bottom:1px solid transparent;align-self:start}
.legal__nav a:hover{border-bottom-color:var(--ink)}
.legal__body section{padding-bottom:56px;margin-bottom:56px;border-bottom:1px solid rgba(138,143,148,.5);display:grid;gap:22px}
.legal__body section:last-child{border-bottom:0}
.legal__dl div{display:grid;grid-template-columns:200px 1fr;gap:16px;padding:12px 0;border-top:1px solid rgba(138,143,148,.5)}
.legal__dl dt{color:var(--steel-text)}
.nf{padding:calc(var(--header-h) + 64px) 0 var(--sec);min-height:70dvh}
.nf__in{display:grid;gap:22px;justify-items:start;max-width:820px}
.nf__bee{width:140px;height:auto;animation:beeHover 6s ease-in-out infinite}
@media (prefers-reduced-motion:reduce){.nf__bee{animation:none}}

/* ---------- Mobile polish ---------- */
@media (max-width:639px){
  .hero--v3{min-height:0}
  .hero--v3 .btn-row .btn{flex:1 1 100%}
  .qch{grid-template-columns:1fr}
  .verified__dl div,.legal__dl div{grid-template-columns:1fr;gap:2px}
  .docs__grid{gap:28px 14px}
  .doc__title{font-size:17px}
}

/* images with width/height attributes: let aspect-ratio drive the height */
:where(img[width][height]){height:auto}