/* Saint Séverac website. Tokens come from the approved design kit and lookbook. */
:root{
--colour-tan:#B8601F;--colour-bordeaux:#561B24;--colour-cream:#EBE1D5;--colour-ivory:#F6F0E6;
--colour-espresso:#2A1B17;--colour-espresso-soft:#5C4A43;--colour-gold-on-dark:#C9A45C;--colour-gold-on-cream:#9A7424;
--line-gold:rgba(154,116,36,.55);--line-gold-dark:rgba(201,164,92,.6);
--font-heading:'Cormorant Garamond',Georgia,serif;--font-body:'Jost',Arial,sans-serif;
--radius-2:2px;
--motion-reveal:600ms;--motion-fade:700ms;--motion-zoom:600ms;--motion-menu:500ms;--motion-ease:ease-out;
--max:1280px;--gutter:clamp(20px,4vw,56px);--gap:clamp(12px,2vw,24px);--hdr:83px;--bar:0px;
}
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
html.motion{scroll-behavior:smooth}
body{margin:0;padding-top:var(--hdr);background:var(--colour-ivory);color:var(--colour-espresso);font:400 17px/28px var(--font-body);-webkit-font-smoothing:antialiased;overflow-x:hidden}
img,video{display:block;max-width:100%}
a{color:inherit}
h1,h2,h3,p,ul,ol,figure{margin:0}
ul,ol{padding:0;list-style:none}
button{font:inherit;color:inherit}
[id]{scroll-margin-top:var(--hdr)}
:focus-visible{outline:2px solid var(--colour-bordeaux);outline-offset:3px}
.on-dark :focus-visible,.on-dark:focus-visible{outline-color:var(--colour-ivory)}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.skip{position:absolute;left:16px;top:-80px;background:var(--colour-bordeaux);color:var(--colour-ivory);padding:15px 20px;min-height:44px;box-sizing:border-box;font:500 13px/1 var(--font-body);letter-spacing:.14em;text-transform:uppercase;text-decoration:none;z-index:90;border-radius:2px}
.skip:focus{top:16px}

/* ---------- Wordmark: three lines, always centred ---------- */
.wm{display:flex;flex-direction:column;align-items:center;font-family:var(--font-heading);font-weight:500;line-height:1;text-align:center}
.wm-a{font-size:max(.46em,12px);letter-spacing:.75em;padding-left:.75em}
.wm-d{width:.6em;height:max(1px,.035em);background:currentColor;margin:.5em 0 .44em}
.wm-b{font-size:1em;letter-spacing:.36em;padding-left:.36em}

/* ---------- Menu ---------- */
.top{position:fixed;top:0;left:0;right:0;z-index:50;background:var(--colour-ivory)}
.hdr{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:16px;padding:8px 32px;min-height:var(--hdr);border-bottom:1px solid var(--line-gold)}
.hdr-links{display:flex;gap:0 24px;white-space:nowrap}
.hdr-links.right{justify-content:flex-end}
.hdr-links a,.hdr-links button,.sheet a,.bar a,.bar button{font:500 12px/1 var(--font-body);letter-spacing:.16em;text-transform:uppercase;color:var(--colour-espresso);text-decoration:none;background:none;border:0;border-bottom:1px solid transparent;cursor:pointer}
.hdr-links a,.hdr-links button{padding:16px 0;display:inline-flex;align-items:center;gap:8px;min-height:44px}
.hdr-links a:hover,.hdr-links button:hover,.hdr-links a[aria-current]{border-bottom-color:var(--colour-gold-on-cream)}
.hdr-links a:active,.hdr-links button:active{color:var(--colour-bordeaux);border-bottom-color:var(--colour-bordeaux)}
.hdr-wm .wm-a{font-size:.46em}
.hdr-wm{display:block;color:var(--colour-gold-on-cream);font-size:22px;text-decoration:none;justify-self:center;padding:6px 0;min-width:140px}
.hdr-wm:hover{color:var(--colour-bordeaux)}
.count{display:inline-block;min-width:20px;text-align:center;font-weight:500;color:var(--colour-bordeaux)}
.bar,.sheet{display:none}
@media (max-width:899px){
 :root{--hdr:72px;--bar:60px}
 body{padding-bottom:var(--bar)}
 .hdr{padding:8px 20px;grid-template-columns:1fr}
 .hdr-links{display:none}
 .hdr-wm{font-size:22px}
 .bar{display:grid;grid-template-columns:repeat(4,1fr);position:fixed;left:0;right:0;bottom:0;height:var(--bar);z-index:55;background:var(--colour-ivory);border-top:1px solid var(--line-gold)}
 .bar a,.bar button{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:5px;font-size:11px;min-height:44px;padding:0}
 .bar svg{width:20px;height:20px;stroke:currentColor;fill:none;stroke-width:1.4}
 .bar [aria-current],.bar [aria-expanded="true"]{color:var(--colour-bordeaux)}
 .sheet{display:block;position:fixed;left:0;right:0;top:var(--hdr);bottom:var(--bar);z-index:52;background:var(--colour-ivory);padding:12px 20px 24px;overflow:auto;visibility:hidden;opacity:0;transition:opacity var(--motion-menu) var(--motion-ease),visibility 0s linear var(--motion-menu)}
 .sheet.open{visibility:visible;opacity:1;transition-delay:0s}
 .sheet li+li{border-top:1px solid rgba(154,116,36,.3)}
 .sheet a{display:flex;font:500 34px/1.15 var(--font-heading);letter-spacing:0;text-transform:none;padding:16px 0;color:var(--colour-bordeaux)}
}

