/* Lola's Lobby · site styles
   Type: Cinzel (display), Cormorant Garamond (editorial and Yoruba capitals), Jost (text) */

@font-face{font-family:"Jost Yoruba";src:url(fonts/jost-yoruba-400.woff2) format("woff2");font-weight:300 450;font-display:swap;unicode-range:U+0300-0301,U+0323,U+1E62-1E63,U+1EB8-1EB9,U+1ECC-1ECD}
@font-face{font-family:"Jost Yoruba";src:url(fonts/jost-yoruba-500.woff2) format("woff2");font-weight:451 700;font-display:swap;unicode-range:U+0300-0301,U+0323,U+1E62-1E63,U+1EB8-1EB9,U+1ECC-1ECD}
:root{
  color-scheme: light;
  --pearl:#F6F3F0;
  --ivory:#FBF9F7;
  --mist:#E8EBF0;
  --blush:#F0E0DA;
  --sage:#DCE1D5;
  --indigo:#29324E;
  --indigo-soft:#4A5476;
  --dusk:#5F6988;
  --thread:#B0915F;
  --thread-ink:#7F6438;
  --line:rgba(41,50,78,.14);
  --line-strong:rgba(41,50,78,.32);
  --panel-1:#29324E; --panel-1-ink:#F6F3F0;
  --panel-2:#F0E0DA; --panel-2-ink:#29324E;
  --panel-3:#DCE1D5; --panel-3-ink:#29324E;
  --header-bg:rgba(246,243,240,.9);
  --foot-bg:#29324E;
  --foot-text:#DDE1EA;
  --foot-muted:#A9B1C8;
  --foot-strong:#F6F3F0;
  --on-image:#F6F3F0;

  --display:"Cinzel","Trajan Pro",Georgia,serif;
  --serif:"Cormorant Garamond","Garamond",Georgia,serif;
  --sans:"Jost","Jost Yoruba","Futura","Century Gothic","Helvetica Neue",Arial,sans-serif;

  /* one type scale for the whole site */
  --t-hero:clamp(58px,8.4vw,132px);
  --t-h1:clamp(34px,4.4vw,60px);
  --t-h2:clamp(28px,3.2vw,42px);
  --t-h3:clamp(22px,2vw,27px);
  --t-lede:clamp(20px,1.9vw,25px);
  --t-body:16px;
  --t-small:14px;
  --t-label:11px;

  --gutter:clamp(18px,4vw,56px);
  --max:1320px;
  --section:clamp(88px,11vw,152px);
  --ease:cubic-bezier(.2,.7,.2,1);
}
html[data-mode="dark"]{
  color-scheme: dark;
  --pearl:#151927;
  --ivory:#1A1F30;
  --mist:#1C2133;
  --blush:#2A2233;
  --sage:#1D2521;
  --indigo:#EFE9E4;
  --indigo-soft:#C9C3CE;
  --dusk:#A3ACC6;
  --thread:#C9AA78;
  --thread-ink:#C9AA78;
  --line:rgba(239,233,228,.14);
  --line-strong:rgba(239,233,228,.34);
  --panel-1:#232A42; --panel-1-ink:#EFE9E4;
  --panel-2:#2A2233; --panel-2-ink:#EFE9E4;
  --panel-3:#1F2823; --panel-3-ink:#EFE9E4;
  --header-bg:rgba(21,25,39,.9);
  --foot-bg:#0D1020;
}

*,*::before,*::after{box-sizing:border-box}
[hidden]{display:none!important}
html{scroll-behavior:smooth;scroll-padding-top:96px;-webkit-text-size-adjust:100%}
body{margin:0;background:var(--pearl);color:var(--indigo);font-family:var(--sans);font-weight:400;font-size:var(--t-body);line-height:1.7;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;transition:background-color .35s ease,color .35s ease}
img,video{max-width:100%;display:block}
a{color:inherit;text-decoration:none}
button{font:inherit;color:inherit;background:none;border:0;cursor:pointer;padding:0}
:focus-visible{outline:1px solid currentColor;outline-offset:4px}
.wrap{max-width:var(--max);margin-inline:auto;padding-inline:var(--gutter)}
.skip{position:absolute;left:12px;top:-60px;z-index:100;background:var(--indigo);color:var(--pearl);padding:10px 16px;font-size:13px;letter-spacing:.1em}
.skip:focus{top:12px}
.sr{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}

/* ---------- type ---------- */
.label{font-family:var(--sans);font-weight:500;font-size:var(--t-label);letter-spacing:.3em;text-transform:uppercase;color:var(--dusk);display:inline-block}
.h-display{font-family:var(--display);font-weight:400;letter-spacing:.08em;line-height:1.12;margin:0;text-wrap:balance}
h1.h-display{font-size:var(--t-h1)}
h2.h-display{font-size:var(--t-h2)}
.h-editorial{font-family:var(--serif);font-weight:400;font-style:italic;letter-spacing:0;line-height:1.18;margin:0;text-wrap:balance}
h2.h-editorial{font-size:clamp(32px,3.8vw,52px)}
.yo{font-family:var(--serif);font-weight:500;text-transform:uppercase;letter-spacing:.14em}
.lede{font-family:var(--serif);font-weight:400;font-size:var(--t-lede);line-height:1.5;margin:0;max-width:36ch;text-wrap:pretty}
.body-copy p{margin:0 0 1.1em;max-width:58ch;color:var(--indigo-soft)}
.body-copy p:last-child{margin-bottom:0}
.muted{color:var(--indigo-soft)}
.num{font-family:var(--serif);font-weight:500;font-size:17px;letter-spacing:.08em;color:var(--thread-ink)}
.stack{display:flex;flex-direction:column;gap:18px}
.stack-lg{display:flex;flex-direction:column;gap:28px}

/* links and buttons */
.link{font-size:var(--t-label);font-weight:500;letter-spacing:.28em;text-transform:uppercase;padding-bottom:7px;background:linear-gradient(currentColor,currentColor) left bottom/100% 1px no-repeat;display:inline-block;transition:background-size .45s var(--ease),opacity .3s}
.link:hover{background-size:40% 1px}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:12px;min-height:52px;background:var(--indigo);color:var(--pearl);font-size:var(--t-label);letter-spacing:.28em;text-transform:uppercase;font-weight:500;padding:0 32px;border:1px solid var(--indigo);transition:background .3s,color .3s,border-color .3s}
.btn:hover{background:transparent;color:var(--indigo)}
.btn.ghost{background:transparent;color:var(--indigo);border-color:var(--line-strong)}
.btn.ghost:hover{border-color:var(--indigo)}
.btn.light{background:var(--on-image);color:#29324E;border-color:var(--on-image)}
.btn.light:hover{background:transparent;color:var(--on-image)}
.actions{display:flex;gap:18px 28px;flex-wrap:wrap;align-items:center}

/* ---------- announce + header ---------- */
.announce{background:var(--foot-bg);color:var(--foot-strong);text-align:center;font-size:10.5px;letter-spacing:.3em;text-transform:uppercase;padding:10px 16px;font-weight:500}
header.site{position:sticky;top:0;z-index:40;background:var(--header-bg);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);border-bottom:1px solid transparent;transition:border-color .3s,background .35s}
header.site.scrolled{border-bottom-color:var(--line)}
.nav{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:32px;height:78px}
.brand{display:flex;align-items:center;justify-self:start}
.brand img{height:52px;width:auto}
.logo-d{display:none!important}
html[data-mode="dark"] .logo-l{display:none!important}
html[data-mode="dark"] .logo-d{display:block!important}
.nav ul{list-style:none;margin:0;padding:0;display:flex;gap:clamp(20px,2.6vw,38px)}
.nav ul a,.nav .drop-btn{font-size:11px;letter-spacing:.26em;text-transform:uppercase;font-weight:500;position:relative;padding-block:8px;display:inline-flex;align-items:center;gap:8px}
.nav ul a::after,.nav .drop-btn::after{content:"";position:absolute;left:0;right:100%;bottom:2px;height:1px;background:currentColor;transition:right .35s var(--ease)}
.nav ul a:hover::after,.nav .drop-btn:hover::after,.nav a[aria-current="page"]::after{right:0}
.nav-right{justify-self:end;display:flex;align-items:center;gap:clamp(20px,2.6vw,38px)}
.has-drop{position:relative}
.caret{width:6px;height:6px;border-right:1px solid currentColor;border-bottom:1px solid currentColor;transform:rotate(45deg) translateY(-2px);transition:transform .3s}
.has-drop.open .caret{transform:rotate(225deg) translate(-2px,0)}
.nav ul.drop{position:absolute;top:calc(100% + 20px);left:50%;transform:translate(-50%,6px);display:flex;flex-direction:column;gap:0;min-width:210px;padding:10px 0;background:var(--ivory);border:1px solid var(--line);box-shadow:0 24px 48px rgba(20,24,40,.08);opacity:0;visibility:hidden;transition:opacity .25s,transform .25s,visibility .25s}
.nav ul.drop::before{content:"";position:absolute;left:0;right:0;top:-21px;height:21px}
.has-drop.open ul.drop{opacity:1;visibility:visible;transform:translate(-50%,0)}
@media (hover:hover){.has-drop:hover ul.drop{opacity:1;visibility:visible;transform:translate(-50%,0)}.has-drop:hover .caret{transform:rotate(225deg) translate(-2px,0)}}
.nav ul.drop a{display:block;padding:11px 24px;white-space:nowrap}
.nav ul.drop a::after{display:none}
.nav ul.drop a:hover{background:var(--mist)}
.theme-toggle{width:36px;height:36px;border-radius:50%;border:1px solid var(--line);display:inline-flex;align-items:center;justify-content:center;transition:border-color .3s}
.theme-toggle:hover{border-color:var(--indigo)}
.theme-toggle .i-sun{display:none}
html[data-mode="dark"] .theme-toggle .i-sun{display:block}
html[data-mode="dark"] .theme-toggle .i-moon{display:none}
.menu-btn{display:none;width:44px;height:44px;align-items:center;justify-content:flex-end}
.menu-btn i{display:block;width:22px;height:1px;background:currentColor;position:relative}
.menu-btn i::before,.menu-btn i::after{content:"";position:absolute;right:0;width:22px;height:1px;background:currentColor}
.menu-btn i::before{top:-7px}.menu-btn i::after{top:7px;width:14px}

.drawer{position:fixed;inset:0;z-index:60;background:var(--pearl);padding:20px var(--gutter) 40px;display:flex;flex-direction:column;overflow-y:auto}
.drawer-top{display:flex;justify-content:space-between;align-items:center;height:44px}
.drawer .brand img{height:42px}
.drawer .close{font-size:11px;letter-spacing:.3em;text-transform:uppercase;font-weight:500;min-height:44px}
.drawer nav{display:flex;flex-direction:column;margin-top:40px;border-top:1px solid var(--line)}
.drawer nav a{font-family:var(--display);font-size:22px;letter-spacing:.1em;padding:16px 0;border-bottom:1px solid var(--line)}
.drawer nav a.sub{font-family:var(--sans);font-size:12px;letter-spacing:.26em;text-transform:uppercase;padding:13px 0 13px 20px;color:var(--indigo-soft)}
.drawer .drawer-foot{margin-top:auto;padding-top:40px;display:flex;flex-direction:column;gap:8px;font-size:var(--t-small);color:var(--indigo-soft)}

/* ---------- image slots ---------- */
.slot{position:relative;overflow:hidden;background:var(--mist)}
.slot img,.slot video,.slot picture{position:absolute;inset:0;width:100%;height:100%}
.slot img,.slot video{object-fit:cover;transition:transform 1.4s var(--ease)}
.zoom:hover .slot img{transform:scale(1.035)}

/* ---------- reveal on scroll ---------- */
@media (prefers-reduced-motion:no-preference){
  html.js .reveal{opacity:0;transform:translateY(18px);transition:opacity 1s var(--ease),transform 1s var(--ease)}
  html.js .reveal.in{opacity:1;transform:none}
  html.js .reveal.d1{transition-delay:.1s}html.js .reveal.d2{transition-delay:.2s}html.js .reveal.d3{transition-delay:.3s}
  .hero .fade{animation:fade 1.4s var(--ease) both}
  .hero .fade.d1{animation-delay:.15s}.hero .fade.d2{animation-delay:.3s}.hero .fade.d3{animation-delay:.45s}
  @keyframes fade{from{opacity:0;transform:translateY(16px)}to{opacity:1;transform:none}}
}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}*{transition:none!important;animation:none!important}}

/* ---------- hero (home) ---------- */
.hero{position:relative;display:grid;grid-template-columns:1fr 1fr;height:clamp(600px,calc(100svh - 78px),1000px);background:#1B2033;color:var(--on-image)}
.hero .slot{background:#39415E}
.hero .slot img{object-position:50% 22%}
.hero .slot.b img{object-position:50% 30%}
.hero::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(15,18,32,0) 26%,rgba(15,18,32,.42) 54%,rgba(15,18,32,.82) 100%);pointer-events:none}
.hero-copy{text-shadow:0 1px 22px rgba(10,12,24,.35);position:absolute;left:0;right:0;bottom:0;z-index:2;text-align:center;padding:0 var(--gutter) clamp(48px,7vh,88px);display:flex;flex-direction:column;align-items:center;gap:18px}
.hero-copy .label{color:var(--on-image);opacity:.92;margin-bottom:22px}
.hero-title{font-family:var(--serif);font-weight:400;font-size:var(--t-hero);letter-spacing:.12em;line-height:1;margin:0;text-transform:uppercase;padding-left:.12em}
.hero-copy p{margin:0;max-width:46ch;font-size:16px;color:rgba(246,243,240,.9)}
.hero-copy .link{color:var(--on-image)}

/* ---------- statement ---------- */
.statement{padding-block:var(--section) clamp(64px,7vw,104px);text-align:center}
.statement .h-editorial{font-size:clamp(40px,6vw,88px);max-width:18ch;margin:26px auto 0}
.facts-line{display:flex;flex-wrap:wrap;justify-content:center;gap:4px 14px;margin:0 auto;line-height:1.9}
.facts-line span{white-space:nowrap}
.facts-line i{font-style:normal}
.thread{width:1px;height:64px;background:var(--thread);margin:44px auto}
.statement .rule{width:56px;height:1px;background:var(--thread);margin:40px auto 0}
.tagline{font-family:var(--display);font-size:clamp(15px,1.5vw,19px);letter-spacing:.24em;margin:0}

/* ---------- section heads ---------- */
.sec-head{display:flex;justify-content:space-between;align-items:flex-end;gap:28px;flex-wrap:wrap;margin-bottom:clamp(36px,4.6vw,64px)}
.sec-head .stack{gap:16px}
.sec-head .lede{font-size:clamp(18px,1.6vw,21px);max-width:40ch;color:var(--indigo-soft)}

