/* ==========================================================================
   Chic by Achille Lovle — stylesheet
   One light palette built around the emblem: warm white page, cream plates,
   black engraving, antique-gold ornaments. Cinzel for the inscriptional caps
   (as on the emblem), Cormorant for editorial headlines, Jost for UI.
   ========================================================================== */

:root{
  --paper:#f8f5ef; --paper-2:#fffdf9; --paper-3:#f0e9db;
  --plate:#141112; --plate-2:#2a2426; --plate-ink:#f3ede1;
  --ink:#141112; --ink-2:#6e655e; --ink-3:#a39a91;
  --line:rgba(20,17,18,.14); --line-2:rgba(20,17,18,.3);
  --accent:#6e655e; --live:#b3122e;
  --font-display:"Cormorant Garamond",Georgia,"Times New Roman",serif;
  --font-caps:"Cinzel","Cormorant Garamond",Georgia,serif;
  --font-body:"Jost","Segoe UI",system-ui,-apple-system,sans-serif;
  --ease:cubic-bezier(.2,.7,.2,1);
  --max:1440px;
  --pad:clamp(18px,4vw,56px);
  --pad2:clamp(18px,3vw,32px);
  --grain:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='3' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 .55 0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
}

*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth;color-scheme:light}
:focus-visible{outline:2px solid var(--ink);outline-offset:3px;border-radius:2px}
.skip{position:absolute;left:16px;top:-60px;z-index:200;background:var(--ink);color:var(--paper);padding:12px 18px;font-family:var(--font-caps);font-size:.62rem;letter-spacing:.24em;text-transform:uppercase;transition:top .2s}
.skip:focus-visible{top:16px}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
a,button,summary,select,label{touch-action:manipulation}
h1,h2,h3{text-wrap:balance}
.btn:active,.round:active,.seal:active,.tab:active,.size:active,.close:active,.pd__thumb:active{transform:translateY(1px)}

body{margin:0;font-family:var(--font-body);font-weight:300;color:var(--ink);background:var(--paper);line-height:1.6;letter-spacing:.01em}
body::after{content:"";position:fixed;inset:0;pointer-events:none;background-image:var(--grain);opacity:.045;mix-blend-mode:multiply;z-index:2}
body.is-intro{overflow:hidden}
img,video{max-width:100%;display:block}
button{font:inherit;color:inherit;background:none;border:0;cursor:pointer;padding:0;-webkit-tap-highlight-color:transparent}
a{color:inherit;text-decoration:none}
h1,h2,h3,h4{font-family:var(--font-display);font-weight:400;line-height:1.05;margin:0}
p{margin:0 0 1em}
section{scroll-margin-top:72px}
::selection{background:var(--ink);color:var(--paper)}
.sprite{position:absolute;width:0;height:0;overflow:hidden}
.wrap{max-width:var(--max);margin-inline:auto;padding-inline:var(--pad)}
.section{padding-block:clamp(64px,10vw,140px)}
.section__title{font-size:clamp(40px,6vw,84px);font-weight:300;letter-spacing:-.012em;line-height:1}
.section__title em{font-style:italic;font-weight:300}
.section__lead{color:var(--ink-2);max-width:46ch;margin-top:1em;font-size:1.02rem}
.eyebrow{font-family:var(--font-caps);font-size:.62rem;letter-spacing:.32em;text-transform:uppercase;color:var(--ink-2);margin:0 0 1em;display:flex;align-items:center;gap:10px}
.orn-i{width:13px;height:13px;fill:var(--accent);flex:none}
.round{width:50px;height:50px;border:1px solid var(--line-2);border-radius:50%;display:grid;place-items:center;font-size:1.05rem;color:var(--ink);transition:background .4s,color .4s,border-color .4s}
.round:hover{background:var(--ink);color:var(--paper);border-color:var(--ink)}

/* logo images: hidden until media/logo.png exists (JS adds html.has-logo) */
.logo-img{display:none}
html.has-logo .logo-img{display:block}

/* ---------- reveal on scroll ---------- */
.reveal{opacity:0;transform:translateY(18px);transition:opacity .7s var(--ease),transform .7s var(--ease)}
.reveal.is-in{opacity:1;transform:none}

/* ---------- plates: the placeholder behind every piece until a photo is uploaded (colour from Admin > Design) ---------- */
.plate{position:relative;overflow:hidden;background:var(--plate);color:var(--plate-ink);display:grid;place-items:center}
.plate::before{content:"";position:absolute;inset:0;background:radial-gradient(ellipse at 50% 40%,color-mix(in srgb,var(--plate-ink) 9%,transparent) 0%,transparent 62%);pointer-events:none}
.plate::after{content:"";position:absolute;inset:0;background-image:var(--grain);opacity:.16;mix-blend-mode:overlay;pointer-events:none}
.plate__mark{position:relative;z-index:1;display:grid;place-items:center;gap:6px;color:var(--plate-ink);opacity:.62;transition:transform 1.4s var(--ease),opacity .6s;text-align:center;width:100%}
.plate__mark img{position:static;width:36%;height:auto;max-width:150px;aspect-ratio:1;border-radius:50%;object-fit:cover;object-position:center 58%;background:var(--plate-ink);border:1px solid color-mix(in srgb,var(--plate-ink) 40%,transparent);box-shadow:0 0 0 6px color-mix(in srgb,var(--plate-ink) 10%,transparent);opacity:.92}
.plate__mark i{font-family:var(--font-display);font-style:italic;font-size:clamp(18px,2.6vw,30px);letter-spacing:.04em;line-height:1}
html.has-logo .plate__mark i{display:none}
.plate--zoom .plate__mark{transform:scale(1.35)}
.plate--wide .plate__mark{opacity:.4}
.plate-frame{
  position:relative;background:var(--plate);border:1px solid var(--line-2);display:grid;place-items:center;overflow:hidden;
  box-shadow:0 50px 90px -40px rgba(20,17,18,.35);
}
.plate-frame::before{content:"";position:absolute;inset:9px;border:1px solid color-mix(in srgb,var(--plate-ink) 22%,transparent);pointer-events:none;z-index:1}
.plate-frame::after{content:"";position:absolute;inset:0;background:radial-gradient(ellipse at 50% 35%,color-mix(in srgb,var(--plate-ink) 10%,transparent) 0%,transparent 60%),var(--grain);opacity:.5;pointer-events:none}
.plate-frame .plate__mark{width:100%;height:100%;align-content:center}
.plate-frame .plate__mark img{width:min(46%,220px);max-width:none}
.plate-frame .plate__mark i{font-size:clamp(34px,5vw,60px)}
.grain{position:absolute;inset:0;pointer-events:none;background-image:var(--grain);opacity:.1;mix-blend-mode:multiply}
.is-off{display:none!important}

