:root{
  --bg:#f3efe8;--bg2:#e9e3d9;--accent:#b0304a;--text:#1d1a24;--muted:#6b6470;--paper:#1d1a24;--paper-ink:#f1ece4;--band:#23336b;--band-ink:#eef0fa;--on-accent:#ffffff;
  --serif:'InterDisplay','Inter',system-ui,sans-serif;--sans:'InterText','Inter',system-ui,sans-serif;
  --radius:999px;--line:color-mix(in srgb,var(--text) 14%,transparent);--ease:cubic-bezier(.16,1,.3,1);
}
body{font:400 15.5px/1.65 var(--sans);letter-spacing:-.005em;overflow-x:hidden}
h1,h2,h3{font-family:var(--serif);font-weight:300;letter-spacing:-.045em;line-height:.92}
em{font-family:var(--serif);font-style:italic;font-weight:300}
.wrap{max-width:1320px}
.small{font-size:13px;letter-spacing:.02em;color:var(--muted)}

/* ---------- silk swatch: shown always, photo fades in on top when it loads ---------- */
.fab{position:relative;overflow:hidden;--c1:#9b1d36;--c2:#5d0f22;--z:#d9b25c;
  background:
    radial-gradient(circle at 50% 50%,var(--z) 0 1.4px,transparent 2.2px) 0 0/34px 34px,
    repeating-linear-gradient(90deg,rgba(255,255,255,.05) 0 1px,transparent 1px 3px),
    repeating-linear-gradient(0deg,rgba(0,0,0,.06) 0 1px,transparent 1px 3px),
    linear-gradient(112deg,var(--c2) 0%,var(--c1) 26%,color-mix(in srgb,var(--c1) 70%,#fff) 42%,var(--c1) 55%,var(--c2) 78%,var(--c1) 100%)}
.fab:before{content:'';position:absolute;inset:0;z-index:0;background:repeating-linear-gradient(98deg,transparent 0 70px,rgba(0,0,0,.18) 110px,rgba(255,255,255,.08) 135px,transparent 170px);mix-blend-mode:multiply}
.fab:after{content:'';position:absolute;left:0;right:0;bottom:0;height:22%;z-index:0;
  background:
    linear-gradient(var(--z),var(--z)) 0 10%/100% 2px no-repeat,
    linear-gradient(var(--z),var(--z)) 0 88%/100% 2px no-repeat,
    repeating-linear-gradient(45deg,transparent 0 7px,rgba(0,0,0,.22) 7px 8px),
    repeating-linear-gradient(-45deg,transparent 0 7px,rgba(0,0,0,.22) 7px 8px),
    linear-gradient(180deg,color-mix(in srgb,var(--z) 70%,#fff),var(--z) 40%,color-mix(in srgb,var(--z) 70%,#000));
  box-shadow:0 -6px 18px rgba(0,0,0,.25)}
.fab img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:0;transition:opacity 1s,transform 1.4s var(--ease);z-index:2}
.fab img.ok{opacity:1}

/* ---------- nav ---------- */
.k-nav{background:color-mix(in srgb,var(--bg) 80%,transparent);border-bottom:1px solid var(--line)}
.k-nav .wrap{height:74px}
.logo{font-family:var(--serif);font-weight:400;font-size:26px;letter-spacing:-.04em;gap:6px}
.logo em{color:var(--accent);font-size:26px}
.links{gap:30px}.links a{font-size:14px;letter-spacing:0}
.bagbtn{border:1px solid var(--text);background:transparent;border-radius:999px;padding:10px 16px;font:500 14px var(--sans);color:var(--text);cursor:pointer;display:flex;gap:8px;align-items:center}
.bagbtn i{font-style:normal;background:var(--accent);color:#fff;border-radius:999px;min-width:22px;height:22px;display:grid;place-items:center;font-size:12px}
.btn{font:500 14.5px/1 var(--sans);letter-spacing:-.01em;padding:17px 28px}
.btn.ghost{background:transparent;color:inherit;border-color:currentColor}
.btn.ghost:hover{background:currentColor}
.btn.ghost:hover span{color:var(--bg)}

/* ---------- hero ---------- */
.hero{position:relative;height:calc(100vh - 116px);min-height:620px;max-height:940px;overflow:hidden;color:#fff;background:var(--paper)}
.hero .fab{position:absolute;inset:0}
.hero .fab img{transform:scale(1.08)}
.hero .fab img.ok{transform:scale(1)}
.hero .shade{position:absolute;inset:0;z-index:3;background:linear-gradient(0deg,rgba(15,10,18,.7),rgba(15,10,18,.05) 55%),linear-gradient(90deg,rgba(15,10,18,.35),transparent 60%)}
.hero .in{position:absolute;inset:0;z-index:4;display:flex;flex-direction:column;justify-content:flex-end;padding:0 4vw 4.4vw}
.hero h1{font-size:clamp(76px,13.4vw,236px);letter-spacing:-.065em;line-height:.84}
.line{display:block;overflow:hidden;padding-bottom:.06em}
.line>span{display:inline-block;transform:translateY(105%);animation:up 1.3s var(--ease) forwards}
.line:nth-child(2)>span{animation-delay:.12s}.line:nth-child(3)>span{animation-delay:.24s}
@keyframes up{to{transform:none}}
.hero .row{display:flex;justify-content:space-between;align-items:flex-end;gap:30px;margin-top:34px;opacity:0;animation:fade 1s .9s forwards}
@keyframes fade{to{opacity:1}}
.hero .row p{max-width:36ch;color:#ece6e0;font-size:16px}
.hero .btn{background:#fff;border-color:#fff;color:var(--text)}
.hero .btn:hover{background:transparent;color:#fff}
.scroll{font-size:12.5px;letter-spacing:.14em;text-transform:uppercase;display:flex;align-items:center;gap:10px}
.scroll:after{content:'';width:1px;height:46px;background:#fff;animation:drop 2s infinite}
@keyframes drop{0%{transform:scaleY(0);transform-origin:top}50%{transform:scaleY(1);transform-origin:top}51%{transform-origin:bottom}100%{transform:scaleY(0);transform-origin:bottom}}

/* ---------- marquee ---------- */
.mq{background:var(--band);color:var(--band-ink);overflow:hidden;padding:26px 0;white-space:nowrap}
.mq .t{display:inline-flex;gap:46px;animation:mq 34s linear infinite;font-family:var(--serif);font-weight:300;font-size:clamp(40px,6vw,88px);letter-spacing:-.05em;line-height:1}
.mq .t span:nth-child(even){font-style:italic;color:transparent;-webkit-text-stroke:1px var(--band-ink)}
.mq .t i{font-style:normal;color:var(--accent);filter:brightness(1.4)}
@keyframes mq{to{transform:translateX(-50%)}}

/* ---------- statement with inline images ---------- */
.stmt{padding:140px 0 120px}
.stmt p{font-family:var(--serif);font-weight:300;font-size:clamp(34px,4.6vw,72px);line-height:1.12;letter-spacing:-.04em;max-width:22ch}
.stmt .pill{display:inline-block;width:1.9em;height:.9em;border-radius:999px;vertical-align:-.08em;margin:0 .12em}
.stmt .pill.fab:after{display:none}
.stmt em{color:var(--accent)}
.stmt .meta{display:flex;gap:60px;margin-top:60px;padding-top:26px;border-top:1px solid var(--line);flex-wrap:wrap}
.stmt .meta b{display:block;font-family:var(--serif);font-weight:300;font-size:54px;letter-spacing:-.05em;line-height:1}

/* ---------- horizontal lookbook ---------- */
.hs{position:relative;height:320vh}
.hs .pin{position:sticky;top:74px;height:calc(100vh - 74px);overflow:hidden;display:flex;flex-direction:column;justify-content:center}
.hs .head{display:flex;justify-content:space-between;align-items:flex-end;padding:0 4vw;margin-bottom:34px;gap:30px}
.hs h2{font-size:clamp(48px,7vw,110px)}
.hs .prog{width:200px;height:1px;background:var(--line);position:relative}
.hs .prog b{position:absolute;left:0;top:-1px;height:3px;background:var(--accent);width:0}
.track{display:flex;gap:28px;padding:0 4vw;will-change:transform}
.lb{flex:none;width:min(380px,72vw);color:var(--text)}
.lb .fab{aspect-ratio:3/4.1;border-radius:6px}
.lb:nth-child(even){margin-top:70px}
.lb .cap{display:flex;justify-content:space-between;align-items:baseline;gap:14px;margin-top:16px}
.lb h3{font-size:28px;letter-spacing:-.04em;line-height:1.05}
.lb .w{font-size:13px;color:var(--muted);margin-top:4px}
.lb .p{font-family:var(--serif);font-size:22px;letter-spacing:-.03em;white-space:nowrap}
.add{position:absolute;left:14px;right:14px;bottom:14px;z-index:5;border:0;border-radius:999px;padding:14px;font:500 14px var(--sans);background:rgba(255,255,255,.94);color:var(--text);cursor:pointer;transform:translateY(14px);opacity:0;transition:all .4s var(--ease)}
.lb:hover .add,.pc:hover .add,.add:focus-visible{transform:none;opacity:1}
.add[aria-pressed=true]{background:var(--text);color:#fff;opacity:1;transform:none}

/* ---------- sticky weaves ---------- */
.wv .wrap{display:grid;grid-template-columns:1fr 1fr;gap:6vw}
.wv .vis{position:sticky;top:110px;height:calc(100vh - 150px);border-radius:8px;overflow:hidden}
.wv .vis .fab{position:absolute;inset:0;opacity:0;transition:opacity .9s}
.wv .vis .fab.on{opacity:1}
.wv .vis .no{position:absolute;left:24px;top:22px;z-index:5;color:#fff;font:500 13px var(--sans);letter-spacing:.1em;mix-blend-mode:difference}
.wv .txt{padding:6vh 0 20vh}
.wv .st{min-height:72vh;display:flex;flex-direction:column;justify-content:center;opacity:.25;transition:opacity .6s}
.wv .st.on{opacity:1}
.wv .st small{font:500 13px var(--sans);letter-spacing:.1em;color:var(--accent);text-transform:uppercase}
.wv .st h3{font-size:clamp(48px,6vw,96px);margin:16px 0 22px}
.wv .st p{font-size:18px;max-width:40ch;color:color-mix(in srgb,var(--text) 75%,var(--bg))}
.wv .st dl{display:grid;grid-template-columns:auto 1fr;gap:6px 22px;margin-top:26px;font-size:14px}
.wv .st dt{color:var(--muted)}

/* ---------- editorial quote ---------- */
.quote{padding:150px 0;text-align:center}
.quote blockquote{font-family:var(--serif);font-weight:300;font-size:clamp(36px,5vw,78px);letter-spacing:-.045em;line-height:1.05;max-width:18ch;margin:0 auto}
.quote cite{display:block;font-style:normal;margin-top:30px;font-size:14px;color:var(--muted)}

/* ---------- studio split ---------- */
.studio{display:grid;grid-template-columns:1.1fr .9fr;min-height:86vh}
.studio .fab{min-height:520px}
.studio .tx{background:var(--paper);color:var(--paper-ink);padding:8vw 6vw;display:flex;flex-direction:column;justify-content:center}
.studio h2{font-size:clamp(48px,6vw,96px)}
.studio p{margin:26px 0 36px;max-width:40ch;color:color-mix(in srgb,var(--paper-ink) 75%,var(--paper));font-size:17px}
.studio .btn{align-self:flex-start;background:var(--paper-ink);color:var(--paper);border-color:var(--paper-ink)}

/* image reveal mask on scroll */
.mask{clip-path:inset(0 0 100% 0);transition:clip-path 1.4s var(--ease)}
.mask.in{clip-path:inset(0 0 0 0)}

/* ---------- inner pages ---------- */
.ph1{padding:90px 4vw 50px;display:grid;grid-template-columns:1.3fr .7fr;gap:40px;align-items:end;border-bottom:1px solid var(--line)}
.ph1 h1{font-size:clamp(70px,11vw,190px);letter-spacing:-.065em;line-height:.84}
.ph1 p{font-size:17px;max-width:38ch;color:color-mix(in srgb,var(--text) 75%,var(--bg))}
.filters{display:flex;justify-content:space-between;align-items:center;gap:20px;flex-wrap:wrap;padding:26px 4vw;position:sticky;top:74px;z-index:20;background:color-mix(in srgb,var(--bg) 92%,transparent);backdrop-filter:blur(10px);border-bottom:1px solid var(--line)}
.chips{display:flex;gap:6px;flex-wrap:wrap}
.chips button{font:400 14px var(--sans);padding:10px 16px;border-radius:999px;border:1px solid var(--line);background:transparent;color:var(--text);cursor:pointer}
.chips button[aria-pressed=true]{background:var(--text);border-color:var(--text);color:var(--bg)}
.sw{display:flex;gap:8px;align-items:center}
.sw button{width:30px;height:30px;border-radius:50%;border:2px solid var(--bg);box-shadow:0 0 0 1px var(--line);cursor:pointer;padding:0}
.sw button[aria-pressed=true]{box-shadow:0 0 0 2px var(--text)}
.sw .all{width:auto;padding:0 12px;border-radius:999px;font:400 13px var(--sans);background:transparent;color:var(--text)}
.shop{display:grid;grid-template-columns:repeat(3,1fr);gap:60px 28px;padding:50px 4vw 100px}
.pc{position:relative}
.pc .fab{aspect-ratio:3/4;border-radius:6px}
.pc:nth-child(3n+2){margin-top:90px}
.pc .cap{display:flex;justify-content:space-between;gap:14px;margin-top:16px;align-items:baseline}
.pc h3{font-size:28px;letter-spacing:-.04em;line-height:1.05}
.pc .w{font-size:13px;color:var(--muted);margin-top:4px}
.pc .p{font-family:var(--serif);font-size:22px;letter-spacing:-.03em;white-space:nowrap}
.empty{grid-column:1/-1;text-align:center;padding:80px 0;color:var(--muted)}

/* ---------- drawer ---------- */
.drawer{position:fixed;top:0;right:0;bottom:0;width:min(440px,100vw);background:var(--bg);z-index:10001;transform:translateX(100%);transition:transform .6s var(--ease);display:flex;flex-direction:column;box-shadow:-30px 0 60px rgba(0,0,0,.18)}
.drawer.open{transform:none}
.scrim{position:fixed;inset:0;background:rgba(15,10,18,.4);z-index:10000;opacity:0;pointer-events:none;transition:opacity .5s}
.scrim.open{opacity:1;pointer-events:auto}
.dh{display:flex;justify-content:space-between;align-items:center;padding:24px 28px;border-bottom:1px solid var(--line)}
.dh h3{font-size:34px}
.dh button{border:0;background:none;font:500 14px var(--sans);cursor:pointer;color:var(--text);text-decoration:underline;text-underline-offset:3px}
.drawer ul{list-style:none;flex:1;overflow:auto;padding:10px 28px}
.drawer li{display:grid;grid-template-columns:64px 1fr auto;gap:16px;align-items:center;padding:16px 0;border-bottom:1px solid var(--line)}
.drawer li .fab{width:64px;height:80px;border-radius:4px}
.drawer li b{font-family:var(--serif);font-weight:400;font-size:19px;letter-spacing:-.03em;display:block}
.drawer li small{color:var(--muted)}
.drawer li button{border:0;background:none;color:var(--muted);cursor:pointer;font-size:13px;text-decoration:underline}
.drawer .none{color:var(--muted);padding:40px 0;border:0;display:block}
.df{padding:24px 28px;border-top:1px solid var(--line)}
.df .tot{display:flex;justify-content:space-between;align-items:baseline;margin-bottom:18px}
.df .tot b{font-family:var(--serif);font-weight:300;font-size:40px;letter-spacing:-.04em}
.df .btn{width:100%}
.df p{font-size:12.5px;color:var(--muted);margin-top:12px}

/* weaves page */
.care{display:grid;grid-template-columns:repeat(4,1fr);gap:0;border-top:1px solid var(--line)}
.care div{padding:30px 26px 0 0}
.care b{display:block;font-family:var(--serif);font-weight:300;font-size:30px;letter-spacing:-.04em;margin-bottom:10px}
.care p{color:var(--muted);font-size:14.5px}

/* styling studio */
.st2{display:grid;grid-template-columns:1fr 400px;gap:60px;align-items:start;padding:60px 4vw 100px}
.grp{border-top:1px solid var(--line);padding:28px 0}
.grp h3{font-size:34px;margin-bottom:16px}
.opts{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}
.opt{border:1px solid var(--line);background:var(--bg);border-radius:14px;padding:18px;text-align:left;cursor:pointer;font:inherit;color:inherit}
.opt[aria-pressed=true]{border-color:var(--text);box-shadow:0 0 0 1px var(--text)}
.opt b{display:block;font-family:var(--serif);font-weight:400;font-size:21px;letter-spacing:-.03em}
.opt small{color:var(--muted)}
.opt .pr{display:block;margin-top:8px;color:var(--accent);font-weight:500}
.summ{position:sticky;top:100px;background:var(--paper);color:var(--paper-ink);border-radius:18px;padding:32px}
.summ h3{font-size:34px;margin-bottom:16px}
.summ dl{display:grid;grid-template-columns:1fr auto;gap:10px;font-size:14.5px;padding-bottom:16px;border-bottom:1px solid color-mix(in srgb,var(--paper-ink) 18%,transparent)}
.summ dd{text-align:right}
.summ .tot{font-family:var(--serif);font-weight:300;font-size:52px;letter-spacing:-.05em;margin-top:14px}
.summ .btn{width:100%;margin-top:20px;background:var(--paper-ink);color:var(--paper);border-color:var(--paper-ink)}

.k-form input,.k-form select,.k-form textarea{border-bottom-color:var(--line);font:400 17px var(--sans)}
.k-form label{letter-spacing:0;color:var(--muted)}
.k-foot h4{font-weight:400;font-size:20px;letter-spacing:-.03em}
.k-foot .logo{font-size:30px}

@media(max-width:1000px){
 .hs{height:auto}.hs .pin{position:static;height:auto;padding:80px 0}
 .track{overflow-x:auto;scroll-snap-type:x mandatory;transform:none!important;padding-bottom:20px}.lb{scroll-snap-align:start}.lb:nth-child(even){margin-top:0}
 .hs .prog{display:none}
 .wv .wrap{grid-template-columns:1fr}.wv .vis{position:relative;top:0;height:60vh}.wv .st{min-height:auto;opacity:1;padding:40px 0}
 .studio,.ph1,.st2{grid-template-columns:1fr}
 .shop{grid-template-columns:1fr 1fr}.pc:nth-child(3n+2){margin-top:0}.pc:nth-child(even){margin-top:50px}
 .care{grid-template-columns:1fr 1fr}.opts{grid-template-columns:1fr}.summ{position:static}
 .add{opacity:1;transform:none}
}
@media(max-width:600px){.shop{grid-template-columns:1fr}.pc:nth-child(even){margin-top:0}.hero .row{flex-direction:column;align-items:flex-start}.filters{position:static}}
@media (prefers-reduced-motion:reduce){.line>span{animation:none;transform:none}.hero .row{animation:none;opacity:1}.mq .t{animation:none}.mask{clip-path:none}}
.wv.band .st p{color:color-mix(in srgb,var(--band-ink) 78%,var(--band))}
.wv.band .st dt{color:color-mix(in srgb,var(--band-ink) 55%,var(--band))}
.wv.band .st small{color:color-mix(in srgb,var(--accent) 60%,#fff)}
.wv.band .st{opacity:.3}.wv.band .st.on{opacity:1}