/* ============================================================
   SMVPL 360° HUB — Design System
   Sri Mookambika Ventures Pvt. Ltd. — FAX · MAX · GAX
   ============================================================ */

@import url("https://fonts.googleapis.com/css2?family=Space+Grotesk:wght@500;600;700&family=Inter:wght@400;500;600;700&family=IBM+Plex+Mono:wght@400;500;600&display=swap");

:root{
  /* Ink (midnight navy) scale — deep, rich, jewel-toned base */
  --ink-900:#060A1F; --ink-800:#0C1530; --ink-700:#152449; --ink-600:#213868;
  --ink-500:#33528F; --ink-400:#5C7AC0; --ink-300:#93AEDD; --ink-200:#C4D3F0;
  --ink-100:#E4EAFA; --ink-50:#F3F6FD;
  --ink: var(--ink-800);

  --paper:#F6F7F9;
  --surface:#FFFFFF;
  --line:#E4E8EE;
  --muted:#5B6B7F;

  /* Rich metallic gold — deep bronze through bright glitter-highlight gold */
  --gold-700:#8C6410; --gold-500:#D4A017; --gold-400:#E9BE4A; --gold-300:#F0D485; --gold-100:#FBF0D6; --gold-50:#FDF9EE;
  --gold: var(--gold-500);
  --gold-rgb: 212,160,23;
  --gold-dark-rgb: 140,100,16;
  /* Retained for any residual reference — no longer part of the active palette */
  --cyan-600:#152449; --cyan-500:#213868; --cyan-400:#5C7AC0;

  /* Primary site accent maps to the new gold — every existing var(--teal-*)
     usage below repaints automatically, no per-rule edits needed. */
  --teal-600: var(--gold-700); --teal-500: var(--gold-500); --teal-400: var(--gold-300);

  /* Division jewel tones — deepened to sit comfortably alongside navy + gold
     while staying clearly distinct from one another (sapphire / emerald / amber) */
  --fax:#1E70B8; --fax-dark:#0A4C8C; --fax-tint:#EAF3FB;
  --max:#1F8A4C; --max-dark:#136B36; --max-tint:#E9F7EE;
  --gax:#C4630F; --gax-dark:#9C4E0A; --gax-tint:#FBEEE0;

  --radius-sm:.6rem; --radius-md:1rem; --radius-lg:1.25rem; --radius-xl:1.75rem;

  --shadow-card: 0 1px 2px rgba(6,10,31,.06), 0 8px 24px -12px rgba(6,10,31,.18);
  --shadow-lift: 0 14px 34px -10px rgba(6,10,31,.28);
  --shadow-pop: 0 24px 60px -16px rgba(6,10,31,.4);
  --shadow-gold: 0 10px 28px -12px rgba(var(--gold-rgb),.45);

  --font-display:"Space Grotesk","Segoe UI",system-ui,sans-serif;
  --font-body:"Inter","Segoe UI",system-ui,-apple-system,sans-serif;
  --font-mono:"IBM Plex Mono",ui-monospace,"SFMono-Regular",Menlo,monospace;

  /* Signature hub gradient: pure midnight navy -> rich gold, matching the
     brand's navy-and-gold identity */
  --hub-gradient: linear-gradient(135deg, var(--ink-900) 0%, var(--ink-700) 55%, var(--gold-500) 100%);
  --hub-gradient-soft: linear-gradient(135deg, rgba(6,10,31,.07) 0%, rgba(6,10,31,.025) 50%, rgba(var(--gold-rgb),.09) 100%);

  --ease: cubic-bezier(.16,.84,.44,1);
  --container-max: 84rem;
}

/* ---------- Gold shimmer / glitter texture ----------
   Scattered gold flecks over a dark surface, echoing the brand's navy +
   gold glitter motif. Purely decorative — layer over any dark section. */
.gold-shimmer{ position:relative; isolation:isolate; }
.gold-shimmer::after{
  content:""; position:absolute; inset:0; z-index:0; pointer-events:none;
  opacity:.55;
  background-image:
    radial-gradient(1.5px 1.5px at 8% 22%, rgba(var(--gold-rgb),.9), transparent 60%),
    radial-gradient(1px 1px at 18% 68%, rgba(var(--gold-rgb),.7), transparent 60%),
    radial-gradient(2px 2px at 27% 12%, rgba(233,190,74,.8), transparent 60%),
    radial-gradient(1px 1px at 38% 82%, rgba(var(--gold-rgb),.6), transparent 60%),
    radial-gradient(1.5px 1.5px at 52% 34%, rgba(233,190,74,.75), transparent 60%),
    radial-gradient(1px 1px at 63% 6%, rgba(var(--gold-rgb),.7), transparent 60%),
    radial-gradient(2px 2px at 72% 58%, rgba(var(--gold-rgb),.85), transparent 60%),
    radial-gradient(1px 1px at 83% 24%, rgba(233,190,74,.65), transparent 60%),
    radial-gradient(1.5px 1.5px at 91% 78%, rgba(var(--gold-rgb),.8), transparent 60%),
    radial-gradient(1px 1px at 96% 40%, rgba(233,190,74,.6), transparent 60%);
  background-repeat:no-repeat;
}
.gold-shimmer > *{ position:relative; z-index:1; }

*,*::before,*::after{ box-sizing:border-box; }
html{ scroll-behavior:smooth; overflow-x:hidden; max-width:100%; }
body{
  margin:0;
  background:var(--paper);
  color:var(--ink);
  font-family:var(--font-body);
  -webkit-font-smoothing:antialiased;
  line-height:1.5;
  overflow-x:hidden;
}
img,svg{ display:block; max-width:100%; }
a{ color:inherit; text-decoration:none; }
button{ font:inherit; cursor:pointer; background:none; border:0; color:inherit; }
input,select,textarea{ font:inherit; color:inherit; }
ul{ list-style:none; margin:0; padding:0; }
h1,h2,h3,h4,p{ margin:0; }

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

