/* ================================================================
   HOLLER EQUIPMENT — design system v3
   World: rural supply-house catalog. Paper ground, pine bands,
   blaze as marking paint. Square corners. Borders, not shadows.

   Architecture contract:
   - @layer tokens        every color, size, space, and speed
   - @layer base          element defaults + browser surfaces
   - @layer layout        page scaffolding (.wrap, .section, views)
   - @layer components    BEM components (block__element --modifier)
   - @layer utilities     the few sanctioned helpers
   Spacing and type come ONLY from the fluid token scales below.
   No inline styles. No magic numbers outside this tokens block.
   ================================================================ */
@layer tokens, base, layout, components, utilities;

@layer tokens {
  :root {
    /* Semantic aliases → ACSS dashboard tokens (type/space/radius from ACSS). */
    --paper: var(--body-bg-color, #f6f2e7);
    --paper-2: #ece5d3;
    --panel: #fdfbf4;
    --rule: #d9d1bc;
    --rule-strong: #b9ad8f;
    --ink: var(--base, #211f1a);
    --ink-2: #5d5646;
    --ink-3: #3a352a;
    --pine: var(--primary, #1e3d2f);
    --pine-2: var(--secondary, #152e22);
    --pine-3: #2c5442;
    --pine-rule: #3b6350;
    --on-pine: #f3efe2;
    --on-pine-2: #b9c9b6;
    --blaze: var(--accent, #e8590c);
    --blaze-2: #c34a08;
    --wheat: var(--tertiary, #e3b34c);
    --ok: var(--success, #2e6b46);
    --text-disp: var(--h1);
    --text-2xl: var(--h2);
    /* Geary: section rhythm defaults to M; L reserved for intentional open sections */
    --section-space: var(--section-space-m, var(--section-space-l));
    --line: 1px solid var(--rule);
    --line-2: 2px solid var(--rule);
    --line-ink: 2px solid var(--ink);
    --line-pine: 1px solid var(--pine-rule);
    --d-quick: 150ms;
    --d-base: 250ms;
    --ease: cubic-bezier(0.2, 0.8, 0.2, 1);
    --font-display: var(--heading-font-family, "Barlow Condensed", "Arial Narrow", Arial, sans-serif);
    --font-text: var(--text-font-family, "Barlow", system-ui, Arial, sans-serif);
    --measure: 72ch;
    --measure-narrow: 56ch;
    /* Prefer ACSS content-width (Geary); keep --max as alias for legacy */
    --max: var(--content-width, 72.5rem);
    /*
     ACSS 4 ships xs→xxl only. Map inspire/legacy steps onto the ACSS scale
     so component spacing does not collapse to invalid vars.
    */
    --space-3xs: calc(var(--space-xs) * 0.5);
    --space-2xs: var(--space-xs);
    --space-2xl: var(--space-xxl);
    --radius-l: var(--radius-m, var(--radius, 5px));
  }
}

@layer base {
  *,*::before,*::after{box-sizing:border-box}
  ::selection{background:var(--blaze);color:#fff}
  :focus-visible{outline:3px solid var(--blaze);outline-offset:2px}
  input,textarea{caret-color:var(--blaze)}
  ::-webkit-scrollbar{width:10px}
  ::-webkit-scrollbar-track{background:var(--paper-2)}
  ::-webkit-scrollbar-thumb{background:var(--pine);border:2px solid var(--paper-2)}
  a{color:inherit}
  [hidden]{display:none!important}
  img,svg{display:block}
  button{font:inherit;cursor:pointer;border:none;background:none;color:inherit}
  strong{font-weight:700}
  @media(prefers-reduced-motion:reduce){
    *,*::before,*::after{animation:none!important;transition-duration:0s!important}
  }
  @media print{
    .site-bar,.site-header,.site-footer,.cta-band,.sticky-bar,.drawer,.no-print{display:none!important}
    body{background:#fff}
    .view{display:none!important}
    .view.is-active{display:block!important}
  }
}

@layer layout {
  /*
   Geary section structure (ACSS):
   - Gutter = padding-inline on full-bleed chrome/sections
   - Content width = max-width on inner .wrap (centered)
   - Never put gutter padding on the content-width container
  */
  .wrap{
    width:100%;
    max-width:var(--content-width, var(--max));
    margin-inline:auto;
    padding-inline:0;
  }
  .site-bar,
  .site-header,
  .hero,
  .section,
  .cta-band,
  .site-footer,
  .sticky-bar{
    padding-inline:var(--gutter);
  }
  /*
   Archive/single shells are often `.wrap.page-shell` (one node).
   Treat as full-bleed gutter chrome; center children to content-width
   so they share the header/footer column.
  */
  .wrap.page-shell,
  main.page-shell,
  .page-shell{
    max-width:none;
    width:100%;
    margin-inline:0;
    padding-inline:var(--gutter);
    box-sizing:border-box;
  }
  .wrap.page-shell > *,
  main.page-shell > *,
  .page-shell > *{
    width:100%;
    max-width:var(--content-width, var(--max));
    margin-inline:auto;
  }
  .section{padding-block:var(--section-space)}
  .section--rule{border-top:var(--line-2)}
  .section__head{display:flex;flex-wrap:wrap;align-items:flex-end;justify-content:space-between;gap:var(--space-s);margin-bottom:var(--space-m)}
  .section__head--center{justify-content:center;text-align:center}
  .section__sub{font-size:var(--text-s);color:var(--ink-2);margin-top:var(--space-2xs)}
  .section__head--center .section__sub{margin-inline:auto}
  .view{display:none}
  .view.is-active{display:block}
  .page-head{padding-top:var(--space-xl);text-align:center;padding-inline:0}
  .page-head__sub{font-size:var(--text-s);color:var(--ink-2);margin:var(--space-xs) auto 0;max-width:var(--measure-narrow)}
  .page-body{margin-block:var(--space-l) var(--space-2xl)}
  .wrap--narrow{max-width:min(860px, var(--content-width, 100%))}
  .wrap--form{max-width:min(900px, var(--content-width, 100%))}
  .wrap--doc{max-width:min(820px, var(--content-width, 100%))}
}

@layer components {
  /* ---- lede / small text ---- */
  .lede{font-size:var(--text-l);line-height:1.5;max-width:var(--measure-narrow);font-weight:400}
  .text-s{font-size:var(--text-s);line-height:1.55}
  .text-legal{font-size:var(--text-xs);line-height:1.5;color:var(--ink-2)}
  .num{font-variant-numeric:tabular-nums}
  .kicker-none{} /* intentionally absent: headings carry their own weight */

  /* ---- buttons ---- */
  .btn{
    display:inline-flex;align-items:center;justify-content:center;gap:var(--space-2xs);
    font-family:var(--font-display);font-weight:700;text-transform:uppercase;
    letter-spacing:.04em;text-decoration:none;border-radius:var(--radius);
    padding:var(--space-xs) var(--space-m);font-size:var(--text-m);line-height:1.1;
    transition:background var(--d-quick) var(--ease),border-color var(--d-quick) var(--ease),color var(--d-quick) var(--ease);
    text-align:center;
  }
  .btn svg{width:1em;height:1em;flex-shrink:0}
  .btn--blaze{background:var(--blaze);color:#fff;border-bottom:3px solid var(--blaze-2)}
  .btn--blaze:hover{background:var(--blaze-2)}
  /* Default for paper/light surfaces; pine bands override below / in holler.css */
  .btn--line{background:transparent;color:var(--pine);border:2px solid var(--pine)}
  .btn--line:hover{border-color:var(--pine-2);color:var(--pine-2)}
  .btn--pine{background:var(--pine);color:var(--on-pine);border-bottom:3px solid var(--pine-2)}
  .btn--pine:hover{background:var(--pine-3)}
  .btn--ghost{background:var(--panel);color:var(--ink);border:var(--line-2)}
  .btn--ghost:hover{border-color:var(--ink)}
  .btn--s{padding:var(--space-2xs) var(--space-s);font-size:var(--text-s)}
  .btn--l{padding:var(--space-s) var(--space-l);font-size:var(--text-l)}
  .btn--full{width:100%}
  .hero .btn--line,
  .cta-band .btn--line,
  .sticky-bar .btn--line,
  .rental-math .btn--line,
  .founder-band .btn--line,
  .on-pine .btn--line,
  .site-header .btn--line,
  .site-footer .btn--line{
    color:var(--on-pine);
    border-color:var(--pine-rule);
  }
  .hero .btn--line:hover,
  .cta-band .btn--line:hover,
  .sticky-bar .btn--line:hover,
  .rental-math .btn--line:hover,
  .founder-band .btn--line:hover,
  .on-pine .btn--line:hover{
    border-color:var(--on-pine);
    color:#fff;
  }

  /* ---- announcement bar ---- */
  .site-bar{background:var(--pine-2);color:var(--on-pine);font-size:var(--text-xs);border-bottom:var(--line-pine)}
  .site-bar__row{display:flex;justify-content:space-between;align-items:center;gap:var(--space-s);padding-block:var(--space-2xs);min-width:0}
  .site-bar__row > *{min-width:0}
  .site-bar__vosb{color:var(--wheat);font-weight:700;display:inline-flex;align-items:center;gap:var(--space-2xs);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  .site-bar__states{color:var(--on-pine-2)}
  @media(max-width:679px){.site-bar__states{display:none}}
  .site-bar__phone{color:var(--on-pine);font-weight:700;text-decoration:none;white-space:nowrap;display:inline-flex;align-items:center;gap:var(--space-2xs)}
  .site-bar__phone:hover{color:#fff}
  .site-bar svg{width:.9em;height:.9em}

  /* ---- header ---- */
  .site-header{background:var(--pine);color:var(--on-pine);position:sticky;top:0;z-index:40;border-bottom:var(--line-pine)}
  .site-header__row{display:flex;align-items:center;justify-content:space-between;gap:var(--space-m);padding-block:var(--space-s)}
  .brand-lockup{display:flex;align-items:center;gap:var(--space-2xs);text-decoration:none}
  .brand-lockup__mark{width:2.6em;height:2.6em;padding:0;border-radius:var(--radius);display:block;overflow:hidden;background:center/contain no-repeat url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2096%2096%22%3E%3Crect%20width%3D%2296%22%20height%3D%2296%22%20rx%3D%2210%22%20fill%3D%22%23e8590c%22%2F%3E%3Crect%20x%3D%2220%22%20y%3D%2218%22%20width%3D%2216%22%20height%3D%2260%22%20fill%3D%22%23f6f2e7%22%2F%3E%3Crect%20x%3D%2260%22%20y%3D%2218%22%20width%3D%2216%22%20height%3D%2260%22%20fill%3D%22%23f6f2e7%22%2F%3E%3Cpath%20d%3D%22M36%2042%20L48%2053%20L60%2042%20L60%2054%20L48%2065%20L36%2054%20Z%22%20fill%3D%22%23f6f2e7%22%2F%3E%3C%2Fsvg%3E");flex-shrink:0}
  .brand-lockup__mark svg{width:100%;height:100%;display:block}
  .brand-lockup__name{font-family:var(--font-display);font-weight:700;text-transform:uppercase;line-height:.9;font-size:var(--text-l);letter-spacing:.01em}
  .brand-lockup__sub{display:block;font-size:.5em;letter-spacing:.32em;color:var(--on-pine-2);font-weight:600}
  .primary-nav{display:none;align-items:center;gap:var(--space-m);font-size:var(--text-s);font-weight:600}
  .primary-nav a{color:var(--on-pine);text-decoration:none;padding-block:var(--space-2xs);border-bottom:2px solid transparent;transition:color var(--d-quick) var(--ease),border-color var(--d-quick) var(--ease)}
  .primary-nav a:hover{color:#fff;border-color:var(--blaze)}
  .primary-nav a[aria-current="page"]{color:#fff;border-color:var(--blaze)}
  .primary-nav a.is-accent{color:var(--blaze)}
  .header-cta{display:none;align-items:center;gap:var(--space-s)}
  .header-cta__phone{text-align:right;text-decoration:none;color:var(--on-pine)}
  .header-cta__phone-label{display:block;font-style:normal;font-size:var(--text-xs);letter-spacing:.14em;text-transform:uppercase;color:var(--on-pine-2);font-weight:700}
  .header-cta__phone-num{font-size:var(--text-m);font-weight:700;white-space:nowrap}
  .header-utils{display:inline-flex;align-items:center;gap:var(--space-2xs);margin-inline-start:auto}
  .header-util{display:inline-flex;align-items:center;justify-content:center;width:2.25rem;height:2.25rem;padding:0;color:var(--on-pine);text-decoration:none;position:relative}
  .header-util:hover{color:#fff}
  .header-util::before{
    content:"";display:block;width:1.375rem;height:1.375rem;
    background:currentColor;
    -webkit-mask:no-repeat center / contain;
    mask:no-repeat center / contain;
  }
  .header-util[href="/saved/"]::before,
  .header-util[href*="/saved"]::before,
  .header-util[href="/favorites/"]::before,
  .header-util[href*="favorites"]::before{
    -webkit-mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.75' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20.84 4.61a5.5 5.5 0 0 0-7.78 0L12 5.67l-1.06-1.06a5.5 5.5 0 0 0-7.78 7.78l1.06 1.06L12 21.23l7.78-7.78 1.06-1.06a5.5 5.5 0 0 0 0-7.78z'/%3E%3C/svg%3E");
    mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.75' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20.84 4.61a5.5 5.5 0 0 0-7.78 0L12 5.67l-1.06-1.06a5.5 5.5 0 0 0-7.78 7.78l1.06 1.06L12 21.23l7.78-7.78 1.06-1.06a5.5 5.5 0 0 0 0-7.78z'/%3E%3C/svg%3E");
  }
  .header-util[href="/account/"]::before,
  .header-util[href*="account"]::before{
    -webkit-mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.75' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 21v-2a4 4 0 0 0-4-4H8a4 4 0 0 0-4 4v2'/%3E%3Ccircle cx='12' cy='7' r='4'/%3E%3C/svg%3E");
    mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.75' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 21v-2a4 4 0 0 0-4-4H8a4 4 0 0 0-4 4v2'/%3E%3Ccircle cx='12' cy='7' r='4'/%3E%3C/svg%3E");
  }
  .header-util [data-holler-fav-count]{position:absolute;top:0;right:0}
  .menu-btn{display:inline-flex;padding:var(--space-2xs);color:var(--on-pine)}
  .menu-btn svg{width:1.7em;height:1.7em}
  @media(min-width:1100px){
    .primary-nav{display:flex}
    .header-cta{display:flex}
    .header-utils{margin-inline-start:0}
    .menu-btn{display:none}
  }
  .drawer{display:none;background:var(--pine-2);border-bottom:var(--line-pine);padding:0 var(--space-s) var(--space-m)}
  .drawer.is-open{display:block}
  .drawer a{display:block;padding-block:var(--space-xs);color:var(--on-pine);text-decoration:none;font-weight:600;border-bottom:var(--line-pine)}
  .drawer a:hover{color:#fff}
  .drawer a.is-accent{color:var(--blaze)}
  .drawer__label{margin:var(--space-s) 0 var(--space-3xs);font-size:var(--text-xs);font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--on-pine-2)}
  .drawer__label:first-child{margin-top:0}
  .drawer__rule{border:0;border-top:var(--line-pine);margin:var(--space-s) 0}
  .drawer__call{margin-top:var(--space-s)}
  .catalog-depts{margin-bottom:var(--space-m)}
  .catalog-depts h2{font-size:var(--text-l);margin:0}
  .support-parts .prose-panel__title{margin:0}
  .skip-link{position:absolute;left:-9999px;top:0;background:var(--blaze);color:#fff;padding:var(--space-xs) var(--space-s);z-index:100;font-weight:700;border-radius:0 0 var(--radius) 0}
  .skip-link:focus{left:0}

  /* ---- hero ---- */
  .hero{background:var(--pine);color:var(--on-pine);padding-block:var(--space-xl);border-bottom:6px solid var(--blaze)}
  .hero__grid{display:grid;gap:var(--space-l)}
  @media(min-width:960px){.hero__grid{grid-template-columns:7fr 5fr;align-items:center}}
  .hero__title .u{position:relative;white-space:nowrap;color:#fff}
  .hero__title .u::after{
    content:"";position:absolute;left:0;bottom:-.06em;height:.12em;width:100%;
    background:var(--blaze);transform:scaleX(0);transform-origin:left;
    animation:sweep .7s var(--ease) .3s forwards;
  }
  @keyframes sweep{to{transform:scaleX(1)}}
  @media(prefers-reduced-motion:reduce){.hero__title .u::after{transform:scaleX(1)}}
  .hero__sub{color:var(--on-pine-2);margin-top:var(--space-s)}
  .hero__sub b{color:#fff}
  .hero__bridge{margin-top:var(--space-xs);font-size:var(--text-s);color:var(--on-pine-2);max-width:36rem}
  .hero__bridge b,.hero__bridge strong{color:#fff}
  .hero__actions{display:flex;flex-wrap:wrap;gap:var(--space-xs);margin-top:var(--space-m)}
  .hero__assurances{display:flex;flex-wrap:wrap;gap:var(--space-m);margin-top:var(--space-m);font-size:var(--text-s);color:var(--on-pine-2);font-weight:600;list-style:none}
  .hero__assurances li{display:inline-flex;align-items:center;gap:var(--space-2xs)}
  .hero__assurances svg{width:1em;height:1em;color:var(--wheat)}

  /* ---- machine spotlight (hero card) ---- */
  .spotlight{background:var(--panel);color:var(--ink);border-radius:var(--radius-l);border:2px solid var(--pine-2);overflow:hidden}
  .spotlight__tag{background:var(--pine-2);color:var(--on-pine);font-family:var(--font-display);font-weight:600;text-transform:uppercase;letter-spacing:.1em;font-size:var(--text-xs);padding:var(--space-2xs) var(--space-s);display:flex;justify-content:space-between;gap:var(--space-s)}
  .spotlight__tag b{color:var(--wheat)}
  .spotlight__inner{padding:var(--space-s)}
  .spotlight__title{margin-top:var(--space-s)}
  .spotlight__meta{font-size:var(--text-s);color:var(--ink-2);margin-top:var(--space-3xs)}
  .spotlight__note{margin-top:var(--space-xs)}

  /* ---- price row ---- */
  .price-row{display:flex;align-items:flex-end;justify-content:space-between;gap:var(--space-s);margin-top:var(--space-s);padding-top:var(--space-s);border-top:var(--line-2)}
  .price-row--flush{margin-top:0;padding-top:0;border-top:none}
  .price-row__label{font-size:var(--text-xs);font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--ink-2)}
  .price-row__value{font-family:var(--font-display);font-weight:700;font-size:var(--text-2xl);line-height:1;color:var(--pine)}
  .price-row__value sup{font-size:.5em}

  /* ---- photo frame: an art-directed shot spec, not clip art ---- */
  .photo-frame{
    border:2px dashed var(--rule-strong);border-radius:var(--radius);background:var(--paper);
    aspect-ratio:16/10;display:flex;flex-direction:column;align-items:center;justify-content:center;
    gap:var(--space-2xs);text-align:center;padding:var(--space-s);color:var(--ink-2);
  }
  .photo-frame svg{width:1.7em;height:1.7em;color:var(--rule-strong)}
  .photo-frame__spec{font-size:var(--text-xs);font-weight:600;max-width:34ch;line-height:1.45}
  .photo-frame__file{font-size:var(--text-xs);letter-spacing:.06em;color:var(--rule-strong);font-weight:700;text-transform:uppercase}
  .photo-frame--square{aspect-ratio:1/1;max-width:260px;margin-inline:auto}
  .founder-band .photo-frame.has-photo,
  .photo-frame.photo-frame--square.has-photo{
    padding:0;overflow:hidden;display:block;border-style:solid;
  }
  .founder-band .photo-frame.has-photo img,
  .photo-frame.photo-frame--square.has-photo img{
    width:100%;height:100%;object-fit:cover;object-position:center 18%;display:block;border:0;
  }
  .on-pine .photo-frame{background:var(--pine-2);border-color:var(--pine-rule);color:var(--on-pine-2)}
  .on-pine .photo-frame.has-photo{background:transparent}
  .on-pine .photo-frame svg,.on-pine .photo-frame__file{color:var(--pine-rule)}

  /* ---- ledger ---- */
  .ledger{border:var(--line-ink);border-radius:var(--radius-l);background:var(--panel);overflow:hidden}
  .ledger__head{background:var(--ink);color:var(--paper);font-family:var(--font-display);font-weight:700;text-transform:uppercase;letter-spacing:.08em;padding:var(--space-2xs) var(--space-s);font-size:var(--text-m)}
  .ledger table{width:100%;border-collapse:collapse;font-size:var(--text-s)}
  .ledger td{padding:var(--space-2xs) var(--space-s);border-top:var(--line)}
  .ledger tr:first-child td{border-top:none}
  .ledger td:last-child{text-align:right;font-weight:700;white-space:nowrap}
  .ledger .is-zero{color:var(--ok)}
  .ledger--pine{border-color:var(--pine-rule);background:var(--pine-2)}
  .ledger--pine table{color:var(--on-pine)}
  .ledger--pine td{border-color:var(--pine-rule)}
  .ledger--pine a{color:#fff;text-decoration:none}
  /* ---- offer section: ledger + rental math side by side ---- */
  .offer-grid{display:grid;gap:var(--space-m);align-items:stretch}
  @media(min-width:900px){.offer-grid{grid-template-columns:7fr 5fr}}
  .rental-math{background:var(--pine);color:var(--on-pine);border-radius:var(--radius-l);padding:var(--space-m);display:flex;flex-direction:column;justify-content:space-between;gap:var(--space-s)}
  .rental-math__figures{display:grid;grid-template-columns:1fr 1fr;gap:var(--space-s);margin-top:var(--space-s)}
  .rental-math__label{font-size:var(--text-xs);font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--on-pine-2)}
  .rental-math__value{font-family:var(--font-display);font-weight:700;font-size:var(--text-2xl);line-height:1;color:#fff;margin-top:var(--space-3xs)}
  .rental-math__value--blaze{color:var(--wheat)}
  .rental-math__note{font-size:var(--text-s);color:var(--on-pine-2)}
  .rental-math__note b{color:#fff}

  /* ---- department cards (merchandised, intentionally unequal) ---- */
  .dept-grid{display:grid;gap:var(--space-s)}
  @media(min-width:820px){.dept-grid{grid-template-columns:1fr 1fr}}
  .dept-card{border:var(--line-2);border-radius:var(--radius-l);background:var(--panel);text-decoration:none;color:var(--ink);display:flex;flex-direction:column;transition:border-color var(--d-quick) var(--ease)}
  .dept-card:hover{border-color:var(--pine)}
  .dept-card .photo-frame{border:none;border-bottom:var(--line-2);border-radius:0;aspect-ratio:16/7}
  .dept-card__body{padding:var(--space-s);display:flex;align-items:flex-end;justify-content:space-between;gap:var(--space-s)}
  .dept-card__meta{font-size:var(--text-s);color:var(--ink-2);margin-top:var(--space-3xs)}
  .dept-card__link{font-family:var(--font-display);font-weight:700;text-transform:uppercase;color:var(--blaze);white-space:nowrap;display:inline-flex;align-items:center;gap:var(--space-2xs)}
  .dept-card__link svg{width:1em;height:1em;transition:translate var(--d-quick) var(--ease)}
  .dept-card:hover .dept-card__link svg{translate:3px 0}
  .dept-card--slim{flex-direction:row;align-items:center;justify-content:space-between;padding:var(--space-s)}
  .dept-card--slim h3{font-size:var(--text-l)}
  .dept-card--slim .dept-card__meta{margin-top:var(--space-3xs)}

  /* ---- product card (uniform: it's catalog data) ---- */
  .product-grid{display:grid;gap:var(--space-m);margin-top:var(--space-m)}
  @media(min-width:820px){.product-grid{grid-template-columns:repeat(3,1fr)}}
  .product-card{border:var(--line-2);border-radius:var(--radius-l);background:var(--panel);display:flex;flex-direction:column;position:relative}
  .product-card--featured{border-color:var(--blaze)}
  .product-card__flag{position:absolute;top:-2px;right:14px;background:var(--blaze);color:#fff;font-family:var(--font-display);font-weight:700;text-transform:uppercase;letter-spacing:.08em;font-size:var(--text-xs);padding:var(--space-3xs) var(--space-2xs);border-radius:0 0 var(--radius) var(--radius)}
  .product-card .photo-frame{border:none;border-bottom:var(--line-2);border-radius:0;aspect-ratio:16/9}
  .product-card__body{padding:var(--space-s);flex:1;display:flex;flex-direction:column}
  .product-card__class{font-size:var(--text-xs);font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--ink-2)}
  .product-card__title{font-size:var(--text-l);margin-top:var(--space-3xs)}
  .product-card__blurb{font-size:var(--text-s);color:var(--ink-2);margin-top:var(--space-2xs)}
  .spec-table{width:100%;border-collapse:collapse;font-size:var(--text-s);margin-top:var(--space-xs)}
  .spec-table td{padding:var(--space-2xs) 0;border-top:var(--line)}
  .spec-table td:last-child{text-align:right;font-weight:700}
  .product-card__footer{padding:var(--space-s);border-top:var(--line-2);background:var(--paper)}
  .product-card__actions{display:grid;grid-template-columns:1fr 1fr;gap:var(--space-2xs);margin-top:var(--space-xs)}
  .product-card__note{margin-top:var(--space-xs)}

  /* ---- filters ---- */
  .filter-group{display:flex;flex-wrap:wrap;gap:var(--space-2xs);justify-content:center;margin-top:var(--space-m)}
  .filter-group button{
    font-family:var(--font-display);font-weight:600;text-transform:uppercase;letter-spacing:.05em;
    font-size:var(--text-s);padding:var(--space-2xs) var(--space-s);border:var(--line-2);border-radius:var(--radius);background:var(--panel);
    transition:background var(--d-quick) var(--ease),border-color var(--d-quick) var(--ease),color var(--d-quick) var(--ease);
  }
  .filter-group button:hover{border-color:var(--ink)}
  .filter-group button[aria-pressed="true"]{background:var(--pine);border-color:var(--pine);color:var(--on-pine)}

  /* ---- prose panel ---- */
  .prose-panel{background:var(--panel);border:var(--line-ink);border-radius:var(--radius-l);padding:var(--space-l)}
  .prose-panel--accent{border-color:var(--blaze)}
  .prose-panel__title{max-width:22ch}
  .prose-panel__body{margin-top:var(--space-m);color:var(--ink-3)}
  .prose-panel__body > * + *{margin-top:var(--space-s)}
  .prose-panel__footer{margin-top:var(--space-m);padding-top:var(--space-s);border-top:var(--line-2);display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:var(--space-s)}
  .prose-panel__footnote{font-size:var(--text-s);font-weight:700;color:var(--pine)}

  /* ---- proof section ---- */
  .proof-grid{display:grid;gap:var(--space-m)}
  @media(min-width:960px){.proof-grid{grid-template-columns:7fr 5fr;align-items:stretch}}
  .video-panel{background:var(--pine);color:var(--on-pine);border-radius:var(--radius-l);padding:var(--space-m);display:flex;flex-direction:column;gap:var(--space-s)}
  .video-panel__frame svg{width:2.4em;height:2.4em;color:var(--on-pine-2)}
  .video-panel__frame{flex:1;border:2px dashed var(--pine-rule);border-radius:var(--radius);background:var(--pine-2);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:var(--space-s);padding:var(--space-l);text-align:center;min-height:230px}
  .video-panel__play{width:64px;height:64px;border-radius:50%;background:var(--blaze);display:grid;place-items:center;color:#fff;transition:background var(--d-quick) var(--ease)}
  .video-panel__play svg{width:22px;height:22px;margin-left:3px}
  .video-panel__frame:hover .video-panel__play{background:var(--blaze-2)}
  .video-panel__hint{font-size:var(--text-s);color:var(--on-pine-2)}
  .video-panel__caption{font-size:var(--text-s);color:var(--on-pine-2)}
  .aside-panel{border:var(--line-2);border-radius:var(--radius-l);background:var(--panel);padding:var(--space-m);display:flex;flex-direction:column;gap:var(--space-s)}
  .aside-panel__title{color:var(--ink)}
  .aside-panel__body{font-size:var(--text-s);color:var(--ink-2);margin-top:var(--space-2xs)}
  .aside-panel__note{background:var(--paper);border:var(--line);border-radius:var(--radius);padding:var(--space-xs) var(--space-s);font-size:var(--text-s)}
  .aside-panel__note b{color:var(--pine)}
  .aside-panel__contact{font-size:var(--text-s);color:var(--ink-2)}
  .aside-panel__contact a{color:var(--blaze);font-weight:700}
  .shot-strip{display:grid;gap:var(--space-s);margin-top:var(--space-m)}
  @media(min-width:720px){.shot-strip{grid-template-columns:repeat(3,1fr)}}
  .shot-strip figcaption{font-size:var(--text-s);font-weight:700;margin-top:var(--space-2xs);text-align:center}

  /* ---- founder band ---- */
  .founder-band{background:var(--pine);color:var(--on-pine);border-radius:var(--radius-l);padding:var(--space-l);display:grid;gap:var(--space-l)}
  @media(min-width:820px){.founder-band{grid-template-columns:4fr 8fr;align-items:center}}
  .founder-band__badge{margin-top:var(--space-xs);text-align:center;font-size:var(--text-s);font-weight:700;color:var(--wheat);display:flex;align-items:center;justify-content:center;gap:var(--space-2xs)}
  .founder-band__badge svg{width:1em;height:1em}
  /* Never use bare blockquote here — theme/ACSS quote chrome washes out white pull text */
  .founder-band blockquote.founder-band__quote,
  .founder-band__quote{margin:0;padding:0;border:0;background:transparent;color:inherit;quotes:none}
  .founder-band__quote > * + *{margin-top:var(--space-s)}
  .founder-band__copy{color:var(--on-pine-2)}
  .founder-band__pull{font-weight:700;color:#fff;font-size:var(--text-m)}
  .founder-band__sig{margin-top:var(--space-m);padding-top:var(--space-s);border-top:var(--line-pine);display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:var(--space-s);font-size:var(--text-s);color:var(--on-pine-2)}

  /* ---- numbered steps (sequence carries information) ---- */
  .steps{counter-reset:step;display:grid;gap:var(--space-s);margin-top:var(--space-m);list-style:none}
  @media(min-width:820px){.steps{grid-template-columns:repeat(4,1fr)}}
  .steps__item{counter-increment:step;background:var(--panel);border:var(--line-2);border-radius:var(--radius-l);padding:var(--space-s)}
  .steps__item::before{
    content:counter(step);font-family:var(--font-display);font-weight:700;font-size:var(--text-l);
    width:2.2rem;height:2.2rem;border-radius:var(--radius);background:var(--blaze);color:#fff;
    display:grid;place-items:center;margin-bottom:var(--space-xs);
  }
  .steps__item h3{font-size:var(--text-l)}
  .steps__item p{font-size:var(--text-s);color:var(--ink-2);margin-top:var(--space-2xs)}

  /* ---- coverage band ---- */
  .coverage{background:var(--pine);color:var(--on-pine);border-radius:var(--radius-l);padding:var(--space-l);margin-block:var(--space-l) var(--space-2xl)}
  .coverage__sub{color:var(--on-pine-2);margin-top:var(--space-2xs);font-size:var(--text-s)}
  .coverage__list{display:grid;grid-template-columns:repeat(2,1fr);gap:var(--space-2xs);margin-top:var(--space-s);font-weight:700;font-size:var(--text-s);list-style:none}
  @media(min-width:720px){.coverage__list{grid-template-columns:repeat(4,1fr)}}
  .coverage__list li{background:var(--pine-3);border-radius:var(--radius);padding:var(--space-xs) var(--space-s);display:flex;align-items:center;gap:var(--space-2xs)}
  .coverage__list svg{width:1em;height:1em;color:var(--blaze)}

  /* ---- checklist ---- */
  .checklist{background:var(--panel);border:var(--line-2);border-radius:var(--radius-l);padding:var(--space-m);margin-block:var(--space-l) var(--space-2xl)}
  .checklist__items{margin-top:var(--space-s)}
  .checklist__items label{display:flex;gap:var(--space-xs);align-items:flex-start;padding:var(--space-xs);border:var(--line);border-radius:var(--radius);background:var(--paper);cursor:pointer;font-size:var(--text-s)}
  .checklist__items label + label{margin-top:var(--space-2xs)}
  .checklist__items input{width:1.1rem;height:1.1rem;margin-top:.2rem;accent-color:var(--blaze)}
  .checklist__footer{display:flex;justify-content:space-between;align-items:center;gap:var(--space-s);margin-top:var(--space-m);padding-top:var(--space-s);border-top:var(--line-2)}

  /* ---- calculator ---- */
  .calc{background:var(--panel);border:var(--line-2);border-radius:var(--radius-l);padding:var(--space-m);display:grid;gap:var(--space-m);margin-block:var(--space-l) var(--space-2xl)}
  @media(min-width:820px){.calc{grid-template-columns:1fr 1fr}}
  .field label{display:block;font-size:var(--text-xs);font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--ink-2);margin-bottom:var(--space-3xs)}
  .field input,.field select,.field textarea{
    width:100%;padding:var(--space-xs) var(--space-s);border:var(--line-2);border-radius:var(--radius);
    background:var(--paper);font:inherit;font-weight:600;color:var(--ink);
  }
  .field input:focus,.field select:focus,.field textarea:focus{border-color:var(--pine);outline:none}
  .field + .field{margin-top:var(--space-s)}
  .field-row{display:grid;grid-template-columns:1fr 1fr;gap:var(--space-s);margin-top:var(--space-s)}
  .field-row .field{margin:0}
  .calc__output{background:var(--pine);color:var(--on-pine);border-radius:var(--radius);padding:var(--space-m);display:flex;flex-direction:column;gap:var(--space-s);text-align:center}
  .calc__label{font-size:var(--text-xs);font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--on-pine-2)}
  .calc__result{font-family:var(--font-display);font-weight:700;font-size:var(--text-disp);line-height:1;color:#fff}
  .calc__legal{color:var(--on-pine-2);margin-top:var(--space-2xs)}
  .calc__roi{background:var(--pine-3);border-radius:var(--radius);padding:var(--space-xs) var(--space-s);text-align:left;font-size:var(--text-s);color:var(--on-pine)}
  .calc__roi b{display:block;margin-bottom:var(--space-3xs)}

  /* ---- faq ---- */
  .faq{margin-block:var(--space-m) var(--space-l)}
  .faq details{background:var(--panel);border:var(--line-2);border-radius:var(--radius-l);margin-top:var(--space-2xs)}
  .faq summary{cursor:pointer;list-style:none;display:flex;justify-content:space-between;align-items:center;gap:var(--space-s);padding:var(--space-s);font-weight:700}
  .faq summary::-webkit-details-marker{display:none}
  .faq summary::after{content:"+";font-family:var(--font-display);font-size:var(--text-xl);color:var(--blaze);line-height:1}
  .faq details[open] summary::after{content:"–"}
  .faq details p{padding:0 var(--space-s) var(--space-s);font-size:var(--text-s);color:var(--ink-2)}
  .faq-cta{text-align:center;margin-bottom:var(--space-2xl)}

  /* ---- batch tiers ---- */
  .tier-grid{display:grid;gap:var(--space-2xs);margin-top:var(--space-m)}
  @media(min-width:720px){.tier-grid{grid-template-columns:repeat(3,1fr)}}
  .tier{border:var(--line-2);border-radius:var(--radius-l);background:var(--paper);padding:var(--space-s);text-align:center}
  .tier--current{border-color:var(--blaze);background:var(--panel)}
  .tier__who{font-size:var(--text-xs);font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--ink-2)}
  .tier--current .tier__who{color:var(--blaze)}
  .tier__amount{font-family:var(--font-display);font-weight:700;font-size:var(--text-xl);margin-top:var(--space-3xs)}
  .tier--current .tier__amount{color:var(--blaze)}
  .tier--best .tier__amount{color:var(--ok)}
  .tier__per{font-size:var(--text-xs);color:var(--ink-2)}
  .batch-note{margin-top:var(--space-m)}
  .batch-cta{margin-top:var(--space-m)}

  /* ---- terms doc ---- */
  .terms-doc{background:var(--panel);border:var(--line-2);border-radius:var(--radius-l);padding:var(--space-l);display:grid;gap:var(--space-m);margin-block:var(--space-l) var(--space-2xl)}
  .terms-doc h3{font-size:var(--text-m)}
  .terms-doc p{font-size:var(--text-s);color:var(--ink-3);margin-top:var(--space-2xs)}

  /* ---- CTA band + footer ---- */
  .cta-band{background:var(--pine);color:var(--on-pine);padding-block:var(--space-xl);position:relative}
  .cta-band::before{content:"";position:absolute;top:0;left:0;right:0;height:8px;background:repeating-linear-gradient(-45deg,var(--blaze) 0 14px,var(--ink) 14px 28px)}
  .cta-band__row{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:var(--space-m)}
  .cta-band__sub{color:var(--on-pine-2);margin-top:var(--space-3xs);font-size:var(--text-s)}
  .cta-band__actions{display:flex;flex-wrap:wrap;gap:var(--space-xs)}
  .site-footer{background:var(--pine-2);color:var(--on-pine);padding-block:var(--space-xl) var(--space-l);font-size:var(--text-s)}
  .site-footer__cols{display:grid;gap:var(--space-l)}
  @media(min-width:820px){.site-footer__cols{grid-template-columns:2fr 1fr 1fr 1.3fr}}
  .site-footer__wordmark{font-family:var(--font-display);font-weight:700;text-transform:uppercase;font-size:var(--text-l)}
  .site-footer .brand-lockup{color:var(--on-pine);margin-bottom:var(--space-2xs)}
  .site-footer .brand-lockup__sub{color:var(--on-pine-2)}
  .site-footer__about{color:var(--on-pine-2);margin-top:var(--space-2xs)}
  .site-footer h3{font-size:var(--text-m);letter-spacing:.08em;margin-bottom:var(--space-xs)}
  .site-footer ul{list-style:none}
  .site-footer li{margin-top:var(--space-2xs)}
  .site-footer a{color:var(--on-pine-2);text-decoration:none}
  .site-footer a:hover{color:#fff;text-decoration:underline;text-underline-offset:3px}
  .site-footer__nap{color:var(--on-pine-2)}
  .site-footer__nap-title{color:var(--on-pine)}
  .site-footer__phone{margin-top:var(--space-2xs)}
  .site-footer__phone a{color:#fff;font-weight:700}
  .site-footer__base{margin-top:var(--space-l);padding-top:var(--space-s);border-top:var(--line-pine);display:flex;flex-wrap:wrap;justify-content:space-between;gap:var(--space-s);color:var(--on-pine-2);font-size:var(--text-xs)}
  .vosb-badge{display:inline-flex;align-items:center;gap:var(--space-2xs);color:var(--wheat);font-weight:700;margin-top:var(--space-xs)}
  .vosb-badge svg{width:1em;height:1em}

  /* ---- sticky mobile bar ---- */
  .sticky-bar{position:fixed;bottom:0;left:0;right:0;z-index:40;background:var(--pine);border-top:2px solid var(--blaze);padding:var(--space-2xs);display:flex;gap:var(--space-2xs)}
  .sticky-bar .btn{flex:1;font-size:var(--text-s);padding:var(--space-xs) var(--space-2xs)}
  @media(min-width:640px){.sticky-bar{display:none}}
  @media(max-width:639px){body{padding-bottom:64px}}

  /* Chaty clear of FluentCart FAB (.fct-cart-drawer-open-btn: bottom 20px, 56×56, z 999) */
  #chaty-widget-0 .chaty-widget,
  .chaty .chaty-widget{
    z-index:998!important;
  }
  #chaty-widget-0 .chaty-widget.right-position,
  .chaty .chaty-widget.right-position{
    bottom:6.75rem!important; /* ~108px — sits above cart FAB */
    right:1.25rem!important;
  }
  .fct-cart-drawer-open-btn{
    z-index:1000!important; /* cart wins if anything still overlaps */
  }
  .holler-cart-honesty{
    margin:0 0 var(--space-xs, 0.65rem);
    font-size:var(--text-xs, 0.84rem);
    color:var(--ink-muted, #5d5646);
    line-height:1.4;
  }
  .fct-cart-drawer .holler-cart-honesty,
  [class*="cart-drawer"] .holler-cart-honesty{
    padding-inline:var(--space-s, 0.9rem);
  }
  @media(max-width:639px){
    #chaty-widget-0 .chaty-widget.right-position,
    #chaty-widget-0 .chaty-widget.left-position{
      bottom:10.5rem!important; /* sticky CTA + cart FAB */
    }
  }
  body.has-holler-compare-bar #chaty-widget-0 .chaty-widget.right-position,
  body.has-holler-compare-bar #chaty-widget-0 .chaty-widget.left-position{
    bottom:10.5rem!important;
  }

  /* ---- modals ---- */
  .modal{position:fixed;inset:0;z-index:50;background:rgba(20,26,22,.8);display:none;align-items:flex-start;justify-content:center;overflow-y:auto;padding:var(--space-l) var(--space-s)}
  .modal.is-open{display:flex}
  .modal__box{background:var(--panel);border-top:6px solid var(--blaze);max-width:560px;width:100%;padding:var(--space-m);position:relative;margin-block:auto 0}
  .modal__box--wide{max-width:760px}
  .modal__close{position:absolute;top:var(--space-2xs);right:var(--space-2xs);width:38px;height:38px;border:var(--line-2);border-radius:var(--radius);display:grid;place-items:center;background:var(--paper)}
  .modal__close:hover{border-color:var(--ink)}
  .modal__close svg{width:16px;height:16px}
  .modal__title{font-size:var(--text-xl)}
  .quote-form__note{font-size:var(--text-s);color:var(--ink-2);margin-top:var(--space-3xs)}
  .quote-form__context{font-weight:700;color:var(--pine)}
  .quote-form form{margin-top:var(--space-s)}
  .consent{display:flex;gap:var(--space-2xs);align-items:flex-start;font-size:var(--text-xs);color:var(--ink-2);line-height:1.45;margin-top:var(--space-s)}
  .consent input{width:1rem;height:1rem;margin-top:.15rem;accent-color:var(--blaze)}
  .quote-form__submit{margin-top:var(--space-s)}
  .form-success{text-align:center;padding:var(--space-l) var(--space-s)}
  .form-success svg{width:44px;height:44px;color:var(--ok);margin:0 auto var(--space-s)}
  .form-success__body{font-size:var(--text-s);color:var(--ink-2);margin-top:var(--space-2xs)}
  .form-success a{color:var(--blaze);font-weight:700}

  /* product modal internals */
  .spec-sheet__class{font-size:var(--text-xs);font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--ink-2)}
  .spec-sheet__title{font-size:var(--text-2xl);margin-top:var(--space-3xs)}
  .spec-sheet .price-row{margin-top:var(--space-xs)}
  .spec-sheet .photo-frame{margin-top:var(--space-s)}
  .spec-sheet .spec-table{margin-top:var(--space-s)}
  .spec-sheet__note{margin-top:var(--space-xs)}
  .spec-sheet__cta{margin-top:var(--space-s)}
}

@layer utilities {
  .u-center{text-align:center}
  .u-mt-2xs{margin-top:var(--space-2xs)}
  .u-mt-s{margin-top:var(--space-s)}
  .u-mt-l{margin-top:var(--space-l)}
  .u-measure-center{margin-inline:auto}
}

/*
  Unlayered overrides — ACSS ships unlayered
  `:where(section:not(section section)) { padding-block/inline }`.
  Unlayered always beats @layer, so hero/CTA need an unlayered opt-out
  to keep composition padding (Geary: ACSS owns defaults; brand comps opt in).
*/
section.hero,
section.cta-band{
  padding-block:var(--space-xl);
  padding-inline:var(--gutter);
}
/* Etch theme forces bare anchors to display:block (unlayered) — restore lockup row */
a.brand-lockup{
  display:flex;
  align-items:center;
  gap:var(--space-2xs);
  text-decoration:none;
}
/* Legal bar: Privacy · Terms must stay one horizontal line */
.site-footer__base{
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  justify-content:space-between;
  gap:var(--space-s);
}
.site-footer__base > div{
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  gap:0.35em;
}
.site-footer__base a{
  display:inline !important;
  width:auto !important;
}
.site-footer__disclaimer{
  margin:var(--space-s, 1rem) 0 0;
  max-width:72ch;
  color:var(--on-pine-2, rgba(246,242,231,0.78));
  font-size:var(--text-xs, 0.8rem);
  line-height:1.5;
}
.site-footer__disclaimer a{
  color:inherit;
  text-decoration:underline;
}
/* Contact phone / Text sit on one line too */
.site-footer__phone,
.site-footer__phone > div,
.site-footer__nap{
  display:block;
}
.site-footer__phone a,
.site-footer__nap a.js-chaty-phone,
.site-footer__nap a.js-chaty-sms{
  display:inline !important;
  width:auto !important;
}
.site-bar__phone{
  flex-shrink:1;
  min-width:0;
  overflow:hidden;
  text-overflow:ellipsis;
}
/*
  Etch ships unlayered `* { margin: 0 }` which kills layered
  `.wrap { margin-inline: auto }`. Restore content-column centering so
  header / body / footer share one horizontal alignment.
*/
.wrap{
  width:100%;
  max-width:var(--content-width, 72.5rem);
  margin-inline:auto;
  padding-inline:0;
}
.wrap.page-shell,
main.page-shell,
.page-shell{
  max-width:none;
  width:100%;
  margin-inline:0;
  padding-inline:var(--gutter);
  box-sizing:border-box;
}
.wrap.page-shell > *,
main.page-shell > *,
.page-shell > *{
  width:100%;
  max-width:var(--content-width, 72.5rem);
  margin-inline:auto;
}
/* Keep intentional narrow measures when combined with page-shell */
.wrap.page-shell.wrap--narrow > *,
.wrap--narrow.page-shell > *{
  max-width:min(42rem, var(--content-width, 72.5rem));
}
.wrap.page-shell.wrap--form > *,
.wrap--form.page-shell > *{
  max-width:min(36rem, var(--content-width, 72.5rem));
}
.wrap.page-shell.wrap--doc > *,
.wrap--doc.page-shell > *{
  max-width:min(42rem, var(--content-width, 72.5rem));
}
/*
  Interior pages: one content column. Do not widen .page-head past siblings —
  that left the title on the full site measure while body copy sat on a
  narrower left-weighted column (looks like missing gutters).
*/
.page-head{
  padding-top:var(--space-l);
  padding-bottom:var(--space-s);
  margin-bottom:var(--space-s);
  text-align:center;
  padding-inline:0;
  box-sizing:border-box;
}
/* Reading pages: keep body stacks on the same measure as the head */
.wrap--doc.page-shell > .page-body,
.wrap--narrow.page-shell > .page-body,
.wrap--doc.page-shell > .checklist,
.wrap--narrow.page-shell > .checklist,
.wrap--doc.page-shell > .prose-panel,
.wrap--narrow.page-shell > .prose-panel,
.wrap--doc.page-shell > .faq,
.wrap--narrow.page-shell > .faq,
.wrap--doc.page-shell > .steps,
.wrap--narrow.page-shell > .steps,
.wrap--doc.page-shell > .terms-doc,
.wrap--narrow.page-shell > .terms-doc{
  max-width:min(42rem, 100%);
}
/* 4-up steps need room — stack 2×2 inside reading shells */
.wrap--doc .steps,
.wrap--narrow .steps,
.page-body .steps{
  grid-template-columns:1fr;
}
@media(min-width:640px){
  .wrap--doc .steps,
  .wrap--narrow .steps,
  .page-body .steps{
    grid-template-columns:repeat(2,1fr);
  }
}
.checklist{
  margin-block:0 var(--space-xl);
}
.checklist__items label{
  display:flex;
  gap:var(--space-xs);
  align-items:flex-start;
}
.prose-panel,
.faq,
.terms-doc{
  margin-block:0 var(--space-xl);
}
.page-body{
  margin-block:0 var(--space-xl);
  line-height:1.65;
  color:var(--ink);
}
.page-body > * + *{
  margin-top:var(--space-s);
}
.page-body > h2{
  margin-top:var(--space-l);
  font-size:var(--text-xl, var(--text-l));
  line-height:1.2;
}
.page-body > h2:first-child{
  margin-top:0;
}
.page-body > h2 + *{
  margin-top:var(--space-xs);
}
.page-body > ul,
.page-body > ol{
  padding-inline-start:1.25em;
}
.page-body li + li{
  margin-top:var(--space-2xs);
}
.page-body > .text-legal{
  margin-bottom:var(--space-xs);
}
.page-cta{
  display:flex;
  flex-wrap:wrap;
  justify-content:center;
  gap:var(--space-xs);
  margin-block:var(--space-l) var(--space-xl);
}
.page-cta .btn{
  margin:0;
}
.page-body > .prose-panel,
.page-body > .steps,
.page-body > .faq{
  margin-block:0 var(--space-m);
}
.page-head__sub{
  margin-inline:auto;
  max-width:var(--measure-narrow, 36rem);
}
/* Pine / paper bands: padding must win over Etch/ACSS unlayered resets */
.coverage,
.founder-band,
.service-map,
.service-regions,
.faq-cta,
.terms-doc,
.calc__output{
  box-sizing:border-box;
}
.coverage{
  background:var(--pine);
  color:var(--on-pine);
  border-radius:var(--radius-l);
  padding:var(--space-l);
  padding-inline:max(var(--space-l), var(--gutter));
  margin-block:var(--space-l) var(--space-2xl);
}
.coverage__sub{
  color:var(--on-pine-2);
  margin-top:var(--space-2xs);
  font-size:var(--text-s);
  max-width:var(--measure-narrow, 36rem);
}
.coverage__list{
  display:grid;
  grid-template-columns:repeat(2,1fr);
  gap:var(--space-2xs);
  margin-top:var(--space-s);
  font-weight:700;
  font-size:var(--text-s);
  list-style:none;
  padding:0;
}
@media(min-width:720px){
  .coverage__list{grid-template-columns:repeat(4,1fr)}
}
.coverage__list li{
  background:var(--pine-3);
  border-radius:var(--radius);
  padding:var(--space-xs) var(--space-s);
  display:flex;
  align-items:center;
  gap:var(--space-2xs);
}
.founder-band{
  margin-block:var(--space-l) var(--space-2xl);
  padding:var(--space-l);
  box-sizing:border-box;
}
/* About map lands after the Etch shell — give it the same gutter/column as header */
.service-regions{
  margin-top:var(--space-xl);
  margin-bottom:var(--space-2xl);
  padding-inline:var(--gutter);
  box-sizing:border-box;
  display:grid;
  gap:var(--space-m);
  width:100%;
}
.service-regions > *{
  width:100%;
  max-width:var(--content-width, 72.5rem);
  margin-inline:auto;
  box-sizing:border-box;
}
.steps,
.faq,
.manuals-index,
.machine-sheet,
.service-regions{
  box-sizing:border-box;
  padding-inline:0;
}
/* Steps / FAQ / body stacks share the shell column — keep readable inset */
.wrap.page-shell > .steps,
.wrap.page-shell > .faq,
.wrap.page-shell > .manuals-index,
.page-shell > .steps,
.page-shell > .faq,
.page-shell > .manuals-index{
  width:100%;
}
/* Breathing room before CTA band / footer chrome */
.wrap.page-shell,
main.page-shell,
.page-shell,
.machine-page.page-shell{
  padding-bottom:var(--space-2xl);
}
.steps{
  margin-bottom:var(--space-l);
}
.holler-wpgb,
.holler-catalog-grid,
.holler-related,
.machine-sheet{
  margin-bottom:var(--space-2xl);
}
/* Spec tables: readable measure, not full content column */
.machine-sheet .spec-table,
.spec-sheet .spec-table,
table.spec-table{
  width:100%;
  max-width:min(34rem, 100%);
  table-layout:fixed;
}
.machine-sheet .spec-table td:first-child,
.spec-sheet .spec-table td:first-child,
table.spec-table td:first-child{
  width:42%;
  padding-right:var(--space-m);
  color:var(--ink-2);
  font-weight:600;
  white-space:normal;
}
.machine-sheet .spec-table td:last-child,
.spec-sheet .spec-table td:last-child,
table.spec-table td:last-child{
  text-align:right;
  font-weight:700;
  white-space:normal;
  overflow-wrap:anywhere;
}
.machine-sheet .text-legal{
  max-width:min(42rem, 100%);
  margin-top:var(--space-s);
}
/*
  FluentCart / block pages often lack .page-shell — still need Geary
  gutters so H1 + cart/shop/account align with header/footer.
*/
main:not(:has(.page-shell)){
  padding-inline:var(--gutter);
  box-sizing:border-box;
}
main:not(:has(.page-shell)) > :not(style):not(script){
  width:100%;
  max-width:var(--content-width, 72.5rem);
  margin-inline:auto;
}
/* FluentCart adds its own 20px — stack would double-inset vs header */
main:not(:has(.page-shell)) .fct-products-wrapper,
main:not(:has(.page-shell)) .fct_auth_wrap,
main:not(:has(.page-shell)) .fluent-cart-cart-empty-content{
  padding-inline:0;
}
/* Real product photos: no placeholder dashed frame; no link chrome */
.product-card .photo-frame.has-photo,
.product-card a.photo-frame{
  padding:0;
  overflow:hidden;
  display:block;
  aspect-ratio:16/9;
  border:none;
  border-bottom:var(--line-2);
  border-radius:0;
  outline:none;
  box-shadow:none;
  background:var(--paper-2);
  text-decoration:none;
  color:inherit;
}
.product-card a.photo-frame:focus-visible,
.spotlight a.holler-spotlight-photo:focus-visible{
  outline:3px solid var(--blaze);
  outline-offset:2px;
}
.spotlight a.holler-spotlight-photo{
  display:block;
  text-decoration:none;
  color:inherit;
  outline:none;
}
.product-card .photo-frame img,
.spotlight .holler-spotlight-photo img{
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
  border:none;
  border-radius:0;
  outline:none;
}
.product-card__title{
  line-height:1.15;
  overflow-wrap:anywhere;
}
.product-card__body{
  position:relative;
  z-index:1;
  background:var(--panel);
}
/* Match SPECS + ATC: same near-square radius token */
.product-card__actions .btn,
.product-card__actions a.btn,
.product-card__actions .fluent-cart-add-to-cart-button{
  border-radius:var(--radius);
}
.product-card__actions .btn--ghost,
.product-card__actions a.btn--ghost{
  border:var(--line-2);
  color:var(--ink);
}
/* Pine CTAs on paper (Etch/ACSS can zero the fill) */
a.btn--pine,
.btn--pine{
  background:var(--pine);
  color:var(--on-pine);
  border-bottom:3px solid var(--pine-2);
}

/* Form recipe: raised panel for Fluent / quote forms (not bare on paper) */
.form-panel,
.prose-panel.form-panel{
  margin-block:var(--space-m) var(--space-l);
}
.form-panel .prose-panel__body{
  margin-top:0;
  margin-bottom:var(--space-m);
}
.form-panel .fluentform{
  margin:0;
}
.form-panel .fluentform .ff-el-form-control,
.form-panel .fluentform textarea.ff-el-form-control{
  background:var(--paper,#f6f2e7);
}
.form-panel .fluentform .ff-el-form-buttons,
.form-panel .fluentform .ff-btn-submit{
  margin-top:var(--space-s,0.9rem);
}

/* Unlayered: Huayee copy ledger (price-ledger defaults are right/nowrap) */
.ledger.ledger--copy{
  margin-block:var(--space-m);
}
.ledger.ledger--copy table{
  table-layout:fixed;
}
.ledger.ledger--copy th,
.ledger.ledger--copy td{
  text-align:left;
  white-space:normal;
  vertical-align:top;
  font-weight:400;
}
.ledger.ledger--copy th{
  width:28%;
  font-family:var(--font-display);
  font-weight:700;
  text-transform:uppercase;
  letter-spacing:.04em;
  color:var(--ink);
}
.ledger.ledger--copy td{
  color:var(--ink-3);
  font-size:var(--text-s);
  line-height:1.55;
}
.ledger.ledger--copy a{
  color:var(--pine);
  font-weight:700;
}
@media (max-width:720px){
  .ledger.ledger--copy tr{
    display:block;
    padding:var(--space-s);
    border-top:var(--line);
  }
  .ledger.ledger--copy tr:first-child{border-top:none}
  .ledger.ledger--copy th,
  .ledger.ledger--copy td{
    display:block;
    width:100%;
    padding:0 0 var(--space-2xs);
    border:none;
  }
  .ledger.ledger--copy td{padding-bottom:0}
}

/* Unlayered: pine ledger links must stay light (ACSS `a` otherwise paints dark pine on pine) */
.ledger.ledger--pine,
.founder-band .ledger{
  color:var(--on-pine,#e8efe9);
}
.ledger.ledger--pine table,
.founder-band .ledger table{
  color:inherit;
}
.ledger.ledger--pine th,
.ledger.ledger--pine td,
.founder-band .ledger th,
.founder-band .ledger td{
  color:inherit;
}
.ledger.ledger--pine a,
.founder-band .ledger a{
  color:#fff !important;
  font-weight:700;
  text-decoration:underline;
  text-underline-offset:3px;
}
.ledger.ledger--pine a:hover,
.founder-band .ledger a:hover{
  color:var(--wheat,#e3b34c) !important;
}