/* Sawgrass Rods: production stylesheet for Bricks (generated by build-bricks-kit.py from demo/, home-v2 = master design).
   Loaded site-wide by the sawgrass-bricks-child child theme. Do not edit here: edit build-demo.py / the design, rebuild the demo, then this kit.
   Fonts are self-hosted (Anton / Epilogue / IBM Plex Mono): zero requests to Google. Keyframes are sg-prefixed: none in the demo today. */
@font-face{font-family:'Anton';font-style:normal;font-weight:400;font-display:swap;src:url('../fonts/Anton-400.woff2') format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD}
@font-face{font-family:'Epilogue';font-style:normal;font-weight:300 800;font-display:swap;src:url('../fonts/Epilogue-300-800.woff2') format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD}
@font-face{font-family:'IBM Plex Mono';font-style:normal;font-weight:400;font-display:swap;src:url('../fonts/IBMPlexMono-400.woff2') format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD}
@font-face{font-family:'IBM Plex Mono';font-style:normal;font-weight:500;font-display:swap;src:url('../fonts/IBMPlexMono-500.woff2') format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD}
@font-face{font-family:'IBM Plex Mono';font-style:normal;font-weight:600;font-display:swap;src:url('../fonts/IBMPlexMono-600.woff2') format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD}
/* ═══════════════ BRICKS BASE LAYER (build-bricks-kit.py): placed FIRST so every demo rule still wins ═══════════════ */
/* trap 3: blocks default to width:100%; inside a demo flex row they size to content, like the demo */
:where(.button)>:is(.brxe-block,.brxe-div),:where(.card__foot)>:is(.brxe-block,.brxe-div),:where(.meter)>:is(.brxe-block,.brxe-div),:where(.util__in)>:is(.brxe-block,.brxe-div),:where(.hdr__in)>:is(.brxe-block,.brxe-div),:where(.mark)>:is(.brxe-block,.brxe-div),:where(.nav)>:is(.brxe-block,.brxe-div),:where(.nav__item)>:is(.brxe-block,.brxe-div),:where(.nav__btn)>:is(.brxe-block,.brxe-div),:where(.mega__list .mega__a)>:is(.brxe-block,.brxe-div),:where(.tools)>:is(.brxe-block,.brxe-div),:where(.slide__eyebrow)>:is(.brxe-block,.brxe-div),:where(.slide__cta)>:is(.brxe-block,.brxe-div),:where(.slide__specs)>:is(.brxe-block,.brxe-div),:where(.slider__ui-in)>:is(.brxe-block,.brxe-div),:where(.dots)>:is(.brxe-block,.brxe-div),:where(.dot)>:is(.brxe-block,.brxe-div),:where(.arrows)>:is(.brxe-block,.brxe-div),:where(.sect__head)>:is(.brxe-block,.brxe-div),:where(.chart__filters)>:is(.brxe-block,.brxe-div),:where(.rod-row__name)>:is(.brxe-block,.brxe-div),:where(.chart__foot)>:is(.brxe-block,.brxe-div),:where(.stars)>:is(.brxe-block,.brxe-div),:where(.half li)>:is(.brxe-block,.brxe-div),:where(.newsletter form)>:is(.brxe-block,.brxe-div),:where(.ftr__bar)>:is(.brxe-block,.brxe-div),:where(.drawer__hd)>:is(.brxe-block,.brxe-div),:where(.total)>:is(.brxe-block,.brxe-div),:where(.rod-row__price)>:is(.brxe-block,.brxe-div),:where(.mnav__hd)>:is(.brxe-block,.brxe-div),:where(.mnav a)>:is(.brxe-block,.brxe-div),:where(.crumbs)>:is(.brxe-block,.brxe-div),:where(.buy__flags)>:is(.brxe-block,.brxe-div),:where(.buy__price)>:is(.brxe-block,.brxe-div),:where(.opt__label)>:is(.brxe-block,.brxe-div),:where(.opt__row)>:is(.brxe-block,.brxe-div),:where(.stock)>:is(.brxe-block,.brxe-div),:where(.reassure div)>:is(.brxe-block,.brxe-div),:where(.qty)>:is(.brxe-block,.brxe-div),:where(.buybar)>:is(.brxe-block,.brxe-div),:where(.faq__item summary)>:is(.brxe-block,.brxe-div),:where(.post-meta)>:is(.brxe-block,.brxe-div),:where(.byline)>:is(.brxe-block,.brxe-div),:where(.share)>:is(.brxe-block,.brxe-div),:where(.inline-buy__foot)>:is(.brxe-block,.brxe-div){width:auto}
/* trap 5/12: a section's direct children and every .container stay full width */
:where(.brxe-section)>:is(.brxe-block,.brxe-div,.brxe-container),.container:is(.brxe-block,.brxe-div,.brxe-container){width:100%}
/* trap 11: role=button divs start from the browser's own <button> box, so the demo's button rules land the same way */
[role="button"]{display:inline-block;box-sizing:border-box;text-align:center;padding:1px 6px}
/* Bricks styles <blockquote>/<figcaption> itself (serif, grey left bar, centred grey caption): back to the page's own type */
.quote blockquote{font-family:inherit;font-style:normal;border-left:0;padding:0;quotes:none}
.quote figcaption{text-align:left;color:inherit;font-size:inherit;line-height:inherit;margin:0}

:root{
  --sfr-charcoal:#3A3A3A;
  --sfr-green:#147500;
  --sfr-orange:#F98902;
  --sfr-cork:#C9A26B;
  --sfr-black:#141312;
  --cork-100:#FAF5EE;
  --cork-200:#F0E4D2;
  --cork-300:#E0CDB0;
  --cork-500:#C9A26B;
  --cork-700:#7A5A2E;
  --cork-900:#1F1A14;
  --ink-950:#141312;
  --ink-900:#232120;
  --ink-800:#3A3A3A;
  --ink-700:#55534F;
  --ink-600:#6B6862;
  --ink-500:#807D78;
  --ink-400:#A8A5A0;
  --ink-300:#D4D1CC;
  --ink-200:#E8E6E2;
  --ink-100:#F4F2EF;
  --ink-50:#FBFAF8;
  --orange-500:#F98902;
  --orange-600:#A85A00;
  --orange-700:#8F4E00;
  --green-400:#35B81C;
  --green-500:#1A8F00;
  --green-600:#147500;
  --green-700:#0E5200;
  --color-text:var(--ink-800);
  --color-text-soft:var(--ink-700);
  --color-muted:var(--ink-600);
  --color-bg:var(--ink-50);
  --color-surface:var(--ink-100);
  --color-surface-2:var(--ink-200);
  --color-rule:var(--ink-300);
  --color-rule-soft:var(--ink-200);
  --color-accent:var(--orange-600);
  --color-accent-hv:var(--orange-700);
  --color-accent-solid:var(--sfr-orange);
  --color-on-accent:var(--ink-950);
  --color-accent-inv:var(--sfr-orange);
  --color-ok:var(--sfr-green);
  --color-surface-warm:var(--cork-100);
  --color-rule-warm:var(--cork-300);
  --color-warm-label:var(--cork-700);
  --color-inverse:var(--sfr-black);
  --color-on-inverse:var(--ink-50);
  --space-3xs:clamp(.25rem,.24rem + .05vw,.3rem);
  --space-2xs:clamp(.5rem,.48rem + .1vw,.6rem);
  --space-xs:clamp(.75rem,.72rem + .15vw,.9rem);
  --space-s:clamp(1rem,.95rem + .25vw,1.2rem);
  --space-m:clamp(1.5rem,1.4rem + .5vw,2rem);
  --space-l:clamp(2rem,1.8rem + 1vw,3rem);
  --space-xl:clamp(3rem,2.6rem + 2vw,4.5rem);
  --space-2xl:clamp(4rem,3.4rem + 3vw,6rem);
  --text-xs:.6875rem;
  --text-s:.8125rem;
  --text-m:1.0625rem;
  --text-l:1.25rem;
  --text-xl:1.6rem;
  --text-2xl:clamp(2rem,1.7rem + 1.5vw,3rem);
  --text-3xl:clamp(2.6rem,2rem + 3.4vw,4.75rem);
  --font-display:"Anton","Impact","Haettenschweiler",sans-serif;
  --font-body:"Epilogue",system-ui,-apple-system,"Segoe UI",sans-serif;
  --font-mono:"IBM Plex Mono",ui-monospace,"SFMono-Regular",Menlo,monospace;
  --radius:4px;
  --radius-lg:8px;
  --shell:1400px;
  --gutter:clamp(1.15rem,4vw,3.25rem);
  --shell-narrow:760px;
}
@media (prefers-color-scheme:dark){
:root:not([data-theme="light"]){
    --color-text:var(--ink-50);
    --color-text-soft:var(--ink-300);
    --color-muted:var(--ink-400);
    --color-bg:var(--ink-950);
    --color-surface:var(--ink-900);
    --color-surface-2:#2C2A28;
    --color-rule:#3F3C39;
    --color-rule-soft:var(--ink-900);
    --color-accent:var(--sfr-orange);
    --color-accent-hv:var(--ink-50);
    --color-accent-solid:var(--sfr-orange);
    --color-on-accent:var(--ink-950);
    --color-accent-inv:var(--sfr-orange);
    --color-ok:var(--green-400);
    --color-surface-warm:var(--cork-900);
  --color-rule-warm:#3A3129;
  --color-warm-label:var(--cork-500);
    --color-surface-warm:var(--cork-900);
    --color-rule-warm:#3A3129;
    --color-warm-label:var(--cork-500);
    --color-inverse:#0B0A0A;
    --color-on-inverse:var(--ink-50);
  }
}
:root[data-theme="dark"]{ --color-text:var(--ink-50);
  --color-text-soft:var(--ink-300);
  --color-muted:var(--ink-400);
  --color-bg:var(--ink-950);
  --color-surface:var(--ink-900);
  --color-surface-2:#2C2A28;
  --color-rule:#3F3C39;
  --color-rule-soft:var(--ink-900);
  --color-accent:var(--sfr-orange);
  --color-accent-hv:var(--ink-50);
  --color-accent-solid:var(--sfr-orange);
  --color-on-accent:var(--ink-950);
  --color-accent-inv:var(--sfr-orange);
  --color-ok:var(--green-400);
    --color-surface-warm:var(--cork-900);
  --color-rule-warm:#3A3129;
  --color-warm-label:var(--cork-500);
  --color-inverse:#0B0A0A;
  --color-on-inverse:var(--ink-50); }
