/* ============================================================
   0. FONTS  (self-hosted: same files Google serves Chrome, but
   without the render-blocking third-party CSS + font hop)
   ============================================================ */
@font-face{font-family:'Inter';font-style:normal;font-weight:400;font-display:swap;src:url('../fonts/inter-400-latin-ext.woff2') format('woff2');unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;}
@font-face{font-family:'Inter';font-style:normal;font-weight:400;font-display:swap;src:url('../fonts/inter-400-latin.woff2') format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;}
@font-face{font-family:'Inter';font-style:normal;font-weight:500;font-display:swap;src:url('../fonts/inter-500-latin-ext.woff2') format('woff2');unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;}
@font-face{font-family:'Inter';font-style:normal;font-weight:500;font-display:swap;src:url('../fonts/inter-500-latin.woff2') format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;}
@font-face{font-family:'Inter';font-style:normal;font-weight:600;font-display:swap;src:url('../fonts/inter-600-latin-ext.woff2') format('woff2');unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;}
@font-face{font-family:'Inter';font-style:normal;font-weight:600;font-display:swap;src:url('../fonts/inter-600-latin.woff2') format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;}
@font-face{font-family:'Outfit';font-style:normal;font-weight:300;font-display:swap;src:url('../fonts/outfit-300-latin-ext.woff2') format('woff2');unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;}
@font-face{font-family:'Outfit';font-style:normal;font-weight:300;font-display:swap;src:url('../fonts/outfit-300-latin.woff2') format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;}
@font-face{font-family:'Outfit';font-style:normal;font-weight:400;font-display:swap;src:url('../fonts/outfit-400-latin-ext.woff2') format('woff2');unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;}
@font-face{font-family:'Outfit';font-style:normal;font-weight:400;font-display:swap;src:url('../fonts/outfit-400-latin.woff2') format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;}
@font-face{font-family:'Outfit';font-style:normal;font-weight:500;font-display:swap;src:url('../fonts/outfit-500-latin-ext.woff2') format('woff2');unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;}
@font-face{font-family:'Outfit';font-style:normal;font-weight:500;font-display:swap;src:url('../fonts/outfit-500-latin.woff2') format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;}
@font-face{font-family:'Outfit';font-style:normal;font-weight:600;font-display:swap;src:url('../fonts/outfit-600-latin-ext.woff2') format('woff2');unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;}
@font-face{font-family:'Outfit';font-style:normal;font-weight:600;font-display:swap;src:url('../fonts/outfit-600-latin.woff2') format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;}
@font-face{font-family:'Outfit';font-style:normal;font-weight:700;font-display:swap;src:url('../fonts/outfit-700-latin-ext.woff2') format('woff2');unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;}
@font-face{font-family:'Outfit';font-style:normal;font-weight:700;font-display:swap;src:url('../fonts/outfit-700-latin.woff2') format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;}

/* ============================================================
   1. TOKENS
   ============================================================ */
:root{
  --ink:#252525;
  --ink-2:#333;
  --ink-3:#8B98A7;
  --paper:#FFFCF5;
  --white:#FFFFFF;
  --grey:#F2F3F4;

  --primary:#3D5675;
  --primary-deep:#2B3F58;
  --accent:#660033;
  --accent-deep:#5B1638;
  --accent-soft:#C46F95;
  --accent-wash:#F7E6ED;

  --t-gold:#F7E5AD;
  --t-sage:#D9F9B1;
  --t-mint:#B7DED0;
  --t-sun:#FFE6A3;
  --t-sky:#CFE0F0;
  --t-peach:#FBD9AE;

  --line:#E4E7EB;
  --line-2:#C4C4C4;

  --pcb-line: #e6e8ef;

  --radius:10px;
  --radius-lg:10px;
  --maxw:1440px;
  --gutter:clamp(20px,4vw,72px);
  --ff-display:'Outfit',system-ui,-apple-system,sans-serif;
  --ff-body:'Inter',system-ui,-apple-system,sans-serif;


}

/* ============================================================
   2. BASE
   ============================================================ */
*,*::before,*::after{box-sizing:border-box;}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%;}
@media (prefers-reduced-motion: reduce){
  html{scroll-behavior:auto;}
  *{animation-duration:.001ms !important;animation-iteration-count:1 !important;transition-duration:.001ms !important;}
}
body{
  margin:0; color:var(--ink);
  font-family:var(--ff-body);font-size:16px;line-height:1.65;font-weight:400;
  -webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;
  overflow-x:hidden;
  /* long emails and URLs must not push a narrow card past its column */
  overflow-wrap:break-word;
}
img{max-width:100%;display:block;}
a{color:inherit;}
ul{margin:0;padding:0;list-style:none;}
button{font-family:inherit;color:inherit;}
h1,h2,h3,h4{
  font-family:var(--ff-display);margin:0;font-weight:500;
  letter-spacing:-.022em;line-height:1.14;text-wrap:balance;color:var(--ink);
}
:focus-visible{outline:2px solid var(--accent);outline-offset:3px;border-radius:4px;}
.wrap{max-width:var(--maxw);margin-inline:auto;padding-inline:var(--gutter);}
section{padding-block:clamp(44px,7vw,110px);}
/* social marks: inline SVG that behaves like the old icon font, so every
   existing font-size / color rule on .bi keeps working unchanged */
.bi{display:inline-block;width:1em;height:1em;fill:currentColor;stroke:none;vertical-align:-.125em;flex-shrink:0;}
.icon{width:1.1em;height:1.1em;stroke:currentColor;fill:none;stroke-width:1.6;
  stroke-linecap:round;stroke-linejoin:round;flex-shrink:0;}
.bg-grey{background:var(--grey);}

/* --- type helpers --- */
.label{display:inline-block;font-size:.8rem;font-weight:600;letter-spacing:0;
  color:var(--accent-deep);background:var(--accent-wash);
  border-radius:10px;padding:6px 15px;margin-bottom:18px;}
.h-xl{font-size:clamp(1.95rem,1.25rem + 3.6vw,4rem);font-weight:600;line-height:1.08;letter-spacing:-.032em;}
.h-lg{font-size:clamp(1.55rem,1.15rem + 2.1vw,2.8rem);font-weight:600;line-height:1.16;letter-spacing:-.028em;}
.h-md{font-size:clamp(1.35rem,1.1rem + 1.1vw,1.9rem);font-weight:600;letter-spacing:-.022em;}
.lede{font-size:clamp(1rem,.96rem + .28vw,1.14rem);color:var(--ink-2);line-height:1.6;}
.section-head{max-width:640px;margin-bottom:clamp(34px,4vw,52px);}
.section-head.center{max-width:660px;margin-inline:auto;text-align:center;}
.section-head p{margin-top:16px;color:var(--ink-2);font-size:1.02rem;}
.head-row{display:flex;align-items:flex-end;justify-content:space-between;gap:28px;
  flex-wrap:wrap;margin-bottom:clamp(34px,4vw,52px);}
.head-row .section-head{margin-bottom:0;}

