/* ============================================================
   GoGurll storefront — the 2026 theme.

   The design is "GoGurll — Sample Storefront" (owner, 2026-09-28): warm cream
   ground, GoGurll red, charcoal ink, Bricolage Grotesque display type with an
   Instrument Serif italic accent word, Poppins for everything read, pill
   buttons and soft 12/20/28px radii, plus a dark mode.

   This file styles ONLY what a shopper sees — the shop, the account screens
   and the sign-in screens. The admin and seller panels load style.css instead
   (views/partials/head.ejs chooses by the `panel` flag), so nothing here can
   reach a panel and nothing in style.css can reach the shop.
   ============================================================ */

:root{
  --red:#DF1A22; --red-dk:#B4141B; --red-text:#BE1219; --wine:#6C0E14; --wine-2:#7F1319;
  --ink:#262528; --bg:#FBF6F4; --surface:#FFFFFF; --blush:#F4E7E5; --blush-2:#F9E3E0;
  --muted:#58595B; --line:#E7D8D5; --green:#128C4A; --gold:#FFD166;
  --onred:#FFFFFF; --band:#262528; --band-ink:#FFFFFF; --band-muted:#CFC3C1;
  --ok:#0F7A40; --ok-soft:#E2F3E8; --warn:#8A5A00; --warn-soft:#FBEFD5;
  --display:'Bricolage Grotesque', 'Arial Narrow', system-ui, sans-serif;
  --serif:'Instrument Serif', Georgia, 'Times New Roman', serif;
  --body:'Poppins', 'Lato', system-ui, -apple-system, 'Segoe UI', sans-serif;
  --ml:'Manjari', 'Noto Sans Malayalam', sans-serif;
  --r-sm:12px; --r-md:20px; --r-lg:28px; --pad:clamp(16px, 4vw, 56px);
  --hdr-h:76px;
  --ease:cubic-bezier(.2,.7,.2,1);
  color-scheme: light;

  /* The names the templates used before this theme, pointed at the new
     palette. Inline styles written against them (and the Storefront Editor's
     live preview) keep resolving to something that belongs here. */
  --pink:var(--red); --pink-deep:var(--red-dk); --pink-soft:var(--blush);
  --coral:var(--red); --coral-soft:var(--blush-2);
  --ink-soft:var(--muted); --faint:#A9A0A1; --bg-soft:var(--blush); --bg-bar:var(--blush);
  --line-dark:var(--line); --night:#262528; --plum:var(--ink); --plum-deep:var(--ink);
  --gold-brand:var(--red); --green-soft:var(--ok-soft); --amber:var(--warn); --amber-soft:var(--warn-soft);
  --blue:#23608f; --blue-soft:#e3eef8; --violet:#55418a; --violet-soft:#ece7f7;
  --radius:var(--r-sm); --radius-hair:8px;
  --font:var(--body); --font-display:var(--display); --font-accent:var(--serif); --font-ar:var(--ml);
  --shadow:0 12px 30px -18px rgba(38,37,40,.35); --shadow-sm:0 4px 14px -8px rgba(38,37,40,.25);
}
:root[data-theme="dark"]{
  --ink:#F4F2F1; --bg:#171618; --surface:#232224; --blush:#2E2C2F; --blush-2:#393639;
  --muted:#BFBCBC; --line:#38363A; --red-text:#FF6A72; --band:#0F0B0C; color-scheme: dark;
  --ok:#5FD08F; --ok-soft:#1C3326; --warn:#F1C36B; --warn-soft:#3A2F17; --faint:#7D7879;
}

