:root{
  --steel:#E6E6E2;
  --steel-2:#D6D6D1;
  --graphite:#1C1C1C;
  --mute:#6E6E6A;
  --red:#C8102E;
  --paper:#FAFAF8;
  --ivory:#F4F0E8;
  --noir:#151412;
  --gold:#C9A96E;
  --bg:var(--steel);
  --fg:var(--graphite);
  --sans:"Archivo","Helvetica Neue",Arial,sans-serif;
  --serif:"Cormorant Garamond","Times New Roman",serif;
  --gut:clamp(16px,3.4vw,48px);
  --ease:cubic-bezier(.7,0,.2,1);
}
*{box-sizing:border-box;margin:0;padding:0}
html.lenis{height:auto}.lenis.lenis-smooth{scroll-behavior:auto}
body{background:var(--bg);color:var(--fg);font:400 16px/1.55 var(--sans);font-stretch:100%;-webkit-font-smoothing:antialiased;transition:background-color .6s var(--ease),color .6s var(--ease);overflow-x:hidden}
img,video{display:block;max-width:100%}
a{color:inherit;text-decoration:none}
button{font:inherit;color:inherit;cursor:pointer;background:none;border:0}
:focus-visible{outline:2px solid var(--red);outline-offset:3px}
.wide{font-stretch:125%;letter-spacing:-.03em}
.logo{height:30px;width:auto;display:block;color:currentColor}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}