/* ---------- Layout helpers ---------- */
.wrap{max-width:var(--max);margin:0 auto;padding:var(--gutter)}
.eyebrow{font:500 12px/1.4 var(--font-body);letter-spacing:.22em;text-transform:uppercase;color:var(--colour-espresso-soft)}
.on-dark .eyebrow,.s-bordeaux .eyebrow,.s-espresso .eyebrow{color:var(--colour-cream)}
.h1,.h2{font:500 clamp(38px,5.4vw,72px)/1.05 var(--font-heading);color:var(--colour-bordeaux)}
.h2{font-size:clamp(34px,4.4vw,56px);line-height:1.08}
.it{font-style:italic;font-weight:400}
.lead{font:400 20px/32px var(--font-body);color:var(--colour-espresso-soft)}
.small{font:500 14px/22px var(--font-body);color:var(--colour-espresso-soft)}
.s-ivory{background:var(--colour-ivory)}
.s-cream{background:var(--colour-cream)}
.s-bordeaux{background:var(--colour-bordeaux);color:var(--colour-ivory)}
.s-espresso{background:var(--colour-espresso);color:var(--colour-ivory)}
.s-bordeaux .h2,.s-bordeaux .h1{color:var(--colour-ivory)}
.s-bordeaux .lead,.s-bordeaux .small{color:var(--colour-cream)}
.rule{border-top:1px solid var(--line-gold)}
.link{font:500 13px/1.4 var(--font-body);letter-spacing:.14em;text-transform:uppercase;color:var(--colour-bordeaux);text-decoration:underline;text-decoration-color:var(--colour-gold-on-cream);text-underline-offset:6px;text-decoration-thickness:1px}
.link:hover{color:var(--colour-espresso)}
.on-dark .link{color:var(--colour-ivory);text-decoration-color:var(--colour-gold-on-dark)}
.foot{padding:22px var(--gutter) 30px;text-align:center;border-top:1px solid var(--line-gold);font:500 12px/1.5 var(--font-body);letter-spacing:.08em;color:var(--colour-espresso-soft);background:var(--colour-ivory)}
.foot.dark{background:var(--colour-espresso);border-top-color:var(--line-gold-dark);color:var(--colour-cream)}

/* Buttons */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:48px;padding:0 28px;border:1px solid transparent;border-radius:var(--radius-2);font:500 13px/1.2 var(--font-body);letter-spacing:.14em;text-transform:uppercase;text-decoration:none;cursor:pointer;text-align:center;transition:background-color 200ms var(--motion-ease),color 200ms var(--motion-ease),border-color 200ms var(--motion-ease)}
.btn-primary{background:var(--colour-bordeaux);color:var(--colour-ivory)}
.btn-primary:hover{background:var(--colour-espresso)}
.btn-secondary{background:transparent;color:var(--colour-bordeaux);border-color:var(--colour-bordeaux)}
.btn-secondary:hover{background:var(--colour-bordeaux);color:var(--colour-ivory)}
.btn-light{background:var(--colour-ivory);color:var(--colour-bordeaux)}
.btn-light:hover{background:var(--colour-cream)}
.btn.block{display:flex;width:100%}

/* Images, reveal, zoom */
.media{overflow:hidden;background:var(--colour-cream)}
.media img{width:100%;height:auto}
.fig figcaption{margin-top:12px;font:500 14px/22px var(--font-body);color:var(--colour-espresso-soft)}
.s-bordeaux .fig figcaption{color:var(--colour-cream)}
@media (prefers-reduced-motion:no-preference){
 html.motion .reveal{opacity:0;transform:translateY(16px);transition:opacity var(--motion-reveal) var(--motion-ease),transform var(--motion-reveal) var(--motion-ease)}
 html.motion .reveal.is-in{opacity:1;transform:none}
 .media img{transition:transform var(--motion-zoom) var(--motion-ease)}
 .zoomable:hover .media img,.zoomable:focus-within .media img{transform:scale(1.04)}
}
@media (prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}}