::selection{ background:var(--teal-500); color:#fff; }

a:focus-visible, button:focus-visible, input:focus-visible,
select:focus-visible, textarea:focus-visible, [tabindex]:focus-visible{
  outline:2px solid var(--teal-500);
  outline-offset:2px;
  border-radius:4px;
}

.icon{ width:1.25em; height:1.25em; stroke:currentColor; fill:none; flex-shrink:0; }
.icon-fill{ fill:currentColor; }

/* ---------- Layout ---------- */
.container{
  width:100%;
  max-width:var(--container-max);
  margin-inline:auto;
  padding-inline:1.25rem;
}
@media (min-width:768px){ .container{ padding-inline:2rem; } }

.section{ padding-block:3.5rem; }
@media (min-width:768px){ .section{ padding-block:5rem; } }
.section-tight{ padding-block:2.5rem; }

.bg-grid{
  background-image:
    linear-gradient(to right, rgba(6,10,31,.05) 1px, transparent 1px),
    linear-gradient(to bottom, rgba(6,10,31,.05) 1px, transparent 1px);
  background-size:40px 40px;
}

.font-display{ font-family:var(--font-display); }
.font-mono{ font-family:var(--font-mono); }
.tabular{ font-variant-numeric:tabular-nums; }
.text-muted{ color:var(--muted); }

/* ---------- Buttons ---------- */
.btn{
  position:relative; overflow:hidden; isolation:isolate;
  display:inline-flex; align-items:center; justify-content:center; gap:.5rem;
  padding:.8rem 1.35rem; border-radius:999px;
  font-weight:600; font-size:.9rem; white-space:nowrap;
  transition:background-color .18s var(--ease), color .18s var(--ease), border-color .18s var(--ease), transform .18s var(--ease), box-shadow .18s var(--ease);
  border:1px solid transparent;
}
.btn .icon{ width:1rem; height:1rem; }
.btn::before{
  content:""; position:absolute; inset:0; z-index:0; pointer-events:none;
  background:linear-gradient(115deg, transparent 30%, rgba(255,255,255,.35) 48%, rgba(255,255,255,.35) 52%, transparent 70%);
  transform:translateX(-120%); transition:transform .55s var(--ease);
}
.btn:hover::before{ transform:translateX(120%); }
.btn > *{ position:relative; z-index:1; }
.btn:active{ transform:scale(.97); }
.btn-primary{ background:var(--ink); color:#fff; }
.btn-primary:hover{ background:var(--teal-600); transform:translateY(-1px); box-shadow:0 8px 20px -8px rgba(var(--gold-rgb),.5); }
.btn-outline{ border-color:rgba(6,10,31,.16); color:var(--ink); background:transparent; }
.btn-outline:hover{ border-color:var(--gold-500); color:var(--gold-700); }
.btn-white{ background:#fff; color:var(--ink); }
.btn-white:hover{ background:rgba(255,255,255,.9); }
.btn-primary-solid{ background: linear-gradient(135deg, var(--ink-800) 0%, var(--gold-500) 100%); color:#fff; border:none; box-shadow: 0 4px 14px rgba(212,160,23,.35); }
.btn-primary-solid:hover{ box-shadow: 0 8px 20px rgba(212,160,23,.45); transform: translateY(-2px); }
.btn-ghost-white{ border-color:rgba(255,255,255,.4); color:#fff; }
.btn-ghost-white:hover{ background:rgba(255,255,255,.1); }
.btn-sm{ padding:.55rem 1rem; font-size:.8rem; }
.btn-block{ width:100%; }
.btn:disabled{ opacity:.5; cursor:not-allowed; }
.btn:disabled::before{ display:none; }

.icon-btn, .icon-btn-label{
  position:relative; display:inline-flex; align-items:center; justify-content:center;
  height:2.5rem; width:2.5rem; border-radius:999px; color:var(--ink-600);
  transition:background-color .15s var(--ease), color .15s var(--ease), transform .18s var(--ease);
}
.icon-btn:hover, .icon-btn-label:hover{ background:var(--gold-50); color:var(--gold-700); transform:translateY(-1px) scale(1.06); }
.icon-btn:active, .icon-btn-label:active{ transform:scale(.94); }
.icon-btn .badge, .icon-btn-label .badge{
  position:absolute; top:-2px; right:-2px; min-width:18px; height:18px; padding:0 4px;
  border-radius:999px; background:var(--teal-500); color:#fff;
  font-size:.62rem; font-weight:700; display:flex; align-items:center; justify-content:center;
  font-family:var(--font-mono);
}
.icon-btn .badge.gold, .icon-btn-label .badge.gold{ background:var(--gax); }

/* ---------- Header ---------- */
.site-header{
  position:sticky; top:0; z-index:60;
  background:rgba(255,255,255,.92); backdrop-filter:blur(10px);
  border-bottom:1px solid var(--line);
}
.site-header::after{
  content:""; position:absolute; left:0; right:0; bottom:-2px; height:2px; z-index:1;
  background:linear-gradient(90deg, transparent 0%, var(--gold-500) 20%, var(--gold-300) 50%, var(--gold-500) 80%, transparent 100%);
}
.logo-chip{ transition:transform .25s var(--ease); }
.brand:hover .logo-chip{ transform:scale(1.06) rotate(-2deg); }
.utility-bar{ display:none; background:var(--ink); color:rgba(255,255,255,.85); font-size:.75rem; }
@media (min-width:768px){ .utility-bar{ display:block; } }
.utility-bar .container{ display:flex; align-items:center; justify-content:space-between; height:2.25rem; }
.utility-bar .division-links{ display:flex; align-items:center; gap:1.25rem; }
.utility-bar a{ font-weight:600; letter-spacing:.02em; transition:color .15s; }
.utility-bar a:hover{ color:#fff; }
.utility-bar .as-link{ background:none; border:0; padding:0; font:inherit; color:inherit; font-weight:600; letter-spacing:.02em; cursor:pointer; transition:color .15s; }
.utility-bar .as-link:hover{ color:#fff; }

/* ---------- Language selector (Google Translate, driven via cookie) ---------- */
/* Google's own popup widget is mounted off-screen (see layouts/app.blade.php)
   and driven purely through the googtrans cookie + a reload — its iframe-based
   popup UI is too fragile to restyle directly (internal class names Google can
   rename without notice, timing races on first paint). A plain <select> below
   is the only UI the visitor sees. Google still injects a top banner iframe
   when a translation is active, which is suppressed so it can't shift the
   layout or duplicate our own sticky header. */
body{ top:0 !important; }
.goog-te-banner-frame{ display:none !important; }
body > .skiptranslate{ display:none !important; }

.lang-select{ display:inline-flex; align-items:center; }
.lang-switch-select{ appearance:none; -webkit-appearance:none; -moz-appearance:none; background-color:rgba(255,255,255,.08); border:1px solid rgba(255,255,255,.28); color:rgba(255,255,255,.92); font:inherit; font-size:.76rem; font-weight:600; line-height:1; padding:.32rem 1.6rem .32rem .6rem; border-radius:999px; cursor:pointer; background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='6' viewBox='0 0 10 6'%3E%3Cpath d='M1 1l4 4 4-4' stroke='%23ffffff' stroke-width='1.4' fill='none' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E"); background-repeat:no-repeat; background-position:right .55rem center; background-size:.6rem; transition:background-color .15s; }
.lang-switch-select:hover, .lang-switch-select:focus{ background-color:rgba(255,255,255,.16); outline:none; }
.lang-switch-select option{ color:#111; background:#fff; }
.lang-select-mobile .lang-switch-select{ width:100%; background-color:var(--paper); border:1px solid var(--line); color:var(--ink); font-size:.85rem; padding:.6rem 1.8rem .6rem .95rem; background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='6' viewBox='0 0 10 6'%3E%3Cpath d='M1 1l4 4 4-4' stroke='%23555555' stroke-width='1.4' fill='none' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E"); background-position:right .85rem center; }
.lang-select-mobile .lang-switch-select:hover, .lang-select-mobile .lang-switch-select:focus{ background-color:var(--paper); border-color:var(--muted); }

.header-main{ display:flex; align-items:center; gap:1rem; height:4rem; }
@media (min-width:768px){ .header-main{ gap:2rem; height:5rem; } }

.brand{ display:flex; align-items:center; gap:.6rem; flex-shrink:0; }
.logo-chip{ display:flex; align-items:center; justify-content:center; height:3.4rem; flex-shrink:0; }
.logo-chip img{ display:block; height:100%; width:auto; border-radius:.4rem; transform:scaleX(1.15); }
@media (min-width:768px){ .logo-chip{ height:4.2rem; } }
.brand-text{ display:flex; flex-direction:column; line-height:1.05; }
.brand-text .name{ font-family:var(--font-display); font-weight:700; font-size:1.1rem; color:var(--ink); letter-spacing:-.01em; }
.brand-text .name em{ font-style:normal; color:var(--teal-500); }
.brand-text .sub{ font-size:.6rem; letter-spacing:.22em; color:var(--muted); text-transform:uppercase; }
@media (min-width:768px){ .brand-text .name{ font-size:1.25rem; } .brand-text .sub{ font-size:.65rem; } }

.menu-toggle{ display:inline-flex; padding:.5rem; margin-right:-.4rem; }
@media (min-width:768px){ .menu-toggle{ display:none; } }

.search-form{
  display:none; flex:1; align-items:center; height:2.75rem; border-radius:999px;
  border:1px solid var(--line); background:var(--paper); padding-inline:1rem; gap:.6rem;
  transition:border-color .15s, background-color .15s;
  position:relative;
}
.search-form:focus-within{ border-color:var(--teal-500); background:#fff; }
@media (min-width:768px){ .search-form{ display:flex; } }
.search-form .icon{ color:var(--muted); width:1.05rem; height:1.05rem; }
.search-form input{ flex:1; border:0; background:transparent; outline:none; font-size:.875rem; }
.search-form input::placeholder{ color:var(--muted); }

/* ---------- Header search — live suggestions dropdown ---------- */
.search-suggest{
  display:none; position:absolute; top:calc(100% + .65rem); left:0; right:0;
  background:#fff; border:1px solid var(--line); border-radius:var(--radius-lg);
  box-shadow:0 18px 44px -14px rgba(6,10,31,.22); z-index:60; overflow:hidden;
}
.search-suggest.open{ display:block; }
.search-suggest .ss-scroll{ max-height:22rem; overflow-y:auto; }
.search-suggest .ss-group-label{ font-size:.66rem; font-weight:800; text-transform:uppercase; letter-spacing:.07em; color:var(--muted); padding:.75rem 1rem .35rem; }
.search-suggest .ss-item{
  display:flex; align-items:center; gap:.75rem; padding:.55rem 1rem; text-decoration:none; color:inherit; cursor:pointer;
}
.search-suggest .ss-item:hover, .search-suggest .ss-item.active{ background:var(--paper); }
.search-suggest .ss-item .ss-thumb{
  width:2.5rem; height:2.5rem; border-radius:.65rem; flex-shrink:0; overflow:hidden; background:var(--paper);
  display:flex; align-items:center; justify-content:center;
}
.search-suggest .ss-item .ss-thumb img{ width:100%; height:100%; object-fit:cover; display:block; }
.search-suggest .ss-item .ss-thumb .icon{ width:1.1rem; height:1.1rem; color:var(--ink-600); }
.search-suggest .ss-item .ss-info{ flex:1; min-width:0; }
.search-suggest .ss-item .ss-name{ display:block; font-size:.85rem; font-weight:700; color:var(--ink-900); overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.search-suggest .ss-item .ss-meta{ font-size:.72rem; color:var(--muted); margin-top:.1rem; }
.search-suggest .ss-item .ss-price{ font-size:.82rem; font-weight:700; color:var(--ink); font-family:var(--font-mono); flex-shrink:0; }
.search-suggest .ss-item .ss-add{
  display:flex; align-items:center; justify-content:center; flex-shrink:0;
  height:2.1rem; width:2.1rem; border-radius:999px; background:var(--paper); color:var(--ink-600);
  transition:background-color .15s, color .15s;
}
.search-suggest .ss-item .ss-add:hover{ background:var(--teal-500); color:#fff; }
.search-suggest .ss-item .ss-add .icon{ width:1rem; height:1rem; }
.search-suggest .ss-empty{ padding:1.4rem 1rem; text-align:center; font-size:.82rem; color:var(--muted); }
.search-suggest .ss-viewall{
  display:flex; align-items:center; justify-content:center; gap:.4rem;
  padding:.8rem 1rem; font-size:.8rem; font-weight:700; color:var(--teal-600);
  border-top:1px solid var(--line); text-decoration:none; background:var(--paper);
}
.search-suggest .ss-viewall:hover{ background:#fff; }
.search-suggest .ss-viewall .icon{ width:.8rem; height:.8rem; }

.header-actions{ display:flex; align-items:center; gap:.15rem; margin-left:auto; }

/* ---------- Mobile search toggle ----------
   Desktop already shows .search-form inline in the header; on mobile it's
   hidden to save space, reachable instead via this icon which drops the
   same .search-form down as a full-width overlay — no markup duplicated. */
.mobile-search-toggle{ display:inline-flex; }
@media (min-width:768px){ .mobile-search-toggle{ display:none; } }
@media (max-width:767.98px){
  .search-form.mobile-open{
    display:flex; position:fixed; top:4rem; left:0; right:0; z-index:55;
    margin:0; padding:.85rem 1rem; border-radius:0; background:#fff;
    box-shadow:0 12px 28px -12px rgba(6,10,31,.22); border:0; border-bottom:1px solid var(--line);
  }
}

.nav-strip{ display:none; border-top:1px solid var(--line); }
@media (min-width:900px){ .nav-strip{ display:block; } }
.nav-strip .container{ display:flex; align-items:center; gap:1.75rem; height:2.75rem; font-size:.875rem; font-weight:500; color:var(--ink-600); }
.nav-strip a{ transition:color .15s, opacity .15s; white-space:nowrap; }
.nav-strip a:hover{ color:var(--teal-600); }
.nav-strip a.division{ font-weight:700; }
.nav-strip a.division:hover{ opacity:.8; }
.nav-strip .spacer{ margin-left:auto; }
.nav-strip a.active{ color:var(--teal-600); }

/* Mobile drawer */
.drawer-overlay{
  position:fixed; inset:0; z-index:100; background:rgba(6,10,31,.45);
  opacity:0; pointer-events:none; transition:opacity .25s var(--ease);
}
.drawer-overlay.open{ opacity:1; pointer-events:auto; }
.drawer{
  position:fixed; inset:0 0 0 auto; z-index:101; width:85%; max-width:24rem;
  background:#fff; padding:1.25rem 1.5rem; display:flex; flex-direction:column; gap:.25rem;
  overflow-y:auto; transform:translateX(100%); transition:transform .3s var(--ease);
  box-shadow:var(--shadow-pop); border-left:1px solid var(--line);
}
.drawer.open{ transform:translateX(0); }
.drawer-head{ display:flex; align-items:center; justify-content:space-between; margin-bottom:1.5rem; padding-bottom:1rem; border-bottom:1px solid var(--line); }
.drawer a{ display:flex; align-items:center; padding:.6rem .75rem; font-weight:500; font-size:.95rem; border-radius:.6rem; color:var(--ink-700); transition:background-color .15s, color .15s; }
.drawer a.division{ font-weight:600; font-size:.9rem; border-left:3px solid currentColor; margin-left:.25rem; padding-left:.75rem; border-radius:0 .6rem .6rem 0; }
.drawer a:hover{ background:var(--paper); color:var(--ink-900); }
.drawer a.division:hover{ opacity:1; filter:brightness(0.9); }
.drawer hr{ border:0; border-top:1px solid var(--line); margin:1rem 0; }

/* ---------- Footer ---------- */
.site-footer{ background:var(--ink); color:rgba(255,255,255,.8); margin-top:5rem; }
body[data-page="account"] .site-footer{ margin-top:0; }
.footer-grid{ display:grid; gap:2.5rem; padding-block:3.5rem; grid-template-columns:1fr; }
@media (min-width:640px){ .footer-grid{ grid-template-columns:1fr 1fr; } }
@media (min-width:1024px){ .footer-grid{ grid-template-columns:1.6fr 1fr 1fr 1fr 1.2fr; gap:1.5rem; padding-block:4rem; } }
.footer-brand{ display:flex; align-items:center; gap:.6rem; margin-bottom:1rem; }
.footer-brand span{ font-family:var(--font-display); font-weight:700; font-size:1.1rem; color:#fff; }
.footer-brand span em{ font-style:normal; color:var(--teal-400); }
.footer-col h3{ font-family:var(--font-display); font-weight:600; font-size:.8rem; letter-spacing:.06em; text-transform:uppercase; color:#fff; margin-bottom:1rem; }
.footer-col h3.mt{ margin-top:1.5rem; }
.footer-col ul{ display:flex; flex-direction:column; gap:.65rem; font-size:.875rem; }
.footer-col a{ transition:color .15s; }
.footer-col a:hover{ color:#fff; }
.footer-col li.row{ display:flex; gap:.6rem; align-items:flex-start; font-size:.875rem; }
.footer-col li.row .icon{ margin-top:.15rem; color:var(--teal-400); flex-shrink:0; }
.footer-social{ display:flex; gap:.6rem; margin-top:1.1rem; }
.footer-social a{ display:flex; align-items:center; justify-content:center; height:2.2rem; width:2.2rem; border-radius:999px; background:rgba(255,255,255,.08); transition:background-color .15s; }
.footer-social a:hover{ background:rgba(255,255,255,.18); }
.footer-bottom{ border-top:1px solid rgba(255,255,255,.1); }
.footer-bottom .container{ display:flex; flex-direction:column; gap:.6rem; align-items:center; justify-content:space-between; padding-block:1.25rem; font-size:.75rem; color:rgba(255,255,255,.5); }
@media (min-width:640px){ .footer-bottom .container{ flex-direction:row; } }

/* ---------- Cards & sections ---------- */
.eyebrow{ font-size:.75rem; font-weight:700; text-transform:uppercase; letter-spacing:.12em; color:var(--teal-600); margin-bottom:.5rem; }
.section-head{ display:flex; flex-direction:column; gap:1rem; margin-bottom:2rem; }
@media (min-width:768px){ .section-head{ flex-direction:row; align-items:flex-end; justify-content:space-between; } }
.section-head h2{ font-family:var(--font-display); font-weight:700; font-size:1.6rem; letter-spacing:-.01em; }
@media (min-width:768px){ .section-head h2{ font-size:2rem; } }
.section-head p{ color:var(--muted); margin-top:.5rem; max-width:36rem; font-size:.95rem; }
.section-head .head-link{ display:inline-flex; align-items:center; gap:.4rem; font-weight:600; font-size:.875rem; flex-shrink:0; transition:color .15s; }
.section-head .head-link:hover{ color:var(--teal-600); }
.section-head .head-link .icon{ width:.9rem; height:.9rem; }

.card{
  border:1px solid var(--line); background:var(--surface); border-radius:var(--radius-lg);
  box-shadow:var(--shadow-card);
  transition:box-shadow .2s var(--ease), transform .2s var(--ease), border-color .2s var(--ease);
}
.card-hover:hover{ box-shadow:var(--shadow-lift); transform:translateY(-3px); }

.modal-overlay{
  position:fixed; inset:0; z-index:200; background:rgba(6,10,31,.45);
  display:flex; align-items:center; justify-content:center; padding:1.25rem;
}
.modal-card{
  width:100%; max-width:28rem; max-height:90vh; overflow-y:auto;
  background:var(--surface); border-radius:var(--radius-lg); box-shadow:var(--shadow-lift);
  padding:1.5rem;
}

.stat-value{ font-family:var(--font-display); font-weight:700; font-size:1.5rem; }
.stat-label{ font-size:.75rem; color:var(--muted); margin-top:.15rem; }

/* ---------- Hero ---------- */
.hero{
  position:relative; overflow:hidden; border-bottom:1px solid var(--line);
  background: var(--hub-gradient-soft), var(--paper);
}
.hero .bg-grid{ position:absolute; inset:0; opacity:.4; -webkit-mask-image:radial-gradient(ellipse at top, black, transparent 70%); mask-image:radial-gradient(ellipse at top, black, transparent 70%); }
.hero-inner{ position:relative; display:grid; gap:2.75rem; align-items:start; }
@media (min-width:960px){ .hero-inner{ grid-template-columns:1.05fr .95fr; } }
.hero-badge{ display:inline-flex; align-items:center; gap:.5rem; font-size:.72rem; font-weight:700; text-transform:uppercase; letter-spacing:.1em; color:var(--teal-600); background:rgba(255,255,255,.75); border:1px solid rgba(212,160,23,.25); border-radius:999px; padding:.4rem .9rem; margin-bottom:1.25rem; }
.hero h1{ font-family:var(--font-display); font-weight:700; font-size:2.2rem; line-height:1.08; letter-spacing:-.02em; }
@media (min-width:640px){ .hero h1{ font-size:2.75rem; } }
@media (min-width:960px){ .hero h1{ font-size:3.1rem; } }
.hero p.lead{ margin-top:1.2rem; font-size:1rem; color:var(--muted); max-width:32rem; line-height:1.65; }
@media (min-width:768px){ .hero p.lead{ font-size:1.08rem; } }
.hero-cta{ display:flex; flex-wrap:wrap; gap:.75rem; margin-top:2rem; }
.hero-stats{ display:grid; grid-template-columns:repeat(3,1fr); max-width:26rem; gap:1rem; border-top:1px solid rgba(6,10,31,.1); padding-top:1.4rem; margin-top:2.4rem; }

.hub-orbit{ position:relative; margin-inline:auto; aspect-ratio:1; width:100%; max-width:23rem; }
.hub-orbit svg.rings{ position:absolute; inset:0; height:100%; width:100%; }
.orbit-ring{ position:absolute; inset:0; animation:spin 44s linear infinite; }
.orbit-node{ position:absolute; transform:translate(-50%,-50%); animation:spin-rev 44s linear infinite; }
.orbit-node .chip{ display:flex; align-items:center; gap:.5rem; border-radius:999px; background:#fff; padding:.4rem .85rem .4rem .4rem; box-shadow:var(--shadow-card); border:1px solid; }

.orbit-node .chip .dot{ display:flex; align-items:center; justify-content:center; height:1.75rem; width:1.75rem; border-radius:999px; color:#fff; }
.orbit-node .chip .dot .icon{ width:.85rem; height:.85rem; }
.orbit-node .chip span.code{ font-family:var(--font-display); font-weight:700; font-size:.72rem; }
.hub-center{ position:absolute; inset:0; display:flex; align-items:center; justify-content:center; }
.hub-center-inner{ display:flex; height:7rem; width:7rem; flex-direction:column; align-items:center; justify-content:center; border-radius:999px; background:var(--hub-gradient); color:#fff; box-shadow:var(--shadow-lift); text-align:center; }
@media (min-width:768px){ .hub-center-inner{ height:8rem; width:8rem; } }
.hub-center-inner .t1{ font-family:var(--font-display); font-weight:700; font-size:.85rem; letter-spacing:.02em; }
.hub-center-inner .t2{ font-size:.58rem; letter-spacing:.2em; text-transform:uppercase; color:rgba(255,255,255,.8); }

@keyframes spin{ from{ transform:rotate(0);} to{ transform:rotate(360deg);} }
@keyframes spin-rev{ from{ transform:rotate(360deg);} to{ transform:rotate(0);} }

/* Hero visual column (orbit + stats card + pricing explorer stack) */
.hero-visual{ display:flex; flex-direction:column; align-items:center; width:100%; }

/* Hero stats card (right column, fills the space below the orbit) */
.hero-stats-card{
  width:100%;
  max-width:28rem;
  background:#fff;
  border:1px solid rgba(228,232,238,.9);
  border-radius:1rem;
  padding:1.35rem 1.5rem;
  box-shadow:0 20px 44px -30px rgba(6,10,31,.35), 0 1px 0 rgba(255,255,255,.9) inset;
}
.hero-stats-card-eyebrow{
  font-size:.68rem;
  font-weight:700;
  text-transform:uppercase;
  letter-spacing:.08em;
  color:var(--teal-600);
  margin-bottom:1rem;
}
.hero-stats-card .hero-stats{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  max-width:none;
  gap:0;
  border-top:0;
  padding-top:0;
  margin-top:0;
}
.hero-stats-card .hero-stats > div{ display:flex; align-items:center; gap:.65rem; padding:0 .9rem; }
.hero-stats-card .hero-stats > div:first-child{ padding-left:0; }
.hero-stats-card .hero-stats > div:last-child{ padding-right:0; }
.hero-stats-card .hero-stats > div + div{ border-left:1px solid rgba(6,10,31,.1); }
.hero-stats-card .stat-icon{ width:2.5rem; height:2.5rem; margin-bottom:0; flex-shrink:0; }
.hero-stats-card .stat-icon .icon{ width:1.1rem; height:1.1rem; }
.hero-stats-card .stat-text{ display:flex; flex-direction:column; min-width:0; }
.hero-stats-card .stat-value{ font-size:1.35rem; line-height:1.1; color:#101A45; }
.hero-stats-card .stat-label{ font-size:.72rem; color:var(--muted); margin-top:.15rem; white-space:nowrap; }
@media (max-width:640px){
  .hero-stats-card{ padding:1.15rem 1.25rem; }
  .hero-stats-card .hero-stats{ grid-template-columns:1fr; gap:.75rem; }
  .hero-stats-card .hero-stats > div{ padding:0; }
  .hero-stats-card .hero-stats > div + div{ border-left:0; padding-top:.75rem; border-top:1px solid rgba(6,10,31,.1); }
}

/* Pricing explorer card */
.pricing-explorer{ border:1px solid var(--line); background:#fff; box-shadow:var(--shadow-lift); border-radius:var(--radius-lg); padding:1.4rem; width:100%; max-width:24rem; }
.pricing-explorer .pe-title{ font-size:.68rem; font-weight:700; text-transform:uppercase; letter-spacing:.08em; color:var(--teal-600); }
.pricing-explorer .pe-desc{ font-size:.82rem; color:var(--muted); margin-top:.3rem; margin-bottom:1.1rem; }
.pe-product{ display:flex; align-items:center; gap:.75rem; margin-bottom:1rem; }
.pe-product .thumb{ height:3.2rem; width:3.2rem; flex-shrink:0; }
.pe-product .name{ font-size:.875rem; font-weight:600; }
.pe-product .meta{ font-size:.72rem; color:var(--muted); }
.field-label{ font-size:.68rem; color:var(--muted); text-transform:uppercase; letter-spacing:.06em; margin-bottom:.4rem; }
.segmented{ display:grid; grid-template-columns:1fr 1fr; gap:.4rem; border-radius:.6rem; background:var(--paper); padding:.25rem; }
.segmented button{ display:flex; align-items:center; justify-content:center; gap:.4rem; border-radius:.45rem; padding:.55rem; font-size:.75rem; font-weight:600; color:var(--ink-600); transition:background-color .15s,color .15s,box-shadow .15s; }
.segmented button:hover{ background:#fff; }
.segmented button.active{ background:var(--ink); color:#fff; box-shadow:var(--shadow-card); }
.segmented button .icon{ width:.85rem; height:.85rem; }
.pe-price-box{ margin-top:1.1rem; border-radius:.75rem; background:var(--paper); padding:.9rem 1rem; display:flex; align-items:center; justify-content:space-between; gap:.75rem; flex-wrap:wrap; }
.pe-price-box .final{ font-size:1.5rem; font-weight:700; }
.pe-price-box .mrp{ font-size:.85rem; color:var(--muted); text-decoration:line-through; margin-left:.4rem; }
.save-pill{ font-size:.7rem; font-weight:700; color:var(--max-dark); background:var(--max-tint); padding:.25rem .6rem; border-radius:999px; }
.std-pill{ font-size:.7rem; font-weight:700; color:var(--muted); background:rgba(228,232,238,.6); padding:.25rem .6rem; border-radius:999px; }
.pe-samples{ display:flex; gap:.4rem; margin-top:.9rem; flex-wrap:wrap; }
.pe-samples button{ font-size:.72rem; padding:.35rem .7rem; border-radius:999px; border:1px solid var(--line); color:var(--muted); transition:.15s; }
.pe-samples button.active{ border-color:var(--teal-500); background:rgba(212,160,23,.1); color:var(--teal-600); font-weight:600; }

/* Home hero visual refresh */
.hero{
  background:
    radial-gradient(circle at 74% 18%, rgba(6,10,31,.09), transparent 28rem),
    radial-gradient(circle at 34% 76%, rgba(212,160,23,.14), transparent 24rem),
    linear-gradient(135deg, #F9FAFC 0%, #F5F6FA 50%, #FFFCF4 100%);
  border-bottom:0;
}
.hero::before{
  content:"";
  position:absolute;
  inset:0;
  background-image:
    linear-gradient(to right, rgba(6,10,31,.025) 1px, transparent 1px),
    linear-gradient(to bottom, rgba(6,10,31,.025) 1px, transparent 1px);
  background-size:46px 46px;
  -webkit-mask-image:radial-gradient(ellipse at center, black, transparent 76%);
  mask-image:radial-gradient(ellipse at center, black, transparent 76%);
}
.hero .bg-grid{ display:none; }
.hero-inner{ min-height:47rem; gap:4.5rem; padding-block:5.5rem 6.5rem; }
@media (min-width:960px){ .hero-inner{ grid-template-columns:.98fr 1.02fr; padding-block:6rem 7rem; } }
.hero-badge{
  color:#FF6A00;
  background:rgba(255,255,255,.9);
  border-color:rgba(255,106,0,.18);
  box-shadow:0 10px 26px -16px rgba(255,106,0,.65), 0 1px 0 rgba(255,255,255,.95) inset;
  margin-bottom:2rem;
}
.hero-badge .icon{ width:.9rem; height:.9rem; }
.hero h1{
  max-width:39rem;
  color:#142152;
  font-size:clamp(2.55rem, 5vw, 4.25rem);
  line-height:1.08;
  letter-spacing:0;
}
.hero h1 span{
  display:block !important;
  color:transparent;
  background:linear-gradient(90deg, #248BD4 0%, #27B9D8 45%, #48C87C 100%);
  -webkit-background-clip:text;
  background-clip:text;
}
.hero p.lead{
  max-width:39rem;
  color:#536380;
  font-size:1.08rem;
  line-height:1.75;
  margin-top:1.65rem;
}
.hero-cta{ gap:1rem; margin-top:2.25rem; }
.hero-cta .btn{ min-width:11.5rem; padding:.95rem 1.55rem; box-shadow:0 14px 30px -22px rgba(6,10,31,.45); }
.hero-cta .btn-outline{ background:rgba(255,255,255,.72); }
.hero-stats{
  max-width:34rem;
  gap:0;
  margin-top:2.75rem;
  padding-top:1.9rem;
}
.hero-stats > div{
  min-width:0;
  padding-right:1.8rem;
}
.hero-stats > div + div{
  border-left:1px solid rgba(6,10,31,.12);
  padding-left:2rem;
}
.stat-icon{
  display:flex;
  align-items:center;
  justify-content:center;
  width:3.25rem;
  height:3.25rem;
  border:1px solid currentColor;
  border-radius:.8rem;
  margin-bottom:1.3rem;
  background:#fff;
  box-shadow:0 14px 26px -18px currentColor;
}
.stat-icon .icon{ width:1.45rem; height:1.45rem; }
.stat-blue{ color:#1E88C7; background:#EFF8FF; }
.stat-green{ color:#2FA84F; background:#EDFBF1; }
.stat-orange{ color:#F2811D; background:#FFF3E8; }
.hero .stat-value{ color:#101A45; font-size:1.9rem; line-height:1; }
.hero .stat-label{ color:#101A45; font-size:.9rem; margin-top:.45rem; }
.hero-assurance{
  display:grid;
  grid-template-columns:repeat(3, minmax(0, 1fr));
  gap:0;
  max-width:34rem;
  margin-top:3rem;
  padding:1rem 1.25rem;
  border:1px solid rgba(228,232,238,.8);
  border-radius:.55rem;
  background:rgba(255,255,255,.55);
  box-shadow:0 16px 38px -30px rgba(6,10,31,.35);
  backdrop-filter:blur(12px);
}
.hero-assurance div{ display:grid; grid-template-columns:auto 1fr; column-gap:.75rem; align-items:center; padding:.25rem .65rem; }
.hero-assurance div + div{ border-left:1px solid rgba(6,10,31,.1); }
.hero-assurance .icon{ grid-row:1 / span 2; width:1.65rem; height:1.65rem; color:#142152; }
.hero-assurance strong{ font-size:.72rem; line-height:1.15; color:#142152; }
.hero-assurance small{ color:#536380; font-size:.68rem; }
.hero-inner > div:last-child{
  gap:2.15rem !important;
  align-self:start;
  padding-top:.6rem;
}
.hub-orbit{ max-width:28rem; }
.hub-orbit svg.rings circle{
  stroke:#DCE5EF;
  stroke-dasharray:3 4;
}
.hub-orbit::before{
  content:"";
  position:absolute;
  inset:3.2rem;
  border:1px dashed #DCE5EF;
  border-radius:999px;
}
.hub-orbit::after{
  content:"";
  position:absolute;
  left:50%;
  top:8%;
  height:40%;
  border-left:1px dashed rgba(212,160,23,.5);
  transform:translateX(-50%);
}
.orbit-ring{ animation:none; }
.orbit-node{ animation:none; z-index:2; }
.orbit-node .chip{
  position:relative;
  gap:.55rem;
  padding:.45rem .95rem .45rem .45rem;
  border-color:currentColor !important;
  box-shadow:0 14px 24px -16px currentColor, 0 1px 0 rgba(255,255,255,.9) inset;
}
.orbit-node .chip::before{
  content:"";
  position:absolute;
  width:.35rem;
  height:.35rem;
  border-radius:999px;
  background:currentColor;
}
.orbit-node:nth-child(1) .chip::before{ left:50%; bottom:-1.1rem; }
.orbit-node:nth-child(2) .chip::before{ left:-1.1rem; top:50%; }
.orbit-node:nth-child(3) .chip::before{ right:-1.1rem; top:50%; }
.orbit-node .chip .dot{ width:2.1rem; height:2.1rem; }
.orbit-node .chip span.code{ font-size:.8rem; letter-spacing:.02em; }
.hub-center{ z-index:1; }
.hub-center-inner{
  width:8.7rem;
  height:8.7rem;
  background:linear-gradient(135deg, #0F5FAD 0%, #16A9D7 50%, #4CCB8A 100%);
  box-shadow:0 20px 38px -20px rgba(6,10,31,.45);
}
.hub-center-inner .t1{ font-size:1.1rem; }
.hub-center-inner .t2{ font-size:.68rem; }
.pricing-explorer{
  max-width:30rem;
  border:0;
  border-radius:1rem;
  padding:1.8rem;
  box-shadow:0 26px 64px -34px rgba(6,10,31,.38), 0 1px 0 rgba(255,255,255,.9) inset;
}
.pricing-explorer .pe-title{ color:#FF6A00; font-size:.76rem; letter-spacing:.08em; }
.pricing-explorer .pe-desc{ color:#142152; font-size:.95rem; line-height:1.55; max-width:25rem; }
.pe-product{ gap:1rem; margin-block:1.25rem 1.05rem; }
.pe-product .thumb{ width:4.7rem; height:4.7rem; border-radius:.75rem; }
.pe-product .name{ color:#142152; font-size:1.2rem; }
.pe-product .meta{ color:#536380; font-size:.86rem; }
.field-label{ color:#536380; font-size:.73rem; font-weight:700; letter-spacing:.08em; }
.segmented{
  gap:.55rem;
  border-radius:.7rem;
  padding:.35rem;
  background:#F1F4F8;
}
.segmented button{
  min-height:2.45rem;
  border-radius:.5rem;
  color:#1850A5;
  font-size:.82rem;
}
.segmented button.active{ background:#142152; color:#fff; }
.pe-price-box{
  margin-top:1.5rem;
  border-radius:.8rem;
  background:linear-gradient(135deg, #F7F8FA, #EEF2F6);
  padding:1rem 1.15rem;
}
.pe-price-box .final{ color:#142152; font-size:2rem !important; font-family:var(--font-display); }
.std-pill{ color:#394B69; background:rgba(228,232,238,.9); }
.pe-samples{ gap:.55rem; margin-top:1rem; }
.pe-samples button{
  background:#fff;
  color:#536380;
  border-color:#C9D2DE;
  font-size:.8rem;
  padding:.5rem .85rem;
}
.pe-samples button.active{ border-color:#FF6A00; background:#FFF6EC; color:#FF6A00; }

@media (max-width:959px){
  .hero-inner{ min-height:0; padding-block:4rem 4.75rem; }
  .hero-stats, .hero-assurance{ max-width:none; }
  .hero-inner > div:last-child{ padding-top:0; }
}
@media (max-width:640px){
  .hero-inner{ gap:3rem; padding-block:3rem 3.75rem; }
  .hero h1{ font-size:2.45rem; }
  .hero-cta .btn{ width:100%; }
  .hero-stats{ grid-template-columns:1fr; gap:1rem; }
  .hero-stats > div{ display:grid; grid-template-columns:auto 1fr; column-gap:1rem; align-items:center; padding:0; }
  .hero-stats > div + div{ border-left:0; padding-left:0; }
  .stat-icon{ grid-row:1 / span 2; margin-bottom:0; }
  .hero-assurance{ grid-template-columns:1fr; }
  .hero-assurance div + div{ border-left:0; border-top:1px solid rgba(6,10,31,.1); }
  .hub-orbit{ max-width:20rem; }
  .hub-center-inner{ width:7.2rem; height:7.2rem; }
  .orbit-node .chip{ transform:scale(.88); }
  .pricing-explorer{ padding:1.25rem; }
}

/* Global sticky pricing bar (mobile) */
.profile-bar{ position:sticky; top:calc(4rem + 1px); z-index:40; background:#fff; border-bottom:1px solid var(--line); }
@media (min-width:768px){ .profile-bar{ top:calc(5rem + 2.75rem + 1px); } }
.profile-bar .container{ display:flex; align-items:center; gap:.75rem; padding-block:.55rem; flex-wrap:wrap; font-size:.75rem; }
.profile-bar .grp{ display:flex; align-items:center; gap:.3rem; background:var(--paper); border-radius:999px; padding:.2rem; }
.profile-bar button{ padding:.35rem .7rem; border-radius:999px; font-weight:600; color:var(--ink-600); }
.profile-bar button.active{ background:var(--ink); color:#fff; }
.profile-bar .label{ color:var(--muted); font-weight:600; }

/* ---------- Banner slider ---------- */
.banner-slider-section{ width:100%; }
/* The uploaded banner set isn't one fixed ratio — some are 1920x480 (4/1),
   others 1920x~790 (~2.4/1) — so this is sized around the taller ones
   (2.5/1) rather than the short 4/1 that was cropping them down hard and
   reading as "compressed". A taller band with a higher max-height gives
   every slide real presence instead of a squeezed sliver. */
.banner-slider{ position:relative; overflow:hidden; width:100%; aspect-ratio:16/5; max-height:36rem; background:var(--ink); }
@media (max-width:767px){ .banner-slider{ aspect-ratio:6/5; max-height:26rem; } }
.bs-slide{ position:absolute; inset:0; opacity:0; visibility:hidden; transition:opacity .8s var(--ease); }
.bs-slide.active{ opacity:1; visibility:visible; z-index:1; }
.bs-slide img{ width:100%; height:100%; object-fit:cover; object-position:center; display:block; }
.bs-slide > a{ display:block; width:100%; height:100%; }
.bs-mobile-hide{ display:block; }
@media (max-width:767px){ .bs-mobile-hide{ display:none; } }
.bs-scrim{ position:absolute; inset:0; background:linear-gradient(100deg, rgba(6,17,32,.82) 0%, rgba(6,17,32,.5) 40%, rgba(6,17,32,.08) 72%); }
.bs-slide.bs-plain .bs-scrim{ background:linear-gradient(to top, rgba(6,17,32,.75) 0%, rgba(6,17,32,0) 45%); }
.bs-content{ position:absolute; inset:0; z-index:1; display:flex; flex-direction:column; justify-content:center; padding:2rem 2.75rem; max-width:32rem; color:#fff; }
@media (min-width:768px){ .bs-content{ padding:2.75rem 3.5rem; } }
.bs-slide.bs-plain .bs-content{ justify-content:flex-end; max-width:none; padding-bottom:2.25rem; }
.bs-eyebrow{ display:inline-flex; align-self:flex-start; text-transform:uppercase; letter-spacing:.1em; font-size:.7rem; font-weight:700; margin-bottom:.85rem; padding:.35rem .8rem; border-radius:999px; background:rgba(255,255,255,.14); backdrop-filter:blur(2px); }
.bs-content h2{ font-family:var(--font-display); font-weight:700; font-size:1.5rem; line-height:1.18; margin-bottom:.7rem; letter-spacing:-.01em; }
@media (min-width:640px){ .bs-content h2{ font-size:1.9rem; } }
@media (min-width:960px){ .bs-content h2{ font-size:2.25rem; } }
.bs-content .bs-sub{ font-size:.88rem; line-height:1.6; opacity:.88; margin-bottom:1.5rem; max-width:28rem; }
@media (min-width:640px){ .bs-content .bs-sub{ font-size:.98rem; } }
.bs-arrow{ position:absolute; top:50%; transform:translateY(-50%); z-index:3; height:2.5rem; width:2.5rem; border-radius:999px; background:var(--ink); box-shadow:var(--shadow-card); display:flex; align-items:center; justify-content:center; color:#fff; transition:background-color .15s, transform .15s; }
.bs-arrow:hover{ background:var(--ink-700); transform:translateY(-50%) scale(1.06); }
.bs-arrow .icon{ width:1.1rem; height:1.1rem; }
.bs-prev{ left:.9rem; } .bs-next{ right:.9rem; }
@media (max-width:640px){ .bs-arrow{ display:none; } }
.bs-dots{ position:absolute; bottom:1rem; left:50%; transform:translateX(-50%); z-index:3; display:flex; gap:.45rem; }
.bs-dots button{ height:.5rem; width:.5rem; border-radius:999px; background:rgba(255,255,255,.85); border:1.5px solid var(--ink); transition:width .25s var(--ease), background-color .25s, border-color .25s; padding:0; }
.bs-dots button.active{ width:1.5rem; background:var(--ink); border-color:var(--ink); }

/* ---------- Trust strip ---------- */
.trust-strip{ border-block:1px solid var(--line); background:var(--surface); }
.trust-grid{ display:grid; gap:2rem; padding-block:2.75rem; grid-template-columns:1fr; }
@media (min-width:640px){ .trust-grid{ grid-template-columns:1fr 1fr; } }
@media (min-width:1024px){ .trust-grid{ grid-template-columns:repeat(4,1fr); } }
.trust-item{ display:flex; gap:.9rem; }
.trust-item .ico{ flex-shrink:0; display:flex; align-items:center; justify-content:center; height:2.4rem; width:2.4rem; border-radius:.7rem; background:rgba(212,160,23,.1); color:var(--teal-600); }
.trust-item h3{ font-size:.9rem; font-weight:600; margin-bottom:.25rem; }
.trust-item p{ font-size:.78rem; color:var(--muted); line-height:1.5; }

/* ---------- Division cards ---------- */
.divisions-section{ padding-block:2rem; }
@media (min-width:768px){ .divisions-section{ padding-block:3rem; } }
.divisions-section .section-head{ margin-bottom:1rem; }
.divisions-section .eyebrow{
  color:#0B5FA5;
  font-size:.75rem;
  letter-spacing:.08em;
  margin-bottom:0;
}
.division-grid{ display:grid; gap:1.15rem; grid-template-columns:1fr; }
@media (min-width:640px){ .division-grid{ grid-template-columns:1fr 1fr; } }
@media (min-width:1024px){ .division-grid{ grid-template-columns:repeat(3,1fr); } }
.division-card{
  position:relative;
  display:block;
  min-height:17.2rem;
  overflow:hidden;
  border:0;
  border-radius:.62rem;
  color:#fff;
  background:var(--division-color);
  box-shadow:0 12px 26px -18px rgba(6,10,31,.38);
  transition:transform .22s var(--ease), box-shadow .22s var(--ease);
}
.division-card:hover{ transform:translateY(-3px); box-shadow:0 18px 36px -22px rgba(6,10,31,.5); }
.division-card > img{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  object-fit:cover;
  transition:transform .45s var(--ease);
}
.division-card:hover > img{ transform:scale(1.045); }
.division-card .dc-wash{
  position:absolute;
  inset:0;
  background:
    linear-gradient(112deg, color-mix(in srgb, var(--division-color) 84%, #111 16%) 0%, color-mix(in srgb, var(--division-color) 64%, transparent) 44%, rgba(255,255,255,.04) 100%),
    linear-gradient(180deg, rgba(6,10,31,.22) 0%, rgba(6,10,31,.12) 42%, rgba(6,10,31,.2) 100%);
}
.division-card-max .dc-wash{
  background:
    linear-gradient(112deg, rgba(29,124,57,.9) 0%, rgba(47,168,79,.55) 48%, rgba(47,168,79,.1) 100%),
    linear-gradient(180deg, rgba(6,10,31,.2), rgba(6,10,31,.14));
}
.division-card-gax .dc-wash{
  background:
    linear-gradient(112deg, rgba(213,108,18,.88) 0%, rgba(242,129,29,.6) 47%, rgba(255,190,88,.14) 100%),
    linear-gradient(180deg, rgba(6,10,31,.14), rgba(6,10,31,.18));
}
.division-card .dc-content{
  position:relative;
  z-index:1;
  padding:1rem 1rem 4.7rem;
  max-width:14.5rem;
}
.division-card .dc-badge{
  display:inline-flex;
  align-items:center;
  gap:.35rem;
  min-height:1.55rem;
  padding:.22rem .55rem .22rem .28rem;
  margin-bottom:1.1rem;
  border-radius:999px;
  background:rgba(255,255,255,.92);
  color:var(--division-dark);
  font-size:.62rem;
  font-weight:800;
  letter-spacing:.02em;
  box-shadow:0 8px 18px -14px rgba(6,10,31,.55);
}
.division-card .dc-badge .icon{
  width:1rem;
  height:1rem;
  padding:.2rem;
  border-radius:999px;
  color:#fff;
  background:var(--division-color);
  stroke-width:2.3;
}
.division-card h3{
  font-family:var(--font-display);
  font-size:1.18rem;
  line-height:1.12;
  letter-spacing:0;
  margin-bottom:.55rem;
  text-shadow:0 1px 1px rgba(6,10,31,.14);
}
.division-card p{
  max-width:12rem;
  color:rgba(255,255,255,.9);
  font-size:.74rem;
  font-weight:600;
  line-height:1.45;
}
.division-card .dc-shop{
  position:absolute;
  z-index:1;
  left:1rem;
  bottom:1rem;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:.5rem;
  min-width:6.4rem;
  min-height:2.15rem;
  padding:.5rem .85rem;
  border-radius:999px;
  background:#fff;
  color:var(--division-dark);
  font-size:.72rem;
  font-weight:800;
  box-shadow:0 10px 22px -14px rgba(6,10,31,.55);
}
.division-card .dc-shop .icon{ width:.82rem; height:.82rem; }
.division-card-fax > img{ object-position:58% center; }
.division-card-max > img{ object-position:58% center; }
.division-card-gax > img{ object-position:64% center; }
@media (min-width:1024px){
  .division-card{ min-height:16.2rem; }
}
@media (max-width:640px){
  .division-card{ min-height:18rem; }
  .division-card .dc-content{ max-width:15.5rem; }
}

/* ---------- Category cards ---------- */
.category-grid{ display:grid; gap:1.1rem; grid-template-columns:repeat(2,1fr); }
@media (min-width:640px){ .category-grid{ grid-template-columns:repeat(3,1fr); } }
@media (min-width:1024px){ .category-grid{ grid-template-columns:repeat(5,1fr); } }
.category-card{
  display:flex; flex-direction:column; overflow:hidden;
  border-radius:var(--radius-lg); border:1px solid var(--line); background:var(--surface);
  transition:border-color .18s, box-shadow .18s, transform .18s var(--ease);
}
.category-card:hover{ border-color:rgba(212,160,23,.55); box-shadow:var(--shadow-lift), 0 0 22px -6px rgba(212,160,23,.35); transform:translateY(-3px); }
.category-card .cc-media{ position:relative; aspect-ratio:4/3; overflow:hidden; background:var(--paper); }
.category-card .cc-media img{ width:100%; height:100%; object-fit:cover; display:block; transition:transform .35s var(--ease); }
.category-card:hover .cc-media img{ transform:scale(1.07); }
.category-card .cat-icon{ position:absolute; top:.55rem; left:.55rem; display:inline-flex; height:2.1rem; width:2.1rem; align-items:center; justify-content:center; border-radius:.6rem; background:rgba(255,255,255,.92); box-shadow:var(--shadow-card); backdrop-filter:blur(2px); }
.category-card .cat-icon .icon{ width:1rem; height:1rem; }
.category-card .cc-body{ padding:.8rem .9rem .9rem; }
.category-card p.name{ font-size:.875rem; font-weight:600; line-height:1.35; transition:color .15s; }
.category-card:hover p.name{ color:var(--teal-600); }
.category-card p.count{ font-size:.72rem; color:var(--muted); margin-top:.15rem; }

/* ---------- How it works ---------- */
.steps-grid{ display:grid; border-radius:var(--radius-lg); overflow:hidden; border:1px solid var(--line); background:var(--line); gap:1px; grid-template-columns:1fr; }
@media (min-width:768px){ .steps-grid{ grid-template-columns:repeat(4,1fr); } }
.step-item{ background:var(--surface); padding:1.5rem; display:flex; flex-direction:column; gap:1rem; }
.step-top{ display:flex; align-items:center; justify-content:space-between; }
.step-num{ display:flex; height:2.5rem; width:2.5rem; align-items:center; justify-content:center; border-radius:999px; background:var(--hub-gradient); color:#fff; }
.step-idx{ font-family:var(--font-mono); font-size:.72rem; color:var(--line); font-weight:700; }
.step-item h3{ font-family:var(--font-display); font-weight:600; font-size:1rem; margin-bottom:.35rem; }
.step-item p{ font-size:.85rem; color:var(--muted); line-height:1.55; }

/* ---------- Product cards ---------- */
.product-grid{ display:grid; gap:1rem; grid-template-columns:repeat(2,1fr); }
@media (min-width:640px){ .product-grid{ grid-template-columns:repeat(3,1fr); } }
@media (min-width:1024px){ .product-grid{ grid-template-columns:repeat(4,1fr); gap:1.25rem; } }
.product-card{
  position:relative; display:flex; flex-direction:column; min-width:0;
  border-radius:1.25rem; border:1px solid var(--line); 
  background: linear-gradient(180deg, #ffffff 0%, #f9fbfc 100%);
  box-shadow: 0 4px 12px rgba(0,0,0,0.03);
  transition:box-shadow .3s ease, transform .3s ease, border-color .3s ease;
}
.product-card:hover{
  box-shadow: 0 14px 34px rgba(6,10,31,0.1), 0 0 0 1px rgba(212,160,23,.35), 0 0 24px -4px rgba(212,160,23,.3);
  transform:translateY(-4px);
  border-color: rgba(212,160,23, 0.45);
}
.product-thumb{ 
  position:relative; display:flex; align-items:center; justify-content:center; 
  overflow:hidden; border-radius:1rem; margin:.75rem .75rem 0; height:10rem; 
  background:var(--paper); 
}
.product-thumb img{ 
  width:100%; height:100%; object-fit:cover; display:block; 
  transition:transform .4s cubic-bezier(0.2, 0.8, 0.2, 1); 
}
.product-card:hover .product-thumb img{ transform:scale(1.08); }
.product-thumb .blob1{ position:absolute; right:-1.5rem; bottom:-2rem; height:7rem; width:7rem; border-radius:999px; opacity:.2; }
.product-thumb .blob2{ position:absolute; left:-2rem; top:-2rem; height:5rem; width:5rem; border-radius:999px; opacity:.1; }
.product-thumb .icon{ position:relative; width:2.5rem; height:2.5rem; }
.cat-badge{ display:flex; align-items:center; justify-content:center; border-radius:.55rem; background:rgba(255,255,255,.92); box-shadow:var(--shadow-card); }
.cat-badge .icon{ width:.95rem; height:.95rem; }
.product-thumb .cat-badge{ position:absolute; bottom:.5rem; right:.5rem; height:1.9rem; width:1.9rem; }
.wish-btn{ position:absolute; top:1rem; right:1rem; height:2rem; width:2rem; border-radius:999px; background:rgba(255,255,255,.92); border:1px solid var(--line); display:flex; align-items:center; justify-content:center; transition:background-color .2s, transform .2s, color .2s; }
.wish-btn:hover{ background:#fff; transform:scale(1.1); color:var(--gax); }
.wish-btn .icon{ width:.95rem; height:.95rem; color:var(--ink-400); transition: fill .2s, color .2s; }
.wish-btn.active .icon{ color:var(--gax); fill:var(--gax); }

.product-body{ display:flex; flex-direction:column; gap:.4rem; padding:1.1rem 1rem 1.2rem; flex:1; }
.product-body .cat-label{ font-size:.68rem; font-weight:700; text-transform:uppercase; letter-spacing:.06em; color:var(--ink-400); }
.product-body h3{ font-size:.95rem; font-weight:700; line-height:1.4; color:var(--ink); display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; transition:color .2s; }
.product-card:hover .product-body h3{ color:var(--teal-600); }
.product-body .unit{ font-size:.75rem; color:var(--ink-500); font-weight:500; }

.product-foot{ margin-top:auto; padding-top:.75rem; display:flex; align-items:flex-end; justify-content:space-between; gap:.4rem; min-width:0; }
.price-tag{ display:flex; align-items:baseline; gap:.35rem; font-family:var(--font-mono); flex-wrap:wrap; min-width:0; overflow:hidden; }
.price-tag .final{ font-weight:800; color:var(--ink); letter-spacing:-.02em; }
.price-tag.sm .final{ font-size:1.1rem; }
.price-tag.md .final{ font-size:1.35rem; }
.price-tag.lg .final{ font-size:2rem; }
.price-tag .mrp{ color:var(--ink-400); text-decoration:line-through; font-size:.75rem; font-weight:500; }
.price-tag .save{ font-family:var(--font-body); font-size:.65rem; font-weight:700; color:var(--max-dark); background:var(--max-tint); padding:.15rem .4rem; border-radius:.3rem; letter-spacing:.02em; }
.price-tag .offer-badge{ font-family:var(--font-body); font-size:.65rem; font-weight:800; color:#fff; background:var(--gax-dark); padding:.15rem .5rem; border-radius:.3rem; letter-spacing:.02em; flex-basis:100%; order:-1; }

.add-btn{ flex-shrink:0; height:2.2rem; width:2.2rem; padding:0; border-radius:999px; display:flex; align-items:center; justify-content:center; gap:.4rem; background: linear-gradient(135deg, var(--ink-800) 0%, var(--gold-500) 100%); color:#fff; font-size:.8rem; font-weight:700; transition: transform .2s, box-shadow .2s; box-shadow: 0 4px 10px rgba(212,160,23,.2); border:none; cursor:pointer; }
.add-btn:hover{ transform:translateY(-2px) scale(1.03); box-shadow: 0 6px 14px rgba(212,160,23,.3); }
.add-btn.added{ background:var(--max); box-shadow:none; }
.add-btn .icon{ width:1rem; height:1rem; flex-shrink:0; }
.add-btn span{ display:none; }
@media (min-width:480px){ .add-btn{ width:auto; padding:0 1rem; border-radius: 999px; } .add-btn span{ display:inline; } }
.card-wish-btn{ flex-shrink:0; height:2rem; width:2rem; border-radius:999px; display:flex; align-items:center; justify-content:center; background:#fff; border:1px solid var(--line); color:var(--muted); transition:background-color .15s, border-color .15s, color .15s; }
.card-wish-btn:hover{ background:var(--paper); border-color:var(--muted); color:var(--ink); }
.card-wish-btn.active{ color:var(--gax); border-color:rgba(242,129,29,.4); background:rgba(242,129,29,.05); }
.card-wish-btn .icon{ width:.95rem; height:.95rem; fill:currentColor; }

/* ---------- Pricing rules table ---------- */
.pricing-rules-grid{ display:grid; grid-template-columns:minmax(0,1fr); gap:2rem; align-items:start; }
@media (min-width:960px){ .pricing-rules-grid{ grid-template-columns:minmax(0,1.6fr) minmax(0,1fr); gap:2.75rem; } }
.pricing-rules-main{ min-width:0; }
.pricing-rules-aside{ display:flex; justify-content:center; min-width:0; }
.pricing-rules-aside .pricing-explorer{ width:100%; max-width:26rem; }
.pricing-table-wrap{ border-radius:1rem; border:1px solid var(--line); overflow:hidden; overflow-x:auto; -webkit-overflow-scrolling:touch; box-shadow: 0 4px 16px rgba(0,0,0,0.03); background: #fff; max-width:100%; }
table.pricing-table{ width:100%; border-collapse:collapse; font-size:.9rem; min-width:560px; text-align: left; }
table.pricing-table thead tr{ background: linear-gradient(90deg, var(--ink) 0%, #152d47 100%); color:#fff; }
table.pricing-table th{ padding:1.1rem 1.4rem; font-size:.72rem; text-transform:uppercase; letter-spacing:.08em; font-weight:700; font-family:var(--font-mono); border-bottom: 2px solid rgba(255,255,255,0.1); white-space:nowrap; }
table.pricing-table td{ padding:1.1rem 1.4rem; color:var(--ink-600); border-bottom: 1px solid var(--line); transition: background 0.2s; }
table.pricing-table tr:last-child td{ border-bottom: none; }
table.pricing-table td.slab{ font-family:var(--font-mono); font-weight:700; color:var(--ink); font-size:1rem; white-space:nowrap; }
table.pricing-table tbody tr:hover td{ background: #f4f8fc; color: var(--ink); }
@media (max-width:599px){
  table.pricing-table{ min-width:480px; font-size:.82rem; }
  table.pricing-table th, table.pricing-table td{ padding:.85rem 1rem; }
}

/* ---------- About / expansion (dark) ---------- */
.about-dark{ background:var(--ink); color:#fff; }
.about-grid{ display:grid; gap:2.5rem; align-items:center; grid-template-columns:1fr; }
@media (min-width:768px){ .about-grid{ grid-template-columns:1fr 1fr; } }
.about-dark h2{ font-family:var(--font-display); font-weight:700; font-size:1.7rem; letter-spacing:-.01em; margin-bottom:1rem; }
.about-dark p{ color:rgba(255,255,255,.7); line-height:1.65; max-width:32rem; }
.roadmap-grid{ display:grid; grid-template-columns:repeat(2,1fr); gap:.75rem; }
@media (min-width:480px){ .roadmap-grid{ grid-template-columns:repeat(3,1fr); } }
.roadmap-item{ display:flex; align-items:center; gap:.65rem; border-radius:.75rem; border:1px solid rgba(255,255,255,.1); background:rgba(255,255,255,.05); padding:.75rem .9rem; }
.roadmap-item .icon{ color:var(--teal-400); flex-shrink:0; }
.roadmap-item span{ font-size:.75rem; color:rgba(255,255,255,.8); line-height:1.3; }

/* ---------- Gallery ---------- */
.gallery-grid{ display:grid; gap:1.25rem; grid-template-columns:repeat(2,1fr); }
@media (min-width:640px){ .gallery-grid{ grid-template-columns:repeat(3,1fr); } }
@media (min-width:1024px){ .gallery-grid{ grid-template-columns:repeat(4,1fr); } }
.gallery-tile{ aspect-ratio:4/3; border-radius:1rem; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:.75rem; border:1px solid var(--line); transition:transform .3s cubic-bezier(0.2, 0.8, 0.2, 1), box-shadow .3s ease, border-color .3s; background: #fff; box-shadow: 0 4px 12px rgba(0,0,0,0.02); }
.gallery-tile:hover{ transform:translateY(-4px); box-shadow: 0 10px 24px rgba(0,0,0,0.06); border-color: rgba(212,160,23, 0.2); }
.gallery-tile .icon{ width:2.2rem; height:2.2rem; color: var(--teal-600); transition: transform 0.3s; }
.gallery-tile:hover .icon{ transform: scale(1.1); }
.gallery-tile span{ font-size:.85rem; font-weight:700; text-align:center; padding-inline:.5rem; color: var(--ink); }
.gallery-tile.photo{ overflow:hidden; padding:0; position:relative; border: none; }
.gallery-tile.photo img{ width:100%; height:100%; object-fit:cover; transition: transform 0.5s cubic-bezier(0.2, 0.8, 0.2, 1); }
.gallery-tile.photo:hover img{ transform: scale(1.1); }
.gallery-tile.photo .cap{ position:absolute; inset:auto 0 0 0; background:linear-gradient(to top, rgba(6,10,31,.9), transparent); color:#fff; padding:2rem 1rem 1rem; font-size:.85rem; font-weight:700; transition: transform 0.3s; }
.gallery-tile.photo:hover .cap{ transform: translateY(-2px); }

/* ---------- Blog ---------- */
.blog-grid{ display:grid; gap:1.5rem; grid-template-columns:1fr; }
@media (min-width:768px){ .blog-grid{ grid-template-columns:repeat(3,1fr); } }
.blog-card{ border-radius:1.25rem; border:1px solid var(--line); background:#fff; overflow:hidden; display:flex; flex-direction:column; transition:box-shadow .3s ease, transform .3s ease; box-shadow: 0 4px 16px rgba(0,0,0,0.03); }
.blog-card:hover{ box-shadow: 0 12px 32px rgba(0,0,0,0.08); transform:translateY(-4px); }
.blog-card .bc-media{ position:relative; aspect-ratio:16/10; overflow:hidden; }
.blog-card .bc-media img{ width:100%; height:100%; object-fit:cover; display:block; transition:transform .5s cubic-bezier(0.2, 0.8, 0.2, 1); }
.blog-card:hover .bc-media img{ transform:scale(1.08); }
.blog-card .bc-media .tag{ position:absolute; top:1rem; left:1rem; background:rgba(212,160,23,.9); color:#fff; padding:.4rem .8rem; border-radius:999px; backdrop-filter:blur(4px); font-size: 0.75rem; font-weight: 700; letter-spacing: 0.05em; text-transform: uppercase; }
.blog-card .bc-body{ padding:1.5rem; display:flex; flex-direction:column; gap:.75rem; flex:1; }
.blog-card h3{ font-family:var(--font-display); font-weight:700; font-size:1.15rem; line-height:1.4; color: var(--ink); transition: color 0.3s; }
.blog-card:hover h3{ color: var(--teal-600); }
.blog-card p.excerpt{ font-size:.9rem; color:var(--ink-600); line-height:1.6; }
.blog-card .meta{ font-size:.75rem; font-weight: 600; color:var(--ink-400); margin-top:auto; text-transform: uppercase; letter-spacing: 0.05em; }

/* ---------- Franchisee network ---------- */
.franchisee-section{ padding-block:2rem; }
@media (min-width:768px){ .franchisee-section{ padding-block:3rem; } }
.franchisee-grid{ display:grid; grid-template-columns:repeat(auto-fill,minmax(17rem,1fr)); gap:1.25rem; }
.franchisee-card{
  border-radius:1.25rem; border:1px solid var(--line); background:#fff; overflow:hidden;
  display:flex; flex-direction:column; box-shadow:0 4px 16px rgba(0,0,0,.03);
  transition:box-shadow .3s ease, transform .3s ease;
}
.franchisee-card:hover{ box-shadow:0 12px 32px rgba(0,0,0,.08); transform:translateY(-4px); }
.franchisee-photo{ position:relative; aspect-ratio:4/3; overflow:hidden; background:var(--paper); }
.franchisee-photo img{ width:100%; height:100%; object-fit:cover; display:block; transition:transform .5s cubic-bezier(.2,.8,.2,1); }
.franchisee-card:hover .franchisee-photo img{ transform:scale(1.06); }
.franchisee-photo-fallback{ width:100%; height:100%; display:flex; align-items:center; justify-content:center; color:var(--gold-500); background:var(--hub-gradient-soft); }
.franchisee-photo-fallback .icon{ width:2.5rem; height:2.5rem; }
.franchisee-body{ padding:1.35rem 1.4rem 1.5rem; display:flex; flex-direction:column; gap:.55rem; flex:1; }
.franchisee-body h3{ font-family:var(--font-display); font-weight:700; font-size:1.05rem; line-height:1.35; color:var(--ink); }
.franchisee-loc{ display:flex; align-items:center; gap:.4rem; font-size:.78rem; font-weight:600; color:var(--gold-700); }
.franchisee-loc .icon{ width:.9rem; height:.9rem; flex-shrink:0; }
.franchisee-desc{ font-size:.85rem; color:var(--ink-600); line-height:1.6; }
.franchisee-actions{ display:flex; gap:.6rem; margin-top:auto; padding-top:.5rem; }
.franchisee-actions .btn{ flex:1; }
.franchisee-empty{ padding:2.5rem 1rem; text-align:center; color:var(--muted); font-size:.9rem; border:1px dashed var(--line); border-radius:1rem; }

.franchisee-modal-card{ max-width:26rem; position:relative; }
.franchisee-modal-close{
  position:absolute; top:.85rem; right:.85rem; display:flex; align-items:center; justify-content:center;
  width:2rem; height:2rem; border-radius:50%; background:var(--paper); color:var(--ink-600); flex-shrink:0;
  transition:background-color .15s, color .15s;
}
.franchisee-modal-close:hover{ background:var(--gold-100); color:var(--gold-700); }
.franchisee-modal-close .icon{ width:.9rem; height:.9rem; }
.franchisee-modal-success-ico{
  display:inline-flex; align-items:center; justify-content:center; width:3.5rem; height:3.5rem; border-radius:50%;
  background:var(--max-tint); color:var(--max-dark);
}
.franchisee-modal-success-ico .icon{ width:1.6rem; height:1.6rem; }

@media (max-width:640px){
  .franchisee-grid{ grid-template-columns:1fr; }
  .franchisee-actions{ flex-direction:column; }
}

/* ---------- CTA strip ---------- */
.cta-strip{ position:relative; overflow:hidden; border-radius:1.75rem; background:linear-gradient(160deg, var(--ink-900) 0%, var(--ink-700) 100%); padding:4.5rem 2rem; color:#fff; text-align:center; box-shadow: 0 20px 40px rgba(6,10,31,0.25); isolation:isolate; }
@media (min-width:768px){ .cta-strip{ padding:5rem 4rem; } }
.cta-strip .cta-glow { position: absolute; border-radius: 50%; filter: blur(60px); opacity: 0.4; z-index: 0; pointer-events: none; }
.cta-strip .cta-glow-1 { top: -50%; left: -10%; width: 60%; height: 150%; background: radial-gradient(circle, rgba(212,160,23,0.5) 0%, transparent 70%); }
.cta-strip .cta-glow-2 { bottom: -50%; right: -10%; width: 60%; height: 150%; background: radial-gradient(circle, rgba(93,122,192,0.35) 0%, transparent 70%); }
.cta-strip .bg-grid{ position:absolute; inset:0; opacity:.15; background-image: radial-gradient(#ffffff 1px, transparent 1px); background-size: 24px 24px; z-index: 1; pointer-events: none; }
.cta-strip::after{
  content:""; position:absolute; inset:0; z-index:1; pointer-events:none; opacity:.5;
  background-image:
    radial-gradient(1.5px 1.5px at 9% 25%, rgba(var(--gold-rgb),.85), transparent 60%),
    radial-gradient(1px 1px at 20% 70%, rgba(233,190,74,.65), transparent 60%),
    radial-gradient(2px 2px at 31% 15%, rgba(var(--gold-rgb),.7), transparent 60%),
    radial-gradient(1px 1px at 43% 85%, rgba(233,190,74,.55), transparent 60%),
    radial-gradient(1.5px 1.5px at 57% 40%, rgba(var(--gold-rgb),.75), transparent 60%),
    radial-gradient(1px 1px at 69% 12%, rgba(233,190,74,.6), transparent 60%),
    radial-gradient(2px 2px at 81% 62%, rgba(var(--gold-rgb),.8), transparent 60%),
    radial-gradient(1px 1px at 92% 32%, rgba(233,190,74,.55), transparent 60%);
}
.cta-strip .inner{ position:relative; max-width:42rem; margin-inline:auto; z-index: 2; }
.cta-strip h2{ font-family:var(--font-display); font-weight:800; font-size:2rem; letter-spacing:-.02em; margin-bottom:1.2rem; line-height: 1.2; text-shadow: 0 4px 12px rgba(0,0,0,0.2); }
@media (min-width:768px){ .cta-strip h2{ font-size:3rem; } }
.cta-strip p{ color:rgba(255,255,255,.8); font-size: 1.1rem; max-width:32rem; margin-inline:auto; margin-bottom:2.5rem; line-height: 1.6; }
.cta-strip .cta-actions{ display:flex; flex-wrap:wrap; align-items:center; justify-content:center; gap:1rem; }

/* ---------- Breadcrumb ---------- */
.breadcrumb{ display:flex; flex-wrap:wrap; align-items:center; gap:.35rem; font-size:.75rem; color:var(--muted); margin-bottom:1.5rem; }
.breadcrumb a:hover{ color:var(--ink); }
.breadcrumb .icon{ width:.7rem; height:.7rem; }
.breadcrumb .current{ color:var(--ink); font-weight:600; }

.division-hero-grid{ grid-template-columns:1fr; }
@media (min-width:960px){ .division-hero-grid{ grid-template-columns:1.1fr .9fr; } }

/* ---------- Division hero visual (graphic banner, no photography) ---------- */
.division-hero-visual{
  position:relative; aspect-ratio:16/12; width:100%; overflow:hidden;
  display:flex; align-items:center; justify-content:center; isolation:isolate;
}
.division-hero-visual::before{
  content:""; position:absolute; inset:0;
  background-image:radial-gradient(rgba(255,255,255,.22) 1.4px, transparent 1.4px);
  background-size:20px 20px; opacity:.55;
}
.dhv-blob{ position:absolute; border-radius:999px; background:#fff; }
.dhv-blob1{ height:15rem; width:15rem; right:-5.5rem; top:-6.5rem; opacity:.14; }
.dhv-blob2{ height:11rem; width:11rem; left:-4rem; bottom:-5rem; opacity:.12; }
.dhv-blob3{ height:5.5rem; width:5.5rem; right:2.2rem; bottom:1.8rem; opacity:.1; }
.dhv-icon-wrap{
  position:relative; display:flex; align-items:center; justify-content:center;
  height:7rem; width:7rem; border-radius:999px;
  background:rgba(255,255,255,.16); border:1px solid rgba(255,255,255,.4);
  backdrop-filter:blur(6px); box-shadow:0 1.2rem 2.5rem rgba(0,0,0,.16);
}
.dhv-code{
  position:relative; margin-top:1.1rem; font-family:var(--font-display); font-weight:700;
  font-size:1.1rem; letter-spacing:.08em; color:#fff; text-align:center;
}
.dhv-chip{
  position:absolute; display:inline-flex; align-items:center; gap:.4rem;
  background:#fff; border-radius:999px; padding:.5rem .85rem;
  font-size:.72rem; font-weight:700; color:var(--ink-700);
  box-shadow:0 .6rem 1.4rem rgba(6,10,31,.18);
}
.dhv-chip-a{ left:1.1rem; top:1.1rem; }
.dhv-chip-b{ right:1.1rem; bottom:1.1rem; }
@media (max-width:420px){ .dhv-chip{ font-size:.66rem; padding:.4rem .7rem; } }

/* ---------- Division rich hero (headline + CTA + trust row + visual + stats) ---------- */
.page-head.dhero{ position:relative; overflow:hidden; }
.page-head.dhero::before{
  content:""; position:absolute; inset:0; z-index:0; pointer-events:none;
  background-image:radial-gradient(rgba(6,10,31,.06) 1.5px, transparent 1.5px);
  background-size:24px 24px;
  -webkit-mask-image:radial-gradient(ellipse 65% 70% at 78% 35%, black, transparent 72%);
  mask-image:radial-gradient(ellipse 65% 70% at 78% 35%, black, transparent 72%);
}
.dhero-badge{ display:flex; align-items:center; gap:.85rem; margin-bottom:1.4rem; }
.dhero-badge-ico{ display:flex; height:3rem; width:3rem; align-items:center; justify-content:center; border-radius:.85rem; color:#fff; flex-shrink:0; }
.dhero-badge-code{ font-family:var(--font-display); font-weight:700; font-size:1.4rem; line-height:1.1; }
.dhero-badge-name{ font-size:.82rem; color:var(--ink-500); margin-top:.1rem; }
.dhero-headline{ font-family:var(--font-display); font-weight:700; font-size:2rem; line-height:1.15; letter-spacing:-.01em; margin-bottom:1rem; }
.dhero-headline em{ font-style:italic; }
@media (min-width:768px){ .dhero-headline{ font-size:2.6rem; } }
.dhero-sub{ color:var(--ink-500); max-width:32rem; line-height:1.7; margin-bottom:1.6rem; font-size:.95rem; }
.dhero-cta{ display:flex; flex-wrap:wrap; gap:.85rem; margin-bottom:2.2rem; }
.btn-division{ background:var(--btn-bg); color:#fff; border:none; box-shadow:0 .9rem 1.8rem -1rem var(--btn-bg); }
.btn-division:hover{ filter:brightness(1.07); transform:translateY(-1px); }
.dhero-trust{ display:grid; grid-template-columns:repeat(2,1fr); gap:1.1rem 1.5rem; }
@media (min-width:640px){ .dhero-trust{ grid-template-columns:repeat(4,1fr); } }
.dhero-trust-bordered{ border-top:1px solid rgba(6,10,31,.09); padding-top:1.5rem; }
.dhero-trust-item{ display:flex; align-items:flex-start; gap:.65rem; }
.dhero-trust-item .ico{ display:flex; height:2.4rem; width:2.4rem; flex-shrink:0; align-items:center; justify-content:center; border-radius:.7rem; }
.dhero-trust-item strong{ display:block; font-size:.82rem; font-weight:700; color:var(--ink); }
.dhero-trust-item small{ display:block; font-size:.72rem; color:var(--muted); margin-top:.1rem; }

.dhero-visual{ position:relative; padding:1.1rem 1.1rem 1.6rem; }
.dhero-visual::before{
  content:""; position:absolute; z-index:0; pointer-events:none;
  top:1.4rem; left:50%; transform:translateX(-50%); width:88%; aspect-ratio:16/10; max-width:26rem;
  background:var(--dhero-accent, transparent); opacity:.35; filter:blur(2.75rem); border-radius:2.5rem;
}
@media (min-width:960px){ .dhero-visual::before{ left:auto; right:0; transform:none; } }
.dhero-frame{
  position:relative; z-index:1; aspect-ratio:16/10; width:100%; max-width:26rem; margin-inline:auto; overflow:hidden; border-radius:var(--radius-lg);
  border:1px solid rgba(255,255,255,.6);
  box-shadow:0 1.8rem 3.5rem -1.6rem rgba(6,10,31,.4), 0 0 0 1px rgba(6,10,31,.05), 0 .6rem 1.6rem -0.7rem var(--dhero-accent, rgba(6,10,31,.35));
}
@media (min-width:960px){ .dhero-frame{ margin-inline:auto 0; } }
.dhero-frame img{ width:100%; height:100%; object-fit:contain; background:#fff; display:block; }
.dhero-floatcard{
  position:absolute; z-index:2; top:0; left:.6rem; display:flex; align-items:center; gap:.6rem;
  background:#fff; border-radius:1rem; padding:.6rem .95rem .6rem .6rem; box-shadow:0 1rem 2.2rem -0.7rem rgba(6,10,31,.4);
}
@media (min-width:960px){ .dhero-floatcard{ left:auto; right:2.1rem; } }
.dhero-floatcard .ico{ display:flex; align-items:center; justify-content:center; height:2.1rem; width:2.1rem; border-radius:.65rem; flex-shrink:0; }
.dhero-floatcard strong{ display:block; font-family:var(--font-display); font-weight:700; font-size:.95rem; line-height:1.1; color:var(--ink); }
.dhero-floatcard small{ display:block; font-size:.66rem; color:var(--muted); margin-top:.15rem; }
.dhero-fallback{ position:relative; width:100%; height:100%; display:flex; align-items:center; justify-content:center; flex-direction:column; }
.dhero-fallback::before{
  content:""; position:absolute; inset:0;
  background-image:radial-gradient(rgba(255,255,255,.22) 1.4px, transparent 1.4px);
  background-size:20px 20px; opacity:.55; pointer-events:none;
}
.dhero-fallback::after{
  content:""; position:absolute; inset:0; pointer-events:none;
  box-shadow:inset 0 -2.5rem 3.5rem -2rem rgba(0,0,0,.18);
}
.dhv-icon-wrap{
  height:5rem; width:5rem;
  background:radial-gradient(circle at 35% 30%, rgba(255,255,255,.32), rgba(255,255,255,.12) 65%);
}
.dhv-icon-wrap::before{
  content:""; position:absolute; inset:-.6rem; border-radius:999px;
  border:1px solid rgba(255,255,255,.28);
}
.dhv-code{ font-size:.95rem; letter-spacing:.14em; }
.dhero-tag{ position:absolute; left:1rem; bottom:1rem; display:inline-flex; align-items:center; gap:.5rem; background:#fff; border-radius:1rem; padding:.6rem .9rem; font-size:.74rem; font-weight:700; color:var(--ink-700); box-shadow:0 .9rem 1.8rem rgba(6,10,31,.2); max-width:calc(100% - 2rem); }
.dhero-tag .icon{ flex-shrink:0; }

.dhero-stats-bar{ margin-top:2.75rem; border-radius:var(--radius-lg); overflow:hidden; }
.dhero-stats-grid{ display:grid; grid-template-columns:repeat(2,1fr); gap:0; padding:0; }
@media (min-width:768px){ .dhero-stats-grid{ grid-template-columns:repeat(4,1fr); } }
.dhero-stat{ 
  display:flex; align-items:center; gap:1rem; 
  padding:1.75rem 1.75rem; 
  border-right:1px solid rgba(255,255,255,.12);
  border-bottom:1px solid rgba(255,255,255,.12);
  transition: background 0.3s;
}
.dhero-stat:hover{ background: rgba(255,255,255,.05); }
@media (min-width:768px){ 
  .dhero-stat:last-child{ border-right:none; }
  .dhero-stat{ border-bottom:none; }
}
.dhero-stat .icon{ width:1.6rem; height:1.6rem; color:#ffffff !important; flex-shrink:0; opacity:0.9; }
.dhero-stat p{ font-family:var(--font-display); font-weight:800; font-size:1.75rem; color:#ffffff !important; line-height:1; letter-spacing:-0.02em; text-shadow: 0 2px 8px rgba(0,0,0,0.2); }
.dhero-stat small{ display:block; font-size:.78rem; font-weight:600; color:rgba(255,255,255,.85) !important; margin-top:.3rem; text-transform:uppercase; letter-spacing:0.05em; }

/* ---------- Page headers ---------- */
.page-head{
  position:relative; overflow:hidden;
  padding-block:2.75rem;
  border-bottom:1px solid var(--line);
  background:
    radial-gradient(ellipse 64% 115% at 3% -12%, rgba(21,36,73,.5) 0%, transparent 68%),
    radial-gradient(ellipse 60% 100% at 100% 116%, rgba(var(--gold-rgb),.44) 0%, transparent 64%),
    linear-gradient(135deg, #EEF2FA 0%, #F6F7F9 52%, #FBF0D9 100%);
}
.page-head::before{
  content:"";
  position:absolute; inset:0; z-index:0; pointer-events:none;
  background-image:radial-gradient(rgba(33,56,104,.07) 1.5px, transparent 1.5px);
  background-size:26px 26px;
  -webkit-mask-image:radial-gradient(ellipse 65% 100% at 88% 0%, black, transparent 75%);
  mask-image:radial-gradient(ellipse 65% 100% at 88% 0%, black, transparent 75%);
}
.page-head .container{ position:relative; z-index:1; }
.page-head h1{ font-family:var(--font-display); font-weight:700; font-size:1.75rem; letter-spacing:-.01em; color:var(--ink-900); }
@media (min-width:768px){ .page-head h1{ font-size:2.2rem; } }
.page-head p{ color:var(--muted); margin-top:.6rem; max-width:38rem; }

/* ---------- Filters / toolbar ---------- */
.toolbar{ display:flex; align-items:center; justify-content:space-between; gap:1rem; margin-bottom:1.5rem; flex-wrap:wrap; }
.toolbar .count{ font-size:.875rem; color:var(--muted); }
.select-wrap{ display:flex; align-items:center; gap:.5rem; font-size:.875rem; }
.select-wrap select{ background:#fff; border:1px solid var(--line); border-radius:.6rem; padding:.45rem 1.7rem .45rem .7rem; outline:none; appearance:none; background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%235B6B7F' stroke-width='2' stroke-linecap='round'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E"); background-repeat:no-repeat; background-position:right .5rem center; }
.select-wrap select:focus{ border-color:var(--teal-500); }

/* ---------- Pagination ---------- */
.pagination{ display:flex; align-items:center; justify-content:center; gap:.4rem; margin-top:2.5rem; flex-wrap:wrap; }
.pagination button{ display:flex; align-items:center; justify-content:center; min-width:2.4rem; height:2.4rem; padding:0 .5rem; border-radius:.6rem; border:1px solid var(--line); background:#fff; font-weight:600; font-size:.85rem; color:var(--ink-600); transition:border-color .15s, color .15s, background-color .15s; }
.pagination button:hover:not(:disabled):not(.active){ border-color:var(--teal-400); color:var(--teal-600); }
.pagination button.active{ background:var(--ink); border-color:var(--ink); color:#fff; cursor:default; }
.pagination button:disabled{ opacity:.35; cursor:not-allowed; }
.pagination .pg-ellipsis{ padding:0 .3rem; color:var(--muted); font-size:.85rem; }
.chip-row{ display:flex; flex-wrap:wrap; gap:.5rem; margin-bottom:1.75rem; }
.chip{ display:inline-flex; align-items:center; gap:.4rem; font-size:.8rem; font-weight:600; padding:.45rem .95rem; border-radius:999px; border:1px solid var(--line); color:var(--ink-600); transition:.15s; }
.chip:hover{ border-color:rgba(6,10,31,.3); }
.chip.active{ background:var(--ink); border-color:var(--ink); color:#fff; }
.filter-layout{ display:grid; grid-template-columns:1fr; gap:2rem; align-items:start; }
@media (min-width:900px){ .filter-layout{ grid-template-columns:15rem 1fr; } }
.filter-panel{ display:flex; flex-direction:column; gap:1.5rem; border:1px solid var(--line); background:var(--surface); border-radius:var(--radius-lg); padding:1.25rem; }
.filter-group h4{ font-size:.72rem; font-weight:700; text-transform:uppercase; letter-spacing:.05em; color:var(--muted); margin-bottom:.7rem; }
.filter-opt{ display:flex; align-items:center; gap:.55rem; font-size:.85rem; padding:.35rem 0; cursor:pointer; }
.filter-opt input{ accent-color:var(--teal-500); width:1rem; height:1rem; }
.empty-state{ text-align:center; padding:4rem 1rem; }
.empty-state .ico{ margin-inline:auto; margin-bottom:1.2rem; display:flex; height:4rem; width:4rem; align-items:center; justify-content:center; border-radius:999px; background:var(--paper); color:var(--muted); }
.empty-state .ico .icon{ width:1.6rem; height:1.6rem; }
.empty-state h2{ font-family:var(--font-display); font-weight:700; font-size:1.2rem; margin-bottom:.5rem; }
.empty-state p{ font-size:.875rem; color:var(--muted); margin-bottom:1.5rem; }

/* ---------- Product detail ---------- */
.product-detail-grid{ display:grid; gap:2.5rem; grid-template-columns:1fr; }
@media (min-width:960px){ .product-detail-grid{ grid-template-columns:1fr 1fr; } }
.gallery-main{ position:relative; display:flex; aspect-ratio:1; width:100%; align-items:center; justify-content:center; overflow:hidden; border-radius:var(--radius-lg); border:1px solid var(--line); }
.gallery-main .blob1{ position:absolute; right:-3.5rem; bottom:-4rem; height:16rem; width:16rem; border-radius:999px; opacity:.16; }
.gallery-main .blob2{ position:absolute; left:-4rem; top:-3.5rem; height:12rem; width:12rem; border-radius:999px; opacity:.1; }
.gallery-main .icon{ position:relative; width:6rem; height:6rem; }
.gallery-frames{ display:grid; grid-template-columns:repeat(4,1fr); gap:.75rem; margin-top:.75rem; }
.gallery-frame{ display:flex; aspect-ratio:1; align-items:center; justify-content:center; border-radius:.85rem; border:2px solid var(--line); transition:border-color .15s; }
.gallery-frame.active{ border-color:var(--teal-500); }
.gallery-frame .icon{ width:1.3rem; height:1.3rem; }
.detail-actions-card{ border-radius:var(--radius-lg); border:1px solid var(--line); background:var(--surface); padding:1.25rem; }
@media (min-width: 640px) {
  .detail-actions-card{ padding:1.5rem; }
}
.assurance-row{ display:grid; grid-template-columns:1fr; gap:.75rem; margin-top:1.5rem; }
@media (min-width:560px){ .assurance-row{ grid-template-columns:repeat(3,1fr); } }
.assurance-row .item{ display:flex; align-items:center; gap:.5rem; font-size:.78rem; color:var(--muted); }
.assurance-row .item .icon{ color:var(--teal-600); flex-shrink:0; width:.95rem; height:.95rem; }

/* ---------- Cart & wishlist ---------- */

/* Page header */
.cart-page-head{ display:flex; align-items:flex-end; justify-content:space-between; gap:1.25rem; flex-wrap:wrap; margin-bottom:1.75rem; }
.cart-page-head h1 {
  font-size: 1.9rem;
  font-weight: 800;
  letter-spacing: -.02em;
  margin-bottom: .35rem;
  color: var(--ink-900);
}
.cart-subtitle {
  font-size: .9rem;
  color: var(--muted);
  margin-bottom: 0;
}
.cart-add-more{ flex-shrink:0; }
.cart-add-more .icon{ width:.95rem; height:.95rem; }

/* Continue shopping link below the item list */
.cart-continue-row{ margin-top:1.5rem; }
.cart-continue-link{
  display:inline-flex; align-items:center; gap:.5rem;
  font-size:.85rem; font-weight:700; color:var(--teal-600);
  padding:.7rem 0;
}
.cart-continue-link .icon{ width:.9rem; height:.9rem; transition:transform .15s var(--ease); }
.cart-continue-link:hover .icon{ transform:translateX(-3px); }

/* Per-line quantity math + savings tag */
.cart-line .info .pline{ display:flex; align-items:center; gap:.5rem; flex-wrap:wrap; margin-top:.35rem; }
.cart-line .info .pqtymath{ font-size:.74rem; color:var(--muted); font-family:var(--font-mono); }
.cart-line .save-tag{
  display:inline-flex; align-items:center; font-size:.68rem; font-weight:800;
  color:var(--max-dark); background:var(--max-tint); padding:.12rem .5rem; border-radius:999px;
  letter-spacing:.01em;
}

/* Summary card header */
.summary-card-head{ display:flex; align-items:center; gap:.6rem; margin-bottom:1.1rem; }
.summary-card-head .ico{
  display:flex; align-items:center; justify-content:center; width:2.1rem; height:2.1rem;
  border-radius:.65rem; background:var(--ink-900); color:var(--gold-300); flex-shrink:0;
}
.summary-card-head .ico .icon{ width:1rem; height:1rem; }
.summary-card-head h2{ font-family:var(--font-display); font-weight:700; font-size:1rem; color:var(--ink-900); margin:0; }
.summary-card .assurance-row, .checkout-summary .assurance-row{ grid-template-columns:1fr; gap:.6rem; margin-top:1.4rem; padding-top:1.2rem; border-top:1px solid var(--line); }

/* Layout */
.cart-layout{ display:grid; gap:2rem; align-items:start; grid-template-columns:1fr; }
@media (min-width:1024px){ .cart-layout{ grid-template-columns:1fr 22rem; } }

/* Cart items list */
.cart-items-wrap { display:flex; flex-direction:column; gap:.85rem; }

/* Single cart row */
.cart-line{
  display:flex; align-items:center; gap:1.1rem;
  flex-wrap:wrap;
  border-radius:var(--radius-lg);
  border:1px solid var(--line);
  background:#fff;
  padding:1.1rem 1.25rem;
  transition: box-shadow .2s var(--ease), border-color .2s var(--ease), transform .2s var(--ease);
}
@media (min-width: 640px) {
  .cart-line { flex-wrap: nowrap; }
}
.cart-line:hover{
  box-shadow: 0 6px 24px -8px rgba(6,10,31,.1);
  border-color: rgba(6,10,31,.15);
  transform: translateY(-1px);
}
.cart-line > a.thumb-link { flex-shrink: 0; }
.cart-line .thumb{ height:4.5rem; width:4.5rem; flex-shrink:0; border-radius:.85rem; overflow:hidden; border:1px solid var(--line); background:var(--paper); }
.cart-line .info{ flex:1; min-width:140px; }
.cart-line .info .pname{
  font-size:.95rem; font-weight:700; color:var(--ink-900);
  display:block; overflow:hidden; text-overflow:ellipsis; white-space:nowrap;
  transition: color .15s;
}
.cart-line .info .pname:hover{ color:var(--teal-600); }
.cart-line .info .pmeta{ font-size:.75rem; color:var(--muted); margin-top:.15rem; }
.cart-line .info .pprice{
  font-size:1rem; font-weight:800;
  font-family:var(--font-mono);
  color:var(--ink);
  margin-top:.35rem;
  letter-spacing:-.01em;
}

/* Quantity stepper */
.qty-stepper{
  display:flex; align-items:center;
  border:1.5px solid var(--line);
  border-radius:999px;
  height:2.4rem;
  flex-shrink:0;
  overflow:hidden;
  background:#fff;
  box-shadow: 0 1px 4px rgba(6,10,31,.05);
}
@media (max-width: 639px) {
  .qty-stepper { margin-left: 5.6rem; } /* Align with text by skipping the thumbnail width */
}
.qty-stepper button{
  height:100%; width:2.4rem;
  display:flex; align-items:center; justify-content:center;
  color:var(--ink-600);
  transition: background .15s, color .15s;
}
.qty-stepper button:hover{ background:var(--paper); color:var(--ink-900); }
.qty-stepper button .icon{ width:.9rem; height:.9rem; }
.qty-stepper span{
  min-width:1.8rem; text-align:center;
  font-size:.85rem; font-weight:700;
  font-family:var(--font-mono);
  color:var(--ink-900);
  border-inline:1.5px solid var(--line);
  padding-inline:.25rem;
  line-height:2.4rem;
}

/* Remove button */
.remove-btn{
  flex-shrink:0; height:2.4rem; width:2.4rem;
  border-radius:999px;
  display:flex; align-items:center; justify-content:center;
  color:var(--muted);
  transition: background-color .15s, color .15s, transform .15s;
  border: 1.5px solid transparent;
}
.remove-btn .icon{ width:1rem; height:1rem; }
.remove-btn:hover{ background:rgba(242,129,29,.08); color:var(--gax); border-color:rgba(242,129,29,.2); transform: scale(1.1); }

/* Summary card */
.summary-card{
  border-radius:var(--radius-lg);
  border:1px solid var(--line);
  border-top:3px solid var(--gold-500);
  background:#fff;
  padding:1.25rem;
  position:sticky; top:6rem;
  box-shadow: 0 8px 30px -12px rgba(6,10,31,.1);
}
@media (min-width: 640px) {
  .summary-card{ padding:1.75rem; }
}
.summary-card-title{
  font-size:.7rem; font-weight:800;
  text-transform:uppercase; letter-spacing:.1em;
  color:var(--muted); margin-bottom:.85rem;
}

/* Order summary rows */
.summary-row{
  display:flex; justify-content:space-between; align-items:center;
  font-size:.9rem; padding-block:.5rem;
}
.summary-row .lbl{ color:var(--muted); font-weight:500; }
.summary-row .tabular{ font-family:var(--font-mono); font-weight:600; color:var(--ink); }
.summary-row.savings .lbl{ color:var(--max-dark); }
.summary-row.savings .tabular{ color:var(--max-dark); font-weight:700; }
.summary-row.total{
  padding-top:.9rem; margin-top:.5rem;
  border-top:2px solid var(--ink-50);
  font-size:1.05rem; font-weight:800;
}
.summary-row.total .lbl{ color:var(--ink-900); }
.summary-row.total .tabular{ font-size:1.2rem; color:var(--ink-900); letter-spacing:-.01em; }

/* ---------- Checkout stepper ---------- */
.checkout-wrap{ display:grid; gap:2rem; grid-template-columns:1fr; align-items:start; }
@media (min-width:1024px){ .checkout-wrap{ grid-template-columns:1fr 22rem; } }

/* Progress stepper bar */
.stepper{
  display:flex; align-items:center;
  gap:0; margin-bottom:2.25rem;
  overflow-x:auto; padding-bottom:.25rem;
  background:#fff;
  border:1px solid var(--line);
  border-radius:var(--radius-lg);
  padding:.85rem .75rem;
  box-shadow:0 2px 8px -4px rgba(6,10,31,.06);
}
@media (min-width: 640px) {
  .stepper{ padding:.85rem 1.25rem; }
}
.stepper .sp{ display:flex; align-items:center; gap:.55rem; flex-shrink:0; }
.stepper .num{
  display:flex; height:2rem; width:2rem;
  align-items:center; justify-content:center;
  border-radius:999px; font-size:.78rem; font-weight:700;
  background:var(--paper); color:var(--muted);
  border:1.5px solid var(--line);
  transition:background .2s, color .2s, border-color .2s, box-shadow .2s;
  flex-shrink:0;
}
.stepper .sp.active .num{
  background:var(--ink); color:#fff; border-color:var(--ink);
  box-shadow:0 4px 12px -4px rgba(6,10,31,.35);
}
.stepper .sp.done .num{
  background:var(--max); color:#fff; border-color:var(--max);
  box-shadow:0 4px 12px -4px rgba(47,168,79,.35);
}
.stepper .label{ font-size:.78rem; font-weight:600; color:var(--muted); white-space:nowrap; }
.stepper .sp.active .label{ color:var(--ink-900); font-weight:700; }
.stepper .sp.done .label{ color:var(--max-dark); }
.stepper .line{
  flex:1; min-width:1.5rem; height:2px;
  background:var(--line);
  margin-inline:.5rem;
  border-radius:999px;
  transition:background .3s;
}
.stepper .line.done{ background:var(--max); }

/* Step panels */
.step-panel{ display:none; }
.step-panel.active{ display:block; }

/* Form card wrapper */
.checkout-form-card{
  border-radius:var(--radius-lg);
  border:1px solid var(--line);
  background:#fff;
  padding:1.25rem;
  box-shadow:0 4px 20px -8px rgba(6,10,31,.08);
}
@media (min-width: 640px) {
  .checkout-form-card{ padding:2rem; }
}
.checkout-form-card h2{
  font-family:var(--font-display);
  font-size:1.15rem; font-weight:700;
  color:var(--ink-900);
  margin-bottom:1.5rem;
  padding-bottom:1rem;
  border-bottom:1px solid var(--line);
  display:flex; align-items:center; gap:.65rem;
}
.checkout-form-card h2 .step-ico{
  display:flex; align-items:center; justify-content:center;
  width:2.25rem; height:2.25rem; border-radius:.65rem;
  background:var(--ink-50); color:var(--ink-700); flex-shrink:0;
}
.checkout-form-card h2 .step-ico .icon{ width:1.1rem; height:1.1rem; }

/* Form nav buttons */
.checkout-nav{
  display:flex; flex-direction:column-reverse; align-items:stretch;
  margin-top:2rem; padding-top:1.25rem;
  border-top:1px solid var(--line);
  gap:1rem;
}
@media (min-width: 640px) {
  .checkout-nav{ flex-direction:row; justify-content:space-between; align-items:center; }
  .checkout-nav .btn { width: auto; }
}
.checkout-nav.end{ justify-content:flex-end; }
.checkout-nav .btn { justify-content: center; width: 100%; }

/* Payment method cards */
.payment-grid{ display:grid; grid-template-columns:1fr; gap:1rem; }
@media (min-width:480px){ .payment-grid{ grid-template-columns:1fr 1fr; } }
.payment-card{
  display:flex; flex-direction:column; align-items:flex-start; gap:.75rem;
  border:2px solid var(--line); border-radius:var(--radius-lg);
  background:#fff; padding:1.25rem 1.25rem 1.5rem;
  text-align:left; width:100%;
  transition:border-color .2s var(--ease), box-shadow .2s var(--ease), transform .2s var(--ease);
  cursor:pointer;
}
.payment-card:hover{
  border-color:var(--ink-300);
  box-shadow:0 8px 24px -8px rgba(6,10,31,.12);
  transform:translateY(-2px);
}
.payment-card.selected{
  border-color:var(--ink);
  box-shadow:0 8px 24px -8px rgba(6,10,31,.2);
}
.payment-card .pc-icon{
  display:flex; align-items:center; justify-content:center;
  width:2.75rem; height:2.75rem; border-radius:.75rem;
  background:var(--ink-50); color:var(--ink-700);
}
.payment-card .pc-icon .icon{ width:1.4rem; height:1.4rem; }
.payment-card strong{ font-size:.95rem; font-weight:700; color:var(--ink-900); }
.payment-card span{ font-size:.8rem; color:var(--muted); line-height:1.45; }

/* QR payment block */
.qr-pay-box{
  text-align:center;
  border-radius:var(--radius-lg);
  border:1px solid var(--line);
  background:#fff;
  padding:1.5rem 1rem;
  box-shadow:0 4px 20px -8px rgba(6,10,31,.08);
}
@media (min-width: 640px) {
  .qr-pay-box{ padding:2.5rem 2rem; }
}
.qr-placeholder{
  display:flex; align-items:center; justify-content:center;
  width:10rem; height:10rem; margin:0 auto 1.25rem;
  border:1px solid var(--line);
  border-radius:1.25rem;
  background:linear-gradient(160deg,#fff 0%,var(--paper) 100%);
  color:var(--ink-700);
  box-shadow:0 10px 28px -12px rgba(6,10,31,.18), inset 0 0 0 1px rgba(255,255,255,.6);
  overflow:hidden; padding:.6rem;
}
.qr-placeholder .icon{ width:5.25rem; height:5.25rem; }
.qr-placeholder img{ width:100%; height:100%; object-fit:contain; border-radius:.75rem; }
.qr-upi-amount{
  font-family:var(--font-display); font-size:2rem; font-weight:800;
  color:var(--ink-900); letter-spacing:-.02em;
  margin-bottom:.35rem;
}
.qr-upi-id{
  font-size:.85rem; color:var(--muted);
}
.qr-upi-id strong{ color:var(--ink); }
.qr-verify-note{
  display:inline-flex; align-items:center; gap:.4rem;
  font-size:.76rem; font-weight:600; color:var(--max-dark);
  background:var(--max-tint); padding:.35rem .75rem; border-radius:999px;
  margin-top:.85rem;
}
.qr-verify-note .icon{ width:.85rem; height:.85rem; flex-shrink:0; }

/* Order review items (step 3) */
.review-line{
  display:flex; align-items:center; gap:1rem;
  padding:1rem 0; border-bottom:1px solid var(--line);
}
.review-line:last-child{ border-bottom:none; padding-bottom:0; }
.review-line .info{ flex:1; min-width:0; }
.review-line .info .rname{ font-size:.9rem; font-weight:700; color:var(--ink-900); }
.review-line .info .rmeta{ font-size:.78rem; color:var(--muted); margin-top:.15rem; }
.review-line .rprice{ font-family:var(--font-mono); font-weight:800; color:var(--ink); font-size:.95rem; }

/* Delivery summary box (step 3) */
.delivery-box{
  margin-top:1.25rem; padding:1rem 1.25rem;
  background:#F8FAFC; border-radius:.85rem;
  border:1px solid rgba(6,10,31,.07);
  font-size:.875rem; color:var(--ink-600); line-height:1.6;
}
.delivery-box strong{ color:var(--ink-900); display:block; margin-bottom:.2rem; }

/* Checkout summary sidebar */
.checkout-summary{
  position:sticky; top:6rem;
  border-radius:var(--radius-lg);
  border:1px solid var(--line);
  border-top:3px solid var(--gold-500);
  background:#fff;
  padding:1.25rem;
  box-shadow:0 8px 30px -12px rgba(6,10,31,.1);
}
@media (min-width: 640px) {
  .checkout-summary{ padding:1.75rem; }
}
.checkout-summary .cs-title{
  font-size:.7rem; font-weight:800;
  text-transform:uppercase; letter-spacing:.1em;
  color:var(--muted); margin-bottom:1rem;
}
.checkout-summary .line-item{
  display:flex; justify-content:space-between; gap:.75rem;
  font-size:.85rem; padding-block:.45rem;
  border-bottom:1px dashed rgba(6,10,31,.07);
}
.checkout-summary .line-item:last-child{ border-bottom:none; }
.checkout-summary .line-item .n{ color:var(--ink-700); font-weight:500; }
.checkout-summary .line-item .p{ font-family:var(--font-mono); font-weight:700; color:var(--ink); flex-shrink:0; }
.checkout-summary .cs-breakdown{ margin-top:.4rem; padding-top:.4rem; border-top:1px solid var(--ink-50); }
.checkout-summary .cs-total{
  display:flex; justify-content:space-between; align-items:center;
  padding-top:.85rem; margin-top:.65rem;
  border-top:2px solid var(--ink-50);
  font-weight:800;
}
.checkout-summary .cs-total span:first-child{ font-size:.95rem; color:var(--ink-900); }
.checkout-summary .cs-total span:last-child{ font-family:var(--font-mono); font-size:1.2rem; color:var(--ink-900); letter-spacing:-.01em; }
.checkout-summary .cs-type{
  margin-top:1.1rem; padding:.7rem 1rem;
  background:#F8FAFC; border-radius:.85rem;
  border:1px solid rgba(6,10,31,.07);
  display:flex; align-items:center; gap:.6rem;
  font-size:.8rem; color:var(--ink-600);
}
.checkout-summary .cs-type .icon{ color:var(--max-dark); width:1rem; height:1rem; flex-shrink:0; }

/* Confirmation screen */
.confirm-box{
  border-radius:var(--radius-xl);
  border:1px solid var(--line);
  background:#fff;
  text-align:center;
  padding:2rem 1.25rem;
  box-shadow:0 8px 40px -12px rgba(6,10,31,.12);
}
@media (min-width: 640px) {
  .confirm-box{ padding:3.5rem 2rem; }
}
.confirm-box .check-circle{
  margin-inline:auto; margin-bottom:1.75rem;
  display:flex; height:5.5rem; width:5.5rem;
  align-items:center; justify-content:center;
  border-radius:999px;
  background:linear-gradient(135deg, var(--max-tint), #d4f8e0);
  color:var(--max-dark);
  box-shadow:0 12px 32px -10px rgba(47,168,79,.35);
}
.confirm-box .check-circle .icon{ width:2.4rem; height:2.4rem; }
.confirm-box h2{
  font-family:var(--font-display);
  font-size:1.5rem; font-weight:800;
  color:var(--ink-900); letter-spacing:-.02em;
  margin-bottom:.65rem;
}
.confirm-box .conf-sub{
  font-size:.95rem; color:var(--muted);
  max-width:28rem; margin-inline:auto;
  line-height:1.65; margin-bottom:2rem;
}
.confirm-box .conf-sub strong{ color:var(--ink); }
.confirm-actions{ display:flex; flex-wrap:wrap; gap:.85rem; justify-content:center; }

/* ---------- Forms ---------- */
.field-input{ display:flex; align-items:center; gap:.65rem; border-radius:.65rem; border:1px solid var(--line); background:var(--paper); padding-inline:.9rem; height:2.85rem; transition:border-color .15s, background-color .15s; }
.field-input:focus-within{ border-color:var(--teal-500); background:#fff; }
.field-input .icon{ color:var(--muted); width:1rem; height:1rem; flex-shrink:0; }
.field-input input, .field-input select{ flex:1; background:transparent; border:0; outline:none; font-size:.875rem; }
.field-input input::placeholder{ color:var(--muted); }
textarea.field-textarea{ width:100%; border-radius:.65rem; border:1px solid var(--line); background:var(--paper); padding:.85rem .9rem; font-size:.875rem; outline:none; resize:vertical; min-height:9rem; transition:border-color .15s, background-color .15s; }
textarea.field-textarea:focus{ border-color:var(--teal-500); background:#fff; }
label.field-label-text{ font-size:.8rem; font-weight:600; margin-bottom:.4rem; display:block; }
.form-grid{ display:grid; gap:1rem; grid-template-columns:1fr; }
@media (min-width:560px){ .form-grid.cols-2{ grid-template-columns:1fr 1fr; } }
.tab-toggle{ display:grid; grid-template-columns:1fr 1fr; gap:.4rem; border-radius:.6rem; background:var(--paper); padding:.25rem; margin-bottom:1.5rem; }
.tab-toggle button{ padding:.65rem; border-radius:.45rem; font-size:.875rem; font-weight:600; color:var(--ink-600); transition:.15s; }
.tab-toggle button.active{ background:var(--ink); color:#fff; box-shadow:var(--shadow-card); }


/* ---------- Auth split layout ---------- */
.auth-screen{
  position:relative; display:flex; align-items:center; justify-content:center;
  min-height:calc(100vh - 7rem); padding:2.5rem 1.25rem; overflow:hidden;
}
/* The admin login page has no site header/footer around it (bare
   layouts/admin-auth.blade.php), so the "- 7rem" allowance made for the
   storefront's sticky header doesn't apply — without this, the gradient
   backdrop fell short of the full viewport and left a band of plain white
   page background beneath the card. */
body.admin-auth-body{ min-height:100vh; }
body.admin-auth-body .auth-screen{ min-height:100vh; }
.auth-bg{
  position:absolute; inset:0; z-index:0;
  background:
    radial-gradient(ellipse at 15% 85%, rgba(6,10,31,.1) 0%, transparent 55%),
    radial-gradient(ellipse at 85% 10%, rgba(212,160,23,.18) 0%, transparent 50%),
    radial-gradient(ellipse at 50% 50%, rgba(6,10,31,.06) 0%, transparent 70%),
    linear-gradient(135deg, #f2f3f7 0%, #f5f6fa 40%, #fcf8ee 100%);
}
.auth-card{
  position:relative; z-index:1;
  display:flex; flex-direction:column;
  width:100%; max-width:56rem;
  border-radius:1.5rem;
  overflow:hidden;
  box-shadow:0 24px 64px rgba(6,10,31,.18), 0 4px 16px rgba(6,10,31,.08);
  border:1px solid rgba(255,255,255,.7);
}
@media (min-width:820px){ .auth-card{ flex-direction:row; min-height:34rem; } }

/* Left — dark glass brand panel */
.auth-left{
  display:flex; flex-direction:column; justify-content:center;
  padding:2.5rem 2rem;
  background:linear-gradient(145deg, rgba(6,10,31,.96) 0%, rgba(6,10,31,.88) 100%);
  backdrop-filter:blur(18px); -webkit-backdrop-filter:blur(18px);
  position:relative; overflow:hidden;
}
@media (min-width:820px){ .auth-left{ flex:0 0 44%; padding:3rem 2.5rem; } }
.auth-left::before{
  content:''; position:absolute; inset:0; pointer-events:none;
  background:
    radial-gradient(ellipse at 10% 90%, rgba(233,190,74,.14) 0%, transparent 55%),
    radial-gradient(ellipse at 90% 5%, rgba(212,160,23,.22) 0%, transparent 50%);
}
.auth-left::after{
  content:''; position:absolute; inset:0; pointer-events:none; opacity:.5;
  background-image:
    radial-gradient(1.5px 1.5px at 12% 18%, rgba(212,160,23,.8), transparent 60%),
    radial-gradient(1px 1px at 28% 62%, rgba(233,190,74,.7), transparent 60%),
    radial-gradient(1.5px 1.5px at 46% 30%, rgba(212,160,23,.6), transparent 60%),
    radial-gradient(1px 1px at 64% 74%, rgba(233,190,74,.65), transparent 60%),
    radial-gradient(2px 2px at 78% 22%, rgba(212,160,23,.75), transparent 60%),
    radial-gradient(1px 1px at 90% 60%, rgba(233,190,74,.6), transparent 60%);
}
.auth-left > *{ position:relative; }

/* Right — frosted light form panel */
.auth-right{
  flex:1; display:flex; flex-direction:column; justify-content:center;
  padding:2.5rem 2rem;
  background:rgba(255,255,255,.82);
  backdrop-filter:blur(24px); -webkit-backdrop-filter:blur(24px);
}
@media (min-width:820px){ .auth-right{ padding:3rem 2.75rem; } }

/* Trust rows */
.auth-trust-row{
  display:flex; align-items:center; gap:.75rem;
  font-size:.82rem; color:rgba(255,255,255,.75);
}
.auth-trust-ico{
  display:flex; height:1.85rem; width:1.85rem; flex-shrink:0;
  border-radius:999px; align-items:center; justify-content:center;
  background:rgba(255,255,255,.1); border:1px solid rgba(255,255,255,.12);
}
.auth-trust-ico .icon{ width:.9rem; height:.9rem; color:var(--teal-300); }

/* Account dashboard */
.account-layout{ display:grid; gap:2rem; grid-template-columns:1fr; }
@media (min-width:900px){ .account-layout{ grid-template-columns:14rem 1fr; } }
.account-nav{ display:flex; flex-direction:row; gap:.35rem; overflow-x:auto; padding-bottom:.25rem; }
@media (min-width:900px){ .account-nav{ flex-direction:column; overflow:visible; } }
.account-nav button{ display:flex; align-items:center; gap:.6rem; padding:.7rem .9rem; border-radius:.65rem; font-size:.85rem; font-weight:600; color:var(--ink-600); white-space:nowrap; transition:.15s; text-align:left; }
.account-nav button:hover{ background:var(--paper); }
.account-nav button.active{ background:var(--ink); color:#fff; }
.account-panel{ border-radius:var(--radius-lg); border:1px solid var(--line); background:var(--surface); padding:1.5rem; }
@media (min-width:768px){ .account-panel{ padding:2rem; } }
.order-row{ display:flex; align-items:center; justify-content:space-between; gap:1rem; padding:1rem 0; border-bottom:1px solid var(--line); flex-wrap:wrap; }
.order-row:last-child{ border-bottom:0; }

/* ---------- Quick Order (homepage) ---------- */
.quick-order-section{ margin-top:-1.25rem; margin-bottom:0; position:relative; z-index:5; }
.quick-order-card{ background:var(--ink-900); border-radius:1.25rem; padding:1.75rem; box-shadow:0 24px 48px -20px rgba(6,10,31,.45); display:flex; flex-direction:column; gap:1.1rem; }
@media (min-width:768px){ .quick-order-card{ padding:2.25rem 2.5rem; } }
.qo-head .qo-badge{ display:inline-flex; align-items:center; gap:.4rem; font-size:.72rem; font-weight:800; text-transform:uppercase; letter-spacing:.05em; color:var(--gold-300); background:rgba(212,160,23,.14); padding:.35rem .75rem; border-radius:999px; margin-bottom:.7rem; }
.qo-head h2{ font-family:var(--font-display); font-size:1.4rem; font-weight:700; color:#fff; margin-bottom:.35rem; }
.qo-head p{ font-size:.85rem; color:rgba(255,255,255,.65); }
.qo-search{ display:flex; align-items:center; gap:.6rem; background:#fff; border-radius:.85rem; padding:.9rem 1.1rem; }
.qo-search .icon{ width:1.1rem; height:1.1rem; color:var(--muted); flex-shrink:0; }
.qo-search input{ flex:1; border:0; outline:none; font-size:.95rem; background:transparent; }
.qo-results{ display:flex; flex-direction:column; gap:.6rem; }
.qo-result{ display:flex; align-items:center; gap:.75rem; background:rgba(255,255,255,.06); border-radius:.75rem; padding:.6rem .85rem; }
.qo-result-info{ flex:1; display:flex; flex-direction:column; min-width:0; }
.qo-result-info .n{ font-size:.85rem; font-weight:700; color:#fff; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.qo-result-info .u{ font-size:.72rem; color:rgba(255,255,255,.55); }
.qo-result-price{ font-size:.85rem; font-weight:700; color:var(--gold-300); flex-shrink:0; }
.qo-empty{ font-size:.82rem; color:rgba(255,255,255,.65); }
.qo-empty a{ color:var(--gold-300); font-weight:700; }

/* ---------- Order tracking timeline ---------- */
.track-timeline{ display:flex; align-items:flex-start; }
.tt-step{ display:flex; flex-direction:column; align-items:center; gap:.5rem; flex-shrink:0; width:5.5rem; text-align:center; }
.tt-dot{ display:flex; align-items:center; justify-content:center; height:1.7rem; width:1.7rem; border-radius:999px; border:2px solid var(--line); background:#fff; color:#fff; flex-shrink:0; }
.tt-step.done .tt-dot{ background:var(--gold-500); border-color:var(--gold-500); }
.tt-step.active .tt-dot{ border-color:var(--gold-500); background:var(--gold-50); box-shadow:0 0 0 4px var(--gold-100); }
.tt-label{ font-size:.7rem; font-weight:700; color:var(--muted); line-height:1.3; }
.tt-step.done .tt-label, .tt-step.active .tt-label{ color:var(--ink-900); }
.tt-line{ flex:1; height:2px; background:var(--line); margin-top:.85rem; min-width:1rem; }

/* ---------- Bulk order ---------- */
.bulk-results{ display:flex; flex-direction:column; gap:.4rem; }
.bulk-row{ display:flex; align-items:center; gap:.75rem; padding:.6rem .8rem; border:1px solid var(--line); border-radius:.6rem; background:#fff; }
.bulk-row .bn{ font-weight:600; font-size:.85rem; flex:1; }
.bulk-row .bu{ font-size:.75rem; }
.bulk-row + .bulk-row{ margin-top:.4rem; }
#bulk-list-wrap .bulk-row{ margin-bottom:.5rem; }
.status-pill{ font-size:.7rem; font-weight:700; padding:.3rem .7rem; border-radius:999px; }
.status-pill.placed{ background:var(--fax-tint); color:var(--fax-dark); }
.status-pill.delivered{ background:var(--max-tint); color:var(--max-dark); }
.status-pill.processing{ background:var(--gax-tint); color:var(--gax-dark); }
.status-pill.confirmed,
.status-pill.payment-pending,
.status-pill.payment-confirmed,
.status-pill.order-accepted{ background:var(--gold-100); color:var(--gold-700); }
.status-pill.packed{ background:var(--gax-tint); color:var(--gax-dark); }
.status-pill.ready-for-pickup,
.status-pill.out-for-delivery{ background:var(--fax-tint); color:var(--fax-dark); }
.status-pill.cancelled,
.status-pill.refunded{ background:#FBE4E4; color:#B3261E; }
.status-pill.returned{ background:var(--gold-100); color:var(--gold-700); }

/* ---------- Order actions bar (checkout / invoice) ---------- */
.order-actions-bar{ display:flex; flex-wrap:wrap; gap:.6rem; margin-bottom:1.5rem; }
.oab-btn{ display:inline-flex; align-items:center; gap:.4rem; padding:.55rem 1rem; border-radius:.6rem; border:1px solid var(--line); background:#fff; font-size:.8rem; font-weight:600; color:var(--ink-700); transition:.15s; }
.oab-btn:hover{ background:var(--paper); }
.oab-btn.oab-whatsapp{ color:#1DA851; border-color:#C3E6CB; background:#EAF8EE; }
.oab-btn.oab-whatsapp:hover{ background:#DCF3E2; }

/* ---------- Invoice box ---------- */
.invoice-box{ border:1px dashed var(--line); border-radius:1rem; padding:1.25rem 1.4rem; margin:1.75rem 0; text-align:left; background:var(--paper); }
.invoice-head{ display:flex; justify-content:space-between; font-weight:800; font-size:.85rem; color:var(--ink-900); text-transform:uppercase; letter-spacing:.04em; padding-bottom:.75rem; border-bottom:1px solid var(--line); margin-bottom:.6rem; }
.invoice-row{ display:flex; justify-content:space-between; font-size:.85rem; padding:.3rem 0; color:var(--ink-700); }
.invoice-row.total{ font-weight:800; color:var(--ink-900); border-top:1px solid var(--line); margin-top:.5rem; padding-top:.6rem; font-size:.95rem; }
.invoice-meta{ display:flex; flex-wrap:wrap; gap:.5rem; align-items:center; margin-top:.9rem; padding-top:.75rem; border-top:1px solid var(--line); font-size:.78rem; color:var(--muted); }
.invoice-meta span:not(.status-pill){ background:#fff; border:1px solid var(--line); border-radius:999px; padding:.25rem .65rem; }

/* ---------- Auto-issued login credentials box ---------- */
.credentials-box{ border:1px solid var(--gold-300); background:var(--gold-50); border-radius:1rem; padding:1.25rem 1.4rem; margin-bottom:1.75rem; text-align:left; }
.credentials-box .cb-title{ font-weight:800; font-size:.9rem; color:var(--gold-700); display:flex; align-items:center; gap:.4rem; margin-bottom:.3rem; }
.credentials-box .cb-row{ display:flex; justify-content:space-between; align-items:center; padding:.5rem 0; border-top:1px solid rgba(140,100,16,.18); font-size:.85rem; }
.credentials-box .cb-row:first-of-type{ border-top:0; }
.credentials-box .cb-row strong{ font-size:.95rem; color:var(--ink-900); letter-spacing:.02em; }

/* ---------- Print (invoice-friendly) ---------- */
@media print{
  .site-header, .site-drawer, .site-drawer-overlay, .site-footer, .fab-container,
  .order-actions-bar, .stepper, .checkout-summary, .confirm-actions, .toast-stack{ display:none !important; }
  .checkout-page{ padding:0 !important; }
  .invoice-box{ border:1px solid #000; background:#fff; }
}

/* ---------- Toast ---------- */
.toast-stack{ position:fixed; bottom:1.25rem; left:50%; transform:translateX(-50%); z-index:200; display:flex; flex-direction:column; gap:.5rem; align-items:center; width:100%; padding-inline:1rem; pointer-events:none; }
.toast{ display:flex; align-items:center; gap:.6rem; background:var(--ink); color:#fff; font-size:.83rem; font-weight:500; padding:.75rem 1.1rem; border-radius:.7rem; box-shadow:var(--shadow-pop); opacity:0; transform:translateY(12px); transition:opacity .25s var(--ease), transform .25s var(--ease); }
.toast.show{ opacity:1; transform:translateY(0); }
.toast .icon{ color:var(--teal-400); width:1rem; height:1rem; flex-shrink:0; }

/* ---------- Reveal animation ---------- */
.reveal{ opacity:0; transform:translateY(18px); transition:opacity .7s var(--ease), transform .7s var(--ease); }
.reveal.in{ opacity:1; transform:translateY(0); }
.reveal-stagger > *{ opacity:0; transform:translateY(16px); transition:opacity .6s var(--ease), transform .6s var(--ease); }
.reveal-stagger.in > *{ opacity:1; transform:translateY(0); }
.reveal-stagger.in > *:nth-child(1){ transition-delay:.02s; }
.reveal-stagger.in > *:nth-child(2){ transition-delay:.07s; }
.reveal-stagger.in > *:nth-child(3){ transition-delay:.12s; }
.reveal-stagger.in > *:nth-child(4){ transition-delay:.17s; }
.reveal-stagger.in > *:nth-child(5){ transition-delay:.22s; }
.reveal-stagger.in > *:nth-child(6){ transition-delay:.27s; }
.reveal-stagger.in > *:nth-child(7){ transition-delay:.32s; }
.reveal-stagger.in > *:nth-child(8){ transition-delay:.37s; }
.reveal-stagger.in > *:nth-child(n+9){ transition-delay:.4s; }

/* ---------- Skeleton (loading) ---------- */
@keyframes shimmer{ 0%{ background-position:-200% 0; } 100%{ background-position:200% 0; } }
.skeleton{ background:linear-gradient(90deg, var(--paper) 25%, var(--ink-50) 37%, var(--paper) 63%); background-size:200% 100%; animation:shimmer 1.4s ease infinite; border-radius:var(--radius-lg); }

/* ---------- Misc pages: policy content ---------- */
.prose{ max-width:48rem; }
.prose h2{ font-family:var(--font-display); font-weight:700; font-size:1.2rem; margin-top:2rem; margin-bottom:.75rem; }
.prose h2:first-child{ margin-top:0; }
.prose p{ font-size:.9rem; color:var(--ink-600); line-height:1.75; margin-bottom:.9rem; }
.prose ul{ margin-bottom:.9rem; padding-left:1.2rem; list-style:disc; }
.prose li{ font-size:.9rem; color:var(--ink-600); line-height:1.75; margin-bottom:.35rem; }
.updated-note{ font-size:.8rem; color:var(--muted); margin-bottom:2rem; }

/* Contact page */
.contact-grid{ display:grid; gap:2rem; grid-template-columns:1fr; }
@media (min-width:900px){ .contact-grid{ grid-template-columns:1fr 1.1fr; } }
.contact-info-card{ border-radius:var(--radius-lg); border:1px solid var(--line); background:var(--surface); padding:1.75rem; display:flex; flex-direction:column; gap:1.4rem; }
.contact-info-card .row{ display:flex; gap:.9rem; align-items:flex-start; }
.contact-info-card .row .ico{ flex-shrink:0; display:flex; height:2.4rem; width:2.4rem; align-items:center; justify-content:center; border-radius:.7rem; background:rgba(212,160,23,.1); color:var(--teal-600); }
.contact-info-card .row h4{ font-size:.85rem; font-weight:600; margin-bottom:.2rem; }
.contact-info-card .row p{ font-size:.83rem; color:var(--muted); line-height:1.5; }
.map-box{ border-radius:var(--radius-lg); overflow:hidden; border:1px solid var(--line); aspect-ratio:16/10; position:relative; background:var(--hub-gradient-soft); display:flex; align-items:center; justify-content:center; }
.map-box .pin{ display:flex; flex-direction:column; align-items:center; gap:.4rem; color:var(--ink); }
.map-box .pin .icon{ width:2rem; height:2rem; color:var(--fax-dark); }

/* 404 */
.notfound{ text-align:center; padding-block:6rem; }

/* ---------- Spacing normalization ---------- */
/* Consistent section rhythm: every top-level home section contributes
   the same padding-block, so adjacent sections sum to one uniform gap
   (2rem + 2rem = 4rem mobile, 3rem + 3rem = 6rem desktop) instead of the
   mismatched values that used to stack unevenly between sections. */
main > .section,
main > .container.section{
  padding-block:2rem;
}
@media (min-width:768px){
  main > .section,
  main > .container.section{
    padding-block:3rem;
  }
}
.section-head{
  gap:.65rem;
  margin-bottom:1.25rem;
}
.section-head p{ margin-top:.35rem; }
.site-footer{ margin-top:2.5rem; }
.hero-inner{
  min-height:auto;
  gap:2.5rem;
  padding-block:2rem;
}
@media (min-width:768px){
  .hero-inner{ padding-block:3rem; }
}
@media (min-width:960px){
  .hero-inner{ gap:3rem; }
}
.hero-badge{ margin-bottom:1.25rem; }
.hero p.lead{ margin-top:1rem; }
.hero-cta{ margin-top:1.45rem; }
.hero-stats{
  margin-top:1.7rem;
  padding-top:1.25rem;
}
.stat-icon{ margin-bottom:.8rem; }
.hero-assurance{
  margin-top:1.6rem;
  padding:.75rem .9rem;
}
.hero-inner > div:last-child{
  gap:1.35rem !important;
  padding-top:0;
}
.hub-orbit{ max-width:24rem; }
.pricing-explorer{ padding:1.35rem; }
.pe-product{ margin-block:.9rem .8rem; }
.pe-price-box{ margin-top:1rem; }
.trust-grid{
  gap:1.15rem;
  padding-block:1.6rem;
}
.divisions-section .section-head{ margin-bottom:.75rem; }
.division-grid,
.category-grid,
.product-grid,
.gallery-grid,
.blog-grid{
  gap:.9rem;
}
@media (min-width:1024px){
  .product-grid{ gap:1rem; }
}
.steps-grid{ margin-block:0; }
.step-item{ padding:1.15rem; gap:.75rem; }
.about-grid{ gap:1.6rem; }
.about-dark h2{ margin-bottom:.7rem; }
.roadmap-grid{ gap:.55rem; }
.pricing-table-wrap{ margin-top:0; }
.cta-strip{ padding:2.3rem 1.35rem; }
@media (min-width:768px){
  .cta-strip{ padding:2.75rem 3rem; }
}
.cta-strip h2{ margin-bottom:.65rem; }
.cta-strip p{ margin-bottom:1.15rem; }
@media (max-width:640px){
  .hero-inner{ gap:2rem; }
  .hero-stats{ gap:.75rem; }
  .hero-assurance{ margin-top:1.25rem; }
}

/* ---------- 3D rotating hub orbit ---------- */
.hub-orbit{
  perspective:900px;
  transform-style:preserve-3d;
  overflow:visible;
}
.hub-orbit svg.rings,
.hub-orbit::before{
  transform:rotateX(58deg) rotateZ(0deg);
  transform-origin:center;
}
.hub-orbit svg.rings{
  filter:drop-shadow(0 16px 18px rgba(6,10,31,.05));
}
.orbit-ring{
  animation:orbit-3d-spin 16s linear infinite;
  transform-origin:50% 50%;
  transform-style:preserve-3d;
  will-change:transform;
}
.orbit-node{
  animation:orbit-3d-counter 16s linear infinite;
  transform-origin:center;
  will-change:transform;
}
.orbit-node .chip{
  transform:translateZ(28px);
  border-color:#2858AE !important;
  box-shadow:0 18px 28px -18px rgba(21,56,126,.55), 0 1px 0 rgba(255,255,255,.95) inset;
}
.orbit-node:nth-child(1){ z-index:4; }
.orbit-node:nth-child(2){ z-index:3; }
.orbit-node:nth-child(3){ z-index:3; }
.hub-center{
  z-index:2;
  pointer-events:none;
}
.hub-center-inner{
  position:relative;
  overflow:hidden;
  transform:translateZ(48px);
  animation:hub-float-3d 4.8s ease-in-out infinite;
}
.hub-center-inner::before{
  content:"";
  position:absolute;
  inset:0;
  background:linear-gradient(145deg, rgba(255,255,255,.18), transparent 42%);
  pointer-events:none;
}
.hub-center-inner img{
  width:2.75rem;
  height:2.75rem;
  object-fit:cover;
  border-radius:999px;
  margin-bottom:.35rem;
  border:2px solid rgba(255,255,255,.72);
  box-shadow:0 10px 22px -12px rgba(6,10,31,.65);
}
.hub-center-inner .t1,
.hub-center-inner .t2{
  position:relative;
  text-shadow:0 1px 2px rgba(6,10,31,.25);
}
.hub-center-inner .t1{ font-size:1rem; }
.hub-center-inner .t2{ font-size:.58rem; }
@keyframes orbit-3d-spin{
  from{ transform:rotateX(58deg) rotateZ(0deg); }
  to{ transform:rotateX(58deg) rotateZ(360deg); }
}
@keyframes orbit-3d-counter{
  from{ transform:translate(-50%,-50%) rotateZ(0deg) rotateX(-58deg); }
  to{ transform:translate(-50%,-50%) rotateZ(-360deg) rotateX(-58deg); }
}
@keyframes hub-float-3d{
  0%,100%{ transform:translateZ(48px) translateY(0) scale(1); }
  50%{ transform:translateZ(58px) translateY(-5px) scale(1.015); }
}
@media (prefers-reduced-motion: reduce){
  .orbit-ring,
  .orbit-node,
  .hub-center-inner{
    animation:none !important;
  }
}
@media (max-width:640px){
  .orbit-node .chip{
    transform:translateZ(22px) scale(.86);
  }
  .hub-center-inner img{
    width:2.25rem;
    height:2.25rem;
  }
}

/* Utility */
.mt-0{ margin-top:0 !important; }
.hidden{ display:none !important; }
@media (max-width:767px){ .hide-mobile{ display:none !important; } }
@media (min-width:768px){ .hide-desktop{ display:none !important; } }

/* ---------- Missing Category Styles ---------- */
.cat-circle-row { display:flex; flex-wrap:wrap; gap:1.5rem; justify-content:center; padding:1.5rem 0; }
@media (min-width: 900px) { .cat-circle-row { justify-content:space-between; gap:1rem; flex-wrap:nowrap; } }
.cat-circle { display:flex; flex-direction:column; align-items:center; gap:0.75rem; text-align:center; transition:transform 0.2s; width:80px; }
@media (min-width: 768px) { .cat-circle { width:100px; } }
.cat-circle:hover { transform:translateY(-4px); }
.cat-circle-img { width:100%; aspect-ratio:1/1; border-radius:50%; overflow:hidden; background:var(--surface); display:flex; align-items:center; justify-content:center; border:1px solid var(--line); box-shadow:var(--shadow-card); transition:box-shadow 0.2s, border-color 0.2s; }
.cat-circle:hover .cat-circle-img { box-shadow:var(--shadow-lift); border-color:var(--gold-500); }
.cat-circle img { width:70%; height:70%; object-fit:contain; }
.cat-circle-name { font-size:0.75rem; font-weight:600; color:var(--ink-700); line-height:1.2; margin-top:0.2rem; }

/* ---------- Division Cards (Explore Our Divisions) ---------- */
.div-cards-grid { display:grid; grid-template-columns:1fr; gap:1.25rem; }
@media (min-width:760px){ .div-cards-grid{ grid-template-columns:repeat(3,1fr); } }

.div-card {
  border-radius:1.25rem;
  overflow:hidden;
  display:flex;
  flex-direction:row;
  min-height:220px;
  position:relative;
  box-shadow:0 4px 24px rgba(6,10,31,.16);
  border:1px solid transparent;
  transition:transform .25s var(--ease), box-shadow .25s var(--ease), border-color .25s var(--ease);
}
.div-card:hover{
  transform:translateY(-5px);
  box-shadow:0 16px 40px -12px rgba(6,10,31,.35), 0 0 0 1px rgba(var(--gold-rgb),.4), 0 0 26px -4px rgba(var(--gold-rgb),.35);
  border-color:rgba(var(--gold-rgb),.5);
}

/* Left content area */
.div-card-body {
  flex:0 0 58%;
  display:flex;
  flex-direction:column;
  justify-content:flex-start;
  padding:1.4rem 1.25rem 1.4rem 1.5rem;
  z-index:2;
  gap:.5rem;
}

/* Division pill badge */
.div-card-pill {
  display:inline-flex;
  align-items:center;
  gap:.45rem;
  background:#fff;
  border-radius:999px;
  padding:.3rem .75rem .3rem .3rem;
  align-self:flex-start;
  margin-bottom:.3rem;
  box-shadow:0 1px 4px rgba(0,0,0,.12);
}
.div-card-dot {
  display:flex;
  align-items:center;
  justify-content:center;
  width:1.35rem;
  height:1.35rem;
  border-radius:50%;
  flex-shrink:0;
}

/* Title & description */
.div-card-title {
  font-family:var(--font-display);
  font-weight:700;
  font-size:1.2rem;
  color:#fff;
  line-height:1.2;
  margin:0;
}
.div-card-desc {
  font-size:.85rem;
  color:rgba(255,255,255,.88);
  line-height:1.45;
  margin:0;
  flex:1;
}

/* Shop button */
.div-card-btn {
  display:inline-flex;
  align-items:center;
  gap:.35rem;
  background:#fff;
  color:var(--ink);
  font-size:.82rem;
  font-weight:700;
  border-radius:999px;
  padding:.45rem 1.1rem;
  align-self:flex-start;
  margin-top:auto;
  transition:background-color .18s var(--ease), color .18s var(--ease), transform .18s var(--ease), box-shadow .18s var(--ease);
  box-shadow:0 1px 4px rgba(0,0,0,.10);
}
.div-card-btn:hover{ background:var(--gold-500); color:#fff; transform:translateX(3px) scale(1.03); box-shadow:0 6px 16px -4px rgba(var(--gold-rgb),.6); }
.div-card:hover .div-card-pill{ box-shadow:0 4px 12px -2px rgba(0,0,0,.25); }
.div-card-pill{ transition:box-shadow .25s var(--ease); }

/* Right photo area */
.div-card-photo {
  flex:1;
  position:relative;
  overflow:hidden;
}
.div-card-photo img {
  transition:transform .5s var(--ease);
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  object-fit:cover;
  object-position:center;
}

/* ---------- About Dark New (Built to Grow) ---------- */
.about-dark-new {
  position:relative;
  background:linear-gradient(160deg, var(--ink-900) 0%, var(--ink-800) 100%);
  overflow:hidden;
  padding-block:2rem;
  isolation:isolate;
}
@media (min-width:768px){ .about-dark-new{ padding-block:3rem; } }
.about-dark-new::after{
  content:""; position:absolute; inset:0; z-index:0; pointer-events:none; opacity:.4;
  background-image:
    radial-gradient(1.5px 1.5px at 10% 20%, rgba(var(--gold-rgb),.8), transparent 60%),
    radial-gradient(1px 1px at 22% 65%, rgba(233,190,74,.65), transparent 60%),
    radial-gradient(2px 2px at 33% 10%, rgba(var(--gold-rgb),.7), transparent 60%),
    radial-gradient(1px 1px at 45% 78%, rgba(233,190,74,.55), transparent 60%),
    radial-gradient(1.5px 1.5px at 60% 35%, rgba(var(--gold-rgb),.75), transparent 60%),
    radial-gradient(1px 1px at 75% 15%, rgba(233,190,74,.6), transparent 60%),
    radial-gradient(2px 2px at 87% 60%, rgba(var(--gold-rgb),.8), transparent 60%),
    radial-gradient(1px 1px at 95% 30%, rgba(233,190,74,.55), transparent 60%);
}
.about-dark-new > *{ position:relative; z-index:1; }
.about-dark-glow {
  position:absolute;
  border-radius:50%;
  filter:blur(90px);
  opacity:.35;
  pointer-events:none;
}
.about-glow-1 {
  width:30rem; height:30rem;
  background:radial-gradient(circle, var(--ink-500) 0%, transparent 70%);
  top:-8rem; left:-8rem;
}
.about-glow-2 {
  width:25rem; height:25rem;
  background:radial-gradient(circle, var(--gold-500) 0%, transparent 70%);
  bottom:-6rem; right:-4rem;
}
.about-grid-new {
  position:relative;
  display:grid;
  grid-template-columns:1fr;
  gap:3rem;
  align-items:center;
}
@media (min-width:900px){ .about-grid-new { grid-template-columns:1fr 1.1fr; } }

.about-left { display:flex; flex-direction:column; gap:1rem; }
.about-eyebrow {
  font-size:.72rem; font-weight:700; letter-spacing:.14em;
  color:var(--teal-400); text-transform:uppercase;
}
.about-title {
  font-family:var(--font-display); font-weight:700;
  font-size:2rem; line-height:1.15; color:#fff;
  letter-spacing:-.015em;
}
@media (min-width:640px){ .about-title { font-size:2.5rem; } }
.about-body {
  font-size:.95rem; color:rgba(255,255,255,.65);
  line-height:1.7; max-width:28rem;
}
.about-cta-btn {
  display:inline-flex; align-items:center; gap:.5rem;
  margin-top:.5rem; align-self:flex-start;
  background:rgba(255,255,255,.1);
  border:1px solid rgba(255,255,255,.2);
  color:#fff; font-weight:600; font-size:.875rem;
  padding:.65rem 1.4rem; border-radius:999px;
  transition:background .2s, border-color .2s;
  backdrop-filter:blur(6px);
}
.about-cta-btn:hover { background:rgba(255,255,255,.18); border-color:rgba(255,255,255,.4); }

.about-right { display:flex; flex-direction:column; gap:1.1rem; }
.about-roadmap-label {
  font-size:.7rem; font-weight:700; letter-spacing:.12em;
  color:rgba(255,255,255,.4); text-transform:uppercase;
}
.roadmap-grid-new {
  display:grid;
  grid-template-columns:repeat(2,1fr);
  gap:.7rem;
}
@media (min-width:480px){ .roadmap-grid-new { grid-template-columns:repeat(3,1fr); } }
.roadmap-item-new {
  display:flex; align-items:center; gap:.65rem;
  background:rgba(255,255,255,.06);
  border:1px solid rgba(255,255,255,.1);
  border-radius:.85rem;
  padding:.85rem 1rem;
  transition:background .2s, border-color .2s, transform .2s;
  cursor:default;
}
.roadmap-item-new:hover {
  background:rgba(255,255,255,.12);
  border-color:rgba(255,255,255,.25);
  transform:translateY(-2px);
}
.rm-icon { color:var(--teal-400); flex-shrink:0; }
.rm-icon .icon { width:1.1rem; height:1.1rem; }
.roadmap-item-new span:last-child {
  font-size:.78rem; font-weight:500;
  color:rgba(255,255,255,.8); line-height:1.3;
}

.footer-col h3 { font-family:var(--font-display); font-weight:700; font-size:0.85rem; letter-spacing:0.05em; text-transform:uppercase; color:#fff; margin-bottom:1.25rem; }
.footer-bottom { border-top:1px solid rgba(255,255,255,0.1); background:var(--ink); margin-top:3rem; }
.footer-bottom .container { display:flex; flex-direction:column; gap:1rem; align-items:center; justify-content:space-between; padding-block:1.5rem; font-size:0.8rem; color:rgba(255,255,255,0.6); }
@media (min-width: 768px) { .footer-bottom .container { flex-direction:row; } }

/* ---------- Popular Categories Section ---------- */
.popular-cats-section {
  background: linear-gradient(180deg, #f0f7ff 0%, #ffffff 100%);
  padding-block: 2rem;
  border-top: 1px solid var(--line);
  border-bottom: 1px solid var(--line);
}
@media (min-width:768px){ .popular-cats-section{ padding-block:3rem; } }
.pop-cat-row {
  display: flex;
  flex-wrap: nowrap;
  gap: 1.5rem;
  overflow-x: auto;
  padding: 0.5rem 0.25rem 1rem;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: none;
}
.pop-cat-row::-webkit-scrollbar { display: none; }
@media (min-width: 900px) {
  .pop-cat-row { gap: 2.25rem; }
}
.pop-cat-item {
  display: flex; flex-direction: column; align-items: center;
  gap: 0.9rem; flex-shrink: 0; width: 110px; text-align: center;
  transition: transform 0.25s cubic-bezier(.2,.8,.2,1);
}
@media (min-width: 768px) { .pop-cat-item { width: 128px; } }
@media (min-width: 900px) { .pop-cat-item { width: 148px; } }
.pop-cat-item:hover { transform: translateY(-6px) scale(1.03); }
.pop-cat-circle {
  width: 100%; aspect-ratio: 1/1; border-radius: 50%;
  overflow: hidden; background: #fff; padding: 5px;
  display: flex; align-items: center; justify-content: center;
  border: 2.5px solid var(--gold-100);
  box-shadow: 0 6px 20px rgba(212,160,23,.12), 0 2px 6px rgba(0,0,0,.06);
  transition: box-shadow .25s, border-color .25s;
}
.pop-cat-item:hover .pop-cat-circle {
  border-color: var(--gold-500);
  box-shadow: 0 14px 34px rgba(212,160,23,.26), 0 4px 12px rgba(0,0,0,.09);
}
.pop-cat-circle img { width: 100%; height: 100%; object-fit: cover; border-radius: 50%; }
.pop-cat-name {
  font-size: 0.82rem; font-weight: 600;
  color: var(--ink-700); line-height: 1.3;
  transition: color .2s;
}
@media (min-width: 900px) { .pop-cat-name { font-size: 0.9rem; } }
.pop-cat-item:hover .pop-cat-name { color: var(--teal-600); }

/* ---------- How It Works (Steps Container) ---------- */
.steps-container {
  display: flex;
  flex-direction: column;
  background: #ffffff;
  border-radius: 1.25rem;
  box-shadow: 0 12px 40px rgba(0,0,0,0.04), 0 2px 6px rgba(0,0,0,0.02);
  border: 1px solid var(--line);
  overflow: hidden;
}
@media (min-width: 900px) {
  .steps-container { flex-direction: row; }
}

.step-card {
  flex: 1;
  padding: 2.2rem 1.8rem;
  border-bottom: 1px solid var(--line);
  display: flex;
  flex-direction: column;
  gap: 1.25rem;
  position: relative;
  transition: background 0.3s ease;
  z-index: 1;
}
.step-card:hover {
  background: #fbfdff;
}
@media (min-width: 900px) {
  .step-card { border-bottom: none; border-right: 1px solid var(--line); }
  .step-card:last-child { border-right: none; }
}

.step-top {
  display: flex;
  justify-content: flex-start;
  align-items: center;
}

.step-icon {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 3.2rem;
  height: 3.2rem;
  border-radius: 50%;
  background: linear-gradient(135deg, var(--ink-800) 0%, var(--gold-500) 100%);
  color: #fff;
  transition: transform 0.3s ease, box-shadow 0.3s ease;
  box-shadow: 0 4px 12px rgba(212,160,23, 0.15);
}
.step-card:hover .step-icon {
  transform: translateY(-4px) scale(1.05);
  box-shadow: 0 10px 24px rgba(212,160,23, 0.3);
}
.step-icon .icon { width: 1.4rem; height: 1.4rem; }

/* Clear highlighting badge for the number */
.step-idx {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: rgba(212,160,23, 0.12);
  color: var(--gold-700);
  font-family: var(--font-mono);
  font-size: 0.85rem;
  font-weight: 800;
  padding: 0.3rem 0.8rem;
  border-radius: 999px;
  letter-spacing: 0.05em;
  transition: background 0.3s ease, color 0.3s ease;
}
.step-card:hover .step-idx {
  background: var(--ink-800);
  color: #fff;
}

.step-body h3 {
  font-size: 1.15rem;
  font-weight: 700;
  color: var(--ink);
  margin-bottom: 0.6rem;
  font-family: var(--font-display);
  transition: color 0.3s ease;
}
.step-card:hover .step-body h3 {
  color: var(--gold-700);
}

.step-body p {
  font-size: 0.92rem;
  color: var(--ink-600);
  line-height: 1.6;
}

/* ---------- Floating Action Buttons ---------- */
.fab-container {
  position: fixed;
  bottom: 1.5rem;
  left: 0;
  right: 0;
  pointer-events: none;
  display: flex;
  justify-content: space-between;
  padding: 0 1.5rem;
  z-index: 999;
}

.fab-btn {
  pointer-events: auto;
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 3.5rem;
  height: 3.5rem;
  border-radius: 50%;
  color: #fff;
  box-shadow: 0 6px 16px rgba(0,0,0,0.25);
  transition: transform 0.2s, box-shadow 0.2s;
}
.fab-btn::before{
  content:""; position:absolute; inset:0; border-radius:50%; z-index:-1;
  box-shadow:0 0 0 0 var(--fab-glow, rgba(0,0,0,.3));
  animation:fab-pulse 2.6s var(--ease) infinite;
}
.fab-btn:hover {
  transform: translateY(-4px) scale(1.05);
  box-shadow: 0 10px 24px rgba(0,0,0,0.3);
}
.fab-btn .icon {
  width: 1.6rem;
  height: 1.6rem;
}
@keyframes fab-pulse{
  0%{ box-shadow:0 0 0 0 var(--fab-glow, rgba(0,0,0,.3)); opacity:.5; }
  70%{ box-shadow:0 0 0 .9rem var(--fab-glow, rgba(0,0,0,0)); opacity:0; }
  100%{ box-shadow:0 0 0 0 var(--fab-glow, rgba(0,0,0,0)); opacity:0; }
}
@media (prefers-reduced-motion: reduce){ .fab-btn::before{ animation:none; display:none; } }

.call-fab {
  background: var(--fax);
  --fab-glow: rgba(30,112,184,.55);
}
.call-fab:hover {
  background: #197bb5;
}

.wa-fab {
  background: #25D366;
  --fab-glow: rgba(37,211,102,.55);
}
.wa-fab:hover {
  background: #20bd5a;
}

/* ---------- Purchase type pill (header) ---------- */
.purchase-type-pill{ display:none; align-items:center; gap:.35rem; padding:.4rem .75rem; border-radius:999px; background:var(--gold-50); color:var(--gold-700); font-size:.72rem; font-weight:700; border:1px solid var(--gold-300); transition:background-color .15s var(--ease); }
@media (min-width: 768px) {
  .purchase-type-pill{ display:inline-flex; }
}
.purchase-type-pill:hover{ background:var(--gold-100); }
.profile-bar .grp span.active{ display:inline-flex; align-items:center; gap:.3rem; padding:.35rem .7rem; border-radius:999px; background:var(--ink); color:#fff; font-weight:600; }

/* ---------- Type Selection page ---------- */
.type-option-grid{ display:flex; flex-direction:column; gap:1.25rem; margin-top: 1rem; }
.type-option{ background:#fff; border:2px solid var(--line); border-radius:1rem; padding:1.5rem; display:flex; flex-direction:column; gap:1rem; transition:border-color .2s var(--ease), box-shadow .2s var(--ease); }
.type-option:hover{ border-color:var(--teal-300); }
.type-option.active{ border-color:var(--gold-500); background:#FFFCF9; box-shadow:0 12px 32px -12px rgba(212,160,23,.25); }
.to-top-row { display:flex; flex-direction:column; gap:1rem; }
@media (min-width: 640px) { .to-top-row { flex-direction:row; align-items:center; justify-content:space-between; gap:2rem; } }
.to-info { flex:1; }
.to-head{ display:flex; align-items:center; justify-content:space-between; gap:.5rem; font-weight:700; font-size:1.15rem; margin-bottom: 0.4rem; }
.to-name{ display:flex; align-items:center; gap:.5rem; }
.to-price{ font-size:1.4rem; font-weight:800; color:var(--ink); }
.to-desc{ font-size:.9rem; color:var(--muted); line-height:1.5; }
.to-action { flex-shrink:0; min-width: 12rem; }

.golden-panel{ margin-top:.75rem; padding-top:1.25rem; border-top:1px dashed rgba(212,160,23,.3); }
.golden-panel .check-circle{ margin:0 auto .85rem; display:flex; height:4rem; width:4rem; align-items:center; justify-content:center; border-radius:999px; background:var(--gold-100); color:var(--gold-700); }
.golden-panel .check-circle .icon{ width:1.8rem; height:1.8rem; }

.qr-pay-block{ display:flex; align-items:center; justify-content:center; height:9rem; width:9rem; margin:0 auto; border:2px dashed var(--line); border-radius:1rem; background:var(--paper); color:var(--ink-600); overflow:hidden; padding:.4rem; }
.qr-pay-block img{ width:100%; height:100%; object-fit:contain; border-radius:.5rem; }

/* ---------- Admin ---------- */
.admin-table{ width:100%; border-collapse:collapse; font-size:.8rem; min-width:44rem; }
.admin-table th{ text-align:left; font-size:.68rem; text-transform:uppercase; letter-spacing:.04em; color:var(--muted); padding:.5rem .6rem; border-bottom:1px solid var(--line); }
.admin-table td{ padding:.55rem .6rem; border-bottom:1px solid var(--line); vertical-align:middle; }
.admin-table input[type="number"], .admin-table input[type="text"]{ border:1px solid var(--line); border-radius:.4rem; padding:.35rem .5rem; font-family:var(--font-mono); font-size:.8rem; }

/* ---------- FAQ accordion ---------- */
.faq-group{ margin-bottom:2rem; }
.faq-group-title{ font-family:var(--font-display); font-weight:700; font-size:1.05rem; margin-bottom:.85rem; color:var(--ink); }
.faq-item{ border:1px solid var(--line); border-radius:var(--radius-lg); background:var(--surface); margin-bottom:.75rem; overflow:hidden; }
.faq-item summary{ display:flex; align-items:center; justify-content:space-between; gap:1rem; padding:1rem 1.25rem; font-weight:600; font-size:.92rem; cursor:pointer; list-style:none; color:var(--ink); }
.faq-item summary::-webkit-details-marker{ display:none; }
.faq-item .faq-chevron{ flex-shrink:0; color:var(--muted); transition:transform .2s var(--ease); }
.faq-item[open] .faq-chevron{ transform:rotate(180deg); }
.faq-item[open] summary{ border-bottom:1px solid var(--line); }
.faq-answer{ padding:0 1.25rem 1.1rem; font-size:.88rem; line-height:1.7; color:var(--ink-600); }
.admin-badge{ display:inline-flex; align-items:center; justify-content:center; min-width:1.1rem; height:1.1rem; padding:0 .3rem; border-radius:999px; background:var(--gax); color:#fff; font-size:.65rem; font-weight:700; margin-left:.3rem; }

/* ============================================================
   Storefront redesign polish — Aug 2026
   Visual-only refinements layered on top of the design system
   above. No markup structure, data-hooks or JS behaviour is
   touched — only look & feel: colour, depth, spacing, motion.
   ============================================================ */

/* ---------- Header: more depth, premium chrome ---------- */
.site-header{ box-shadow:0 1px 0 rgba(6,10,31,.04), 0 12px 30px -24px rgba(6,10,31,.35); }
.utility-bar{ background:linear-gradient(90deg, var(--ink-900) 0%, var(--ink-800) 60%, var(--ink-700) 100%); }
.nav-strip .container{ gap:2rem; }
.nav-strip a{ position:relative; padding-block:.2rem; transition:color .15s, opacity .15s, transform .2s var(--ease); }
.nav-strip a:hover{ transform:translateY(-1px); }
.nav-strip a::after{
  content:""; position:absolute; left:0; right:0; bottom:-.15rem; height:2px;
  background:currentColor; border-radius:2px; transform:scaleX(0); transform-origin:center;
  transition:transform .2s var(--ease);
}
.nav-strip a:hover::after, .nav-strip a.active::after{ transform:scaleX(1); }
.purchase-type-pill{ background:linear-gradient(135deg, var(--gold-50) 0%, var(--gold-100) 100%); box-shadow:0 1px 3px rgba(140,100,16,.12); transition:background-color .15s var(--ease), box-shadow .2s var(--ease), transform .2s var(--ease); }
.purchase-type-pill:hover{ transform:translateY(-1px); box-shadow:0 4px 12px -4px rgba(212,160,23,.4); }
.search-form{ box-shadow:inset 0 1px 2px rgba(6,10,31,.04); transition:border-color .15s, background-color .15s, box-shadow .2s var(--ease); }
.search-form:focus-within{ box-shadow:0 0 0 4px rgba(212,160,23,.14); }

/* ---------- Banner slider: framed, premium chrome ---------- */
.banner-slider-section{ background:linear-gradient(180deg, var(--ink-900) 0%, var(--ink-800) 100%); padding-bottom:3px; border-bottom:3px solid var(--gold-500); }
.banner-slider{ box-shadow:0 30px 60px -30px rgba(6,10,31,.55); }
.bs-slide::after{
  content:""; position:absolute; inset:0; pointer-events:none;
  background:linear-gradient(180deg, rgba(6,10,31,.16) 0%, transparent 16%, transparent 78%, rgba(6,10,31,.28) 100%);
}
.bs-arrow{ background:rgba(6,10,31,.55); backdrop-filter:blur(6px); border:1px solid rgba(255,255,255,.18); height:2.75rem; width:2.75rem; }
.bs-arrow:hover{ background:var(--gold-500); border-color:var(--gold-500); }
.bs-dots{ bottom:1.35rem; gap:.55rem; }
.bs-dots button{ height:.55rem; width:.55rem; background:rgba(255,255,255,.55); border-color:rgba(255,255,255,.65); box-shadow:0 1px 4px rgba(0,0,0,.25); }
.bs-dots button.active{ width:1.9rem; background:var(--gold-500); border-color:var(--gold-500); }

/* ---------- Popular categories: lift + ring ---------- */
.popular-cats-section{ background:var(--surface); border-bottom:1px solid var(--line); }
.pop-cat-circle{ box-shadow:0 1px 2px rgba(6,10,31,.05), 0 14px 28px -14px rgba(6,10,31,.3); border:2.5px solid var(--gold-100); }
.pop-cat-item:hover .pop-cat-circle{ box-shadow:0 20px 38px -16px rgba(212,160,23,.5); border-color:var(--gold-400); }

/* ---------- Quick order card: gradient + accent ---------- */
.quick-order-card{
  background:linear-gradient(135deg, var(--ink-900) 0%, var(--ink-800) 55%, #142449 100%);
  border-top:3px solid var(--gold-500);
  position:relative; overflow:hidden; isolation:isolate;
}
.quick-order-card::before{
  content:""; position:absolute; top:-40%; right:-10%; width:22rem; height:22rem; border-radius:50%;
  background:radial-gradient(circle, rgba(212,160,23,.16) 0%, transparent 70%); pointer-events:none; z-index:0;
}
.quick-order-card::after{
  content:""; position:absolute; inset:0; z-index:0; pointer-events:none; opacity:.45;
  background-image:
    radial-gradient(1.5px 1.5px at 8% 20%, rgba(var(--gold-rgb),.85), transparent 60%),
    radial-gradient(1px 1px at 20% 62%, rgba(233,190,74,.65), transparent 60%),
    radial-gradient(2px 2px at 34% 8%, rgba(var(--gold-rgb),.7), transparent 60%),
    radial-gradient(1px 1px at 50% 75%, rgba(233,190,74,.55), transparent 60%),
    radial-gradient(1.5px 1.5px at 66% 30%, rgba(var(--gold-rgb),.75), transparent 60%),
    radial-gradient(1px 1px at 80% 55%, rgba(233,190,74,.6), transparent 60%),
    radial-gradient(2px 2px at 92% 18%, rgba(var(--gold-rgb),.8), transparent 60%);
}
.quick-order-card > *{ position:relative; z-index:1; }
.qo-search{ box-shadow:0 10px 24px -14px rgba(0,0,0,.35); }
.qo-search:focus-within{ box-shadow:0 0 0 4px rgba(212,160,23,.25); }

/* ---------- Trust strip: card tiles ---------- */
.trust-strip{ background:var(--paper); border-block:none; padding-block:2rem; }
@media (min-width:768px){ .trust-strip{ padding-block:3rem; } }
.trust-grid{ padding-block:0; gap:1.1rem; }
.trust-item{
  background:var(--surface); border:1px solid var(--line); border-radius:var(--radius-lg);
  padding:1.25rem 1.35rem; box-shadow:var(--shadow-card); transition:transform .18s var(--ease), box-shadow .18s var(--ease);
}
.trust-item:hover{ transform:translateY(-3px); box-shadow:var(--shadow-lift); }
.trust-item .ico{ background:linear-gradient(135deg, var(--gold-100) 0%, var(--gold-50) 100%); }

/* ---------- Section rhythm ---------- */
.about-dark-new{ box-shadow:inset 0 1px 0 rgba(255,255,255,.06); }

/* ---------- Gallery / blog teaser: lift on hover ---------- */
.gallery-grid > *, .blog-grid > *{ transition:transform .22s var(--ease), box-shadow .22s var(--ease); }
.gallery-grid > *:hover, .blog-grid > *:hover{ transform:translateY(-4px); }

/* ---------- Footer: premium dark panel ---------- */
.site-footer{
  background:linear-gradient(180deg, var(--ink-900) 0%, #081226 100%);
  border-top:3px solid var(--gold-500);
  position:relative; overflow:hidden; isolation:isolate;
}
.site-footer::before{
  content:""; position:absolute; top:-30%; left:10%; width:32rem; height:32rem; border-radius:50%;
  background:radial-gradient(circle, rgba(var(--gold-rgb),.1) 0%, transparent 70%); pointer-events:none;
}
.site-footer::after{
  content:""; position:absolute; inset:0; z-index:0; pointer-events:none; opacity:.4;
  background-image:
    radial-gradient(1.5px 1.5px at 6% 15%, rgba(var(--gold-rgb),.85), transparent 60%),
    radial-gradient(1px 1px at 14% 55%, rgba(233,190,74,.7), transparent 60%),
    radial-gradient(2px 2px at 23% 80%, rgba(var(--gold-rgb),.7), transparent 60%),
    radial-gradient(1px 1px at 35% 30%, rgba(233,190,74,.6), transparent 60%),
    radial-gradient(1.5px 1.5px at 48% 65%, rgba(var(--gold-rgb),.75), transparent 60%),
    radial-gradient(1px 1px at 58% 10%, rgba(233,190,74,.65), transparent 60%),
    radial-gradient(2px 2px at 68% 45%, rgba(var(--gold-rgb),.8), transparent 60%),
    radial-gradient(1px 1px at 79% 72%, rgba(233,190,74,.6), transparent 60%),
    radial-gradient(1.5px 1.5px at 88% 20%, rgba(var(--gold-rgb),.75), transparent 60%),
    radial-gradient(1px 1px at 94% 58%, rgba(233,190,74,.55), transparent 60%);
}
.site-footer .container{ position:relative; z-index:1; }
.footer-col h3{ position:relative; padding-bottom:.6rem; }
.footer-col h3::after{ content:""; position:absolute; left:0; bottom:0; width:1.75rem; height:2px; background:var(--gold-500); border-radius:2px; }
.footer-col a:hover{ padding-left:.15rem; }
.footer-social a{ background:rgba(255,255,255,.06); border:1px solid rgba(255,255,255,.1); transition:background-color .18s, border-color .18s, transform .18s; }
.footer-social a:hover{ background:var(--gold-500); border-color:var(--gold-500); color:var(--ink-900); transform:translateY(-2px); }
.footer-bottom{ border-top-color:rgba(255,255,255,.08); margin-top:0; }
.footer-grid{ padding-block:3rem 2.5rem; }
@media (min-width:1024px){ .footer-grid{ padding-block:3.25rem 2.5rem; } }
.footer-col .footer-social{ margin-top:1.4rem; }


/* ---------- Careers ---------- */
.careers-label{ font-size:.72rem; font-weight:700; letter-spacing:.08em; text-transform:uppercase; color:var(--muted); margin-bottom:.75rem; }
.careers-cats{ display:grid; grid-template-columns:repeat(auto-fill,minmax(13rem,1fr)); gap:.75rem; margin-bottom:1.75rem; }
.careers-cat{ display:flex; align-items:center; gap:.8rem; padding:.85rem 1rem; border:1px solid var(--line); background:var(--surface); border-radius:var(--radius-md); box-shadow:var(--shadow-card); transition:border-color .15s, box-shadow .15s, transform .15s; }
.careers-cat:hover{ border-color:var(--gold-400); box-shadow:var(--shadow-lift); transform:translateY(-2px); }
.careers-cat.active{ border-color:var(--gold-500); background:var(--gold-50); box-shadow:0 0 0 1px var(--gold-500), var(--shadow-card); }
.careers-cat-icon{ flex-shrink:0; display:flex; align-items:center; justify-content:center; width:2.4rem; height:2.4rem; border-radius:.7rem; background:var(--gold-100); color:var(--gold-700); }
.careers-cat-icon .icon{ width:1.1rem; height:1.1rem; }
.careers-cat-name{ font-weight:700; font-size:.9rem; color:var(--ink-900); line-height:1.25; }
.careers-cat-count{ font-size:.75rem; color:var(--muted); margin-top:.1rem; }

.careers-filters{ padding:1.25rem 1.4rem; margin-bottom:1.75rem; }
.careers-filters-grid{ display:grid; grid-template-columns:1fr; gap:1rem; }
@media (min-width:640px){ .careers-filters-grid{ grid-template-columns:repeat(2,minmax(0,1fr)); } }
@media (min-width:1024px){ .careers-filters-grid{ grid-template-columns:repeat(3,minmax(0,1fr)); } }
.careers-filters-actions{ display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:.75rem; margin-top:1.1rem; padding-top:1.1rem; border-top:1px solid var(--line); }
.careers-filters-actions .btns{ display:flex; gap:.6rem; flex-wrap:wrap; }
.careers-result-count{ font-size:.85rem; color:var(--muted); }
.careers-result-count strong{ color:var(--ink-900); }

.field-input.field-select{ padding-right:.6rem; }
.field-input.field-select select{ appearance:none; -webkit-appearance:none; width:100%; height:100%; min-width:0; padding-right:1.6rem; cursor:pointer; color:var(--ink); background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%235B6B7F' stroke-width='2' stroke-linecap='round'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E"); background-repeat:no-repeat; background-position:right .1rem center; }
.field-input.field-file{ height:auto; min-height:2.85rem; }
.field-input input[type=file]{ padding:.55rem 0; font-size:.82rem; min-width:0; }

.careers-jobs{ display:grid; gap:1rem; }
.job-card{ padding:1.35rem 1.5rem; display:grid; gap:.9rem; }
.job-card:hover{ box-shadow:var(--shadow-lift); border-color:var(--gold-300); }
.job-card-head{ display:flex; justify-content:space-between; align-items:flex-start; gap:1rem; flex-wrap:wrap; }
.job-card-title{ font-family:var(--font-display); font-size:1.2rem; font-weight:700; color:var(--ink-900); line-height:1.25; }
.job-card-title a:hover{ color:var(--gold-700); }
.job-card-place{ display:flex; align-items:center; gap:.35rem; font-size:.85rem; color:var(--muted); margin-top:.3rem; }
.job-card-place .icon{ width:.85rem; height:.85rem; }
.job-code{ font-family:ui-monospace,SFMono-Regular,Menlo,monospace; font-size:.72rem; font-weight:700; letter-spacing:.03em; color:var(--gold-700); background:var(--gold-50); border:1px solid var(--gold-100); padding:.3rem .6rem; border-radius:999px; white-space:nowrap; }
.job-tags{ display:flex; flex-wrap:wrap; gap:.5rem; }
.job-tag{ display:inline-flex; align-items:center; gap:.35rem; font-size:.78rem; font-weight:600; color:var(--ink-600); background:var(--paper); border:1px solid var(--line); padding:.32rem .7rem; border-radius:999px; }
.job-tag .icon{ width:.8rem; height:.8rem; color:var(--muted); }
.job-tag.salary{ color:var(--max-dark); background:var(--max-tint); border-color:transparent; }
.job-tag.salary .icon{ color:var(--max); }
.job-card-foot{ display:flex; justify-content:space-between; align-items:center; gap:.8rem; flex-wrap:wrap; padding-top:.9rem; border-top:1px solid var(--line); }
.job-vacancy{ display:flex; align-items:center; gap:.5rem; font-size:.82rem; color:var(--muted); }
.job-vacancy::before{ content:""; width:.5rem; height:.5rem; border-radius:999px; background:var(--max); box-shadow:0 0 0 3px var(--max-tint); }
.job-card-foot .btns{ display:flex; gap:.6rem; flex-wrap:wrap; }
@media (max-width:520px){ .job-card-foot .btns{ width:100%; } .job-card-foot .btns .btn{ flex:1; justify-content:center; } }

.careers-empty{ padding:2.5rem 1.5rem; text-align:center; }
.careers-empty p:first-child{ font-weight:700; color:var(--ink-900); }
.careers-track{ margin-top:2rem; padding:1.1rem 1.4rem; display:flex; align-items:center; justify-content:space-between; gap:1rem; flex-wrap:wrap; background:var(--ink-50); border-color:var(--ink-100); box-shadow:none; }
.careers-track p{ font-size:.9rem; color:var(--ink-700); }

.apply-form{ display:flex; flex-direction:column; gap:1.25rem; }
.apply-section{ padding:1.4rem 1.5rem; display:grid; gap:1rem; }
.apply-section-title{ display:flex; align-items:center; gap:.6rem; font-family:var(--font-display); font-weight:700; font-size:1.05rem; color:var(--ink-900); padding-bottom:.8rem; border-bottom:1px solid var(--line); }
.apply-section-title .step{ display:inline-flex; align-items:center; justify-content:center; width:1.6rem; height:1.6rem; border-radius:999px; background:var(--gold-100); color:var(--gold-700); font-size:.78rem; font-weight:800; }
.apply-row{ display:grid; grid-template-columns:repeat(auto-fit,minmax(13rem,1fr)); gap:1rem; }
.apply-summary{ display:grid; grid-template-columns:repeat(auto-fit,minmax(10rem,1fr)); gap:.8rem; }
.apply-summary div{ background:var(--paper); border-radius:.65rem; padding:.7rem .9rem; }
.apply-summary span{ display:block; font-size:.7rem; font-weight:700; letter-spacing:.06em; text-transform:uppercase; color:var(--muted); }
.apply-summary strong{ display:block; font-size:.9rem; color:var(--ink-900); margin-top:.15rem; }
.apply-checks{ display:grid; grid-template-columns:repeat(auto-fill,minmax(11rem,1fr)); gap:.55rem; }
.apply-check{ display:flex; align-items:center; gap:.55rem; font-size:.88rem; padding:.6rem .8rem; border:1px solid var(--line); border-radius:.65rem; background:var(--paper); cursor:pointer; transition:border-color .15s, background-color .15s; }
.apply-check:hover{ border-color:var(--gold-300); }
.apply-check:has(input:checked){ border-color:var(--gold-500); background:var(--gold-50); }
.apply-check input, .apply-consent input{ accent-color:var(--gold-700); width:1rem; height:1rem; flex-shrink:0; }
.apply-consent{ display:flex; align-items:flex-start; gap:.65rem; font-size:.9rem; line-height:1.55; cursor:pointer; }
.apply-consent input{ margin-top:.2rem; }
.apply-hint{ font-size:.75rem; color:var(--muted); margin-top:.35rem; }
.apply-errors{ padding:1rem 1.25rem; border-color:#fca5a5; background:#fef2f2; box-shadow:none; }
.apply-errors p{ font-weight:700; color:#b91c1c; }
.apply-errors ul{ font-size:.85rem; margin-top:.4rem; padding-left:1.1rem; color:#7f1d1d; list-style:disc; }
.apply-submit{ display:flex; align-items:center; justify-content:space-between; gap:1rem; flex-wrap:wrap; }
.apply-submit p{ font-size:.82rem; color:var(--muted); }
.req{ color:#dc2626; margin-left:.15rem; }