/* ---------- rails ---------- */
.rail-ctrl{display:flex;align-items:center;gap:14px}
.rail-ctrl button{width:48px;height:48px;border-radius:50%;border:1px solid var(--line-strong);display:inline-flex;align-items:center;justify-content:center;transition:border-color .3s,background .3s,color .3s,opacity .3s}
.rail-ctrl button:hover:not(:disabled){background:var(--indigo);color:var(--pearl);border-color:var(--indigo)}
.rail-ctrl button:disabled{opacity:.28;cursor:default}
.rail-ctrl .count{font-family:var(--serif);font-size:17px;letter-spacing:.1em;color:var(--indigo-soft);min-width:70px;text-align:center;font-variant-numeric:tabular-nums}
.rail{display:grid;grid-auto-flow:column;gap:clamp(16px,2vw,28px);overflow-x:auto;scroll-snap-type:x mandatory;scroll-behavior:smooth;scrollbar-width:none;overscroll-behavior-x:contain;-webkit-overflow-scrolling:touch}
.rail::-webkit-scrollbar{display:none}
.rail>*{scroll-snap-align:start}
.progress{height:1px;background:var(--line);margin-top:32px;position:relative;overflow:hidden}
.progress i{position:absolute;left:0;top:0;bottom:0;background:var(--indigo);width:30%;transition:transform .4s var(--ease),width .4s var(--ease)}

/* collections */
.collections{padding-block:0 var(--section)}
.collections .rail{gap:6px;grid-auto-columns:calc((100% - 18px)/4)}
.collections .sec-head{flex-direction:column;align-items:center;text-align:center}
.collections .sec-head .stack{align-items:center}
.collections .sec-head .rail-ctrl:only-child,.collections .sec-head .rail-ctrl{justify-content:center}
.collections .ccard .row,.collections .ccard h3,.collections .ccard p{padding-inline:clamp(16px,1.8vw,28px)}
.collections .ccard{gap:10px}
.collections .ccard h3{margin-top:14px}
.collections .ccard .row{margin-inline:clamp(16px,1.8vw,28px);padding-inline:0}
.ccard{display:flex;flex-direction:column;gap:16px}
.ccard .slot{aspect-ratio:4/5}
.ccard .row{display:flex;justify-content:space-between;align-items:baseline;gap:12px;padding-top:4px;border-top:1px solid var(--line);padding-top:16px}
.ccard .state{font-size:var(--t-label);font-weight:500;letter-spacing:.26em;text-transform:uppercase;color:var(--dusk)}
.ccard.live .state{color:var(--thread-ink)}
.ccard h3{font-family:var(--display);font-weight:400;font-size:clamp(20px,1.9vw,25px);letter-spacing:.08em;margin:0}
.ccard p{margin:0;color:var(--indigo-soft);font-size:15px;max-width:40ch}
.ccard .panel{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:14px;text-align:center;padding:28px}
.ccard .panel b{font-family:var(--serif);font-weight:300;font-size:clamp(96px,11vw,160px);line-height:.9;letter-spacing:.04em}
.ccard .panel span{font-size:var(--t-label);font-weight:500;letter-spacing:.3em;text-transform:uppercase;opacity:.8}
.pn-1{background:var(--panel-1);color:var(--panel-1-ink)}
.pn-2{background:var(--panel-2);color:var(--panel-2-ink)}
.pn-3{background:var(--panel-3);color:var(--panel-3-ink)}
.ccard .over{position:absolute;left:0;right:0;bottom:0;padding:22px 24px;display:flex;justify-content:space-between;align-items:flex-end;color:var(--on-image);background:linear-gradient(180deg,transparent,rgba(15,18,32,.55))}
.ccard .over span{font-size:var(--t-label);font-weight:500;letter-spacing:.28em;text-transform:uppercase}

/* ---------- fabrics + patterns ---------- */
.fabrics{background:var(--mist);padding-block:var(--section)}
.fab-grid{display:grid;grid-template-columns:1fr 1fr;gap:clamp(28px,4vw,72px)}
.fab{display:flex;flex-direction:column;gap:30px}
.fab .slot{aspect-ratio:5/4}
.fab h3{font-size:clamp(26px,2.6vw,34px);margin:0 0 14px;line-height:1.1}
.fab p{margin:0;max-width:52ch;color:var(--indigo-soft)}
.patterns{margin-top:var(--section);display:grid;grid-template-columns:.9fr 1.1fr;gap:clamp(28px,5vw,88px);align-items:center;padding-top:clamp(40px,5vw,64px);border-top:1px solid var(--line)}
.patterns .motif{aspect-ratio:1/1;max-width:420px;width:100%;color:var(--indigo)}
.patterns .motif svg{width:100%;height:100%}

/* ---------- made to order band ---------- */
.mto{padding-block:var(--section)}
.mto-steps{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(4,1fr);gap:clamp(20px,2.6vw,40px)}
.mto-steps li{display:flex;flex-direction:column;gap:12px;padding-top:24px;border-top:1px solid var(--line-strong)}
.mto-steps h3{font-family:var(--serif);font-weight:500;font-size:var(--t-h3);line-height:1.25;margin:0}
.mto-steps p{margin:0;color:var(--indigo-soft);font-size:15px}
.mto .actions{margin-top:clamp(40px,5vw,64px)}