/* ======================= HOME ======================= */
/* 1 Opening film */
.opening{position:relative;height:calc(100svh - var(--hdr) - var(--bar));min-height:520px;overflow:hidden;background:var(--colour-espresso);color:var(--colour-ivory)}
.opening video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:46% 50%;background:var(--colour-espresso)}
.opening::after{content:"";position:absolute;inset:0;background:linear-gradient(to top right,rgba(42,27,23,.82) 0%,rgba(42,27,23,.45) 28%,rgba(42,27,23,0) 58%);pointer-events:none}
.open-foot{position:absolute;left:var(--gutter);right:var(--gutter);bottom:clamp(20px,3.4vw,44px);z-index:2;display:flex;align-items:flex-end;justify-content:space-between;gap:24px}
.open-mark{color:var(--colour-gold-on-dark);font-size:clamp(24px,2.4vw,34px);text-align:center}
.open-line{margin-top:18px;font:italic 400 clamp(19px,1.55vw,23px)/1.25 var(--font-heading);color:var(--colour-ivory);text-align:center}
.open-card{display:grid;grid-template-columns:72px 1fr;gap:14px;align-items:center;width:min(310px,100%);background:rgba(246,240,230,.95);color:var(--colour-espresso);padding:12px 16px 12px 12px}
.open-card img{width:72px;height:auto;background:var(--colour-cream)}
.open-card .nm{font:500 22px/1.1 var(--font-heading);color:var(--colour-espresso)}
.open-card .mt{margin:4px 0 8px;font:500 13px/1.4 var(--font-body);color:var(--colour-espresso-soft)}
.open-card .link{color:var(--colour-bordeaux);text-decoration-color:var(--colour-gold-on-cream)}
.film-btn{position:absolute;top:clamp(14px,2vw,24px);right:var(--gutter);z-index:3;display:inline-flex;align-items:center;gap:8px;min-height:44px;padding:0 16px;border:1px solid rgba(246,240,230,.7);border-radius:var(--radius-2);background:rgba(42,27,23,.45);color:var(--colour-ivory);font:500 12px/1 var(--font-body);letter-spacing:.16em;text-transform:uppercase;cursor:pointer}
.film-btn:hover{background:rgba(42,27,23,.75)}
.film-btn svg{width:12px;height:12px;fill:currentColor}
.film-btn .i-play{display:none}
.film-btn[data-state="paused"] .i-play{display:block}
.film-btn[data-state="paused"] .i-pause{display:none}
.film-btn:focus-visible{outline:2px solid var(--colour-gold-on-dark);outline-offset:3px}
@media (max-width:899px),(max-aspect-ratio:3/2){
 .opening{min-height:560px}
 .opening::after{background:linear-gradient(to top,#2A1B17 0,#2A1B17 250px,rgba(42,27,23,0) 380px)}
 .opening video{bottom:auto;height:calc(100% - 250px);object-position:46% 50%}
 .open-foot{flex-direction:column;align-items:flex-start;gap:20px}
 .open-mark,.open-line{text-align:left;align-items:flex-start}
 .open-card{width:100%}
}

/* 2 Statement as navigation */
.statement{padding:clamp(64px,10vw,140px) var(--gutter)}
.statement-in{max-width:var(--max);margin:0 auto}
.chap-list{margin-top:clamp(24px,4vw,48px);border-top:1px solid var(--line-gold)}
.chap-list li{border-bottom:1px solid var(--line-gold)}
.chap-list a{display:grid;grid-template-columns:minmax(56px,.9fr) 6fr minmax(0,3fr);align-items:baseline;gap:0 16px;padding:clamp(10px,1.6vw,22px) 0;text-decoration:none;color:var(--colour-bordeaux)}
.chap-list .num{font:italic 400 clamp(22px,3vw,40px)/1 var(--font-heading);color:var(--colour-tan)}
.chap-list .name{font:500 clamp(54px,11vw,168px)/1 var(--font-heading);letter-spacing:-.01em;transition:color var(--motion-fade) var(--motion-ease),transform var(--motion-fade) var(--motion-ease)}
.chap-list .cap{font:500 14px/1.5 var(--font-body);color:var(--colour-espresso-soft)}
.chap-list a:hover .name,.chap-list a:focus-visible .name{color:var(--colour-espresso);font-style:italic}
@media (max-width:899px){
 .chap-list a{grid-template-columns:44px 1fr;gap:0 8px}
 .chap-list .cap{grid-column:2;margin-top:4px}
}

/* 3 Her day */
.day{position:relative;background:var(--colour-espresso)}
.moment{position:relative;height:calc(100svh - var(--hdr) - var(--bar));min-height:460px;overflow:hidden;color:var(--colour-ivory)}
.moment .mi{position:absolute;inset:0;overflow:hidden}
.moment .mi img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
@media (min-width:700px){.moment .mi.crop-villa img{width:118%;max-width:none;object-position:left center}}
.moment::after{content:"";position:absolute;inset:0;background:linear-gradient(to top,rgba(42,27,23,.78) 0%,rgba(42,27,23,.25) 34%,rgba(42,27,23,0) 60%)}
.moment .mt{position:absolute;z-index:2;left:var(--gutter);right:var(--gutter);bottom:clamp(24px,4vw,56px)}
.moment .mt .eyebrow{color:var(--colour-cream)}
.moment .mt p.big{margin-top:10px;font:italic 400 clamp(30px,4.6vw,64px)/1.08 var(--font-heading);max-width:16em}
html.motion .day{height:calc(var(--n) * 100svh)}
html.motion .day-stage{position:sticky;top:var(--hdr);height:calc(100svh - var(--hdr));overflow:hidden}
html.motion .moment{position:absolute;inset:0;height:auto;opacity:0;transition:opacity var(--motion-fade) var(--motion-ease);pointer-events:none}
html.motion .moment.is-on{opacity:1;pointer-events:auto}
@media (max-width:899px){html.motion .day{height:calc(var(--n) * (100svh - var(--bar)))}html.motion .day-stage{height:calc(100svh - var(--hdr) - var(--bar))}}
.moment .ph{display:contents}

/* 4 Product strip */
.strip{background:var(--colour-cream);padding-top:clamp(56px,8vw,112px)}
.strip-head{max-width:var(--max);margin:0 auto;padding:0 var(--gutter) clamp(24px,3vw,40px);display:flex;justify-content:space-between;align-items:flex-end;gap:24px;flex-wrap:wrap}
.strip-head .h2{margin-top:12px}
.strip-stage{padding-bottom:clamp(56px,8vw,112px)}
.strip-track{display:flex;gap:var(--gap);padding:0 var(--gutter);overflow-x:auto;scroll-snap-type:x mandatory;scroll-padding:0 var(--gutter);-webkit-overflow-scrolling:touch;scrollbar-width:thin}
.strip-track::after{content:"";flex:0 0 1px}
.sc{flex:0 0 clamp(220px,72vw,300px);scroll-snap-align:start;text-decoration:none;color:inherit;display:block}
.sc .media{aspect-ratio:4/5;position:relative}
.sc .media img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.sc h3{margin-top:12px;font:500 22px/1.15 var(--font-heading)}
.sc p{margin-top:2px;font:500 14px/1.5 var(--font-body);color:var(--colour-espresso-soft)}
.sc:hover h3{color:var(--colour-bordeaux)}
.swipe-note{font:500 12px/1 var(--font-body);letter-spacing:.16em;text-transform:uppercase;color:var(--colour-espresso-soft)}
@media (min-width:900px){
 .swipe-note{display:none}
 .sc{flex-basis:clamp(260px,24vw,340px)}
 html.motion .strip-pin.drift .strip-stage{position:sticky;top:var(--hdr);height:calc(100svh - var(--hdr));overflow:clip;display:flex;flex-direction:column;justify-content:center;padding-bottom:0}
 html.motion .strip-pin.drift .strip-track{overflow:visible;scroll-snap-type:none;will-change:transform;width:max-content}
 html.motion .strip-pin.drift .strip-track::after{flex:0 0 var(--gutter)}
}

/* 5 The making */
.making{padding:clamp(72px,10vw,140px) var(--gutter)}
.making-in{max-width:var(--max);margin:0 auto}
.making-head{max-width:720px;margin-bottom:clamp(28px,4vw,56px)}
.making-head .h2{margin-top:12px}
.mk-note{margin-top:clamp(40px,6vw,80px);max-width:560px}

/* The making film (home + story) */
.mfilm{width:100%;position:relative}
.mfilm-frame{position:relative;aspect-ratio:16/9;background:var(--colour-espresso);overflow:hidden;border-radius:var(--radius-2)}
.mfilm video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block}
.mfilm-ctl{position:absolute;right:12px;bottom:12px;display:flex;gap:8px;z-index:2}
.mf-btn{display:inline-flex;align-items:center;gap:8px;min-height:44px;padding:0 14px;border:1px solid rgba(246,240,230,.7);border-radius:var(--radius-2);background:rgba(42,27,23,.6);color:var(--colour-ivory);font:500 12px/1 var(--font-body);letter-spacing:.14em;text-transform:uppercase;cursor:pointer}
.mf-btn:hover{background:rgba(42,27,23,.85)}
.mf-btn:focus-visible{outline:2px solid var(--colour-ivory);outline-offset:3px}
.mf-btn svg{width:12px;height:12px;fill:currentColor}
.mf-btn .i-play{display:none}
.mf-btn[data-state="paused"] .i-play{display:block}
.mf-btn[data-state="paused"] .i-pause{display:none}
.mk-line{margin-top:clamp(20px,3vw,32px);max-width:36em}
.mk-steps{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px 24px;margin-top:clamp(20px,3vw,32px)}
.mk-steps li{padding-top:12px;border-top:1px solid rgba(235,225,213,.35);font:500 13px/1.4 var(--font-body);letter-spacing:.14em;text-transform:uppercase;color:var(--colour-cream);opacity:.8;transition:opacity .4s ease,border-color .4s ease}
.mk-steps .n{margin-right:8px}
.mk-steps li.is-on,.steps li.is-on{opacity:1;border-top:2px solid var(--colour-ivory);color:var(--colour-ivory)}
.mk-more{margin-top:clamp(24px,3.5vw,40px)}
.s-bordeaux .link{color:var(--colour-ivory);text-decoration-color:var(--colour-gold-on-dark)}
.craft-main{min-width:0}
.craft-main .steps{margin-top:clamp(24px,3vw,40px)}
.steps li{transition:border-color .4s ease}
@media (max-width:899px){.mk-steps{grid-template-columns:1fr}}
@media (prefers-reduced-motion:reduce){.mk-steps li,.steps li{transition:none}}

/* 6 Closing */
.close{min-height:calc(100svh - var(--hdr) - var(--bar));display:grid;place-items:center;text-align:center;padding:var(--gutter);background:var(--colour-espresso);color:var(--colour-ivory)}
.close>div{width:100%}
.close .wm{color:var(--colour-gold-on-dark);font-size:clamp(34px,6.2vw,88px);margin:0 auto}
.close p.closing-line{margin:clamp(24px,3vw,40px) auto clamp(28px,3vw,40px);font:italic 400 clamp(22px,2.6vw,34px)/1.25 var(--font-heading);max-width:18em}

/* ======================= SHOP ======================= */
.page-head{max-width:var(--max);margin:0 auto;padding:clamp(48px,7vw,96px) var(--gutter) clamp(20px,3vw,40px)}
.page-head .h1{margin-top:14px;max-width:12em}
.page-head .lead{margin-top:16px;max-width:36em}
.filters{display:none;max-width:var(--max);margin:0 auto;padding:0 var(--gutter);gap:16px 48px;flex-wrap:wrap;align-items:center}
html.js .filters{display:flex}
.fgroup{display:flex;gap:6px 8px;flex-wrap:wrap;align-items:center;border:0;padding:0;margin:0}
.fgroup legend{float:left;margin-right:12px;padding:0}
.fbtn{min-height:44px;padding:0 16px;border:1px solid rgba(86,27,36,.45);border-radius:var(--radius-2);background:transparent;color:var(--colour-bordeaux);font:500 12px/1 var(--font-body);letter-spacing:.14em;text-transform:uppercase;cursor:pointer;transition:background-color 200ms var(--motion-ease),color 200ms var(--motion-ease)}
.fbtn:hover{border-color:var(--colour-bordeaux)}
.fbtn[aria-pressed="true"]{background:var(--colour-bordeaux);color:var(--colour-ivory);border-color:var(--colour-bordeaux)}
.shop-note{max-width:var(--max);margin:0 auto;padding:20px var(--gutter) 0}
.shop-grid{max-width:var(--max);margin:0 auto;padding:clamp(24px,4vw,48px) var(--gutter) clamp(56px,8vw,112px);display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:clamp(40px,6vw,88px) var(--gap)}
.shop-grid .pcard:nth-child(even){margin-top:clamp(0px,7vw,104px)}
.pcard[hidden]{display:none}
.pcard-media{position:relative;aspect-ratio:4/5;overflow:hidden;background:var(--colour-cream)}
.pcard-media img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:0}
.pcard[data-colour="tan"] img[data-c="tan"][data-v="front"],.pcard[data-colour="bordeaux"] img[data-c="bordeaux"][data-v="front"]{opacity:1}
.pcard[data-colour="tan"]:hover img[data-c="tan"][data-v="side"],.pcard[data-colour="tan"]:focus-within img[data-c="tan"][data-v="side"],.pcard[data-colour="bordeaux"]:hover img[data-c="bordeaux"][data-v="side"],.pcard[data-colour="bordeaux"]:focus-within img[data-c="bordeaux"][data-v="side"]{opacity:1}
@media (prefers-reduced-motion:no-preference){
 .pcard-media img{transition:opacity var(--motion-fade) var(--motion-ease),transform var(--motion-zoom) var(--motion-ease)}
 .pcard:hover .pcard-media{transform:none}
}
.pcard-body{padding-top:16px;display:grid;gap:6px}
.pcard h2{font:500 clamp(28px,3vw,38px)/1.1 var(--font-heading)}
.pcard h2 a{text-decoration:none}
.pcard h2 a:hover{color:var(--colour-bordeaux)}
.pcard .tag{font:italic 400 20px/1.3 var(--font-heading);color:var(--colour-espresso-soft)}
.price{font:500 16px/1.5 var(--font-body);color:var(--colour-espresso)}
.price small{font:500 12px/1.5 var(--font-body);letter-spacing:.12em;text-transform:uppercase;color:var(--colour-espresso-soft);margin-left:8px}
.sw-row{display:flex;gap:10px 18px;flex-wrap:wrap;margin-top:6px}
.sw{display:inline-flex;align-items:center;gap:10px;min-height:44px;padding:0 4px;background:none;border:0;cursor:pointer;font:500 13px/1 var(--font-body);letter-spacing:.12em;text-transform:uppercase;color:var(--colour-espresso)}
.sw i{width:26px;height:26px;border-radius:50%;box-shadow:inset 0 0 0 1px rgba(42,27,23,.25);flex:none;transition:box-shadow 300ms var(--motion-ease)}
.sw[data-c="tan"] i{background:var(--colour-tan)}
.sw[data-c="bordeaux"] i{background:var(--colour-bordeaux)}
.sw[aria-pressed="true"] i,.sw[aria-checked="true"] i{box-shadow:0 0 0 2px var(--colour-ivory),0 0 0 3px var(--colour-gold-on-cream)}
.sw[aria-pressed="true"],.sw[aria-checked="true"]{border-bottom:1px solid var(--colour-gold-on-cream)}
.pcard-actions{display:flex;gap:12px;flex-wrap:wrap;align-items:center;margin-top:10px}
.empty{grid-column:1/-1;text-align:center}
@media (max-width:699px){.shop-grid{grid-template-columns:1fr}.shop-grid .pcard:nth-child(even){margin-top:0}}