/* ---------- loader ---------- */
.loader{position:fixed;inset:0;z-index:100;background:var(--graphite);color:#fff;display:grid;place-items:center}
.loader .in{display:grid;justify-items:center;gap:26px}
.loader .logo{height:44px;color:#fff}
.loader .rule{width:min(320px,60vw);height:1px;background:rgba(255,255,255,.18);position:relative;overflow:hidden}
.loader .rule i{position:absolute;inset:0;background:var(--red);transform-origin:left;transform:scaleX(0)}
.no-motion .loader{display:none}

/* ---------- header ---------- */
.hdr{--fg:#1C1C1C;--bg:#E6E6E2;position:fixed;top:0;left:0;right:0;z-index:50;display:flex;align-items:center;justify-content:space-between;padding:20px var(--gut);pointer-events:none;color:var(--fg);transition:color .6s var(--ease)}
.hdr>*{pointer-events:auto}
.hdr{transition:color .6s var(--ease),background-color .5s var(--ease),padding .4s var(--ease),transform .5s var(--ease),border-color .5s}
.hdr{border-bottom:1px solid transparent}
.hdr.solid{pointer-events:auto;padding-top:12px;padding-bottom:12px;background:color-mix(in srgb,var(--bg) 86%,transparent);-webkit-backdrop-filter:saturate(1.3) blur(18px);backdrop-filter:saturate(1.3) blur(18px);border-bottom-color:color-mix(in srgb,var(--fg) 12%,transparent)}
.hdr.solid .pill{background:transparent;border-color:color-mix(in srgb,var(--fg) 18%,transparent);backdrop-filter:none}
.hdr.solid .pill:hover{background:var(--fg);color:var(--bg)}
.hdr.hide{transform:translateY(-100%)}
@media (prefers-reduced-motion:reduce){.hdr{transition:none}}
.hdr nav{display:flex;gap:6px}
.pill{height:42px;padding:0 18px;border-radius:21px;display:inline-flex;align-items:center;gap:10px;font-size:14px;font-weight:500;background:color-mix(in srgb,var(--bg) 70%,transparent);backdrop-filter:blur(12px);border:1px solid color-mix(in srgb,var(--fg) 14%,transparent);transition:background .3s,color .3s}
.pill:hover{background:var(--fg);color:var(--bg)}
.pill .dot{width:6px;height:6px;border-radius:50%;background:var(--red)}
.hide-m{display:inline-flex}

/* ---------- hero ---------- */
.hero{position:relative;height:100vh;overflow:hidden;background:var(--steel)}
.hero .stage{position:absolute;inset:0}
.hero h1{position:absolute;left:var(--gut);right:var(--gut);top:50%;transform:translateY(-54%);font-weight:300;font-size:clamp(46px,11.2vw,190px);line-height:.86;pointer-events:none;z-index:1}
.hero h1 .row{display:block;overflow:hidden;padding-bottom:.04em}
.hero h1 .row span{display:inline-block}
.hero h1 .r2{text-align:right;font-weight:700}
.hero .tw{position:absolute;left:50%;top:50%;width:clamp(150px,17vw,300px);transform:translate(-50%,-50%) rotate(-18deg);transform-origin:14% 97%;z-index:2;mix-blend-mode:multiply}
.hero .tw img{width:100%}
.hero .after{position:absolute;left:var(--gut);bottom:15vh;max-width:380px;z-index:3;opacity:0}
.hero .after p{font-size:clamp(22px,2.2vw,32px);line-height:1.15;font-weight:500;font-stretch:115%}
.hero .after span{display:block;margin-top:14px;color:var(--mute);font-size:15px;line-height:1.5}
.hero .meta{position:absolute;left:var(--gut);right:var(--gut);bottom:28px;display:flex;justify-content:space-between;align-items:flex-end;font-size:13px;color:var(--mute);z-index:3}
.hero .meta .swiss{height:15px;width:auto;color:var(--graphite)}
.ruler{position:absolute;left:0;right:0;bottom:0;height:14px;z-index:2;background:repeating-linear-gradient(90deg,var(--graphite) 0 1px,transparent 1px 12px);opacity:.25;-webkit-mask:linear-gradient(90deg,transparent,#000 10%,#000 90%,transparent)}
.ruler::after{content:"";position:absolute;inset:0;background:repeating-linear-gradient(90deg,var(--graphite) 0 1px,transparent 1px 120px);height:22px;top:-8px}
.scrollhint{display:flex;align-items:center;gap:10px}
.scrollhint i{width:1px;height:34px;background:var(--graphite);opacity:.4;position:relative;overflow:hidden}
.scrollhint i::after{content:"";position:absolute;left:0;top:-40%;width:1px;height:40%;background:var(--red);animation:drip 1.8s var(--ease) infinite}
@keyframes drip{to{top:100%}}

/* ---------- origin (horizontal) ---------- */
.origin{background:var(--paper);position:relative;overflow:hidden}
.origin .intro{padding:16vh var(--gut) 8vh;display:grid;grid-template-columns:1fr 1fr;gap:40px;align-items:end}
.origin h2{font-size:clamp(38px,6vw,96px);font-weight:300;line-height:.95}
.origin h2 b{font-weight:700;display:block}
.origin .intro p{max-width:44ch;color:var(--mute);justify-self:end}
.track{display:flex;gap:clamp(20px,3vw,48px);padding:0 var(--gut) 14vh;width:max-content}
.panel{width:min(78vw,980px);display:grid;grid-template-columns:1.25fr 1fr;gap:clamp(20px,3vw,44px);align-items:end}
.panel figure{overflow:hidden;aspect-ratio:4/3;background:var(--steel)}
.panel figure img{width:100%;height:100%;object-fit:cover;transform:scale(1.15)}
.panel .yr{font-size:clamp(64px,9vw,148px);font-weight:200;font-stretch:125%;line-height:.8;letter-spacing:-.04em;color:var(--red)}
.panel h3{font-size:22px;font-weight:600;margin:22px 0 10px;font-stretch:110%}
.panel p{color:var(--mute);max-width:36ch}
.progress{position:absolute;left:var(--gut);right:var(--gut);bottom:6vh;height:1px;background:color-mix(in srgb,var(--graphite) 14%,transparent)}
.progress i{position:absolute;inset:0;background:var(--graphite);transform-origin:left;transform:scaleX(0)}

/* ---------- loupe ---------- */
.loupe-sec{background:var(--graphite);color:#EDEDEA;padding:16vh var(--gut)}
.loupe-sec .top{display:grid;grid-template-columns:1fr 1fr;gap:40px;align-items:end;margin-bottom:56px}
.loupe-sec h2{font-size:clamp(36px,5.2vw,84px);font-weight:300;line-height:.95}
.loupe-sec h2 b{font-weight:700;display:block}
.loupe-sec .top p{color:#A9A9A4;max-width:44ch;justify-self:end}
.toggle{display:inline-flex;border:1px solid #444;border-radius:24px;padding:4px;margin-top:22px;justify-self:end}
.toggle button{height:38px;padding:0 18px;border-radius:19px;font-size:14px;color:#BDBDB8;transition:background .3s,color .3s}
.toggle button[aria-pressed="true"]{background:#EDEDEA;color:var(--graphite)}
.specimen{position:relative;aspect-ratio:900/387;max-width:1400px;margin:0 auto;cursor:none;touch-action:none;overflow:hidden;border-radius:2px}
.specimen>img{width:100%;height:100%;object-fit:cover;filter:grayscale(.2) contrast(1.05)}
.lens{position:absolute;width:clamp(150px,18vw,260px);aspect-ratio:1;border-radius:50%;pointer-events:none;left:0;top:0;transform:translate(-50%,-50%);background-repeat:no-repeat;box-shadow:0 0 0 1px rgba(255,255,255,.7),0 0 0 8px rgba(28,28,28,.35),0 20px 60px rgba(0,0,0,.45);opacity:0;transition:opacity .3s}
.lens::after{content:"";position:absolute;left:50%;top:50%;width:18px;height:18px;transform:translate(-50%,-50%);background:linear-gradient(var(--red),var(--red)) center/1px 100% no-repeat,linear-gradient(var(--red),var(--red)) center/100% 1px no-repeat;opacity:.9}
.specimen.on .lens{opacity:1}
.specimen .hint{position:absolute;right:16px;bottom:14px;font-size:12px;background:rgba(28,28,28,.75);color:#fff;padding:6px 10px;border-radius:14px;transition:opacity .3s}
.specimen.on .hint{opacity:0}
.loupe-sec .cap{display:flex;justify-content:space-between;max-width:1400px;margin:18px auto 0;color:#A9A9A4;font-size:14px}

/* ---------- lines ---------- */
.lines{position:relative}
.line{min-height:100vh;display:grid;grid-template-columns:1fr 1fr;align-items:center;gap:40px;padding:14vh var(--gut)}
.line .copy{max-width:520px}
.line .tag{font-size:13px;color:var(--mute);display:flex;gap:10px;align-items:center;margin-bottom:28px}
.line .tag i{width:22px;height:1px;background:currentColor}
.line h2{font-size:clamp(48px,8vw,136px);font-weight:300;line-height:.9;font-stretch:125%;letter-spacing:-.04em}
.line p{margin:28px 0 34px;font-size:18px;max-width:40ch;color:var(--mute)}
.line .art{position:relative;height:72vh;display:flex;justify-content:center;align-items:center}
.line .art img{max-height:100%;width:auto;object-fit:contain}
.btn{display:inline-flex;align-items:center;gap:14px;height:54px;padding:0 28px;border-radius:27px;background:var(--fg);color:var(--bg);font-weight:500;font-size:15px;position:relative;overflow:hidden;transition:color .4s}
.btn::before{content:"";position:absolute;inset:0;background:var(--red);transform:translateY(101%);transition:transform .45s var(--ease)}
.btn:hover::before{transform:none}
.btn:hover{color:#fff}
.btn span,.btn svg{position:relative}
.btn svg{width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:1.6}
.l-pro{--bg:var(--steel);--fg:var(--graphite);background:var(--bg);color:var(--fg)}
.l-pro .art img{mix-blend-mode:multiply;height:68vh}
.l-rit{--bg:var(--ivory);--fg:#2B2622;--mute:#7A7066;background:var(--bg);color:var(--fg)}
.l-rit .art img{mix-blend-mode:multiply;width:100%;max-width:640px;height:auto}
.l-pre{--bg:var(--noir);--fg:#F1EBDF;--mute:#A79F92;background:var(--bg);color:var(--fg)}
.l-pre h2{font-family:var(--serif);font-stretch:100%;letter-spacing:-.01em;font-weight:300;font-size:clamp(56px,9vw,150px)}
.l-pre .btn{background:var(--gold);color:var(--noir)}
.l-pre .art img{width:100%;height:100%;object-fit:cover;border-radius:2px}
.dots{position:absolute;right:var(--gut);top:50%;transform:translateY(-50%);display:none;flex-direction:column;gap:12px;z-index:5}
.dots i{width:7px;height:7px;border-radius:50%;background:currentColor;opacity:.25;transition:opacity .3s,transform .3s}
.dots i.on{opacity:1;transform:scale(1.4)}

/* motion version of lines: stacked layers inside one pinned viewport */
.motion .lines{height:100vh;overflow:hidden}
.motion .line{position:absolute;inset:0;min-height:0;height:100vh}
.motion .line.l-rit,.motion .line.l-pre{clip-path:inset(100% 0 0 0)}
.motion .dots{display:flex}

/* ---------- hands (video) ---------- */
.hands{background:var(--paper);padding:18vh var(--gut);display:grid;grid-template-columns:1fr 1fr 1fr;gap:clamp(16px,3vw,40px);align-items:start}
.hands h2{font-size:clamp(36px,5vw,80px);font-weight:300;line-height:.95;position:sticky;top:18vh}
.hands h2 b{font-weight:700;display:block}
.hands .note{margin-top:22px;color:var(--mute);max-width:30ch;font-size:15px}
.clip{position:relative;aspect-ratio:9/16;overflow:hidden;border-radius:2px;background:var(--steel)}
.clip video{width:100%;height:100%;object-fit:cover}
.clip figcaption{position:absolute;left:14px;bottom:14px;right:14px;color:#fff;font-size:13px;display:flex;justify-content:space-between;text-shadow:0 1px 8px rgba(0,0,0,.4)}
.clip.c2{margin-top:22vh}

/* ---------- rail ---------- */
.rail-sec{background:var(--paper);padding:0 0 18vh}
.rail-head{display:flex;justify-content:space-between;align-items:end;padding:0 var(--gut) 40px;gap:24px}
.rail-head h2{font-size:clamp(34px,4.6vw,72px);font-weight:300;line-height:.95}
.rail-head h2 b{font-weight:700}
.rail{display:flex;gap:18px;overflow-x:auto;padding:0 var(--gut) 10px;scroll-snap-type:x mandatory;scrollbar-width:none;cursor:grab}
.rail::-webkit-scrollbar{display:none}
.rail.drag{cursor:grabbing;scroll-snap-type:none}
.prod{flex:0 0 clamp(250px,26vw,380px);scroll-snap-align:start;user-select:none}
.prod .ph{aspect-ratio:3/4;background:#fff;display:grid;place-items:center;overflow:hidden;position:relative}
.prod .ph img{max-height:86%;width:auto;mix-blend-mode:multiply;transition:transform .7s var(--ease);pointer-events:none}
.prod .ph img.cover{width:100%;height:100%;max-height:none;object-fit:cover;mix-blend-mode:normal}
.prod:hover .ph img{transform:scale(1.06) rotate(-2deg)}
.prod .ph .quick{position:absolute;left:12px;right:12px;bottom:12px;height:46px;border-radius:23px;background:var(--graphite);color:#fff;font-size:14px;font-weight:500;transform:translateY(140%);transition:transform .45s var(--ease)}
.prod:hover .quick,.prod .quick:focus-visible{transform:none}
.prod .row{display:flex;justify-content:space-between;gap:12px;margin-top:16px;font-weight:500}
.prod .sub{font-size:14px;color:var(--mute)}

/* ---------- prestige gift ---------- */
.gift{background:var(--noir);color:#F1EBDF;display:grid;grid-template-columns:1.1fr 1fr;min-height:100vh}
.gift .pic{position:relative;overflow:hidden}
.gift .pic img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.gift .sheen{position:absolute;inset:0;pointer-events:none;mix-blend-mode:soft-light;background:radial-gradient(circle at var(--x,60%) var(--y,40%),rgba(255,236,190,.95),rgba(255,236,190,0) 34%);transition:background .1s}
.gift .copy{padding:16vh var(--gut);display:flex;flex-direction:column;justify-content:center}
.gift h2{font-family:var(--serif);font-weight:300;font-size:clamp(46px,6vw,104px);line-height:.95}
.gift p{color:#A79F92;max-width:40ch;margin:28px 0 36px;font-size:17px}
.gift .btn{background:var(--gold);color:var(--noir);align-self:flex-start}
.gems{display:flex;gap:28px;margin-top:56px;flex-wrap:wrap}
.gem{display:grid;gap:10px;font-size:13px;color:#A79F92}
.gem svg{width:34px;height:34px}

/* ---------- footer ---------- */
.foot{position:relative;color:#fff;overflow:hidden;background:#0d1a26}
.foot video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:.55}
.foot .in{position:relative;padding:18vh var(--gut) 32px;display:grid;gap:12vh}
.foot .big{display:grid;grid-template-columns:1.4fr 1fr;gap:40px;align-items:end}
.foot h2{font-size:clamp(40px,6.4vw,110px);font-weight:300;line-height:.92}
.foot h2 b{font-weight:700;display:block}
.foot form{display:flex;border-bottom:1px solid rgba(255,255,255,.6)}
.foot input{flex:1;background:transparent;border:0;color:#fff;font:inherit;height:56px;outline:none}
.foot input::placeholder{color:rgba(255,255,255,.7)}
.foot form:focus-within{border-color:#fff}
.foot .cols{display:grid;grid-template-columns:2fr 1fr 1fr 1fr;gap:24px;font-size:14px;color:rgba(255,255,255,.8)}
.foot ul{list-style:none;display:grid;gap:8px}
.foot h4{font-weight:500;color:#fff;margin-bottom:12px;font-size:14px}
.foot .logo{color:#fff;height:34px}
.foot .legal{display:flex;justify-content:space-between;align-items:center;border-top:1px solid rgba(255,255,255,.2);padding-top:22px;font-size:13px;color:rgba(255,255,255,.7)}
.foot .legal .swiss{height:16px;width:auto;color:#fff}

/* reveal for split lines */
.split .w{display:inline-block;overflow:hidden;vertical-align:top}
.split .w>span{display:inline-block}

@media (max-width:900px){
  .hide-m{display:none}
  .origin .intro,.loupe-sec .top{grid-template-columns:1fr}
  .origin .intro p,.loupe-sec .top p,.toggle{justify-self:start}
  .track{flex-direction:column;width:auto}
  .panel{width:auto;grid-template-columns:1fr}
  .line{grid-template-columns:1fr;padding-top:16vh;align-content:center}
  .line .art{height:42vh;order:-1}
  .l-pro .art img{height:42vh}
  .hands{grid-template-columns:1fr 1fr}
  .hands>div:first-child{grid-column:1/3}
  .hands h2{position:static}
  .clip.c2{margin-top:10vh}
  .gift{grid-template-columns:1fr}
  .gift .pic{min-height:70vh}
  .foot .big,.foot .cols{grid-template-columns:1fr}
  .progress{display:none}
  .hero .after{bottom:12vh;right:var(--gut)}
}
@media (prefers-reduced-motion:reduce){
  .scrollhint i::after{animation:none}
}

/* ================= multi-page system ================= */
html.locked{overflow:hidden}
.hdr.on-dark{--fg:#F1EBDF;--bg:#151412}
.hdr .brand{display:block}
.pill.burger{display:none}
.pill .count{font-weight:600;font-variant-numeric:tabular-nums}
.pill[aria-current="page"]{background:var(--fg);color:var(--bg)}
.hdr.solid .pill[aria-current="page"]{background:var(--fg);color:var(--bg)}
@media (max-width:1200px){.hide-l{display:none}.pill.burger{display:inline-flex}}
@media (max-width:900px){.hide-m{display:none}}

/* curtain between pages */
.curtain{display:none}
.js .curtain{display:grid;place-items:center;position:fixed;inset:0;z-index:90;background:var(--graphite);color:#fff;transform:translateY(0);pointer-events:none}
.js .curtain .logo{height:40px;color:#fff;opacity:.9}
.js .curtain.out{transform:translateY(-100%);transition:transform .8s var(--ease)}
.js .curtain.out.instant{transition:none}
.js .curtain.in{transform:translateY(100%);transition:none;animation:cur-in .5s var(--ease) forwards}
@keyframes cur-in{to{transform:translateY(0)}}
@media (prefers-reduced-motion:reduce){.js .curtain{display:none}}

/* full-screen menu */
.menu{position:fixed;inset:0;z-index:80;background:var(--graphite);color:#EDEDEA;display:grid;grid-template-rows:auto 1fr auto;padding:20px var(--gut) 28px;visibility:hidden;opacity:0;transition:opacity .4s var(--ease),visibility 0s .4s}
.menu.open{visibility:visible;opacity:1;transition:opacity .4s var(--ease)}
.menu .mtop{display:flex;justify-content:space-between;align-items:center}
.menu .logo{color:#fff}
.menu .menu-close{height:42px;padding:0 18px;border-radius:21px;border:1px solid #444;color:#fff;font-size:14px}
.menu ul{list-style:none;align-self:center;display:grid;gap:4px}
.menu ul a{display:block;font-size:clamp(34px,8vw,72px);font-stretch:125%;letter-spacing:-.03em;font-weight:300;line-height:1.1;padding:4px 0}
.menu ul a:hover,.menu ul a[aria-current="page"]{color:var(--red)}
.menu .msub{display:flex;flex-wrap:wrap;gap:10px 22px;font-size:14px;color:#A9A9A4}

/* cart drawer */
.drawer{position:fixed;inset:0;z-index:85;visibility:hidden;transition:visibility 0s .5s}
.drawer.open{visibility:visible;transition:none}
.dr-scrim{position:absolute;inset:0;background:rgba(10,10,10,.45);opacity:0;transition:opacity .5s var(--ease)}
.drawer.open .dr-scrim{opacity:1}
.dr-panel{position:absolute;top:0;right:0;bottom:0;width:min(460px,100%);background:var(--paper);color:var(--graphite);display:grid;grid-template-rows:auto 1fr auto;transform:translateX(100%);transition:transform .55s var(--ease)}
.drawer.open .dr-panel{transform:none}
.dr-head{display:flex;justify-content:space-between;align-items:center;padding:22px 24px;border-bottom:1px solid #E3E3DE}
.dr-head h2{font-size:22px;font-weight:500;font-stretch:115%}
.dr-close{height:38px;padding:0 16px;border-radius:19px;border:1px solid #D6D6D1;font-size:14px}
.dr-items{overflow:auto;padding:8px 24px}
.dr-item{display:grid;grid-template-columns:76px 1fr auto;gap:14px;padding:16px 0;border-bottom:1px solid #ECECE8;align-items:start}
.dr-ph{aspect-ratio:3/4;background:#F3F3F0;display:grid;place-items:center;overflow:hidden}
.dr-ph img.cut,.dr-ph .art{height:88%;width:auto;mix-blend-mode:multiply}
.dr-ph img.cover{width:100%;height:100%;object-fit:cover}
.dr-item b{font-weight:500;display:block;line-height:1.3}
.dr-item span{font-size:13px;color:var(--mute)}
.dr-pr{font-weight:500;font-size:15px}
.dr-empty{padding:40px 0;display:grid;gap:20px;justify-items:start}
.dr-foot{padding:20px 24px 24px;border-top:1px solid #E3E3DE;display:grid;gap:12px}
.dr-foot .tot{display:flex;justify-content:space-between;font-weight:500;font-size:17px}
.dr-foot p{font-size:13px;color:var(--mute)}
.dr-foot .btn{justify-content:center}
.btn.ghost{background:transparent;color:var(--fg);box-shadow:inset 0 0 0 1px currentColor}
.btn.ghost:hover{color:#fff;box-shadow:none}
.qty{display:inline-flex;align-items:center;border:1px solid #D6D6D1;border-radius:24px;height:46px}
.qty button{width:42px;height:100%;font-size:18px}
.qty output,.qty input{width:36px;text-align:center;font-weight:500;border:0;background:transparent;font:inherit;font-weight:500}
.qty.sm{height:34px;margin-top:10px}.qty.sm button{width:32px;font-size:15px}.qty.sm output{width:24px;font-size:14px}

/* product cards in grids */
.pgrid{display:grid;grid-template-columns:repeat(4,1fr);gap:44px 18px}
.pgrid .prod{flex:none}
.prod .ph-link{position:absolute;inset:0;display:grid;place-items:center}
.prod .ph .art{height:88%;width:auto;transition:transform .7s var(--ease)}
.prod:hover .ph .art{transform:scale(1.05) rotate(-2deg)}
.prod .ph img.cut{max-height:86%;height:86%;width:auto}
.prod .badge{position:absolute;top:12px;left:12px;font-size:12px;font-weight:500;background:#fff;color:var(--graphite);padding:5px 10px;border-radius:12px}
.prod .row{color:inherit}
.prod .row span:first-child{line-height:1.3}
.prod .pr{white-space:nowrap}
.prod .pr s,.price s{opacity:.5;font-weight:400;margin-right:4px}
.prod.dk .ph{background:#F3EFE8}
.prod.dk .quick{background:var(--gold);color:var(--noir)}
.prod.dk .sub{color:#A79F92}
.rail .prod{flex:0 0 clamp(250px,24vw,340px)}

/* shared section heads */
.sec{padding:16vh var(--gut)}
.sh{display:flex;justify-content:space-between;align-items:end;gap:24px;margin-bottom:48px}
.sh h2{font-size:clamp(34px,4.6vw,72px);font-weight:300;line-height:.95}
.sh h2 b{font-weight:700}
.sh p{color:var(--mute);max-width:42ch}
.kicker{font-size:13px;color:var(--mute);display:flex;gap:10px;align-items:center;margin-bottom:24px}
.kicker i{width:22px;height:1px;background:currentColor}

/* ---------- line page hero ---------- */
.lhero{position:relative;height:100vh;overflow:hidden;display:grid;grid-template-columns:1.1fr 1fr;align-items:center;padding:0 var(--gut);background:var(--bg);color:var(--fg)}
.lhero h1{font-size:clamp(56px,10vw,176px);font-weight:300;line-height:.86;letter-spacing:-.045em;font-stretch:125%;position:relative;z-index:2}
.lhero h1 .row{display:block;overflow:hidden;padding-bottom:.05em}
.lhero h1 .row>span{display:inline-block}
.lhero .lh-copy{position:relative;z-index:2}
.lhero .lh-copy p{margin-top:28px;font-size:18px;max-width:38ch;color:var(--mute)}
.lhero .lh-art{position:relative;height:84vh;display:grid;place-items:center;z-index:1;mix-blend-mode:multiply}
.lhero .lh-art img{max-height:100%;width:auto}
.lhero .lh-art img.tall{height:70vh}
.t-pre .lhero .lh-art{mix-blend-mode:normal}
.lhero .lh-after{position:absolute;right:var(--gut);bottom:9vh;max-width:330px;z-index:3;font-size:15px;color:var(--mute)}
.lhero .lh-after b{display:block;color:var(--fg);font-weight:500;font-size:20px;font-stretch:112%;margin-bottom:6px}
.lhero .meta{position:absolute;left:var(--gut);bottom:28px;font-size:13px;color:var(--mute);display:flex;gap:10px;align-items:center}
.t-pro{--bg:var(--steel);--fg:var(--graphite)}
.t-rit{--bg:var(--ivory);--fg:#2B2622;--mute:#7A7066}
.t-pre{--bg:var(--noir);--fg:#F1EBDF;--mute:#A79F92}
body.t-pre{background:var(--noir);color:#F1EBDF}
.t-pre .lhero h1,.t-pre .serif{font-family:var(--serif);font-stretch:100%;letter-spacing:-.01em}
.t-pre .lhero .lh-art{height:100%;align-self:stretch;margin-right:calc(var(--gut) * -1)}
.t-pre .lhero .lh-art img{width:100%;height:100%;object-fit:cover;mix-blend-mode:normal}
.t-pre .btn{background:var(--gold);color:var(--noir)}
.t-pre .lhero .lh-after{right:auto;left:var(--gut);bottom:12vh}

.chips{display:flex;flex-wrap:wrap;gap:8px}
.chips button,.fbtn{height:40px;padding:0 16px;border-radius:20px;border:1px solid color-mix(in srgb,var(--fg) 18%,transparent);font-size:14px;display:inline-flex;align-items:center;gap:8px;transition:background .3s,color .3s}
.chips button em,.fbtn em{font-style:normal;opacity:.55;font-size:12px}
.chips button[aria-pressed="true"],.fbtn[aria-pressed="true"]{background:var(--fg);color:var(--bg)}
.gridwrap{padding:0 var(--gut) 16vh}
.gbar{display:flex;justify-content:space-between;align-items:center;gap:20px;margin-bottom:36px;flex-wrap:wrap}
.gcount{font-size:14px;color:var(--mute)}
.more{display:flex;justify-content:center;margin-top:56px}

/* statement band */
.statement{padding:18vh var(--gut);display:grid;grid-template-columns:1fr 1.4fr;gap:40px;align-items:start}
.statement h2{font-size:clamp(34px,4.4vw,68px);font-weight:300;line-height:1;font-stretch:118%;letter-spacing:-.03em}
.statement h2 b{font-weight:700}
.statement .facts{display:grid;grid-template-columns:1fr 1fr;gap:28px 40px}
.statement .facts b{display:block;font-size:17px;font-weight:600;margin-bottom:6px;font-stretch:110%}
.statement .facts p{color:var(--mute);font-size:15px}
.t-pre .statement h2{font-family:var(--serif);font-stretch:100%;letter-spacing:0}

/* professional tip guide (pinned) */
.tipguide{background:var(--graphite);color:#EDEDEA;min-height:100vh;display:grid;grid-template-columns:1fr 1.2fr;gap:40px;padding:14vh var(--gut);align-items:center}
.tipguide h2{font-size:clamp(36px,5vw,84px);font-weight:300;line-height:.95}
.tipguide h2 b{display:block;font-weight:700}
.tipguide .lede{color:#A9A9A4;margin-top:22px;max-width:36ch}
.tg-list{display:grid;gap:10px}
.tg-item{display:grid;grid-template-columns:150px 1fr;gap:24px;align-items:center;padding:18px;border-radius:4px;border:1px solid #333;transition:background .5s,border-color .5s,opacity .5s}
.motion .tg-item{opacity:.45}
.motion .tg-item.on{opacity:1;background:#262626;border-color:#555}
.tg-item img{width:150px;height:110px;object-fit:contain;background:#fff;border-radius:2px}
.tg-item b{display:block;font-size:22px;font-weight:600;font-stretch:115%;margin-bottom:6px}
.tg-item span{color:#A9A9A4;font-size:15px}
.tg-item a{display:inline-block;margin-top:10px;font-size:14px;color:#fff;border-bottom:1px solid #666}

/* trade band */
.tradeband{display:grid;grid-template-columns:1fr 1fr;min-height:80vh;background:var(--steel)}
.tradeband .pic{position:relative;overflow:hidden}
.tradeband .pic img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.tradeband .copy{padding:14vh var(--gut);display:flex;flex-direction:column;justify-content:center;align-items:flex-start}
.tradeband h2{font-size:clamp(34px,4.4vw,70px);font-weight:300;line-height:.95}
.tradeband h2 b{font-weight:700;display:block}
.tradeband p{color:var(--mute);margin:24px 0 32px;max-width:40ch}

/* everyday colour picker */
.picker{display:grid;grid-template-columns:1fr 1fr;gap:40px;padding:16vh var(--gut);align-items:center;background:var(--ivory)}
.picker .stage{height:70vh;display:grid;place-items:center;background:#EFE9DE;border-radius:2px}
.picker .stage svg{height:88%;width:auto}
.picker h2{font-size:clamp(36px,5vw,84px);font-weight:300;line-height:.95;font-stretch:125%;letter-spacing:-.04em}
.picker h2 b{font-weight:700;display:block}
.picker .sw{display:flex;flex-wrap:wrap;gap:10px;margin:34px 0 26px}
.picker .sw button,.pdp .sw a{width:34px;height:34px;border-radius:50%;background:var(--c);box-shadow:inset 0 0 0 1px rgba(0,0,0,.15);position:relative;transition:transform .3s}
.picker .sw button[aria-checked="true"],.pdp .sw a[aria-current="true"]{box-shadow:inset 0 0 0 1px rgba(0,0,0,.15),0 0 0 3px var(--bg),0 0 0 4px var(--fg)}
.picker .sw button:hover,.pdp .sw a:hover{transform:scale(1.1)}
.picker .pk-name{display:flex;justify-content:space-between;gap:20px;font-size:20px;font-weight:500;max-width:440px;padding:18px 0;border-top:1px solid #DDD3C3;border-bottom:1px solid #DDD3C3;margin-bottom:26px}
.picker .acts{display:flex;gap:10px;flex-wrap:wrap}

/* prestige stones */
.stones{padding:16vh var(--gut);display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
.stones .st{background:#1E1C19;border-radius:2px;padding:28px;display:grid;grid-template-rows:auto 1fr auto;gap:20px;min-height:76vh}
.stones .st .im{display:grid;place-items:center;background:#fff;border-radius:2px;overflow:hidden}
.stones .st .im img{height:56vh;width:auto;mix-blend-mode:multiply}
.stones .st h3{font-family:var(--serif);font-weight:300;font-size:34px}
.stones .st p{color:#A79F92;font-size:15px}
.stones .st .row{display:flex;justify-content:space-between;align-items:center;gap:12px}
.stones .st a.lnk{border-bottom:1px solid #5a554c;font-size:14px}

/* cross links */
.xlines{display:grid;grid-template-columns:1fr 1fr;gap:0}
.xlines a{position:relative;min-height:62vh;padding:8vh var(--gut);display:flex;flex-direction:column;justify-content:flex-end;overflow:hidden}
.xlines a .bgimg{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:transform 1s var(--ease)}
.xlines a:hover .bgimg{transform:scale(1.05)}
.xlines a .t{position:relative;font-size:clamp(34px,5vw,80px);font-weight:300;line-height:.95;font-stretch:125%;letter-spacing:-.04em}
.xlines a .s{position:relative;margin-top:12px;font-size:15px}
.xlines .x-pro{background:var(--steel);color:var(--graphite)}
.xlines .x-rit{background:var(--ivory);color:#2B2622}
.xlines .x-pre{background:var(--noir);color:#F1EBDF}
.xlines .x-pre .t{font-family:var(--serif);font-stretch:100%;letter-spacing:0}
.xlines .x-pre .bgimg{opacity:.55}
.xlines .x-pro .bgimg,.xlines .x-rit .bgimg{object-fit:contain;mix-blend-mode:multiply;padding:6vh 8vw 18vh;opacity:.9}

/* ---------- shop ---------- */
.shop-head{padding:22vh var(--gut) 6vh;display:flex;justify-content:space-between;align-items:end;gap:24px;flex-wrap:wrap;background:var(--paper)}
.shop-head h1{font-size:clamp(52px,9vw,156px);font-weight:300;line-height:.86;font-stretch:125%;letter-spacing:-.045em}
.shop-head p{color:var(--mute);max-width:40ch}
body[data-page="shop"],body[data-page="product"],body[data-page="cart"],body[data-page="pro"],body[data-page="gift"],body[data-page="story"]{background:var(--paper)}
html.hdr-on .filters{top:var(--hh,68px)}
.filters{position:sticky;top:0;transition:top .5s cubic-bezier(.7,0,.2,1);z-index:20;background:color-mix(in srgb,var(--paper) 92%,transparent);backdrop-filter:blur(14px);border-top:1px solid #E3E3DE;border-bottom:1px solid #E3E3DE;padding:14px var(--gut);display:grid;gap:12px;--fg:var(--graphite);--bg:var(--paper)}
.frow{display:flex;gap:8px;flex-wrap:wrap;align-items:center}
.frow .lbl{font-size:13px;color:var(--mute);width:58px}
.ftop{display:flex;justify-content:space-between;align-items:center;gap:12px}
.ftop select{height:40px;border-radius:20px;border:1px solid #D6D6D1;padding:0 14px;font:inherit;font-size:14px;background:#fff}
#ftoggle{display:none}
.shop-grid{padding:48px var(--gut) 16vh;background:var(--paper)}
.empty{padding:60px 0;text-align:center;color:var(--mute)}

/* ---------- product page ---------- */
.pdp{display:grid;grid-template-columns:1.15fr 1fr;min-height:100vh;background:var(--bg);color:var(--fg)}
.pdp .stagewrap{position:relative}
.pdp .stage{position:sticky;top:0;height:100vh;background:var(--sbg,#E6E6E2);display:grid;place-items:center;overflow:hidden;touch-action:pan-y}
.pdp .stage.zoomable{cursor:zoom-in}
#stageMedia{height:80vh;width:100%;display:grid;place-items:center;mix-blend-mode:multiply}
#stageMedia img.cut,#stageMedia .art{height:100%;width:auto}

#stageMedia img.cover{width:100%;height:100%;object-fit:cover}
.pdp .stage .lens{width:clamp(140px,16vw,240px)}
.pdp .stage.on .lens{opacity:1}
.pdp .stage .hint{position:absolute;left:24px;bottom:22px;font-size:12px;color:var(--mute);max-width:40ch}
.pdp .info{padding:18vh var(--gut) 10vh;display:flex;flex-direction:column;gap:26px;max-width:640px}
.crumbs{font-size:13px;color:var(--mute);display:flex;gap:8px;flex-wrap:wrap}
.crumbs a{border-bottom:1px solid transparent}.crumbs a:hover{border-color:currentColor}
.pdp h1{font-size:clamp(36px,4vw,64px);font-weight:400;line-height:1;font-stretch:118%;letter-spacing:-.03em}
.t-pre .pdp h1{font-family:var(--serif);font-stretch:100%;letter-spacing:0;font-weight:300;font-size:clamp(42px,4.6vw,72px)}
.pdp .meta{display:flex;justify-content:space-between;align-items:baseline;gap:20px;border-top:1px solid color-mix(in srgb,var(--fg) 14%,transparent);padding-top:18px}
.pdp .price{font-size:26px;font-weight:500}
.pdp .sku{font-size:13px;color:var(--mute)}
.pdp .lbl{font-size:13px;color:var(--mute);display:block;margin-bottom:12px}
.pdp .lbl b{color:var(--fg);font-weight:500}
.pdp .sw{display:flex;flex-wrap:wrap;gap:10px}
.tipgrid{display:grid;grid-template-columns:repeat(4,1fr);gap:8px}
.tipc{border:1px solid color-mix(in srgb,var(--fg) 14%,transparent);border-radius:4px;padding:10px;display:grid;gap:4px;font-size:12px;color:var(--mute);opacity:.6}
.tipc img{width:100%;height:56px;object-fit:contain;background:#fff;border-radius:2px;margin-bottom:6px}
.tipc b{color:var(--fg);font-size:14px;font-weight:600}
.tipc.on{opacity:1;border-color:var(--fg)}
.buyrow{display:flex;gap:10px;align-items:center;flex-wrap:wrap}
.buyrow .btn{flex:1;justify-content:center;min-width:200px}
.btn[disabled]{opacity:.45;cursor:not-allowed}
.trade-note{font-size:14px;color:var(--mute);display:flex;gap:10px;align-items:center;padding:14px 16px;border-radius:4px;background:color-mix(in srgb,var(--fg) 5%,transparent)}
.trade-note a{color:var(--fg);border-bottom:1px solid currentColor}
.acc details{border-top:1px solid color-mix(in srgb,var(--fg) 14%,transparent)}
.acc details:last-child{border-bottom:1px solid color-mix(in srgb,var(--fg) 14%,transparent)}
.acc summary{list-style:none;cursor:pointer;display:flex;justify-content:space-between;align-items:center;padding:18px 0;font-weight:500}
.acc summary::-webkit-details-marker{display:none}
.acc summary::after{content:"+";font-size:20px;font-weight:300;transition:transform .3s}
.acc details[open] summary::after{transform:rotate(45deg)}
.acc .body{padding:0 0 20px;color:var(--mute);font-size:15px}
.acc ul{padding-left:18px;display:grid;gap:6px}
.reviews{padding:12vh var(--gut);display:grid;grid-template-columns:1fr 1.4fr;gap:40px;border-top:1px solid #E3E3DE;background:var(--paper)}
.reviews h2{font-size:clamp(30px,3.6vw,56px);font-weight:300;line-height:1}
.reviews h2 b{font-weight:700}
.slot{border:1px dashed #C9C9C3;border-radius:4px;padding:40px;display:grid;gap:10px;align-content:center;color:var(--mute);min-height:220px}
.slot b{color:var(--graphite);font-weight:500}
.rel{padding:12vh var(--gut) 16vh;background:var(--paper)}

/* ---------- gift ---------- */
.ghero{position:relative;min-height:100vh;display:grid;grid-template-columns:1fr 1.1fr;background:var(--noir);color:#F1EBDF}
.ghero .copy{padding:22vh var(--gut) 10vh;display:flex;flex-direction:column;justify-content:center}
.ghero h1{font-family:var(--serif);font-weight:300;font-size:clamp(58px,8vw,138px);line-height:.88}
.ghero h1 .row{display:block;overflow:hidden;padding-bottom:.06em}.ghero h1 .row>span{display:inline-block}
.ghero p{color:#A79F92;max-width:40ch;margin-top:28px;font-size:17px}
.ghero .pic{position:relative;overflow:hidden}
.ghero .pic img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.tabs{display:inline-flex;border:1px solid #D6D6D1;border-radius:24px;padding:4px;gap:2px;flex-wrap:wrap}
.tabs button{height:40px;padding:0 18px;border-radius:20px;font-size:14px;transition:background .3s,color .3s}
.tabs button[aria-selected="true"]{background:var(--graphite);color:#fff}
.who{padding:0 var(--gut) 12vh}
.who .wh{display:flex;justify-content:space-between;align-items:end;gap:20px;margin:0 0 30px;padding-top:6vh;border-top:1px solid #E3E3DE}
.who h3{font-size:clamp(28px,3vw,46px);font-weight:300;font-stretch:118%;letter-spacing:-.03em}
.who .wh p{color:var(--mute);max-width:40ch;font-size:15px}
.who.dark{background:var(--noir);color:#F1EBDF;padding-top:10vh}
.who.dark h3{font-family:var(--serif);font-stretch:100%;letter-spacing:0}
.who.dark .wh{border-color:#333}
.who.dark .wh p{color:#A79F92}
.gnote{margin:0 var(--gut) 16vh;display:grid;grid-template-columns:1fr 1fr;gap:40px;padding:48px;background:var(--ivory);border-radius:4px;align-items:center}
.gnote h2{font-size:clamp(28px,3vw,46px);font-weight:300;line-height:1.05;font-stretch:115%}
.gnote ul{list-style:none;display:grid;gap:14px;color:#5f574f}
.gnote li{display:grid;grid-template-columns:22px 1fr;gap:10px}
.gnote li::before{content:"";width:8px;height:8px;border-radius:50%;background:var(--red);margin-top:8px}

/* ---------- story ---------- */
.shero{position:relative;height:100vh;overflow:hidden;color:#fff;background:#222}
.shero img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:.6}
.shero .in{position:absolute;left:var(--gut);right:var(--gut);bottom:12vh}
.shero h1{font-size:clamp(60px,13vw,230px);font-weight:300;line-height:.84;font-stretch:125%;letter-spacing:-.05em}
.shero h1 .row{display:block;overflow:hidden;padding-bottom:.05em}.shero h1 .row>span{display:inline-block}
.shero h1 b{font-weight:700}
.shero p{max-width:44ch;margin-top:24px;font-size:18px;color:rgba(255,255,255,.85)}
.timeline{background:var(--paper);position:relative;overflow:hidden}
.timeline .intro{padding:14vh var(--gut) 6vh}
.timeline .intro h2{font-size:clamp(36px,5vw,84px);font-weight:300;line-height:.95}
.timeline .intro h2 b{font-weight:700;display:block}
.timeline .track{display:flex;gap:clamp(20px,3vw,48px);padding:0 var(--gut) 14vh;width:max-content}
.steps{background:var(--graphite);color:#EDEDEA;padding:16vh var(--gut);display:grid;grid-template-columns:1fr 1.3fr;gap:48px;align-items:center}
.steps .num{font-size:clamp(120px,22vw,380px);font-weight:200;line-height:.8;font-stretch:125%;letter-spacing:-.06em;color:var(--red);font-variant-numeric:tabular-nums}
.steps h2{font-size:clamp(30px,3.6vw,56px);font-weight:300;line-height:1}
.steps h2 b{font-weight:700}
.steps p{color:#A9A9A4;margin-top:20px;max-width:46ch}
.steps .pics{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-top:36px}
.steps .pics div{overflow:hidden;aspect-ratio:4/3}
.steps .pics img{width:100%;height:100%;object-fit:cover}
.fides{display:grid;grid-template-columns:1fr 1.2fr;gap:0;background:var(--ivory);color:#2B2622}
.fides .pic{position:relative;min-height:90vh;overflow:hidden}
.fides .pic img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:50% 20%}
.fides .copy{padding:16vh var(--gut);display:flex;flex-direction:column;justify-content:center}
.fides h2{font-size:clamp(36px,4.6vw,76px);font-weight:300;line-height:.95;font-stretch:120%;letter-spacing:-.03em}
.fides h2 b{font-weight:700;display:block}
.fides p{color:#7A7066;margin-top:22px;max-width:46ch}
.fides .awards{display:flex;gap:28px;margin-top:36px;flex-wrap:wrap}
.fides .awards div{border-top:1px solid #DDD3C3;padding-top:12px;min-width:160px}
.fides .awards b{display:block;font-size:30px;font-weight:300;font-stretch:125%}
.fides .awards span{font-size:14px;color:#7A7066}
.design{padding:16vh var(--gut);background:var(--paper)}
.agrid{display:grid;grid-template-columns:repeat(4,1fr);gap:18px}
.agrid div{border-top:1px solid #D6D6D1;padding-top:16px}
.agrid b{display:block;font-size:22px;font-weight:600;font-stretch:115%}
.agrid span{color:var(--mute);font-size:14px}
.press{padding:14vh var(--gut);background:var(--steel);text-align:center}
.press q{display:block;font-family:var(--serif);font-size:clamp(34px,4.4vw,72px);line-height:1.05;max-width:22ch;margin:0 auto;quotes:"\201C" "\201D"}
.press .cite{margin-top:18px;color:var(--mute);font-size:14px}
.press .outlets{margin-top:9vh;display:flex;flex-wrap:wrap;justify-content:center;gap:16px 44px;font-size:20px;color:#7d7d78;font-stretch:115%}

/* ---------- for professionals ---------- */
.phero{position:relative;min-height:100vh;display:grid;grid-template-columns:1.1fr 1fr;background:var(--graphite);color:#EDEDEA}
.phero .copy{padding:22vh var(--gut) 10vh;display:flex;flex-direction:column;justify-content:center}
.phero h1{font-size:clamp(50px,7.4vw,128px);font-weight:300;line-height:.88;font-stretch:125%;letter-spacing:-.045em}
.phero h1 .row{display:block;overflow:hidden;padding-bottom:.05em}.phero h1 .row>span{display:inline-block}
.phero h1 b{font-weight:700}
.phero p{color:#A9A9A4;margin-top:26px;max-width:42ch;font-size:17px}
.phero .pic{position:relative;overflow:hidden}
.phero .pic img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.howto{padding:14vh var(--gut);display:grid;grid-template-columns:repeat(3,1fr);gap:18px;background:var(--paper)}
.howto div{border-top:1px solid var(--graphite);padding-top:20px}
.howto .n{font-size:64px;font-weight:200;font-stretch:125%;line-height:1;color:var(--red)}
.howto b{display:block;font-size:20px;font-weight:600;margin:14px 0 8px;font-stretch:112%}
.howto p{color:var(--mute);font-size:15px}
.formwrap{padding:0 var(--gut) 16vh;display:grid;grid-template-columns:1fr 1.4fr;gap:48px;background:var(--paper)}
.formwrap h2{font-size:clamp(34px,4vw,64px);font-weight:300;line-height:.95}
.formwrap h2 b{font-weight:700;display:block}
.formwrap .side p{color:var(--mute);margin-top:18px;max-width:38ch}
.formwrap .side ul{margin-top:28px;list-style:none;display:grid;gap:12px}
.formwrap .side li{display:flex;gap:12px;font-size:15px}
.formwrap .side li::before{content:"";width:8px;height:8px;margin-top:8px;border-radius:50%;background:var(--red);flex:none}
form.tf{display:grid;grid-template-columns:1fr 1fr;gap:18px 18px}
.field{display:grid;gap:8px}
.field.full{grid-column:1/-1}
.field label{font-size:13px;font-weight:500}
.field label span{color:var(--mute);font-weight:400}
.field input,.field select,.field textarea{height:52px;border:1px solid #D6D6D1;border-radius:6px;padding:0 14px;font:inherit;background:#fff;color:var(--graphite)}
.field textarea{height:120px;padding:12px 14px;resize:vertical}
.field input:focus,.field select:focus,.field textarea:focus{outline:none;border-color:var(--graphite);box-shadow:0 0 0 3px rgba(28,28,28,.08)}
.field .err-t{display:none;font-size:13px;color:var(--red)}
.field.err input,.field.err select{border-color:var(--red)}
.field.err .err-t{display:block}
.check{grid-column:1/-1;display:flex;gap:12px;align-items:flex-start;font-size:14px;color:var(--mute)}
.check.err{color:var(--red)}
.check input{width:18px;height:18px;margin-top:2px;accent-color:var(--graphite)}
.formfoot{grid-column:1/-1;display:flex;align-items:center;gap:20px;flex-wrap:wrap}
#formMsg{color:var(--red);font-size:14px}
.done[hidden]{display:none}
.done{padding:48px;border-radius:6px;background:var(--steel);display:grid;gap:12px;outline:none}
.done h3{font-size:30px;font-weight:400;font-stretch:115%}
.done p{color:var(--mute)}
.faq{padding:0 var(--gut) 16vh;background:var(--paper);display:grid;grid-template-columns:1fr 1.4fr;gap:48px}
.faq h2{font-size:clamp(30px,3.4vw,52px);font-weight:300;line-height:1}

/* ---------- cart page ---------- */
.cartpage{padding:20vh var(--gut) 12vh;background:var(--paper);display:grid;grid-template-columns:1.6fr 1fr;gap:48px;align-items:start}
.cartpage h1{font-size:clamp(48px,7vw,120px);font-weight:300;line-height:.88;font-stretch:125%;letter-spacing:-.045em;grid-column:1/-1;display:flex;justify-content:space-between;align-items:baseline;gap:20px;flex-wrap:wrap}
.cartpage h1 small{font-size:16px;font-weight:400;letter-spacing:0;font-stretch:100%;color:var(--mute)}
.ci{display:grid;grid-template-columns:120px 1fr auto;gap:22px;padding:22px 0;border-top:1px solid #E3E3DE;align-items:start}
.ci:last-child{border-bottom:1px solid #E3E3DE}
.ci-ph{aspect-ratio:3/4;background:#F3F3F0;display:grid;place-items:center;overflow:hidden}
.ci-ph img.cut,.ci-ph .art{height:88%;width:auto;mix-blend-mode:multiply}
.ci-ph img.cover{width:100%;height:100%;object-fit:cover}
.ci-main b{font-weight:500;font-size:18px;display:block}
.ci-main span{color:var(--mute);font-size:14px}
.ci-row{display:flex;gap:20px;align-items:center;margin-top:16px}
.lnk{font-size:14px;border-bottom:1px solid currentColor;color:var(--mute)}
.ci-pr{font-weight:500;font-size:17px}
.summary{position:sticky;top:110px;background:#fff;border:1px solid #E3E3DE;border-radius:6px;padding:28px;display:grid;gap:18px}
.summary .tot{display:flex;justify-content:space-between;font-size:20px;font-weight:500}
.summary .ln{display:flex;justify-content:space-between;color:var(--mute);font-size:15px}
.summary label{font-size:13px;font-weight:500}
.summary textarea{width:100%;height:100px;border:1px solid #D6D6D1;border-radius:6px;padding:12px;font:inherit;resize:vertical}
.summary .small{font-size:13px;color:var(--mute)}
.summary .btn{justify-content:center}
.conote{font-size:13px;background:var(--steel);padding:12px 14px;border-radius:4px}
#cartFull[hidden],.cart-empty[hidden]{display:none!important}
.cart-empty{grid-column:1/-1;padding:8vh 0;display:grid;gap:22px;justify-items:start}
.cart-empty p{font-size:20px}

@media (max-width:1100px){
  .pgrid{grid-template-columns:repeat(3,1fr)}
  .stones{grid-template-columns:1fr}
  .stones .st{min-height:0}.stones .st .im img{height:44vh}
}
@media (max-width:900px){
  .pgrid{grid-template-columns:1fr 1fr;gap:32px 12px}
  .lhero{grid-template-columns:1fr;align-content:start;padding-top:16vh;height:auto;min-height:100vh;padding-bottom:12vh}
  .lhero .lh-art{height:46vh;order:-1;overflow:hidden}
  .lhero .lh-art img,.lhero .lh-art img.tall{height:100%;max-height:46vh}
  .lhero h1{font-size:clamp(48px,14vw,90px)}
  .t-pre .lhero .lh-art{margin:0 calc(var(--gut) * -1);height:52vh}
  .lhero .lh-after{position:static;margin-top:24px}
  .lhero .meta{display:none}
  .statement,.tipguide,.tradeband,.picker,.xlines,.pdp,.reviews,.ghero,.gnote,.steps,.fides,.phero,.formwrap,.faq,.cartpage,.howto{grid-template-columns:1fr}
  .statement .facts{grid-template-columns:1fr}
  .tg-item{grid-template-columns:100px 1fr}.tg-item img{width:100px;height:80px}
  .tradeband .pic{min-height:50vh}
  .picker .stage{height:52vh}
  .xlines a{min-height:46vh}
  .pdp .stage{position:relative;height:62vh}
  #stageMedia{height:52vh}
  .pdp .info{padding:6vh var(--gut) 10vh}
  .tipgrid{grid-template-columns:repeat(2,1fr)}
  .ghero .pic,.phero .pic{min-height:56vh;order:-1}
  .ghero .copy,.phero .copy{padding:8vh var(--gut) 10vh}
  .fides .pic{min-height:60vh}
  .agrid{grid-template-columns:1fr 1fr}
  .timeline .track{flex-direction:column;width:auto}
  .timeline .panel{width:auto;grid-template-columns:1fr}
  .gnote{padding:28px}
  form.tf{grid-template-columns:1fr}
  .ci{grid-template-columns:90px 1fr;}
  .ci-pr{grid-column:2}
  .summary{position:static}
  .shop-head{padding-top:18vh}
  #ftoggle{display:inline-flex}
  .filters .frows{display:none}
  .filters.open .frows{display:grid;gap:12px}
  .frow .lbl{width:100%}
}