/* --- buttons --- */
.btn{
  display:inline-flex;align-items:center;justify-content:center;gap:.65em;
  font-family:var(--ff-body);font-size:.93rem;font-weight:600;line-height:1.65;
  padding:.92em 1.6em;border-radius:10px;border:1.5px solid transparent;
  cursor:pointer;text-decoration:none;white-space:nowrap;
  transition:background .2s ease,border-color .2s ease,color .2s ease,transform .15s ease;
}
.btn .icon{width:16px;height:16px;transition:transform .2s ease;}
.btn:hover .icon{transform:translateX(3px);}
.btn:active{transform:scale(.98);}
.btn:focus-visible{box-shadow:none;}
.btn-primary{
  --bs-btn-color:#fff;--bs-btn-bg:var(--accent);--bs-btn-border-color:var(--accent);
  --bs-btn-hover-color:#fff;--bs-btn-hover-bg:var(--accent-deep);--bs-btn-hover-border-color:var(--accent-deep);
  --bs-btn-active-color:#fff;--bs-btn-active-bg:var(--accent-deep);--bs-btn-active-border-color:var(--accent-deep);
  --bs-btn-disabled-color:#fff;--bs-btn-disabled-bg:var(--accent);--bs-btn-disabled-border-color:var(--accent);
  background:var(--accent);color:#fff;
}
.btn-primary:hover{background:var(--accent-deep);color:#fff;}
.btn-primary:active,.btn-primary:focus,.btn-primary.active{background:var(--accent-deep);color:#fff;border-color:var(--accent-deep);}
.btn-accent{
  --bs-btn-color:#fff;--bs-btn-bg:var(--accent);--bs-btn-border-color:var(--accent);
  --bs-btn-hover-color:#fff;--bs-btn-hover-bg:var(--accent);--bs-btn-hover-border-color:var(--accent);
  --bs-btn-active-color:#fff;--bs-btn-active-bg:var(--accent);--bs-btn-active-border-color:var(--accent);
  --bs-btn-disabled-color:#fff;--bs-btn-disabled-bg:var(--accent);--bs-btn-disabled-border-color:var(--accent);
  background:var(--accent);color:#fff;
}
.btn-accent:hover{background:var(--accent);color:#fff;}
.btn-accent:active,.btn-accent:focus,.btn-accent.active{background:var(--accent);color:#fff;border-color:var(--accent);}
.btn-outline{background:transparent;color:var(--ink);border-color:var(--line-2);}
.btn-outline:hover{border-color:var(--ink);}
.btn-white{background:#fff;color:var(--ink);}
.btn-white:hover{background:var(--grey);}
.btn-sm{font-size:.86rem;padding:.72em 1.3em;border-radius:7px;}
.link-arrow{display:inline-flex;align-items:center;gap:7px;font-size:.9rem;font-weight:600;
  color:var(--accent-deep);text-decoration:none;}
.link-arrow .icon{width:15px;height:15px;transition:transform .2s ease;}
.link-arrow:hover .icon{transform:translateX(3px);}

/* ============================================================
   3. TICKER
   ============================================================ */
.ticker{background:var(--ink);color:#fff;overflow:hidden;font-size:.8rem;}
.ticker-track{display:flex;width:max-content;animation:slide 44s linear infinite;}
.ticker:hover .ticker-track{animation-play-state:paused;}
.ticker-group{display:flex;align-items:center;flex-shrink:0;}
.ticker-item{display:inline-flex;align-items:center;gap:9px;padding:10px 28px;white-space:nowrap;}
.ticker-item .icon{width:14px;height:14px;color:var(--accent-soft);}
.ticker-item a{color:#fff;text-decoration:none;}
.ticker-item a:hover{color:var(--accent-soft);}
@keyframes slide{from{transform:translateX(0);}to{transform:translateX(-50%);}}
@media (prefers-reduced-motion: reduce){.ticker-track{animation:none;}}

/* ============================================================
   4. HEADER
   ============================================================ */
header.site{position:sticky;top:0;z-index:70;background:rgba(255,255,255,.94);
  backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);border-bottom:1px solid var(--line);}

/* --- announcement strip at the top of the header --- */
.topbar{background:var(--accent);color:#fff;}
.topbar p{margin:0;padding-block:9px;text-align:center;text-wrap:balance;
  font-size:.78rem;font-weight:600;letter-spacing:.01em;line-height:1.4; width:100%; max-width:100%;}
.topbar .icon{display:inline-block;width:16px;height:16px;margin-right:7px;vertical-align:-3px;}
.topbar strong{font-weight:700;}
@media(max-width:620px){
  .topbar p{padding-block:8px;font-size:.7rem;}
  .topbar .icon{width:14px;height:14px;margin-right:6px;vertical-align:-2px;}
}
/* header spans the whole viewport, only gutters hold it in */
.nav{max-width:none;display:grid;grid-template-columns:1fr auto 1fr;
  align-items:center;gap:20px;padding-block:14px;}
.nav-left,.nav-right{display:flex;align-items:center;gap:clamp(14px,1.9vw,26px);}
.nav-left{justify-self:start;}
.nav-right{justify-self:end;}
nav.primary{display:flex;align-items:center;gap:clamp(14px,1.9vw,26px);}
nav.primary > a,.has-mega > .nav-link,.has-drop > .nav-link{
  background:none;border:0;cursor:pointer;padding:8px 13px;border-radius:10px;
  text-decoration:none;font-family:var(--ff-body);font-size:.9rem;font-weight:500;color:var(--ink-2);
  transition:background-color .15s ease,color .15s ease;
  display:inline-flex;align-items:center;gap:6px;white-space:nowrap;
}
nav.primary > a:hover,.has-mega > .nav-link:hover,.has-drop > .nav-link:hover,
.has-mega.is-open > .nav-link,.has-drop.is-open > .nav-link,nav.primary > a[aria-current]{
  background:var(--grey);color:var(--ink);
}
.has-mega .caret,.has-drop .caret{width:11px;height:11px;stroke-width:2;transition:transform .2s ease;}
.has-mega.is-open .caret,.has-drop.is-open .caret{transform:rotate(180deg);}
/* invisible bridge across the header padding under the button */
.has-mega > .nav-link,.has-drop > .nav-link{position:relative;}
.has-mega > .nav-link::after,.has-drop > .nav-link::after{content:"";position:absolute;left:0;right:0;top:100%;height:18px;}
/* --- mega menu: full-width panel dropping from the header ----------------
   .has-mega must NOT be positioned, so .mega resolves against header.site
   and can span the whole viewport width. */
.mega{position:absolute;top:100%;left:0;width:100%;z-index:20;
  border-top:1px solid var(--line);display:none;}
/* .is-open is set by JS on a short delay so the pointer can cross the
   gap between the button and the panel without the menu vanishing */
.has-mega.is-open .mega{display:block;}
.mega-inner{display:flex;align-items:flex-start;gap:clamp(20px,3vw,48px);
  background:var(--white);padding:30px var(--gutter) 34px;
  max-height:calc(100vh - 185px);overflow-y:auto;overscroll-behavior:contain;
  animation:megaIn .18s ease both;}

@keyframes megaIn{from{opacity:0;transform:translateY(-6px);}to{opacity:1;transform:none;}}
/* flows below the panel and dims the rest of the page, packhelp-style */
.mega-scrim{position:absolute;top:100%;left:0;right:0;height:100vh;background:#00061A;opacity:.18;pointer-events:none;}
/* left side: product tiles (optionally with a category rail), right side: .mega-promo */
.mega-body{flex:1 1 auto;min-width:0;}
.mega-body-rail{display:flex;align-items:stretch;gap:clamp(18px,2.2vw,34px);}
.mega-rail{flex:0 0 clamp(200px,16vw,250px);padding-right:clamp(12px,1.2vw,18px);border-right:1px solid var(--line);}
.mega-rail li{margin-bottom:2px;}
.mega-rail a,.mega-rail button{display:block;width:100%;text-align:left;background:none;border:0;cursor:pointer;
  padding:10px 14px;border-radius:8px;font-family:var(--ff-body);font-size:.88rem;line-height:1.35;
  color:var(--ink-2);text-decoration:none;transition:background .15s ease,color .15s ease;}
.mega-rail li.is-active > a,.mega-rail li.is-active > button{background:var(--grey);color:var(--accent-deep);font-weight:500;}
.mega-panels{flex:1 1 auto;min-width:0;}
.mega-grid{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:18px clamp(10px,1.2vw,18px);}
.mega-grid-6{grid-template-columns:repeat(6,minmax(0,1fr));}
.mega-panel{display:none;}
.mega-panel.is-active{display:grid;animation:megaIn .18s ease both;}
.mega-tile{display:flex;flex-direction:column;align-items:center;gap:9px;text-align:center;text-decoration:none;}
.mega-thumb{display:block;width:100%;aspect-ratio:1;padding:7px;overflow:hidden;
  background:var(--grey);border:1px solid var(--line);border-radius:10px;
  transition:border-color .2s ease,box-shadow .2s ease;}
.mega-thumb img{display:block;width:100%;height:100%;object-fit:cover;border-radius:8px;transition:transform .3s ease;}
.mega-tile-name{font-size:.83rem;font-weight:500;line-height:1.3;color:var(--ink-2);transition:color .15s ease;}
.mega-tile:hover .mega-thumb{border-color:var(--accent-soft);box-shadow:0 8px 20px rgba(102,0,51,.08);}
.mega-tile:hover .mega-thumb img{transform:scale(1.04);}
.mega-thumb.has-hover{position:relative;}
.mega-thumb.has-hover img{transition:transform .3s ease,opacity .2s linear;}
.mega-thumb .mega-thumb-hover{position:absolute;inset:7px;width:calc(100% - 14px);height:calc(100% - 14px);opacity:0;}
.mega-tile:hover .mega-thumb.has-hover img{opacity:0;}
.mega-tile:hover .mega-thumb.has-hover .mega-thumb-hover{opacity:1;}
.mega-tile:hover .mega-tile-name{color:var(--accent-deep);}
.mega-tile-all .mega-thumb{display:grid;place-items:center;padding:12px;
  font-size:.86rem;font-weight:600;color:var(--accent-deep);}
.mega-tile-all:hover .mega-thumb{background:var(--accent-wash);}
@media (max-width:1320px){
  .mega-grid{grid-template-columns:repeat(4,minmax(0,1fr));}
  .mega-grid-6{grid-template-columns:repeat(5,minmax(0,1fr));}
}
/* --- simple dropdown (Company): anchored to its button, not full width --- */
.has-drop{position:relative;}
.drop{position:absolute;top:calc(100% + 10px);right:0;z-index:25;display:none;min-width:220px;padding:8px;
  background:var(--white);border:1px solid var(--line);border-radius:10px;box-shadow:0 18px 40px rgba(0,6,26,.12);}
.has-drop.is-open .drop{display:block;animation:megaIn .18s ease both;}
.drop a{display:block;padding:9px 12px;border-radius:8px;white-space:nowrap;
  text-decoration:none;font-size:.86rem;color:var(--ink-2);transition:background .15s ease,color .15s ease;}
.drop a:hover,.drop a[aria-current]{background:var(--grey);color:var(--accent-deep);}
.mega-promo{flex:0 0 clamp(250px,22vw,320px);position:relative;overflow:hidden;
  border-radius:var(--radius);background:var(--t-sky);
  padding:24px;min-height:210px;text-decoration:none;display:flex;flex-direction:column;align-items:flex-start;}
.mega-promo .eyebrow,.mega-promo strong,.mega-promo .promo-link{position:relative;z-index:1;}
.mega-promo .eyebrow{display:block;font-size:.7rem;font-weight:600;letter-spacing:.1em;
  text-transform:uppercase;color:var(--ink-2);margin-bottom:9px;}
.mega-promo strong{display:block;font-family:var(--ff-display);font-size:1.14rem;
  font-weight:600;line-height:1.26;letter-spacing:-.02em;color:var(--ink);max-width:18ch;}
.mega-promo .promo-link{display:inline-block;margin-top:auto;padding-top:16px;font-size:.86rem;font-weight:600;
  color:var(--accent-deep);border-bottom:1px solid currentColor;padding-bottom:1px;}
.brand{justify-self:center;display:inline-flex;align-items:center;text-decoration:none;}
.brand img{height:40px;width:auto;display:block;}
.nav-actions{display:flex;align-items:center;gap:10px;}
.icon-btn{width:38px;height:38px;border-radius:7px;border:1.5px solid var(--line-2);
  background:transparent;display:inline-flex;align-items:center;justify-content:center;
  cursor:pointer;color:var(--ink);flex-shrink:0;transition:border-color .2s ease,background .2s ease;}
.icon-btn:hover{border-color:var(--ink);background:var(--white);}
.icon-btn .icon{width:16px;height:16px;}
.burger{display:none;}
/* --- mobile drawer: slides in from the left; each level is a panel that
   slides over the previous one (Back pops it, X closes the whole drawer).
   header.site has backdrop-filter, which would trap position:fixed children
   inside the header box, so it is switched off while the drawer is open. --- */
.mm{position:fixed;inset:0;z-index:100;visibility:hidden;transition:visibility 0s .3s;}
.mm.is-open{visibility:visible;transition-delay:0s;}
/* the closed drawer is fixed+inset:0, so its lazy images counted as in-viewport
   and ~800KB of menu artwork downloaded on every page load. Skipping the
   subtree until it opens defers them; the drawer slide is on .mm-drawer, so
   the open animation is untouched. */
.mm:not(.is-open) .mm-panel{content-visibility:hidden;}
html.mm-lock{overflow:hidden;}
html.mm-lock header.site{backdrop-filter:none;-webkit-backdrop-filter:none;}
.mm-overlay{position:absolute;inset:0;background:#00061A;opacity:0;transition:opacity .3s ease;}
.mm.is-open .mm-overlay{opacity:.45;}
.mm-drawer{position:absolute;top:0;bottom:0;left:0;width:min(88vw,380px);overflow:hidden;
  background:var(--white);box-shadow:12px 0 40px rgba(0,6,26,.18);
  transform:translateX(-100%);transition:transform .3s cubic-bezier(.4,0,.2,1);}
.mm.is-open .mm-drawer{transform:none;}
.mm-panel{position:absolute;inset:0;display:flex;flex-direction:column;overflow-y:auto;overscroll-behavior:contain;
  background:var(--white);transform:translateX(100%);visibility:hidden;
  transition:transform .3s cubic-bezier(.4,0,.2,1),visibility 0s .3s;}
.mm-panel.is-current{transform:none;visibility:visible;transition-delay:0s;}
.mm-panel.is-past{transform:translateX(-28%);}
.mm-head{position:sticky;top:0;z-index:1;display:flex;align-items:center;justify-content:space-between;gap:12px;
  min-height:64px;padding:10px 14px 10px 20px;background:var(--white);border-bottom:1px solid var(--line);}
.mm-brand img{display:block;height:36px;width:auto;}
.mm-close{display:inline-flex;align-items:center;justify-content:center;width:38px;height:38px;flex-shrink:0;
  border:1.5px solid var(--line-2);border-radius:7px;background:transparent;color:var(--ink);cursor:pointer;}
.mm-close:hover{border-color:var(--ink);}
.mm-close .icon{width:16px;height:16px;}
.mm-back{display:inline-flex;align-items:center;gap:6px;margin-left:-8px;padding:8px 10px;border:0;border-radius:7px;
  background:none;cursor:pointer;font-family:var(--ff-body);font-size:.9rem;font-weight:500;color:var(--ink-2);}
.mm-back:hover{background:var(--grey);color:var(--ink);}
.mm-back .icon{width:16px;height:16px;}
.mm-title{display:flex;align-items:baseline;justify-content:space-between;gap:12px;padding:18px 20px 8px;}
.mm-title strong{font-family:var(--ff-display);font-size:1.18rem;font-weight:600;letter-spacing:-.015em;color:var(--ink);}
.mm-viewall{flex-shrink:0;font-size:.82rem;font-weight:600;color:var(--accent-deep);text-decoration:none;border-bottom:1px solid currentColor;}
.mm-list{padding:4px 12px 16px;}
.mm-list-root{padding-top:10px;}
.mm-list a,.mm-list button,.mm-list span.mm-prod{display:flex;align-items:center;justify-content:space-between;gap:12px;width:100%;
  padding:13px 10px;border:0;border-bottom:1px solid var(--line);background:none;cursor:pointer;text-align:left;
  font-family:var(--ff-body);font-size:.95rem;font-weight:500;line-height:1.35;color:var(--ink);text-decoration:none;
  transition:background .15s ease,color .15s ease;}
.mm-list li:last-child > *{border-bottom:0;}
/* static Materials & Finishes tiles that have no page to link to */
.mm-list span.mm-prod,span.mega-tile{cursor:default;}
.mm-list a:hover,.mm-list button:hover,.mm-list a[aria-current]{background:var(--grey);color:var(--accent-deep);}
.mm-list button .icon{width:16px;height:16px;flex-shrink:0;color:var(--ink-2);}
.mm-list .mm-prod{justify-content:flex-start;padding:9px 10px;font-size:.9rem;}
.mm-prod img{width:44px;height:44px;flex-shrink:0;object-fit:cover;border-radius:8px;border:1px solid var(--line);background:var(--grey);}
.mm-foot{margin-top:auto;display:flex;flex-direction:column;gap:12px;padding:18px 20px 26px;border-top:1px solid var(--line);background:var(--grey);}
.mm-foot .btn{align-self:stretch;justify-content:center;}
.mm-contact{display:inline-flex;align-items:center;gap:8px;font-size:.86rem;font-weight:500;color:var(--ink-2);text-decoration:none;}
.mm-contact .icon{width:15px;height:15px;}
@media (min-width:1181px){.mm{display:none;}}
@media (max-width:1180px){
  nav.primary{display:none;}
  .burger{display:inline-flex;}
}
@media (max-width:620px){.nav-cta{display:none;}.brand img{height:32px;}}

/* ============================================================
   5. HERO — full-bleed lifestyle photo, centred copy
   ============================================================ */
.hero{background:var(--white);text-align:center;
  padding-block:clamp(60px,7.5vw,116px) clamp(48px,5.5vw,80px);}
.hero .wrap{max-width:1000px;}
/* reserves room for the tallest rotating headline so nothing jumps */
.hero h1{min-height:2.2em;}
.hero h1 em{font-style:normal;color:var(--accent-deep);}
.hero-sub{margin:20px auto 0;max-width:52ch;min-height:2.6em;}
.hero-actions{display:flex;justify-content:center;align-items:center;gap:14px;flex-wrap:wrap;margin-top:32px;}
.hero-link{font-size:.92rem;font-weight:500;color:var(--ink-2);text-decoration:underline;
  text-underline-offset:4px;}
.hero-link:hover{color:var(--ink);}
.hero-note{margin-top:24px;font-size:.86rem;color:var(--ink-3);}
.hero-note .icon{width:15px;height:15px;color:var(--accent);vertical-align:-3px;margin-right:8px;}
.hero-note b,.hero-note strong{color:#000;font-weight:600;}
@media (max-width:980px){
  .hero{min-height:0;}
  /* reserved height leaves an ugly gap once the headline stacks */
  .hero h1,.hero-sub{min-height:0;}
}

/* ============================================================
   7. PRODUCT CARDS — photo led
   ============================================================ */
.card-rail{display:flex;gap:clamp(16px,1.6vw,24px);overflow-x:auto;
  scroll-snap-type:x mandatory;padding-bottom:8px;scrollbar-width:none;}
.card-rail::-webkit-scrollbar{display:none;}
.card-rail .pcard{flex:0 0 clamp(244px,22vw,310px);scroll-snap-align:start;}
.head-actions{display:flex;align-items:center;gap:22px;flex-wrap:wrap;}
.pcard{display:flex;flex-direction:column;text-decoration:none;}
.pcard .tile{position:relative;border-radius:var(--radius);aspect-ratio:1/1;overflow:hidden;
  background:var(--grey);transition:transform .3s ease; position: relative;}
.pcard:hover .tile{transform:translateY(-5px);}
.pcard .tile img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;
  transition:transform .5s cubic-bezier(.2,.7,.3,1); -webkit-transition: all linear 0.2s 0s;transition: all linear 0.2s 0s;}
.pcard:hover .tile img{transform:scale(1.05);}
.pcard .tile .normal_img img, .pcard .tile .hover_img{ -webkit-transition: all linear 0.2s 0s;transition: all linear 0.2s 0s;}


.pcard .tile .normal_img { opacity:1; }
.pcard .tile .hover_img { opacity:0; }
.card-rail .pcard:hover .tile .normal_img, .product-grid .pcard:hover .tile .normal_img{ opacity:0; }
.card-rail .pcard:hover .tile .hover_img, .product-grid  .pcard:hover .tile .hover_img { opacity:1; }
/* .pcard .tile img { position:absolute; left:50%; top:50%; transform:translate(-50%,-50%); -webkit-transform:translate(-50%,-50%); max-width:70%; } */





.pcard .badge{position:absolute;top:14px;left:14px;z-index:2;font-size:.72rem;font-weight:600;color:var(--ink);
  background:rgba(255,255,255,.9);border-radius:10px;padding:4px 11px;}
.pcard h3{font-size:1.06rem;font-weight:600;margin-top:16px;}
.pcard p{font-size:.89rem;color:var(--ink-2);margin-top:7px;line-height:1.55;flex:1;}
.pcard .go{margin-top:12px;font-size:.84rem;font-weight:600;color:var(--accent-deep);
  align-self:flex-start;display:inline-flex;align-items:center;gap:6px;}
.pcard .go .icon{width:14px;height:14px;transition:transform .2s ease;}
.pcard:hover .go .icon{transform:translateX(3px);}
.view-all{display:flex;justify-content:center;margin-top:clamp(32px,3.6vw,46px);}

/* ============================================================
   11. CLIENTS + TESTIMONIALS
   ============================================================ */
.trustbar{background:var(--white);border-bottom:1px solid var(--line);padding-block:24px;overflow:hidden;}
.trustbar .trustbar-inner{max-width:none;display:flex;align-items:center;gap:clamp(20px,3vw,46px);}
.trustbar .tb-label{flex:none;font-size:.83rem;font-weight:600;color:var(--ink-2);white-space:nowrap;}
.client-viewport{flex:1;min-width:0;overflow:hidden;mask-image:linear-gradient(to right,transparent,#000 4%,#000 96%,transparent);-webkit-mask-image:linear-gradient(to right,transparent,#000 4%,#000 96%,transparent);}
.client-track{display:flex;align-items:center;width:max-content;animation:client-flow 42s linear infinite;will-change:transform;}
.client-logo-group{display:flex;align-items:center;flex:none;min-width:100vw;margin:0;padding:0;list-style:none;}
.client-logo-group li{display:grid;place-items:center;flex:1 0 128px;height:48px;min-width:0;}
.client-logo-group img{display:block;width:auto;max-width:100%;height:auto;max-height:34px;object-fit:contain;}
@keyframes client-flow{to{transform:translate3d(-50%,0,0);}}
@media(max-width:700px){
  .trustbar .trustbar-inner{display:block;}
  .trustbar .tb-label{display:block;text-align:center;margin-bottom:14px;}
  .client-viewport{margin-inline:calc(-1 * var(--gutter));}
}
@media(prefers-reduced-motion:reduce){
  .client-track{animation:none;will-change:auto;}
  .client-viewport{overflow-x:auto;mask-image:none;-webkit-mask-image:none;}
}

.testi-track{display:flex;gap:20px;overflow-x:auto;scroll-snap-type:x mandatory;
  padding-bottom:6px;scrollbar-width:none;}
.testi-track::-webkit-scrollbar{display:none;}
.testi{flex:0 0 clamp(268px,30vw,344px);scroll-snap-align:start;background:var(--white);
  border:1px solid var(--line);border-radius:var(--radius-lg);padding:clamp(24px,2.8vw,30px);
  display:flex;flex-direction:column;gap:16px;}
.stars{display:flex;gap:4px;color:var(--accent);}
.stars .icon{width:16px;height:16px;fill:currentColor;stroke:none;}
.testimonials-page .stars .icon{fill:rgb(228 160 2);}
.testi p{font-size:.93rem;color:var(--ink-2);line-height:1.65;flex:1;}
.testi .who{display:flex;align-items:center;gap:12px;font-size:.89rem;font-weight:600;}
.testi .avatar{width:36px;height:36px;border-radius:10px;background:var(--t-gold);color:var(--ink);
  display:flex;align-items:center;justify-content:center;font-size:.76rem;font-weight:700;flex-shrink:0;}
.scroll-ctl{display:flex;gap:10px;justify-content:flex-end;margin-top:20px;}

/* ============================================================
   12. CTA / FOOTER
   ============================================================ */
.cta{background:var(--ink);color:#fff;border-radius:var(--radius-lg);
  padding:clamp(38px,5vw,70px) clamp(26px,5vw,68px);text-align:center;position:relative;overflow:hidden;}
.cta::after{content:"";position:absolute;inset:0;
  background:radial-gradient(64% 78% at 50% 118%, rgba(152,47,99,.32), transparent 66%);pointer-events:none;}
.cta > *{position:relative;z-index:1;}
.cta h2{color:#fff;max-width:20ch;margin-inline:auto;}
.cta p{color:rgba(255,255,255,.72);margin:18px auto 0;max-width:46ch;}
.cta .actions{display:flex;gap:12px;justify-content:center;flex-wrap:wrap;margin-top:30px;}

.follow{display:flex;align-items:center;gap:11px;margin-top:20px;}
.follow a{width:38px;height:38px;border-radius:10px;border:1.5px solid rgba(255,255,255,.22);
  display:flex;align-items:center;justify-content:center;transition:all .2s ease;}
.follow a:hover{border-color:var(--accent-soft);color:var(--accent-soft);}

footer{background:var(--ink);color:rgba(255,255,255,.72);padding-top:clamp(52px,5.5vw,78px);}
.foot-grid{--bs-gutter-x:clamp(26px,3.6vw,44px);--bs-gutter-y:clamp(26px,3.6vw,44px);
  padding-bottom:clamp(34px,4vw,50px);border-bottom:1px solid rgba(255,255,255,.14);}
footer .brand{justify-self:start;}
footer .brand img{height:60px;filter:brightness(0) invert(1);opacity:.94;}
footer h4{font-size:.79rem;font-weight:600;font-family:var(--ff-body);color:rgba(255,255,255,.55);
  letter-spacing:.09em;text-transform:uppercase;margin-bottom:16px;}
footer p.desc{color:rgba(255,255,255,.62);font-size:.88rem;margin-top:15px;max-width:34ch;line-height:1.65;}
footer ul li{margin-bottom:10px;}
footer a{text-decoration:none;color:rgba(255,255,255,.85);font-size:.9rem;transition:color .2s ease;}
footer a:hover{color:var(--accent-soft);}
.foot-contact li{display:flex;align-items:flex-start;gap:11px;font-size:.89rem;color:rgba(255,255,255,.85);}
.foot-contact .icon{width:15px;height:15px;margin-top:5px;}
.foot-bottom{display:flex;justify-content:space-between;align-items:center;gap:16px;
  padding-block:22px;font-size:.81rem;color:rgba(255,255,255,.55);flex-wrap:wrap;}
.foot-payment-cards{display:block;width:auto;max-width:min(100%,360px);max-height:46px;object-fit:contain;}

/* ============================================================
   13. UTIL
   ============================================================ */
.reveal{opacity:0;transform:translateY(16px);transition:opacity .7s ease,transform .7s ease;}
.reveal.is-visible{opacity:1;transform:none;}
.skip-link{position:absolute;left:-999px;top:0;background:var(--accent);color:var(--ink);
  padding:10px 16px;border-radius:8px;z-index:100;}
.skip-link:focus{left:16px;top:16px;}
.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;}

/* Packhelp-inspired header: identity, search and contact above the navigation. */
.header-top{max-width:none;display:grid;grid-template-columns:minmax(180px,1fr) minmax(280px,520px) minmax(240px,1fr);align-items:center;gap:24px;min-height:76px;padding-block:10px;}
.header-identity{display:flex;align-items:center;gap:14px;min-width:0;}
.header-top .brand{justify-self:auto;}
.header-top .brand img{height:52px;max-width:250px;object-fit:contain;object-position:left center;}
.header-search{height:44px;display:flex;align-items:center;gap:10px;padding:0 8px 0 17px;background:#f3f4f6;border:1px solid transparent;border-radius:10px;transition:border-color .2s ease,background-color .2s ease;}
.header-search:focus-within{background:#fff;border-color:var(--ink-3);}
.header-search>.icon{width:17px;height:17px;color:var(--ink-2);}
.header-search input{flex:1;width:0;border:0;outline:0;background:transparent;color:var(--ink);font:inherit;font-size:.83rem;}
.header-search input::placeholder{color:#777f8b;opacity:1;}
.header-search input::-webkit-search-cancel-button{cursor:pointer;}
.header-search button{display:grid;place-items:center;width:30px;height:30px;border:0;border-radius:7px;background:transparent;cursor:pointer;}
.header-search button:hover{background:#e4e7eb;}
.header-search button .icon{width:16px;height:16px;}
.header-contact{display:flex;justify-self:end;align-items:center;justify-content:flex-end;gap:clamp(12px,1.4vw,24px);flex-wrap:wrap;}
.header-contact a{display:inline-flex;align-items:center;gap:6px;text-decoration:none;font-size:.76rem;font-weight:500;white-space:nowrap;line-height:1.2;}
.header-contact a:hover{color:var(--accent-deep);}
.header-contact .icon{width:15px;height:15px;}
.nav{display:flex;justify-content:space-between;gap:20px;min-height:52px;padding-block:5px;border-top:1px solid var(--line);}
.nav-left,.nav-right{justify-self:auto;}
.nav nav.primary{gap:clamp(2px,.7vw,14px);}
.nav nav.primary>a,.nav .has-mega>.nav-link,.nav .has-drop>.nav-link{padding:7px 10px;font-size:.82rem;}
.nav-cta{font-size:.79rem;padding:.7em 1.15em;}
@media(max-width:1180px){
  .header-top{grid-template-columns:auto minmax(220px,1fr) auto;}
  .header-contact a span{display:none;}
  .header-contact a{width:36px;height:36px;justify-content:center;border:1px solid var(--line);border-radius:7px;}
  .nav{display:none;}
}
@media(max-width:620px){
  .header-top{grid-template-columns:1fr auto;gap:10px 14px;padding-block:12px;}
  .header-top .brand img{height:36px;max-width:155px;}
  .header-search{grid-column:1/-1;grid-row:2;height:42px;}
  .header-contact{grid-column:2;grid-row:1;gap:6px;}
  .header-contact a{width:32px;height:32px;}
  .header-contact .icon{width:14px;height:14px;}
}

/* The supplied wide artwork leaves clear space in the centre for the slider copy. */
.hero{display:grid;align-content:center;min-height:clamp(540px,43vw,690px);padding-block:clamp(38px,4vw,58px) clamp(48px,5vw,80px);text-align:center;background:#f8f2e3 url('../images/hero/hero_bg.webp') center center / cover no-repeat;}
.hero .wrap{max-width:var(--maxw);}
.hero-content{display:flex;align-items:center;justify-content:center;min-height:420px;}
.hero-copy{max-width:690px;}
.hero-slide{display:flex;flex-direction:column;justify-content:center;min-height:var(--hero-slide-h,270px);opacity:1;transform:translateY(0);transition:opacity .55s ease,transform .55s ease;}
.hero-slide.is-fading{opacity:0;transform:translateY(8px);}
.hero h1{min-height:0;max-width:18ch;margin-inline:auto;}
.hero-sub{margin:20px auto 0;min-height:0;}
.hero-actions{justify-content:center;}
@media(max-width:800px){
  .hero{min-height:430px;padding-block:32px 40px;background-position:center;background-image:url('../images/hero/hero_bg-mobile.webp');}
  .hero-content{min-height:0;}
  .hero-actions{margin-top:26px;}
  .hero-note{margin-top:18px;}
}
@media(max-width:620px){
  .hero{min-height:400px;padding-block:28px 34px;background-position:center;}
  .hero-slide{min-height:var(--hero-slide-h,200px);}
  .hero h1{max-width:none;}
  .hero-sub{margin-top:14px;font-size:.95rem;line-height:1.5;}
  .hero-actions{gap:10px;margin-top:22px;}
}
@media(max-width:430px){
  .hero-actions{flex-direction:column;align-items:stretch;}
  .hero-actions .btn{width:100%;}
}
@media(max-width:360px){
  .hero{min-height:340px;padding-block:24px 30px;}
  .hero-sub{font-size:.88rem;}
  .hero-note{font-size:.79rem;}
}

/* Two identical groups meet exactly at the loop boundary, so no reset is visible. */
.promise-marquee{position:relative;overflow:hidden;background:#eaf2ff;color:var(--ink);height:82px;clip-path:polygon(0 16%,100% 0,100% 84%,0 100%);}
.promise-track{display:flex;width:max-content;height:100%;align-items:center;animation:promise-flow 35s linear infinite;will-change:transform;}
.promise-group{display:flex;align-items:center;flex:none;}
.promise-group span{display:inline-flex;align-items:center;gap:12px;flex:none;padding:0 clamp(28px,3vw,54px);white-space:nowrap;font-size:.9rem;font-weight:600;}
.promise-group .icon{width:19px;height:19px;stroke-width:1.8;}
@keyframes promise-flow{to{transform:translate3d(-50%,0,0);}}
@media(prefers-reduced-motion:reduce){.promise-track{animation:none;}}
@media(max-width:620px){.promise-marquee{height:70px;margin-bottom:48px;}.promise-group span{font-size:.82rem;padding:0 26px;}}

/* The original copy sits in a focused editorial introduction and accordion. */
.story-section{padding-block:clamp(44px,6vw,96px);}
.shipping-note{display:flex;align-items:center;justify-content:center;gap:10px;padding:12px 20px; color:var(--ink);font-size:.82rem;font-weight:600;text-align:center;}
.shipping-note .icon{width:19px;height:19px;}
.story-layout{--bs-gutter-x:clamp(40px,5vw,86px);--bs-gutter-y:34px;align-items:start;}
.story-intro{position:sticky;top:175px;max-width:540px;}
.story-intro .label{margin-bottom:20px;}
.story-intro h2{font-size:clamp(2rem,2.7vw,2.8rem);line-height:1.08;max-width:14ch;}
.story-intro p{margin-top:24px;max-width:47ch;font-size:clamp(1rem,1.35vw,1.12rem);line-height:1.62;color:var(--ink-2);}
.story-intro .btn{margin-top:27px;}
.story-intro .story-signoff{margin-top:28px;font-size:.78rem;font-weight:600;color:var(--ink-3);}
.story-accordion{display:grid;gap:10px;min-width:0;}
.story-item{background:#fff;border:1px solid #f5f5f5;border-radius:10px;overflow:hidden;transition:border-color .2s ease,box-shadow .2s ease;}
.story-item[open]{box-shadow:0 8px 26px rgba(1,31,58,.035);}
.story-item summary{list-style:none;display:flex;align-items:center;justify-content:space-between;gap:18px;cursor:pointer;padding:20px 24px;font-family:var(--ff-display);font-size:1rem;font-weight:600;line-height:1.35;color:var(--ink);}
.story-item summary::-webkit-details-marker{display:none;}
.story-item summary .icon{width:15px;height:15px;flex:none;color:var(--ink-2);transition:transform .22s ease;}
.story-item[open]:not(.is-closing) summary .icon{transform:rotate(180deg);}
.story-item summary:hover{color:var(--accent-deep);}
.story-answer{padding:0 24px 22px;}
.story-answer p{font-size:.94rem;line-height:1.72;color:var(--ink-2);margin:0 0 14px;}
.story-answer p:last-child{margin-bottom:0;}
.story-answer h3{font-size:.98rem;font-weight:600;margin:8px 0 13px;}
.benefits-section{background:var(--paper);}
.benefits-layout{display:flex;align-items:flex-end;justify-content:space-between;gap:32px;margin-bottom:clamp(34px,4vw,52px);}
.benefits-intro{max-width:760px;}
.benefits-intro h2{font-size:clamp(2rem,2.7vw,2.8rem);font-weight:600;line-height:1.08;letter-spacing:-.035em;}
.benefits-intro p{max-width:65ch;margin-top:20px;color:var(--ink-2);font-size:1rem;line-height:1.7;}
.benefits-cta{flex:none;}
.benefit-list{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1px;overflow:hidden;border:1px solid var(--line);border-radius:var(--radius-lg);background:var(--line);}
.benefit-item{display:flex;flex-direction:column;align-items:flex-start;gap:18px;min-width:0;min-height:215px;padding:clamp(24px,2.6vw,34px);background:#fff;}
.benefit-icon{display:grid;place-items:center;flex:none;width:46px;height:46px;border-radius:10px;background:#dcf9bf;color:var(--ink);}
.benefit-item:nth-child(2) .benefit-icon{background:#ffe7a8;}
.benefit-item:nth-child(3) .benefit-icon{background:#d5e5f4;}
.benefit-item:nth-child(4) .benefit-icon{background:#f8e2a1;}
.benefit-item:nth-child(5) .benefit-icon{background:#bfe5d9;}
.benefit-item:nth-child(6) .benefit-icon{background:#f2dfb0;}
.benefit-icon .icon,.benefit-icon img{width:21px;height:21px;}
/* uploaded icons (Admin > home features) sit in the same box as the sprite icons */
.benefit-icon img{object-fit:contain;}
.benefit-number{font-size:.8rem;font-weight:600;}
.benefit-item h3{font-family:var(--ff-body);font-size:1rem;font-weight:600;line-height:1.35;letter-spacing:-.015em;}
.benefit-item p{margin-top:6px;color:var(--ink-2);font-size:.91rem;line-height:1.6;}
.shipping-banner{display:flex;align-items:center;justify-content:space-between;gap:24px;margin-top:clamp(36px,4vw,56px);padding:27px 34px; border-radius:10px; background-color:#252525 ;}
.shipping-message{display:flex;align-items:center;gap:22px;}
.shipping-seal{display:block;flex:none;width:66px;height:67px;object-fit:contain;}
.shipping-message strong{font-family:var(--ff-display);font-size:clamp(1.1rem,1.5vw,1.35rem);font-weight:600;line-height:1.55;color:#fff;}
.shipping-message strong span{font-weight:500;}
.shipping-assurances{display:flex;align-items:center;gap:10px;flex-wrap:wrap;justify-content:flex-end; }
.shipping-assurances img{display:block;width:auto;height:46px;max-width:145px;object-fit:contain;}
#products .head-row .section-head{max-width:780px;}
#products .head-row .section-head p{max-width:72ch;}
#products .head-row{align-items:flex-end;}
.product-view-all{font-size:.82rem;padding:.65em 1.25em;}
/* product sliders stay inside the container: --rail-full whole cards plus a
   --rail-peek slice of the next one, and the arrows sit centred on that slice */
.product-rail-shell{--rail-full:4;--rail-peek:.4;--rail-gap:16px;position:relative;container-type:inline-size;
  --rail-card:calc((100cqw - (var(--rail-full) + var(--rail-peek) - 1) * var(--rail-gap)) / (var(--rail-full) + var(--rail-peek)));
  --rail-slice:calc(100cqw - var(--rail-full) * (var(--rail-card) + var(--rail-gap)));}
.product-rail-shell .card-rail{gap:var(--rail-gap);padding:6px 0 10px;scroll-padding-left:0;}
.product-rail-shell .card-rail .pcard{flex:0 0 var(--rail-card);scroll-margin-inline:0;}
.product-rail-controls{position:absolute;z-index:3;margin:0;pointer-events:none;
  right:calc(var(--rail-slice) / 2);top:calc(6px + var(--rail-card) / 2);transform:translate(50%,-50%);}
@media (max-width:1100px){.product-rail-shell{--rail-full:3;}}
@media (max-width:760px){.product-rail-shell{--rail-full:2;--rail-peek:.45;}}
@media (max-width:500px){
  .product-rail-shell{--rail-full:1;--rail-peek:.3;--rail-gap:14px;}
  /* mobile swipes the rail, so the arrows are hidden */
  .product-rail-controls{display:none;}
}
.product-rail-controls .icon-btn{width:42px;height:42px;background:#fff;border:1px solid var(--line);box-shadow:0 4px 20px rgba(1,31,58,.13);pointer-events:auto;}
.product-rail-controls .icon-btn:hover{background:var(--ink);border-color:var(--ink);color:#fff;}
.card-rail .pcard p{font-size:.84rem;line-height:1.56;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;line-clamp:2;max-height:3.12em;overflow:hidden;text-overflow:ellipsis;flex:none;}
.recommend-section{background:#fff;}
.recommend-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px;}
.recommend-card{position:relative;display:flex;flex-direction:column;gap:15px;padding:12px 12px 18px;border:1px solid var(--line);border-radius:10px;text-decoration:none;background:#fff;transition:box-shadow .2s ease,transform .2s ease;}
.recommend-card:hover{box-shadow:0 12px 34px rgba(1,31,58,.1);transform:translateY(-3px);}
.recommend-art{display:grid;place-items:center;aspect-ratio:1.4;background:#f5f6f7;border-radius:10px;overflow:hidden;}
.recommend-art img{width:100%;height:100%;object-fit:cover;}
.recommend-card strong{padding-inline:5px 30px;font-family:var(--ff-display);font-size:1rem;font-weight:600;line-height:1.25;}
.recommend-arrow{position:absolute;right:17px;bottom:15px;font-size:1.25rem;color:var(--accent-deep);}
.why-section{background:#fff;}
.why-layout{--bs-gutter-x:clamp(40px,5vw,86px);--bs-gutter-y:34px;align-items:start;}
.why-intro h2{max-width:14ch;}
.video-review-block{margin-bottom:42px;}
.video-review-block h3,.feedback-heading{margin-bottom:19px;}
.video-frame{aspect-ratio:16/9;border-radius:10px;overflow:hidden;background:#d8dee6;}
.video-frame iframe{display:block;width:100%;height:100%;border:0;}

/* --- video review carousel: 1 slide at a time, dot navigation --- */
.video-carousel{position:relative;overflow:hidden;border-radius:10px;}
.video-carousel-track{display:flex;width:100%;transition:transform .45s cubic-bezier(.22,.61,.36,1);}
.video-carousel-slide{flex:0 0 100%;width:100%;min-width:0;}
.video-carousel-dots{display:flex;gap:9px;margin-top:16px; margin-bottom: 10px;margin-left: 12px;}
.video-dot{width:9px;height:9px;padding:0;border:0;border-radius:10px;background:rgba(255,255,255,.32);
  cursor:pointer;transition:background .2s ease,transform .2s ease;}
.video-dot:hover{background:rgba(255,255,255,.55);}
.video-dot.is-active{background:var(--accent-soft);transform:scale(1.3);}
.testi{min-height:290px;}
.testi .avatar{object-fit:cover;}
.footer-newsletter{display:flex;align-items:center;justify-content:space-between;gap:30px;padding-bottom:42px;margin-bottom:42px;border-bottom:1px solid rgba(255,255,255,.14);}
.footer-kicker{display:block;text-transform:uppercase;letter-spacing:.12em;color:var(--accent-soft);font-size:.69rem;font-weight:700;margin-bottom:7px;}
footer .footer-newsletter h3{color:#fff;font-size:clamp(1.7rem,2.3vw,2.4rem);}
.newsletter-form{display:flex;align-items:center;gap:10px;width:min(100%,460px);padding:6px 7px 6px 19px;border-radius:10px;background:#fff;}
.newsletter-form input{flex:1;min-width:0;border:0;outline:0;background:transparent;color:var(--ink);font:inherit;font-size:.9rem;}
.newsletter-form button{display:grid;place-items:center;flex:none;width:40px;height:40px;border:0;border-radius:10px;background:var(--accent);color:#fff;cursor:pointer;}
.newsletter-form button:hover{background:var(--accent);color:#fff;}
/* validation / thank-you line sits under the pill instead of squeezing into its row */
.newsletter-form{position:relative;}
.newsletter-msg{position:absolute;top:100%;left:0;margin-top:8px;font-size:.82rem;font-weight:500;line-height:1.4;}
.newsletter-msg.is-success{color:#6ee7a8;}
.newsletter-msg.is-error{color:#ff9b9b;}
.follow-title{margin-top:22px;margin-bottom:0;}
footer .follow{margin-top:10px;}
footer .follow .bi{font-size:16px;line-height:1;}
footer .follow a{background:#fff;border-color:transparent;}
footer .follow a[data-network="facebook"]{color:#1877f2;}
footer .follow a[data-network="twitter"]{color:#000;}
footer .follow a[data-network="linkedin"]{color:#0a66c2;}
footer .follow a[data-network="pinterest"]{color:#e60023;}
footer .follow a:hover{background:#eef3fb;border-color:transparent;}
@media(max-width:1000px){.recommend-grid{grid-template-columns:repeat(3,minmax(0,1fr));}}
@media(max-width:760px){
  .story-intro{position:static;max-width:none;}
  .story-intro h2{max-width:19ch;}
  .benefits-layout{align-items:flex-start;flex-direction:column;}
  .benefit-list{grid-template-columns:repeat(2,minmax(0,1fr));}
  .shipping-banner{align-items:flex-start;flex-direction:column;}
  .recommend-grid{grid-template-columns:repeat(2,minmax(0,1fr));}
  .footer-newsletter{align-items:stretch;flex-direction:column;}
}
@media(max-width:500px){
  #products .head-row{align-items:flex-start;}
  .product-view-all{font-size:.78rem;}
  .story-item summary{padding:18px 19px;font-size:.94rem;}
  .story-answer{padding:0 19px 19px;}
  /* stays 2 up on phones; the card is trimmed to fit the narrower column */
  .benefit-item{min-height:0;gap:12px;padding:16px 14px;}
  .benefit-icon{width:38px;height:38px;border-radius:10px;}
  .benefit-icon .icon,.benefit-icon img{width:18px;height:18px;}
  .benefit-item h3{font-size:.875rem;line-height:1.3;}
  .benefit-item p{margin-top:5px;font-size:.8rem;line-height:1.5;}
  .shipping-banner{padding:22px 20px;}
  .shipping-assurances{justify-content:flex-start;}
  .recommend-grid{gap:10px;}
  .recommend-card{padding:8px 8px 13px;}
  .recommend-card strong{font-size:.86rem;padding-right:20px;}
  .recommend-arrow{right:10px;bottom:9px;}
}

/* Testimonials: one large review at a time on the dark panel. */
.testimonials-section{background:#fff;padding:18px 12px clamp(72px,7vw,110px);}
.testimonial-shell{border-radius:10px;overflow:hidden;background:radial-gradient(90% 80% at 55% 10%,#252525 0%,#171717 56%,#121212 100%);padding-block:clamp(62px,7vw,112px) clamp(52px,6vw,88px);color:#fff;}
.testimonial-shell .section-head.center{max-width:760px;text-align:left;margin:0 auto clamp(54px,6vw,90px);}
.testimonial-shell .section-head .label{color:#fff;background:#414141;margin-bottom:22px;}
.testimonial-shell .section-head h2{color:#fff;font-size:clamp(2.4rem,4vw,4.25rem);line-height:1.04;max-width:17ch;}
.testimonial-cta{margin-top:32px;}
.testimonial-shell .feedback-heading,.testimonial-shell .video-review-block h3{color:#fff;}
#testimonials .feedback-heading{margin:0 auto 22px;}
/* g-5 is a 48px gutter: its -24px row margins outgrew the 20px page gutter on phones */
@media(max-width:620px){#testimonials .row.g-5{--bs-gutter-x:1.5rem;--bs-gutter-y:2rem;}}
#testimonials .testi-track{margin-inline:auto;gap:0;padding-bottom:8px;}
#testimonials .testi{flex:0 0 100%;min-width:0;min-height:370px;padding:0;border:0;border-radius:0;background:transparent;color:#fff;gap:24px;}
#testimonials .testi p{max-width:38ch;font-family:var(--ff-display);font-size:clamp(1.65rem,2.6vw,2.25rem);font-weight:600;line-height:1.2;letter-spacing:-.025em;color:#fff;}
#testimonials .testi .stars{color:var(--accent-soft);}
#testimonials .testi .who{font-size:.94rem;color:#fff;}
#testimonials .testi .avatar{width:46px;height:46px;border:2px solid rgba(255,255,255,.7);object-fit:cover;}
#testimonials .scroll-ctl{max-width:900px;margin:20px auto 0;}
#testimonials .scroll-ctl .icon-btn{width:44px;height:44px;color:#fff;background:#282828;border:1px solid #555;}
#testimonials .scroll-ctl .icon-btn:hover{background:#fff;color:#161616;border-color:#fff;}
#testimonials .video-review-block{padding:0;border:0;}
#testimonials .video-frame{aspect-ratio:16/9;min-width:0;border-radius:10px;overflow:hidden;}
#testimonials .video-frame{background:#252525;border:0;}
#testimonials .video-preview{position:relative;display:block;width:100%;height:100%;padding:0;border:0;background:#252525;color:#fff;text-align:left;cursor:pointer;}
#testimonials .video-preview img{display:block;width:100%;height:100%;object-fit:cover;}
#testimonials .video-shade{position:absolute;inset:0;background:linear-gradient(180deg,rgba(0,0,0,.5),transparent 42%,rgba(0,0,0,.43));}
#testimonials .video-caption{position:absolute;top:34px;left:34px;right:30px;font-family:var(--ff-display);font-size:clamp(1.1rem,1.45vw,1.45rem);font-weight:600;line-height:1.25;}
#testimonials .video-play{position:absolute;left:34px;bottom:30px;display:grid;place-items:center;width:58px;height:58px;padding-left:3px;border-radius:10px;background:#fff;color:#151515;font-size:1.2rem;box-shadow:0 4px 20px rgba(0,0,0,.22);}
#testimonials .video-preview:hover .video-play{transform:scale(1.07);}
@media(max-width:680px){
  .testimonials-section{padding-inline:8px;}
  .testimonial-shell{border-radius:10px;}
  .testimonial-shell .section-head.center{margin-bottom:44px;}
  #testimonials .testi{min-height:390px;}
  #testimonials .testi p{font-size:clamp(1.5rem,6vw,2rem);}
  #testimonials .video-frame{aspect-ratio:16/9;}
}

/* The quote call to action sits openly below the testimonial panel. */
#quote{background:#fff;}
#quote .cta{max-width:1040px;margin-inline:auto;padding:0;border-radius:0;background:transparent;color:var(--ink);text-align:center;overflow:visible;}
#quote .cta::after{display:none;}
#quote .cta h2{max-width:23ch;margin-inline:auto;color:var(--ink);font-size:clamp(2.7rem,5.4vw,5rem);font-weight:600;line-height:1.04;letter-spacing:-.045em;}
#quote .cta p{margin:24px auto 0;color:var(--ink-2);font-size:clamp(1rem,1.35vw,1.18rem);line-height:1.5;}
#quote .cta .actions{justify-content:center;margin-top:38px;}
#quote .cta .btn{font-size:.95rem;padding:.95em 1.8em;}
@media(max-width:680px){
  #quote .cta h2{font-size:clamp(2.35rem,10vw,3.3rem);}
  #quote .cta .actions{gap:10px;}
  #quote .cta .btn{font-size:.84rem;}
  .foot-bottom{align-items:flex-start;flex-direction:column;}
}

/* Request Custom Quote form + guarantee card (replaces the CTA on category pages) */
#quote.quote-cta{background:#fff;scroll-margin-top:135px;}
.quote-cta-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(280px,340px);gap:clamp(22px,2.6vw,32px);align-items:stretch;margin-inline:auto;}
.quote-cta-form.quote-card{max-width:none;margin:0;}
.quote-cta-form .section-head{max-width:none;margin-bottom:0;}
.quote-cta-form .field-grid{margin-top:28px;}
.quote-cta-trust{position:relative;overflow:hidden;background:var(--ink);color:#fff;border-radius:var(--radius-lg);
  padding:clamp(28px,3vw,40px) clamp(22px,2.4vw,30px);text-align:center;
  display:flex;flex-direction:column;align-items:center;justify-content:center;}
.quote-cta-trust::after{content:"";position:absolute;inset:0;pointer-events:none;
  background:radial-gradient(80% 60% at 50% 118%, rgba(152,47,99,.4), transparent 70%);}
.quote-cta-trust > *{position:relative;z-index:1;}
.quote-cta-trust h3{color:#fff;}
.quote-cta-trust p{margin:10px 0 0;color:rgba(255,255,255,.72);font-size:.95rem;}
.quote-cta-badge{width:140px;height:auto;margin:26px auto;}
.quote-cta-cards{width:100%;max-width:280px;}
.quote-cta-cards img{width:100%;height:auto;}
.quote-cta-call{margin-top:18px;font-size:.9rem;font-weight:600;color:#fff;text-decoration:none;opacity:.85;}
.quote-cta-call:hover{opacity:1;text-decoration:underline;}
@media(max-width:991px){
  .quote-cta-grid{grid-template-columns:minmax(0,1fr);}
}



.gallery_section {/* background: #eaf2ff; */ padding-bottom: 0;}

.gallery_section .heading p {    color: var(--ink-2);  font-size: clamp(1rem, 1.35vw, 1.18rem);  line-height: 1.5;}

.gal-tabs-wrap { display: flex; justify-content: center; margin-bottom: 2.5rem; }
.gal-tabs{display:inline-flex;gap:.3rem;padding:.35rem;background:#fff;border:1px solid var(--line);
  border-radius:10px;box-shadow:0 10px 28px -16px rgba(20,20,28,.25); margin-top: 20px;}
.gal-tab{border:0;background:transparent;padding:.7rem 1.7rem;border-radius:10px;font-weight:600;font-size:.9rem;color:var(--ink-2);cursor:pointer;transition:background-color .2s ease,color .2s ease; }
.gal-tab:hover:not(.active){color:var(--accent-deep)}
.gal-tab.active{background:var(--accent);color:#fff;box-shadow:0 8px 18px -8px rgba(102,0,51,.5);}
.finish-grid{columns:3;column-gap:1.5rem}
.finish-tile{position:relative;overflow:hidden;break-inside:avoid;margin-bottom:1.5rem;border-radius:var(--radius);display:flex;flex-direction:column;justify-content:flex-end;padding:1.75rem;color:#fff;box-shadow:var(--pcb-shadow);transition:transform .3s ease,box-shadow .3s ease}
.finish-tile:hover{transform:translateY(-4px);box-shadow:var(--pcb-shadow-lg)}
.finish-tile::after{content:"";position:absolute;inset:0;background:radial-gradient(circle at 88% 12%,#ffffff4d,transparent 45%);pointer-events:none}
.finish-tile h3{position:relative;z-index:2;color:inherit;font-size:1.12rem;margin:0;letter-spacing:-.01em}
.finish-ico{position:absolute;z-index:2;top:1.5rem;left:1.5rem;width:46px;height:46px;border-radius:10px;display:grid;place-items:center;font-size:1.2rem;background:#ffffff24;color:var(--pcb-gold);backdrop-filter:blur(3px)}

/* real photography: cover fill + a bottom scrim for the label, no sheen */
.ft-photo { background-size: cover; background-position: center; }
.ft-photo::after { content: none; }
.ft-photo::before {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg, rgba(10, 8, 9, 0) 38%, rgba(10, 8, 9, .78) 100%);
}
.ft-photo .finish-ico { background: rgba(10, 8, 9, .38); color: #fff; }

.ft-tall  { min-height: 420px; }
.ft-tall2 { min-height: 380px; }
.ft-med   { min-height: 300px; }
.ft-med2  { min-height: 320px; }
.ft-med3  { min-height: 340px; }
.ft-short { min-height: 260px; }

.ft-holo   { background: linear-gradient(135deg, var(--accent) 0%, var(--pcb-gold) 65%, var(--accent-700) 100%); }
.ft-gold   { background: linear-gradient(160deg, var(--pcb-ink), var(--accent) 75%); }
.ft-silver { background: linear-gradient(160deg, #eef0f3, #bcc1cb); color: var(--accent); }
.ft-uv     { background: linear-gradient(160deg, #14181f, var(--accent)); }
.ft-kraft  { background: linear-gradient(160deg, var(--pcb-gold-soft), #f0e2c0); color: var(--accent); }
.ft-paper  { background: linear-gradient(160deg, #fff, var(--pcb-cream)); color: var(--accent); border: 1px solid var(--pcb-line); }
.ft-silver .finish-ico,
.ft-kraft .finish-ico,
.ft-paper .finish-ico { background: rgba(16, 25, 53, .07); color: var(--pcb-gold-dark); }

/* --- materials / finishes: masonry on desktop, swipe slider on phones --- */
.fg-nav{display:none;}
@media (max-width: 767.98px) {
  /* columns -> a single snapping row; the ft-* heights stop applying */
  .finish-grid{columns:auto;display:flex;gap:12px;overflow-x:auto;
    scroll-snap-type:x mandatory;scroll-behavior:smooth;-webkit-overflow-scrolling:touch;
    scrollbar-width:none;-ms-overflow-style:none;}
  .finish-grid::-webkit-scrollbar{display:none;}
  .finish-tile{flex:0 0 82%;margin-bottom:0;padding:1.3rem;scroll-snap-align:center;}
  /* one height for every tile, so the row never staircases */
  .finish-tile.ft-tall,.finish-tile.ft-tall2,.finish-tile.ft-med,
  .finish-tile.ft-med2,.finish-tile.ft-med3,.finish-tile.ft-short{min-height:300px;}
  .finish-tile h3{font-size:1.02rem;}
  .finish-tile:hover{transform:none;}

  .fg-nav{display:flex;align-items:center;justify-content:center;gap:14px;margin-top:16px;}
  .fg-arrow{display:grid;place-items:center;width:38px;height:38px;flex:none;padding:0;
    border:1.5px solid var(--line-2);border-radius:7px;background:#fff;color:var(--ink);
    cursor:pointer;transition:opacity .2s ease,border-color .2s ease,background-color .2s ease;}
  .fg-arrow:hover:not(:disabled){border-color:var(--accent);color:var(--accent);}
  .fg-arrow:disabled{opacity:.3;cursor:default;}
  .fg-arrow .icon{width:17px;height:17px;}
  .fg-dots{display:flex;align-items:center;gap:7px;}
  .fg-dot{width:8px;height:8px;padding:0;flex:none;border:0;border-radius:10px;
    background:var(--line-2);cursor:pointer;transition:width .25s ease,background-color .25s ease;}
  .fg-dot.is-active{width:22px;background:var(--accent);}
}
@media (max-width: 480px){
  .finish-tile{flex:0 0 86%;}
}
/* ============================================================
   13. CATEGORY / ARCHIVE PAGES
   ============================================================ */
.breadcrumb{display:flex;flex-wrap:wrap;align-items:center;gap:8px;font-size:.85rem;color:var(--ink-3);}
.breadcrumb a{color:var(--ink-2);text-decoration:none;}
.breadcrumb a:hover{color:var(--ink);text-decoration:underline;}
.breadcrumb .current{color:var(--ink);font-weight:600;}

.page-hero{background:var(--grey);text-align:left;
  padding-block:clamp(40px,5vw,60px) clamp(34px,4vw,50px);}
.page-hero .wrap{max-width:820px;}
.page-hero .breadcrumb{margin-bottom:20px;}
.page-hero p{margin-top:16px;color:var(--ink-2);}

/* --- page hero variant with a media panel beside the heading --- */
.page-hero-split .container{display:grid;grid-template-columns:1.05fr .95fr;
  gap:clamp(28px,4vw,54px);align-items:center;max-width:1180px;}
.page-hero-split .hero-media{border-radius:var(--radius-lg);overflow:hidden;
  aspect-ratio:5/4;box-shadow:0 30px 60px -30px rgba(20,20,28,.35);}
.page-hero-split .hero-media img{width:100%;height:100%;object-fit:cover;display:block;}
@media (max-width:900px){
  .page-hero-split .container{grid-template-columns:1fr;}
  .page-hero-split .hero-media{order:-1;aspect-ratio:16/9;}
}

/* --- article with sticky media panel beside the text --- */
.about-layout{display:grid;grid-template-columns:.82fr 1.18fr;gap:clamp(30px,4vw,64px);align-items:start;}
.about-media{position:sticky;top:145px;border-radius:var(--radius-lg);overflow:hidden;
  box-shadow:0 30px 60px -30px rgba(20,20,28,.32);}
.about-media img{width:100%;display:block;aspect-ratio:3/4;object-fit:cover;}
.about-layout .content-article{max-width:none;}
@media (max-width:900px){
  .about-layout{grid-template-columns:1fr;}
  .about-media{position:static;}
  .about-media img{aspect-ratio:16/9;}
}

/* --- full-width brand image break between sections --- */
.image-break{border-radius:var(--radius-lg);overflow:hidden;}
.image-break img{width:100%;aspect-ratio:2/1;object-fit:cover;display:block;}
@media (max-width:620px){.image-break img{aspect-ratio:4/3;}}

.style-filters{display:flex;flex-wrap:wrap;gap:10px;margin-top:28px;}
.style-filters a{padding:9px 18px;border-radius:10px;border:1.5px solid var(--line-2);
  background:var(--white);font-size:.87rem;font-weight:500;color:var(--ink-2);
  text-decoration:none;transition:border-color .2s ease,color .2s ease,background .2s ease;}
.style-filters a:hover{border-color:var(--accent-deep);color:var(--accent-deep);background:var(--accent-wash);}

.product-grid{display:grid;
  grid-template-columns:repeat(auto-fill,minmax(clamp(200px,22vw,258px),1fr));
  gap:clamp(20px,2.2vw,30px);}
.product-grid .pcard .tile{aspect-ratio:1/1;}
@media (max-width:560px){
  .product-grid{grid-template-columns:repeat(2,1fr);gap:16px;}
}

/* modern elevated card treatment, scoped so the homepage rail is untouched */
#style-grid .pcard{background:#fff;border:1px solid var(--line);border-radius:var(--radius-lg);
  padding:14px 14px 20px;transition:transform .25s ease,box-shadow .25s ease,border-color .25s ease;}
#style-grid .pcard .tile{border-radius:calc(var(--radius) - 4px);}
#style-grid .pcard h3,#style-grid .pcard p,#style-grid .pcard .go{padding-inline:2px;}
#style-grid .pcard:hover{transform:translateY(-5px);border-color:var(--line-2);
  box-shadow:0 18px 38px rgba(1,31,58,.09);}

.archive-toolbar{display:flex;align-items:center;justify-content:space-between;gap:16px;
  flex-wrap:wrap;margin:-8px 0 26px;}
.archive-count{font-size:.87rem;color:var(--ink-3);}

.pagination{display:flex;align-items:center;justify-content:center;gap:8px;
  margin-top:clamp(36px,4vw,52px);flex-wrap:wrap;}
.pagination button,.pagination a{min-width:40px;height:40px;padding:0 14px;border-radius:10px;
  border:1.5px solid var(--line-2);background:#fff;color:var(--ink-2);font-weight:600;
  font-family:var(--ff-body);font-size:.9rem;cursor:pointer;transition:all .2s ease;
  display:inline-flex;align-items:center;justify-content:center;text-decoration:none;}
.pagination button:hover:not(:disabled),.pagination a:hover{border-color:var(--ink);color:var(--ink);}
.pagination button.active,.pagination a.active,.pagination .active>a,.pagination .active>span{background:var(--ink);border-color:var(--ink);color:#fff;}
.pagination button:disabled,.pagination .disabled>span,.pagination a.disabled{opacity:.35;cursor:not-allowed;}
.pagination .pg-arrow{display:inline-flex;align-items:center;justify-content:center;gap:6px;}
.pagination .pg-arrow .icon{width:15px;height:15px;}
.pagination .pg-dots{border:none;background:none;cursor:default;color:var(--ink-3);width:auto;padding:0 4px;}

/* --- modern feature / spec / step grids used across the archive page --- */
.feature-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(226px,1fr));gap:18px;}
.feature-card{background:#fff;border:1px solid var(--line);border-radius:var(--radius);
  padding:clamp(22px,2.4vw,28px);transition:transform .22s ease,box-shadow .22s ease;}
.feature-card:hover{transform:translateY(-4px);box-shadow:0 16px 34px rgba(1,31,58,.07);}
.f-icon{display:grid;place-items:center;width:44px;height:44px;border-radius:10px;
  background:var(--accent-wash);color:var(--accent-deep);margin-bottom:16px;}
.f-icon .icon{width:20px;height:20px;}
.feature-card h3{font-size:1rem;font-weight:600;letter-spacing:-.01em;}
.feature-card p{margin-top:8px;font-size:.89rem;color:var(--ink-2);line-height:1.62;}
.feature-grid.tint-alt .feature-card:nth-child(4n+2) .f-icon{background:var(--t-mint);color:var(--ink);}
.feature-grid.tint-alt .feature-card:nth-child(4n+3) .f-icon{background:var(--t-sky);color:var(--ink);}
.feature-grid.tint-alt .feature-card:nth-child(4n+4) .f-icon{background:var(--t-peach);color:var(--ink);}

.steps-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:18px;}
.step-card{position:relative;padding:clamp(22px,2.4vw,26px) clamp(20px,2.2vw,22px);
  background:var(--grey);border-radius:var(--radius);}
.step-num{display:inline-flex;align-items:center;justify-content:center;width:34px;height:34px;
  border-radius:10px;background:var(--ink);color:#fff;font-family:var(--ff-display);
  font-weight:600;font-size:.92rem;margin-bottom:14px;}
.step-card h3{font-size:.96rem;font-weight:600;letter-spacing:-.01em;}
.step-card p{margin-top:6px;font-size:.87rem;color:var(--ink-2);line-height:1.58;}

.alt-bg{background:var(--grey);}


/* --- content_section_accordian: real collapsible accordion, compact type, no oversized headings --- */
.content-accordion{margin-inline:auto; margin-top: 25px;}
.content-accordion .story-item summary{font-size:.96rem;}
.content-accordion .story-answer{padding:0 24px 24px;}

.content-accordion .story-answer h3{font-size:.86rem;font-weight:700;color:var(--accent-deep);
  margin:16px 0 8px;}
.content-accordion .story-answer h3:first-child{margin-top:0;}

.content-accordion .story-answer p{font-size:.82rem;line-height:1.65;color:var(--ink-2);margin:0 0 12px;}
.content-accordion .story-answer p:last-child{margin-bottom:0;}

.content-accordion .story-answer ul{margin:4px 0 12px;padding-left:20px;}
.content-accordion .story-answer li{font-size:.82rem;line-height:1.6;color:var(--ink-2);}
.content-accordion .story-answer li+li{margin-top:5px;}
.content-accordion .story-answer li::marker{color:var(--accent);}
.content-accordion .story-answer li strong{color:var(--ink);}

@media (max-width:640px){
  .content-accordion .story-item summary{padding:16px 18px;font-size:.9rem;}
  .content-accordion .story-answer{padding:0 18px 18px;}
}

/* --- long-form article body: same content_section, fuller copy --- */
.content-article{margin-inline:auto;}
.content-article h2{font-size:clamp(1.35rem,1.1rem + 1.1vw,1.7rem);margin:0 0 14px;}
.content-article > h2{margin-top:52px;}
.content-article > h2:first-child{margin-top:0;}
.content-article h3{font-size:1.05rem;font-weight:600;margin:28px 0 10px;}
.content-article > p{color:var(--ink-2);font-size:.95rem;line-height:1.78;}
.content-article > p:first-child{margin-top:0;}
.content-article p a,.content-article li a{color:var(--accent-deep);text-decoration:underline;
  text-underline-offset:2px;font-weight:600;transition:color .18s ease;}
.content-article p a:hover,.content-article li a:hover{color:var(--accent);}

.content-list{margin-top:14px;display:grid;gap:9px;}
.content-list li{position:relative;padding-left:22px;color:var(--ink-2);
  font-size:.95rem;line-height:1.65;}
.content-list li::before{content:"";position:absolute;left:2px;top:.6em;
  width:6px;height:6px;border-radius:10px;background:var(--accent);}
.content-list li strong{color:var(--ink);}

.spec-callout{background:var(--grey);border-left:4px solid var(--accent);
  border-radius:0 var(--radius) var(--radius) 0;padding:clamp(22px,3vw,32px);margin-bottom:28px;}
.spec-callout h3{margin:0 0 12px;font-size:1.1rem;}
.spec-callout > p{margin-top:0;}
.spec-callout .content-list{margin-top:16px;}

.content-cta{margin-block:clamp(36px,4vw,48px);}
.content-cta h3{color:#fff;max-width:26ch;margin-inline:auto;
  font-size:clamp(1.3rem,.8rem + 1.6vw,1.7rem);}

/* (the phone rules above turn .finish-grid into a slider, so no 1-column fallback) */

/* ============================================================
   14. PRODUCT DETAIL PAGE
   ============================================================ */
.pdp-breadcrumb-bar{padding-block:18px;}

.pdp-main{padding-block:clamp(44px,5vw,72px);}
.pdp-layout{display:grid;grid-template-columns:1.05fr .95fr;gap:clamp(40px,5vw,84px);align-items:center;}
@media (max-width:900px){.pdp-layout{grid-template-columns:1fr;align-items:stretch;}}

.pdp-gallery{position:sticky;top:100px;}
@media (max-width:900px){.pdp-gallery{position:static;}}
.pdp-image-frame{position:relative;border-radius:10px;overflow:hidden;
  background:radial-gradient(120% 120% at 50% 12%,#fff 0%,var(--grey) 62%,#eceef1 100%);
  aspect-ratio:1/1;border:0;
  box-shadow:0 30px 60px -28px rgba(20,20,28,.32),0 1px 0 rgba(0,0,0,.04) inset;}
.pdp-image-frame .badge{position:absolute;top:20px;left:20px;z-index:2;font-size:.74rem;
  font-weight:700;letter-spacing:.01em;color:var(--accent-deep);background:#fff;
  border:1px solid var(--accent-wash);border-radius:10px;padding:7px 16px 7px 14px;
  display:inline-flex;align-items:center;gap:7px;box-shadow:0 8px 20px rgba(20,20,28,.1);}
.pdp-image-frame .badge::before{content:"";width:6px;height:6px;border-radius:10px;background:var(--accent);flex-shrink:0;}

/* --- gallery slider --- */
.pdp-slides{position:absolute;inset:0;}
.pdp-slide{position:absolute;inset:0;opacity:0;visibility:hidden;transition:opacity .4s ease;}
.pdp-slide.is-active{opacity:1;visibility:visible;}
.pdp-slide img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;}
.pdp-slide-nav{position:absolute;top:50%;translate:0 -50%;z-index:3;pointer-events:auto;}
.pdp-slide-nav.prev{left:16px;}
.pdp-slide-nav.next{right:16px;}
.pdp-image-frame .icon-btn{width:44px;height:44px;background:rgba(255,255,255,.92);
  backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px);border:0;
  box-shadow:0 12px 26px rgba(20,20,28,.2);
  opacity:0;transform:scale(.9);
  transition:opacity .25s ease,transform .25s ease,background-color .2s ease,color .2s ease;}
.pdp-image-frame:hover .icon-btn{opacity:1;transform:scale(1);}
.pdp-image-frame .icon-btn:hover{background:var(--accent);color:#fff;}
.pdp-dots{position:absolute;bottom:20px;left:50%;translate:-50% 0;z-index:3;
  display:flex;align-items:center;gap:7px;}
.pdp-dots button{width:7px;height:7px;padding:0;border-radius:10px;border:0;
  background:rgba(0,0,0,.18);cursor:pointer;transition:width .25s ease,background-color .25s ease;}
.pdp-dots button.is-active{width:22px;background:var(--accent);}

.pdp-thumbs{display:flex;gap:12px;margin-top:18px;}
.pdp-thumb{width:72px;height:72px;flex-shrink:0;padding:0;cursor:pointer;
  border-radius:10px;border:2px solid var(--line);overflow:hidden;background:var(--grey);
  opacity:.65;transition:opacity .2s ease,border-color .2s ease,transform .2s ease;}
.pdp-thumb img{width:100%;height:100%;object-fit:cover;display:block;}
.pdp-thumb:hover{opacity:1;transform:translateY(-2px);}
.pdp-thumb.is-active{opacity:1;border-color:var(--accent);box-shadow:0 10px 20px -8px rgba(152,47,99,.35);}

.pdp-trustrow{display:grid;grid-template-columns:repeat(2,1fr);
  margin-top:34px;border:1px solid var(--line);border-radius:10px;overflow:hidden;background:#fff;}
.pdp-trust-item{display:flex;align-items:center;gap:12px;padding:16px 18px;
  font-size:.85rem;font-weight:600;color:var(--ink);
  border-right:1px solid var(--line);border-bottom:1px solid var(--line);}
.pdp-trust-item:nth-child(2n){border-right:0;}
.pdp-trust-item:nth-last-child(-n+2){border-bottom:0;}
.pdp-trust-ico{display:inline-flex;align-items:center;justify-content:center;flex-shrink:0;
  width:36px;height:36px;border-radius:10px;background:var(--accent-wash);}
.pdp-trust-item .icon{width:17px;height:17px;color:var(--accent-deep);flex-shrink:0;}



.pdp-info .lede{margin-top:22px;max-width:48ch;}

/* --- detail tabs (description / specification) --- */
.content_detail_section{background:var(--grey);}


.content_detail_section .gal-tabs {margin-top: 0;}
.content_detail_section .gal-tabs-wrap{margin-bottom:0;}
.content_detail_section .gal-panel{background:#fff;border:1px solid var(--line);
  border-radius:var(--radius-lg);padding:clamp(28px,3.5vw,48px);margin-top:32px;
  box-shadow:0 30px 60px -38px rgba(20,20,28,.3);}


.content_detail_section .content-article > p:first-child{margin-top:0;}
.content_detail_section .content-article h3{margin-top:0;position:relative;}


.content_detail_section .content-list{margin-top:18px;gap:12px;}

/* --- quote / enquiry card --- */
.quote-card{background:#fff;border:1px solid var(--line);border-radius:var(--radius-lg);
  box-shadow:0 30px 60px -38px rgba(20,20,28,.3);
  padding:clamp(28px,3.5vw,44px);max-width:1080px;margin-inline:auto;}
@media (max-width:480px){.quote-card{padding:22px 18px;border-radius:var(--radius);}}
.quote-card h2{position:relative;}

.quote-card .section-head{margin-bottom:26px;}
.field-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px 22px;margin-top:30px;}
@media (max-width:820px){.field-grid{grid-template-columns:repeat(2,minmax(0,1fr));}}
@media (max-width:560px){.field-grid{grid-template-columns:minmax(0,1fr);}}
.field{display:flex;flex-direction:column;gap:7px;min-width:0;}
.field.span-2,.field.span-full{grid-column:1/-1;}
.field label{font-size:.83rem;font-weight:600;color:var(--ink);}
.field input,.field select,.field textarea{
  font:inherit;font-size:.92rem;color:var(--ink);background:white;
  width:100%;max-width:100%;min-width:0;
  border:1.5px solid rgba(0,0,0,.2);border-radius:10px;padding:.85em 1.1em;
  outline:0;transition:border-color .2s ease,background-color .2s ease,box-shadow .2s ease;}
/* touch devices: 16px stops iOS Safari zooming the page on field focus */
@media (hover:none){.field input,.field select,.field textarea{font-size:16px;}}
/* .field input:hover,.field select:hover,.field textarea:hover{background:#e9ebee;} */
.field input:focus,.field select:focus,.field textarea:focus{
  background:#fff;border-color:var(--accent);box-shadow:0 0 0 4px var(--accent-wash);}
.field textarea{resize:vertical;min-height:90px;}
.checkbox-group{display:flex;flex-wrap:wrap;gap:10px;min-width:0;}
.checkbox-group label{display:inline-flex;align-items:center;gap:8px;font-size:.86rem;
  color:var(--ink-2);font-weight:600;cursor:pointer;padding:10px 18px;
  border-radius:10px;border:1.5px solid rgba(0,0,0,.2);background:white;
  transition:border-color .2s ease,background-color .2s ease,color .2s ease;}
.checkbox-group label:hover{border-color:var(--accent-soft);}
.checkbox-group label:has(input:checked){background:var(--accent-wash);border-color:var(--accent);color:var(--accent-deep);}
.checkbox-group input{width:15px;height:15px;accent-color:var(--accent);}
[x-cloak]{display:none !important;}
.field-error{font-size:.8rem;color:#B42318;}
.quote-card .alert{padding:14px 18px;border-radius:10px;font-size:.9rem;font-weight:600;border:1.5px solid;margin-bottom:18px;}
.quote-card .alert-success{background:#ECFDF3;border-color:#ABEFC6;color:#067647;}
.quote-card .alert-danger{background:#FEF3F2;border-color:#FECDCA;color:#B42318;}
.form-submit-row{text-align:center;margin-top:30px;padding-top:26px;border-top:1px solid var(--line);}


.band{position:relative;border-radius:var(--radius-lg);overflow:hidden;
  min-height:clamp(420px,46vw,540px);display:flex;align-items:flex-end;}
.band img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;}
.band::after{content:"";position:absolute;inset:0;
  background:linear-gradient(180deg,rgba(0,0,0,.05) 0%,rgba(0,0,0,.666) 52%,rgba(0,0,0,.92) 100%);}
.band-inner{position:relative;z-index:1;padding:clamp(28px,4vw,52px);width:100%;color:#fff;}
.band-inner h2{color:#fff;max-width:16ch;}
.band-inner p{color:white;margin-top:16px;max-width:52ch;font-size:1.02rem;}
.band-stats{display:grid;grid-template-columns:repeat(4,1fr);gap:clamp(14px,2vw,26px);
  margin-top:clamp(26px,3vw,38px);padding-top:clamp(22px,2.6vw,30px);
  border-top:1px solid rgba(255,255,255,.26);}
@media (max-width:620px){.band-stats{grid-template-columns:repeat(2,1fr);row-gap:22px;}}
.band-stats b{display:block;font-family:var(--ff-display);font-weight:600;color:#fff;
  font-size:clamp(1.6rem,1.25rem + 1.1vw,2.2rem);letter-spacing:-.03em;line-height:1;}
.band-stats span{display:block;margin-top:7px;font-size:.8rem;color:white;line-height:1.4;}

/* --- band_cta: modern banner — accent glow, glass stat panel, inline CTA --- */
.band_cta{box-shadow:0 26px 60px rgba(91,22,56,.32);}
.band_cta::after{background:
  radial-gradient(58% 50% at 90% 6%,rgba(196,111,149,.38),transparent 62%),
  linear-gradient(180deg,rgba(102,0,51,.1) 0%,rgba(20,6,13,.6) 46%,rgba(9,3,6,.94) 100%);}
.band_cta .band-cta-btn{margin-top:24px;}
.band_cta .band-stats{display:flex;flex-wrap:wrap;gap:0;margin-top:clamp(28px,3vw,40px);
  padding:clamp(16px,2vw,22px) clamp(18px,2.2vw,26px);border-top:0;border-radius:10px;
  background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.16);backdrop-filter:blur(14px);}
.band_cta .band-stats > div{flex:1 1 0;padding:0 clamp(12px,1.6vw,20px);border-left:1px solid rgba(255,255,255,.16);}
.band_cta .band-stats > div:first-child{padding-left:0;border-left:0;}


@media (max-width:620px){
  .band_cta .band-stats{flex-wrap:wrap;gap:18px 0;}
  .band_cta .band-stats > div{flex:1 1 40%;border-left:0;padding-left:0;}
}
@media (max-width:860px){.band_cta{box-shadow:0 16px 36px rgba(91,22,56,.28);}}


/* ============================================================
   15. BLOG — listing + article
   ============================================================ */
/* --- centered page hero (same as by-box-style, centred) --- */
.page-hero.center{text-align:center;}
.page-hero.center .breadcrumb{justify-content:center;}

/* --- category tag + meta, shared by every card --- */
.post-tag{display:inline-flex;align-items:center;gap:7px;font-size:.72rem;font-weight:700;letter-spacing:.02em;
  color:var(--accent-deep);background:var(--accent-wash);border-radius:10px;padding:5px 12px;text-decoration:none;}
.post-tag::before{content:"";width:6px;height:6px;border-radius:10px;background:var(--accent);}
.post-meta{display:flex;align-items:center;flex-wrap:wrap;gap:6px 14px;font-size:.8rem;color:var(--ink-3);}
.post-meta span{display:inline-flex;align-items:center;gap:6px;}
.post-meta .icon{width:14px;height:14px;}

/* --- featured post --- */
.blog-featured{display:grid;grid-template-columns:1.15fr .85fr;background:#fff;border:1px solid var(--line);
  border-radius:var(--radius-lg);overflow:hidden;text-decoration:none;margin-bottom:clamp(40px,4.6vw,64px);
  transition:box-shadow .25s ease,transform .25s ease;}
.blog-featured:hover{box-shadow:0 30px 60px -34px rgba(20,20,28,.35);transform:translateY(-3px);}
.blog-featured .bf-media{position:relative;min-height:380px;background:var(--grey);overflow:hidden;}
.blog-featured .bf-media img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:transform .6s cubic-bezier(.2,.7,.3,1);}
.blog-featured:hover .bf-media img{transform:scale(1.04);}
.blog-featured .bf-flag{position:absolute;top:20px;right:20px;z-index:2;font-size:.72rem;font-weight:700;
  background:var(--ink);color:#fff;border-radius:10px;padding:6px 14px;letter-spacing:.04em;text-transform:uppercase;}
.blog-featured .bf-body{display:flex;flex-direction:column;align-items:flex-start;gap:18px;padding:clamp(28px,3.6vw,52px);}
.blog-featured h2{font-size:clamp(1.55rem,1.1rem + 1.5vw,2.25rem);font-weight:600;line-height:1.14;letter-spacing:-.028em;}
.blog-featured p{color:var(--ink-2);font-size:.97rem;line-height:1.7;}
.blog-featured .link-arrow{margin-top:auto;padding-top:6px;}
.blog-featured:hover .link-arrow .icon{transform:translateX(3px);}
@media (max-width:860px){
  .blog-featured{grid-template-columns:1fr;}
  .blog-featured .bf-media{min-height:0;aspect-ratio:16/10;}
}

/* --- post grid + card --- */
.blog-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(20px,2.2vw,30px);}
@media (max-width:1000px){.blog-grid{grid-template-columns:repeat(2,minmax(0,1fr));}}
@media (max-width:600px){.blog-grid{grid-template-columns:1fr;}}
.post-card{display:flex;flex-direction:column;background:#fff;border:1px solid var(--line);border-radius:var(--radius-lg);
  padding:12px 12px 22px;text-decoration:none;transition:transform .25s ease,box-shadow .25s ease,border-color .25s ease;}
.post-card:hover{transform:translateY(-5px);border-color:var(--line-2);box-shadow:0 18px 38px rgba(1,31,58,.09);}
.post-card .pc-media{position:relative;aspect-ratio:4/3;border-radius:var(--radius);overflow:hidden;background:var(--grey);}
.post-card .pc-media img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:transform .5s cubic-bezier(.2,.7,.3,1);}
.post-card:hover .pc-media img{transform:scale(1.05);}
.post-card .pc-media .post-tag{position:absolute;top:14px;left:14px;z-index:2;background:rgba(255,255,255,.94);}
.post-card .pc-body{display:flex;flex-direction:column;flex:1;padding:18px 8px 0;}
.post-card h3{font-size:1.14rem;font-weight:600;line-height:1.3;letter-spacing:-.018em;margin-top:10px;}
.post-card p{font-size:.88rem;color:var(--ink-2);line-height:1.6;margin-top:9px;flex:1;
  display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:3;line-clamp:3;overflow:hidden;}
.post-card .link-arrow{margin-top:16px;font-size:.84rem;}
.post-card:hover .link-arrow .icon{transform:translateX(3px);}
/* --- newsletter band (listing) --- */
.blog-subscribe{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,440px);gap:28px;align-items:center;
  margin-top:clamp(56px,6vw,90px);padding:clamp(28px,4vw,52px);border-radius:var(--radius-lg);
  background:radial-gradient(90% 140% at 100% 0%,rgba(152,47,99,.38),transparent 60%),var(--ink);color:#fff;}
.blog-subscribe h2{color:#fff;font-size:clamp(1.6rem,1.1rem + 1.6vw,2.3rem);font-weight:600;max-width:20ch;}
.blog-subscribe p{color:rgba(255,255,255,.7);margin-top:12px;font-size:.95rem;max-width:48ch;}
.blog-subscribe .newsletter-form{width:100%;}
.blog-subscribe small{display:block;margin-top:10px;font-size:.76rem;color:rgba(255,255,255,.5);padding-left:18px;}
@media (max-width:820px){.blog-subscribe{grid-template-columns:1fr;}}

/* ============ ARTICLE ============ */
.read-progress{position:fixed;top:0;left:0;height:3px;width:100%;z-index:90;background:var(--accent);
  transform-origin:0 50%;transform:scaleX(0);pointer-events:none;}

.article-head{padding-block:clamp(16px,2vw,24px) clamp(32px,3.6vw,48px);}
.article-head .breadcrumb{margin-bottom:clamp(28px,3.4vw,44px);}
.article-head-inner{max-width:900px;margin-inline:auto;text-align:center;display:flex;flex-direction:column;align-items:center;}
.article-head h1{margin-top:20px;font-size:clamp(2.1rem,1.2rem + 3vw,3.6rem);}
.article-head .lede{margin-top:20px;max-width:60ch;}
.article-byline{display:flex;align-items:center;justify-content:center;flex-wrap:wrap;gap:14px 26px;margin-top:30px;}
.author-chip{display:flex;align-items:center;gap:12px;text-align:left;}
.author-avatar{display:grid;place-items:center;width:44px;height:44px;border-radius:10px;flex:none;
  background:var(--accent);color:#fff !important;font-family:var(--ff-display);font-weight:600;font-size:.92rem;}
.author-chip strong{display:block;font-size:.9rem;font-weight:600;color:var(--ink);line-height:1.3;}
.author-chip span{font-size:.78rem;color:var(--ink-3);}
.article-byline .divider{width:1px;height:30px;background:var(--line);}
@media (max-width:560px){.article-byline .divider{display:none;}}

.article-cover{position:relative;margin:clamp(36px,4vw,56px) auto 0;max-width:1180px;border-radius:var(--radius-lg);overflow:hidden;background:var(--grey);
  box-shadow:0 40px 70px -40px rgba(20,20,28,.4);}
.article-cover img{display:block;width:100%;height:auto;aspect-ratio:16/9;object-fit:cover;}

.article-section{padding-block:clamp(48px,5.5vw,84px);}
.article-layout.single{display:block;}
.article-head + .article-section{padding-top:clamp(20px,2.4vw,32px);}
.article-layout.single .prose{margin-inline:auto;}

/* share row under the cover image, right aligned */
.article-share{display:flex;align-items:center;justify-content:flex-end;gap:10px;max-width:1180px;margin:20px auto 0;}
.article-share h4{font-family:var(--ff-body);font-size:.72rem;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--ink-3);margin:0 6px 0 0;}
.article-share a,.article-share button{width:40px;height:40px;border-radius:10px;display:grid;place-items:center;
  border:1.5px solid var(--line);background:#fff;color:var(--ink-2);cursor:pointer;text-decoration:none;
  transition:border-color .2s ease,color .2s ease,background-color .2s ease;}
.article-share a:hover,.article-share button:hover{border-color:var(--accent);color:var(--accent);}
.article-share .icon{width:16px;height:16px;}
.article-share .bi{font-size:15px;line-height:1;}
.article-share .copied{background:var(--accent);border-color:var(--accent);color:#fff;}

/* ------------------------------------------------------------
   .blog-content — wraps the raw HTML that comes from the dashboard.
   Everything here targets plain elements, so the content editor never
   adds a class. !important is used only where CMS editors (TinyMCE)
   write inline styles (table widths/borders, image margins) that would
   otherwise beat the theme.
   ------------------------------------------------------------ */
.prose{max-width:1175px;min-width:0;}
.blog-content{color:var(--ink-2);font-size:1.02rem;line-height:1.82;overflow-wrap:break-word;}
.blog-content > *{margin-top:0;margin-bottom:0;}
.blog-content > * + *{margin-top:20px;}
.blog-content > :first-child{margin-top:0;}


/* headings */
.blog-content h1,.blog-content h2,.blog-content h3,.blog-content h4,.blog-content h5,.blog-content h6{
  color:var(--ink);font-family:var(--ff-display);font-weight:600;scroll-margin-top:185px;}
.blog-content h1,.blog-content h2{font-size:clamp(1.55rem,1.15rem + 1.2vw,2.05rem);letter-spacing:-.026em;line-height:1.18;}
.blog-content h3{font-size:clamp(1.25rem,1.05rem + .6vw,1.5rem);letter-spacing:-.02em;line-height:1.25;}
.blog-content h4{font-size:1.1rem;letter-spacing:-.012em;line-height:1.35;}
.blog-content h5,.blog-content h6{font-size:.95rem;text-transform:uppercase;letter-spacing:.06em;color:var(--accent-deep);}
.blog-content > h1,.blog-content > h2{margin-top:clamp(48px,5vw,64px);padding-top:clamp(28px,3vw,36px);border-top:1px solid var(--line);}
.blog-content > h3{margin-top:clamp(40px,4.4vw,54px);}
.blog-content > h4{margin-top:30px;display:flex;align-items:center;gap:10px;}
.blog-content > h4::before{content:"";width:8px;height:8px;border-radius:10px;background:var(--accent);flex:none;}
.blog-content > h2:first-child,.blog-content > h3:first-child{margin-top:0;padding-top:0;border-top:0;}
.blog-content h2 + *,.blog-content h3 + *,.blog-content h4 + *{margin-top:14px;}

/* inline text */
.blog-content a{color:var(--accent-deep);font-weight:600;text-decoration:underline;text-decoration-thickness:1px;
  text-underline-offset:3px;transition:color .18s ease;}
.blog-content a:hover{color:var(--accent);}
.blog-content a strong,.blog-content strong a{color:inherit;}
.blog-content strong,.blog-content b{color:var(--ink);font-weight:600;}
.blog-content mark{background:var(--t-sun);color:var(--ink);padding:0 .2em;border-radius:3px;}
.blog-content code{font-size:.88em;background:var(--grey);border-radius:6px;padding:.12em .4em;color:var(--accent-deep);}
.blog-content pre{background:var(--ink);color:#f2f2f2;border-radius:var(--radius);padding:18px 20px;overflow-x:auto;font-size:.86rem;line-height:1.6;}
.blog-content pre code{background:none;color:inherit;padding:0;}
.blog-content hr{border:0;height:1px;background:var(--line);margin-block:clamp(36px,4vw,48px);opacity:1;}

/* bullet lists */
.blog-content ul{list-style:none;padding:0 !important;display:grid;gap:10px;}
.blog-content ul li{position:relative;padding-left:26px;line-height:1.7;}
.blog-content ul li::before{content:"";position:absolute;left:4px;top:.66em;width:7px;height:7px;border-radius:10px;
  background:var(--accent);box-shadow:0 0 0 4px var(--accent-wash);}
.blog-content li > ul,.blog-content li > ol{margin-top:10px;}
.blog-content li > ul li::before{background:transparent;border:1.5px solid var(--accent);box-shadow:none;}

/* numbered lists: counter cards */
.blog-content ol{list-style:none;padding:0 !important;counter-reset:bc;display:grid;gap:12px;}
.blog-content ol > li{counter-increment:bc;position:relative;padding:18px 22px 18px 70px;background:var(--grey);
  border-radius:var(--radius);line-height:1.7;font-size:.97rem;}
.blog-content ol > li::before{content:counter(bc,decimal-leading-zero);position:absolute;left:22px;top:17px;
  font-family:var(--ff-display);font-weight:600;font-size:1.05rem;color:var(--accent-deep);}
.blog-content ol > li > strong:first-child{display:block;font-family:var(--ff-display);font-size:1.04rem;margin-bottom:4px;}
.blog-content ol > li > strong:first-child br{display:none;}

/* images — a bare <img>, an <img> inside <p>, or a <figure> */
.blog-content img{display:block;max-width:800px;width:100%;height:auto !important;
  border-radius:var(--radius-lg);background:var(--grey);}
.blog-content p:has(> img:only-child){margin-block:clamp(30px,3.4vw,40px);}
.blog-content > img{margin-block:clamp(30px,3.4vw,40px) !important;}
.blog-content figure{margin:clamp(30px,3.4vw,40px) 0 !important;}
.blog-content figure img{width:100%;}
.blog-content figcaption{margin-top:12px;font-size:.82rem;color:var(--ink-3);text-align:center;}

/* video embeds */
.blog-content iframe,.blog-content video{display:block;width:100% !important;height:auto !important;aspect-ratio:16/9;
  border:0;border-radius:var(--radius-lg);background:var(--ink);}

/* quotes */
.blog-content blockquote{margin-block:clamp(30px,3.4vw,40px);padding:6px 0 6px clamp(22px,3vw,34px);border-left:3px solid var(--accent);}
.blog-content blockquote,.blog-content blockquote p{font-family:var(--ff-display);font-size:clamp(1.25rem,1.05rem + .8vw,1.6rem);
  font-weight:500;line-height:1.38;letter-spacing:-.018em;color:var(--ink);}
.blog-content blockquote p + p{margin-top:12px;}
.blog-content blockquote cite,.blog-content blockquote footer{display:block;margin-top:14px;font-family:var(--ff-body);
  font-style:normal;font-size:.84rem;font-weight:600;color:var(--ink-3);letter-spacing:0;}

/* tables — JS wraps each one in .table-scroll for small screens */
.blog-content .table-scroll{overflow-x:auto;border:1px solid var(--line);border-radius:var(--radius);
  margin-block:clamp(26px,3vw,34px);background:#fff;}
.blog-content table{width:100% !important;min-width:520px;margin:0 !important;border:0 !important;border-collapse:collapse !important;
  text-align:left !important;font-size:.9rem;line-height:1.55;}
.blog-content > table{display:block;overflow-x:auto;min-width:0;border:1px solid var(--line) !important;border-radius:var(--radius);}
.blog-content thead tr,.blog-content tr{background:none !important;}
.blog-content th,.blog-content td{width:auto !important;padding:14px 18px !important;border:0 !important;
  border-bottom:1px solid var(--line) !important;text-align:left !important;vertical-align:top;}
.blog-content thead th,.blog-content table > tr:first-child th{background:var(--ink) !important;color:#fff;font-weight:600;
  font-size:.82rem;letter-spacing:.02em;white-space:nowrap;border-bottom:0 !important;}
.blog-content tbody tr:last-child td{border-bottom:0 !important;}
.blog-content tbody tr:nth-child(even) td{background:#fafafa;}
.blog-content tbody tr:hover td{background:var(--accent-wash);}
.blog-content td:first-child{color:var(--ink);}
.blog-content td strong{font-weight:600;}

.inline-cta{display:flex;align-items:center;justify-content:space-between;gap:22px;flex-wrap:wrap;margin:40px 0;
  padding:clamp(22px,3vw,30px) clamp(22px,3vw,34px);border-radius:var(--radius-lg);
  background:radial-gradient(80% 160% at 100% 100%,rgba(152,47,99,.4),transparent 60%),var(--ink);}
.inline-cta strong{display:block;font-family:var(--ff-display);font-size:1.22rem;font-weight:600;color:#fff;letter-spacing:-.015em;}
.inline-cta span{display:block;font-size:.86rem;color:rgba(255,255,255,.68);margin-top:4px;}

.article-foot{margin-top:clamp(40px,5vw,56px);padding-top:28px;border-top:1px solid var(--line);}
.article-tags{display:flex;flex-wrap:wrap;gap:8px;align-items:center;}
.article-tags b{font-size:.82rem;color:var(--ink);margin-right:4px;}
.article-tags a{font-size:.8rem;font-weight:500;color:var(--ink-2);text-decoration:none;padding:6px 14px;
  border-radius:10px;background:var(--grey);transition:background-color .2s ease,color .2s ease;}
.article-tags a:hover{background:var(--accent-wash);color:var(--accent-deep);}
.author-card{display:flex;gap:20px;align-items:flex-start;margin-top:28px;padding:clamp(22px,3vw,30px);
  border:1px solid var(--line);border-radius:var(--radius-lg);background:#fff;}
.author-card .author-avatar{width:64px;height:64px;font-size:1.2rem;}
.author-card strong{display:block;font-family:var(--ff-display);font-size:1.08rem;font-weight:600;color:var(--ink);}
.author-card .role{font-size:.8rem;color:var(--ink-3);}
.author-card p{margin-top:10px;font-size:.9rem;color:var(--ink-2);line-height:1.65;}
@media (max-width:500px){.author-card{flex-direction:column;}}

.post-nav{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin-top:22px;}
.post-nav a{display:flex;flex-direction:column;gap:6px;padding:18px 22px;border-radius:var(--radius);
  border:1px solid var(--line);text-decoration:none;transition:border-color .2s ease,background-color .2s ease;}
.post-nav a:hover{border-color:var(--accent-soft);background:var(--accent-wash);}
.post-nav a.next{text-align:right;align-items:flex-end;}
.post-nav small{display:inline-flex;align-items:center;gap:6px;font-size:.74rem;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--ink-3);}
.post-nav small .icon{width:13px;height:13px;}
.post-nav span{font-family:var(--ff-display);font-size:.98rem;font-weight:600;line-height:1.35;color:var(--ink);}
@media (max-width:560px){.post-nav{grid-template-columns:1fr;}.post-nav a.next{text-align:left;align-items:flex-start;}}

.related-section{background:var(--grey);}
/* ============================================================
   16. FAQ + LEGAL PAGES
   ============================================================ */
.faq-accordion{max-width:900px;margin-inline:auto;}
.legal-content{max-width:880px;margin-inline:auto;}
.legal-content > h2:first-child + p{margin-top:14px;}

/* ============================================================
   17. PRODUCT DETAIL — reviews slider, add to quote, why choose us
   ============================================================ */
.pdp-layout{align-items:start;}
.pdp-gallery,.pdp-info{min-width:0;}
#quote-form{scroll-margin-top:175px;}

/* --- reviews slider: plain card, Google look --- */
.pdp-reviews{margin-top:22px;border:1px solid var(--line);border-radius:10px;background:#fff;overflow:hidden;}
.pr-head{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:16px 20px;border-bottom:1px solid var(--line);}
.pr-summary{display:flex;align-items:center;gap:12px;}
.g-logo{width:30px;height:30px;flex:none;}
.pr-title{display:block;font-size:.86rem;font-weight:600;color:var(--ink);line-height:1.2;}
.pr-score{display:flex;align-items:center;gap:8px;margin-top:3px;}
.pr-score b{font-family:var(--ff-display);font-size:1.15rem;font-weight:600;color:var(--ink);line-height:1;}
.g-stars{display:inline-flex;gap:2px;color:#FBBC04;}
.g-stars .icon{width:15px;height:15px;fill:currentColor;stroke:none;}
.pr-nav{display:flex;gap:8px;}
.pr-nav .icon-btn{width:32px;height:32px;border:1px solid var(--line);}
.pr-nav .icon-btn:hover{border-color:var(--ink);background:#fff;}
.pr-nav .icon-btn .icon{width:14px;height:14px;}
.pr-viewport{overflow:hidden;}
.pr-track{display:flex;transition:transform .6s cubic-bezier(.22,.61,.36,1);will-change:transform;}
.pr-slide{flex:0 0 100%;min-width:0;margin:0;padding:18px 20px 6px;display:flex;flex-direction:column;gap:14px;}
.pr-slide blockquote{margin:0;font-size:.92rem;line-height:1.65;color:var(--ink-2);
  display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:4;line-clamp:4;overflow:hidden;min-height:calc(1.65em * 4);}
.pr-slide figcaption{display:flex;align-items:center;gap:10px;}
.pr-slide figcaption img{width:36px;height:36px;border-radius:10px;object-fit:cover;flex:none;}
.pr-slide figcaption > span{display:flex;flex-direction:column;gap:2px;}
.pr-slide figcaption b{font-size:.86rem;font-weight:600;color:var(--ink);line-height:1.2;}
.pr-slide .g-stars .icon{width:12px;height:12px;}
.pr-dots{display:flex;gap:6px;padding:10px 20px 16px;}
.pr-dots button{width:6px;height:6px;padding:0;border:0;border-radius:10px;background:var(--line-2);cursor:pointer;
  transition:width .25s ease,background-color .25s ease;}
.pr-dots button.is-active{width:18px;background:var(--ink-2);}

/* --- add to quote --- */
.pdp-quote-btn{width:100%;margin-top:18px;padding-block:1em;font-size:.98rem;}
.pdp-quote-btn:hover{background:var(--accent-deep);}

/* --- why choose us: light, simple --- */
.pdp-why{background:var(--paper);}
.pw-grid{display:grid;grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr);gap:clamp(32px,5vw,80px);align-items:center;}
.pw-media img{width:100%;height:auto;aspect-ratio:1/1;object-fit:cover;border-radius:var(--radius-lg);background:var(--grey);}
.pw-copy .label{margin-bottom:16px;}
.pw-copy h2{max-width:20ch;}
.pw-copy > p{margin-top:16px;color:var(--ink-2);font-size:1rem;line-height:1.7;max-width:58ch;}
.pw-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:22px 28px;margin-top:32px;}
.pw-list li{display:flex;align-items:flex-start;gap:14px;}
.pw-ico{display:grid;place-items:center;flex:none;width:40px;height:40px;border-radius:10px;background:#fff;
  border:1px solid var(--line);color:var(--accent-deep);}
.pw-ico .icon{width:18px;height:18px;}
.pw-list h3{font-family:var(--ff-body);font-size:.95rem;font-weight:600;letter-spacing:-.01em;line-height:1.35;}
.pw-list p{margin-top:3px;font-size:.86rem;line-height:1.55;color:var(--ink-2);}
@media (max-width:900px){.pw-grid{grid-template-columns:1fr;}.pw-media{max-width:520px;}}
@media (max-width:560px){.pw-list{grid-template-columns:1fr;}}

/* by-box-style grid: title only, centred under the image */
#style-grid-list .pcard h3{text-align:center;}

/* comparison tables inside the content accordion (primary-packaging) */
.content-table{overflow-x:auto;margin:4px 0 4px;border:1px solid var(--line);border-radius:var(--radius);background:#fff;}
.content-table table{width:100%;min-width:460px;border-collapse:collapse;font-size:.82rem;line-height:1.55;}
.content-table th,.content-table td{padding:12px 16px;text-align:left;vertical-align:top;border-bottom:1px solid var(--line);color:var(--ink-2);}
.content-table th{background:var(--ink);color:#fff;font-weight:600;white-space:nowrap;border-bottom:0;}
.content-table tbody tr:last-child td{border-bottom:0;}
.content-table tbody tr:nth-child(even) td{background:#fafafa;}
.content-table td strong{color:var(--ink);font-weight:600;}

/* category pages: grid follows the banner directly, no section heading */
.page-hero + #products{padding-top:clamp(28px,3.4vw,44px);}

/* contact page: details on the left, message form on the right */
.contact-layout{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:clamp(24px,3vw,44px);align-items:start;}
.contact-info{display:flex;flex-direction:column;gap:14px;}
.contact-card{display:flex;align-items:center;gap:16px;padding:18px 20px;background:#fff;border:1px solid var(--line);
  border-radius:var(--radius);text-decoration:none;color:var(--ink);transition:border-color .2s ease,box-shadow .2s ease;}
a.contact-card:hover{border-color:var(--accent-soft);box-shadow:0 8px 22px rgba(102,0,51,.07);}
.contact-icon{display:grid;place-items:center;flex:none;width:46px;height:46px;border-radius:10px;background:var(--accent-wash);color:var(--accent-deep);}
.contact-icon .icon{width:20px;height:20px;}
.contact-label{display:block;font-size:.74rem;font-weight:600;letter-spacing:.06em;text-transform:uppercase;color:var(--ink-2);margin-bottom:3px;}
.contact-card strong{display:block;font-size:.95rem;font-weight:600;line-height:1.4;overflow-wrap:anywhere;}
.contact-note{margin-top:8px;padding:22px 20px;border-radius:var(--radius);background:var(--grey);}
.contact-note p{font-size:.9rem;line-height:1.6;color:var(--ink-2);margin:0 0 14px;}
.contact-form .field-grid{grid-template-columns:repeat(2,minmax(0,1fr));margin-top:0;}
@media (max-width:900px){.contact-layout{grid-template-columns:minmax(0,1fr);}}
@media (max-width:560px){.contact-form .field-grid{grid-template-columns:minmax(0,1fr);}}

/* ---------- mobile spacing pass ----------
   Bootstrap's .container keeps a 12px side padding on phones while the rest
   of the site uses --gutter (20px), so banners, grids and accordions sat
   closer to the screen edge than everything else. */
@media (max-width:575.98px){
  .container{padding-inline:var(--gutter);}
  .testimonials-section{padding-bottom:44px;}
  .testimonial-shell{padding-block:44px 40px;}
}
/* video and reviews stack below lg: row g-5 adds a 48px vertical gutter on top of the block margin */
@media (max-width:991.98px){
  #testimonials .row{--bs-gutter-y:28px;}
  #testimonials .video-review-block{margin-bottom:0;}
}
.contact-form{max-width:none;margin:0;}

/* testimonials page: review cards in two columns, video reviews below */
.testimonials-page .testi-card{height:100%;min-height:0;}
.video-reviews .section-head{margin-bottom:clamp(24px,3vw,36px);}
.video-reviews .video-frame{position:relative;aspect-ratio:16/9;border-radius:10px;overflow:hidden;background:#252525;}
.video-reviews .video-frame iframe{position:absolute;inset:0;width:100%;height:100%;border:0;}
.video-reviews .video-preview{position:relative;display:block;width:100%;height:100%;padding:0;border:0;background:#252525;color:#fff;text-align:left;cursor:pointer;}
.video-reviews .video-preview img{display:block;width:100%;height:100%;object-fit:cover;}
.video-reviews .video-shade{position:absolute;inset:0;background:linear-gradient(180deg,rgba(0,0,0,.5),transparent 42%,rgba(0,0,0,.43));}
.video-reviews .video-caption{position:absolute;top:26px;left:28px;right:24px;font-family:var(--ff-display);font-size:clamp(1.05rem,1.45vw,1.4rem);font-weight:600;line-height:1.25;}
.video-reviews .video-play{position:absolute;left:28px;bottom:24px;display:grid;place-items:center;width:56px;height:56px;padding-left:3px;border-radius:10px;
  background:#fff;color:#151515;font-size:1.15rem;box-shadow:0 4px 20px rgba(0,0,0,.22);transition:transform .2s ease;}
.video-reviews .video-preview:hover .video-play{transform:scale(1.07);}

/* WhatsApp number: glyph takes the same colour as the icons around it (footer + contact page) */
.foot-contact .foot-wa{flex:none;width:15px;margin-top:3px;font-size:15px;line-height:1;color:inherit;}
.contact-icon-wa .bi{font-size:21px;line-height:1;}

/* --- deals page: offer cards reuse .feature-card, plus artwork and an offer label --- */
.deal-card{display:flex;flex-direction:column;align-items:flex-start;}
.deal-label{display:inline-block;margin-bottom:14px;padding:4px 12px;border-radius:999px;
  background:var(--accent-wash);color:var(--accent-deep);
  font-size:.7rem;font-weight:600;letter-spacing:.1em;text-transform:uppercase;}
/* the art is 379x335; height:auto keeps it from stretching in the flex column */
.deal-img{width:100%;height:auto;margin-bottom:18px;border-radius:var(--radius);
  background:var(--grey);object-fit:cover;}
.deal-card h3{font-size:1.04rem;line-height:1.4;margin-bottom:22px;}
.deal-card > p{margin-bottom:18px;}
.deal-card .btn{margin-top:auto;}
.feature-grid.tint-alt .deal-card:nth-child(4n+2) .deal-label{background:var(--t-mint);color:var(--ink);}
.feature-grid.tint-alt .deal-card:nth-child(4n+3) .deal-label{background:var(--t-sky);color:var(--ink);}
.deals-detail .feature-card{height:100%;}
/* three roomy columns so the 379px-wide deal art is not scaled down hard */
.deals-page .feature-grid{grid-template-columns:repeat(auto-fit,minmax(300px,1fr));}

/* --- media + copy rows (design service): art one side, text the other, alternating --- */
.media-row{display:grid;grid-template-columns:1fr 1fr;gap:clamp(28px,4vw,64px);align-items:center;}
.media-row + .media-row{margin-top:clamp(40px,5vw,78px);}
.media-row-figure{border-radius:var(--radius-lg);overflow:hidden;background:var(--grey);}
.media-row-figure img{display:block;width:100%;height:auto;aspect-ratio:1000/560;object-fit:cover;}
.media-row-body h2{font-size:clamp(1.4rem,1.1rem + 1.1vw,1.95rem);font-weight:600;letter-spacing:-.02em;}
.media-row-body p{margin-top:14px;color:var(--ink-2);line-height:1.7;}
/* flip puts the art on the right without changing source order (text stays readable first) */
.media-row-flip .media-row-figure{order:2;}
@media (max-width:860px){
  .media-row{grid-template-columns:1fr;}
  .media-row-flip .media-row-figure{order:0;}
}

/* --- trust strip: Trustpilot badge + headline stats (information page) --- */
.trust-strip{display:flex;align-items:center;gap:clamp(22px,3.4vw,54px);flex-wrap:wrap;
  justify-content:center;}
.trust-rating{flex:none;display:block;line-height:0;}
.trust-rating img{width:auto;height:46px;object-fit:contain;}
.trust-stats{flex:1;min-width:0;display:grid;gap:clamp(16px,2.4vw,34px);margin:0;padding:0;
  list-style:none;grid-template-columns:repeat(4,minmax(0,1fr));}
.trust-stats li{display:flex;align-items:center;gap:12px;min-width:0;}
.trust-icon{flex:none;display:grid;place-items:center;width:46px;height:46px;border-radius:12px;
  background:var(--accent-wash);}
.trust-icon img{width:26px;height:26px;object-fit:contain;}
.trust-text{display:flex;flex-direction:column;min-width:0;line-height:1.25;}
.trust-text strong{font-family:var(--ff-display);font-size:1.02rem;font-weight:600;letter-spacing:-.01em;}
.trust-text span{font-size:.84rem;color:var(--ink-2);}
@media (max-width:900px){
  .trust-stats{grid-template-columns:repeat(2,minmax(0,1fr));}
}
@media (max-width:420px){
  .trust-stats{grid-template-columns:1fr;}
}
/* the strip is a band between sections, so it does not need full section padding */
.trust-section{padding-block:clamp(26px,3vw,44px);}