/* =========================================================
   AJ SMILES FOR MILES — REDESIGN LAYER
   "Frame & mat" design language · red + white
   Loaded after style.css. Re-skins the whole storefront.
   Sections:
    1  Tokens            8  Hero stage
    2  Base              9  Section heads · categories · process · bulk
    3  Loader            10 Product cards
    4  Utilities / FX    11 Reviews
    5  Marquee           12 Trust bar · rate strip · footer
    6  Header / nav      13 Inner pages, forms, filters
    7  Buttons           14 Drawers, modals, toasts · motion prefs
   ========================================================= */

/* ---------- 1. TOKENS ---------- */
@property --ang{ syntax:"<angle>"; inherits:false; initial-value:0deg; }
:root{
  --red-50:#FFF4F4;
  --red-100:#FFE3E5;
  --red-200:#FAC3C8;
  --red-400:#EC4A5C;
  --red-500:#DB1F36;
  --red-600:#C8102E;
  --red-700:#A30D24;
  --red-800:#7A0A1B;
  --red-900:#4A0611;
  --charcoal:#1D1517;
  --charcoal-2:#2A2022;
  --paper:#FFFFFF;
  --mist:#F7F3F2;
  --mist-2:#F0E9E8;

  /* legacy tokens re-pointed so every old rule picks up the new palette */
  --bg:#FFFFFF;
  --bg-soft:var(--red-50);
  --card:#FFFFFF;
  --ink:var(--charcoal);
  --ink-soft:#6B5F61;
  --maroon:var(--red-600);
  --maroon-dark:var(--red-800);
  --maroon-deep:var(--charcoal);
  --rose:var(--red-500);
  --gold:var(--red-600);
  --gold-light:var(--red-200);
  --gold-tint:var(--red-50);
  --gold-dark:var(--red-700);
  --green:var(--red-600);
  --jute:#6B5F61;
  --line:#EBDEDF;
  --line-soft:rgba(163,13,36,.08);
  --shadow-sm:0 1px 2px rgba(29,21,23,.05),0 4px 12px -4px rgba(122,10,27,.10);
  --shadow:0 18px 40px -18px rgba(122,10,27,.28);
  --shadow-hover:0 28px 56px -22px rgba(122,10,27,.38);
  --radius-s:10px;
  --radius-m:18px;
  --radius-l:28px;
  --font-display:'Bricolage Grotesque','Manrope',system-ui,sans-serif;
  --font-serif:'Instrument Serif','Playfair Display',Georgia,serif;
  --font-body:'Manrope',-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,sans-serif;
  --font-price:'Bricolage Grotesque','Manrope',system-ui,sans-serif;
  --ease:cubic-bezier(.2,.75,.25,1);
  --glass:rgba(255,255,255,.72);
  --header-h:76px;
}

/* ---------- 2. BASE ---------- */
html{ scroll-behavior:smooth; scroll-padding-top:96px; -webkit-text-size-adjust:100%; }
body{
  font-family:var(--font-body);
  font-size:15.5px;
  color:var(--ink);
  background:var(--paper);
  overflow-x:hidden;
  text-rendering:optimizeLegibility;
}
h1,h2,h3,h4{
  font-family:var(--font-display);
  color:var(--charcoal);
  letter-spacing:-.022em;
  line-height:1.12;
  font-weight:700;
}
h1 em,h2 em,h3 em{
  font-family:var(--font-serif);
  font-style:italic;
  font-weight:400;
  letter-spacing:-.01em;
  color:var(--red-600);
}
::selection{ background:var(--red-600); color:#fff; }
img,svg,video{ max-width:100%; }
.container{ max-width:1280px; padding-left:clamp(16px,4vw,32px); padding-right:clamp(16px,4vw,32px); }
:focus-visible{ outline:2px solid var(--red-600); outline-offset:3px; border-radius:6px; }
.skip-link{
  position:fixed; left:12px; top:-60px; z-index:10001; background:var(--charcoal); color:#fff;
  padding:10px 16px; border-radius:10px; font-weight:700; font-size:13px; transition:top .2s ease;
}
.skip-link:focus{ top:12px; }
main#app{ min-height:60vh; }

/* slim custom scrollbar */
@supports (scrollbar-color:auto){
  html{ scrollbar-color:var(--red-600) var(--mist); scrollbar-width:thin; }
}

/* ---------- 3. LOADER ---------- */
#loader{
  position:fixed; inset:0; z-index:9999; display:flex; align-items:center; justify-content:center;
  background:
    radial-gradient(60% 50% at 80% 10%,rgba(200,16,46,.12),transparent 70%),
    radial-gradient(50% 50% at 10% 90%,rgba(200,16,46,.08),transparent 70%),
    #fff;
  overflow:hidden; isolation:isolate;
  transition:opacity .55s ease, visibility .55s ease;
}
#loader::before,#loader::after{ content:none; }
#loader.done, #loader[style*="display: none"]{ opacity:0 !important; visibility:hidden !important; pointer-events:none !important; }
#loader .loader-center{ display:flex; flex-direction:column; align-items:center; width:min(420px,calc(100% - 40px)); text-align:center; }
#loader .loader-frame{ width:76px; height:auto; overflow:visible; margin-bottom:22px; }
#loader .loader-frame rect,#loader .loader-frame path{ fill:none; stroke:var(--red-600); stroke-width:3; stroke-linejoin:round; }
#loader .lf-outer{ stroke-dasharray:500; stroke-dashoffset:500; animation:lf-draw 1.3s var(--ease) .1s forwards; }
#loader .lf-inner{ stroke-width:1.6 !important; stroke:var(--red-400) !important; stroke-dasharray:400; stroke-dashoffset:400; animation:lf-draw 1.2s var(--ease) .5s forwards; }
#loader .lf-heart{ fill:var(--red-600) !important; stroke:none !important; transform-origin:60px 78px; opacity:0; animation:lf-pop .7s var(--ease) 1.1s forwards, lf-beat 1.6s ease-in-out 1.8s infinite; }
@keyframes lf-draw{ to{ stroke-dashoffset:0; } }
@keyframes lf-pop{ from{ opacity:0; transform:scale(.3); } to{ opacity:1; transform:scale(1); } }
@keyframes lf-beat{ 0%,100%{ transform:scale(1); } 50%{ transform:scale(1.12); } }
#loader .loader-word{
  position:static; width:auto; white-space:nowrap; pointer-events:none;
  font-family:var(--font-display); font-weight:800; letter-spacing:-.03em; color:var(--charcoal);
  font-size:clamp(26px,7.6vw,40px); line-height:1.05; animation:loader-in .8s var(--ease) .3s both;
}
#loader .loader-sub{
  margin-top:8px; font-size:10.5px; font-weight:700; letter-spacing:.34em; text-transform:uppercase; color:var(--red-600);
  animation:loader-in .8s var(--ease) .45s both;
}
#loader .loader-bar{
  width:min(200px,70%); height:3px; border-radius:3px; overflow:hidden; background:var(--red-100); margin:22px auto 0;
  animation:loader-in .6s ease .5s both;
}
#loader .loader-bar-fill{
  height:100%; width:0; border-radius:inherit; background:linear-gradient(90deg,var(--red-400),var(--red-700));
  animation:loader-progress 2.6s var(--ease) .4s forwards;
}
@keyframes loader-in{ from{ opacity:0; transform:translateY(10px); } to{ opacity:1; transform:none; } }
@keyframes loader-progress{ to{ width:100%; } }

/* ---------- 4. UTILITIES / FX ---------- */
.scroll-progress{
  position:fixed; left:0; top:0; right:0; height:3px; z-index:10000; transform-origin:0 50%; transform:scaleX(0);
  background:linear-gradient(90deg,var(--red-400),var(--red-600),var(--red-800)); pointer-events:none;
}

