/* design-system.css — generated per build, PRESET-AWARE (brutalist-bold).
   Tokens declared ONCE here; structural DNA is driven by the preset kit so no
   two samples read as the same template recolored. Enqueued site-wide via
   functions.php. Do not redeclare these tokens inside page templates. */
:root{
  --bg: #0A0A0A;
  --section-bg: #0A0A0A;
  --surface: #161616;
  --surface-2: #1F1F1F;
  --ink: #F5F5F5;
  --muted: color-mix(in srgb, #F5F5F5 62%, transparent);
  --border: color-mix(in srgb, #F5F5F5 14%, transparent);
  --accent: #E50914;
  --accent-deep: #B0060F;
  --accent-soft: #FF1A22;
  --accent-glow: rgba(229,9,20,0.45);
  --accent-ink: #ffffff;
  --ink-contrast: #0a0a0a;
  --font-display: 'Space Grotesk', sans-serif;
  --font-body: 'Inter', sans-serif;
  --maxw: 1180px;
  --radius: 0px;
  --shadow: 6px 6px 0 var(--accent);
  --space: clamp(2.6rem,5.5vw,4.8rem);
  --reveal-dy: 22px;
  --reveal-sc: 1;
  --reveal-ease: cubic-bezier(.2,.8,.2,1);
  --reveal-stag: 45ms;
  --reveal-dur: .5s;
  --header-h: 72px;
}
*,*::before,*::after{ box-sizing:border-box; }
html{ scroll-behavior:smooth; }
body{
  margin:0;
  background:#0A0A0A;
  color:var(--ink);
  font-family:var(--font-body);
  font-size:17px;
  line-height:1.65;
  -webkit-font-smoothing:antialiased;
}
h1,h2,h3,h4{ font-family:var(--font-display); line-height:1.08; margin:0 0 .4em; }
h1{ font-size:clamp(3rem,9vw,6.5rem); font-weight:900; letter-spacing:-.04em; text-transform:none; }
h2{ font-size:clamp(2.2rem,5vw,3.6rem); font-weight:900; letter-spacing:-.03em; }
h3{ font-size:clamp(1.3rem,2.4vw,1.7rem); font-weight:900; letter-spacing:-0.005em; }
p{ margin:0 0 1rem; }
a{ color:inherit; text-decoration:none; }
img{ max-width:100%; height:auto; display:block; }
html,body{ max-width:100%; overflow-x:clip; }
body{ -webkit-text-size-adjust:100%; text-size-adjust:100%; }
h1,h2,h3,h4,h5,p,li,a,span,blockquote,figcaption,.eyebrow,.brand,.btn,.nav-cta{ overflow-wrap:break-word; }
h1,h2,h3{ text-wrap:balance; }
p,li{ text-wrap:pretty; }
img,svg,video,iframe,table,pre{ max-width:100%; }
.container>*,.hero>*,.site-header .container>*,[class*="grid"]>*,[class*="cols"]>*,[class*="row"]>*{ min-width:0; }
.container{ width:100%; max-width:var(--maxw); margin-inline:auto; padding-inline:clamp(1.1rem,4vw,2.5rem); }
.section{ padding-block:var(--space); background:var(--section-bg); }
.eyebrow{ text-transform:uppercase; letter-spacing:.04em; font-size:.95rem; font-weight:800; color:var(--accent); display:inline-block; }
.btn{ display:inline-flex; align-items:center; gap:.5rem; padding:.85rem 1.6rem; border-radius:0px; font-weight:800; letter-spacing:.06em; text-transform:uppercase; border:2px solid var(--accent); transition:transform .18s ease, box-shadow .2s ease, background .18s ease, color .18s ease; cursor:pointer; position:relative; font-size:.85rem; }
.btn:hover{ transform:translateY(-2px); box-shadow:0 10px 30px -8px var(--accent-glow); }
.btn-accent{ background:var(--accent); color:#fff; border-color:var(--accent); }
.btn-accent:hover{ background:var(--accent-soft); border-color:var(--accent-soft); }
.btn-ghost{ background:transparent; color:var(--ink); border-color:var(--ink); }
.btn-ghost:hover{ background:var(--accent); color:#fff; border-color:var(--accent); }
.section + .section{ border-top:1px solid var(--border); }

/* ---- Site chrome (header / nav / footer) ---- */
.site-header{ position:sticky; top:0; z-index:50; background:rgba(10,10,10,.78); backdrop-filter:saturate(150%) blur(14px); -webkit-backdrop-filter:saturate(150%) blur(14px); border-bottom:1px solid color-mix(in srgb, var(--accent) 30%, transparent); }
.site-header::after{ content:""; position:absolute; left:0; right:0; bottom:-1px; height:1px; background:linear-gradient(90deg, transparent, var(--accent), transparent); opacity:.7; }
.site-header .brand{ display:flex; align-items:center; gap:.6rem; }
.site-header .brand-logo{ height:48px; width:auto; display:block; transition:transform .25s ease, filter .25s ease; filter:drop-shadow(0 4px 12px rgba(229,9,20,.25)); }
.site-header.scrolled .brand-logo{ height:40px; }
.site-header .brand:hover .brand-logo{ transform:scale(1.04); }
.site-header .site-nav a{ color:var(--ink); }
.site-header > .container{ display:flex; align-items:center; justify-content:space-between; padding-block:1.1rem; max-width:none; width:100%; padding-inline:clamp(1.1rem,3vw,2.5rem); }
.brand{ font-family:var(--font-display); font-weight:800; font-size:1.25rem; letter-spacing:-0.02em; }
.site-nav{ display:flex; gap:1.15rem; align-items:center; }
.site-nav a:not(.nav-cta){ font-weight:600; font-size:.78rem; color:var(--ink); opacity:.78; letter-spacing:.06em; text-transform:uppercase; position:relative; white-space:nowrap; }
@media (min-width:1100px){ .site-nav{ gap:1.4rem; } .site-nav a:not(.nav-cta){ font-size:.82rem; } }
.site-nav a:not(.nav-cta)::after{ content:""; position:absolute; left:0; right:0; bottom:-6px; height:2px; background:var(--accent); transform:scaleX(0); transform-origin:left; transition:transform .25s ease; }
.site-nav a:not(.nav-cta):hover::after,.site-nav a:not(.nav-cta)[aria-current="page"]::after{ transform:scaleX(1); }
.site-nav a:not(.nav-cta):hover,.site-nav a:not(.nav-cta)[aria-current="page"]{ opacity:1; color:var(--ink); }
.site-footer{ background:var(--surface); border-top:1px solid var(--border); padding-block:3rem 2rem; }

/* ---- Footer variants (preset-aware) ---- */
.site-footer .brand{ font-family:var(--font-display); font-weight:800; font-size:1.4rem; letter-spacing:-.02em; }
.footer-nav{ display:flex; flex-wrap:wrap; gap:1.4rem; }
.footer-nav a{ opacity:.8; font-size:.95rem; }
.footer-nav a:hover{ opacity:1; color:var(--accent); }
.foot-meta{ display:flex; flex-wrap:wrap; gap:1rem; color:var(--muted); font-size:.92rem; margin-top:.4rem; }
.footer-legal{ width:100%; color:var(--muted); font-size:.85rem; }

/* minimal */
.foot-minimal .container{ display:flex; align-items:center; gap:1.5rem; flex-wrap:wrap; }
.foot-minimal .footer-legal{ width:auto; margin-left:auto; }

/* columns */
.foot-columns .container{ display:grid; grid-template-columns:1.4fr 1fr; gap:2rem 3rem; }
.foot-columns .footer-nav{ flex-direction:column; gap:.55rem; }
.foot-columns .footer-legal{ border-top:1px solid var(--border); margin-top:1rem; padding-top:1.2rem; }

/* masthead */
.foot-masthead{ text-align:center; border-top:3px solid var(--ink); }
.foot-masthead .container{ display:flex; flex-direction:column; align-items:center; gap:1rem; }
.foot-masthead .brand{ font-size:2rem; }
.foot-masthead .footer-nav{ justify-content:center; }

/* bold-block — oversized band on deep black with red accent line */
.foot-bold{ background:#050505; border-top:0; color:var(--ink); padding-block:clamp(3rem,6vw,5rem) 2rem; position:relative; overflow:hidden; }
.foot-bold::before{ content:""; position:absolute; top:0; left:0; right:0; height:4px; background:linear-gradient(90deg, var(--accent-deep), var(--accent), var(--accent-deep)); }
.foot-bold::after{ content:""; position:absolute; bottom:-200px; right:-200px; width:500px; height:500px; background:radial-gradient(circle, var(--accent-glow) 0%, transparent 60%); opacity:.3; pointer-events:none; }
.foot-bold a,.foot-bold .foot-meta,.foot-bold .footer-legal{ color:var(--ink); }
.foot-bold a:hover{ color:var(--accent); }
.foot-bold .foot-shout{ display:flex; align-items:center; justify-content:space-between; gap:1.5rem; flex-wrap:wrap; margin-bottom:2rem; position:relative; z-index:2; }
.foot-bold .foot-shout .brand{ font-size:clamp(2rem,5vw,3.4rem); line-height:1; background:linear-gradient(180deg, #fff 0%, #888 100%); -webkit-background-clip:text; background-clip:text; -webkit-text-fill-color:transparent; }
.foot-bold .foot-row{ display:flex; justify-content:space-between; gap:2rem; flex-wrap:wrap; align-items:flex-start; position:relative; z-index:2; }
.foot-bold .footer-legal{ opacity:.55; border-top:1px solid color-mix(in srgb, var(--ink) 12%, transparent); margin-top:1.5rem; padding-top:1.2rem; position:relative; z-index:2; }
.foot-bold .btn{ background:var(--accent); color:#fff; border-color:var(--accent); }
.foot-bold .btn:hover{ background:var(--accent-soft); border-color:var(--accent-soft); }

/* newsletter */
.foot-newsletter .foot-cols{ display:grid; grid-template-columns:1.2fr 1fr 1.3fr; gap:2.5rem; }
.foot-newsletter .footer-nav{ flex-direction:column; gap:.55rem; }
.foot-signup label{ display:block; font-weight:600; margin-bottom:.6rem; }
.foot-signup .foot-field{ display:flex; gap:.5rem; }
.foot-signup input{ flex:1; min-width:0; padding:.7rem .9rem; border:1px solid var(--border); border-radius:var(--radius); background:var(--bg); color:var(--ink); font:inherit; }
.foot-newsletter .footer-legal{ border-top:1px solid var(--border); margin-top:1.8rem; padding-top:1.2rem; }

@media (max-width:760px){
  .foot-columns .container,.foot-newsletter .foot-cols{ grid-template-columns:1fr; }
}

/* ---- Mobile pop-out nav + animated hamburger + scroll-aware header ---- */
/* ---- header scroll state + nav CTA ---- */
.site-header{ transition:padding .2s ease, box-shadow .2s ease, background .2s ease; }
.site-header.scrolled{ box-shadow:0 10px 30px -20px color-mix(in srgb, var(--ink) 60%, transparent); }
.site-header.scrolled .container{ padding-block:.65rem; }
.nav-cta{ padding:.5rem 1.05rem !important; font-size:.9rem; }

/* ---- hamburger frame (open-state morph is per-kind) ---- */
.nav-toggle{ display:none; position:relative; width:30px; height:24px; padding:0; background:none; border:0; cursor:pointer; z-index:120; transition:transform .34s cubic-bezier(.16,1,.3,1); }
.nav-bars,.nav-bars::before,.nav-bars::after{ content:""; position:absolute; left:0; right:0; height:2.5px; background:var(--ink); border-radius:2px; transition:transform .3s ease, opacity .2s ease, background .2s ease, width .3s ease; }
.nav-bars{ top:50%; margin-top:-1px; }
.nav-bars::before{ top:-8px; }
.nav-bars::after{ top:8px; }

/* ---- scrim ---- */
.nav-scrim{ position:fixed; inset:0; z-index:90; background:rgba(0,0,0,.45); opacity:0; pointer-events:none; transition:opacity .3s ease; }
body.nav-open .nav-scrim{ opacity:1; pointer-events:auto; }
.nav-scrim[hidden]{ display:block; }
body.nav-open{ overflow:hidden; }
/* the drawer lives inside the sticky header (its own z:50 stacking context);
   lift that context above the root-level scrim (z:90) so links stay clickable */
body.nav-open .site-header{ z-index:100; }

/* ---- mobile nav: "right" drawer + matching hamburger morph ---- */
@media (max-width:1024px){
  .nav-toggle{ display:block; }
  .site-nav{ position:fixed; top:0; right:0; z-index:100; height:100dvh; width:min(82vw,340px);
    flex-direction:column; align-items:stretch; gap:0; justify-content:flex-start;
    padding:5.5rem 1.6rem 2rem; background:var(--bg); border-left:1px solid var(--border);
    box-shadow:-30px 0 60px -30px rgba(0,0,0,.5);
    transform:translateX(100%); transition:transform .34s cubic-bezier(.16,1,.3,1); overflow-y:auto; }
  body.nav-open .site-nav{ transform:translateX(0); }
  .site-nav a:not(.nav-cta){ font-size:1.15rem; padding:.9rem .2rem; border-bottom:1px solid var(--border); }
  .site-nav a:not(.nav-cta):last-of-type{ border-bottom:0; }
  .nav-cta{ margin-top:1.2rem; justify-content:center; }
}
body.nav-open .nav-bars{ background:transparent; }
body.nav-open .nav-bars::before{ transform:translateY(8px) rotate(45deg); }
body.nav-open .nav-bars::after{ transform:translateY(-8px) rotate(-45deg); }

/* The drawer is position:fixed but lives inside .site-header. If a header
   ancestor carries backdrop-filter / transform / filter (e.g. the blur & float
   glass headers), IT becomes the fixed containing block and the drawer's
   bottom:0 / inset:0 anchors to the header pill instead of the viewport —
   pushing the links off-screen. Neutralise those on the header ancestors at
   mobile so the drawer always resolves against the viewport. (Targets the
   header only — the full-screen overlay's own blur lives on .site-nav and is
   untouched.) */
@media (max-width:1024px){
  .site-header,.site-header .container{ -webkit-backdrop-filter:none !important; backdrop-filter:none !important; transform:none !important; filter:none !important; }
}

@media (prefers-reduced-motion: reduce){
  .site-nav{ transition:none; }
  .nav-toggle,.nav-bars,.nav-bars::before,.nav-bars::after{ transition:none; }
}

/* ---- Motion: scroll-reveal + ken-burns (per-preset flavor) ---- */
@media (prefers-reduced-motion: no-preference){
  [data-reveal]{ opacity:0; transform:translateY(var(--reveal-dy)) scale(var(--reveal-sc)); transition:opacity var(--reveal-dur) var(--reveal-ease), transform var(--reveal-dur) var(--reveal-ease); transition-delay:calc(var(--reveal-i,0) * var(--reveal-stag)); will-change:opacity,transform; }
  [data-reveal].is-visible{ opacity:1; transform:none; }
  .btn{ transition:transform .18s var(--reveal-ease), box-shadow .18s ease, opacity .15s ease; }
  
}

/* ---- Hero readability (HARD RULE) ----
   Any .hero with a background image MUST keep text readable. The overlay is
   baked in here so the model cannot ship an unreadable hero. The preset kit
   only changes the overlay's character, never removes it. */
.hero{ position:relative; isolation:isolate; color:#fff; padding-block:clamp(5rem,12vw,9rem); overflow:hidden; }
.hero.pp-hero{ min-height:0; }
.hero.pp-hero .pp-hero-inner{ position:relative; z-index:2; width:100%; }
.site-main > *{ max-width:none; }
.hero > *{ position:relative; z-index:2; }
.hero img.hero-bg{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; z-index:0; }
.hero::after{ content:""; position:absolute; inset:0; z-index:1; }
.hero h1, .hero p{ text-shadow:0 2px 18px rgba(0,0,0,.45); max-width:46ch; }
.hero .eyebrow{ color:#fff; opacity:.92; }
.hero::after{ background:linear-gradient(135deg, rgba(10,10,10,.92) 0%, rgba(10,10,10,.70) 50%, color-mix(in srgb, var(--accent-deep) 55%, rgba(10,10,10,.85)) 100%); mix-blend-mode:normal; }
.hero h1,.hero p{ text-shadow:0 2px 24px rgba(0,0,0,.6); color:#fff; }
.hero .eyebrow{ color:var(--accent); }
.hero .container{ text-align:left; } .hero h1,.hero p{ margin-inline:0; }

/* ---- Premium global flourishes ---- */
::selection{ background:var(--accent); color:#fff; }
html{ scrollbar-color:var(--accent) var(--bg); }
body{ background:var(--bg); background-image: radial-gradient(ellipse 80% 50% at 50% -10%, rgba(229,9,20,.12), transparent 60%); background-attachment:fixed; }

/* Smooth nav scroll offset so sticky header doesn't overlap anchored sections */
:target{ scroll-margin-top:90px; }

/* Subtle red underline accent on inline links inside content */
.site-main a:not(.btn):not(.brand):not([class*="-btn"]):not([class*="-link"]):not([class*="card"]):not(.faq-icon):hover{ color:var(--accent); }

/* ============================================================
   PRODUCTS — universal card used on Home (Fresh Counter) +
   Products catalog + Single product. Reusable, premium look.
============================================================ */
.pp-card{ position:relative; background:#141414; border:1px solid rgba(255,255,255,.08); overflow:visible; transition:transform .35s ease, border-color .3s ease, box-shadow .35s ease; }
.pp-card::before{ content:""; position:absolute; top:0; left:0; right:0; height:3px; background:linear-gradient(90deg, var(--accent-deep), var(--accent), var(--accent-soft)); transform:scaleX(0); transform-origin:left; transition:transform .4s ease; z-index:5; }
.pp-card:hover::before{ transform:scaleX(1); }
.pp-card:hover{ transform:translateY(-6px); border-color:rgba(229,9,20,.5); box-shadow:0 20px 60px -20px rgba(229,9,20,.4); }
.pp-card-link{ display:flex; flex-direction:column; height:100%; color:inherit; text-decoration:none; }
.pp-card-media{ position:relative; aspect-ratio:4/3; overflow:hidden; background:#0a0a0a; }
.pp-card-media::after{ content:""; position:absolute; inset:0; background:linear-gradient(to top, rgba(10,10,10,.55), transparent 50%); pointer-events:none; z-index:1; }
.pp-card-media img{ width:100%; height:100%; object-fit:cover; display:block; transition:transform .6s ease; }
.pp-card:hover .pp-card-media img{ transform:scale(1.06); }
.pp-card-badge{ position:absolute; top:1rem; left:1rem; background:var(--accent); color:#fff; font-family:var(--font-display); font-size:.62rem; font-weight:700; letter-spacing:.2em; text-transform:uppercase; padding:.4rem .8rem; z-index:3; box-shadow:0 6px 20px rgba(229,9,20,.45); }
.pp-card-badge-feat{ background:#fff; color:#0a0a0a; }
.pp-card-cat{ position:absolute; bottom:1rem; left:1rem; background:rgba(0,0,0,.7); backdrop-filter:blur(8px); -webkit-backdrop-filter:blur(8px); color:#fff; font-family:var(--font-display); font-size:.62rem; font-weight:700; letter-spacing:.18em; text-transform:uppercase; padding:.35rem .7rem; z-index:3; border:1px solid rgba(255,255,255,.15); }
.pp-card-body{ padding:1.5rem 1.6rem 1.8rem; display:flex; flex-direction:column; flex:1; }
.pp-card-name{ font-family:var(--font-display); font-size:1.35rem; font-weight:900; letter-spacing:-.02em; text-transform:uppercase; color:#F5F5F5; margin:0 0 .55rem; line-height:1.1; }
.pp-card-desc{ font-family:var(--font-body); font-size:.88rem; color:#F5F5F5; opacity:.68; line-height:1.6; margin:0 0 auto; padding-bottom:1.3rem; }
.pp-card-foot{ display:flex; align-items:center; justify-content:space-between; gap:1rem; border-top:1px solid rgba(255,255,255,.08); padding-top:1.1rem; }
.pp-card-price-wrap{ display:flex; flex-direction:column; }
.pp-card-price{ font-family:var(--font-display); font-size:1.5rem; font-weight:900; color:var(--accent); letter-spacing:-.02em; text-shadow:0 0 18px rgba(229,9,20,.3); line-height:1; }
.pp-card-unit{ font-size:.66rem; font-weight:600; color:#F5F5F5; opacity:.5; letter-spacing:.14em; text-transform:uppercase; margin-top:4px; }
.pp-card-cta{ font-family:var(--font-display); font-size:.72rem; font-weight:700; letter-spacing:.16em; text-transform:uppercase; color:var(--accent); display:inline-flex; align-items:center; gap:.4rem; }
.pp-card-cta span{ transition:transform .25s ease; display:inline-block; }
.pp-card:hover .pp-card-cta span{ transform:translateX(4px); }
.pp-card-origin{ font-family:var(--font-body); font-size:.7rem; color:#fff; opacity:.45; margin-top:.7rem; letter-spacing:.06em; }

/* ============================================================
   FRESH COUNTER (home page block) — high-impact showcase.
============================================================ */
.fc-section{ position:relative; padding:clamp(4rem,8vw,7rem) 0; background:linear-gradient(180deg, #0a0a0a 0%, #050505 100%); overflow:hidden; border-top:1px solid rgba(229,9,20,.25); border-bottom:1px solid rgba(229,9,20,.25); }
.fc-section::before{ content:""; position:absolute; top:0; left:0; right:0; height:2px; background:linear-gradient(90deg, transparent, var(--accent), transparent); box-shadow:0 0 25px var(--accent-glow); }
.fc-section::after{ content:""; position:absolute; left:50%; top:50%; transform:translate(-50%,-50%); width:1200px; height:1200px; max-width:120%; background:radial-gradient(circle, rgba(229,9,20,.12) 0%, transparent 60%); pointer-events:none; }
.fc-inner{ max-width:var(--maxw); margin-inline:auto; padding-inline:clamp(1.1rem,4vw,2.5rem); position:relative; z-index:2; }
.fc-head{ display:flex; justify-content:space-between; align-items:flex-end; flex-wrap:wrap; gap:2rem; margin-bottom:3rem; }
.fc-head-left{ max-width:680px; }
.fc-eyebrow{ display:inline-flex; align-items:center; gap:.55rem; font-family:var(--font-display); font-size:.72rem; font-weight:700; letter-spacing:.24em; text-transform:uppercase; color:var(--accent); margin-bottom:1.1rem; }
.fc-eyebrow::before{ content:""; display:inline-block; width:10px; height:10px; border-radius:50%; background:var(--accent); box-shadow:0 0 12px var(--accent), 0 0 24px var(--accent-glow); animation:fcPulse 1.8s ease-in-out infinite; }
@keyframes fcPulse{ 0%,100%{ opacity:1; transform:scale(1); } 50%{ opacity:.55; transform:scale(.85); } }
.fc-h2{ font-family:var(--font-display); font-size:clamp(2.6rem, 6vw, 5rem); font-weight:900; letter-spacing:-.04em; text-transform:uppercase; line-height:.95; color:#fff; margin:0 0 1.1rem; }
.fc-h2 span{ background:linear-gradient(180deg, var(--accent-soft) 0%, var(--accent-deep) 100%); -webkit-background-clip:text; background-clip:text; -webkit-text-fill-color:transparent; }
.fc-sub{ font-family:var(--font-body); font-size:1.02rem; color:#F5F5F5; opacity:.7; line-height:1.65; margin:0; }
.fc-meta{ display:flex; align-items:center; gap:.7rem; font-family:var(--font-display); font-size:.7rem; font-weight:700; letter-spacing:.18em; text-transform:uppercase; color:#fff; opacity:.7; border:1px solid rgba(255,255,255,.18); padding:.7rem 1.1rem; }
.fc-meta-dot{ width:8px; height:8px; background:var(--accent); border-radius:50%; box-shadow:0 0 10px var(--accent); }
.fc-grid{ display:grid; grid-template-columns:repeat(4, 1fr); gap:1.25rem; }
.fc-cta-row{ margin-top:2.5rem; display:flex; justify-content:center; gap:1rem; flex-wrap:wrap; }
@media (max-width:1024px){ .fc-grid{ grid-template-columns:repeat(2, 1fr); } }
@media (max-width:560px){ .fc-grid{ grid-template-columns:1fr; } .fc-head{ flex-direction:column; align-items:flex-start; } }

/* ============================================================
   CATALOG (Products page) — taxonomy filter + responsive grid.
============================================================ */
.cat-section{ background:var(--bg); padding:clamp(3.5rem,7vw,6rem) 0; border-bottom:1px solid var(--border); position:relative; }
.cat-inner{ max-width:var(--maxw); margin-inline:auto; padding-inline:clamp(1.1rem,4vw,2.5rem); }
.cat-head{ margin-bottom:2.5rem; }
.cat-head h2{ font-family:var(--font-display); font-size:clamp(2.2rem,5vw,3.6rem); font-weight:900; letter-spacing:-.035em; text-transform:uppercase; color:#fff; margin:0 0 .7rem; line-height:1; }
.cat-head h2 span{ color:var(--accent); }
.cat-head p{ font-family:var(--font-body); font-size:.98rem; color:#F5F5F5; opacity:.65; max-width:54ch; margin:0; line-height:1.6; }
.cat-filter{ display:flex; flex-wrap:wrap; gap:.55rem; margin-bottom:2.5rem; padding-bottom:1.5rem; border-bottom:1px solid var(--border); }
.cat-filter button{ font-family:var(--font-display); font-size:.72rem; font-weight:700; letter-spacing:.16em; text-transform:uppercase; color:#fff; background:transparent; border:1px solid rgba(255,255,255,.18); padding:.65rem 1.15rem; cursor:pointer; transition:all .22s ease; }
.cat-filter button:hover{ border-color:var(--accent); color:var(--accent); }
.cat-filter button.is-active{ background:var(--accent); border-color:var(--accent); color:#fff; box-shadow:0 8px 24px -6px var(--accent-glow); }
.cat-grid{ display:grid; grid-template-columns:repeat(3, 1fr); gap:1.5rem; }
@media (max-width:1000px){ .cat-grid{ grid-template-columns:repeat(2,1fr); } }
@media (max-width:560px){ .cat-grid{ grid-template-columns:1fr; } }
.cat-empty{ grid-column:1 / -1; padding:4rem 1rem; text-align:center; color:#fff; opacity:.5; font-family:var(--font-body); }
.pp-card.is-hidden{ display:none; }

/* ============================================================
   SINGLE product layout
============================================================ */
.sp-wrap{ background:var(--bg); padding:clamp(3rem,7vw,6rem) 0; }
.sp-inner{ max-width:var(--maxw); margin-inline:auto; padding-inline:clamp(1.1rem,4vw,2.5rem); display:grid; grid-template-columns:1.05fr 1fr; gap:clamp(2rem,5vw,4rem); align-items:start; }
.sp-media{ position:relative; overflow:hidden; border:1px solid rgba(255,255,255,.08); aspect-ratio:4/5; }
.sp-media img{ width:100%; height:100%; object-fit:cover; }
.sp-back{ display:inline-flex; align-items:center; gap:.5rem; font-family:var(--font-display); font-size:.72rem; font-weight:700; letter-spacing:.18em; text-transform:uppercase; color:var(--accent); margin-bottom:1.4rem; text-decoration:none; }
.sp-back:hover{ color:#fff; }
.sp-cat{ display:inline-block; font-family:var(--font-display); font-size:.65rem; font-weight:700; letter-spacing:.22em; text-transform:uppercase; color:#fff; background:var(--accent); padding:.35rem .8rem; margin-bottom:1.2rem; }
.sp-h1{ font-family:var(--font-display); font-size:clamp(2.4rem,5vw,4rem); font-weight:900; letter-spacing:-.035em; text-transform:uppercase; line-height:.98; color:#fff; margin:0 0 1.2rem; }
.sp-price{ font-family:var(--font-display); font-size:clamp(2rem,3.5vw,2.8rem); font-weight:900; color:var(--accent); letter-spacing:-.02em; text-shadow:0 0 22px rgba(229,9,20,.3); display:flex; align-items:baseline; gap:.7rem; margin-bottom:1.6rem; }
.sp-price small{ font-size:.72rem; font-weight:600; color:#fff; opacity:.55; letter-spacing:.14em; text-transform:uppercase; }
.sp-desc{ font-family:var(--font-body); font-size:1rem; color:#F5F5F5; opacity:.78; line-height:1.75; margin:0 0 1.8rem; }
.sp-specs{ display:grid; grid-template-columns:repeat(2,1fr); gap:0; border:1px solid var(--border); margin-bottom:1.8rem; }
.sp-spec{ padding:1rem 1.2rem; border-right:1px solid var(--border); border-bottom:1px solid var(--border); }
.sp-spec:nth-child(2n){ border-right:none; }
.sp-spec:nth-last-child(-n+2){ border-bottom:none; }
.sp-spec dt{ font-family:var(--font-display); font-size:.62rem; font-weight:700; letter-spacing:.2em; text-transform:uppercase; color:var(--accent); margin-bottom:.3rem; }
.sp-spec dd{ font-family:var(--font-body); font-size:.95rem; color:#fff; margin:0; font-weight:600; }
.sp-cta-row{ display:flex; gap:.8rem; flex-wrap:wrap; }
@media (max-width:820px){ .sp-inner{ grid-template-columns:1fr; } .sp-media{ aspect-ratio:4/3; } }

/* ---- Fresh Counter: shop-by-cut chip grid ---- */
.fc-cats{ margin-top:3.5rem; padding-top:2.5rem; border-top:1px solid rgba(255,255,255,.08); }
.fc-cats-label{ display:block; font-family:var(--font-display); font-size:.7rem; font-weight:700; letter-spacing:.24em; text-transform:uppercase; color:#fff; opacity:.5; margin-bottom:1.2rem; text-align:center; }
.fc-cats-grid{ display:flex; flex-wrap:wrap; justify-content:center; gap:.6rem; }
.fc-cat-chip{ display:inline-flex; align-items:center; gap:.6rem; font-family:var(--font-display); font-size:.8rem; font-weight:700; letter-spacing:.06em; text-transform:uppercase; color:#fff; background:rgba(255,255,255,.04); border:1px solid rgba(255,255,255,.12); padding:.7rem 1.15rem; text-decoration:none; transition:all .25s ease; }
.fc-cat-chip:hover{ background:var(--accent); border-color:var(--accent); color:#fff; transform:translateY(-2px); box-shadow:0 10px 25px -6px var(--accent-glow); }
.fc-cat-chip-count{ display:inline-flex; align-items:center; justify-content:center; min-width:22px; height:22px; padding:0 6px; border-radius:11px; background:rgba(255,255,255,.1); font-size:.62rem; font-weight:800; color:#fff; }
.fc-cat-chip:hover .fc-cat-chip-count{ background:rgba(0,0,0,.25); }

/* ============================================================
   FULL-WIDTH HEADER / FOOTER — edge-to-edge chrome
============================================================ */
.site-header,
.site-footer{ width:100%; }
.site-header > .container,
.site-footer > .container,
.foot-bold > .container{
  max-width:none !important;
  width:100% !important;
  padding-inline:clamp(1.1rem, 3vw, 2.5rem) !important;
}

/* footer inner layout reflows to use the new width */
.foot-bold .foot-row{ align-items:flex-start; }
.foot-bold .footer-nav{ flex:1; min-width:0; }
.foot-bold .foot-meta{ margin-left:auto; flex-direction:row; gap:1.5rem; }

/* ============================================================
   MOBILE — full-width chrome friendly, larger tap targets,
   logo scales down nicely, drawer above viewport.
============================================================ */
@media (max-width:1024px){
  .site-header > .container{ padding-block:.85rem; padding-inline:1rem !important; }
  .site-header .brand-logo{ height:42px; }
  .site-header.scrolled .brand-logo{ height:36px; }
  .nav-toggle{ width:34px; height:28px; }
  .nav-bars,.nav-bars::before,.nav-bars::after{ height:3px; }
}
@media (max-width:1024px){
  /* drawer: cleaner spacing, bigger taps */
  .site-nav{ padding:5.2rem 1.5rem 2rem; gap:.25rem; background:#080808; }
  .site-nav::before{ content:""; position:absolute; top:0; left:0; right:0; height:64px; background:rgba(10,10,10,.92); backdrop-filter:blur(12px); -webkit-backdrop-filter:blur(12px); border-bottom:1px solid rgba(229,9,20,.25); z-index:-1; }
  .site-nav a:not(.nav-cta){ font-size:1rem; padding:1rem .25rem; border-bottom:1px solid rgba(255,255,255,.06); letter-spacing:.06em; opacity:.92; }
  .site-nav a:not(.nav-cta)::after{ display:none; }
  .site-nav a:not(.nav-cta):hover,
  .site-nav a:not(.nav-cta)[aria-current="page"]{ color:var(--accent); }
  .site-nav .nav-cta{ margin-top:1.2rem; justify-content:center; padding:.95rem 1.5rem !important; font-size:.85rem !important; }
}
@media (max-width:640px){
  .site-header > .container{ padding-block:.75rem; padding-inline:.9rem !important; }
  .site-header .brand-logo{ height:38px; }
  .foot-bold .foot-row{ flex-direction:column; gap:1.25rem; }
  .foot-bold .foot-meta{ margin-left:0; flex-wrap:wrap; }
  .foot-bold .foot-shout{ flex-direction:column; align-items:flex-start; gap:1.2rem; }
  .foot-bold .foot-shout .brand{ font-size:clamp(1.6rem,8vw,2.4rem); }
  .footer-nav{ flex-direction:column; gap:.85rem; }
}

/* ============================================================
   ESCAPE Hello Elementor's outer wrapper — kill white edges,
   force chrome to span the full viewport.
============================================================ */
html, body{ background:var(--bg) !important; }
.page, #page, .site, body > .elementor, .site-content, main.site-main, .hello-elementor-default, .ehp-header{ background:var(--bg); }
.site-header,
.site-footer{
  position:relative;
  width:100vw;
  margin-left:calc(50% - 50vw) !important;
  margin-right:calc(50% - 50vw) !important;
  max-width:100vw;
  left:0; right:0;
}
.site-header{ position:sticky; }
/* Hello Elementor theme.css caps `.site-main` at 1140px (800px tablet) on ANY
   page whose body lacks `elementor-page-*`. Home / About / Catering are WP
   Pages built in Elementor so they escape; the products CPT archive is our
   PHP template and was boxed into a narrow column with black side gutters. */
body:not([class*="elementor-page-"]) .site-main,
.products-page{
  max-width:none !important;
  width:100% !important;
  padding-inline:0 !important;
  margin-inline:0 !important;
}
/* Full-bleed band sections on shop pages */
.products-page > .hero,
.products-page > .pp-marquee,
.products-page > .pp-tiles-section,
.products-page > .cat-section,
.products-page > .pp-cta{
  width:100%;
  max-width:none;
}
.hero.pp-hero{
  padding-top:calc(var(--header-h, 72px) + clamp(2.5rem, 6vw, 4rem));
  padding-bottom:clamp(2.5rem, 5vw, 4rem);
}

/* Kill parent theme default backgrounds that leak through */
.elementor-section-wrap > .elementor-section.elementor-section-default,
.elementor-section.elementor-section-default{ background-color:transparent; }

/* ============================================================
   PAGE SHELL — reusable premium hero + sections for the new
   PHP page templates (About, Fresh Meats, Deli, Freezer,
   Grocery, Catering). Cohesive with the home page.
============================================================ */
.ps-page{ background:var(--bg); color:var(--ink); }
.ps-hero{ position:relative; min-height:74vh; display:flex; align-items:flex-end; overflow:hidden; border-bottom:1px solid rgba(229,9,20,.3); }
.ps-hero-bg{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; z-index:0; }
.ps-hero::before{ content:""; position:absolute; inset:0; background:radial-gradient(ellipse 70% 60% at 20% 80%, rgba(229,9,20,.35) 0%, transparent 60%), linear-gradient(to top, rgba(0,0,0,.94) 0%, rgba(0,0,0,.55) 55%, rgba(0,0,0,.25) 100%); z-index:1; }
.ps-hero::after{ content:""; position:absolute; left:0; right:0; bottom:0; height:2px; background:linear-gradient(90deg, transparent, var(--accent), transparent); box-shadow:0 0 30px var(--accent-glow); z-index:2; }
.ps-hero-inner{ position:relative; z-index:3; width:100%; padding-block:clamp(4rem,9vw,7rem); }
.ps-hero-inner .container{ max-width:1280px; }
.ps-eyebrow{ display:inline-flex; align-items:center; gap:.55rem; font-family:var(--font-display); font-size:.72rem; font-weight:700; letter-spacing:.24em; text-transform:uppercase; color:var(--accent); border:1px solid var(--accent); padding:.35rem .9rem; margin-bottom:1.6rem; background:rgba(0,0,0,.5); backdrop-filter:blur(6px); -webkit-backdrop-filter:blur(6px); }
.ps-h1{ font-family:var(--font-display); font-size:clamp(3.2rem,9vw,8rem); font-weight:900; line-height:.92; letter-spacing:-.04em; text-transform:uppercase; color:#fff; margin:0 0 1.4rem; max-width:18ch; }
.ps-h1 span{ display:block; background:linear-gradient(180deg, var(--accent-soft) 0%, var(--accent-deep) 100%); -webkit-background-clip:text; background-clip:text; -webkit-text-fill-color:transparent; }
.ps-hero-sub{ font-family:var(--font-body); font-size:clamp(1rem,1.4vw,1.15rem); color:#fff; opacity:.82; max-width:54ch; line-height:1.65; margin:0 0 2.2rem; }
.ps-cta-row{ display:flex; gap:.8rem; flex-wrap:wrap; }

/* Section primitives */
.ps-section{ padding-block:clamp(3.5rem,7vw,6rem); position:relative; overflow:hidden; }
.ps-section + .ps-section{ border-top:1px solid var(--border); }
.ps-section .container{ max-width:1280px; }
.ps-section-head{ display:flex; justify-content:space-between; align-items:flex-end; flex-wrap:wrap; gap:2rem; margin-bottom:3rem; }
.ps-section-head .ps-eyebrow{ background:transparent; border:none; padding:0; margin-bottom:.6rem; }
.ps-h2{ font-family:var(--font-display); font-size:clamp(2.2rem,5vw,4rem); font-weight:900; letter-spacing:-.035em; text-transform:uppercase; color:#fff; margin:0; line-height:.95; }
.ps-h2 span{ color:var(--accent); text-shadow:0 0 24px rgba(229,9,20,.35); }
.ps-h3{ font-family:var(--font-display); font-size:clamp(1.2rem,2vw,1.55rem); font-weight:900; letter-spacing:-.01em; text-transform:uppercase; color:#fff; margin:0 0 .65rem; line-height:1.15; }
.ps-section-sub{ font-family:var(--font-body); font-size:1rem; color:#fff; opacity:.65; max-width:48ch; margin:0; line-height:1.65; }

.ps-section-dark{ background:#050505; }
.ps-section-surface{ background:var(--surface); }
.ps-section-glow::before{ content:""; position:absolute; top:0; left:0; right:0; height:2px; background:linear-gradient(90deg, transparent, var(--accent), transparent); box-shadow:0 0 25px var(--accent-glow); }

/* Feature grid */
.ps-grid{ display:grid; gap:1.5rem; }
.ps-grid-3{ grid-template-columns:repeat(3, 1fr); }
.ps-grid-2{ grid-template-columns:repeat(2, 1fr); }
.ps-grid-4{ grid-template-columns:repeat(4, 1fr); }
@media (max-width:1000px){ .ps-grid-3{ grid-template-columns:repeat(2,1fr); } .ps-grid-4{ grid-template-columns:repeat(2,1fr); } }
@media (max-width:640px){ .ps-grid-2,.ps-grid-3,.ps-grid-4{ grid-template-columns:1fr; } }

.ps-card{ background:var(--surface); border:1px solid rgba(255,255,255,.08); padding:2rem 1.8rem; transition:transform .3s ease, border-color .3s ease, box-shadow .3s ease; position:relative; overflow:hidden; }
.ps-card::before{ content:""; position:absolute; top:0; left:0; right:0; height:3px; background:var(--accent); transform:scaleX(0); transform-origin:left; transition:transform .35s ease; }
.ps-card:hover::before{ transform:scaleX(1); }
.ps-card:hover{ transform:translateY(-4px); border-color:rgba(229,9,20,.4); box-shadow:0 18px 50px -20px rgba(229,9,20,.3); }
.ps-card-num{ display:inline-block; font-family:var(--font-display); font-size:.62rem; font-weight:700; letter-spacing:.22em; color:var(--accent); margin-bottom:1.2rem; }
.ps-card p{ font-family:var(--font-body); font-size:.92rem; color:#fff; opacity:.68; line-height:1.65; margin:0; }

.ps-card-img{ background:#0a0a0a; border:1px solid rgba(255,255,255,.08); overflow:hidden; display:flex; flex-direction:column; transition:transform .3s ease, border-color .3s ease, box-shadow .3s ease; position:relative; }
.ps-card-img::before{ content:""; position:absolute; top:0; left:0; right:0; height:3px; background:linear-gradient(90deg, var(--accent-deep), var(--accent), var(--accent-soft)); transform:scaleX(0); transform-origin:left; transition:transform .35s ease; z-index:3; }
.ps-card-img:hover::before{ transform:scaleX(1); }
.ps-card-img:hover{ transform:translateY(-5px); border-color:rgba(229,9,20,.45); box-shadow:0 18px 50px -18px rgba(229,9,20,.35); }
.ps-card-img-media{ position:relative; aspect-ratio:4/3; overflow:hidden; }
.ps-card-img-media::after{ content:""; position:absolute; inset:0; background:linear-gradient(to top, rgba(10,10,10,.6), transparent 50%); pointer-events:none; z-index:1; }
.ps-card-img-media img{ width:100%; height:100%; object-fit:cover; transition:transform .55s ease; }
.ps-card-img:hover .ps-card-img-media img{ transform:scale(1.06); }
.ps-card-img-tag{ position:absolute; top:1rem; left:1rem; background:var(--accent); color:#fff; font-family:var(--font-display); font-size:.62rem; font-weight:700; letter-spacing:.2em; text-transform:uppercase; padding:.35rem .8rem; z-index:2; box-shadow:0 6px 18px rgba(229,9,20,.45); }
.ps-card-img-body{ padding:1.4rem 1.6rem 1.8rem; flex:1; display:flex; flex-direction:column; }
.ps-card-img-body p{ font-family:var(--font-body); font-size:.88rem; color:#fff; opacity:.68; line-height:1.65; margin:0; }

/* Stat strip */
.ps-stats{ display:grid; grid-template-columns:repeat(4, 1fr); border:1px solid var(--border); background:rgba(0,0,0,.35); }
.ps-stat{ padding:1.7rem 1.4rem; border-right:1px solid var(--border); }
.ps-stat:last-child{ border-right:none; }
.ps-stat-num{ font-family:var(--font-display); font-size:clamp(1.8rem,3.2vw,2.6rem); font-weight:900; color:var(--accent); letter-spacing:-.02em; line-height:1; text-shadow:0 0 22px rgba(229,9,20,.35); display:block; }
.ps-stat-label{ font-family:var(--font-display); font-size:.62rem; font-weight:600; letter-spacing:.22em; text-transform:uppercase; color:#fff; opacity:.55; margin-top:.5rem; display:block; }
@media (max-width:760px){ .ps-stats{ grid-template-columns:repeat(2,1fr); } .ps-stat{ border-right:1px solid var(--border); } .ps-stat:nth-child(2n){ border-right:none; } .ps-stat:nth-child(-n+2){ border-bottom:1px solid var(--border); } }

/* Split panel (image + text) */
.ps-split{ display:grid; grid-template-columns:1fr 1fr; gap:0; border:1px solid var(--border); align-items:stretch; }
.ps-split-media{ position:relative; min-height:420px; overflow:hidden; border-right:1px solid var(--border); }
.ps-split-media img{ width:100%; height:100%; object-fit:cover; transition:transform .8s ease; }
.ps-split:hover .ps-split-media img{ transform:scale(1.04); }
.ps-split-tag{ position:absolute; bottom:0; left:0; background:var(--accent); color:#fff; font-family:var(--font-display); font-size:.64rem; font-weight:700; letter-spacing:.2em; text-transform:uppercase; padding:.5rem 1rem; }
.ps-split-body{ padding:clamp(2rem,4vw,3.5rem); display:flex; flex-direction:column; justify-content:center; background:var(--surface); }
.ps-split-body p{ font-family:var(--font-body); font-size:.97rem; color:#fff; opacity:.78; line-height:1.75; margin:0 0 1rem; }
.ps-split-body .ps-eyebrow{ border:none; padding:0; background:transparent; margin-bottom:.8rem; }
.ps-split-pull{ font-family:var(--font-display); font-size:1.1rem; font-weight:700; color:var(--accent); border-left:4px solid var(--accent); padding-left:1rem; margin:1.5rem 0; line-height:1.4; box-shadow:-2px 0 30px var(--accent-glow); }
@media (max-width:900px){ .ps-split{ grid-template-columns:1fr; } .ps-split-media{ min-height:280px; border-right:none; border-bottom:1px solid var(--border); } }

/* CTA banner */
.ps-cta{ position:relative; overflow:hidden; padding:clamp(4rem,8vw,6rem) 0; border-top:1px solid rgba(229,9,20,.3); }
.ps-cta-bg{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; opacity:.18; }
.ps-cta::before{ content:""; position:absolute; inset:0; background:radial-gradient(ellipse 70% 50% at 80% 20%, rgba(229,9,20,.18), transparent 60%); z-index:1; }
.ps-cta-inner{ position:relative; z-index:2; text-align:center; max-width:700px; margin:0 auto; padding-inline:1.5rem; }
.ps-cta h2{ font-family:var(--font-display); font-size:clamp(2.4rem,6vw,4.8rem); font-weight:900; letter-spacing:-.04em; text-transform:uppercase; color:#fff; line-height:.95; margin:.8rem 0 1.1rem; }
.ps-cta h2 span{ color:var(--accent); }
.ps-cta p{ font-family:var(--font-body); font-size:1.02rem; color:#fff; opacity:.72; line-height:1.65; margin:0 auto 2rem; max-width:48ch; }
.ps-cta-row{ display:flex; gap:.8rem; justify-content:center; flex-wrap:wrap; }

/* Marquee strip — reusable across pages */
.ps-marquee{ background:var(--accent); padding:.7rem 0; overflow:hidden; white-space:nowrap; border-top:1px solid #0a0a0a; border-bottom:1px solid #0a0a0a; box-shadow:0 0 40px rgba(229,9,20,.35); position:relative; z-index:1; }
.ps-marquee-track{ display:inline-flex; animation:ps-mar 28s linear infinite; }
.ps-marquee-item{ font-family:var(--font-display); font-size:.78rem; font-weight:700; letter-spacing:.2em; text-transform:uppercase; color:#fff; padding:0 2rem; }
.ps-marquee-dot{ display:inline-block; width:5px; height:5px; background:#fff; opacity:.6; align-self:center; }
@keyframes ps-mar{ from{ transform:translateX(0); } to{ transform:translateX(-50%); } }

/* Inquiry form (catering) */
.ps-form{ display:grid; grid-template-columns:1.05fr 1fr; gap:0; border:1px solid rgba(229,9,20,.3); }
.ps-form-left{ background:linear-gradient(135deg, var(--accent-deep), var(--accent)); padding:clamp(2rem,4vw,3.5rem); display:flex; flex-direction:column; justify-content:space-between; border-right:1px solid rgba(0,0,0,.3); position:relative; overflow:hidden; }
.ps-form-left::before{ content:""; position:absolute; top:-50%; left:-50%; width:200%; height:200%; background:radial-gradient(circle at 30% 30%, rgba(255,255,255,.08) 0%, transparent 40%); pointer-events:none; }
.ps-form-left-h2{ font-family:var(--font-display); font-size:clamp(1.8rem,3.5vw,2.8rem); font-weight:900; text-transform:uppercase; letter-spacing:-.03em; color:#fff; line-height:1.05; margin:0 0 1rem; position:relative; }
.ps-form-left p{ font-family:var(--font-body); color:#fff; opacity:.92; line-height:1.65; position:relative; margin:0 0 1.4rem; }
.ps-form-services{ display:flex; flex-wrap:wrap; gap:.45rem; position:relative; margin-top:1.5rem; }
.ps-form-services span{ font-family:var(--font-display); font-size:.66rem; font-weight:700; letter-spacing:.16em; text-transform:uppercase; background:rgba(0,0,0,.35); color:#fff; padding:.35rem .75rem; border:1px solid rgba(255,255,255,.2); }
.ps-form-right{ background:var(--surface); padding:clamp(2rem,4vw,3rem); }
.ps-form-group{ margin-bottom:1.3rem; }
.ps-form-group label{ font-family:var(--font-display); font-size:.68rem; font-weight:700; letter-spacing:.18em; text-transform:uppercase; color:var(--accent); display:block; margin-bottom:.5rem; }
.ps-form-group input,
.ps-form-group select,
.ps-form-group textarea{ width:100%; background:#0a0a0a; border:1px solid rgba(255,255,255,.12); color:#fff; font-family:var(--font-body); font-size:.95rem; padding:.85rem 1rem; outline:none; transition:border-color .15s, box-shadow .2s; }
.ps-form-group input:focus,
.ps-form-group select:focus,
.ps-form-group textarea:focus{ border-color:var(--accent); box-shadow:0 0 0 3px rgba(229,9,20,.18); }
.ps-form-group textarea{ resize:vertical; min-height:120px; }
.ps-form-row{ display:grid; grid-template-columns:1fr 1fr; gap:1rem; }
.ps-form-submit{ font-family:var(--font-display); font-size:.85rem; font-weight:700; letter-spacing:.14em; text-transform:uppercase; background:var(--accent); color:#fff; border:2px solid var(--accent); padding:1rem 2.6rem; cursor:pointer; margin-top:.5rem; transition:all .2s ease; }
.ps-form-submit:hover{ background:var(--accent-soft); border-color:var(--accent-soft); transform:translateY(-2px); box-shadow:0 12px 30px -6px rgba(229,9,20,.55); }
.ps-form-note{ font-family:var(--font-body); font-size:.78rem; color:#fff; opacity:.5; margin-top:.8rem; }
@media (max-width:900px){ .ps-form{ grid-template-columns:1fr; } .ps-form-left{ border-right:none; border-bottom:1px solid rgba(0,0,0,.3); } .ps-form-row{ grid-template-columns:1fr; } }

/* Contact strip */
.ps-contact{ display:grid; grid-template-columns:repeat(3,1fr); border:1px solid rgba(229,9,20,.3); background:rgba(0,0,0,.3); }
.ps-contact-cell{ padding:2rem 1.8rem; border-right:1px solid rgba(229,9,20,.2); }
.ps-contact-cell:last-child{ border-right:none; }
.ps-contact-label{ font-family:var(--font-display); font-size:.62rem; font-weight:700; letter-spacing:.22em; text-transform:uppercase; color:var(--accent); margin-bottom:.6rem; display:block; }
.ps-contact-value{ font-family:var(--font-display); font-size:1.1rem; font-weight:800; color:#fff; line-height:1.3; }
.ps-contact-value a{ color:#fff; }
.ps-contact-value a:hover{ color:var(--accent); }
.ps-contact-note{ font-family:var(--font-body); font-size:.78rem; color:#fff; opacity:.55; margin-top:.4rem; }
@media (max-width:800px){ .ps-contact{ grid-template-columns:1fr; } .ps-contact-cell{ border-right:none; border-bottom:1px solid rgba(229,9,20,.2); } .ps-contact-cell:last-child{ border-bottom:none; } }

/* ============================================================
   v4.1 — Responsive + contrast + word-break + footer fixes
============================================================ */

/* ---- Kill mid-word breaks like "Georgetow|n" ---- */
h1, h2, h3, h4, h5,
.home-intro-stat-value, .ps-stat-num,
.home-feature-title, .pp-tile-name,
.fc-cat-chip, .fc-cat-chip-name,
.home-intro-left h2, .home-features-header h2,
.home-cta h2, .home-testimonial-quote,
.fc-h2, .ps-h1, .ps-h2, .ps-h3, .ps-form-left-h2,
.sp-h1, .pp-card-name, .pp-hero-h1, .products-h1, .cat-head h2,
.foot-bold .brand{
  hyphens: manual;
  -webkit-hyphens: manual;
  overflow-wrap: normal;
  word-break: normal;
  white-space: normal;
}
/* Short cells (stats, tile labels) — only break if truly necessary */
.home-intro-stat-value,
.ps-stat-num,
.pp-tile-name,
.fc-cat-chip-name{
  overflow-wrap: anywhere;
}

/* ---- Chip contrast: force white text in all states ---- */
.fc-cat-chip,
.fc-cat-chip:link,
.fc-cat-chip:visited,
.fc-cat-chip:hover,
.fc-cat-chip:focus,
.fc-cat-chip:active,
.fc-cat-chip *,
.fc-cat-chip-name,
.fc-cat-chip-count{ color:#fff !important; }
.fc-cat-chip{ min-width:0; max-width:100%; }
.fc-cat-chip-name{ overflow:hidden; text-overflow:ellipsis; white-space:nowrap; max-width:14ch; }
.fc-cat-chip:hover .fc-cat-chip-count{ background:rgba(0,0,0,.25) !important; }

/* ---- Catalog filter buttons: same red-on-red guard ---- */
.cat-filter button.is-active,
.cat-filter button.is-active *{ color:#fff !important; }
.cat-filter button.is-active .cat-filter-count{ opacity:.85; }

/* ---- Home CTA buttons: red-on-red guard ---- */
.home-btn-primary,
.home-btn-primary:link,
.home-btn-primary:visited{ color:#fff !important; background:var(--accent) !important; border-color:var(--accent) !important; }
.home-btn-primary:hover{ background:var(--accent-soft) !important; border-color:var(--accent-soft) !important; color:#fff !important; }
.home-btn-ghost,
.home-btn-ghost:link,
.home-btn-ghost:visited{ color:#fff !important; border-color:#fff !important; }
.home-btn-ghost:hover{ background:var(--accent) !important; border-color:var(--accent) !important; color:#fff !important; }

/* ---- Footer: bulletproof. Stop any orphan red band before it. ---- */
.home-cta{ border-top:0 !important; }
.home-cta::before{ content:""; position:absolute; top:0; left:0; right:0; height:3px; background:linear-gradient(90deg, transparent, var(--accent), transparent); z-index:5; pointer-events:none; }
.foot-bold{ margin-top:0 !important; }
.foot-bold::before{ height:3px; }
.foot-bold::after{ z-index:0; }
.foot-bold > *{ position:relative; z-index:1; }
.foot-bold .brand{ word-break:keep-all; max-width:100%; line-height:1.05; }
/* prevent runaway radial that leaks to the right edge */
.foot-bold{ overflow:hidden; }
/* Footer nav: nicer wrap on narrow */
.foot-bold .footer-nav{ row-gap:.6rem; }

/* ---- Home intro stats — fit "Georgetown" cleanly ---- */
.home-intro-stat{ padding:1.2rem 1rem; min-width:0; }
.home-intro-stat-value{ font-size:clamp(1.05rem, 1.8vw, 1.45rem); line-height:1.15; }
.home-intro-stat-label{ font-size:.62rem; letter-spacing:.16em; }

/* ============================================================
   RESPONSIVE LAYOUT — make sure every breakpoint behaves
============================================================ */
@media (max-width:1024px){
  .home-intro-inner{ grid-template-columns:1fr !important; gap:2rem; }
  .home-intro-stat-row{ flex-direction:column; }
  .home-intro-stat{ border-right:none; border-bottom:1px solid var(--border); }
  .home-intro-stat:last-child{ border-bottom:none; }
  .home-feature-grid{ grid-template-columns:1fr !important; }
  .home-feature-card{ border-right:none; border-bottom:1px solid var(--border); }
  .home-feature-card:last-child{ border-bottom:none; }
  .home-testimonial-inner{ grid-template-columns:1fr !important; }
  .home-testimonial-left{ min-height:180px; padding:2rem 1.5rem; border-right:none; border-bottom:1px solid var(--border); }
  .home-cta-inner{ grid-template-columns:1fr !important; gap:1.5rem; }
  .home-cta-buttons{ flex-direction:row; min-width:0; }
  .home-features-header{ flex-direction:column; align-items:flex-start; }
  .home-features-header-sub{ max-width:100%; }
  .fc-head{ flex-direction:column; align-items:flex-start; }
  .fc-meta{ width:100%; justify-content:flex-start; }
}
@media (max-width:760px){
  .home-hero{ min-height:80vh; }
  .home-hero h1{ font-size:clamp(2.6rem, 11vw, 4.2rem); }
  .home-intro{ padding:3rem 1.25rem; }
  .home-features{ padding:3rem 1.25rem; }
  .home-cta-content{ padding:3rem 1.25rem; }
  .home-cta-buttons{ flex-direction:column; min-width:0; }
  .home-testimonial-bigmark{ font-size:7rem; }
  .fc-cats-grid{ gap:.4rem; }
  .fc-cat-chip{ font-size:.68rem; padding:.55rem .8rem; gap:.45rem; }
  .fc-cat-chip-name{ max-width:11ch; }
  .pp-tiles{ grid-template-columns:repeat(2, 1fr) !important; }
  .pp-tile-name{ font-size:.85rem; }
  .pp-hero-meta{ flex-direction:column; max-width:100%; }
  .pp-hero-meta > div{ border-right:none; border-bottom:1px solid rgba(255,255,255,.12); }
  .pp-hero-meta > div:last-child{ border-bottom:none; }
  .cat-filter{ overflow-x:auto; flex-wrap:nowrap; padding-bottom:1rem; }
  .cat-filter button{ flex-shrink:0; }
  .ps-grid-3, .ps-grid-4{ grid-template-columns:1fr !important; }
  .ps-section-head{ flex-direction:column; align-items:flex-start; }
}
@media (max-width:480px){
  .home-hero h1{ font-size:clamp(2.4rem, 13vw, 3.8rem); }
  .fc-cat-chip{ flex:1 1 calc(50% - .4rem); justify-content:space-between; max-width:none; }
  .fc-cat-chip-name{ max-width:none; flex:1; }
  .home-cta{ min-height:auto; }
  .foot-bold .foot-shout .brand{ font-size:clamp(1.4rem, 7vw, 2rem); }
  .pp-tiles{ grid-template-columns:1fr !important; }
  .home-feature-img, .home-feature-card:first-child .home-feature-img{ aspect-ratio:16/9; }
}

/* ---- Header tighter on narrowest screens ---- */
@media (max-width:640px){
  .site-header > .container{ padding-block:.7rem; padding-inline:.85rem !important; }
  .site-header .brand-logo{ height:36px; }
}

/* ============================================================
   v4.2 — BULLETPROOF header + footer using dedicated classes
   (Hello Elementor / Elementor Pro can override `.container`
   styles, so we use `.pd-header-bar` and `.pd-footer-inner`
   which they don't touch.)
============================================================ */

/* HEADER — full width band, flex layout that always behaves */
.pd-header{
  position:sticky !important;
  top:0;
  z-index:50;
  width:100% !important;
  margin:0 !important;
  background:rgba(10,10,10,.85) !important;
  backdrop-filter:saturate(150%) blur(14px);
  -webkit-backdrop-filter:saturate(150%) blur(14px);
  border-bottom:1px solid color-mix(in srgb, var(--accent) 30%, transparent) !important;
}
.pd-header::after{
  content:"";
  position:absolute;
  left:0; right:0; bottom:-1px;
  height:1px;
  background:linear-gradient(90deg, transparent, var(--accent), transparent);
  opacity:.7;
  pointer-events:none;
}
.pd-header-bar{
  display:flex !important;
  align-items:center !important;
  justify-content:space-between !important;
  width:100% !important;
  max-width:none !important;
  margin:0 !important;
  padding:1.1rem clamp(1rem, 3vw, 2.2rem) !important;
  gap:1.2rem;
}
.pd-brand{ display:flex; align-items:center; gap:.6rem; flex-shrink:0; }
.pd-brand .brand-logo{
  height:48px; width:auto;
  display:block;
  transition:transform .25s ease, filter .25s ease;
  filter:drop-shadow(0 4px 12px rgba(229,9,20,.25));
}
.pd-header.scrolled .brand-logo{ height:40px; }
.pd-brand:hover .brand-logo{ transform:scale(1.04); }

.pd-nav{
  display:flex !important;
  align-items:center;
  gap:1.15rem;
  margin-left:auto;
  flex-wrap:nowrap;
}
.pd-nav a{ color:var(--ink); }
.pd-nav a:not(.nav-cta){
  font-family:var(--font-display);
  font-weight:600;
  font-size:.78rem;
  letter-spacing:.06em;
  text-transform:uppercase;
  opacity:.78;
  white-space:nowrap;
  position:relative;
  padding:.25rem 0;
}
.pd-nav a:not(.nav-cta)::after{
  content:""; position:absolute; left:0; right:0; bottom:-4px;
  height:2px; background:var(--accent);
  transform:scaleX(0); transform-origin:left;
  transition:transform .25s ease;
}
.pd-nav a:not(.nav-cta):hover{ opacity:1; }
.pd-nav a:not(.nav-cta):hover::after,
.pd-nav a:not(.nav-cta)[aria-current="page"]::after{ transform:scaleX(1); }
.pd-nav .nav-cta{
  padding:.55rem 1.1rem !important;
  font-size:.78rem !important;
  margin-left:.4rem;
}
@media (min-width:1280px){
  .pd-nav{ gap:1.5rem; }
  .pd-nav a:not(.nav-cta){ font-size:.82rem; }
}

/* Hamburger only on mobile */
.pd-burger{ display:none; }
@media (max-width:1024px){
  .pd-burger{ display:block; }
  .pd-nav{ display:none !important; }
  body.nav-open .pd-nav{
    display:flex !important;
    position:fixed; top:0; right:0;
    width:min(82vw, 340px); height:100dvh;
    flex-direction:column; align-items:stretch; justify-content:flex-start;
    padding:5.5rem 1.6rem 2rem; gap:.2rem;
    background:#080808;
    border-left:1px solid color-mix(in srgb, var(--accent) 25%, transparent);
    box-shadow:-30px 0 60px -30px rgba(0,0,0,.6);
    z-index:120;
    overflow-y:auto;
  }
  body.nav-open .pd-nav a:not(.nav-cta){
    font-size:1rem; padding:.95rem .25rem;
    border-bottom:1px solid rgba(255,255,255,.06);
    opacity:.92;
  }
  body.nav-open .pd-nav a:not(.nav-cta):hover{ color:var(--accent); }
  body.nav-open .pd-nav .nav-cta{
    margin-top:1.2rem; justify-content:center;
    padding:.95rem 1.5rem !important; font-size:.85rem !important;
  }
}
@media (max-width:640px){
  .pd-header-bar{ padding:.7rem .85rem !important; }
  .pd-brand .brand-logo{ height:38px; }
}

/* FOOTER — full width with dedicated inner */
.pd-footer{
  background:#050505 !important;
  border-top:0 !important;
  width:100% !important;
  margin:0 !important;
  padding:clamp(3rem, 5vw, 4.5rem) 0 2rem !important;
  position:relative;
  overflow:hidden;
  color:var(--ink);
}
/* override the foot-bold legacy ::before red bar — keep it subtle */
.pd-footer::before{
  content:"";
  position:absolute;
  top:0; left:0; right:0;
  height:1px;
  background:linear-gradient(90deg, transparent, var(--accent), transparent);
  opacity:.6;
  z-index:1;
}
.pd-footer::after{
  content:"";
  position:absolute;
  bottom:-220px; right:-220px;
  width:480px; height:480px;
  background:radial-gradient(circle, var(--accent-glow) 0%, transparent 60%);
  opacity:.22;
  z-index:0;
  pointer-events:none;
}
.pd-footer-inner{
  position:relative;
  z-index:2;
  width:100%;
  max-width:none;
  margin:0;
  padding:0 clamp(1.1rem, 3vw, 2.5rem);
}
.pd-footer .foot-shout{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:1.5rem;
  flex-wrap:wrap;
  margin-bottom:2rem;
}
.pd-footer .foot-shout .brand{
  font-family:var(--font-display);
  font-size:clamp(1.6rem, 4.5vw, 3.2rem);
  font-weight:900;
  letter-spacing:-.02em;
  line-height:1.05;
  background:linear-gradient(180deg, #fff 0%, #888 100%);
  -webkit-background-clip:text;
  background-clip:text;
  -webkit-text-fill-color:transparent;
  word-break:keep-all;
  max-width:100%;
}
.pd-footer .foot-row{
  display:flex;
  justify-content:space-between;
  gap:2rem 3rem;
  flex-wrap:wrap;
  align-items:flex-start;
  padding-top:1.4rem;
  border-top:1px solid rgba(255,255,255,.08);
}
.pd-footer .footer-nav{
  display:flex;
  flex-wrap:wrap;
  gap:.8rem 1.4rem;
  flex:1;
  min-width:0;
}
.pd-footer .footer-nav a{
  font-family:var(--font-display);
  font-size:.78rem; font-weight:600;
  letter-spacing:.08em; text-transform:uppercase;
  color:var(--ink); opacity:.7;
  transition:color .2s, opacity .2s;
}
.pd-footer .footer-nav a:hover{ opacity:1; color:var(--accent); }
.pd-footer .foot-meta{
  display:flex;
  gap:1.4rem;
  flex-wrap:wrap;
  font-family:var(--font-display);
  font-size:.78rem; font-weight:600;
  letter-spacing:.08em; text-transform:uppercase;
  color:var(--ink);
  opacity:.65;
}
.pd-footer .footer-legal{
  width:100%;
  margin-top:1.6rem;
  padding-top:1.2rem;
  border-top:1px solid rgba(255,255,255,.06);
  font-family:var(--font-body);
  font-size:.78rem;
  color:var(--ink);
  opacity:.45;
}
@media (max-width:640px){
  .pd-footer .foot-shout{ flex-direction:column; align-items:flex-start; }
  .pd-footer .foot-row{ flex-direction:column; gap:1.4rem; }
  .pd-footer .footer-nav{ flex-direction:column; gap:.85rem; }
}

/* NUKE any orphan red rectangles from old home-marquee or stale Elementor */
.home-marquee-strip:empty,
.home-marquee-strip .home-marquee-track:empty{ display:none !important; }

/* If the legacy home-marquee renders without text for any reason,
   give it a fallback height of 0 instead of an empty red band. */
.home-marquee-strip .home-marquee-track:not(:has(.home-marquee-item)){
  display:none !important;
}

/* ============================================================
   v4.2.1 — Force header AND footer to break out of any parent
   container constraint (Hello Elementor / Elementor Pro wrap
   pages inside a max-width box; we have to escape it).
============================================================ */
.pd-header,
.pd-footer{
  width:100vw !important;
  max-width:100vw !important;
  margin-left:calc(50% - 50vw) !important;
  margin-right:calc(50% - 50vw) !important;
  left:0 !important;
  right:0 !important;
  box-sizing:border-box !important;
}
.pd-header{ position:sticky !important; top:0; }
.pd-footer{ position:relative; }
/* Re-anchor the inner row to viewport edges with padding only */
.pd-header-bar,
.pd-footer-inner{
  width:100% !important;
  max-width:100% !important;
  margin-left:0 !important;
  margin-right:0 !important;
  box-sizing:border-box !important;
}

/* ============================================================
   v4.2.2 — Hard-fix "Georgetown" mid-word break in stat cell
============================================================ */
.home-intro-stat-value,
.ps-stat-num,
.about-stat-num{
  font-size:clamp(.95rem, 1.4vw, 1.25rem) !important;
  line-height:1.15 !important;
  word-break:keep-all !important;
  overflow-wrap:normal !important;
  hyphens:none !important;
  -webkit-hyphens:none !important;
  white-space:normal;
}
/* If the stat value is a single long word (Georgetown), shrink to fit */
.home-intro-stat{ padding:1rem .85rem !important; min-width:0; container-type:inline-size; }
@media (max-width:1280px){
  .home-intro-stat-value{ font-size:clamp(.85rem, 1.2vw, 1.05rem) !important; }
}

/* ============================================================
   v4.2.3 — <picture> hero support (responsive desktop/mobile)
============================================================ */
picture.hero-bg,
picture.ps-hero-bg{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  z-index:0;
  display:block;
  overflow:hidden;
}
picture.hero-bg img,
picture.ps-hero-bg img{
  width:100%;
  height:100%;
  object-fit:cover;
  object-position:center;
  display:block;
}

/* ---- Footer legal row ---- */
.pd-footer-legal-row{ display:flex; justify-content:space-between; align-items:center; flex-wrap:wrap; gap:1rem; margin-top:1.6rem; padding-top:1.2rem; border-top:1px solid rgba(255,255,255,.06); }
.pd-footer-legal{ display:flex; gap:1.4rem; flex-wrap:wrap; }
.pd-footer-legal a{ font-family:var(--font-display); font-size:.72rem; font-weight:600; letter-spacing:.12em; text-transform:uppercase; color:var(--ink); opacity:.55; transition:opacity .2s, color .2s; }
.pd-footer-legal a:hover{ opacity:1; color:var(--accent); }
@media (max-width:640px){ .pd-footer-legal-row{ flex-direction:column; align-items:flex-start; } }

/* ============================================================
   v4.4 — Footer columns (Visit / Menu / Shop by Cut) +
   Cloudsprout design credit
============================================================ */
.pd-footer-cols{
  display:grid;
  grid-template-columns: 1.2fr 1fr 1.6fr;
  gap:2rem 3rem;
  padding-top:1.6rem;
  border-top:1px solid rgba(255,255,255,.06);
  margin-bottom:.5rem;
}
.pd-footer-col h4.pd-footer-col-h{
  font-family:var(--font-display);
  font-size:.7rem; font-weight:700;
  letter-spacing:.22em; text-transform:uppercase;
  color:var(--accent);
  margin:0 0 1rem;
}
.pd-footer-col p{
  font-family:var(--font-body);
  font-size:.92rem;
  color:var(--ink);
  opacity:.7;
  line-height:1.6;
  margin:0 0 .6rem;
}
.pd-footer-col p a{ color:var(--ink); }
.pd-footer-col p a:hover{ color:var(--accent); }
.pd-footer-col .footer-nav{
  display:flex; flex-direction:column; gap:.7rem;
}
.pd-footer-col .footer-nav a{
  font-family:var(--font-display);
  font-size:.78rem; font-weight:600;
  letter-spacing:.08em; text-transform:uppercase;
  color:var(--ink); opacity:.7;
  transition:opacity .2s, color .2s;
}
.pd-footer-col .footer-nav a:hover{ opacity:1; color:var(--accent); }

/* Category list is multi-column */
.pd-footer-cat-list{
  display:grid !important;
  grid-template-columns: repeat(2, 1fr);
  gap:.6rem 1.2rem;
}

/* Design credit (Cloudsprout) — subtle, centered */
.pd-footer-credit{
  margin-top:1.2rem;
  padding-top:1rem;
  border-top:1px solid rgba(255,255,255,.04);
  font-family:var(--font-body);
  font-size:.72rem;
  color:var(--ink);
  opacity:.45;
  text-align:center;
  letter-spacing:.05em;
}
.pd-footer-credit a{
  color:var(--ink);
  text-decoration:none;
  border-bottom:1px solid rgba(255,255,255,.18);
  padding-bottom:1px;
  transition:color .2s, border-color .2s;
}
.pd-footer-credit a:hover{
  color:var(--accent);
  border-bottom-color:var(--accent);
}

@media (max-width:900px){
  .pd-footer-cols{ grid-template-columns:1fr 1fr; }
  .pd-footer-cats{ grid-column:1 / -1; }
}
@media (max-width:560px){
  .pd-footer-cols{ grid-template-columns:1fr; gap:1.6rem; }
  .pd-footer-cat-list{ grid-template-columns:repeat(2,1fr); }
}

/* ============================================================
   v4.5.1 — BEAUTY PASS (red + black only)
   film grain · ken-burns hero · button shine · premium scrollbar ·
   multi-tag card support · sourcing stamp
============================================================ */

/* ---- Subtle film grain over whole site (premium texture) ---- */
body::after{
  content:"";
  position:fixed; inset:0;
  z-index:9999;
  pointer-events:none;
  opacity:.035;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='200' height='200'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2'/%3E%3C/filter%3E%3Crect width='200' height='200' filter='url(%23n)'/%3E%3C/svg%3E");
  background-size:200px 200px;
}

/* ---- Premium scrollbar (WebKit) ---- */
::-webkit-scrollbar{ width:11px; }
::-webkit-scrollbar-track{ background:#0a0a0a; }
::-webkit-scrollbar-thumb{ background:linear-gradient(180deg, var(--accent-deep), var(--accent)); border:2px solid #0a0a0a; border-radius:6px; }
::-webkit-scrollbar-thumb:hover{ background:var(--accent-soft); }

/* ---- Focus rings: accessible + on-brand ---- */
a:focus-visible, button:focus-visible, input:focus-visible, select:focus-visible, textarea:focus-visible{
  outline:2px solid var(--accent);
  outline-offset:3px;
}

/* ---- Hero: slow ken-burns + cinematic vignette ---- */
@media (prefers-reduced-motion: no-preference){
  .ps-hero-bg, picture.ps-hero-bg img, .hero img.hero-bg, picture.hero-bg img{
    animation:pdKenBurns 18s ease-out both;
    transform-origin:center 60%;
  }
  @keyframes pdKenBurns{ from{ transform:scale(1.08); } to{ transform:scale(1); } }
}
.ps-hero::before{
  background:
    radial-gradient(ellipse 120% 90% at 50% 115%, transparent 40%, rgba(0,0,0,.55) 100%),
    radial-gradient(ellipse 70% 60% at 20% 80%, rgba(229,9,20,.35) 0%, transparent 60%),
    linear-gradient(to top, rgba(0,0,0,.94) 0%, rgba(0,0,0,.55) 55%, rgba(0,0,0,.22) 100%);
}

/* ---- Eyebrows: extended red rule ---- */
.fc-eyebrow::after, .ps-section-head .ps-eyebrow::after{
  content:"";
  display:inline-block;
  width:42px; height:1px;
  background:linear-gradient(90deg, var(--accent), transparent);
  margin-left:.2rem;
}

/* ---- Buttons: shine sweep on hover ---- */
.btn, .ps-form-submit, .home-btn-primary, .home-btn-ghost{ position:relative; overflow:hidden; }
.btn::after, .ps-form-submit::after, .home-btn-primary::after{
  content:"";
  position:absolute; top:0; bottom:0; left:-80%;
  width:50%;
  background:linear-gradient(105deg, transparent, rgba(255,255,255,.28), transparent);
  transform:skewX(-20deg);
  transition:left .55s ease;
  pointer-events:none;
}
.btn:hover::after, .ps-form-submit:hover::after, .home-btn-primary:hover::after{ left:130%; }

/* ---- Product cards: richer media + crisp white titles ---- */
.pp-card{ background:linear-gradient(180deg, #181818 0%, #121212 100%); }
.pp-card-media img{ filter:saturate(.96) contrast(1.02); }
.pp-card:hover .pp-card-media img{ filter:saturate(1.12) contrast(1.06); }
.pp-card-media::before{
  content:"";
  position:absolute; top:0; left:0; right:0; height:1px;
  background:linear-gradient(90deg, transparent, rgba(255,255,255,.25), transparent);
  z-index:2;
}
.pp-card-name{
  background:linear-gradient(180deg, #fff 0%, #cfcfcf 100%);
  -webkit-background-clip:text; background-clip:text;
  -webkit-text-fill-color:transparent;
}
.pp-card:hover .pp-card-name{
  background:linear-gradient(180deg, #fff 0%, var(--accent-soft) 160%);
  -webkit-background-clip:text; background-clip:text;
  -webkit-text-fill-color:transparent;
}

/* ---- Multi-tag row on cards (Best Seller · Heritage · No Nitrates · Tier) ---- */
.pp-card-tags{
  position:absolute; top:1rem; left:1rem; right:1rem;
  display:flex; flex-wrap:wrap; gap:.4rem;
  z-index:3;
}
.pp-card-tags .pp-card-badge{ position:static; }
.pp-tag{
  display:inline-flex; align-items:center; gap:.35rem;
  font-family:var(--font-display);
  font-size:.6rem; font-weight:700;
  letter-spacing:.18em; text-transform:uppercase;
  padding:.35rem .7rem;
  background:rgba(0,0,0,.72);
  color:#fff;
  border:1px solid rgba(255,255,255,.16);
  backdrop-filter:blur(8px); -webkit-backdrop-filter:blur(8px);
}
.pp-tag-hot{ background:var(--accent); border-color:var(--accent); box-shadow:0 6px 18px rgba(229,9,20,.45); }
.pp-tag-tier{ background:#fff; border-color:#fff; color:#0a0a0a; font-weight:800; }
.pp-tag-clean{ border-color:rgba(255,255,255,.3); }

/* ---- Sourcing-tier stamp (ready for sourcing_tier ACF) ---- */
.pp-stamp{
  position:absolute; bottom:1rem; right:1rem; z-index:3;
  font-family:var(--font-display);
  font-size:.58rem; font-weight:800;
  letter-spacing:.22em; text-transform:uppercase;
  color:#fff;
  border:1.5px solid var(--accent);
  padding:.4rem .7rem;
  background:rgba(10,10,10,.78);
  backdrop-filter:blur(6px); -webkit-backdrop-filter:blur(6px);
  transform:rotate(-2deg);
  box-shadow:0 0 20px var(--accent-glow);
}

/* ---- Stats: red tick above number ---- */
.ps-stat{ position:relative; }
.ps-stat::before{
  content:"";
  position:absolute; top:0; left:1.4rem;
  width:26px; height:2px;
  background:linear-gradient(90deg, var(--accent), transparent);
}

/* ---- Single product: price underline flourish ---- */
.sp-price{ position:relative; padding-bottom:.9rem; }
.sp-price::after{
  content:"";
  position:absolute; left:0; bottom:0;
  width:72px; height:2px;
  background:linear-gradient(90deg, var(--accent), transparent);
}

/* ---- Headline glow restraint: soften red text-shadow slightly ---- */
.ps-h2 span{ text-shadow:0 0 18px rgba(229,9,20,.28); }

@media (prefers-reduced-motion: reduce){
  .btn::after, .ps-form-submit::after, .home-btn-primary::after{ display:none; }
}

/* ============================================================
   MOTION LAYER v4.7 — scroll progress, 3D card tilt + glare,
   parallax CTA backgrounds, hero entrance choreography,
   staggered 3D card reveals, count-up stats.
   Additive only: preserves the brutalist-bold preset tokens.
   Everything motion-heavy is reduced-motion safe.
============================================================ */

/* ---- Scroll progress bar (injected by motion.js) ---- */
.pd-progress{
  position:fixed; top:0; left:0; width:100%; height:3px;
  z-index:100000;
  background:linear-gradient(90deg, var(--accent-deep), var(--accent), var(--accent-soft));
  transform:scaleX(0); transform-origin:left;
  pointer-events:none;
  box-shadow:0 1px 12px var(--accent-glow);
}

/* ---- 3D tilt cards (class + glare injected by motion.js) ---- */
.pd-tilt{ position:relative; transform-style:preserve-3d; }
.pd-tilt-glare{
  position:absolute; inset:0; z-index:6;
  pointer-events:none;
  background:transparent;
  transition:background .25s ease;
  border-radius:inherit;
}

/* ---- Marquee: pause on hover so items are readable ---- */
.ps-marquee:hover .ps-marquee-track{ animation-play-state:paused; }

@media (prefers-reduced-motion: no-preference){
  /* Parallax CTA backgrounds: scale headroom so edges never show */
  .ps-cta-bg, .home-cta-bg, .pp-cta-bg{ will-change:transform; transform:scale(1.14); }

  /* Cards rise with 3D perspective as they reveal (not on product catalog) */
  .ps-grid > [data-reveal], .fc-grid > [data-reveal], .home-feature-grid > [data-reveal]{
    transform:perspective(1000px) translateY(48px) rotateX(9deg) scale(.985);
    transform-origin:center 85%;
  }
  .ps-grid > [data-reveal].is-visible, .fc-grid > [data-reveal].is-visible, .home-feature-grid > [data-reveal].is-visible{
    transform:none;
  }

  /* Hero entrance choreography (first paint only) */
  .ps-hero .ps-eyebrow, .home-hero-eyebrow{ animation:pdRise .7s var(--reveal-ease) .08s both; }
  .ps-h1, .home-hero h1{ animation:pdHeroIn .95s var(--reveal-ease) .16s both; }
  .ps-hero-sub, .home-hero-sub{ animation:pdRise .8s var(--reveal-ease) .34s both; }
  .ps-hero .ps-cta-row, .home-hero-actions{ animation:pdRise .8s var(--reveal-ease) .5s both; }

  /* Stat numbers glow in once counted */
  .ps-stat-num.pd-counted{ text-shadow:0 0 24px var(--accent-glow); transition:text-shadow .8s ease; }
}

@keyframes pdHeroIn{
  from{ opacity:0; transform:translateY(44px); filter:blur(10px); }
  to{ opacity:1; transform:none; filter:none; }
}
@keyframes pdRise{
  from{ opacity:0; transform:translateY(24px); }
  to{ opacity:1; transform:none; }
}

@media (prefers-reduced-motion: reduce){
  .pd-progress{ display:none; }
}

/* ============================================================
   PRODUCTS CATALOG v4.8 — counter-style presentation.
   The product library is square (800x800) studio photography on
   dark slate. Cards and detail media are square so the photo is
   NEVER cropped: what's on the card is exactly what Pat shot.
   Adds: search + sort toolbar, sticky filter rail, uniform
   2-line descriptions, price-forward footer.
============================================================ */

/* ---- Card media: square = zero crop on the studio shots ---- */
.pp-card-media{ aspect-ratio:1/1; background:#0d0d0d; overflow:hidden; }
.pp-card-media img{ object-fit:cover; object-position:center; }
/* Soft red under-glow rises behind the cut on hover */
.pp-card-media::after{
  background:
    radial-gradient(ellipse 90% 45% at 50% 108%, rgba(229,9,20,.28), transparent 60%),
    linear-gradient(to top, rgba(10,10,10,.55), transparent 45%);
  transition:opacity .35s ease; opacity:.75;
}
.pp-card:hover .pp-card-media::after{ opacity:1; }

/* ---- Card body: uniform heights, price-forward ---- */
.pp-card-link{ display:flex; flex-direction:column; height:100%; }
.pp-card-body{ display:flex; flex-direction:column; flex:1; }
.pp-card-name{ font-size:1.18rem; line-height:1.12; min-height:2.24em; display:flex; align-items:flex-start; }
.pp-card-desc{
  display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden;
  min-height:2.9em;
}
.pp-card-foot{ margin-top:auto; }
.pp-card-ask{
  font-family:var(--font-display); font-size:.68rem; font-weight:700;
  letter-spacing:.14em; text-transform:uppercase;
  color:#fff; opacity:.55;
}
.pp-card-origin{ border-top:1px solid rgba(255,255,255,.07); }

/* ---- Catalog toolbar: search + live count + sort ---- */
.cat-controls{
  position:sticky;
  top:var(--header-h, 72px);
  z-index:25;
  background:color-mix(in srgb, var(--bg) 94%, transparent);
  backdrop-filter:blur(14px); -webkit-backdrop-filter:blur(14px);
  padding-block:.75rem 1rem;
  margin-bottom:1.25rem;
  border-bottom:1px solid rgba(255,255,255,.08);
}
.cat-toolbar{
  display:flex; align-items:center; gap:1rem; flex-wrap:wrap;
  margin-bottom:1rem;
}
.cat-search{
  flex:1 1 320px; min-width:240px;
  display:flex; align-items:center; gap:.7rem;
  background:var(--surface);
  border:1px solid rgba(255,255,255,.14);
  padding:.85rem 1.1rem;
  transition:border-color .25s ease, box-shadow .25s ease;
}
.cat-search:focus-within{ border-color:var(--accent); box-shadow:0 0 0 1px var(--accent), 0 10px 30px -12px var(--accent-glow); }
.cat-search svg{ flex-shrink:0; width:15px; height:15px; stroke:var(--accent); }
.cat-search input{
  flex:1; min-width:0;
  background:transparent; border:none; outline:none;
  color:#fff; font-family:var(--font-body);
  font-size:16px; /* >=16px prevents iOS focus zoom */
}
.cat-search input::placeholder{ color:#fff; opacity:.38; }
.cat-toolbar-right{ display:flex; align-items:center; gap:1rem; margin-left:auto; }
.cat-count{
  font-family:var(--font-display); font-size:.68rem; font-weight:700;
  letter-spacing:.18em; text-transform:uppercase;
  color:#fff; opacity:.55; white-space:nowrap;
}
.cat-sort{
  font-family:var(--font-display); font-size:.72rem; font-weight:700;
  letter-spacing:.12em; text-transform:uppercase;
  color:#fff; background:var(--surface);
  border:1px solid rgba(255,255,255,.14);
  padding:.8rem 2.2rem .8rem 1rem;
  cursor:pointer; outline:none;
  appearance:none; -webkit-appearance:none;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='6'%3E%3Cpath d='M1 1l4 4 4-4' stroke='%23E50914' stroke-width='1.6' fill='none'/%3E%3C/svg%3E");
  background-repeat:no-repeat; background-position:right .9rem center;
  transition:border-color .25s ease;
}
.cat-sort:hover, .cat-sort:focus{ border-color:var(--accent); }
.cat-sort option{ background:#161616; color:#fff; }

/* ---- Filter rail: scrolls with sticky controls block ---- */
.cat-filter{
  position:static;
  display:flex; flex-wrap:wrap; gap:.55rem;
  margin-bottom:0; padding-bottom:0;
  border-bottom:none;
  background:transparent;
  backdrop-filter:none; -webkit-backdrop-filter:none;
  margin-inline:0; padding-inline:0;
}
#catalog{ scroll-margin-top:calc(var(--header-h, 72px) + 24px); }
.cat-grid{ overflow:visible; }
/* Catalog cards always fully visible — no scroll-reveal clip */
#cat-grid > .pp-card{ opacity:1 !important; transform:none !important; }

/* ---- Filter/search result pop-in ---- */
@media (prefers-reduced-motion: no-preference){
  .pp-card.pp-pop{ animation:ppPop .45s cubic-bezier(.2,.8,.2,1) both; }
  @keyframes ppPop{ from{ opacity:0; transform:translateY(16px) scale(.98); } to{ opacity:1; transform:none; } }
}

/* ---- Category tiles: let the photography read, red lift on hover ---- */
.pp-tile img{ filter:brightness(.82) saturate(1.02); }
.pp-tile:hover img{ filter:brightness(.9) saturate(1.1); transform:scale(1.05); }
.pp-tile::after{
  content:"\2192";
  position:absolute; top:.85rem; right:.95rem;
  font-family:var(--font-display); font-size:1rem; font-weight:700;
  color:#fff; opacity:0; transform:translateX(-6px);
  transition:opacity .3s ease, transform .3s ease;
  z-index:2;
}
.pp-tile:hover::after{ opacity:1; transform:none; }
.pp-tile-body{ padding:2.2rem 1.1rem 1rem; }
.pp-tile:hover .pp-tile-count{ color:#fff; }

/* ---- Single product: square media to match the photo library ---- */
.sp-media{ aspect-ratio:1/1 !important; }

@media (max-width:760px){
  .cat-toolbar-right{ width:100%; justify-content:space-between; margin-left:0; }
  :root{ --header-h: 60px; }
}
