/* ============================================================
   ENDUROSHIELD DESIGN SYSTEM
   Navy #1B4F8A  ·  Gold #D4930A  ·  DM Serif Display + Inter
   Anti-AI: asymmetric layouts, grain, diagonal cuts, editorial
   ============================================================ */

/* ─── TOKENS ─────────────────────────────────────────────── */
:root {
  --navy:     #1B4F8A;
  --navy-d:   #0f2d52;
  --navy-m:   #1a3f6f;
  --gold:     #D4930A;
  --gold-h:   #b87d08;
  --gold-lt:  #fff8e8;
  --gold-pale:#fef3d0;
  --bg:       #f4f7fc;
  --bg-w:     #ffffff;
  --text-d:   #111827;
  --text-m:   #374151;
  --text-s:   #6B7280;
  --border:   #e5e7eb;
  --r-s: 8px; --r-m: 16px; --r-l: 22px; --r-xl: 28px;
  --sh-s: 0 1px 4px rgba(0,0,0,.06);
  --sh-m: 0 8px 32px rgba(0,0,0,.10);
  --sh-l: 0 20px 64px rgba(0,0,0,.14);
  --fh: 'Plus Jakarta Sans', sans-serif;
  --fd: 'DM Serif Display', Georgia, serif;
  --fb: 'Inter', sans-serif;
  --ease: cubic-bezier(0.22, 1, 0.36, 1);
}

/* ─── RESET ──────────────────────────────────────────────── */
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
html { scroll-behavior: smooth; font-size: 16px; }
body {
  font-family: var(--fb);
  color: var(--text-d);
  background: var(--bg-w);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}
img { max-width: 100%; display: block; }
a { text-decoration: none; color: inherit; }
svg { display: block; flex-shrink: 0; }
button { font-family: inherit; cursor: pointer; }
input, textarea, select { font-family: inherit; }

/* ─── GRAIN TEXTURE (anti-AI tactile depth) ─────────────── */
body::after {
  content: '';
  position: fixed; inset: 0;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='512' height='512'%3E%3Cfilter id='g'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.72' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='512' height='512' filter='url(%23g)' opacity='1'/%3E%3C/svg%3E");
  opacity: 0.026;
  pointer-events: none;
  z-index: 9999;
}

/* ─── SCROLL PROGRESS ────────────────────────────────────── */
.es-scroll-progress {
  position: fixed; top: 0; left: 0;
  height: 3px;
  background: linear-gradient(90deg, var(--gold), var(--navy));
  z-index: 202; width: 0%;
  transition: width .08s linear;
}

/* ─── SCROLL REVEAL ──────────────────────────────────────── */
[data-reveal] {
  opacity: 0;
  transform: translateY(28px);
  transition: opacity .72s var(--ease), transform .72s var(--ease);
}
[data-reveal].revealed { opacity: 1; transform: none; }
[data-reveal][data-delay="1"] { transition-delay: .09s; }
[data-reveal][data-delay="2"] { transition-delay: .18s; }
[data-reveal][data-delay="3"] { transition-delay: .27s; }
[data-reveal][data-delay="4"] { transition-delay: .36s; }
[data-reveal][data-delay="5"] { transition-delay: .46s; }

/* ─── UTILITIES ──────────────────────────────────────────── */
.es-wrap { max-width: 1100px; margin: 0 auto; padding: 0 24px; }
.es-wrap-sm { max-width: 880px; margin: 0 auto; padding: 0 24px; }
.sec-tag {
  text-align: center; font-size: 11px; font-weight: 700;
  letter-spacing: .13em; text-transform: uppercase;
  color: var(--gold); margin-bottom: 12px;
}
.sec-h {
  text-align: center; font-family: var(--fd);
  font-size: clamp(28px, 4vw, 50px);
  font-weight: 400; color: var(--text-d);
  line-height: 1.15; margin-bottom: 14px;
}
.sec-p {
  text-align: center; font-size: 16px; color: var(--text-m);
  max-width: 520px; margin: 0 auto 52px; line-height: 1.68;
}
.sec-tag.left, .sec-h.left, .sec-p.left { text-align: left; margin-left: 0; }

/* ─── BUTTONS ────────────────────────────────────────────── */
.btn-gold {
  display: inline-flex; align-items: center; gap: 8px;
  background: var(--gold); color: #fff;
  padding: 15px 30px; border-radius: var(--r-s);
  font-family: var(--fh); font-size: 15px; font-weight: 700;
  transition: background .2s, transform .2s, box-shadow .2s;
  box-shadow: 0 4px 22px rgba(212,147,10,.38);
  border: none;
}
.btn-gold:hover {
  background: var(--gold-h);
  transform: translateY(-2px) scale(1.015);
  box-shadow: 0 10px 32px rgba(212,147,10,.46);
  color: #fff;
}
.btn-outline {
  display: inline-flex; align-items: center; gap: 8px;
  background: transparent; color: var(--navy);
  padding: 15px 26px; border-radius: var(--r-s);
  font-family: var(--fh); font-size: 15px; font-weight: 600;
  border: 1.5px solid rgba(27,79,138,.3);
  transition: all .2s;
}
.btn-outline:hover {
  background: rgba(27,79,138,.06);
  border-color: var(--navy);
  transform: translateY(-1px);
}
.btn-ghost {
  display: inline-flex; align-items: center; gap: 6px;
  background: transparent; color: var(--gold);
  font-family: var(--fh); font-size: 14px; font-weight: 600;
  border: none; padding: 0; transition: gap .2s;
}
.btn-ghost:hover { gap: 10px; }

/* ─── ANNOUNCEMENT TICKER ────────────────────────────────── */
.es-ann {
  background: var(--navy); overflow: hidden;
  height: 38px; display: flex; align-items: center;
}
.es-ann-track {
  display: flex; animation: annScroll 24s linear infinite;
  white-space: nowrap; width: max-content; flex-shrink: 0;
}
.es-ann-track:hover { animation-play-state: paused; }
.es-ann-item {
  display: inline-flex; align-items: center;
  padding: 0 32px; font-size: 12.5px; font-weight: 500;
  color: rgba(255,255,255,.78); flex-shrink: 0;
}
.es-ann-item strong { color: var(--gold); }
.es-ann-sep {
  display: inline-block; width: 4px; height: 4px;
  background: rgba(255,255,255,.25); border-radius: 50%; flex-shrink: 0;
}
@keyframes annScroll { from { transform: translateX(0); } to { transform: translateX(-50%); } }

/* ─── NAVIGATION ─────────────────────────────────────────── */
.es-nav-wrap {
  position: sticky; top: 0; z-index: 100;
  background: rgba(255,255,255,.95);
  backdrop-filter: blur(18px);
  border-bottom: 1px solid var(--border);
}
.es-nav {
  max-width: 1100px; margin: 0 auto; padding: 0 24px;
  height: 64px; display: flex; align-items: center;
  justify-content: space-between; gap: 28px;
}
.es-logo {
  font-family: var(--fh); font-size: 20px; font-weight: 800;
  color: var(--navy); white-space: nowrap; flex-shrink: 0;
}
.es-logo span { color: var(--gold); }
.es-nav-links {
  display: flex; align-items: center; gap: 28px; list-style: none;
}
.es-nav-links a {
  font-size: 14px; font-weight: 500; color: var(--text-m);
  transition: color .2s; white-space: nowrap;
}
.es-nav-links a:hover, .es-nav-links a.active { color: var(--navy); }
.es-nav-links a.active { border-bottom: 2px solid var(--gold); padding-bottom: 2px; }
.es-nav-cta {
  background: var(--gold) !important; color: #fff !important;
  padding: 9px 20px; border-radius: var(--r-s);
  font-weight: 700 !important; font-size: 14px !important;
  transition: background .2s !important; flex-shrink: 0;
  box-shadow: 0 2px 12px rgba(212,147,10,.32);
}
.es-nav-cta:hover { background: var(--gold-h) !important; border-bottom: none !important; }
.es-cart-link {
  position: relative; display: flex; align-items: center; gap: 6px;
  font-size: 14px; font-weight: 500; color: var(--text-m);
}
.es-cart-count {
  position: absolute; top: -8px; right: -10px;
  background: var(--gold); color: #fff;
  width: 18px; height: 18px; border-radius: 50%;
  font-size: 10px; font-weight: 700;
  display: flex; align-items: center; justify-content: center;
}
.es-nav-tog {
  display: none; background: none; border: none; cursor: pointer;
  flex-direction: column; gap: 5px; padding: 4px;
}
.es-nav-tog span { display: block; width: 24px; height: 2px; background: var(--navy); border-radius: 2px; }

/* ─── TRUST MARQUEE ──────────────────────────────────────── */
.es-trust-bar {
  border-bottom: 1px solid var(--border); background: var(--bg-w);
  overflow: hidden; position: relative; z-index: 2;
}
.es-trust-marquee { display: flex; overflow: hidden; }
.es-trust-track {
  display: flex; flex-shrink: 0;
  animation: mq 36s linear infinite; width: max-content;
}
.es-trust-marquee:hover .es-trust-track { animation-play-state: paused; }
@keyframes mq { from { transform: translateX(0); } to { transform: translateX(-50%); } }
.es-mq-item {
  display: flex; align-items: center; gap: 10px;
  padding: 17px 36px; border-right: 1px solid var(--border);
  white-space: nowrap; font-size: 13px; font-weight: 600;
  color: var(--text-m); flex-shrink: 0;
}
.es-mq-item svg { color: var(--navy); flex-shrink: 0; }
.es-mq-item strong { color: var(--text-d); }