/* ======================= PRODUCT ======================= */
.crumb{max-width:var(--max);margin:0 auto;padding:24px var(--gutter) 0;font:500 12px/1.4 var(--font-body);letter-spacing:.16em;text-transform:uppercase;color:var(--colour-espresso-soft)}
.crumb a{text-decoration:none}.crumb a:hover{color:var(--colour-bordeaux)}
.pdp{max-width:var(--max);margin:0 auto;padding:24px var(--gutter) clamp(56px,8vw,112px);display:grid;grid-template-columns:minmax(0,1.35fr) minmax(0,1fr);gap:clamp(28px,5vw,72px);align-items:start}
.gal{display:grid;grid-template-columns:76px minmax(0,1fr);gap:16px;align-items:start}
.gal-main{position:relative;aspect-ratio:4/5;overflow:hidden;background:var(--colour-cream);grid-column:2;grid-row:1}
.gal-main img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.thumbs{grid-column:1;grid-row:1;display:grid;gap:10px}
.thumb{padding:0;border:1px solid transparent;background:var(--colour-cream);cursor:pointer;aspect-ratio:4/5;overflow:hidden;display:block;width:100%}
.thumb img{width:100%;height:100%;object-fit:cover}
.thumb:nth-child(n+5) img{object-fit:contain}
.gal-main img.land{object-fit:contain}
.thumb[aria-current="true"]{border-color:var(--colour-gold-on-cream);outline:1px solid var(--colour-gold-on-cream);outline-offset:2px}
.pdp-info{position:sticky;top:calc(var(--hdr) + 24px)}
.pdp-info h1{font:500 clamp(40px,4.6vw,60px)/1.05 var(--font-heading);color:var(--colour-bordeaux);margin-top:12px}
.pdp-info .price{margin-top:14px;font-size:20px}
.pdp-info .lead{margin-top:16px}
.pdp-buy{margin-top:24px;display:grid;gap:14px}
.pdp-buy .lbl{font:500 12px/1 var(--font-body);letter-spacing:.2em;text-transform:uppercase;color:var(--colour-espresso-soft)}
.pdp-buy .lbl b{color:var(--colour-espresso);font-weight:500}
.acc-wrap{margin-top:28px}
.acc{border-top:1px solid var(--line-gold)}
.acc:last-child{border-bottom:1px solid var(--line-gold)}
.acc summary{list-style:none;display:flex;align-items:center;justify-content:space-between;gap:16px;min-height:56px;padding:12px 4px;cursor:pointer;font:500 13px/1.3 var(--font-body);letter-spacing:.16em;text-transform:uppercase}
.acc summary::-webkit-details-marker{display:none}
.acc summary:hover{color:var(--colour-bordeaux)}
.acc summary:focus-visible{outline-offset:-2px}
.acc-i{position:relative;width:14px;height:14px;flex:none}
.acc-i::before,.acc-i::after{content:"";position:absolute;background:currentColor;left:0;right:0;top:6.5px;height:1px}
.acc-i::after{transform:rotate(90deg);transition:transform 300ms var(--motion-ease)}
.acc[open] .acc-i::after{transform:rotate(0)}
.acc-body{padding:0 4px 20px;font:400 16px/1.7 var(--font-body);max-width:34em}
.acc-body p+p,.acc-body ul{margin-top:10px}
.acc-body li{padding-left:16px;position:relative}
.acc-body li::before{content:"";position:absolute;left:0;top:.8em;width:6px;height:1px;background:var(--colour-gold-on-cream)}
.life{padding:clamp(64px,9vw,128px) var(--gutter)}
.life-in{max-width:var(--max);margin:0 auto}
.life .h2{margin-top:12px}
.life-grid{margin-top:clamp(28px,4vw,56px);display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--gap)}
.life-grid .fig:nth-child(2){margin-top:clamp(0px,6vw,80px)}
.life-grid .media{aspect-ratio:4/5}
.life-grid img{width:100%;height:100%;object-fit:cover}
.tail{max-width:var(--max);margin:0 auto;padding:clamp(48px,7vw,96px) var(--gutter);display:flex;justify-content:space-between;align-items:center;gap:24px;flex-wrap:wrap}
@media (max-width:899px){
 .pdp{grid-template-columns:1fr}
 .pdp-info{position:static}
 .gal{grid-template-columns:1fr}
 .gal-main{grid-column:1;grid-row:1}
 .thumbs{grid-column:1;grid-row:2;grid-template-columns:repeat(6,minmax(0,1fr))}
}
@media (max-width:599px){.life-grid{grid-template-columns:1fr}.life-grid .fig:nth-child(2){margin-top:0}}