/* ---------- reviews ---------- */
.reviews{background:var(--blush);padding-block:clamp(72px,8vw,112px);text-align:center}
.quote{margin:0 auto;max-width:900px;min-height:160px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:28px}
.quote blockquote{margin:0;font-family:var(--serif);font-style:italic;font-weight:400;font-size:clamp(26px,3vw,40px);line-height:1.35;text-wrap:balance}
.quote cite{font-style:normal;font-size:var(--t-label);font-weight:500;letter-spacing:.3em;text-transform:uppercase;color:var(--indigo-soft)}
.quote p{margin:0;max-width:52ch;color:var(--indigo-soft)}
.reviews .rail-ctrl{justify-content:center;margin-top:36px}
.q-stars{font-size:18px;letter-spacing:.2em;color:var(--thread)}
.q-stars i{font-style:normal;opacity:.3}
.rate{max-width:720px;margin:0 auto;text-align:center}
.quote:not([hidden]) ~ .rate{margin-top:clamp(56px,7vw,88px);padding-top:clamp(40px,5vw,64px);border-top:1px solid var(--line-strong)}
.rate .h-editorial{font-size:clamp(32px,3.8vw,48px)}
.rate-sub{margin:14px auto 30px;max-width:46ch}
.stars{display:flex;justify-content:center;gap:6px}
.stars button{color:var(--line-strong);width:48px;height:48px;display:inline-flex;align-items:center;justify-content:center;transition:color .2s,transform .2s}
.stars button.on{color:var(--thread)}
.stars button:hover{transform:scale(1.08)}
.star-label{margin:8px 0 28px;font-size:var(--t-label);font-weight:500;letter-spacing:.24em;text-transform:uppercase;color:var(--dusk);min-height:1.5em}
.star-label.bad{color:#A2443B}
html[data-mode="dark"] .star-label.bad{color:#F0A49A}
.rate-grid{display:grid;grid-template-columns:1fr 1fr;gap:22px 24px;text-align:left;margin-bottom:28px}
.rate-grid > *{min-width:0}
.rate .form-note{text-align:center;margin-top:14px}
@media (max-width:560px){.rate-grid{grid-template-columns:1fr}}

/* ---------- next chapter ---------- */
.next{display:grid;grid-template-columns:1fr 1fr;background:var(--sage)}
.study{display:flex;min-height:520px;position:relative}
.study i{flex:1;transition:flex .8s var(--ease)}
.study:hover i:nth-child(odd){flex:1.25}
.study .cap{position:absolute;left:24px;bottom:22px;font-size:var(--t-label);font-weight:500;letter-spacing:.3em;text-transform:uppercase;color:#F6F3F0;mix-blend-mode:difference}
.next-copy{padding:clamp(56px,7vw,112px) var(--gutter);display:flex;flex-direction:column;justify-content:center;gap:24px}
.next-copy p{margin:0;max-width:46ch;color:var(--indigo-soft)}

/* ---------- atelier teaser + page ---------- */
.atelier{padding-block:var(--section)}
.split{display:grid;grid-template-columns:.85fr 1.15fr;gap:clamp(32px,6vw,104px);align-items:center}
.split.rev{grid-template-columns:1.15fr .85fr}
.split .slot{aspect-ratio:4/5}
.signature{font-family:var(--serif);font-style:italic;font-size:34px;line-height:1;color:var(--indigo-soft)}
.pillars{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(20px,3vw,48px);padding-block:var(--section);border-top:1px solid var(--line)}
.pillars div{display:flex;flex-direction:column;gap:12px}
.pillars h3{font-family:var(--serif);font-weight:500;font-size:var(--t-h3);margin:0}
.pillars p{margin:0;color:var(--indigo-soft)}

/* behind the seams */
.bts{background:var(--mist);padding-block:var(--section)}
.bts .rail{grid-auto-columns:max(250px,calc((100% - 3*clamp(16px,2vw,28px))/3.4))}
.bcard{display:flex;flex-direction:column;gap:16px}
.bcard .slot{aspect-ratio:4/5}
.bcard .plate{position:absolute;inset:0;display:flex;flex-direction:column;justify-content:space-between;padding:26px;background:var(--ivory);border:1px solid var(--line)}
.bcard .plate b{font-family:var(--serif);font-weight:300;font-size:clamp(72px,7vw,108px);line-height:.9;color:var(--thread)}
.bcard .plate span{font-size:var(--t-label);font-weight:500;letter-spacing:.28em;text-transform:uppercase;color:var(--dusk)}
.bcard h3{font-family:var(--serif);font-weight:500;font-size:var(--t-h3);margin:0}
.bcard p{margin:0;color:var(--indigo-soft);font-size:15px}

/* ---------- page heads ---------- */
.page-head{padding-block:clamp(64px,9vw,128px) clamp(40px,5vw,72px)}
.page-head .stack-lg{max-width:760px}
.crumbs{font-size:var(--t-label);font-weight:500;letter-spacing:.26em;text-transform:uppercase;color:var(--dusk);display:flex;gap:10px;flex-wrap:wrap}
.crumbs a:hover{color:var(--indigo)}
.facts{display:flex;gap:clamp(24px,4vw,56px);flex-wrap:wrap;padding-top:8px}
.facts div{display:flex;flex-direction:column;gap:4px}
.facts b{font-family:var(--serif);font-weight:500;font-size:30px;line-height:1}
.facts span{font-size:var(--t-label);font-weight:500;letter-spacing:.24em;text-transform:uppercase;color:var(--dusk)}

/* ---------- collection page ---------- */
.lookbook-hero{display:grid;grid-template-columns:1.3fr 1fr 1fr;gap:clamp(8px,1vw,14px);height:clamp(420px,70vh,760px)}
.lookbook-hero .slot{height:100%}
.intro{display:grid;grid-template-columns:1fr 1fr;gap:clamp(28px,6vw,104px);padding-block:clamp(64px,8vw,120px);align-items:end}
.intro .h-display{font-size:clamp(40px,5.6vw,80px)}
.intro .series{font-family:var(--serif);font-weight:500;font-size:clamp(20px,2vw,26px);letter-spacing:.16em;text-transform:uppercase;color:var(--indigo-soft);margin:14px 0 0}
.her-key{margin-top:14px;color:var(--thread-ink)}
.her{padding-block:clamp(48px,6vw,88px);border-top:1px solid var(--line)}
.her-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(28px,4vw,72px);text-align:center}
.her-grid div{display:flex;flex-direction:column;align-items:center;gap:14px}
.her-grid b{font-family:var(--serif);font-weight:300;font-size:clamp(88px,9vw,140px);line-height:.85;color:var(--indigo)}
.her-grid .label{color:var(--thread-ink)}
.her-grid p{margin:0;max-width:32ch;color:var(--indigo-soft)}
.look{display:grid;grid-template-columns:repeat(12,1fr);gap:clamp(16px,2vw,28px);padding-block:clamp(56px,7vw,104px);border-top:1px solid var(--line);align-items:start}
.look .main{grid-column:1/8}
.look .aside{grid-column:8/13;display:flex;flex-direction:column;gap:28px;position:sticky;top:110px}
.look.flip .main{grid-column:6/13;grid-row:1}
.look.flip .aside{grid-column:1/6;grid-row:1}
.look .main .slot{aspect-ratio:4/5;cursor:zoom-in}
.look .second{display:grid;grid-template-columns:1fr 1fr;gap:clamp(10px,1.2vw,16px)}
.look .second .slot{aspect-ratio:3/4;cursor:zoom-in;background:#F1F1F3}
.look .second .slot.contain img{object-fit:contain}
.look .second:has(> :only-child){grid-template-columns:1fr}
.look .second:has(> :only-child) .slot{aspect-ratio:4/5}
.look h2{font-family:var(--serif);font-weight:500;font-size:clamp(28px,2.9vw,40px);letter-spacing:.1em;line-height:1;margin:0}
.look .nick{font-family:var(--serif);font-style:italic;font-size:22px;color:var(--indigo-soft);margin:-10px 0 0}
.look .meta{display:flex;gap:8px 20px;flex-wrap:wrap;font-size:var(--t-label);font-weight:500;letter-spacing:.24em;text-transform:uppercase;color:var(--dusk)}
.look p.desc{margin:0;color:var(--indigo-soft);max-width:48ch}
.look ul.details{list-style:none;margin:0;padding:0;border-top:1px solid var(--line)}
.look ul.details li{padding:12px 0;border-bottom:1px solid var(--line);font-size:15px;display:flex;gap:14px}
.look ul.details li::before{content:"";width:14px;height:1px;background:var(--thread);margin-top:13px;flex:none}
.title-row{display:flex;justify-content:space-between;align-items:baseline;gap:16px 24px;flex-wrap:wrap}
.price{margin:0;font-family:var(--serif);font-weight:500;font-size:clamp(28px,2.9vw,40px);letter-spacing:.1em;line-height:1;color:var(--indigo);white-space:nowrap}
.copy-link{font-size:var(--t-label);font-weight:500;letter-spacing:.24em;text-transform:uppercase;color:var(--dusk);display:inline-flex;gap:8px;align-items:center;min-height:44px}
.copy-link:hover{color:var(--indigo)}

/* lightbox */
dialog.lb{border:0;padding:0;margin:0;width:100vw;height:100vh;max-width:none;max-height:none;background:rgba(14,17,30,.94);color:#F6F3F0}
dialog.lb::backdrop{background:transparent}
.lb-inner{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;padding:64px clamp(12px,6vw,96px)}
.lb-inner img{max-width:100%;max-height:100%;object-fit:contain;box-shadow:0 30px 80px rgba(0,0,0,.35)}
.lb button{position:absolute;color:#F6F3F0;font-size:11px;font-weight:500;letter-spacing:.28em;text-transform:uppercase;min-height:48px;min-width:48px;display:inline-flex;align-items:center;justify-content:center}
.lb .x{top:10px;right:20px}
.lb .p{left:10px;top:50%;transform:translateY(-50%)}
.lb .n{right:10px;top:50%;transform:translateY(-50%)}
.lb .cap{position:absolute;left:0;right:0;bottom:18px;text-align:center;font-size:12px;letter-spacing:.2em;text-transform:uppercase;opacity:.75}

/* ---------- order page ---------- */
.steps{list-style:none;margin:0;padding:0;counter-reset:s}
.steps li{counter-increment:s;display:grid;grid-template-columns:64px 1fr;gap:16px;padding-block:28px;border-top:1px solid var(--line)}
.steps li:last-child{border-bottom:1px solid var(--line)}
.steps li::before{content:counter(s,upper-roman);font-family:var(--serif);font-weight:500;font-size:19px;letter-spacing:.08em;color:var(--thread-ink)}
.steps h3{font-family:var(--serif);font-weight:500;font-size:var(--t-h3);margin:0 0 4px;line-height:1.3}
.steps p{margin:0;color:var(--indigo-soft);max-width:50ch}
.steps a{background:linear-gradient(currentColor,currentColor) left bottom/100% 1px no-repeat}
.order-top{display:grid;grid-template-columns:.9fr 1.1fr;gap:clamp(32px,6vw,104px);align-items:start;padding-bottom:var(--section)}
.order-top .left{position:sticky;top:120px}

.form-sec{background:var(--ivory);padding-block:var(--section);border-block:1px solid var(--line)}
.form-grid>*,.order-top>*,.split>*,.contact-grid>*,.faq-grid>*,.size-grid>*,.intro>*,form.order>*{min-width:0}
.form-grid{display:grid;grid-template-columns:.8fr 1.2fr;gap:clamp(32px,6vw,104px);align-items:start}
.form-grid .left{position:sticky;top:120px}
form.order{display:grid;grid-template-columns:1fr 1fr;gap:26px 24px}
fieldset{border:0;margin:0;padding:0;min-width:0;min-inline-size:0;grid-column:1/-1;display:grid;grid-template-columns:repeat(3,1fr);gap:22px 20px}
legend{font-family:var(--serif);font-weight:500;font-size:var(--t-h3);padding:0;margin-bottom:6px;display:flex;justify-content:space-between;width:100%;align-items:baseline}
legend .unit{font-family:var(--sans);font-size:13px;font-weight:400}
.field{display:flex;flex-direction:column;gap:8px;min-width:0}
.field input,.field select,.field textarea{width:100%;min-width:0}
.field.full{grid-column:1/-1}
.field label{font-size:var(--t-label);font-weight:500;letter-spacing:.22em;text-transform:uppercase;color:var(--indigo-soft)}
.field label i{font-style:normal;color:var(--dusk);letter-spacing:.1em;text-transform:none;font-size:12px;margin-left:4px}
.field input,.field select,.field textarea{font:inherit;font-size:16px;color:var(--indigo);background:transparent;border:0;border-bottom:1px solid var(--line-strong);padding:10px 2px;border-radius:0;min-height:46px;transition:border-color .3s}
.field select{appearance:none;-webkit-appearance:none;background-image:linear-gradient(45deg,transparent 50%,currentColor 50%),linear-gradient(135deg,currentColor 50%,transparent 50%);background-position:calc(100% - 12px) 21px,calc(100% - 7px) 21px;background-size:5px 5px;background-repeat:no-repeat;padding-right:28px}
.field select option{color:#29324E}
.field textarea{min-height:110px;resize:vertical}
.field input:focus,.field select:focus,.field textarea:focus{outline:none;border-bottom-color:var(--indigo)}
.field input::placeholder,.field textarea::placeholder{color:var(--dusk);opacity:.8}
.field .err{font-size:13px;color:#A2443B;min-height:0}
html[data-mode="dark"] .field .err{color:#F0A49A}
.field.bad input,.field.bad select{border-bottom-color:#A2443B}
.chips{display:flex;flex-wrap:wrap;gap:8px;margin-top:4px}
.chips button{display:inline-flex;align-items:center;gap:8px;border:1px solid var(--line-strong);padding:7px 14px 7px 8px;font-size:13px;border-radius:40px;min-height:36px;transition:border-color .3s,background .3s}
.chips button i{width:16px;height:16px;border-radius:50%;border:1px solid var(--line)}
.chips button:hover,.chips button[aria-pressed="true"]{border-color:var(--indigo);background:var(--mist)}
.unit-toggle{display:inline-flex;border:1px solid var(--line-strong);border-radius:40px;overflow:hidden}
.unit-toggle button{padding:4px 14px;font-size:12px;letter-spacing:.14em;text-transform:uppercase;min-height:32px}
.unit-toggle button[aria-pressed="true"]{background:var(--indigo);color:var(--pearl)}
.form-actions{grid-column:1/-1;display:flex;gap:14px;flex-wrap:wrap;align-items:center;padding-top:8px}
.form-note{grid-column:1/-1;margin:0;font-size:var(--t-small);color:var(--indigo-soft);min-height:1.5em}

.size{padding-block:var(--section)}
.size-grid{display:grid;grid-template-columns:.8fr 1.2fr;gap:clamp(32px,6vw,104px);align-items:start}
.figure{background:var(--mist);aspect-ratio:3/4;display:flex;align-items:center;justify-content:center;padding:32px;position:sticky;top:120px}
.figure svg{width:100%;height:100%;color:var(--indigo)}
.measure{list-style:none;margin:0;padding:0;counter-reset:m}
.measure li{counter-increment:m;display:grid;grid-template-columns:48px 1fr;gap:12px;padding-block:20px;border-top:1px solid var(--line)}
.measure li::before{content:counter(m);font-family:var(--serif);font-weight:500;font-size:22px;color:var(--thread-ink);line-height:1.2}
.measure h3{font-family:var(--serif);font-weight:500;font-size:22px;margin:0 0 2px}
.measure p{margin:0;color:var(--indigo-soft)}
.tips{margin-top:32px;padding:24px 28px;background:var(--blush)}
.tips p{margin:0;color:var(--indigo)}

.faq{padding-block:var(--section);border-top:1px solid var(--line)}
.faq-grid{display:grid;grid-template-columns:.8fr 1.2fr;gap:clamp(32px,6vw,104px);align-items:start}
.faq details{border-top:1px solid var(--line)}
.faq details:last-child{border-bottom:1px solid var(--line)}
.faq summary{list-style:none;cursor:pointer;display:flex;justify-content:space-between;align-items:center;gap:20px;padding:22px 0;font-family:var(--serif);font-weight:500;font-size:22px;line-height:1.3}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"";width:12px;height:12px;flex:none;background:linear-gradient(currentColor,currentColor) center/100% 1px no-repeat,linear-gradient(currentColor,currentColor) center/1px 100% no-repeat;transition:transform .35s var(--ease)}
.faq details[open] summary::after{transform:rotate(45deg)}
.faq .ans{padding:0 0 24px;color:var(--indigo-soft);max-width:60ch}
.faq .ans p{margin:0 0 10px}

/* ---------- events page ---------- */
.elist{list-style:none;margin:0;padding:0;border-top:1px solid var(--line)}
.elist li{display:grid;grid-template-columns:180px 1fr auto;gap:24px;align-items:center;padding-block:30px;border-bottom:1px solid var(--line)}
.elist .date{font-family:var(--serif);font-weight:500;font-size:22px}
.elist h3{font-family:var(--display);font-weight:400;font-size:20px;letter-spacing:.08em;margin:0 0 4px}
.elist p{margin:0;color:var(--indigo-soft)}
.empty{display:grid;grid-template-columns:1fr auto;gap:28px;align-items:center;padding-block:clamp(36px,4vw,56px);border-block:1px solid var(--line)}
.empty p{margin:0;font-family:var(--serif);font-size:clamp(24px,2.4vw,32px);line-height:1.35;max-width:30ch}
.host{background:var(--blush);padding-block:var(--section)}

/* ---------- contact block ---------- */
.contact{background:var(--blush);padding-block:var(--section)}
.contact.alt{background:var(--sage)}
.contact-grid{display:grid;grid-template-columns:1.1fr .9fr;gap:clamp(40px,7vw,120px);align-items:start}
.join-h{margin-top:-6px;line-height:1}
.letter form{display:flex;max-width:520px;border-bottom:1px solid var(--indigo);margin-top:30px}
.letter input{flex:1;min-width:0;background:transparent;border:0;padding:14px 2px;font:inherit;font-size:16px;color:var(--indigo)}
.letter input::placeholder{color:var(--dusk)}
.letter input:focus{outline:none}
.letter button{font-size:var(--t-label);font-weight:500;letter-spacing:.28em;text-transform:uppercase;padding-inline:12px;min-height:48px}
.letter button:disabled{opacity:.5}
.letter .note{margin:16px 0 0;font-size:15px;min-height:1.5em}
.letter .note em{font-family:var(--serif);font-style:italic;font-size:1.2em}
.talk{display:flex;flex-direction:column;border-top:1px solid var(--line-strong)}
.talk a,.talk div{display:flex;justify-content:space-between;align-items:center;gap:16px;padding:20px 0;border-bottom:1px solid var(--line-strong)}
.talk b{font-family:var(--serif);font-weight:500;font-size:22px}
.talk span{font-size:var(--t-small);color:var(--indigo-soft)}
.talk a:hover b{text-decoration:underline;text-underline-offset:5px;text-decoration-thickness:1px}

/* ---------- footer ---------- */
footer.site{background:var(--foot-bg);color:var(--foot-text);padding-top:clamp(72px,8vw,112px);padding-bottom:calc(104px + env(safe-area-inset-bottom,0px));font-size:15px}
.foot-grid{display:grid;grid-template-columns:1.5fr 1fr 1fr 1fr;gap:40px}
.foot-grid h2{font-size:var(--t-label);letter-spacing:.3em;text-transform:uppercase;font-weight:500;margin:0 0 20px;color:var(--foot-muted)}
.foot-grid ul{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:12px}
.foot-grid a:hover{color:var(--foot-strong);text-decoration:underline;text-underline-offset:4px}
.foot-brand{display:flex;flex-direction:column;gap:20px}
.foot-brand img{height:60px;width:auto}
.foot-brand .tag{font-family:var(--display);font-size:14px;letter-spacing:.14em;color:var(--foot-strong);margin:0;white-space:nowrap}
.foot-brand p.say{margin:0;font-family:var(--serif);font-style:italic;font-size:20px;max-width:28ch}
.foot-base{display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap;margin-top:72px;padding-top:24px;border-top:1px solid rgba(232,235,240,.16);font-size:11px;letter-spacing:.2em;text-transform:uppercase;color:var(--foot-muted)}

/* toast */
.toast{position:fixed;left:50%;bottom:28px;transform:translate(-50%,20px);background:var(--indigo);color:var(--pearl);padding:14px 22px;font-size:14px;z-index:90;opacity:0;pointer-events:none;transition:opacity .3s,transform .3s}
.toast.show{opacity:1;transform:translate(-50%,0)}

/* ---------- responsive ---------- */
@media (max-width:1080px){
  .foot-grid{grid-template-columns:1fr 1fr}
  .collections .rail{grid-auto-columns:44%}
  .mto-steps{grid-template-columns:1fr 1fr;row-gap:36px}
  fieldset{grid-template-columns:1fr 1fr}
}
@media (max-width:860px){
  :root{--section:clamp(72px,16vw,104px)}
  .nav{height:64px;grid-template-columns:1fr auto}
  .nav-main,.nav-right ul{display:none!important}
  .announce{font-size:9.5px;letter-spacing:.2em;padding:9px 12px}
  .nav-right{gap:10px}
  .menu-btn{display:flex}
  .brand img{height:42px}
  .hero{grid-template-columns:1fr;height:calc(100svh - 64px);min-height:560px;max-height:860px}
  .hero .slot.b{display:none}
  .hero .slot img{object-position:50% 18%}
  .fab-grid,.patterns,.next,.split,.split.rev,.intro,.order-top,.form-grid,.size-grid,.faq-grid,.contact-grid{grid-template-columns:1fr}
  .split.rev .slot{order:-1}
  .order-top .left,.form-grid .left,.figure,.look .aside{position:static}
  .study{min-height:280px}
  .collections .rail{grid-auto-columns:82%}
  .bts .rail{grid-auto-columns:80%}
  .lookbook-hero{grid-template-columns:1fr 1fr;height:auto}
  .lookbook-hero .slot{aspect-ratio:3/4}
  .lookbook-hero .slot:first-child{grid-column:1/-1;aspect-ratio:4/5}
  .look,.look.flip{grid-template-columns:1fr}
  .look .main,.look .aside,.look.flip .main,.look.flip .aside{grid-column:1;grid-row:auto}
  .pillars{grid-template-columns:1fr}
  .her-grid{grid-template-columns:1fr;gap:44px}
  .elist li{grid-template-columns:1fr;gap:8px}
  .empty{grid-template-columns:1fr}
  .figure{max-width:420px}
}
@media (max-width:560px){
  .facts-line{flex-direction:column;gap:2px}
  .facts-line i{display:none}
  .an-2{display:none}
  .mto-steps{grid-template-columns:1fr}
  form.order,fieldset{grid-template-columns:1fr 1fr}
  .field.half-m{grid-column:1/-1}
  .foot-grid{grid-template-columns:1fr}
  .steps li{grid-template-columns:44px 1fr}
  .hero-copy .actions{flex-direction:column;gap:18px}
  .sec-head{align-items:flex-start}
}


/* =================== header over the home hero =================== */
header.site{color:var(--indigo)}
.nav-right{gap:clamp(14px,1.8vw,30px)}
.icon-btn{width:36px;height:36px;display:inline-flex;align-items:center;justify-content:center;position:relative;color:inherit;transition:opacity .3s}
.icon-btn:hover{opacity:.6}
.bag-count{position:absolute;top:1px;right:-3px;min-width:17px;height:17px;padding:0 4px;border-radius:9px;background:var(--thread);color:#fff;font-size:10px;font-weight:500;line-height:17px;text-align:center}
.p-index header.site{position:fixed;left:0;right:0;top:0;transition:background .45s ease,color .45s ease,border-color .45s ease}
.p-index .hero{height:clamp(600px,100svh,1100px)}
.hero::before{content:"";position:absolute;inset:0 0 auto 0;height:200px;z-index:1;pointer-events:none;background:linear-gradient(180deg,rgba(15,18,32,.5),rgba(15,18,32,0))}
header.site.over:not(.solid){background:transparent;border-bottom-color:transparent;-webkit-backdrop-filter:none;backdrop-filter:none;color:#F6F3F0}
header.site.over:not(.solid) .logo-l{display:none!important}
header.site.over:not(.solid) .logo-d{display:block!important}
header.site.over:not(.solid) .theme-toggle{border-color:rgba(246,243,240,.45)}
header.site.over:not(.solid) .nav ul.drop{color:var(--indigo)}

/* =================== search =================== */
.scrim{position:fixed;inset:0;z-index:70;background:rgba(15,18,32,.4);opacity:0;transition:opacity .3s}
.scrim.in{opacity:1}
.search-ov{position:fixed;left:0;right:0;top:0;z-index:80;background:var(--pearl);padding:28px 0 40px;box-shadow:0 30px 60px rgba(15,18,32,.12);transform:translateY(-12px);opacity:0;transition:transform .35s var(--ease),opacity .35s}
.search-ov.in{transform:none;opacity:1}
.search-top{display:flex;align-items:center;gap:16px;border-bottom:1px solid var(--indigo);padding-bottom:12px}
.search-top input{flex:1;min-width:0;border:0;background:transparent;font:inherit;font-family:var(--serif);font-size:clamp(22px,2.6vw,32px);color:var(--indigo);padding:4px 0}
.search-top input:focus{outline:none}
.search-top .close{font-size:var(--t-label);font-weight:500;letter-spacing:.28em;text-transform:uppercase;min-height:44px}
.search-sugg{display:flex;flex-wrap:wrap;gap:10px;align-items:center;margin-top:22px}
.search-sugg .label{margin-right:8px}
.search-sugg button{border:1px solid var(--line-strong);border-radius:40px;padding:7px 16px;font-size:14px;transition:background .25s,border-color .25s}
.search-sugg button:hover{border-color:var(--indigo);background:var(--mist)}
.search-res{list-style:none;margin:18px 0 0;padding:0;display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:4px 28px}
.search-res a{display:flex;gap:16px;align-items:center;padding:12px 0;border-bottom:1px solid var(--line)}
.search-res a:hover b{text-decoration:underline;text-underline-offset:4px}
.search-res img{width:52px;height:64px;object-fit:cover;background:#F1F1F3;flex:none}
.search-res .res-dot{width:52px;height:52px;flex:none;border:1px solid var(--line-strong);border-radius:50%;position:relative}
.search-res .res-dot::after{content:"";position:absolute;inset:21px;border-radius:50%;background:var(--thread)}
.search-res b{display:block;font-family:var(--serif);font-weight:500;font-size:20px}
.search-res i{font-style:normal;font-size:14px;color:var(--indigo-soft)}
.search-res .none{padding:18px 0;color:var(--indigo-soft)}

/* =================== bag =================== */
.bag{position:fixed;top:0;right:0;bottom:0;z-index:80;width:min(420px,100vw);background:var(--pearl);box-shadow:-30px 0 60px rgba(15,18,32,.12);transform:translateX(100%);transition:transform .4s var(--ease)}
.bag.in{transform:none}
.bag-inner{height:100%;display:flex;flex-direction:column;padding:26px 28px calc(26px + env(safe-area-inset-bottom,0px))}
.bag-top{display:flex;justify-content:space-between;align-items:center;padding-bottom:18px;border-bottom:1px solid var(--line)}
.bag-top h2{font-family:var(--display);font-weight:400;font-size:20px;letter-spacing:.12em;margin:0}
.bag-top .close{font-size:var(--t-label);font-weight:500;letter-spacing:.28em;text-transform:uppercase;min-height:44px}
.bag-list{list-style:none;margin:0;padding:0;flex:1;overflow-y:auto}
.bag-list li{display:flex;gap:18px;padding:20px 0;border-bottom:1px solid var(--line)}
.bag-list img{width:84px;height:108px;object-fit:contain;background:#F1F1F3;flex:none}
.bag-list b{display:block;font-family:var(--serif);font-weight:500;font-size:21px;letter-spacing:.08em}
.bag-list i{display:block;font-family:var(--serif);font-size:16px;color:var(--indigo-soft)}
.bag-list span{display:block;margin:6px 0 10px;font-family:var(--serif);font-weight:500;font-size:19px;letter-spacing:.06em}
.bag-list button{font-size:11px;font-weight:500;letter-spacing:.24em;text-transform:uppercase;color:var(--dusk);text-decoration:underline;text-underline-offset:4px;min-height:32px}
.bag-empty{display:block!important;text-align:center;padding:60px 0!important;border:0!important}
.bag-empty p{font-family:var(--serif);font-size:24px;margin:0 0 16px}
.bag-foot{padding-top:20px;border-top:1px solid var(--line-strong)}
.bag-total{display:flex;justify-content:space-between;align-items:baseline;font-size:var(--t-label);font-weight:500;letter-spacing:.24em;text-transform:uppercase}
.bag-total b{font-family:var(--serif);font-size:24px;letter-spacing:.06em}
.bag-note{font-size:13px;color:var(--indigo-soft);margin:10px 0 18px}

/* =================== order form: piece picks =================== */
.picks-f{display:block;border:0;padding:0;margin:0}
.pick-legend{font-size:var(--t-label);font-weight:500;letter-spacing:.22em;text-transform:uppercase;color:var(--indigo-soft);display:flex;justify-content:space-between;width:100%;margin-bottom:12px;font-family:var(--sans)}
.pick-sum{letter-spacing:.08em;text-transform:none;font-size:14px;color:var(--indigo)}
.picks{display:grid;grid-template-columns:repeat(5,1fr);gap:10px}
.pick{position:relative;cursor:pointer;display:flex;flex-direction:column;gap:8px;border:1px solid var(--line);padding:8px;transition:border-color .25s,background .25s}
.pick input{position:absolute;opacity:0;width:1px;height:1px}
.pick-img{aspect-ratio:3/4;background:#F1F1F3;overflow:hidden}
.pick-img img{width:100%;height:100%;object-fit:contain}
.pick-t b{display:block;font-family:var(--serif);font-weight:500;font-size:15px;letter-spacing:.06em}
.pick-t i{font-style:normal;font-size:13px;color:var(--indigo-soft)}
.pick:hover{border-color:var(--line-strong)}
.pick:has(input:checked){border-color:var(--indigo);background:var(--mist)}
.pick:has(input:checked)::after{content:"";position:absolute;top:14px;right:14px;width:20px;height:20px;border-radius:50%;background:var(--indigo) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M6 12l4 4 8-8' fill='none' stroke='%23F6F3F0' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/14px no-repeat}
.pick:has(input:focus-visible){outline:1px solid var(--indigo);outline-offset:3px}
.picks-f.bad .pick{border-color:#A2443B}

/* =================== founder + about =================== */
.about{display:grid;grid-template-columns:1fr 1fr;background:var(--ivory);border-top:1px solid var(--line)}
.founder{position:relative;display:block;min-height:clamp(560px,82vh,880px);color:#F6F3F0;overflow:hidden}
.founder .slot{position:absolute;inset:0}
.founder::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(15,18,32,0) 45%,rgba(15,18,32,.72))}
.founder-copy{position:absolute;left:clamp(24px,4vw,56px);bottom:clamp(32px,5vw,64px);z-index:2;display:flex;flex-direction:column;gap:14px;align-items:flex-start}
.founder-copy .label{color:#F6F3F0;opacity:.9}
.founder-name{margin:0 0 12px;font-family:var(--display);font-size:clamp(28px,3vw,42px);letter-spacing:.14em;text-transform:uppercase;line-height:1}
.founder .btn.light{min-height:48px}
.about-copy{padding:clamp(56px,7vw,120px) clamp(28px,6vw,104px);display:flex;flex-direction:column;justify-content:center;gap:26px}
.about-copy .h-editorial{font-size:clamp(34px,4vw,56px)}
.about-facts{list-style:none;margin:6px 0 0;padding:0;display:grid;grid-template-columns:repeat(3,1fr);gap:18px;border-top:1px solid var(--line);padding-top:24px}
.about-facts b{display:block;font-family:var(--serif);font-weight:500;font-size:20px}
.about-facts span{font-size:13px;color:var(--indigo-soft)}
.founder-credit{margin:8px 0 0;font-size:var(--t-label);font-weight:500;letter-spacing:.24em;text-transform:uppercase;color:var(--dusk)}

/* =================== hero film =================== */
.hero.has-video .slot.a,.hero.has-video .slot.b{display:none}
.hero .slot.hv{grid-column:1/-1}
.hv-pause{position:absolute;right:clamp(16px,3vw,40px);bottom:clamp(16px,3vw,40px);z-index:3;color:#F6F3F0;font-size:11px;font-weight:500;letter-spacing:.26em;text-transform:uppercase;border:1px solid rgba(246,243,240,.5);border-radius:40px;padding:8px 16px;min-height:36px}

/* =================== modal (appointments) =================== */
dialog.modal{border:0;padding:0;width:min(720px,calc(100vw - 24px));max-height:calc(100vh - 32px);background:var(--pearl);color:var(--indigo);box-shadow:0 40px 90px rgba(15,18,32,.25)}
dialog.modal::backdrop{background:rgba(15,18,32,.5);-webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px)}
.appt{padding:clamp(28px,5vw,56px);display:flex;flex-direction:column;gap:14px;position:relative}
.appt .h-editorial{font-size:clamp(30px,3.4vw,42px)}
.appt .muted{margin:0 0 10px;max-width:52ch}
.appt-grid{display:grid;grid-template-columns:1fr 1fr;gap:20px 22px;margin-bottom:10px}
.appt-grid>*{min-width:0}
.modal-x{position:absolute;top:18px;right:22px;font-size:var(--t-label);font-weight:500;letter-spacing:.28em;text-transform:uppercase;min-height:44px}

/* =================== Ask Lola =================== */
.ask{position:fixed;right:clamp(14px,2vw,28px);bottom:calc(clamp(14px,2vw,28px) + env(safe-area-inset-bottom,0px));z-index:65;display:flex;flex-direction:column;align-items:flex-end;gap:12px}
.ask-btn{display:inline-flex;align-items:center;gap:10px;background:var(--indigo);color:var(--pearl);border-radius:40px;padding:0 22px;min-height:50px;font-size:11px;font-weight:500;letter-spacing:.26em;text-transform:uppercase;box-shadow:0 14px 34px rgba(15,18,32,.25);transition:transform .3s var(--ease)}
.ask-btn:hover{transform:translateY(-2px)}
.ask.open .ask-btn{display:none}
.ask-panel{width:min(370px,calc(100vw - 28px));height:min(560px,calc(100svh - 100px));background:var(--pearl);border:1px solid var(--line);box-shadow:0 30px 70px rgba(15,18,32,.22);display:flex;flex-direction:column}
.ask-head{display:flex;align-items:center;gap:12px;padding:16px 18px;background:var(--indigo);color:var(--pearl)}
.ask-av{width:36px;height:36px;border-radius:50%;border:1px solid rgba(246,243,240,.5);display:inline-flex;align-items:center;justify-content:center;flex:none}
.ask-head b{display:block;font-family:var(--display);font-weight:400;font-size:15px;letter-spacing:.14em}
.ask-head span{font-size:12px;opacity:.8}
.ask-x{margin-left:auto;color:var(--pearl);font-size:26px;line-height:1;width:40px;height:40px}
.ask-log{flex:1;overflow-y:auto;padding:18px;display:flex;flex-direction:column;gap:10px}
.msg{max-width:86%;padding:11px 14px;font-size:14.5px;line-height:1.55}
.msg.bot{background:var(--mist);align-self:flex-start;border-radius:2px 14px 14px 14px}
.msg.me{background:var(--indigo);color:var(--pearl);align-self:flex-end;border-radius:14px 2px 14px 14px}
.msg a{text-decoration:underline;text-underline-offset:3px}
.ask-chips{display:flex;gap:8px;overflow-x:auto;padding:10px 14px;border-top:1px solid var(--line);scrollbar-width:none}
.ask-chips::-webkit-scrollbar{display:none}
.ask-chips button{flex:none;border:1px solid var(--line-strong);border-radius:40px;padding:6px 13px;font-size:13px;white-space:nowrap}
.ask-chips button:hover{border-color:var(--indigo);background:var(--mist)}
.ask-form{display:flex;border-top:1px solid var(--line)}
.ask-form input{flex:1;min-width:0;border:0;background:transparent;font:inherit;font-size:15px;padding:14px 16px;color:var(--indigo)}
.ask-form input:focus{outline:none}
.ask-form button{width:52px;color:var(--indigo)}
html[data-mode="dark"] .ask-btn,html[data-mode="dark"] .ask-head,html[data-mode="dark"] .msg.me{background:#2E3654;color:#EFE9E4}
html[data-mode="dark"] .ask-x{color:#EFE9E4}

/* =================== sizing chart =================== */
.chart{padding-block:0 var(--section)}
.chart-head{display:flex;flex-direction:column;gap:16px;max-width:640px;margin-bottom:32px}
.chart-head .muted{margin:0}
.table-wrap{overflow-x:auto}
.size-table{width:100%;border-collapse:collapse;min-width:520px;font-size:15px}
.size-table th,.size-table td{text-align:left;padding:16px 12px;border-bottom:1px solid var(--line)}
.size-table thead th{font-size:var(--t-label);font-weight:500;letter-spacing:.22em;text-transform:uppercase;color:var(--dusk);border-bottom-color:var(--line-strong)}
.size-table tbody th{font-family:var(--serif);font-weight:500;font-size:20px}
.size-table tbody tr:hover{background:var(--mist)}

/* =================== policies =================== */
.pol-nav{display:flex;flex-wrap:wrap;gap:12px}
.pol-nav a{border:1px solid var(--line-strong);border-radius:40px;padding:8px 18px;font-size:14px}
.pol-nav a:hover{border-color:var(--indigo);background:var(--mist)}
.policy{display:grid;grid-template-columns:.8fr 1.2fr;gap:clamp(28px,6vw,104px);padding-block:clamp(56px,7vw,96px);border-top:1px solid var(--line)}
.policy .h-display{font-size:clamp(26px,2.8vw,36px);position:sticky;top:110px;align-self:start}
.pol-body h3{font-family:var(--serif);font-weight:500;font-size:22px;margin:28px 0 8px}
.pol-body h3:first-child{margin-top:0}
.pol-body p{margin:0;color:var(--indigo-soft);max-width:62ch}
.pol-body a{text-decoration:underline;text-underline-offset:4px}
.foot-base .legal{display:flex;flex-wrap:wrap;gap:8px 22px}
.foot-base .legal a:hover{color:var(--foot-strong)}

/* =================== events two lines =================== */
.lede.two-line{max-width:none}
.empty p{max-width:46ch}

@media (max-width:1080px){
  .picks{grid-template-columns:repeat(3,1fr)}
}
@media (max-width:860px){
  .icon-btn.mark{display:none}
  .nav-right{gap:4px}
  .about{grid-template-columns:1fr}
  .founder{min-height:0;aspect-ratio:4/5}
  .policy{grid-template-columns:1fr}
  .policy .h-display{position:static}
}
@media (max-width:560px){
  .about-facts{grid-template-columns:1fr;gap:12px}
  .appt-grid{grid-template-columns:1fr}
  .picks{grid-template-columns:repeat(2,1fr)}
  .search-res{grid-template-columns:1fr}
}

/* keep the centre menu truly centred */
.nav{position:relative}
.nav-main{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%)}
.nav ul{gap:clamp(16px,1.9vw,30px)}
.nav-right{gap:clamp(8px,1vw,16px)}
.nav-right ul{margin-right:clamp(4px,.8vw,12px)}
@media (max-width:1240px){
  .nav{height:64px;grid-template-columns:1fr auto}
  .nav-main,.nav-right ul{display:none!important}
  .menu-btn{display:flex}
  .brand img{height:44px}
}
.nav-right{grid-column:3}
@media (max-width:1240px){.nav-right{grid-column:2}}
@media (min-width:1241px){
  .nav ul{gap:clamp(14px,1.6vw,26px)}
  .nav ul a,.nav .drop-btn{letter-spacing:.22em}
  .nav-right{gap:4px}
  .nav-right ul{margin-right:10px}
  .icon-btn{width:34px}
}

.hero-title{margin-bottom:.14em}

/* =================== header layout v2 =================== */
header.site > .nav{max-width:none;padding-inline:clamp(28px,4.2vw,72px);display:grid;grid-template-columns:1fr auto 1fr;gap:0}
.nav-main{position:static;transform:none;grid-column:2}
.nav .brand{grid-column:1;justify-self:start}
.nav-right{grid-column:3;justify-self:stretch;display:flex;align-items:center;justify-content:space-between;gap:24px;padding-left:clamp(36px,4.5vw,84px)}
.nav-right ul{margin:0}
.nav-icons{display:flex;align-items:center;gap:6px;margin-left:auto}
.nav-icons .theme-toggle{margin-left:6px}
@media (min-width:1241px){
  .nav ul.nav-center{gap:clamp(22px,2.4vw,40px)}
  .nav-right ul{gap:clamp(22px,2.4vw,40px)}
  .nav ul a,.nav .drop-btn{letter-spacing:.24em}
}
@media (max-width:1240px){
  header.site > .nav{grid-template-columns:1fr auto;padding-inline:clamp(18px,4vw,40px)}
  .nav-right{grid-column:2;padding-left:0}
}
@media (min-width:1241px) and (max-width:1439px){
  .nav-right{padding-left:36px}
  .nav ul.nav-center,.nav-right ul{gap:22px}
  .nav ul a,.nav .drop-btn{letter-spacing:.2em}
}
@media (min-width:1241px){
  .nav-right{padding-left:28px;justify-content:flex-end}
  .nav-right ul{margin-inline:auto}
  .nav-icons{margin-left:0}
}
@media (min-width:1241px){
  .nav-right ul{align-items:center}
  .nav-right ul::before{content:"";width:1px;height:16px;background:currentColor;opacity:.3;margin-right:clamp(14px,1.6vw,28px)}
  .nav ul.nav-center{gap:clamp(20px,2vw,36px)}
}
.nav ul a,.nav .drop-btn{white-space:nowrap}
@media (min-width:1241px){
  .nav-right ul::before{display:none}
  .nav-right ul li:first-child{position:relative;padding-left:clamp(18px,1.8vw,30px)}
  .nav-right ul li:first-child::before{content:"";position:absolute;left:0;top:50%;width:1px;height:16px;margin-top:-8px;background:currentColor;opacity:.3}
}
@media (max-width:1400px){
  header.site > .nav{height:64px;grid-template-columns:1fr auto;padding-inline:clamp(18px,4vw,40px)}
  .nav-main,.nav-right ul{display:none!important}
  .menu-btn{display:flex}
  .brand img{height:44px}
  .nav-right{grid-column:2;padding-left:0}
}

/* Ask Lola: soft palette */
.ask-btn{background:var(--blush);color:#29324E;border:1px solid rgba(41,50,78,.16);box-shadow:0 14px 34px rgba(41,50,78,.14)}
.ask-btn:hover{background:#EAD5CE}
.ask-panel{border-color:rgba(41,50,78,.12)}
.ask-head{background:var(--blush);color:#29324E;border-bottom:1px solid rgba(41,50,78,.1)}
.ask-av{border-color:rgba(41,50,78,.35);color:#29324E}
.ask-head span{opacity:.75}
.ask-x{color:#29324E}
.msg.bot{background:var(--ivory);border:1px solid var(--line)}
.msg.me{background:var(--sage);color:#29324E}
.ask-chips button:hover{background:var(--blush);border-color:rgba(41,50,78,.35)}
.ask-form button{color:var(--thread-ink)}
html[data-mode="dark"] .ask-btn,html[data-mode="dark"] .ask-head{background:#2A2233;color:#EFE9E4;border-color:rgba(239,233,228,.14)}
html[data-mode="dark"] .ask-av{border-color:rgba(239,233,228,.35);color:#EFE9E4}
html[data-mode="dark"] .ask-x{color:#EFE9E4}
html[data-mode="dark"] .msg.me{background:#2F3A33;color:#EFE9E4}

.msg-chip{display:inline-block;margin:6px 6px 0 0;border:1px solid var(--line-strong);border-radius:40px;padding:4px 11px;font-size:13px;background:transparent}
.msg-chip:hover{background:var(--blush)}

/* =================== compact header (phones, tablets, small laptops): same order as desktop =================== */
.m-only{display:none!important}
@media (max-width:1400px){
  header.site > .nav{height:auto;grid-template-columns:1fr auto;grid-template-rows:60px auto;row-gap:0;padding-inline:clamp(16px,4vw,40px)}
  .nav .brand{grid-column:1;grid-row:1}
  .nav-right{display:contents}
  .nav-right ul,.menu-btn{display:none!important}
  .nav-icons{grid-column:2;grid-row:1;justify-self:end;gap:2px}
  .icon-btn.mark{display:inline-flex}
  .brand img{height:40px}
  .nav-main{display:block!important;grid-column:1/-1;grid-row:2;position:static;transform:none;overflow-x:auto;scrollbar-width:none;-webkit-overflow-scrolling:touch;margin-inline:calc(-1 * clamp(16px,4vw,40px));padding:2px clamp(16px,4vw,40px) 10px}
  .nav-main::-webkit-scrollbar{display:none}
  .nav ul.nav-center{display:flex!important;justify-content:safe center;gap:20px;width:max-content;min-width:100%;flex-wrap:nowrap}
  .nav ul.nav-center .m-only{display:list-item!important}
  .nav ul.nav-center > li{list-style:none}
  .nav ul.nav-center a,.nav .drop-btn{font-size:10px;letter-spacing:.18em;padding-block:6px}
  .nav .caret,.nav ul.drop{display:none!important}
  .nav ul.nav-center li.m-div{position:relative;padding-left:20px}
  .nav ul.nav-center li.m-div::before{content:"";position:absolute;left:0;top:50%;width:1px;height:12px;margin-top:-6px;background:currentColor;opacity:.3}
  html{scroll-padding-top:120px}
}
@media (min-width:700px) and (max-width:1400px){
  .nav ul.nav-center{gap:clamp(24px,3vw,40px)}
  .nav ul.nav-center a,.nav .drop-btn{font-size:11px;letter-spacing:.22em}
}
@media (max-width:699px){
  .nav ul.nav-center{gap:13px}
  .nav ul.nav-center a,.nav .drop-btn{font-size:9px;letter-spacing:.12em}
  .nav ul.nav-center li.m-div{padding-left:13px}
  .nav-main{padding-inline:14px;margin-inline:calc(-1 * clamp(16px,4vw,40px))}
  .nav-main::after{content:"";position:sticky;right:0}
}
@media (max-width:420px){
  .nav ul.nav-center{gap:10px}
  .nav ul.nav-center a,.nav .drop-btn{letter-spacing:.09em}
  .nav ul.nav-center li.m-div{padding-left:10px}
  .nav-main{padding-inline:12px}
}
@media (max-width:380px){
  .nav ul.nav-center a,.nav .drop-btn{font-size:8.5px;letter-spacing:.06em}
  .nav ul.nav-center{gap:8px}
}
@media (max-width:699px){ .nav-icons .theme-toggle{width:32px;height:32px} .icon-btn{width:34px;height:34px} }

/* statement + collections heading order */
.statement .h-editorial{margin:0 auto}
.statement .facts-line{margin-top:30px;font-size:13px}
.collections .sec-head .stack{gap:14px}

/* =================== desktop header: positions matched to the reference (1920px) =================== */
@media (min-width:1401px){
  header.site > .nav{display:flex;align-items:center;height:88px;max-width:none;padding:0 7.3vw 0 6.67vw;gap:0}
  .nav .brand img{height:62px}
  .nav-main{position:static;transform:none;margin-left:auto}
  .nav ul.nav-center{gap:clamp(26px,2.05vw,40px)}
  .nav ul a,.nav .drop-btn{font-size:11px;letter-spacing:.2em}
  .nav-right{display:flex;align-items:center;padding:0;gap:0}
  .nav-right ul{margin:0 0 0 clamp(64px,4.9vw,94px);gap:clamp(34px,2.45vw,47px)}
  .nav-right ul li:first-child{padding-left:clamp(64px,4.9vw,94px)}
  .nav-right ul li:first-child::before{height:18px;margin-top:-9px}
  .nav-icons{margin-left:clamp(72px,5.4vw,104px);gap:clamp(18px,1.35vw,26px)}
  .icon-btn{width:22px;height:36px}
  .nav-icons .theme-toggle{width:40px;height:40px;margin-left:0}
}
@media (min-width:1401px){
  .nav ul a,.nav .drop-btn{font-size:clamp(11px,.625vw,12px);letter-spacing:.24em}
  .nav .brand img{height:60px}
}
@media (min-width:1401px){ .nav .drop-btn{gap:12px} }
@media (min-width:1401px){ .nav ul.nav-center{gap:clamp(26px,2.2vw,44px)} }

.nowrap{white-space:nowrap}
@media (max-width:600px){.ask-btn{width:52px;min-height:52px;padding:0;justify-content:center;gap:0}.ask-btn span{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}}
/* Look rows: details column matches the main photo, top to bottom */
@media (min-width:1025px){
  .look{align-items:stretch}
  .look .aside{position:static;top:auto;gap:22px;min-height:0}
  .look .second{flex:1 1 0;min-height:140px}
  .look .second .slot,.look .second:has(> :only-child) .slot{aspect-ratio:auto;height:100%}
  .look .second .slot img{width:100%;height:100%;object-fit:cover}
  .look .second .slot.contain img{object-fit:contain}
  .look .aside > .actions{margin-top:auto}
}
.look h2{font-size:clamp(22px,1.9vw,28px);letter-spacing:.1em}
.look .price{font-size:clamp(22px,1.9vw,28px);letter-spacing:.06em}
.look .title-row{align-items:baseline}
.look .second .slot.contain{background:#fff}
@media (min-width:1025px) and (max-width:1240px){
  .look .aside{gap:16px}
  .look .second{min-height:110px}
  .look ul.details li{padding:9px 0;font-size:14px}
  .look p.desc{font-size:15px}
}
@media (min-width:861px) and (max-width:1024px){
  .look,.look.flip{grid-template-columns:1fr}
  .look .main,.look .aside,.look.flip .main,.look.flip .aside{grid-column:1;grid-row:auto}
  .look .aside{position:static}
  .look .second .slot,.look .second:has(> :only-child) .slot{aspect-ratio:3/4}
  .look .second:has(> :only-child) .slot{aspect-ratio:4/3}
}
@media (max-width:860px){.look .second:has(> :only-child) .slot{aspect-ratio:4/3}}
#afefe-5 .second .slot.contain{background:#EFF9FB}

/* ===== Uniform buttons: one shape, brand blue, white text, in light and dark ===== */
.btn,.btn.ghost,.btn.light,#letterBtn{background:#29324E;color:#fff;border:1px solid #29324E;border-radius:0;min-height:52px;padding:0 32px;font-size:var(--t-label);font-weight:500;letter-spacing:.28em;text-transform:uppercase;display:inline-flex;align-items:center;justify-content:center;gap:12px;box-shadow:none;backdrop-filter:none;-webkit-backdrop-filter:none}
.btn:hover,.btn.ghost:hover,.btn.light:hover,#letterBtn:hover{background:#3A4468;color:#fff;border-color:#3A4468}
html[data-mode="dark"] .btn,html[data-mode="dark"] .btn.ghost,html[data-mode="dark"] .btn.light,html[data-mode="dark"] #letterBtn{background:#29324E;color:#fff;border-color:rgba(239,233,228,.28)}
html[data-mode="dark"] .btn:hover,html[data-mode="dark"] .btn.ghost:hover,html[data-mode="dark"] .btn.light:hover,html[data-mode="dark"] #letterBtn:hover{background:#3A4468;border-color:rgba(239,233,228,.45)}
.btn:focus-visible,#letterBtn:focus-visible{outline:2px solid var(--thread);outline-offset:3px}

/* ===== Ask Lola: headset icon, white on brand blue, all screen sizes ===== */
.ask-btn,.ask-btn:hover,html[data-mode="dark"] .ask-btn{width:56px;height:56px;min-height:56px;padding:0;gap:0;justify-content:center;align-items:center;border-radius:50%;background:#29324E;color:#fff;border:1px solid #29324E;box-shadow:0 12px 30px rgba(15,18,32,.28)}
html[data-mode="dark"] .ask-btn{border-color:rgba(239,233,228,.28)}
.ask-btn:hover{background:#3A4468}
.ask-btn svg{width:24px;height:24px;display:block}
.ask-btn span{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}

/* ===== Rating stars: grey until hovered or chosen, then brand blue ===== */
.stars button.on{color:#29324E}
html[data-mode="dark"] .stars button.on{color:#9FB0E0}
.founder .btn.light,.letter #letterBtn{min-height:52px}

/* ===== Join the Lobby: email line level with the Appointments line, consent note below ===== */
.letter .legal-note{margin:14px 0 0;max-width:520px;font-size:12.5px;line-height:1.6;color:var(--dusk)}
.letter .legal-note a{color:var(--indigo-soft);text-decoration:underline;text-underline-offset:3px;text-decoration-thickness:1px}
.letter .legal-note a:hover{color:var(--indigo)}
.letter .note:empty{display:none}
@media (min-width:1025px){
  .contact-grid{align-items:stretch}
  .letter{display:flex;flex-direction:column}
  .letter-foot{margin-top:auto;position:relative}
  .letter-foot form{margin-top:30px}
  .letter-after{position:absolute;left:0;right:0;top:100%}
}
@media (max-width:600px){
  .size-table{min-width:0;font-size:13.5px}
  .size-table th,.size-table td{padding:14px 5px}
  .size-table thead th{letter-spacing:.12em;font-size:10px;line-height:1.4;vertical-align:bottom}
  .size-table tbody th{font-size:18px}
  .size-table td{white-space:nowrap}
}
@media (max-width:600px){.size-table .u{display:none}.size-table th,.size-table td{padding:14px 4px}.size-table tbody th{font-size:17px}}

/* ===== Order form: grouped measurements, every box on one line ===== */
fieldset.meas{grid-template-columns:repeat(3,minmax(0,1fr));gap:20px 20px;align-items:end}
fieldset.meas legend{margin-bottom:0}
.meas-note{grid-column:1/-1;margin:-4px 0 0;font-size:15px;color:var(--indigo-soft);line-height:1.6}
.meas-note .link{margin-left:6px}
.mgroup{grid-column:1/-1;margin:14px 0 -6px;font-size:var(--t-label);font-weight:500;letter-spacing:.24em;text-transform:uppercase;color:var(--thread-ink);padding-bottom:8px;border-bottom:1px solid var(--line)}
fieldset.meas .field{gap:6px}
fieldset.meas .field label{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;letter-spacing:.16em}
fieldset.meas .req{font-weight:500;color:var(--thread-ink);margin-left:3px}
fieldset.meas .field .err:empty{display:none}
@media (max-width:560px){
  fieldset.meas{grid-template-columns:repeat(2,minmax(0,1fr));gap:18px 16px}
  fieldset.meas .field label{letter-spacing:.12em}
}

/* ===== Order form buttons: equal size, one straight row ===== */
form.order .form-actions{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}
form.order .form-actions .btn{width:100%;padding:0 12px;letter-spacing:.2em;white-space:nowrap}
form.order .form-actions .btn[hidden]{display:none}
form.order .form-actions:has(.btn[hidden]){grid-template-columns:repeat(2,minmax(0,1fr))}
@media (max-width:560px){
  form.order .form-actions,form.order .form-actions:has(.btn[hidden]){grid-template-columns:1fr}
}

/* ===== Measuring guide ===== */
.guide{margin-top:clamp(56px,7vw,96px);padding-top:clamp(40px,5vw,64px);border-top:1px solid var(--line-strong);display:grid;grid-template-columns:.8fr 1.2fr;gap:clamp(32px,6vw,104px);align-items:start}
.guide>*{min-width:0}
.guide-head{display:flex;flex-direction:column;gap:14px;position:sticky;top:120px}
.guide-head .h-editorial{font-size:clamp(30px,3.4vw,44px);margin:0}
.guide-list details{border-top:1px solid var(--line)}
.guide-list details:last-child{border-bottom:1px solid var(--line)}
.guide-list summary{list-style:none;cursor:pointer;display:flex;justify-content:space-between;align-items:center;gap:20px;padding:22px 0;font-family:var(--serif);font-weight:500;font-size:22px;line-height:1.3}
.guide-list summary::-webkit-details-marker{display:none}
.guide-list summary::after{content:"";width:12px;height:12px;flex:none;background:linear-gradient(currentColor,currentColor) center/100% 1px no-repeat,linear-gradient(currentColor,currentColor) center/1px 100% no-repeat;transition:transform .3s}
.guide-list details[open] summary::after{transform:rotate(45deg)}
.guide-list .ans{padding:0 0 26px;color:var(--indigo-soft)}
.guide-list .ans p{margin:14px 0 0}
.guide-list ul{margin:0;padding:0;list-style:none;display:grid;gap:10px}
.guide-list ul li{display:flex;gap:14px}
.guide-list ul li::before{content:"";width:14px;height:1px;background:var(--thread);margin-top:13px;flex:none}
.guide-list dl{margin:0;display:grid;grid-template-columns:minmax(150px,.42fr) 1fr;gap:0}
.guide-list dt,.guide-list dd{margin:0;padding:12px 0;border-top:1px solid var(--line)}
.guide-list dl>dt:first-of-type,.guide-list dl>dt:first-of-type+dd{border-top:0;padding-top:4px}
.guide-list dt{font-size:var(--t-label);font-weight:500;letter-spacing:.2em;text-transform:uppercase;color:var(--indigo);padding-right:16px;line-height:1.9}
@media (max-width:860px){
  .guide{grid-template-columns:1fr}
  .guide-head{position:static}
}
@media (max-width:560px){
  .guide-list dl{grid-template-columns:1fr}
  .guide-list dt{padding-bottom:2px}
  .guide-list dd{border-top:0;padding-top:0}
  .guide-list dl>dt:first-of-type+dd{padding-top:0}
}

/* ===== Size chart: 7 columns ===== */
@media (max-width:600px){
  .size-table th,.size-table td{padding:14px 3px}
  .size-table thead th{letter-spacing:.06em;font-size:9.5px}
  .size-table{font-size:13px}
}
@media (min-width:561px) and (max-width:1080px){
  form.order .form-actions .btn{padding:0 8px;font-size:10px;letter-spacing:.1em}
}
fieldset.meas input[type=number]{-moz-appearance:textfield;appearance:textfield}
fieldset.meas input[type=number]::-webkit-outer-spin-button,fieldset.meas input[type=number]::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}

/* ===== Measurements header: calmer spacing, smaller unit pill ===== */
fieldset.meas legend{align-items:center;margin-bottom:10px}
fieldset.meas .unit-toggle button{min-height:26px;padding:0 11px;font-size:10.5px;letter-spacing:.16em;line-height:1}
.meas-note{margin:0 0 6px;max-width:58ch;font-size:15px;line-height:1.7}
.meas-note a{color:var(--indigo);text-decoration:underline;text-underline-offset:3px;text-decoration-thickness:1px}
.meas-note a:hover{color:var(--thread-ink)}
.req{font-weight:500;color:var(--thread-ink);margin-left:3px}
.mgroup-f{margin-top:18px}
.req-note{grid-column:1/-1;margin:4px 0 -6px;font-size:13px;color:var(--dusk)}

/* ===== Kind words: review cards ===== */
.reviews[hidden]{display:none}
.rev-head{display:flex;flex-direction:column;align-items:center;gap:16px;margin-bottom:clamp(40px,5vw,64px)}
.rev-head .h-editorial{font-size:clamp(32px,3.8vw,52px)}
.rev-rail{display:grid;grid-auto-flow:column;grid-auto-columns:calc((100% - 2 * clamp(24px,3vw,56px)) / 3);gap:clamp(24px,3vw,56px);overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none;text-align:left;outline-offset:6px}
.rev-rail::-webkit-scrollbar{display:none}
.rev-card{margin:0;scroll-snap-align:start;border-top:1px solid var(--line-strong);padding-top:22px;display:flex;flex-direction:column;gap:14px}
.rev-q{font-family:var(--serif);font-size:44px;line-height:.6;height:22px;color:var(--thread)}
.rev-card blockquote{margin:0;font-family:var(--serif);font-style:italic;font-weight:400;font-size:clamp(22px,1.9vw,26px);line-height:1.45;color:var(--indigo)}
.rev-card figcaption{display:flex;flex-direction:column;gap:8px;margin-top:auto;padding-top:14px}
.rev-card figcaption b{font-size:var(--t-label);font-weight:500;letter-spacing:.24em;text-transform:uppercase;color:var(--indigo)}
.rev-card figcaption span{font-size:13px;color:var(--indigo-soft)}
.rev-foot{margin-top:clamp(40px,5vw,64px);padding-top:clamp(32px,4vw,48px);border-top:1px solid var(--line-strong);display:flex;justify-content:center;align-items:center;gap:20px 36px;flex-wrap:wrap}
.rev-foot p{margin:0;max-width:44ch;color:var(--indigo-soft)}
@media (max-width:860px){.rev-rail{grid-auto-columns:78%}}

/* ===== Currency switcher ===== */
.cur{position:relative;display:inline-flex}
.cur-btn{display:inline-flex;align-items:center;gap:6px;min-height:40px;padding:0 6px;font-size:11px;font-weight:500;letter-spacing:.14em;color:inherit;white-space:nowrap}
.cur-btn svg{opacity:.7;transition:transform .2s}
.cur-btn[aria-expanded="true"] svg{transform:rotate(180deg)}
.cur-menu{position:absolute;top:calc(100% + 8px);right:-8px;z-index:80;width:236px;background:var(--pearl);color:var(--indigo);border:1px solid var(--line);box-shadow:0 18px 44px rgba(15,18,32,.16);padding:8px;text-align:left}
.cur-menu[hidden]{display:none}
.cur-list{display:block;margin:0;padding:0}
.cur-menu [role=option]{display:flex;align-items:baseline;gap:8px;padding:10px 10px;cursor:pointer;font-size:12px;font-weight:500;letter-spacing:.14em}
.cur-menu [role=option] b{width:14px;font-weight:500}
.cur-menu [role=option] span{margin-left:auto;font-size:12px;font-weight:400;letter-spacing:0;color:var(--dusk)}
.cur-menu [role=option]:hover,.cur-menu [role=option]:focus{background:var(--mist);outline:none}
.cur-menu [role=option][aria-selected="true"]{background:var(--mist)}
.cur-menu [role=option][aria-selected="true"]::after{content:"";width:6px;height:6px;border-radius:50%;background:var(--thread);align-self:center;margin-left:6px}
.cur-menu p{margin:6px 10px 6px;padding-top:10px;border-top:1px solid var(--line);font-size:11.5px;line-height:1.55;color:var(--dusk)}

/* ===== Footer subscribe: plain text, no box ===== */
.letter #letterBtn,html[data-mode="dark"] .letter #letterBtn{background:transparent;border:0;color:var(--indigo);padding:0 2px 0 18px;min-height:48px;letter-spacing:.28em;font-size:var(--t-label);font-weight:500}
.letter #letterBtn:hover,html[data-mode="dark"] .letter #letterBtn:hover{background:transparent;color:var(--thread-ink)}

/* ===== Events empty state matches the page intro ===== */
.empty p{font-size:var(--t-lede);line-height:1.5;max-width:46ch}

/* ===== Atelier signature ===== */
.sig-block .signature{font-size:34px}
.sig-block .founder-credit{margin-top:10px}

/* ===== Ask Lola: tidy header, blush chat button ===== */
.ask-head>div{display:flex;align-items:center;min-height:36px}
.ask-head>div span{font-size:13.5px;line-height:1.4;opacity:.85}
.ask-btn,.ask-btn:hover,html[data-mode="dark"] .ask-btn{background:var(--blush);color:var(--indigo);border:1px solid rgba(41,50,78,.14)}
.ask-btn:hover{filter:brightness(.97)}
html[data-mode="dark"] .ask-btn{border-color:rgba(239,233,228,.18)}

/* ===== Newsletter pop-up: editorial split ===== */
.nl-pop{border:0;padding:0;width:min(720px,calc(100vw - 32px));max-height:calc(100dvh - 32px);overflow:auto;background:var(--pearl);color:var(--indigo);box-shadow:0 40px 100px rgba(15,18,32,.38);opacity:0;transform:translateY(14px);transition:opacity .45s var(--ease),transform .45s var(--ease)}
.nl-pop.in{opacity:1;transform:none}
.nl-pop::backdrop{background:rgba(15,18,32,.55);backdrop-filter:blur(2px)}
.nl-pop:focus{outline:none}
.nl-grid{display:grid;grid-template-columns:minmax(0,.92fr) minmax(0,1fr);min-height:460px}
.nl-img{position:relative;overflow:hidden;background:var(--mist)}
.nl-img picture,.nl-img img{display:block;width:100%;height:100%}
.nl-img img{object-fit:cover;object-position:50% 30%}
.nl-body{position:relative;display:flex;flex-direction:column;justify-content:center;gap:0;padding:56px 44px 40px}
.nl-body .label{color:var(--thread-ink);margin-bottom:18px}
.nl-pop h2{font-family:var(--serif);font-style:italic;font-weight:400;font-size:clamp(34px,4vw,44px);line-height:1.05;letter-spacing:0;margin:0 0 16px}
.nl-sub{margin:0 0 30px;font-size:15px;line-height:1.7;color:var(--indigo-soft);max-width:30ch}
.nl-pop form{display:flex;flex-direction:column;gap:18px}
.nl-pop input[type=email]{font:inherit;font-size:16px;color:var(--indigo);background:transparent;border:0;border-bottom:1px solid var(--line-strong);border-radius:0;padding:10px 0;min-height:46px}
.nl-pop input[type=email]:focus{outline:none;border-bottom-color:var(--indigo)}
.nl-pop input::placeholder{color:var(--dusk)}
.nl-pop .btn{width:100%}
.nl-note{margin:14px 0 0;font-size:14px}
.nl-note:empty{display:none}
.nl-note em{font-family:var(--serif);font-style:italic;font-size:1.15em}
.nl-legal{margin:18px 0 0;font-size:11.5px;line-height:1.6;color:var(--dusk)}
.nl-legal a{color:var(--indigo-soft);text-decoration:underline;text-underline-offset:3px}
.nl-x{position:absolute;top:14px;right:14px;width:40px;height:40px;display:inline-flex;align-items:center;justify-content:center;color:var(--indigo-soft)}
.nl-x:hover{color:var(--indigo)}
@media (max-width:640px){
  .nl-pop{width:min(400px,calc(100vw - 32px))}
  .nl-grid{grid-template-columns:1fr;min-height:0}
  .nl-img{height:190px}
  .nl-body{padding:32px 26px 28px}
  .nl-pop h2{font-size:34px}
  .nl-sub{margin-bottom:22px}
  .nl-x{top:-182px;right:8px;color:#F6F3F0;background:rgba(15,18,32,.35);border-radius:50%}
}

/* ===== Hero: outlined Discover the collection ===== */
.hero .btn.hero-cta,.hero-copy .btn.hero-cta,.btn.light.hero-cta,html[data-mode="dark"] .btn.light.hero-cta{background:transparent;color:#F6F3F0;border:1px solid rgba(246,243,240,.85)}
.btn.light.hero-cta:hover,html[data-mode="dark"] .btn.light.hero-cta:hover{background:rgba(246,243,240,.12);color:#fff;border-color:#fff}

/* ===== Footer: Legal column ===== */
.foot-grid{grid-template-columns:1.4fr 1fr 1fr 1fr 1fr}
@media (max-width:1100px){.foot-grid{grid-template-columns:1fr 1fr 1fr}.foot-brand{grid-column:1/-1}}
@media (max-width:560px){.foot-grid{grid-template-columns:1fr 1fr}}

/* ===== Collection: size and quantity ===== */
.buy{display:flex;flex-direction:column;gap:12px}
.buy-row{display:flex;justify-content:space-between;align-items:baseline;gap:16px}
.buy-label{font-size:var(--t-label);font-weight:500;letter-spacing:.24em;text-transform:uppercase;color:var(--dusk)}
.buy-label b{font-weight:500;color:var(--indigo);margin-left:8px;letter-spacing:.16em}
.buy-guide{font-size:var(--t-label);font-weight:500;letter-spacing:.24em;text-transform:uppercase;color:var(--indigo);text-decoration:underline;text-underline-offset:5px;text-decoration-thickness:1px}
.buy-guide:hover{color:var(--thread-ink)}
.sizes{display:flex;flex-wrap:wrap;gap:8px}
.sizes button{min-width:44px;height:40px;padding:0 10px;border:1px solid var(--line-strong);background:transparent;color:var(--indigo);font-family:var(--sans);font-size:13px;letter-spacing:.06em;transition:border-color .2s,background .2s,color .2s}
.sizes button:hover{border-color:var(--indigo)}
.sizes button[aria-checked="true"]{border-color:var(--indigo);box-shadow:inset 0 0 0 1px var(--indigo)}
.sizes button:focus-visible{outline:2px solid var(--thread);outline-offset:2px}
.sizes .sz-custom{padding:0 14px;font-size:11px;letter-spacing:.2em;text-transform:uppercase}
.buy-err{margin:-4px 0 0;font-size:13px;color:#A2443B;min-height:0}
.buy-err:empty{display:none}
html[data-mode="dark"] .buy-err{color:#F0A49A}
.buy.bad .sizes button{border-color:#A2443B}
.buy-qty-row{align-items:center;margin-top:2px}
.qty{display:inline-flex;align-items:center;border:1px solid var(--line-strong);height:40px}
.qty button{width:40px;height:100%;font-size:18px;line-height:1;color:var(--indigo);display:inline-flex;align-items:center;justify-content:center}
.qty button:disabled{opacity:.35;cursor:default}
.qty button:not(:disabled):hover{background:var(--mist)}
.qty output{min-width:34px;text-align:center;font-size:14px;color:var(--indigo)}
.bag-meta{display:block;font-style:normal;font-size:12px;letter-spacing:.06em;color:var(--dusk);margin:2px 0}
.pick-x{display:block;font-size:11px;letter-spacing:.06em;color:var(--thread-ink);min-height:0}
.pick-x:empty{display:none}
@media (min-width:1025px){
  .look .main .slot{aspect-ratio:2/3}
  .look .main .slot img{object-fit:cover;object-position:50% 30%}
}
.sizes{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:8px}
.sizes button{min-width:0;width:100%}
.sizes .sz-custom{grid-column:span 2;padding:0 8px;font-size:10.5px;letter-spacing:.18em}
.buy-label b:empty{display:none}
@media (min-width:1025px){
  #afefe-5 .main .slot{background:#F0EFF4}
  #afefe-5 .main .slot img{object-fit:contain;object-position:50% 50%}
}
@media (max-width:560px){
  .look .actions{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:10px}
  .look .actions .btn{width:100%;padding:0 8px;letter-spacing:.16em;font-size:10.5px;white-space:nowrap}
  .look .actions .copy-link{grid-column:1/-1;justify-self:start;margin-top:4px}
}
.ask-btn svg{width:30px;height:30px}
/* chat button: near-white circle, soft shadow, heart speech bubble (matches reference) */
.ask-btn,.ask-btn:hover,html[data-mode="dark"] .ask-btn{background:#F9F9FB;color:#2B2D35;border:0;box-shadow:0 6px 22px rgba(15,18,32,.22)}
.ask-btn:hover{background:#fff}
.ask-btn svg{width:36px;height:36px}
/* v48: sizes XS-XL in one row, facts consistent, look title moved up */
.sizes{grid-template-columns:repeat(5,minmax(0,1fr)) minmax(0,2fr)}
.sizes .sz-custom{grid-column:auto}
.facts{display:grid;grid-template-columns:repeat(3,max-content);column-gap:clamp(32px,5vw,64px);align-items:end}
.facts b{font-family:var(--serif);font-weight:500;font-size:30px;line-height:1;font-variant-numeric:lining-nums;font-feature-settings:"lnum" 1}
.facts span{margin-top:6px}
.rev-foot p{text-align:center}
.size-table tbody th.sz-l{vertical-align:middle;border-right:1px solid var(--line)}
.size-table tbody tr:hover{background:transparent}
.look .actions{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:12px}
.look .actions .btn{width:100%;white-space:nowrap}
.look .actions .copy-link{grid-column:1/-1;justify-self:start;margin-top:6px}
.pre-note{grid-column:1/-1;margin:0 0 6px;max-width:58ch;font-size:15px;line-height:1.7;color:var(--indigo);padding-left:14px;border-left:2px solid var(--thread)}
/* order form: one row per piece with its size and a quantity stepper */
.pick-x{display:none}
.pick-lines{list-style:none;margin:14px 0 0;padding:0;border-top:1px solid var(--line)}
.pick-lines li{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:12px 0;border-bottom:1px solid var(--line)}
.pick-lines .pl-n{display:flex;align-items:baseline;gap:14px;min-width:0}
.pick-lines .pl-n b{font-family:var(--serif);font-weight:500;font-size:17px;letter-spacing:.06em}
.pick-lines .pl-n small{font-size:var(--t-label);font-weight:500;letter-spacing:.2em;text-transform:uppercase;color:var(--indigo-soft)}
#f-daddr{min-height:76px}
/* ===== v52: collection as product tiles ===== */
.tiles{padding-block:clamp(36px,5vw,72px) clamp(56px,7vw,96px)}
.tile-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(40px,4vw,56px) clamp(18px,2.2vw,32px);align-items:stretch}
.tile{display:flex;flex-direction:column;min-width:0;scroll-margin-top:120px}
.t-media{position:relative;aspect-ratio:3/4;background:#F1F1F3;overflow:hidden}
.t-track{display:flex;height:100%;overflow-x:auto;overflow-y:hidden;scroll-snap-type:x mandatory;scrollbar-width:none;overscroll-behavior-x:contain}
.t-track::-webkit-scrollbar{display:none}
.slide{flex:0 0 100%;height:100%;scroll-snap-align:start;scroll-snap-stop:always;cursor:zoom-in}
.slide picture{display:block;width:100%;height:100%}
.slide img{display:block;width:100%;height:100%;object-fit:cover}
.slide.contain img{object-fit:contain;background:#F1F1F3}
.t-ctrl{position:absolute;left:12px;right:12px;top:50%;transform:translateY(-50%);display:flex;justify-content:space-between;align-items:center;pointer-events:none}
.t-pill,.t-next{pointer-events:auto;display:inline-flex;align-items:center;height:40px;background:rgba(249,249,251,.94);color:#2B2D35;box-shadow:0 2px 10px rgba(15,18,32,.10)}
.t-pill button,.t-next{width:40px;height:40px;display:inline-flex;align-items:center;justify-content:center;color:#2B2D35}
.t-pill{padding-right:14px}
.t-count{font-size:13px;letter-spacing:.06em;font-variant-numeric:tabular-nums;white-space:nowrap}
.t-pill button:focus-visible,.t-next:focus-visible{outline:2px solid var(--thread);outline-offset:2px}
.t-body{display:flex;flex-direction:column;gap:10px;padding-top:18px;flex:1}
.t-head{display:flex;justify-content:space-between;align-items:baseline;gap:14px}
.t-head h2{margin:0;font-size:clamp(20px,1.6vw,23px);line-height:1.2}
.t-head .price{font-size:clamp(19px,1.5vw,22px);letter-spacing:.06em}
.t-sum{margin:0;font-size:15px;line-height:1.6;color:var(--indigo-soft)}
.tile .buy{margin-top:auto;padding-top:10px;gap:10px}
.t-actions{display:grid;grid-template-columns:minmax(0,1fr) 52px;gap:8px;margin-top:4px}
.t-actions .btn{width:100%;padding:0 12px;white-space:nowrap}
.fav{width:52px;height:52px;display:inline-flex;align-items:center;justify-content:center;border:1px solid var(--line-strong);color:var(--indigo);background:transparent;transition:border-color .2s,color .2s}
.fav:hover{border-color:var(--indigo)}
.fav svg{fill:none}
.fav[aria-pressed="true"] svg{fill:currentColor}
.fav:focus-visible{outline:2px solid var(--thread);outline-offset:2px}
@media (max-width:1100px){.tile-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:700px){.tile-grid{grid-template-columns:minmax(0,1fr);gap:56px}.t-ctrl{left:10px;right:10px}}
/* order form size picker */
.f-size{grid-column:1/-1;display:flex;flex-direction:column;gap:10px;margin-bottom:6px}
.f-size-hint{margin:0;font-size:13px;color:var(--dusk)}
/* unsubscribed page: styled like the welcome email (always light) */
body.p-unsubscribed{background:#F0E0DA !important;color:#29324E !important;min-height:100vh;margin:0}
.uns{display:flex;justify-content:center;padding:clamp(24px,5vw,64px) 12px}
.uns-card{width:100%;max-width:600px;background:#F6F3F0;color:#29324E}
.uns-logo{display:block;width:97px;margin:0 auto;padding:36px 0 28px}
.uns-logo img{display:block;width:97px;height:60px}
.uns-body{padding:20px 56px 0;font-family:var(--sans)}
.uns-body p{margin:0 0 18px;font-size:16px;line-height:1.7;color:#29324E}
.uns-kicker{font-size:11px !important;letter-spacing:3px;text-transform:uppercase;color:#4A5476 !important;margin-bottom:14px !important}
.uns-h{margin:0 0 24px;font-family:var(--serif);font-weight:400;font-size:38px;line-height:1.2;color:#29324E}
.uns-btn{display:inline-block;margin:12px 0 40px;padding:16px 30px;background:#29324E;color:#F6F3F0;font-size:12px;letter-spacing:3px;text-transform:uppercase;text-decoration:none}
.uns-btn:hover{background:#3A4468;color:#fff}
.uns-btn:focus-visible{outline:2px solid #B0915F;outline-offset:3px}
.uns-sign{font-family:var(--serif) !important;font-style:italic;font-size:20px !important;line-height:1.5 !important;color:#4A5476 !important;margin:0 !important}
.uns-tag{font-family:var(--display) !important;font-size:14px !important;letter-spacing:3px;margin:18px 0 40px !important}
.uns-note{padding:14px 18px;background:#F0E0DA;font-size:13px !important;line-height:1.6 !important;color:#4A5476 !important;margin:0 0 36px !important}
.uns-note a{color:#29324E;text-decoration:underline;text-underline-offset:3px}
.uns-line{height:1px;background:#B0915F;margin:0 56px}
.uns-foot{margin:0;padding:28px 56px 36px;text-align:center;font-family:var(--sans);font-size:12px;line-height:1.7;color:#8390AD}
.uns-foot a{color:#8390AD}
@media (max-width:620px){.uns{padding:0}.uns-body{padding:16px 24px 0}.uns-line{margin:0 24px}.uns-foot{padding:24px 24px 32px}.uns-h{font-size:30px}}

/* v54: tile images cross-fade (no arrows), dots, made-to-order line */
.t-track{display:block;position:relative;overflow:hidden;scroll-snap-type:none}
.slide{position:absolute;inset:0;opacity:0;transition:opacity 1.1s ease;pointer-events:none}
.slide.on{opacity:1;pointer-events:auto}
.t-ctrl{display:none}
.t-dots{position:absolute;left:0;right:0;bottom:14px;display:flex;justify-content:center;gap:4px}
.t-dots button{width:26px;height:20px;padding:0;background:none;display:flex;align-items:center;justify-content:center;cursor:pointer}
.t-dots button::before{content:"";display:block;width:18px;height:2px;background:rgba(255,255,255,.55);box-shadow:0 0 3px rgba(15,18,32,.35);transition:background .3s}
.t-dots button[aria-current="true"]::before{background:#fff}
.t-dots button:focus-visible{outline:2px solid #fff;outline-offset:1px}
.t-made{margin:-4px 0 0;font-family:var(--serif);font-style:italic;font-size:16px;line-height:1.4;color:var(--thread-ink)}
.unsub-sign{font-family:var(--serif);font-style:italic;font-size:20px;line-height:1.4;color:var(--indigo)}
@media (prefers-reduced-motion: reduce){.slide{transition:none}}
/* v55: tighter, wider contact band */
.contact{padding-block:clamp(56px,6.5vw,96px)}
.contact > .wrap{max-width:1520px}
@media (min-width:1025px){
  .contact-grid{grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(40px,8vw,160px)}
  .contact-grid > .reveal.d1{justify-self:end;width:100%;max-width:480px}
}
.letter{max-width:500px}
.contact .join-h{font-size:clamp(28px,2.6vw,38px)}
.contact .letter > .muted{margin-top:14px !important;font-size:15px;line-height:1.6}
.letter form,.letter .legal-note{max-width:500px}
.letter-foot form{margin-top:24px}
.letter input{padding:12px 2px;font-size:15px}
.letter .legal-note{font-size:12px}
.talk{margin-top:16px !important}
.talk a,.talk div{padding:15px 0}
.talk b{font-size:19px}
.talk span{font-size:14px}
.contact .letter > .muted{max-width:52ch !important}
@media (min-width:1025px){.contact{padding-bottom:clamp(96px,8vw,128px)}}
@media (max-width:620px){body.p-unsubscribed{background:#F6F3F0 !important}}
/* v60: collapsible measurement groups */
fieldset.meas .mg{grid-column:1/-1;border-bottom:1px solid var(--line)}
fieldset.meas .mg[data-g="main"]{border-bottom:0}
.mg-h{width:100%;display:flex;align-items:center;justify-content:space-between;gap:16px;padding:16px 0 12px;background:none;border:0;border-bottom:1px solid var(--line);color:var(--thread-ink);font-size:var(--t-label);font-weight:500;letter-spacing:.24em;text-transform:uppercase;text-align:left;cursor:pointer}
.mg:not([data-g="main"]) .mg-h{border-bottom:0;color:var(--indigo-soft)}
.mg-h:hover{color:var(--indigo)}
.mg-h:focus-visible{outline:2px solid var(--thread);outline-offset:2px}
.mg-c:empty{display:none}
.mg-i{position:relative;flex:0 0 14px;width:14px;height:14px;transition:transform .3s ease}
.mg-i::before,.mg-i::after{content:"";position:absolute;left:0;top:50%;width:14px;height:1.4px;margin-top:-.7px;background:currentColor}
.mg-i::after{transform:rotate(90deg)}
.mg-h[aria-expanded="true"] .mg-i{transform:rotate(45deg)}
.mg-b{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px;padding:18px 0 24px}
.mg-b[hidden]{display:none}
.mg[data-g="main"] .mg-b{padding-bottom:12px}
.mg-more{grid-column:1/-1;margin:18px 0 0;font-size:13px;color:var(--dusk)}
@media (max-width:560px){.mg-b{grid-template-columns:repeat(2,minmax(0,1fr));gap:18px 16px}}
fieldset.meas .mg:not([data-g="main"]) + .mg{margin-top:-20px}
.mg:not([data-g="main"]) .mg-h[aria-expanded="true"]{border-bottom:1px solid var(--line);color:var(--indigo)}
/* v61: quiet collection heading */
.coll-head{padding-top:clamp(28px,4vw,56px)}
.coll-head .h-display{margin-top:20px}
.coll-series{margin:10px 0 0;font-family:var(--serif);font-style:italic;font-size:clamp(18px,1.6vw,21px);letter-spacing:.02em;color:var(--indigo-soft)}
.coll-head + .tiles{padding-top:clamp(28px,3.5vw,48px)}
/* ===== v62 header: logo centred, links on the left, icons on the right, no divider line ===== */
.nav-right ul::before,.nav-right ul li:first-child::before,.nav ul.nav-center li.m-div::before{display:none!important;content:none!important}
.nav-right ul li:first-child,.nav ul.nav-center li.m-div{padding-left:0!important}
@media (min-width:1401px){
  header.site > .nav{display:grid!important;grid-template-columns:minmax(0,1fr) auto minmax(0,1fr)!important;align-items:center;height:88px;padding:0 clamp(32px,4vw,80px)!important;gap:0 28px!important}
  .nav .brand{grid-column:2!important;grid-row:1;justify-self:center!important}
  .nav .brand img{height:58px}
  .nav-main{grid-column:1!important;grid-row:1;justify-self:start!important;position:static!important;transform:none!important;margin:0!important}
  .nav ul.nav-center{gap:clamp(18px,1.45vw,34px)!important}
  .nav ul.nav-center .m-only{display:list-item!important}
  .nav ul a,.nav .drop-btn{font-size:11px!important;letter-spacing:.17em!important}
  .nav-right{display:contents!important}
  .nav-right > ul{display:none!important}
  .nav-icons{grid-column:3!important;grid-row:1;justify-self:end!important;margin:0!important;gap:clamp(12px,1.2vw,24px)!important}
}
@media (min-width:700px) and (max-width:1400px){
  header.site > .nav{grid-template-columns:minmax(0,1fr) auto minmax(0,1fr)!important}
  .nav .brand{grid-column:2!important;grid-row:1!important;justify-self:center!important}
  .nav-icons{grid-column:3!important;grid-row:1!important;justify-self:end!important}
}
/* v63 */
.pick-legend{justify-content:flex-end}
.pick-legend .pick-sum:empty{display:none}
.size-lede{max-width:none!important}
@media (min-width:1025px){.size-lede{font-size:clamp(19px,1.45vw,23px)!important;line-height:1.55!important}}
@media (max-width:1024px){.d-br{display:none}}
/* header ≥1401: links left, logo centre, How to order · Contact | currency · search · bag · mode on the right */
@media (min-width:1401px){
  .nav ul.nav-center .m-only{display:none!important}
  .nav-right{display:flex!important;grid-column:3!important;grid-row:1;justify-self:end!important;align-items:center;gap:0!important;padding:0!important}
  .nav-right > ul{display:flex!important;align-items:center;margin:0!important;gap:clamp(18px,1.45vw,34px)!important}
  .nav-right > ul::after{content:""!important;display:block!important;width:1px;height:18px;background:currentColor;opacity:.3;margin-left:0}
  .nav-icons{grid-column:auto!important;margin-left:clamp(12px,1.1vw,26px)!important}
}
/* v64: Collections heading sits closer to its tiles; single centred hero button */
.collections .sec-head{margin-bottom:clamp(24px,2.4vw,34px)!important;padding-top:clamp(16px,2vw,32px);gap:18px}
.hero-copy .actions{justify-content:center}
@media (max-width:700px){.hero-copy{padding-bottom:96px!important}}
/* v65: lightbox arrows in white circles beside the picture, soft fade between pictures */
.lb-inner img{transition:opacity .45s ease}
.lb-inner img.fading{opacity:0}
.lb .p,.lb .n{right:auto;width:44px;height:44px;min-width:44px;min-height:44px;padding:0;border-radius:50%;background:rgba(249,249,251,.94);color:#2B2D35;box-shadow:0 4px 16px rgba(0,0,0,.25);transition:background .2s,transform .2s,left .2s}
.lb .p:hover,.lb .n:hover{background:#fff}
.lb .p svg,.lb .n svg{width:18px;height:18px}
.lb .p:focus-visible,.lb .n:focus-visible{outline:2px solid #B0915F;outline-offset:3px}
@media (prefers-reduced-motion: reduce){.lb-inner img{transition:none}}
.lb .n{left:calc(100% - 54px)}
dialog.lb:focus{outline:none}
/* v66: bag shows quantity per piece and a total that stays in view */
.bag-list li > div{flex:1;min-width:0}
.bag-row{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-top:2px}
.bag-list .qty{display:inline-flex;align-items:center;margin:0;height:36px;font-family:var(--sans);font-size:14px;font-weight:400;letter-spacing:0}
.bag-list .qty button{width:34px;height:100%;min-height:0;text-decoration:none;letter-spacing:0;font-size:16px;color:var(--indigo)}
.bag-list .qty output{min-width:28px;text-align:center}
.bag-total{padding-bottom:12px;border-bottom:1px solid var(--line)}
body:has(#bagPanel:not([hidden])) .toast{bottom:auto;top:24px;transform:translate(-50%,-12px)} body:has(#bagPanel:not([hidden])) .toast.show{transform:translate(-50%,0)}
/* v68: webmail fallbacks under the email buttons */
.form-note .mail-alt{display:block;margin-top:6px;font-size:13px;color:var(--indigo-soft)}
.form-note .mail-alt a,.form-note .mail-copy{color:inherit;text-decoration:underline;text-underline-offset:3px;font:inherit;padding:0;background:none;border:0;cursor:pointer}
.form-note .mail-alt a:hover,.form-note .mail-copy:hover{color:var(--indigo)}
/* v69: one-click forms */
.hp{position:absolute!important;left:-10000px;width:1px;height:1px;overflow:hidden}
form.order.done > :not(.order-done){display:none!important}
.order-done{grid-column:1/-1;display:flex;flex-direction:column;gap:16px;padding:clamp(28px,4vw,48px);background:var(--mist);border-left:2px solid var(--thread)}
.order-done[hidden]{display:none}
.order-done h3{margin:0;font-size:clamp(28px,3vw,38px)}
.order-done p{margin:0;max-width:56ch;line-height:1.7}
.order-done .link{align-self:flex-start;margin-top:6px}
.appt.done .appt-grid,.appt.done .form-actions,.appt.done > .muted{display:none}
.form-note .done-msg{display:block;font-size:16px;line-height:1.7}
.form-note .done-msg b{font-family:var(--serif);font-weight:500;font-size:22px;display:block;margin-bottom:4px}
button.btn:disabled{opacity:.7;cursor:progress}
/* ===== v70 ===== */
/* collection title: even spacing on H.E.R. and a cleaner left edge */
.coll-title{letter-spacing:.06em;margin-left:-.04em}
.coll-title .her{letter-spacing:.03em;white-space:nowrap}
/* reviews: every review on one line on desktop, slightly smaller type */
@media (min-width:861px){
  .rev-rail{grid-auto-columns:minmax(0,1fr);overflow:visible}
  .rev-card blockquote{font-size:clamp(18px,1.4vw,22px)}
  .reviews .rail-ctrl{display:none}
}
.rev-foot p{max-width:none}
/* search: slimmer bar */
.search-ov{padding:16px 0 22px}
.search-top{padding-bottom:8px;gap:12px}
.search-top svg{width:18px;height:18px}
.search-top input{font-size:clamp(18px,1.6vw,22px);padding:2px 0}
.search-top .close{min-height:36px}
.search-sugg{margin-top:14px;gap:8px}
.search-sugg button{padding:5px 13px;font-size:13px}
/* lightbox: two stacked pictures cross-fade */
.lb-inner{padding:0}
.lb-inner img{position:absolute;top:64px;bottom:64px;left:clamp(12px,6vw,96px);right:clamp(12px,6vw,96px);margin:auto;max-width:calc(100% - 2 * clamp(12px,6vw,96px));max-height:calc(100% - 128px);width:auto;height:auto;opacity:0;transition:opacity .9s ease-in-out}
.lb-inner img.on{opacity:1}
.lb-inner img:not([src]){display:none}
/* tile buttons: outline only; the border thickens on hover */
.tile .t-actions .btn{background:transparent;color:var(--indigo);border:1px solid var(--indigo);box-shadow:none;transition:box-shadow .2s ease}
.tile .t-actions .btn:hover,.tile .t-actions .btn:focus-visible{background:transparent;color:var(--indigo);box-shadow:inset 0 0 0 1px var(--indigo)}
.tile .fav{border-color:var(--indigo);transition:box-shadow .2s ease}
.tile .fav:hover{box-shadow:inset 0 0 0 1px var(--indigo)}
html[data-mode="dark"] .tile .t-actions .btn,html[data-mode="dark"] .tile .t-actions .btn:hover{background:transparent;color:var(--indigo);border-color:var(--indigo)}
/* order page headings: same style, smaller */
.p-order .order-top h1.h-display,.p-order #formH{font-size:clamp(30px,3vw,42px)}
/* colour hint */
.field-hint{display:block;margin-top:6px;font-size:13px;color:var(--dusk)}
/* order received pop-up */
dialog.done-dlg{width:min(560px,calc(100vw - 24px))}
.done-in{position:relative;display:flex;flex-direction:column;gap:16px;padding:clamp(32px,5vw,56px)}
.done-in .label{color:var(--thread-ink)}
.done-in h2{margin:0;font-size:clamp(30px,3.4vw,40px)}
.done-in p{margin:0;line-height:1.7;color:var(--indigo-soft)}
.done-in p b{color:var(--indigo);font-weight:500}
.done-actions{margin-top:8px}
.p-events .page-head h1.h-display{font-size:clamp(30px,3.4vw,46px)}
#eventList .empty{display:flex!important;flex-direction:column!important;align-items:flex-start!important;gap:22px!important}#eventList .empty .btn{width:auto!important;align-self:flex-start!important}

/* v71: centred order button, events alignment, instant click transitions */
form.order .form-actions{display:flex!important;justify-content:center}
form.order .form-actions .btn{width:auto;min-width:min(280px,100%);padding:0 40px}
.p-events .wrap{max-width:none}
.p-events .page-head .stack-lg{max-width:none}
@media (min-width:900px){.p-events .ev-lede,#eventList .empty p{white-space:nowrap}}
.lb-inner img{transition:opacity .45s ease}
.t-media.quick .slide{transition-duration:.45s}
@media (min-width:1401px){.p-events .wrap{padding-inline:clamp(32px,4vw,80px)}}
form.order .req-note,form.order .form-note{text-align:center;grid-column:1/-1}

/* v74: quantity on the collection tiles, in the same row as the order and bag buttons */
.tile .t-actions{grid-template-columns:auto minmax(0,1fr) 52px;align-items:stretch}
.tile .t-qty{height:52px;border:1px solid var(--indigo);background:transparent}
.tile .t-qty button{width:32px;font-size:17px}
.tile .t-qty output{min-width:26px;font-size:14px;font-variant-numeric:lining-nums tabular-nums}
.tile .t-qty button:not(:disabled):hover{background:transparent;box-shadow:inset 0 0 0 1px var(--indigo)}
.tile .t-qty button:focus-visible{outline:2px solid var(--thread);outline-offset:-2px}
html[data-mode="dark"] .tile .t-qty{border-color:var(--indigo)}
@media (max-width:359px){
  .tile .t-actions{grid-template-columns:auto minmax(0,1fr) 52px}
  .tile .t-actions .btn{grid-column:1/-1;grid-row:1}
  .tile .t-qty{grid-column:1;grid-row:2}
  .tile .t-actions .fav{grid-column:3;grid-row:2}
}


/* v76: order bar on the collection page, for ordering every piece in the bag at once */
.order-bar{position:fixed;left:0;right:0;bottom:0;z-index:60;background:var(--pearl);border-top:1px solid var(--line-strong);box-shadow:0 -8px 28px rgba(20,24,40,.08);padding-bottom:env(safe-area-inset-bottom,0px);animation:obIn .35s ease}
.order-bar[hidden]{display:none}
@keyframes obIn{from{transform:translateY(100%)}to{transform:none}}
.ob-in{max-width:var(--max,1240px);margin:0 auto;padding:12px var(--gutter,24px);display:flex;align-items:center;justify-content:space-between;gap:16px}
.ob-info{display:flex;align-items:baseline;gap:14px;background:none;border:0;padding:0;color:var(--indigo);cursor:pointer;text-align:left}
.ob-info b{font-size:var(--t-label);font-weight:500;letter-spacing:.24em;text-transform:uppercase;text-decoration:underline;text-underline-offset:5px;text-decoration-thickness:1px}
.ob-info span{font-family:var(--serif);font-size:22px;font-variant-numeric:lining-nums}
.order-bar .btn{min-width:240px}
html.has-ob .ask{bottom:calc(88px + env(safe-area-inset-bottom,0px))}
html.has-ob body.p-waves-of-her{padding-bottom:76px}
@media (max-width:600px){
  .ob-in{padding:10px 16px;gap:12px}
  .ob-info{flex-direction:column;gap:2px}
  .ob-info b{font-size:10px;letter-spacing:.16em}
  .ob-info span{font-size:19px}
  .order-bar .btn{min-width:0;flex:1 1 auto;max-width:200px;padding:0 14px;letter-spacing:.18em}
}
html.has-ob .toast{bottom:calc(100px + env(safe-area-inset-bottom,0px))}
@media (max-width:600px){html.has-ob .ask{bottom:calc(100px + env(safe-area-inset-bottom,0px))}html.has-ob .toast{bottom:calc(112px + env(safe-area-inset-bottom,0px))}}
