:root{--paper:#F4ECDB;--paper2:#EFE4CE;--bone:#EFE4CE;--ink:#280D13;--smoke:#5A2A33;--ash:#8A7766;--cognac:#9C7E37;--cognac-dp:#7E6420;--brass:#C3A24E;--brass-br:#E3CE92;--oxblood:#93233A;--ember:#280D13;--ember2:#3E121C;--line:rgba(40,13,19,.16);--line-d:rgba(195,162,78,.28);--bordeaux:#280D13;--burgundy:#5C1B29;--burgundy2:#3E121C;--gold:#C3A24E;--gold-dp:#9C7E37;--champagne:#E3CE92;--crimson:#93233A;--ivory:#F4ECDB;--taupe:#8A7766;--foil:linear-gradient(135deg,#E3CE92 0%,#C3A24E 52%,#9C7E37 100%)}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{font-family:'Satoshi','Helvetica Neue',Helvetica,Arial,-apple-system,sans-serif;font-weight:400;background:var(--paper);color:var(--smoke);-webkit-font-smoothing:antialiased;line-height:1.7;letter-spacing:.005em}
img{display:block;max-width:100%}
a{color:inherit;text-decoration:none}
/* Safety net: never let a link change its own geometry while pressed. On iOS the
   element moves out from under the finger and the click is silently dropped. */
a:active{transform:none}
a,button{touch-action:manipulation}
.script,.ds,.it{font-family:'DM Serif Display',Georgia,serif;font-weight:400;font-style:italic;letter-spacing:-.022em;-webkit-text-stroke:.4px currentColor;paint-order:stroke fill}
.ds,.it{font-size:1.04em}
.up{font-family:'Satoshi','Helvetica Neue',Helvetica,Arial,sans-serif;font-weight:500;font-style:normal}
.wrap{max-width:1300px;margin:0 auto;padding:0 40px}
.center{text-align:center}
.eyebrow{font-family:'Satoshi','Helvetica Neue',Helvetica,Arial;font-weight:600;font-size:11px;letter-spacing:.34em;text-transform:uppercase;color:var(--cognac)}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;white-space:nowrap;font-family:'Satoshi','Helvetica Neue',Helvetica,Arial;font-weight:600;font-size:12px;letter-spacing:.14em;text-transform:uppercase;padding:15px 32px;border-radius:999px;border:1px solid var(--ink);color:var(--ink);background:transparent;transition:.25s;cursor:pointer}
.btn:hover{background:var(--ink);color:var(--paper)}
.btn-solid{background:var(--burgundy);color:var(--ivory);border-color:var(--gold-dp)}
.btn-solid:hover{background:var(--bordeaux);border-color:var(--gold)}
.btn-light{border-color:var(--brass);color:var(--bone)}
.btn-light:hover{background:var(--bone);color:var(--ember);border-color:var(--bone)}
.btn-block{width:100%}

.annc{position:relative;background:var(--bordeaux);border-bottom:1px solid rgba(227,206,146,.2);height:46px;overflow:hidden;cursor:pointer}
/* The two slides share one box, so a SIMULTANEOUS cross-dissolve puts both lines at ~50%
   opacity mid-transition and the bar reads as doubled, e.g. "The Father's Day Sale" printed
   over "Speak to a specialist". Staggered instead: the outgoing slide fades out first, and
   the incoming one waits for it to clear before fading in, so the two are never legible at
   once. The delay applies only on the way IN, because losing .on falls back to the rule
   below, which has no delay. */
.annc-s{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;gap:11px;text-decoration:none;opacity:0;transition:opacity .26s ease;pointer-events:none;padding:0 18px;text-align:center;white-space:nowrap}
.annc-s.on{opacity:1;pointer-events:auto;transition:opacity .26s ease .26s}
.annc-serif{font-family:'DM Serif Display',Georgia,serif;font-style:italic;font-size:19px;color:var(--champagne);letter-spacing:-.01em}
.annc-sub{font-family:'Satoshi','Helvetica Neue',Helvetica,Arial;font-weight:600;font-size:11px;letter-spacing:.18em;text-transform:uppercase;color:rgba(244,236,219,.85)}
/* Sale countdown. Restraint on purpose: no seconds, no pulsing, no red. Days/hours/minutes in
   champagne with tabular figures so the numbers do not jitter as they tick, and a hairline rule
   separating it from the offer rather than a border or a chip. */
.annc-cd{display:inline-flex;align-items:center;gap:9px}
.annc-cd[hidden]{display:none}
.cd-rule{display:inline-block;width:1px;height:14px;background:rgba(227,206,146,.34);margin:0 2px}
.cd-lab{color:rgba(227,206,146,.72)}
.cd-u{display:inline-flex;align-items:baseline;gap:1px;color:var(--champagne)}
.cd-u b{font-family:'Satoshi','Helvetica Neue',Helvetica,Arial;font-weight:700;font-size:13px;
  font-variant-numeric:tabular-nums;letter-spacing:.01em;min-width:2ch;text-align:right}
.cd-u em{font-style:normal;font-size:9.5px;font-weight:600;letter-spacing:.1em;opacity:.7;margin-right:3px}
/* A 375px bar cannot hold the sale name, the offer and a timer. The timer is the thing with a
   deadline, so the offer line steps aside and the discount stays visible on the hero and the PDP. */