*,*::before,*::after{ box-sizing:border-box; }
body{ margin:0; background:var(--color-bg); color:var(--color-text);
  font-family:var(--font-body); font-size:var(--text-m); line-height:1.62;
  -webkit-font-smoothing:antialiased; }
h1,h2,h3,h4{ margin:0; font-family:var(--font-display); font-weight:400; line-height:.96; text-wrap:balance; letter-spacing:.005em; }
p{ margin:0; }
a{ color:inherit; }
img{ display:block; max-width:100%; }
button,[role="button"]{ font:inherit; color:inherit; background:none; border:0; cursor:pointer; }
:focus-visible{ outline:2px solid var(--color-accent); outline-offset:3px; }
.container{ width:100%; max-width:var(--shell); margin-inline:auto; padding-inline:var(--gutter); }
.stack{ display:flex; flex-direction:column; gap:var(--space-s); }
.stack--m{ gap:var(--space-m); }
.eyebrow{ font-family:var(--font-mono); font-size:var(--text-xs); font-weight:600; letter-spacing:.18em; text-transform:uppercase; color:var(--color-muted); }
.spec{ font-family:var(--font-mono); font-size:var(--text-s); font-variant-numeric:tabular-nums; color:var(--color-text-soft); }
.num{ font-family:var(--font-mono); font-variant-numeric:tabular-nums; }
.button{ display:inline-flex; align-items:center; justify-content:center; gap:var(--space-2xs);
  font-family:var(--font-display); font-size:1.0625rem; letter-spacing:.09em; text-transform:uppercase;
  padding:.9rem 1.6rem; min-height:48px; text-decoration:none; border-radius:var(--radius);
  border:1px solid var(--color-text); cursor:pointer;
  transition:background .2s ease, color .2s ease, border-color .2s ease;flex-direction:row}