/* ---------- base ---------- */
*{box-sizing:border-box}
[hidden]{display:none!important}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{margin:0;background:var(--bg);color:var(--ink);font-family:var(--body);font-size:16px;line-height:1.55;overflow-x:hidden}
html[lang="ml"] body{font-family:var(--ml),var(--body)}
img{max-width:100%;display:block}
a{color:var(--red-text)}
button,input,select,textarea{font:inherit;color:inherit}
button{cursor:pointer}
h1,h2,h3,h4{line-height:1.15}
:focus-visible{outline:2px solid var(--red);outline-offset:3px;border-radius:6px}
body,.hdr,.toolbar,.drawer,.search,.sheet,.summary,.fs,.box,.storebox,.card-media{transition:background-color .35s ease,color .35s ease,border-color .35s ease}
::selection{background:var(--red);color:#fff}
.sr,.visually-hidden{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.skip:focus{position:fixed!important;left:12px;top:12px;width:auto;height:auto;clip:auto;z-index:100;background:var(--ink);color:var(--bg);padding:10px 16px;border-radius:999px;text-decoration:none;font-weight:700}
.wrap{max-width:1440px;margin:0 auto;padding-inline:var(--pad)}
.wrap.narrow{max-width:880px}
.wrap.tight{max-width:760px}
.it{font-family:var(--serif);font-style:italic;font-weight:400;letter-spacing:0}
.accent{color:var(--red)}
.h-xl{font-family:var(--display);font-weight:800;letter-spacing:-.04em;line-height:.95;font-size:clamp(34px,5.4vw,64px);margin:0}
.h-lg{font-family:var(--display);font-weight:800;letter-spacing:-.035em;line-height:1;font-size:clamp(28px,3.6vw,44px);margin:0}
.h-md{font-family:var(--display);font-weight:800;letter-spacing:-.025em;line-height:1.05;font-size:clamp(22px,2.4vw,30px);margin:0}
.h-xl .it,.h-lg .it,.h-md .it{letter-spacing:-.01em}
.kicker{font-size:13px;font-weight:700;color:var(--red-text);margin:0 0 6px}
.lede{color:var(--muted);max-width:52ch;margin:0}
.muted{color:var(--muted)}
.sec{padding-top:clamp(56px,8vw,110px)}
.sec.sm{padding-top:clamp(32px,5vw,64px)}
.sec-head{display:flex;justify-content:space-between;align-items:flex-end;gap:20px;margin-bottom:clamp(20px,3vw,36px);flex-wrap:wrap}
main{min-height:70vh;display:block}
.page{animation:pageIn .45s var(--ease) both}
@keyframes pageIn{from{opacity:0;transform:translateY(14px)}}

/* ---------- buttons, links, chips ---------- */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:50px;padding:0 24px;border-radius:999px;border:1.5px solid transparent;background:var(--red);color:#fff;font-weight:700;font-size:15px;line-height:1.1;text-decoration:none;transition:background-color .2s,color .2s,transform .2s,border-color .2s;white-space:nowrap;cursor:pointer}
.btn:hover{background:var(--red-dk);color:#fff}
.btn:active{transform:scale(.98)}
.btn svg{flex-shrink:0}
.btn-red{background:var(--red);color:#fff}.btn-red:hover{background:var(--red-dk);color:#fff}
.btn-ink{background:var(--ink);color:var(--bg)}.btn-ink:hover{background:var(--red);color:#fff}
.btn-line,.btn.ghost{border-color:var(--ink);color:var(--ink);background:transparent}.btn-line:hover,.btn.ghost:hover{background:var(--ink);color:var(--bg)}
.btn-wa{background:var(--green);color:#fff}.btn-wa:hover{background:#0E743D;color:#fff}
.btn-white{background:#fff;color:#262528}.btn-white:hover{background:var(--blush-2);color:#262528}
.btn-plain{background:transparent;color:inherit;border-color:transparent;padding:0 8px}.btn-plain:hover{background:transparent;color:var(--red-text)}
.btn-block,.btn.wide{width:100%}
.btn.sm{min-height:40px;padding:0 16px;font-size:14px}
.btn.lg{min-height:58px;font-size:16px}
.btn[disabled],.btn.disabled{opacity:.5;cursor:not-allowed}
.btn .spin{display:inline-block}
.link{font-weight:700;display:inline-flex;align-items:center;min-height:44px;gap:6px;color:var(--ink);text-decoration:underline;text-underline-offset:4px;text-decoration-thickness:1.5px}
.link:hover{color:var(--red-text)}
.link svg{transition:transform .2s var(--ease)}.link:hover svg{transform:translateX(3px)}
.icon-btn{width:44px;height:44px;border-radius:999px;border:none;background:transparent;display:inline-flex;align-items:center;justify-content:center;color:var(--ink);position:relative;text-decoration:none;flex-shrink:0}
.icon-btn:hover{background:var(--blush)}
.icon-btn svg{width:22px;height:22px}
.chip{min-height:44px;padding:0 16px;border-radius:999px;border:1.5px solid var(--line);background:transparent;font-weight:700;font-size:14px;display:inline-flex;align-items:center;gap:6px;white-space:nowrap;text-decoration:none;color:var(--ink);transition:all .2s;cursor:pointer}
.chip:hover{border-color:var(--ink)}
.chip[aria-pressed="true"],.chip.on,.chip[aria-current="page"]{background:var(--ink);color:var(--bg);border-color:var(--ink)}
.chip svg{width:14px;height:14px}
.rail{display:flex;gap:10px;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none;padding-bottom:4px}
.rail::-webkit-scrollbar{display:none}
.rail>*{scroll-snap-align:start;flex-shrink:0}
.pill{display:inline-flex;align-items:center;gap:6px;font-size:12.5px;font-weight:700;background:var(--blush);color:var(--ink);padding:5px 12px;border-radius:999px;text-decoration:none}
.pill.red{background:var(--red);color:#fff}
.pill.ok{background:var(--ok-soft);color:var(--ok)}
.pill.warn{background:var(--warn-soft);color:var(--warn)}
.ic{width:46px;height:46px;border-radius:999px;background:var(--red);display:flex;align-items:center;justify-content:center;flex-shrink:0;color:#fff}
.ic svg{width:22px;height:22px}
.count{position:absolute;top:4px;right:2px;min-width:18px;height:18px;padding:0 5px;border-radius:999px;background:var(--red);color:#fff;font-size:11px;font-weight:700;display:flex;align-items:center;justify-content:center;line-height:1}
.count:empty{display:none}
.bump{animation:bump .5s var(--ease)}
@keyframes bump{40%{transform:scale(1.5)}}
.spin{width:18px;height:18px;border:2.5px solid rgba(255,255,255,.4);border-top-color:#fff;border-radius:99px;animation:spin .7s linear infinite}
@keyframes spin{to{transform:rotate(360deg)}}
.stars{display:inline-flex;gap:2px;vertical-align:middle}.stars svg{width:16px;height:16px;fill:var(--red)}
.stars svg.off{opacity:.25}

/* ---------- marquee strip ---------- */
.strip{background:var(--red);color:#fff;height:40px;display:flex;align-items:center;overflow:hidden}
.strip.ann-custom{background:var(--ann-bg,var(--red));color:var(--ann-tc,#fff)}
.marquee{display:flex;width:max-content;animation:scroll var(--marq-speed,34s) linear infinite}
.strip:hover .marquee{animation-play-state:paused}
.marquee span,.marquee a{font-family:var(--display);font-weight:600;font-size:14px;letter-spacing:.04em;display:flex;align-items:center;gap:20px;padding-right:20px;white-space:nowrap;color:inherit;text-decoration:none}
.marquee a:hover{text-decoration:underline}
.marquee svg{width:14px;height:14px;flex-shrink:0}
.marquee .dup{display:contents}
@keyframes scroll{to{transform:translateX(-50%)}}

/* ---------- header ---------- */
.hdr{position:sticky;top:0;z-index:40;background:color-mix(in srgb,var(--bg) 92%,transparent);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);border-bottom:1px solid var(--line)}
.hdr-in{min-height:var(--hdr-h);display:grid;grid-template-columns:auto minmax(0,1fr) auto;align-items:center;gap:16px}
.hdr-lead{display:flex;align-items:center;gap:2px}
.logo{display:flex;align-items:center;gap:8px;text-decoration:none;color:var(--ink)}
.logo img{height:46px;width:auto;display:block}
:root[data-theme="dark"] .hdr .logo img{filter:brightness(0) invert(1)}
.nav{display:flex;justify-content:center;gap:clamp(14px,2vw,28px);font-weight:600;font-size:15px;min-width:0;overflow:hidden}
.nav a{color:var(--ink);text-decoration:none;padding:8px 0;position:relative;white-space:nowrap}
.nav a::after{content:"";position:absolute;left:0;right:0;bottom:2px;height:2px;background:var(--red);transform:scaleX(0);transform-origin:left;transition:transform .25s var(--ease)}
.nav a:hover::after,.nav a[aria-current="page"]::after{transform:scaleX(1)}
.nav a.sale{color:var(--red-text)}
/* A shop's own menu can be longer than the design's eight links. When it does
   not fit beside the logo (measured in main.js, never guessed here) it takes a
   second row inside the same sticky header rather than being cut off.
   The first row keeps the one-row header's own height, so the logo and the
   icons sit exactly where they sit when the menu fits. Without it the grid's
   min-height covered BOTH rows together, the logo's row shrank to the logo
   itself, and the logo sat flush against the strip above it. */
.hdr.nav-2row .hdr-in{grid-template-columns:auto 1fr auto;grid-template-rows:var(--hdr-h) auto;row-gap:0}
/* --hdr-stick is the header's MEASURED height (main.js), for whatever sticks
   below it; --hdr-h is only the first row's, and falls back when no script ran. */
.hdr.nav-2row .nav{grid-column:1 / -1;grid-row:2;justify-content:flex-start;overflow-x:auto;scrollbar-width:none;padding-bottom:6px;gap:22px}
.hdr.nav-2row .nav::-webkit-scrollbar{display:none}
@media (min-width:1081px){.hdr.nav-2row .nav{justify-content:center;flex-wrap:wrap;row-gap:0}}
.hdr-actions{display:flex;align-items:center;justify-content:flex-end;gap:2px}
.theme-btn svg{transition:transform .5s var(--ease),opacity .3s}
.theme-btn .moon{position:absolute}
:root:not([data-theme="dark"]) .theme-btn .sun{opacity:0;transform:rotate(-90deg) scale(.5)}
:root[data-theme="dark"] .theme-btn .moon{opacity:0;transform:rotate(90deg) scale(.5)}
.only-m{display:none}
@media (max-width:1080px){
  :root{--hdr-h:62px}
  .nav{display:none!important}.only-m{display:inline-flex}.hide-m{display:none!important}
  .logo img{height:34px}
  .hdr-in{grid-template-columns:auto 1fr auto;gap:8px}
}

/* ---------- flash / toast ---------- */
.toast{position:fixed;left:50%;top:16px;z-index:80;transform:translate(-50%,-150%);background:#262528;color:#fff;border-radius:18px;width:max-content;max-width:min(92vw,520px);justify-content:space-between;padding:10px 12px 10px 18px;display:flex;align-items:center;gap:14px;font-weight:600;font-size:14.5px;transition:transform .4s var(--ease);box-shadow:0 20px 40px -20px rgba(0,0,0,.6)}
@media (max-width:640px){.toast{width:92vw}}
.toast.on{transform:translate(-50%,0)}
.toast a,.toast button{color:#fff;background:var(--red);border:none;border-radius:999px;padding:8px 14px;font-weight:700;text-decoration:none;white-space:nowrap}
.toast.flash{padding:14px 18px}
.toast.flash.error{background:var(--red-dk)}
.toast.flash.success::before{content:"";width:8px;height:8px;border-radius:99px;background:#5FD08F;flex-shrink:0}
.toast.flash.error::before{content:"!";width:22px;height:22px;border-radius:99px;background:#fff;color:var(--red-dk);display:flex;align-items:center;justify-content:center;font-weight:800;flex-shrink:0}
.fly{position:fixed;z-index:90;border-radius:14px;object-fit:cover;pointer-events:none}

/* ---------- overlays: scrim, drawers, search, sheet ---------- */
.scrim{position:fixed;inset:0;background:rgba(20,14,15,.5);z-index:60;opacity:0;visibility:hidden;transition:opacity .3s,visibility .3s}
.scrim.on{opacity:1;visibility:visible}
.drawer{position:fixed;top:0;right:0;bottom:0;width:min(440px,100%);background:var(--bg);z-index:61;transform:translateX(105%);transition:transform .4s var(--ease);display:flex;flex-direction:column;box-shadow:-20px 0 60px -30px rgba(0,0,0,.5);visibility:hidden}
.drawer.left{right:auto;left:0;transform:translateX(-105%)}
.drawer.on{transform:none;visibility:visible}
.dr-h{display:flex;justify-content:space-between;align-items:center;padding:14px 18px;border-bottom:1px solid var(--line);gap:10px}
.dr-h h2{margin:0;font-family:var(--display);font-size:22px}
.dr-h h2 small{font-family:var(--body);font-size:14px;font-weight:600;color:var(--muted)}
.dr-b{flex:1;overflow-y:auto;padding:4px 18px}
.dr-f{border-top:1px solid var(--line);padding:16px 18px calc(16px + env(safe-area-inset-bottom));display:flex;flex-direction:column;gap:10px}
.menu-links{display:flex;flex-direction:column}
.menu-links a{min-height:54px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--line);color:var(--ink);text-decoration:none;font-family:var(--display);font-weight:700;font-size:20px}
.menu-links a.sale{color:var(--red-text)}
.menu-links a.sm{font-family:var(--body);font-size:16px;font-weight:600;min-height:46px}
.menu-links a span{color:var(--muted);font-weight:400}
.menu-util{display:flex;flex-wrap:wrap;gap:8px;margin:18px 0}
.search{position:fixed;inset:0 0 auto 0;z-index:62;background:var(--bg);transform:translateY(-102%);transition:transform .4s var(--ease);max-height:100vh;overflow:auto;box-shadow:0 30px 60px -30px rgba(0,0,0,.4);visibility:hidden}
.search.on{transform:none;visibility:visible}
.search-bar{display:flex;align-items:center;gap:10px;height:76px;margin:0}
.search-bar input{flex:1;min-width:0;border:none;background:transparent;font-family:var(--display);font-weight:700;font-size:clamp(22px,3vw,34px);min-height:56px;color:var(--ink)}
.search-bar input:focus{outline:none}
.search-bar input::placeholder{color:var(--muted);opacity:.7}
.results{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:12px;padding:10px 0 30px}
.results>p{grid-column:1/-1;margin:0;color:var(--muted)}
.res{display:flex;gap:12px;align-items:center;text-decoration:none;color:var(--ink);padding:8px;border-radius:14px}
.res:hover,.res:focus-visible{background:var(--blush)}
.res img,.res .ph{width:56px;height:72px;object-fit:cover;object-position:top;border-radius:10px;background:var(--blush);flex-shrink:0}
.res b{display:block;font-weight:600}
.res small{color:var(--muted)}
.sheet{position:fixed;z-index:62;left:50%;top:50%;width:min(560px,calc(100% - 24px));max-height:calc(100vh - 40px);overflow:auto;background:var(--bg);border-radius:var(--r-lg);transform:translate(-50%,-46%) scale(.97);opacity:0;visibility:hidden;transition:all .3s var(--ease)}
.sheet.on{transform:translate(-50%,-50%);opacity:1;visibility:visible}
@media (max-width:640px){.sheet{top:auto;bottom:0;left:0;width:100%;border-radius:24px 24px 0 0;transform:translateY(100%);max-height:88vh}.sheet.on{transform:none}}
.sheet-in{padding:22px;display:flex;flex-direction:column;gap:16px;padding-bottom:calc(22px + env(safe-area-inset-bottom))}
.sheet-h{display:flex;justify-content:space-between;align-items:center;gap:10px}
.sheet-h h2{margin:0;font-family:var(--display);font-size:22px}

/* ---------- cart lines (drawer and bag page share them) ---------- */
.line{display:grid;grid-template-columns:110px minmax(0,1fr) auto;gap:16px;padding:18px 0;border-bottom:1px solid var(--line);animation:pageIn .35s var(--ease)}
.line>a>img,.line .ph{width:110px;aspect-ratio:3/4;object-fit:cover;object-position:top;border-radius:14px;background:var(--blush);display:block}
.line h3{margin:0;font-size:16.5px;font-weight:600;line-height:1.3}
.line h3 a{color:inherit;text-decoration:none}
.line h3 a:hover{text-decoration:underline}
.line .meta{color:var(--muted);font-size:14px;margin:2px 0 10px}
.line .right{display:flex;flex-direction:column;align-items:flex-end;justify-content:space-between;gap:8px}
.line .right b{font-family:var(--display);font-size:19px;white-space:nowrap}
.rm{background:none;border:none;color:var(--muted);text-decoration:underline;font-size:14px;min-height:44px;padding:0}
.rm:hover{color:var(--red-text)}
.out{animation:out .3s ease forwards}
@keyframes out{to{opacity:0;transform:translateX(30px)}}
.dr-b .line{grid-template-columns:80px minmax(0,1fr) auto}
.dr-b .line>a>img,.dr-b .line .ph{width:80px}
@media (max-width:560px){.line{grid-template-columns:88px minmax(0,1fr)}.line>a>img,.line .ph{width:88px}.line .right{grid-column:2;flex-direction:row;align-items:center}}
.qty{display:inline-flex;align-items:center;border:1.5px solid var(--line);border-radius:999px;background:var(--surface)}
.qty button{width:44px;height:44px;border:none;background:none;font-size:20px;font-weight:700;color:var(--ink);display:flex;align-items:center;justify-content:center}
.qty button:disabled{opacity:.35;cursor:not-allowed}
.qty output,.qty span,.qty input{min-width:28px;text-align:center;font-weight:800}
.qty input{width:44px;border:none;background:transparent;-moz-appearance:textfield;padding:0}
.qty input::-webkit-inner-spin-button,.qty input::-webkit-outer-spin-button{-webkit-appearance:none;margin:0}
.free-bar{background:var(--blush);border-radius:14px;padding:12px 14px;font-size:14px;font-weight:600;display:flex;gap:10px;align-items:center}
.free-bar svg{width:20px;height:20px;color:var(--red);flex-shrink:0}
.free-bar .track{flex:1 1 100%;height:6px;border-radius:99px;background:color-mix(in srgb,var(--red) 16%,transparent);overflow:hidden;margin-top:8px}
.free-bar .track i{display:block;height:100%;background:var(--red);border-radius:99px;transition:width .4s var(--ease)}
.free-bar.stack{flex-wrap:wrap}
.row{display:flex;justify-content:space-between;gap:12px;font-size:15px}
.row.total{font-family:var(--display);font-weight:800;font-size:22px;border-top:1px solid var(--line);padding-top:14px}
.row.save{color:var(--ok)}
.cart-opts{display:flex;gap:8px}
.cart-opts .chip{min-height:38px;padding:0 14px;font-size:13px}
.cart-opt-panel{display:flex;flex-direction:column;gap:8px}
.cart-opt-panel[hidden]{display:none}
.cart-opt-panel textarea,.cart-opt-panel input{width:100%;min-height:46px;border-radius:12px;border:1.5px solid var(--line);padding:10px 14px;background:var(--surface)}
.coupon{display:flex;gap:8px}
.coupon input{flex:1;min-width:0;min-height:46px;border-radius:12px;border:1.5px solid var(--line);padding:0 14px;background:var(--bg);text-transform:uppercase}
.msg-ok{color:var(--ok);font-size:13.5px;font-weight:600;margin:0}
.err,.msg-err{color:var(--red-text);font-size:13.5px;font-weight:600;margin:4px 0 0}
.err:empty,.msg-ok:empty,.msg-err:empty{display:none}
.mini{display:flex;gap:12px;align-items:center;font-size:14px}
.mini img,.mini .ph{width:52px;height:66px;object-fit:cover;object-position:top;border-radius:10px;background:var(--blush);flex-shrink:0}
.mini div{flex:1;min-width:0}
.mini b{font-weight:600;display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.mini small{color:var(--muted)}
.pop-add{background:none;border:1.5px solid var(--ink);color:var(--ink);border-radius:999px;font-weight:700;font-size:13px;padding:6px 14px}
.pop-add:hover{background:var(--ink);color:var(--bg)}
.drawer-sub{font-family:var(--display);font-weight:800;font-size:18px;margin:22px 0 4px}

/* ---------- footer ---------- */
.ftr{background:#262528;color:#E9DEDC;margin-top:clamp(56px,8vw,110px);padding:64px 0 36px}
:root[data-theme="dark"] .ftr{background:#0F0B0C}
.brandpat{position:relative}
.brandpat::before{content:"";position:absolute;inset:0;pointer-events:none;opacity:.42;background-image:var(--pat);background-size:auto 118%;background-position:right -60px top -40px;background-repeat:no-repeat;mix-blend-mode:luminosity}
@media (max-width:860px){.brandpat::before{background-size:auto 60%;background-position:right -30px top -20px;opacity:.35}}
.brandpat>*{position:relative;z-index:1}
.ftr a{color:#E9DEDC;text-decoration:none}.ftr a:hover{color:#fff;text-decoration:underline}
.ftr-g{display:grid;grid-template-columns:1.4fr repeat(var(--ftr-cols,4),minmax(0,1fr));gap:36px}
.ftr-brand{display:flex;flex-direction:column;gap:14px}
.ftr-brand p{margin:0;max-width:32ch}
.ftr-logo{background:#fff;border-radius:16px;padding:10px 16px;display:inline-flex;align-self:flex-start}
.ftr-logo img{height:42px;width:auto}
.ftr h4{margin:0 0 10px;color:#fff;font-size:14px;font-weight:700}
.ftr nav{display:flex;flex-direction:column;gap:4px}
.ftr nav a{min-height:34px;display:flex;align-items:center}
.ftr address{font-style:normal;margin:0 0 8px;line-height:1.6;white-space:pre-line}
.ftr-b{border-top:1px solid #3A3133;margin-top:40px;padding-top:22px;display:flex;justify-content:space-between;align-items:center;gap:16px;flex-wrap:wrap;font-size:14px}
.ftr-b .fine{opacity:.75;font-size:13px}
.pay{display:flex;gap:6px;align-items:center;flex-wrap:wrap}
.pay span{border:1px solid #4A3F41;border-radius:6px;padding:3px 8px;font-weight:700;font-size:12px}
.soc{display:flex;gap:8px}
.soc a{width:44px;height:44px;border-radius:999px;border:1px solid #4A3F41;display:flex;align-items:center;justify-content:center}
.soc a:hover{background:#3A3133;text-decoration:none}
.soc svg{width:20px;height:20px}
@media (max-width:1080px){.ftr-logo img{height:38px}}
@media (max-width:980px){.ftr-g{grid-template-columns:1fr 1fr}.ftr-g>div:first-child{grid-column:span 2}.ftr{padding-bottom:110px}}

/* currency picker (footer + menu drawer) */
.currency-switch{position:relative;display:inline-flex}
.currency-btn{display:inline-flex;align-items:center;gap:6px;min-height:36px;padding:0 12px;border-radius:999px;border:1px solid currentColor;background:transparent;color:inherit;font-weight:700;font-size:13px}
.currency-btn svg{width:12px;height:12px}
.currency-switch .dropdown{position:absolute;bottom:calc(100% + 8px);right:0;min-width:190px;background:var(--surface);color:var(--ink);border:1px solid var(--line);border-radius:14px;padding:6px;box-shadow:0 20px 40px -20px rgba(0,0,0,.4);display:none;z-index:5}
.currency-switch.open .dropdown{display:block}
.currency-switch .dropdown a{display:flex;justify-content:space-between;align-items:center;gap:10px;padding:9px 12px;border-radius:10px;color:var(--ink);text-decoration:none;font-size:14px}
.currency-switch .dropdown a:hover{background:var(--blush);text-decoration:none;color:var(--ink)}
.currency-switch .dropdown a.on{font-weight:700}
.currency-switch .dropdown svg{width:14px;height:14px}
.drawer .currency-switch .dropdown{bottom:auto;top:calc(100% + 8px);left:0;right:auto}

/* ---------- WhatsApp & bottom nav ---------- */
.wa{position:fixed;right:22px;bottom:22px;z-index:30;height:56px;padding:0 20px 0 14px;border-radius:999px;background:var(--green);color:#fff;display:flex;align-items:center;gap:10px;font-weight:700;text-decoration:none;box-shadow:0 14px 30px -14px rgba(18,140,74,.8);animation:pulse 2.6s ease-out infinite;transition:transform .3s var(--ease),opacity .3s}
.wa:hover{color:#fff;background:#0E743D}
.wa svg{width:26px;height:26px}
.wa.hide{transform:scale(.6);opacity:0;pointer-events:none}
@keyframes pulse{0%,100%{box-shadow:0 0 0 0 rgba(37,211,102,.45)}50%{box-shadow:0 0 0 14px rgba(37,211,102,0)}}
.bnav{display:none}
@media (max-width:1080px){
  .wa{bottom:calc(84px + env(safe-area-inset-bottom));right:14px;width:56px;padding:0;justify-content:center}
  .wa em{display:none}
  .bnav{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));position:fixed;left:10px;right:10px;bottom:calc(10px + env(safe-area-inset-bottom));z-index:36;height:62px;border-radius:22px;background:#262528;box-shadow:0 16px 40px -16px rgba(0,0,0,.6)}
  .bnav a,.bnav button{border:none;background:none;color:#BFB2B0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;font-size:10.5px;font-weight:700;text-decoration:none;position:relative;font-family:var(--body)}
  .bnav i{width:40px;height:28px;border-radius:999px;display:flex;align-items:center;justify-content:center;transition:background-color .25s}
  .bnav svg{width:19px;height:19px}
  .bnav [aria-current="page"]{color:#fff}
  .bnav [aria-current="page"] i{background:var(--red)}
  .bnav .count{top:2px;right:calc(50% - 22px)}
  body{padding-bottom:84px}
  body.has-sticky-buy .wa{display:none}
}

/* ---------- product grid & card ---------- */
.grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:28px 20px}
.grid.cols-3{grid-template-columns:repeat(3,minmax(0,1fr))}
@media (max-width:1080px){.grid{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media (max-width:720px){.grid,.grid.cols-3{grid-template-columns:repeat(2,minmax(0,1fr));gap:18px 10px}}
.card{position:relative;display:flex;flex-direction:column;gap:8px;min-width:0}
.card-media{position:relative;aspect-ratio:3/4;border-radius:var(--r-md);overflow:hidden;background:var(--blush)}
.card-media a.cover{position:absolute;inset:0;z-index:0}
.card-media img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:top;transition:opacity .45s ease,transform .7s var(--ease)}
.card-media img.alt{opacity:0}
@media (hover:hover){.card:hover img.main{transform:scale(1.04)}.card:hover img.alt{opacity:1}}
.card-media .ph{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;color:var(--muted)}
.card-media .ph img{position:static;width:44px;height:auto;opacity:.35}
.tag{position:absolute;left:10px;top:10px;padding:5px 10px;border-radius:999px;background:var(--ink);color:var(--bg);font-size:12px;font-weight:700;pointer-events:none;z-index:1;line-height:1.3}
.tag.red{background:var(--red);color:#fff}
.tag.soft{background:#fff;color:#262528;border:1px solid var(--line);font-family:var(--display);letter-spacing:.02em}
.tag+.tag{top:40px}
.wish{position:absolute;right:6px;top:6px;z-index:2;margin:0}
.wish button{width:44px;height:44px;padding:0;border:none;background:none;appearance:none;-webkit-appearance:none;display:flex;align-items:center;justify-content:center;border-radius:999px;box-shadow:none}
.wish span{width:36px;height:36px;border-radius:999px;background:#fff;box-shadow:0 2px 8px rgba(0,0,0,.12);display:flex;align-items:center;justify-content:center;transition:transform .2s}
.wish svg{width:18px;height:18px;stroke:var(--red);fill:none;stroke-width:2;transition:fill .2s}
.wish [aria-pressed="true"] svg,.wish.on svg{fill:var(--red)}
.wish [aria-pressed="true"] span{animation:bump .45s var(--ease)}
.qadd{position:absolute;left:10px;right:10px;bottom:10px;z-index:2;min-height:44px;border-radius:14px;border:none;background:rgba(255,255,255,.95);color:#262528;font-weight:700;font-size:14px;display:flex;align-items:center;justify-content:center;gap:8px;transform:translateY(8px);opacity:0;transition:all .25s var(--ease);text-decoration:none;margin:0}
.qadd button{all:unset;display:flex;align-items:center;justify-content:center;gap:8px;width:100%;height:100%;min-height:44px;cursor:pointer}
.qadd:hover{background:#262528;color:#fff}
.qadd svg{width:18px;height:18px}
@media (hover:hover){.card:hover .qadd,.qadd:focus-within,.qadd:focus-visible{opacity:1;transform:none}}
@media (hover:none),(max-width:720px){.qadd{left:auto;width:40px;min-height:40px;border-radius:999px;opacity:1;transform:none;background:#262528;color:#fff}.qadd em{display:none}.qadd button{min-height:40px}}
.reel-chip{position:absolute;left:10px;bottom:10px;z-index:2;display:inline-flex;align-items:center;gap:5px;background:rgba(38,37,40,.82);color:#fff;border-radius:999px;padding:6px 11px;font-size:12px;font-weight:700;text-decoration:none;backdrop-filter:blur(6px);transition:transform .25s var(--ease),background-color .2s}
.reel-chip:hover{background:var(--red);color:#fff}
.reel-chip svg{width:12px;height:12px}
@media (hover:hover){.card:hover .reel-chip{transform:translateY(-44px)}}
.soldout{position:absolute;left:10px;right:10px;bottom:10px;z-index:2;text-align:center;background:rgba(255,255,255,.95);color:#262528;border-radius:12px;padding:9px;font-size:13px;font-weight:700}
.card.gone .card-media img{filter:grayscale(.65);opacity:.75}
.rate{display:inline-flex;align-items:center;gap:4px;font-size:12.5px;color:var(--muted);font-weight:600}
.rate svg{width:12px;height:12px;fill:var(--red)}
.swatches{display:flex;align-items:center;gap:6px;flex-wrap:wrap;margin-top:2px}
.sw{width:30px;height:30px;padding:0;border:none;background:none;display:flex;align-items:center;justify-content:center;border-radius:999px}
.sw i{display:block;width:17px;height:17px;border-radius:999px;border:1px solid rgba(38,37,40,.18);transition:box-shadow .18s,transform .18s}
.sw:hover i{transform:scale(1.12)}
.sw.on i{box-shadow:0 0 0 2px var(--bg),0 0 0 3.5px var(--ink)}
.sw-name{font-size:12.5px;color:var(--muted)}
.sw-more{font-size:12px;font-weight:700;color:var(--muted)}
.card-cat{font-size:12.5px;color:var(--muted);font-weight:600}
.card h3{margin:0;font-size:16px;font-weight:600;line-height:1.3}
.card h3 a{color:inherit;text-decoration:none}
.card h3 a:hover{text-decoration:underline}
.pr{display:flex;align-items:baseline;gap:8px;flex-wrap:wrap}
.pr b{font-family:var(--display);font-size:20px;font-weight:800}
.pr s{color:var(--muted);font-size:14px}
.pr em{font-style:normal;color:var(--red-text);font-weight:700;font-size:14px}
.low{font-size:12.5px;color:var(--red-text);font-weight:600}
.pre-note{font-size:12.5px;color:var(--muted);font-weight:600}
@media (max-width:720px){.card h3{font-size:14px}.pr b{font-size:17px}.card-cat{display:none}.reel-chip{bottom:auto;top:10px;left:10px;padding:5px 9px}.card-media .tag+.reel-chip{top:40px}.qadd{bottom:8px}}

/* ---------- empty states, breadcrumbs, page heads ---------- */
.empty{text-align:center;padding:60px 20px;display:flex;flex-direction:column;align-items:center;gap:14px}
.empty svg{width:64px;height:64px;color:var(--red)}
.empty h2{margin:0;font-family:var(--display);font-size:30px;letter-spacing:-.02em}
.empty p{margin:0;color:var(--muted);max-width:46ch}
.crumbs{font-size:14px;color:var(--muted);padding:18px 0 0;display:flex;gap:8px;flex-wrap:wrap;margin:0}
.crumbs a{color:var(--muted);text-decoration:none}.crumbs a:hover{color:var(--ink);text-decoration:underline}
.crumbs [aria-current="page"]{color:var(--ink)}
.shop-hero{padding:18px 0 22px;display:flex;justify-content:space-between;align-items:flex-end;gap:18px;flex-wrap:wrap}
.shop-hero.top{padding-top:40px}
.box{background:var(--surface);border:1px solid var(--line);border-radius:var(--r-lg);padding:clamp(20px,3vw,32px)}
.box.soft{background:var(--blush);border-color:transparent}
.box+.box{margin-top:16px}
.box h2,.box h3{margin-top:0}
.two{display:grid;grid-template-columns:minmax(0,1fr) 420px;gap:clamp(20px,4vw,48px);align-items:start;padding-top:10px}
.two.even{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}
@media (max-width:980px){.two,.two.even{grid-template-columns:1fr}}

/* ---------- notices ---------- */
.notice{border-radius:16px;padding:14px 16px;background:var(--blush);color:var(--ink);font-size:14.5px;line-height:1.5;display:block}
.notice.ok,.notice.success{background:var(--ok-soft);color:var(--ok)}
.notice.warn,.notice.warning{background:var(--warn-soft);color:var(--warn)}
.notice.err,.notice.error{background:color-mix(in srgb,var(--red) 10%,var(--bg));color:var(--red-text)}
.notice a{color:inherit;font-weight:700}
.notice+.notice{margin-top:10px}

/* ---------- motion ---------- */
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.001ms!important;animation-iteration-count:1!important;transition-duration:.001ms!important;scroll-behavior:auto!important}
  .marquee{animation:none}
}

/* ============================================================
   Homepage sections (views/sections/) — the 2026 design, section by section.
   ============================================================ */
.btn-row{display:flex;gap:10px;flex-wrap:wrap;align-items:center}
.sec-foot{display:flex;justify-content:center;margin-top:32px}
.sec.snug{padding-top:22px}
.tint{background:var(--blush);border-radius:32px;padding:clamp(22px,3.5vw,44px)}

/* hero */
.hero{position:relative;height:clamp(560px,78vh,720px);overflow:hidden;background:var(--red)}
.slide{position:absolute;inset:0;opacity:0;visibility:hidden;transition:opacity .8s ease,visibility .8s;display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,1fr)}
.slide.on{opacity:1;visibility:visible}
.slide-copy{padding:clamp(40px,7vw,90px) 0 0 var(--pad);display:flex;flex-direction:column;gap:18px;z-index:2;transform:translateY(24px);transition:transform .9s var(--ease)}
.slide.on .slide-copy{transform:none}
.slide-h{margin:0;font-family:var(--display);font-weight:800;font-size:clamp(56px,8vw,118px);line-height:.86;letter-spacing:-.045em;text-transform:uppercase}
.slide .h1b{font-family:var(--serif);font-style:italic;font-size:clamp(44px,5.6vw,80px);line-height:.9;margin-top:-6px}
.slide-copy p{margin:0;font-size:18px;max-width:40ch;opacity:.92}
.slide-btns{display:flex;gap:10px;flex-wrap:wrap;margin-top:8px}
.slide-media{position:relative}
.arch{position:absolute;right:var(--pad);top:40px;bottom:0;width:min(470px,86%);border-radius:260px 260px 0 0;overflow:hidden}
.arch img{width:100%;height:100%;object-fit:cover;object-position:top;transform:scale(1.1);transition:transform 7s ease-out}
.slide.on .arch img{transform:scale(1)}
.inset{position:absolute;left:0;bottom:60px;width:clamp(150px,15vw,220px);aspect-ratio:4/5;border-radius:18px;overflow:hidden;border:6px solid var(--sbg);transform:rotate(-6deg) translateY(40px);opacity:0;transition:transform .9s .25s var(--ease),opacity .6s .25s}
.slide.on .inset{transform:rotate(-6deg);opacity:1}
.inset img{width:100%;height:100%;object-fit:cover;object-position:top}
.badge-spin{position:absolute;left:18%;top:60px;width:128px;height:128px;animation:spin 20s linear infinite}
.poster-slide{display:block;background:linear-gradient(140deg,#B4141B,#DF1A22 55%,#FF6A50)}
.poster{height:100%;display:flex;align-items:center;justify-content:center;padding:clamp(10px,1.6vw,22px)}
.poster-card{position:relative;width:100%;max-width:1180px;height:100%;max-height:100%;padding:clamp(14px,1.8vw,24px) clamp(16px,3vw,40px);display:flex}
.paper{position:absolute;inset:6px;background:#FBF3EE}
.paper::after{content:"";position:absolute;inset:0;opacity:.5;mix-blend-mode:multiply;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='220' height='220'%3E%3Cfilter id='g'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='3'/%3E%3CfeColorMatrix type='saturate' values='0'/%3E%3C/filter%3E%3Crect width='220' height='220' filter='url(%23g)' opacity='0.22'/%3E%3C/svg%3E")}
.poster-in{position:relative;z-index:1;width:100%;height:100%;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:clamp(6px,.8vw,10px);min-height:0}
.poster-eyebrow{margin:0;font-size:11.5px;font-weight:700;letter-spacing:.28em;text-transform:uppercase;color:#BE1219}
.poster-h{margin:0;text-align:center;font-family:var(--display);font-weight:800;letter-spacing:-.03em;color:#262528;font-size:clamp(20px,2.3vw,34px);line-height:1.04;white-space:nowrap;text-transform:uppercase}
.poster-h .it{color:#DF1A22;font-size:1.1em}
.poster-strips{display:grid;grid-template-columns:repeat(var(--n,4),minmax(0,1fr));grid-auto-rows:1fr;gap:clamp(10px,1.6vw,26px);width:100%;min-height:200px;flex:1 1 auto;max-width:1120px}
.pstrip{display:flex;flex-direction:column;gap:8px;text-decoration:none;min-height:0;height:100%}
.pstrip-img{flex:1 1 auto;min-height:0;position:relative;display:block}
.pstrip-img img{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;object-position:bottom center;transition:transform .45s var(--ease)}
.pstrip:hover img{transform:translateY(-6px) scale(1.04)}
.pstrip-cap{text-align:center;font-family:var(--serif);font-style:italic;font-size:clamp(14px,1.5vw,21px);color:#BE1219;border-top:1.5px solid rgba(190,18,25,.4);padding-top:6px}
.poster-cta{align-self:center}
.hero-ctl{position:absolute;left:var(--pad);bottom:10px;z-index:3;display:flex;align-items:center;gap:18px;color:#fff}
.dots{display:flex;gap:6px}
.dot{width:60px;height:44px;border:none;background:none;padding:0;display:flex;align-items:center;color:inherit}
.dot i{display:block;width:100%;height:4px;border-radius:4px;background:color-mix(in srgb,currentColor 30%,transparent);overflow:hidden;position:relative}
.dot i::after{content:"";position:absolute;inset:0;background:currentColor;transform:scaleX(0);transform-origin:left}
.dot.done i::after{transform:scaleX(1)}
.dot.cur i::after{animation:fill var(--dur,5s) linear forwards}
.paused .dot.cur i::after{animation-play-state:paused}
@keyframes fill{to{transform:scaleX(1)}}
@media (max-width:860px){
  .hero{height:auto;min-height:0}
  .slide{position:absolute;grid-template-columns:1fr}
  .hero-sizer{height:clamp(430px,calc(100vh - 212px),640px);height:clamp(430px,calc(100svh - 212px),640px)}
  .slide-media{position:absolute;inset:0}
  .arch{inset:0;width:auto;border-radius:0}
  .slide-media::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,transparent 30%,var(--sfade) 78%)}
  .inset,.badge-spin{display:none}
  .slide-copy{position:absolute;left:0;right:0;bottom:30px;padding:0 22px;color:#fff!important;gap:8px}
  .slide-h{font-size:clamp(44px,13vw,60px)}
  .slide .h1b{font-size:clamp(34px,10vw,44px);color:#FFD5D7!important}
  .slide-copy .btn{min-height:48px}
  .slide-copy p{display:none}
  .slide-copy .btn-line{display:none}
  .hero-ctl{left:22px;right:14px;bottom:2px}
  .dot{width:44px}
  .poster{padding:8px}
  .poster-card{padding:14px 12px}
  .poster-in{gap:8px}
  .paper{inset:4px}
  .poster-strips{gap:6px;min-height:0}
  .pstrip{gap:5px}
  .pstrip-cap{font-size:10.5px;padding-top:4px;letter-spacing:-.01em}
  .poster-h{font-size:clamp(17px,4.6vw,23px);white-space:nowrap}
  .poster-h .it{display:block;font-size:1.12em}
  .poster-eyebrow{font-size:9.5px;letter-spacing:.18em}
  .poster-cta{min-height:46px;padding:0 20px;font-size:14px}
}
@media (min-width:861px){.hero-sizer{display:none}}

/* trust band */
.trust{background:var(--band);color:var(--band-ink)}
.trust-in{display:grid;grid-template-columns:repeat(var(--n,4),minmax(0,1fr))}
.trust-i{display:flex;gap:14px;align-items:center;padding:24px 20px;border-right:1px solid #3A3133}
.trust-i:last-child{border-right:none}
.trust-i b{display:block;font-family:var(--display);font-size:17px;line-height:1.25}
.trust-i small{color:var(--band-muted);font-size:13.5px;display:block}
@media (max-width:860px){
  .trust{background:transparent;color:var(--ink)}
  .trust-in{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;padding:12px 12px 0}
  .trust-i{padding:10px 12px;gap:10px;border:none;border-radius:14px;background:var(--blush)}
  .trust-i small{display:none}
  .trust-i b{font-family:var(--body);font-size:13px;font-weight:700;line-height:1.25}
  .trust-i .ic{width:22px;height:22px;background:none;color:var(--red-text)}
  .trust-i .ic svg{width:20px;height:20px}
}
.trust-cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:12px}
.trust-card{display:flex;gap:14px;align-items:center;background:var(--blush);border-radius:18px;padding:16px 18px}
.trust-card b{display:block;font-family:var(--display);font-size:17px}
.trust-card small{color:var(--muted);font-size:13.5px}

/* category circles + price shortcuts */
.cats{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:18px}
.cats.size-small{grid-template-columns:repeat(8,minmax(0,1fr))}
.cats.size-large{grid-template-columns:repeat(4,minmax(0,1fr))}
.cat{text-decoration:none;color:var(--ink);display:flex;flex-direction:column;align-items:center;gap:10px;text-align:center}
.cat-disc{position:relative;width:100%;aspect-ratio:1;border-radius:50%;background:linear-gradient(160deg,var(--g1),var(--g2));margin-top:56%;display:block}
.cats.photos .cat-disc{margin-top:0;overflow:hidden}
.cat-disc img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;border-radius:50%;transition:transform .5s var(--ease)}
.cat-disc.cutout img{inset:auto;left:50%;transform:translateX(-50%);bottom:2%;height:150%;width:auto;max-width:none;object-fit:contain;border-radius:0;filter:drop-shadow(0 16px 20px rgba(38,37,40,.28))}
.cat:hover .cat-disc.cutout img{transform:translateX(-50%) translateY(-8px) scale(1.03)}
.cat:hover .cat-disc:not(.cutout) img{transform:scale(1.06)}
.cat b{font-family:var(--display);font-size:18px}
.cat small{color:var(--muted);margin-top:-8px;font-size:13px}
@media (max-width:860px){.cats{display:flex;overflow-x:auto;overflow-y:visible;scrollbar-width:none;gap:14px;margin-inline:calc(var(--pad)*-1);padding-inline:var(--pad);padding-top:10px}.cats::-webkit-scrollbar{display:none}.cat{flex:0 0 132px}.cat b{font-size:14px}.cat small{display:none}}
.prices{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px;margin-top:28px}
.price-t{min-height:110px;border-radius:var(--r-md);text-decoration:none;color:#262528;display:flex;flex-direction:column;justify-content:center;padding:0 24px;transition:transform .25s var(--ease)}
.price-t:hover{transform:translateY(-4px)}
.price-t small{font-size:13px;font-weight:700;opacity:.75}
.price-t b{font-family:var(--display);font-size:clamp(28px,3.2vw,42px);letter-spacing:-.03em;line-height:1.05}
@media (max-width:860px){.prices{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.price-t{min-height:78px;padding:0 16px}}

/* highlight band */
.rare-band{display:flex;align-items:center;gap:clamp(16px,3vw,36px);flex-wrap:wrap;background:var(--blush);border-radius:26px;padding:clamp(18px,2.4vw,26px) clamp(18px,3vw,32px)}
.rare-lead{min-width:210px}
.rare-lead .kicker{margin-bottom:2px}
.rare-lead h2{font-size:clamp(24px,2.6vw,34px)}
.rare-steps{display:flex;gap:10px;flex:1;min-width:280px;flex-wrap:wrap}
.rare-steps>div{flex:1;min-width:160px;display:flex;flex-direction:column;gap:2px}
.rare-steps span{width:28px;height:28px;border-radius:999px;background:var(--red);color:#fff;display:flex;align-items:center;justify-content:center;margin-bottom:4px}
.rare-steps span svg{width:15px;height:15px}
.rare-steps b{display:block;font-family:var(--display);font-size:15px}
.rare-steps small{color:var(--muted);font-size:12.5px;line-height:1.35}
@media (max-width:720px){.rare-steps>div{min-width:130px}.rare-band .btn{width:100%}}

/* sale spotlight */
.offer-x{position:absolute;right:14px;top:14px;z-index:3;width:38px;height:38px;border-radius:999px;border:none;background:rgba(255,255,255,.9);color:#262528;display:flex;align-items:center;justify-content:center;transition:transform .2s}
.offer-x:hover{transform:rotate(90deg);background:#fff}
.offer-x svg{width:16px;height:16px}
.spotlight{position:relative;border-radius:var(--r-lg);overflow:hidden;background:linear-gradient(115deg,#7A0E14 0%,#DF1A22 42%,#FF6B57 100%);display:grid;grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);align-items:end;min-height:360px;isolation:isolate}
.spotlight::before{content:"";position:absolute;inset:16px;border:1.5px dashed rgba(255,255,255,.45);border-radius:20px;pointer-events:none}
.spotlight img{width:100%;height:100%;max-height:420px;object-fit:cover;object-position:top center}
.sp-left{object-position:center 12%}
.sp-mid{text-align:center;color:#fff;padding:36px 22px;z-index:2}
.sp-eyebrow{margin:0;font-size:12.5px;font-weight:700;letter-spacing:.22em;text-transform:uppercase;opacity:.9}
.sp-top{margin:6px 0 0;font-family:var(--display);font-weight:800;font-size:clamp(26px,3.4vw,42px);letter-spacing:-.03em;color:#FFD5D7;text-transform:uppercase}
.sp-upto{margin:2px 0;font-weight:700;letter-spacing:.2em;text-transform:uppercase;font-size:13px}
.sp-big{margin:0 0 18px;font-family:var(--display);font-weight:800;font-size:clamp(56px,8vw,104px);line-height:.82;letter-spacing:-.05em;text-transform:uppercase}
.sp-mid .btn-ink{background:#262528;color:#fff}.sp-mid .btn-ink:hover{background:#fff;color:#262528}
@media (max-width:860px){
  .spotlight{grid-template-columns:1fr 1fr;grid-template-rows:auto auto;min-height:0}
  .sp-mid{grid-column:span 2;order:-1;padding:28px 16px 6px}
  .spotlight img{max-height:230px}
}

/* offer cards */
.offers{display:grid;grid-template-columns:repeat(var(--n,2),minmax(0,1fr));gap:18px}
.offer{position:relative;border-radius:var(--r-lg);overflow:hidden;display:flex;flex-direction:column;justify-content:center;gap:4px;padding:clamp(26px,4vw,44px);min-height:300px;text-decoration:none;color:#fff;isolation:isolate}
.offer::after{content:"";position:absolute;inset:0;background:radial-gradient(120% 120% at 15% 10%,rgba(255,255,255,.28),transparent 55%);pointer-events:none}
.o1{background:linear-gradient(140deg,#DF1A22,#B4141B 60%,#7A0E14)}
.o2{background:linear-gradient(140deg,#FF6B57,#DF1A22 45%,#7A0E14)}
.o-tape{position:absolute;inset:14px;border:1.5px dashed rgba(255,255,255,.5);border-radius:18px}
.o-sub{font-weight:700;letter-spacing:.16em;text-transform:uppercase;font-size:13px;z-index:1}
.o-big{font-family:var(--display);font-weight:800;font-size:clamp(46px,6.4vw,86px);line-height:.9;letter-spacing:-.045em;z-index:1}
.offers[style*="--n:3"] .o-big{font-size:clamp(38px,4.6vw,64px)}
.o-note{font-size:14px;opacity:.9;z-index:1}
.o-cta{margin-top:16px;align-self:flex-start;background:#262528;color:#fff;font-weight:700;padding:13px 24px;border-radius:999px;z-index:1;transition:background-color .2s,transform .2s}
.offer:hover .o-cta{background:#fff;color:#262528;transform:translateY(-2px)}
@media (max-width:860px){.offers{grid-template-columns:1fr}.offer{min-height:220px}}

/* occasion grid */
.occ-grid{display:grid;grid-template-columns:repeat(var(--cols,5),minmax(0,1fr));gap:16px}
.occ{position:relative;display:block;text-decoration:none;color:var(--ink);border-radius:22px;overflow:hidden;background:var(--occ-bg,var(--blush))}
.occ-img{display:block;aspect-ratio:3/4;overflow:hidden}
.occ-img img{width:100%;height:100%;object-fit:cover;object-position:top center;transition:transform .7s var(--ease)}
.occ:hover img{transform:scale(1.07)}
.occ::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(38,37,40,0) 50%,rgba(38,37,40,var(--veil,.82)));pointer-events:none}
.occ-lbl{position:absolute;left:14px;right:14px;bottom:12px;z-index:1;display:flex;align-items:center;justify-content:space-between;gap:8px;color:#fff}
.occ-t{font-family:var(--display);font-weight:800;font-size:clamp(16px,1.5vw,21px);letter-spacing:-.02em;line-height:1.1}
.occ-lbl i{width:30px;height:30px;border-radius:999px;background:var(--red);display:flex;align-items:center;justify-content:center;flex-shrink:0;transition:transform .25s var(--ease)}
.occ-lbl i svg{width:14px;height:14px}
.occ:hover .occ-lbl i{transform:translateX(3px)}
@media (max-width:1080px){.occ-grid{grid-template-columns:repeat(min(3,var(--cols,5)),minmax(0,1fr))}}
@media (max-width:640px){.occ-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.occ-t{font-size:15px}}
@media (max-width:700px){
  .occ-grid.occ-slider{display:flex;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none;margin-inline:calc(var(--pad)*-1);padding-inline:var(--pad)}
  .occ-grid.occ-slider::-webkit-scrollbar{display:none}
  .occ-grid.occ-slider>.occ{flex:0 0 62%;scroll-snap-align:start}
}
.occ-dots{display:none;justify-content:center;gap:6px;margin-top:12px}
@media (max-width:700px){.occ-dots{display:flex}}
.occ-dots button{width:8px;height:8px;border-radius:99px;border:none;padding:0;background:var(--line);transition:all .25s}
.occ-dots button.on{width:22px;background:var(--red)}

/* reels band */
.reels-sec{background:var(--wine);color:#fff;margin-top:clamp(56px,8vw,110px);padding:clamp(48px,7vw,96px) 0;position:relative;overflow:hidden}
.reels-sec .ghost{position:absolute;right:-40px;top:10px;font-family:var(--display);font-weight:800;font-size:clamp(120px,18vw,260px);color:rgba(255,255,255,.05);letter-spacing:-.05em;white-space:nowrap;pointer-events:none;line-height:1}
.reels-sec .kicker{color:#FFC9CC}
.reels-h{font-size:clamp(38px,6vw,72px)}
.reels-h .it{color:#FF8A90}
.reels{display:flex;gap:18px;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none;padding:0 var(--pad);margin-top:32px;max-width:1440px;margin-inline:auto}
.reels::-webkit-scrollbar{display:none}
.reel{flex:0 0 clamp(200px,18vw,250px);scroll-snap-align:start;display:flex;flex-direction:column;gap:10px}
.reels.embeds .reel{flex-basis:326px}
.reels.embeds .instagram-media{margin:0!important;min-width:0!important;border-radius:22px!important}
.reel-v{position:relative;aspect-ratio:9/16;border-radius:22px;overflow:hidden;background:#4A0A0E}
.reel-v img{width:100%;height:100%;object-fit:cover;object-position:top;transition:transform 5s ease}
.reel:hover .reel-v img{transform:scale(1.08)}
.reel-v::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(0,0,0,.45),transparent 28%,transparent 58%,rgba(0,0,0,.72));pointer-events:none}
.reel-top{position:absolute;left:12px;top:12px;right:12px;display:flex;align-items:center;gap:8px;z-index:1;font-size:12.5px;line-height:1.15}
.av{width:32px;height:32px;border-radius:999px;border:2px solid #fff;display:flex;align-items:center;justify-content:center;font-weight:800;font-size:12px;flex-shrink:0;background:var(--red);color:#fff}
.reel-tag{position:absolute;right:12px;top:54px;z-index:1;padding:3px 9px;border-radius:999px;font-size:11px;font-weight:800;background:#fff;color:var(--wine)}
.reel-tag.celeb{background:var(--gold);color:#262528}
.play{position:absolute;left:50%;top:50%;width:62px;height:62px;margin:-31px 0 0 -31px;border-radius:999px;border:1.5px solid rgba(255,255,255,.85);background:rgba(255,255,255,.18);display:flex;align-items:center;justify-content:center;z-index:1;color:#fff;backdrop-filter:blur(4px)}
.play::before{content:"";position:absolute;inset:-1px;border-radius:inherit;border:2px solid rgba(255,255,255,.6);animation:ring 2.2s ease-out infinite}
@keyframes ring{to{transform:scale(1.5);opacity:0}}
.reel-q{position:absolute;left:14px;right:14px;bottom:12px;margin:0;font-size:14px;line-height:1.4;z-index:1}
.shop-look{display:flex;align-items:center;gap:10px;background:#fff;color:#262528;border-radius:16px;padding:7px;text-decoration:none}
.shop-look img{width:42px;height:52px;border-radius:10px;object-fit:cover;object-position:top}
.shop-look span{flex:1;min-width:0;display:flex;flex-direction:column;font-size:13px;line-height:1.3}
.shop-look span i{font-style:normal;font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.shop-look em{width:36px;height:36px;border-radius:999px;background:var(--red);color:#fff;display:flex;align-items:center;justify-content:center;flex-shrink:0}
.reels-reviews{position:relative;margin-top:36px}
.reels-reviews .h-lg{color:#fff}
.reels-reviews .h-lg .it{color:#FF8A90}

/* Google reviews block */
.gblock{background:var(--surface);color:var(--ink);border:1px solid var(--line);border-radius:var(--r-lg);padding:clamp(18px,3vw,28px)}
.gblock b,.gblock blockquote{color:var(--ink)}
.gblock small{color:var(--muted)}
.gblock .btn-line{border-color:var(--ink);color:var(--ink)}
.gblock .btn-line:hover{background:var(--ink);color:var(--bg)}
.ghead{display:flex;align-items:center;gap:16px;flex-wrap:wrap;border-bottom:1px solid var(--line);padding-bottom:18px}
.gblock:not(:has(.greviews)) .ghead{border-bottom:none;padding-bottom:0}
.ghead>div{flex:1;min-width:190px}
.ghead b{font-family:var(--display);font-size:26px;display:block}
.ghead .stars{margin:2px 0}
.ghead small{display:block;font-size:13.5px}
.glogo{width:52px;height:52px;border-radius:999px;background:var(--blush);display:flex;align-items:center;justify-content:center}
.greviews{display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:16px;padding-top:18px}
.grev{margin:0;display:flex;flex-direction:column;gap:8px}
.grev figcaption{display:flex;gap:10px;align-items:center}
.grev figcaption b{font-size:14.5px;display:block}
.grev figcaption small{font-size:12.5px}
.grev blockquote{margin:0;font-size:15px;line-height:1.55}
.grev .stars svg{width:14px;height:14px}
.gblock.compact .greviews{grid-template-columns:repeat(auto-fit,minmax(260px,1fr))}

/* story + size finder */
.duo{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,1fr);gap:22px}
.story{border-radius:32px;overflow:hidden;background:var(--blush);display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr)}
.story img{width:100%;height:100%;object-fit:cover;min-height:280px}
.story-c{padding:clamp(24px,3.5vw,44px);display:flex;flex-direction:column;gap:16px}
.steps{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:12px}
.steps li{display:flex;gap:12px;align-items:center;font-weight:600}
.steps li span{width:32px;height:32px;border-radius:999px;background:var(--red);color:#fff;display:flex;align-items:center;justify-content:center;font-size:13px;font-weight:800;flex-shrink:0}
.sizebox{border-radius:32px;background:#262528;color:#fff;padding:clamp(24px,3.5vw,44px);display:flex;flex-direction:column;gap:18px;position:relative;overflow:hidden}
.sizebox .kicker{color:#FF8A90}
.sizebox .fig{position:absolute;right:28px;top:36px;width:130px;opacity:.9}
.sizebox .chip{border-color:#5A4B4E;color:#fff}
.sizebox .chip:hover{border-color:#fff}
.sizebox .chip[aria-pressed="true"]{background:var(--red);border-color:var(--red);color:#fff}
.sizebox p{color:#D9CDCB;margin:0;max-width:38ch}
.sizebox .h-lg .it{color:#FF8A90}
.sizebox .size-msg{color:#fff;font-weight:600}
.sizebox .btn-row{margin-top:auto}
.sizebox .btn-plain{color:#fff}
@media (max-width:980px){.duo{grid-template-columns:1fr}.story{grid-template-columns:1fr}.story img{height:260px;min-height:0}.sizebox .fig{display:none}}

/* promise band */
.promise{border-radius:24px;border:2px dashed var(--red);background:color-mix(in srgb,var(--red) 5%,var(--bg));padding:22px 28px;display:flex;align-items:center;gap:22px;flex-wrap:wrap}
.promise div{flex:1;min-width:220px}
.promise b{font-family:var(--display);font-size:clamp(20px,2.2vw,28px);letter-spacing:-.02em;display:block;line-height:1.15}
.promise p{margin:4px 0 0;color:var(--muted)}
.ic.big{width:60px;height:60px}
.ic.big svg{width:26px;height:26px}

/* visit the store */
.storebox{border-radius:32px;overflow:hidden;background:var(--surface);display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr) 340px;min-height:500px}
.storebox.no-img{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}
.storebox.no-map{grid-template-columns:minmax(0,1.3fr) minmax(0,1fr)}
.storebox.no-map.no-img{grid-template-columns:1fr;min-height:0}
.store-c{padding:clamp(24px,4vw,52px);display:flex;flex-direction:column;gap:18px}
.store-c .btn-row{margin-top:auto}
.dl{display:grid;grid-template-columns:96px 1fr;gap:12px 14px;margin:0;font-size:15px}
.dl dt{font-weight:700;color:var(--muted)}.dl dd{margin:0;font-weight:600}
.dl a{color:var(--ink)}
.map{position:relative;display:block;background:#F4EDE6;min-height:300px;overflow:hidden}
.map svg.bg{position:absolute;inset:0;width:100%;height:100%}
.pin{position:absolute;left:50%;top:44%;transform:translate(-50%,-100%);display:flex;flex-direction:column;align-items:center;animation:drop .9s var(--ease) both}
@keyframes drop{from{transform:translate(-50%,-160%);opacity:0}}
.pin span{background:#262528;color:#fff;font-weight:700;font-size:13px;padding:8px 12px;border-radius:10px;white-space:nowrap}
.map .open{position:absolute;right:14px;bottom:14px;background:#fff;color:#262528;font-size:13px;font-weight:700;padding:10px 14px;border-radius:12px}
.store-img{position:relative}
.store-img img{width:100%;height:100%;object-fit:cover}
.store-note{position:absolute;left:18px;right:18px;bottom:18px;background:rgba(255,255,255,.95);color:#262528;border-radius:18px;padding:14px 16px}
.store-note div{font-size:14px;color:#4F4244}
@media (max-width:1080px){.storebox,.storebox.no-img,.storebox.no-map{grid-template-columns:1fr}.store-img{display:none}.map{min-height:240px;order:-1}}

/* FAQ */
.faq-wrap{display:grid;grid-template-columns:380px minmax(0,1fr);gap:clamp(24px,5vw,64px)}
@media (max-width:980px){.faq-wrap{grid-template-columns:1fr}}
.faq-stack{max-width:880px;margin:0 auto}
.faq-stack .faq-h{font-size:clamp(24px,2.8vw,32px);margin-bottom:6px}
.accordion details{border-bottom:1px solid var(--line)}
.accordion summary{list-style:none;min-height:68px;display:flex;justify-content:space-between;align-items:center;gap:16px;padding:10px 0;font-family:var(--display);font-weight:700;font-size:clamp(17px,1.6vw,21px);color:var(--ink);cursor:pointer;line-height:1.25}
.accordion summary::-webkit-details-marker{display:none}
.accordion summary i{width:38px;height:38px;border-radius:999px;background:var(--blush);display:flex;align-items:center;justify-content:center;flex-shrink:0;transition:background-color .2s,transform .3s var(--ease),color .2s}
.accordion summary i svg{width:15px;height:15px}
.accordion details[open] summary i{background:var(--red);color:#fff;transform:rotate(45deg)}
.accordion summary:focus-visible{outline-offset:-2px}
.accordion .ans{padding:0 50px 22px 0;color:var(--muted)}
.accordion .ans p{margin:0 0 10px}
.accordion .ans p:last-child{margin-bottom:0}
.accordion .ans-links{display:flex;flex-wrap:wrap;gap:14px}
.accordion .ans-links a{font-weight:700}
@supports (interpolate-size:allow-keywords){
  .accordion details{interpolate-size:allow-keywords}
  .accordion details::details-content{height:0;overflow:clip;transition:height .35s var(--ease),content-visibility .35s allow-discrete}
  .accordion details[open]::details-content{height:auto}
}
.help-card{background:var(--blush);border-radius:24px;padding:24px;display:flex;flex-direction:column;gap:10px;margin-top:18px}
.help-card b{font-family:var(--display);font-size:22px}
.help-link{display:flex;align-items:center;gap:10px;color:var(--ink);font-weight:600;text-decoration:none;min-height:36px}
.help-link:hover{color:var(--red-text)}
.help-link svg{color:var(--red);flex-shrink:0}

/* journal */
.journal{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:22px}
.jcard{text-decoration:none;color:var(--ink);display:flex;flex-direction:column;gap:12px}
.jcard .jimg{aspect-ratio:4/3;border-radius:24px;overflow:hidden;background:var(--blush) url(/img/theme/mark.webp) center/56px no-repeat}
.jcard img{width:100%;height:100%;object-fit:cover;transition:transform .6s var(--ease)}
.jcard:hover img{transform:scale(1.05)}
.jcard .pill{align-self:flex-start}
.jcard h3{margin:0;font-family:var(--display);font-size:clamp(19px,2vw,25px);line-height:1.15;letter-spacing:-.02em}
.jcard p{margin:0;color:var(--muted);font-size:15px}
@media (max-width:860px){.journal{display:flex;overflow-x:auto;scrollbar-width:none;margin-inline:calc(var(--pad)*-1);padding-inline:var(--pad)}.journal::-webkit-scrollbar{display:none}.jcard{flex:0 0 260px}.jcard p{display:none}}

/* newsletter */
.news{border-radius:36px;background:var(--red);color:#fff;padding:clamp(28px,5vw,64px) clamp(22px,5vw,72px);display:grid;grid-template-columns:minmax(0,1fr) minmax(0,480px);gap:32px;align-items:center;position:relative;overflow:hidden}
.news h2{margin:0;font-family:var(--display);font-weight:800;font-size:clamp(40px,6vw,80px);letter-spacing:-.045em;line-height:.9}
.news p{margin:14px 0 0;font-size:17px}
.news .mark{position:absolute;right:-30px;top:-50px;width:260px;opacity:.12;filter:brightness(0) invert(1);pointer-events:none}
.news-f{position:relative;display:flex;flex-direction:column;gap:10px}
.news-row{display:flex;gap:6px;background:#fff;border-radius:999px;padding:6px}
.news-row input{flex:1;min-width:0;border:none;background:transparent;padding:0 16px;color:#262528;font-size:16px;min-height:48px}
.news-row input:focus{outline:none}
.news-row:focus-within{box-shadow:0 0 0 3px #262528}
.news-row .btn-ink{background:#262528;color:#fff}.news-row .btn-ink:hover{background:#000}
.news .ok{background:#fff;color:#262528;border-radius:18px;padding:18px;font-weight:600;animation:pageIn .4s var(--ease)}
.news .err{color:#fff}
.news-opt{display:flex;gap:10px;align-items:center;font-size:14px;min-height:44px}
.news-opt input{width:20px;height:20px;accent-color:#262528}
.news-wa input{width:100%;min-height:48px;border-radius:999px;border:none;padding:0 18px;color:#262528;font-size:16px}
@media (max-width:860px){.news{grid-template-columns:1fr}.news-row{flex-direction:column;border-radius:18px}.news-row .btn{width:100%}}

/* rich text, image banner, how it works */
.rich{text-align:center;max-width:880px;margin:0 auto;display:flex;flex-direction:column;align-items:center;gap:14px}
.rich.tint{max-width:none}
.rich p{margin:0;color:var(--muted);max-width:60ch;font-size:16.5px}
.banner{position:relative;display:flex;align-items:flex-end;border-radius:var(--r-lg);overflow:hidden;background:#262528;color:#fff;text-decoration:none;isolation:isolate}
.banner>img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:-1;transition:transform .7s var(--ease)}
.banner:hover>img{transform:scale(1.04)}
.banner::after{content:"";position:absolute;inset:0;background:linear-gradient(100deg,rgba(38,37,40,.82) 0%,rgba(38,37,40,.2) 70%);z-index:-1}
.banner-c{display:flex;flex-direction:column;align-items:flex-start;gap:12px;padding:clamp(24px,4vw,48px);max-width:620px}
.banner-c .kicker{color:#FFC9CC;margin:0}
.banner-h{font-family:var(--display);font-weight:800;font-size:clamp(30px,4.4vw,56px);letter-spacing:-.04em;line-height:.95}
.banner-t{opacity:.88;font-size:16px}
.how{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(0,1fr);gap:22px;align-items:stretch}
.how.no-cta{grid-template-columns:1fr}
.how-steps{list-style:none;margin:0;padding:0;display:grid;gap:12px}
.how-steps li{display:flex;gap:16px;align-items:flex-start;background:var(--blush);border-radius:22px;padding:18px 20px}
.how-steps li span{width:36px;height:36px;border-radius:999px;background:var(--red);color:#fff;display:flex;align-items:center;justify-content:center;font-weight:800;flex-shrink:0}
.how-steps b{font-family:var(--display);font-size:19px;display:block}
.how-steps p{margin:4px 0 0;color:var(--muted)}
.how-cta h3{margin:0;color:#fff}
@media (max-width:860px){.how{grid-template-columns:1fr}}

/* the legacy full-bleed hero slider (the hero_slider section), in the new type */
.hero-full{position:relative}
.hero-carousel{position:relative;overflow:hidden}
.hero-viewport{overflow:hidden}
.hero-track{display:flex;transition:transform .7s var(--ease)}
.hero-slide{position:relative;flex:0 0 100%;min-height:clamp(440px,70vh,680px);display:flex;align-items:center;text-decoration:none;color:#fff;overflow:hidden}
.hs-img{position:absolute;inset:0;z-index:0}
.hs-img img{width:100%;height:100%;object-fit:cover}
.hero-slide::after{content:"";position:absolute;inset:0;z-index:1;background:linear-gradient(90deg,rgba(38,37,40,.72) 0%,rgba(38,37,40,.25) 55%,transparent 80%)}
.hero-slide.focal-left::after{background:linear-gradient(270deg,rgba(38,37,40,.72) 0%,rgba(38,37,40,.25) 55%,transparent 80%)}
.hero-slide.focal-center::after{background:rgba(38,37,40,.45)}
.hs-text{position:relative;z-index:2;padding:0 var(--pad);max-width:680px;display:flex;flex-direction:column;gap:14px}
.hero-slide.focal-left .hs-text{margin-left:auto;text-align:right;align-items:flex-end}
.hero-slide.focal-center .hs-text{margin:0 auto;text-align:center;align-items:center}
.hs-kicker{font-size:14px;font-weight:700;letter-spacing:.04em;opacity:.9}
.hs-text h2{margin:0;font-family:var(--display);font-weight:800;font-size:clamp(44px,6.4vw,96px);line-height:.88;letter-spacing:-.045em;text-transform:uppercase}
.hs-text h2 .mega{display:block;font-family:var(--serif);font-style:italic;font-weight:400;text-transform:none;letter-spacing:0;color:#FFD5D7;font-size:.8em;margin-top:4px}
.hs-text p{margin:0;font-size:17px;max-width:44ch;opacity:.92}
.hs-text .btn{align-self:flex-start;background:#fff;color:#262528}
.hero-slide.focal-left .hs-text .btn{align-self:flex-end}
.hero-slide.focal-center .hs-text .btn{align-self:center}
/* The admin's placement choices. Desktop ones apply above the phone breakpoint
   only, so a slide set to "right" on a wide screen does not drag its text off the
   phone's layout; the phone has its own hs-m* set below. */
@media (min-width:861px){
  .hero-slide.hs-h-l .hs-text{margin-left:0;margin-right:auto;text-align:left;align-items:flex-start}
  .hero-slide.hs-h-c .hs-text{margin:0 auto;text-align:center;align-items:center}
  .hero-slide.hs-h-r .hs-text{margin-left:auto;margin-right:0;text-align:right;align-items:flex-end}
  .hero-slide.hs-v-t{align-items:flex-start;padding-top:64px}.hero-slide.hs-v-m{align-items:center}.hero-slide.hs-v-b{align-items:flex-end;padding-bottom:64px}
  .hero-slide.hs-ta-l .hs-text{text-align:left}.hero-slide.hs-ta-c .hs-text{text-align:center}.hero-slide.hs-ta-r .hs-text{text-align:right}
}
.hero-arrow{position:absolute;top:50%;transform:translateY(-50%);z-index:3;width:48px;height:48px;border-radius:999px;border:1.5px solid #fff;background:rgba(38,37,40,.25);color:#fff;display:flex;align-items:center;justify-content:center;backdrop-filter:blur(4px)}
.hero-arrow.prev{left:18px}.hero-arrow.next{right:18px}
.hero-arrow:hover{background:rgba(38,37,40,.55)}
.hero-dots{display:flex;justify-content:center;gap:6px;padding:12px 0}
.hero-dots button{width:8px;height:8px;border-radius:99px;border:none;padding:0;background:var(--line);transition:all .25s}
.hero-dots button.on{width:26px;background:var(--red)}
@media (hover:none){.hero-arrow{display:none}}
@media (max-width:860px){
  .hero-slide{min-height:clamp(430px,calc(100svh - 212px),620px);align-items:flex-end}
  .hero-slide::after,.hero-slide.focal-left::after{background:linear-gradient(180deg,transparent 35%,rgba(38,37,40,.85) 80%)}
  .hs-text,.hero-slide.focal-left .hs-text,.hero-slide.focal-center .hs-text{margin:0;text-align:left;align-items:flex-start;padding:0 22px 34px}
  .hs-text p{display:none}
  .hero-slide.hs-mh-l .hs-text{text-align:left;align-items:flex-start;margin:0}
  .hero-slide.hs-mh-c .hs-text{text-align:center;align-items:center;margin:0 auto}
  .hero-slide.hs-mh-r .hs-text{text-align:right;align-items:flex-end;margin:0 0 0 auto}
  .hero-slide.hs-mv-t{align-items:flex-start}.hero-slide.hs-mv-m{align-items:center}.hero-slide.hs-mv-b{align-items:flex-end}
  .hero-slide.hs-mta-l .hs-text{text-align:left}.hero-slide.hs-mta-c .hs-text{text-align:center}.hero-slide.hs-mta-r .hs-text{text-align:right}
}

/* page heads and prose (About, policies, Help Center) */
.page-head{padding-bottom:0}
.prose-wrap{max-width:880px;margin:0 auto;display:flex;flex-direction:column;gap:16px}
.prose h2{font-family:var(--display);font-weight:800;font-size:clamp(21px,2.2vw,26px);letter-spacing:-.02em;margin:0 0 10px}
.prose p,.prose li{color:var(--muted);font-size:15.5px;line-height:1.7}
.prose p{margin:0 0 12px}
.prose ul{margin:0 0 12px;padding-left:20px}
.prose li::marker{color:var(--red)}
.prose .btn-row{margin-top:16px}
.contact-two .fs{grid-template-columns:repeat(2,minmax(0,1fr))}
@media (max-width:620px){.contact-two .fs{grid-template-columns:1fr}}

/* per-section Style overrides from the Storefront Editor (.ss-* on the section wrapper) */
.ss-bg{background:var(--ss-bg)}
.ss-bg>.sec,.ss-bg>section{padding-bottom:clamp(40px,6vw,80px)}
.ss-hc h1,.ss-hc h2,.ss-hc h3,.ss-hc .h-xl,.ss-hc .h-lg{color:var(--ss-hc)}
.ss-tc p,.ss-tc li,.ss-tc small,.ss-tc .lede,.ss-tc .muted{color:var(--ss-tc)}
.ss-align .sec-head,.ss-align .rich,.ss-align .page-head{text-align:var(--ss-align)}
.ss-hs .h-xl{font-size:calc(clamp(34px,5.4vw,64px) * var(--ss-hs))}
.ss-hs .h-lg{font-size:calc(clamp(28px,3.6vw,44px) * var(--ss-hs))}
.ss-hw h1,.ss-hw h2,.ss-hw h3{font-weight:var(--ss-hw)}
.ss-font-body h1,.ss-font-body h2,.ss-font-body h3{font-family:var(--body);letter-spacing:-.01em}
.ss-upper h1,.ss-upper h2{text-transform:uppercase;letter-spacing:.02em}

/* ============================================================
   The shop: listings, collections, the occasion edit.
   ============================================================ */
.toolbar{position:sticky;top:var(--hdr-stick,var(--hdr-h));z-index:20;background:var(--bg);padding:10px 0;border-bottom:1px solid var(--line);margin-bottom:24px;display:flex;gap:10px;align-items:center}
.toolbar .rail{flex:1;min-width:0}
.sort-form{margin:0;flex-shrink:0}
.sel{min-height:44px;border-radius:999px;border:1.5px solid var(--line);background:var(--surface);color:var(--ink);padding:0 36px 0 16px;font-weight:700;font-size:14px;appearance:none;-webkit-appearance:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%235E5153' stroke-width='3'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 14px center;cursor:pointer}
.filters{display:flex;gap:8px;flex-wrap:wrap;margin:-8px 0 22px;align-items:center}
.filters .lbl{font-size:13px;font-weight:700;color:var(--muted);margin-right:4px}
@media (max-width:720px){.filters{flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none;margin-inline:calc(var(--pad)*-1);padding-inline:var(--pad)}.filters::-webkit-scrollbar{display:none}.filters>*{flex-shrink:0}.toolbar .sel{max-width:150px}}
.cat-copy{border-top:1px solid var(--line);margin-top:clamp(40px,6vw,72px)}
.cat-copy .accordion{max-width:880px}
.occ-hero{position:relative;border-radius:var(--r-lg);overflow:hidden;min-height:260px;display:flex;align-items:flex-end;padding:clamp(20px,3vw,36px);margin-top:12px;background:#262528;color:#fff}
.occ-hero>img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center 22%}
.occ-hero::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(38,37,40,.85),rgba(180,20,27,.5))}
.occ-hero.plain{background:linear-gradient(115deg,#7A0E14,#DF1A22 60%,#FF6B57)}
.occ-hero.plain::after{display:none}
.occ-hero>div{position:relative;z-index:1}
.occ-hero .kicker{color:#FFC9CC}
.occ-hero .h-xl{color:#fff}
.occ-hero .h-xl .it{color:#FFC9CC}
.occ-hero-t{color:#F6E3E1;margin:10px 0 0;max-width:56ch}
.occ-rail{margin:22px 0 20px}

/* ============================================================
   Product page (views/store/product.ejs). Class and id names are the page
   scripts' — gallery, magnifier, tap-to-zoom viewer, option picker — kept
   exactly; only how they look is the 2026 design's.
   ============================================================ */
.crumbs-bar{margin-bottom:0}
.pdp{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,1fr);gap:clamp(24px,4vw,64px);padding-top:18px;align-items:start}
.pdp-gallery{display:grid;grid-template-columns:84px minmax(0,1fr);gap:14px;position:sticky;top:calc(var(--hdr-stick,var(--hdr-h)) + 20px);align-self:start}
.pdp-gallery.solo{grid-template-columns:1fr}
.pdp-thumbs{display:flex;flex-direction:column;gap:10px;max-height:calc(100vh - 140px);overflow:auto;scrollbar-width:none}
.pdp-thumbs::-webkit-scrollbar{display:none}
.pdp-thumbs img{width:84px;aspect-ratio:3/4;height:auto;object-fit:cover;object-position:top;border-radius:14px;border:2px solid transparent;background:var(--blush);cursor:pointer;transition:border-color .2s;flex:0 0 auto}
.pdp-thumbs img.on{border-color:var(--red)}
.pdp-thumbs img:hover{border-color:var(--ink)}
.pdp-main{position:relative;aspect-ratio:3/4;border-radius:var(--r-lg);overflow:hidden;background:var(--blush)}
.pdp-main>img#mainImg{width:100%;height:100%;object-fit:cover;object-position:top;display:block}
.pdp-zoom{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:top;z-index:1;opacity:0;pointer-events:none;transform:scale(1);transform-origin:var(--zx,50%) var(--zy,50%);transition:opacity .12s ease-out,transform .22s ease-out}
@media (hover:hover) and (pointer:fine){.pdp-main.can-zoom{cursor:zoom-in}.pdp-main.zoomed .pdp-zoom{opacity:1;transform:scale(var(--zoom-scale,2))}}
@media (prefers-reduced-motion:reduce){.pdp-zoom{transition:opacity .12s ease-out}}
.pdp-tapzoom{display:none}
@media (hover:none),(pointer:coarse){
  .pdp-main{cursor:zoom-in}
  .pdp-tapzoom{display:flex;position:absolute;right:12px;top:12px;z-index:2;width:36px;height:36px;align-items:center;justify-content:center;border-radius:50%;background:rgba(255,255,255,.9);color:#262528;pointer-events:none}
  .pdp-tapzoom svg{width:16px;height:16px}
}
.pdp-nav{display:none;position:absolute;top:50%;transform:translateY(-50%);z-index:2;width:38px;height:38px;align-items:center;justify-content:center;padding:0;border:none;border-radius:50%;background:rgba(255,255,255,.9);color:#262528;cursor:pointer}
.pdp-nav.prev{left:10px}.pdp-nav.next{right:10px}
.pdp-nav svg{width:18px;height:18px}
.pdp-viewer{position:fixed;inset:0;z-index:1000;background:var(--bg);display:flex;flex-direction:column}
.pdp-viewer[hidden]{display:none}
.pdp-viewer__bar{display:flex;align-items:center;justify-content:space-between;padding:10px 12px;min-height:52px}
.pdp-viewer__count{font-size:13px;color:var(--muted);font-weight:600}
.pdp-viewer__close{width:44px;height:44px;display:flex;align-items:center;justify-content:center;border:none;background:var(--blush);border-radius:999px;color:var(--ink);cursor:pointer;padding:0}
.pdp-viewer__close svg{width:20px;height:20px}
.pdp-viewer__stage{position:relative;flex:1;overflow:hidden;touch-action:none}
.pdp-viewer__stage img{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;transform-origin:50% 50%;transition:transform .2s ease-out;user-select:none;-webkit-user-select:none;-webkit-user-drag:none}
.pdp-viewer.dragging .pdp-viewer__stage img{transition:none}
.pdp-viewer__nav{position:absolute;top:50%;transform:translateY(-50%);z-index:2;width:42px;height:42px;display:flex;align-items:center;justify-content:center;border:none;border-radius:50%;background:rgba(255,255,255,.9);color:#262528;padding:0;cursor:pointer}
.pdp-viewer__nav.prev{left:8px}.pdp-viewer__nav.next{right:8px}
.pdp-viewer__nav svg{width:20px;height:20px}
.pdp-viewer.zoomed .pdp-viewer__nav{display:none}
.pdp-viewer__hint{text-align:center;font-size:12px;color:var(--muted);padding:10px 12px 16px}
html.pdp-viewer-open,html.pdp-viewer-open body{overflow:hidden}
@media (prefers-reduced-motion:reduce){.pdp-viewer__stage img{transition:none}}
@media (max-width:900px){
  .pdp{grid-template-columns:1fr}
  .crumbs-bar{display:none}
  .pdp-gallery{position:relative;top:0;grid-template-columns:1fr;margin-inline:calc(var(--pad)*-1)}
  .pdp-main{order:1;border-radius:0;touch-action:pan-y}
  .pdp-thumbs{position:absolute;left:0;right:0;bottom:12px;z-index:2;flex-direction:row;max-height:none;padding:0 12px;gap:8px;overflow-x:auto;justify-content:center;justify-content:safe center}
  .pdp-thumbs img{width:44px;border-radius:10px;border-color:rgba(255,255,255,.7);box-shadow:0 1px 5px rgba(0,0,0,.28)}
  .pdp-thumbs img.on{border-color:#fff}
  .pdp-nav{display:flex}
}

.info{display:flex;flex-direction:column;gap:18px;min-width:0}
.info .kicker a{color:inherit;text-decoration:none}
.info h1{margin:0;font-family:var(--display);font-weight:800;font-size:clamp(30px,3.4vw,46px);letter-spacing:-.035em;line-height:1.02}
.rating-line{display:inline-flex;align-items:center;gap:8px;font-size:14px;color:var(--muted);text-decoration:none;align-self:flex-start;margin-top:-6px}
.rating-line:hover{color:var(--ink)}
.big-pr{display:flex;align-items:baseline;gap:12px;flex-wrap:wrap}
.big-pr b{font-family:var(--display);font-size:36px;font-weight:800;letter-spacing:-.02em}
.big-pr s{color:var(--muted);font-size:18px}
.big-pr em{font-style:normal;font-weight:700;color:#fff;background:var(--red);padding:3px 10px;border-radius:999px;font-size:14px}
.big-pr small{width:100%;color:var(--muted);font-size:13px;margin-top:-6px}
.availbox{border:1.5px solid var(--red);border-radius:18px;padding:14px 16px;display:flex;flex-direction:column;gap:4px;background:color-mix(in srgb,var(--red) 6%,var(--bg))}
.availbox:has(.avail-pill.out){border-color:var(--line);background:var(--blush)}
.availbox:has(.avail-pill.pre){border-color:var(--ink);background:var(--surface)}
.availbox>span{font-size:14px;color:var(--muted);line-height:1.5}
.avail-pill{display:inline-flex;align-items:center;gap:8px;font-family:var(--display);font-size:18px;font-weight:700}
.avail-pill .dot{width:9px;height:9px;border-radius:50%;background:var(--red);animation:blink 1.4s infinite}
.avail-pill.in .dot{background:var(--ok);animation:none}
.avail-pill.pre .dot{background:var(--ink);animation:none}
.avail-pill.out .dot{background:var(--muted);animation:none}
@keyframes blink{50%{opacity:.25}}
.opts{display:flex;flex-direction:column;gap:18px}
.opt-h{display:flex;justify-content:space-between;align-items:center;font-weight:700;margin-bottom:10px;gap:10px}
.opt-cur{font-weight:500;color:var(--muted)}
.opt-h button{background:none;border:none;color:var(--red-text);font-weight:700;text-decoration:underline;min-height:44px;display:inline-flex;align-items:center;gap:6px;padding:0}
.sizes{display:flex;gap:8px;flex-wrap:wrap}
.opt-pill{min-width:58px;min-height:52px;padding:0 16px;border-radius:14px;border:1.5px solid var(--line);background:var(--surface);color:var(--ink);font-weight:800;font-size:14px;display:inline-flex;align-items:center;justify-content:center;gap:8px;transition:all .2s;cursor:pointer}
.opt-pill:hover{border-color:var(--ink)}
.opt-pill.on,.opt-pill[aria-pressed="true"]{background:var(--ink);color:var(--bg);border-color:var(--ink)}
.opt-pill.na{color:var(--faint);text-decoration:line-through;border-style:dashed}
.opt-pill.is-colour{font-weight:700;font-size:13px;padding:0 14px 0 10px}
.opt-pill i{width:22px;height:22px;border-radius:999px;border:1px solid rgba(38,37,40,.18);flex-shrink:0}
.opt-pill.on i{box-shadow:0 0 0 2px var(--ink),0 0 0 3.5px var(--bg)}
.buy{display:flex;gap:10px;flex-wrap:wrap;align-items:stretch;margin:0}
.buy .btn-red{flex:1;min-width:180px}
.buy .qty button{height:48px}
.pdp-wish{width:50px;height:50px;border:1.5px solid var(--line);flex-shrink:0}
.pdp-wish svg{width:22px;height:22px;stroke:var(--red);fill:none}
.pdp-wish[aria-pressed="true"] svg{fill:var(--red)}
.pdp-wish span{display:flex}
.pdp-alt .btn{flex:1;min-width:190px}
.pre-box{display:flex;gap:12px;align-items:flex-start;background:var(--blush);border-radius:16px;padding:14px 16px;font-size:14px;color:var(--muted);line-height:1.55}
.pre-box b{color:var(--ink)}
.pre-box svg{color:var(--red);flex-shrink:0;margin-top:2px}
.pin-f{background:var(--surface);border:1px solid var(--line);border-radius:18px;padding:16px;display:flex;flex-direction:column;gap:6px}
.pin-res{font-size:14px;margin:0;color:var(--muted)}
.pin-res b{color:var(--ink)}
.perks{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
.perk{display:flex;gap:10px;align-items:center;background:var(--blush);border-radius:16px;padding:12px 14px;font-size:14px;font-weight:600;line-height:1.3}
.perk svg{width:22px;height:22px;color:var(--red);flex-shrink:0}
.perk small{display:block;font-weight:400;color:var(--muted);font-size:12.5px}
.safe-checkout{display:flex;align-items:center;gap:12px;flex-wrap:wrap;font-size:13px;color:var(--muted)}
.safe-checkout .sc-title{font-weight:700;color:var(--ink)}
.safe-checkout .pay span{border:1px solid var(--line);border-radius:6px;padding:3px 8px;font-weight:700;font-size:11.5px}
.pay-badges-img{max-width:100%;max-height:40px}
.pdp-acc{border-top:1px solid var(--line)}
.pdp-acc .ans{padding-right:10px}
.spec{border-collapse:collapse;margin:6px 0 12px;font-size:14.5px}
.spec th,.spec td{text-align:left;padding:7px 18px 7px 0;border-bottom:1px solid var(--line);font-weight:500}
.spec th{color:var(--muted);font-weight:600}
.spec a{color:var(--ink);font-weight:600}
.tags{color:var(--red-text);font-size:13.5px}
.ship-bar .ship-fill{display:block;height:100%}
.pdp-reviews .rev-grid{display:grid;grid-template-columns:300px minmax(0,1fr);gap:22px;align-items:start}
@media (max-width:860px){.pdp-reviews .rev-grid{grid-template-columns:1fr}}
.rev-avg{font-family:var(--display);font-size:56px;font-weight:800;letter-spacing:-.04em;line-height:1;display:block;margin-bottom:6px}
.rev-bar{display:flex;align-items:center;gap:8px;font-size:12.5px;color:var(--muted);margin-bottom:5px}
.rev-bar span:first-child{width:34px}
.rev-bar span:last-child{width:26px;text-align:right}
.rev-bar i{flex:1;height:7px;background:var(--blush);border-radius:99px;overflow:hidden}
.rev-bar i b{display:block;height:100%;background:var(--red);border-radius:99px}
.rev-form{display:flex;flex-direction:column;gap:12px;margin-bottom:16px}
.rev-form-h{display:flex;justify-content:space-between;align-items:center;gap:10px;flex-wrap:wrap}
.rev-form-h b{font-family:var(--display);font-size:20px}
.star-pick{display:flex;gap:4px;color:var(--red);cursor:pointer;user-select:none}
.star-pick svg{width:28px;height:28px}
.rev{margin:0;padding:16px 0;border-bottom:1px solid var(--line)}
.rev-top{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.rev-top b{font-weight:700}
.rev blockquote{margin:8px 0;color:var(--muted);font-size:15px;line-height:1.6}
.rev figcaption{font-size:12.5px;color:var(--muted)}
.ok-text{color:var(--ok);font-weight:600}
.rev-reply{margin-top:10px;padding:12px 14px;background:var(--blush);border-radius:14px}
.rev-reply b{font-size:13px;color:var(--red-text)}
.rev-reply p{margin:4px 0 0;font-size:14px;color:var(--muted)}
.sticky-buy{display:none}
@media (max-width:900px){
  .sticky-buy{display:flex;position:fixed;left:0;right:0;bottom:calc(84px + env(safe-area-inset-bottom));z-index:35;background:var(--surface);border-top:1px solid var(--line);padding:10px 14px;gap:10px;align-items:center;transform:translateY(160%);transition:transform .3s var(--ease)}
  .sticky-buy.show{transform:none}
  .sticky-buy div{flex:1;min-width:0;line-height:1.2}
  .sticky-buy b{font-family:var(--display);font-size:18px;display:block}
  .sticky-buy small{color:var(--muted);font-size:12px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;display:block}
  .sticky-buy .btn{min-height:46px}
}
/* the size guide dialog (views/partials/size-chart.ejs) */
.size-chart-modal{display:none;position:fixed;inset:0;background:rgba(20,14,15,.5);z-index:99;align-items:center;justify-content:center;padding:16px}
.size-chart-panel{background:var(--bg);border-radius:var(--r-lg);max-width:640px;width:100%;max-height:90vh;overflow:hidden;display:flex;flex-direction:column;box-shadow:0 30px 60px -30px rgba(0,0,0,.5)}
.size-chart-head{padding:16px 20px;border-bottom:1px solid var(--line);display:flex;justify-content:space-between;align-items:center;gap:12px}
.size-chart-head h3{margin:0;font-family:var(--display);font-size:22px;color:var(--ink)}
.size-chart-head button{width:40px;height:40px;border-radius:999px;border:none;background:var(--blush);color:var(--ink);font-size:22px;line-height:1;cursor:pointer}
.size-chart-body{padding:18px;overflow-y:auto;text-align:center}
.size-chart-body.is-table{text-align:left}
.size-chart-body img{max-width:100%;height:auto;display:inline-block;border-radius:14px}
.size-chart-empty{padding:40px;color:var(--muted)}
.size-chart-scroll{overflow-x:auto;border:1px solid var(--line);border-radius:14px;background:var(--surface)}
.size-chart-table{border-collapse:collapse;width:100%;font-size:14.5px;color:var(--ink)}
.size-chart-table th,.size-chart-table td{padding:12px 14px;text-align:left;white-space:nowrap;border-bottom:1px solid var(--line)}
.size-chart-table thead th{font-size:13px;color:var(--muted);font-weight:700}
.size-chart-table tbody th{font-weight:700}
.size-chart-table tbody tr:last-child th,.size-chart-table tbody tr:last-child td{border-bottom:none}
@media (max-width:640px){.size-chart-modal{align-items:flex-end;padding:0}.size-chart-panel{border-radius:24px 24px 0 0;max-height:88vh}}

/* ── Bag summary · checkout form · confirmation · order tracking ─────────────
   The design's own rules for the order pages. `.summary` sits beside the lines
   on the bag and beside the form at checkout; `.fs` is one fieldset of the
   checkout form; `.done` is the thank-you block the payment and confirmation
   pages share; `.timeline` is the tracking page's five stages. */
.summary{background:var(--surface);border-radius:var(--r-lg);padding:26px;display:flex;flex-direction:column;gap:14px;position:sticky;top:100px;border:1px solid var(--line)}
.summary h2{margin:0;font-family:var(--display);font-size:24px}
@media (max-width:980px){.summary{position:static}}
.hint{font-size:12.5px;color:var(--muted);line-height:1.5;margin:0}
.form{display:flex;flex-direction:column;gap:22px}
.fs{border:1px solid var(--line);background:var(--surface);border-radius:var(--r-md);padding:22px;margin:0;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;min-width:0}
.fs legend{font-family:var(--display);font-weight:800;font-size:20px;padding:0 6px}
.fs .full,.fld.full{grid-column:1/-1}
@media (max-width:620px){.fs{grid-template-columns:1fr}}
.fld{display:flex;flex-direction:column;gap:6px;min-width:0}
.fld label{font-weight:600;font-size:14px}
.fld input,.fld select,.fld textarea{min-height:48px;border-radius:12px;border:1.5px solid var(--line);padding:10px 14px;background:var(--bg);color:var(--ink);width:100%;font:inherit}
.fld input:focus,.fld select:focus,.fld textarea:focus{outline:none;border-color:var(--ink)}
.fld textarea{min-height:110px;resize:vertical}
.fld [aria-invalid="true"]{border-color:var(--red)}
.checkline{display:flex;gap:10px;align-items:center;font-size:14.5px;cursor:pointer}
.checkline input{width:18px;height:18px;accent-color:var(--red)}
.payopt{grid-column:1/-1;display:flex;gap:12px;align-items:center;border:1.5px solid var(--line);border-radius:14px;padding:14px 16px;cursor:pointer;transition:border-color .2s,background-color .2s}
.payopt input{width:20px;height:20px;accent-color:var(--red);flex-shrink:0}
.payopt div{flex:1}
.payopt small{display:block;color:var(--muted)}
.payopt:has(input:checked){border-color:var(--ink);background:var(--blush)}
.payopt:has(input:disabled){opacity:.55;cursor:not-allowed}
.credit-box{display:flex;flex-direction:column;gap:10px;border:1.5px dashed var(--line);border-radius:14px;padding:14px 16px}
.credit-box label{display:flex;flex-direction:column;gap:4px;cursor:pointer}
.credit-box input{min-height:46px;border-radius:12px;border:1.5px solid var(--line);padding:0 14px;background:var(--bg);color:var(--ink);font:inherit}
.done{text-align:center;max-width:640px;margin:0 auto;padding:40px 0 10px;display:flex;flex-direction:column;align-items:center;gap:14px}
.check{width:96px;height:96px}
.check circle{stroke:var(--red);stroke-width:4;fill:none;stroke-dasharray:290;stroke-dashoffset:290;animation:draw .7s ease forwards}
.check path{stroke:var(--red);stroke-width:5;fill:none;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:60;stroke-dashoffset:60;animation:draw .4s .6s ease forwards}
@keyframes draw{to{stroke-dashoffset:0}}
.code{font-family:var(--display);font-weight:800;font-size:28px;background:var(--blush);padding:8px 18px;border-radius:14px;letter-spacing:.02em}
.timeline{list-style:none;padding:0;margin:20px 0 0;display:flex;flex-direction:column;gap:0;text-align:left;width:100%}
.timeline li{display:grid;grid-template-columns:36px 1fr;gap:14px;position:relative;padding-bottom:22px}
.timeline li::before{content:"";position:absolute;left:17px;top:34px;bottom:0;width:2px;background:var(--line)}
.timeline li:last-child::before{display:none}
.timeline li.ok::before{background:var(--red)}
.timeline li.now::before{background:var(--line)}
.timeline .n{width:36px;height:36px;border-radius:999px;border:2px solid var(--line);background:var(--surface);display:flex;align-items:center;justify-content:center;font-weight:800;font-size:13px}
.timeline li.ok .n{background:var(--red);border-color:var(--red);color:#fff}
.timeline li.now .n{box-shadow:0 0 0 6px color-mix(in srgb,var(--red) 18%,transparent)}
.timeline b{display:block}
.timeline small{color:var(--muted)}
.track-form{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr) auto;gap:14px;align-items:start}
.track-form .btn{margin-top:26px}
@media (max-width:720px){.track-form{grid-template-columns:1fr}.track-form .btn{margin-top:0}}
.track-top{display:flex;justify-content:space-between;align-items:flex-start;gap:12px;flex-wrap:wrap}
.track-code{font-family:var(--display);font-weight:800;font-size:24px}
.track-items{display:flex;flex-direction:column;gap:10px;margin-top:8px;border-top:1px solid var(--line);padding-top:16px}
.track-items .row span:first-child{min-width:0;overflow-wrap:anywhere}
@media (prefers-reduced-motion:reduce){.check circle,.check path{animation:none;stroke-dashoffset:0}}

/* ── Account area · sign-in pages ─────────────────────────────────────────
   The design draws no account screens, so these are built from its own parts:
   the shop hero for the title, `.box` and `.fs` for panels and forms, chips for
   the navigation on a phone. */
.acct{display:grid;grid-template-columns:230px minmax(0,1fr);gap:clamp(20px,4vw,44px);align-items:start;padding-bottom:56px}
.acct-main{min-width:0}
.acct-nav{display:flex;flex-direction:column;gap:4px;position:sticky;top:100px}
.acct-nav a{display:flex;align-items:center;gap:10px;min-height:46px;padding:0 14px;border-radius:14px;color:var(--ink);text-decoration:none;font-weight:600;font-size:15px;transition:background-color .2s,color .2s}
.acct-nav a:hover{background:var(--blush)}
.acct-nav a.on{background:var(--ink);color:var(--bg)}
.acct-nav a svg{width:18px;height:18px;flex-shrink:0}
.acct-nav .acct-out{color:var(--muted);margin-top:8px;border-top:1px solid var(--line);border-radius:0 0 14px 14px;padding-top:4px}
@media (max-width:860px){
  .acct{grid-template-columns:1fr}
  .acct-nav{flex-direction:row;overflow-x:auto;position:static;gap:8px;padding-bottom:4px;scrollbar-width:none;margin:0 -16px;padding-inline:16px}
  .acct-nav::-webkit-scrollbar{display:none}
  .acct-nav a{border:1.5px solid var(--line);border-radius:999px;white-space:nowrap;min-height:44px}
  .acct-nav a.on{border-color:var(--ink)}
  .acct-nav .acct-out{margin-top:0;border-top:1.5px solid var(--line);border-radius:999px;padding-top:0}
}
.stats{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}
.stat{background:var(--blush);border-radius:var(--r-md);padding:20px;display:flex;flex-direction:column;gap:6px;text-decoration:none;color:var(--ink);transition:transform .25s var(--ease)}
.stat:hover{transform:translateY(-2px)}
.stat b{font-family:var(--display);font-weight:800;font-size:34px;letter-spacing:-.03em;line-height:1;min-height:34px;display:flex;align-items:center}
.stat span{color:var(--muted);font-size:14px;font-weight:600}
@media (max-width:560px){.stats{grid-template-columns:1fr 1fr}.stats .stat:last-child{grid-column:1/-1}}
.olist{display:flex;flex-direction:column;border-top:1px solid var(--line)}
.orow{display:grid;grid-template-columns:minmax(110px,1fr) minmax(0,1.4fr) auto auto 24px;gap:14px;align-items:center;padding:16px 4px;border-bottom:1px solid var(--line);text-decoration:none;color:var(--ink);transition:background-color .2s}
.orow:hover{background:color-mix(in srgb,var(--blush) 60%,transparent)}
.orow b{font-family:var(--display);font-weight:800;font-size:17px}
.orow .go{color:var(--muted);display:flex}
@media (max-width:640px){.orow{grid-template-columns:1fr auto;row-gap:4px}.orow .muted{grid-column:1}.orow .pill{grid-row:1;grid-column:2;justify-self:end}.orow .go{display:none}}
.addr-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}
.addr-grid .box+.box{margin-top:0}
.addr p{margin:8px 0 0}
@media (max-width:640px){.addr-grid{grid-template-columns:1fr}}
.link.sm{font-size:14px;min-height:36px}
button.link{background:none;border:0;padding:0;cursor:pointer;font:inherit;font-weight:700}
.stages{flex-direction:row;margin:0 0 8px}
.stages li{grid-template-columns:1fr;justify-items:center;text-align:center;flex:1;padding-bottom:0;gap:8px}
.stages li::before{left:calc(50% + 18px);right:calc(-50% + 18px);top:17px;bottom:auto;width:auto;height:2px}
.stages b{font-size:13px}
@media (max-width:520px){.stages b{font-size:11px}}
.rr-dialog{border:0;border-radius:var(--r-lg);padding:26px;max-width:480px;width:calc(100% - 32px);background:var(--surface);color:var(--ink);box-shadow:0 30px 80px rgba(0,0,0,.25)}
.rr-dialog::backdrop{background:rgba(24,20,22,.5)}
.rr-dialog .form{gap:16px}
.auth{display:flex;justify-content:center;padding:clamp(32px,6vw,72px) 16px}
.auth-box{width:100%;max-width:460px;display:flex;flex-direction:column;gap:16px}
.auth-box .h-lg{font-size:clamp(30px,4vw,40px)}
.auth-box .form{gap:16px}
.auth-alt{margin:0;text-align:center;color:var(--muted);font-size:14.5px}
.auth-alt a,.auth-box .hint a{color:var(--ink);font-weight:700}
.auth-ic{width:60px;height:60px;border-radius:999px;background:var(--blush);color:var(--red);display:flex;align-items:center;justify-content:center}
.pw-wrap{position:relative}
.pw-wrap input{padding-right:48px}
.pw-toggle{position:absolute;top:0;right:0;height:100%;width:46px;display:flex;align-items:center;justify-content:center;background:none;border:0;padding:0;cursor:pointer;color:var(--muted);border-radius:0 12px 12px 0;transition:color .15s}
.pw-toggle:hover,.pw-toggle[aria-pressed="true"]{color:var(--ink)}
.pw-toggle:focus-visible{outline:2px solid var(--ink);outline-offset:-2px}
.pw-toggle svg{width:19px;height:19px;display:block}
.pw-toggle .pw-slash{opacity:0;transition:opacity .12s}
.pw-toggle[aria-pressed="true"] .pw-slash{opacity:1}
/* The journal index stacks rather than scrolls: on the homepage the row is a
   taste of three, on /blog it is the whole list. */
.journal.all{row-gap:34px}
@media (max-width:860px){.journal.all{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));overflow:visible;margin-inline:0;padding-inline:0}.journal.all .jcard{flex:none}.journal.all .jcard p{display:block}}
@media (max-width:560px){.journal.all{grid-template-columns:1fr}}
.guide-hero{margin:0;aspect-ratio:16/9;border-radius:var(--r-lg);overflow:hidden;background:var(--blush)}
.guide-hero img{width:100%;height:100%;object-fit:cover;display:block}

.btn-row.al-c{justify-content:center}.btn-row.al-r{justify-content:flex-end}