/* ---------- intro ---------- */
.intro{position:fixed;inset:0;z-index:100;background:var(--paper);color:var(--ink);display:grid;place-items:center;overflow:hidden;transition:opacity .9s var(--ease),visibility .9s}
.intro.is-leaving{opacity:0;visibility:hidden}
.intro[hidden]{display:none}
.intro.has-video{background:#000}
.intro__bar{position:absolute;left:0;right:0;height:7vh;background:var(--ink);z-index:4;transition:transform .9s var(--ease)}
.intro__bar--top{top:0}
.intro__bar--bottom{bottom:0}
.intro.is-leaving .intro__bar--top{transform:translateY(-100%)}
.intro.is-leaving .intro__bar--bottom{transform:translateY(100%)}
.intro__video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:0;transition:opacity .8s;z-index:1}
.intro.has-video .intro__video{opacity:1}
.intro.has-video .intro__type{opacity:0}
.intro__type{position:relative;text-align:center;z-index:2;padding:0 24px;transition:opacity .6s}
.intro__seal{position:relative;width:min(58vw,300px);aspect-ratio:1;margin:0 auto 22px;display:grid;place-items:center}
.intro__ring{position:absolute;inset:0;width:100%;height:100%;color:var(--ink)}
.intro__ring circle{stroke-dasharray:920;stroke-dashoffset:920;animation:draw 2.2s var(--ease) forwards}
.intro__ring .intro__ring2{stroke-dasharray:870;stroke-dashoffset:-870;animation-delay:.25s}
.intro__logo{width:82%;height:82%;object-fit:cover;object-position:center 58%;border-radius:50%;background:var(--paper-3);opacity:0;transform:scale(.94);animation:emblem 1.6s .4s var(--ease) forwards}
html.has-logo .intro__word{display:none}
.intro__word{font-family:var(--font-caps);font-size:clamp(44px,9vw,72px);letter-spacing:.34em;text-transform:uppercase;padding-left:.34em;opacity:0;animation:fade 1.4s .5s var(--ease) forwards}
.intro__by{font-family:var(--font-display);font-style:italic;font-size:clamp(22px,3.2vw,34px);margin:0;letter-spacing:.06em;opacity:0;animation:fade 1.2s 1s var(--ease) forwards}
.intro__line{font-family:var(--font-caps);font-size:.6rem;letter-spacing:.34em;text-transform:uppercase;color:var(--ink-2);margin-top:1.8em;opacity:0;animation:fade 1.2s 1.6s forwards}
.intro__actions{position:absolute;bottom:max(9vh,env(safe-area-inset-bottom));left:0;right:0;display:flex;flex-direction:column;align-items:center;gap:12px;z-index:5}
.intro__enter{opacity:0;transform:translateY(10px);transition:opacity .8s,transform .8s var(--ease),background .4s,color .4s;border:1px solid var(--ink);padding:14px 30px;font-family:var(--font-caps);letter-spacing:.28em;text-transform:uppercase;font-size:.66rem;background:var(--paper)}
.intro__enter:hover{background:var(--ink);color:var(--paper)}
.intro.show-enter .intro__enter{opacity:1;transform:none}
.intro__skip{opacity:0;font-size:.64rem;letter-spacing:.24em;text-transform:uppercase;color:var(--ink-2);transition:opacity .6s;padding:8px}
.intro.has-video .intro__skip,.intro.has-video .intro__enter{color:#ece3d3;border-color:rgba(236,227,211,.6);background:rgba(0,0,0,.25)}
.intro.show-skip .intro__skip{opacity:1}
.intro .grain{opacity:.12;z-index:2}
@keyframes draw{to{stroke-dashoffset:0}}
@keyframes fade{to{opacity:1}}
@keyframes emblem{to{opacity:1;transform:none}}
@keyframes spin{to{transform:rotate(360deg)}}

/* ---------- header ---------- */
.site-head{position:fixed;top:0;left:0;right:0;z-index:50;display:grid;grid-template-columns:1fr auto 1fr;align-items:center;padding:16px var(--pad);gap:16px;color:var(--ink);transition:background .5s,padding .4s}
.site-head.is-scrolled{background:color-mix(in srgb,var(--paper) 88%,transparent);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);padding-block:9px;border-bottom:1px solid var(--line)}
.site-head__nav{display:none;gap:30px}
.site-head__nav a{font-family:var(--font-caps);font-size:.62rem;letter-spacing:.28em;text-transform:uppercase;position:relative;padding:6px 0}
.site-head__nav a::after{content:"";position:absolute;left:0;bottom:0;height:1px;width:100%;background:var(--ink);transform:scaleX(0);transform-origin:right;transition:transform .5s var(--ease)}
.site-head__nav a:hover::after{transform:scaleX(1);transform-origin:left}
.wordmark{grid-column:2;display:flex;align-items:center;gap:12px;line-height:1}
.wordmark__emblem{height:44px;width:44px;border-radius:50%;object-fit:cover;object-position:center 58%;background:var(--paper-3);border:1px solid var(--line-2);transition:height .4s,width .4s}
.site-head.is-scrolled .wordmark__emblem{height:36px;width:36px}
.wordmark__text{display:flex;flex-direction:column;align-items:center}
.wordmark__chic{font-family:var(--font-caps);font-size:clamp(20px,2.2vw,26px);letter-spacing:.36em;text-transform:uppercase;padding-left:.36em;font-weight:400}
.wordmark__by{font-family:var(--font-display);font-style:italic;font-size:.9rem;letter-spacing:.06em;color:var(--ink-2);margin-top:3px}
.site-head__tools{grid-column:3;justify-self:end;display:flex;align-items:center;gap:22px}
.site-head__live{display:none;align-items:center;gap:8px;font-family:var(--font-caps);font-size:.6rem;letter-spacing:.26em;text-transform:uppercase;color:var(--ink-2)}
.site-head__live .dot{width:6px;height:6px;border-radius:50%;background:var(--live);opacity:.45}
html.is-live .site-head__live{color:var(--live)}
html.is-live .site-head__live .dot{opacity:1;animation:pulse 1.4s ease-out infinite}
.bag-btn{font-family:var(--font-caps);font-size:.6rem;letter-spacing:.26em;text-transform:uppercase;display:flex;align-items:center;gap:8px}
.bag-btn__count{display:inline-grid;place-items:center;min-width:22px;height:22px;padding:0 6px;border-radius:50%;background:var(--ink);color:var(--paper);font-family:var(--font-body);font-size:.68rem;letter-spacing:0;font-weight:500}
.bag-btn__count.bump{animation:bump .45s var(--ease)}
@keyframes bump{40%{transform:scale(1.4)}}
.menu-btn{width:28px;height:20px;position:relative;display:block}
.menu-btn span,.menu-btn::before,.menu-btn::after{content:"";position:absolute;left:0;right:0;height:1px;background:currentColor;transition:transform .4s var(--ease),opacity .3s}
.menu-btn::before{top:2px}
.menu-btn span{top:50%}
.menu-btn::after{bottom:2px}
.menu-btn[aria-expanded="true"]::before{transform:translateY(8px) rotate(45deg)}
.menu-btn[aria-expanded="true"] span{opacity:0}
.menu-btn[aria-expanded="true"]::after{transform:translateY(-8px) rotate(-45deg)}
@media (min-width:960px){.site-head__nav{display:flex}.site-head__live{display:flex}.menu-btn{display:none}}
.mobile-nav{position:fixed;inset:0;z-index:45;background:var(--paper);color:var(--ink);display:flex;flex-direction:column;justify-content:center;padding:var(--pad);gap:4px;transform:translateY(-100%);transition:transform .7s var(--ease),visibility .7s;visibility:hidden}
.mobile-nav.is-open{transform:none;visibility:visible}
.mobile-nav a{font-family:var(--font-display);font-size:clamp(40px,10vw,64px);line-height:1.1;border-bottom:1px solid var(--line);padding:12px 0;display:flex;align-items:baseline}
.mobile-nav a small{font-family:var(--font-caps);font-size:.6rem;letter-spacing:.2em;color:var(--ink-3);margin-right:16px}
.mobile-nav__foot{margin-top:28px;font-family:var(--font-caps);font-size:.6rem;letter-spacing:.26em;text-transform:uppercase;color:var(--ink-2)}