/* ======================= STORY ======================= */
.s-open{max-width:var(--max);margin:0 auto;padding:clamp(48px,7vw,104px) var(--gutter);display:grid;grid-template-columns:minmax(0,1.25fr) minmax(0,1fr);gap:clamp(28px,6vw,96px);align-items:center}
.s-open .h1{font-size:clamp(44px,7vw,104px);margin-top:16px}
.s-open p.lead{margin-top:24px;max-width:28em}
.s-open .media{aspect-ratio:4/5}
.s-open .media img{width:100%;height:100%;object-fit:cover}
.s-text{max-width:var(--max);margin:0 auto;padding:clamp(24px,4vw,64px) var(--gutter);display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:clamp(24px,5vw,80px)}
.s-text p{font:400 19px/1.75 var(--font-body)}
.s-text p+p{margin-top:18px}
.s-text .h2{font-size:clamp(30px,3.6vw,48px)}
.pull{padding:clamp(56px,9vw,128px) var(--gutter);text-align:center}
.pull p{max-width:16em;margin:0 auto;font:italic 400 clamp(32px,5vw,68px)/1.12 var(--font-heading)}
.family{max-width:var(--max);margin:0 auto;padding:clamp(40px,6vw,80px) var(--gutter) clamp(56px,8vw,112px);display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.5fr);gap:var(--gap);align-items:end}
.family .media{aspect-ratio:4/5}.family .media.land{aspect-ratio:3/2}
.family img{width:100%;height:100%;object-fit:cover}
.craft{padding:clamp(64px,9vw,128px) var(--gutter)}
.craft-in{max-width:var(--max);margin:0 auto;display:grid;grid-template-columns:minmax(0,4fr) minmax(0,8fr);gap:clamp(28px,6vw,96px);align-items:start}
.craft-side{position:sticky;top:calc(var(--hdr) + 32px)}
.craft-side .h2{margin-top:12px}
.craft-side .lead{margin-top:16px}
.steps li{display:grid;grid-template-columns:minmax(52px,1fr) minmax(0,6fr);gap:16px 20px;padding:clamp(20px,3vw,36px) 0;border-top:1px solid var(--line-gold-dark)}
.steps .no{font:italic 400 clamp(40px,5vw,72px)/.9 var(--font-heading);color:var(--colour-gold-on-dark)}
.steps h3{font:500 clamp(26px,2.6vw,34px)/1.15 var(--font-heading)}
.steps p{margin-top:6px;color:var(--colour-cream)}
.words{display:flex;flex-wrap:wrap;justify-content:center;gap:12px clamp(24px,5vw,72px);padding:clamp(40px,6vw,72px) var(--gutter);border-top:1px solid var(--line-gold)}
.words li{font:500 clamp(24px,2.8vw,38px)/1.1 var(--font-heading);color:var(--colour-bordeaux)}
.details{max-width:var(--max);margin:0 auto;padding:0 var(--gutter) clamp(56px,8vw,112px);display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--gap)}
.details .media{aspect-ratio:3/2}.details img{width:100%;height:100%;object-fit:cover}
.band{display:block;width:100%;height:clamp(280px,52vw,720px);object-fit:cover}
@media (max-width:899px){
 .s-open,.s-text,.craft-in{grid-template-columns:1fr}
 .craft-side{position:static}
 .family{grid-template-columns:1fr}
}
@media (max-width:599px){.details{grid-template-columns:1fr}}