.button--primary{ background:var(--color-accent-solid); border-color:var(--color-accent-solid); color:var(--color-on-accent); }
.button--primary:hover{ background:var(--orange-600); border-color:var(--orange-600); color:#FFFFFF; }
.button--ghost{ background:transparent; }
.button--ghost:hover{ background:var(--color-text); color:var(--color-bg); }
.button--light{ background:transparent; color:var(--color-on-inverse); border-color:rgba(251,250,248,.45); }
.button--light:hover{ background:var(--color-on-inverse); color:var(--color-inverse); }
.button--small{ padding:.55rem 1rem; min-height:40px; font-size:.95rem; }
.button svg{ width:15px; height:15px; }
.tag{ display:inline-block; font-family:var(--font-mono); font-size:.625rem; font-weight:600;
  letter-spacing:.14em; text-transform:uppercase; padding:.22rem .5rem; line-height:1.2;
  border:1px solid var(--color-accent); color:var(--color-accent); border-radius:var(--radius); }
.tag--solid{ background:var(--color-accent-solid); color:var(--color-on-accent); }
.tag--quiet{ border-color:var(--color-rule); color:var(--color-muted); }
.card{ display:flex; flex-direction:column; border:1px solid var(--color-rule); border-radius:var(--radius-lg); overflow:hidden; background:var(--color-surface); text-decoration:none; transition:border-color .2s ease; }
.card:hover{ border-color:var(--color-accent); }
.card__body{ padding:var(--space-s); display:flex; flex-direction:column; gap:var(--space-2xs); flex:1; }
.card__foot{ margin-top:auto; padding-top:var(--space-xs); border-top:1px solid var(--color-rule-soft); display:flex; align-items:baseline; justify-content:space-between; gap:var(--space-2xs);flex-direction:row}
.meter{ display:flex; gap:2px;flex-direction:row}
.meter i{ width:14px; height:5px; background:var(--color-rule); display:block; border-radius:1px; }
.meter i.is-on{ background:var(--color-accent); }
.ph{ position:relative; margin:0; overflow:hidden; display:grid; place-items:center; text-align:center;
  background:var(--color-surface-2);
  background-image:repeating-linear-gradient(135deg,var(--color-rule) 0 1px,transparent 1px 11px);
  border:1px solid var(--color-rule); }
.ph::before,.ph::after{ content:""; position:absolute; width:14px; height:14px; border-color:var(--color-muted); border-style:solid; opacity:.75; }
.ph::before{ top:8px; left:8px; border-width:1px 0 0 1px; }
.ph::after{ bottom:8px; right:8px; border-width:0 1px 1px 0; }
.ph figcaption{ padding:var(--space-s); max-width:36ch; display:flex; flex-direction:column; gap:.35rem; align-items:center; }
.ph__id{ font-family:var(--font-mono); font-size:.625rem; font-weight:600; letter-spacing:.18em; text-transform:uppercase; color:var(--color-bg); background:var(--color-muted); padding:.2rem .5rem; border-radius:2px; }
.ph__sub{ font-family:var(--font-display); font-size:1.2rem; letter-spacing:.03em; text-transform:uppercase; color:var(--color-text-soft); line-height:1.1; }
.ph__dim{ font-family:var(--font-mono); font-size:var(--text-xs); letter-spacing:.07em; color:var(--color-muted); }
.ph--21x9{ aspect-ratio:21/9; }
.ph--16x9{ aspect-ratio:16/9; }
.ph--4x3{ aspect-ratio:4/3; }
.ph--3x4{ aspect-ratio:3/4; }
.ph--1x1{ aspect-ratio:1/1; }
.ph--fill{ position:absolute; inset:0; border:0; }
.ph--dark{ --color-surface-2:#1B1A19; --color-rule:#332F2C; --color-muted:#807D78; }
.util{ background:var(--color-inverse); color:var(--color-on-inverse); }
.util__in{ display:flex; flex-wrap:wrap; align-items:center; gap:var(--space-2xs) var(--space-m); min-height:40px; padding-block:.35rem;
  font-family:var(--font-mono); font-size:var(--text-xs); letter-spacing:.1em; text-transform:uppercase; color:var(--ink-400);flex-direction:row}
.util__in b{ color:var(--color-accent-inv); font-weight:600; }
.util__in a{ color:var(--color-on-inverse); text-decoration:none; border-bottom:1px solid var(--orange-600); }
.util__in a:hover{ color:var(--color-accent-inv); }
.util__push{ margin-left:auto; }
.hdr{ position:sticky; top:0; z-index:60; background:color-mix(in srgb,var(--color-bg) 94%,transparent); backdrop-filter:blur(14px) saturate(1.1); border-bottom:1px solid var(--color-rule); }
.hdr__in{ display:flex; align-items:stretch; gap:var(--space-m); min-height:78px;flex-direction:row}
.mark{ display:flex; align-items:center; gap:.7rem; text-decoration:none; flex:0 0 auto;flex-direction:row}
.mark svg{ width:32px; height:32px; flex:0 0 auto; }
.mark b{ font-family:var(--font-display); font-size:1.75rem; letter-spacing:.04em; text-transform:uppercase; display:block; line-height:1; }
.mark em{ font-family:var(--font-mono); font-style:normal; font-size:.5625rem; letter-spacing:.26em; text-transform:uppercase; color:var(--color-muted); display:block; margin-top:3px; }
.nav{ display:flex; align-items:stretch; margin-left:auto;flex-direction:row}
.nav__item{ position:relative; display:flex; align-items:center;flex-direction:row}
.nav__btn{ font-family:var(--font-display); font-size:1.0625rem; letter-spacing:.09em; text-transform:uppercase; padding:0 1rem; height:100%; border-bottom:2px solid transparent; display:flex; align-items:center; text-decoration:none;flex-direction:row}
.nav__item:hover .nav__btn,.nav__btn[aria-expanded="true"]{ color:var(--color-accent); border-bottom-color:var(--color-accent); }
.mega{ position:absolute; top:100%; left:50%; translate:-50% 0; width:min(860px,94vw);
  background:var(--color-surface); border:1px solid var(--color-rule); border-top:2px solid var(--color-accent);
  border-radius:0 0 var(--radius-lg) var(--radius-lg); padding:var(--space-m);
  display:none; grid-template-columns:1fr 1fr .9fr; gap:var(--space-m);
  box-shadow:0 24px 56px -28px rgba(20,19,18,.45); }
.nav__item:hover .mega,.nav__item:focus-within .mega{ display:grid; }
.mega h4{ font-size:1rem; letter-spacing:.1em; text-transform:uppercase; color:var(--color-muted); margin-bottom:var(--space-2xs); }
.mega__list{ display:flex; flex-direction:column; }
.mega__list .mega__a{ display:flex; align-items:baseline; justify-content:space-between; gap:var(--space-s); text-decoration:none; padding:.45rem 0; border-bottom:1px solid var(--color-rule-soft);flex-direction:row}
.mega__list .mega__a:last-child{ border-bottom:0; }
.mega__list .mega__a:hover{ color:var(--color-accent); }
.mega__list b{ font-family:var(--font-display); font-size:1.2rem; letter-spacing:.03em; text-transform:uppercase; }
.mega__list .num{ font-size:var(--text-s); color:var(--color-muted); }
.mega__feat p{ font-size:var(--text-s); color:var(--color-text-soft); line-height:1.55; margin-top:var(--space-2xs); }
.tools{ display:flex; align-items:center; gap:.15rem; flex:0 0 auto;flex-direction:row}
.tool{ width:46px; height:46px; display:grid; place-items:center; border-radius:var(--radius); position:relative; transition:background .2s ease,color .2s ease; }
.tool:hover{ background:var(--color-surface); color:var(--color-accent); }
.tool svg{ width:19px; height:19px; }
.badge{ position:absolute; top:6px; right:5px; min-width:18px; height:18px; padding:0 4px; border-radius:9px; background:var(--color-accent-solid); color:var(--color-on-accent); font-family:var(--font-mono); font-size:.5625rem; font-weight:600; display:grid; place-items:center; line-height:1; }
.burger{ display:none; }
.slider{ position:relative; background:var(--color-inverse); }
.slider__track{ position:relative; min-height:clamp(500px,60vh,660px); }
.slide{ position:absolute; inset:0; opacity:0; visibility:hidden; transition:opacity .6s ease,visibility .6s; }
.slide.is-on{ opacity:1; visibility:visible; position:relative; }
.slide__scrim{ position:absolute; inset:0; background:linear-gradient(96deg,rgba(20,19,18,.95) 0%,rgba(20,19,18,.78) 44%,rgba(20,19,18,.22) 80%,rgba(20,19,18,.06) 100%); }
.slide__in{ position:relative; z-index:2; min-height:clamp(500px,60vh,660px); display:flex; flex-direction:column; justify-content:center; padding-block:var(--space-xl) var(--space-2xl); max-width:660px; }
.slide__eyebrow{ display:flex; align-items:center; gap:.7rem; margin-bottom:var(--space-s);flex-direction:row}
.slide__eyebrow::before{ content:""; width:36px; height:2px; background:var(--color-accent-inv); flex:0 0 auto; }
.slide__eyebrow .eyebrow{ color:var(--color-accent-inv); }
.slide h1,.slide h2{ font-size:var(--text-3xl); text-transform:uppercase; color:var(--ink-50); }
.slide .accent{ color:var(--color-accent-inv); }
.slide p{ font-size:var(--text-l); line-height:1.5; color:var(--ink-300); font-weight:300; max-width:40ch; margin-top:var(--space-s); }
.slide__cta{ display:flex; flex-wrap:wrap; gap:var(--space-2xs); margin-top:var(--space-m);flex-direction:row}
.slide__specs{ display:flex; flex-wrap:wrap; gap:var(--space-m); margin-top:var(--space-m); padding-top:var(--space-s); border-top:1px solid rgba(249,137,2,.28);flex-direction:row}
.slide__specs div{ display:flex; flex-direction:column; gap:.2rem; }
.slide__specs .dt{ font-family:var(--font-mono); font-size:var(--text-xs); letter-spacing:.18em; text-transform:uppercase; color:var(--ink-400); }
.slide__specs .dd{ margin:0; font-family:var(--font-display); font-size:1.5rem; letter-spacing:.02em; color:var(--ink-50); }
.slider__ui{ position:absolute; left:0; right:0; bottom:0; z-index:5; border-top:1px solid rgba(249,137,2,.22); background:linear-gradient(to top,rgba(20,19,18,.88),transparent); }
.slider__ui-in{ display:flex; align-items:center; gap:var(--space-s); min-height:64px;flex-direction:row}
.dots{ display:flex; gap:var(--space-s); margin-right:auto;flex-direction:row}
.dot{ display:flex; align-items:center; gap:.55rem; padding:.5rem 0; min-height:44px; font-family:var(--font-mono); font-size:var(--text-xs); letter-spacing:.14em; text-transform:uppercase; color:var(--ink-400); transition:color .2s ease;flex-direction:row}
.dot i{ display:block; width:30px; height:2px; background:rgba(251,250,248,.28); transition:all .3s ease; }
.dot:hover{ color:var(--ink-50); }
.dot[aria-current="true"]{ color:var(--color-accent-inv); }
.dot[aria-current="true"] i{ background:var(--color-accent-inv); width:48px; }
.arrows{ display:flex; gap:.4rem;flex-direction:row}
.arrow{ width:46px; height:46px; display:grid; place-items:center; border-radius:var(--radius); border:1px solid rgba(251,250,248,.28); color:var(--ink-50); transition:all .2s ease; }
.arrow:hover{ background:var(--color-accent-inv); border-color:var(--color-accent-inv); color:var(--ink-950); }
.arrow svg{ width:17px; height:17px; }
.creds{ background:var(--color-inverse); color:var(--color-on-inverse); }
.creds__in{ display:grid; grid-template-columns:repeat(4,1fr); gap:1px; background:rgba(249,137,2,.2); }
.cred{ background:var(--color-inverse); padding:var(--space-m) var(--space-s); display:flex; flex-direction:column; gap:var(--space-3xs); }
.cred .eyebrow{ color:var(--color-accent-inv); }
.cred h3{ font-size:1.35rem; text-transform:uppercase; color:var(--ink-50); margin-block:var(--space-3xs); }
.cred p{ font-size:var(--text-s); line-height:1.55; color:var(--ink-400); }
.sect{ padding-block:var(--space-xl); }
.sect--tint{ background:var(--color-surface); }
.sect__head{ display:flex; flex-wrap:wrap; align-items:flex-end; justify-content:space-between; gap:var(--space-m); margin-bottom:var(--space-m);flex-direction:row}
.sect__head h2{ font-size:var(--text-2xl); text-transform:uppercase; max-width:20ch; margin-top:var(--space-2xs); }
.sect__head p{ max-width:46ch; color:var(--color-text-soft); }
.sect__head .eyebrow{ color:var(--color-accent); }
.grid{ display:grid; gap:var(--space-s); }
.grid--4{ grid-template-columns:repeat(4,1fr); }
.grid--3{ grid-template-columns:repeat(3,1fr); }
.grid--2{ grid-template-columns:repeat(2,1fr); }
.water{ position:relative; display:block; text-decoration:none; border-radius:var(--radius-lg); overflow:hidden; }
.water .ph{ border:0; transition:scale .5s cubic-bezier(.3,.7,.3,1); }
.water:hover .ph{ scale:1.04; }
.water__cap{ position:absolute; inset-inline:0; bottom:0; z-index:2; padding:var(--space-s); background:linear-gradient(to top,rgba(20,19,18,.92) 10%,rgba(20,19,18,.5) 58%,transparent 100%); display:flex; flex-direction:column; gap:.2rem; }
.water__cap h3{ font-size:1.85rem; text-transform:uppercase; color:var(--ink-50); transition:color .2s ease; }
.water:hover .water__cap h3{ color:var(--color-accent-inv); }
.water__cap span{ font-family:var(--font-mono); font-size:var(--text-xs); letter-spacing:.1em; color:var(--ink-300); }
.water__cap em{ font-family:var(--font-mono); font-style:normal; font-size:var(--text-xs); letter-spacing:.1em; color:var(--color-accent-inv); }
.card__media{ position:relative; }
.card__flag{ position:absolute; top:0; left:0; z-index:2; border-radius:0 0 var(--radius) 0; padding:.3rem .7rem; font-family:var(--font-mono); font-size:.625rem; font-weight:600; letter-spacing:.14em; text-transform:uppercase; background:var(--color-accent-solid); color:var(--color-on-accent); }
.card__flag--quiet{ background:var(--color-inverse); color:var(--color-on-inverse); }
.card h3{ font-size:1.4rem; text-transform:uppercase; transition:color .2s ease; }
.card:hover h3{ color:var(--color-accent); }
.card__price{ font-family:var(--font-mono); font-size:1.2rem; font-weight:600; font-variant-numeric:tabular-nums; }
.card__cta{ font-family:var(--font-display); font-size:.95rem; letter-spacing:.1em; text-transform:uppercase; color:var(--color-accent); }
.chart{ border:1px solid var(--color-rule); border-radius:var(--radius-lg); overflow:hidden; background:var(--color-bg); }
.chart__filters{ display:flex; flex-wrap:wrap; align-items:center; gap:.4rem; padding:var(--space-s); background:var(--color-surface-2); border-bottom:1px solid var(--color-rule);flex-direction:row}
.chart__filters .eyebrow{ margin-right:var(--space-2xs); }
.chip{ font-family:var(--font-mono); font-size:var(--text-s); font-weight:500; letter-spacing:.04em; padding:.5rem 1rem; min-height:40px; border-radius:20px; border:1px solid var(--color-rule); color:var(--color-text-soft); background:transparent; transition:all .2s ease; white-space:nowrap; }
.chip:hover{ border-color:var(--color-accent); color:var(--color-accent); }
.chip[aria-pressed="true"]{ background:var(--color-accent-solid); border-color:var(--color-accent-solid); color:var(--color-on-accent); font-weight:600; }
.chip span{ opacity:.65; margin-left:.35rem; }
.chart__scroll{ overflow-x:auto; }
.chart__grid{ min-width:940px; }
.rod-row{ display:grid;
  grid-template-columns:96px minmax(240px,1.4fr) minmax(140px,.9fr) minmax(150px,.9fr) 80px 110px 108px;
  gap:var(--space-s); align-items:center;
  padding:var(--space-s); border-bottom:1px solid var(--color-rule-soft);
  transition:background .2s ease; }
.rod-row:last-child{ border-bottom:0; }
.rod-row--head{ background:var(--color-surface); border-bottom:1px solid var(--color-rule); padding-block:var(--space-xs); }
.rod-row--head > span{ font-family:var(--font-mono); font-size:var(--text-xs); font-weight:600; letter-spacing:.14em; text-transform:uppercase; color:var(--color-muted); }
.rod-row:not(.rod-row--head):hover{ background:var(--color-surface); }
.rod-row.is-out{ display:none; }
.rod-row .ph{ border-radius:var(--radius); }
.rod-row__name{ display:flex; align-items:baseline; gap:var(--space-2xs); flex-wrap:wrap;flex-direction:row}
.rod-row__name h3{ font-size:1.4rem; text-transform:uppercase; }
.rod-row__desc{ font-size:var(--text-s); color:var(--color-muted); line-height:1.45; margin-top:.25rem; }
.rod-row__price{ text-align:right; }
.rod-row__price b{ font-family:var(--font-mono); font-size:1.2rem; font-weight:600; font-variant-numeric:tabular-nums; display:block; }
.rod-row__price span{ font-family:var(--font-mono); font-size:var(--text-xs); letter-spacing:.06em; text-transform:uppercase; color:var(--color-muted); }
.chart__empty{ display:none; padding:var(--space-xl); text-align:center; color:var(--color-muted); }
.chart__empty.is-on{ display:block; }
.chart__foot{ display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:var(--space-s); padding:var(--space-s); background:var(--color-surface-2); border-top:1px solid var(--color-rule);flex-direction:row}
.step{ display:flex; flex-direction:column; gap:var(--space-2xs); }
.step .ph{ border-radius:var(--radius-lg); margin-bottom:var(--space-3xs); }
.step__n{ font-family:var(--font-mono); font-size:var(--text-xs); font-weight:600; letter-spacing:.14em; text-transform:uppercase; color:var(--color-accent); border-bottom:1px solid var(--color-rule); padding-bottom:var(--space-2xs); }
.step h3{ font-size:1.4rem; text-transform:uppercase; margin-top:var(--space-3xs); }
.step p{ font-size:var(--text-s); color:var(--color-text-soft); line-height:1.6; }
.step em{ font-family:var(--font-mono); font-style:normal; font-size:var(--text-xs); letter-spacing:.08em; text-transform:uppercase; color:var(--color-accent); }
.band{ position:relative; background:var(--color-inverse); color:var(--color-on-inverse); }
.band__scrim{ position:absolute; inset:0; background:linear-gradient(94deg,rgba(20,19,18,.96) 0%,rgba(20,19,18,.82) 46%,rgba(20,19,18,.28) 100%); }
.band__in{ position:relative; z-index:2; padding-block:var(--space-2xl); max-width:660px; }
.band h2{ font-size:var(--text-2xl); text-transform:uppercase; color:var(--ink-50); margin-top:var(--space-2xs); }
.band .eyebrow{ color:var(--color-accent-inv); }
.band p{ color:var(--ink-300); font-weight:300; max-width:52ch; }
.band__terms{ margin:var(--space-m) 0 0; border-left:2px solid var(--color-accent-inv); padding-left:var(--space-s); display:flex; flex-direction:column; gap:var(--space-2xs); }
.band__terms > div{ display:grid; grid-template-columns:96px 1fr; gap:var(--space-s); align-items:baseline; }
.band__terms .dt{ font-family:var(--font-mono); font-size:var(--text-xs); letter-spacing:.12em; text-transform:uppercase; color:var(--color-accent-inv); }
.band__terms .dd{ margin:0; font-size:var(--text-s); color:var(--ink-300); line-height:1.55; }
.quote{ display:flex; flex-direction:column; border:1px solid var(--color-rule); border-radius:var(--radius-lg); overflow:hidden; background:var(--color-bg); }
.quote__body{ padding:var(--space-m); display:flex; flex-direction:column; gap:var(--space-s); flex:1; }
.stars{ display:flex; gap:2px; color:var(--color-accent);flex-direction:row}
.stars svg{ width:15px; height:15px; }
.quote blockquote{ margin:0; font-size:var(--text-l); line-height:1.45; font-weight:300; }
.quote figcaption{ margin-top:auto; padding-top:var(--space-xs); border-top:1px solid var(--color-rule-soft); }
.quote figcaption b{ font-family:var(--font-display); font-size:1.2rem; letter-spacing:.04em; text-transform:uppercase; display:block; }
.half{ display:flex; flex-direction:column; border:1px solid var(--color-rule); border-radius:var(--radius-lg); overflow:hidden; background:var(--color-bg); }
.half__body{ padding:var(--space-m); display:flex; flex-direction:column; gap:var(--space-s); flex:1; }
.half h3{ font-size:clamp(1.8rem,3vw,2.3rem); text-transform:uppercase; }
.half p{ color:var(--color-text-soft); }
.half ul{ margin:0; padding:0; list-style:none; display:flex; flex-direction:column; gap:.55rem; }
.half li{ display:flex; gap:var(--space-2xs); font-size:var(--text-s); align-items:baseline;flex-direction:row}
.half li::before{ content:""; width:6px; height:6px; border-radius:1px; background:var(--color-accent); flex:0 0 auto; translate:0 -2px; }
.half .button{ align-self:flex-start; margin-top:auto; }
.post{ display:flex; flex-direction:column; gap:var(--space-2xs); text-decoration:none; }
.post .ph{ border-radius:var(--radius-lg); margin-bottom:var(--space-3xs); }
.post h3{ font-size:1.5rem; text-transform:uppercase; transition:color .2s ease; }
.post:hover h3{ color:var(--color-accent); }
.post p{ font-size:var(--text-s); color:var(--color-text-soft); }
.newsletter{ background:var(--color-inverse); color:var(--color-on-inverse); }
.newsletter__in{ padding-block:var(--space-xl); display:grid; grid-template-columns:minmax(0,1fr) minmax(330px,auto); gap:var(--space-m); align-items:center; }
.newsletter h2{ font-size:var(--text-2xl); text-transform:uppercase; color:var(--ink-50); margin-top:var(--space-2xs); }
.newsletter .eyebrow{ color:var(--color-accent-inv); }
.newsletter p{ color:var(--ink-400); font-size:var(--text-s); margin-top:var(--space-2xs); max-width:46ch; }
.newsletter form{ display:flex; gap:var(--space-2xs); flex-wrap:wrap;flex-direction:row}
.newsletter label{ position:absolute; width:1px; height:1px; overflow:hidden; clip:rect(0 0 0 0); }
.newsletter input{ flex:1; min-width:210px; min-height:48px; padding:.75rem 1rem; border-radius:var(--radius); font-family:var(--font-mono); font-size:var(--text-s); background:#000; color:var(--ink-50); border:1px solid #3F3C39; }
.newsletter input::placeholder{ color:var(--ink-500); }
.newsletter input:focus-visible{ outline:2px solid var(--color-accent-inv); outline-offset:1px; }
.ftr{ background:var(--color-inverse); color:var(--color-on-inverse); border-top:1px solid #332F2C; }
.ftr__top{ display:grid; grid-template-columns:1.5fr repeat(3,1fr); gap:var(--space-m); padding-block:var(--space-xl); }
.ftr h4{ font-family:var(--font-mono); font-size:var(--text-xs); font-weight:600; letter-spacing:.16em; text-transform:uppercase; color:var(--color-accent-inv); margin-bottom:var(--space-s); }
.ftr ul{ margin:0; padding:0; list-style:none; display:flex; flex-direction:column; gap:.5rem; }
.ftr a{ color:var(--ink-400); text-decoration:none; font-size:var(--text-s); }
.ftr a:hover{ color:var(--color-accent-inv); }
.ftr__brand p{ color:var(--ink-500); font-size:var(--text-s); max-width:32ch; margin-top:var(--space-s); }
.ftr__phone{ font-family:var(--font-display); font-size:2.1rem; color:var(--ink-50); text-decoration:none; display:block; margin-top:var(--space-s); letter-spacing:.02em; }
.ftr__phone:hover{ color:var(--color-accent-inv); }
.ftr__addr{ font-family:var(--font-mono); font-size:var(--text-xs); line-height:1.7; color:var(--ink-500); margin-top:var(--space-2xs); }
.ftr__bar{ border-top:1px solid rgba(249,137,2,.16); padding-block:var(--space-s); display:flex; flex-wrap:wrap; justify-content:space-between; gap:var(--space-s); font-family:var(--font-mono); font-size:var(--text-xs); color:var(--ink-500);flex-direction:row}
.scrim{ position:fixed; inset:0; z-index:90; background:rgba(20,19,18,.6); opacity:0; pointer-events:none; transition:opacity .25s ease; }
.scrim.is-on{ opacity:1; pointer-events:auto; }
.drawer{ position:fixed; top:0; right:0; bottom:0; z-index:100; width:min(420px,100%); background:var(--color-bg); border-left:1px solid var(--color-rule); translate:100% 0; transition:translate .3s cubic-bezier(.4,.02,.2,1); display:flex; flex-direction:column; }
.drawer.is-on{ translate:0 0; }
.drawer__hd{ display:flex; align-items:center; justify-content:space-between; padding:var(--space-s); border-bottom:1px solid var(--color-rule);flex-direction:row}
.drawer__hd b{ font-family:var(--font-display); font-size:1.5rem; letter-spacing:.05em; text-transform:uppercase; }
.drawer__body{ flex:1; overflow-y:auto; padding:var(--space-s); display:flex; flex-direction:column; gap:var(--space-s); }
.line{ display:grid; grid-template-columns:64px minmax(0,1fr) auto; gap:.3rem var(--space-2xs); align-items:start; padding-bottom:var(--space-s); border-bottom:1px solid var(--color-rule-soft); }
.line .ph{ grid-row:1/3; border-radius:var(--radius); }
.line b{ font-family:var(--font-display); font-size:1.15rem; letter-spacing:.03em; text-transform:uppercase; }
.line__price{ font-family:var(--font-mono); font-weight:600; font-variant-numeric:tabular-nums; }
.line .spec{ grid-column:2/4; }
.drawer__ft{ border-top:1px solid var(--color-rule); padding:var(--space-s); display:flex; flex-direction:column; gap:var(--space-2xs); background:var(--color-surface); }
.total{ display:flex; justify-content:space-between; align-items:baseline; font-family:var(--font-mono); font-variant-numeric:tabular-nums;flex-direction:row}
.total b{ font-size:1.5rem; font-weight:600; }
.drawer__note{ font-family:var(--font-mono); font-size:var(--text-xs); color:var(--color-muted); text-align:center; }
@media (max-width:1279px){
.grid--4{ grid-template-columns:repeat(2,1fr); }
  .creds__in{ grid-template-columns:repeat(2,1fr); }
}
@media (max-width:991px){
.nav{ display:none; }
  .burger{ display:grid; }
  .slide__in{ max-width:none; }
  .ftr__top{ grid-template-columns:1fr 1fr; }
  .grid--3{ grid-template-columns:1fr; }
  .newsletter__in{ grid-template-columns:1fr; }
}
@media (max-width:767px){
.grid--2{ grid-template-columns:1fr; }
  .util__push{ margin-left:0; }
  .slide__scrim{ background:linear-gradient(180deg,rgba(20,19,18,.5) 0%,rgba(20,19,18,.9) 55%,rgba(20,19,18,.96) 100%); }
  .dot span{ display:none; }
  .band__in{ padding-block:var(--space-xl); }
}
@media (max-width:478px){
.grid--4{ grid-template-columns:1fr; }
  .creds__in{ grid-template-columns:1fr; }
  .ftr__top{ grid-template-columns:1fr; }
  .slide h1,.slide h2{ font-size:2.5rem; }
  .band__terms > div{ grid-template-columns:1fr; gap:.2rem; }
}
@media (prefers-reduced-motion:reduce){
*{ transition-duration:.01ms !important; animation-duration:.01ms !important; }
  .water .ph{ transition:none; }
}
.nav a[aria-current="page"],.nav__btn[aria-current="page"]{ color:var(--sfr-green); border-bottom-color:var(--sfr-green); }
.sect--cork{ background:var(--color-surface-warm); }
.sect--cork .eyebrow,.sect--cork .step__n{ color:var(--color-warm-label); }
.sect--cork .step__n{ border-bottom-color:var(--color-rule-warm); }
.sect--cork .ph{ border-color:var(--color-rule-warm); }
@media (max-width:478px){
.hdr__in{ gap:var(--space-xs); }
  .mark em{ display:none; }
  .tools{ gap:0; }
  .tool{ width:42px; }
}
@media (max-width:380px){
.mark{ gap:.5rem; } .mark b{ font-size:1.55rem; }
}
@media (max-width:767px){
.chart__scroll{ overflow-x:visible; }
  .chart__grid{ min-width:0; }
  .rod-row--head{ display:none; }
  .rod-row{ grid-template-columns:64px minmax(0,1fr) auto; gap:.55rem var(--space-xs); align-items:start; }
  .rod-row > [data-label]{ grid-column:1/-1; position:relative; padding-left:8.2rem; min-height:1.4rem; }
  .rod-row > [data-label]::before{ content:attr(data-label); position:absolute; left:0; top:.1rem;
    font-family:var(--font-mono); font-size:.6875rem; font-weight:600; letter-spacing:.12em; text-transform:uppercase; color:var(--color-muted); }
  .rod-row__price{ grid-column:1/3; text-align:left; display:flex; align-items:baseline; gap:.6rem; padding-top:.35rem;flex-direction:row}
  .rod-row > :last-child{ grid-column:3; align-self:center; }
  .rod-row > :nth-child(2){ grid-column:2/-1; }
  .rod-row__name h3{ font-size:1.3rem; }
}
.burger{ display:none; }
@media (max-width:991px){
.burger{ display:grid; }
}
@media (max-width:478px){
.mark em{ display:none; }
}
.mnav-scrim{ position:fixed; inset:0; z-index:90; background:rgba(20,19,18,.6); opacity:0; pointer-events:none; transition:opacity .25s ease; }
.mnav-scrim.is-on{ opacity:1; pointer-events:auto; }
.mnav{ position:fixed; top:0; right:0; bottom:0; z-index:100; width:min(360px,88vw); background:var(--color-bg); color:var(--color-text); border-left:1px solid var(--color-rule); translate:100% 0; visibility:hidden; transition:translate .3s cubic-bezier(.4,.02,.2,1),visibility .3s; display:flex; flex-direction:column; }
.mnav.is-on{ translate:0 0; visibility:visible; transition:translate .3s cubic-bezier(.4,.02,.2,1),visibility 0s; }
.mnav__hd{ display:flex; align-items:center; justify-content:space-between; padding:var(--space-s); border-bottom:1px solid var(--color-rule);flex-direction:row}
.mnav__hd b{ font-family:var(--font-display); font-size:1.5rem; letter-spacing:.05em; text-transform:uppercase; }
.mnav__close{ width:46px; height:46px; display:grid; place-items:center; }
.mnav__close svg{ width:20px; height:20px; }
.mnav__body{ flex:1; overflow-y:auto; padding:var(--space-2xs) var(--space-s) var(--space-s); }
.mnav__group{ padding-block:var(--space-xs); border-bottom:1px solid var(--color-rule-soft); }
.mnav__label{ display:block; font-family:var(--font-mono); font-size:.75rem; font-weight:600; letter-spacing:.16em; text-transform:uppercase; color:var(--color-muted); margin-bottom:.25rem; }
.mnav a{ display:flex; align-items:center; min-height:48px; text-decoration:none; font-family:var(--font-display); font-size:1.35rem; letter-spacing:.05em; text-transform:uppercase;flex-direction:row}
.mnav__group a{ font-size:1.15rem; min-height:44px; }
.mnav__top{ border-bottom:1px solid var(--color-rule-soft); }
.mnav a:hover{ color:var(--color-accent); }
.mnav a[aria-current="page"]{ color:var(--sfr-green); }
.mnav__ft{ border-top:1px solid var(--color-rule); padding:var(--space-s); background:var(--color-surface); }
.mnav__ft span{ display:block; font-family:var(--font-mono); font-size:.75rem; letter-spacing:.14em; text-transform:uppercase; color:var(--color-muted); }
.mnav__ft a{ font-size:1.7rem; min-height:44px; }
body.mnav-open{ overflow:hidden; }

/* ── from sawgrass-product-single (rules the home master lacks) ── */
.button--block{ width:100%; }
.nav a{ font-family:var(--font-display); font-size:1.0625rem; letter-spacing:.09em; text-transform:uppercase; padding:.6rem 1rem; text-decoration:none; border-bottom:2px solid transparent; }
.nav a:hover,.nav a[aria-current="page"]{ color:var(--color-accent); border-bottom-color:var(--color-accent); }
.crumbs{ display:flex; gap:.5rem; align-items:center; flex-wrap:wrap; padding-block:var(--space-s);flex-direction:row}
.crumbs a{ text-decoration:none; }
.crumbs a:hover{ color:var(--color-accent); }
.crumbs span[aria-hidden]{ opacity:.5; }
.pdp{ display:grid; grid-template-columns:minmax(0,1.15fr) minmax(380px,.85fr); gap:var(--space-xl); align-items:start; padding-bottom:var(--space-xl); }
.gallery{ display:flex; flex-direction:column; gap:var(--space-2xs); position:sticky; top:96px; }
.gallery__main{ border-radius:var(--radius-lg); }
.gallery__thumbs{ display:grid; grid-template-columns:repeat(5,1fr); gap:var(--space-2xs); }
.gallery__thumb{ border-radius:var(--radius); border:1px solid var(--color-rule); overflow:hidden; padding:0; background:none; transition:border-color .2s ease; }
.gallery__thumb .ph{ border:0; }
.gallery__thumb[aria-current="true"]{ border-color:var(--color-accent); border-width:2px; }
.gallery__thumb:hover{ border-color:var(--color-accent); }
.buy{ display:flex; flex-direction:column; gap:var(--space-s); }
.buy__head{ display:flex; flex-direction:column; gap:var(--space-2xs); }
.buy h1{ font-size:var(--text-3xl); text-transform:uppercase; }
.buy__flags{ display:flex; gap:.4rem; flex-wrap:wrap;flex-direction:row}
.buy__price{ display:flex; align-items:baseline; gap:var(--space-2xs); flex-wrap:wrap;flex-direction:row}
.buy__price b{ font-family:var(--font-mono); font-size:2rem; font-weight:600; font-variant-numeric:tabular-nums; line-height:1; }
.buy__sku{ font-family:var(--font-mono); font-size:var(--text-xs); letter-spacing:.08em; color:var(--color-muted); }
.buy__lede{ color:var(--color-text-soft); }
.opt{ display:flex; flex-direction:column; gap:var(--space-2xs); }
.opt__label{ display:flex; align-items:baseline; justify-content:space-between; gap:var(--space-s);flex-direction:row}
.opt__label b{ font-family:var(--font-mono); font-size:var(--text-xs); font-weight:600; letter-spacing:.16em; text-transform:uppercase; color:var(--color-muted); }
.opt__label span{ font-family:var(--font-mono); font-size:var(--text-s); color:var(--color-text); }
.opt__row{ display:flex; gap:.4rem; flex-wrap:wrap;flex-direction:row}
.opt__btn{ font-family:var(--font-mono); font-size:var(--text-s); font-weight:500; letter-spacing:.04em;
  padding:.6rem 1rem; min-height:44px; min-width:56px; border-radius:var(--radius);
  border:1px solid var(--color-rule); color:var(--color-text-soft); background:transparent;
  transition:all .2s ease; position:relative; }
.opt__btn:hover:not(:disabled){ border-color:var(--color-accent); color:var(--color-accent); }
.opt__btn[aria-pressed="true"]{ background:var(--color-accent); border-color:var(--color-accent); color:var(--color-on-accent); font-weight:600; }
.opt__btn:disabled{ opacity:.32; cursor:not-allowed; text-decoration:line-through; }
.opt__note{ font-family:var(--font-mono); font-size:var(--text-xs); color:var(--color-muted); }
.livespec{ border:1px solid var(--color-rule); border-radius:var(--radius-lg); background:var(--color-surface); overflow:hidden; }
.livespec__row{ display:grid; grid-template-columns:126px minmax(0,1fr); gap:var(--space-s); padding:.6rem var(--space-s); border-bottom:1px solid var(--color-rule-soft); align-items:center; }
.livespec__row:last-child{ border-bottom:0; }
.livespec__row .dt{ font-family:var(--font-mono); font-size:var(--text-xs); letter-spacing:.12em; text-transform:uppercase; color:var(--color-muted); }
.livespec__row .dd{ margin:0; font-family:var(--font-mono); font-size:var(--text-s); font-variant-numeric:tabular-nums; }
.stock{ display:flex; align-items:center; gap:var(--space-2xs); font-family:var(--font-mono); font-size:var(--text-s); color:var(--color-ok);flex-direction:row}
.stock::before{ content:""; width:8px; height:8px; border-radius:50%; background:var(--color-ok); flex:0 0 auto; }
.reassure{ display:flex; flex-direction:column; gap:var(--space-2xs); border-top:1px solid var(--color-rule); padding-top:var(--space-s); }
.reassure div{ display:flex; gap:var(--space-2xs); align-items:flex-start; font-size:var(--text-s); color:var(--color-text-soft); line-height:1.5;flex-direction:row}
.reassure svg{ width:17px; height:17px; flex:0 0 auto; color:var(--color-accent); margin-top:2px; }
.qty{ display:flex; align-items:stretch; border:1px solid var(--color-rule); border-radius:var(--radius); overflow:hidden; flex:0 0 auto;flex-direction:row}
.qty button,.qty [role="button"]{ width:46px; display:grid; place-items:center; font-family:var(--font-mono); font-size:1.1rem; transition:background .2s ease; }
.qty button:hover,.qty [role="button"]:hover{ background:var(--color-surface-2); }
.qty input{ width:52px; text-align:center; border:0; border-inline:1px solid var(--color-rule); background:transparent; color:var(--color-text); font-family:var(--font-mono); font-variant-numeric:tabular-nums; font-size:var(--text-m); }
.qty input::-webkit-outer-spin-button,.qty input::-webkit-inner-spin-button{ -webkit-appearance:none; margin:0; }
.qty input[type=number]{ -moz-appearance:textfield; }
.prose{ max-width:68ch; display:flex; flex-direction:column; gap:var(--space-s); }
.prose p{ line-height:1.7; }
.prose h3{ font-size:var(--text-xl); text-transform:uppercase; margin-top:var(--space-2xs); }
.buybar{ position:fixed; left:0; right:0; bottom:0; z-index:70; display:none; gap:var(--space-2xs); align-items:center; padding:var(--space-2xs) var(--gutter); background:color-mix(in srgb,var(--color-bg) 96%,transparent); backdrop-filter:blur(12px); border-top:1px solid var(--color-rule); }
.buybar b{ font-family:var(--font-mono); font-size:1.2rem; font-weight:600; font-variant-numeric:tabular-nums; }
.buybar .button{ margin-left:auto; }
@media (max-width:991px){
  .nav{ display:none; }
  .pdp{ grid-template-columns:1fr; gap:var(--space-l); }
  .gallery{ position:static; }
  .grid--3{ grid-template-columns:1fr; }
  .ftr__top{ grid-template-columns:1fr 1fr; }
  .buybar{ display:flex;flex-direction:row}
  body{ padding-bottom:76px; }
}
@media (max-width:478px){
  .grid--4{ grid-template-columns:1fr; }
  .ftr__top{ grid-template-columns:1fr; }
  .gallery__thumbs{ grid-template-columns:repeat(5,1fr); }
  .livespec__row{ grid-template-columns:1fr; gap:.15rem; }
  .band__terms > div{ grid-template-columns:1fr; gap:.2rem; }
}
@media (max-width:478px){
  .hdr__in{ gap:var(--space-xs); }
  .tools{ gap:0; }
  .tool{ width:42px; }
}

/* ── from sawgrass-page-standard (rules the home master lacks) ── */
.container--narrow{ max-width:var(--shell-narrow); }
.page-hero{ border-bottom:1px solid var(--color-rule); padding-block:var(--space-l) var(--space-m); background:linear-gradient(180deg,var(--color-surface) 0%,var(--color-bg) 100%); }
.page-hero h1{ font-size:var(--text-3xl); text-transform:uppercase; max-width:16ch; }
.page-hero__lede{ font-size:var(--text-l); line-height:1.5; color:var(--color-text-soft); max-width:52ch; margin-top:var(--space-s); font-weight:300; }
.page-body{ display:grid; grid-template-columns:minmax(0,1fr) 240px; gap:var(--space-xl); align-items:start; padding-block:var(--space-xl); }
.toc{ position:sticky; top:104px; border-left:1px solid var(--color-rule); padding-left:var(--space-s); display:flex; flex-direction:column; gap:.15rem; }
.toc__title{ margin-bottom:var(--space-2xs); }
.toc a{ text-decoration:none; font-size:var(--text-s); color:var(--color-text-soft); padding:.35rem 0; border-bottom:1px solid var(--color-rule-soft); }
.toc a:last-of-type{ border-bottom:0; }
.toc a:hover{ color:var(--color-accent); }
.prose h2{ font-size:var(--text-2xl); text-transform:uppercase; margin-top:var(--space-m); scroll-margin-top:104px; }
.prose h2:first-child{ margin-top:0; }
.prose ul,.prose ol{ margin:0; padding-left:1.3rem; display:flex; flex-direction:column; gap:.5rem; }
.prose li{ line-height:1.6; }
.prose li::marker{ color:var(--color-accent); }
.prose strong{ font-weight:500; }
.prose a{ color:var(--color-accent); text-underline-offset:3px; }
.pull-quote{ margin:var(--space-s) 0; border-left:2px solid var(--color-accent); padding-left:var(--space-m); font-size:var(--text-xl); line-height:1.35; font-weight:300; font-style:italic; color:var(--color-text); }
.pull-quote cite{ display:block; font-family:var(--font-mono); font-style:normal; font-size:var(--text-xs); letter-spacing:.12em; text-transform:uppercase; color:var(--color-muted); margin-top:var(--space-xs); }
.figure-note{ font-family:var(--font-mono); font-size:var(--text-xs); letter-spacing:.05em; color:var(--color-muted); margin-top:var(--space-2xs); line-height:1.55; }
.callout{ border:1px solid var(--color-rule); border-left:2px solid var(--color-accent); background:var(--color-surface); padding:var(--space-s); display:flex; flex-direction:column; gap:var(--space-2xs); }
.callout b{ font-family:var(--font-mono); font-size:var(--text-xs); letter-spacing:.12em; text-transform:uppercase; color:var(--color-accent); }
.callout p{ font-size:var(--text-s); color:var(--color-text-soft); line-height:1.6; }
.tbl-wrap{ overflow-x:auto; border:1px solid var(--color-rule); }
table.tbl{ width:100%; border-collapse:collapse; min-width:600px; background:var(--color-surface); }
table.tbl th{ text-align:left; padding:var(--space-2xs) var(--space-xs); font-family:var(--font-mono); font-size:var(--text-xs); font-weight:600; letter-spacing:.14em; text-transform:uppercase; color:var(--color-muted); border-bottom:1px solid var(--color-rule); background:var(--color-surface-2); }
table.tbl td{ padding:var(--space-xs); border-bottom:1px solid var(--color-rule-soft); vertical-align:top; font-size:var(--text-s); }
table.tbl tr:last-child td{ border-bottom:0; }
table.tbl td:first-child{ font-family:var(--font-display); font-weight:400; font-size:1.15rem; text-transform:uppercase; letter-spacing:.04em; }
.faq{ display:flex; flex-direction:column; border-top:1px solid var(--color-rule); }
.faq__item{ border-bottom:1px solid var(--color-rule); }
.faq__item summary{ list-style:none; cursor:pointer; display:flex; align-items:center; justify-content:space-between; gap:var(--space-s); padding:var(--space-s) 0; font-family:var(--font-display); font-weight:400; font-size:1.35rem; text-transform:uppercase; letter-spacing:.03em; min-height:44px;flex-direction:row}
.faq__item summary::-webkit-details-marker{ display:none; }
.faq__item summary:hover{ color:var(--color-accent); }
.faq__item summary::after{ content:"+"; font-family:var(--font-mono); font-size:1.5rem; font-weight:400; color:var(--color-accent); line-height:1; flex:0 0 auto; }
.faq__item[open] summary::after{ content:"\2013"; }
.faq__answer{ padding-bottom:var(--space-s); font-size:var(--text-s); line-height:1.68; color:var(--color-text-soft); max-width:66ch; }
.cta-band{ background:var(--color-inverse); color:var(--color-on-inverse); border-block:1px solid var(--color-rule); }
.cta-band__in{ padding-block:var(--space-xl); display:grid; grid-template-columns:minmax(0,1fr) auto; gap:var(--space-m); align-items:center; }
.cta-band h2{ font-size:var(--text-2xl); text-transform:uppercase; color:var(--color-on-inverse); }
.cta-band p{ color:#B4BDB4; max-width:48ch; margin-top:var(--space-2xs); font-weight:300; }
.cta-band .eyebrow{ color:var(--sfr-orange); }
.related{ display:grid; grid-template-columns:repeat(3,1fr); gap:var(--space-m); }
.related a{ display:flex; flex-direction:column; gap:var(--space-2xs); text-decoration:none; padding-top:var(--space-2xs); border-top:2px solid var(--color-text); }
.related a:hover h3{ color:var(--color-accent); }
.related h3{ font-size:var(--text-xl); text-transform:uppercase; }
.related p{ font-size:var(--text-s); color:var(--color-text-soft); }
@media (max-width:1080px){
  .page-body{ grid-template-columns:minmax(0,1fr); }
  .toc{ position:static; border-left:0; border-top:1px solid var(--color-rule); padding-left:0; padding-top:var(--space-s); order:-1; }
  .ftr__top{ grid-template-columns:1fr 1fr; }
}
@media (max-width:860px){
  .nav{ display:none; }
  .related{ grid-template-columns:1fr; }
  .cta-band__in,.newsletter{ grid-template-columns:1fr; }
}
@media (max-width:560px){
  .ftr__top{ grid-template-columns:1fr; }
}
@media (max-width:860px){
  .burger{ display:grid; }
}
.mnav a,.mnav__hd b{ font-weight:400; }
@media (max-width:640px){
  .tbl-wrap{ overflow-x:visible; border:0; }
  table.tbl{ min-width:0; background:none; }
  table.tbl thead{ position:absolute; width:1px; height:1px; overflow:hidden; clip:rect(0 0 0 0); }
  table.tbl, table.tbl tbody, table.tbl tr, table.tbl td{ display:block; width:100%; }
  table.tbl tr{ border:1px solid var(--color-rule); background:var(--color-surface); padding:var(--space-xs); margin-bottom:var(--space-2xs); }
  table.tbl td{ border:0; padding:.2rem 0 .2rem 7.4rem; position:relative; }
  table.tbl td::before{ content:attr(data-label); position:absolute; left:0; top:.3rem; font-family:var(--font-mono); font-size:.6875rem; font-weight:600; letter-spacing:.12em; text-transform:uppercase; color:var(--color-muted); }
  table.tbl td:first-child{ padding-left:0; font-size:1.35rem; margin-bottom:.2rem; }
  table.tbl td:first-child::before{ content:none; }
}

/* ── from sawgrass-post-single (rules the home master lacks) ── */
.tag--accent{ border-color:var(--color-accent); color:var(--color-accent); }
.post-hero{ padding-block:var(--space-l) var(--space-m); border-bottom:1px solid var(--color-rule); }
.post-hero h1{ font-size:var(--text-3xl); text-transform:uppercase; max-width:20ch; }
.post-hero__lede{ font-size:var(--text-l); line-height:1.5; color:var(--color-text-soft); max-width:56ch; margin-top:var(--space-s); font-weight:300; }
.post-meta{ display:flex; align-items:center; gap:var(--space-s); flex-wrap:wrap; margin-top:var(--space-m); padding-top:var(--space-s); border-top:1px solid var(--color-rule);flex-direction:row}
.byline{ display:flex; align-items:center; gap:var(--space-2xs);flex-direction:row}
.byline__avatar{ width:44px; height:44px; flex:0 0 auto; }
.byline__name{ font-family:var(--font-display); font-weight:400; font-size:1.15rem; letter-spacing:.05em; text-transform:uppercase; line-height:1.1; display:block; }
.byline__role{ font-family:var(--font-mono); font-size:var(--text-xs); letter-spacing:.1em; color:var(--color-muted); }
.post-meta__dot{ color:var(--color-rule); }
.share{ display:flex; gap:.25rem; margin-left:auto; align-items:center;flex-direction:row}
.share .eyebrow{ margin-right:var(--space-3xs); }
.share button,.share [role="button"]{ width:44px; height:44px; display:grid; place-items:center; border:1px solid var(--color-rule); transition:all .16s ease; }
.share button:hover,.share [role="button"]:hover{ background:var(--color-accent); border-color:var(--color-accent); color:#FFF6EC; }
.share svg{ width:17px; height:17px; }
.post-lead{ padding-block:var(--space-m); }
.post-body{ padding-block:var(--space-m) var(--space-xl); }
.prose > p:first-of-type{ font-size:var(--text-l); line-height:1.55; font-weight:300; color:var(--color-text); }
.prose__wide{ width:min(var(--shell), 100vw - (2 * var(--gutter))); margin-inline:calc(50% - min(var(--shell),100vw - (2 * var(--gutter))) / 2); }
.inline-buy{ border:1px solid var(--color-rule); background:var(--color-surface); display:grid; grid-template-columns:200px minmax(0,1fr); gap:0; margin-block:var(--space-m); }
.inline-buy__body{ padding:var(--space-s); display:flex; flex-direction:column; gap:var(--space-2xs); }
.inline-buy h3{ font-size:var(--text-xl); text-transform:uppercase; }
.inline-buy__foot{ margin-top:auto; padding-top:var(--space-xs); border-top:1px solid var(--color-rule-soft); display:flex; align-items:center; justify-content:space-between; gap:var(--space-s); flex-wrap:wrap;flex-direction:row}
.inline-buy__price{ font-family:var(--font-mono); font-size:1.5rem; font-weight:600; font-variant-numeric:tabular-nums; }
.author{ border-top:1px solid var(--color-rule); border-bottom:1px solid var(--color-rule); padding-block:var(--space-m); display:grid; grid-template-columns:96px minmax(0,1fr); gap:var(--space-s); align-items:start; max-width:68ch; margin-inline:auto; }
.author h3{ font-size:var(--text-xl); text-transform:uppercase; }
.author p{ font-size:var(--text-s); color:var(--color-text-soft); line-height:1.65; margin-top:var(--space-3xs); }
.post-nav{ display:grid; grid-template-columns:1fr 1fr; gap:var(--space-s); max-width:68ch; margin-inline:auto; margin-top:var(--space-m); }
.post-nav a{ border:1px solid var(--color-rule); padding:var(--space-s); text-decoration:none; display:flex; flex-direction:column; gap:var(--space-3xs); }
.post-nav a:hover{ border-color:var(--color-accent); }
.post-nav a:hover b{ color:var(--color-accent); }
.post-nav b{ font-family:var(--font-display); font-weight:400; font-size:1.2rem; text-transform:uppercase; letter-spacing:.04em; }
.post-nav--next{ text-align:right; align-items:flex-end; }
@media (max-width:860px){
  .newsletter__in{ grid-template-columns:1fr; }
  .inline-buy{ grid-template-columns:1fr; }
  .share{ margin-left:0; width:100%; }
  .post-nav{ grid-template-columns:1fr; }
  .post-nav--next{ text-align:left; align-items:flex-start; }
}
@media (max-width:560px){
  .author{ grid-template-columns:1fr; }
}

/* a .ph slot that has had real photography placed into it */
.ph--has-img{ background:none !important; background-image:none !important; border:0 !important; }
.ph--has-img::before,.ph--has-img::after{ display:none !important; }
.ph--has-img img{ width:100%; height:100%; object-fit:cover; display:block; }

/* ── site additions (build-demo.py) ── */


.review-flag{display:inline-block;background:#FFF1DC;border:1px solid var(--color-accent);color:#141312;font-family:var(--font-mono);font-size:.72rem;letter-spacing:.06em;padding:.15rem .45rem;border-radius:2px;margin:0 0 var(--space-xs)}
.prose img{max-width:100%;height:auto}
.card__media .ph--has-img img,.mega__feat .ph--has-img img,.line .ph--has-img img{object-fit:contain;background:#fff}
.card__media .ph--has-img{background:#fff !important}
.prose ul,.prose ol{padding-left:1.25rem}
.prose li{margin:.35rem 0}

.contact{display:grid;grid-template-columns:minmax(0,1.4fr) minmax(0,1fr);gap:var(--space-xl);align-items:start}
.contact__form{display:grid;gap:.4rem}
.contact__form label{font-family:var(--font-mono);font-size:.78rem;letter-spacing:.1em;text-transform:uppercase;color:var(--color-muted);margin-top:.6rem}
.contact__form input,.contact__form select,.contact__form textarea{font:inherit;padding:.8rem .9rem;border:1px solid var(--color-rule);background:var(--color-surface,#fff);border-radius:var(--radius,2px);width:100%}
.contact__form input:focus-visible,.contact__form select:focus-visible,.contact__form textarea:focus-visible{outline:2px solid var(--color-accent);outline-offset:1px}
.contact__form button,.contact__form [role="button"]{margin-top:var(--space-s);justify-self:start}
.contact__info{display:grid;gap:var(--space-m);border-left:1px solid var(--color-rule);padding-left:var(--space-l)}
.contact__info p{margin:.3rem 0 0}
.contact__big{font-family:var(--font-display);font-size:2.2rem;text-decoration:none;display:block;margin-top:.2rem}
@media (max-width:767px){.contact{grid-template-columns:1fr}.contact__info{border-left:0;padding-left:0;border-top:1px solid var(--color-rule);padding-top:var(--space-m)}}


/* ═══════════════ BRICKS LAYER (build-bricks-kit.py): the SOP traps, fixed up front ═══════════════ */
/* trap 2 is fixed in place above: 45 flex rules carry flex-direction:row */
/* Bricks caps every element at max-width:100%: positioned demo elements with their own width (5) keep it */
.drawer,.mega,.mnav,.newsletter label,table.tbl thead{max-width:none}
/* trap 9: the importer splits "text + inline label" into block siblings; keep the known ones inline */
.chip>*,.card__foot>.card__price,.tag,.util__push>*{display:inline}
.util__push>a{margin-left:.35em}   /* the importer trims the space between "Collins —" and the phone link */
/* trap 10: grid children need min-width:0 or long words blow the grid out */
.arrow>*,.author>*,.badge>*,.band__terms > div>*,.burger>*,.contact>*,.contact__form>*,.contact__info>*,.creds__in>*,.cta-band__in>*,.ftr__top>*,.gallery__thumbs>*,.grid>*,.inline-buy>*,.line>*,.livespec__row>*,.mnav__close>*,.newsletter__in>*,.page-body>*,.pdp>*,.ph>*,.post-nav>*,.qty [role="button"]>*,.qty button>*,.related>*,.rod-row>*,.share [role="button"]>*,.share button>*,.tool>*{min-width:0}
/* Rod Chart thumbnails: photos fill the square */
.rod-row .ph--has-img img{object-fit:cover}
/* hero slider swipe (sawgrass-effects.js): the browser keeps vertical scrolling, horizontal drags go to the slider */
.slider{touch-action:pan-y;overflow-x:clip}
/* slide change = fade + right-to-left move (direction set per change by sawgrass-effects.js) */
.slide{transition:opacity .7s ease,visibility .7s,transform .7s cubic-bezier(.22,.61,.36,1)}
@media (prefers-reduced-motion:reduce){.slide{transition:opacity .3s,visibility .3s}}
/* phones (Richard 2026-09-27): slider + Touch-to-Trust photos stack ABOVE their text instead of sitting under it, each framed
   on its subject (WIDE_PHOTOS). Slides share one grid cell so the slider keeps the tallest slide's height (no jump on change). */
@media (max-width:767px){
.slider__track{display:grid;min-height:0}
.slide{grid-area:1/1;position:relative;inset:auto}
.slide>.ph--fill,.band>.ph--fill{position:relative;inset:auto;height:68vw;max-height:420px}
.slide__scrim,.band__scrim{inset:0 0 auto 0;height:68vw;max-height:420px;background:linear-gradient(180deg,rgba(20,19,18,0) 60%,rgba(20,19,18,.9) 100%)}
.slide__in{min-height:0;padding-top:var(--space-s)}
.band__in{padding-top:var(--space-m)}
img[src$="/3b128e1ca290.webp"]{object-position:22% 50%}img[src$="/ab931ecbe088.webp"]{object-position:90% 50%}img[src$="/f461cecd848b.webp"]{object-position:81% 50%}img[src$="/c1b39384dfa0.webp"]{object-position:100% 50%}
}
/* seven top-level items (Merch added, Richard 2026-09-26): tighter nav spacing on narrow desktops so nothing overflows */
@media (max-width:1180px){.hdr .nav__btn{padding:0 .62rem;letter-spacing:.06em}}
@media (max-width:1060px){.hdr .nav__btn{padding:0 .5rem;font-size:.98rem;letter-spacing:.04em}.hdr .mark em{display:none}}
/* a button inside running text keeps its own colours and doesn't stretch across the column */
.prose .button{color:var(--color-on-accent);text-decoration:none;align-self:flex-start;margin-top:var(--space-2xs)}
.prose .button--ghost,.prose .button--light{color:inherit}
/* Sawgrass Anglers cards: photo, role, name, bio */
.card.angler .card__body{gap:var(--space-2xs)}
.card.angler .card__body p{font-size:var(--text-s);line-height:1.6;color:var(--color-text-soft);margin:0}
.card.angler .card__body a{color:var(--color-accent);text-underline-offset:3px}
/* checkout order bumps: product thumbnail between the checkbox and the text (added by sawgrass-effects.js) */
.fct_order_promotion{align-items:center!important}
.fct_order_promotion .sg-bump-thumb{width:56px;height:56px;flex:none;object-fit:cover;border-radius:var(--radius);border:1px solid var(--color-rule);background:#fff}
/* mobile menu button: a text box instead of the hamburger icon (Richard 2026-09-26) */
.tool.burger--text{width:auto;min-width:0;height:42px;padding:0 .95rem;margin-left:.35rem;border:1.5px solid currentColor;border-radius:var(--radius);
  font-family:var(--font-display);font-size:1rem;letter-spacing:.09em;text-transform:uppercase;line-height:1;place-items:center}
.tool.burger--text:hover{color:var(--color-accent)}
/* mega menu: one panel at a time. A pointer over the nav shows only the hovered item's panel; a clicked panel is .is-open */
.nav__item.is-open .mega{display:grid}
.nav:hover .nav__item:not(:hover) .mega{display:none!important}
/* Bricks wraps the header template in #brx-header: let it vanish so .hdr stays sticky against the page, as in the demo */
#brx-header{display:contents}
/* footer legal row: links + label as flex items; the dots are drawn here so no loose text sits between elements (trap 9) */
.ftr__legal{display:flex;flex-wrap:wrap;align-items:baseline;gap:.5rem}
.ftr__legal>*{font:inherit;letter-spacing:inherit;color:inherit}
.ftr__legal>*+*::before{content:"\00B7";margin-right:.5rem}
/* trap 13: tables are role=table div grids */
.dtbl{display:grid;grid-template-columns:var(--tcols,repeat(4,auto));justify-content:start;column-gap:1.5rem;row-gap:.15rem;font-size:.95em}
.dtbl .tr{display:contents}
.dtbl .th{font-family:var(--font-mono);font-size:var(--text-xs);letter-spacing:.08em;text-transform:uppercase;color:var(--color-muted)}
@media (max-width:560px){.dtbl{column-gap:.8rem;font-size:.85em}}
/* trap 1: cards whose <a> wrapped blocks are divs; a stretched link makes the whole card clickable */
.has-link{position:relative}
.has-link>a.stretched-link{position:absolute!important;inset:0!important;z-index:2;display:block!important;margin:0!important;padding:0!important;border:0!important;color:transparent!important;overflow:hidden;white-space:nowrap;text-indent:110%;border-radius:inherit;background:none!important}
.has-link:has(.stretched-link:focus-visible){outline:2px solid var(--color-accent);outline-offset:3px}
/* trap 7: injected icons size like the demo's inline svgs */
[data-svg-start]>svg,[data-svg-end]>svg{flex:none}
/* trap 11: static buttons are role=button divs */
[role="button"]{cursor:pointer;user-select:none}
[role="button"]:focus-visible{outline:2px solid var(--color-accent);outline-offset:2px}
/* Fluent Forms slots (contact + newsletter): fields styled like the demo forms */
.ff-slot .ff-el-form-control{width:100%;min-height:48px;padding:.75rem .9rem;font:var(--text-m)/1.4 var(--font-body);color:var(--color-text);background:var(--color-bg);border:1px solid var(--color-rule);border-radius:var(--radius)}
.ff-slot .ff-el-form-control:focus{outline:2px solid var(--color-accent);outline-offset:1px;border-color:var(--color-accent)}
.ff-slot .ff-el-input--label label{font-family:var(--font-mono);font-size:var(--text-xs);letter-spacing:.08em;text-transform:uppercase;color:var(--color-text-soft)}
.ff-slot .ff-btn-submit{font-family:var(--font-display);font-size:1.0625rem;letter-spacing:.09em;text-transform:uppercase;min-height:48px;padding:.9rem 1.6rem;border-radius:var(--radius);background:var(--color-accent-solid)!important;color:var(--color-on-accent)!important;border:0}
.newsletter .ff-slot .ff-el-form-control{background:transparent;color:inherit}
.ff-slot .ff-el-form-control,.ff-slot .ff-btn-submit{border-radius:var(--radius)!important}
.ff-slot select.ff-el-form-control{min-height:48px;height:48px}


/* ═══════════════ FLUENTCART → Sawgrass tokens. Token overrides only; FluentCart's own markup, no template edits ═══════════════
   Adapted from the SyTec/Jambo kits, for a LIGHT site. Everything points at the demo's role tokens, so dark mode follows. */
:root{
  --fct-primary-text-color:var(--color-text);--fct-secondary-text-color:var(--color-muted);--fct-heading-color:var(--ink-950);
  --fct-primary-bg-color:var(--color-accent-solid);--fct-secondary-bg-color:var(--color-surface);--fct-border-color:var(--color-rule);--fct-divider-color:var(--color-rule-soft);
  --fct-active-border-color:var(--color-accent);--fct-secondary-active-border-color:var(--color-accent-hv);--fct-primary-active-text-color:var(--color-accent);
  --fct-btn-bg-color:var(--color-accent-solid);--fct-btn-text-color:var(--color-on-accent);--fct-btn-border-color:transparent;
  --fct-secondary-btn-bg-color:transparent;--fct-secondary-btn-border-color:var(--color-text);--fct-secondary-btn-hover-bg-color:var(--color-surface);--fct-secondary-btn-text-color:var(--color-text);
  --fct-input-bg-color:var(--color-bg);--fct-input-text-color:var(--color-text);--fct-input-placeholder-text-color:var(--color-muted);--fct-input-disabled-bg-color:var(--color-surface);--fct-input-disabled-bg:var(--color-surface);
  --fct-card-bg:var(--color-surface);--fct-checkout-summary-bg-color:var(--color-surface);--fct-checkout-payment-method-bg-color:var(--color-bg);--fct-checkout-radio-bg-color:transparent;--fct-checkout-radio-dot-bg-color:var(--color-accent-solid);
  --fct-checkout-checkbox-bg:transparent;--fct-checkout-address-wrapper-bg:var(--color-surface);--fct-checkout-address-modal-bg:var(--color-bg);--fct-checkout-shipping-methods-bg:var(--color-surface);
  --fct-cart-drawer-bg:var(--color-bg);--fct-cart-drawer-border-color:var(--color-rule);--fct-cart-drawer-primary-text-color:var(--color-text);--fct-cart-drawer-secondary-text-color:var(--color-muted);
  --fct-cart-drawer-footer-action-bg-color:var(--color-bg);--fct-cart-drawer-open-btn-bg-color:var(--color-surface);--fct-cart-drawer-quantity-bg-color:transparent;--fct-cart-drawer-quantity-btn-bg:var(--color-surface);--fct-cart-drawer-quantity-btn-hover-bg:var(--color-surface-2);
  --fct-cart-drawer-close-btn-color:var(--color-text);--fct-cart-drawer-badge-bg-color:var(--color-accent-solid);--fct-cart-drawer-badge-text-color:var(--color-on-accent);
  --fct-cart-item-delete-btn-bg-color:transparent;--fct-cart-item-delete-btn-hover-bg-color:var(--color-surface-2);--fct-view-cart-btn-bg-color:transparent;--fct-view-cart-drawer-btn-hover-bg:var(--color-surface);
  --fct-single-product-qty-bg:var(--color-surface);--fct-single-product-qty-text-color:var(--color-text);
  --fct-shop-input-bg:var(--color-bg);--fct-shop-checkmark-bg:transparent;--fct-shop-paginator-bg:transparent;--fct-shop-paginator-items-hover-bg:var(--color-surface);--fct-shop-view-switcher-active-bg:var(--color-surface-2);
  --fct-select-dropdown-bg:var(--color-bg);--fct-select-option-hover-bg:var(--color-surface);
  --fct-customer-dashboard-nav-active-bg-color:var(--color-surface);--fct-customer-dashboard-nav-active-text-color:var(--color-text);--fct-customer-dashboard-nav-active-bar-color:var(--color-accent-solid);--fct-customer-dashboard-nav-text-color:var(--color-muted);
  --fct-customer-dashboard-logout-btn-bg-color:var(--color-surface);--fct-customer-dashboard-logout-btn-hover-bg-color:var(--color-surface-2);--fct-customer-dashboard-logout-btn-text-color:var(--color-accent);
  --fct-modal-checkout-border-radius:var(--radius-lg);
}
.fluent-cart-checkout-page,.fct-cart-page,.fct-customer-dashboard,[class*="fct-checkout"]{font-family:var(--font-body);color:var(--color-text)}
[class*="fct-"] h1,[class*="fct-"] h2,[class*="fct-"] h3{font-family:var(--font-display);font-weight:400;letter-spacing:.02em;text-transform:uppercase}
.fct-product-price,.fct-product-item-price,[class*="fct-"][class*="price"]{font-family:var(--font-mono)}
.fct-product-card,[class*="fct-checkout-summary"],.fct_auth_wrap{border:1px solid var(--color-rule);border-radius:var(--radius-lg)}
[class*="fct-"] button[type="submit"],[class*="fct-"] .fct-btn-primary{font-family:var(--font-display);letter-spacing:.09em;text-transform:uppercase}
/* pages Bricks renders from WordPress content (FluentCart product, cart, checkout, account, receipt): the site's container */
#brx-content.layout-default,article#brx-content.wordpress{width:100%;max-width:var(--shell);margin-inline:auto;padding:var(--space-l) var(--gutter) var(--space-2xl);box-sizing:border-box}
article#brx-content.wordpress>h1{font-family:var(--font-display);font-weight:400;text-transform:uppercase;letter-spacing:.01em;line-height:1;font-size:var(--text-3xl);margin:0 0 var(--space-m)}
/* FluentCart product page, in the site's type */
.fct-single-product-page{margin-bottom:var(--space-l)}
.fct-product-title{font-family:var(--font-display)!important;font-weight:400!important;text-transform:uppercase;letter-spacing:.01em;line-height:1;font-size:var(--text-2xl)!important;margin:0 0 var(--space-2xs)!important}
.fct-product-sku{font-family:var(--font-mono);font-size:var(--text-xs);letter-spacing:.08em;text-transform:uppercase;color:var(--color-muted)}
.fct-price-range,.fct-item-price{font-family:var(--font-mono);font-size:var(--text-xl)!important;color:var(--ink-950)}
.fct-product-gallery-wrapper img,.fct-gallery-control-thumb img{object-fit:contain!important;background:#fff}
.fct-product-buttons-wrap a,.fct-product-buttons-wrap button{font-family:var(--font-display)!important;font-size:1.0625rem!important;letter-spacing:.09em;text-transform:uppercase;min-height:48px;border-radius:var(--radius)!important}
.single-fluent-products .sg-specs{width:100%;max-width:560px;border-collapse:collapse;margin:0 0 var(--space-m);font-size:var(--text-s)}
.single-fluent-products .sg-specs th,.single-fluent-products .sg-specs td{text-align:left;padding:.55rem .8rem;border-bottom:1px solid var(--color-rule-soft);vertical-align:top}
.single-fluent-products .sg-specs th{width:38%;font-family:var(--font-mono);font-size:var(--text-xs);font-weight:500;letter-spacing:.08em;text-transform:uppercase;color:var(--color-muted)}
.single-fluent-products .sg-specs td{font-family:var(--font-mono);color:var(--ink-950)}
.single-fluent-products .sg-about{font-size:var(--text-xl)!important;margin:var(--space-m) 0 var(--space-2xs)}
.single-fluent-products .sg-about--specs{margin-top:0}
.single-fluent-products #brx-content.layout-default>p{max-width:68ch;color:var(--color-text-soft);line-height:1.62;margin-bottom:var(--space-l)}
.single-fluent-products #brx-content h2,.single-fluent-products #brx-content h3{font-family:var(--font-display);font-weight:400;text-transform:uppercase;letter-spacing:.01em}
/* the grouped BCS3 template keeps FluentCart's native buy section in [data-sg="buyslot"] */
[data-sg="buyslot"]{margin-top:var(--space-s)}