/* ---------- looks — fashion plates ---------- */
.looks{position:relative;height:100svh;min-height:620px;overflow:hidden;background:var(--paper)}
.looks__slides{position:absolute;inset:0;touch-action:pan-y}
.look{position:absolute;inset:0;opacity:0;transition:opacity 1.1s var(--ease);pointer-events:none}
.look.is-active{opacity:1;pointer-events:auto;z-index:1}
.look__plate{position:absolute;inset:0}
.look .plate-frame{position:absolute;left:50%;top:8vh;height:min(48vh,520px);aspect-ratio:200/300;transform:translateX(-50%) scale(1.04);transition:transform 8s linear}
.look.is-active .plate-frame{transform:translateX(-50%) scale(1)}
@media (max-width:959px){.seal{width:100px;height:100px}.seal__core{width:60px;height:60px;font-size:1.35rem}}
@media (min-width:960px){
  .look .plate-frame{left:auto;right:9vw;top:11vh;height:min(76vh,860px);transform:scale(1.04)}
  .look.is-active .plate-frame{transform:scale(1)}
}
.look__shade{position:absolute;inset:0;background:linear-gradient(180deg,transparent 34%,var(--paper) 74%);pointer-events:none}
@media (min-width:960px){.look__shade{background:linear-gradient(90deg,var(--paper) 0%,color-mix(in srgb,var(--paper) 40%,transparent) 40%,transparent 62%)}}
.look__num{position:absolute;left:calc(var(--pad) - .04em);top:clamp(70px,9vh,110px);font-family:var(--font-display);font-size:clamp(120px,24vw,300px);line-height:.78;font-weight:300;color:transparent;-webkit-text-stroke:1px var(--line-2);letter-spacing:-.05em;user-select:none;pointer-events:none;font-style:italic}
.look__meta{position:absolute;left:var(--pad);right:var(--pad);bottom:clamp(88px,13vh,130px);z-index:2;max-width:680px}
.look__title{font-size:clamp(42px,8vw,116px);font-weight:300;margin:0 0 .18em;letter-spacing:-.02em;line-height:1.02}
.look__title .w{display:inline-block;overflow:hidden;vertical-align:bottom;padding-bottom:.16em;margin-bottom:-.16em}
.look__title .w > *{display:inline-block;transform:translateY(112%);transition:transform 1s var(--ease);transition-delay:calc(var(--d,0) * 90ms)}
.look.is-active .look__title .w > *{transform:none}
.look__title em{font-style:italic}
.look__row{display:flex;align-items:center;gap:26px;flex-wrap:wrap}
.look__price{font-family:var(--font-caps);font-size:.68rem;letter-spacing:.26em;margin:0;color:var(--ink)}
.look__price span{color:var(--ink-3);margin-left:14px}
.look__fabric{font-family:var(--font-display);font-style:italic;font-size:1.1rem;color:var(--ink-2);margin:.5em 0 1.3em}
.seal{position:relative;width:118px;height:118px;display:grid;place-items:center;color:var(--ink);flex:none}
.seal__ring{position:absolute;inset:0;width:100%;height:100%;animation:spin 20s linear infinite;font-family:var(--font-caps);font-size:9px;letter-spacing:.14em;text-transform:uppercase;fill:currentColor}
.seal:hover .seal__ring{animation-duration:7s}
.seal__core{position:relative;width:66px;height:66px;border-radius:50%;border:1px solid var(--ink);display:grid;place-items:center;font-family:var(--font-display);font-style:italic;font-size:1.5rem;background:var(--paper);transition:background .4s,color .4s,transform .5s var(--ease);line-height:1}
.seal__core i{position:absolute;right:8px;bottom:8px;font-style:normal;font-family:var(--font-body);font-size:.7rem;line-height:1}
.seal:hover .seal__core,.seal:focus-visible .seal__core{background:var(--ink);color:var(--paper);transform:scale(1.06)}
.looks__index{position:absolute;right:calc(var(--pad) - 8px);top:50%;transform:translateY(-50%);z-index:3;list-style:none;margin:0;padding:0;display:none;flex-direction:column;gap:6px}
.looks__index button{font-family:var(--font-caps);font-size:.6rem;letter-spacing:.2em;color:var(--ink-3);display:flex;align-items:center;gap:10px;padding:5px 8px;transition:color .4s}
.looks__index button::before{content:"";width:0;height:1px;background:var(--ink);transition:width .5s var(--ease)}
.looks__index button.is-on{color:var(--ink)}
.looks__index button.is-on::before{width:22px}
.looks__index button:hover{color:var(--ink)}
@media (min-width:960px){.looks__index{display:flex}}
@media (max-width:959px){
  .looks__index{display:flex;flex-direction:row;top:auto;bottom:clamp(40px,5vh,58px);left:var(--pad);right:auto;transform:none;gap:8px}
  .looks__index button{font-size:0;width:26px;height:2px;background:var(--line-2);padding:0}
  .looks__index button.is-on{background:var(--ink)}
  .looks__index button::before{display:none}
}
.looks__nav{position:absolute;right:var(--pad);bottom:clamp(26px,5vh,46px);z-index:3;display:flex;gap:10px}
@media (min-width:960px){.looks__nav{right:calc(var(--pad) + 70px)}}

/* ---------- ticker ---------- */
.ticker{border-block:1px solid var(--line);overflow:hidden;padding:15px 0;font-family:var(--font-caps);font-size:.6rem;letter-spacing:.3em;text-transform:uppercase;color:var(--ink-2);background:var(--paper-2)}
.ticker__track{display:flex;align-items:center;width:max-content;animation:ticker 60s linear infinite}
.ticker__track span{padding:0 2.4em;white-space:nowrap}
.ticker__track .orn-i{width:11px;height:11px;fill:var(--accent)}
@keyframes ticker{to{transform:translateX(-50%)}}

/* ---------- collection ---------- */
.collection__head{display:flex;flex-wrap:wrap;align-items:end;justify-content:space-between;gap:24px 40px;margin-bottom:clamp(30px,4vw,56px)}
.tabs{display:flex;flex-wrap:wrap;gap:22px}
@media (max-width:759px){.tabs{flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none;padding-bottom:2px;max-width:100%}.tabs::-webkit-scrollbar{display:none}.tab{white-space:nowrap;flex:none}}
.tab{font-family:var(--font-caps);font-size:.62rem;letter-spacing:.24em;text-transform:uppercase;color:var(--ink-3);padding:6px 0;position:relative;transition:color .3s}
.tab::after{content:"";position:absolute;left:0;right:0;bottom:0;height:1px;background:var(--ink);transform:scaleX(0);transform-origin:left;transition:transform .5s var(--ease)}
.tab.is-on,.tab:hover{color:var(--ink)}
.tab.is-on::after{transform:scaleX(1)}
.grid{display:grid;gap:clamp(26px,3vw,44px) clamp(14px,2vw,28px);grid-template-columns:repeat(2,1fr)}
@media (min-width:760px){.grid{grid-template-columns:repeat(3,1fr)}}
@media (min-width:1180px){.grid{grid-template-columns:repeat(4,1fr)}}
.card{display:flex;flex-direction:column;gap:12px;opacity:0;transform:translateY(16px);animation:cardIn .9s var(--ease) forwards;animation-delay:calc(var(--i,0) * 70ms)}
@keyframes cardIn{to{opacity:1;transform:none}}
.card__media{display:block;width:100%;aspect-ratio:3/4;overflow:hidden;position:relative;text-align:left;background:var(--plate);border:1px solid var(--line)}
.card__media .plate{position:absolute;inset:0;transition:opacity .7s var(--ease)}
.card__media .plate--alt{opacity:0}
.card:hover .card__media .plate--alt{opacity:1}
.card:hover .card__media .plate--main{opacity:0}
.card__video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:0;transition:opacity .5s;z-index:1;pointer-events:none}
.card__video.is-playing{opacity:1}
.card__tag{position:absolute;right:12px;top:12px;z-index:2;font-family:var(--font-caps);font-size:.52rem;letter-spacing:.24em;text-transform:uppercase;background:var(--ink);color:var(--paper);padding:6px 9px}
.card__chic{position:absolute;right:12px;bottom:12px;z-index:2;font-family:var(--font-display);font-style:italic;font-size:1.1rem;color:var(--ink);border:1px solid var(--ink);padding:6px 14px;background:color-mix(in srgb,var(--paper) 78%,transparent);opacity:0;transform:translateY(6px);transition:opacity .4s,transform .4s var(--ease)}
.card:hover .card__chic,.card:focus-within .card__chic{opacity:1;transform:none}
@media (hover:none){.card__chic{opacity:1;transform:none}}
.card__name{font-family:var(--font-display);font-size:1.4rem;line-height:1.15;font-weight:400}
.card__row{display:flex;justify-content:space-between;align-items:baseline;gap:12px;font-family:var(--font-caps);font-size:.58rem;letter-spacing:.2em;text-transform:uppercase;color:var(--ink-3)}
.card__price{color:var(--ink)}
.feature{grid-column:span 2;background:var(--paper-3);border:1px solid var(--line);display:grid;place-items:center;text-align:center;padding:clamp(26px,4vw,52px);position:relative;overflow:hidden;min-height:280px;opacity:0;animation:cardIn .9s var(--ease) .2s forwards}
.coming{grid-column:1/-1;background:var(--paper-3);border:1px solid var(--line);display:grid;place-items:center;text-align:center;padding:clamp(40px,6vw,80px) clamp(22px,4vw,60px);position:relative;overflow:hidden;gap:8px}
.coming::before{content:"";position:absolute;inset:10px;border:1px solid var(--line);pointer-events:none}
.coming::after{content:"";position:absolute;inset:0;background-image:var(--grain);opacity:.12;mix-blend-mode:multiply;pointer-events:none}
.coming .orn-i{width:18px;height:18px;position:relative;z-index:1}
.coming__text{font-family:var(--font-display);font-style:italic;font-size:clamp(22px,2.6vw,36px);line-height:1.25;max-width:26ch;margin:6px 0 18px;position:relative;z-index:1}
.coming .btn{position:relative;z-index:1}
.feature::before{content:"";position:absolute;inset:10px;border:1px solid var(--line);pointer-events:none}
.feature::after{content:"";position:absolute;inset:0;background-image:var(--grain);opacity:.12;mix-blend-mode:multiply;pointer-events:none}
.feature q{font-family:var(--font-display);font-style:italic;font-size:clamp(24px,2.5vw,38px);line-height:1.2;quotes:"\201C" "\201D";display:block;max-width:22ch;position:relative;z-index:1}
.feature .orn-i{width:18px;height:18px;margin-bottom:14px;position:relative;z-index:1}
.feature small{display:block;margin-top:18px;font-family:var(--font-caps);font-size:.56rem;letter-spacing:.3em;text-transform:uppercase;color:var(--ink-2);position:relative;z-index:1}