/* ======================= CART DRAWER ======================= */
.scrim{position:fixed;inset:0;z-index:80;background:rgba(42,27,23,.5);opacity:0;visibility:hidden;transition:opacity var(--motion-menu) var(--motion-ease),visibility 0s linear var(--motion-menu)}
.scrim.open{opacity:1;visibility:visible;transition-delay:0s}
.drawer{position:fixed;top:0;right:0;bottom:0;z-index:90;width:min(440px,100%);background:var(--colour-ivory);border-left:1px solid var(--line-gold);display:flex;flex-direction:column;transform:translateX(100%);visibility:hidden;transition:transform var(--motion-menu) var(--motion-ease),visibility 0s linear var(--motion-menu)}
.drawer.open{transform:none;visibility:visible;transition-delay:0s}
.drawer-h{display:flex;align-items:center;justify-content:space-between;padding:12px 8px 12px 24px;border-bottom:1px solid var(--line-gold)}
.drawer-h h2{font:500 28px/1.1 var(--font-heading);color:var(--colour-bordeaux)}
.xbtn{width:44px;height:44px;display:grid;place-items:center;background:none;border:0;cursor:pointer;color:var(--colour-espresso)}
.xbtn svg{width:18px;height:18px;stroke:currentColor;stroke-width:1.4;fill:none}
.drawer-b{flex:1;overflow:auto;padding:8px 24px}
.sample{margin:12px 0 0;font:500 12px/1.4 var(--font-body);letter-spacing:.16em;text-transform:uppercase;color:var(--colour-espresso-soft)}
.line{display:grid;grid-template-columns:72px 1fr;gap:16px;padding:18px 0;border-bottom:1px solid rgba(154,116,36,.35)}
.line img{width:72px;height:90px;object-fit:cover;background:var(--colour-cream)}
.line h3{font:500 20px/1.15 var(--font-heading)}
.line .meta{font:500 13px/1.5 var(--font-body);color:var(--colour-espresso-soft)}
.line-ctl{display:flex;align-items:center;gap:6px;margin-top:8px;flex-wrap:wrap}
.qty{display:inline-flex;align-items:center;border:1px solid rgba(86,27,36,.4);border-radius:var(--radius-2)}
.qty button{width:40px;height:40px;background:none;border:0;cursor:pointer;font:500 18px/1 var(--font-body);color:var(--colour-bordeaux)}
.qty span{min-width:24px;text-align:center;font:500 15px/1 var(--font-body)}
.rm{margin-left:auto;background:none;border:0;cursor:pointer;min-height:40px;padding:0 4px;font:500 12px/1 var(--font-body);letter-spacing:.14em;text-transform:uppercase;color:var(--colour-espresso-soft);text-decoration:underline;text-underline-offset:5px}
.drawer-f{padding:20px 24px 28px;border-top:1px solid var(--line-gold);display:grid;gap:12px}
.sum{display:flex;justify-content:space-between;font:500 16px/1.5 var(--font-body)}
.drawer-f .small{margin:0}
.nfs{font:italic 500 24px/1.2 var(--font-heading);color:var(--colour-bordeaux);text-align:center;margin-top:4px}

/* print / no-script friendliness */
html:not(.js) .reveal{opacity:1;transform:none}

/* Phone polish: tap targets, text size, film buttons */
@media (max-width:899px){
 .bar a,.bar button{font-size:12px}
 .bar .count{font-size:12px}
 .link{display:inline-block;min-width:44px;padding:13px 0;margin:-13px 0}
 .pcard h2 a{display:inline-block;min-width:44px;padding:10px 0;margin:-10px 0}
 .crumb a{display:inline-block;min-width:44px;padding:14px 4px;margin:-14px -4px}
 .mfilm-ctl{position:static;margin-top:12px;justify-content:flex-start}
 .qty button{width:44px;height:44px}
 .rm{min-height:44px;min-width:44px}
 body{padding-bottom:calc(var(--bar) + 2px)}
}