/*
Theme Name: Battlefield Essentials
Theme URI: https://battlefieldessentials.com
Author: Battlefield Essentials (handoff implemented by Claude Code)
Description: Sleek tactical, military-inspired WooCommerce storefront theme. Dark gunmetal base with a restrained #cc9029 gold accent, Bebas Neue display + Oswald body, fluid clamp() type, and an 8dp spacing grid. All design tokens are defined in theme.json and surfaced as CSS custom properties.
Version: 1.0.0
Requires at least: 6.4
Tested up to: 6.7
Requires PHP: 7.4
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: battlefield-essentials
Tags: ecommerce, woocommerce, dark-mode, custom-colors, custom-menu, featured-images, translation-ready, full-width-template
WC requires at least: 8.0
WC tested up to: 9.4
*/

/* ============================================================
   TOKEN BRIDGE
   theme.json emits every token as --wp--custom--<group>--<key>.
   Here we alias them to the short authoring names used across
   the templates, each with a hard fallback so the theme renders
   even if global-styles output is disabled.
   ============================================================ */
:root{
  /* surfaces */
  --bg-0:var(--wp--custom--bg--0,#0a0b0a);
  --bg-1:var(--wp--custom--bg--1,#101211);
  --bg-2:var(--wp--custom--bg--2,#16191a);
  --bg-3:var(--wp--custom--bg--3,#1f2325);
  --bg-4:var(--wp--custom--bg--4,#272c2e);

  /* gold accent */
  --gold:var(--wp--custom--gold--default,#cc9029);
  --gold-bright:var(--wp--custom--gold--bright,#e2a942);
  --gold-deep:var(--wp--custom--gold--deep,#8a5f15);
  --gold-glow:var(--wp--custom--gold--glow,rgba(204,144,41,.22));
  --gold-soft:var(--wp--custom--gold--soft,rgba(204,144,41,.12));

  /* ink */
  --ink:var(--wp--custom--ink--default,#f2f0e9);
  --ink-dim:var(--wp--custom--ink--dim,#a9aaa3);
  --ink-faint:var(--wp--custom--ink--faint,#6b6e68);

  /* lines */
  --line:var(--wp--custom--line--default,rgba(255,255,255,.08));
  --line-strong:var(--wp--custom--line--strong,rgba(255,255,255,.14));
  --line-gold:var(--wp--custom--line--gold,rgba(204,144,41,.34));

  /* status */
  --stock:var(--wp--custom--status--stock,#8fae3e);
  --danger:var(--wp--custom--status--danger,#d4593f);
  --stock-soft:var(--wp--custom--status--stock-soft,rgba(143,174,62,.12));

  /* scrims & textures */
  --header-scroll:var(--wp--custom--scrim--header-scroll,rgba(10,11,10,.86));
  --bar-bg:var(--wp--custom--scrim--bar-bg,rgba(16,18,17,.96));
  --shadow-strong:var(--wp--custom--scrim--shadow-strong,rgba(0,0,0,.8));
  --shadow-soft:var(--wp--custom--scrim--shadow-soft,rgba(0,0,0,.5));
  --overlay:var(--wp--custom--scrim--overlay,rgba(0,0,0,.62));
  --texture-line:var(--wp--custom--scrim--texture-line,rgba(255,255,255,.018));
  --watermark:var(--wp--custom--scrim--watermark,rgba(255,255,255,.018));

  /* type families + fluid sizes */
  --font-display:var(--wp--custom--font--display,'Bebas Neue',sans-serif);
  --font-body:var(--wp--custom--font--body,'Oswald',sans-serif);
  --fs-display:var(--wp--custom--fs--display,clamp(3.4rem,9vw,8.5rem));
  --fs-h1:var(--wp--custom--fs--h1,clamp(2.6rem,6vw,5rem));
  --fs-h2:var(--wp--custom--fs--h2,clamp(2rem,4.2vw,3.4rem));
  --fs-h3:var(--wp--custom--fs--h3,clamp(1.5rem,2.6vw,2.1rem));
  --fs-lead:var(--wp--custom--fs--lead,clamp(1rem,1.4vw,1.25rem));
  --fs-body:var(--wp--custom--fs--body,clamp(.95rem,1.05vw,1.05rem));
  --fs-label:var(--wp--custom--fs--label,clamp(.72rem,.9vw,.8rem));

  /* ---- 8dp SPACING GRID (Google Material 8dp baseline) ---- */
  --space-half:var(--wp--custom--space--half,4px);
  --space-1:var(--wp--custom--space--1,8px);
  --space-2:var(--wp--custom--space--2,16px);
  --space-3:var(--wp--custom--space--3,24px);
  --space-4:var(--wp--custom--space--4,32px);
  --space-5:var(--wp--custom--space--5,40px);
  --space-6:var(--wp--custom--space--6,48px);
  --space-7:var(--wp--custom--space--7,56px);
  --space-8:var(--wp--custom--space--8,64px);
  --space-10:var(--wp--custom--space--10,80px);
  --space-12:var(--wp--custom--space--12,96px);
  --space-14:var(--wp--custom--space--14,112px);
  --space-16:var(--wp--custom--space--16,128px);

  /* rhythm — fluid, snapped to 8dp endpoints */
  --pad-x:var(--wp--custom--rhythm--pad-x,clamp(16px,5vw,96px));
  --section-y:var(--wp--custom--rhythm--section-y,clamp(56px,8vw,112px));
  --gap-grid:var(--wp--custom--rhythm--gap-grid,clamp(16px,2vw,24px));
  --gap-hero:var(--wp--custom--rhythm--gap-hero,clamp(32px,5vw,64px));

  --radius:var(--wp--custom--radius,3px);
  --notch:var(--wp--custom--notch,14px);
  --ease:var(--wp--custom--ease,cubic-bezier(.22,.61,.36,1));
}

/* accent intensity variants (data-accent on <html>) */
[data-accent="bold"]{ --gold-glow:rgba(204,144,41,.38); --gold-soft:rgba(204,144,41,.2); --line-gold:rgba(204,144,41,.5); }
[data-accent="subtle"]{ --gold-glow:rgba(204,144,41,.12); --gold-soft:rgba(204,144,41,.06); --line-gold:rgba(204,144,41,.2); }

/* ===== LIGHT THEME — warm tactical paper ===== */
[data-theme="light"]{
  --bg-0:#f3f0e8; --bg-1:#ece8de; --bg-2:#e4dfd2; --bg-3:#dad4c5; --bg-4:#cbc4b1;
  --gold:#b27c1d; --gold-bright:#9a6913; --gold-deep:#caa24a;
  --gold-glow:rgba(178,124,29,.24); --gold-soft:rgba(178,124,29,.13);
  --ink:#191c1a; --ink-dim:#54574e; --ink-faint:#878a7e;
  --line:rgba(20,24,18,.12); --line-strong:rgba(20,24,18,.2); --line-gold:rgba(178,124,29,.4);
  --header-scroll:rgba(243,240,232,.84); --bar-bg:rgba(236,232,222,.96);
  --shadow-strong:rgba(60,52,30,.28); --shadow-soft:rgba(60,52,30,.16); --overlay:rgba(30,26,16,.42);
  --texture-line:rgba(20,24,18,.028); --watermark:rgba(20,24,18,.035); --stock-soft:rgba(110,134,44,.16);
}
[data-theme="light"][data-accent="bold"]{ --gold-glow:rgba(178,124,29,.4); --gold-soft:rgba(178,124,29,.22); --line-gold:rgba(178,124,29,.55); }
[data-theme="light"][data-accent="subtle"]{ --gold-glow:rgba(178,124,29,.13); --gold-soft:rgba(178,124,29,.07); --line-gold:rgba(178,124,29,.24); }

/* ============================================================
   BASE / RESET
   ============================================================ */
*{ box-sizing:border-box; margin:0; padding:0; }
html{ scroll-behavior:smooth; overflow-x:clip; }
body{
  background:var(--bg-0);
  color:var(--ink);
  font-family:var(--font-body);
  font-weight:300;
  font-size:var(--fs-body);
  line-height:1.6;
  -webkit-font-smoothing:antialiased;
}

/* tactical texture overlay (toggle .texture-on on body) */
.texture-on{
  background-image:repeating-linear-gradient(135deg, var(--texture-line) 0 1px, transparent 1px 7px);
}

h1,h2,h3,h4,.bebas{
  font-family:var(--font-display);
  font-weight:400; letter-spacing:.01em; line-height:.92; text-transform:uppercase;
}

a{ color:inherit; text-decoration:none; }
button{ font-family:inherit; cursor:pointer; border:none; background:none; color:inherit; }
img{ display:block; max-width:100%; }

/* ============================================================
   UTILITIES
   ============================================================ */
.muted{ color:var(--ink-dim); }
.faint{ color:var(--ink-faint); }
.gold{ color:var(--gold); }
.up{ text-transform:uppercase; letter-spacing:.14em; }
.bebas{ font-family:var(--font-display); }
.screen-reader-text{ position:absolute!important; width:1px; height:1px; overflow:hidden; clip:rect(1px,1px,1px,1px); white-space:nowrap; }
.skip-link{ position:absolute; left:-9999px; z-index:200; background:var(--gold); color:#15110a; padding:var(--space-1) var(--space-2); }
.skip-link:focus{ left:var(--space-2); top:var(--space-2); }

.eyebrow{
  font-family:var(--font-body); font-weight:600; font-size:var(--fs-label);
  letter-spacing:.32em; text-transform:uppercase; color:var(--gold);
  display:inline-flex; align-items:center; gap:.7em;
}
.eyebrow::before{ content:""; width:clamp(22px,3vw,42px); height:2px; background:var(--gold); }
.eyebrow.no-rule::before{ display:none; }

.kicker-num{ font-family:var(--font-display); color:var(--gold); }

/* notched tactical clip */
.notch{ clip-path:polygon(var(--notch) 0, 100% 0, 100% calc(100% - var(--notch)), calc(100% - var(--notch)) 100%, 0 100%, 0 var(--notch)); }
.notch-r{ clip-path:polygon(0 0, calc(100% - var(--notch)) 0, 100% var(--notch), 100% 100%, var(--notch) 100%, 0 calc(100% - var(--notch))); }

/* layout helpers */
.wrap{ padding-left:var(--pad-x); padding-right:var(--pad-x); }
.section{ padding-top:var(--section-y); padding-bottom:var(--section-y); }
.divider{ height:1px; background:var(--line); }

/* placeholder imagery */
.ph{
  position:relative; overflow:hidden;
  background:
    repeating-linear-gradient(135deg, rgba(204,144,41,.05) 0 12px, transparent 12px 24px),
    linear-gradient(160deg, var(--bg-3), var(--bg-2));
  display:flex; align-items:center; justify-content:center;
}
.ph::after{
  content:attr(data-label);
  font-family:var(--font-body); font-size:.7rem; font-weight:500; letter-spacing:.2em;
  text-transform:uppercase; color:var(--ink-faint);
  border:1px dashed var(--line-strong); padding:.5em .9em; text-align:center; max-width:80%;
}
.ph > img{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; }
.ph.has-img::after{ display:none; }

/* ============================================================
   BUTTONS
   ============================================================ */
.btn,
.woocommerce a.button, .woocommerce button.button, .woocommerce input.button,
.woocommerce #respond input#submit, .woocommerce a.button.alt, .woocommerce button.button.alt{
  --notch:11px;
  display:inline-flex; align-items:center; justify-content:center; gap:.6em;
  font-family:var(--font-body); font-weight:600; text-transform:uppercase; letter-spacing:.13em;
  font-size:clamp(.82rem,1vw,.95rem);
  padding:1.05em 2em; line-height:1; border-radius:0;
  transition:all .25s var(--ease); position:relative;
}
.btn-gold,
.woocommerce a.button.alt, .woocommerce button.button.alt, .woocommerce #respond input#submit,
.woocommerce a.button, .woocommerce button.button, .woocommerce input.button{
  background:var(--gold); color:#15110a;
}
.btn-gold:hover,
.woocommerce a.button:hover, .woocommerce button.button:hover, .woocommerce input.button:hover,
.woocommerce a.button.alt:hover, .woocommerce button.button.alt:hover{
  background:var(--gold-bright); transform:translateY(-2px); box-shadow:0 10px 30px -8px var(--gold-glow);
}
.btn-ghost{ border:1.5px solid var(--line-strong); color:var(--ink); }
.btn-ghost:hover{ border-color:var(--gold); color:var(--gold); }
.btn-block{ width:100%; }
.btn-lg{ padding:1.25em 2.4em; }

/* ============================================================
   CHIPS / BADGES
   ============================================================ */
.chip{
  font-family:var(--font-body); font-weight:500; font-size:.66rem; letter-spacing:.18em;
  text-transform:uppercase; padding:.42em .8em; border:1px solid var(--line-strong);
  color:var(--ink-dim); white-space:nowrap; display:inline-block;
}
.chip-gold{ border-color:var(--line-gold); color:var(--gold); background:var(--gold-soft); }
.chip-stock{ border-color:rgba(143,174,62,.4); color:var(--stock); }
.chip-danger{ border-color:rgba(212,89,63,.45); color:var(--danger); }

/* ============================================================
   STAR RATING
   ============================================================ */
.stars{ display:inline-flex; gap:2px; color:var(--gold); line-height:1; }
.stars .star{ position:relative; width:1em; height:1em; display:inline-block; }
.stars .star svg{ width:1em; height:1em; position:absolute; inset:0; }
.stars .star .empty{ fill:rgba(255,255,255,.12); }
.stars .star .fill{ fill:var(--gold); overflow:hidden; }
.stars .star .fill.half{ width:50%; }

/* ============================================================
   ANIMATIONS
   ============================================================ */
@keyframes rise{ from{ opacity:0; transform:translateY(24px); } to{ opacity:1; transform:none; } }
@keyframes routeIn{ from{ opacity:0; } to{ opacity:1; } }
@keyframes marquee{ from{ transform:translateX(0); } to{ transform:translateX(-50%); } }
.rise{ animation:rise .7s var(--ease) both; }
.route{ animation:routeIn .35s var(--ease) both; }
.no-anim .rise, .no-anim .route{ animation:none!important; opacity:1!important; transform:none!important; }

/* scrollbar */
::-webkit-scrollbar{ width:10px; height:10px; }
::-webkit-scrollbar-track{ background:var(--bg-1); }
::-webkit-scrollbar-thumb{ background:var(--bg-4); border:2px solid var(--bg-1); }
::-webkit-scrollbar-thumb:hover{ background:var(--gold-deep); }

/* ============================================================
   FREE-SHIP BAR
   ============================================================ */
.ship-bar{ background:var(--bg-2); border-bottom:1px solid var(--line); font-family:var(--font-body); }
.ship-bar__inner{
  display:flex; align-items:center; justify-content:center; gap:var(--space-2);
  padding:.55rem 0; font-size:.74rem; letter-spacing:.14em; text-transform:uppercase; flex-wrap:wrap;
}
.ship-bar__msg{ display:flex; align-items:center; gap:var(--space-1); white-space:nowrap; }
.ship-bar__msg svg{ width:18px; height:18px; color:var(--gold); }
.ship-track{ width:min(220px,40vw); height:4px; background:var(--bg-4); overflow:hidden; }
.ship-track > span{ display:block; height:100%; background:linear-gradient(90deg,var(--gold-deep),var(--gold)); transition:width .5s var(--ease); }

/* ============================================================
   HEADER / NAV
   ============================================================ */
.site-header{
  position:sticky; top:0; z-index:50; background:var(--bg-0);
  backdrop-filter:blur(14px); border-bottom:1px solid var(--line); transition:all .3s var(--ease);
}
.site-header.is-scrolled{ background:var(--header-scroll); border-bottom-color:var(--line-gold); }
.site-header__inner{
  display:flex; align-items:center; justify-content:space-between;
  height:clamp(64px,8vw,80px);
}
.brand{ display:flex; align-items:center; gap:.7rem; color:var(--ink); }
.brand img,
.brand__logo{ height:42px; width:auto; display:block; filter:drop-shadow(0 2px 8px var(--gold-glow)); }
/* Inline lockup: the "BATTLEFIELD" wordmark inherits this ink color via
   currentColor, so it stays legible when the theme toggles light/dark. */
.brand__logo{ color:var(--ink); transition:color .2s ease; }
.brand__text{ line-height:.85; }
.brand__text .brand__name{ font-family:var(--font-display); font-size:1.45rem; letter-spacing:.04em; }
.brand__text .brand__sub{ font-family:var(--font-body); font-weight:600; font-size:.56rem; letter-spacing:.42em; color:var(--gold); }

.desk-nav{ display:flex; gap:var(--space-5); }
.nav-link{
  font-family:var(--font-body); font-weight:500; font-size:.82rem; letter-spacing:.16em;
  text-transform:uppercase; color:var(--ink-dim); position:relative; padding:.4rem 0;
}
.nav-link::after{ content:""; position:absolute; left:0; bottom:0; width:0; height:2px; background:var(--gold); transition:width .25s var(--ease); }
.nav-link:hover{ color:var(--ink); }
.nav-link:hover::after,.nav-link.current-menu-item::after{ width:100%; }

.header-actions{ display:flex; align-items:center; gap:var(--space-2); }
.icon-btn{ display:grid; place-items:center; color:var(--ink); transition:color .2s; position:relative; }
.icon-btn:hover{ color:var(--gold); }
.cart-count{
  position:absolute; top:-7px; right:-9px; background:var(--gold); color:#15110a;
  font-family:var(--font-body); font-weight:700; font-size:.62rem; min-width:18px; height:18px;
  border-radius:9px; display:grid; place-items:center; padding:0 4px;
}

/* mobile menu */
.mobile-menu{ position:fixed; inset:0; z-index:80; pointer-events:none; }
.mobile-menu.is-open{ pointer-events:auto; }
.mobile-menu__scrim{ position:absolute; inset:0; background:var(--overlay); opacity:0; transition:opacity .3s; }
.mobile-menu.is-open .mobile-menu__scrim{ opacity:1; }
.mobile-menu__panel{
  position:absolute; top:0; right:0; bottom:0; width:min(86vw,360px); background:var(--bg-1);
  border-left:1px solid var(--line-gold); transform:translateX(100%); transition:transform .35s var(--ease);
  display:flex; flex-direction:column;
}
.mobile-menu.is-open .mobile-menu__panel{ transform:none; }
.mobile-menu__head{ display:flex; justify-content:space-between; align-items:center; padding:var(--space-2) var(--space-3); border-bottom:1px solid var(--line); }
.mobile-menu__nav{ display:flex; flex-direction:column; padding:var(--space-1) 0; }
.mobile-menu__nav a{
  text-align:left; padding:var(--space-2) var(--space-3); border-bottom:1px solid var(--line);
  display:flex; justify-content:space-between; align-items:center;
  font-family:var(--font-display); font-size:1.7rem; letter-spacing:.02em;
}
.mobile-menu__nav a .num{ color:var(--gold); font-size:.8rem; margin-right:.7rem; font-family:var(--font-body); font-weight:600; }
.mobile-menu__foot{ margin-top:auto; padding:var(--space-3); display:flex; flex-direction:column; gap:var(--space-1); }

/* ============================================================
   CART DRAWER
   ============================================================ */
.cart-drawer{ position:fixed; inset:0; z-index:90; pointer-events:none; }
.cart-drawer.is-open{ pointer-events:auto; }
.cart-drawer__scrim{ position:absolute; inset:0; background:var(--overlay); opacity:0; transition:opacity .3s; }
.cart-drawer.is-open .cart-drawer__scrim{ opacity:1; }
.cart-drawer__panel{
  position:absolute; top:0; right:0; bottom:0; width:min(92vw,440px); background:var(--bg-1);
  border-left:1px solid var(--line-gold); transform:translateX(100%); transition:transform .38s var(--ease);
  display:flex; flex-direction:column;
}
.cart-drawer.is-open .cart-drawer__panel{ transform:none; }
.cart-drawer__head{ display:flex; justify-content:space-between; align-items:center; padding:var(--space-3) var(--space-3); border-bottom:1px solid var(--line); }
.cart-drawer__head h3{ font-size:1.7rem; display:flex; align-items:baseline; gap:.5rem; }
.cart-drawer__progress{ padding:var(--space-2) var(--space-3); border-bottom:1px solid var(--line); background:var(--bg-2); }
.cart-drawer__progress .bar{ height:5px; background:var(--bg-4); }
.cart-drawer__progress .bar > span{ display:block; height:100%; background:linear-gradient(90deg,var(--gold-deep),var(--gold)); transition:width .4s var(--ease); }
.cart-drawer__body{ flex:1; overflow-y:auto; padding:var(--space-1) 0; }
.cart-drawer__foot{ border-top:1px solid var(--line-gold); padding:var(--space-3); background:var(--bg-2); }
.cart-line{ display:flex; gap:var(--space-2); padding:var(--space-2) var(--space-3); border-bottom:1px solid var(--line); }
.qty-stepper{ display:flex; align-items:center; border:1px solid var(--line-strong); }
.qty-stepper button{ padding:.35rem .55rem; display:grid; place-items:center; }
.qty-stepper .qty{ font-family:var(--font-body); font-weight:600; font-size:.85rem; min-width:24px; text-align:center; }

/* ============================================================
   HOMEPAGE — HERO
   ============================================================ */
.hero{ position:relative; overflow:hidden; border-bottom:1px solid var(--line); }
.hero__bg{ position:absolute; inset:0; background:radial-gradient(120% 90% at 80% 10%, var(--gold-soft) 0%, transparent 45%), linear-gradient(180deg, var(--bg-0), var(--bg-1)); }
.hero__texture{ position:absolute; inset:0; opacity:.6; }
.hero__watermark{ position:absolute; top:-10%; right:-5%; font-family:var(--font-display); font-size:min(38vw,560px); color:var(--watermark); line-height:.8; letter-spacing:-.02em; pointer-events:none; user-select:none; }
.hero-grid{
  position:relative; display:grid; grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr);
  gap:var(--gap-hero); align-items:center; min-height:min(86vh,760px);
  padding-top:clamp(48px,6vw,80px); padding-bottom:clamp(48px,6vw,80px);
}
.hero__copy{ display:flex; flex-direction:column; gap:var(--space-3); }
.hero__copy h1{ font-size:clamp(2.6rem,5.4vw,5rem); line-height:1.05; }
.hero__lead{ font-size:var(--fs-lead); max-width:46ch; }
.hero__cta{ display:flex; gap:var(--space-1); flex-wrap:wrap; }
.hero__stats{ display:flex; gap:clamp(24px,3vw,40px); margin-top:var(--space-1); flex-wrap:wrap; }
.hero__stats .num{ font-family:var(--font-display); color:var(--gold); font-size:2.2rem; line-height:1; }
.hero__stats .lbl{ font-size:.66rem; }
.hero__feature{ position:relative; }
.hero__feature-frame{ position:relative; border:1px solid var(--line-gold); background:var(--bg-2); padding:var(--space-3); }
.hero__feature-frame .chip{ position:absolute; top:24px; left:24px; }
.hero__feature-card{
  cursor:pointer; position:absolute; bottom:-24px; left:8%; right:8%; background:var(--bg-3);
  border:1px solid var(--line-strong); padding:var(--space-2) var(--space-3);
  display:flex; justify-content:space-between; align-items:center; box-shadow:0 20px 50px -20px var(--shadow-strong);
}

/* MARQUEE */
.marquee{ background:var(--gold); color:#15110a; overflow:hidden; border-top:1px solid var(--gold-deep); border-bottom:1px solid var(--gold-deep); }
.marquee__row{ display:flex; gap:var(--space-6); padding:.7rem 0; white-space:nowrap; animation:marquee 28s linear infinite; font-family:var(--font-body); font-weight:700; font-size:.8rem; letter-spacing:.2em; }
.marquee__row span{ display:flex; align-items:center; gap:var(--space-6); }

/* CATEGORY RAIL */
.cat-rail{ display:grid; grid-template-columns:repeat(auto-fit,minmax(220px,1fr)); gap:1px; background:var(--line); border:1px solid var(--line); }
.cat-cell{ background:var(--bg-1); padding:var(--space-4) var(--space-3); text-align:left; display:flex; flex-direction:column; gap:var(--space-half); transition:background .3s var(--ease); min-height:170px; }
.cat-cell:hover{ background:var(--bg-2)!important; }
.cat-cell .n{ font-family:var(--font-display); color:var(--ink-faint); font-size:1.4rem; }
.cat-cell h3{ font-size:1.9rem; margin-top:auto; }
.cat-cell .go{ color:var(--gold); font-size:.66rem; margin-top:.5rem; display:flex; align-items:center; gap:.4rem; text-transform:uppercase; letter-spacing:.14em; }

/* FEATURED GRID + TABS */
.section-head{ display:flex; justify-content:space-between; align-items:flex-end; flex-wrap:wrap; gap:var(--space-2); margin-bottom:var(--space-5); }
.section-head h2{ font-size:var(--fs-h2); margin-top:.7rem; }
.filter-tabs{ display:flex; gap:var(--space-1); flex-wrap:wrap; }
.filter-tab{
  font-family:var(--font-body); font-weight:500; font-size:.74rem; letter-spacing:.12em; text-transform:uppercase;
  padding:.5em 1em; border:1px solid var(--line-strong); color:var(--ink-dim); background:transparent; transition:all .2s;
}
.filter-tab.is-active{ border-color:var(--gold); color:#15110a; background:var(--gold); }
.product-grid{ display:grid; grid-template-columns:repeat(auto-fill,minmax(min(100%,270px),1fr)); gap:var(--gap-grid); }
.pgrid-item{ display:flex; }
.pgrid-item > .pcard{ flex:1; width:100%; }

/* BUNDLE UPSELL */
.bundle{ position:relative; overflow:hidden; border:1px solid var(--line-gold); background:linear-gradient(135deg, var(--bg-2), var(--bg-1)); }
.bundle__texture{ position:absolute; inset:0; opacity:.5; }
.bundle-grid{ position:relative; display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:clamp(24px,4vw,56px); align-items:center; padding:clamp(32px,5vw,56px); }
.bundle__copy{ display:flex; flex-direction:column; gap:var(--space-2); }
.bundle__price{ display:flex; align-items:baseline; gap:var(--space-2); flex-wrap:wrap; }
.bundle__price .now{ font-family:var(--font-display); color:var(--gold); font-size:3.4rem; line-height:1; }
.bundle__price .was{ text-decoration:line-through; font-size:1.1rem; color:var(--ink-faint); }
.bundle__shots{ display:flex; gap:var(--space-1); }
.bundle__shots > div{ flex:1; }
.bundle__shots .lift{ transform:translateY(-14px); }

/* TRUST STRIP */
.trust-strip{ border-top:1px solid var(--line); border-bottom:1px solid var(--line); }
.trust-grid{ display:grid; grid-template-columns:repeat(auto-fit,minmax(220px,1fr)); gap:clamp(24px,3vw,40px); }
.trust-item{ display:flex; flex-direction:column; gap:var(--space-1); }
.trust-item svg{ width:34px; height:34px; color:var(--gold); }
.trust-item h3{ font-size:1.5rem; }

/* ============================================================
   PRODUCT CARD (editorial / spec / minimal)
   ============================================================ */
.pcard{ display:flex; flex-direction:column; transition:all .3s var(--ease); }
.pcard__media{ position:relative; cursor:pointer; }
.pcard__price{ display:flex; align-items:baseline; gap:var(--space-1); }
.pcard__price .now{ font-family:var(--font-display); color:var(--gold); font-size:1.7rem; }
.pcard__price .was{ text-decoration:line-through; font-size:.85rem; color:var(--ink-faint); }
.pcard__rating{ display:flex; align-items:center; gap:var(--space-1); }

/* editorial */
.pcard--editorial{ border:1px solid var(--line); background:var(--bg-1); }
.pcard--editorial:hover{ border-color:var(--line-gold); }
.pcard--editorial .pcard__badges{ position:absolute; top:12px; left:12px; display:flex; gap:6px; }
.pcard--editorial .pcard__cat{ position:absolute; top:12px; right:12px; }
.pcard--editorial .pcard__body{ padding:var(--space-3) var(--space-3) var(--space-3); display:flex; flex-direction:column; gap:var(--space-1); flex:1; }
.pcard--editorial h3{ font-size:1.55rem; cursor:pointer; }
.pcard--editorial .pcard__foot{ margin-top:auto; display:flex; align-items:center; justify-content:space-between; padding-top:var(--space-1); }

/* spec */
.pcard--spec{ background:var(--bg-2); position:relative; }
.pcard--spec:hover{ box-shadow:0 18px 40px -20px var(--shadow-strong); }
.pcard--spec .pcard__media{ border-bottom:1px solid var(--line); }
.pcard--spec .pcard__badges{ position:absolute; top:10px; left:10px; }
.pcard--spec .pcard__body{ padding:var(--space-2) var(--space-2) var(--space-2); display:flex; flex-direction:column; gap:var(--space-1); flex:1; }
.pcard--spec h3{ font-size:1.35rem; cursor:pointer; line-height:.95; }
.pcard--spec .pcard__facts{ display:flex; flex-wrap:wrap; gap:4px 6px; margin:.3rem 0 .2rem; }
.pcard--spec .pcard__foot{ margin-top:auto; display:flex; align-items:center; justify-content:space-between; padding-top:var(--space-1); border-top:1px solid var(--line); }

/* minimal */
.pcard--minimal:hover{ transform:translateY(-6px); }
.pcard--minimal .pcard__media{ background:var(--bg-1); border:1px solid var(--line); }
.pcard--minimal .pcard__badges{ position:absolute; top:12px; left:12px; }
.pcard--minimal .pcard__quickadd{ position:absolute; left:12px; right:12px; bottom:12px; opacity:0; transform:translateY(8px); transition:all .3s var(--ease); padding:.85em; }
.pcard--minimal:hover .pcard__quickadd{ opacity:1; transform:none; }
.pcard--minimal .pcard__body{ padding:var(--space-2) .2rem 0; text-align:center; display:flex; flex-direction:column; gap:var(--space-half); }
.pcard--minimal h3{ font-size:1.4rem; cursor:pointer; }
.pcard--minimal .pcard__rating{ justify-content:center; }

/* ============================================================
   SINGLE PRODUCT (PDP)
   ============================================================ */
.breadcrumb{ padding-top:var(--space-2); padding-bottom:var(--space-half); display:flex; gap:.6rem; align-items:center; font-family:var(--font-body); font-size:.72rem; letter-spacing:.12em; text-transform:uppercase; }
.pdp-grid{ display:grid; grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr); gap:clamp(24px,4vw,56px); padding-top:var(--space-2); padding-bottom:var(--section-y); }
.pdp-gallery{ display:flex; flex-direction:column; gap:var(--space-1); position:sticky; top:110px; align-self:start; }
.pdp-gallery__main{ border:1px solid var(--line-gold); background:var(--bg-2); padding:var(--space-2); position:relative; }
.pdp-gallery__main .chip-wrap{ position:absolute; top:24px; left:24px; display:flex; gap:6px; }
.pdp-thumbs{ display:flex; gap:var(--space-1); }
.pdp-thumbs button{ flex:1; border:1px solid var(--line); padding:.3rem; background:var(--bg-1); }
.pdp-thumbs button.is-active{ border-color:var(--gold); }
.pdp-details{ display:flex; flex-direction:column; gap:var(--space-2); }
.pdp-details h1{ font-size:var(--fs-h1); margin-top:.5rem; }
.pdp-meta{ display:flex; align-items:center; gap:var(--space-1); }
.pdp-facts{ display:grid; grid-template-columns:repeat(4,1fr); gap:1px; background:var(--line); border:1px solid var(--line); }
.pdp-facts > div{ background:var(--bg-1); padding:var(--space-1) .6rem; text-align:center; }
.pdp-facts .v{ font-family:var(--font-display); color:var(--gold); font-size:1.5rem; line-height:1; }
.pdp-facts .k{ font-size:.58rem; margin-top:.3rem; }
.variant-row{ display:flex; gap:var(--space-1); flex-wrap:wrap; }
.variant-btn{ font-family:var(--font-body); font-weight:500; font-size:.8rem; padding:.6em 1.1em; border:1px solid var(--line-strong); background:transparent; color:var(--ink-dim); transition:all .2s; }
.variant-btn.is-active{ border-color:var(--gold); background:var(--gold-soft); color:var(--gold); }
.purchase-option{ display:flex; align-items:center; gap:var(--space-1); padding:var(--space-1) var(--space-2); border:1px solid var(--line); background:var(--bg-1); text-align:left; transition:all .2s; }
.purchase-option.is-active{ border-color:var(--gold); background:var(--gold-soft); }
.purchase-option .radio{ width:18px; height:18px; border-radius:50%; border:2px solid var(--line-strong); display:grid; place-items:center; flex-shrink:0; }
.purchase-option.is-active .radio{ border-color:var(--gold); }
.purchase-option.is-active .radio::after{ content:""; width:8px; height:8px; border-radius:50%; background:var(--gold); }
.pdp-add{ display:flex; gap:var(--space-1); margin-top:.3rem; }
.pdp-assurance{ display:flex; flex-wrap:wrap; gap:var(--space-2) clamp(16px,2vw,24px); padding-top:.4rem; }
.pdp-assurance span{ display:flex; align-items:center; gap:.5rem; font-family:var(--font-body); font-size:.78rem; letter-spacing:.06em; color:var(--ink-dim); }
.pdp-assurance svg{ width:18px; height:18px; color:var(--gold); }

.pdp-tabs{ display:flex; gap:var(--space-3); border-bottom:1px solid var(--line); margin-bottom:var(--space-4); flex-wrap:wrap; }
.pdp-tab{ font-family:var(--font-display); font-size:1.6rem; letter-spacing:.02em; padding:0 0 1rem; color:var(--ink-faint); border-bottom:3px solid transparent; margin-bottom:-1px; transition:all .2s; }
.pdp-tab.is-active{ color:var(--ink); border-bottom-color:var(--gold); }
.benefits-grid{ display:grid; grid-template-columns:repeat(auto-fit,minmax(240px,1fr)); gap:var(--space-3); }
.benefit-card{ background:var(--bg-1); border:1px solid var(--line); padding:var(--space-3); }
.benefit-card .n{ font-family:var(--font-display); color:var(--ink-faint); font-size:2rem; line-height:1; }
.benefit-card svg{ width:24px; height:24px; color:var(--gold); margin:.8rem 0; }
.facts-card{ max-width:520px; border:1px solid var(--line-strong); }
.facts-card__head{ background:var(--gold); color:#15110a; padding:var(--space-1) var(--space-2); font-family:var(--font-display); font-size:1.8rem; }
.facts-card__body{ padding:.4rem var(--space-2) var(--space-2); }
.facts-row{ display:flex; justify-content:space-between; padding:var(--space-1) 0; border-bottom:1px solid var(--line); }
.reviews-grid{ display:grid; grid-template-columns:minmax(0,280px) minmax(0,1fr); gap:clamp(24px,4vw,48px); }
.review-summary .big{ font-family:var(--font-display); font-size:4.5rem; line-height:.9; }
.review-bar{ display:flex; align-items:center; gap:var(--space-1); font-size:.78rem; }
.review-bar .track{ flex:1; height:6px; background:var(--bg-3); }
.review-bar .track > span{ display:block; height:100%; background:var(--gold); }
.review-list{ display:flex; flex-direction:column; gap:1px; background:var(--line); border:1px solid var(--line); }
.review-list .review{ background:var(--bg-1); padding:var(--space-3); }

.sticky-buy{ position:fixed; left:0; right:0; bottom:0; z-index:60; background:var(--bar-bg); backdrop-filter:blur(12px); border-top:1px solid var(--line-gold); transform:translateY(110%); transition:transform .35s var(--ease); }
.sticky-buy.is-visible{ transform:none; }
.sticky-buy__inner{ display:flex; align-items:center; gap:var(--space-2); padding:var(--space-1) 0; }

/* ============================================================
   FIELD NOTES (blog index + article)
   ============================================================ */
.fn-masthead{ position:relative; overflow:hidden; border-bottom:1px solid var(--line); }
.fn-masthead__bg{ position:absolute; inset:0; background:radial-gradient(110% 90% at 15% 0%, var(--gold-soft) 0%, transparent 50%), linear-gradient(180deg,var(--bg-0),var(--bg-1)); }
.fn-masthead__inner{ position:relative; padding-top:clamp(48px,6vw,80px); padding-bottom:clamp(32px,4vw,48px); }
.fn-masthead h1{ font-size:clamp(3.2rem,9vw,7rem); margin-top:.6rem; line-height:.94; }
.fn-filter{ display:flex; gap:var(--space-1); flex-wrap:wrap; padding-top:var(--space-2); padding-bottom:var(--space-half); border-bottom:1px solid var(--line); }
.fn-feature{ display:grid; grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr); gap:clamp(24px,4vw,48px); align-items:center; cursor:pointer; border:1px solid var(--line-gold); background:var(--bg-1); margin-bottom:clamp(32px,4vw,48px); }
.fn-feature__body{ padding:clamp(24px,3vw,40px); padding-left:0; display:flex; flex-direction:column; gap:var(--space-2); }
.fn-feature__body h2{ font-size:clamp(1.9rem,3.4vw,2.9rem); line-height:1.04; }
.fn-grid{ display:grid; grid-template-columns:repeat(auto-fill,minmax(min(100%,320px),1fr)); gap:clamp(16px,2.5vw,24px); }
.post-card{ cursor:pointer; border:1px solid var(--line); background:var(--bg-1); transition:all .3s var(--ease); display:flex; flex-direction:column; }
.post-card:hover{ border-color:var(--line-gold); }
.post-card__media{ position:relative; overflow:hidden; }
.post-card__media .ph{ transition:transform .4s var(--ease); }
.post-card:hover .post-card__media .ph{ transform:scale(1.04); }
.post-card__media .chip{ position:absolute; top:12px; left:12px; }
.post-card__body{ padding:var(--space-3); display:flex; flex-direction:column; gap:var(--space-1); flex:1; }
.post-card__body h3{ font-size:1.55rem; line-height:1.05; }
.post-meta{ display:flex; align-items:center; gap:.7rem; font-family:var(--font-body); font-size:.76rem; letter-spacing:.04em; color:var(--ink-faint); flex-wrap:wrap; }
.post-meta .avatar{ width:26px; height:26px; border-radius:50%; background:var(--bg-4); display:grid; place-items:center; }
.post-meta .avatar svg{ width:14px; height:14px; color:var(--gold); }

.article-header{ max-width:min(100%,820px); }
.article-header h1{ font-size:clamp(2.4rem,5.5vw,4.4rem); line-height:1.08; }
.article-body{ max-width:min(100%,760px); }
.article-body p.lead{ font-size:clamp(1.15rem,1.8vw,1.4rem); line-height:1.5; color:var(--ink); margin-bottom:var(--space-3); font-weight:400; }
.article-body h2{ font-size:clamp(1.7rem,2.6vw,2.2rem); margin-top:var(--space-4); margin-bottom:var(--space-2); }
.article-body p{ font-size:1.08rem; line-height:1.75; color:var(--ink-dim); margin-bottom:var(--space-2); }
.article-body blockquote{ border-left:3px solid var(--gold); padding-left:var(--space-3); margin:var(--space-4) 0; font-family:var(--font-display); font-size:clamp(1.6rem,3vw,2.3rem); line-height:1.05; color:var(--gold); letter-spacing:.01em; }
.article-body ul{ list-style:none; display:flex; flex-direction:column; gap:var(--space-1); margin:var(--space-2) 0; }
.article-body ul li{ display:flex; gap:.9rem; align-items:flex-start; font-size:1.05rem; line-height:1.5; }
.article-body ul li svg{ width:20px; height:20px; color:var(--gold); flex-shrink:0; margin-top:.2rem; }
.author-card{ margin-top:var(--space-4); border:1px solid var(--line); background:var(--bg-1); padding:var(--space-3); display:flex; gap:var(--space-2); align-items:center; }
.author-card .avatar{ width:58px; height:58px; border-radius:50%; background:var(--bg-3); display:grid; place-items:center; flex-shrink:0; border:1px solid var(--line-gold); }
.author-card .avatar svg{ width:28px; height:28px; color:var(--gold); }

/* ============================================================
   FOOTER
   ============================================================ */
.site-footer{ background:var(--bg-1); border-top:1px solid var(--line); margin-top:var(--space-4); }
.site-footer__inner{ padding-top:clamp(48px,5vw,72px); padding-bottom:var(--space-5); }
.footer-cols{ display:grid; grid-template-columns:repeat(auto-fit,minmax(160px,1fr)); gap:var(--space-5) var(--space-3); }
.footer-cols .intro{ grid-column:1 / -1; max-width:340px; }
.footer-cols h4{ font-size:1.2rem; margin-bottom:var(--space-2); color:var(--gold); }
.footer-links{ display:flex; flex-direction:column; gap:.7rem; }
.footer-link{ text-align:left; font-size:.85rem; color:var(--ink-dim); transition:color .2s; }
.footer-link:hover{ color:var(--gold); }
/* Footer columns driven by an assigned menu render <li> items — style them to match .footer-link. */
.footer-links ul, .footer-links li{ list-style:none; margin:0; padding:0; }
.footer-links li a{ font-size:.85rem; color:var(--ink-dim); transition:color .2s; }
.footer-links li a:hover, .footer-links li a[aria-current]{ color:var(--gold); }
.footer-legal{ display:flex; justify-content:space-between; flex-wrap:wrap; gap:var(--space-2); font-size:.72rem; letter-spacing:.1em; color:var(--ink-faint); text-transform:uppercase; }

/* ============================================================
   TOAST
   ============================================================ */
.toast{
  position:fixed; left:50%; bottom:28px; transform:translateX(-50%) translateY(120%); z-index:100;
  background:var(--bg-3); border:1px solid var(--line-gold); display:flex; align-items:center; gap:var(--space-1);
  padding:.9rem 1.3rem; box-shadow:0 18px 50px -16px var(--shadow-strong); transition:transform .4s var(--ease);
  font-family:var(--font-body); font-size:.85rem; letter-spacing:.04em;
}
.toast.show{ transform:translateX(-50%) translateY(0); }
.toast svg{ width:20px; height:20px; color:var(--gold); }

/* ============================================================
   TWEAKS PANEL (theme / accent / texture / card-style switcher)
   ============================================================ */
.tweaks-toggle{ position:fixed; right:18px; bottom:18px; z-index:110; width:48px; height:48px; display:grid; place-items:center; background:var(--bg-3); border:1px solid var(--line-gold); color:var(--gold); box-shadow:0 12px 30px -12px var(--shadow-strong); }
.tweaks-panel{ position:fixed; right:18px; bottom:78px; z-index:110; width:min(90vw,280px); background:var(--bg-2); border:1px solid var(--line-gold); padding:var(--space-2); display:none; box-shadow:0 24px 60px -20px var(--shadow-strong); }
.tweaks-panel.is-open{ display:block; }
.tweaks-panel .sec{ font-family:var(--font-display); font-size:1.1rem; color:var(--gold); margin:var(--space-2) 0 var(--space-1); }
.tweaks-panel .sec:first-child{ margin-top:0; }
.tweak-row{ display:flex; flex-wrap:wrap; gap:6px; margin-bottom:var(--space-1); }
.tweak-row .lbl{ width:100%; font-size:.68rem; letter-spacing:.12em; text-transform:uppercase; color:var(--ink-faint); margin-bottom:4px; }
.tweak-opt{ font-family:var(--font-body); font-weight:500; font-size:.72rem; letter-spacing:.08em; text-transform:uppercase; padding:.4em .8em; border:1px solid var(--line-strong); color:var(--ink-dim); }
.tweak-opt.is-active{ border-color:var(--gold); color:#15110a; background:var(--gold); }

/* ============================================================
   WOOCOMMERCE TWEAKS
   ============================================================ */
.woocommerce-message, .woocommerce-info, .woocommerce-error{ border-top-color:var(--gold); background:var(--bg-2); color:var(--ink); }
.woocommerce span.onsale{ background:var(--gold); color:#15110a; border-radius:0; }
.woocommerce .star-rating span{ color:var(--gold); }
.woocommerce-cart table.cart, .woocommerce table.shop_table{ border-color:var(--line); }
.woocommerce-price-amount{ color:var(--gold); font-family:var(--font-display); }

/* ============================================================
   WOOCOMMERCE LAYOUT INTEGRATION
   ============================================================ */
/* loop grid mirrors .product-grid */
.woocommerce ul.products, .woocommerce-page ul.products{
  display:grid!important; grid-template-columns:repeat(auto-fill,minmax(min(100%,270px),1fr));
  gap:var(--gap-grid); margin:0; list-style:none;
}
.woocommerce ul.products li.product{ width:auto!important; margin:0!important; float:none!important; padding:0; display:flex; }
.woocommerce ul.products li.product > .pcard{ flex:1; width:100%; }
.woocommerce ul.products li.product::before{ display:none; }
.woocommerce .woocommerce-result-count, .woocommerce .woocommerce-ordering{ font-family:var(--font-body); color:var(--ink-dim); margin-bottom:var(--space-3); }
.woocommerce .woocommerce-ordering select{ background:var(--bg-2); color:var(--ink); border:1px solid var(--line-strong); padding:.5rem .8rem; font-family:var(--font-body); }
.product-archive .woocommerce-products-header{ margin-bottom:var(--space-3); }

/* PDP gallery */
.pdp-gallery__main .woocommerce-product-gallery{ margin:0; }
.pdp-gallery__main .woocommerce-product-gallery__image a{ display:block; }
.pdp-gallery__main .flex-control-thumbs{ display:flex; gap:var(--space-1); margin-top:var(--space-1); padding:0; }
.pdp-gallery__main .flex-control-thumbs li{ flex:1; list-style:none; }

/* PDP native add-to-cart form, restyled */
.pdp-add-wrap{ display:flex; flex-direction:column; gap:var(--space-2); margin-top:.3rem; }
.pdp-add-wrap .quantity{ display:inline-flex; align-items:center; border:1.5px solid var(--line-strong); }
.pdp-add-wrap .quantity input.qty{
  width:54px; background:transparent; border:none; color:var(--ink);
  font-family:var(--font-body); font-weight:600; font-size:1rem; text-align:center; padding:1rem .4rem;
}
.pdp-add-wrap form.cart{ display:flex; gap:var(--space-1); flex-wrap:wrap; align-items:stretch; margin:0; }
.pdp-add-wrap form.cart .single_add_to_cart_button{ flex:1; min-width:200px; }
.pdp-add-wrap .variations{ width:100%; border-collapse:collapse; margin-bottom:var(--space-1); }
.pdp-add-wrap .variations th{ font-family:var(--font-body); font-weight:600; text-transform:uppercase; letter-spacing:.1em; font-size:.72rem; color:var(--ink-dim); text-align:left; padding:.4rem .8rem .4rem 0; }
.pdp-add-wrap .variations td{ padding:.3rem 0; }
.pdp-add-wrap .variations select{ background:var(--bg-2); color:var(--ink); border:1px solid var(--line-strong); padding:.7rem .9rem; font-family:var(--font-body); width:100%; }
.pdp-add-wrap .woocommerce-variation-price{ margin-bottom:var(--space-1); }
.pdp-add-wrap .woocommerce-variation-price .price{ color:var(--gold); font-family:var(--font-display); font-size:1.6rem; }

/* price html */
.woocommerce-Price-amount, .woocommerce ul.products li.product .price{ color:var(--gold); }
.woocommerce ul.products li.product .price del{ color:var(--ink-faint); }

/* cart drawer mini-cart (WooCommerce) */
.cart-drawer .woocommerce-mini-cart{ list-style:none; margin:0; padding:var(--space-1) 0; flex:1; overflow-y:auto; }
.cart-drawer .woocommerce-mini-cart__empty-message{ padding:4rem var(--space-3); text-align:center; color:var(--ink-dim); text-transform:uppercase; letter-spacing:.14em; font-size:.8rem; }
.cart-drawer .woocommerce-mini-cart-item{ display:flex; gap:var(--space-2); padding:var(--space-2) var(--space-3); border-bottom:1px solid var(--line); align-items:center; }
.cart-drawer .woocommerce-mini-cart-item img{ width:64px; height:auto; order:-1; }
.cart-drawer .woocommerce-mini-cart__total{ padding:var(--space-2) var(--space-3); border-top:1px solid var(--line-gold); background:var(--bg-2); display:flex; justify-content:space-between; align-items:baseline; }
.cart-drawer .woocommerce-mini-cart__total .amount{ font-family:var(--font-display); color:var(--gold); font-size:1.8rem; }
.cart-drawer .woocommerce-mini-cart__buttons{ padding:0 var(--space-3) var(--space-3); background:var(--bg-2); display:flex; flex-direction:column; gap:var(--space-1); }
.cart-drawer .woocommerce-mini-cart__buttons .checkout{ order:-1; }

/* ============================================================
   ARTICLE BODY (the_content output) REFINEMENTS
   ============================================================ */
.article-body > p:first-of-type{ font-size:clamp(1.15rem,1.8vw,1.4rem); line-height:1.5; color:var(--ink); font-weight:400; }
.article-body ul:not(.comment-list) li{ position:relative; padding-left:0; }
.article-body ul:not(.comment-list) li::before{ content:""; }
.article-body ol{ padding-left:1.4rem; }
.article-body img{ margin:var(--space-2) 0; border:1px solid var(--line); }
.article-body a{ color:var(--gold); text-decoration:underline; text-underline-offset:3px; }
.post-meta--light{ color:var(--ink-dim); }
.page-links{ display:flex; gap:.5rem; margin-top:var(--space-3); }

/* pagination */
.woocommerce nav.woocommerce-pagination ul, .pagination .nav-links, .navigation .nav-links{
  display:flex; gap:.4rem; flex-wrap:wrap; border:none;
}
.page-numbers{ font-family:var(--font-body); font-weight:600; padding:.6em 1em; border:1px solid var(--line-strong); color:var(--ink-dim); }
.page-numbers.current{ background:var(--gold); color:#15110a; border-color:var(--gold); }
.page-numbers:hover{ border-color:var(--gold); color:var(--gold); }
.page-numbers.current:hover{ color:#15110a; }

/* comment list */
.comment-list .comment-body{ border:1px solid var(--line); background:var(--bg-1); padding:var(--space-2); }
.comment-list .comment-author .fn{ font-family:var(--font-display); font-size:1.2rem; color:var(--ink); }
.comment-form input, .comment-form textarea{ background:var(--bg-2); border:1px solid var(--line-strong); color:var(--ink); padding:.8rem 1rem; font-family:var(--font-body); width:100%; }

/* ============================================================
   RESPONSIVE
   ============================================================ */
.hide-desk{ display:none; }
.show-desk{ display:grid; }

@media (max-width:1024px){
  .hero-grid{ min-height:auto; }
}
@media (max-width:860px){
  .desk-nav{ display:none!important; }
  .show-desk{ display:none!important; }
  .hide-desk{ display:grid!important; }
  .hero-grid{ grid-template-columns:1fr!important; }
  /* width:100% gives the grid item a definite size. Without it, the `auto`
     side margins suppress grid stretch and the feature shrink-wraps to ~0
     (the product .ph is width:100% with an absolutely-positioned img), which
     collapsed the featured shot on tablet/phone. */
  .hero__feature{ width:100%; max-width:440px; margin:1.5rem auto 0; justify-self:center; }
  .pdp-grid{ grid-template-columns:1fr!important; }
  .pdp-gallery{ position:static!important; }
  .bundle-grid{ grid-template-columns:1fr!important; }
  .reviews-grid{ grid-template-columns:1fr!important; }
  .fn-feature{ grid-template-columns:1fr!important; }
  .fn-feature__body{ padding:clamp(24px,3vw,40px)!important; }
}
@media (max-width:560px){
  .bundle__shots{ display:none!important; }
  .sticky-label{ display:none; }
  .pdp-gallery__main{ padding:.7rem!important; }
}
@media (max-width:400px){
  .sticky-thumb{ display:none; }
}
@media (prefers-reduced-motion:reduce){
  *{ animation-duration:.001s!important; transition-duration:.05s!important; }
}