/* ---------- the edit — magazine spread ---------- */
.edit{padding-block:clamp(64px,10vw,140px);background:var(--paper-3);border-block:1px solid var(--line);overflow:hidden;position:relative}
.edit::after{content:"";position:absolute;inset:0;background-image:var(--grain);opacity:.08;mix-blend-mode:multiply;pointer-events:none}
.edit__grid{display:grid;gap:clamp(36px,5vw,90px);grid-template-columns:1fr;align-items:center;position:relative;z-index:1}
@media (min-width:960px){.edit__grid{grid-template-columns:1fr 1.15fr}}
.edit__quote{font-size:clamp(40px,5.2vw,78px);font-weight:300;line-height:1;letter-spacing:-.015em;margin:0 0 .5em}
.edit__quote em{font-style:italic}
.edit__text p:not(.eyebrow){color:var(--ink-2);max-width:44ch}
.edit__text .btn{margin-top:10px}
.edit__collage{position:relative;height:clamp(360px,44vw,600px)}
.edit__plate{position:absolute;width:44%;aspect-ratio:3/4;background:var(--paper-2);border:1px solid var(--line-2);box-shadow:0 34px 60px -30px rgba(20,17,18,.4);transform:rotate(var(--r));transition:transform .7s var(--ease),box-shadow .7s;display:block;overflow:hidden}
.edit__plate:nth-child(1){left:0;top:12%}
.edit__plate:nth-child(2){left:28%;top:0;z-index:2}
.edit__plate:nth-child(3){left:56%;top:18%}
.edit__plate:hover{transform:rotate(0) translateY(-12px) scale(1.04);z-index:5;box-shadow:0 50px 80px -30px rgba(20,17,18,.5)}
.edit__plate .plate{position:absolute;inset:0}

/* ---------- shots — film strip ---------- */
.shots{padding-bottom:clamp(48px,7vw,100px)}
.shots__head{display:flex;flex-wrap:wrap;align-items:end;justify-content:space-between;gap:24px 40px;margin-bottom:clamp(20px,3vw,34px)}
.shots__nav{display:none;gap:10px}
@media (min-width:760px){.shots__nav{display:flex}}
.film{position:relative}
.film__edge{height:6px;margin:0 var(--pad);background:repeating-linear-gradient(90deg,transparent 0 16px,var(--ink) 16px 24px,transparent 24px 40px);opacity:.1}
.shots__strip{display:flex;gap:clamp(10px,1.4vw,18px);overflow-x:auto;scroll-snap-type:x mandatory;padding:14px var(--pad);scroll-padding-inline:var(--pad);scrollbar-width:none;-webkit-overflow-scrolling:touch}
.shots__strip::-webkit-scrollbar{display:none}
.shot{flex:0 0 clamp(210px,24vw,300px);scroll-snap-align:start;text-align:left;display:flex;flex-direction:column;gap:12px}
.shot__media{display:block;aspect-ratio:9/16;position:relative;overflow:hidden;border:1px solid var(--line);background:var(--plate)}
.shot .plate{position:absolute;inset:0}
.shot:hover .plate .plate__mark{transform:scale(1.05)}
.shot__video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:0;transition:opacity .5s;z-index:1}
.shot__video.is-playing{opacity:1}
.shot__play{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);z-index:2;width:56px;height:56px;border-radius:50%;border:1px solid var(--ink);display:grid;place-items:center;font-size:.85rem;padding-left:3px;color:var(--ink);background:color-mix(in srgb,var(--paper) 72%,transparent);transition:background .4s,color .4s}
.shot:hover .shot__play{background:var(--ink);color:var(--paper)}
.shot__cap{display:block}
.shot__cap small{display:block;font-family:var(--font-caps);font-size:.54rem;letter-spacing:.24em;text-transform:uppercase;color:var(--ink-3);margin-bottom:4px}
.shot__cap strong{font-family:var(--font-display);font-weight:400;font-size:1.25rem;line-height:1.15;display:block}
.shot__len{position:absolute;right:12px;top:12px;z-index:2;font-family:var(--font-caps);font-size:.54rem;letter-spacing:.2em;background:var(--ink);color:var(--paper);padding:5px 8px}