/* ---------- top-of-page falling glitter ---------- */
.glitter-rain{ position:absolute; top:0; left:0; width:100%; height:260px; overflow:hidden; pointer-events:none; z-index:550; }
.glitter-rain i{
  position:absolute; top:-16px; left:var(--x,50%); width:var(--size,5px); height:var(--size,5px);
  background:radial-gradient(circle, #fff 0%, #fff 35%, var(--red-600) 70%, transparent 85%);
  border-radius:50%; opacity:0;
  box-shadow:0 0 0 1px rgba(255,255,255,.6);
  filter:drop-shadow(0 0 5px rgba(200,16,46,.85)) drop-shadow(0 0 2px rgba(255,255,255,.9));
  animation:glitter-fall var(--dur,6s) linear infinite; animation-delay:var(--delay,0s);
}
@keyframes glitter-fall{
  0%{ transform:translateY(0) rotate(0deg) scale(.6); opacity:0; }
  10%{ opacity:1; }
  80%{ opacity:1; }
  100%{ transform:translateY(280px) rotate(220deg) scale(1); opacity:0; }
}
@media (max-width:640px){ .glitter-rain{ height:190px; } }

.fx-ripple{
  position:absolute; border-radius:50%; pointer-events:none; z-index:0;
  background:radial-gradient(circle,rgba(255,255,255,.55) 0,rgba(255,255,255,0) 70%);
  transform:scale(0); opacity:.9; animation:fx-ripple .6s ease-out forwards;
}
.chip .fx-ripple,.icon-btn .fx-ripple,.hero-spotlight-btn-secondary .fx-ripple,.btn-outline .fx-ripple,.bulk-link .fx-ripple{
  background:radial-gradient(circle,rgba(200,16,46,.22) 0,rgba(200,16,46,0) 70%);
}
@keyframes fx-ripple{ to{ transform:scale(1); opacity:0; } }

.section-kicker{
  display:inline-flex; align-items:center; gap:10px;
  font-family:var(--font-body); font-size:11.5px; font-weight:800; letter-spacing:.22em; text-transform:uppercase;
  color:var(--red-600); margin:0 0 12px;
}
.section-kicker::before{
  content:""; width:22px; height:14px; border:2px solid var(--red-600); border-radius:3px; position:relative;
  box-shadow:3px 3px 0 -0px var(--red-100), 3px 3px 0 0 var(--red-200);
  flex:0 0 auto;
}

/* reveal: gentler, no layout shift */
.reveal{ opacity:0; transform:translateY(22px); transition:opacity .8s var(--ease) var(--reveal-delay,0ms), transform .8s var(--ease) var(--reveal-delay,0ms); }
.reveal.is-visible{ opacity:1; transform:none; }

/* ---------- 5. MARQUEE ---------- */
.marquee-bar{
  background:var(--charcoal); color:#fff; height:34px;
  border-bottom:1px solid rgba(255,255,255,.06);
}
.marquee-track span{ font-size:11.5px; font-weight:600; letter-spacing:.06em; text-transform:uppercase; }
.marquee-track span::before{ color:var(--red-400); }

/* ---------- 6. HEADER / NAV ---------- */
header.site-header{
  position:sticky; top:0; z-index:500;
  background:transparent !important; border-bottom:0 !important;
  backdrop-filter:none; padding-top:10px; pointer-events:none;
}
header.site-header > *{ pointer-events:auto; }
header.site-header > .container{ pointer-events:none; }
header.site-header > .container > *{ pointer-events:auto; }
.header-row{
  height:64px !important; padding:0 10px 0 18px !important;
  background:var(--glass); backdrop-filter:blur(18px) saturate(1.6); -webkit-backdrop-filter:blur(18px) saturate(1.6);
  border:1px solid rgba(200,16,46,.12); border-radius:20px;
  box-shadow:0 1px 0 rgba(255,255,255,.9) inset,0 10px 30px -14px rgba(122,10,27,.28);
  transition:box-shadow .3s ease, background .3s ease, transform .3s ease;
}
header.site-header.is-scrolled .header-row{
  background:rgba(255,255,255,.9);
  box-shadow:0 1px 0 rgba(255,255,255,.9) inset,0 16px 36px -14px rgba(122,10,27,.4);
}
.brand{ gap:11px; }
.brand img{ width:40px; height:40px; border-radius:11px; filter:none; }
.brand .brand-text{
  font-family:var(--font-display); font-weight:800; font-size:21px; letter-spacing:-.035em; color:var(--charcoal); line-height:1;
}
.brand .brand-text small{
  font-family:var(--font-body); font-size:8.5px; font-weight:800; letter-spacing:.3em; color:var(--red-600); margin-top:5px;
}
nav.main-nav{ gap:4px; background:var(--mist); padding:4px; border-radius:999px; }
nav.main-nav a{
  font-size:13.5px; font-weight:700; color:var(--charcoal); padding:9px 16px; border-radius:999px; position:relative; overflow:hidden;
  transition:color .25s ease, background .25s ease;
}
nav.main-nav a::after{
  content:""; position:absolute; left:16px; right:16px; bottom:5px; top:auto; height:2px; border-radius:2px;
  background:var(--red-600); transform:scaleX(0); transform-origin:100% 50%; transition:transform .35s var(--ease);
}
nav.main-nav a:hover{ color:var(--red-600); }
nav.main-nav a:hover::after,nav.main-nav a.active::after{ right:16px; transform:scaleX(1); transform-origin:0 50%; }
nav.main-nav a.active{ color:#fff; background:linear-gradient(135deg,var(--red-500),var(--red-700)); box-shadow:0 6px 16px -6px rgba(163,13,36,.6); }
nav.main-nav a.active::after{ display:none; }
.header-icons{ gap:6px; }
.icon-btn{
  width:42px; height:42px; min-width:42px; border:0; border-radius:14px; background:transparent; color:var(--charcoal); overflow:visible;
  transition:background .25s ease,color .25s ease,transform .25s var(--ease),box-shadow .25s ease;
}
.icon-btn:hover{ background:var(--red-50); color:var(--red-600); border:0; transform:translateY(-2px) scale(1.05); box-shadow:0 8px 18px -8px rgba(163,13,36,.4); }
.icon-btn:active{ transform:scale(.94); }
.icon-btn svg{ width:21px; height:21px; stroke-width:1.8; }
.icon-badge{
  top:2px; right:1px; min-width:18px; height:18px; font-size:10px;
  background:linear-gradient(135deg,var(--red-500),var(--red-700)); border:2px solid #fff; box-shadow:0 3px 8px -2px rgba(163,13,36,.6);
}
.social-divider{ background:var(--line); height:22px; width:1px; margin:0 4px; }
.top-menu-toggle{ display:none; }

/* search panel drops below the pill */
.search-panel{ margin:8px auto 0; max-width:1216px; border:0; background:transparent; }
.search-panel .container{ padding-left:0; padding-right:0; }
.search-panel input{
  background:#fff; border:1px solid rgba(200,16,46,.2); border-radius:16px; padding:14px 20px; font-size:15px;
  box-shadow:0 18px 36px -18px rgba(122,10,27,.4); transition:border-color .2s ease, box-shadow .2s ease;
}
.search-panel input:focus{ outline:0; border-color:var(--red-600); box-shadow:0 0 0 4px rgba(200,16,46,.14),0 18px 36px -18px rgba(122,10,27,.4); }
.search-pill{ border-radius:999px; border-color:var(--line); font-weight:600; }
.search-pill:hover{ background:var(--red-600); border-color:var(--red-600); }

/* mobile rail */
.mobile-subnav-rail{
  background:transparent !important; border:0 !important; padding:8px 0 0 !important; margin:0 12px;
}
.mobile-subnav-track{ padding:0 !important; gap:8px !important; }
.mobile-subnav-track a{
  font-size:12.5px !important; font-weight:700 !important; color:var(--charcoal) !important;
  background:rgba(255,255,255,.86) !important; border:1px solid rgba(200,16,46,.14) !important;
  backdrop-filter:blur(10px); padding:8px 15px !important; border-radius:999px !important; min-height:36px; display:inline-flex; align-items:center;
}
.mobile-subnav-track a:hover,.mobile-subnav-track a.active{
  background:linear-gradient(135deg,var(--red-500),var(--red-700)) !important; color:#fff !important; border-color:transparent !important;
  box-shadow:0 8px 18px -8px rgba(163,13,36,.6) !important;
}

@media (max-width:860px){
  .site-header .container{ padding:0 12px; }
  header.site-header{ padding-top:8px; }
  .header-row{ height:58px !important; padding:0 8px !important; border-radius:18px; gap:6px !important; }
  .top-menu-toggle{
    display:inline-flex !important; width:42px !important; height:42px !important; min-width:42px !important; border:0 !important;
    border-radius:14px !important; background:var(--red-50) !important; color:var(--red-600) !important; box-shadow:none !important;
  }
  .brand{ flex-direction:row !important; flex:1 1 auto; min-width:0; justify-content:center !important; gap:8px !important; padding:0 !important; }
  .brand img{ width:30px !important; height:30px !important; }
  .brand .brand-text{ font-size:clamp(15px,4.6vw,19px) !important; align-items:flex-start !important; color:var(--charcoal) !important; letter-spacing:-.03em !important; white-space:nowrap; }
  .brand .brand-text small{ display:none !important; }
  .header-icons{ gap:2px !important; padding:0 !important; }
  .header-icons .icon-btn{ width:38px !important; height:38px !important; min-width:38px !important; border:0 !important; background:transparent !important; color:var(--charcoal) !important; border-radius:12px !important; }
  .header-icons .icon-btn svg{ width:20px !important; height:20px !important; stroke-width:1.8px !important; }
  .icon-badge{ top:1px !important; right:0 !important; border:1.5px solid #fff !important; }
}
@media (max-width:420px){
  .header-icons .account-toggle{ display:none !important; }
  .brand img{ display:none !important; }
}

/* ---------- 7. BUTTONS ---------- */
.btn{
  position:relative; overflow:hidden; isolation:isolate;
  font-family:var(--font-body); font-weight:700; font-size:14px; letter-spacing:.01em;
  padding:13px 24px; border-radius:14px; gap:9px; min-height:44px;
  transition:transform .3s var(--ease), box-shadow .3s ease, background .3s ease, color .3s ease, border-color .3s ease;
}
.btn:active{ transform:scale(.97) !important; }
.btn-primary{
  color:#fff; border:0;
  background:linear-gradient(135deg,var(--red-500) 0%,var(--red-700) 100%);
  box-shadow:0 12px 26px -12px rgba(163,13,36,.75),0 1px 0 rgba(255,255,255,.25) inset;
}
.btn-primary::after{
  content:""; position:absolute; z-index:-1; top:-50%; bottom:-50%; left:-60%; width:36%;
  background:linear-gradient(90deg,transparent,rgba(255,255,255,.55),transparent); transform:skewX(-22deg);
  animation:btn-shine 4.8s ease-in-out 1.2s infinite; pointer-events:none;
}
.btn-primary:hover{ background:linear-gradient(135deg,var(--red-600) 0%,var(--red-800) 100%); transform:translateY(-3px); box-shadow:0 18px 32px -12px rgba(163,13,36,.8); }
.btn-primary:hover::after{ animation:btn-shine-fast .8s var(--ease); }
@keyframes btn-shine{ 0%,62%{ left:-60%; } 82%,100%{ left:130%; } }
@keyframes btn-shine-fast{ from{ left:-60%; } to{ left:130%; } }
.btn-outline{ background:#fff; border:1.5px solid var(--red-200); color:var(--red-700); }
.btn-outline:hover{ background:var(--red-600); border-color:var(--red-600); color:#fff; transform:translateY(-2px); box-shadow:0 12px 24px -12px rgba(163,13,36,.6); }
.btn-gold{ background:var(--charcoal); color:#fff; }
.btn-gold:hover{ background:var(--charcoal-2); box-shadow:0 12px 24px -12px rgba(29,21,23,.7); transform:translateY(-2px); }
.btn-sm{ padding:9px 16px; font-size:13px; border-radius:12px; min-height:40px; }
.btn[disabled]{ opacity:.5; }
.btn-primary[disabled]::after{ animation:none; }

/* ---------- 8. HERO STAGE ---------- */
.hero-stage{
  position:relative; overflow:hidden; isolation:isolate;
  margin-top:-74px; padding:clamp(96px,11vw,128px) 0 clamp(52px,7vw,96px);
  background:linear-gradient(180deg,#fff 0%,var(--red-50) 100%);
}
.hero-stage::after{ /* diagonal sweep into the next section */
  content:""; position:absolute; left:0; right:0; bottom:-1px; height:clamp(36px,5vw,72px); z-index:1; background:#fff;
  clip-path:polygon(0 100%,100% 100%,100% 0); pointer-events:none;
}
.hero-stage-bg{ position:absolute; inset:0; z-index:-1; pointer-events:none; overflow:hidden; }
.hero-stage-bg::before{ /* faint frame-grid */
  content:""; position:absolute; inset:0; opacity:.5;
  background-image:linear-gradient(rgba(200,16,46,.07) 1px,transparent 1px),linear-gradient(90deg,rgba(200,16,46,.07) 1px,transparent 1px);
  background-size:56px 56px;
  -webkit-mask-image:radial-gradient(70% 70% at 70% 30%,#000,transparent 75%); mask-image:radial-gradient(70% 70% at 70% 30%,#000,transparent 75%);
}
.hero-stage-bg .orb{ position:absolute; border-radius:50%; filter:blur(60px); will-change:transform; }
.hero-stage-bg .o1{ width:520px; height:520px; right:-120px; top:-140px; background:radial-gradient(circle,rgba(219,31,54,.34),transparent 65%); animation:orb-a 16s ease-in-out infinite alternate; transform:translate(calc(var(--px,0)*-30px),calc(var(--py,0)*-24px)); }
.hero-stage-bg .o2{ width:420px; height:420px; left:-140px; bottom:-60px; background:radial-gradient(circle,rgba(200,16,46,.2),transparent 65%); animation:orb-b 20s ease-in-out infinite alternate; }
.hero-stage-bg .o3{ width:260px; height:260px; left:42%; top:12%; background:radial-gradient(circle,rgba(250,195,200,.7),transparent 65%); animation:orb-b 14s ease-in-out infinite alternate-reverse; }
@keyframes orb-a{ to{ translate:-40px 50px; } }
@keyframes orb-b{ to{ translate:50px -40px; } }

.hero-stage-grid{
  display:grid; grid-template-columns:minmax(0,1.02fr) minmax(0,.98fr); gap:clamp(28px,5vw,72px); align-items:center;
}
.hero-spotlight-section{ background:none !important; border:0 !important; padding:0 !important; position:relative; }
.hero-spotlight-container{ max-width:none !important; margin:0 !important; text-align:left !important; }
.hero-spotlight-eyebrow{
  display:inline-flex !important; align-items:center; gap:10px; margin:0 0 20px !important;
  padding:7px 14px 7px 8px; border-radius:999px; background:#fff; border:1px solid var(--red-200);
  font-size:11px !important; font-weight:800 !important; letter-spacing:.14em !important; text-transform:uppercase; color:var(--red-700) !important;
  box-shadow:0 8px 20px -12px rgba(163,13,36,.5);
}
.hero-spotlight-eyebrow i{ width:22px; height:22px; border-radius:50%; background:linear-gradient(135deg,var(--red-500),var(--red-700)); position:relative; flex:0 0 auto; }
.hero-spotlight-eyebrow i::after{ content:""; position:absolute; inset:6px; border-radius:50%; background:#fff; animation:pulse-dot 2.2s ease-in-out infinite; }
@keyframes pulse-dot{ 50%{ transform:scale(.45); } }
.hero-spotlight-heading{
  font-family:var(--font-display) !important; font-weight:800 !important; color:var(--charcoal) !important;
  font-size:clamp(38px,6.2vw,84px) !important; line-height:.98 !important; letter-spacing:-.045em !important; margin:0 0 22px !important; text-wrap:balance;
}
.hero-spotlight-heading em,.hero-spotlight-heading i{
  font-family:var(--font-serif) !important; font-style:italic; font-weight:400 !important; letter-spacing:-.02em;
  font-size:1.08em; display:inline-block; padding-right:.06em;
  background:linear-gradient(100deg,var(--red-500),var(--red-800)); -webkit-background-clip:text; background-clip:text; -webkit-text-fill-color:transparent; color:transparent !important;
}
.hero-spotlight-desc{ font-size:clamp(15px,1.5vw,18px) !important; line-height:1.65 !important; color:var(--ink-soft) !important; max-width:540px; margin:0 0 30px !important; }
.hero-spotlight-actions{ display:flex !important; flex-wrap:wrap; gap:12px !important; margin:0 0 34px !important; }
.hero-spotlight-btn-primary,.hero-spotlight-btn-secondary{
  position:relative; overflow:hidden; isolation:isolate; display:inline-flex; align-items:center; justify-content:center; gap:10px;
  min-height:52px; padding:0 28px !important; border-radius:16px !important; font-family:var(--font-body); font-weight:800 !important; font-size:14.5px !important; letter-spacing:.01em;
  transition:transform .3s var(--ease), box-shadow .3s ease, background .3s ease, color .3s ease;
}
.hero-spotlight-btn-primary{
  color:#fff !important; border:0 !important;
  background:linear-gradient(135deg,var(--red-500),var(--red-700)) !important;
  box-shadow:0 18px 34px -14px rgba(163,13,36,.85),0 1px 0 rgba(255,255,255,.3) inset !important;
}
.hero-spotlight-btn-primary::after{
  content:""; position:absolute; z-index:-1; top:-50%; bottom:-50%; left:-60%; width:34%;
  background:linear-gradient(90deg,transparent,rgba(255,255,255,.6),transparent); transform:skewX(-22deg); animation:btn-shine 4.2s ease-in-out .8s infinite;
}
.hero-spotlight-btn-primary svg{ width:18px; height:18px; transition:transform .3s var(--ease); }
.hero-spotlight-btn-primary:hover{ transform:translateY(-3px); box-shadow:0 24px 40px -14px rgba(163,13,36,.9) !important; }
.hero-spotlight-btn-primary:hover svg{ transform:translateX(5px); }
.hero-spotlight-btn-secondary{
  color:var(--charcoal) !important; background:rgba(255,255,255,.75) !important; border:1.5px solid rgba(29,21,23,.14) !important; backdrop-filter:blur(8px);
}
.hero-spotlight-btn-secondary:hover{ border-color:var(--red-600) !important; color:var(--red-600) !important; transform:translateY(-3px); box-shadow:0 14px 28px -14px rgba(163,13,36,.5); }
.hero-proof{ display:flex; flex-wrap:wrap; gap:0; margin:0; padding:0; list-style:none; }
.hero-proof li{ padding:0 22px; border-left:1px solid var(--red-200); display:flex; flex-direction:column; gap:3px; }
.hero-proof li:first-child{ padding-left:0; border-left:0; }
.hero-proof b{ font-family:var(--font-display); font-weight:800; font-size:clamp(22px,2.4vw,30px); color:var(--red-700); letter-spacing:-.04em; line-height:1; }
.hero-proof span{ font-size:11.5px; font-weight:700; letter-spacing:.06em; text-transform:uppercase; color:var(--ink-soft); }

/* framed carousel */
.hero-carousel-section{ position:relative; background:none !important; padding:0 !important; width:100%; max-width:640px; margin-left:auto; isolation:isolate; }
.hv-frame{ position:absolute; border-radius:30px; z-index:-1; pointer-events:none; }
.hv-frame-a{ inset:-14px 14px 14px -14px; border:2px solid var(--red-600); transform:rotate(-3.2deg); opacity:.9; }
.hv-frame-b{ inset:12px -16px -16px 16px; background:linear-gradient(135deg,var(--red-100),var(--red-200)); transform:rotate(2.6deg); }
.hero-carousel-wrapper{
  position:relative; width:100% !important; max-width:none !important; aspect-ratio:5/4.4 !important; height:auto !important; min-height:0 !important; max-height:none !important;
  margin:0 !important; border-radius:26px !important; overflow:hidden; background:var(--charcoal);
  border:8px solid #fff; box-shadow:0 40px 70px -30px rgba(122,10,27,.6),0 0 0 1px rgba(200,16,46,.14) !important;
  user-select:none; cursor:grab; touch-action:pan-y;
}
.hero-carousel-wrapper:active{ cursor:grabbing; }
.hero-carousel-track{ position:relative; width:100%; height:100%; border-radius:18px !important; overflow:hidden; }
.hero-carousel-slide{
  position:absolute; inset:0; width:100%; height:100%; border-radius:18px !important; overflow:hidden; opacity:0; visibility:hidden; pointer-events:none; z-index:1;
  transition:opacity .9s var(--ease), visibility .9s;
}
.hero-carousel-slide.active{ opacity:1; visibility:visible; pointer-events:auto; z-index:2; }
.hero-slide-bg{ position:absolute; inset:0; width:100%; height:100%; border-radius:0 !important; background:var(--charcoal-2); }
.hero-slide-img{
  width:100%; height:100%; object-fit:cover; object-position:center !important; transform:scale(1.12); transition:transform 7s ease-out; border-radius:0 !important;
}
.hero-carousel-slide.active .hero-slide-img{ transform:scale(1); }
.hero-slide-scrim{ position:absolute; inset:0; background:linear-gradient(180deg,rgba(29,21,23,0) 38%,rgba(29,21,23,.78) 100%) !important; }
.hero-slide-sparkles{ display:none; }
.hero-slide-content-wrap{
  position:absolute !important; inset:auto 0 0 0 !important; width:100% !important; height:auto !important; padding:0 !important; display:block !important; z-index:5; max-width:none !important;
}
.hero-slide-content{
  max-width:none !important; width:auto !important; margin:0 14px 14px; padding:16px 18px 18px !important; text-align:left !important;
  background:rgba(255,255,255,.14); backdrop-filter:blur(16px) saturate(1.5); -webkit-backdrop-filter:blur(16px) saturate(1.5);
  border:1px solid rgba(255,255,255,.35); border-radius:18px; color:#fff;
}
.hero-slide-category{
  display:inline-flex; align-items:center; gap:7px; font-size:10px !important; font-weight:800 !important; letter-spacing:.2em !important; color:#fff !important; margin:0 0 8px !important;
  padding:0 !important; background:none !important; border:0 !important;
}
.hero-slide-category .gem{ color:var(--red-200) !important; font-size:10px; }
.hero-slide-title{
  font-family:var(--font-display) !important; font-weight:800 !important; font-size:clamp(18px,2.2vw,26px) !important; line-height:1.12 !important; letter-spacing:-.03em !important; color:#fff !important;
  margin:0 0 6px !important; text-shadow:none !important;
}
.hero-slide-title em{ color:var(--red-200) !important; }
.hero-slide-desc{ font-size:13px !important; line-height:1.5 !important; color:rgba(255,255,255,.9) !important; margin:0 0 12px !important; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; }
.hero-slide-actions{ margin:0 !important; }
.hero-slide-btn{
  position:relative; overflow:hidden; isolation:isolate; display:inline-flex; align-items:center; gap:8px; min-height:42px; padding:0 18px !important;
  border-radius:12px !important; font-weight:800; font-size:13px !important; color:var(--red-800) !important; background:#fff !important; border:0 !important; box-shadow:0 10px 22px -10px rgba(0,0,0,.5) !important;
  transition:transform .3s var(--ease), box-shadow .3s ease;
}
.hero-slide-btn::after{ content:""; position:absolute; z-index:-1; top:-50%; bottom:-50%; left:-60%; width:34%; background:linear-gradient(90deg,transparent,rgba(200,16,46,.28),transparent); transform:skewX(-22deg); animation:btn-shine 4.8s ease-in-out 1.5s infinite; }
.hero-slide-btn:hover{ transform:translateY(-2px); background:#fff !important; color:var(--red-600) !important; }
.hero-slide-btn .btn-arrow{ width:16px; height:16px; transition:transform .3s var(--ease); }
.hero-slide-btn:hover .btn-arrow{ transform:translateX(4px); }
.hero-slide-category,.hero-slide-title,.hero-slide-desc,.hero-slide-actions{ opacity:0; transform:translateY(12px); transition:opacity .7s var(--ease) .15s, transform .7s var(--ease) .15s; }
.hero-carousel-slide.active .hero-slide-category,.hero-carousel-slide.active .hero-slide-title,.hero-carousel-slide.active .hero-slide-desc,.hero-carousel-slide.active .hero-slide-actions{ opacity:1; transform:none; }
.hero-carousel-slide.active .hero-slide-title{ transition-delay:.25s; }
.hero-carousel-slide.active .hero-slide-desc{ transition-delay:.35s; }
.hero-carousel-slide.active .hero-slide-actions{ transition-delay:.45s; }
.hero-carousel-arrow{ display:none !important; }
.hero-carousel-dots{ position:absolute; top:14px; right:14px; left:auto; bottom:auto; transform:none; display:flex; gap:6px; z-index:8; padding:6px 8px; border-radius:999px; background:rgba(255,255,255,.2); backdrop-filter:blur(10px); }
.hero-dot{ width:8px; height:8px; padding:0; border:0; border-radius:999px; background:rgba(255,255,255,.55); cursor:pointer; transition:width .35s var(--ease), background .3s ease; position:relative; }
.hero-dot::after{ content:""; position:absolute; inset:-14px -4px; } /* bigger tap target */
.hero-dot:hover{ background:#fff; }
.hero-dot.active{ width:26px; background:#fff; }
.hero-float-chip{
  position:absolute; left:-22px; bottom:38px; z-index:9; display:flex; flex-direction:column; gap:2px; padding:12px 18px 12px 16px; border-radius:16px;
  background:rgba(255,255,255,.88); backdrop-filter:blur(14px); border:1px solid rgba(200,16,46,.14); box-shadow:0 22px 40px -18px rgba(122,10,27,.55);
  animation:float-chip 6s ease-in-out infinite;
}
.hero-float-chip::before{ content:""; position:absolute; left:-1px; top:14px; bottom:14px; width:3px; border-radius:3px; background:var(--red-600); }
.hero-float-chip b{ font-family:var(--font-display); font-size:14px; font-weight:800; color:var(--charcoal); letter-spacing:-.02em; padding-left:6px; }
.hero-float-chip span{ font-size:11.5px; color:var(--ink-soft); font-weight:600; padding-left:6px; }
@keyframes float-chip{ 50%{ transform:translateY(-8px); } }

@media (max-width:1020px){
  .hero-stage-grid{ grid-template-columns:1fr; gap:44px; }
  .hero-carousel-section{ margin:0 auto; max-width:620px; }
  .hero-spotlight-desc{ max-width:620px; }
}
@media (max-width:640px){
  .hero-stage{ margin-top:-66px; padding:100px 0 54px; }
  .hero-stage-grid{ gap:38px; }
  .hero-spotlight-heading{ font-size:clamp(36px,11.2vw,50px) !important; margin-bottom:16px !important; }
  .hero-spotlight-desc{ font-size:15px !important; margin-bottom:24px !important; }
  .hero-spotlight-actions{ flex-direction:column; align-items:stretch; margin-bottom:28px !important; }
  .hero-spotlight-btn-primary,.hero-spotlight-btn-secondary{ width:100%; min-height:54px; }
  .hero-proof li{ padding:0 14px; }
  .hero-proof b{ font-size:20px; }
  .hero-proof span{ font-size:10px; letter-spacing:.04em; }
  .hero-carousel-section{ max-width:none; }
  .hv-frame-a{ inset:-8px 10px 10px -8px; }
  .hv-frame-b{ inset:10px -8px -10px 10px; }
  .hero-carousel-wrapper{ aspect-ratio:4/4.2 !important; border-width:6px; border-radius:22px !important; }
  .hero-slide-content{ margin:0 8px 8px; padding:12px 14px 14px !important; border-radius:16px; }
  .hero-slide-desc{ display:none; }
  .hero-slide-title{ font-size:19px !important; }
  .hero-float-chip{ left:10px; bottom:auto; top:-22px; padding:9px 14px 9px 12px; }
  .hero-float-chip b{ font-size:12.5px; }
  .hero-float-chip span{ font-size:10.5px; }
}

/* ---------- 9. SECTIONS ---------- */
.section{ padding:clamp(44px,6vw,84px) 0; }
.section-head{ align-items:flex-end; margin-bottom:clamp(24px,3.4vw,40px); gap:20px; }
.section-head h2{
  font-family:var(--font-display) !important; font-weight:800 !important; letter-spacing:-.04em !important; color:var(--charcoal) !important;
  font-size:clamp(28px,3.8vw,46px) !important; line-height:1.02 !important; margin:0 0 8px; position:relative;
}
.section-head h2 *,.section-head h2 p{ font-family:inherit !important; color:inherit !important; font-size:inherit !important; margin:0; }
.section-head p{ color:var(--ink-soft); font-size:15px; margin:0; max-width:520px; }
.section-head > div{ position:relative; padding-left:0; }
.section-head .see-all{
  flex:0 0 auto; display:inline-flex; align-items:center; gap:8px; min-height:44px; padding:0 20px; border-radius:999px;
  border:1.5px solid var(--charcoal); color:var(--charcoal); font-weight:800; font-size:13px; letter-spacing:.02em;
  transition:background .3s ease,color .3s ease,border-color .3s ease,transform .3s var(--ease), padding .3s var(--ease);
}
.section-head .see-all:hover{ background:var(--red-600); border-color:var(--red-600); color:#fff; padding-right:26px; transform:translateY(-2px); }

/* categories — arch frames, staggered */
.category-section{ background:#fff; position:relative; padding-top:clamp(36px,5vw,64px); }
.royal-category-head{ text-align:left; max-width:none; margin:0 0 clamp(28px,4vw,48px); padding:0; display:grid; grid-template-columns:1fr; gap:0; }
.royal-category-head .section-kicker{ margin-bottom:12px; }
.royal-category-head h2.royal-cat-heading{
  font-family:var(--font-display); font-weight:800; font-size:clamp(30px,4.6vw,58px); letter-spacing:-.045em; line-height:1; color:var(--charcoal); margin:0 0 12px; max-width:14ch; text-wrap:balance;
}
.royal-cat-subtitle{ color:var(--ink-soft); font-size:clamp(14.5px,1.5vw,17px); max-width:520px; margin:0; }
.royal-cat-subtitle p{ margin:0; }
.royal-cat-grid{ display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:clamp(14px,2vw,28px); align-items:start; }
.royal-cat-card{
  position:relative; display:flex; flex-direction:column; padding:0; border:0; background:none; box-shadow:none; text-align:left;
  transition:transform .5s var(--ease);
}
.royal-cat-card:nth-child(even){ margin-top:clamp(0px,3.4vw,48px); }
.royal-cat-card:hover{ transform:translateY(-8px); border:0; box-shadow:none; }
.royal-cat-circle-wrap{
  position:relative; width:100%; height:auto; aspect-ratio:3/3.7; margin:0 0 16px; padding:7px; border-radius:999px 999px 22px 22px; /* arch */
  background:linear-gradient(160deg,var(--red-200),var(--red-600) 70%,var(--red-800)); box-shadow:0 26px 44px -26px rgba(122,10,27,.55);
  transition:box-shadow .5s ease, background-position .6s ease; background-size:140% 140%;
}
.royal-cat-card:hover .royal-cat-circle-wrap{ box-shadow:0 36px 56px -26px rgba(122,10,27,.7); background-position:100% 100%; transform:none; }
.royal-cat-circle{ width:100%; height:100%; border-radius:inherit; overflow:hidden; background:var(--mist); border:4px solid #fff; display:flex; align-items:center; justify-content:center; position:relative; }
.royal-cat-circle::after{ content:""; position:absolute; inset:0; background:linear-gradient(115deg,transparent 35%,rgba(255,255,255,.45) 50%,transparent 65%); transform:translateX(-120%); transition:transform .9s var(--ease); pointer-events:none; }
.royal-cat-card:hover .royal-cat-circle::after{ transform:translateX(120%); }
.royal-cat-circle img{ width:100%; height:100%; object-fit:cover; transition:transform 1s var(--ease); }
.royal-cat-card:hover .royal-cat-circle img{ transform:scale(1.09); }
.royal-cat-circle svg{ width:40%; height:40%; color:var(--red-600); }
.royal-cat-no{
  position:absolute; right:-6px; top:18%; z-index:3; font-family:var(--font-display); font-weight:800; font-size:12px; letter-spacing:.06em; color:#fff;
  background:var(--charcoal); border-radius:999px; padding:6px 10px; box-shadow:0 8px 16px -6px rgba(0,0,0,.4);
}
.royal-cat-tag{ order:-1; display:none; }
.royal-cat-title{ font-family:var(--font-display); font-weight:800; font-size:clamp(17px,1.8vw,24px); letter-spacing:-.035em; color:var(--charcoal); margin:0 0 6px; }
.royal-cat-tag{ display:block; order:0; font-size:10.5px; font-weight:800; letter-spacing:.2em; text-transform:uppercase; color:var(--red-600); margin:0 0 6px; }
.royal-cat-blurb{ font-size:13.5px; line-height:1.55; color:var(--ink-soft); margin:0 0 12px; max-width:30ch; }
.royal-cat-blurb p{ margin:0; }
.royal-cat-link{
  display:inline-flex; align-items:center; gap:8px; font-weight:800; font-size:13px; color:var(--charcoal); margin-top:auto; padding-bottom:3px; border-bottom:2px solid var(--red-600);
  align-self:flex-start; transition:gap .3s var(--ease), color .3s ease;
}
.royal-cat-link svg{ width:15px; height:15px; }
.royal-cat-card:hover .royal-cat-link{ gap:14px; color:var(--red-600); }
@media (max-width:900px){
  .royal-cat-grid{ grid-template-columns:repeat(2,minmax(0,1fr)); gap:26px 14px; }
  .royal-cat-card:nth-child(even){ margin-top:34px; }
}
@media (max-width:640px){
  .royal-category-head h2.royal-cat-heading{ max-width:none; font-size:clamp(30px,9.4vw,40px); }
  .royal-cat-card:nth-child(even){ margin-top:26px; }
  .royal-cat-circle-wrap{ padding:5px; margin-bottom:12px; }
  .royal-cat-circle{ border-width:3px; }
  .royal-cat-title{ font-size:16.5px; }
  .royal-cat-blurb{ font-size:12px; margin-bottom:10px; display:-webkit-box; -webkit-line-clamp:3; -webkit-box-orient:vertical; overflow:hidden; }
  .royal-cat-no{ right:-2px; top:14%; font-size:10.5px; padding:5px 8px; }
}

/* process */
.process-section{ background:var(--charcoal); color:#fff; position:relative; overflow:hidden; isolation:isolate; margin:clamp(24px,4vw,56px) 0 0; clip-path:polygon(0 clamp(20px,3vw,48px),100% 0,100% calc(100% - clamp(20px,3vw,48px)),0 100%); padding:clamp(80px,9vw,128px) 0; }
.process-section::before{ content:""; position:absolute; z-index:-1; width:560px; height:560px; right:-160px; top:-160px; border-radius:50%; background:radial-gradient(circle,rgba(219,31,54,.5),transparent 65%); filter:blur(30px); }
.process-head{ margin-bottom:clamp(28px,4vw,52px); max-width:640px; }
.process-head .section-kicker{ color:var(--red-200); }
.process-head .section-kicker::before{ border-color:var(--red-400); box-shadow:3px 3px 0 0 rgba(236,74,92,.35); }
.process-head h2{ color:#fff; font-weight:800; font-size:clamp(30px,4.6vw,56px); letter-spacing:-.045em; line-height:1.02; margin:0; text-wrap:balance; }
.process-head h2 em{ color:var(--red-400); }
.process-steps{ list-style:none; margin:0; padding:0; display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:18px; counter-reset:none; }
.process-step{
  position:relative; padding:28px 26px 30px; border-radius:24px; overflow:hidden; border:1px solid rgba(255,255,255,.12);
  background:radial-gradient(260px circle at var(--mx,50%) var(--my,0%),rgba(236,74,92,.22),transparent 60%),rgba(255,255,255,.05);
  backdrop-filter:blur(6px); transition:transform .5s var(--ease), border-color .4s ease;
}
.process-step:hover{ transform:translateY(-6px); border-color:rgba(236,74,92,.6); }
.process-no{ display:block; font-family:var(--font-serif); font-style:italic; font-size:clamp(54px,6vw,84px); line-height:.9; color:transparent; -webkit-text-stroke:1.5px var(--red-400); margin-bottom:22px; }
.process-step h3{ color:#fff; font-size:clamp(19px,2vw,24px); font-weight:800; margin:0 0 8px; letter-spacing:-.03em; }
.process-step p{ color:rgba(255,255,255,.72); margin:0; font-size:14.5px; line-height:1.6; }
@media (max-width:860px){
  .process-steps{ grid-template-columns:1fr; gap:12px; }
  .process-step{ display:grid; grid-template-columns:76px 1fr; column-gap:16px; padding:20px 20px 22px; }
  .process-no{ grid-row:1/3; font-size:56px; margin:0; align-self:start; }
  .process-step h3{ margin-top:2px; }
}

/* bulk band */
.bulk-section{ padding-top:clamp(40px,6vw,80px); }
.bulk-band{
  position:relative; overflow:hidden; isolation:isolate; display:grid; grid-template-columns:minmax(0,1.4fr) auto; gap:28px; align-items:center;
  padding:clamp(28px,4.4vw,56px); border-radius:clamp(22px,3vw,34px);
  background:linear-gradient(125deg,var(--red-500) 0%,var(--red-700) 55%,var(--red-900) 120%); color:#fff;
  box-shadow:0 40px 70px -34px rgba(122,10,27,.8);
}
.bulk-band::before{ content:""; position:absolute; z-index:-1; inset:0; background:repeating-linear-gradient(115deg,rgba(255,255,255,.07) 0 1px,transparent 1px 22px); -webkit-mask-image:linear-gradient(90deg,transparent,#000 60%); mask-image:linear-gradient(90deg,transparent,#000 60%); }
.bulk-band::after{ content:""; position:absolute; z-index:-1; right:-60px; top:-90px; width:320px; height:320px; border-radius:50%; border:2px solid rgba(255,255,255,.22); box-shadow:0 0 0 36px rgba(255,255,255,.05),0 0 0 72px rgba(255,255,255,.04); }
.bulk-band .section-kicker{ color:var(--red-100); }
.bulk-band .section-kicker::before{ border-color:#fff; box-shadow:3px 3px 0 0 rgba(255,255,255,.3); }
.bulk-band h2{ color:#fff; font-size:clamp(26px,3.6vw,44px); font-weight:800; letter-spacing:-.04em; margin:0 0 10px; max-width:20ch; text-wrap:balance; }
.bulk-band p{ color:rgba(255,255,255,.85); margin:0; max-width:50ch; }
.bulk-actions{ display:flex; flex-direction:column; gap:12px; align-items:stretch; text-align:center; min-width:230px; }
.bulk-btn.btn-primary{ background:#fff; color:var(--red-700); box-shadow:0 18px 30px -14px rgba(0,0,0,.5); min-height:54px; font-size:15px; }
.bulk-btn.btn-primary::after{ background:linear-gradient(90deg,transparent,rgba(200,16,46,.3),transparent); }
.bulk-btn.btn-primary:hover{ background:#fff; color:var(--red-600); }
.bulk-link{ position:relative; overflow:hidden; color:#fff; font-weight:700; font-size:13.5px; padding:8px; border-radius:10px; text-decoration:underline; text-underline-offset:4px; text-decoration-color:rgba(255,255,255,.5); }
.bulk-link:hover{ text-decoration-color:#fff; }
@media (max-width:760px){
  .bulk-band{ grid-template-columns:1fr; }
  .bulk-actions{ min-width:0; }
}

/* homepage: "Visit Our Store" teaser */
.home-store-inner{ display:grid; grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr); gap:clamp(28px,5vw,64px); align-items:center; }
.home-store-copy h2{ font-family:var(--font-display); font-weight:800; font-size:clamp(26px,3.6vw,42px); letter-spacing:-.04em; margin:10px 0 12px; max-width:16ch; line-height:1.05; }
.home-store-copy p{ color:var(--ink-soft); font-size:15.5px; line-height:1.65; max-width:40ch; margin:0 0 24px; }
.home-store-actions{ display:flex; align-items:center; gap:20px; flex-wrap:wrap; }
.home-store-link{ color:var(--red-600); font-weight:700; font-size:14px; text-decoration:none; }
.home-store-link:hover{ text-decoration:underline; }
.home-store-gallery{ display:grid; grid-template-columns:1fr 1fr; gap:clamp(10px,1.6vw,18px); }
.home-store-item{ margin:0; border-radius:20px; overflow:hidden; aspect-ratio:1/1; box-shadow:0 20px 40px -24px rgba(29,21,23,.4); background:var(--red-50); }
.home-store-item:nth-child(1){ border-radius:20px 20px 20px 48px; }
.home-store-item:nth-child(4){ border-radius:20px 48px 20px 20px; }
.home-store-item img{ width:100%; height:100%; object-fit:cover; display:block; transition:transform .5s var(--ease); }
.home-store-item:hover img{ transform:scale(1.06); }
@media (max-width:760px){
  .home-store-inner{ grid-template-columns:1fr; }
  .home-store-copy p{ max-width:none; }
}

/* ---------- 10. PRODUCT CARDS ---------- */
.product-grid{ gap:clamp(14px,2vw,26px); }
.product-card{
  position:relative; background:radial-gradient(280px circle at var(--mx,50%) var(--my,0%),rgba(200,16,46,.07),transparent 60%),#fff;
  border:1px solid var(--line); border-radius:22px; box-shadow:0 1px 2px rgba(29,21,23,.04),0 14px 30px -24px rgba(122,10,27,.4);
  transition:transform .45s var(--ease), box-shadow .45s ease, border-color .3s ease; overflow:hidden;
}
.product-card::before{ /* animated gradient border */
  content:""; position:absolute; inset:0; border-radius:inherit; padding:2px; z-index:7; pointer-events:none; opacity:0; transition:opacity .4s ease;
  background:conic-gradient(from var(--ang),transparent 0 55%,var(--red-400) 75%,var(--red-700) 88%,transparent 100%);
  -webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0); -webkit-mask-composite:xor; mask:linear-gradient(#000 0 0) content-box exclude,linear-gradient(#000 0 0);
  animation:spin-ang 3.2s linear infinite;
}
@keyframes spin-ang{ to{ --ang:360deg; } }
.product-card:hover,.product-card:focus-within{ transform:translateY(-8px) scale(1.01); border-color:transparent; box-shadow:0 2px 4px rgba(29,21,23,.04),0 34px 54px -26px rgba(122,10,27,.55); }
.product-card:hover::before,.product-card:focus-within::before{ opacity:1; }
.product-card::after{ background:linear-gradient(105deg,transparent 30%,rgba(255,255,255,.75) 50%,transparent 70%); top:0; left:0; width:100%; height:100%; transform:translateX(-130%); transition:transform .9s var(--ease); opacity:1; }
.product-card:hover::after,.product-card:focus-within::after,.product-card.shine-active::after{ transform:translateX(130%); opacity:1 !important; }
.product-media{
  margin:10px 10px 0; border-radius:15px; aspect-ratio:1/1; background:linear-gradient(160deg,var(--mist),var(--red-50));
  box-shadow:0 0 0 1px rgba(200,16,46,.08) inset,0 6px 14px -8px rgba(29,21,23,.3) inset; /* mat-board feel */
}
.product-media img,.product-media .pm-main{ transition:transform .9s var(--ease) !important; }
.product-card:hover .product-media img,.product-card:focus-within .product-media img,.product-card:hover .product-media svg{ transform:scale(1.06) !important; }
.product-media svg{ transition:transform .9s var(--ease); }
.product-tag{
  position:absolute; top:10px; left:10px; z-index:5; padding:5px 11px; border-radius:999px; font-size:10px; font-weight:800; letter-spacing:.12em; text-transform:uppercase;
  background:var(--charcoal); color:#fff; box-shadow:0 8px 14px -8px rgba(0,0,0,.5);
}
.product-tag.oos-tag{ background:#fff; color:var(--ink-soft); border:1px solid var(--line); }
.product-quick{ top:10px; right:10px; z-index:8; opacity:1; transform:none; }
.product-quick button{
  width:38px; height:38px; border-radius:50%; border:0; background:rgba(255,255,255,.9); backdrop-filter:blur(8px); color:var(--charcoal);
  box-shadow:0 10px 18px -8px rgba(29,21,23,.45); transition:transform .3s var(--ease), background .25s ease, color .25s ease;
}
.product-quick button:hover{ background:var(--red-600); color:#fff; transform:scale(1.12); border:0; }
.product-quick button.active{ background:var(--red-600); color:#fff; border:0; }
@media (hover:hover){ .product-quick{ opacity:0; transform:translateY(-6px); transition:opacity .3s ease, transform .3s var(--ease); } .product-card:hover .product-quick,.product-card:focus-within .product-quick{ opacity:1; transform:none; } }
.product-body{ padding:16px 18px 18px; gap:8px; }
.product-body h4{ font-family:var(--font-display); font-weight:700; font-size:16px; line-height:1.25; letter-spacing:-.02em; margin:0; }
.product-body h4 a{ color:var(--charcoal); background:linear-gradient(var(--red-600),var(--red-600)) 0 100%/0 2px no-repeat; transition:background-size .4s var(--ease), color .25s ease; }
.product-card:hover .product-body h4 a,.product-body h4 a:hover{ color:var(--red-700); background-size:100% 2px; }
.price-row{ gap:8px; align-items:baseline; }
.price-row .now{ font-family:var(--font-price) !important; font-weight:800; font-size:21px; color:var(--charcoal); letter-spacing:-.04em; }
.price-row .was{ color:#9A8D8F; font-size:13px; }
.discount-label{ color:var(--red-600); background:var(--red-50); padding:3px 8px; border-radius:999px; font-size:11px; font-weight:800; }
.product-actions{ gap:8px; }
.product-actions .btn{ min-height:42px; border-radius:12px; }
.product-actions .btn-outline{ border-color:var(--charcoal); color:var(--charcoal); }
.product-actions .btn-outline:hover{ background:var(--charcoal); border-color:var(--charcoal); color:#fff; }
.product-actions .btn-primary::after{ animation:none; }

/* mobile card overrides (legacy rules use !important) */
@media (max-width:640px){
  .product-card{ border-radius:18px !important; }
  .product-media{ margin:7px 7px 0; border-radius:12px; }
  .product-body{ padding:11px 11px 12px !important; }
  .product-body h4{ font-size:13.5px !important; }
  .price-row .now{ font-size:18px !important; color:var(--charcoal) !important; }
  .discount-label{ color:var(--red-600) !important; font-size:10px !important; padding:2px 6px; }
  .product-tag{ top:7px; left:7px; font-size:9px; padding:4px 8px; }
  .product-quick{ opacity:1 !important; transform:none !important; top:7px; right:7px; }
  .product-quick button{ width:34px; height:34px; }
  .product-actions .btn{ height:38px !important; min-height:38px; font-size:12px !important; border-radius:11px !important; }
  .product-actions .btn:first-child{ border:1.5px solid var(--charcoal) !important; color:var(--charcoal) !important; background:transparent !important; }
  .product-actions .btn:first-child:hover{ background:var(--charcoal) !important; color:#fff !important; }
  .product-actions .btn:last-child{ background:linear-gradient(135deg,var(--red-500),var(--red-700)) !important; border:0 !important; flex:0 0 48px !important; min-width:48px !important; }
  .product-actions .btn:last-child:hover{ background:var(--red-800) !important; }
}

/* ---------- 11. REVIEWS ---------- */
.reviews-section{ background:linear-gradient(180deg,var(--red-50),#fff 80%) !important; border:0 !important; padding:clamp(48px,6vw,88px) 0 !important; }
.reviews-header{ text-align:left !important; max-width:none !important; margin:0 0 clamp(24px,3vw,36px) !important; }
.reviews-header h2{ font-family:var(--font-display); font-weight:800; font-size:clamp(28px,4.2vw,52px); letter-spacing:-.045em; line-height:1; color:var(--charcoal); margin:0 0 14px; max-width:16ch; text-wrap:balance; }
.reviews-meta{ display:flex; flex-wrap:wrap; align-items:center; gap:10px; }
.reviews-meta-stars{ color:var(--red-600); letter-spacing:3px; font-size:16px; }
.reviews-meta-count{ font-size:13.5px; font-weight:600; color:var(--ink-soft); }
.reviews-meta-badge{ font-size:11.5px; font-weight:800; color:var(--red-700); background:#fff; border:1px solid var(--red-200); padding:4px 11px; border-radius:999px; }
.reviews-carousel-outer{ position:relative; display:flex; align-items:center; gap:12px; width:100%; }
.reviews-grid{ scroll-snap-type:x mandatory; gap:18px; padding:8px 4px 22px; }
.review-card,.wedtree-review-card{
  scroll-snap-align:start; position:relative; background:radial-gradient(260px circle at var(--mx,50%) var(--my,0%),rgba(200,16,46,.08),transparent 60%),#fff;
  border:1px solid var(--line) !important; border-radius:24px !important; padding:26px 24px 22px !important; box-shadow:0 20px 40px -30px rgba(122,10,27,.5) !important; display:flex; flex-direction:column; text-align:left;
  transition:transform .45s var(--ease), box-shadow .4s ease, border-color .3s ease;
}
.review-card::before{ content:"“"; position:absolute; right:20px; top:-4px; font-family:var(--font-serif); font-size:96px; line-height:1; color:var(--red-100); pointer-events:none; }
.review-card:hover{ transform:translateY(-6px); border-color:var(--red-200) !important; box-shadow:0 30px 50px -28px rgba(122,10,27,.55) !important; }
.review-body{ width:100%; text-align:left; }
.review-card-stars{ color:var(--red-600); font-size:14px; letter-spacing:3px; margin:0 0 10px; display:flex; }
.review-title{ font-family:var(--font-display); font-style:normal; font-weight:800; font-size:16px; color:var(--charcoal); margin:0 0 8px; line-height:1.3; letter-spacing:-.02em; overflow-wrap:anywhere; }
.review-comment{ font-size:14px; color:#4A3E40; line-height:1.65; margin:0 0 16px; font-style:normal; white-space:pre-line; overflow-wrap:anywhere; }
.review-author{ margin-top:auto; padding-top:14px; border-top:1px dashed var(--red-200); width:100%; display:flex; flex-direction:column; align-items:flex-start; text-align:left; }
.review-author strong{ font-size:14px; color:var(--charcoal); font-weight:800; }
.review-location{ font-size:12px; color:var(--ink-soft); margin-top:2px; }
.review-verified{ display:inline-flex; align-items:center; gap:5px; font-size:11px; font-weight:800; color:var(--red-700); margin-top:8px; background:var(--red-50); padding:3px 9px; border-radius:999px; }
.review-verified svg{ width:12px; height:12px; }
.review-nav-arrow{ width:46px; height:46px; border-radius:50%; border:1.5px solid var(--charcoal); background:#fff; color:var(--charcoal); transition:background .25s ease,color .25s ease,transform .3s var(--ease),border-color .25s ease; flex:0 0 auto; display:flex; align-items:center; justify-content:center; }
.review-nav-arrow:hover{ background:var(--red-600); border-color:var(--red-600); color:#fff; transform:scale(1.08); }
.review-nav-arrow svg{ width:20px; height:20px; }
@media (max-width:640px){
  .reviews-header h2{ font-size:clamp(28px,8.6vw,36px); max-width:none; }
  .review-nav-arrow{ display:none; }
  .review-card,.wedtree-review-card{ padding:22px 20px 18px !important; }
}

/* ---------- 12. TRUST BAR · RATE STRIP · FOOTER ---------- */
.site-trust-bar{ background:#fff; border:0; padding:clamp(34px,4vw,56px) 0 clamp(8px,2vw,24px); }
.trust-bar-grid{ gap:14px; }
.trust-bar-item{
  background:#fff; border:1px solid var(--line); border-radius:22px; padding:22px 20px; text-align:left; display:flex; flex-direction:column; align-items:flex-start; gap:4px;
  transition:transform .45s var(--ease), box-shadow .4s ease, border-color .3s ease;
}
.trust-bar-item:hover{ transform:translateY(-5px); border-color:var(--red-200); box-shadow:0 26px 40px -28px rgba(122,10,27,.5); }
.trust-bar-icon{ width:52px; height:52px; border-radius:16px; background:var(--red-50); display:flex; align-items:center; justify-content:center; margin:0 0 10px; color:var(--red-600); }
.trust-bar-icon svg{ width:30px; height:30px; }
.trust-svg [fill="#FFFBF2"]{ fill:#fff; }
.trust-bar-title{ font-family:var(--font-display); font-size:16.5px; font-weight:800; color:var(--charcoal); margin:0; letter-spacing:-.02em; }
.trust-bar-sub{ font-size:13px; color:var(--ink-soft); margin:0; }
.trust-bar-sub a{ color:var(--red-600); font-weight:700; text-decoration:underline; text-underline-offset:3px; }

.rate-us-banner-strip{ background:#fff; border:0; padding:clamp(20px,3vw,40px) clamp(16px,4vw,32px); }
.rate-us-strip-inner{
  display:flex; align-items:center; justify-content:space-between; gap:20px; padding:20px 24px !important; border-radius:22px; background:var(--red-50); border:1px solid var(--red-100);
}
.rate-us-strip-text{ display:flex; align-items:center; gap:16px; min-width:0; }
.rate-us-strip-star-icon{ width:46px; height:46px; border-radius:14px; background:#fff; color:var(--red-600); display:flex; align-items:center; justify-content:center; flex:0 0 auto; box-shadow:0 10px 18px -10px rgba(163,13,36,.5); }
.rate-us-strip-star-icon svg{ width:22px; height:22px; }
.rate-us-strip-tagline{ display:block; font-size:10.5px; font-weight:800; letter-spacing:.2em; text-transform:uppercase; color:var(--red-600); margin-bottom:3px; }
.rate-us-strip-main{ display:block; font-family:var(--font-display); font-style:normal !important; font-weight:700; font-size:clamp(14px,1.6vw,17px); color:var(--charcoal); letter-spacing:-.02em; line-height:1.3; }
.rate-us-strip-btn{ position:relative; overflow:hidden; border:0; border-radius:14px; padding:0 22px; min-height:48px; color:#fff; font-weight:800; font-size:14px; background:linear-gradient(135deg,var(--red-500),var(--red-700)); box-shadow:0 14px 26px -12px rgba(163,13,36,.8); display:inline-flex; align-items:center; gap:8px; flex:0 0 auto; transition:transform .3s var(--ease), box-shadow .3s ease; }
.rate-us-strip-btn:hover{ transform:translateY(-3px); box-shadow:0 20px 32px -12px rgba(163,13,36,.85); }
@media (max-width:700px){
  .rate-us-strip-inner{ flex-direction:column; align-items:stretch; text-align:left; padding:18px !important; }
  .rate-us-strip-btn{ width:100%; justify-content:center; min-height:52px; }
}

footer{ background:var(--charcoal); color:rgba(255,255,255,.78); position:relative; overflow:hidden; isolation:isolate; margin-top:clamp(12px,3vw,40px); }
footer::before{ content:""; position:absolute; z-index:-1; inset:auto -10% -40% auto; width:620px; height:620px; border-radius:50%; background:radial-gradient(circle,rgba(219,31,54,.4),transparent 65%); filter:blur(30px); }
footer .site-trust-bar{ background:transparent; padding-top:clamp(40px,5vw,72px); }
footer .trust-bar-item{ background:rgba(255,255,255,.05); border-color:rgba(255,255,255,.1); }
footer .trust-bar-item:hover{ border-color:rgba(236,74,92,.6); box-shadow:none; background:rgba(255,255,255,.08); }
footer .trust-bar-icon{ background:rgba(236,74,92,.16); color:var(--red-200); }
footer .trust-svg [fill="#FFFBF2"]{ fill:transparent; }
footer .trust-bar-title{ color:#fff; }
footer .trust-bar-sub{ color:rgba(255,255,255,.65); }
footer .trust-bar-sub a{ color:var(--red-200); }
.footer-desktop-grid{ grid-template-columns:1.25fr .9fr 1fr 1.1fr; gap:clamp(24px,4vw,56px); padding:clamp(28px,4vw,56px) clamp(16px,4vw,32px) clamp(28px,4vw,48px); }
@media (max-width:1100px){ .footer-desktop-grid{ grid-template-columns:1fr 1fr; row-gap:40px; } }
.footer-brand-title{ font-family:var(--font-display); font-weight:800; font-size:clamp(34px,4.4vw,58px); letter-spacing:-.05em; line-height:.95; color:#fff; display:block; margin-bottom:16px; }
.footer-brand-desc{ color:rgba(255,255,255,.7); font-size:14.5px; line-height:1.7; max-width:44ch; }
.footer-grid h5,.footer-desktop-grid h5{ font-family:var(--font-body); font-size:11.5px; font-weight:800; letter-spacing:.22em; text-transform:uppercase; color:var(--red-200); margin-bottom:18px; }
.footer-grid ul a,.footer-desktop-grid ul a,.footer-enquiry,.footer-enquiry a{ color:rgba(255,255,255,.82); font-size:14.5px; }
.footer-desktop-grid ul a,.footer-enquiry a{
  background:linear-gradient(#fff,#fff) 0 100%/0 1px no-repeat; transition:background-size .35s var(--ease), color .25s ease; padding-bottom:2px; text-decoration:none !important;
}
.footer-desktop-grid ul a:hover,.footer-enquiry a:hover{ color:#fff; background-size:100% 1px; }
footer [style*="gold-dark"]{ color:var(--red-200) !important; }
.footer-social a{ width:42px; height:42px; border-radius:14px; background:rgba(255,255,255,.08); color:#fff; border:1px solid rgba(255,255,255,.14); display:inline-flex; align-items:center; justify-content:center; transition:transform .3s var(--ease), background .3s ease; }
.footer-social a:hover{ background:var(--red-600); transform:translateY(-4px) rotate(-4deg); border-color:transparent; }
.footer-social svg{ width:19px; height:19px; }
.footer-bottom{ border-top:1px solid rgba(255,255,255,.1); color:rgba(255,255,255,.6); font-size:12.5px; padding:20px clamp(16px,4vw,32px); }

/* "Visit Our Store" footer column */
.footer-store-address{ display:block; font-style:normal; color:rgba(255,255,255,.7); font-size:14px; line-height:1.7; margin:0 0 16px; max-width:30ch; }
.footer-store-links{ display:flex; flex-direction:column; gap:10px; margin-bottom:18px; }
.footer-store-links a{ display:inline-flex; align-items:flex-start; gap:9px; color:rgba(255,255,255,.82); font-size:14px; text-decoration:none; transition:color .25s ease; }
.footer-store-links a:hover{ color:#fff; }
.footer-store-links svg{ width:16px; height:16px; flex-shrink:0; margin-top:1px; color:var(--red-200); }
.footer-directions-btn{
  display:inline-flex; align-items:center; gap:8px; padding:11px 18px; border-radius:999px;
  background:var(--red-600); color:#fff !important; font-weight:700; font-size:13.5px; text-decoration:none !important;
  transition:transform .3s var(--ease), background .3s ease, box-shadow .3s ease;
  box-shadow:0 10px 20px -10px rgba(200,16,46,.6);
}
.footer-directions-btn:hover{ background:var(--red-700); transform:translateY(-3px); }
.footer-directions-btn svg{ width:16px; height:16px; }
footer .footer-accordion-body .footer-store-address{ color:rgba(255,255,255,.78) !important; max-width:none; }
footer .footer-accordion-body .footer-store-links a{ color:rgba(255,255,255,.88) !important; }
footer .footer-accordion-body .footer-directions-btn{ margin-top:4px; }
.footer-accordion{ border-bottom:1px solid rgba(255,255,255,.12); }
.footer-accordion-summary{ color:#fff; font-weight:800; letter-spacing:.12em; }
.footer-accordion-desc,.footer-accordion-body a{ color:rgba(255,255,255,.75); }
.footer-mobile-view a,.mobile-enquiry-links a{ color:rgba(255,255,255,.88); }
.mobile-enquiries-title,.mobile-follow-lbl{ color:var(--red-200); }
@media (max-width:860px){
  .footer-mobile-view{ padding:8px clamp(16px,4vw,32px) 24px; }
  .mobile-enquiry-links a{ display:flex; align-items:center; min-height:46px; border-bottom:1px solid rgba(255,255,255,.1); }
}

/* wa float */
.wa-float{ right:clamp(14px,2.4vw,26px); bottom:clamp(14px,2.4vw,26px); width:56px; height:56px; border-radius:18px; box-shadow:0 18px 30px -12px rgba(0,0,0,.45); transition:transform .3s var(--ease); }
.wa-float:hover{ transform:translateY(-4px) scale(1.06); }

/* ---------- 13. INNER PAGES / FORMS / FILTERS ---------- */
.page-hero{ padding-top:clamp(28px,4vw,56px); padding-bottom:clamp(12px,2vw,24px); text-align:left; position:relative; }
.page-hero h1,.about-hero h1{
  font-family:var(--font-display); font-weight:800; font-size:clamp(34px,5.6vw,72px); letter-spacing:-.05em; line-height:.98; color:var(--charcoal); margin:0 0 14px; text-wrap:balance;
}
.page-hero p,.about-hero p,.about-hero div{ color:var(--ink-soft); font-size:clamp(15px,1.5vw,18px); max-width:62ch; }
.account-kicker{ display:inline-flex; align-items:center; gap:10px; font-size:11.5px; font-weight:800; letter-spacing:.22em; text-transform:uppercase; color:var(--red-600); margin:0 0 12px; }
.account-kicker::before{ content:""; width:22px; height:14px; border:2px solid var(--red-600); border-radius:3px; box-shadow:3px 3px 0 0 var(--red-200); }
.section-ornament{ display:none; }
.about-story-inner{ max-width:1100px; gap:clamp(24px,5vw,70px); }
.about-story-brand h2{ font-size:clamp(28px,4vw,48px); font-weight:800; letter-spacing:-.045em; }

.chip{
  position:relative; overflow:hidden; border:1.5px solid var(--line); background:#fff; color:var(--charcoal); border-radius:999px; font-weight:700; padding:9px 16px; min-height:40px; display:inline-flex; align-items:center;
  transition:background .25s ease,color .25s ease,border-color .25s ease,transform .3s var(--ease),box-shadow .3s ease;
}
.chip:hover{ border-color:var(--red-600); color:var(--red-600); transform:translateY(-2px); }
.chip.active{ background:linear-gradient(135deg,var(--red-500),var(--red-700)); border-color:transparent; color:#fff; box-shadow:0 10px 20px -10px rgba(163,13,36,.7); }
.filter-sort select{ border-radius:12px; border:1.5px solid var(--line); background:#fff; font-weight:600; min-height:42px; }

.form-card{ border:1px solid var(--line); border-radius:24px; padding:clamp(20px,3vw,34px); background:#fff; box-shadow:0 30px 50px -40px rgba(122,10,27,.5); }
.field label{ font-size:12.5px; font-weight:800; color:var(--charcoal); letter-spacing:.02em; }
.field input,.field textarea,.field select,
input[type="text"],input[type="email"],input[type="tel"],input[type="password"],input[type="number"],textarea,select{
  font-family:var(--font-body); border:1.5px solid var(--line); border-radius:14px; background:#fff; padding:13px 15px; min-height:48px; font-size:15px; color:var(--charcoal);
  transition:border-color .25s ease, box-shadow .25s ease, background .25s ease;
}
.field input:focus,.field textarea:focus,.field select:focus,input:focus,textarea:focus,select:focus{
  outline:0; border-color:var(--red-600); box-shadow:0 0 0 4px rgba(200,16,46,.13); background:#fff;
}
.field.error input,.field.error textarea{ border-color:var(--red-600); }
.field .err-msg{ color:var(--red-600); font-weight:600; }
input[type="checkbox"],input[type="radio"]{ accent-color:var(--red-600); }

.order-summary{ border-radius:24px; border:1px solid var(--line); box-shadow:0 30px 50px -40px rgba(122,10,27,.5); }
.pd-grid{ gap:clamp(24px,4vw,56px); }
.pd-media{ border-radius:26px; overflow:hidden; box-shadow:0 0 0 8px #fff,0 0 0 9px var(--red-200),0 40px 60px -34px rgba(122,10,27,.5); }
.empty-state{ border:2px dashed var(--red-200); border-radius:24px; background:var(--red-50); color:var(--ink-soft); }
.empty-state svg{ color:var(--red-600); }

/* ---------- 14. DRAWERS · MODALS · TOASTS ---------- */
.scrim{ background:rgba(29,21,23,.55); backdrop-filter:blur(4px); }
.mobile-nav{ background:#fff; border-radius:0 28px 28px 0; box-shadow:30px 0 60px -30px rgba(29,21,23,.5); }
.drawer-header{ border-bottom:1px solid var(--line); background:#fff; }
.drawer-title{ font-family:var(--font-display); font-weight:800; font-size:22px; color:var(--charcoal); letter-spacing:-.03em; }
.drawer-close{ width:42px; height:42px; border-radius:14px; background:var(--red-50); color:var(--red-600); opacity:1; display:flex; align-items:center; justify-content:center; font-size:26px; line-height:1; }
.drawer-nav-item{ position:relative; overflow:hidden; min-height:54px; font-family:var(--font-display); font-weight:700; font-size:18px; letter-spacing:-.02em; color:var(--charcoal); border-bottom:1px solid var(--line); transition:padding-left .3s var(--ease), color .25s ease, background .25s ease; }
.drawer-nav-item:hover,.drawer-nav-item:active{ padding-left:calc(var(--drawer-pad,20px) + 8px); color:var(--red-600); background:var(--red-50); }
.drawer-enquiries-title{ color:var(--red-600); letter-spacing:.2em; }
.drawer-support-link{ color:var(--charcoal); border-radius:10px; }
.drawer-support-link:hover{ color:var(--red-600); }
.drawer-social-icons a{ border-radius:14px; background:var(--red-50); color:var(--red-600); }
.drawer-social-icons a:hover{ background:var(--red-600); color:#fff; }

.cart-drawer{ background:#fff; border-radius:28px 0 0 28px; box-shadow:-30px 0 60px -30px rgba(29,21,23,.5); }
.cart-head{ border-bottom:1px solid var(--line); }
.cart-head h3{ font-family:var(--font-display); font-weight:800; font-size:22px; letter-spacing:-.03em; margin:0; }
.cart-foot{ border-top:1px solid var(--line); background:linear-gradient(180deg,#fff,var(--red-50)); }
@media (max-width:640px){ .cart-drawer{ border-radius:0; } }

.modal-overlay{ background:rgba(29,21,23,.6); backdrop-filter:blur(6px); }
.modal-box{ border-radius:26px; border:1px solid var(--line); box-shadow:0 50px 90px -30px rgba(29,21,23,.7); }
.toast{ background:var(--charcoal); border-radius:16px; box-shadow:0 22px 40px -16px rgba(29,21,23,.7); font-weight:600; }
.toast svg{ color:var(--red-400); }

/* ---------- global small-screen safety ---------- */
@media (max-width:640px){
  body{ font-size:15px; }
  .section{ padding:44px 0; }
  .section-head{ flex-direction:column; align-items:flex-start; gap:14px; }
  .section-head h2{ font-size:clamp(27px,8.4vw,34px) !important; }
  .section-head .see-all{ min-height:42px; }
  .btn,.chip,.icon-btn,button,[role="button"]{ touch-action:manipulation; }
}
table{ max-width:100%; }
pre,code{ overflow-x:auto; max-width:100%; }

/* ---------- motion preferences ---------- */
@media (prefers-reduced-motion: reduce){
  *,*::before,*::after{ animation-duration:.001ms !important; animation-iteration-count:1 !important; transition-duration:.001ms !important; scroll-behavior:auto !important; }
  .reveal{ opacity:1 !important; transform:none !important; }
  .hero-slide-category,.hero-slide-title,.hero-slide-desc,.hero-slide-actions{ opacity:1 !important; transform:none !important; }
  .hero-float-chip{ animation:none; }
}
@media print{
  .scroll-progress,.hero-stage-bg,.wa-float,#loader,.glitter-rain{ display:none !important; }
}

/* ---------- footer contrast fixes (legacy mobile rules are !important) ---------- */
footer .footer-mobile-view,footer .footer-mobile-view *{ font-style:normal !important; }
footer .mobile-enquiries-title,footer .mobile-follow-lbl,footer .footer-accordion-summary,footer .footer-accordion-summary span{ color:var(--red-200) !important; }
footer .mobile-enquiry-links a,footer .footer-accordion-body a,footer .footer-accordion-desc,footer .footer-accordion-body p{ color:rgba(255,255,255,.88) !important; text-decoration:none !important; }
footer .mobile-enquiry-links a[onclick]{ color:var(--red-200) !important; }
footer .footer-accordion-summary svg,footer .footer-acc-chevron{ color:var(--red-200) !important; stroke:currentColor; }
footer .footer-mobile-view .footer-social a,footer .mobile-social-row a{ background:rgba(255,255,255,.1) !important; color:#fff !important; border:1px solid rgba(255,255,255,.2) !important; width:44px !important; height:44px !important; }
footer .footer-social svg{ stroke:currentColor; }
footer .footer-wedtree-brand{ display:flex !important; flex-direction:column; align-items:center; gap:4px; padding:8px 0 4px; }
footer .footer-wedtree-logo{ font-family:var(--font-display) !important; font-weight:800 !important; font-size:clamp(26px,8vw,40px) !important; letter-spacing:-.04em !important; color:#fff !important; }
footer .footer-wedtree-tagline{ font-family:var(--font-serif) !important; font-style:italic !important; color:var(--red-200) !important; font-size:15px !important; letter-spacing:0 !important; }
footer .footer-bottom-track{ color:rgba(255,255,255,.6) !important; }
footer .trust-bar-sub,footer .trust-bar-sub *{ font-style:normal !important; }
footer .trust-bar-sub{ color:rgba(255,255,255,.72) !important; }
footer .trust-bar-sub a{ color:var(--red-200) !important; }
footer .trust-bar-title{ color:#fff !important; }
footer .trust-bar-item{ align-items:flex-start; text-align:left !important; }
@media (min-width:861px){ footer .footer-wedtree-brand{ display:none !important; } }
@media (max-width:640px){
  .hero-proof{ display:grid; grid-template-columns:repeat(3,auto); justify-content:space-between; }
  .hero-proof li{ padding:0 0 0 14px; }
  .hero-proof li:first-child{ padding-left:0; }
  .reviews-section{ padding:44px 0 28px !important; }
  .reviews-grid{ padding-bottom:8px !important; }
}

/* off-canvas drawers: no shadow bleed while closed */
.mobile-nav{ box-shadow:none; }
.mobile-nav.open{ box-shadow:30px 0 60px -30px rgba(29,21,23,.5); }
.cart-drawer{ box-shadow:none; }
.cart-drawer.open{ box-shadow:-30px 0 60px -30px rgba(29,21,23,.5); }
.page-hero p,.page-hero > div{ margin-left:0; margin-right:0; }

/* about page */
.about-story{ background:linear-gradient(120deg,var(--red-50),#fff 70%); border-top:1px solid var(--red-100); }
.about-story-inner{ max-width:1100px !important; }
@media (max-width:860px){
  .about-story-inner{ text-align:left !important; max-width:none !important; padding:0 !important; gap:16px !important; }
  .about-story-brand{ text-align:left !important; align-items:flex-start !important; }
  .about-story-brand .account-kicker{ display:inline-flex !important; font-size:11.5px !important; letter-spacing:.22em !important; color:var(--red-600) !important; text-align:left !important; }
  .about-story-brand h2{ font-size:clamp(28px,8vw,38px) !important; color:var(--charcoal) !important; text-align:left !important; line-height:1.05 !important; }
  .about-story-text{ font-size:15px !important; line-height:1.7 !important; text-align:left !important; }
}
.about-hero h1{ margin:0 0 14px; max-width:16ch; }

/* about page: "Visit Our Store" */
.about-visit{ background:var(--charcoal); color:rgba(255,255,255,.82); position:relative; overflow:hidden; isolation:isolate; }
.about-visit::before{ content:""; position:absolute; z-index:-1; inset:auto -10% -40% auto; width:560px; height:560px; border-radius:50%; background:radial-gradient(circle,rgba(219,31,54,.38),transparent 65%); filter:blur(30px); }
.about-visit-inner{ display:grid; grid-template-columns:1fr 1fr; gap:clamp(28px,5vw,64px); align-items:center; }
.about-visit-info .account-kicker{ color:var(--red-200); }
.about-visit-info .account-kicker::before{ border-color:var(--red-200); box-shadow:3px 3px 0 0 rgba(255,255,255,.14); }
.about-visit-info h2{ font-family:var(--font-display); font-weight:800; font-size:clamp(28px,4vw,44px); letter-spacing:-.045em; color:#fff; margin:0 0 12px; line-height:1.05; }
.about-visit-lead{ color:rgba(255,255,255,.68); font-size:15.5px; line-height:1.6; margin:0 0 22px; max-width:46ch; }
.about-visit-address{ display:flex; align-items:flex-start; gap:12px; font-style:normal; color:rgba(255,255,255,.82); font-size:15px; line-height:1.65; margin:0 0 20px; max-width:42ch; }
.about-visit-address .ico{ flex-shrink:0; margin-top:2px; color:var(--red-200); width:20px; height:20px; display:inline-flex; }
.about-visit-address .ico svg{ width:20px; height:20px; }
.about-visit-contacts{ display:flex; flex-direction:column; gap:12px; margin-bottom:26px; }
.about-visit-contacts a{ display:inline-flex; align-items:center; gap:10px; color:rgba(255,255,255,.85); font-size:15px; font-weight:600; text-decoration:none; transition:color .25s ease; }
.about-visit-contacts a:hover{ color:#fff; }
.about-visit-contacts .ico{ width:19px; height:19px; display:inline-flex; color:var(--red-200); }
.about-visit-contacts .ico svg{ width:19px; height:19px; }
.about-visit-directions{ display:inline-flex; }
.about-visit-map{ border-radius:24px; overflow:hidden; box-shadow:0 30px 60px -30px rgba(0,0,0,.6); border:1px solid rgba(255,255,255,.12); aspect-ratio:4/3; }
.about-visit-map iframe{ width:100%; height:100%; border:0; display:block; filter:grayscale(.15) contrast(1.05); }
@media (max-width:860px){
  .about-visit-inner{ grid-template-columns:1fr; gap:28px; }
  .about-visit-map{ aspect-ratio:16/10; order:2; }
  .about-visit-info{ order:1; }
}

/* about page: store photo gallery */
.about-gallery-grid{ display:grid; grid-template-columns:repeat(4,1fr); gap:clamp(12px,2vw,22px); margin-top:8px; }
.about-gallery-item{ margin:0; border-radius:20px; overflow:hidden; aspect-ratio:3/4; box-shadow:0 20px 40px -24px rgba(29,21,23,.4); background:var(--red-50); }
.about-gallery-item img{ width:100%; height:100%; object-fit:cover; display:block; transition:transform .5s var(--ease); }
.about-gallery-item:hover img{ transform:scale(1.06); }
@media (max-width:860px){ .about-gallery-grid{ grid-template-columns:repeat(2,1fr); } }
.tint-green{ background:linear-gradient(160deg,var(--red-100),var(--red-200)); color:var(--red-800); }
.tint-rose,.tint-maroon,.tint-blush{ background:linear-gradient(160deg,var(--red-50),var(--mist)); }
.tint-wood,.tint-jute,.tint-gold{ background:linear-gradient(160deg,var(--mist),var(--mist-2)); color:var(--charcoal); }

/* floating chip sits top-left so it never covers the slide button */
.hero-float-chip{ bottom:auto; top:44px; left:-26px; }
@media (max-width:1100px){ .hero-float-chip{ left:-10px; } }
@media (max-width:640px){ .hero-float-chip{ left:10px; top:-22px; } }

/* ---------- always-on shine (not only on hover) ---------- */
@keyframes shine-pass{ 0%,55%{ transform:translateX(-140%); } 85%,100%{ transform:translateX(140%); } }
.product-card::after{ animation:shine-pass 5.5s ease-in-out infinite; transition:none; opacity:1 !important; }
.product-card:nth-child(4n+2)::after{ animation-delay:.7s; }
.product-card:nth-child(4n+3)::after{ animation-delay:1.4s; }
.product-card:nth-child(4n+4)::after{ animation-delay:2.1s; }
.product-card:hover::after,.product-card:focus-within::after,.product-card.shine-active::after{ transform:none; animation:shine-pass 1.1s var(--ease) 1; }
.royal-cat-circle::after{ transform:translateX(-140%); transition:none; animation:shine-pass 6s ease-in-out infinite; }
.royal-cat-card:nth-child(2) .royal-cat-circle::after{ animation-delay:.8s; }
.royal-cat-card:nth-child(3) .royal-cat-circle::after{ animation-delay:1.6s; }
.royal-cat-card:nth-child(4) .royal-cat-circle::after{ animation-delay:2.4s; }
.royal-cat-card:hover .royal-cat-circle::after{ transform:none; animation:shine-pass 1.1s var(--ease) 1; }
.hero-carousel-wrapper::after{
  content:""; position:absolute; inset:0; z-index:9; pointer-events:none; border-radius:inherit;
  background:linear-gradient(105deg,transparent 35%,rgba(255,255,255,.35) 50%,transparent 65%); animation:shine-pass 6.5s ease-in-out 1s infinite;
}
.bulk-band .bulk-copy::before{ content:none; }
.bulk-band::after{ animation:none; }
.process-step::after,.review-card::after,.trust-bar-item::after{
  content:""; position:absolute; inset:0; pointer-events:none; border-radius:inherit; z-index:2;
  background:linear-gradient(105deg,transparent 40%,rgba(255,255,255,.55) 50%,transparent 60%); animation:shine-pass 7s ease-in-out infinite;
}
.process-step::after{ background:linear-gradient(105deg,transparent 40%,rgba(255,255,255,.12) 50%,transparent 60%); }
.review-card,.trust-bar-item,.process-step{ overflow:hidden; }
.process-step:nth-child(2)::after{ animation-delay:1.2s; } .process-step:nth-child(3)::after{ animation-delay:2.4s; }
.review-card:nth-child(2)::after{ animation-delay:1s; } .review-card:nth-child(3)::after{ animation-delay:2s; } .review-card:nth-child(4)::after{ animation-delay:3s; }
footer .trust-bar-item::after{ background:linear-gradient(105deg,transparent 40%,rgba(255,255,255,.12) 50%,transparent 60%); }

/* store photo gallery — always-on shine + glitter */
.about-gallery-item,.home-store-item{ position:relative; isolation:isolate; }
.about-gallery-item::after,.home-store-item::after{
  content:""; position:absolute; inset:0; z-index:2; pointer-events:none; border-radius:inherit;
  background:linear-gradient(115deg,transparent 32%,rgba(255,255,255,.9) 50%,transparent 68%);
  transform:translateX(-140%); animation:shine-pass 4.4s ease-in-out infinite;
}
.about-gallery-item::before,.home-store-item::before{
  content:""; position:absolute; inset:0; z-index:3; pointer-events:none; border-radius:inherit;
  background-image:
    radial-gradient(circle at 14% 20%, #fff 0 2px, transparent 2.4px),
    radial-gradient(circle at 78% 15%, #fff 0 1.4px, transparent 1.8px),
    radial-gradient(circle at 60% 38%, #fff 0 1.6px, transparent 2px),
    radial-gradient(circle at 25% 55%, #fff 0 1.3px, transparent 1.6px),
    radial-gradient(circle at 85% 62%, #fff 0 2px, transparent 2.4px),
    radial-gradient(circle at 45% 80%, #fff 0 1.5px, transparent 1.9px),
    radial-gradient(circle at 8% 88%, #fff 0 1.3px, transparent 1.6px),
    radial-gradient(circle at 92% 90%, #fff 0 1.8px, transparent 2.2px);
  background-repeat:no-repeat;
  filter:drop-shadow(0 0 3px rgba(255,255,255,.9));
  opacity:0; animation:glitter-twinkle 3.6s ease-in-out infinite;
}
@keyframes glitter-twinkle{
  0%,100%{ opacity:0; transform:scale(.7); }
  8%{ opacity:1; transform:scale(1.15); }
  16%{ opacity:0; transform:scale(.7); }
  44%{ opacity:0; }
  52%{ opacity:.95; transform:scale(1.1); }
  60%{ opacity:0; transform:scale(.7); }
}
.about-gallery-item:nth-child(2)::after,.home-store-item:nth-child(2)::after{ animation-delay:.7s; }
.about-gallery-item:nth-child(3)::after,.home-store-item:nth-child(3)::after{ animation-delay:1.4s; }
.about-gallery-item:nth-child(4)::after,.home-store-item:nth-child(4)::after{ animation-delay:2.1s; }
.about-gallery-item:nth-child(2)::before,.home-store-item:nth-child(2)::before{ animation-delay:1s; }
.about-gallery-item:nth-child(3)::before,.home-store-item:nth-child(3)::before{ animation-delay:1.9s; }
.about-gallery-item:nth-child(4)::before,.home-store-item:nth-child(4)::before{ animation-delay:2.7s; }

/* trust bar cards — mobile: restore card padding, centre content, let text wrap */
@media (max-width:640px){
  .trust-bar-grid{ gap:12px !important; }
  footer .trust-bar-item,.trust-bar-item{
    padding:18px 12px 16px !important; align-items:center !important; text-align:center !important; justify-content:flex-start; gap:2px;
    min-width:0; overflow:hidden;
  }
  .trust-bar-icon{ width:46px !important; height:46px !important; margin:0 0 8px !important; }
  .trust-bar-icon svg,.trust-bar-icon img{ width:28px !important; height:28px !important; }
  .trust-bar-title{ font-size:13.5px !important; line-height:1.25 !important; margin-bottom:4px !important; text-align:center; }
  .trust-bar-sub{ font-size:11.5px !important; line-height:1.4 !important; text-align:center !important; overflow-wrap:anywhere; width:100%; }
  .trust-bar-links{ display:flex !important; flex-direction:column; align-items:center; gap:4px !important; margin-top:2px !important; font-size:11.5px !important; }
  .trust-bar-links a{ font-size:12px !important; }
}

/* ======================= PERFORMANCE ======================= */
/* glitter: transform/opacity only, no animated filters */
.glitter-rain i{ filter:none; box-shadow:0 0 6px 1px rgba(200,16,46,.7),0 0 0 1px rgba(255,255,255,.7); will-change:transform,opacity; }
.about-gallery-item::before,.home-store-item::before{ filter:none; will-change:opacity; }
.about-gallery-item::after,.home-store-item::after{ will-change:transform; }
@media (max-width:860px){
  .glitter-rain i:nth-child(n+13){ display:none; }
}

/* static soft glows don't need a blur filter — the radial gradient is already soft */
footer::before,.process-section::before,.about-visit::before{ filter:none; }

/* skip rendering work for sections far below the fold */
.reviews-section,.bulk-section,.home-store-section,.about-gallery,.about-visit,.process-section{ content-visibility:auto; contain-intrinsic-size:auto 560px; }
footer{ content-visibility:auto; contain-intrinsic-size:auto 700px; }

/* limit always-on shine: only the first row of product cards animates */
.product-card:nth-child(n+5)::after{ animation:none; transform:translateX(-130%); }
.product-card:nth-child(n+5):hover::after{ animation:shine-pass 1.1s var(--ease) 1; }

/* phones / touch: lighter effects so scrolling stays smooth */
@media (max-width:860px), (hover:none){
  .header-row{ backdrop-filter:none !important; -webkit-backdrop-filter:none !important; background:rgba(255,255,255,.96); }
  .hero-stage-bg .orb{ filter:none; animation:none !important; will-change:auto; }
  .hero-float-chip{ backdrop-filter:none; animation:none; }
  .hero-carousel-dots,.hero-spotlight-btn-secondary{ backdrop-filter:none !important; }
  .product-card::after,.royal-cat-circle::after,.hero-carousel-wrapper::after,
  .process-step::after,.review-card::after,.trust-bar-item::after{ animation:none !important; opacity:0 !important; }
  .btn-primary::after,.hero-slide-btn::after{ animation:none; }
}

/* ---------- loader: logo + glittering tagline ---------- */
#loader .loader-logo-wrap{ position:relative; width:110px; margin-bottom:20px; animation:loader-logo-in .9s var(--ease) .1s both; }
#loader .loader-logo{ display:block; width:100%; height:auto; animation:loader-logo-float 2.4s ease-in-out 1s infinite; }
@keyframes loader-logo-in{ from{ opacity:0; transform:scale(.6) translateY(10px); } to{ opacity:1; transform:none; } }
@keyframes loader-logo-float{ 0%,100%{ transform:translateY(0); } 50%{ transform:translateY(-6px); } }
#loader .ls{ position:absolute; width:7px; height:7px; border-radius:50%; background:radial-gradient(circle,#fff 25%,var(--red-500) 70%,transparent 85%); box-shadow:0 0 8px 2px rgba(200,16,46,.55); opacity:0; animation:ls-twinkle 1.8s ease-in-out infinite; }
#loader .ls1{ left:-14px; top:18%; animation-delay:.6s; }
#loader .ls2{ right:-12px; top:8%; animation-delay:1s; width:5px; height:5px; }
#loader .ls3{ left:-6px; bottom:12%; animation-delay:1.4s; width:5px; height:5px; }
#loader .ls4{ right:-16px; bottom:26%; animation-delay:.8s; }
#loader .ls5{ left:46%; top:-14px; animation-delay:1.2s; width:6px; height:6px; }
@keyframes ls-twinkle{ 0%,100%{ opacity:0; transform:scale(.4); } 50%{ opacity:1; transform:scale(1.2); } }

#loader .loader-tagline{
  margin-top:10px; display:flex; align-items:center; justify-content:center; gap:8px;
  font-family:"Great Vibes","Playfair Display",cursive; font-size:clamp(18px,5.8vw,34px); line-height:1.2; white-space:nowrap;
  animation:loader-in .8s var(--ease) .45s both;
}
#loader .loader-tagline-text{
  background:linear-gradient(100deg,var(--red-700) 0%,var(--red-500) 35%,#FF9AA8 50%,var(--red-500) 65%,var(--red-700) 100%);
  background-size:250% 100%; -webkit-background-clip:text; background-clip:text; color:transparent; -webkit-text-fill-color:transparent;
  animation:tagline-shimmer 2.4s linear infinite;
}
#loader .loader-tagline-heart{ font-size:.7em; animation:lf-beat 1.4s ease-in-out infinite; display:inline-block; }
@keyframes tagline-shimmer{ from{ background-position:120% 0; } to{ background-position:-120% 0; } }