/* ===========================================================
   SECONDS WORLDWIDE — shared design system
   LIGHT-DOMINANT: bone page · ink contrast blocks · reject accent
   Colour is driven by semantic tokens so .invert flips everything.
   =========================================================== */
:root{
  /* raw brand */
  --ink:#141210; --bone:#e8e2d5; --ash:#8d8578; --reject:#c9482f;
  /* semantic — LIGHT default (white paper) */
  --bg:#ffffff; --fg:#141210; --muted:#6b6459;
  --line:rgba(20,18,16,.14); --line2:rgba(20,18,16,.07);
  --card:rgba(20,18,16,.015); --nav-bg:rgba(255,255,255,.82);
  --disp:"Helvetica Neue",Helvetica,Arial,sans-serif;
  --mono:"SFMono-Regular",Menlo,Consolas,monospace;
  --pad:clamp(18px,4vw,40px); --max:1180px; --navh:52px;
}
/* DARK contrast block */
.invert{
  --bg:#141210; --fg:#e8e2d5; --muted:#8d8578;
  --line:rgba(232,226,213,.16); --line2:rgba(232,226,213,.08);
  --card:rgba(232,226,213,.02); --nav-bg:rgba(20,18,16,.82);
  background:var(--bg); color:var(--fg);
}
*{margin:0;padding:0;box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
body{background:var(--bg);color:var(--fg);font-family:var(--disp);-webkit-font-smoothing:antialiased;overflow-x:hidden;line-height:1.4}
::selection{background:var(--reject);color:var(--bone)}
a{color:inherit;text-decoration:none}
img{max-width:100%;display:block}
.mono{font-family:var(--mono);letter-spacing:.18em;text-transform:uppercase;font-size:11px;color:var(--muted)}
.reject{color:var(--reject)}
.wrap{max-width:var(--max);margin-inline:auto}

/* ---------- NAV ---------- */
.nav{position:sticky;top:0;z-index:40;background:var(--nav-bg);backdrop-filter:blur(12px);border-bottom:1px solid var(--line)}
.nav-in{max-width:var(--max);margin-inline:auto;display:flex;align-items:center;justify-content:space-between;gap:20px;padding:14px var(--pad)}
.brandmark{display:flex;align-items:baseline;gap:3px;font-weight:700;letter-spacing:.02em;font-size:16px;color:var(--fg)}
.brandmark .sl{color:var(--reject)}
.brandmark span{color:var(--reject);font-weight:600}
.nav-links{display:flex;gap:clamp(14px,2.5vw,32px);align-items:center;flex-wrap:wrap;flex:1;justify-content:flex-end}
.nav-links a{font-family:var(--mono);text-transform:uppercase;letter-spacing:.16em;font-size:11px;color:var(--muted);padding-bottom:2px;border-bottom:1px solid transparent;transition:color .25s,border-color .25s}
.nav-links a:hover,.nav-links a.active{color:var(--fg);border-color:var(--reject)}
.nav-ig{display:inline-flex;align-items:center;flex:none;margin-left:clamp(14px,2.5vw,26px);color:var(--muted);border-bottom:0 !important;transition:color .25s,transform .25s}
.nav-ig:hover{color:var(--reject);transform:translateY(-1px)}
/* burger — two hairlines, becomes an ✕ */
.nav-toggle{display:none;width:44px;height:44px;margin-right:-12px;background:none;border:0;cursor:pointer;position:relative;flex:none;color:var(--fg)}
.nav-toggle span{position:absolute;left:11px;width:22px;height:1.5px;background:currentColor;transition:transform .3s cubic-bezier(.2,.7,.2,1),opacity .2s}
.nav-toggle span:first-child{top:19px}
.nav-toggle span:last-child{top:25px}
.nav.open .nav-toggle span:first-child{transform:translateY(3px) rotate(45deg)}
.nav.open .nav-toggle span:last-child{transform:translateY(-3px) rotate(-45deg)}
/* drawer */
.nav-draw{display:none;flex-direction:column;padding:clamp(6px,2vw,14px) var(--pad) calc(28px + env(safe-area-inset-bottom));overflow-y:auto;-webkit-overflow-scrolling:touch;flex:1}
.nav-draw>a{display:flex;align-items:baseline;justify-content:space-between;gap:16px;padding:20px 0;border-bottom:1px solid var(--line);font-weight:700;letter-spacing:-.01em;font-size:clamp(26px,7.6vw,34px);line-height:1;color:var(--fg)}
.nav-draw>a i{font-family:var(--mono);font-style:normal;font-size:11px;letter-spacing:.2em;color:var(--muted)}
.nav-draw>a.active{color:var(--reject)}
.nav-draw>a.active i{color:var(--reject)}
.nav-draw-foot{margin-top:auto;padding-top:30px;display:flex;flex-direction:column;gap:14px}
.nav-draw-foot a{display:flex;align-items:center;gap:9px;font-family:var(--mono);text-transform:uppercase;letter-spacing:.16em;font-size:11px;color:var(--muted)}
@media(max-width:760px){
  .nav-in{padding:8px var(--pad)}
  .nav-links,.nav-in .nav-ig{display:none}
  .nav-toggle{display:block}
  .nav.open{position:fixed;inset:0 0 auto 0;height:100svh;display:flex;flex-direction:column;background:var(--bg);backdrop-filter:none;border-bottom:0}
  .nav.open .nav-in{width:100%}   /* auto margins would otherwise stop it stretching */
  .nav.open .nav-draw{display:flex;animation:drawIn .32s cubic-bezier(.2,.7,.2,1)}
}
@keyframes drawIn{from{opacity:0;transform:translateY(-10px)}to{opacity:1;transform:none}}

/* ---------- NAV ON SCROLL — quiet lift once you leave the top ---------- */
.nav{transition:background .3s ease,box-shadow .3s ease}
.nav.scrolled{--nav-bg:rgba(255,255,255,.94);box-shadow:0 8px 24px rgba(20,18,16,.06)}
@media(prefers-reduced-motion:reduce){.nav{transition:none}}

/* ---------- BUTTONS ---------- */
.btn{display:inline-block;background:var(--fg);color:var(--bg);font-family:var(--mono);text-transform:uppercase;letter-spacing:.2em;font-size:12px;font-weight:700;padding:16px 26px;border:0;cursor:pointer;transition:background .25s,color .25s;text-align:center}
.btn:hover{background:var(--reject);color:var(--bone)}
.btn:disabled{opacity:.45;cursor:default}
.btn-ghost{display:inline-block;border:1px solid var(--line);color:var(--fg);font-family:var(--mono);text-transform:uppercase;letter-spacing:.2em;font-size:12px;padding:15px 26px;transition:border-color .25s,color .25s}
.btn-ghost:hover{border-color:var(--reject)}

/* ---------- SECTION SCAFFOLD ---------- */
.section{padding:clamp(46px,7vw,100px) var(--pad)}
.section-head{max-width:var(--max);margin:0 auto clamp(28px,5vw,56px);display:flex;justify-content:space-between;align-items:baseline;gap:12px;border-bottom:1px solid var(--line);padding-bottom:14px;flex-wrap:wrap}
.section-head h2{font-weight:700;letter-spacing:.02em;font-size:clamp(22px,3.4vw,36px)}
.breadcrumb{font-family:var(--mono);text-transform:uppercase;letter-spacing:.18em;font-size:11px;color:var(--muted);padding:clamp(20px,4vw,34px) var(--pad) 0}
.breadcrumb a:hover{color:var(--fg)}
.page-title{padding:clamp(24px,5vw,54px) var(--pad) 0}
.page-title h1{font-weight:700;letter-spacing:-.01em;line-height:.96;font-size:clamp(42px,9vw,110px)}
.page-title h1 em{color:var(--reject);font-style:normal}
.page-title .lede{color:var(--muted);max-width:44ch;margin-top:22px;font-size:clamp(15px,1.9vw,18px);line-height:1.55}

/* ---------- HERO ---------- */
.hero{min-height:calc(100svh - var(--navh));padding:var(--pad);display:flex;flex-direction:column}
.frame{flex:1;padding:clamp(18px,4vw,44px);display:grid;grid-template-rows:auto 1fr auto;gap:24px}
.frame .row{display:flex;justify-content:space-between;align-items:flex-start;gap:16px}
.frame .center{display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;gap:clamp(14px,2.5vw,26px)}
.lockup{line-height:.86}
.lockup .s{font-weight:700;letter-spacing:.02em;font-size:clamp(58px,19vw,240px);display:block;color:var(--fg)}
.lockup .w{color:var(--reject);font-weight:600;letter-spacing:clamp(.14em,2vw,.42em);font-size:clamp(15px,4.6vw,54px);display:block;margin-top:.35em;padding-left:.42em}
.tag{font-family:var(--mono);text-transform:uppercase;letter-spacing:.32em;font-size:clamp(10px,1.6vw,14px);color:var(--fg)}
.hlink{font-family:var(--mono);text-transform:uppercase;letter-spacing:.2em;font-size:10px;color:var(--muted);border-bottom:1px solid var(--line);padding-bottom:2px;transition:color .3s,border-color .3s}
.hlink:hover{color:var(--fg);border-color:var(--reject)}
.scroll{font-family:var(--mono);text-transform:uppercase;letter-spacing:.28em;font-size:10px;color:var(--muted);text-align:center;animation:pulse 2.4s ease-in-out infinite}
@keyframes pulse{0%,100%{opacity:.35}50%{opacity:1}}

/* ---------- TICKER ---------- */
.ticker{border-block:1px solid var(--line);overflow:hidden;white-space:nowrap;padding:14px 0}
.ticker-track{display:inline-flex;gap:44px;animation:marquee 34s linear infinite;will-change:transform}
.ticker span{font-family:var(--mono);text-transform:uppercase;letter-spacing:.28em;font-size:13px;color:var(--muted)}
.ticker span b{color:var(--reject);font-weight:400}
@keyframes marquee{from{transform:translateX(0)}to{transform:translateX(-50%)}}
@media(prefers-reduced-motion:reduce){.ticker-track{animation:none}}
/* dark contrast ticker band on a light page */
.ticker.dark{background:var(--ink);border-color:transparent}
.ticker.dark span{color:var(--bone)}
.ticker.dark span b{color:var(--reject)}

/* ---------- PRODUCT GRID / CARDS ---------- */
.grid{display:grid;gap:clamp(14px,2vw,22px);grid-template-columns:repeat(3,1fr);max-width:var(--max);margin-inline:auto}
@media(max-width:820px){.grid{grid-template-columns:1fr}}
.card{position:relative;display:flex;flex-direction:column;background:transparent;border:0;padding:0;transition:transform .4s}
.card:hover{transform:translateY(-5px)}
.card-media{position:relative;background:#f4efe4;border:1px solid var(--line2);aspect-ratio:4/5;display:flex;align-items:center;justify-content:center;padding:clamp(28px,4vw,48px);margin-bottom:20px;overflow:hidden;transition:border-color .4s}
.card:hover .card-media{border-color:var(--line)}
.card-media img{max-height:100%;max-width:78%;transition:transform .55s ease}
.card:hover .card-media img{transform:scale(1.035)}
.card-price{display:flex;align-items:center;gap:11px;font-family:var(--mono);font-size:14px;letter-spacing:.06em;color:var(--fg);margin-bottom:16px}
.card-out{font-size:10px;text-transform:uppercase;letter-spacing:.16em;color:var(--muted);border:1px solid var(--line);padding:3px 8px}
.card .qc{color:var(--muted);text-align:center;margin-bottom:auto}
.card h3{font-weight:700;letter-spacing:.01em;line-height:1;font-size:clamp(22px,2.6vw,30px);margin:0 0 12px;color:var(--fg)}
.card h3 small{display:block;font-size:12px;letter-spacing:.24em;color:var(--muted);font-weight:400;margin-top:10px;font-family:var(--mono);text-transform:uppercase}
.spec{display:flex;flex-direction:column;gap:9px;margin-top:auto}
.spec div{display:flex;justify-content:space-between;font-family:var(--mono);font-size:12px;letter-spacing:.08em;color:var(--muted);border-bottom:1px dotted var(--line);padding-bottom:8px}
.spec div span:last-child{color:var(--fg)}
.card .view{font-family:var(--mono);text-transform:uppercase;letter-spacing:.2em;font-size:10px;color:var(--muted);margin-top:16px;transition:color .3s}
.card:hover .view{color:var(--reject)}
.stamp{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%) rotate(-12deg);border:3px solid var(--reject);color:var(--reject);font-weight:700;letter-spacing:.14em;font-size:clamp(20px,2.6vw,30px);padding:8px 20px;text-transform:uppercase;opacity:.95;pointer-events:none;white-space:nowrap;box-shadow:0 0 0 1px rgba(201,72,47,.25)}

/* ---------- SOLD-OUT BADGE — stamp settle on load ---------- */
@keyframes stampIn{0%{opacity:0;transform:scale(1.35) rotate(-4deg)}55%{opacity:1}100%{opacity:1;transform:scale(1) rotate(0)}}
@media(prefers-reduced-motion:no-preference){
  .badge-out,.card-out{animation:stampIn .55s cubic-bezier(.34,1.4,.5,1) both;transform-origin:center}
  .badge-out{animation-delay:.22s}
  .card:nth-child(1) .card-out{animation-delay:.06s}
  .card:nth-child(2) .card-out{animation-delay:.14s}
  .card:nth-child(3) .card-out{animation-delay:.22s}
}

/* ---------- PRODUCT DETAIL ---------- */
.prod{display:grid;grid-template-columns:1fr 1fr;gap:clamp(24px,4vw,60px);max-width:var(--max);margin-inline:auto;align-items:start}
@media(max-width:860px){.prod{grid-template-columns:1fr;gap:32px}}
/* dark QC hangtag "image" — always dark for contrast on the light page */
.tagbig{position:sticky;top:90px;background:#f4efe4;color:var(--fg);border:1px solid var(--line2);aspect-ratio:4/5;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:clamp(28px,4vw,52px);overflow:hidden}
@media(max-width:860px){.tagbig{position:static}}
.tagbig .dot{width:38px;height:38px;border:3px solid var(--fg);border-radius:50%;position:relative;margin-bottom:30px}
.tagbig .dot::after{content:"";position:absolute;inset:9px;background:var(--fg);border-radius:50%}
.tagbig .qch{font-family:var(--mono);text-transform:uppercase;letter-spacing:.26em;font-size:12px;color:var(--muted);margin-bottom:auto}
.tagbig .rej{color:var(--reject);font-weight:700;font-size:clamp(44px,8vw,72px);letter-spacing:.02em;line-height:1;margin:24px 0}
.tagbig .sw{font-weight:700;font-size:clamp(20px,3vw,26px);letter-spacing:.02em;margin-top:auto;color:var(--fg)}
.tagbig .sw small{display:block;color:var(--muted);font-family:var(--mono);text-transform:uppercase;letter-spacing:.3em;font-size:10px;margin-top:8px}
.tagbig .pimg{max-height:80%;max-width:84%}
.tagbig .pcap{position:absolute;top:clamp(20px,3vw,30px);left:0;right:0;text-align:center;font-family:var(--mono);text-transform:uppercase;letter-spacing:.22em;font-size:11px;color:var(--muted)}
.tagbig .pstamp{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%) rotate(-11deg);border:3px solid var(--reject);color:var(--reject);font-weight:700;letter-spacing:.14em;font-size:clamp(22px,3vw,34px);padding:9px 24px;text-transform:uppercase;box-shadow:0 0 0 1px rgba(201,72,47,.25);white-space:nowrap;pointer-events:none;background:rgba(255,255,255,.6)}
.prod-info h1{font-weight:700;letter-spacing:-.01em;line-height:1;font-size:clamp(34px,5vw,58px);margin-bottom:14px;color:var(--fg)}
.prod-info .lot{font-family:var(--mono);text-transform:uppercase;letter-spacing:.2em;font-size:12px;color:var(--muted);margin-bottom:26px}
.prod-info .desc{color:var(--muted);line-height:1.65;font-size:clamp(15px,1.8vw,17px);margin-bottom:30px;max-width:46ch}
.prod-info .desc b{color:var(--fg);font-weight:400}
.spec-table{border-top:1px solid var(--line);margin-bottom:30px}
.spec-table div{display:flex;justify-content:space-between;font-family:var(--mono);font-size:13px;letter-spacing:.06em;color:var(--muted);padding:14px 0;border-bottom:1px solid var(--line)}
.spec-table div b{color:var(--fg);font-weight:400}
.buybar{display:flex;align-items:center;gap:18px;flex-wrap:wrap;margin-bottom:26px}
.price-out{font-family:var(--mono);color:var(--reject);text-transform:uppercase;letter-spacing:.16em;font-size:13px;border:1px solid var(--reject);padding:14px 20px}
.care{border:1px dashed var(--line);padding:18px 20px;font-family:var(--mono);font-size:11px;letter-spacing:.1em;color:var(--muted);text-transform:uppercase;line-height:1.9}
.care b{color:var(--reject);font-weight:400}

/* ---------- PDP — Globe-style info column ---------- */
.pdp-cat{font-family:var(--mono);text-transform:uppercase;letter-spacing:.2em;font-size:11px;color:var(--muted);margin-bottom:12px}
.pdp-price{display:flex;align-items:center;gap:14px;margin:16px 0 30px}
.pdp-price .amt{font-family:var(--mono);font-size:clamp(17px,2vw,21px);letter-spacing:.06em;color:var(--fg)}
.badge-out{font-family:var(--mono);text-transform:uppercase;letter-spacing:.16em;font-size:10px;color:var(--reject);border:1px solid var(--reject);padding:5px 9px}
.pdp-field{margin-bottom:26px}
.pdp-flabel{font-family:var(--mono);text-transform:uppercase;letter-spacing:.18em;font-size:11px;color:var(--muted);margin-bottom:12px}
.pdp-flabel b{color:var(--fg);font-weight:400}
.swatches{display:flex;gap:10px}
.swatch{width:44px;height:44px;border:1px solid var(--line)}
.swatch.active{outline:1px solid var(--fg);outline-offset:2px}
.sizes{display:grid;grid-template-columns:repeat(6,1fr);gap:8px;max-width:380px}
.size{border:1px solid var(--line);padding:13px 0;text-align:center;font-family:var(--mono);font-size:13px;letter-spacing:.06em;color:var(--muted)}
.size.out{background:linear-gradient(to top right,transparent calc(50% - .5px),var(--line) calc(50% - .5px),var(--line) calc(50% + .5px),transparent calc(50% + .5px))}
.fitbar{display:grid;grid-template-columns:repeat(5,1fr);gap:4px;margin-bottom:9px;max-width:380px}
.fitbar span{height:4px;background:var(--line)}
.fitbar span.on{background:var(--fg)}
.fit-scale{display:flex;justify-content:space-between;max-width:380px;font-family:var(--mono);text-transform:uppercase;letter-spacing:.14em;font-size:10px;color:var(--muted)}
.pdp-cta{display:block;width:100%;text-align:center;background:transparent;color:var(--fg);border:1px solid var(--fg);font-family:var(--mono);text-transform:uppercase;letter-spacing:.2em;font-size:12px;font-weight:700;padding:18px;margin:8px 0 12px;transition:background .25s,color .25s}
.pdp-cta:hover{background:var(--fg);color:var(--bg)}
.pdp-acc{border-top:1px solid var(--line)}
.pdp-acc summary{list-style:none;cursor:pointer;display:flex;justify-content:space-between;align-items:center;gap:10px;padding:20px 0;font-family:var(--mono);text-transform:uppercase;letter-spacing:.14em;font-size:12px;color:var(--fg)}
.pdp-acc summary::-webkit-details-marker{display:none}
.pdp-acc summary .pm{color:var(--reject);font-size:18px;transition:transform .25s}
.pdp-acc[open] summary .pm{transform:rotate(45deg)}
.pdp-acc .body{padding:0 0 24px;color:var(--muted);line-height:1.7;font-size:14px;max-width:52ch}
.pdp-acc .body b{color:var(--fg);font-weight:400}
.pdp-acc .body ul{list-style:none;margin-top:12px}
.pdp-acc .body li{padding:9px 0;font-family:var(--mono);font-size:12px;letter-spacing:.04em;display:flex;justify-content:space-between;gap:20px;border-bottom:1px dotted var(--line);max-width:420px}
.pdp-acc .body li b{color:var(--fg)}

/* ---------- ARCHIVE LOTS ---------- */
.lots{max-width:var(--max);margin-inline:auto;border-top:1px solid var(--line)}
.lot-row{display:grid;grid-template-columns:130px 1fr auto;gap:clamp(16px,4vw,40px);align-items:center;padding:clamp(24px,4vw,40px) 0;border-bottom:1px solid var(--line);transition:background .3s}
.lot-row:hover{background:var(--card)}
@media(max-width:640px){.lot-row{grid-template-columns:1fr auto;gap:10px}.lot-row .lot-no{grid-column:1/-1}}
.lot-no{font-weight:700;font-size:clamp(30px,5vw,54px);letter-spacing:.02em;line-height:1;color:var(--fg)}
.lot-mid h3{font-weight:700;font-size:clamp(17px,2.2vw,22px);margin-bottom:6px;color:var(--fg)}
.lot-mid p{color:var(--muted);font-family:var(--mono);font-size:12px;letter-spacing:.08em;text-transform:uppercase}
.lot-state{font-family:var(--mono);text-transform:uppercase;letter-spacing:.16em;font-size:12px;padding:9px 15px;border:1px solid var(--line);white-space:nowrap;color:var(--muted)}
.lot-state.out{color:var(--reject);border-color:var(--reject)}
.lot-state.load{color:var(--fg)}

/* ---------- PROOF / STATS ---------- */
.proof-grid{max-width:var(--max);margin-inline:auto;display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(40px,6vw,64px) clamp(30px,5vw,64px)}
@media(max-width:820px){.proof-grid{grid-template-columns:1fr}}
.stat{border-top:1px solid var(--fg);padding-top:22px}
.stat .num{font-weight:700;letter-spacing:-.02em;line-height:.88;font-size:clamp(56px,8vw,110px);font-variant-numeric:tabular-nums;color:var(--fg);margin-bottom:16px}
.stat .num em{color:var(--reject);font-style:normal}
.stat .lab{font-family:var(--mono);text-transform:uppercase;letter-spacing:.2em;font-size:12px;color:var(--fg);margin-bottom:10px}
.stat .txt{color:var(--muted);font-size:clamp(13px,1.5vw,15px);line-height:1.55;max-width:28ch}

/* ---------- HERO ENTRANCE (armed pre-paint by the head script → no flash) ---------- */
html.hero-armed .hero .anim{opacity:0;transition:opacity .9s cubic-bezier(.2,.7,.2,1),transform .9s cubic-bezier(.2,.7,.2,1)}
html.hero-armed .hero .anim.up{transform:translateY(26px)}
html.hero-armed .hero.hero-in .anim{opacity:1;transform:none}
html.hero-armed .hero.hero-in .a1{transition-delay:.06s}
html.hero-armed .hero.hero-in .a2{transition-delay:.16s}
html.hero-armed .hero.hero-in .a3{transition-delay:.30s}
html.hero-armed .hero.hero-in .a4{transition-delay:.44s}
html.hero-armed .hero.hero-in .a5{transition-delay:.58s}
@media(prefers-reduced-motion:reduce){html.hero-armed .hero .anim{opacity:1;transform:none;transition:none}}

/* ---------- DIVISIONS — nudge the Enter arrow on hover ---------- */
.lot-state.load{transition:transform .3s cubic-bezier(.2,.7,.2,1),color .25s,border-color .25s}
.lot-row:hover .lot-state.load{transform:translateX(5px);border-color:var(--reject)}

/* ---------- SCROLL REVEALS (progressive — only active when .js-anim is set) ---------- */
.reveal-lines .rl{display:block}   /* keeps the line breaks even with JS off */
html.js-anim [data-reveal]{opacity:0;transform:translateY(22px);transition:opacity .7s cubic-bezier(.2,.7,.2,1),transform .7s cubic-bezier(.2,.7,.2,1)}
html.js-anim [data-reveal].in{opacity:1;transform:none}
html.js-anim .reveal-lines .rl{opacity:0;transform:translateY(26px);transition:opacity .72s cubic-bezier(.2,.7,.2,1),transform .72s cubic-bezier(.2,.7,.2,1)}
html.js-anim .reveal-lines.in .rl{opacity:1;transform:none}
html.js-anim .reveal-lines.in .rl:nth-child(2){transition-delay:.09s}
html.js-anim .reveal-lines.in .rl:nth-child(3){transition-delay:.18s}
@media(prefers-reduced-motion:reduce){
  html.js-anim [data-reveal],
  html.js-anim .reveal-lines .rl{opacity:1;transform:none;transition:none}
}

/* ---------- TALENT ROSTER ---------- */
.roster{display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:clamp(20px,2.4vw,34px);max-width:var(--max);margin-inline:auto}
.tcard{display:flex;flex-direction:column}
.tcard-media{position:relative;aspect-ratio:4/5;background:#f4efe4;border:1px solid var(--line2);display:flex;align-items:center;justify-content:center;overflow:hidden;margin-bottom:16px;transition:border-color .4s}
.tcard:hover .tcard-media{border-color:var(--line)}
.tcard-media img{width:100%;height:100%;object-fit:cover;display:block}
.tc-no{position:absolute;top:12px;left:13px;font-family:var(--mono);font-size:10px;letter-spacing:.2em;color:var(--muted)}
.tc-tag{position:absolute;top:11px;right:12px;font-family:var(--mono);text-transform:uppercase;font-size:9px;letter-spacing:.16em;color:var(--muted);border:1px solid var(--line);padding:3px 7px}
.tc-tag.new{color:var(--reject);border-color:var(--reject)}
.tc-mono{font-weight:700;font-size:clamp(32px,3.4vw,46px);letter-spacing:.05em;color:var(--fg);opacity:.85}
.tc-lab{position:absolute;bottom:12px;left:0;right:0;text-align:center;font-family:var(--mono);text-transform:uppercase;font-size:10px;letter-spacing:.22em;color:var(--muted)}
.tcard-body{display:flex;flex-direction:column;flex:1}
.tcard-top{display:flex;justify-content:space-between;align-items:baseline;gap:10px;border-bottom:1px solid var(--line);padding-bottom:10px;margin-bottom:12px}
.tcard-top h3{font-weight:700;font-size:clamp(17px,1.9vw,21px);letter-spacing:-.01em;color:var(--fg)}
.tcard-cat{font-family:var(--mono);text-transform:uppercase;font-size:9.5px;letter-spacing:.13em;color:var(--muted);text-align:right;white-space:nowrap}
.tspec{display:flex;flex-direction:column;margin-bottom:16px}
.tspec div{display:flex;justify-content:space-between;gap:12px;font-family:var(--mono);font-size:12px;letter-spacing:.03em;color:var(--muted);padding:7px 0;border-bottom:1px dotted var(--line)}
.tspec div b{color:var(--fg);font-weight:400}
.tbook{margin-top:auto;display:block;text-align:center;border:1px solid var(--line);font-family:var(--mono);text-transform:uppercase;letter-spacing:.2em;font-size:11px;color:var(--fg);padding:13px;transition:background .25s,color .25s,border-color .25s}
.tbook:hover{background:var(--fg);color:var(--bg);border-color:var(--fg)}
/* card → profile link affordance */
.tc-lab{transition:opacity .3s}
.tc-view{position:absolute;bottom:12px;left:0;right:0;text-align:center;font-family:var(--mono);text-transform:uppercase;letter-spacing:.2em;font-size:10px;color:var(--reject);opacity:0;transition:opacity .3s}
.tcard:hover .tc-lab{opacity:0}
.tcard:hover .tc-view{opacity:1}
a.tcard-top h3{transition:color .25s}
a.tcard-top:hover h3{color:var(--reject)}
@media(hover:none){.tc-lab{opacity:0}.tc-view{opacity:1}}
/* talent profile portrait (reuses PDP .tagbig / .prod layout) */
.tb-mono{font-weight:700;font-size:clamp(64px,13vw,132px);letter-spacing:.04em;color:var(--fg);opacity:.9;line-height:1}
.tb-tag{position:absolute;bottom:clamp(20px,3vw,30px);left:0;right:0;text-align:center;font-family:var(--mono);text-transform:uppercase;letter-spacing:.24em;font-size:11px;color:var(--muted)}
@media(max-width:520px){.roster{grid-template-columns:repeat(2,1fr);gap:16px}.tc-lab{font-size:9px;letter-spacing:.16em}.tcard-cat{font-size:9px}}

/* ---------- WORK / IMAGE PLACEHOLDERS ---------- */
.work{display:flex;flex-direction:column}
.work-media{position:relative;background:#f4efe4;border:1px solid var(--line2);aspect-ratio:4/5;display:flex;align-items:center;justify-content:center;overflow:hidden}
.work-media img{width:100%;height:100%;object-fit:cover;display:block}
.work-media .ph-no{position:absolute;top:14px;left:16px;font-family:var(--mono);letter-spacing:.2em;font-size:11px;color:var(--muted)}
.work-media .ph-lab{font-family:var(--mono);text-transform:uppercase;letter-spacing:.24em;font-size:11px;color:var(--muted);border:1px solid var(--line);padding:9px 15px}
.work-cap{display:flex;justify-content:space-between;gap:16px;font-family:var(--mono);text-transform:uppercase;letter-spacing:.14em;font-size:12px;color:var(--muted);margin-top:14px;border-top:1px solid var(--line);padding-top:12px}
.work-cap b{color:var(--fg);font-weight:400}

/* ---------- FAQ ---------- */
.faq{max-width:820px;margin-inline:auto;border-top:1px solid var(--line)}
.faq details{border-bottom:1px solid var(--line)}
.faq summary{list-style:none;cursor:pointer;padding:24px 0;display:flex;justify-content:space-between;align-items:center;gap:20px;font-weight:700;font-size:clamp(16px,2.2vw,21px);color:var(--fg)}
.faq summary::-webkit-details-marker{display:none}
.faq summary .pm{font-family:var(--mono);color:var(--reject);font-size:20px;transition:transform .25s}
.faq details[open] summary .pm{transform:rotate(45deg)}
.faq .a{padding:0 0 26px;color:var(--muted);line-height:1.7;max-width:60ch;font-size:clamp(14px,1.7vw,16px)}
.faq .a b{color:var(--fg);font-weight:400}

/* ---------- MANIFESTO BLOCKS ---------- */
.mblock{border-top:1px solid var(--line);padding:clamp(28px,4vw,48px) 0;max-width:var(--max);margin-inline:auto}
.mblock:last-child{border-bottom:1px solid var(--line)}
.mblock .n{font-family:var(--mono);text-transform:uppercase;letter-spacing:.2em;font-size:12px;color:var(--reject);margin-bottom:12px}
.mblock h3{font-weight:700;font-size:clamp(22px,3.2vw,34px);letter-spacing:-.01em;line-height:1.05}
.mblock p{color:var(--muted);line-height:1.65;max-width:54ch;font-size:clamp(15px,1.8vw,17px)}
.mblock p b{color:var(--fg);font-weight:400}

/* ---------- REJECT LIST FORM ---------- */
.form-wrap{border:1px solid var(--line);padding:clamp(24px,3vw,36px);background:var(--card)}
.form-wrap .k{font-family:var(--mono);text-transform:uppercase;letter-spacing:.2em;font-size:11px;color:var(--muted);margin-bottom:18px}
.form-wrap .k b{color:var(--reject);font-weight:400}
form.rl{display:flex;flex-direction:column;gap:12px}
form.rl input{background:transparent;border:1px solid var(--line);color:var(--fg);font-family:var(--mono);font-size:14px;letter-spacing:.04em;padding:15px 16px;outline:none;transition:border-color .3s}
form.rl input::placeholder{color:var(--muted);text-transform:uppercase;letter-spacing:.14em;font-size:12px}
form.rl input:focus{border-color:var(--reject)}
form.rl button{background:var(--fg);color:var(--bg);border:0;font-family:var(--mono);text-transform:uppercase;letter-spacing:.2em;font-size:12px;font-weight:700;padding:15px 16px;cursor:pointer;transition:background .25s,color .25s}
form.rl button:hover{background:var(--reject);color:var(--bone)}
form.rl button:disabled{opacity:.5;cursor:default}
.rl-msg{font-family:var(--mono);font-size:12px;letter-spacing:.06em;line-height:1.5;color:var(--muted);min-height:1.2em;text-transform:uppercase;margin-top:4px}
.rl-msg.ok{color:var(--fg)}
.rl-msg.ok b{color:var(--reject)}
.rl-msg.err{color:var(--reject)}

/* ---------- COUNTDOWN ---------- */
.count{display:flex;gap:clamp(14px,3vw,30px)}
.count b{display:block;font-weight:700;font-size:clamp(34px,6vw,64px);line-height:1;font-variant-numeric:tabular-nums;color:var(--fg)}
.count small{font-family:var(--mono);text-transform:uppercase;letter-spacing:.2em;font-size:10px;color:var(--muted)}

/* ---------- STATEMENT / AIR / SPLIT ---------- */
.statement{padding:clamp(90px,20vh,240px) var(--pad);text-align:center;border-top:1px solid var(--line)}
.statement .eyebrow{font-family:var(--mono);text-transform:uppercase;letter-spacing:.3em;font-size:11px;margin-bottom:clamp(30px,6vw,64px);color:var(--reject)}
.statement h2{font-weight:700;letter-spacing:-.015em;line-height:.92;font-size:clamp(44px,11vw,150px)}
.statement h2 em{color:var(--reject);font-style:normal}
.statement .sub{max-width:30ch;margin:clamp(30px,5vw,50px) auto 0;font-size:clamp(15px,1.9vw,19px);line-height:1.6;color:var(--muted)}
.statement .sub a{white-space:nowrap}   /* the link wraps as one unit — never orphan "it →" */
.air{padding-block:clamp(70px,14vw,180px)}
.giant{font-weight:700;letter-spacing:-.01em;line-height:.9;font-size:clamp(56px,15vw,220px)}
.split{display:grid;grid-template-columns:1fr 1fr;gap:clamp(30px,6vw,90px);max-width:var(--max);margin-inline:auto;align-items:center}
@media(max-width:820px){.split{grid-template-columns:1fr;gap:34px}}

/* ---------- FOOTER (always dark — anchors the light page) ---------- */
.foot{border-top:1px solid var(--reject);padding:clamp(40px,6vw,70px) var(--pad) clamp(26px,4vw,40px)}
.foot-top{max-width:var(--max);margin:0 auto clamp(34px,5vw,54px);display:flex;justify-content:space-between;gap:30px;flex-wrap:wrap}
.foot-big{font-weight:700;letter-spacing:.02em;font-size:clamp(30px,6vw,68px);line-height:.92;color:var(--fg)}
.foot-big em{color:var(--reject);font-style:normal}
.foot-nav{display:flex;gap:50px;flex-wrap:wrap}
.foot-col{display:flex;flex-direction:column;gap:11px}
.foot-col .h{font-family:var(--mono);text-transform:uppercase;letter-spacing:.2em;font-size:10px;color:var(--reject);margin-bottom:5px}
.foot-col a{font-family:var(--mono);text-transform:uppercase;letter-spacing:.12em;font-size:12px;color:var(--muted);transition:color .25s}
.foot-col a:hover{color:var(--fg)}
.foot-fine{max-width:var(--max);margin-inline:auto;border-top:1px solid var(--line);padding-top:22px;display:flex;justify-content:space-between;flex-wrap:wrap;gap:8px}
.foot-sign{max-width:var(--max);margin-inline:auto;border-top:1px solid var(--line);padding-top:clamp(20px,3vw,30px);display:flex;justify-content:space-between;align-items:center;gap:14px 32px;flex-wrap:wrap}
.foot-sign .fs-name{font-family:var(--mono);text-transform:uppercase;letter-spacing:.28em;font-size:12px;color:var(--fg)}
.foot-sign .fs-line{font-family:var(--mono);text-transform:uppercase;letter-spacing:.2em;font-size:10px;color:var(--muted)}
@media(max-width:640px){.foot-sign{justify-content:center;text-align:center;gap:10px}}

/* ---------- MODAL (QC HANGTAG) — always dark ---------- */
.modal{position:fixed;inset:0;background:rgba(10,9,8,.82);backdrop-filter:blur(6px);display:none;align-items:center;justify-content:center;padding:24px;z-index:60}
.modal.open{display:flex;animation:fade .25s ease}
@keyframes fade{from{opacity:0}to{opacity:1}}
.tagcard{position:relative;width:min(360px,92vw);background:var(--ink);color:var(--bone);border:1px solid rgba(232,226,213,.16);padding:clamp(30px,5vw,44px) clamp(26px,4vw,36px);text-align:center;animation:rise .3s cubic-bezier(.2,.7,.2,1)}
@keyframes rise{from{transform:translateY(14px);opacity:0}to{transform:translateY(0);opacity:1}}
.tagcard .dot{width:34px;height:34px;border:3px solid var(--bone);border-radius:50%;margin:0 auto 26px;position:relative}
.tagcard .dot::after{content:"";position:absolute;inset:8px;background:var(--bone);border-radius:50%}
.tagcard .qch{font-family:var(--mono);text-transform:uppercase;letter-spacing:.26em;font-size:11px;color:var(--ash);margin-bottom:34px}
.tagcard .rej{color:var(--reject);font-weight:700;font-size:clamp(38px,9vw,52px);letter-spacing:.02em;line-height:1;margin-bottom:36px}
.tagcard .rows{border-top:1px solid rgba(232,226,213,.16);border-bottom:1px solid rgba(232,226,213,.16);padding:22px 0;margin-bottom:30px;display:flex;flex-direction:column;gap:14px;text-align:left}
.tagcard .rows div{display:flex;justify-content:space-between;font-family:var(--mono);font-size:13px;letter-spacing:.06em;color:var(--ash)}
.tagcard .rows div b{color:var(--bone);font-weight:400}
.tagcard .sw{font-weight:700;font-size:22px;letter-spacing:.02em}
.tagcard .sw small{display:block;color:var(--ash);font-family:var(--mono);text-transform:uppercase;letter-spacing:.3em;font-size:10px;margin-top:8px}
.tagcard .fop{font-family:var(--mono);text-transform:uppercase;letter-spacing:.24em;font-size:10px;color:var(--ash);margin-top:22px}
.tagcard .miss{color:var(--reject)}
.modal .close{position:absolute;top:18px;right:20px;background:none;border:0;color:var(--bone);font-size:26px;line-height:1;cursor:pointer;font-family:var(--disp);opacity:.7}
.modal .close:hover{opacity:1}

/* ===========================================================
   MOBILE / TOUCH — the phone is the primary screen
   =========================================================== */
a,button,summary{-webkit-tap-highlight-color:rgba(201,72,47,.14)}
.frame{grid-template-columns:minmax(0,1fr)}   /* stop the big lockup widening the rows */
/* no hover on a finger — show the affordance permanently */
@media(hover:none){
  .card .view{color:var(--reject)}
  .card:hover{transform:none}
  .card:hover .card-media img{transform:none}
  .lot-row:hover{background:transparent}
}
@media(max-width:760px){
  /* HERO — wordmark runs near edge-to-edge instead of being clipped */
  .hero{padding:12px}
  .frame{padding:16px 6px 18px;gap:16px}
  .lockup .s{font-size:16.2vw}
  .lockup .w{font-size:4.2vw;letter-spacing:.28em}
  .frame .row .mono{font-size:10px;letter-spacing:.14em}
  .hlink,.scroll{font-size:11px}
  .hlink{padding-bottom:5px}
  /* 16px input = iOS won't zoom the page on focus */
  form.rl input{font-size:16px;padding:16px}
  form.rl input::placeholder{font-size:12px}
  form.rl button{padding:17px 16px}
  /* touch targets */
  .btn,.btn-ghost{width:100%;padding:18px 22px;text-align:center}
  .pdp-acc summary{padding:22px 0}
  .faq summary{padding:22px 0}
  /* FOOTER — thumb-sized link rows */
  .foot-nav{gap:26px 34px;width:100%}
  .foot-col{min-width:118px;gap:0}
  .foot-col a{padding:9px 0}
  .foot-col .h{margin-bottom:2px}
  .breadcrumb{padding-top:22px}
  .breadcrumb a{display:inline-block;padding:6px 0}
  .foot-fine,.foot-sign{gap:10px}
}
@media(max-width:520px){
  /* CPH · Worldwide is already said up top — drop it, keep SCROLL optically centred */
  .hero .row:last-child{display:grid;grid-template-columns:1fr auto 1fr;align-items:end}
  .hero .row:last-child .mono{display:none}
  .hero .row:last-child .scroll{grid-column:2}
  .lot-state{padding:8px 12px;font-size:11px}
  .sizes,.fitbar,.fit-scale{max-width:none}
  .swatch{width:40px;height:40px}
  .statement{padding-block:clamp(70px,14vh,150px)}
  /* long email addresses must not push the page sideways on small phones */
  .mblock h3{font-size:clamp(19px,5.6vw,26px);overflow-wrap:anywhere}
  .ticker span{font-size:12px;letter-spacing:.22em}
  .ticker-track{gap:32px}
}