/* ---------- live & social ---------- */
.live{background:var(--paper-2);border-block:1px solid var(--line)}
.live__grid{display:grid;gap:clamp(36px,5vw,72px);grid-template-columns:1fr}
@media (min-width:960px){.live__grid{grid-template-columns:1.35fr 1fr;align-items:start}}
.live-badge{display:inline-flex;align-items:center;gap:10px;font-family:var(--font-caps);font-size:.6rem;letter-spacing:.32em;text-transform:uppercase;color:var(--live);opacity:.45;margin:0 0 1em;transition:opacity .4s}
.live-badge::before{content:"";width:8px;height:8px;border-radius:50%;background:currentColor}
.is-live .live-badge{opacity:1}
.is-live .live-badge::before{animation:pulse 1.4s ease-out infinite}
@keyframes pulse{0%{box-shadow:0 0 0 0 color-mix(in srgb,var(--live) 55%,transparent)}100%{box-shadow:0 0 0 12px transparent}}
.yt{position:relative;aspect-ratio:16/9;overflow:hidden;background:var(--plate);margin-top:24px;border:1px solid var(--line-2)}
.yt .plate{position:absolute;inset:0}
.yt__poster{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;filter:saturate(.85)}
.yt__center{position:absolute;inset:0;display:grid;place-items:center;text-align:center;color:var(--ink);z-index:2;padding:20px;width:100%}
.yt__play{width:72px;height:72px;border-radius:50%;border:1px solid var(--ink);display:grid;place-items:center;margin:0 auto 16px;font-size:1rem;padding-left:4px;transition:background .4s,color .4s;background:color-mix(in srgb,var(--paper) 70%,transparent)}
.yt__center:hover .yt__play{background:var(--ink);color:var(--paper)}
.yt__center p{margin:0;font-family:var(--font-caps);font-size:.58rem;letter-spacing:.26em;text-transform:uppercase;max-width:38ch;line-height:1.9;color:var(--ink);background:color-mix(in srgb,var(--paper) 90%,transparent);padding:10px 16px}
.is-live .yt::after{content:"LIVE";position:absolute;left:14px;top:14px;z-index:3;background:var(--live);color:#fff;font-family:var(--font-caps);font-size:.56rem;letter-spacing:.3em;padding:6px 10px 6px 12px}
.yt iframe{position:absolute;inset:0;width:100%;height:100%;border:0}
.yt-list{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:clamp(6px,1vw,12px);margin-top:clamp(8px,1vw,12px)}
.yt-list[hidden]{display:none}
.yt-list__item{display:grid;gap:8px;text-align:left;min-width:0}
.yt-list__thumb{position:relative;aspect-ratio:16/9;overflow:hidden;background:var(--plate);border:1px solid var(--line);transition:border-color .3s}
.yt-list__thumb img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;filter:saturate(.8);transition:transform .8s var(--ease),filter .4s}
.yt-list__item:hover .yt-list__thumb img{transform:scale(1.05);filter:none}
.yt-list__play{position:absolute;left:7px;bottom:7px;width:22px;height:22px;border-radius:50%;display:grid;place-items:center;font-size:.45rem;padding-left:2px;background:color-mix(in srgb,var(--paper) 88%,transparent);color:var(--ink)}
.yt-list__item.is-on .yt-list__thumb{border-color:var(--ink);box-shadow:0 0 0 1px var(--ink)}
.yt-list__date{font-family:var(--font-caps);font-size:.52rem;letter-spacing:.22em;text-transform:uppercase;color:var(--ink-3);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.yt-list__item.is-on .yt-list__date{color:var(--ink)}
.live__next{margin-top:16px;font-size:.9rem;color:var(--ink-2);max-width:56ch}
.ig__head{display:flex;justify-content:space-between;align-items:center;gap:16px;margin-bottom:16px}
.ig__handle{font-family:var(--font-display);font-size:1.6rem;margin:0}
.ig__grid{display:grid;grid-template-columns:repeat(3,1fr);gap:6px}
.ig__tile{aspect-ratio:1;position:relative;overflow:hidden;display:block;border:1px solid var(--line)}
.ig__tile .plate{position:absolute;inset:0}
.ig__tile .plate .plate__mark img{width:44%}
.ig__tile:hover .plate .plate__mark{transform:scale(1.06)}
.ig-col .ig__live{display:none;margin:4px 0 18px}
.ig-col--empty .ig__head,.ig-col--empty .live__next{display:none}
.ig-col--empty .ig__grid{display:block}
.ig-card{position:relative;isolation:isolate;overflow:hidden;display:grid;place-content:center;justify-items:center;gap:14px;text-align:center;aspect-ratio:4/5;padding:clamp(30px,4vw,56px);background:var(--plate);color:var(--plate-ink)}
.ig-card::before{content:"";position:absolute;inset:10px;border:1px solid color-mix(in srgb,var(--plate-ink) 22%,transparent);pointer-events:none}
.ig-card::after{content:"";position:absolute;inset:0;z-index:-1;background:radial-gradient(ellipse at 50% 38%,color-mix(in srgb,var(--plate-ink) 11%,transparent) 0%,transparent 62%),var(--grain);opacity:.55;pointer-events:none}
.ig-card__glyph{width:34px;height:34px;fill:none;stroke:currentColor;stroke-width:1.1;opacity:.85;margin-bottom:6px}
.ig-card__glyph .f{fill:currentColor;stroke:none}
.ig-card__handle{font-family:var(--font-display);font-style:italic;font-weight:300;font-size:clamp(32px,3.2vw,48px);line-height:1.05;overflow-wrap:anywhere}
.ig-card__text{max-width:25ch;font-size:.98rem;line-height:1.6;color:color-mix(in srgb,var(--plate-ink) 72%,var(--plate))}
.ig-card__btn{margin-top:12px;border:1px solid color-mix(in srgb,var(--plate-ink) 55%,transparent);padding:14px 30px;font-family:var(--font-caps);font-size:.6rem;letter-spacing:.3em;text-transform:uppercase;transition:background .4s,color .4s,border-color .4s}
.ig-card:hover .ig-card__btn,.ig-card:focus-visible .ig-card__btn{background:var(--plate-ink);border-color:var(--plate-ink);color:var(--plate)}
@media (max-width:959px){.ig-card{aspect-ratio:auto;min-height:360px}}
.is-ig-live .ig-col .ig__live{display:inline-flex}
.ig__live .dot{width:8px;height:8px;border-radius:50%;background:currentColor;animation:pulse 1.4s ease-out infinite}

/* ---------- buttons ---------- */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;border:1px solid var(--ink);padding:14px 28px;font-family:var(--font-caps);font-size:.62rem;letter-spacing:.3em;text-transform:uppercase;transition:background .4s,color .4s,border-color .4s;white-space:nowrap}
.btn:hover{background:var(--ink);color:var(--paper)}
.btn--solid{background:var(--ink);color:var(--paper)}
.btn--solid:hover{background:var(--accent);border-color:var(--accent);color:var(--paper-2)}
.btn--ghost{border-color:var(--line-2);color:var(--ink-2)}
.btn--live{border-color:var(--live);color:var(--live)}
.btn--live:hover{background:var(--live);border-color:var(--live);color:#fff}
.btn--wide{width:100%}
.btn--sm{padding:11px 20px}

/* ---------- story ---------- */
.story__grid{display:grid;gap:clamp(36px,5vw,100px);grid-template-columns:1fr}
@media (min-width:900px){.story__grid{grid-template-columns:.9fr 1.1fr;align-items:center}}
.story__sealwrap{overflow:hidden}   /* the turning ring's corners would otherwise widen the page on phones */
.seal-big{position:relative;width:min(100%,460px);aspect-ratio:1;margin-inline:auto}
.seal-big__ring{position:absolute;inset:0;width:100%;height:100%;animation:spin 46s linear infinite;font-family:var(--font-caps);font-size:12.5px;letter-spacing:.3em;text-transform:uppercase;fill:var(--ink-2)}
.seal-big__core{position:absolute;inset:15%;border-radius:50%;overflow:hidden;border:1px solid var(--line-2);box-shadow:0 40px 80px -40px rgba(20,17,18,.4)}
.seal-big__core .story__fallback{position:absolute;inset:0;display:grid;place-items:center;font-size:clamp(40px,6vw,72px)}
.story__logo{position:relative;z-index:1;width:100%;height:100%;object-fit:cover;object-position:center 58%;background:var(--paper-3)}
html.has-logo .story__fallback{display:none}
html.has-logo .seal-big__core::before,html.has-logo .seal-big__core::after{display:none}
.section__title--caps{font-family:var(--font-caps);font-weight:400;letter-spacing:.32em;text-transform:uppercase;padding-left:.32em;font-size:clamp(36px,4.8vw,66px)}
.story__quote{font-family:var(--font-display);font-style:italic;font-size:clamp(28px,3.4vw,46px);line-height:1.15;font-weight:300;margin:.5em 0 .8em;letter-spacing:-.01em}
.story__text p:not(.eyebrow){max-width:54ch;color:var(--ink-2)}
.story__text p strong{color:var(--ink);font-weight:400}
.story__text .btn{margin-top:10px}

/* ---------- newsletter: a dark band in the plate colour (Admin > Design) ---------- */
.news{
  position:relative;isolation:isolate;overflow:hidden;background:var(--plate);
  --ink:var(--plate-ink);--ink-2:color-mix(in srgb,var(--plate-ink) 70%,var(--plate));--ink-3:color-mix(in srgb,var(--plate-ink) 45%,var(--plate));
  --line:color-mix(in srgb,var(--plate-ink) 16%,transparent);--line-2:color-mix(in srgb,var(--plate-ink) 32%,transparent);--paper:var(--plate);
  color:var(--ink)
}
.news::before{content:"";position:absolute;inset:0;z-index:-1;background:radial-gradient(ellipse at 50% 0%,color-mix(in srgb,var(--plate-ink) 10%,transparent) 0%,transparent 60%),var(--grain);opacity:.6;pointer-events:none}
.news::after{content:"";position:absolute;inset:clamp(10px,1.4vw,18px);border:1px solid var(--line);pointer-events:none}
.news__orn{width:20px;height:20px;fill:var(--ink-2);margin-bottom:14px}
.news__inner{display:grid;gap:8px;justify-items:center;text-align:center}
.news__inner .section__lead{margin-top:.4em}
.news__form{display:flex;border-bottom:1px solid var(--ink);width:min(100%,520px);margin-top:26px}
.news__form input{flex:1;min-width:0;background:transparent;border:0;padding:16px 0;color:var(--ink);font:inherit;font-size:1.1rem;letter-spacing:.04em;outline:0;border-radius:0}
.news__form input::placeholder{color:var(--ink-3)}
.news__go{width:56px;font-size:1.4rem;transition:transform .4s var(--ease)}
.news__go:hover{transform:translateX(6px)}

/* ---------- footer ---------- */
.foot{position:relative;overflow:hidden;border-top:1px solid var(--line);padding-block:clamp(40px,6vw,72px) 32px;background:var(--paper-2)}
.foot__giant{font-family:var(--font-caps);font-size:clamp(96px,26vw,400px);line-height:.8;letter-spacing:.16em;text-transform:uppercase;color:transparent;-webkit-text-stroke:1px var(--line-2);text-align:center;user-select:none;padding-left:.16em;margin:0 0 -.1em;pointer-events:none}
.foot__grid{display:grid;gap:32px;grid-template-columns:1fr 1fr;position:relative;padding-top:clamp(20px,4vw,48px)}
@media (min-width:900px){.foot__grid{grid-template-columns:2fr 1fr 1fr}}
.foot h4{font-family:var(--font-caps);font-size:.58rem;letter-spacing:.32em;text-transform:uppercase;color:var(--ink-2);margin-bottom:16px;font-weight:400}
.foot ul{list-style:none;margin:0;padding:0;display:grid;gap:9px;font-size:.95rem}
.foot a{position:relative}
.foot ul a:hover{color:var(--accent)}
.foot__emblem{width:96px;height:96px;margin-bottom:16px;border-radius:50%;object-fit:cover;object-position:center 58%;background:var(--paper-3);border:1px solid var(--line-2)}
.foot__brand .wordmark__chic{font-size:1.6rem}
.foot__brand .wordmark__by{font-size:1rem}
.foot__tag{margin-top:14px;color:var(--ink-2);font-size:.92rem;max-width:34ch}
.pay-list{display:inline-flex;flex-wrap:wrap;gap:6px 18px}
.foot__bottom{display:flex;flex-wrap:wrap;justify-content:space-between;gap:12px;margin-top:44px;padding-top:20px;border-top:1px solid var(--line);font-family:var(--font-caps);font-size:.56rem;letter-spacing:.2em;text-transform:uppercase;color:var(--ink-2)}

/* ---------- drawers (product panel, bag) ---------- */
.scrim{position:fixed;inset:0;z-index:60;background:rgba(20,17,18,.45);opacity:0;visibility:hidden;transition:opacity .5s,visibility .5s;backdrop-filter:blur(2px)}
.scrim.is-on{opacity:1;visibility:visible}
.drawer{position:fixed;top:0;right:0;bottom:0;z-index:70;background:var(--paper);color:var(--ink);width:min(100%,560px);transform:translateX(100%);transition:transform .75s var(--ease),visibility .75s;visibility:hidden;display:flex;flex-direction:column;box-shadow:-30px 0 80px rgba(20,17,18,.22);border-left:1px solid var(--line)}
.drawer.is-open{transform:none;visibility:visible}
.drawer--bag{width:min(100%,440px)}
.drawer__head{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:18px var(--pad2);border-bottom:1px solid var(--line)}
.drawer__head .eyebrow{margin:0}
.drawer__body{flex:1;overflow:auto;padding:var(--pad2);-webkit-overflow-scrolling:touch;overscroll-behavior:contain}
.drawer__foot{padding:18px var(--pad2) max(18px,env(safe-area-inset-bottom));border-top:1px solid var(--line)}
.drawer.is-open .stagger > *{animation:fadeUp .8s var(--ease) both}
.drawer.is-open .stagger > *:nth-child(1){animation-delay:.12s}
.drawer.is-open .stagger > *:nth-child(2){animation-delay:.18s}
.drawer.is-open .stagger > *:nth-child(3){animation-delay:.24s}
.drawer.is-open .stagger > *:nth-child(4){animation-delay:.3s}
.drawer.is-open .stagger > *:nth-child(5){animation-delay:.36s}
.drawer.is-open .stagger > *:nth-child(6){animation-delay:.42s}
.drawer.is-open .stagger > *:nth-child(7){animation-delay:.48s}
.drawer.is-open .stagger > *:nth-child(8){animation-delay:.54s}
@keyframes fadeUp{from{opacity:0;transform:translateY(14px)}}
.close{width:40px;height:40px;display:grid;place-items:center;font-size:1.4rem;line-height:1;border:1px solid var(--line);border-radius:50%;transition:background .3s,color .3s}
.close:hover{background:var(--ink);color:var(--paper)}
.pd__media{aspect-ratio:4/5;position:relative;overflow:hidden;margin-bottom:10px;background:var(--plate);border:1px solid var(--line)}
.pd__media .plate{position:absolute;inset:0}
.pd__media video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;background:#000}
.pd__soon{position:absolute;inset:0;display:grid;place-items:center;text-align:center;padding:20px;font-family:var(--font-caps);font-size:.58rem;letter-spacing:.26em;text-transform:uppercase;color:var(--ink-2);z-index:2;line-height:1.9}
.pd__thumbs{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;margin-bottom:26px}
.pd__thumb{aspect-ratio:3/4;position:relative;overflow:hidden;border:1px solid var(--line);display:block;width:100%;transition:border-color .3s}
.pd__thumb .plate{position:absolute;inset:0}
.pd__thumb.is-on{border-color:var(--ink)}
.pd__thumbs[hidden]{display:none}
.pd__thumb small{position:absolute;inset:auto 0 0 0;text-align:center;font-family:var(--font-caps);font-size:.48rem;letter-spacing:.22em;text-transform:uppercase;color:var(--paper);background:var(--ink);padding:4px;z-index:2}
.pd__name{font-size:clamp(32px,4vw,44px);font-weight:300;letter-spacing:-.015em}
.pd__price{font-family:var(--font-caps);font-size:.72rem;letter-spacing:.24em;margin:8px 0 18px}
.pd__desc{color:var(--ink-2);max-width:52ch;font-size:1.02rem}
.sizes{display:flex;flex-wrap:wrap;gap:10px;margin:20px 0 10px}
.size{width:46px;height:46px;border-radius:50%;border:1px solid var(--line-2);font-family:var(--font-caps);font-size:.62rem;letter-spacing:.06em;transition:background .3s,color .3s,border-color .3s,transform .3s var(--ease)}
.size:hover{border-color:var(--ink);transform:scale(1.06)}
.size.is-on{background:var(--ink);color:var(--paper);border-color:var(--ink)}
.pd__sizehelp{font-family:var(--font-caps);font-size:.56rem;letter-spacing:.2em;text-transform:uppercase;color:var(--ink-2)}
.acc{border-top:1px solid var(--line);margin-top:26px}
.acc details{border-bottom:1px solid var(--line)}
.acc summary{cursor:pointer;list-style:none;padding:15px 0;display:flex;justify-content:space-between;font-family:var(--font-caps);font-size:.6rem;letter-spacing:.28em;text-transform:uppercase}
.acc summary::-webkit-details-marker{display:none}
.acc summary::after{content:"+";font-family:var(--font-body);font-size:1rem;line-height:1}
.acc details[open] summary::after{content:"−"}
.acc p{margin:0 0 16px;color:var(--ink-2);font-size:.95rem}
.qty{display:inline-flex;align-items:center;border:1px solid var(--line-2)}
.qty button{width:42px;height:48px;font-size:1rem}
.qty span{min-width:36px;text-align:center;font-size:.9rem}
.pd__cta{display:flex;gap:10px;align-items:stretch}
.pd__cta .btn{flex:1;justify-content:space-between;padding-inline:22px}
.pd__total{opacity:.7;letter-spacing:.14em}
.bag-item{display:grid;grid-template-columns:72px 1fr auto;gap:14px;padding:16px 0;border-bottom:1px solid var(--line);align-items:start}
.bag-item__media{aspect-ratio:3/4;position:relative;overflow:hidden;border:1px solid var(--line)}
.bag-item__media .plate{position:absolute;inset:0}
.bag-item__name{font-family:var(--font-display);font-size:1.2rem;line-height:1.15}
.bag-item__meta{font-family:var(--font-caps);font-size:.56rem;letter-spacing:.2em;text-transform:uppercase;color:var(--ink-2);margin:5px 0 10px}
.bag-item__remove{font-family:var(--font-caps);font-size:.52rem;letter-spacing:.22em;text-transform:uppercase;color:var(--ink-2);margin-left:14px;transition:color .3s}
.bag-item__remove:hover{color:var(--live)}
.bag-item__price{font-family:var(--font-caps);font-size:.68rem;letter-spacing:.14em}
.bag-empty{text-align:center;padding:60px 12px;color:var(--ink-2)}
.bag-empty .pd__name{margin-bottom:10px;color:var(--ink)}
.bag-empty em{font-family:var(--font-display);font-style:italic;font-size:1.1em;color:var(--ink)}
.ship{font-family:var(--font-caps);font-size:.56rem;letter-spacing:.2em;text-transform:uppercase;color:var(--ink-2);margin-bottom:14px;display:block}
.ship__bar{display:block;height:2px;background:var(--line);margin-top:9px;position:relative;overflow:hidden}
.ship__bar i{position:absolute;inset:0;background:var(--accent);transform-origin:left;transform:scaleX(0);transition:transform .6s var(--ease)}
.total{display:flex;justify-content:space-between;font-family:var(--font-caps);font-size:.66rem;letter-spacing:.2em;text-transform:uppercase;margin-bottom:14px}
.total strong{font-weight:500}
.pay{margin:12px 0 0;font-family:var(--font-caps);font-size:.5rem;letter-spacing:.22em;text-transform:uppercase;color:var(--ink-3);text-align:center}

/* ---------- toast ---------- */
.toast{position:fixed;left:50%;bottom:max(24px,env(safe-area-inset-bottom));transform:translate(-50%,20px);z-index:90;background:var(--ink);color:var(--paper);padding:13px 24px;font-family:var(--font-caps);font-size:.58rem;letter-spacing:.24em;text-transform:uppercase;opacity:0;transition:opacity .4s,transform .4s var(--ease);pointer-events:none;max-width:calc(100vw - 32px);text-align:center}
.toast.is-on{opacity:1;transform:translate(-50%,0)}

/* ---------- coming-soon hero (no pieces yet): the emblem engraving as an invitation ---------- */
.looks--empty{height:auto;min-height:0}
.looks--empty .looks__slides{position:relative;inset:auto}
.looks--empty .looks__nav,.looks--empty .looks__index{display:none}
.look--invite{position:relative;inset:auto;display:grid;align-items:center;justify-items:center;text-align:center;gap:clamp(22px,4vw,72px);max-width:var(--max);margin-inline:auto;min-height:min(100svh,980px);padding:clamp(96px,13vh,140px) var(--pad) clamp(48px,8vh,100px)}
.invite__art{position:relative;margin:0;width:min(58vw,272px);aspect-ratio:629/737;display:grid;place-items:center;animation:inviteArt 1.8s var(--ease) .15s both}
.invite__art::before{content:"";position:absolute;inset:-10% -18%;border-radius:50%;background:radial-gradient(closest-side,var(--paper-3),color-mix(in srgb,var(--paper-3) 40%,transparent) 60%,transparent);z-index:-1}
.invite__art img{width:100%;height:100%;object-fit:contain}
/* dark themes: never invert the engraving (it would change the woman's skin), print it on a cream card instead */
html.is-dark .invite__art{background:#f3ede1;padding:5%;box-shadow:0 50px 100px -40px rgba(0,0,0,.75)}
html.is-dark .invite__art::before{inset:10px;border-radius:0;background:none;border:1px solid rgba(20,17,18,.22);z-index:1;pointer-events:none}
html.is-dark .wordmark__emblem,html.is-dark .foot__emblem,html.is-dark .intro__logo,html.is-dark .story__logo{background:#f3ede1}
.invite__fallback{font-family:var(--font-caps);font-size:clamp(46px,7vw,90px);letter-spacing:.3em;padding-left:.3em;text-transform:uppercase}
html.has-logo .invite__fallback{display:none}
.invite__copy{display:grid;justify-items:center;max-width:640px}
.invite__copy>.orn-i{width:20px;height:20px;margin-bottom:clamp(12px,2vw,26px)}
.look--invite .look__title{font-size:clamp(48px,7.4vw,122px);margin:0}
.look__title .w{padding-inline:.05em;margin-inline:-.05em}
.invite__text{font-family:var(--font-display);font-style:italic;font-size:clamp(19px,1.75vw,25px);line-height:1.45;color:var(--ink-2);max-width:32ch;margin:.7em 0 1.5em}
.invite__row{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:18px 30px}
.invite__live{display:inline-flex;align-items:center;gap:10px;font-family:var(--font-caps);font-size:.6rem;letter-spacing:.26em;text-transform:uppercase;color:var(--ink-2);padding:8px 0;transition:color .3s}
.invite__live:hover{color:var(--ink)}
.invite__live .dot{width:7px;height:7px;border-radius:50%;background:var(--live);opacity:.55}
html.is-live .invite__live .dot{opacity:1;animation:pulse 1.4s ease-out infinite}
@media (min-width:960px){
  .look--invite{grid-template-columns:1.08fr .92fr;justify-items:start;text-align:left}
  .invite__art{order:2;justify-self:center;width:auto;height:min(72vh,660px)}
  .invite__copy,.invite__row{justify-items:start;justify-content:flex-start}
}
@keyframes inviteArt{from{opacity:0;transform:scale(.965)}}
@keyframes inviteUp{from{opacity:0;transform:translateY(14px)}}
@keyframes wordUp{from{transform:translateY(112%)}}
.look--invite .look__title .w>*{animation:wordUp 1.1s var(--ease) both;animation-delay:calc(.3s + var(--d,0) * 110ms)}
.invite__copy>.orn-i,.invite__text,.invite__row{animation:inviteUp 1s var(--ease) both}
.invite__copy>.orn-i{animation-delay:.15s}
.invite__text{animation-delay:.7s}
.invite__row{animation-delay:.9s}
body.is-intro .look--invite,body.is-intro .look--invite *{animation-play-state:paused}
html.is-preview .look--invite,html.is-preview .look--invite *{animation:none}
html.is-empty .bag-btn{display:none}

/* ---------- no pieces yet: hero, story, live, newsletter (the collection comes back with the first piece) ---------- */
html.is-empty main{display:flex;flex-direction:column}
html.is-empty #story{order:1}
html.is-empty #live{order:2}
html.is-empty #news{order:3}
html.is-empty .story__sealwrap{display:none}
html.is-empty .story__grid{grid-template-columns:1fr;justify-items:center;text-align:center}
html.is-empty .story__text{max-width:780px}
html.is-empty .story__body p{margin-inline:auto}
.story__body p:not(.eyebrow){max-width:54ch;color:var(--ink-2)}
.story__body strong{color:var(--ink);font-weight:400}
html.is-dark .intro.has-video,html.is-dark .pd__media video{background:#000}
html.is-dark .card__tag--soft{background:var(--paper-2)}

/* ---------- motion preferences ---------- */
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  .ticker__track{animation:none}
  .ticker{position:relative}   /* one still line that fades out on the right, never a wrapped block */
  .ticker::after{content:"";position:absolute;top:0;bottom:0;right:0;width:26%;background:linear-gradient(90deg,transparent,var(--paper-2) 85%);pointer-events:none}
  .look .plate-frame{transition:none}
  .card,.feature{animation:none;opacity:1;transform:none}
  .intro__word,.intro__by,.intro__line,.intro__logo,.intro__ring circle{animation:none;opacity:1;transform:none;stroke-dashoffset:0}
  .seal__ring,.seal-big__ring{animation:none}
  .look__title .w > *{transition:none;transform:none}
  .look--invite,.look--invite *{animation:none!important}
  .reveal{transition:none}
  .drawer.is-open .stagger > *{animation:none}
}

/* ==========================================================================
   Shop states, related pieces, size guide, bag extras, sub-pages
   ========================================================================== */

/* ---------- stock states ---------- */
.card--sold .card__media .plate{filter:grayscale(1);opacity:.55}
.card--sold .card__price{color:var(--ink-3)}
.card__tag--soft{background:var(--paper);color:var(--ink);border:1px solid var(--line-2)}
.card__tag--sale{background:var(--live);color:#fff}
.was{color:var(--ink-3);text-decoration:line-through;text-decoration-thickness:1px;margin-right:.35em;font-weight:inherit}
.look__price .was{color:var(--ink-3)}
.pd__price .was{margin-right:.5em}
.size.is-out{color:var(--ink-3);border-style:dashed;position:relative;cursor:not-allowed}
.size.is-out::after{content:"";position:absolute;left:9px;right:9px;top:50%;height:1px;background:var(--ink-3);transform:rotate(-24deg)}
.size.is-out:hover{transform:none;border-color:var(--line-2)}
.pd__stock{font-family:var(--font-caps);font-size:.56rem;letter-spacing:.22em;text-transform:uppercase;color:var(--live);margin:.4em 0 0;min-height:1.4em}
.pd__sizerow{display:flex;justify-content:space-between;align-items:baseline;gap:12px;margin-top:22px}
.pd__sizerow .eyebrow{margin:0}
.link{font-family:var(--font-caps);font-size:.56rem;letter-spacing:.22em;text-transform:uppercase;border-bottom:1px solid var(--line-2);padding-bottom:3px;transition:border-color .3s,color .3s;display:inline-block}
.link:hover{border-color:var(--ink)}
.notify{border:1px solid var(--line-2);padding:16px 18px}
.notify p{margin:0 0 8px;font-size:.92rem;color:var(--ink-2)}
.notify form{display:flex;border-bottom:1px solid var(--ink)}
.notify input{flex:1;min-width:0;background:none;border:0;padding:12px 0;font:inherit;color:var(--ink);outline:0;border-radius:0}
.notify button{font-family:var(--font-caps);font-size:.56rem;letter-spacing:.24em;text-transform:uppercase;padding:0 6px;white-space:nowrap}

/* ---------- related pieces ---------- */
.pd__related{margin-top:30px}
.bag__related{margin-top:28px}
.rel{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}
.rel__item{display:flex;flex-direction:column;align-items:stretch;justify-content:flex-start;text-align:left}
.rel__media{display:block;aspect-ratio:3/4;position:relative;overflow:hidden;border:1px solid var(--line);margin-bottom:8px;background:var(--plate)}
.rel__media .plate{position:absolute;inset:0}
.rel__item:hover .plate .plate__mark{transform:scale(1.05)}
.rel__name{display:block;font-family:var(--font-display);font-size:1.02rem;line-height:1.15}
.rel__price{display:block;font-family:var(--font-caps);font-size:.52rem;letter-spacing:.18em;text-transform:uppercase;color:var(--ink-2);margin-top:4px}

/* ---------- bag extras ---------- */
.bag-item select{font-family:var(--font-caps);font-size:.56rem;letter-spacing:.16em;text-transform:uppercase;background:transparent;border:1px solid var(--line-2);padding:7px 8px;color:var(--ink);margin:0 0 10px;border-radius:0;appearance:auto}
.bag-note{margin-top:18px;border-bottom:1px solid var(--line)}
.bag-note summary{cursor:pointer;list-style:none;font-family:var(--font-caps);font-size:.54rem;letter-spacing:.22em;text-transform:uppercase;color:var(--ink-2);padding:12px 0;display:flex;justify-content:space-between}
.bag-note summary::-webkit-details-marker{display:none}
.bag-note summary::after{content:"+";font-family:var(--font-body);font-size:1rem;line-height:1}
.bag-note[open] summary::after{content:"−"}
.bag-note textarea{width:100%;min-height:84px;border:1px solid var(--line-2);background:transparent;padding:10px 12px;font:inherit;font-size:.95rem;color:var(--ink);resize:vertical;outline:0;margin-bottom:14px;border-radius:0}
.bag-note textarea:focus{border-color:var(--ink)}
#checkout:disabled{opacity:.6;cursor:wait}

/* ---------- modal (size guide) ---------- */
.modal{overscroll-behavior:contain;position:fixed;left:50%;top:50%;transform:translate(-50%,-50%) scale(.97);z-index:75;width:min(92vw,720px);max-height:88vh;overflow:auto;background:var(--paper);border:1px solid var(--line-2);box-shadow:0 40px 100px rgba(20,17,18,.3);opacity:0;visibility:hidden;transition:opacity .4s,transform .45s var(--ease),visibility .4s}
.modal.is-open{opacity:1;visibility:visible;transform:translate(-50%,-50%)}
.modal__head{display:flex;justify-content:space-between;align-items:center;padding:16px var(--pad2);border-bottom:1px solid var(--line);position:sticky;top:0;background:var(--paper)}
.modal__head .eyebrow{margin:0}
.modal__body{padding:var(--pad2)}
.modal__note{font-size:.92rem;color:var(--ink-2);margin:0 0 18px}
.modal__note strong{color:var(--ink);font-weight:400}

/* ---------- tables + units ---------- */
.unit-toggle{display:inline-flex;border:1px solid var(--line-2);margin-bottom:6px}
.unit-toggle button{padding:9px 16px;font-family:var(--font-caps);font-size:.54rem;letter-spacing:.22em;text-transform:uppercase;transition:background .3s,color .3s}
.unit-toggle button.is-on{background:var(--ink);color:var(--paper)}
.tbl-wrap{overflow-x:auto}
.tbl{width:100%;border-collapse:collapse;font-size:.95rem;margin:12px 0 22px;min-width:460px}
.tbl th,.tbl td{border-bottom:1px solid var(--line);padding:11px 10px;text-align:left;white-space:nowrap}
.tbl th{font-family:var(--font-caps);font-size:.54rem;letter-spacing:.24em;text-transform:uppercase;color:var(--ink-2);font-weight:400}
.tbl td:first-child{font-family:var(--font-caps);font-size:.62rem;letter-spacing:.14em}
.tbl .cm{display:none}
.tbl.is-cm .cm{display:inline}
.tbl.is-cm .in{display:none}

/* ---------- sub-pages ---------- */
.site-head--page{position:sticky;top:0;background:var(--paper);border-bottom:1px solid var(--line);padding-block:12px;color:var(--ink)}
.site-head--page .site-head__nav{display:flex}
.site-head--page .bag-btn{font-family:var(--font-caps)}
.page-head{max-width:840px;margin:0 auto;padding:clamp(40px,7vw,90px) var(--pad) clamp(16px,3vw,28px)}
.page-head .section__title{font-size:clamp(40px,6vw,76px)}
.page-body{max-width:840px;margin:0 auto;padding:0 var(--pad) clamp(64px,10vw,120px)}
.page-body h3{font-size:1.75rem;margin:1.8em 0 .5em;font-weight:400}
.page-body h3:first-child{margin-top:.6em}
.page-body p,.page-body li{color:var(--ink-2);font-size:1.03rem}
.page-body ul{padding-left:1.2em;margin:0 0 1.2em}
.page-body li{margin-bottom:.35em}
.page-body strong{color:var(--ink);font-weight:400}
.page-body a:not(.btn):not(.link){border-bottom:1px solid var(--line-2);transition:border-color .3s}
.page-body a:not(.btn):not(.link):hover{border-color:var(--ink)}
.page-body .btn{margin-top:14px}
.faq{border-top:1px solid var(--line);margin-top:30px}
.faq details{border-bottom:1px solid var(--line)}
.faq summary{cursor:pointer;list-style:none;padding:16px 0;display:flex;justify-content:space-between;gap:16px;font-family:var(--font-display);font-size:1.25rem;color:var(--ink)}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"+";font-family:var(--font-body);font-size:1rem;line-height:1.6;color:var(--ink-2)}
.faq details[open] summary::after{content:"−"}
.faq p{margin:0 0 18px}
.contact-grid{display:grid;gap:18px;grid-template-columns:1fr;margin:24px 0}
@media (min-width:700px){.contact-grid{grid-template-columns:1fr 1fr}}
.contact-card{border:1px solid var(--line-2);padding:22px 24px;background:var(--paper-2)}
.contact-card .eyebrow{margin-bottom:.6em}
.contact-card p{margin:0}
.contact-card a{font-family:var(--font-display);font-size:1.35rem;color:var(--ink);border:0!important}
.err{min-height:72vh;display:grid;place-items:center;text-align:center;padding:80px var(--pad) 60px}
.err__num{font-family:var(--font-display);font-style:italic;font-size:clamp(120px,24vw,300px);line-height:.8;color:transparent;-webkit-text-stroke:1px var(--line-2);margin-bottom:.1em}
.err p{color:var(--ink-2);max-width:40ch;margin:1em auto 1.6em}
.thanks{max-width:720px;margin:0 auto;padding:clamp(48px,8vw,110px) var(--pad);text-align:center}
.thanks__order{font-family:var(--font-caps);font-size:.66rem;letter-spacing:.3em;text-transform:uppercase;color:var(--ink-2);margin:1.4em 0 2.4em}
.thanks__order strong{color:var(--ink);font-weight:400}
.steps{display:grid;gap:14px;grid-template-columns:1fr;text-align:left;margin:0 0 34px}
@media (min-width:700px){.steps{grid-template-columns:repeat(3,1fr)}}
.step{border:1px solid var(--line-2);padding:20px;background:var(--paper-2)}
.step small{display:block;font-family:var(--font-caps);font-size:.54rem;letter-spacing:.26em;text-transform:uppercase;color:var(--ink-2);margin-bottom:8px}
.step p{margin:0;color:var(--ink-2);font-size:.95rem}
.step strong{color:var(--ink);font-weight:400;font-family:var(--font-display);font-size:1.2rem;display:block;margin-bottom:6px}

/* ---------- real photos and videos from the admin (fallback stays the plate with the emblem) ---------- */
.plate--photo::before,.plate--photo::after{display:none}
.plate--photo img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block;transition:transform 1.4s var(--ease)}
.plate--zoom.plate--photo img{transform:scale(1.6)}
.card:hover .card__media .plate--main.plate--photo img{transform:scale(1.04)}
.plate-frame>img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:1}
.plate-frame.has-photo::after{opacity:.12}
.plate-frame.has-photo::before{display:none}
.ig__tile>img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:transform .8s var(--ease)}
.ig__tile:hover>img{transform:scale(1.05)}
.shot__poster{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.pd__media .plate--photo img{cursor:zoom-in}
.thanks__items{list-style:none;padding:0;margin:-1.2em 0 2.4em;font-size:1.05rem;line-height:1.8;color:var(--ink-2)}
.thanks__items strong{color:var(--ink);font-weight:500}

/* ---------- brand song: sound button in the header ---------- */
.sound-btn{display:flex;align-items:center;gap:8px;min-height:32px;padding:0 2px;font-family:var(--font-caps);font-size:.6rem;letter-spacing:.26em;text-transform:uppercase;color:var(--ink-2);transition:color .3s}
.sound-btn[hidden]{display:none}
.sound-btn:hover,.sound-btn.is-on{color:var(--ink)}
.sound-btn__bars{display:inline-flex;align-items:flex-end;gap:2px;height:12px}
.sound-btn__bars i{display:block;width:2px;height:3px;background:currentColor;border-radius:1px;transition:height .3s var(--ease)}
.sound-btn__bars i:nth-child(1){height:5px}.sound-btn__bars i:nth-child(2){height:10px}.sound-btn__bars i:nth-child(3){height:7px}.sound-btn__bars i:nth-child(4){height:4px}
.sound-btn.is-on .sound-btn__bars i{animation:eq 1.1s ease-in-out infinite}
.sound-btn.is-on .sound-btn__bars i:nth-child(2){animation-delay:-.35s}
.sound-btn.is-on .sound-btn__bars i:nth-child(3){animation-delay:-.7s}
.sound-btn.is-on .sound-btn__bars i:nth-child(4){animation-delay:-.2s}
@keyframes eq{0%,100%{height:3px}50%{height:12px}}
@media (max-width:959px){.sound-btn__label{display:none}.sound-btn{padding:0 6px}}
@media (prefers-reduced-motion:reduce){.sound-btn.is-on .sound-btn__bars i{animation:none;height:9px}}