@media(max-width:560px){
  .annc-off{display:none}
  .annc-cd{gap:7px}
  .cd-u b{font-size:12px}
}
.annc-num{font-family:'Satoshi','Helvetica Neue',Helvetica,Arial;font-weight:600;font-size:13px;letter-spacing:.06em;color:var(--gold)}
.annc-s[href]:hover .annc-num,.annc-s[href]:hover .annc-serif{color:#fff}
/* Mobile head, compressed. Measured before this: 214px of chrome above the photograph, made of
   a 42px bar, an 88px nav, a 37px breadcrumb and a 46px gap holding nothing. The breadcrumb
   moves into the buy block, where Castlery puts it. */
@media(max-width:760px){.annc{height:30px}
.crumb{display:none}.annc-serif{font-size:16.5px}.annc-sub{font-size:9.5px;letter-spacing:.13em}.annc-num{font-size:12px}.annc-s{gap:8px;padding:0 14px}}
@media(prefers-reduced-motion:reduce){.annc-s{transition:none}}
header{background:var(--paper);position:sticky;top:0;z-index:20;border-bottom:1px solid var(--line)}
.nav{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;min-height:88px;gap:24px}
/* Placed after the base rules on purpose: an identical-specificity override earlier in the
   sheet loses on source order, which is why the first attempt at this did nothing. */
@media(max-width:760px){.nav{min-height:74px}}
.brandwrap{justify-self:center;display:flex;align-items:center}
.navtxt{font-family:'Satoshi','Helvetica Neue',Helvetica,Arial;font-weight:600;font-size:11px;letter-spacing:.18em;text-transform:uppercase;color:var(--ink);padding:6px 4px;margin-right:6px;transition:color .25s}
@media(hover:hover){.navtxt:hover{color:var(--cognac)}}
@media(max-width:600px){.navtxt{display:none}}
.mark{font-family:'DM Serif Display',Georgia,serif;font-style:italic;font-size:46px;color:var(--ink);line-height:.8;letter-spacing:-.028em;display:inline-block;transform:scaleX(.92);transform-origin:left center;-webkit-text-stroke:.6px currentColor;paint-order:stroke fill}
/* Same source-order trap as .nav: the base .mark is declared below the earlier mobile block,
   so the override has to sit after it. */
@media(max-width:760px){.mark{font-size:38px}}
nav.main{justify-self:start;display:flex;gap:30px;font-weight:400;font-size:13px;letter-spacing:.06em;color:var(--ink)}
nav.main a{padding-bottom:2px;border-bottom:1px solid transparent;transition:.2s}
nav.main a:hover{color:var(--cognac);border-bottom-color:var(--cognac)}
.nav-right{justify-self:end;display:flex;align-items:center;gap:22px}
.iconbtn{background:none;border:none;cursor:pointer;color:var(--ink);display:inline-flex;align-items:center;font-size:20px;position:relative;padding:2px;text-decoration:none}
.iconbtn:hover{color:var(--cognac)}
.cartcount{position:absolute;top:-7px;right:-9px;background:var(--cognac);color:var(--paper);font-size:9px;font-weight:700;min-width:16px;height:16px;border-radius:999px;display:flex;align-items:center;justify-content:center;padding:0 3px}

.hero{position:relative;min-height:90vh;display:flex;align-items:center;color:var(--ivory);background:#1a070a;overflow:hidden}
.hero-slides{position:absolute;inset:0;z-index:0}
.hero-slide{position:absolute;inset:0;background-position:center center;background-size:cover;background-repeat:no-repeat;opacity:0;animation:heroFade 12s infinite}
.hero-slide:nth-child(1){animation-delay:0s}
.hero-slide:nth-child(2){animation-delay:4s}
.hero-slide:nth-child(3){animation-delay:8s}
@keyframes heroFade{0%{opacity:0}5%{opacity:1}28%{opacity:1}33%{opacity:0}100%{opacity:0}}
@media(prefers-reduced-motion:reduce){.hero-slide{animation:none}.hero-slide:nth-child(1){opacity:1}}
.hero::after{content:"";position:absolute;inset:0;z-index:1;pointer-events:none;background:linear-gradient(90deg,rgba(20,7,10,.92) 0%,rgba(20,7,10,.6) 40%,rgba(20,7,10,.12) 68%,rgba(20,7,10,0) 100%)}
.hero-inner{position:relative;z-index:2;width:100%;max-width:var(--maxw,1300px);margin:0 auto;padding:0 40px}
.hero-copy{max-width:540px}
.hero .eyebrow{color:var(--brass);display:block;margin-bottom:22px}
.hero .sale-kicker{display:inline-flex;align-items:center;gap:15px;font-family:'Satoshi','Helvetica Neue',Helvetica,Arial;font-weight:600;font-size:12px;letter-spacing:.3em;text-transform:uppercase;color:var(--champagne);margin-bottom:26px}
.hero .sale-kicker::before{content:"";display:inline-block;width:38px;height:1px;background:var(--gold)}
.hero .script-hero.sale-h1{font-size:80px;line-height:.96}
@media(max-width:760px){.hero .script-hero.sale-h1{font-size:50px}}
.hero .script-hero{font-family:'Satoshi','Helvetica Neue',Helvetica,Arial,sans-serif;font-weight:500;font-size:66px;line-height:1.02;color:var(--ivory);letter-spacing:-.015em}
.hero .script-hero .it,.hero .script-hero .ds{color:var(--champagne)}
.hero-saves{position:relative;height:40px;margin:24px 0 4px}
.hero-saves .hs{position:absolute;left:0;top:0;display:flex;align-items:baseline;gap:9px;font-family:'Satoshi','Helvetica Neue',Helvetica,Arial;font-weight:500;font-size:23px;letter-spacing:.005em;color:var(--ivory);white-space:nowrap;opacity:0;animation:hsCycle 12s infinite;text-decoration:none}
.hero-saves a.hs{cursor:pointer}
.hero-saves a.hs:hover b{text-decoration:underline;text-underline-offset:3px}
.hero-saves .hs b{font-family:'DM Serif Display',Georgia,serif;font-style:italic;font-weight:400;font-size:31px;line-height:1;color:var(--gold)}
.hero-saves .hs.s1{animation-delay:0s}
.hero-saves .hs.s2{animation-delay:4s}
.hero-saves .hs.s3{animation-delay:8s}
/* pointer-events rides the same cycle so only the visible line is clickable — the others
   are opacity:0 but still stacked, and would otherwise swallow the click. */
@keyframes hsCycle{0%{opacity:0;pointer-events:none}4%{opacity:1;pointer-events:auto}29%{opacity:1;pointer-events:auto}33%{opacity:0;pointer-events:none}100%{opacity:0;pointer-events:none}}
@media(prefers-reduced-motion:reduce){.hero-saves .hs{animation:none;opacity:0}.hero-saves .hs.s1{opacity:1}}
.hero .sub{font-weight:400;font-size:16px;color:#d8c9b4;margin:22px 0 34px;max-width:400px;line-height:1.6}
.hero-cta{display:flex;flex-direction:column;align-items:flex-start;gap:12px}
.hero-cta .btn-quiz{display:inline-flex;align-items:center;gap:12px;background:transparent;
color:var(--ivory);border:1px solid rgba(244,236,219,.45)}
.hero-cta .btn-quiz:hover{background:rgba(244,236,219,.1);border-color:var(--champagne);color:var(--champagne)}
.hero-cta .qtime{display:inline-flex;align-items:center;gap:5px;font-size:10.5px;letter-spacing:.1em;
color:var(--champagne);opacity:.85;padding-left:12px;border-left:1px solid rgba(244,236,219,.28)}
.hero-cta .qtime i{font-size:13px;line-height:1}
@media(max-width:600px){.hero-cta{align-items:stretch;width:100%}
.hero-cta .btn,.hero-cta .btn-quiz{justify-content:center;text-align:center;width:100%}
.hero-cta .btn-quiz{flex-wrap:wrap;gap:6px;padding-top:13px;padding-bottom:13px}
.hero-cta .qtime{border-left:0;padding-left:0}}
/* Mobile hero: the banner IS the sell. Strip the copy block back so the room and the
   piece stay visible instead of sitting behind four stacked blocks of text. */
@media(max-width:600px){
 /* copy sits at the TOP on mobile — every hero crop puts the piece in the lower half,
    so bottom-anchored text lands straight on the product. Scrim flips to match. */
 section.hero{align-items:stretch}
 section.hero::after{background:linear-gradient(to bottom,rgba(20,7,10,.88) 0%,rgba(20,7,10,.48) 30%,rgba(20,7,10,.03) 54%,rgba(20,7,10,.1) 70%,rgba(20,7,10,.58) 90%,rgba(20,7,10,.8) 100%)}
 .hero .hero-inner{padding:4vh 24px 5vh;display:flex}
 /* messaging up top, buttons pinned to the bottom — the piece sits in the gap between */
 .hero .hero-copy{display:flex;flex-direction:column;width:100%}
 .hero .hero-cta{margin-top:auto}
 .hero .hero-copy .script-hero{font-size:37px;line-height:1.02}
 .hero .hero-copy .sub{display:none}
 .hero .hero-saves{height:28px;margin:12px 0 16px}
 .hero .hero-saves .hs{font-size:16.5px}
 .hero .hero-saves .hs b{font-size:22px}
 .hero .hero-cta{gap:10px}
 /* secondary CTA drops the pill on mobile — a full-width outlined button here is pure mass */
 .hero .hero-cta .btn-quiz{width:auto;align-self:flex-start;background:transparent;border:0;
  border-bottom:1px solid var(--gold);border-radius:0;padding:0 0 4px;justify-content:flex-start;
  text-align:left;font-size:10px;letter-spacing:.1em;flex-wrap:nowrap;gap:9px}
 /* the 90-second chip sits exactly where the chat launcher floats — drop it on mobile */
 .hero .hero-cta .btn-quiz .qtime{display:none}
}
.hero-cta .btn-hero{background:var(--ivory);color:var(--bordeaux);border-color:var(--ivory)}
.hero-cta .btn-hero:hover{background:var(--champagne);border-color:var(--champagne);color:var(--bordeaux)}
.hero-cta .lnk{font-family:'Satoshi','Helvetica Neue',Helvetica,Arial;font-weight:600;font-size:12px;letter-spacing:.14em;text-transform:uppercase;color:var(--ivory);border-bottom:1px solid var(--gold);padding-bottom:3px}
.hero-cta .lnk:hover{color:var(--champagne);border-color:var(--champagne)}
.hero-note{position:absolute;left:0;right:0;bottom:22px;z-index:2;text-align:center;font-family:'Satoshi','Helvetica Neue',Helvetica,Arial;font-weight:600;font-size:10px;letter-spacing:.3em;text-transform:uppercase;color:rgba(227,206,146,.5)}

.uspbar{background:var(--paper2);border-bottom:1px solid var(--line)}
.uspbar .wrap{display:flex;justify-content:center;padding:22px 40px;font-family:'Satoshi','Helvetica Neue',Helvetica,Arial;font-weight:500;font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--smoke)}
.usp-marquee{display:flex;justify-content:center;width:100%}
.usp-track{display:flex;justify-content:center;gap:64px;flex-wrap:wrap}
.usp-track[aria-hidden]{display:none}
@keyframes uspmq{from{transform:translateX(0)}to{transform:translateX(-100%)}}
@media(max-width:980px){.usp-track[aria-hidden]{display:flex}}
@media(prefers-reduced-motion:reduce){.usp-track{animation:none!important}}
.uspbar span{display:inline-flex;align-items:center;gap:9px}
.uspbar .ti{font-size:16px;color:var(--brass)}

.cat-row{display:grid;grid-template-columns:repeat(5,1fr);gap:10px;background:transparent;padding:0 12px;max-width:1500px;margin:0 auto}
.ctile{position:relative;aspect-ratio:4/5;overflow:hidden;display:flex;align-items:flex-end;justify-content:center;background:var(--ember);border-radius:14px}
.ctile img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:.5s}
.ctile:hover img{transform:scale(1.04)}
.ctile{-webkit-tap-highlight-color:transparent;transition:transform .16s cubic-bezier(.23,1,.32,1)}
/* NEVER transform an <a> on :active — on iOS the link shrinks out from under the
   finger, touchend lands outside it and Safari never fires the click (dead taps).
   Feedback comes from the inner image + a brightness shift, which don't move the hit area. */
.ctile{touch-action:manipulation}
.ctile:active{filter:brightness(1.12)}
.ctile:active img{transform:scale(1.04)}
.card{-webkit-tap-highlight-color:transparent}
.card:active .card-img img{transform:scale(.97);transition-duration:.15s}
.ctile::before{content:"";position:absolute;inset:0;z-index:1;background:linear-gradient(to top,rgba(23,17,9,.9),rgba(23,17,9,.15) 45%,rgba(23,17,9,0) 70%)}
.ctile .lbl{position:relative;z-index:2;font-family:'Satoshi','Helvetica Neue',Helvetica,Arial;font-weight:400;font-size:13px;letter-spacing:.22em;text-transform:uppercase;color:var(--bone);margin-bottom:30px}

.sec{padding:92px 0}
.sec-head{text-align:center;margin-bottom:54px}
.sec-head .eyebrow{display:block;margin-bottom:14px}
.sec-head h2{font-family:'Satoshi','Helvetica Neue',Helvetica,Arial;font-weight:500;font-size:42px;letter-spacing:-.015em;color:var(--ink);line-height:1.08}
.sec-head .scriptline{font-family:'DM Serif Display',Georgia,serif;font-style:italic;font-size:40px;color:var(--ink);line-height:1;letter-spacing:-.025em;display:inline-block;transform:scaleX(.93);transform-origin:center;-webkit-text-stroke:.5px currentColor;paint-order:stroke fill}
.sec-head p{color:var(--ash);margin-top:12px;font-size:14px;font-weight:300}

/* ── The leather film ────────────────────────────────────────────────────────
   Full-bleed craft band. Desktop overlays the copy on a 16:9 cut; mobile stacks
   a 4:5 cut above the copy rather than overlaying it, because montage footage
   changes value every two seconds and no fixed scrim keeps text legible over it. */
/* The tiles above sit flush to their own edge, so the dark band needs its own air —
   without this margin the film butts straight onto the bottom of the tile row. */
.lfilm{position:relative;overflow:hidden;background:var(--bordeaux);color:var(--ivory);margin-top:76px}
.lfilm-media{position:absolute;inset:0;background-image:url('/img/video/leather-desktop.jpg');background-size:cover;background-position:center;background-color:var(--bordeaux)}
.lfilm-vid{width:100%;height:100%;object-fit:cover;display:block;background:transparent}
.lfilm-media::after{content:'';position:absolute;left:0;right:0;bottom:0;height:24%;display:none;
 background:linear-gradient(to top,var(--bordeaux) 0%,rgba(40,13,19,0) 100%)}
.lfilm::after{content:'';position:absolute;inset:0;z-index:1;
 background:linear-gradient(90deg,rgba(20,7,10,.93) 0%,rgba(20,7,10,.8) 32%,rgba(20,7,10,.36) 62%,rgba(20,7,10,.12) 100%)}
.lfilm-in{position:relative;z-index:2;max-width:1300px;margin:0 auto;padding:96px 40px;min-height:74vh;display:flex;align-items:center}
.lfilm-copy{max-width:490px}
.lfilm-copy .eyebrow{display:block;color:var(--champagne);margin-bottom:16px}
.lfilm-copy h2{font-family:'Satoshi','Helvetica Neue',Helvetica,Arial;font-weight:400;font-size:44px;line-height:1.08;letter-spacing:-.005em;color:var(--ivory)}
.lfilm-copy p{font-size:15.5px;font-weight:300;line-height:1.72;color:rgba(244,236,219,.84);margin-top:18px;max-width:440px}
.lfilm-copy p.l2{margin-top:11px;color:rgba(244,236,219,.66)}
.lfilm-facts{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;margin:34px 0 34px;padding-top:18px;border-top:1px solid var(--line-d)}
.lfilm-facts div+div{border-left:1px solid var(--line-d);padding-left:20px}
.lfilm-facts b{display:block;font-family:'DM Serif Display',Georgia,serif;font-style:italic;font-weight:400;font-size:19px;line-height:1.1;color:var(--champagne);letter-spacing:-.02em}
.lfilm-facts span{display:block;font-size:11.5px;line-height:1.5;color:rgba(244,236,219,.6);margin-top:6px;font-weight:300}
.btn-lf{border-color:var(--gold);color:var(--ivory)}
.btn-lf:hover{background:var(--gold);border-color:var(--gold);color:var(--bordeaux)}
@media(max-width:900px){
 .lfilm{display:block;margin-top:46px}
 .lfilm-media{position:relative;inset:auto;aspect-ratio:4/5;background-image:url('/img/video/leather-mobile.jpg')}
 .lfilm-media::after{display:block}
 .lfilm::after{content:none}
 .lfilm-in{min-height:0;padding:26px 24px 58px;display:block}
 .lfilm-copy{max-width:none}
 .lfilm-copy h2{font-size:32px;line-height:1.1}
 .lfilm-copy p{font-size:14.5px;max-width:none;margin-top:15px}
 .lfilm-facts{grid-template-columns:1fr;gap:0;margin:26px 0 28px}
 .lfilm-facts div+div{border-left:0;padding-left:0;border-top:1px solid var(--line-d);margin-top:13px;padding-top:13px}
 .btn-lf{width:100%}
}
.feature{display:grid;grid-template-columns:1fr 1fr;align-items:stretch;min-height:580px}
.feature.flip .feature-img{order:2}
.feature-img{background:var(--bone);overflow:hidden;display:flex;align-items:center;justify-content:center}
.feature-img img{width:100%;height:100%;object-fit:contain;padding:7%}
.feature-img.scene{background:var(--ember)}
.feature-img.scene img{object-fit:cover;padding:0}
.feature-img a{display:block;width:100%;height:100%;-webkit-tap-highlight-color:transparent}
.feature-img a:active img{transform:scale(.985);transition:transform .15s}
.feature-copy{background:var(--paper);display:flex;flex-direction:column;justify-content:center;padding:84px 96px}
.feature-copy .eyebrow{margin-bottom:16px}
.feature-copy h2{font-family:'Satoshi','Helvetica Neue',Helvetica,Arial;font-weight:400;font-size:40px;line-height:1.12;letter-spacing:.01em;color:var(--ink)}
.feature-copy .scriptline{font-family:'DM Serif Display',Georgia,serif;font-style:italic;font-size:46px;color:var(--ink);line-height:.95;margin-bottom:6px;letter-spacing:-.025em;display:inline-block;transform:scaleX(.93);transform-origin:left center;-webkit-text-stroke:.5px currentColor;paint-order:stroke fill}
.feature-copy p{font-size:15px;color:var(--smoke);margin:18px 0 30px;max-width:430px;font-weight:300}
.feature-copy .btns{display:flex;flex-direction:column;gap:12px;align-items:flex-start}

.pgrid{display:grid;grid-template-columns:repeat(4,1fr);gap:34px}
.pgrid.cols3{grid-template-columns:repeat(3,1fr);gap:24px;max-width:1080px;margin:0 auto}
.card{display:flex;flex-direction:column;position:relative}
/* Only the title, the thumbnail and the CTA pill were links, so a tap on the price, the SAVE
   badge or the padding around them died — 17 dead taps on /collection, 6 on /lounges. The CTA
   already points at the product, so stretch its hit area over the whole card. Everything else
   inside the card is either non-interactive or points at the same URL, so nothing is shadowed. */
.card-cta::after{content:"";position:absolute;inset:0;z-index:1;border-radius:14px}
/* The card-cta overlay (.card-cta::after, inset:0, z-index:1) makes the whole card tappable,
   but it sat ON TOP of the image, so an image tap was actually landing on the CTA overlay,
   not the image's own link. That routed to the right product on desktop but was flaky on
   touch. Scope the overlay to the card and lift the image link above it so the image is its
   own direct, reliable tap target on every device. */
.card{position:relative}
.card-img{display:block;aspect-ratio:4/3;background:var(--bone);overflow:hidden;position:relative;z-index:2;border-radius:14px}
.card-img img{width:100%;height:100%;object-fit:cover;transition:transform .7s cubic-bezier(.23,1,.32,1)}
.card:hover .card-img img{transform:scale(1.05)}
.card-fam .card-img img{object-position:center 60%}
.fam-badge{position:absolute;bottom:10px;left:10px;background:var(--burgundy);color:var(--ivory);font-size:10px;font-weight:700;letter-spacing:.045em;padding:5px 10px;border-radius:3px;text-transform:uppercase}
.card-body{padding:14px 2px 4px;display:flex;flex-direction:column;flex:1;text-align:left}
.card-row{display:flex;flex-direction:column;align-items:flex-start;gap:7px}
.card h3{font-family:'Satoshi','Helvetica Neue',Helvetica,Arial;font-weight:400;font-size:14.5px;line-height:1.35;color:var(--ink);letter-spacing:.01em;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;min-height:2.7em}
.card h3 a:hover{color:var(--cognac)}
.card .price{font-family:'Satoshi','Helvetica Neue',Helvetica,Arial;font-weight:500;font-size:14.5px;color:var(--cognac);letter-spacing:.03em;white-space:nowrap}
.fd-price{display:inline-flex;align-items:baseline;gap:9px;flex-wrap:wrap;white-space:normal;font-family:'Satoshi','Helvetica Neue',Helvetica,Arial}
.fd-price s{color:var(--ash);font-weight:400;text-decoration-thickness:1px}
.fd-price b{color:var(--burgundy);font-weight:700}
.fd-price.fd-plain{gap:0}.fd-price.fd-plain b{color:var(--ink);font-weight:600}
.fd-save{background:var(--burgundy);color:var(--gold);font-weight:600;font-size:10px;letter-spacing:.11em;text-transform:uppercase;border-radius:3px;padding:3px 8px;white-space:nowrap;align-self:center}
.fd-card{font-size:14.5px;flex-wrap:nowrap;white-space:nowrap;gap:8px}
.fd-card s{font-size:.86em}
.fd-card .fd-save{font-size:9.5px;padding:2px 7px;letter-spacing:.09em}
.fd-pdp{font-size:27px;gap:13px;letter-spacing:-.01em}
.fd-pdp s{font-size:.62em;font-weight:400}
.fd-pdp .fd-save{font-size:11px;letter-spacing:.1em;padding:4px 10px}
.fd-from{color:var(--ash);font-weight:400;align-self:baseline;margin-right:2px}
.pdp-saveline{font-family:'Satoshi','Helvetica Neue',Helvetica,Arial;font-weight:600;font-size:10.5px;letter-spacing:.14em;text-transform:uppercase;color:var(--gold-dp);margin:10px 0 0}
.card .atc{margin-top:9px}
.card-cta{display:flex;align-items:center;justify-content:center;gap:8px;margin-top:12px;padding:12px 18px;border:1px solid rgba(156,126,55,.45);border-radius:999px;font-family:'Satoshi','Helvetica Neue',Helvetica,Arial;font-weight:500;font-size:10.5px;letter-spacing:.18em;text-transform:uppercase;color:var(--ink);transition:background .3s cubic-bezier(.23,1,.32,1),color .3s cubic-bezier(.23,1,.32,1),transform .16s cubic-bezier(.23,1,.32,1)}
.card-cta .ti{font-size:13px;color:var(--gold-dp);transition:transform .3s cubic-bezier(.23,1,.32,1),color .3s}
@media(hover:hover) and (pointer:fine){.card-cta:hover{background:var(--cognac);color:var(--bone)}.card-cta:hover .ti{color:var(--bone);transform:translateX(3px)}}
.card-cta:active{filter:brightness(1.1);opacity:.85}
/* <button> elements can safely scale (they are not navigation). Anchors get a
   non-geometric press instead, so the tap target never moves. */
.dq-row button:active,.dq-quote button:active,.swatch-order button:active{transform:scale(.97)}
.btn:active,.btn-hero:active,.btn-cat:active{filter:brightness(1.1);opacity:.9}
.btn,.btn-hero,.btn-cat,.card-cta,.card-img,.ask-btn{touch-action:manipulation}
.rv{opacity:0;transform:translateY(18px);transition:opacity .8s cubic-bezier(.23,1,.32,1),transform .8s cubic-bezier(.23,1,.32,1)}
.rv.in{opacity:1;transform:none}
@media(prefers-reduced-motion:reduce){.rv{opacity:1;transform:none;transition:none}}
/* Mobile: never hide content behind the scroll-reveal observer. Show products immediately. */
@media(max-width:768px){.rv{opacity:1!important;transform:none!important;transition:none!important}}

.page-head{padding:52px 0 6px;text-align:center}
/* Nav left group */
.nav-left{display:flex;align-items:center;gap:6px}
/* Full-screen menu */
.menu-ov{position:fixed;inset:0;z-index:95;background:var(--bordeaux,#280D13);display:flex;flex-direction:column;padding:18px 26px 34px;opacity:0;pointer-events:none;transition:opacity .45s cubic-bezier(.23,1,.32,1)}
.menu-ov.open{opacity:1;pointer-events:auto}
.menu-top{display:flex;justify-content:space-between;align-items:center}
.menu-top .mark{color:var(--bone)}
.menu-x{color:var(--bone);font-size:26px}
.menu-links{display:flex;flex-direction:column;gap:6px;margin-top:9vh}
.menu-links a{font-family:'Satoshi','Helvetica Neue',Helvetica,Arial;font-weight:500;font-size:clamp(30px,5.4vw,54px);letter-spacing:-.015em;color:var(--bone);line-height:1.25;opacity:0;transform:translateY(22px);transition:opacity .6s cubic-bezier(.23,1,.32,1),transform .6s cubic-bezier(.23,1,.32,1),color .25s;transition-delay:calc(var(--i)*60ms)}
.menu-ov.open .menu-links a{opacity:1;transform:none}
@media(hover:hover){.menu-links a:hover{color:var(--champagne)}}
.menu-foot{margin-top:auto;display:flex;flex-direction:column;gap:8px;font-size:12px;letter-spacing:.16em;text-transform:uppercase;color:rgba(227,206,146,.75)}
.menu-foot a{color:var(--champagne)}
/* Serif italic always takes the second line in headlines */
h1 .it,h1 .ds,h2 .it,h2 .ds,.script-hero .it,.script-hero .ds{display:block}

/* Bespoke page */
.bsp-hero{position:relative;min-height:78vh;display:flex;align-items:flex-end;background:var(--ember);overflow:hidden}
.bsp-hero img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.bsp-hero-scrim{position:absolute;inset:0;background:linear-gradient(to top,rgba(20,7,10,.92) 6%,rgba(20,7,10,.45) 50%,rgba(20,7,10,.4) 100%)}
.bsp-hero-in{position:relative;z-index:2;padding-bottom:8vh;max-width:760px}
.bsp-hero-in .eyebrow{display:block;margin-bottom:18px}
.bsp-hero-in h1{font-family:'Satoshi','Helvetica Neue',Helvetica,Arial,sans-serif;font-weight:500;font-size:clamp(38px,6vw,72px);letter-spacing:-.02em;color:var(--bone);line-height:1.02}
.bsp-hero-in h1 .it{color:var(--champagne)}
.bsp-hero-in p{color:rgba(244,236,219,.82);font-size:16px;font-weight:300;margin:20px 0 30px;max-width:560px;line-height:1.6}
.bsp-hero-in .btn-hero{background:var(--bone);color:var(--ember);border:none;border-radius:999px;padding:16px 34px;font-size:12px;letter-spacing:.16em;text-transform:uppercase;display:inline-block;transition:transform .16s cubic-bezier(.23,1,.32,1),filter .25s}
.bsp-hero-in .btn-hero:hover{filter:brightness(.94)}.bsp-hero-in .btn-hero:active{filter:brightness(.88)}
.bsp-pitch{background:var(--paper)}
.bsp-lead{max-width:760px}
.bsp-lead .eyebrow{display:block;margin-bottom:16px}
.bsp-lead h2{font-family:'Satoshi','Helvetica Neue',Helvetica,Arial;font-weight:500;font-size:clamp(30px,4.4vw,46px);letter-spacing:-.015em;color:var(--ink);line-height:1.06;margin-bottom:22px}
.bsp-lead h2 .it{color:var(--burgundy)}
.bsp-lead p{font-size:16px;line-height:1.8;color:#4a3038;margin-bottom:18px;max-width:680px;font-weight:300}
.bsp-stats{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;margin-top:56px;border-top:1px solid rgba(156,126,55,.35);padding-top:44px}
.bsp-stat .n{font-family:'DM Serif Display',Georgia,serif;font-style:italic;font-size:34px;color:var(--cognac);letter-spacing:-.02em;margin-bottom:10px}
.bsp-stat span{font-size:13.5px;color:var(--smoke);line-height:1.55;display:block;max-width:230px}
.bsp-proc{background:var(--paper2)}
.bsp-steps{display:grid;grid-template-columns:repeat(3,1fr);gap:34px}
.bsp-step{border-top:2px solid var(--gold);padding-top:22px}
.bsp-step .s-n{font-family:'DM Serif Display',Georgia,serif;font-style:italic;font-size:26px;color:var(--gold-dp);margin-bottom:14px}
.bsp-step b{display:block;font-size:18px;font-weight:500;color:var(--ink);margin-bottom:10px;letter-spacing:-.01em}
.bsp-step p{font-size:14.5px;line-height:1.65;color:var(--smoke);font-weight:300}
/* Warranty page. Links are champagne, never browser blue: an unstyled blue mailto on a bordeaux
   page reads as a raw document, and a warranty is the one page that has to look deliberate. */
/* Cold-traffic landing page.
   DARK ON CREAM. body{background:var(--paper)} and --paper is #F4ECDB, identical to --ivory, so
   anything written rgba(244,236,219,...) is invisible. The first cut shipped exactly that fault.
   The only ivory text belongs inside .lp-video and .lp-q, which carry their own dark grounds. */
.lp{padding:34px 0 72px}
.lp-wrap{max-width:1120px}
.lp-top{max-width:820px;margin:0 auto 26px;text-align:center}
.lp-top .eyebrow{color:var(--gold-dp)}
.lp-top h1{font-size:clamp(28px,4.6vw,50px);line-height:1.12;margin:14px 0 0}
.lp-video{border-radius:16px;overflow:hidden;aspect-ratio:16/9;background:#1f0a10;
border:1px solid rgba(40,13,19,.2)}
.lp-video video{width:100%;height:100%;object-fit:cover;display:block}
.lp-vcap{max-width:62ch;margin:18px auto 0;text-align:center;color:var(--smoke);
font-size:15px;line-height:1.6}
/* THE COLOUR BREAK. Everything from question one down sits on bordeaux, which is the brand's
   dark ground (~42% of any surface per BRAND-GUIDE §2). It changes the feel exactly where the page
   changes job: above it is persuasion, below it is the task. It also makes the room tiles glow
   instead of sitting flat on cream. Full-bleed via a wide box-shadow so it spans the viewport
   without escaping the layout container. */
.lp-q{position:relative;margin:56px 0 0;padding:clamp(38px,5vw,60px) clamp(18px,3vw,34px)
 clamp(34px,4vw,48px);border-radius:20px;
 background:radial-gradient(120% 80% at 10% 0%,#3E121C 0%,#280D13 60%);
 scroll-margin-top:78px;color:var(--ivory)}
.lp-q .eyebrow{color:var(--gold)}
.lp-q h2{margin:12px 0 12px;color:var(--ivory)}
.lp-q h2 .it{color:var(--champagne)}
.lp-qsub{font-size:15px;line-height:1.65;color:rgba(244,236,219,.74);margin:0}
/* Desktop: the ask sits left, the choices right. On one column the copy was a wall the visitor
   read past before reaching anything clickable. */
@media(min-width:900px){
 .lp-q{display:grid;grid-template-columns:minmax(0,340px) minmax(0,1fr);gap:clamp(30px,4vw,52px);
  align-items:start;text-align:left}
 .lp-qcopy{position:sticky;top:96px}
 .lp-q h2{font-size:clamp(28px,3vw,40px)}
 .lp-qsub{max-width:34ch}
}
/* The prompt. An arrow that travels, not a decoration: it points at the thing to click. */
.lp-prompt{display:none;align-items:center;gap:11px;margin:22px 0 0;color:var(--champagne);
font-size:13px;letter-spacing:.14em;text-transform:uppercase}
.lp-prompt i{font-size:19px;animation:nudge 1.9s var(--ease) infinite}
@keyframes nudge{0%,100%{transform:translateX(0);opacity:.55}50%{transform:translateX(7px);opacity:1}}
@media(min-width:900px){.lp-prompt{display:flex}}
@media(prefers-reduced-motion:reduce){.lp-prompt i{animation:none;opacity:1}}
/* Tiles: smaller and less tall than the old 4:5. Six of those filled a desktop screen on their
   own and read as a gallery rather than a set of choices. */
.lp-q .lp-rooms{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;margin:0}
.lp-room{display:block;border-radius:13px;overflow:hidden;text-decoration:none;
background:rgba(244,236,219,.05);border:1px solid rgba(244,236,219,.16);
transition:transform .2s var(--ease),box-shadow .2s var(--ease),border-color .2s var(--ease)}
.lp-shot{display:block;position:relative;overflow:hidden;aspect-ratio:4/3}
.lp-shot img{width:100%;height:100%;object-fit:cover;display:block;
transition:transform .6s cubic-bezier(.2,.7,.3,1)}
.lp-pick{display:flex;align-items:center;justify-content:center;gap:8px;padding:12px 10px;
background:rgba(20,6,9,.55);color:var(--ivory);font-size:12px;font-weight:500;letter-spacing:.09em;
text-transform:uppercase;white-space:nowrap;transition:background .2s var(--ease)}
.lp-pick i{font-size:13px;color:var(--champagne);transition:transform .2s var(--ease)}
@media(hover:hover) and (pointer:fine){
 .lp-room:hover{transform:translateY(-3px);border-color:rgba(227,206,146,.6);
  box-shadow:0 18px 38px rgba(0,0,0,.42)}
 .lp-room:hover .lp-shot img{transform:scale(1.05)}
 .lp-room:hover .lp-pick{background:var(--burgundy)}
 .lp-room:hover .lp-pick i{transform:translateX(3px)}}
.lp-room:active{transform:scale(.985)}
.lp-qfoot{margin-top:20px}
.lp-none{color:rgba(244,236,219,.62);font-size:13.4px;text-decoration:underline;
text-underline-offset:3px}
@media(hover:hover){.lp-none:hover{color:var(--champagne)}}
/* Start button, directly under the video. */
.lp-vgo{margin:22px 0 0;text-align:center}
.lp-startbtn{display:inline-flex;align-items:center;gap:10px;padding:15px 26px;border-radius:999px;
text-decoration:none;color:var(--ivory);background:var(--burgundy);
border:1px solid rgba(195,162,78,.6);box-shadow:0 12px 28px rgba(92,27,41,.26);
font-size:13px;font-weight:500;letter-spacing:.08em;text-transform:uppercase;
transition:transform .2s var(--ease),box-shadow .2s var(--ease)}
.lp-startbtn i{font-size:16px;color:var(--champagne)}
@media(hover:hover) and (pointer:fine){.lp-startbtn:hover{transform:translateY(-2px);
 box-shadow:0 18px 38px rgba(92,27,41,.34)}}
.lp-startbtn:active{transform:scale(.97)}
.lp-vgo span{display:block;margin-top:10px;color:var(--smoke);font-size:12.6px}
@media(max-width:620px){
 .lp-q{margin-top:38px;border-radius:16px;padding:30px 16px 28px}
 .lp-q .lp-rooms{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
 .lp-pick{font-size:10.6px;padding:10px 6px;letter-spacing:.04em}
 .lp-pick i{display:none}
}
/* Four proof points, not four bullets. A dot and a fragment read as a legal footer; an icon and
   a two-line pair reads as something worth knowing. Gold stays a hairline on the ring, never a
   fill. */
/* --- /book-your-call ------------------------------------------------------------------------
   The film sells, then the booking block closes. Two columns: the specialists on the left at a
   size where their faces are legible, the picker on the right where the eye lands after reading
   the headline. Below 940px the photograph goes first and full width, because on a phone the
   face is the reason to trust the form under it. Gold stays a hairline, never a fill. --------- */
.bkp .lp-vcap{margin-bottom:clamp(18px,2.2vw,26px)}

/* The middle. Three things the call covers, as a conversation rather than a commitment. */
.bkw{margin:0;text-align:center}
.bkw-hd h2{margin:10px 0 0;font-size:clamp(26px,3.6vw,42px);line-height:1.08;max-width:22ch;
  margin-left:auto;margin-right:auto}
.bkw-grid{list-style:none;margin:clamp(30px,3.8vw,46px) auto 0;padding:0;display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(22px,3.2vw,44px);text-align:left;
  max-width:1000px}
.bkw-grid li{display:flex;flex-direction:column;gap:10px;min-width:0}
.bkw-img{display:block;border-radius:11px;overflow:hidden;aspect-ratio:3/2;background:rgba(244,236,219,.08)}
.bkw-img img{display:block;width:100%;height:100%;object-fit:cover}
.bkw-grid b{font-size:clamp(15px,1.5vw,17px);font-weight:600;letter-spacing:-.015em;color:var(--ivory)}
.bkw-grid p{margin:0;font-size:13.8px;line-height:1.6;color:rgba(244,236,219,.72)}
@media(max-width:820px){
  .bkw{text-align:left}
  .bkw-hd h2{margin-left:0}
  .bkw-grid{grid-template-columns:minmax(0,1fr);gap:20px}
  .bkw-grid li{display:grid;grid-template-columns:104px minmax(0,1fr);
    grid-template-rows:auto auto;column-gap:15px;row-gap:5px;align-items:start}
  .bkw-img{grid-column:1;grid-row:1/3;aspect-ratio:1/1;align-self:start}
  .bkw-grid b{grid-column:2;grid-row:1}
  .bkw-grid p{grid-column:2;grid-row:2}}

/* --- the booking block ------------------------------------------------------------------------
   Drenched, exactly like .lp-q on the sister page. The first cut styled this panel for a dark
   ground and then left it on the cream page, so every label and chip rendered ivory on ivory and
   vanished. --paper and --ivory are both #F4ECDB; a light panel is never the safe default here. */
/* The dark region. A plain full-width child of the section, so it is exactly the page width at
   every size. The previous version used width:100vw with negative margins, which counts the
   scrollbar: measured at four breakpoints it came out 15px too wide and 7px off centre, with the
   spill hidden by overflow clip. That is what showed as a broken bleed.

   The gradient starts at the top of this region and is finished before the cards, so the heading
   reads on cream, the pictures sit in the transition, and every word below them is on the dark.
   Seven stops on a monotonic warm path: fading the page colour over the dark with alpha passes
   through a grey mauve, and a short run turns it into a salmon stripe. Measured at 1.3 luminance
   per row, which is under the visible-banding threshold. */
.bkdark{position:relative;padding:clamp(174px,14vw,190px) 0 clamp(30px,3.4vw,44px);
  color:var(--ivory);
  background:linear-gradient(to bottom,
    var(--paper) 0,#F0E6D3 31px,#DCC7B6 60px,#B79B92 88px,
    #8A6159 111px,#5E323A 129px,#3C1820 145px,#280D13 160px)}
/* The transition finishes at 214px and nothing starts before 232px, at ANY width. An earlier cut
   let the gradient run 560px and the cards landed at y=164 on a narrow screen, mid-transition,
   where ivory type would have been unreadable. Content on the dark, fade above it, always. */
.bkdark .bkw-hd h2{color:var(--ivory)}
/* The eyebrow is two words now. "Speak to a specialist · Australian owned" was 40 characters at
   .34em tracking, which broke after "AUSTRALIAN" and orphaned "OWNED" on a 375px screen;
   text-wrap:balance could not help against tracking that wide. The phone bar above already says
   speak to a specialist, so this was a duplicate as well as a wrapping problem. */
.bk{position:relative;margin:clamp(26px,3.4vw,44px) 0 0;padding:0;
  border-radius:0;color:var(--ivory);scroll-margin-top:78px}

/* The photograph bleeds in rather than sitting in a card, so the film above runs down into the
   form with no hard edge. The frames are generated to fall to near-black at their borders, which
   is what gives the mask something to dissolve into. */
.bk-hero{position:relative;margin:0 auto;max-width:1080px}
.bk-hero img{display:block;width:100%;height:auto;max-height:min(54vh,530px);object-fit:cover;
  object-position:center 14%;
  -webkit-mask-image:linear-gradient(to bottom,rgba(0,0,0,.82) 0%,#000 9%,#000 54%,transparent 96%),
                     linear-gradient(to right,transparent 0%,#000 12%,#000 88%,transparent 100%);
  mask-image:linear-gradient(to bottom,rgba(0,0,0,.82) 0%,#000 9%,#000 54%,transparent 96%),
             linear-gradient(to right,transparent 0%,#000 12%,#000 88%,transparent 100%);
  -webkit-mask-composite:source-in;mask-composite:intersect}
.bk-hero figcaption{display:flex;flex-direction:column;gap:1px;align-items:center;
  margin-top:clamp(-38px,-2.6vw,-16px);position:relative;z-index:2}
.bk-hero figcaption b{color:var(--ivory);font-size:clamp(15px,1.6vw,18px);font-weight:500;letter-spacing:-.01em}
.bk-hero figcaption span{color:var(--champagne);font-size:10.8px;letter-spacing:.14em;text-transform:uppercase}


.bk-who{max-width:52ch;margin:clamp(14px,1.8vw,20px) auto 0;text-align:center;
  color:rgba(244,236,219,.74);font-size:14.4px;line-height:1.62}
.bk-panel{max-width:660px;margin:clamp(20px,2.4vw,30px) auto 0;padding:0 clamp(18px,3vw,30px);
  position:relative;z-index:2}
.bk-panel h2{margin:0 0 clamp(16px,2vw,22px);font-size:clamp(28px,3.4vw,40px);line-height:1.04;
  color:var(--ivory);text-align:center}
.bk-panel h2 .it,.bk-panel h2 .up{display:inline}

.bk-picks{display:grid;grid-template-columns:minmax(0,1.62fr) minmax(0,1fr);gap:clamp(18px,2.4vw,30px)}
@media(max-width:640px){.bk-picks{grid-template-columns:minmax(0,1fr);gap:16px}}
.bk-field{border:0;padding:0;margin:0;min-width:0}
.bk-field legend{padding:0;font-size:9.8px;letter-spacing:.18em;text-transform:uppercase;
  color:rgba(195,162,78,.85);margin-bottom:7px}
.bk-days{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:6px}
.bk-slots{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:6px}
@media(max-width:640px){.bk-days{grid-template-columns:repeat(5,minmax(0,1fr))}}
.bk-day,.bk-slot{appearance:none;cursor:pointer;font:inherit;text-align:center;
  background:rgba(244,236,219,.05);border:1px solid rgba(244,236,219,.16);border-radius:9px;
  padding:8px 4px;color:var(--ivory);display:flex;flex-direction:column;gap:1px;
  transition:border-color .15s ease,background .15s ease}
.bk-day b,.bk-slot b{font-size:12.6px;font-weight:600;letter-spacing:-.01em}
.bk-day span,.bk-slot span{font-size:10.6px;color:rgba(244,236,219,.6)}
.bk-day:hover,.bk-slot:hover{border-color:rgba(227,206,146,.5);background:rgba(244,236,219,.09)}
.bk-day.on,.bk-slot.on{border-color:var(--gold);background:rgba(195,162,78,.17)}
.bk-day:focus-visible,.bk-slot:focus-visible{outline:2px solid var(--gold);outline-offset:2px}

.bk-two{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;margin-top:18px}
@media(max-width:640px){.bk-two{grid-template-columns:minmax(0,1fr)}}
.bk-two label,.bk-msg{display:flex;flex-direction:column;gap:6px;font-size:9.8px;letter-spacing:.18em;
  text-transform:uppercase;color:rgba(195,162,78,.85);min-width:0}
.bk-one{display:flex;flex-direction:column;gap:6px;font-size:9.8px;letter-spacing:.18em;
  text-transform:uppercase;color:rgba(195,162,78,.85);margin-top:10px;min-width:0}
.bk-one>span{display:block}
.bk-one i{font-style:normal;color:rgba(244,236,219,.4);letter-spacing:.14em;margin-left:6px}
.bk-one input{width:100%;padding:12px 14px;border:1px solid rgba(244,236,219,.24);border-radius:10px;
  background:rgba(244,236,219,.06);color:var(--ivory);font:16px/1.5 var(--sans);
  letter-spacing:0;text-transform:none}
.bk-one input::placeholder{color:rgba(244,236,219,.36)}
.bk-one input:focus{outline:none;border-color:var(--gold)}
.bk-msg{margin-top:10px}
.bk-two input,.bk-msg textarea{width:100%;padding:12px 14px;border:1px solid rgba(244,236,219,.24);
  border-radius:10px;background:rgba(244,236,219,.06);color:var(--ivory);
  font:16px/1.5 var(--sans);letter-spacing:0;text-transform:none}
.bk-msg textarea{resize:vertical;min-height:64px}
.bk-two input::placeholder,.bk-msg textarea::placeholder{color:rgba(244,236,219,.36)}
.bk-two input:focus,.bk-msg textarea:focus{outline:none;border-color:var(--gold)}
.bk-err{margin:10px 0 0;color:#e0a08c;font-size:13.2px}
.bk-err:empty{margin:0}
.bk-go{width:100%;margin-top:14px}
.bk-fine{margin:10px 0 0;text-align:center;color:rgba(244,236,219,.52);font-size:12.2px}
.bk-now{margin:16px 0 0;padding-top:14px;border-top:1px solid rgba(244,236,219,.13);
  color:rgba(244,236,219,.66);font-size:13.2px;text-align:center}
.bk-now a{color:var(--champagne);border-bottom:1px solid rgba(227,206,146,.4)}

.bk-done{display:flex;flex-direction:column;gap:8px;padding:20px 0 4px;text-align:center;align-items:center}
.bk-done i{color:var(--gold);font-size:30px}
.bk-done b{color:var(--ivory);font-size:clamp(19px,2.2vw,24px);font-weight:500;letter-spacing:-.01em}
.bk-done span{color:rgba(244,236,219,.74);font-size:14.2px;line-height:1.55;max-width:46ch}
.bk-done a{color:var(--champagne);border-bottom:1px solid rgba(227,206,146,.4)}
.lp-strip{list-style:none;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));
gap:clamp(14px,2vw,26px);margin:clamp(30px,4vw,44px) 0 0;padding:clamp(24px,3vw,32px) 0 0;
border-top:1px solid var(--line)}
.lp-strip li{display:flex;align-items:flex-start;gap:13px}
.lp-strip i{flex:0 0 auto;width:40px;height:40px;border-radius:50%;display:flex;align-items:center;
justify-content:center;font-size:19px;color:var(--cognac-dp);
background:rgba(195,162,78,.11);border:1px solid rgba(156,126,55,.34)}
.lp-strip span{display:block;min-width:0}
.lp-strip b{display:block;color:var(--bordeaux);font-size:14.6px;font-weight:500;line-height:1.25;
margin-bottom:3px}
.lp-strip span{color:var(--smoke);font-size:12.8px;line-height:1.45}
@media(max-width:900px){.lp-strip{grid-template-columns:repeat(2,minmax(0,1fr));gap:18px 16px}}
@media(max-width:480px){.lp-strip i{width:34px;height:34px;font-size:16px}
 .lp-strip b{font-size:13.4px}.lp-strip span{font-size:12px}}
.lp-contact{margin:clamp(38px,5vw,56px) 0 0;padding-top:clamp(28px,3.4vw,36px);
border-top:1px solid var(--line);text-align:center}
.lp-contact p{margin:0 0 16px;color:var(--smoke);font-size:15.5px}
.lp-call{display:inline-flex;align-items:center;gap:12px;padding:16px 30px;border-radius:999px;
text-decoration:none;color:var(--ivory);background:var(--burgundy);
border:1px solid rgba(195,162,78,.6);box-shadow:0 14px 32px rgba(92,27,41,.26);
font-size:clamp(17px,2vw,21px);font-weight:500;letter-spacing:.01em;
font-variant-numeric:tabular-nums;
transition:transform .2s var(--ease),box-shadow .2s var(--ease)}
.lp-call i{font-size:20px;color:var(--champagne)}
@media(hover:hover) and (pointer:fine){.lp-call:hover{transform:translateY(-2px);
 box-shadow:0 20px 42px rgba(92,27,41,.34)}}
.lp-call:active{transform:scale(.97)}
.lp-hours{display:block;margin-top:14px;color:var(--ash);font-size:12.8px}
@media(max-width:620px){.lp-call{width:100%;justify-content:center}}
/* A touch more air at the edges on a phone: the video and the tiles were running almost to
   the bezel, which reads as clipped rather than full-bleed. */
@media(max-width:620px){.lp{padding:22px 0 56px}
 .lp-wrap{padding-left:16px;padding-right:16px}
 .lp-q .lp-rooms{grid-template-columns:repeat(2,1fr);gap:10px}
 .lp-pick{font-size:11px;padding:11px 6px;letter-spacing:.04em}
 .lp-shot{aspect-ratio:4/3}.lp-strip{gap:8px 18px;font-size:12.6px}
 .lp-q{margin-top:40px}}
.wty{padding:64px 0 90px}
.wty-wrap{max-width:820px}
.wty-hero{padding-bottom:34px;border-bottom:1px solid var(--line)}
.wty-lede{font-size:18.5px;line-height:1.6;max-width:60ch;margin:18px 0 0}
.wty p,.wty li{color:var(--smoke);max-width:66ch}
.wty b{color:var(--bordeaux);font-weight:500}
.wty a{color:var(--cognac-dp);text-decoration:underline;text-underline-offset:3px;
text-decoration-thickness:1px;text-decoration-color:rgba(156,126,55,.5)}
.wty a:hover{text-decoration-color:var(--cognac-dp)}
.wty-acl{background:rgba(195,162,78,.13);border:1px solid rgba(156,126,55,.42);border-radius:14px;
padding:26px 28px;margin:34px 0}
.wty-acl .eyebrow{color:var(--gold-dp);display:block;margin-bottom:14px}
.wty-acl p{color:var(--bordeaux);max-width:none;font-size:15.4px}
.wty-acl p:last-child{margin-bottom:0}
.wty-h{font-size:25px;font-weight:500;margin:52px 0 10px;color:var(--bordeaux)}
.wty-h span{display:block;color:var(--gold-dp);font-size:15px;margin-bottom:7px;letter-spacing:.06em}
.wty-sh{font-size:16.5px;font-weight:500;margin:30px 0 6px;color:var(--burgundy)}
.wty-t{width:100%;border-collapse:collapse;margin:20px 0 8px;font-size:14.6px}
.wty-t th{text-align:left;color:var(--cognac-dp);font-weight:500;font-size:11.5px;letter-spacing:.13em;
text-transform:uppercase;padding:0 14px 11px 0;border-bottom:1px solid var(--line)}
.wty-t td{padding:14px 14px 14px 0;border-bottom:1px solid var(--line);
vertical-align:top;color:var(--smoke)}
.wty-t td:first-child{color:var(--bordeaux);font-weight:500;width:40%}
.wty-call{border-left:2px solid var(--gold-dp);padding:2px 0 2px 20px;margin:26px 0}
.wty-call p{color:var(--burgundy)}
.wty-ul{padding-left:19px;margin:0 0 15px}
.wty-ul li{margin-bottom:7px}
.wty-fine{font-size:13.4px;color:var(--ash);line-height:1.6;max-width:none}
.wty-contact{background:rgba(40,13,19,.035);border:1px solid var(--line);
border-radius:14px;padding:26px 28px;margin:38px 0 0}
.wty-contact p{margin-bottom:8px}
@media(max-width:620px){.wty{padding:44px 0 70px}
 .wty-t td:first-child{width:auto}
 .wty-t td,.wty-t th{display:block;padding-right:0}
 .wty-t th{border:0;padding-bottom:4px}
 .wty-t td{border-bottom:none;padding:2px 0}
 .wty-t tr{display:block;padding:14px 0;border-bottom:1px solid var(--line)}}
.bsp-form-sec{background:var(--ember);color:var(--bone);padding:96px 0}
.bsp-form-wrap{display:grid;grid-template-columns:1fr 1.1fr;gap:70px;align-items:start}
.bsp-form-copy .eyebrow{display:block;margin-bottom:16px}
.bsp-form-copy h2{font-family:'Satoshi','Helvetica Neue',Helvetica,Arial;font-weight:500;font-size:clamp(30px,4vw,44px);letter-spacing:-.015em;color:var(--bone);line-height:1.04}
.bsp-form-copy h2 .it{color:var(--champagne)}
.bsp-form-copy p{color:#c9bda9;font-weight:300;font-size:15px;line-height:1.7;margin:20px 0;max-width:400px}
.bsp-contact{font-size:14px;color:var(--champagne);line-height:2;letter-spacing:.02em}
.bsp-contact .ti{width:20px;color:var(--gold)}
.bsp-form{position:relative}
.bsp-form label{display:block;font-size:11px;letter-spacing:.16em;text-transform:uppercase;color:#9a8e7c;margin-bottom:18px}
.bsp-row{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.bsp-form input,.bsp-form select,.bsp-form textarea{display:block;width:100%;margin-top:8px;background:rgba(255,255,255,.04);border:1px solid rgba(195,162,78,.4);color:var(--bone);padding:14px 16px;font-size:15px;font-family:inherit;letter-spacing:0;text-transform:none;outline:none;border-radius:8px;transition:border-color .25s}
.bsp-form input:focus,.bsp-form select:focus,.bsp-form textarea:focus{border-color:var(--gold)}
.bsp-form textarea{resize:vertical;line-height:1.6}
.bsp-form select{appearance:none;background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath fill='%23C3A24E' d='M6 8L0 0h12z'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 16px center}
.bsp-form select option{color:#111}
.bsp-file{display:flex;align-items:center;gap:12px;margin-bottom:24px}
.bsp-file-btn{display:inline-flex;align-items:center;gap:9px;cursor:pointer;border:1px dashed rgba(195,162,78,.5);border-radius:8px;padding:13px 18px;font-size:12px;letter-spacing:.1em;text-transform:uppercase;color:var(--champagne);margin:0;transition:.25s}
.bsp-file-btn:hover{background:rgba(255,255,255,.04);border-color:var(--gold)}
.bsp-file-btn input{display:none}
.bsp-file-clear{background:none;border:none;color:#9a8e7c;font-size:12px;letter-spacing:.1em;text-transform:uppercase;cursor:pointer;font-family:inherit;text-decoration:underline}
.btn-bsp{width:100%;display:inline-flex;align-items:center;justify-content:center;gap:10px;background:var(--cognac);color:var(--bone);border:1px solid var(--gold);border-radius:999px;padding:17px 28px;font-size:12px;letter-spacing:.18em;text-transform:uppercase;cursor:pointer;font-family:inherit;transition:filter .25s,transform .16s cubic-bezier(.23,1,.32,1)}
.btn-bsp:hover{filter:brightness(1.12)}.btn-bsp:active{transform:scale(.98)}
.bsp-note{font-size:12px;color:#8a7d6a!important;letter-spacing:.02em!important;text-transform:none!important;margin-top:16px!important;text-align:center}
.bsp-done{position:absolute;inset:0;background:var(--ember);display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:20px}
.bsp-done-mark{width:64px;height:64px;border-radius:50%;border:1.5px solid var(--gold);display:flex;align-items:center;justify-content:center;color:var(--gold);font-size:30px;margin-bottom:22px}
.bsp-done h3{font-family:'DM Serif Display',Georgia,serif;font-style:italic;font-size:28px;color:var(--bone);margin-bottom:12px;letter-spacing:-.02em}
.bsp-done p{color:#c9bda9;font-weight:300;font-size:15px;max-width:320px}
@media(max-width:980px){
 .bsp-hero{min-height:70vh}
 .bsp-stats{grid-template-columns:1fr;gap:28px}
 .bsp-steps{grid-template-columns:1fr;gap:26px}
 .bsp-form-wrap{grid-template-columns:1fr;gap:40px}
 .bsp-row{grid-template-columns:1fr}
 .bsp-form-sec{padding:64px 0}
}

/* Category photo hero */
.page-hero{position:relative;min-height:300px;display:flex;align-items:flex-end;background:var(--ember);overflow:hidden}
.page-hero img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.ph-scrim{position:absolute;inset:0;background:linear-gradient(to top,rgba(20,7,10,.88) 0%,rgba(20,7,10,.35) 55%,rgba(20,7,10,.25) 100%)}
.ph-inner{position:relative;z-index:2;width:100%;padding-top:60px;padding-bottom:34px}
.ph-crumb{font-size:10.5px;letter-spacing:.14em;text-transform:uppercase;color:rgba(244,236,219,.6);margin-bottom:14px}
.ph-crumb a{color:rgba(244,236,219,.6)}.ph-crumb a:hover{color:var(--champagne)}
.page-hero h1{font-family:'Satoshi','Helvetica Neue',Helvetica,Arial,sans-serif;font-weight:500;font-size:44px;letter-spacing:-.015em;color:var(--bone);line-height:1.05}
.page-hero p{color:rgba(244,236,219,.75);margin-top:8px;font-weight:300;font-size:14px;max-width:520px}
@media(max-width:980px){.page-hero{min-height:230px}.page-hero h1{font-size:32px}.ph-inner{padding-bottom:26px}}
.catgrid{padding-top:30px}
.cathead{padding:46px 0 2px;border-bottom:1px solid var(--line)}
.cathead .ph-crumb{color:var(--ash);margin-bottom:15px}
.cathead .ph-crumb a{color:var(--ash)}
.cathead .ph-crumb a:hover{color:var(--cognac)}
.cathead h1{font-family:'Satoshi','Helvetica Neue',Helvetica,Arial,sans-serif;font-weight:500;font-size:44px;color:var(--ink);line-height:1.06;letter-spacing:-.015em}
.cathead p{color:var(--ash);margin-top:11px;font-weight:300;font-size:14px}
@media(max-width:600px){.page-hero{min-height:150px}.page-hero h1{font-size:25px}.page-hero p{font-size:12px;margin-top:5px}.ph-inner{padding-top:40px;padding-bottom:15px}.ph-crumb{margin-bottom:7px;font-size:9.5px}.catgrid{padding-top:20px}.cathead{padding:22px 0 2px}.cathead h1{font-size:29px}.cathead p{font-size:12.5px;margin-top:7px}.cathead .ph-crumb{margin-bottom:9px}}

.page-head .eyebrow{display:block;margin-bottom:16px}
.page-head h1{font-family:'Satoshi','Helvetica Neue',Helvetica,Arial,sans-serif;font-weight:500;font-size:46px;color:var(--ink);line-height:1.08;letter-spacing:-.015em}
.page-head p{color:var(--ash);margin-top:12px;font-weight:300;font-size:14px}
.crumb{font-family:'Satoshi','Helvetica Neue',Helvetica,Arial;font-size:11px;color:var(--ash);padding:24px 0 0;letter-spacing:.1em;text-transform:uppercase}
.crumb a:hover{color:var(--cognac)}

.pdp{display:grid;grid-template-columns:1.15fr .85fr;column-gap:64px;row-gap:46px;padding:46px 0 96px;align-items:start;grid-template-areas:'gallery buy' 'details buy'}
.gallery{grid-area:gallery;min-width:0}
.pdp-details{grid-area:details;min-width:0;border-top:1px solid var(--line);padding-top:30px}
.pdp-details>:first-child{margin-top:0;border-top:none;padding-top:0}
.gallery .gframe{background:var(--bone);border-radius:14px;position:relative;aspect-ratio:4/3;display:flex;overflow-x:auto;overflow-y:hidden;scroll-snap-type:x mandatory;-webkit-overflow-scrolling:touch;scrollbar-width:none}
.gallery .gframe::-webkit-scrollbar{display:none}
.gcell{flex:0 0 100%;height:100%;scroll-snap-align:center;position:relative;overflow:hidden}
.gcell>img{width:100%;height:100%;object-fit:cover;display:block;cursor:zoom-in}
/* Lightbox. The gallery photo and the leather macro were the two most dead-tapped things on
   a product page — people tap a product shot expecting it to open, and nothing did. */
.lbx{position:fixed;inset:0;z-index:1200;background:rgba(12,6,8,.94);display:none;align-items:center;justify-content:center;padding:22px;-webkit-tap-highlight-color:transparent}
.lbx.on{display:flex}
.lbx img{max-width:100%;max-height:100%;object-fit:contain;border-radius:8px}
.lbx-x{position:absolute;top:14px;right:16px;width:44px;height:44px;border-radius:999px;border:1px solid rgba(240,232,220,.4);background:rgba(0,0,0,.4);color:var(--ivory,#f4ece1);font-size:26px;line-height:1;cursor:pointer}
#macro-img{cursor:zoom-in}
.gcell-shop{background:var(--ink)}
.gcell-shop .shopwrap{position:absolute;inset:0}
.gcell-shop .shopwrap>img{width:100%;height:100%;object-fit:cover;object-position:center;display:block}
.shop-tag{position:absolute;top:12px;left:12px;z-index:3;background:rgba(40,13,19,.72);color:var(--ivory);font-size:10px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;padding:5px 10px;border-radius:3px}
.thumb-shop{position:relative;outline:2px solid var(--burgundy);outline-offset:-2px}
.thumbs{display:flex;gap:12px;margin-top:14px;flex-wrap:wrap}
/* Background-removed product PNGs are transparent. On the bone thumb they read as an empty tile,
   which looks like a broken image. A slightly darker fill gives the cutout something to sit on. */
.thumbs img{width:88px;height:66px;object-fit:cover;border:1px solid var(--line);cursor:pointer;background:#E7DCC4;border-radius:8px}
.thumbs img.active{border-color:var(--cognac)}
.gdots{display:none}
/* Mobile gallery: a scrolling thumbnail strip with a progress bar under it, instead of dots.
   Dots say which of five you are on; thumbnails say what the other four ARE. */
@media(max-width:820px){.gallery .gframe{scroll-snap-type:x mandatory}
.thumbs{display:flex;flex-wrap:nowrap;overflow-x:auto;gap:8px;margin-top:10px;padding-bottom:2px;
  scroll-snap-type:x proximity;-webkit-overflow-scrolling:touch;scrollbar-width:none}
.thumbs::-webkit-scrollbar{display:none}
.thumbs img{width:74px;height:56px;flex:0 0 74px;scroll-snap-align:start;border-radius:6px}
.gbar{display:block;height:2px;margin-top:9px;background:rgba(40,13,19,.12);border-radius:99px;overflow:hidden}
.gbar i{display:block;height:100%;width:30%;background:var(--burgundy);border-radius:99px;
  transform-origin:left center;transition:transform .18s ease,width .18s ease}
.gdots{display:none}
.gdot{width:7px;height:7px;border-radius:999px;background:rgba(40,13,19,.2);transition:width .25s,background .25s}
.gdot.on{width:22px;background:var(--burgundy)}}
.pdp-info{grid-area:buy;position:sticky;top:120px;align-self:start}
.pdp-info .eyebrow{display:block;margin-bottom:16px}
.pdp-info h1{font-family:'Satoshi','Helvetica Neue',Helvetica,Arial;font-weight:500;font-size:29px;line-height:1.18;letter-spacing:-.014em;color:var(--ink)}
.pdp-colour{margin-top:10px;font-family:'Satoshi','Helvetica Neue',Helvetica,Arial;font-size:11.5px;font-weight:600;letter-spacing:.16em;text-transform:uppercase;color:var(--cognac)}
.pdp-price{margin:20px 0 4px}
.pdp-pay{font-size:13.5px;color:var(--smoke);margin-bottom:24px;font-weight:400}
.pdp-pay b{color:var(--gold-dp);font-weight:600}
.pdp-pay .fin-alt{display:block;font-size:11px;color:var(--ash);margin-top:4px;letter-spacing:.04em}
.pdp-dims{margin:22px 0 24px;padding-top:20px;border-top:1px solid var(--line)}
.pdp-dims .eyebrow{display:block;margin-bottom:6px}
.dimlist{margin:0}
.dimr{display:flex;justify-content:space-between;align-items:baseline;padding:11px 0;border-top:1px solid var(--line)}
.dimr dt{font-size:13.5px;color:var(--ash);letter-spacing:.02em}
.dimr dd{margin:0;font-size:14px;color:var(--ink);font-weight:500;letter-spacing:.02em;font-variant-numeric:tabular-nums}
.dim-note{font-size:11.5px;color:var(--ash);margin-top:12px;letter-spacing:.02em}
.pdp-acc{margin:26px 0 4px;border-top:1px solid var(--line)}
.acc{border-bottom:1px solid var(--line)}
.acc>summary{list-style:none;cursor:pointer;padding:15px 0;display:flex;justify-content:space-between;align-items:center;font-family:'Satoshi','Helvetica Neue',Helvetica,Arial;font-weight:500;font-size:12px;letter-spacing:.12em;text-transform:uppercase;color:var(--ink)}
.acc>summary::-webkit-details-marker{display:none}
.acc>summary::after{content:'+';font-size:17px;line-height:1;color:var(--cognac);font-weight:400;margin-left:14px}
.acc[open]>summary::after{content:'–'}
.acc .dimlist,.acc-body{padding-bottom:20px}
.acc-body{font-size:13.5px;line-height:1.75;color:var(--smoke);font-weight:300}
.acc-body>p{margin-bottom:9px}.acc-body>p:last-child{margin-bottom:0}
.acc-body b{color:var(--ink);font-weight:600}
.acc .dimlist{margin:0}
.faq-item{padding:4px 0}.faq-item+.faq-item{border-top:1px solid var(--line);margin-top:6px;padding-top:12px}
.faq-q{font-weight:600;color:var(--ink);margin-bottom:4px;letter-spacing:.01em}
/* Ask a question — gallery button */
.gwrap{position:relative}
.ask-btn{position:absolute;left:16px;bottom:16px;z-index:4;display:inline-flex;align-items:center;gap:9px;background:var(--ember);color:var(--bone);border:1px solid rgba(227,206,146,.4);border-radius:999px;padding:12px 20px 12px 16px;font-family:'Satoshi','Helvetica Neue',Helvetica,Arial;font-weight:600;font-size:11px;letter-spacing:.16em;text-transform:uppercase;cursor:pointer;box-shadow:0 8px 24px rgba(40,13,19,.4);transition:transform .18s cubic-bezier(.23,1,.32,1),background .25s}
.ask-btn .ti{font-size:16px;color:var(--champagne)}
.ask-btn:hover{background:var(--burgundy);transform:translateY(-2px)}
.ask-btn:active{transform:scale(.97)}
@media(max-width:560px){.ask-btn{left:11px;bottom:11px;padding:10px 15px 10px 13px;font-size:10px;letter-spacing:.12em}.ask-btn .ti{font-size:15px}}
/* Ask a question — modal */
.askov{position:fixed;inset:0;z-index:200;display:none;align-items:center;justify-content:center;padding:20px}
.askov.open{display:flex}
.askscrim{position:absolute;inset:0;background:rgba(20,7,10,.64);backdrop-filter:blur(3px);-webkit-backdrop-filter:blur(3px)}
.askbox{position:relative;z-index:2;width:100%;max-width:440px;background:var(--paper);border:1px solid var(--line-d);box-shadow:0 30px 80px rgba(20,7,10,.55);padding:40px 34px 30px;max-height:92vh;overflow:auto;animation:askin .32s cubic-bezier(.23,1,.32,1)}
@keyframes askin{from{opacity:0;transform:translateY(16px)}to{opacity:1;transform:none}}
@media(prefers-reduced-motion:reduce){.askbox{animation:none}}
.askx{position:absolute;top:12px;right:15px;background:none;border:none;font-size:27px;line-height:1;color:var(--ash);cursor:pointer;padding:6px;transition:color .2s}
.askx:hover{color:var(--ink)}
.ask-h{font-family:'Satoshi','Helvetica Neue',Helvetica,Arial;font-weight:500;font-size:24px;line-height:1.14;color:var(--ink);margin:9px 0 10px;letter-spacing:-.01em}
.ask-h .it{font-family:'DM Serif Display',Georgia,serif;font-style:italic;font-weight:400}
.ask-sub{font-size:13.5px;line-height:1.62;color:var(--smoke);font-weight:300;margin-bottom:22px}
#askForm input,#askForm textarea{width:100%;background:var(--paper2);border:1px solid var(--line-d);padding:13px 15px;font-family:inherit;font-size:14px;color:var(--ink);margin-bottom:11px;outline:none;transition:border-color .2s;border-radius:0}
#askForm input::placeholder,#askForm textarea::placeholder{color:var(--ash)}
#askForm input:focus,#askForm textarea:focus{border-color:var(--cognac)}
.ask-row{display:flex;gap:11px}
@media(max-width:440px){.ask-row{flex-direction:column;gap:0}}
.ask-send{width:100%;background:var(--ember);color:var(--bone);border:none;padding:15px;font-family:'Satoshi','Helvetica Neue',Helvetica,Arial;font-weight:600;font-size:12px;letter-spacing:.16em;text-transform:uppercase;cursor:pointer;margin-top:5px;transition:filter .2s,transform .12s}
.ask-send:hover{filter:brightness(1.16)}.ask-send:active{transform:scale(.99)}
.ask-note{text-align:center;font-size:12.5px;color:var(--ash);margin-top:15px}
.ask-note a{color:var(--cognac);font-weight:600}
.ask-done{display:none;text-align:center;padding:14px 0 8px}
.ask-tick{width:56px;height:56px;border-radius:50%;background:var(--cognac);color:var(--bone);display:flex;align-items:center;justify-content:center;font-size:28px;margin:0 auto 16px}
.ask-done h3{font-family:'Satoshi','Helvetica Neue',Helvetica,Arial;font-weight:500;font-size:22px;color:var(--ink);margin-bottom:8px}
.ask-done p{font-size:13.5px;color:var(--smoke);font-weight:300;line-height:1.62}
.leather{margin:4px 0 26px}
.leather-head{margin-bottom:16px}
.leather-eye{display:block;margin-bottom:12px}
.leather-selrow{display:flex;align-items:center;gap:13px}
.leather-sel{font-size:12.5px;color:var(--ink);letter-spacing:.01em;font-weight:500;line-height:1.4}
.macro{width:46px;height:46px;border-radius:50%;flex:none;border:1px solid rgba(0,0,0,.22);position:relative;overflow:hidden;box-shadow:0 3px 9px rgba(0,0,0,.2)}
.macro img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block}
.macro::after{content:'';position:absolute;inset:0;border-radius:inherit;box-shadow:inset 0 -10px 20px rgba(0,0,0,.36);pointer-events:none}
.swatches{display:grid;grid-template-columns:repeat(auto-fill,minmax(40px,1fr));gap:11px}
.swatch{width:100%;aspect-ratio:1;height:auto;position:relative;border-radius:50%;border:1px solid rgba(0,0,0,.22);background-position:center;background-size:cover;cursor:pointer;padding:0;box-shadow:inset 0 2px 5px rgba(255,255,255,.18),inset 0 -3px 7px rgba(0,0,0,.3);transition:transform .15s;touch-action:manipulation;-webkit-tap-highlight-color:transparent}
/* Expand the tappable area to ~42px so real fingers don't land in the gaps (iOS gives no click at all on a miss). Visual dot stays 30px. */
.swatch::after{content:"";position:absolute;inset:-6px;border-radius:50%}
@media(hover:hover){.swatch:hover{transform:scale(1.14)}}
.swatch.on{box-shadow:0 0 0 2px var(--paper),0 0 0 4px var(--cognac),inset 0 -3px 7px rgba(0,0,0,.28)}
.leather-sel-empty{color:var(--ash);font-weight:400;font-style:italic}
.macro-empty{opacity:.42;filter:grayscale(.5)}
.leather-warn{font-size:12.5px;color:var(--oxblood);margin:-8px 0 18px;letter-spacing:.02em}
/* Checkout-domain disclosure, directly under the Checkout button. Quiet by design: it is
   reassurance, not a warning, so it must not read as a caveat that gives anyone second thoughts. */
.handoff{display:flex;gap:8px;align-items:flex-start;margin:11px 0 2px;font-size:11.5px;line-height:1.45;color:var(--ash)}
.handoff .ti{font-size:14px;color:var(--gold-dp);flex:0 0 auto;margin-top:1px}
.handoff b{color:var(--ink);font-weight:600}
/* Injected by leatherNag() next to whichever Add was clicked. The base rule's negative top
   margin is tuned for the main PDP button; inside the small Shop-the-suite popovers it would
   pull the message under the button, so reset the box and give it its own contrast. */
/* flex-basis 100% so it takes its own line when the Add button sits in a flex row of
   actions (Shop-the-suite popovers) instead of being squeezed into a 66px column. */
.leather-nag{flex:1 0 100%;width:100%;box-sizing:border-box;margin:8px 0 0;padding:8px 10px;background:rgba(122,29,42,.10);border-left:2px solid var(--oxblood);border-radius:4px;font-size:12px;line-height:1.35;text-align:left;animation:nagin .22s ease-out}
/* Slides only — deliberately does NOT animate opacity. This message is the entire fix for a
   silently dead Add button, so its visibility must never depend on an animation completing:
   a throttled or backgrounded tab freezes keyframes at frame 0, which would leave a message
   that exists in the DOM, reports its correct size, and is invisible. */
@keyframes nagin{from{transform:translateY(-3px)}to{transform:none}}
@media(prefers-reduced-motion:reduce){.leather-nag{animation:none}}
/* Inside the fixed bottom bar the message has to sit on its own line ABOVE the row (order:-1
   plus a wrapping container), and the oxblood-on-ink default is unreadable there. */
.ov-stick{flex-wrap:wrap}
/* Floated ABOVE the fixed bar rather than laid out inside it. In-flow it wrapped onto its own
   line and took the bar from 63px to 134px — one bar that doubles in height reads as a second
   checkout bar appearing, which is not what a blocked Add should look like. Taking it out of
   flow keeps the bar at exactly one height whether the message is showing or not.
   Opaque background because it now sits over page content, not over the dark bar. The 74px
   right padding clears .rw-fab, the 62px chat launcher, which otherwise covers the last words. */
.ov-stick .leather-nag{position:absolute;left:0;right:0;bottom:100%;margin:0;border-radius:0;
  background:var(--ink);border-left:3px solid #E8A0A8;color:#F6D8DC;
  padding:10px 74px 10px 16px;box-shadow:0 -10px 22px rgba(40,13,19,.20);
  /* No slide here: any un-run frame of it leaves a few px of page showing between this strip
     and the bar, which reads as a seam. Flush in every state instead. */
  animation:none}
.swatches-nudge{animation:swnudge .5s cubic-bezier(.36,.07,.19,.97)}
@keyframes swnudge{10%,90%{transform:translateX(-2px)}30%,70%{transform:translateX(4px)}50%{transform:translateX(-6px)}}
@media(prefers-reduced-motion:reduce){.swatches-nudge{animation:none}}
.dleather{font-size:11px;color:var(--cognac);margin-top:3px;letter-spacing:.03em}
.pdp-feat{display:flex;flex-direction:column;gap:13px;margin:28px 0}
.pdp-feat div{display:flex;align-items:center;gap:12px;font-size:13.5px;color:var(--smoke);font-weight:300}
.pdp-feat .ti{color:var(--brass);font-size:18px}
.pdp-desc{font-size:14.5px;color:var(--smoke);line-height:1.8;border-top:1px solid var(--line);margin-top:30px;padding-top:26px;font-weight:300}
.pdp-desc h2,.pdp-desc h3{font-family:'Satoshi','Helvetica Neue',Helvetica,Arial;font-weight:600;font-size:15px;margin:16px 0 6px;color:var(--ink);letter-spacing:.02em}
.pdp-desc p{margin-bottom:10px}.pdp-desc ul{margin:8px 0 12px 20px}

.scrim{position:fixed;inset:0;background:rgba(23,17,9,.55);opacity:0;visibility:hidden;transition:.25s;z-index:40}
.scrim.open{opacity:1;visibility:visible}
.setsec{padding:72px 0 88px;border-top:1px solid var(--line);margin-top:64px}
.setsec .pgrid{max-width:900px;margin:0 auto}
.setsec .pgrid.cols3{grid-template-columns:repeat(3,1fr)}
.setsec .pgrid:not(.cols3){grid-template-columns:repeat(2,1fr);max-width:640px}
.shopfamsec{padding:72px 0 88px;border-top:1px solid var(--line);margin-top:56px}
.shopfam{position:relative;max-width:1060px;margin:0 auto;border-radius:6px;overflow:hidden;line-height:0;box-shadow:0 20px 60px rgba(40,13,19,.14)}
.shopfam-img{width:100%;display:block}
.fam-dot{position:absolute;transform:translate(-50%,-50%);z-index:2}
.fam-pin{width:32px;height:32px;border-radius:999px;border:none;background:rgba(244,236,219,.94);cursor:pointer;display:flex;align-items:center;justify-content:center;box-shadow:0 2px 12px rgba(0,0,0,.4);position:relative;padding:0}
.fam-pin span{width:9px;height:9px;border-radius:999px;background:var(--burgundy);display:block}
.fam-pin::after{content:'';position:absolute;inset:-5px;border-radius:999px;border:2px solid rgba(244,236,219,.55);animation:fampulse 2.2s infinite}
.fam-here .fam-pin{background:var(--burgundy)}
.fam-here .fam-pin span{background:var(--ivory)}
@keyframes fampulse{0%{transform:scale(.85);opacity:.75}70%{transform:scale(1.6);opacity:0}100%{opacity:0}}
.fam-pop{position:absolute;bottom:calc(100% + 13px);left:50%;transform:translateX(-50%) translateY(6px);width:236px;background:var(--paper);border-radius:6px;box-shadow:0 16px 44px rgba(40,13,19,.32);padding:12px;display:flex;gap:11px;opacity:0;visibility:hidden;transition:.2s;pointer-events:none;z-index:5}
.fam-pop::after{content:'';position:absolute;top:100%;left:50%;transform:translateX(-50%);border:7px solid transparent;border-top-color:var(--paper)}
.fam-dot:hover .fam-pop,.fam-dot.open .fam-pop{opacity:1;visibility:visible;transform:translateX(-50%) translateY(0);pointer-events:auto}
.fam-pop-thumb{flex:0 0 64px;line-height:0}
.fam-pop-thumb img{width:64px;height:58px;object-fit:cover;background:#efe9df;border-radius:3px;display:block}
.fam-pop-info{flex:1;min-width:0;line-height:1.3}
.fam-pop-name{display:block;font-size:12px;font-weight:600;color:var(--ink);text-decoration:none;margin-bottom:3px}
.fam-pop-price{font-size:11.5px;color:var(--cognac);font-weight:600}
.fam-pop-price em{color:var(--ash);font-style:italic;font-weight:400}
.fam-pop-actions{display:flex;flex-wrap:wrap;gap:10px;margin-top:9px;align-items:center}
.fam-pop-view{font-size:10px;letter-spacing:.1em;text-transform:uppercase;color:var(--ink);text-decoration:none;border-bottom:1px solid var(--cognac);padding-bottom:1px}
.fam-pop-add{font-size:10px;letter-spacing:.1em;text-transform:uppercase;font-weight:700;background:var(--burgundy);color:var(--ivory);border:none;padding:7px 13px;border-radius:3px;cursor:pointer;transition:.2s}
.fam-pop-add:hover{background:var(--ink)}
.setmini{margin-top:24px;border-top:1px solid var(--line);padding-top:20px}
.smini-head{font-size:12.5px;color:var(--ink);font-weight:300;margin-bottom:14px;display:flex;align-items:center;gap:10px;line-height:1.4}
.smini-head b{font-weight:600}
.smini-badge{flex:0 0 auto;background:var(--burgundy);color:var(--ivory);font-size:10px;font-weight:800;letter-spacing:.05em;padding:5px 9px;border-radius:3px}
.smini-row{display:grid;gap:12px}
.smini-card{position:relative;background:#fff;border:1px solid var(--line);border-radius:4px;overflow:hidden}
.smini-thumb{display:block;aspect-ratio:4/3;background:#efe9df}
.smini-thumb img{width:100%;height:100%;object-fit:cover;display:block}
.smini-add{position:absolute;top:8px;right:8px;width:30px;height:30px;border-radius:999px;border:none;background:var(--burgundy);color:var(--ivory);font-size:19px;line-height:1;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:.2s;box-shadow:0 2px 8px rgba(40,13,19,.28)}
.smini-add:hover{background:var(--ink)}
.smini-info{padding:9px 11px 11px}
.smini-name{display:block;font-size:12px;color:var(--ink);font-weight:500;text-decoration:none;line-height:1.25;margin-bottom:3px}
.smini-name:hover{color:var(--cognac)}
.smini-price{font-size:12px;color:var(--cognac);font-weight:600}
.setbanner{max-width:820px;margin:0 auto 34px;display:flex;align-items:center;gap:16px;background:var(--bone);border:1px solid var(--champagne);border-radius:4px;padding:15px 20px}
.setbanner-badge{flex:0 0 auto;background:var(--burgundy);color:var(--ivory);font-size:12px;font-weight:800;letter-spacing:.06em;padding:7px 12px;border-radius:3px}
.setbanner-txt{font-size:14px;color:var(--ink);font-weight:300;line-height:1.45}
.setbanner-txt b{font-weight:600}
.set-card .card-img{position:relative}
.card-save{position:absolute;top:10px;left:10px;background:var(--burgundy);color:var(--ivory);font-size:10px;font-weight:800;letter-spacing:.06em;padding:5px 9px;border-radius:3px}
.price-set{display:flex;align-items:center;gap:8px;flex-wrap:wrap;justify-content:flex-end}
.price-set s{color:var(--ash);font-weight:400}
.price-set b{color:var(--burgundy);font-weight:700}
.save-tag{background:var(--burgundy);color:var(--ivory);font-size:11px;font-weight:700;padding:3px 8px;border-radius:3px;letter-spacing:.02em}
.set-add{width:100%;margin-top:12px;padding:11px 0;background:none;border:1px solid var(--ink);color:var(--ink);font-size:11px;letter-spacing:.14em;text-transform:uppercase;font-weight:600;cursor:pointer;transition:all .2s}
.set-add:hover{background:var(--ink);color:var(--paper)}
.dupsell{border-top:1px solid var(--line);margin-top:18px;padding:16px 0 4px}
.du-head{font-size:10px;letter-spacing:.16em;text-transform:uppercase;color:var(--cognac);font-weight:700;margin-bottom:10px}
.du-head b{color:var(--ink)}
.du-unlock{display:flex;align-items:center;gap:6px;color:var(--burgundy)}
.du-unlock i{font-size:14px}
.du-hint{color:var(--burgundy);font-size:10px;font-weight:600;letter-spacing:.02em}
.setprog{margin:2px 0 14px;padding:13px 15px;background:var(--bone);border:1px solid var(--champagne);border-radius:4px}
.setprog-on{background:#f3ece0}
.setprog-msg{font-size:12.5px;color:var(--ink);font-weight:300;margin-bottom:9px;display:flex;align-items:center;gap:6px;line-height:1.35}
.setprog-msg b{font-weight:700;color:var(--burgundy)}
.setprog-msg i{color:var(--burgundy);font-size:15px}
.setprog-bar{height:6px;background:#e4d6bf;border-radius:99px;overflow:hidden}
.setprog-bar span{display:block;height:100%;background:var(--burgundy);border-radius:99px;transition:width .4s ease}
.du-price{display:inline-flex;align-items:center;gap:6px;flex-wrap:wrap}
.du-was{color:var(--ash);text-decoration:line-through;font-size:12px}
.du-now{color:var(--burgundy);font-weight:700;font-size:12px}
.du-save{background:var(--burgundy);color:var(--ivory);font-size:10px;font-weight:700;padding:2px 7px;border-radius:3px}
.du-item{display:flex;align-items:center;gap:12px;padding:8px 0}
.du-item img{width:56px;height:44px;object-fit:cover;background:#efe9df}
.du-t{flex:1;min-width:0}
.du-t a{display:block;font-size:12px;font-weight:500;color:var(--ink);text-decoration:none;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.du-t span{font-size:12px;color:var(--ash)}
.du-add{padding:7px 14px;background:none;border:1px solid var(--ink);color:var(--ink);font-size:10px;letter-spacing:.12em;text-transform:uppercase;font-weight:600;cursor:pointer;transition:all .2s}
.du-add:hover{background:var(--ink);color:var(--paper)}
.du-note{font-size:10px;color:var(--ash);font-weight:300;margin-top:8px}
.drawer{position:fixed;top:0;right:0;height:100%;width:430px;max-width:92vw;background:var(--paper);z-index:50;transform:translateX(100%);transition:transform .3s ease;display:flex;flex-direction:column;box-shadow:-12px 0 44px rgba(0,0,0,.2)}
.drawer.open{transform:translateX(0)}
.drawer-head{display:flex;align-items:center;justify-content:space-between;padding:26px 28px;border-bottom:1px solid var(--line)}
.drawer-head h3{font-family:'DM Serif Display',Georgia,serif;font-style:italic;font-size:30px;color:var(--ink);letter-spacing:-.022em;display:inline-block;transform:scaleX(.94);transform-origin:left center;-webkit-text-stroke:.4px currentColor;paint-order:stroke fill}
.drawer-head button{background:none;border:none;font-size:22px;cursor:pointer;color:var(--ink);display:inline-flex}
.drawer-items{flex:1;overflow-y:auto;padding:8px 28px}
.drawer-empty{text-align:center;color:var(--ash);padding:60px 0;font-weight:300}
.undo-bar{display:flex;align-items:center;justify-content:space-between;gap:12px;margin:10px 0 4px;padding:10px 12px;background:rgba(156,126,55,.10);border:1px solid rgba(156,126,55,.30);border-radius:6px;font-size:12.5px;color:var(--ash)}
.undo-bar b{color:var(--ink);font-weight:600}
.undo-bar button{flex:0 0 auto;background:transparent;border:1px solid var(--cognac);color:var(--cognac);padding:6px 13px;border-radius:4px;font-family:inherit;font-size:10.5px;letter-spacing:.09em;text-transform:uppercase;cursor:pointer;transition:.2s}
.undo-bar button:hover{background:var(--cognac);color:var(--bone)}
.ditem{display:grid;grid-template-columns:66px 1fr auto;gap:14px;padding:18px 0;border-bottom:1px solid var(--line)}
.ditem img{width:66px;height:66px;object-fit:contain;background:var(--bone);padding:4px}
.ditem .t{font-weight:400;font-size:12.5px;line-height:1.4;color:var(--ink)}
.ditem .qty{display:inline-flex;align-items:center;gap:10px;margin-top:8px;font-size:13px}
.ditem .qty button{width:23px;height:23px;border:1px solid var(--line);background:transparent;cursor:pointer;font-size:14px;line-height:1}
.ditem .pr{font-weight:500;font-size:13px;text-align:right;color:var(--cognac)}
.ditem .rm{display:block;margin-top:8px;background:none;border:none;color:var(--ash);font-size:10px;cursor:pointer;text-decoration:underline;text-transform:uppercase;letter-spacing:.08em}
.drawer-foot{border-top:1px solid var(--line);padding:24px 28px}
.drawer-foot .row{display:flex;justify-content:space-between;font-weight:500;font-size:15px;margin-bottom:6px;color:var(--ink)}
.drawer-foot .note{font-size:11px;color:var(--ash);margin-bottom:16px;display:flex;align-items:center;gap:6px;font-weight:300}
.drawer-foot .set-saving-row{color:var(--burgundy);font-weight:600}
.drawer-foot .set-saving-row span:first-child{display:inline-flex;align-items:center;gap:5px}
.drawer-foot .row-total{font-size:17px;font-weight:700;padding-top:8px;margin-top:4px;border-top:1px solid var(--line)}
.pr-disc{display:flex;flex-direction:column;align-items:flex-end;line-height:1.3;gap:2px}
.pr-disc s{color:var(--ash);font-weight:400;font-size:12px}
.pr-disc .pr-now{color:var(--burgundy);font-weight:700}
.savebox{display:inline-block;margin-top:3px;background:var(--burgundy);color:var(--ivory);font-size:10px;font-weight:700;letter-spacing:.04em;padding:3px 8px;border-radius:3px;white-space:nowrap}
.pr-part{display:block;font-size:10px;color:var(--burgundy);font-weight:600}

/* Swatch order row */
.swatch-order{display:flex;justify-content:space-between;align-items:center;gap:14px;margin-top:16px;padding-top:14px;border-top:1px solid rgba(156,126,55,.3);flex-wrap:wrap}
.swatch-order span{font-size:12.5px;color:var(--ash)}
.swatch-order button{background:transparent;border:1px solid var(--cognac);color:var(--cognac);padding:9px 14px;font-size:10.5px;letter-spacing:.1em;text-transform:uppercase;cursor:pointer;font-family:inherit;white-space:nowrap;transition:.25s}
.swatch-order button:hover{background:var(--cognac);color:var(--bone)}
@media(max-width:600px){
 .swatches{gap:12px}
 .swatch-order{flex-direction:column;align-items:stretch;gap:11px}
 .swatch-order span{font-size:12px}
 .swatch-order button{width:100%;text-align:center;padding:13px 12px;white-space:normal;letter-spacing:.09em}
 .pdp-saveline{letter-spacing:.08em;font-size:10px}
}

/* PDP delivery quote */
.dq{margin-top:28px;border:1px solid rgba(156,126,55,.35);border-radius:14px;padding:22px 22px 20px;background:var(--ivory2, #EFE4CE)}
.dq-head{display:flex;justify-content:space-between;align-items:baseline;gap:12px;margin-bottom:14px;flex-wrap:wrap}
.dq-lead{font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:var(--ash)}
.dq-row{display:flex;gap:8px}
.dq-row input{flex:1;background:transparent;border:1px solid rgba(156,126,55,.45);border-radius:9px;padding:12px 14px;font-size:14px;font-family:inherit;color:var(--ink);outline:none;min-width:0}
.dq-row input:focus{border-color:var(--cognac)}
.dq-row button,.dq-quote button{background:var(--cognac);color:var(--bone);border:none;border-radius:9px;padding:12px 18px;font-size:11px;letter-spacing:.16em;text-transform:uppercase;cursor:pointer;font-family:inherit;white-space:nowrap;transition:.25s}
.dq-row button:hover,.dq-quote button:hover{filter:brightness(1.12)}
.dq-res{margin-top:14px}
.dq-res .r{display:flex;justify-content:space-between;padding:9px 0;border-top:1px solid rgba(156,126,55,.3);font-size:13.5px;color:var(--ink)}
.dq-res .r b{color:var(--cognac)}
.dq-res .err{font-size:13px;color:var(--ash);padding-top:10px}
.dq-quote{display:flex;gap:8px;margin-top:14px}
.dq-quote input{flex:1;background:transparent;border:1px solid rgba(156,126,55,.45);padding:12px 14px;font-size:14px;font-family:inherit;color:var(--ink);outline:none;min-width:0}
.dq-quote input:focus{border-color:var(--cognac)}
.dq-note{font-size:12px;color:var(--ash);margin-top:8px}
/* The two facts a buyer wants before typing a postcode: when it is built by, and whether it is
   covered on the way. Same line-icon weight as the rest of the column. */
.dq-facts{list-style:none;margin:14px 0 0;padding:0;display:flex;flex-direction:column;gap:8px}
.dq-facts li{display:flex;align-items:flex-start;gap:9px;flex-wrap:nowrap;font-size:12.5px;color:var(--ash);line-height:1.45}
.dq-facts li b{color:var(--ink);font-weight:600}
.dq-ic{width:15px;height:15px;stroke-width:1.4;flex:none;margin-top:1px;color:var(--cognac)}
.dq-ic *{vector-effect:non-scaling-stroke}
.dq-done{font-size:14px;color:var(--cognac);margin-top:12px}
@media(max-width:560px){.dq-row,.dq-quote{flex-direction:column}}


/* Quiz band. The room tiles are the interactive element, so they get the hover affordance and
   the section gets breathing room rather than competing with the product grid above it. */
.quizband{background:var(--ivory2);padding:82px 0}
.quizband-head{text-align:center;max-width:780px;margin:0 auto 40px}
.quizband-head h2{font-family:'Satoshi','Helvetica Neue',Helvetica,Arial;font-weight:500;font-size:38px;letter-spacing:-.015em;color:var(--bordeaux);margin:14px 0 14px}
.quizband-head h2 .ds{color:var(--burgundy)}
.quizband-head p{color:var(--smoke);font-size:15.5px;font-weight:300;line-height:1.65;margin:0}
.quizrooms{display:grid;grid-template-columns:repeat(6,1fr);gap:14px}
.quizroom{position:relative;display:block;overflow:hidden;border-radius:14px;aspect-ratio:3/4;
box-shadow:0 14px 34px rgba(40,13,19,.18);transition:transform .3s cubic-bezier(.23,1,.32,1),box-shadow .3s}
.quizroom img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .5s cubic-bezier(.23,1,.32,1)}
.quizroom:after{content:'';position:absolute;inset:0;background:linear-gradient(0deg,rgba(40,13,19,.72),rgba(40,13,19,.05) 55%)}
.quizroom-name{position:absolute;z-index:1;left:12px;right:12px;bottom:12px;color:var(--ivory);
font-size:11px;letter-spacing:.14em;text-transform:uppercase;font-weight:600;text-align:center}
@media(hover:hover){.quizroom:hover{transform:translateY(-4px);box-shadow:0 22px 46px rgba(40,13,19,.3)}
.quizroom:hover img{transform:scale(1.07)}}
.quizroom:active{transform:scale(.985)}
.quizband-foot{margin-top:26px;text-align:center;font-size:13.5px;color:var(--smoke)}
.quizband-foot a{color:var(--burgundy);font-weight:600;border-bottom:1px solid var(--gold);padding-bottom:2px;margin-left:8px}
@media(max-width:980px){.quizrooms{grid-template-columns:repeat(3,1fr);gap:11px}.quizband-head h2{font-size:30px}}
@media(max-width:560px){.quizband{padding:56px 0}.quizrooms{grid-template-columns:repeat(2,1fr);gap:10px}
.quizband-head{margin-bottom:30px}.quizroom-name{font-size:10px;letter-spacing:.1em}}

/* Catalogue and swatch-library lead magnets share one treatment, so the second form cannot
   quietly drift from the first as the site evolves. */
.catmag,.swmag{background:var(--ember);padding:88px 0}
.catmag-in,.swmag-in{display:grid;grid-template-columns:300px 1fr;gap:64px;align-items:center}
.catmag-cover,.swmag-cover,.mag-jump{cursor:pointer;-webkit-tap-highlight-color:transparent}
.catmag-cover:active img,.swmag-cover:active img{transform:scale(.985)}
.catmag-cover img,.swmag-cover img{width:100%;display:block;box-shadow:0 24px 60px rgba(0,0,0,.5);border:1px solid rgba(195,162,78,.35);transition:transform .15s}
.catmag-copy .eyebrow,.swmag-copy .eyebrow{color:var(--champagne)}
.catmag-copy h2,.swmag-copy h2{font-family:'Satoshi','Helvetica Neue',Helvetica,Arial;font-weight:500;font-size:38px;letter-spacing:-.015em;color:var(--bone);margin:14px 0 16px}
.catmag-copy h2 .ds,.swmag-copy h2 .ds{color:var(--champagne)}
.catmag-copy p,.swmag-copy p{color:#c9bda9;font-size:15.5px;font-weight:300;max-width:480px;line-height:1.65}
.catmag-form,.swmag-form{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin:26px 0 14px;max-width:520px}
.catmag-form input,.swmag-form input{min-width:0;background:transparent;border:1px solid rgba(195,162,78,.45);color:var(--bone);padding:15px 18px;font-size:14.5px;font-family:inherit;outline:none}
.catmag-form input[name=cat_name],.catmag-form button,.swmag-form input[name=sw_name],.swmag-form button{grid-column:1/-1}
.catmag-form input::placeholder,.swmag-form input::placeholder{color:#8a7d6a}
.catmag-form input:focus,.swmag-form input:focus{border-color:var(--gold)}
.btn-cat{background:var(--cognac);color:var(--bone);border:1px solid var(--gold);padding:15px 26px;font-size:12px;letter-spacing:.18em;text-transform:uppercase;cursor:pointer;font-family:inherit;white-space:nowrap;transition:.25s}
.btn-cat:hover{filter:brightness(1.12)}
.catmag-note,.swmag-note{font-size:12.5px;color:#8a7d6a}
.catmag-done,.swmag-done{color:var(--champagne);font-size:15px;margin-top:10px}
@media(max-width:980px){.catmag,.swmag{padding:64px 0}.catmag-in,.swmag-in{grid-template-columns:1fr;gap:36px}.catmag-cover,.swmag-cover{max-width:230px;margin:0 auto}.catmag-copy,.swmag-copy{text-align:center}.catmag-copy p,.swmag-copy p{margin:0 auto}.catmag-form,.swmag-form{grid-template-columns:1fr;max-width:100%}.catmag-copy h2,.swmag-copy h2{font-size:30px}}
footer{background:var(--ember);color:#c9bda9;padding:80px 0 38px}
.fgrid{display:grid;grid-template-columns:1.5fr 1fr 1fr 1fr;gap:46px;padding-bottom:50px;border-bottom:1px solid var(--line-d)}
.footmark{font-family:'DM Serif Display',Georgia,serif;font-style:italic;font-size:52px;color:var(--bone);line-height:.8;letter-spacing:-.028em;display:inline-block;transform:scaleX(.92);transform-origin:left center;-webkit-text-stroke:.6px currentColor;paint-order:stroke fill}
.foottag{font-family:'Satoshi','Helvetica Neue',Helvetica,Arial;font-weight:600;font-size:8.5px;letter-spacing:.3em;text-transform:uppercase;color:var(--brass);margin:8px 0 16px}
footer p.blurb{color:#9a8e7c;max-width:300px;font-size:13.5px;font-weight:300}
footer h5{font-family:'Satoshi','Helvetica Neue',Helvetica,Arial;font-weight:600;font-size:11px;letter-spacing:.2em;text-transform:uppercase;color:var(--brass);margin-bottom:18px}
footer ul{list-style:none}footer li{margin-bottom:11px;color:#b6ab98;font-size:13.5px;font-weight:300}footer li a:hover{color:var(--bone)}
.amahc{display:flex;justify-content:center;padding:40px 0 6px}
.amahc a{display:flex;flex-direction:row;align-items:center;gap:18px;text-decoration:none;opacity:.8;transition:.25s}
.amahc a:hover{opacity:1}
.amahc img{height:38px;width:auto}
.amahc-tag{font-family:'Satoshi','Helvetica Neue',Helvetica,Arial;font-weight:400;font-size:12px;letter-spacing:.28em;text-transform:uppercase;color:var(--champagne);border-left:1px solid rgba(227,206,146,.35);padding-left:18px;line-height:1}
.fbot{display:flex;justify-content:space-between;align-items:center;padding-top:28px;color:#7d7263;font-family:'Satoshi','Helvetica Neue',Helvetica,Arial;font-size:10.5px;letter-spacing:.12em;text-transform:uppercase;flex-wrap:wrap;gap:10px}
@media(max-width:980px){.fbot{justify-content:center;text-align:center}.amahc a{flex-direction:column;gap:12px}.amahc img{height:34px}.amahc-tag{font-size:10px;letter-spacing:.26em;border-left:none;padding-left:0;text-align:center;white-space:nowrap}}
.fbot b{color:var(--brass);font-weight:600}

.searchov{position:fixed;inset:0;z-index:60;background:rgba(23,17,9,.55);opacity:0;visibility:hidden;transition:.2s}
.searchov.open{opacity:1;visibility:visible}
.searchbox{position:absolute;top:0;left:0;right:0;background:var(--paper);padding:32px 0 42px;max-height:88vh;overflow-y:auto;box-shadow:0 24px 60px rgba(0,0,0,.25)}
.srow{display:flex;align-items:center;gap:14px;border-bottom:1px solid var(--cognac);padding-bottom:8px}
.srow input{flex:1;border:none;background:transparent;font-family:'DM Serif Display',Georgia,serif;font-size:34px;color:var(--ink);outline:none}
.srow input::placeholder{color:var(--ash)}
.searchclose{background:none;border:none;font-size:24px;cursor:pointer;color:var(--ink);display:inline-flex}
.shint{color:var(--ash);font-size:11px;margin-top:18px;letter-spacing:.14em;text-transform:uppercase}
.sresults{display:grid;grid-template-columns:repeat(4,1fr);gap:26px;margin-top:24px}
.sresult .im{aspect-ratio:4/3;background:var(--bone);overflow:hidden}
.sresult img{width:100%;height:100%;object-fit:cover;transition:.3s}
.sresult:hover img{transform:scale(1.05)}
.sresult .nm{font-size:12.5px;margin-top:10px;color:var(--ink);font-weight:400;line-height:1.4;text-align:center}
.sresult .pr{font-size:12.5px;color:var(--cognac);margin-top:3px;text-align:center}
@media(max-width:980px){
 nav.main{display:none}
 .wrap{padding:0 18px}
 .topbar .wrap{justify-content:center}
 .topbar span:first-child{display:none}
 .sec{padding:52px 0}
 .sec-head{margin-bottom:30px}
 .uspbar .wrap{padding:0;max-width:none}
 .usp-marquee{overflow:hidden;display:flex}
 .usp-track{display:flex;flex:0 0 auto;align-items:center;gap:44px;padding:15px 22px 15px 22px;animation:uspmq 26s linear infinite}
 .uspbar span{font-size:10px;letter-spacing:.12em;white-space:nowrap}
 .uspbar .ti{font-size:15px}
 .pgrid,.pgrid.cols3{gap:44px}
 .card-body{padding:13px 2px 6px}
 .card h3{font-size:15.5px;min-height:auto}
 .card .price{font-size:15px}
 .card .atc{margin-top:8px}
 .hero{min-height:88vh;align-items:flex-end}
 .hero-slide{background-position:center 22%}
 .hero-slide.s1{background-image:url('/img/scenes/hero-1-m.jpg')!important}
 .hero-slide.s2{background-image:url('/img/scenes/hero-2-m.jpg')!important}
 .hero-slide.s3{background-image:url('/img/scenes/hero-ottomans-m.jpg')!important}
 .hero::after{background:linear-gradient(0deg,rgba(20,7,10,.94) 0%,rgba(20,7,10,.6) 42%,rgba(20,7,10,.15) 72%,rgba(20,7,10,0) 100%)}
 .hero::after{background:linear-gradient(to top,rgba(20,7,10,.95) 0%,rgba(20,7,10,.6) 30%,rgba(20,7,10,.1) 62%,rgba(20,7,10,.25) 100%)}
 .hero-inner{padding:0 24px 9vh}
 .hero-copy{max-width:none}
 .hero .eyebrow{display:none}
 .hero .script-hero{font-size:44px;line-height:1.04}
 .hero .sub{font-size:15px;max-width:none;margin:16px 0 26px}
 .hero-saves{height:32px;margin:18px 0 2px}
 .hero-saves .hs{font-size:18px;gap:7px}
 .hero-saves .hs b{font-size:24px}
 .hero-cta{gap:14px}
 .hero-cta .btn-hero{width:100%}
 .hero-note{display:none}
 .page-head h1{font-size:34px}
 /* Mobile: a horizontal snap carousel, not a 2-up grid. Five tiles stacked into three
    rows added ~two viewports of height before the craft film; as a one-row scroller the
    film clears the fold much sooner. Tiles are sized to peek the next one so the strip
    visibly reads as scrollable. */
 .cat-row{display:flex;grid-template-columns:none;gap:12px;overflow-x:auto;scroll-snap-type:x mandatory;
  -webkit-overflow-scrolling:touch;scrollbar-width:none;padding:0 16px 2px;scroll-padding:0 16px;max-width:none;margin:28px 0 0}
 .lfilm{margin-top:28px}
 .cat-row::-webkit-scrollbar{display:none}
 .cat-row .ctile{flex:0 0 clamp(180px,62vw,300px);width:auto;scroll-snap-align:start;aspect-ratio:4/5}
 .feature{grid-template-columns:1fr}.feature.flip .feature-img{order:0}.feature-copy{padding:56px 36px}.feature-img{min-height:340px}
 .pgrid,.pgrid.cols3{grid-template-columns:1fr}.sresults{grid-template-columns:repeat(2,1fr)}
 .pdp{grid-template-columns:1fr;gap:30px;grid-template-areas:'gallery' 'buy' 'details'}.pdp-info{position:static}.pdp-details{padding-top:26px}
 .fgrid{grid-template-columns:1fr 1fr}
 .sec-head h2,.feature-copy h2{font-size:30px}
}

/* Specialist enquiry (Powerful Form Builder → Salesforce) */
.pfb{background:var(--bordeaux);border-top:1px solid rgba(195,162,78,.35);padding:84px 0}
.pfb .wrap{max-width:680px}
.pfb h2{font-family:'Satoshi','Helvetica Neue',Helvetica,Arial;font-weight:500;font-size:34px;letter-spacing:-.015em;color:var(--ivory);text-align:center;line-height:1.1}
.pfb h2 .it{color:var(--champagne)}
.pfb .pfb-sub{color:#d8c9b4;font-size:14.5px;font-weight:300;text-align:center;max-width:52ch;margin:14px auto 34px;line-height:1.65}
.pfb form{display:grid;gap:12px}
.pfb input,.pfb textarea{width:100%;background:rgba(244,236,219,.05);border:1px solid rgba(195,162,78,.4);color:var(--ivory);font-family:'Satoshi','Helvetica Neue',Helvetica,Arial;font-size:14px;padding:14px 16px;border-radius:8px;outline:none;transition:border-color .25s}
.pfb input::placeholder,.pfb textarea::placeholder{color:#a8937b}
.pfb input:focus,.pfb textarea:focus{border-color:var(--gold)}
.pfb .pfb-row{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.pfb button{margin-top:6px;background:var(--burgundy);border:1px solid var(--gold);color:var(--ivory);font-family:'Satoshi','Helvetica Neue',Helvetica,Arial;font-weight:600;font-size:12px;letter-spacing:.14em;text-transform:uppercase;padding:16px 32px;border-radius:999px;cursor:pointer;transition:.25s}
.pfb button:active{transform:scale(.97)}
@media(hover:hover) and (pointer:fine){.pfb button:hover{background:#6d2232}}
.pfb .pfb-done{display:none;text-align:center;color:var(--ivory)}
.pfb .pfb-done h3{font-family:'DM Serif Display',Georgia,serif;font-style:italic;font-weight:400;font-size:26px;color:var(--champagne);letter-spacing:-.022em;margin-bottom:10px}
.pfb .pfb-done p{color:#d8c9b4;font-size:14px;font-weight:300;max-width:46ch;margin:0 auto}
.pfb .pfb-note{color:#a8937b;font-size:11px;text-align:center;margin-top:14px;font-weight:300}
@media(max-width:640px){.pfb{padding:60px 0}.pfb h2{font-size:27px}.pfb .pfb-row{grid-template-columns:1fr}}

/* Floating "talk to a specialist" rep widget */
/* The .rw container is a fixed flex column that still reserves the collapsed card's
   full 320x408 box. With pointer-events:auto it silently swallowed every tap beneath
   it (killed the collection tiles on mobile). Container is now transparent to touch;
   only the FAB, the tease bubble and the OPEN card accept input. */
.rw{position:fixed;right:22px;bottom:22px;z-index:60;display:flex;flex-direction:column;align-items:flex-end;gap:12px;pointer-events:none}
.rw-card{width:334px;max-width:calc(100vw - 32px);background:var(--ivory);color:var(--bordeaux);border-radius:18px;border:1px solid var(--gold);box-shadow:0 26px 60px -10px rgba(20,6,10,.55),0 2px 8px rgba(0,0,0,.28);padding:16px;position:relative;opacity:0;transform:translateY(14px) scale(.96);pointer-events:none;transition:opacity .5s cubic-bezier(.23,1,.32,1),transform .5s cubic-bezier(.23,1,.32,1)}
.rw.open .rw-card{opacity:1;transform:none;pointer-events:auto}
.rw-x{position:absolute;top:9px;right:12px;background:none;border:none;font-size:19px;color:var(--taupe);cursor:pointer;line-height:1}
.rw-x:hover{color:var(--burgundy)}
.rw-head{display:flex;gap:12px;align-items:center;margin-bottom:12px;cursor:pointer}
.rw-ph{width:50px;height:50px;border-radius:50%;background:var(--bordeaux);color:var(--champagne);display:flex;align-items:center;justify-content:center;font-family:'DM Serif Display',Georgia,serif;font-style:italic;font-size:21px;border:2px solid var(--gold);overflow:hidden;position:relative;flex:0 0 auto}
.rw-ph img{width:100%;height:100%;object-fit:cover}
.rw-dot{position:absolute;right:-1px;bottom:1px;width:12px;height:12px;border-radius:50%;background:#7d8a5a;border:2.5px solid var(--ivory)}
.rw-name{font-size:15.5px;font-weight:500;letter-spacing:-.01em}
.rw-name .it{font-family:'DM Serif Display',Georgia,serif;font-style:italic;color:var(--burgundy)}
.rw-status{font-size:11px;color:var(--taupe);margin-top:2px;display:flex;align-items:center;gap:6px}
.rw-status i{width:7px;height:7px;border-radius:50%;background:#7d8a5a}
.rw-panel{display:none}
.rw-card[data-s="greet"] .rw-p-greet,.rw-card[data-s="form"] .rw-p-form,.rw-card[data-s="done"] .rw-p-done{display:block}
.rw-msg{font-size:13.5px;line-height:1.55;color:#3f2a30;font-weight:300;background:var(--bone);border-radius:12px;padding:12px 14px;margin-bottom:14px}
.rw-call{display:flex;align-items:center;justify-content:center;gap:9px;background:var(--burgundy);color:var(--ivory);border:1px solid var(--gold);border-radius:999px;padding:13px 18px;font-size:13px;font-weight:600;letter-spacing:.06em;text-decoration:none;transition:.2s;cursor:pointer}
.rw-call:hover{background:#6d2232}
.rw-call svg{width:16px;height:16px;fill:var(--champagne)}
.rw-enq{display:block;width:100%;text-align:center;font-size:12px;letter-spacing:.1em;text-transform:uppercase;color:var(--cognac);font-weight:600;padding:9px 6px 2px;background:none;border:none;cursor:pointer;font-family:inherit}
.rw-enq:hover{color:var(--burgundy)}
.rw-hint{font-size:12.5px;color:#3f2a30;font-weight:300;margin-bottom:10px;line-height:1.5}
.rw-f{width:100%;border:1px solid rgba(156,126,55,.5);background:#fff;border-radius:9px;padding:11px 13px;font-family:inherit;font-size:13px;color:var(--bordeaux);margin-bottom:8px;outline:none}
.rw-f:focus{border-color:var(--gold)}
.rw-f::placeholder{color:#b09a86}
textarea.rw-f{resize:none;min-height:50px}
.rw-sub{width:100%;background:var(--burgundy);color:var(--ivory);border:1px solid var(--gold);border-radius:999px;padding:13px;font-size:13px;font-weight:600;letter-spacing:.06em;cursor:pointer;font-family:inherit;transition:.2s}
.rw-sub:hover{background:#6d2232}
.rw-back{display:block;width:100%;text-align:center;font-size:11px;letter-spacing:.1em;text-transform:uppercase;color:var(--taupe);background:none;border:none;cursor:pointer;font-family:inherit;margin-top:8px}
.rw-back:hover{color:var(--burgundy)}
/* AI live chat panel */
.rw-card[data-s="chat"] .rw-p-chat{display:flex;flex-direction:column}
.rw-thread{max-height:min(46vh,340px);min-height:170px;overflow-y:auto;display:flex;flex-direction:column;gap:8px;margin-bottom:10px;overscroll-behavior:contain}
/* Sit the conversation at the BOTTOM of the panel, the way every messaging app does, so a
   single opening line does not leave a 110px void between it and the tap options. Done with
   margin-top:auto on the first bubble rather than justify-content:flex-end, because flex-end
   with overflow-y:auto clips the top of a scrolled thread in WebKit. */
.rw-thread > :first-child{margin-top:auto}
.rw-b{max-width:88%;padding:10px 13px;border-radius:13px;font-size:13.5px;line-height:1.5;font-weight:300;overflow-wrap:break-word}
.rw-b-a{align-self:flex-start;background:var(--bone);color:#3f2a30;border-bottom-left-radius:4px}
.rw-b-u{align-self:flex-end;background:var(--burgundy);color:var(--ivory);border-bottom-right-radius:4px}
.rw-b-a a{color:var(--cognac-dp);text-decoration:underline;font-weight:500}
.rw-b-a b{font-weight:500}
.rw-sys{align-self:center;text-align:center;max-width:88%;margin:2px 0 4px;font-size:11.5px;color:var(--taupe);letter-spacing:.02em}
.rw-sys-t{display:block;margin-bottom:6px}
.rw-sys-t b{color:var(--bordeaux);font-weight:600}
.rw-bar{display:block;height:3px;width:150px;margin:0 auto;border-radius:2px;background:rgba(138,119,102,.22);overflow:hidden}
.rw-bar i{display:block;height:100%;width:38%;border-radius:2px;background:var(--gold);animation:rwbar 1.05s cubic-bezier(.45,0,.55,1) infinite}
@keyframes rwbar{0%{transform:translateX(-115%)}100%{transform:translateX(285%)}}
@media(prefers-reduced-motion:reduce){.rw-bar i{animation:none;width:100%;opacity:.5}}
.rw-chips{display:flex;flex-wrap:wrap;gap:7px;margin-bottom:10px}
.rw-chip-yes{background:var(--cognac,#8a5a3c);color:#fff;border-color:transparent;font-weight:600}
.rw-chip{border:1px solid var(--gold);background:var(--bone);border-radius:999px;padding:8px 13px;font-size:12.5px;font-weight:500;line-height:1.25;white-space:nowrap;color:var(--bordeaux);cursor:pointer;font-family:inherit;box-shadow:0 1px 2px rgba(40,13,19,.06);transition:background .2s cubic-bezier(.23,1,.32,1),transform .12s,box-shadow .2s}
.rw-chip:hover{background:var(--gold);color:var(--bordeaux);box-shadow:0 3px 8px rgba(147,35,58,.18)}
.rw-chip:active{transform:scale(.97)}
.rw-crow{display:flex;gap:7px}
.rw-cin{flex:1;border:1px solid rgba(156,126,55,.5);background:#fff;border-radius:999px;padding:10px 15px;font-family:inherit;font-size:14px;color:var(--bordeaux);outline:none;min-width:0}
.rw-cin:focus{border-color:var(--gold)}
.rw-cin::placeholder{color:#b09a86}
.rw-csend{width:42px;height:42px;flex:0 0 auto;border-radius:50%;background:var(--burgundy);border:1px solid var(--gold);cursor:pointer;display:flex;align-items:center;justify-content:center;transition:background .2s}
.rw-csend svg{width:16px;height:16px;fill:var(--ivory)}
.rw-csend:hover{background:#6d2232}
.rw-csend:active{transform:scale(.97)}
.rw-cfoot{font-size:10.5px;color:var(--taupe);text-align:center;margin-top:9px;line-height:1.5}
.rw-cfoot button,.rw-blink{background:none;border:none;color:var(--cognac);cursor:pointer;font-family:inherit;font-size:inherit;text-decoration:underline;padding:0}
.rw-cfoot button:hover,.rw-blink:hover{color:var(--burgundy)}
.rw-typing i{display:inline-block;width:5px;height:5px;border-radius:50%;background:var(--taupe);margin-right:3px;animation:rwty 1s infinite}
.rw-typing i:nth-child(2){animation-delay:.15s}.rw-typing i:nth-child(3){animation-delay:.3s}
@keyframes rwty{0%,60%,100%{opacity:.25}30%{opacity:1}}
.rw-lead{background:var(--bone);border:1px solid rgba(156,126,55,.45);border-radius:13px;padding:13px 14px;align-self:stretch}
.rw-lead-t{font-size:12.5px;line-height:1.5;color:#3f2a30;font-weight:300;margin-bottom:9px}
.rw-lead .rw-f{margin-bottom:7px;font-size:16px}
.rw-lead-err{color:#93233A;font-size:11.5px;min-height:0;margin-bottom:2px}
.rw-lead-err:not(:empty){margin-bottom:7px}
.rw-lead .rw-sub{padding:11px}
.rw-ask{align-self:flex-start;max-width:92%;background:var(--bone);border-radius:13px;border-bottom-left-radius:4px;padding:12px 13px}
.rw-ask-q{font-size:13.5px;line-height:1.5;color:#3f2a30;font-weight:300;margin-bottom:9px}
.rw-ask-row{display:flex;gap:7px}
.rw-ask-in{flex:1;min-width:0;border:1px solid rgba(156,126,55,.5);background:#fff;border-radius:999px;padding:10px 14px;font-family:inherit;font-size:16px;color:var(--bordeaux);outline:none}
.rw-ask-in:focus{border-color:var(--gold)}
.rw-ask-in::placeholder{color:#b09a86}
.rw-ask-go{width:38px;height:38px;flex:0 0 auto;border-radius:50%;background:var(--burgundy);border:1px solid var(--gold);cursor:pointer;display:flex;align-items:center;justify-content:center}
.rw-ask-go svg{width:14px;height:14px;fill:var(--ivory)}
.rw-ask-go:active{transform:scale(.96)}
.rw-ask-err{display:none;color:#93233A;font-size:11.5px;line-height:1.4;margin-top:7px;font-weight:500}
.rw-ask-skip{display:block;background:none;border:none;color:var(--taupe);font-family:inherit;font-size:10.5px;letter-spacing:.1em;text-transform:uppercase;cursor:pointer;padding:9px 0 0}
.rw-ask-skip:hover{color:var(--burgundy)}
.rw-ph img{width:100%;height:100%;object-fit:cover;display:block}
.rw-callcard{align-self:stretch;background:var(--bordeaux);border:1px solid var(--gold);border-radius:13px;padding:13px 14px;color:var(--ivory)}
.rw-callcard .rw-cc-t{font-size:12.5px;line-height:1.5;font-weight:300;color:#e6d9c4;margin-bottom:10px}
.rw-cc-go{display:flex;align-items:center;justify-content:center;gap:9px;background:var(--burgundy);border:1px solid var(--gold);border-radius:999px;padding:12px;font-size:13px;font-weight:600;letter-spacing:.06em;color:var(--ivory);text-decoration:none}
.rw-cc-go:active{transform:scale(.98)}
.rw-cc-ic svg{width:15px;height:15px;fill:var(--champagne);display:block}
.rw-cc-skip{display:block;width:100%;text-align:center;background:none;border:none;color:#a8937b;font-family:inherit;font-size:10.5px;letter-spacing:.1em;text-transform:uppercase;cursor:pointer;padding:8px 0 0}
.rw-cc-skip:hover{color:var(--champagne)}
.rw-lead-skip{display:block;width:100%;text-align:center;background:none;border:none;color:var(--taupe);font-family:inherit;font-size:10.5px;letter-spacing:.1em;text-transform:uppercase;cursor:pointer;padding:8px 0 2px}
.rw-lead-skip:hover{color:var(--burgundy)}
.rw-legal{font-size:10px;color:var(--taupe);text-align:center;margin-top:8px}
.rw-p-done{text-align:center;padding:6px 2px}
.rw-tick{width:44px;height:44px;border-radius:50%;background:#7d8a5a;display:flex;align-items:center;justify-content:center;margin:0 auto 12px}
.rw-tick svg{width:22px;height:22px;fill:#fff}
.rw-p-done h4{font-family:'DM Serif Display',Georgia,serif;font-style:italic;font-weight:400;font-size:19px;color:var(--burgundy);margin:0 0 8px}
.rw-p-done p{font-size:13px;color:#3f2a30;font-weight:300;line-height:1.55;margin:0}
.rw-fab{position:relative;display:flex;align-items:center;background:none;border:none;cursor:pointer;padding:0;pointer-events:auto}
.rw-tease{pointer-events:auto}
.rw-fab .aw{position:relative;width:62px;height:62px;border-radius:50%;border:2.5px solid var(--gold);overflow:hidden;background:var(--oxblood);display:flex;align-items:center;justify-content:center}
.rw-fab .aw .rw-ph2{font-family:'DM Serif Display',Georgia,serif;font-style:italic;font-size:25px;color:var(--champagne)}
.rw-fab .aw .rw-chat{width:30px;height:30px;fill:var(--champagne)}
.rw-fab .aw .rw-fabicon{width:28px;height:28px;fill:var(--champagne)}
.card{transition:transform .45s cubic-bezier(.23,1,.32,1)}
.card .card-img{box-shadow:0 14px 34px rgba(40,13,19,.13)}
.card .card-img img{width:100%;height:100%;object-fit:cover;transition:transform .7s cubic-bezier(.23,1,.32,1)}
@media(hover:hover) and (pointer:fine){.card:hover{transform:translateY(-5px)}.card:hover .card-img img{transform:scale(1.05)}}
.rw-fab .aw img{width:100%;height:100%;object-fit:cover}
.rw-fab .live{display:none}
.rw-fab .pz{display:none}
@keyframes rwpulse{0%{transform:scale(1);opacity:.55}70%{transform:scale(1.35);opacity:0}100%{opacity:0}}
.rw-tease{position:absolute;right:74px;top:50%;transform:translateY(-50%) translateX(8px);white-space:nowrap;background:var(--bordeaux);color:var(--ivory);font-size:13px;font-weight:500;padding:10px 16px;border-radius:999px;border:1px solid var(--gold);box-shadow:0 8px 22px rgba(0,0,0,.4);opacity:0;pointer-events:none;cursor:pointer;transition:.4s cubic-bezier(.23,1,.32,1)}
.rw-tease b{color:var(--gold);font-weight:600}
.rw-tx{float:right;margin:-1px -4px 0 10px;padding:0 4px;font-size:16px;line-height:1.1;color:var(--ivory);opacity:.5;cursor:pointer}
.rw-tx:hover{opacity:1}
/* The invite is only an invite if it can be taken. It was pointer-events:none with no click
   handler, so the sole way into the chat was the 62px button beside it. */
.rw.tease .rw-tease{opacity:1;transform:translateY(-50%);pointer-events:auto}
.rw-tease:hover{background:var(--burgundy)}
.rw-fab:focus-visible .rw-tease{outline:2px solid var(--gold);outline-offset:2px}
.rw.open .rw-tease{opacity:0}
.rw.open .rw-fab .pz{display:none}
.rw-opt{display:flex;align-items:center;gap:12px;width:100%;text-align:left;border-radius:12px;padding:12px 13px;margin-bottom:9px;cursor:pointer;font-family:inherit;text-decoration:none;transition:.18s;border:1px solid transparent}
.rw-opt-ic{width:38px;height:38px;border-radius:50%;flex:0 0 auto;display:flex;align-items:center;justify-content:center}
.rw-opt-ic svg{width:19px;height:19px}
.rw-opt-tx{flex:1;min-width:0}
.rw-opt-t{display:block;font-size:13.5px;font-weight:600;letter-spacing:.01em}
.rw-opt-s{display:block;font-size:11.5px;font-weight:400;margin-top:2px;line-height:1.3}
.rw-opt-ch{font-size:22px;line-height:1;opacity:.65;flex:0 0 auto;font-weight:400}
.rw-opt-chat{background:linear-gradient(158deg,#6d2434,#48141f);border-color:var(--gold);color:var(--ivory);box-shadow:0 10px 22px -8px rgba(20,6,10,.6),inset 0 1px 0 rgba(255,255,255,.07)}
.rw-opt-chat:hover{transform:translateY(-1px);box-shadow:0 14px 28px -8px rgba(147,35,58,.5),inset 0 1px 0 rgba(255,255,255,.09)}
.rw-opt-chat .rw-opt-t{font-size:14.5px}
.rw-opt-chat .rw-opt-ic{width:40px;height:40px;background:rgba(255,255,255,.14)}
.rw-opt-chat .rw-opt-ic svg{fill:var(--champagne)}
.rw-opt-chat .rw-opt-s{color:var(--champagne)}
.rw-opt-chat .rw-opt-ch{opacity:.85}
.rw-opt-cb{background:transparent;border-color:rgba(156,126,55,.4);color:var(--bordeaux)}
.rw-opt-cb:hover{border-color:var(--gold);background:var(--bone)}
.rw-opt-cb .rw-opt-ic{background:rgba(92,27,41,.1)}
.rw-opt-cb .rw-opt-ic svg{fill:var(--burgundy)}
.rw-opt-cb .rw-opt-s{color:var(--taupe)}
.rw-rev{display:flex;align-items:center;gap:8px;justify-content:center;margin-top:13px;padding-top:13px;border-top:1px solid rgba(156,126,55,.22);text-decoration:none}
.rw-rev-g{width:15px;height:15px;flex:0 0 auto}
.rw-rev-stars{color:#f5b301;letter-spacing:1.5px;font-size:12px;line-height:1}
.rw-rev-t{font-size:11px;color:var(--taupe);font-weight:500;letter-spacing:.02em}
.rw-rev:hover .rw-rev-t{color:var(--burgundy)}
@media(prefers-reduced-motion:reduce){.rw-card{transition:opacity .2s}.rw-fab .pz{display:none}.rw-tease{transition:opacity .2s}}
@media(max-width:600px){
  .rw{right:14px;bottom:14px}
  /* iOS zooms the whole page when a focused input is under 16px, so phones keep 16 */
  .rw-cin,.rw-ask-in{font-size:16px}
  /* The tease lives inside the 62px button, so an absolute child with only max-width gets
     squeezed to the button's width. An explicit width lets it overflow leftward instead,
     sitting above the button where there is actually room on a phone. */
  .rw-tease{right:0;bottom:76px;top:auto;white-space:normal;line-height:1.35;
    width:min(250px,calc(100vw - 48px));max-width:none;transform:translateY(8px)}
  .rw.tease .rw-tease{transform:none}
}

/* The popup keeps its own visual system because it has to read as an interruption, while the
   ivory CTA preserves contrast against the bordeaux ground where a burgundy button disappears. */
.rpop{position:fixed;inset:0;z-index:90;display:none;align-items:center;justify-content:center;padding:20px;background:rgba(40,13,19,.62);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px)}
.rpop.open{display:flex}.rpop-card{position:relative;width:min(440px,100%);min-height:430px;padding:48px 34px 34px;border:1px solid var(--gold);border-radius:14px;background:var(--bordeaux);color:var(--ivory);box-shadow:0 28px 80px rgba(0,0,0,.42);text-align:center;overflow:hidden}.rpop-x{position:absolute;top:15px;right:16px;border:0;background:transparent;color:var(--ivory);font:400 28px/1 Arial;cursor:pointer;padding:4px}.rpop-word{font-family:'DM Serif Display',Georgia,serif;font-style:italic;font-size:32px;letter-spacing:-.04em;margin-bottom:24px}.rpop-kicker{font:600 10px/1.4 'Satoshi','Helvetica Neue',sans-serif;letter-spacing:.26em;text-transform:uppercase;color:var(--gold);margin-bottom:13px}.rpop h2{font:600 25px/1.12 'Satoshi','Helvetica Neue',sans-serif;letter-spacing:.04em;margin:0 0 12px}.rpop-copy{font-size:15px;line-height:1.55;color:rgba(244,236,219,.84);margin:0 auto 24px;max-width:300px}.rpop-foil{position:relative;width:min(288px,100%);height:162px;margin:24px auto;border:1px solid var(--gold);border-radius:14px;overflow:hidden;background:var(--foil)}.rpop-foil canvas{position:absolute;inset:0;width:100%;height:100%;touch-action:none;cursor:crosshair}.rpop-reveal{height:100%;padding:30px 22px;display:flex;align-items:center;justify-content:center;background:var(--bordeaux);color:var(--ivory);font:600 19px/1.2 'Satoshi','Helvetica Neue',sans-serif;letter-spacing:.04em}/* display:block matters: step 4's CTA is an anchor, and inline anchors ignore width:100% and
   sit alongside the copy link instead of under it. */
.rpop-btn{display:block;width:100%;box-sizing:border-box;border:1px solid var(--ivory);border-radius:999px;background:var(--ivory);color:var(--bordeaux);padding:15px 20px;font:600 12px/1 'Satoshi','Helvetica Neue',sans-serif;letter-spacing:.15em;text-transform:uppercase;text-align:center;text-decoration:none;cursor:pointer}/* A class selector outranks the user agent's [hidden]{display:none}, so without this the Claim
   button sits under an unscratched foil from the moment the popup opens. */
/* The cover is the proof the reward is real, and it replaces the foil as the one piece of
   visual weight on the card now that the scratch panel is gone. */
.rpop-cover{display:block;width:min(148px,42%);height:auto;margin:18px auto 2px;border-radius:10px;border:1px solid rgba(195,162,78,.45);box-shadow:0 12px 32px rgba(0,0,0,.4)}
.rpop-cover[hidden]{display:none}
@media(max-width:480px){.rpop-cover{width:min(120px,38%);margin-top:14px}}
.rpop-btn[hidden]{display:none}.rpop-btn:disabled{opacity:.62;cursor:wait}.rpop-answers{display:grid;gap:9px;margin:22px 0}.rpop-answer{width:100%;padding:13px 16px;border:1px solid rgba(195,162,78,.62);border-radius:999px;background:transparent;color:var(--ivory);font:500 14px/1.2 'Satoshi','Helvetica Neue',sans-serif;cursor:pointer}.rpop-answer.selected{background:var(--ivory);color:var(--bordeaux);border-color:var(--ivory)}.rpop-skip{display:block;margin:16px auto 0;border:0;background:transparent;color:rgba(244,236,219,.54);font:400 12px/1.3 'Satoshi','Helvetica Neue',sans-serif;cursor:pointer}.rpop-input{width:100%;border:1px solid rgba(195,162,78,.7);border-radius:999px;background:transparent;color:var(--ivory);font:400 16px/1.2 'Satoshi','Helvetica Neue',sans-serif;padding:15px 18px;margin:12px 0}.rpop-input::placeholder{color:rgba(244,236,219,.62)}.rpop-disclosure{margin:13px 0 0;color:rgba(244,236,219,.68);font-size:12px;line-height:1.45}.rpop-note{min-height:26px;margin:12px 0 0;color:#f1caca;font-size:13px;line-height:1.4}@media(max-width:480px){.rpop{padding:12px}.rpop-card{min-height:0;padding:42px 24px 27px}.rpop h2{font-size:22px}.rpop-foil{height:145px;margin:18px auto}.rpop-word{font-size:28px;margin-bottom:18px}}

/* ===== PDP reviews ======================================================= */
.rvw-stars{position:relative;display:inline-block;white-space:nowrap;line-height:0;vertical-align:middle}
.rvw-stars svg{width:14px;height:14px;display:inline-block;vertical-align:middle}
.rvw-sb{display:block}
.rvw-sb svg{fill:rgba(40,13,19,.17)}
.rvw-sf{position:absolute;left:0;top:0;width:var(--pct);overflow:hidden;display:block}
.rvw-sf svg{fill:var(--gold-dp)}
.rvw-stars.rvw-lg svg{width:19px;height:19px}
.rvw-stars.rvw-sm svg{width:13px;height:13px}
.rvw-stars.rvw-xs svg{width:11.5px;height:11.5px}

/* product-card rating, between card title and price */
.rvw-cardrate{display:flex;align-items:center;gap:6px;margin:-4px 0 -1px;line-height:1}
.rvw-cardrate span{font-size:11.5px;color:var(--ash);letter-spacing:.01em}
.card:hover .rvw-cardrate span{color:var(--cognac)}

/* inline summary, sits under the PDP title */
.rvw-inline{display:inline-flex;align-items:center;gap:8px;margin:10px 0 0;padding:2px 0;font-size:13px;color:var(--smoke);cursor:pointer}
.rvw-inline b{font-weight:600;color:var(--ink);letter-spacing:.01em}
.rvw-inline-c{color:var(--ash);border-bottom:1px solid rgba(138,119,102,.45);padding-bottom:1px;transition:.2s}
.rvw-inline:hover .rvw-inline-c{color:var(--cognac);border-bottom-color:var(--cognac)}

/* section */
.rvw{margin-top:44px;padding-top:34px;padding-bottom:56px;border-top:1px solid var(--line);scroll-margin-top:130px}
.rvw-aibadge{display:flex;align-items:center;gap:8px;margin-bottom:22px;padding:9px 14px;border:1px dashed rgba(156,126,55,.5);border-radius:14px;background:rgba(195,162,78,.07);font-size:11.5px;letter-spacing:.05em;text-transform:uppercase;font-weight:600;color:var(--cognac-dp)}
.rvw-aibadge i{font-size:15px}
.rvw-sechead{margin-bottom:26px}
.rvw-sechead .eyebrow{display:block;margin-bottom:12px}
.rvw-sechead h3{font-family:'Satoshi','Helvetica Neue',Helvetica,Arial;font-weight:500;font-size:25px;line-height:1.2;letter-spacing:-.012em;color:var(--ink)}

.rvw-top{display:grid;grid-template-columns:auto 1fr;gap:34px;align-items:center;padding:22px 24px;border:1px solid var(--line);border-radius:14px;background:var(--paper2)}
.rvw-score{text-align:center;min-width:132px}
.rvw-big{font-size:52px;line-height:.94;color:var(--ink);display:block;margin-bottom:8px}
.rvw-based{margin-top:9px;font-size:12px;color:var(--ash);letter-spacing:.02em}
.rvw-rec{margin-top:4px;font-size:12px;color:var(--cognac-dp);font-weight:600;display:flex;align-items:center;justify-content:center;gap:4px}
.rvw-rec i{font-size:14px}
.rvw-bars{display:flex;flex-direction:column;gap:5px}
.rvw-bar{display:grid;grid-template-columns:32px 1fr 26px;align-items:center;gap:11px;background:none;border:0;padding:2px 4px;border-radius:8px;cursor:pointer;font:inherit;color:var(--smoke);transition:.18s}
.rvw-bar:hover:not(:disabled){background:rgba(40,13,19,.05)}
.rvw-bar:disabled{opacity:.42;cursor:default}
.rvw-bar.on{background:rgba(195,162,78,.18)}
.rvw-bar-n{display:flex;align-items:center;gap:2px;font-size:12px;font-weight:600;color:var(--ink)}
.rvw-bar-n i{font-size:11px;color:var(--gold-dp)}
.rvw-bar-t{height:6px;border-radius:99px;background:rgba(40,13,19,.1);overflow:hidden}
.rvw-bar-t span{display:block;height:100%;background:var(--gold-dp);border-radius:99px}
.rvw-bar-c{font-size:12px;color:var(--ash);text-align:right}

.rvw-chips{display:flex;flex-wrap:wrap;align-items:center;gap:8px;margin-top:20px}
.rvw-chips-l{font-size:11px;font-weight:600;letter-spacing:.2em;text-transform:uppercase;color:var(--ash);margin-right:2px}
.rvw-chip{font:inherit;font-size:12.5px;color:var(--smoke);background:transparent;border:1px solid var(--line);border-radius:99px;padding:6px 13px;cursor:pointer;transition:.2s}
.rvw-chip b{font-weight:600;color:var(--ash);margin-left:3px}
.rvw-chip:hover{border-color:var(--cognac);color:var(--ink)}
.rvw-chip.on{background:var(--ink);border-color:var(--ink);color:var(--paper)}
.rvw-chip.on b{color:var(--brass-br)}

.rvw-tools{display:flex;align-items:center;justify-content:space-between;gap:16px;margin:24px 0 4px;padding-bottom:14px;border-bottom:1px solid var(--line)}
.rvw-active{font-size:12.5px;color:var(--ash)}
.rvw-active button{font:inherit;background:none;border:0;color:var(--cognac);text-decoration:underline;cursor:pointer;padding:0 0 0 6px}
.rvw-sort{margin-left:auto;font-size:11px;font-weight:600;letter-spacing:.2em;text-transform:uppercase;color:var(--ash);display:flex;align-items:center;gap:9px}
.rvw-sort select{font-family:'Satoshi','Helvetica Neue',Helvetica,Arial;font-size:13px;font-weight:400;letter-spacing:0;text-transform:none;color:var(--ink);background:transparent;border:0;border-bottom:1px solid var(--line);padding:4px 2px;cursor:pointer}

.rvw-list{list-style:none;margin:0;padding:0}
.rvw-card{padding:26px 0;border-bottom:1px solid var(--line)}
.rvw-card.rvw-hid,.rvw-card.rvw-out{display:none}
.rvw-head{display:grid;grid-template-columns:auto 1fr auto;align-items:start;gap:13px}
.rvw-av{width:38px;height:38px;border-radius:99px;display:flex;align-items:center;justify-content:center;background:var(--paper2);border:1px solid var(--line);font-size:12.5px;font-weight:600;letter-spacing:.04em;color:var(--ink);flex:none}
.rvw-name{font-size:14.5px;font-weight:600;color:var(--ink);display:flex;align-items:center;gap:8px;flex-wrap:wrap;line-height:1.35}
.rvw-ver{display:inline-flex;align-items:center;gap:3px;font-size:11px;font-weight:600;letter-spacing:.04em;color:var(--cognac-dp);text-transform:none}
.rvw-ver i{font-size:13px}
.rvw-sub{font-size:12.5px;color:var(--ash);line-height:1.5}
.rvw-dot{opacity:.55;padding:0 1px}
.rvw-date{font-size:12px;color:var(--ash);white-space:nowrap;padding-top:2px}
.rvw-card .rvw-stars{margin:12px 0 0}
.rvw-title{font-family:'Satoshi','Helvetica Neue',Helvetica,Arial;font-size:15px;font-weight:600;color:var(--ink);margin:9px 0 0;letter-spacing:-.004em}
.rvw-body{margin-top:7px;font-size:14.5px;line-height:1.72;color:var(--smoke)}
.rvw-body p+p{margin-top:11px}
.rvw-photos{display:flex;gap:9px;margin-top:14px;flex-wrap:wrap}
.rvw-photos img{width:82px;height:82px;object-fit:cover;border-radius:10px;border:1px solid var(--line);cursor:zoom-in;transition:.2s}
.rvw-photos img:hover{transform:translateY(-2px);border-color:var(--cognac)}
.rvw-foot{margin-top:14px}
.rvw-help{font:inherit;font-size:12.5px;color:var(--ash);background:transparent;border:1px solid var(--line);border-radius:99px;padding:6px 14px;cursor:pointer;display:inline-flex;align-items:center;gap:6px;transition:.2s}
.rvw-help i{font-size:14px}
.rvw-help:hover{border-color:var(--cognac);color:var(--ink)}
.rvw-help.on{border-color:var(--cognac);color:var(--cognac-dp);background:rgba(195,162,78,.1)}
.rvw-reply{margin:15px 0 0 14px;padding:14px 18px;border-left:2px solid var(--brass);background:rgba(195,162,78,.07);border-radius:0 12px 12px 0}
.rvw-reply-h{font-size:11px;font-weight:600;letter-spacing:.16em;text-transform:uppercase;color:var(--ash);margin-bottom:6px}
.rvw-reply-m{color:var(--cognac-dp)}
.rvw-reply p{font-size:13.8px;line-height:1.68;color:var(--smoke)}
.rvw-more{margin-top:28px;margin-bottom:6px;width:100%}
.rvw-empty{margin-top:24px;font-size:14px;color:var(--ash)}
.rvw-empty button{font:inherit;background:none;border:0;color:var(--cognac);text-decoration:underline;cursor:pointer}

.rvw-lb{position:fixed;inset:0;z-index:90;background:rgba(40,13,19,.88);display:flex;align-items:center;justify-content:center;padding:32px;cursor:zoom-out}
.rvw-lb img{max-width:100%;max-height:100%;border-radius:14px}

/* owner photo rail */
.rvw-rail{margin-top:24px}
.rvw-rail-h{display:flex;align-items:baseline;gap:10px;margin-bottom:11px}
.rvw-rail-c{font-size:12px;color:var(--ash)}
.rvw-rail-t{display:flex;gap:10px;overflow-x:auto;padding-bottom:6px;scrollbar-width:thin}
.rvw-rail-i{position:relative;flex:none;width:118px;height:118px;padding:0;border:1px solid var(--line);border-radius:12px;overflow:hidden;background:none;cursor:zoom-in;transition:.2s}
.rvw-rail-i img{width:100%;height:100%;object-fit:cover}
.rvw-rail-i span{position:absolute;left:0;right:0;bottom:0;padding:14px 8px 5px;font-size:10.5px;font-weight:600;letter-spacing:.03em;color:#F4ECDB;text-align:left;background:linear-gradient(transparent,rgba(40,13,19,.82))}
.rvw-rail-i:hover{border-color:var(--cognac);transform:translateY(-2px)}
.rvw-rail-more{display:flex;align-items:center;justify-content:center;background:var(--paper2);cursor:pointer}
.rvw-rail-n{font-family:'Satoshi','Helvetica Neue',Helvetica,Arial;font-size:17px;font-weight:600;color:var(--ink)}

/* section head with the write CTA */
.rvw-sechead{display:flex;align-items:flex-end;justify-content:space-between;gap:20px;flex-wrap:wrap}
.rvw-write{padding:11px 22px;font-size:11px;white-space:nowrap}
.rvw-write i{font-size:15px}
.rvw-none .rvw-sechead{margin-bottom:12px}
.rvw-nonep{font-size:14.5px;color:var(--ash);margin-bottom:18px;max-width:52ch}
.rvw-none .rvw-write{margin-top:2px}

/* submission modal */
.rvwov{position:fixed;inset:0;z-index:95;display:none;align-items:center;justify-content:center;padding:24px}
.rvwov.on{display:flex}
.rvwscrim{position:absolute;inset:0;background:rgba(40,13,19,.72);backdrop-filter:blur(2px)}
.rvwbox{position:relative;width:100%;max-width:620px;max-height:90vh;overflow-y:auto;background:var(--paper);border:1px solid var(--line);border-radius:14px;padding:34px 36px 30px;box-shadow:0 30px 80px rgba(40,13,19,.34)}
.rvwx{position:absolute;top:14px;right:18px;font-size:26px;line-height:1;background:none;border:0;color:var(--ash);cursor:pointer;padding:4px 8px}
.rvwx:hover{color:var(--ink)}
.rvw-fh{font-family:'Satoshi','Helvetica Neue',Helvetica,Arial;font-weight:500;font-size:23px;color:var(--ink);margin:12px 0 8px;letter-spacing:-.012em}
.rvw-fsub{font-size:14px;color:var(--ash);line-height:1.65;margin-bottom:22px}
.rvw-hp{position:absolute;left:-9999px;width:1px;height:1px;opacity:0}
.rvw-fl{display:block;font-size:11px;font-weight:600;letter-spacing:.2em;text-transform:uppercase;color:var(--ink);margin:18px 0 7px}
.rvw-fl span{font-weight:400;letter-spacing:.04em;text-transform:none;color:var(--ash);font-size:11.5px;margin-left:5px}
.rvwbox input[type=text],.rvwbox input[type=email],.rvwbox textarea,.rvwbox select{width:100%;font-family:'Satoshi','Helvetica Neue',Helvetica,Arial;font-size:14.5px;color:var(--ink);background:var(--paper2);border:1px solid var(--line);border-radius:10px;padding:11px 14px;transition:.2s}
.rvwbox textarea{resize:vertical;line-height:1.6}
.rvwbox input:focus,.rvwbox textarea:focus,.rvwbox select:focus{outline:0;border-color:var(--cognac);background:var(--paper)}
.rvw-frow{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.rvw-pick{display:flex;align-items:center;gap:4px}
.rvw-pick button{background:none;border:0;padding:2px;cursor:pointer;line-height:0}
.rvw-pick svg{width:29px;height:29px;fill:rgba(40,13,19,.16);transition:fill .15s}
.rvw-pick button.on svg,.rvw-pick:hover button:hover svg{fill:var(--gold-dp)}
.rvw-pick-l{font-size:13px;color:var(--ash);margin-left:10px}
.rvw-drop{display:flex;align-items:center;gap:10px;border:1px dashed rgba(156,126,55,.55);border-radius:12px;padding:16px 18px;cursor:pointer;color:var(--cognac-dp);font-size:13.5px;transition:.2s;background:rgba(195,162,78,.05)}
.rvw-drop:hover{border-color:var(--cognac);background:rgba(195,162,78,.11)}
.rvw-drop i{font-size:20px}
.rvw-drop input{display:none}
.rvw-thumbs{display:flex;gap:9px;flex-wrap:wrap;margin-top:11px}
.rvw-thumbs figure{position:relative;width:78px;height:78px;margin:0}
.rvw-thumbs img{width:100%;height:100%;object-fit:cover;border-radius:10px;border:1px solid var(--line)}
.rvw-thumbs button{position:absolute;top:-6px;right:-6px;width:22px;height:22px;border-radius:99px;border:1px solid var(--line);background:var(--paper);color:var(--ink);font-size:13px;line-height:1;cursor:pointer;padding:0}
.rvw-consent{display:flex;gap:10px;align-items:flex-start;margin:22px 0 6px;font-size:13px;line-height:1.6;color:var(--smoke);cursor:pointer}
.rvw-consent input{margin-top:3px;flex:none;accent-color:var(--burgundy)}
.rvw-fsubmit{margin-top:18px}
.rvw-fnote{font-size:12px;color:var(--ash);text-align:center;margin-top:11px;line-height:1.55}
.rvw-ferr{margin-top:12px;padding:10px 14px;border-radius:10px;background:rgba(147,35,58,.1);border:1px solid rgba(147,35,58,.3);color:var(--crimson);font-size:13.5px}
.rvw-fdone{text-align:center;padding:26px 0 8px}
.rvw-fdone i{font-size:46px;color:var(--cognac)}
.rvw-fdone h4{font-family:'Satoshi','Helvetica Neue',Helvetica,Arial;font-weight:500;font-size:21px;color:var(--ink);margin:14px 0 8px}
.rvw-fdone p{font-size:14px;color:var(--ash);line-height:1.65;max-width:42ch;margin:0 auto 20px}

@media(max-width:820px){
 .rvwbox{padding:28px 22px 24px;max-height:94vh}
 .rvw-frow{grid-template-columns:1fr;gap:0}
 .rvw-fh{font-size:20px}
 .rvw-sechead{align-items:flex-start;flex-direction:column;gap:14px}
 .rvw-write{width:100%}
 .rvw-rail-i{width:104px;height:104px}
 .rvw-top{grid-template-columns:1fr;gap:22px;padding:20px}
 .rvw-score{text-align:left;display:flex;align-items:baseline;gap:12px;flex-wrap:wrap}
 .rvw-big{font-size:40px;margin-bottom:0}
 .rvw-based,.rvw-rec{margin-top:0}
 .rvw-rec{justify-content:flex-start}
 .rvw-sechead h3{font-size:21px}
 .rvw-head{grid-template-columns:auto 1fr;gap:11px}
 .rvw-date{grid-column:2;grid-row:2;padding-top:4px}
}/* Offer PDP — all rules are scoped so the existing buy box remains byte-for-byte unchanged when disabled. */
#offer-v2{--offer-line:var(--line);--offer-panel:var(--paper2);--offer-accent:var(--burgundy);margin-top:4px}

/* ── 1 & 2 · LAYOUT: the product outweighs the form, and stays on screen ──
   Scoped to .pdp-offer so the legacy PDP grid is untouched when OFFER_MODE='off'. */
.pdp-offer{grid-template-columns:minmax(0,1.55fr) minmax(0,1fr);column-gap:44px;grid-template-areas:'gallery buy' 'details buy'}
/* The gallery sticks while .pdp-details (same column, row 2) scrolls up underneath
   it. With no background it was transparent, so the reviews showed through between
   the thumbnails. Needs an opaque fill AND a stacking context, plus padding so the
   details don't butt straight up against the thumbnail strip. */
/* The gallery must NOT be sticky. The grid is 'gallery buy' over 'details buy', so the description
   and the accordions sit directly beneath the gallery in the same column. Pinned at top:24px with
   an opaque background and z-index:2, it stayed put while that copy scrolled up underneath it and
   was painted over, which made the body text unreadable on the way past. The buy column keeps its
   own sticky, which is the one that actually helps. */
.pdp-offer .gallery{position:static;align-self:start;padding-bottom:26px}
.pdp-offer .pdp-info{position:static;top:auto}

/* PDP "ask a question" panel — dark, mirroring the book-a-call landing page. The specialist photo
   is masked so its edges dissolve to transparent, and the dark panel shows through, giving the
   "black sides" blend rather than a hard-edged crop. Form restyled for the dark ground. */
/* USP band — full-width, cream, solid gold icons. Sits above the dark ask panel for a light-then
   -dark rhythm. Four columns on desktop, two on tablet, stacked on phone; hairline gold dividers. */
/* Icons on the film's three build facts (PDP only). Champagne on the dark film, sits above the label. */
.lfilm-facts-ic{align-items:start}
.lf-ic{display:block;width:22px;height:22px;color:var(--champagne);margin-bottom:11px}
/* The ask panel goes full-bleed so it flows straight out of the full-width film above it, end to
   end, instead of a rounded box with cream slivers down the sides. Photo runs to the page edge;
   the form body keeps its own padding so text is never glued to the edge. */
.pdp-ask-body{padding:30px clamp(20px,4vw,56px) 34px}
@media(max-width:760px){.pdp-ask-body{padding:8px 18px 22px}}
.pdp-usps{margin:34px 0 10px;padding:34px 0;border-top:1px solid var(--line);border-bottom:1px solid var(--line);
  background:linear-gradient(180deg,var(--panel),var(--paper))}
.pdp-usp-row{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(4,1fr)}
.pdp-usp{padding:4px 26px;position:relative}
.pdp-usp+.pdp-usp::before{content:"";position:absolute;left:0;top:6px;bottom:6px;width:1px;background:var(--line)}
.pdp-usp-ic{display:inline-flex;color:var(--cognac)}
.pdp-usp-ic svg{width:30px;height:30px}
.pdp-usp h3{font-family:var(--serif,Georgia,serif);font-weight:400;font-size:17px;letter-spacing:-.01em;
  color:var(--ink);margin:13px 0 0}
.pdp-usp p{font-size:13px;line-height:1.55;color:var(--ash);margin:7px 0 0}
@media(max-width:900px){
  .pdp-usp-row{grid-template-columns:1fr 1fr;row-gap:26px}
  .pdp-usp{padding:4px 22px}
  .pdp-usp:nth-child(3)::before,.pdp-usp:nth-child(1)::before{display:none}
  .pdp-usp:nth-child(3),.pdp-usp:nth-child(4){padding-top:26px;border-top:1px solid var(--line)}
}
@media(max-width:520px){
  .pdp-usps{padding:26px 0}
  .pdp-usp-row{grid-template-columns:1fr;row-gap:0}
  .pdp-usp{padding:18px 4px}
  .pdp-usp::before{display:none!important}
  .pdp-usp+.pdp-usp{border-top:1px solid var(--line)}
  .pdp-usp{display:grid;grid-template-columns:40px 1fr;column-gap:14px;align-items:start}
  .pdp-usp-ic{grid-row:1 / span 2;margin-top:3px}
  .pdp-usp h3{margin:0}
}
.pdp-ask-wrap{margin-top:0}
.pdp-ask{display:grid;grid-template-columns:minmax(0,1.02fr) minmax(0,1.12fr);gap:0;
  border-radius:0;overflow:hidden;color:var(--ivory);
  background:radial-gradient(120% 140% at 12% 20%,#3a1620 0%,#280D13 46%,#1c0a0f 100%)}
.pdp-ask-media{position:relative;min-height:100%;background:#160709}
.pdp-ask-media img{width:100%;height:100%;object-fit:cover;object-position:center 22%;display:block;
  -webkit-mask-image:linear-gradient(to right,transparent 0%,#000 20%,#000 74%,transparent 100%),
                     linear-gradient(to bottom,transparent 0%,#000 12%,#000 82%,transparent 100%);
  mask-image:linear-gradient(to right,transparent 0%,#000 20%,#000 74%,transparent 100%),
             linear-gradient(to bottom,transparent 0%,#000 12%,#000 82%,transparent 100%);
  -webkit-mask-composite:source-in;mask-composite:intersect}
/* A bottom scrim so the caption reads over any part of the photo (the lit lamp behind them was
   washing the white text out). Transparent above the caption so the faces stay clear. */
.pdp-ask-media::before{content:'';position:absolute;inset:0;pointer-events:none;z-index:1;
  background:linear-gradient(to top,rgba(18,6,9,.86) 0%,rgba(18,6,9,.42) 24%,transparent 50%)}
.pdp-ask-cap{position:absolute;left:20px;bottom:16px;display:flex;flex-direction:column;line-height:1.3;z-index:2;
  text-shadow:0 1px 10px rgba(0,0,0,.85),0 0 22px rgba(0,0,0,.6)}
.pdp-ask-cap b{color:#fff;font-size:14px;font-weight:600}
.pdp-ask-cap em{color:var(--champagne);font-style:normal;font-size:10px;letter-spacing:.16em;text-transform:uppercase;font-weight:700}
.pdp-ask-body{padding:26px 28px}
.pdp-ask-body .eyebrow{color:var(--champagne)}
.pdp-ask-body h2{font-family:var(--serif,Georgia,serif);font-weight:400;font-size:25px;letter-spacing:-.01em;margin:7px 0 0;color:var(--ivory)}
.pdp-ask-lede{font-size:14px;color:rgba(244,236,219,.72);margin:9px 0 17px;max-width:52ch}
.pdp-ask-form{display:flex;flex-direction:column;gap:9px}
.pdp-ask-form input,.pdp-ask-form textarea{width:100%;border:1px solid rgba(244,236,219,.2);border-radius:10px;
  background:rgba(244,236,219,.06);padding:12px 13px;font-family:inherit;font-size:14px;color:var(--ivory);resize:vertical}
.pdp-ask-form input::placeholder,.pdp-ask-form textarea::placeholder{color:rgba(244,236,219,.5)}
.pdp-ask-form input:focus,.pdp-ask-form textarea:focus{outline:none;border-color:var(--champagne);background:rgba(244,236,219,.09)}
.pdp-ask-err{margin:0;font-size:12.5px;color:#E8A08A;min-height:0}
.pdp-ask-err:empty{display:none}
.pdp-ask-form button{align-self:flex-start;margin-top:2px;border:0;
  background:var(--champagne);color:#280D13;border-radius:999px;padding:12px 24px;
  font-family:inherit;font-size:11px;letter-spacing:.14em;text-transform:uppercase;font-weight:700;cursor:pointer;transition:filter .2s}
.pdp-ask-form button:hover{filter:brightness(1.06)}
.pdp-ask-form button:disabled{opacity:.6;cursor:default}
.pdp-ask-call{margin:14px 0 0;font-size:12.5px;color:rgba(244,236,219,.7)}
.pdp-ask-call a{color:var(--ivory);border-bottom:1px solid var(--champagne);text-decoration:none;padding-bottom:1px}
.pdp-ask-done{font-size:14px;color:rgba(244,236,219,.8);line-height:1.55}
.pdp-ask-done b{color:var(--ivory);font-weight:600}
@media(max-width:760px){
  .pdp-ask{grid-template-columns:1fr}
  .pdp-ask-media{min-height:0;height:232px}
  .pdp-ask-media img{object-position:center 30%;
    -webkit-mask-image:linear-gradient(to bottom,#000 0%,#000 62%,transparent 100%);
    mask-image:linear-gradient(to bottom,#000 0%,#000 62%,transparent 100%);
    -webkit-mask-composite:source-over;mask-composite:add}
  .pdp-ask-body{padding:6px 18px 20px}
  .pdp-ask-body h2{font-size:22px}
  .pdp-ask-form button{width:100%;text-align:center;align-self:stretch}
}
.pdp-reviews-full{margin-top:14px}
/* Portrait frame. Set the ratio on .gframe itself — forcing height:100% here made
   its own aspect-ratio drive the WIDTH (802 x 4/3 = 1070px) and the gallery
   overflowed across the buy column. */
.pdp-offer .gframe{aspect-ratio:4/3}
.pdp-offer .gcell img{width:100%;height:100%;object-fit:cover}
@media(max-width:1040px){
  /* minmax(0,…) again: the gallery's 6-cell carousel gives the row a huge
     min-content width and blew 7px past the viewport without it. */
  .pdp-offer{grid-template-columns:minmax(0,1fr);grid-template-areas:'gallery' 'buy' 'details'}
  .pdp-offer .gallery{position:static}
  .pdp-offer .gframe{aspect-ratio:4/3}
}
/* v2 rhythm. Reviews read as a header above the category with a hairline under them, and the
   blocks below sit 24-26px apart instead of 15-17, which was the crammed feeling. */
#offer-v2 .ov-identity{margin-bottom:24px}
#offer-v2 .ov-revtop{display:flex;align-items:center;gap:8px;padding-bottom:14px;border-bottom:1px solid var(--offer-line)}
#offer-v2 .ov-revtop .ov-stars{color:var(--gold);font-size:13px;letter-spacing:.06em}
#offer-v2 .ov-revtop b{font-size:13.5px;color:var(--ink)}
#offer-v2 .ov-revtop a{font-size:12.5px;color:var(--ash);text-decoration:underline;text-underline-offset:2px}
#offer-v2 .ov-eye{display:block;margin-top:16px}
#offer-v2 .ov-money{margin-top:22px}
#offer-v2 .ov-lat{padding:0;border:0;background:none;font:inherit;font-size:12.5px;font-weight:700;color:var(--ink);border-bottom:1px solid var(--gold);cursor:pointer}
#offer-v2 .ov-lat:hover{border-color:var(--cognac)}
#offer-v2 .ov-headfine{margin:10px 0 0;font-size:12.5px;color:var(--ash);white-space:nowrap}
#offer-v2 .ov-hide-row .ov-hide-label small{display:block;color:var(--ash);font-size:12.5px}
#offer-v2 .ov-hide-row .ov-hide-label b{font-size:14.5px}
/* The swatch book icon had no size rule once the button moved out of .ov-hide-actions, so the
   SVG collapsed to nothing and the pill read as a bare word. Size it wherever it lives. */
#offer-v2 .ov-swbook svg{width:17px;height:17px;stroke-width:1.25;flex:none}
#offer-v2 .ov-swbook svg *{vector-effect:non-scaling-stroke}
/* Section labels carry a line icon. One weight, one size, non-scaling stroke so 24px artwork
   at 14px keeps the same hairline as everything else in the column. */
#offer-v2 .eyebrow .ov-ic,.ovlmod-copy .eyebrow .ov-ic{width:14px;height:14px;stroke-width:1.4;flex:none;vertical-align:-2px;margin-right:7px}
#offer-v2 .eyebrow .ov-ic *,.ovlmod-copy .eyebrow .ov-ic *{vector-effect:non-scaling-stroke}
.ovlmod-copy .eyebrow{display:flex;align-items:center}
#offer-v2 .ov-hide-change .ov-ic{width:13px;height:13px;stroke-width:1.4;margin-right:6px;vertical-align:-2px}
#offer-v2 .ov-hide-change{display:inline-flex;align-items:center;margin-left:auto;font-size:10.5px;letter-spacing:.09em;text-transform:uppercase;font-weight:700;color:var(--cognac);background:none;border:0;cursor:pointer;white-space:nowrap}
#offer-v2 .ov-section{margin-top:26px}
#offer-v2 .ov-eyerow{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-bottom:7px}
#offer-v2 .ov-eyerow .eyebrow{font-size:11px;font-weight:500;letter-spacing:.22em;text-transform:uppercase;color:var(--cognac)}
#offer-v2 .ov-rating{display:flex;align-items:baseline;gap:7px;font-size:12.5px;color:var(--ash);white-space:nowrap}
#offer-v2 .ov-stars{color:var(--gold);letter-spacing:1.5px;font-size:12px}
#offer-v2 .ov-rating b{color:var(--ink);font-weight:700;font-size:13.5px}
#offer-v2 .ov-rating em{font-style:normal;color:var(--ash)}
#offer-v2 h1{font-size:clamp(28px,3vw,38px);font-weight:500;letter-spacing:-.018em;line-height:1.12;color:var(--ink);margin:0;text-wrap:balance}
#offer-v2 .ov-section{margin-top:22px}#offer-v2 .ov-section:first-of-type{margin-top:0}#offer-v2 .ov-sect-h{display:flex;justify-content:space-between;gap:12px;align-items:baseline;margin-bottom:10px}#offer-v2 .ov-hint{font-size:11px;color:var(--ash)}
@media(min-width:1280px){
  #offer-v2 .ov-lanes{display:grid;grid-template-columns:1fr 1fr;gap:14px}
  #offer-v2 .ov-lanes .ov-lane{margin-top:0}
  #offer-v2 .ov-lanes .ov-lane-money{flex-direction:column;align-items:flex-start;gap:11px}
  #offer-v2 .ov-lanes .ov-callout{align-self:stretch;flex-direction:row;justify-content:space-between;min-width:0;padding:8px 14px}
  #offer-v2 .ov-lanes .ov-callout b{font-size:18px}
  #offer-v2 .ov-lanes .ov-lane-price{font-size:30px}
  #offer-v2 .ov-lanes .ov-lane-why{margin-top:17px;font-size:12px;line-height:1.5;padding-left:0}
  /* Gallery takes 1.55fr, so the 2-up lane cards are ~224px. Keep the lane name on one line. */
  #offer-v2 .ov-lanes .ov-lane-name{font-size:13.5px;letter-spacing:.06em;white-space:nowrap}
  #offer-v2 .ov-lanes .ov-ship{padding-left:0;margin:9px 0 11px}
  #offer-v2 .ov-lanes .ov-lane-money{padding-left:0}
  #offer-v2 .ov-lanes .ov-lane{padding:34px 18px 18px}
}
#offer-v2 .ov-lane{position:relative;width:100%;display:block;text-align:left;border:1.5px solid var(--offer-line);border-radius:16px;background:var(--offer-panel);padding:38px 24px 20px;margin-top:14px;cursor:pointer;overflow:hidden;transition:.28s cubic-bezier(.23,1,.32,1)}
#offer-v2 .ov-lane:hover{border-color:rgba(92,27,41,.4)}
#offer-v2 .ov-lane.on{border-color:var(--offer-accent);box-shadow:0 0 0 1.5px var(--offer-accent),0 14px 34px -22px rgba(40,13,19,.6);background:#fff8ec}
#offer-v2 .ov-lane.fast{background:linear-gradient(180deg,rgba(195,162,78,.09),rgba(195,162,78,.02))}
#offer-v2 .ov-lane.fast.on{background:#fff8ec}
/* badge sits INSIDE the card, mitred to the radius, with real weight */
#offer-v2 .ov-badge{position:absolute;right:0;top:0;height:28px;display:flex;align-items:center;padding:0 16px;border-radius:0 14px 0 14px;background:var(--gold);color:var(--ink);font-size:10.5px;font-weight:700;letter-spacing:.16em}
#offer-v2 .ov-lane.fast .ov-badge{background:var(--ink);color:var(--champagne)}
/* One stroke weight for every icon in the buy box. non-scaling-stroke makes
   stroke-width mean CSS pixels, not viewBox units, so an icon drawn in a 56-unit
   box and one drawn in a 24-unit box render the same line at any display size. */
#offer-v2 svg{stroke-width:1.25}
/* Swatch-library trigger, sitting with the hides — the moment colour is the live question. */
#offer-v2 .ov-swbook{display:inline-flex;align-items:center;gap:9px;height:38px;padding:0 14px;margin:0;border:1.5px solid var(--offer-accent);border-radius:999px;background:var(--offer-panel);color:var(--offer-accent);font-family:inherit;cursor:pointer;flex:0 0 auto;white-space:nowrap;transition:background .14s ease}
#offer-v2 .ov-swbook:hover{background:var(--bone);border-color:var(--cognac);transform:translateY(-1px)}
#offer-v2 .ov-swbook:active{transform:translateY(0)}
#offer-v2 .ic-book{width:20px;height:20px;flex:none;color:var(--cognac)}
#offer-v2 .ov-swbook-t b{font-size:12.5px;font-weight:600;letter-spacing:.01em}
#offer-v2 .ov-swbook-t i{font-style:normal;font-size:11px;color:var(--ash);line-height:1.35}
/* Popup. Reuses .swmag-copy so swatchLead() drives it unchanged. */
.swmod[hidden]{display:none}
.swmod{position:fixed;inset:0;z-index:9000;display:flex;align-items:center;justify-content:center;padding:20px}
.swmod-back{position:absolute;inset:0;background:rgba(20,7,10,.72)}
.swmod-card{position:relative;max-width:680px;width:100%;max-height:90vh;overflow-y:auto;display:grid;grid-template-columns:200px minmax(0,1fr);gap:26px;align-items:center;background:var(--bordeaux,#280D13);border:1px solid var(--gold);border-radius:16px;padding:30px 28px}
.swmod-x{position:absolute;top:10px;right:14px;background:none;border:none;color:var(--champagne);font-size:26px;line-height:1;cursor:pointer;padding:4px 8px}
.swmod-x:hover{color:#fff}
.swmod .swmag-form{display:grid;gap:10px;margin-top:16px}
.swmod .swmag-copy h2{margin:6px 0 10px}
.swmod-cover img{width:100%;height:auto;display:block;border-radius:6px;box-shadow:0 18px 40px rgba(0,0,0,.45)}
/* One screen, no scrolling: cover and type both come down hard on phones. */
@media(max-width:640px){
 .swmod{padding:12px}
 .swmod-card{grid-template-columns:1fr;gap:12px;padding:20px 16px;max-height:calc(100vh - 24px);max-height:calc(100dvh - 24px)}
 .swmod-cover{max-width:104px;margin:0 auto}
 .swmod .eyebrow{font-size:9.5px}
 .swmod .swmag-copy h2{font-size:22px;line-height:1.1;margin:2px 0 6px}
 .swmod .swmag-copy > p{font-size:13px;line-height:1.4;margin:0}
 .swmod .swmag-form{gap:8px;margin-top:12px}
 .swmod .swmag-form input{padding:11px 12px;font-size:14px}
 .swmod .swmag-form .btn-cat{padding:12px}
 .swmod .swmag-note{font-size:10.5px;line-height:1.35;margin-top:8px}
 .swmod-x{top:4px;right:8px}
}
/* Chat launcher rides above the sticky buy bar, off the bar's measured height. */
html .rw{bottom:calc(14px + var(--stickbar,0px));transition:bottom .18s ease}
#offer-v2 .ic-dye{width:15px;height:15px;flex:none;margin-top:1px;color:var(--cognac)}
#offer-v2 svg *{vector-effect:non-scaling-stroke}
/* Price sits with the title, the way the category does it. */
#offer-v2 .ov-headprice{display:flex;align-items:baseline;gap:12px;flex-wrap:wrap;margin-top:14px}
#offer-v2 .ov-headprice s{font-size:17px;color:var(--ash)}
#offer-v2 .ov-headprice b{font-size:33px;font-weight:700;letter-spacing:-.022em;color:var(--ink)}
#offer-v2 .ov-headsave{font-size:11px;font-weight:700;letter-spacing:.09em;text-transform:uppercase;color:var(--paper);background:var(--offer-accent);padding:5px 10px;border-radius:999px;white-space:nowrap}
#offer-v2 .ov-headfine{margin:6px 0 0;font-size:12.5px;color:var(--ash)}
/* Ladder step for the visitor who is not buying today. */
#offer-v2 .ov-cta2{width:100%;margin-top:10px;border:1.5px solid var(--offer-accent);border-radius:999px;background:transparent;color:var(--offer-accent);padding:13px;font-family:inherit;font-size:12px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;cursor:pointer;transition:background .15s,color .15s}
#offer-v2 .ov-cta2:hover{background:var(--offer-accent);color:var(--paper)}
#offer-v2 .ov-cta2-note{margin:8px 0 0;font-size:11.5px;color:var(--ash);text-align:center}
/* Swatch row: bottom-aligned so the book stands on the same line as the hides. */
/* Collapsed swatch row: one line, bottom-aligned, book standing on the same baseline. */
#offer-v2 .ov-swatches:not(.all){display:flex;align-items:flex-end;flex-wrap:nowrap;gap:8px}
#offer-v2 .ov-swatches:not(.all) .ov-swatch{width:30px;height:30px;flex:0 0 30px;aspect-ratio:auto}
#offer-v2 .ov-swatches:not(.all) .ov-sw-rest{width:30px;height:30px;flex:0 0 30px;font-size:10px}
#offer-v2 .ov-sw-rest{display:flex;align-items:center;justify-content:center;font-size:11px;color:var(--ash);border:1px dashed var(--gold);background:transparent;font-variant-numeric:tabular-nums}
#offer-v2 .ov-swbook{display:inline-flex;align-items:center;gap:9px;height:40px;padding:0 15px;margin:0 0 0 4px;border:1.5px solid var(--offer-accent);border-radius:999px;background:var(--offer-panel);color:var(--offer-accent);font-family:inherit;cursor:pointer;flex:none;transition:background .14s ease}
#offer-v2 .ov-swbook:hover{background:var(--bone)}
#offer-v2 .ov-swbook b{font-size:11px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;white-space:nowrap}
#offer-v2 .ic-book{width:19px;height:19px;flex:none}
/* CTA block — price of the decision, then the facts that close it. */
#offer-v2 .ov-shipline{margin:11px 0 0;text-align:center;font-size:12.5px;color:var(--ash)}
#offer-v2 .ov-shipline b{color:var(--ink);font-weight:700}
#offer-v2 .ov-dims{margin-top:16px}
#offer-v2 .ov-dims div{display:flex;justify-content:space-between;gap:12px;padding:8px 0;border-bottom:1px solid var(--offer-line);font-size:12.5px}
#offer-v2 .ov-dims div:first-child{border-top:1px solid var(--offer-line)}
#offer-v2 .ov-dims span:first-child{color:var(--ash)}
#offer-v2 .ov-dims span:last-child{font-variant-numeric:tabular-nums;color:var(--ink)}
#offer-v2 [data-dq-slot] .dq{margin-top:16px}
/* Price line — centred, not baseline, so all three sit level. */
#offer-v2 .ov-headprice{align-items:center;gap:12px}
#offer-v2 .ov-headprice s{font-size:19px}
#offer-v2 .ov-headfine small{display:block;font-size:11.5px;margin-top:2px}
@media(max-width:520px){
  /* Keep all six hides, the count and the book on one line on a phone. */
  #offer-v2 .ov-swatches:not(.all){gap:6px}
  #offer-v2 .ov-swatches:not(.all) .ov-swatch,
  #offer-v2 .ov-swatches:not(.all) .ov-sw-rest{width:26px;height:26px;flex:0 0 26px}
  #offer-v2 .ov-swatches:not(.all) .ov-sw-rest{font-size:9.5px}
  #offer-v2 .ov-swbook{height:34px;padding:0 10px;gap:6px}
  #offer-v2 .ov-swbook b{font-size:9.5px;letter-spacing:.06em}
  #offer-v2 .ic-book{width:16px;height:16px}
}
#offer-v2 .ov-lane-top,#offer-v2 .ov-ship,#offer-v2 .ov-lane-money{display:flex;align-items:center;gap:12px}
#offer-v2 .ov-radio{width:19px;height:19px;border:1.5px solid var(--ash);border-radius:50%;display:block;flex:none}
#offer-v2 .on .ov-radio{border:5.5px solid var(--offer-accent)}
#offer-v2 .ov-lane-name{font-size:15px;font-weight:700;letter-spacing:.11em;text-transform:uppercase;color:var(--ink)}
#offer-v2 .ov-ship{padding-left:31px;margin:11px 0 13px;color:var(--ash);font-size:13.5px}
#offer-v2 .ov-ship svg{width:18px;height:18px;color:var(--offer-accent)}
#offer-v2 .ov-ship b{color:var(--ink);font-weight:700}
#offer-v2 .ov-lane-money{padding-left:31px;justify-content:space-between;gap:18px}
#offer-v2 .ov-lane-price{font-size:33px;font-weight:700;color:var(--ink);letter-spacing:-.018em;line-height:1}
#offer-v2 .ov-lane-price s{font-size:15px;color:var(--ash);font-weight:400;margin-right:10px;letter-spacing:0}
/* callout: a proper block, not a chip */
#offer-v2 .ov-callout{flex:none;min-width:112px;display:flex;flex-direction:column;align-items:center;gap:2px;background:var(--offer-accent);color:var(--paper);border-radius:11px;padding:9px 16px 10px;text-align:center;font-size:10px;font-weight:500;letter-spacing:.16em;text-transform:uppercase;line-height:1}
#offer-v2 .ov-callout b{display:block;font-size:20px;font-weight:700;letter-spacing:-.01em;text-transform:none;line-height:1.15}
#offer-v2 .ov-callout.plus{background:transparent;border:1.5px solid var(--gold);color:var(--cognac)}
#offer-v2 .ov-callout.plus b{color:var(--ink)}
#offer-v2 .ov-lane-why{display:block;padding-left:31px;margin-top:16px;color:var(--ash);font-size:13px;line-height:1.55;max-width:52ch}
#offer-v2 .ov-lane-why b{color:var(--ink);font-weight:500}
/* Was a lane card (border, fill, 17px padding) carrying one line of text, which read as a heavy
   panel for a footnote. No container: it sits with the finance line as a second quiet fact. */
#offer-v2 .ov-delivery{display:flex;align-items:center;gap:8px;margin-top:8px;padding:0;border:0;background:none;font-size:12.5px;color:var(--ash)}
#offer-v2 .ov-delivery b{color:var(--ink);font-weight:700}#offer-v2 .ov-delivery svg{width:15px;height:15px;stroke-width:1.4;flex:none;color:var(--cognac)}
#offer-v2 .ov-delivery svg *{vector-effect:non-scaling-stroke}#offer-v2 .ov-delivery b{color:var(--ink)}
#offer-v2 .ov-hide-row{display:flex;gap:12px;align-items:center;margin-bottom:10px}#offer-v2 .ov-macro{width:44px;height:44px;border-radius:50%;border:1px solid var(--gold);background:var(--offer-panel);overflow:hidden;flex:none}#offer-v2 .ov-macro img{width:100%;height:100%;object-fit:cover}#offer-v2 .ov-hide-label{font-size:13px;color:var(--ash)}#offer-v2 .ov-hide-label b{color:var(--ink)}#offer-v2 .ov-swatches{position:relative;display:grid;grid-template-columns:repeat(10,1fr);gap:7px}/* No position:relative here on purpose. The hover card is a child of the swatch, so a positioned
   swatch would make it anchor to a 38px circle and then need per-position nth-child clamps to stay
   inside the column. Anchored to .ov-swatches instead it always opens at the row's left edge and
   can never leave the container, in either the six-swatch or the all-thirty state. */
#offer-v2 .ov-swatch{aspect-ratio:1;border-radius:50%;border:1px solid var(--offer-line);background-size:cover;background-position:center}
/* Expanded state was a 10-column 1fr grid. 1fr means minmax(auto,1fr), and auto floors each track
   at the item's min-content, which the nested preview markup inflated to 136px in a 447px column:
   thirty swatches at 137px each, overflowing their own row. Fixed 38px circles on a wrapping flex
   row cannot do that, and match how the collapsed row already behaves. */
#offer-v2 .ov-swatches.all{display:flex;flex-wrap:wrap;gap:9px}
#offer-v2 .ov-swatches.all .ov-swatch{width:38px;height:38px;flex:0 0 38px;aspect-ratio:auto}#offer-v2 .ov-swatch.on{outline:2px solid var(--offer-accent);outline-offset:2px}/* Leather details and the swatch book sit as a pair on one line under the swatches, so the two
   ways of learning about the leather read as one group rather than scattered controls. */
#offer-v2 .ov-hide-actions{display:flex;align-items:center;gap:16px;flex-wrap:wrap;margin-top:14px}
#offer-v2 .ov-hide-actions .ov-swbook{display:inline-flex;align-items:center;gap:8px;height:36px;padding:0 14px;margin:0;border:1.5px solid var(--offer-accent);border-radius:999px;background:var(--offer-panel);color:var(--offer-accent);font-family:inherit;cursor:pointer;flex:none}
#offer-v2 .ov-hide-actions .ov-swbook b{font-size:11px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;white-space:nowrap}
#offer-v2 .ov-hide-actions .ov-swbook svg{width:17px;height:17px;stroke-width:1.25;flex:none}
#offer-v2 .ov-leather-link{display:inline-block;margin-top:0;padding:0;background:none;border:0;cursor:pointer;font:inherit;font-size:12px;color:var(--cognac);text-decoration:underline;text-underline-offset:3px}
/* In the chosen-hide state this link sits inline right after the Download pill, and measured flush
   against it at a 0px gap, reading as one stuck-together control. Only that arrangement needs the
   spacing, hence the adjacent-sibling scope: in the picker-open state the link follows .ov-swatches
   on its own line and already has room. */
#offer-v2 .ov-hide-done + .ov-swbook,
#offer-v2 .ov-swbook + .ov-leather-link{vertical-align:middle}
#offer-v2 .ov-swbook + .ov-leather-link{margin-left:16px;margin-top:0}
/* Same 0px-gap collision as the Download pill, this time in the all-hides state where the link is
   immediately followed by "Show the six most picked" and the two read as one run of text. */
#offer-v2 .ov-leather-link + .ov-more{margin-left:16px}#offer-v2 .ov-dye{display:flex;align-items:flex-start;gap:9px;border-left:1px solid var(--gold);padding-left:12px;margin-top:10px;color:var(--ash);font-size:12px;line-height:1.5}
/* Sits with the dye-run note, at the same weight. Deliberately not a tooltip, not a modal and
   not smaller than the body text: it is the one place we tell someone what the image is. */
#offer-v2 .ov-accuracy{border-left:1px solid var(--gold);padding-left:12px;margin-top:10px;color:var(--ash);font-size:12px;line-height:1.5}
#offer-v2 .ov-hide-done{display:flex;align-items:center;gap:13px;border:1px solid var(--offer-line);border-radius:12px;background:var(--offer-panel);padding:10px 14px}
#offer-v2 .ov-macro.sm{width:38px;height:38px}
#offer-v2 .ov-hide-done .ov-hide-label{flex:1;line-height:1.35}
#offer-v2 .ov-hide-done .eyebrow{display:block;font-size:10px;letter-spacing:.18em;color:var(--cognac)}
#offer-v2 .ov-hide-change{background:none;border:0;cursor:pointer;font-size:12px;color:var(--cognac);text-decoration:underline;text-underline-offset:3px}
#offer-v2 .ov-swatches:not(.all){grid-template-columns:repeat(7,1fr)}
#offer-v2 .ov-sw-rest{display:grid;place-items:center;font-size:11px;font-weight:700;color:var(--ink);background:var(--offer-panel);border:1px dashed rgba(40,13,19,.3)}
#offer-v2 .ov-more{display:inline-block;margin-top:10px;background:none;border:0;cursor:pointer;padding:0;font-size:12px;color:var(--cognac);text-decoration:underline;text-underline-offset:3px}

/* --offer-* are declared on #offer-v2, and this modal is appended to the page body OUTSIDE it, so
   those variables resolve to the empty string here and any colour built from them renders
   transparent. Measured: the card came out rgba(0,0,0,0) with the product photo showing through
   the copy. Global :root vars, or the literal the offer var holds, are the only safe values. */
.ovlmod[hidden]{display:none}.ovlmod{position:fixed;inset:0;z-index:9000;display:flex;align-items:center;justify-content:center;padding:20px}.ovlmod-back{position:absolute;inset:0;background:rgba(20,7,10,.72)}.ovlmod-card{position:relative;width:min(520px,100%);max-height:calc(100vh - 40px);max-height:calc(100dvh - 40px);overflow-y:auto;background:var(--bone);border:1px solid var(--gold);border-radius:14px;color:var(--ink)}.ovlmod-x{position:absolute;z-index:1;top:8px;right:10px;padding:4px 8px;border:0;background:var(--bone);color:#5C1B29;font-size:26px;line-height:1;cursor:pointer}.ovlmod-image{display:block;width:100%;height:220px;object-fit:cover}.ovlmod-copy{padding:22px}.ovlmod-copy h2{margin:0 0 7px;font-size:28px;line-height:1.1}.ovlmod-copy h2 span{color:var(--ash);font-weight:400}.ovlmod-copy p{margin:4px 0 18px;font-size:13px;line-height:1.55;color:var(--ash)}.ovlmod-copy .eyebrow{display:block;color:var(--cognac);font-size:10px;letter-spacing:.18em}.ovlmod-copy .ovlmod-desc{margin:0 0 20px;color:var(--ash);font-size:13px}.ovlmod-swatch{display:flex;align-items:center;justify-content:center;gap:10px;width:100%;margin-top:2px;border:1px solid var(--gold);border-radius:999px;background:#5C1B29;color:var(--paper);padding:14px;font-family:inherit;font-size:12px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;cursor:pointer}.ovlmod-swatch svg{width:18px;height:18px;flex:none;stroke-width:1.25}.ovlmod-swatch svg *{vector-effect:non-scaling-stroke}@media(max-width:520px){.ovlmod{padding:12px}.ovlmod-card{max-height:calc(100vh - 24px);max-height:calc(100dvh - 24px)}.ovlmod-image{height:190px}.ovlmod-copy{padding:18px}.ovlmod-copy h2{font-size:25px}}

#offer-v2 .ov-saving{border:1px solid var(--gold);border-radius:14px;background:linear-gradient(180deg,rgba(195,162,78,.11),rgba(195,162,78,.04));padding:16px 17px 15px}
#offer-v2 .ov-now-next{display:flex;align-items:stretch;gap:12px}
#offer-v2 .ov-now-next>div{flex:1;min-width:0;display:flex;flex-direction:column;gap:2px;padding:13px 15px;border-radius:12px;background:rgba(244,236,219,.55);border:1px solid rgba(40,13,19,.09)}
#offer-v2 .ov-now-next>b{align-self:center;color:var(--gold);font-size:19px;font-weight:400}
#offer-v2 .ov-saving-label{font-size:10px;font-weight:700;text-transform:uppercase;letter-spacing:.17em;color:var(--ash);display:block}
#offer-v2 .ov-saving-value{display:block;font-size:27px;font-weight:700;letter-spacing:-.015em;color:var(--ink);line-height:1.15}
#offer-v2 .ov-saving-rate{font-size:11.5px;color:var(--ash)}
#offer-v2 .ov-next{position:relative;background:var(--offer-accent) !important;border-color:var(--offer-accent) !important;box-shadow:0 12px 26px -16px rgba(92,27,41,.85)}
#offer-v2 .ov-next .ov-saving-label{color:var(--champagne)}
#offer-v2 .ov-next .ov-saving-value{color:var(--paper)}
#offer-v2 .ov-next .ov-saving-rate{color:rgba(244,236,219,.72)}
#offer-v2 .ov-next .ov-uplift{position:absolute;top:-9px;right:11px;background:var(--gold);color:var(--ink);font-size:11px;font-weight:700;padding:3px 9px;border-radius:999px;box-shadow:0 3px 10px -3px rgba(40,13,19,.5)}
#offer-v2 .ov-rungs{display:flex;justify-content:space-between;margin:15px 4px 0}
#offer-v2 .ov-rung{display:grid;justify-items:center;gap:4px;color:var(--ash);font-size:10.5px;font-weight:700}
#offer-v2 .ov-rung i{width:11px;height:11px;border-radius:50%;background:var(--paper);border:1.5px solid rgba(40,13,19,.2)}
#offer-v2 .ov-rung.on i{background:var(--gold);border-color:var(--cognac)}
#offer-v2 .ov-rung.next i{background:var(--offer-accent);border-color:var(--offer-accent);transform:scale(1.25)}
#offer-v2 .ov-quick-label{display:block;margin-top:14px;padding-top:12px;border-top:1px dashed rgba(195,162,78,.5);font-size:10px;font-weight:700;letter-spacing:.17em;text-transform:uppercase;color:var(--cognac)}
#offer-v2 .ov-quick{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;margin-top:9px}
#offer-v2 .ov-quick button{display:flex;flex-direction:column;align-items:center;gap:3px;border:1px solid var(--offer-line);border-radius:13px;background:var(--paper);padding:13px 9px 11px;cursor:pointer;transition:.22s cubic-bezier(.23,1,.32,1);box-shadow:0 1px 0 rgba(40,13,19,.05)}
#offer-v2 .ov-quick button:hover{border-color:var(--offer-accent);background:#fff8ec;transform:translateY(-2px);box-shadow:0 10px 22px -14px rgba(40,13,19,.55)}
#offer-v2 .ov-quick button:active{transform:translateY(0) scale(.985)}
#offer-v2 .ov-quick button svg.ic{width:44px;height:19px;color:var(--ink);opacity:.6}
#offer-v2 .ov-quick button:hover svg.ic{color:var(--offer-accent);opacity:1}
#offer-v2 .ov-quick button b{font-size:10.5px;font-weight:700;letter-spacing:.11em;text-transform:uppercase;color:var(--ash);margin-top:3px}
#offer-v2 .ov-quick button small{font-size:15px;font-weight:700;color:var(--ink);letter-spacing:-.01em}
/* the saving is a caption now; the ACTION is the button below it */
#offer-v2 .ov-quick button .ov-uplift{font-size:10.5px;font-weight:500;color:var(--cognac);background:none;padding:0;margin:1px 0 0;white-space:nowrap}
#offer-v2 .ov-addbtn{display:flex;align-items:center;justify-content:center;gap:5px;width:100%;margin-top:9px;padding:8px 6px;border-radius:999px;background:var(--offer-accent);color:var(--paper);font-size:11.5px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;transition:.22s cubic-bezier(.23,1,.32,1)}
#offer-v2 .ov-addbtn svg{width:12px;height:12px;flex:none}
#offer-v2 .ov-quick button:hover .ov-addbtn{background:#4a1521}

@media(max-width:640px){#offer-v2 .ov-quick{grid-template-columns:1fr 1fr}}
#offer-v2 .ov-stick{display:none}
@media(max-width:1040px){
  /* Stacked lanes get tighter: this is the biggest block on a phone. */
  #offer-v2 .ov-lane{padding:30px 16px 15px;margin-top:11px}
  #offer-v2 .ov-lane-name{font-size:14px}
  #offer-v2 .ov-ship{margin:8px 0 10px;padding-left:31px;font-size:13px}
  #offer-v2 .ov-lane-money{padding-left:31px;gap:12px}
  #offer-v2 .ov-lane-price{font-size:29px}
  #offer-v2 .ov-callout{min-width:102px;padding:8px 13px 9px}
  #offer-v2 .ov-callout b{font-size:18px}
  #offer-v2 .ov-lane-why{margin-top:15px;padding-left:31px;font-size:12.5px;line-height:1.48}
}
@media(max-width:1040px){
  #offer-v2 .ov-stick{position:fixed;left:0;right:0;bottom:0;z-index:40;display:flex;align-items:center;gap:14px;padding:11px 16px calc(11px + env(safe-area-inset-bottom));background:var(--ink);border-top:1px solid rgba(195,162,78,.35)}
  #offer-v2 .ov-stick-meta{font-size:11.5px;color:rgba(244,236,219,.7);line-height:1.3;flex:1;min-width:0}
  #offer-v2 .ov-stick-total{font-size:19px;font-weight:700;color:var(--paper);white-space:nowrap}
  #offer-v2 .ov-stick .ov-cta{width:auto;flex:none;margin:0;padding:12px 20px;font-size:12.5px}
  body{padding-bottom:78px}
}
#offer-v2 .ov-summary{border:1px solid var(--gold);border-radius:14px;background:var(--offer-panel);padding:16px}#offer-v2 .ov-summary-head{font-size:10px;letter-spacing:.18em;text-transform:uppercase;color:var(--cognac);padding-bottom:9px;border-bottom:1px solid var(--gold)}#offer-v2 .ov-line{display:flex;align-items:center;gap:10px;padding:9px 0;border-bottom:1px solid var(--offer-line);font-size:13px}#offer-v2 .ov-line svg{width:34px;height:15px;flex:none}#offer-v2 .ov-line-name{flex:1;color:var(--ink);line-height:1.25}#offer-v2 .ov-step{display:flex;border:1px solid var(--offer-line);border-radius:999px;overflow:hidden;background:var(--paper)}#offer-v2 .ov-step button{width:25px;height:25px;font-size:16px}#offer-v2 .ov-step button:disabled{opacity:.3}#offer-v2 .ov-step span{min-width:20px;text-align:center;line-height:25px;font-size:12px;color:var(--ink)}#offer-v2 .ov-total{display:flex;justify-content:space-between;align-items:baseline;padding-top:11px;color:var(--ink)}#offer-v2 .ov-total b{font-size:26px}#offer-v2 .ov-fin{font-size:12px;color:var(--ash);text-align:right;margin-top:3px}#offer-v2 .ov-fin-call{color:var(--cognac)}#offer-v2 .ov-cta{width:100%;margin-top:14px;border:1px solid var(--gold);border-radius:999px;background:var(--offer-accent);color:var(--paper);padding:16px;font-size:13px;font-weight:700;letter-spacing:.08em;text-transform:uppercase}#offer-v2 .ov-trust{display:flex;flex-wrap:wrap;gap:14px;margin-top:12px;font-size:11px;color:var(--ash)}#offer-v2 .ov-trust span:before{content:'· ';color:var(--gold)}#offer-v2 .ov-dq{margin-top:20px}
@media(max-width:560px){#offer-v2 .ov-quick{grid-template-columns:1fr 1fr}#offer-v2 .ov-swatches{grid-template-columns:repeat(8,1fr)}}
/* Mobile is the desktop buy box at a narrower width, not a different structure: same wrapping
   swatch grid, same 38px hides, same section rhythm. The only concession is the section header,
   where the label and the hint genuinely cannot share a 343px line at desktop sizing. */
@media(max-width:560px){
  /* 375px gives the column 343px. The label alone is ~240px at desktop tracking, so the label and
     the hint cannot share a line the way they do at 447px. Keep the label unbroken and let the
     hint wrap beside it, which preserves the desktop arrangement rather than restacking it. */
  /* Reorder, do not restack. Castlery runs breadcrumb, title, stars, price as one tight run;
     ours had the stars alone above a rule, then a category label, then the title, which is what
     made that band read as dead space. Flex order does it without touching the markup. */
  /* The book button now shares the swatch line. Measured: the row is 347px, five hides plus the
     reveal ate 273 leaving 74, and the button is 126. Four hides frees 112, and trimming the
     padding brings the button under that. */
  #offer-v2 .ov-swbook{height:38px;padding:0 11px;gap:7px;margin-left:auto}
  #offer-v2 .ov-swbook b{font-size:9.5px;letter-spacing:.05em}
  #offer-v2 .ov-swbook svg{width:15px;height:15px}
  #offer-v2 .ov-swatches.all{align-items:center}
  #offer-v2 .ov-section{margin-top:15px}
  #offer-v2 .ov-identity{display:flex;flex-direction:column}
  #offer-v2 .ov-eye{order:1;margin-top:0;font-size:9.5px;letter-spacing:.15em;color:var(--ash)}
  #offer-v2 h1{order:2;margin-top:7px}
  #offer-v2 .ov-revtop{order:3;border-bottom:0;padding-bottom:0;margin-top:10px}
  #offer-v2 .ov-money{order:4;margin-top:12px}
  #offer-v2 .ov-headprice b{font-size:27px}
  /* Padding tightened for the phone: the page gutter, the delivery card and the gaps between
     sections were all set for a 447px desktop column. */
  .wrap{padding-left:14px;padding-right:14px}
  /* .pdp is a grid with a 30px row gap, which on a phone is dead space between the last
     gallery dot and the reviews line. */
  .pdp{row-gap:14px;padding-bottom:22px}
  .pdp-acc{margin-bottom:0}
  .pdp-reviews-full{margin-top:0}
  #offer-v2 .ov-section{margin-top:18px}
  #offer-v2 .ov-identity{margin-bottom:18px}
  .dq{padding:16px 15px 15px}
  .dq-facts{margin-top:11px;gap:6px}
  #offer-v2 .ov-sect-h{gap:12px;align-items:flex-start}
  #offer-v2 .ov-sect-h .eyebrow{white-space:nowrap;letter-spacing:.18em}
  #offer-v2 .ov-sect-h .ov-hint{font-size:10.5px;text-align:right;line-height:1.35}
}#offer-v2 .ov-saving-value{font-size:21px}}