:root{--bone:#EEEAE2;--paper:#F6F3EC;--ink:#121619;--fjord:#1B262C;--gold:#BE9650;--gold-deep:#7A5C22;--rose:#C48B7D;--rose-deep:#8F5448;--mute:#5A6368;--serif:"Iowan Old Style","Palatino Linotype",Palatino,Georgia,serif;--sans:"Avenir Next","Helvetica Neue",Helvetica,Arial,sans-serif;--ease:cubic-bezier(.2,.7,.2,1)}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{font-family:var(--sans);background:var(--bone);color:var(--ink);line-height:1.6;-webkit-font-smoothing:antialiased;overflow-x:hidden}
img,svg{display:block;max-width:100%}
a{color:inherit}
.wrap{width:min(1180px,100% - 48px);margin:0 auto}
.eyebrow{font-size:11px;letter-spacing:.28em;text-transform:uppercase;color:var(--gold-deep);font-weight:600}
.dark .eyebrow{color:var(--gold)}
h1,h2,h3{font-family:var(--serif);font-weight:400;letter-spacing:-.015em;line-height:1.05}
h2{font-size:clamp(34px,5vw,60px)}
.lead{font-size:clamp(17px,1.5vw,20px);color:var(--mute);max-width:56ch}
.dark .lead{color:#B8BFC2}
.rule{height:1px;background:linear-gradient(90deg,transparent,var(--gold),transparent);border:0;opacity:.7}
:focus-visible{outline:2px solid var(--gold-deep);outline-offset:3px}.dark :focus-visible,.bar :focus-visible,.hero :focus-visible,.drawer :focus-visible{outline-color:var(--gold)}
.skip{position:absolute;left:-999px}.skip:focus{left:12px;top:12px;background:var(--ink);color:var(--bone);padding:8px 12px;z-index:99}
/* grain */
body::after{content:"";position:fixed;inset:0;pointer-events:none;z-index:60;opacity:.07;mix-blend-mode:multiply;background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='160' height='160'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2'/></filter><rect width='160' height='160' filter='url(%23n)'/></svg>")}
/* bar */
.bar{position:fixed;top:0;left:0;right:0;z-index:50;transition:background .4s,backdrop-filter .4s,border-color .4s;border-bottom:1px solid transparent;color:var(--bone)}
.bar.solid{background:rgba(18,22,25,.86);backdrop-filter:blur(10px);border-color:rgba(190,150,80,.25)}
.bar .row{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;padding-top:16px;padding-bottom:16px}
.bar nav{display:flex;gap:26px;font-size:12px;letter-spacing:.18em;text-transform:uppercase}
.bar nav a{text-decoration:none;opacity:.85;position:relative;padding:4px 0}
.bar nav a::after{content:"";position:absolute;left:0;bottom:0;height:1px;width:100%;background:var(--gold);transform:scaleX(0);transform-origin:left;transition:transform .35s var(--ease)}
.bar nav a:hover::after{transform:scaleX(1)}
.brand{display:flex;align-items:center;gap:12px;text-decoration:none}
.brand .mark{height:44px;width:auto}
.brand span{font-family:var(--serif);font-size:19px;letter-spacing:.2em;text-transform:uppercase}
.bar .right{justify-self:end;display:flex;gap:18px;align-items:center;font-size:12px;letter-spacing:.18em;text-transform:uppercase}
.bagbtn{background:none;border:1px solid rgba(190,150,80,.6);color:var(--bone);padding:8px 14px;font:inherit;letter-spacing:.18em;cursor:pointer;text-transform:uppercase;transition:background .3s,color .3s}
.bagbtn:hover{background:var(--gold);color:var(--ink)}
.mark{display:block;width:auto;height:auto;object-fit:contain}
/* hero */
.hero{position:relative;min-height:100svh;color:var(--bone);display:flex;align-items:flex-end;overflow:hidden;background:var(--ink)}
.hero .bg{position:absolute;inset:-6% 0 -6% 0;will-change:transform}
.hero .bg img{width:100%;height:100%;object-fit:cover;object-position:50% 60%;transform:scale(1.05);animation:drift 24s ease-in-out infinite alternate}
@keyframes drift{to{transform:scale(1.14) translateX(-1.5%)}}
.hero::before{content:"";position:absolute;inset:0;z-index:1;background:linear-gradient(180deg,rgba(18,22,25,.55) 0,rgba(18,22,25,.1) 35%,rgba(18,22,25,.78) 100%)}
.hero .in{position:relative;z-index:2;padding:0 0 clamp(48px,9vh,96px);width:min(1180px,100% - 48px);margin:0 auto}
.hero h1{font-size:clamp(54px,11vw,150px);letter-spacing:-.03em;margin:18px 0 22px}
.hero h1 span{display:inline-block;opacity:0;transform:translateY(40px);animation:up .9s var(--ease) forwards}
.hero h1 span:nth-child(2){animation-delay:.15s}
@keyframes up{to{opacity:1;transform:none}}
.hero p{max-width:46ch;font-size:clamp(17px,1.6vw,21px);color:#D6D8D6}
.cta{display:flex;gap:14px;flex-wrap:wrap;margin-top:34px}
.btn{display:inline-block;padding:15px 28px;font:600 12px var(--sans);letter-spacing:.2em;text-transform:uppercase;text-decoration:none;border:1px solid var(--gold);cursor:pointer;transition:all .35s var(--ease);background:var(--gold);color:var(--ink)}
.btn:hover{background:transparent;color:var(--gold)}
.btn.ghost{background:transparent;color:var(--bone)}
.btn.ghost:hover{background:var(--gold);color:var(--ink)}
.btn.dk{background:var(--ink);color:var(--bone);border-color:var(--ink)}
.btn.dk:hover{background:transparent;color:var(--ink)}
.scrollcue{position:absolute;right:24px;bottom:34px;z-index:2;font-size:10px;letter-spacing:.3em;text-transform:uppercase;writing-mode:vertical-rl;color:#C9CDCB}
.scrollcue::after{content:"";display:block;width:1px;height:50px;background:var(--gold);margin:12px auto 0;animation:cue 2s ease-in-out infinite;transform-origin:top}
@keyframes cue{0%{transform:scaleY(0)}60%{transform:scaleY(1)}100%{transform:scaleY(1);opacity:0}}
.credit{position:absolute;left:24px;top:84px;z-index:2;font-size:10px;letter-spacing:.14em;color:#AEB4B5;text-transform:uppercase}
/* marquee */
.marq{background:var(--ink);color:var(--gold);border-block:1px solid rgba(190,150,80,.3);overflow:hidden;white-space:nowrap}
.marq .t{display:inline-flex;gap:56px;padding:20px 0;animation:mq 38s linear infinite;font-family:var(--serif);font-size:22px;font-style:italic}
.marq b{font-style:normal;font-family:var(--sans);font-size:10px;letter-spacing:.3em;text-transform:uppercase;color:#8E979B;margin-left:12px;font-weight:600}
@keyframes mq{to{transform:translateX(-50%)}}
/* statement */
.statement{padding:clamp(80px,14vw,170px) 0;text-align:center}
.statement p{font-family:var(--serif);font-size:clamp(26px,3.6vw,46px);line-height:1.22;max-width:24em;margin:20px auto 0;letter-spacing:-.01em}
.statement em{color:var(--gold-deep)}
/* saga */
.saga{background:var(--fjord);color:var(--bone);padding:clamp(80px,12vw,150px) 0}
.saga h2{max-width:14em;margin:16px 0 18px}
.saga .grid{display:grid;grid-template-columns:300px 1fr;gap:clamp(30px,6vw,90px);margin-top:60px}
.chap{list-style:none;border-top:1px solid rgba(190,150,80,.3)}
.chap button{width:100%;text-align:left;background:none;border:0;border-bottom:1px solid rgba(190,150,80,.3);color:#8E979B;padding:18px 0;cursor:pointer;font:inherit;display:grid;grid-template-columns:44px 1fr;align-items:baseline;transition:color .3s,padding .4s var(--ease)}
.chap button i{font-family:var(--serif);font-style:normal;color:var(--gold);font-size:20px}
.chap button span{font-family:var(--serif);font-size:20px}
.chap button:hover{color:var(--bone)}
.chap button[aria-pressed=true]{color:var(--bone);padding-left:12px}
.panel{position:relative;min-height:380px}
.panel .num{position:absolute;right:0;top:-40px;font-family:var(--serif);font-size:clamp(140px,22vw,300px);line-height:1;color:rgba(190,150,80,.09);pointer-events:none;user-select:none}
.panel article{position:relative;animation:fade .6s var(--ease)}
@keyframes fade{from{opacity:0;transform:translateY(16px)}to{opacity:1;transform:none}}
.panel h3{font-size:clamp(30px,4vw,52px);margin-bottom:22px}
.panel p{font-size:clamp(17px,1.5vw,20px);color:#CAD0D1;max-width:54ch;margin-bottom:18px}
.panel .src{font-size:11px;letter-spacing:.18em;text-transform:uppercase;color:var(--gold);margin-top:28px;border-top:1px solid rgba(190,150,80,.3);padding-top:14px;display:inline-block}
.panel .nav{display:flex;gap:10px;margin-top:34px}
.panel .nav button{background:none;border:1px solid rgba(190,150,80,.5);color:var(--bone);width:46px;height:46px;cursor:pointer;font-size:18px;transition:all .3s}
.panel .nav button:hover{background:var(--gold);color:var(--ink)}
.progress{height:2px;background:rgba(190,150,80,.2);margin-top:50px;position:relative}
.progress i{position:absolute;left:0;top:0;height:100%;background:var(--gold);transition:width .6s var(--ease)}
/* oath */
.oath{margin-top:80px;border:1px solid rgba(190,150,80,.3);padding:clamp(24px,4vw,48px);display:grid;grid-template-columns:1fr 1fr;gap:40px;align-items:center}
.oath h3{font-size:clamp(26px,3vw,38px);margin:10px 0 12px}
.oath input[type=range]{width:100%;accent-color:var(--gold);margin:14px 0 6px}
.oath .readout{font-family:var(--serif);font-size:clamp(22px,2.4vw,30px);color:var(--gold);min-height:2.6em}
.oath small{color:#8E979B;font-size:12px}
/* product stage */
.stage{padding:clamp(80px,12vw,150px) 0;background:var(--paper)}
.stage .grid{display:grid;grid-template-columns:1.05fr 1fr;gap:clamp(30px,6vw,90px);align-items:center}
.tiltwrap{perspective:1100px}
.scene{position:relative;aspect-ratio:4/5;display:grid;place-items:center;overflow:hidden;transform-style:preserve-3d;transition:transform .25s ease-out;border:1px solid rgba(18,22,25,.12)}
.scene.ink{background:radial-gradient(120% 90% at 50% 20%,#2A3A43 0,#121619 70%)}
.scene.bone{background:radial-gradient(120% 90% at 50% 20%,#FBF8F1 0,#E3DCCD 80%)}
.scene.fjord{background:linear-gradient(180deg,#32444D,#1B262C)}
.scene .bottle{height:82%;width:auto;filter:drop-shadow(0 28px 22px rgba(0,0,0,.35));transform:translateZ(40px)}
.scene .carton{position:absolute;height:62%;left:12%;bottom:12%;filter:drop-shadow(0 20px 18px rgba(0,0,0,.35))}
.scene.set .bottle{height:74%;position:absolute;right:14%;bottom:8%}
.scene .tag{position:absolute;left:14px;bottom:12px;font-size:10px;letter-spacing:.2em;text-transform:uppercase;color:#B4BCBF}
.scene.bone .tag{color:var(--mute)}
.scene .flat{width:62%;filter:drop-shadow(0 18px 18px rgba(0,0,0,.4))}
.opts{margin-top:30px}
.opts label{display:block;font-size:11px;letter-spacing:.22em;text-transform:uppercase;color:var(--mute);margin:20px 0 8px}
.seg{display:flex;gap:0}
.seg button{flex:1;padding:13px 10px;background:none;border:1px solid rgba(18,22,25,.3);font:600 12px var(--sans);letter-spacing:.16em;text-transform:uppercase;cursor:pointer;color:var(--ink);transition:all .3s;margin-left:-1px}
.seg button[aria-pressed=true]{background:var(--ink);color:var(--bone);border-color:var(--ink)}
.field{width:100%;padding:13px 14px;border:1px solid rgba(18,22,25,.3);background:transparent;font:16px var(--sans);color:var(--ink)}
.field:focus{outline:2px solid var(--gold);outline-offset:0;border-color:var(--gold)}
.note{font-size:12px;color:var(--mute);margin-top:8px}
.meta{font-size:12px;letter-spacing:.14em;text-transform:uppercase;color:var(--mute);margin-top:16px}
/* ritual */
.ritual{padding:clamp(80px,12vw,150px) 0}
.ritual h2{margin:14px 0 40px;max-width:12em}
.acc{border-top:1px solid rgba(18,22,25,.25)}
.acc details{border-bottom:1px solid rgba(18,22,25,.25)}
.acc summary{list-style:none;cursor:pointer;display:grid;grid-template-columns:70px 1fr 30px;align-items:center;padding:28px 0;font-family:var(--serif);font-size:clamp(26px,3.4vw,44px)}
.acc summary::-webkit-details-marker{display:none}
.acc summary i{font-style:normal;font-size:15px;letter-spacing:.2em;color:var(--gold-deep);font-family:var(--sans)}
.acc summary::after{content:"+";font-family:var(--sans);font-size:26px;transition:transform .4s var(--ease);justify-self:end}
.acc details[open] summary::after{transform:rotate(45deg)}
.acc .body{padding:0 0 32px 70px;max-width:60ch;color:var(--mute);font-size:18px}
/* planks band */
.band{position:relative;height:340px;overflow:hidden;background:var(--ink)}
.band img{width:100%;height:100%;object-fit:cover;filter:saturate(.7) contrast(1.05) brightness(.8)}
.band small{position:absolute;right:16px;bottom:10px;color:#C9CDCB;font-size:10px;letter-spacing:.14em;text-transform:uppercase}
/* ingredients */
.ingr{padding:clamp(80px,12vw,150px) 0;background:var(--ink);color:var(--bone)}
.ingr h2{margin:14px 0 40px}
.ledger{border-top:1px solid rgba(190,150,80,.4)}
.ledger .r{display:grid;grid-template-columns:1fr 2fr;gap:20px;padding:20px 0;border-bottom:1px solid rgba(190,150,80,.25);transition:padding .4s var(--ease),background .3s}
.ledger .r:hover{padding-left:14px;background:rgba(190,150,80,.06)}
.ledger b{font-family:var(--serif);font-weight:400;font-size:24px}
.ledger span{color:#AEB6B8}
.ledger .tbc span,.ledger .tbc b{color:var(--gold)}
/* women */
.women{padding:clamp(80px,12vw,150px) 0;background:linear-gradient(180deg,#F1E4DF,#EADBD4)}
.women .grid{display:grid;grid-template-columns:1fr 1fr;gap:clamp(30px,6vw,90px);align-items:center}
.women .eyebrow{color:var(--rose-deep)}
.women h2{margin:14px 0 18px}
.wl{display:flex;gap:0;margin-top:26px;max-width:480px}
.wl input{flex:1;padding:15px;border:1px solid var(--rose-deep);border-right:0;background:rgba(255,255,255,.5);font:16px var(--sans);color:var(--ink)}
.wl button{padding:15px 22px;background:var(--rose-deep);border:1px solid var(--rose-deep);color:#fff;font:600 12px var(--sans);letter-spacing:.18em;text-transform:uppercase;cursor:pointer}
.empty{aspect-ratio:1;border:1px dashed var(--rose-deep);display:grid;place-items:center;text-align:center;color:var(--rose-deep);font-family:var(--serif);font-size:24px;padding:30px}
.empty small{display:block;font-family:var(--sans);font-size:11px;letter-spacing:.2em;text-transform:uppercase;margin-top:10px}
/* story */
.story{padding:clamp(80px,12vw,150px) 0}
.story .grid{display:grid;grid-template-columns:1fr 1fr;gap:clamp(30px,6vw,90px);align-items:center}
.story .ph{position:relative;aspect-ratio:4/3;overflow:hidden;background:var(--ink)}
.story .ph img{width:100%;height:100%;object-fit:cover}
.story h2{margin:14px 0 18px}
.story p+p{margin-top:16px}
/* testers */
.test{padding:clamp(70px,10vw,120px) 0;background:var(--fjord);color:var(--bone);text-align:center}
.test h2{margin:14px auto 16px;max-width:14em}
.test .lead{margin:0 auto}
.test form{display:flex;gap:0;max-width:520px;margin:30px auto 0}
.test input{flex:1;padding:15px;border:1px solid var(--gold);border-right:0;background:rgba(255,255,255,.06);color:var(--bone);font:16px var(--sans)}
.test input::placeholder{color:#8E979B}
.test button{padding:15px 22px;background:var(--gold);border:1px solid var(--gold);color:var(--ink);font:600 12px var(--sans);letter-spacing:.18em;text-transform:uppercase;cursor:pointer}
.demo{font-size:11px;color:#8E979B;margin-top:12px;letter-spacing:.06em}
.conf{margin-top:14px;color:var(--gold);min-height:1.5em}
/* footer */
footer{background:var(--ink);color:#AEB6B8;padding:60px 0 40px;font-size:13px}
footer .row{display:flex;justify-content:space-between;gap:30px;flex-wrap:wrap;align-items:center}
footer .mark{height:56px}
footer a{text-decoration:none;margin-right:22px;letter-spacing:.14em;text-transform:uppercase;font-size:11px}
/* reveal */
.js .rv{opacity:0;transform:translateY(34px);transition:opacity 1s var(--ease),transform 1s var(--ease)}
.js .rv.in{opacity:1;transform:none}
@media(prefers-reduced-motion:reduce){.js .rv{opacity:1;transform:none;transition:none}.hero .bg img,.marq .t{animation:none}.hero h1 span{opacity:1;transform:none;animation:none}}
/* shop */
.shop{padding:110px 0 clamp(60px,9vw,110px);background:var(--paper)}
.demoban{background:var(--gold);color:var(--ink);text-align:center;font-size:12px;letter-spacing:.14em;text-transform:uppercase;padding:9px 12px;font-weight:600;position:fixed;top:0;left:0;right:0;z-index:55}
.has-ban .bar{top:34px}
.crumb{font-size:11px;letter-spacing:.2em;text-transform:uppercase;color:var(--mute);margin-bottom:28px}
.crumb a{text-decoration:none}
.pdp{display:grid;grid-template-columns:1.1fr 1fr;gap:clamp(30px,5vw,80px);align-items:start}
.gal{display:grid;grid-template-columns:84px 1fr;gap:14px}
.thumbs{display:flex;flex-direction:column;gap:10px}
.thumbs button{border:1px solid rgba(18,22,25,.25);background:var(--bone);padding:0;cursor:pointer;aspect-ratio:4/5;overflow:hidden;position:relative}
.thumbs button[aria-current=true]{border-color:var(--gold);outline:1px solid var(--gold)}
.thumbs .scene{aspect-ratio:4/5;border:0;pointer-events:none}
.thumbs .scene .tag{display:none}
.main .scene{aspect-ratio:4/5}
.pinfo h1{font-size:clamp(40px,5vw,64px)}
.price{font-family:var(--serif);font-size:34px;margin:16px 0 4px;display:flex;align-items:baseline;gap:12px}
.pill{font:600 10px var(--sans);letter-spacing:.18em;text-transform:uppercase;border:1px solid var(--gold-deep);color:var(--gold-deep);padding:4px 8px}
.pinfo p.d{color:var(--mute);max-width:50ch;margin:14px 0 6px}
.qty{display:inline-flex;border:1px solid rgba(18,22,25,.3)}
.qty button{width:44px;height:48px;background:none;border:0;font-size:20px;cursor:pointer}
.qty output{width:48px;display:grid;place-items:center;font-size:16px}
.buyrow{display:flex;gap:12px;margin-top:26px;flex-wrap:wrap}
.buyrow .btn{flex:1;min-width:200px;text-align:center}
.pinfo .acc{margin-top:34px}
.pinfo .acc summary{font-size:20px;padding:18px 0;grid-template-columns:1fr 30px}
.pinfo .acc .body{padding:0 0 18px;font-size:15px}
.cross{margin-top:70px;display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
.cross .card{border:1px solid rgba(18,22,25,.2);padding:26px;background:var(--bone)}
.cross h3{font-size:24px;margin:8px 0}
.cross p{font-size:14px;color:var(--mute)}
/* drawer */
.veil{position:fixed;inset:0;background:rgba(18,22,25,.55);opacity:0;pointer-events:none;transition:opacity .4s;z-index:70}
.veil.on{opacity:1;pointer-events:auto}
.drawer{visibility:hidden;position:fixed;top:0;right:0;bottom:0;width:min(420px,100%);background:var(--bone);z-index:71;transform:translateX(100%);transition:transform .5s var(--ease),visibility 0s .5s;display:flex;flex-direction:column;box-shadow:-20px 0 60px rgba(0,0,0,.3)}
.drawer.on{transform:none;visibility:visible;transition:transform .5s var(--ease),visibility 0s}
.drawer header{display:flex;justify-content:space-between;align-items:center;padding:22px 24px;border-bottom:1px solid rgba(18,22,25,.15);font-family:var(--serif);font-size:24px}
.drawer header button{background:none;border:0;font-size:26px;cursor:pointer}
.lines{flex:1;overflow:auto;padding:10px 24px}
.line{display:grid;grid-template-columns:70px 1fr auto;gap:14px;padding:16px 0;border-bottom:1px solid rgba(18,22,25,.12);align-items:center}
.line .scene{aspect-ratio:4/5;border:0;width:70px}
.line .scene .tag{display:none}
.line b{font-family:var(--serif);font-weight:400;font-size:18px;display:block}
.line small{color:var(--mute);font-size:12px}
.line button{background:none;border:0;font-size:12px;letter-spacing:.14em;text-transform:uppercase;color:var(--mute);cursor:pointer;margin-top:4px;text-decoration:underline}
.drawer footer{background:var(--paper);color:var(--ink);padding:20px 24px;border-top:1px solid rgba(18,22,25,.15)}
.sub{display:flex;justify-content:space-between;font-size:18px;margin-bottom:14px}
.drawer .btn{width:100%;text-align:center}
.emptycart{padding:40px 0;color:var(--mute);text-align:center}
.modal{position:fixed;inset:0;z-index:80;display:none;place-items:center;background:rgba(18,22,25,.7);padding:20px}
.modal.on{display:grid}
.modal .box{background:var(--bone);max-width:480px;width:100%;padding:34px;border:1px solid var(--gold)}
.modal h3{font-size:32px;margin:8px 0 10px}
.modal p{color:var(--mute);margin-bottom:16px;font-size:15px}
.modal .row2{display:flex;gap:10px;margin-top:18px}
.modal .row2 .btn{flex:1;text-align:center}
/* review */
.rvbtn{position:fixed;left:16px;bottom:16px;z-index:90;background:var(--ink);color:var(--gold);border:1px solid var(--gold);padding:10px 14px;font:600 11px var(--sans);letter-spacing:.18em;text-transform:uppercase;cursor:pointer}
.rvpanel{position:fixed;left:16px;bottom:62px;z-index:90;width:min(460px,calc(100% - 32px));max-height:72vh;overflow:auto;background:var(--paper);color:var(--ink);border:1px solid var(--ink);padding:22px;display:none;font-size:13px;line-height:1.5;box-shadow:0 20px 60px rgba(0,0,0,.35)}
.rvpanel.on{display:block}
.rvpanel h4{font-family:var(--serif);font-size:20px;font-weight:400;margin:14px 0 6px}
.rvpanel h4:first-child{margin-top:0}
.rvpanel li{margin:0 0 5px 18px}
@media(max-width:900px){
.bar .row{grid-template-columns:auto 1fr;row-gap:6px}
.bar nav{grid-column:1/-1;order:3;gap:16px;overflow:auto;font-size:11px}
.brand span{font-size:15px}
.saga .grid,.stage .grid,.women .grid,.story .grid,.oath,.pdp{grid-template-columns:1fr}
.chap button span{font-size:18px}
.cross{grid-template-columns:1fr}
.ledger .r{grid-template-columns:1fr}
.acc summary{grid-template-columns:50px 1fr 24px}.acc .body{padding-left:50px}
.scrollcue,.credit{display:none}
.gal{grid-template-columns:1fr}.thumbs{flex-direction:row;order:2}.thumbs button{width:72px}
.hero{align-items:flex-end}
}
/* inner pages + SEO/AEO blocks */
.narrow{width:min(860px,100% - 48px);margin:0 auto}
.phero{padding:150px 0 70px;background:var(--ink);color:var(--bone)}
.phero h1{font-size:clamp(38px,6vw,76px);margin:14px 0 26px;max-width:15em}
.crumb{font-size:11px;letter-spacing:.2em;text-transform:uppercase;color:#8E979B;margin-bottom:26px}
.crumb a{text-decoration:none;color:inherit}
.qa{border-left:2px solid var(--gold);padding:6px 0 6px 22px;max-width:62ch;font-size:clamp(17px,1.5vw,20px);color:#D2D6D5}
.qa strong{color:var(--gold);font-weight:600;letter-spacing:.14em;text-transform:uppercase;font-size:11px;display:block;margin-bottom:6px}
.qa.light{color:var(--mute);margin:18px 0 6px;font-size:15px}
.qa.light strong{color:var(--gold-deep)}
.faq{padding:clamp(60px,9vw,110px) 0}
.faq h2{margin:12px 0 34px;font-size:clamp(30px,4vw,48px)}
.faq .acc summary{grid-template-columns:1fr 30px;font-size:clamp(19px,2.2vw,26px);padding:22px 0}
.faq .acc .body{padding:0 0 24px;font-size:17px}
.faq .grp{font-size:28px;margin:44px 0 14px;color:var(--gold-deep)}
.cardsec{padding:clamp(70px,10vw,120px) 0}
.cards{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
.card{display:block;text-decoration:none;border:1px solid rgba(18,22,25,.2);padding:30px;background:var(--paper);transition:transform .5s var(--ease),border-color .3s,background .3s}
.card:hover{transform:translateY(-6px);border-color:var(--gold);background:#fff}
.card h3{font-size:30px;margin:10px 0}
.card p{color:var(--mute);font-size:15px;margin-bottom:18px}
.card .arrow{font-size:11px;letter-spacing:.2em;text-transform:uppercase;color:var(--gold-deep);font-weight:600}
.next{padding:10px 0 80px;text-align:center}
.btn.ghost-d{background:transparent;color:var(--ink);border-color:var(--ink)}
.btn.ghost-d:hover{background:var(--ink);color:var(--bone)}
.lbl{display:block;font-size:11px;letter-spacing:.22em;text-transform:uppercase;color:var(--mute);margin:20px 0 8px}
.bar nav a[aria-current=page]{color:var(--gold)}
.bar nav a[aria-current=page]::after{transform:scaleX(1)}
.panel .numbox span{position:absolute;right:0;top:-40px;font-family:var(--serif);font-size:clamp(140px,22vw,300px);line-height:1;color:rgba(190,150,80,.09);pointer-events:none;user-select:none;display:none}
.panel .numbox span.on{display:block}
.js .panel article:not(.on){display:none}
.js .panel article.on{animation:fade .6s var(--ease)}
.panel article{margin-bottom:34px}
.js .panel article{margin-bottom:0}
.women .phero,.story .ph{margin:0}
@media(max-width:900px){.cards{grid-template-columns:1fr}.phero{padding:150px 0 50px}}

.sr{position:absolute;left:-9999px}
.oathscene{height:420vh;background:var(--fjord);color:var(--bone);position:relative}
.osticky{position:sticky;top:0;height:100vh;display:flex;align-items:center;overflow:hidden}
.ogrid{display:grid;grid-template-columns:1fr 1fr;gap:clamp(24px,5vw,80px);align-items:center;width:min(1180px,100% - 48px);margin:0 auto}

.yr{display:flex;align-items:baseline;gap:12px;margin:20px 0 6px}
.yr span{font-family:var(--serif);font-size:clamp(72px,10vw,140px);line-height:1;color:var(--gold)}
.yr small{font-size:11px;letter-spacing:.24em;text-transform:uppercase;color:#B4BCBF}
.readout{font-family:var(--serif);font-size:clamp(20px,2.2vw,28px);color:var(--bone);min-height:3.2em}
#oath{width:100%;max-width:340px;accent-color:var(--gold);margin-top:8px}
@media(max-width:900px){.ogrid{grid-template-columns:1fr}.ofig{order:-1}.ofig .stack{max-height:34vh}.yr span{font-size:64px}.readout{min-height:4.2em}.oathscene{height:360vh}}

/* luxury layer */
html.js body{opacity:0;transition:opacity 1.1s ease}html.js body.ready{opacity:1}
.hero2{display:grid;grid-template-columns:5fr 7fr;min-height:100svh;background:var(--ink);color:var(--bone)}
.h2text{display:flex;flex-direction:column;justify-content:center;padding:150px clamp(28px,5vw,80px) 70px clamp(28px,6vw,96px)}
.hero2 h1{font-size:clamp(56px,8.4vw,128px);letter-spacing:-.035em;margin:20px 0 26px;line-height:.95}
.hero2 h1 span{display:inline-block;opacity:0;transform:translateY(40px);animation:up 1.1s var(--ease) forwards}.hero2 h1 span:nth-child(2){animation-delay:.18s}
.hero2 .sub{max-width:36ch;font-size:clamp(16px,1.4vw,19px);color:#C4C9C8}
.hero2 .fine{margin-top:40px;font-size:11px;letter-spacing:.3em;text-transform:uppercase;color:var(--gold)}
.h2img{position:relative;overflow:hidden}
.h2img img{width:100%;height:100%;object-fit:cover;object-position:50% 60%;animation:zoomslow 30s ease-in-out infinite alternate}
@keyframes zoomslow{from{transform:scale(1)}to{transform:scale(1.08)}}
.h2img::after{content:"";position:absolute;inset:0;box-shadow:inset 90px 0 120px -40px #121619}
.h2img small,.slide small{position:absolute;right:14px;bottom:10px;font-size:10px;letter-spacing:.16em;text-transform:uppercase;color:#D0D4D3;z-index:2}
.orn{width:60px;height:1px;background:var(--gold);margin:22px auto 6px;position:relative}.orn::before{content:"";position:absolute;left:50%;top:-4px;width:9px;height:9px;background:var(--bone);border:1px solid var(--gold);transform:translateX(-50%) rotate(45deg)}
.statement p:not(.eyebrow){font-size:clamp(28px,4.2vw,56px)}
.rail{background:var(--ink);color:var(--bone);padding:clamp(80px,12vw,150px) 0 clamp(70px,10vw,120px);overflow:hidden}
.railnav{display:flex;gap:10px;margin-top:26px}.railnav button{width:52px;height:52px;background:none;border:1px solid rgba(190,150,80,.6);color:var(--bone);font-size:20px;cursor:pointer;transition:all .3s}.railnav button:hover{background:var(--gold);color:var(--ink)}
.railtrack{display:flex;gap:24px;overflow-x:auto;scroll-snap-type:x mandatory;padding:46px max(24px,calc((100vw - 1180px)/2)) 20px;scrollbar-width:none;cursor:grab}
.railtrack::-webkit-scrollbar{display:none}.railtrack.drag{cursor:grabbing;scroll-snap-type:none}
.slide{position:relative;flex:0 0 min(80vw,460px);aspect-ratio:4/5;overflow:hidden;scroll-snap-align:start;border:1px solid rgba(190,150,80,.35)}
.slide img{width:100%;height:100%;object-fit:cover;transition:transform 1.4s var(--ease);user-select:none;-webkit-user-drag:none}.slide:hover img{transform:scale(1.06)}
.slide figcaption{position:absolute;left:0;right:0;bottom:0;padding:60px 24px 24px;background:linear-gradient(180deg,transparent,rgba(10,13,15,.92))}
.slide figcaption p{font-family:var(--serif);font-size:22px;margin-top:6px;max-width:22ch;line-height:1.25}
.slide small{left:24px;right:auto;bottom:6px;position:static;display:block;margin-top:8px}
.imgcard{position:relative;aspect-ratio:4/5;padding:0;overflow:hidden;background:var(--ink);color:var(--bone);border:0}
.imgcard img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:.82;transition:transform 1.4s var(--ease),opacity .6s}
.imgcard:hover img{transform:scale(1.07);opacity:1}
.imgcard .cap{position:absolute;inset:auto 0 0 0;padding:70px 26px 26px;background:linear-gradient(180deg,transparent,rgba(10,13,15,.92))}
.imgcard .eyebrow{color:var(--gold)}.imgcard p{color:#C4C9C8}.imgcard .arrow{color:var(--gold)}
.rosecard{background:linear-gradient(160deg,#C48B7D,#8F5448)}.rosecard .eyebrow,.rosecard .arrow{color:#F3E4DE}.rosecard p{color:#F3E4DE}
.imgcard:hover{transform:none;background:var(--ink)}
.btn{padding:17px 34px;letter-spacing:.26em}
footer .bigword{font-family:var(--serif);font-size:clamp(40px,10.5vw,150px);letter-spacing:.08em;color:rgba(190,150,80,.14);text-align:center;margin-top:50px;white-space:nowrap;overflow:hidden;line-height:1}
footer .row{border-bottom:1px solid rgba(190,150,80,.2);padding-bottom:34px}
/* photo scenes */
.scene.photo{aspect-ratio:4/5;display:block;border:0;background:var(--ink);cursor:zoom-in;--x:50%;--y:50%}
.scene.photo img{width:100%;height:100%;object-fit:cover;transition:transform .5s ease-out;transform-origin:var(--x) var(--y)}
.main .scene.photo:hover img{transform:scale(1.9)}
.scene.photo .tag{color:#E0E3E2;text-shadow:0 1px 4px rgba(0,0,0,.7);z-index:2}
.thumbs .scene.photo{cursor:pointer}
.pdp .main .scene{border:1px solid rgba(18,22,25,.15)}
@media(max-width:900px){.hero2{grid-template-columns:1fr}.h2img{order:-1;height:62vh}.h2img::after{box-shadow:inset 0 -90px 90px -40px #121619}.h2text{padding:40px 24px 60px}.cards{grid-template-columns:1fr}}

.ofig .stack{position:relative;aspect-ratio:4/5;max-height:78vh;margin:0 auto;border:1px solid rgba(190,150,80,.35);overflow:hidden;background:#121619}
.ofig .stack img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:0}
.ofig .stack img:first-child{opacity:1}
.figcap{display:block;text-align:center;margin-top:10px;font-size:10px;letter-spacing:.16em;text-transform:uppercase;color:#B4BCBF}

.railtrack{scroll-padding-inline:max(24px,calc((100vw - 1180px)/2))}
.railtrack:focus-visible{outline:2px solid var(--gold);outline-offset:-4px}
.imgcard .cap{background:linear-gradient(180deg,rgba(10,13,15,0) 0,rgba(10,13,15,.78) 38%,rgba(10,13,15,.95) 100%);padding-top:110px}
.imgcard .eyebrow,.imgcard h3,.imgcard p,.imgcard .arrow{text-shadow:0 1px 6px rgba(0,0,0,.7)}
.h2img small{text-shadow:0 1px 5px rgba(0,0,0,.8)}
@media(prefers-reduced-motion:reduce){.hero2 h1 span{opacity:1;transform:none;animation:none}.h2img img{animation:none}html{scroll-behavior:auto}}

/* header: logo left, spaced links, shop right */
.bar .row{display:flex;align-items:center;justify-content:flex-start;gap:0;padding-top:20px;padding-bottom:20px}
.bar .brand{margin-right:auto}
.bar nav{gap:clamp(28px,3.4vw,52px);margin-right:clamp(32px,4vw,64px);font-size:12px;letter-spacing:.22em}
.bar nav a{padding:8px 0}
.bar .right{margin-left:0}
@media(max-width:1240px){
.bar .row{flex-wrap:wrap;row-gap:10px;padding-top:14px;padding-bottom:12px}
.bar .brand{margin-right:auto}
.bar .brand .mark{height:38px}.bar .brand span{font-size:14px;letter-spacing:.16em}
.bar nav{order:3;flex:0 0 100%;margin:0;gap:26px;overflow-x:auto;font-size:11px;letter-spacing:.2em;padding-bottom:2px;scrollbar-width:none}
.bar nav::-webkit-scrollbar{display:none}
.bar nav a{white-space:nowrap}
}

.bar .brand span,.bar nav a{white-space:nowrap}
.bar nav{gap:clamp(26px,3vw,48px)}
@media(min-width:1241px) and (max-width:1440px){.bar .brand span{letter-spacing:.14em;font-size:17px}.bar nav{letter-spacing:.16em;gap:22px;margin-right:24px}}
/* header spans the full width so the logo sits at the true top left */
.bar .wrap.row{width:100%;max-width:none;margin:0;padding-left:clamp(24px,6vw,96px);padding-right:clamp(24px,4vw,64px)}
@media(max-width:1240px){.bar .wrap.row{padding-left:24px;padding-right:24px}}

.why h2{font-size:clamp(26px,3.4vw,40px);margin:54px 0 14px}.why h2:first-child{margin-top:0}
.why{padding:clamp(60px,9vw,110px) 0 10px}.why p{font-size:18px;color:#3a4348;margin-bottom:14px}
.tablewrap{overflow-x:auto;margin:10px 0 6px}.why table{width:100%;border-collapse:collapse;font-size:15px}
.why th,.why td{text-align:left;padding:14px 16px;border-bottom:1px solid rgba(18,22,25,.18)}
.why th{font-size:11px;letter-spacing:.22em;text-transform:uppercase;color:var(--gold-deep);border-bottom:1px solid var(--gold)}
.inl{display:inline-block;font:600 12px var(--sans);letter-spacing:.2em;text-transform:uppercase;color:var(--gold-deep);text-decoration:none;border-bottom:1px solid var(--gold);padding-bottom:3px;margin-bottom:22px}
.inl:hover{color:var(--ink)}
.statement p.ctalink{font-size:inherit}

/* ===== competitor-informed additions (Oct 7) ===== */
.fteaser{padding:clamp(70px,10vw,120px) 0;text-align:center;background:var(--paper);border-block:1px solid rgba(18,22,25,.12)}
.fteaser h2{margin:14px 0 16px}
.fteaser .lead{margin:0 auto}
.fteaser .cta{justify-content:center}
/* finder */
.qz{padding:clamp(70px,10vw,120px) 0 clamp(40px,6vw,70px)}
.qz h2{margin:0 0 12px;font-size:clamp(32px,4.4vw,52px)}
.qz form{margin-top:36px}
.qz fieldset{border:0;margin:0 0 34px;min-width:0}
.qz legend{font-family:var(--serif);font-size:clamp(22px,2.6vw,30px);margin-bottom:14px;padding:0}
.qz .opts{display:flex;flex-wrap:wrap;gap:10px}
.qz .opt{position:relative}
.qz .opt input{position:absolute;inset:0;width:100%;height:100%;opacity:0;cursor:pointer;margin:0}
.qz .opt span{display:block;padding:12px 18px;border:1px solid rgba(18,22,25,.3);background:var(--paper);font-size:15px;transition:background .25s,color .25s,border-color .25s}
.qz .opt:hover span{border-color:var(--gold-deep)}
.qz .opt input:checked+span{background:var(--ink);color:var(--bone);border-color:var(--ink)}
.qz .opt input:focus-visible+span{outline:2px solid var(--gold-deep);outline-offset:3px}
.qzmsg{color:var(--rose-deep)}
.fres{display:none;margin-top:30px}
.fres.on{display:block}
.fres-grid{display:grid;grid-template-columns:1fr 1fr;gap:clamp(28px,5vw,70px);align-items:start;padding:clamp(24px,4vw,48px);background:var(--ink);color:var(--bone);border:1px solid var(--gold)}
.fres .eyebrow{color:var(--gold)}
.fres h2{font-size:clamp(34px,4.6vw,58px);margin:10px 0 10px}
.fres h2:focus{outline:none}
.fres .lead{color:#B8BFC2}
.fres h3{font-size:22px;margin:24px 0 8px;color:var(--gold)}
.fres ul{list-style:none}
.fres li{padding:9px 0;border-bottom:1px solid rgba(190,150,80,.22);color:#D2D6D5;font-size:15px}
.fres li.warn{color:#F0C9BE;border-left:2px solid var(--rose);padding-left:12px}
.pyr{display:grid;gap:6px;max-width:320px}
.pyr div{border:1px dashed rgba(190,150,80,.5);padding:8px 12px;font-size:13px;color:#AEB6B8;display:flex;justify-content:space-between}
.pyr div:nth-child(1){margin:0 60px}.pyr div:nth-child(2){margin:0 30px}
.fres .cta{margin-top:26px}
.fres .btn.dk{background:var(--gold);color:var(--ink);border-color:var(--gold)}
.fres .btn.dk:hover{background:transparent;color:var(--gold)}
.fres .btn.ghost-d{color:var(--bone);border-color:var(--bone)}
.fres .btn.ghost-d:hover{background:var(--bone);color:var(--ink)}
.fres .demo{color:#8E979B}
.fourset{padding:clamp(50px,8vw,100px) 0}
.fourset h2{margin:0 0 12px;font-size:clamp(30px,4vw,48px)}
.setgrid{display:grid;grid-template-columns:repeat(4,1fr);gap:18px;margin-top:34px}
.setcard img{width:100%;aspect-ratio:4/5;object-fit:cover}
.setcard figcaption{padding-top:12px}
.setcard h3{font-size:24px;margin-bottom:6px}
.setcard p{color:var(--mute);font-size:14px}
.setcard small{display:block;margin-top:6px;font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:var(--mute)}
/* shop: gift, refill, assurance */
.opt2{margin-top:22px;display:grid;gap:12px}
.chk{display:flex;align-items:center;gap:10px;cursor:pointer;font-size:15px}
.chk input{width:18px;height:18px;accent-color:var(--ink)}
.giftbox textarea{resize:vertical;min-height:84px}
.gcount{font-size:11px;color:var(--mute);text-align:right;margin-top:4px}
.giftcard{margin-top:10px;padding:18px 20px;background:var(--paper);border:1px solid var(--gold);position:relative}
.giftcard::before{content:"";position:absolute;inset:5px;border:1px solid rgba(190,150,80,.4);pointer-events:none}
.giftcard p{font-family:var(--serif);font-size:19px;line-height:1.35;margin:8px 0 10px;overflow-wrap:anywhere}
.giftcard small{font-size:10px;letter-spacing:.2em;text-transform:uppercase;color:var(--gold-deep)}
.sel{display:grid;gap:6px}
.sel .lbl{font-size:12px;letter-spacing:.14em;text-transform:uppercase;color:var(--mute)}
.assure{margin-top:26px;padding:20px 22px;border:1px solid rgba(18,22,25,.2);background:var(--paper)}
.assure ul{list-style:none;margin:10px 0 14px}
.assure li{padding:8px 0;border-bottom:1px solid rgba(18,22,25,.1);font-size:14px;color:var(--mute)}
.assure li:last-child{border-bottom:0}
.assure b{color:var(--ink);font-weight:600}
.assure a{color:var(--gold-deep)}
.pt .btn{padding:12px 20px}
.ptout{margin-top:12px;font-size:14px;color:var(--mute);max-width:56ch}
.ptout:empty{display:none}
/* notes */
.notes{padding:clamp(60px,9vw,110px) 0 20px}
.nart{padding:0 0 clamp(50px,7vw,80px);margin-bottom:clamp(40px,6vw,70px);border-bottom:1px solid rgba(18,22,25,.18)}
.nart:last-child{border-bottom:0;margin-bottom:0}
.nart h2{margin:12px 0 18px;font-size:clamp(30px,4vw,48px)}
.nart p{margin:14px 0;color:var(--mute);font-size:18px}
.nart .qa.light{color:var(--ink)}
.steps{margin:22px 0 22px 1.2em;display:grid;gap:12px;color:var(--mute);font-size:17px}
.steps b{color:var(--ink);font-weight:600}
/* stockists */
.stock{padding:clamp(70px,10vw,130px) 0;background:var(--paper)}
.stock .grid{display:grid;grid-template-columns:1fr 1fr;gap:clamp(30px,6vw,90px);align-items:start}
.stock h2{margin:0 0 14px;font-size:clamp(32px,4.4vw,52px)}
.trade{display:grid;gap:10px;margin-top:24px}
.trade .btn{justify-self:start;margin-top:6px}
.ledger.light{border-top-color:rgba(18,22,25,.25)}
.ledger.light .r{border-bottom-color:rgba(18,22,25,.15)}
.ledger.light span{color:var(--gold-deep)}
.locator{margin-top:26px;padding:22px;border:1px dashed rgba(18,22,25,.3);color:var(--mute)}
@media(max-width:900px){.fres-grid,.stock .grid{grid-template-columns:1fr}.setgrid{grid-template-columns:1fr 1fr}}
@media(max-width:520px){.setgrid{grid-template-columns:1fr}}

/* ===== elevation pass (Oct 7, late) ===== */
h1,h2,h3{text-wrap:balance}
p,li,.lead{text-wrap:pretty}
/* scroll progress hairline */
.sprog{position:absolute;left:0;right:0;top:0;height:1px;background:transparent;pointer-events:none}
.sprog i{display:block;height:1px;width:0;background:var(--gold);transition:width .15s linear}
/* menu button */
.menubtn{display:none;background:none;border:0;color:inherit;font:inherit;letter-spacing:.18em;text-transform:uppercase;font-size:12px;cursor:pointer;align-items:center;gap:10px;padding:8px 0}
.menubtn .mline{width:26px;height:1px;background:currentColor;position:relative;transition:background .3s}
.menubtn .mline::before,.menubtn .mline::after{content:"";position:absolute;left:0;right:0;height:1px;background:currentColor;transition:transform .35s var(--ease)}
.menubtn .mline::before{top:-7px}.menubtn .mline::after{top:7px}
.menubtn[aria-expanded=true] .mline{background:transparent}
.menubtn[aria-expanded=true] .mline::before{transform:translateY(7px) rotate(45deg)}
.menubtn[aria-expanded=true] .mline::after{transform:translateY(-7px) rotate(-45deg)}
/* full-screen menu */
.menu{position:fixed;inset:0;z-index:49;background:var(--ink);color:var(--bone);overflow:auto;opacity:0;transition:opacity .4s var(--ease)}
.menu[hidden]{display:none}
.menu.on{opacity:1}
.menu::before{content:"";position:absolute;inset:0;background:radial-gradient(90% 60% at 100% 0,rgba(190,150,80,.14),transparent 60%);pointer-events:none}
.menuin{position:relative;width:min(1180px,100% - 48px);margin:0 auto;padding:130px 0 60px}
.menu .eyebrow{color:var(--gold)}
.menubig{list-style:none;margin:22px 0 34px}
.menubig li{border-bottom:1px solid rgba(190,150,80,.22)}
.menubig a{display:flex;align-items:baseline;gap:22px;padding:18px 0;text-decoration:none;font-family:var(--serif);font-size:clamp(34px,7vw,64px);letter-spacing:-.02em;line-height:1.05;transition:color .3s,padding-left .4s var(--ease)}
.menubig a i{font-style:normal;font-family:var(--sans);font-size:11px;letter-spacing:.24em;color:var(--gold);min-width:2.2em}
.menubig a:hover,.menubig a[aria-current=page]{color:var(--gold);padding-left:10px}
.menusmall{display:flex;flex-wrap:wrap;gap:12px 28px;font-size:12px;letter-spacing:.18em;text-transform:uppercase}
.menusmall a{text-decoration:none;color:#B8BFC2;padding:6px 0;border-bottom:1px solid transparent;transition:color .3s,border-color .3s}
.menusmall a:hover{color:var(--bone);border-color:var(--gold)}
.menufoot{margin-top:50px;font-size:11px;letter-spacing:.24em;text-transform:uppercase;color:#7A8387}
body.menu-open{overflow:hidden}
body.menu-open .bar{background:var(--ink);border-color:transparent}
@media(max-width:1240px){
  .bar nav{display:none}
  .menubtn{display:inline-flex}
  .bar .row{flex-wrap:nowrap;padding-top:16px;padding-bottom:16px}
  .bar .right{gap:22px}
}
@media(max-width:520px){.menubtn .mtxt{display:none}.bagbtn{padding:7px 12px;font-size:11px}}
/* footer, three columns */
footer{padding:70px 0 40px}
.fgrid{display:grid;grid-template-columns:1.4fr 1fr 1fr 1fr;gap:40px 30px;padding-bottom:40px;border-bottom:1px solid rgba(190,150,80,.2)}
.fbrand .mark{height:54px}
.ftag{font-family:var(--serif);font-size:20px;color:var(--bone);margin-top:18px;line-height:1.35}
.fcol .eyebrow{color:var(--gold);margin-bottom:14px}
.fcol a{display:block;margin:0 0 10px;font-size:13px;letter-spacing:.04em;text-transform:none;color:#C4C9C8;text-decoration:none;transition:color .3s,padding-left .3s}
.fcol a:hover{color:var(--gold);padding-left:6px}
.fnote{padding-top:22px;font-size:12px;color:#7A8387;max-width:70ch}
footer .bigword{margin-top:34px}
@media(max-width:900px){.fgrid{grid-template-columns:1fr 1fr}.fbrand{grid-column:1/-1}}
@media(max-width:520px){.fgrid{grid-template-columns:1fr}}
/* price treatment */
.pinfo .price{display:flex;align-items:baseline;gap:14px;margin:12px 0 6px;font-family:var(--serif);font-size:22px}
.pinfo .price .tba{color:var(--gold-deep);font-style:italic}
/* buttons: arrow nudge on hover */
.btn{position:relative}
.btn:not(.ghost):not(.ghost-d)::after,.btn.dk::after{content:"\2192";display:inline-block;margin-left:10px;transform:translateX(-4px);opacity:0;transition:transform .35s var(--ease),opacity .35s}
.btn:hover::after{transform:none;opacity:1}
.btn.ghost::after,.btn.ghost-d::after{content:none}
/* images fade in as they load */
.js img.ld{opacity:0;transition:opacity .9s var(--ease)}
.js img.ld.ok{opacity:1}
.js .imgcard img.ld.ok{opacity:.82}
.js .imgcard:hover img.ld.ok{opacity:1}
/* accordions animate open (modern browsers; harmless elsewhere) */
.acc details{interpolate-size:allow-keywords}
.acc details::details-content{block-size:0;overflow:clip;transition:block-size .45s var(--ease),content-visibility .45s allow-discrete}
.acc details[open]::details-content{block-size:auto}
.acc summary{transition:color .3s,padding-left .35s var(--ease)}
.acc details[open] summary{color:var(--gold-deep)}
.dark .acc details[open] summary{color:var(--gold)}
/* marquee pauses on hover */
.marq:hover .t{animation-play-state:paused}
/* lightbox */
.lb{position:fixed;inset:0;z-index:90;background:rgba(10,13,15,.94);display:grid;place-items:center;padding:24px;opacity:0;transition:opacity .35s var(--ease)}
.lb[hidden]{display:none}
.lb.on{opacity:1}
.lb figure{max-width:min(92vw,1000px);max-height:92vh;display:grid;gap:14px;justify-items:center}
.lb img{max-width:100%;max-height:80vh;object-fit:contain;border:1px solid rgba(190,150,80,.35);box-shadow:0 40px 80px rgba(0,0,0,.6)}
.lb figcaption{font-size:11px;letter-spacing:.2em;text-transform:uppercase;color:#B8BFC2;text-align:center}
.lbx{position:absolute;top:18px;right:22px;background:none;border:1px solid rgba(190,150,80,.5);color:var(--bone);width:44px;height:44px;font-size:26px;cursor:pointer;transition:background .3s,color .3s}
.lbx:hover{background:var(--gold);color:var(--ink)}
.slide img,.setcard img,.main .scene.photo,.h2img img{cursor:zoom-in}
/* route transition (one-file version) */
.pg{transition:opacity .2s var(--ease),transform .2s var(--ease)}
.pg.out{opacity:0;transform:translateY(10px)}
@media(prefers-reduced-motion:reduce){.pg,.js img.ld,.acc details::details-content,.menu,.lb{transition:none}.js img.ld{opacity:1}}

.btn{white-space:nowrap}
.js .imgcard img.ld{transition:transform 1.4s var(--ease),opacity .9s var(--ease)}

/* footer wordmark: one word, fits the width */
footer .bigword{font-size:clamp(60px,16.4vw,250px);letter-spacing:.06em;margin-top:40px;line-height:.95;text-align:center;overflow:visible}

.fnote{max-width:none}.fnote p{max-width:70ch}

/* ===== runes and glass (Oct 7, later) ===== */
::selection{background:var(--gold);color:var(--ink)}
/* rune svg basics */
svg.rune,svg.wmrune,svg.ornrune,svg.mq,svg.setrune,svg.qmark,svg.footrune,svg.runeline-svg{display:inline-block;height:1em;width:auto;vertical-align:-.12em;color:currentColor;overflow:visible}
/* watermarks: huge, faint, drifting */
.wm{position:absolute;inset:0;overflow:hidden;pointer-events:none;z-index:0}
.wm svg{position:absolute;right:-4%;top:50%;height:min(78vh,520px);width:auto;transform:translateY(-50%);color:var(--gold);opacity:.07;animation:wmdrift 26s ease-in-out infinite alternate}
.wm svg.wide{height:auto;width:min(92%,1100px);right:auto;left:-2%;top:62%;opacity:.055}
@keyframes wmdrift{from{transform:translateY(-52%) translateX(0)}to{transform:translateY(-48%) translateX(-1.5%)}}
.phero{position:relative;overflow:hidden}
.phero .wrap{position:relative;z-index:1}
.hero2 .h2text{position:relative;overflow:hidden}
.hero2 .h2text>*{position:relative;z-index:1}
.hero2 .h2text .wm{z-index:0}
/* cards: rune in the corner, brightens on hover */
.imgcard .cardrune{position:absolute;right:16px;top:14px;z-index:1;pointer-events:none}
.imgcard .cardrune svg{height:56px;color:var(--gold);opacity:.28;filter:drop-shadow(0 1px 2px rgba(0,0,0,.6));transition:opacity .6s,transform .9s var(--ease)}
.imgcard:hover .cardrune svg{opacity:.75;transform:translateY(-3px)}
.rosecard .cardrune svg{color:#fff;opacity:.35}
/* ornament rune draws itself in */
.orn{width:auto;height:auto;background:none;margin:18px auto 8px;display:flex;justify-content:center}
.orn::before{content:none}
.orn svg{height:22px;color:var(--gold-deep)}
.dark .orn svg{color:var(--gold)}
svg.draw polyline{stroke-dasharray:60;stroke-dashoffset:60}
.js .in svg.draw polyline,.js svg.draw.in polyline,:not(.js) svg.draw polyline{animation:carve 1.6s var(--ease) forwards}
.js svg.draw polyline:nth-child(2){animation-delay:.25s}.js svg.draw polyline:nth-child(3){animation-delay:.5s}.js svg.draw polyline:nth-child(4){animation-delay:.75s}
@keyframes carve{to{stroke-dashoffset:0}}
/* marquee glyphs */
.marq .t svg.mq{height:.9em;margin-right:10px;vertical-align:-.1em;opacity:.8}
/* setting monograms */
svg.setrune{height:.85em;margin-left:10px;opacity:.9;color:var(--gold);cursor:help}
.slide figcaption svg.setrune{position:absolute;right:14px;top:14px;height:20px;margin:0}
.setcard h3 svg.setrune{vertical-align:-.05em}
/* quick-answer mark */
svg.qmark{height:1.05em;margin-right:8px;vertical-align:-.2em;color:var(--gold)}
.qa.light svg.qmark{color:var(--gold-deep)}
/* footer rune line + hint */
.runeline{display:flex;align-items:center;justify-content:space-between;gap:20px;margin-top:18px;padding-top:14px;border-top:1px solid rgba(190,150,80,.14)}
svg.footrune{height:22px;color:var(--gold);opacity:.55;cursor:help;transition:opacity .4s}
svg.footrune:hover{opacity:1}
.runeline .hint{font-size:10px;letter-spacing:.3em;text-transform:uppercase;color:rgba(190,150,80,.35)}
.runeline .hint b{font-weight:600;color:rgba(190,150,80,.6)}
/* typed-rune mode: every heading grows its runic line */
.runeline-svg{display:block;height:.42em;max-width:100%;margin:.28em 0 0;color:var(--gold-deep);opacity:0;transform:translateY(-4px);transition:opacity .6s var(--ease),transform .6s var(--ease)}
.dark .runeline-svg,.phero .runeline-svg,.hero2 .runeline-svg,.fres .runeline-svg,.menu .runeline-svg{color:var(--gold)}
body.runes .runeline-svg{opacity:.85;transform:none}
.runeline-svg polyline{stroke-width:1.1}
/* ===== glass ===== */
.glass,.glass-l,.glass-d{position:relative;border:1px solid rgba(255,255,255,.14);background:rgba(27,38,44,.42);-webkit-backdrop-filter:blur(18px) saturate(1.4);backdrop-filter:blur(18px) saturate(1.4);box-shadow:inset 0 1px 0 rgba(255,255,255,.18),inset 0 -1px 0 rgba(0,0,0,.25),0 20px 50px -30px rgba(0,0,0,.6)}
.glass::before,.glass-l::before,.glass-d::before{content:"";position:absolute;inset:0;pointer-events:none;background:linear-gradient(115deg,rgba(255,255,255,.14) 0,rgba(255,255,255,0) 32%,rgba(255,255,255,0) 68%,rgba(190,150,80,.10) 100%);mix-blend-mode:screen;opacity:.9}
.glass::after,.glass-l::after,.glass-d::after{content:"";position:absolute;top:0;bottom:0;width:38%;left:-45%;pointer-events:none;background:linear-gradient(100deg,transparent 0,rgba(255,255,255,.10) 45%,rgba(255,255,255,.18) 50%,rgba(255,255,255,.10) 55%,transparent 100%);transform:skewX(-12deg);animation:sheen 9s ease-in-out infinite}
@keyframes sheen{0%,55%{left:-45%}85%,100%{left:120%}}
.glass-l{background:rgba(255,255,255,.55);border-color:rgba(18,22,25,.12);box-shadow:inset 0 1px 0 rgba(255,255,255,.9),0 20px 50px -34px rgba(18,22,25,.35)}
.glass-l::before{mix-blend-mode:normal;background:linear-gradient(115deg,rgba(255,255,255,.6) 0,rgba(255,255,255,0) 35%,rgba(190,150,80,.08) 100%)}
.glass-d{background:rgba(238,234,226,.86);border-color:rgba(190,150,80,.35);box-shadow:inset 0 1px 0 rgba(255,255,255,.8),0 40px 80px -30px rgba(0,0,0,.6)}
.glass-d::before{mix-blend-mode:normal;background:linear-gradient(115deg,rgba(255,255,255,.5) 0,rgba(255,255,255,0) 40%,rgba(190,150,80,.08) 100%)}
.glass>*,.glass-l>*,.glass-d>*{position:relative;z-index:1}
@supports not ((backdrop-filter:blur(1px)) or (-webkit-backdrop-filter:blur(1px))){.glass{background:rgba(27,38,44,.92)}.glass-l{background:rgba(255,255,255,.94)}.glass-d{background:var(--bone)}}
/* where glass lands */
.phero .qa.glass{border-left:1px solid rgba(255,255,255,.14);padding:22px 26px;max-width:66ch}
.phero .qa.glass::before{border-left:2px solid var(--gold);left:0}
.slide figcaption.glass{position:absolute;left:14px;right:14px;bottom:14px;padding:16px 18px;color:var(--bone);border-radius:2px}
.slide figcaption.glass .eyebrow{color:var(--gold)}
.slide figcaption.glass p{font-family:var(--serif);font-size:18px;margin:6px 0 4px;color:var(--bone)}
.slide figcaption.glass small{font-size:9px;letter-spacing:.16em;text-transform:uppercase;color:#C9CDCB;position:static}
.slide{position:relative}
.assure.glass-l{padding:22px 24px}
.drawer.glass-d{background:rgba(238,234,226,.88)}
.drawer.glass-d footer{background:rgba(246,243,236,.7)}
.bar.solid{background:rgba(18,22,25,.72);-webkit-backdrop-filter:blur(18px) saturate(1.5);backdrop-filter:blur(18px) saturate(1.5);box-shadow:inset 0 -1px 0 rgba(255,255,255,.05)}
.menu{background:rgba(18,22,25,.86);-webkit-backdrop-filter:blur(26px) saturate(1.4);backdrop-filter:blur(26px) saturate(1.4)}
.lb figcaption{padding:8px 16px;border-radius:2px}
.fres-grid.glass{background:rgba(18,22,25,.72)}
.demoban{-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);background:rgba(190,150,80,.92)}
/* hero parallax */
.h2img img[data-plx]{transform:scale(1.06) translate(var(--px,0),var(--py,0));transition:transform .9s cubic-bezier(.2,.7,.2,1);animation:none;will-change:transform}
.h2img::before{content:"";position:absolute;inset:0;z-index:1;pointer-events:none;background:radial-gradient(60% 50% at var(--mx,50%) var(--my,50%),rgba(255,255,255,.07),transparent 70%);transition:background .3s}
/* buttons: specular sweep on primary */
.btn:not(.ghost):not(.ghost-d){overflow:hidden}
.btn:not(.ghost):not(.ghost-d)::before{content:"";position:absolute;top:-20%;bottom:-20%;width:30%;left:-40%;background:linear-gradient(100deg,transparent,rgba(255,255,255,.35),transparent);transform:skewX(-15deg);transition:left .7s var(--ease)}
.btn:not(.ghost):not(.ghost-d):hover::before{left:120%}
.btn>*{position:relative}
@media(prefers-reduced-motion:reduce){.wm svg,.glass::after,.glass-l::after,.glass-d::after{animation:none}svg.draw polyline{stroke-dashoffset:0;animation:none}.h2img img[data-plx]{transform:none;transition:none}}
@media(max-width:900px){.wm svg{height:min(50vh,340px);right:-10%}.wm svg.wide{width:140%;left:-20%;top:70%}.slide figcaption.glass{left:10px;right:10px;bottom:10px;padding:12px 14px}}

/* fixes after render */
.glass,.glass-l,.glass-d{overflow:hidden}
svg.runeline-svg{display:block;height:.36em;opacity:0}
body.runes svg.runeline-svg{opacity:.7}
.imgcard h3 svg.runeline-svg{height:.5em;margin-top:.2em}
.wm svg.wide{opacity:.09}
.wm svg{opacity:.085}

/* live pricing */
.hero2 .h2text .wm{position:absolute}
.pinfo .price{display:flex;align-items:baseline;gap:14px;margin:10px 0 4px}
.pinfo .price .amt{font-family:var(--serif);font-size:34px;letter-spacing:-.01em}
.pinfo .price .per{font-size:12px;letter-spacing:.08em;text-transform:uppercase;color:var(--mute)}
.sizes{display:flex;gap:10px;margin:6px 0 18px}
.sz{font:inherit;font-size:14px;padding:12px 18px;border:1px solid rgba(18,22,25,.3);background:var(--paper);cursor:pointer;display:flex;gap:10px;align-items:baseline;transition:background .25s,color .25s,border-color .25s}
.sz b{font-weight:600;font-size:13px;color:var(--gold-deep)}
.sz[aria-checked=true]{background:var(--ink);color:var(--bone);border-color:var(--ink)}
.sz[aria-checked=true] b{color:var(--gold)}
.sz:hover{border-color:var(--gold-deep)}
.drawer .ship{font-size:12px;color:var(--gold-deep);margin:-6px 0 12px;letter-spacing:.04em}
.line .lp{font-family:var(--serif);font-size:18px}
.demoban{display:none}
body.has-ban .bar{top:0}

.modal .row2{flex-wrap:wrap}.modal .row2 .btn{min-width:140px}
.pyr div{max-width:none}.pyr{max-width:360px}

/* ===== oil drip + living scenes (Oct 7) ===== */
.drip{width:120px;height:150px;margin:18px auto 4px;position:relative}
.drip svg{width:100%;height:100%;overflow:visible;filter:drop-shadow(0 6px 10px rgba(78,46,7,.18))}
.drip .pool ellipse{stroke-width:.8;opacity:0}
.drip .hl{opacity:.8}
.drip-left{margin:0 0 10px -10px;width:90px;height:120px}
.dark .drip svg{filter:drop-shadow(0 6px 14px rgba(0,0,0,.4))}
/* hero cinemagraph */
.h2img{isolation:isolate}
.cine{position:absolute;z-index:1;pointer-events:none;transform:scale(1.06) translate(var(--px,0),var(--py,0));transition:transform .9s cubic-bezier(.2,.7,.2,1)}
.h2img img[data-plx]{position:relative;z-index:0}
.cine{z-index:1}
.h2img::after{z-index:2}.h2img::before{z-index:3}
.cine .wl,.cine .wr{position:absolute;top:38%;height:32%;overflow:hidden;filter:url(#ntRipple);-webkit-mask-image:linear-gradient(180deg,transparent 0,#000 22%,#000 70%,transparent 100%);mask-image:linear-gradient(180deg,transparent 0,#000 22%,#000 70%,transparent 100%)}
.cine .wl{left:0;width:34%}
.cine .wr{left:64%;width:36%}
.cine .wl::after,.cine .wr::after{content:"";position:absolute;inset:0}
.cine .wl{-webkit-mask-image:linear-gradient(180deg,transparent 0,#000 22%,#000 70%,transparent 100%),linear-gradient(90deg,#000 80%,transparent 100%);-webkit-mask-composite:source-in;mask-image:linear-gradient(180deg,transparent 0,#000 22%,#000 70%,transparent 100%),linear-gradient(90deg,#000 80%,transparent 100%);mask-composite:intersect}
.cine .wr{-webkit-mask-image:linear-gradient(180deg,transparent 0,#000 22%,#000 70%,transparent 100%),linear-gradient(90deg,transparent 0,#000 18%);-webkit-mask-composite:source-in;mask-image:linear-gradient(180deg,transparent 0,#000 22%,#000 70%,transparent 100%),linear-gradient(90deg,transparent 0,#000 18%);mask-composite:intersect}
.cine .wl img,.cine .wr img{position:absolute;top:-118.75%;height:312.5%;width:auto;max-width:none;animation:none;transform:none}
.cine .wl img{left:0;width:294.1%;height:auto}
.cine .wr img{left:-177.8%;width:277.8%;height:auto}
.mist{position:absolute;left:-30%;width:70%;height:22%;border-radius:50%;background:radial-gradient(closest-side,rgba(226,232,238,.34),rgba(226,232,238,0));filter:blur(14px);mix-blend-mode:screen;animation:mist 46s linear infinite}
.mist.m1{top:14%;animation-duration:58s}
.mist.m2{top:30%;height:16%;width:55%;animation-duration:44s;animation-delay:-20s;opacity:.8}
.mist.m3{top:22%;height:12%;width:40%;animation-duration:70s;animation-delay:-45s;opacity:.6}
@keyframes mist{from{transform:translateX(0)}to{transform:translateX(200%)}}
/* scene light: flame, torch, fire, warm spill */
.slide,.sci{position:relative;overflow:hidden}
.sci img{display:block}
.glow{position:absolute;width:var(--gs);aspect-ratio:1;transform:translate(-50%,-50%);border-radius:50%;pointer-events:none;mix-blend-mode:screen;z-index:1}
.g-flame,.g-torch{background:radial-gradient(closest-side,rgba(255,214,140,.75),rgba(255,160,60,.25) 55%,rgba(255,140,40,0));animation:flick 2.8s steps(1,end) infinite,sway 3.4s ease-in-out infinite}
.g-warm{background:radial-gradient(closest-side,rgba(255,170,80,.22),rgba(255,140,40,0));animation:breathe 5.5s ease-in-out infinite}
.g-fire{background:radial-gradient(closest-side,rgba(255,170,70,.55),rgba(255,110,30,.18) 55%,rgba(255,90,20,0));animation:fire 1.9s steps(1,end) infinite}
@keyframes flick{0%{opacity:.85}13%{opacity:.62}22%{opacity:.95}37%{opacity:.7}51%{opacity:.9}64%{opacity:.58}78%{opacity:1}91%{opacity:.74}}
@keyframes sway{0%,100%{transform:translate(-50%,-50%) scale(1)}50%{transform:translate(-49%,-51%) scale(1.07)}}
@keyframes breathe{0%,100%{opacity:.75}50%{opacity:1}}
@keyframes fire{0%{opacity:.8;transform:translate(-50%,-50%) scale(1)}17%{opacity:1;transform:translate(-50%,-52%) scale(1.06)}33%{opacity:.7;transform:translate(-51%,-50%) scale(.97)}50%{opacity:.95;transform:translate(-50%,-51%) scale(1.04)}67%{opacity:.75;transform:translate(-49%,-50%) scale(1)}83%{opacity:1;transform:translate(-50%,-52%) scale(1.08)}}
.slide:hover .glow{transform:translate(-50%,-50%) scale(1.06)}
@media(prefers-reduced-motion:reduce){.mist,.glow{animation:none}.cine .wl,.cine .wr{filter:none}}
@media(max-width:900px){.cine .wl,.cine .wr{display:none}}