/* ─── PAGE HERO (inner pages) ────────────────────────────── */
.es-page-hero {
  background: linear-gradient(145deg, #ffffff 0%, #eef4ff 42%, #dce8ff 100%);
  padding: 72px 24px 80px; position: relative; overflow: hidden;
}
.es-page-hero::before {
  content: ''; position: absolute; top: -80px; right: -60px;
  width: 500px; height: 500px;
  background: radial-gradient(circle, rgba(212,147,10,.07) 0%, transparent 62%);
  pointer-events: none;
}
.es-page-hero-inner {
  max-width: 1100px; margin: 0 auto;
  display: grid; grid-template-columns: 1fr 1fr;
  gap: 48px; align-items: center; position: relative; z-index: 1;
}
.es-page-hero-inner.centered {
  grid-template-columns: 1fr;
  max-width: 700px; text-align: center;
}
.es-page-hero .eyebrow {
  font-size: 11px; font-weight: 700; letter-spacing: .13em;
  text-transform: uppercase; color: var(--gold); margin-bottom: 16px;
}
.es-page-hero h1 {
  font-family: var(--fd); font-size: clamp(36px, 4.5vw, 62px);
  font-weight: 400; line-height: 1.08; color: var(--text-d);
  margin-bottom: 18px; letter-spacing: -.01em;
}
.es-page-hero h1 em { color: var(--gold); font-style: italic; }
.es-page-hero .lead {
  font-size: 16px; line-height: 1.72; color: var(--text-m);
  max-width: 480px; margin-bottom: 28px;
}

/* ─── SECTION DIAGONAL CUTS ─────────────────────────────── */
.es-cut-bottom {
  clip-path: polygon(0 0, 100% 0, 100% 94%, 0 100%);
  margin-bottom: -3%;
}
.es-cut-top {
  clip-path: polygon(0 4%, 100% 0, 100% 100%, 0 100%);
  margin-top: -2%;
}

/* ─── DARK BAND (navy) ───────────────────────────────────── */
.es-dark-band {
  background: var(--navy-d); color: #fff;
  position: relative; overflow: hidden;
}
.es-dark-band::before {
  content: ''; position: absolute; inset: 0;
  background: radial-gradient(ellipse at 70% 40%, rgba(212,147,10,.09) 0%, transparent 60%);
  pointer-events: none;
}
.es-dark-band .sec-tag { color: rgba(255,255,255,.4); }
.es-dark-band .sec-h { color: #fff; }
.es-dark-band .sec-p { color: rgba(255,255,255,.55); }

/* ─── GLASS CARD ─────────────────────────────────────────── */
.es-glass {
  background: rgba(255,255,255,.06);
  border: 1px solid rgba(255,255,255,.1);
  border-radius: var(--r-xl);
  backdrop-filter: blur(8px);
  transition: background .35s var(--ease), transform .35s var(--ease), box-shadow .35s var(--ease);
}
.es-glass:hover {
  background: rgba(255,255,255,.1);
  transform: translateY(-6px);
  box-shadow: 0 24px 72px rgba(0,0,0,.25);
}

/* ─── CARD BASE ──────────────────────────────────────────── */
.es-card {
  background: var(--bg-w); border: 1px solid var(--border);
  border-radius: var(--r-xl); overflow: hidden;
  transition: transform .35s var(--ease), box-shadow .35s var(--ease);
}
.es-card:hover { transform: translateY(-5px); box-shadow: var(--sh-m); }

/* ─── FOOTER ─────────────────────────────────────────────── */
.es-footer {
  background: var(--navy-d); color: #fff;
  padding: 72px 24px 0;
}
.es-ft-inner { max-width: 1100px; margin: 0 auto; }
.es-ft-grid {
  display: grid;
  grid-template-columns: 1.8fr 1fr 1fr 1fr;
  gap: 48px; padding-bottom: 56px;
  border-bottom: 1px solid rgba(255,255,255,.08);
}
.es-ft-logo {
  font-family: var(--fh); font-size: 22px; font-weight: 800;
  color: #fff; margin-bottom: 14px;
}
.es-ft-logo span { color: var(--gold); }
.es-ft-desc {
  font-size: 14px; color: rgba(255,255,255,.5);
  line-height: 1.72; margin-bottom: 22px; max-width: 260px;
}
.es-ft-chips { display: flex; flex-wrap: wrap; gap: 8px; }
.es-ft-chip {
  display: inline-flex; align-items: center; gap: 5px;
  background: rgba(255,255,255,.07); border: 1px solid rgba(255,255,255,.1);
  border-radius: 50px; padding: 5px 12px;
  font-size: 11.5px; font-weight: 500; color: rgba(255,255,255,.65);
}
.es-ft-col h4 {
  font-family: var(--fh); font-size: 12px; font-weight: 700;
  letter-spacing: .1em; text-transform: uppercase;
  color: rgba(255,255,255,.35); margin-bottom: 18px;
}
.es-ft-col ul { list-style: none; display: flex; flex-direction: column; gap: 10px; }
.es-ft-col ul a {
  font-size: 14px; color: rgba(255,255,255,.62);
  transition: color .2s;
}
.es-ft-col ul a:hover { color: #fff; }
.es-ft-bot {
  display: flex; align-items: center; justify-content: space-between;
  flex-wrap: wrap; gap: 16px;
  padding: 24px 0; font-size: 12.5px; color: rgba(255,255,255,.3);
}
.es-ft-bot-links { display: flex; gap: 20px; }
.es-ft-bot-links a { color: rgba(255,255,255,.4); transition: color .2s; }
.es-ft-bot-links a:hover { color: rgba(255,255,255,.75); }

/* ─── STICKY BAR ─────────────────────────────────────────── */
.es-sticky {
  display: none; position: fixed; bottom: 0; left: 0; right: 0;
  background: var(--bg-w); border-top: 1px solid var(--border);
  padding: 12px 24px; z-index: 150; gap: 16px;
  align-items: center; justify-content: space-between;
  box-shadow: 0 -8px 32px rgba(0,0,0,.1);
}
.es-st-info { display: flex; flex-direction: column; }
.es-st-info strong { font-size: 14px; color: var(--text-d); }
.es-st-info span { font-size: 12px; color: var(--text-s); }

/* ─── BADGE / PILL ───────────────────────────────────────── */
.es-badge {
  display: inline-flex; align-items: center; gap: 6px;
  padding: 5px 14px; border-radius: 50px;
  font-size: 11px; font-weight: 700; letter-spacing: .07em;
  text-transform: uppercase;
}
.es-badge-gold { background: rgba(212,147,10,.12); border: 1px solid rgba(212,147,10,.25); color: var(--gold); }
.es-badge-navy { background: rgba(27,79,138,.1); border: 1px solid rgba(27,79,138,.2); color: var(--navy); }
.es-badge-white { background: rgba(255,255,255,.12); border: 1px solid rgba(255,255,255,.2); color: rgba(255,255,255,.85); }

/* ─── PRODUCT PAGE ───────────────────────────────────────── */
.es-product-hero {
  padding: 56px 24px 72px;
  background: linear-gradient(160deg, #fff 0%, #f0f5ff 100%);
}
.es-product-layout {
  max-width: 1100px; margin: 0 auto;
  display: grid; grid-template-columns: 1.1fr .9fr; gap: 60px;
  align-items: flex-start;
}
.es-product-gallery { position: sticky; top: 84px; }
.es-product-gallery .main-img {
  border-radius: var(--r-xl); overflow: hidden;
  box-shadow: var(--sh-l); aspect-ratio: 4/3;
  background: var(--bg);
}
.es-product-gallery .main-img img {
  width: 100%; height: 100%; object-fit: cover;
}
.es-product-thumbs {
  display: flex; gap: 10px; margin-top: 12px;
}
.es-product-thumb {
  width: 72px; height: 72px; border-radius: var(--r-s);
  overflow: hidden; cursor: pointer; border: 2px solid transparent;
  transition: border-color .2s;
}
.es-product-thumb.active, .es-product-thumb:hover { border-color: var(--gold); }
.es-product-thumb img { width: 100%; height: 100%; object-fit: cover; }

.es-product-info {}
.es-product-breadcrumb {
  display: flex; align-items: center; gap: 8px;
  font-size: 12px; color: var(--text-s); margin-bottom: 18px;
}
.es-product-breadcrumb a:hover { color: var(--navy); }
.es-product-rating {
  display: flex; align-items: center; gap: 8px;
  margin-bottom: 14px;
}
.es-product-rating .stars { color: #f59e0b; letter-spacing: 1px; font-size: 15px; }
.es-product-rating .count { font-size: 13px; color: var(--text-s); }
.es-product-title {
  font-family: var(--fd); font-size: clamp(28px, 3.5vw, 44px);
  font-weight: 400; line-height: 1.12; color: var(--text-d);
  margin-bottom: 10px;
}
.es-product-tagline {
  font-size: 15px; color: var(--text-m); line-height: 1.6;
  margin-bottom: 24px; font-style: italic;
}
.es-product-price {
  display: flex; align-items: baseline; gap: 12px; margin-bottom: 8px;
}
.es-product-price .price {
  font-family: var(--fh); font-size: 40px; font-weight: 800;
  color: var(--navy); letter-spacing: -.02em;
}
.es-product-price .was {
  font-size: 18px; color: var(--text-s); text-decoration: line-through;
}
.es-product-price .save {
  background: var(--gold-lt); border: 1px solid rgba(212,147,10,.25);
  color: var(--gold); font-size: 12px; font-weight: 700;
  padding: 4px 10px; border-radius: 50px;
}
.es-product-bnpl {
  font-size: 13px; color: var(--text-s); margin-bottom: 22px;
  padding: 10px 14px; background: var(--bg);
  border-radius: var(--r-s); display: inline-block;
}
.es-product-bnpl strong { color: var(--navy); }

/* Variant selector */
.es-variant-group { margin-bottom: 22px; }
.es-variant-label {
  font-size: 13px; font-weight: 600; color: var(--text-d);
  margin-bottom: 10px; display: flex; align-items: center; gap: 6px;
}
.es-variant-label span { color: var(--gold); font-weight: 700; }
.es-variants { display: flex; gap: 10px; flex-wrap: wrap; }
.es-variant {
  border: 1.5px solid var(--border); border-radius: var(--r-m);
  padding: 10px 16px; cursor: pointer;
  transition: border-color .2s, background .2s;
  background: var(--bg-w);
}
.es-variant:hover { border-color: var(--navy); }
.es-variant.selected { border-color: var(--gold); background: var(--gold-lt); }
.es-variant .v-name { font-size: 14px; font-weight: 600; color: var(--text-d); }
.es-variant .v-price { font-size: 13px; color: var(--gold); font-weight: 700; }
.es-variant .v-desc { font-size: 11.5px; color: var(--text-s); margin-top: 2px; }

/* ATC section */
.es-atc-row {
  display: flex; gap: 12px; margin-bottom: 16px; align-items: stretch;
}
.es-qty {
  display: flex; align-items: center; gap: 0;
  border: 1.5px solid var(--border); border-radius: var(--r-s); overflow: hidden;
}
.es-qty button {
  width: 42px; height: 100%; background: var(--bg);
  border: none; font-size: 18px; font-weight: 500;
  color: var(--text-m); transition: background .2s;
}
.es-qty button:hover { background: var(--border); }
.es-qty input {
  width: 52px; text-align: center; border: none;
  font-size: 16px; font-weight: 600; color: var(--text-d);
  background: transparent; outline: none;
  -moz-appearance: textfield;
}
.es-atc-btn {
  flex: 1; background: var(--gold); color: #fff;
  border: none; border-radius: var(--r-s); padding: 16px 24px;
  font-family: var(--fh); font-size: 16px; font-weight: 700;
  box-shadow: 0 6px 24px rgba(212,147,10,.38);
  transition: all .2s; cursor: pointer;
}
.es-atc-btn:hover {
  background: var(--gold-h);
  transform: translateY(-2px);
  box-shadow: 0 10px 36px rgba(212,147,10,.48);
}
.es-buy-now {
  display: block; text-align: center; padding: 15px;
  border: 1.5px solid var(--navy); border-radius: var(--r-s);
  font-family: var(--fh); font-size: 15px; font-weight: 600;
  color: var(--navy); transition: all .2s; margin-bottom: 18px;
}
.es-buy-now:hover { background: rgba(27,79,138,.05); transform: translateY(-1px); }

.es-product-trust {
  display: grid; grid-template-columns: 1fr 1fr;
  gap: 10px; margin-bottom: 24px;
}
.es-pt-item {
  display: flex; align-items: center; gap: 8px;
  font-size: 12.5px; color: var(--text-m); font-weight: 500;
}
.es-pt-item svg { color: var(--navy); flex-shrink: 0; }

/* Product tabs */
.es-product-tabs { margin-top: 64px; }
.es-tab-nav {
  display: flex; gap: 0; border-bottom: 1px solid var(--border);
  overflow-x: auto; -webkit-overflow-scrolling: touch;
}
.es-tab-btn {
  padding: 14px 22px; font-family: var(--fh); font-size: 14px;
  font-weight: 600; color: var(--text-s); background: transparent;
  border: none; border-bottom: 2px solid transparent;
  cursor: pointer; white-space: nowrap; transition: color .2s;
  margin-bottom: -1px;
}
.es-tab-btn:hover { color: var(--navy); }
.es-tab-btn.active { color: var(--navy); border-bottom-color: var(--gold); }
.es-tab-pane { display: none; padding: 32px 0; }
.es-tab-pane.active { display: block; }

/* ─── SHOP PAGE ──────────────────────────────────────────── */
.es-shop-hero {
  background: var(--navy-d);
  padding: 72px 24px 80px;
  position: relative; overflow: hidden;
  clip-path: polygon(0 0, 100% 0, 100% 92%, 0 100%);
  margin-bottom: -3%;
}
.es-shop-hero::before {
  content: ''; position: absolute; inset: 0;
  background: radial-gradient(ellipse at 60% 50%, rgba(212,147,10,.1) 0%, transparent 55%);
}
.es-shop-hero-inner { max-width: 1100px; margin: 0 auto; position: relative; z-index: 1; }
.es-shop-hero p.sub { font-size: 16px; color: rgba(255,255,255,.6); max-width: 500px; line-height: 1.65; }

.es-shop-grid-section { padding: 80px 24px 100px; background: var(--bg-w); }
.es-shop-filter {
  display: flex; align-items: center; gap: 12px;
  margin-bottom: 36px; flex-wrap: wrap;
}
.es-filter-btn {
  padding: 8px 18px; border-radius: 50px;
  border: 1.5px solid var(--border); background: var(--bg-w);
  font-size: 13px; font-weight: 600; color: var(--text-m);
  cursor: pointer; transition: all .2s;
}
.es-filter-btn:hover, .es-filter-btn.active {
  border-color: var(--navy); background: var(--navy); color: #fff;
}
.es-product-grid {
  display: grid; grid-template-columns: repeat(3, 1fr);
  gap: 24px;
}
.es-product-card {
  background: var(--bg-w); border: 1px solid var(--border);
  border-radius: var(--r-xl); overflow: hidden;
  transition: transform .35s var(--ease), box-shadow .35s var(--ease);
  position: relative;
}
.es-product-card:hover { transform: translateY(-6px); box-shadow: var(--sh-m); }
.es-product-card .img-wrap {
  aspect-ratio: 4/3; overflow: hidden; position: relative; background: var(--bg);
}
.es-product-card .img-wrap img { width: 100%; height: 100%; object-fit: cover; transition: transform .5s var(--ease); }
.es-product-card:hover .img-wrap img { transform: scale(1.05); }
.es-product-card .sale-badge {
  position: absolute; top: 14px; left: 14px;
  background: var(--gold); color: #fff; font-size: 11px; font-weight: 700;
  padding: 4px 10px; border-radius: 50px; letter-spacing: .05em;
  text-transform: uppercase; z-index: 2;
}
.es-product-card .card-body { padding: 22px 20px 24px; }
.es-product-card .card-cat { font-size: 11px; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; color: var(--gold); margin-bottom: 6px; }
.es-product-card .card-name { font-family: var(--fd); font-size: 19px; font-weight: 400; color: var(--text-d); margin-bottom: 6px; line-height: 1.25; }
.es-product-card .card-short { font-size: 13px; color: var(--text-s); line-height: 1.6; margin-bottom: 14px; }
.es-product-card .card-price { font-family: var(--fh); font-size: 22px; font-weight: 800; color: var(--navy); margin-bottom: 16px; }
.es-product-card .card-price del { font-size: 15px; color: var(--text-s); font-weight: 400; margin-right: 4px; }
.es-product-card .card-cta { display: block; text-align: center; padding: 12px; background: var(--gold); color: #fff; border-radius: var(--r-s); font-family: var(--fh); font-size: 14px; font-weight: 700; transition: all .2s; }
.es-product-card .card-cta:hover { background: var(--gold-h); transform: translateY(-1px); }

/* ─── ABOUT PAGE ─────────────────────────────────────────── */
.es-about-mission {
  padding: 96px 24px;
  display: grid; grid-template-columns: 1fr 1fr;
  gap: 72px; align-items: center;
  max-width: 1100px; margin: 0 auto;
}
.es-about-mission .img-side {
  border-radius: var(--r-xl); overflow: hidden; box-shadow: var(--sh-l);
  aspect-ratio: 5/4; position: relative;
}
.es-about-mission .img-side img { width: 100%; height: 100%; object-fit: cover; }
.es-about-mission .img-side .overlay-stat {
  position: absolute; bottom: 24px; left: 24px;
  background: rgba(255,255,255,.95); backdrop-filter: blur(12px);
  border-radius: var(--r-l); padding: 16px 22px;
  box-shadow: var(--sh-m);
}
.es-about-mission .img-side .overlay-stat .big { font-family: var(--fd); font-size: 36px; font-weight: 400; color: var(--navy); line-height: 1; }
.es-about-mission .img-side .overlay-stat .small { font-size: 13px; color: var(--text-s); margin-top: 4px; }

.es-creds-grid {
  display: grid; grid-template-columns: repeat(4, 1fr);
  gap: 20px; max-width: 1100px; margin: 0 auto;
  padding: 0 24px 96px;
}
.es-cred-card {
  background: var(--bg); border: 1px solid var(--border);
  border-radius: var(--r-xl); padding: 28px 22px; text-align: center;
  transition: transform .3s var(--ease);
}
.es-cred-card:hover { transform: translateY(-5px); }
.es-cred-card .big-num { font-family: var(--fd); font-size: 42px; font-weight: 400; color: var(--navy); line-height: 1; margin-bottom: 6px; }
.es-cred-card .label { font-size: 13px; color: var(--text-m); line-height: 1.5; }

/* ─── CONTACT PAGE ───────────────────────────────────────── */
.es-contact-layout {
  max-width: 1100px; margin: 0 auto; padding: 72px 24px;
  display: grid; grid-template-columns: .9fr 1.1fr; gap: 64px;
}
.es-contact-info .wa-cta {
  display: flex; align-items: center; gap: 14px;
  background: #25D366; color: #fff; border-radius: var(--r-l);
  padding: 18px 24px; margin-bottom: 32px;
  transition: opacity .2s; font-weight: 600;
}
.es-contact-info .wa-cta:hover { opacity: .9; }
.es-contact-detail { margin-bottom: 18px; }
.es-contact-detail .label { font-size: 11px; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; color: var(--gold); margin-bottom: 4px; }
.es-contact-detail .value { font-size: 15px; color: var(--text-d); }

.es-contact-form .form-row { margin-bottom: 18px; }
.es-contact-form label { display: block; font-size: 13px; font-weight: 600; color: var(--text-d); margin-bottom: 6px; }
.es-contact-form input,
.es-contact-form textarea,
.es-contact-form select {
  width: 100%; padding: 13px 16px;
  border: 1.5px solid var(--border); border-radius: var(--r-s);
  font-size: 15px; color: var(--text-d); background: var(--bg-w);
  transition: border-color .2s, box-shadow .2s; outline: none;
}
.es-contact-form input:focus,
.es-contact-form textarea:focus,
.es-contact-form select:focus {
  border-color: var(--navy);
  box-shadow: 0 0 0 3px rgba(27,79,138,.1);
}
.es-contact-form textarea { resize: vertical; min-height: 120px; }

/* ─── FAQs PAGE ──────────────────────────────────────────── */
.es-faq-layout {
  max-width: 780px; margin: 0 auto; padding: 72px 24px 96px;
}
.es-faq-item {
  border-bottom: 1px solid var(--border);
}
.es-faq-q {
  width: 100%; display: flex; align-items: center;
  justify-content: space-between; gap: 16px;
  padding: 22px 0; background: transparent; border: none;
  font-family: var(--fh); font-size: 16px; font-weight: 600;
  color: var(--text-d); text-align: left; cursor: pointer;
  transition: color .2s;
}
.es-faq-q:hover { color: var(--navy); }
.es-faq-q.open { color: var(--navy); }
.es-faq-ic {
  width: 28px; height: 28px; border-radius: 50%;
  background: var(--bg); border: 1px solid var(--border);
  display: flex; align-items: center; justify-content: center;
  flex-shrink: 0; color: var(--navy); transition: transform .25s var(--ease), background .2s;
}
.es-faq-q.open .es-faq-ic { transform: rotate(45deg); background: var(--gold-lt); border-color: rgba(212,147,10,.3); }
.es-faq-a {
  display: none; padding: 0 0 22px;
  font-size: 15px; color: var(--text-m); line-height: 1.78;
}
.es-faq-a.open { display: block; }
.es-faq-a strong { color: var(--navy); }

/* ─── 404 PAGE ───────────────────────────────────────────── */
.es-404 {
  min-height: 70vh; display: flex; align-items: center;
  justify-content: center; text-align: center;
  padding: 80px 24px;
  background: linear-gradient(145deg, #fff 0%, #eef4ff 100%);
}
.es-404-inner { max-width: 500px; }
.es-404-num {
  font-family: var(--fd); font-size: clamp(100px, 18vw, 180px);
  font-weight: 400; color: var(--navy); opacity: .08;
  line-height: 1; margin-bottom: -60px; display: block;
}
.es-404-icon { width: 72px; height: 72px; margin: 0 auto 24px; position: relative; z-index: 1; }
.es-404 h1 { font-family: var(--fd); font-size: clamp(28px, 4vw, 40px); font-weight: 400; color: var(--text-d); margin-bottom: 14px; }
.es-404 p { font-size: 16px; color: var(--text-m); line-height: 1.68; margin-bottom: 32px; }
.es-404-btns { display: flex; gap: 14px; justify-content: center; flex-wrap: wrap; }

/* ─── HOMEPAGE — HERO ────────────────────────────────────── */
.hero { background: var(--bg-w); padding: 80px 0 100px; overflow: hidden; position: relative; }
.hero-inner { display: grid; grid-template-columns: 1fr 1fr; gap: 64px; align-items: center; }
.hero-eyebrow { margin-bottom: 20px; }
.hero-badge { display: inline-flex; align-items: center; gap: 7px; background: var(--gold-pale); color: var(--gold-h); font-size: 12px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; padding: 7px 14px; border-radius: 100px; border: 1px solid rgba(212,147,10,.25); }
.hero-h { font-family: var(--fd); font-size: clamp(34px, 4.5vw, 58px); line-height: 1.1; color: var(--text-d); margin-bottom: 20px; font-weight: 400; }
.hero-h em { color: var(--navy); font-style: italic; }
.hero-sub { font-size: 1.05rem; color: var(--text-m); line-height: 1.72; max-width: 480px; margin-bottom: 36px; }
.hero-actions { display: flex; gap: 14px; flex-wrap: wrap; margin-bottom: 28px; }
.hero-trust-row { display: flex; flex-wrap: wrap; gap: 18px; }
.hero-trust-item { display: flex; align-items: center; gap: 6px; font-size: 13px; color: var(--text-s); font-weight: 500; }
.hero-vis { position: relative; }
.ba-wrap { position: relative; border-radius: var(--r-xl); overflow: hidden; aspect-ratio: 4/3; cursor: ew-resize; user-select: none; box-shadow: var(--sh-l); }
.ba-after, .ba-before { position: absolute; inset: 0; }
.ba-after img, .ba-before img { width: 100%; height: 100%; object-fit: cover; display: block; }
.ba-before { clip-path: inset(0 50% 0 0); }
.ba-divider { position: absolute; top: 0; bottom: 0; left: 50%; width: 2px; background: #fff; pointer-events: none; }
.ba-handle { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); width: 44px; height: 44px; background: #fff; border-radius: 50%; box-shadow: 0 4px 16px rgba(0,0,0,.2); display: flex; align-items: center; justify-content: center; pointer-events: none; }
.ba-label { position: absolute; bottom: 16px; padding: 5px 12px; border-radius: 100px; font-size: 11px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; }
.ba-label-before { left: 16px; background: rgba(0,0,0,.52); color: #fff; }
.ba-label-after { right: 16px; background: var(--gold); color: #fff; }
.ba-proof { display: flex; align-items: center; gap: 12px; background: #fff; border-radius: var(--r-m); padding: 12px 18px; box-shadow: var(--sh-m); position: absolute; bottom: -20px; left: 24px; right: auto; max-width: 280px; }
.ba-proof-avatars { display: flex; }
.ba-proof-avatars img { width: 28px; height: 28px; border-radius: 50%; border: 2px solid #fff; margin-right: -8px; object-fit: cover; }
.ba-proof-stars { color: var(--gold); font-size: 12px; line-height: 1; margin-bottom: 3px; }
.ba-proof-text { font-size: 12px; color: var(--text-s); font-weight: 500; }

/* ─── HOMEPAGE — TRUST MARQUEE ───────────────────────────── */
.marquee-band { background: var(--navy); padding: 16px 0; overflow: hidden; }
.marquee-inner { display: flex; gap: 0; animation: marquee 28s linear infinite; width: max-content; }
.marquee-item { display: flex; align-items: center; gap: 8px; font-size: 13px; font-weight: 600; color: rgba(255,255,255,.85); white-space: nowrap; padding: 0 20px; }
.marquee-sep { color: rgba(255,255,255,.3); padding: 0 4px; }
@keyframes marquee { from { transform: translateX(0); } to { transform: translateX(-50%); } }

/* ─── HOMEPAGE — PAIN ────────────────────────────────────── */
.pain { padding: 100px 0 120px; }
.pain-header { text-align: center; max-width: 640px; margin: 0 auto 64px; }
.pain-header h2 { font-family: var(--fd); font-size: clamp(28px, 4vw, 46px); color: #fff; line-height: 1.15; margin-bottom: 16px; }
.pain-header h2 em { color: var(--gold); font-style: italic; }
.pain-intro { color: rgba(255,255,255,.65); font-size: 1.05rem; line-height: 1.7; }
.pain-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 24px; }
.pain-card { background: rgba(255,255,255,.06); border: 1px solid rgba(255,255,255,.1); border-radius: var(--r-xl); padding: 32px 28px; transition: transform .3s var(--ease), background .3s; }
.pain-card:hover { transform: translateY(-6px); background: rgba(255,255,255,.09); }
.pain-pill { display: inline-flex; align-items: center; gap: 6px; background: rgba(212,147,10,.18); color: var(--gold); font-size: 11px; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; padding: 5px 12px; border-radius: 100px; margin-bottom: 16px; }
.pain-card h3 { font-family: var(--fd); font-size: 20px; color: #fff; line-height: 1.3; margin-bottom: 12px; font-weight: 400; }
.pain-card p { font-size: 14px; color: rgba(255,255,255,.65); line-height: 1.72; }
.pain-stat { display: flex; align-items: flex-start; gap: 8px; margin-top: 20px; padding-top: 20px; border-top: 1px solid rgba(255,255,255,.1); font-size: 13px; color: rgba(255,255,255,.55); line-height: 1.5; }
.pain-stat strong { color: var(--gold); }

/* ─── HOMEPAGE — SOLUTION BENTO ──────────────────────────── */
.bento { display: grid; grid-template-columns: 2fr 1fr 1fr; grid-template-rows: auto auto; gap: 20px; margin-top: 56px; }
.bc { border-radius: var(--r-xl); padding: 36px; overflow: hidden; position: relative; }
.bc1 { grid-column: 1; grid-row: 1 / 3; background: var(--navy); color: #fff; }
.bc2 { background: var(--bg); display: flex; align-items: center; gap: 20px; padding: 28px; }
.bc3 { background: var(--gold-pale); display: flex; align-items: center; gap: 20px; padding: 28px; }
.bc4 { grid-column: 2 / 4; grid-row: 2; position: relative; min-height: 220px; }
.bc4 img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; border-radius: var(--r-xl); }
.bc4 .overlay { position: absolute; inset: 0; background: linear-gradient(to top, rgba(15,45,82,.92) 0%, transparent 60%); border-radius: var(--r-xl); display: flex; flex-direction: column; justify-content: flex-end; padding: 28px; }
.bc4 .overlay h3 { font-family: var(--fd); font-size: 22px; color: #fff; line-height: 1.3; font-weight: 400; }
.bc-tag { font-size: 11px; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; color: var(--gold); margin-bottom: 12px; }
.bc1 h3 { font-family: var(--fd); font-size: 24px; color: #fff; margin-bottom: 12px; font-weight: 400; }
.bc1 p { font-size: 14px; color: rgba(255,255,255,.7); line-height: 1.72; }
.bc-ico { width: 52px; height: 52px; background: rgba(212,147,10,.18); border-radius: var(--r-m); display: flex; align-items: center; justify-content: center; margin-bottom: 20px; color: var(--gold); }
.bc-ic2, .bc-ic3 { width: 52px; height: 52px; border-radius: var(--r-m); display: flex; align-items: center; justify-content: center; flex-shrink: 0; }
.bc-ic2 { background: rgba(27,79,138,.1); color: var(--navy); }
.bc-ic3 { background: rgba(212,147,10,.12); color: var(--gold-h); }
.bc2 h3, .bc3 h3 { font-size: 16px; font-weight: 700; color: var(--text-d); margin-bottom: 6px; }
.bc2 p, .bc3 p { font-size: 13px; color: var(--text-m); line-height: 1.6; }
.bg-mol { position: absolute; top: -10%; right: -10%; width: 55%; opacity: .06; pointer-events: none; color: #fff; }

/* ─── HOMEPAGE — HOW IT WORKS ────────────────────────────── */
.hiw-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 28px; margin-top: 56px; }
.hiw-card { background: #fff; border-radius: var(--r-xl); padding: 36px 28px; border: 1px solid var(--border); position: relative; }
.hiw-num { position: absolute; top: 28px; right: 28px; font-family: var(--fd); font-size: 48px; color: var(--navy); opacity: .07; line-height: 1; }
.hiw-ico { width: 52px; height: 52px; background: var(--gold-pale); border-radius: var(--r-m); display: flex; align-items: center; justify-content: center; color: var(--gold-h); margin-bottom: 20px; }
.hiw-card h3 { font-size: 17px; font-weight: 700; color: var(--text-d); margin-bottom: 10px; }
.hiw-card p { font-size: 14px; color: var(--text-m); line-height: 1.7; }
.hiw-note { display: flex; align-items: center; gap: 10px; background: rgba(27,79,138,.06); border: 1px solid rgba(27,79,138,.14); border-radius: var(--r-m); padding: 14px 20px; margin-top: 36px; font-size: 14px; color: var(--navy); font-weight: 500; width: fit-content; }

/* ─── HOMEPAGE — PRICING ─────────────────────────────────── */
.pc-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 24px; margin-top: 56px; align-items: start; }
.pc { background: #fff; border-radius: var(--r-xl); overflow: hidden; border: 1.5px solid var(--border); position: relative; transition: transform .3s var(--ease), box-shadow .3s; }
.pc:hover { transform: translateY(-6px); box-shadow: var(--sh-l); }
.pc.feat { border-color: var(--gold); box-shadow: 0 12px 48px rgba(212,147,10,.18); transform: scale(1.03); z-index: 1; }
.pc.feat:hover { transform: scale(1.03) translateY(-6px); }
.pc-badge { background: var(--gold); color: #fff; font-size: 11px; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; text-align: center; padding: 8px; }
.pc-img { position: relative; height: 200px; overflow: hidden; }
.pc-img img { width: 100%; height: 100%; object-fit: cover; transition: transform .5s; }
.pc:hover .pc-img img { transform: scale(1.04); }
.pc-img-overlay { position: absolute; inset: 0; background: linear-gradient(to top, rgba(15,29,52,.6) 0%, transparent 60%); }
.pc-img-label { position: absolute; bottom: 12px; right: 14px; background: rgba(0,0,0,.55); color: #fff; font-size: 11px; font-weight: 700; padding: 4px 10px; border-radius: 100px; }
.pc-body { padding: 24px 24px 28px; }
.pc-tier { font-size: 11px; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; color: var(--text-s); margin-bottom: 4px; }
.pc-name { font-family: var(--fd); font-size: 26px; color: var(--text-d); margin-bottom: 4px; font-weight: 400; }
.pc-price { font-size: 28px; font-weight: 800; color: var(--navy); font-family: var(--fh); margin-bottom: 4px; }
.pc-note { font-size: 13px; color: var(--text-s); margin-bottom: 8px; line-height: 1.5; }
.pc-vs { font-size: 12px; color: var(--gold-h); background: var(--gold-pale); padding: 7px 12px; border-radius: var(--r-s); margin-bottom: 16px; line-height: 1.5; }
.pc-line { height: 1px; background: var(--border); margin: 16px 0; }
.pc-feats { list-style: none; display: flex; flex-direction: column; gap: 8px; margin-bottom: 24px; }
.pc-feats li { display: flex; align-items: flex-start; gap: 8px; font-size: 13px; color: var(--text-m); line-height: 1.4; }
.chk { color: var(--gold); flex-shrink: 0; margin-top: 1px; }
.pc-cta { display: block; text-align: center; padding: 14px; border-radius: var(--r-s); font-family: var(--fh); font-size: 14px; font-weight: 700; transition: all .2s; }
.pc-solid { background: var(--gold); color: #fff; box-shadow: 0 4px 18px rgba(212,147,10,.35); }
.pc-solid:hover { background: var(--gold-h); transform: translateY(-2px); box-shadow: 0 8px 28px rgba(212,147,10,.45); }
.pc-outline { background: transparent; color: var(--navy); border: 1.5px solid rgba(27,79,138,.3); }
.pc-outline:hover { background: rgba(27,79,138,.06); border-color: var(--navy); }
.pc-foot { text-align: center; font-size: 14px; color: var(--text-s); margin-top: 32px; }

/* ─── HOMEPAGE — SCIENCE BAND ────────────────────────────── */
.sci-inner { display: grid; grid-template-columns: 1fr 1fr; gap: 64px; align-items: center; }
.sci-feats { display: flex; flex-direction: column; gap: 24px; margin-top: 36px; }
.sci-feat { display: flex; align-items: flex-start; gap: 18px; }
.sci-ic { width: 44px; height: 44px; background: rgba(212,147,10,.15); border-radius: var(--r-m); display: flex; align-items: center; justify-content: center; color: var(--gold); flex-shrink: 0; }
.sci-text strong { display: block; font-size: 15px; color: #fff; margin-bottom: 4px; }
.sci-text span { font-size: 14px; color: rgba(255,255,255,.65); line-height: 1.65; }
.sci-vis { background: rgba(255,255,255,.06); border: 1px solid rgba(255,255,255,.1); border-radius: var(--r-xl); padding: 32px; }
.sci-vis-h { font-family: var(--fd); font-size: 22px; color: #fff; margin-bottom: 6px; }
.sci-vis-s { font-size: 13px; color: rgba(255,255,255,.5); margin-bottom: 28px; }
.stat-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 20px; margin-bottom: 24px; }
.stat-card { background: rgba(255,255,255,.07); border-radius: var(--r-l); padding: 20px; text-align: center; }
.stat-n { display: block; font-family: var(--fd); font-size: 36px; color: #fff; line-height: 1; margin-bottom: 6px; }
.stat-l { font-size: 12px; color: rgba(255,255,255,.55); font-weight: 500; }
.sci-cert { display: flex; align-items: center; gap: 10px; font-size: 12px; color: rgba(255,255,255,.5); padding-top: 20px; border-top: 1px solid rgba(255,255,255,.1); }

/* ─── HOMEPAGE — REVIEWS ─────────────────────────────────── */
.rev-meta { display: flex; align-items: center; gap: 16px; justify-content: center; margin: 16px 0 40px; }
.rev-score { font-family: var(--fd); font-size: 52px; color: var(--text-d); line-height: 1; }
.rev-stars { color: var(--gold); font-size: 22px; letter-spacing: 2px; line-height: 1; margin-bottom: 4px; }
.rev-count { font-size: 14px; color: var(--text-s); }
.rev-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 22px; }
.rev-card { background: #fff; border-radius: var(--r-xl); padding: 28px; border: 1px solid var(--border); position: relative; }
.rev-card::before { content: '\201C'; font-family: var(--fd); font-size: 80px; color: var(--navy); opacity: .07; position: absolute; top: 12px; left: 20px; line-height: 1; }
.rev-stars-sm { display: flex; gap: 2px; margin-bottom: 12px; position: relative; z-index: 1; }
.rev-title { font-size: 16px; font-weight: 700; color: var(--text-d); margin-bottom: 10px; line-height: 1.4; }
.rev-text { font-size: 14px; color: var(--text-m); line-height: 1.72; margin-bottom: 20px; }
.rev-author { display: flex; align-items: center; gap: 12px; margin-top: auto; }
.rev-avatar { width: 36px; height: 36px; border-radius: 50%; border: 2px solid var(--border); }
.rev-name { font-size: 14px; font-weight: 700; color: var(--text-d); }
.rev-loc { font-size: 12px; color: var(--text-s); }

/* ─── HOMEPAGE — FAQ LIST ────────────────────────────────── */
.es-faq-list { max-width: 720px; margin: 40px auto 0; }

/* ─── SHOP PAGE ──────────────────────────────────────────── */
.es-shop-hero { background: var(--navy-d); padding: 80px 0 100px; clip-path: polygon(0 0, 100% 0, 100% 93%, 0 100%); margin-bottom: -4%; }
.es-shop-hero-inner { display: grid; grid-template-columns: 1fr 1fr; gap: 56px; align-items: center; }
.es-shop-hero-text h1 { font-family: var(--fd); font-size: clamp(30px, 4vw, 50px); color: #fff; line-height: 1.12; margin-bottom: 16px; font-weight: 400; }
.es-shop-hero-text h1 em { color: var(--gold); font-style: italic; }
.es-shop-hero-sub { font-size: 1rem; color: rgba(255,255,255,.72); line-height: 1.72; margin-bottom: 24px; }
.es-shop-hero-trust { display: flex; flex-wrap: wrap; gap: 14px; }
.es-shop-hero-trust span { display: flex; align-items: center; gap: 6px; font-size: 12px; font-weight: 600; color: rgba(255,255,255,.75); }
.es-shop-hero-stats { display: grid; grid-template-columns: 1fr 1fr; gap: 20px; }
.es-shop-stat { background: rgba(255,255,255,.07); border: 1px solid rgba(255,255,255,.1); border-radius: var(--r-l); padding: 24px; text-align: center; }
.es-shop-stat-num { display: block; font-family: var(--fd); font-size: 36px; color: #fff; line-height: 1; margin-bottom: 6px; }
.es-shop-stat-label { font-size: 12px; color: rgba(255,255,255,.55); font-weight: 500; }
.es-shop-pain-bar { background: rgba(27,79,138,.07); border-top: 3px solid var(--gold); padding: 20px 0; }
.es-shop-pain-bar p { font-size: 14px; color: var(--text-m); line-height: 1.6; text-align: center; max-width: 700px; margin: 0 auto; }
.es-shop-section { padding: 60px 0 80px; }
.es-filter-row { display: flex; align-items: center; justify-content: space-between; margin-bottom: 36px; flex-wrap: wrap; gap: 16px; }
.es-filter-tabs { display: flex; flex-wrap: wrap; gap: 8px; }
.es-filter-btn { padding: 9px 20px; border-radius: 100px; font-size: 14px; font-weight: 600; background: transparent; color: var(--text-m); border: 1.5px solid var(--border); cursor: pointer; transition: all .2s; font-family: var(--fh); }
.es-filter-btn.active, .es-filter-btn:hover { background: var(--navy); color: #fff; border-color: var(--navy); }
.es-shop-count { font-size: 13px; color: var(--text-s); }
.es-products-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 28px; }
.es-product-card { background: #fff; border-radius: var(--r-xl); overflow: hidden; border: 1px solid var(--border); transition: transform .3s var(--ease), box-shadow .3s; display: flex; flex-direction: column; }
.es-product-card:hover { transform: translateY(-6px); box-shadow: var(--sh-l); }
.es-prod-img-wrap { position: relative; aspect-ratio: 4/3; overflow: hidden; display: block; }
.es-prod-img-wrap img { width: 100%; height: 100%; object-fit: cover; transition: transform .5s; }
.es-product-card:hover .es-prod-img-wrap img { transform: scale(1.04); }
.es-prod-badge { position: absolute; top: 12px; left: 12px; padding: 5px 12px; border-radius: 100px; font-size: 11px; font-weight: 700; text-transform: uppercase; letter-spacing: .06em; }
.es-prod-badge--best { background: var(--gold); color: #fff; }
.es-prod-badge--sale { background: #e74c3c; color: #fff; }
.es-prod-save-ribbon { position: absolute; top: 12px; right: 0; background: #e74c3c; color: #fff; font-size: 11px; font-weight: 700; padding: 5px 10px; clip-path: polygon(0 0, 100% 0, 100% 100%, 0 100%); }
.es-prod-info { padding: 20px; display: flex; flex-direction: column; flex: 1; }
.es-prod-cat { font-size: 10px; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; color: var(--gold-h); margin-bottom: 6px; display: block; }
.es-prod-name { font-size: 17px; font-weight: 700; color: var(--text-d); margin-bottom: 8px; line-height: 1.3; }
.es-prod-name a { color: inherit; }
.es-prod-name a:hover { color: var(--navy); }
.es-prod-desc { font-size: 13px; color: var(--text-m); line-height: 1.6; margin-bottom: 10px; }
.es-prod-rating { display: flex; align-items: center; gap: 6px; margin-bottom: 10px; }
.es-prod-stars { display: flex; gap: 1px; }
.es-prod-rating-text { font-size: 12px; color: var(--text-s); }
.es-prod-price-row { display: flex; align-items: baseline; gap: 8px; margin-bottom: 4px; }
.es-prod-price-sale { font-size: 22px; font-weight: 800; color: var(--navy); font-family: var(--fh); }
.es-prod-price-was { font-size: 14px; color: var(--text-s); text-decoration: line-through; }
.es-prod-bnpl { font-size: 12px; color: var(--text-s); margin-bottom: 16px; }
.es-prod-actions { display: flex; gap: 10px; margin-top: auto; }
.es-prod-atc { flex: 1; justify-content: center; padding: 12px 16px; font-size: 14px; }
.es-prod-details { padding: 12px 16px; font-size: 14px; }
.es-prod-oos { display: block; text-align: center; color: var(--text-s); font-size: 14px; padding: 12px 0; }
.es-shop-empty { text-align: center; padding: 80px 24px; color: var(--text-s); }
.es-shop-empty h3 { font-size: 22px; margin: 16px 0 8px; color: var(--text-d); }
.es-shop-empty a { color: var(--navy); text-decoration: underline; }
.es-shop-pagination { margin-top: 56px; display: flex; justify-content: center; }
.es-shop-pagination .page-numbers { display: flex; gap: 8px; list-style: none; }
.es-shop-pagination .page-numbers li a, .es-shop-pagination .page-numbers li span { display: inline-flex; align-items: center; justify-content: center; width: 40px; height: 40px; border-radius: var(--r-s); border: 1px solid var(--border); font-size: 14px; font-weight: 600; color: var(--text-m); transition: all .2s; }
.es-shop-pagination .page-numbers li .current { background: var(--navy); color: #fff; border-color: var(--navy); }
.es-shop-trust { padding: 72px 0 56px; background: var(--bg); }
.es-shop-trust-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 40px; }
.es-shop-trust-item { text-align: center; }
.es-shop-trust-item h4 { font-size: 16px; font-weight: 700; color: var(--text-d); margin: 14px 0 8px; }
.es-shop-trust-item p { font-size: 14px; color: var(--text-m); line-height: 1.7; }
.es-shop-compare { padding: 80px 0; }
.es-compare-wrap { overflow-x: auto; -webkit-overflow-scrolling: touch; }
.es-compare-table { width: 100%; border-collapse: collapse; border-radius: var(--r-l); overflow: hidden; border: 1px solid var(--border); }
.es-compare-table th, .es-compare-table td { padding: 14px 20px; text-align: left; font-size: 14px; border-bottom: 1px solid var(--border); }
.es-compare-table thead th { background: var(--navy-d); color: #fff; font-weight: 700; font-size: 13px; }
.es-compare-th--es { background: var(--gold) !important; }
.es-compare-td--es { background: var(--gold-pale); font-weight: 600; color: var(--navy); }
.es-compare-table tbody tr:nth-child(odd) td:not(.es-compare-td--es) { background: var(--bg); }
.es-sec-head { }

/* ─── ABOUT PAGE ─────────────────────────────────────────── */
.es-page-hero { background: var(--navy-d); padding: 80px 0 100px; clip-path: polygon(0 0, 100% 0, 100% 94%, 0 100%); margin-bottom: -3%; }
.es-page-hero-inner { display: grid; grid-template-columns: 1fr 1fr; gap: 48px; align-items: center; }
.es-page-hero h1 { font-family: var(--fd); font-size: clamp(30px, 4vw, 52px); color: #fff; line-height: 1.12; margin-bottom: 16px; font-weight: 400; }
.es-page-hero h1 em { color: var(--gold); font-style: italic; }
.es-page-hero-sub { font-size: 1.05rem; color: rgba(255,255,255,.72); line-height: 1.7; max-width: 520px; }
.es-page-hero-meta { display: flex; flex-direction: column; gap: 16px; }
.es-about-hero-stat span { font-family: var(--fd); font-size: 42px; color: #fff; display: block; line-height: 1; }
.es-about-hero-stat small { font-size: 13px; color: rgba(255,255,255,.55); font-weight: 500; }
.es-about-problem { padding: 96px 0 80px; }
.es-about-problem-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 64px; align-items: start; }
.es-about-problem-text h2 { font-family: var(--fd); font-size: clamp(26px, 3.5vw, 42px); color: var(--text-d); line-height: 1.15; margin-bottom: 20px; font-weight: 400; }
.es-about-problem-text p { font-size: 15px; color: var(--text-m); line-height: 1.75; margin-bottom: 16px; }
.es-about-problem-callout { background: var(--gold-pale); border-left: 3px solid var(--gold); border-radius: 0 var(--r-m) var(--r-m) 0; padding: 18px 20px; margin-top: 24px; }
.es-about-problem-callout strong { display: block; font-size: 15px; color: var(--text-d); margin-bottom: 6px; line-height: 1.5; }
.es-about-problem-callout span { font-size: 13px; color: var(--text-m); }
.es-about-glass-diagram { display: grid; grid-template-columns: 1fr 1fr; gap: 20px; }
.es-glass-before, .es-glass-after { background: var(--bg); border-radius: var(--r-l); padding: 20px; text-align: center; }
.es-glass-label { display: block; font-size: 12px; font-weight: 700; text-transform: uppercase; letter-spacing: .08em; color: var(--text-s); margin-bottom: 14px; }
.es-glass-surface { height: 80px; border-radius: var(--r-s); margin-bottom: 12px; border: 2px solid var(--border); position: relative; overflow: hidden; background: rgba(27,79,138,.08); }
.es-glass-pores { display: flex; flex-wrap: wrap; gap: 4px; padding: 8px; }
.es-glass-pores span { width: 10px; height: 10px; background: rgba(212,147,10,.4); border-radius: 50%; }
.es-glass-shield { position: absolute; inset: 0; background: linear-gradient(135deg, rgba(27,79,138,.2), rgba(212,147,10,.15)); }
.es-glass-after .es-glass-surface { border-color: var(--gold); }
.es-glass-before p, .es-glass-after p { font-size: 12px; color: var(--text-s); line-height: 1.5; }
.es-about-science { padding: 100px 0; }
.es-science-steps { display: grid; grid-template-columns: repeat(2, 1fr); gap: 32px; }
.es-science-step { background: rgba(255,255,255,.07); border: 1px solid rgba(255,255,255,.1); border-radius: var(--r-xl); padding: 32px; }
.es-science-num { font-family: var(--fd); font-size: 48px; color: var(--gold); line-height: 1; margin-bottom: 14px; opacity: .7; }
.es-science-step h4 { font-size: 18px; font-weight: 700; color: #fff; margin-bottom: 10px; }
.es-science-step p { font-size: 14px; color: rgba(255,255,255,.65); line-height: 1.72; }
.es-about-creds { padding: 100px 0; background: var(--bg); }
.es-creds-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 24px; }
.es-cred-card { background: #fff; border-radius: var(--r-xl); padding: 28px; border: 1px solid var(--border); }
.es-cred-icon { width: 56px; height: 56px; background: var(--gold-pale); border-radius: var(--r-m); display: flex; align-items: center; justify-content: center; margin-bottom: 16px; }
.es-cred-card h4 { font-size: 16px; font-weight: 700; color: var(--text-d); margin-bottom: 8px; }
.es-cred-desc { font-size: 13px; color: var(--text-m); line-height: 1.7; margin-bottom: 12px; }
.es-cred-tag { font-size: 11px; color: var(--gold-h); font-weight: 600; background: var(--gold-pale); padding: 4px 10px; border-radius: 100px; display: inline-block; }
.es-about-malaysia { padding: 100px 0; }
.es-about-malaysia-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 64px; align-items: start; }
.es-about-malaysia-text h2 { font-family: var(--fd); font-size: clamp(26px, 3.5vw, 42px); color: var(--text-d); line-height: 1.15; margin-bottom: 20px; font-weight: 400; }
.es-about-malaysia-text p { font-size: 15px; color: var(--text-m); line-height: 1.75; margin-bottom: 16px; }
.es-about-bullets { display: flex; flex-direction: column; gap: 12px; margin-top: 24px; }
.es-about-bullet { display: flex; align-items: flex-start; gap: 10px; font-size: 14px; color: var(--text-m); line-height: 1.5; }
.es-about-malaysia-stat-col { display: flex; flex-direction: column; gap: 28px; }
.es-about-mstat { background: var(--bg); border-radius: var(--r-xl); padding: 28px; border: 1px solid var(--border); }
.es-about-mstat-num { display: block; font-family: var(--fd); font-size: 52px; color: var(--navy); line-height: 1; margin-bottom: 10px; }
.es-about-mstat span { font-size: 14px; color: var(--text-m); line-height: 1.6; }

/* ─── CONTACT PAGE ───────────────────────────────────────── */
.es-contact-hero-inner { display: grid; grid-template-columns: 1fr auto; gap: 48px; align-items: center; }
.es-contact-hours { background: rgba(255,255,255,.08); border-radius: var(--r-l); padding: 24px; display: flex; flex-direction: column; gap: 14px; min-width: 220px; }
.es-contact-hour-item { display: flex; align-items: center; gap: 10px; font-size: 14px; color: rgba(255,255,255,.8); }
.es-contact-section { padding: 80px 0 100px; }
.es-contact-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 48px; }
.es-contact-primary { display: flex; flex-direction: column; gap: 32px; }
.es-contact-wa-card { background: #fff; border-radius: var(--r-xl); border: 1.5px solid var(--border); padding: 32px; display: flex; flex-direction: column; gap: 16px; box-shadow: 0 4px 24px rgba(37,211,102,.12); }
.es-wa-icon { width: 64px; height: 64px; background: rgba(37,211,102,.1); border-radius: var(--r-l); display: flex; align-items: center; justify-content: center; }
.es-wa-label { font-size: 11px; font-weight: 700; text-transform: uppercase; letter-spacing: .1em; color: #25D366; }
.es-contact-wa-card h3 { font-family: var(--fd); font-size: 24px; color: var(--text-d); font-weight: 400; margin: 0; }
.es-contact-wa-card p { font-size: 14px; color: var(--text-m); line-height: 1.7; margin: 0; }
.es-wa-btn { justify-content: center; background: #25D366 !important; }
.es-wa-btn:hover { background: #1da855 !important; }
.es-contact-quicklinks h4 { font-size: 14px; font-weight: 700; color: var(--text-d); margin-bottom: 14px; }
.es-contact-ql-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.es-contact-ql { display: flex; align-items: center; gap: 8px; background: var(--bg); border: 1px solid var(--border); border-radius: var(--r-m); padding: 12px 14px; font-size: 13px; color: var(--text-m); font-weight: 500; transition: all .2s; }
.es-contact-ql:hover { background: var(--navy); color: #fff; border-color: var(--navy); }
.es-contact-form-wrap { background: var(--bg); border-radius: var(--r-xl); padding: 36px; }
.es-contact-form-header h3 { font-family: var(--fd); font-size: 24px; color: var(--text-d); font-weight: 400; margin-bottom: 6px; }
.es-contact-form-header p { font-size: 14px; color: var(--text-s); margin-bottom: 28px; }
.es-contact-form { display: flex; flex-direction: column; gap: 18px; }
.es-form-row { display: grid; grid-template-columns: 1fr 1fr; gap: 18px; }
.es-form-field label { display: block; font-size: 13px; font-weight: 600; color: var(--text-d); margin-bottom: 7px; }
.es-req { color: var(--gold); }
.es-form-field input, .es-form-field select, .es-form-field textarea { width: 100%; padding: 12px 14px; border: 1.5px solid var(--border); border-radius: var(--r-s); font-size: 15px; font-family: var(--fb); color: var(--text-d); background: #fff; transition: border-color .2s; }
.es-form-field input:focus, .es-form-field select:focus, .es-form-field textarea:focus { outline: none; border-color: var(--navy); box-shadow: 0 0 0 3px rgba(27,79,138,.1); }
.es-form-note { display: flex; align-items: center; gap: 6px; font-size: 12px; color: var(--text-s); margin-top: 4px; }
.es-contact-track { padding: 36px 0; background: var(--bg); border-top: 1px solid var(--border); }
.es-contact-track-inner { display: flex; align-items: center; justify-content: space-between; gap: 24px; flex-wrap: wrap; }
.es-contact-track-inner h3 { font-size: 18px; font-weight: 700; color: var(--text-d); margin-bottom: 4px; }
.es-contact-track-inner p { font-size: 14px; color: var(--text-s); }

/* ─── FAQS PAGE ──────────────────────────────────────────── */
.es-faqs-section { padding: 80px 0 100px; }
.es-faqs-layout { display: grid; grid-template-columns: 220px 1fr; gap: 56px; align-items: start; }
.es-faq-nav { position: sticky; top: 100px; display: flex; flex-direction: column; gap: 4px; }
.es-faq-nav-link { font-size: 13px; font-weight: 600; color: var(--text-m); padding: 9px 14px; border-radius: var(--r-s); transition: all .2s; }
.es-faq-nav-link:hover, .es-faq-nav-link.active { background: rgba(27,79,138,.08); color: var(--navy); }
.es-faq-content { display: flex; flex-direction: column; gap: 48px; }
.es-faq-group-title { display: flex; align-items: center; gap: 10px; font-family: var(--fd); font-size: 24px; color: var(--text-d); font-weight: 400; margin-bottom: 20px; padding-bottom: 16px; border-bottom: 2px solid var(--border); }
.es-faq-group { display: flex; flex-direction: column; gap: 0; }
.es-faq-cta { padding: 56px 0; background: var(--bg); }
.es-faq-cta-inner { display: flex; align-items: center; justify-content: space-between; gap: 24px; flex-wrap: wrap; }
.es-faq-cta-inner h3 { font-family: var(--fd); font-size: 26px; color: var(--text-d); font-weight: 400; margin-bottom: 8px; }
.es-faq-cta-inner p { font-size: 15px; color: var(--text-m); }

/* ─── 404 PAGE ───────────────────────────────────────────── */
.es-404-section { min-height: 75vh; display: flex; align-items: center; padding: 80px 0; background: var(--bg); }
.es-404-inner { text-align: center; max-width: 560px; margin: 0 auto; }
.es-404-num { display: flex; align-items: center; justify-content: center; gap: 0; font-family: var(--fd); font-size: clamp(100px, 20vw, 180px); color: var(--navy); line-height: 1; margin-bottom: 32px; }
.es-404-shield { display: flex; align-items: center; justify-content: center; width: 1em; height: 1em; }
.es-404-shield svg { width: 0.65em; height: 0.75em; }
.es-404-title { font-family: var(--fd); font-size: clamp(24px, 3.5vw, 38px); color: var(--text-d); font-weight: 400; margin-bottom: 14px; }
.es-404-sub { font-size: 1.05rem; color: var(--text-m); line-height: 1.7; margin-bottom: 36px; }
.es-404-sub em { color: var(--navy); font-style: normal; font-weight: 600; }
.es-404-actions { display: flex; gap: 14px; justify-content: center; flex-wrap: wrap; margin-bottom: 48px; }
.es-404-links p { font-size: 13px; color: var(--text-s); margin-bottom: 14px; }
.es-404-link-row { display: flex; flex-wrap: wrap; gap: 10px; justify-content: center; }
.es-404-link-row a { font-size: 13px; color: var(--navy); font-weight: 600; padding: 7px 14px; background: #fff; border: 1px solid var(--border); border-radius: 100px; transition: all .2s; }
.es-404-link-row a:hover { background: var(--navy); color: #fff; border-color: var(--navy); }

/* ─── STICKY BAR ─────────────────────────────────────────── */
.es-sticky-bar { position: fixed; bottom: 0; left: 0; right: 0; background: var(--navy-d); border-top: 2px solid var(--gold); z-index: 190; padding: 12px 24px; }
.es-sticky-inner { max-width: 1100px; margin: 0 auto; display: flex; align-items: center; justify-content: space-between; gap: 20px; }
.es-sticky-text { display: flex; align-items: center; gap: 12px; font-size: 15px; font-weight: 600; color: rgba(255,255,255,.9); }
.es-sticky-stars { color: var(--gold); }

/* ─── CART & CHECKOUT OVERRIDES ──────────────────────────── */
.woocommerce-page table.shop_table { border-radius: var(--r-l); overflow: hidden; border: 1px solid var(--border) !important; }
.woocommerce table.shop_table th { background: var(--bg); font-family: var(--fh); font-size: 12px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; color: var(--text-s); padding: 14px 16px !important; }
.woocommerce table.shop_table td { padding: 16px !important; border-color: var(--border) !important; }
.woocommerce .button { background: var(--gold) !important; color: #fff !important; border-radius: var(--r-s) !important; font-family: var(--fh) !important; font-weight: 700 !important; padding: 13px 26px !important; transition: background .2s !important; border: none !important; }
.woocommerce .button:hover { background: var(--gold-h) !important; }
.woocommerce input[type="text"], .woocommerce input[type="email"], .woocommerce input[type="tel"], .woocommerce input[type="number"], .woocommerce select, .woocommerce textarea { border: 1.5px solid var(--border) !important; border-radius: var(--r-s) !important; padding: 12px 14px !important; font-size: 15px !important; transition: border-color .2s !important; }
.woocommerce input:focus, .woocommerce textarea:focus { border-color: var(--navy) !important; outline: none !important; box-shadow: 0 0 0 3px rgba(27,79,138,.1) !important; }
.woocommerce-checkout .woocommerce-billing-fields h3, .woocommerce-checkout .woocommerce-shipping-fields h3, .woocommerce-checkout h3 { font-family: var(--fd) !important; font-weight: 400 !important; color: var(--text-d) !important; font-size: 22px !important; margin-bottom: 18px !important; }
.woocommerce #payment { border-radius: var(--r-l) !important; background: var(--bg) !important; border: 1px solid var(--border) !important; }
.woocommerce #payment #place_order { background: var(--gold) !important; width: 100% !important; font-size: 17px !important; padding: 18px !important; border-radius: var(--r-s) !important; box-shadow: 0 6px 24px rgba(212,147,10,.35) !important; }
.woocommerce #payment #place_order:hover { background: var(--gold-h) !important; }

/* ─── RESPONSIVE ─────────────────────────────────────────── */
@media (max-width: 900px) {
  .es-ft-grid { grid-template-columns: 1fr 1fr; }
  .es-product-layout { grid-template-columns: 1fr; gap: 32px; }
  .es-product-gallery { position: static; }
  .es-shop-grid-section .es-product-grid { grid-template-columns: repeat(2, 1fr); }
  .es-about-mission { grid-template-columns: 1fr; }
  .es-contact-layout { grid-template-columns: 1fr; }
  .es-creds-grid { grid-template-columns: repeat(2, 1fr); }
  /* Homepage */
  .hero-inner { grid-template-columns: 1fr; gap: 48px; }
  .bento { grid-template-columns: 1fr 1fr; }
  .bc1 { grid-column: 1 / 3; grid-row: auto; }
  .bc4 { grid-column: 1 / 3; }
  .hiw-grid { grid-template-columns: 1fr; }
  .pc-grid { grid-template-columns: 1fr; }
  .pc.feat { transform: none; }
  .pc.feat:hover { transform: translateY(-6px); }
  .sci-inner { grid-template-columns: 1fr; gap: 40px; }
  .rev-grid { grid-template-columns: repeat(2, 1fr); }
  /* Shop */
  .es-shop-hero-inner { grid-template-columns: 1fr; gap: 40px; }
  .es-shop-hero-stats { grid-template-columns: repeat(4, 1fr); }
  .es-products-grid { grid-template-columns: repeat(2, 1fr); }
  .es-shop-trust-grid { grid-template-columns: 1fr; gap: 28px; }
  /* About */
  .es-page-hero-inner { grid-template-columns: 1fr; }
  .es-about-problem-grid { grid-template-columns: 1fr; gap: 40px; }
  .es-science-steps { grid-template-columns: 1fr; }
  .es-about-malaysia-grid { grid-template-columns: 1fr; gap: 48px; }
  /* Contact */
  .es-contact-hero-inner { grid-template-columns: 1fr; }
  .es-contact-grid { grid-template-columns: 1fr; }
  /* FAQs */
  .es-faqs-layout { grid-template-columns: 1fr; }
  .es-faq-nav { position: static; flex-direction: row; flex-wrap: wrap; }
}

@media (max-width: 640px) {
  .es-nav-links { display: none; position: absolute; top: 64px; left: 0; right: 0; background: var(--bg-w); border-bottom: 1px solid var(--border); flex-direction: column; padding: 16px 24px; gap: 0; box-shadow: var(--sh-m); }
  .es-nav-links.open { display: flex; }
  .es-nav-links li { border-bottom: 1px solid var(--border); }
  .es-nav-links a { display: block; padding: 14px 0; font-size: 16px; }
  .es-nav-tog { display: flex; }
  .es-ft-grid { grid-template-columns: 1fr; gap: 32px; }
  .es-shop-grid-section .es-product-grid { grid-template-columns: 1fr; }
  .es-page-hero-inner { grid-template-columns: 1fr; }
  .es-creds-grid { grid-template-columns: repeat(2, 1fr); }
  .es-product-trust { grid-template-columns: 1fr; }
  /* Homepage */
  .pain-grid { grid-template-columns: 1fr; }
  .bento { grid-template-columns: 1fr; }
  .bc1 { grid-column: 1; }
  .bc4 { grid-column: 1; }
  .hero-actions { flex-direction: column; }
  .stat-grid { grid-template-columns: 1fr 1fr; }
  .rev-grid { grid-template-columns: 1fr; }
  /* Shop */
  .es-shop-hero-stats { grid-template-columns: repeat(2, 1fr); }
  .es-products-grid { grid-template-columns: 1fr; }
  /* About */
  .es-creds-grid { grid-template-columns: 1fr; }
  /* Contact */
  .es-form-row { grid-template-columns: 1fr; }
  .es-contact-ql-grid { grid-template-columns: 1fr; }
  /* Sticky bar */
  .es-sticky-text span:not(.es-sticky-stars) { display: none; }
}
