@font-face { font-family: Khand; font-style: normal; font-weight: 600; font-display: swap; src: url(khand-600-ed210f36.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: Khand; font-style: normal; font-weight: 700; font-display: swap; src: url(khand-700-acfffb5e.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: Barlow; font-style: normal; font-weight: 400; font-display: swap; src: url(barlow-400-b0a8ad37.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: Barlow; font-style: italic; font-weight: 400; font-display: swap; src: url(barlow-400-italic-7a306c56.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: Barlow; font-style: normal; font-weight: 500; font-display: swap; src: url(barlow-500-cd759df8.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: Inter; font-style: normal; font-weight: 900; font-display: swap; src: url(inter-900-d5c0ed7b.woff2) format("woff2"); }

/* Arial-metric fallbacks, sized from each woff2's own metrics so the swap does not shift layout */
@font-face { font-family: "Khand Fallback"; font-weight: 600; src: local("Arial Bold"), local("Arial-BoldMT"), local("Liberation Sans Bold"); size-adjust: 64.94%; ascent-override: 161.69%; descent-override: 73.76%; line-gap-override: 0%; }
@font-face { font-family: "Khand Fallback"; font-weight: 700; src: local("Arial Bold"), local("Arial-BoldMT"), local("Liberation Sans Bold"); size-adjust: 66.98%; ascent-override: 156.75%; descent-override: 71.51%; line-gap-override: 0%; }
@font-face { font-family: "Barlow Fallback"; font-weight: 400; src: local("Arial"), local("ArialMT"), local("Liberation Sans"); size-adjust: 96.57%; ascent-override: 103.55%; descent-override: 20.71%; line-gap-override: 0%; }
@font-face { font-family: "Barlow Fallback"; font-weight: 500; src: local("Arial"), local("ArialMT"), local("Liberation Sans"); size-adjust: 97.6%; ascent-override: 102.46%; descent-override: 20.49%; line-gap-override: 0%; }

:root {
  color-scheme: light dark;
  --site-bg: light-dark(#edf0f2, #0e0e10);
  --site-surface: light-dark(#ffffff, #17181b);
  --site-wash: light-dark(#f2f3f5, #1c1d21);
  --site-text: light-dark(#15171a, #f2f3f5);
  --site-mid: light-dark(#4c5058, #c2c6cc);
  --site-muted: light-dark(#636870, #9aa0a8);
  --site-rule: light-dark(#d3d7dc, #2a2c31);
  --site-edge: light-dark(#b6bcc4, #3a3d44);
  --site-field-edge: light-dark(#848a92, #6a6f78);
  --site-accent: light-dark(#c8102e, #f25a70);
  --site-accent-hover: light-dark(#a80d26, #ff8394);
  --site-control: light-dark(#15171a, #2a2c31);
  --site-control-hover: light-dark(#c8102e, #34373d);
  --site-control-edge: light-dark(#15171a, #6a6f78);
  --site-on-control: light-dark(#ffffff, #f2f3f5);
  --site-vest-line: light-dark(#15171a, #e6e8eb);
  --site-vest-fill: light-dark(#ffffff, #262626);
  --site-vest-halo: light-dark(#ffffff, #0e0e10);
  --site-on-accent: light-dark(#ffffff, #0e0e10);
  --site-logo-star: #ffffff;
  --site-logo-ink: #231f20;
  --site-logo-edge: light-dark(#231f20, transparent);
  --site-logo-red: #c8102e;
  --site-frame: light-dark(#f4f4f4, #1c1d21);
  --site-focus: var(--site-accent);
  --site-display: Khand, "Khand Fallback", system-ui, sans-serif;
  --site-body: Barlow, "Barlow Fallback", system-ui, sans-serif;
  /* Utopia type: 320/16/1.2 to 1600/20/1.25 */
  --site-step--1: clamp(0.8333rem, 0.7917rem + 0.2083vw, 1rem);
  --site-step-0: clamp(1rem, 0.9375rem + 0.3125vw, 1.25rem);
  --site-step-1: clamp(1.2rem, 1.1094rem + 0.4531vw, 1.5625rem);
  --site-step-2: clamp(1.44rem, 1.3117rem + 0.6414vw, 1.9531rem);
  --site-step-4: clamp(2.0736rem, 1.8291rem + 1.2227vw, 3.0518rem);
  --site-step-5: clamp(2.4883rem, 2.1567rem + 1.658vw, 3.8147rem);
  /* Utopia space: 320/16 to 1600/20, steps and one-up pairs */
  --site-space-3xs: clamp(0.25rem, 0.2344rem + 0.0781vw, 0.3125rem);
  --site-space-3xs-2xs: clamp(0.25rem, 0.1562rem + 0.4688vw, 0.625rem);
  --site-space-2xs: clamp(0.5rem, 0.4688rem + 0.1562vw, 0.625rem);
  --site-space-xs: clamp(0.75rem, 0.7031rem + 0.2344vw, 0.9375rem);
  --site-space-xs-s: clamp(0.75rem, 0.625rem + 0.625vw, 1.25rem);
  --site-space-s: clamp(1rem, 0.9375rem + 0.3125vw, 1.25rem);
  --site-space-s-m: clamp(1rem, 0.7812rem + 1.0938vw, 1.875rem);
  --site-space-m: clamp(1.5rem, 1.4062rem + 0.4688vw, 1.875rem);
  --site-space-m-l: clamp(1.5rem, 1.25rem + 1.25vw, 2.5rem);
  --site-space-l: clamp(2rem, 1.875rem + 0.625vw, 2.5rem);
  --site-space-l-xl: clamp(2rem, 1.5625rem + 2.1875vw, 3.75rem);
  --site-space-xl-2xl: clamp(3rem, 2.5rem + 2.5vw, 5rem);
  --site-space-2xl: clamp(4rem, 3.75rem + 1.25vw, 5rem);
  --site-space-3xl: clamp(6rem, 5.625rem + 1.875vw, 7.5rem);
  --site-page: 100rem; --site-column: 73.75rem;
  --site-gutter: var(--site-space-s-m);
  --site-h1: min(var(--site-step-4), max(1.5rem, 6svh));
  --site-fold-pad: clamp(var(--site-space-s), min(6.5svh, 7vw), var(--site-space-xl-2xl));
  --site-card-pad: clamp(var(--site-space-xs), 2.5svh, var(--site-space-m));
  --site-thumb: min(var(--site-space-3xl), 12svh);
  --site-hit: 2.75rem;
  --site-chrome: 3rem;
  /* Past 64rem the header is one row and craft's menu button sits on its end. */
  --site-header-end: max(var(--site-gutter), min(var(--site-gutter) + var(--site-chrome), (100vw - 64rem) * 999));
  --site-quick: 150ms;
  --craft-bg: var(--site-bg);
  --craft-surface: var(--site-surface);
  --craft-line: var(--site-rule);
  --craft-text: var(--site-text);
  --craft-text-muted: var(--site-mid);
  --craft-text-dim: var(--site-muted);
}

@media (prefers-reduced-motion: no-preference) {
  @view-transition { navigation: auto; }
}

@keyframes site-fade { from { opacity: 0; } }

@scope (.site) {
  :scope { display: flex; flex-direction: column; block-size: 100svh; color: var(--site-text); font-family: var(--site-body); font-size: var(--site-step-0); line-height: 1.6; -webkit-font-smoothing: antialiased; }

  @media (prefers-reduced-motion: reduce) {
    :scope, *, ::before, ::after { animation: none !important; transition: none !important; scroll-behavior: auto !important; }
  }

  h1, h2, h3, h4, p, figure, blockquote { margin: 0; }

  a { color: var(--site-text); text-decoration: none; text-decoration-color: var(--site-text); text-underline-offset: .2em; transition: color var(--site-quick); }
  a:hover { color: var(--site-accent); text-decoration-line: underline; }
  [aria-current="page"] { text-decoration: underline 2px var(--site-accent); text-underline-offset: .45em; }
  [tabindex="-1"]:focus { outline: none; }
  .site-nav a, .site-nav button { display: inline-block; margin: calc((1lh - var(--site-hit)) / 2) -.5em; padding: calc((var(--site-hit) - 1lh) / 2) .5em; }

  .site-body { flex: 1; display: flex; flex-direction: column; min-block-size: 0; }
  .home-fold, .home-rest, .view, .site-footer { flex: none; }
  .site-footer { margin-block-start: auto; }
  .skip { position: absolute; inset-block-start: var(--site-space-2xs); inset-inline-start: var(--site-space-2xs); z-index: 20; padding: var(--site-space-2xs) var(--site-space-s); background: var(--site-surface); color: var(--site-text); }
  .skip:not(:focus-visible) { clip-path: inset(50%); inline-size: 1px; block-size: 1px; overflow: hidden; padding: 0; }
  .site-main { display: contents; }
  .home-fold { display: flex; flex-direction: column; min-block-size: 100%; padding-block-end: var(--site-gutter); box-sizing: border-box; }
  :scope:has(.view:not([data-page=""])) :is(.home-fold, .home-rest) { display: none; }
  .view:not([data-page=""]) { animation: site-fade var(--site-quick) ease-out; }
  .view[data-page=""] { display: none; }

  :focus-visible { outline: 2px solid var(--site-focus); outline-offset: 2px; }

  .label { font-family: var(--site-display); font-weight: 600; text-transform: uppercase; line-height: 1; }

  .site-header { flex: none; display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: var(--site-space-xs) var(--site-space-l); min-height: var(--site-space-2xl); padding: var(--site-space-xs) var(--site-header-end) var(--site-space-xs) var(--site-gutter); border-bottom: 1px solid var(--site-rule); box-sizing: border-box; }

  .brand { flex: none; display: block; color: var(--site-text); }
  .logo { display: block; width: clamp(8.75rem, 7.8125rem + 4.6875vw, 12.5rem); height: auto; }

  .search { position: relative; display: flex; flex: 1 1 16rem; max-width: 26.25rem; min-width: 0; border: 1px solid var(--site-field-edge); background: var(--site-surface); }
  .search input { flex: 1; min-width: 0; min-block-size: var(--site-hit); padding: .8em .9em; border: 0; outline-offset: -2px; background: transparent; color: var(--site-text); font: 400 var(--site-step--1)/1 var(--site-body); }
  .search button { padding: 0 1.2em; border: 0; outline: 1px solid var(--site-control-edge); outline-offset: -1px; background: var(--site-control); color: var(--site-on-control); font-family: var(--site-display); font-weight: 700; font-size: var(--site-step--1); letter-spacing: .1em; text-transform: uppercase; cursor: pointer; }
  .search button:hover { background: var(--site-control-hover); }

  .site-nav { display: flex; flex-wrap: wrap; align-items: center; gap: var(--site-space-xs) var(--site-space-m); margin: 0; padding: 0; list-style: none; font-size: var(--site-step--1); letter-spacing: .05em; }
  .site-nav button { border: 0; background: none; color: var(--site-text); font: inherit; letter-spacing: inherit; text-transform: inherit; cursor: pointer; anchor-name: --products; }
  .site-nav button:hover { color: var(--site-accent); }

  .products-menu { position-anchor: --products; position-area: bottom span-right; margin: var(--site-space-2xs) 0 0; padding: var(--site-space-2xs) 0; border: 1px solid var(--site-rule); background: var(--site-surface); color: var(--site-text); }
  .products-menu ul { margin: 0; padding: 0; list-style: none; }
  .products-menu a { display: block; padding: calc((var(--site-hit) - 1lh) / 2) var(--site-space-s); font: 400 var(--site-step--1)/1.2 var(--site-body); letter-spacing: 0; text-transform: none; }

  .search-results { position: absolute; top: 100%; inset-inline: -1px; z-index: 10; padding: var(--site-space-2xs) 0; border: 1px solid var(--site-edge); background: var(--site-surface); font: 400 var(--site-step--1)/1.2 var(--site-body); }
  .search-results ul { margin: 0; padding: 0; list-style: none; }
  .search-results li { display: flex; justify-content: space-between; gap: var(--site-space-xs); padding: var(--site-space-3xs-2xs) var(--site-space-s); }
  .search-results p { padding: var(--site-space-3xs-2xs) var(--site-space-s); }
  .search-results p, .search-results span { color: var(--site-mid); }

  .column { inline-size: 100%; max-inline-size: var(--site-page); margin-inline: auto; padding: 0 var(--site-gutter) var(--site-space-xl-2xl); box-sizing: border-box; }
  .view.column { max-inline-size: var(--site-column); }
  .band { padding-top: var(--site-space-xl-2xl); }
  .band, .tile, .site-footer { scroll-margin-top: var(--site-space-m); }

  .rule-head { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: baseline; gap: var(--site-space-s) var(--site-space-m); padding-bottom: var(--site-space-xs); border-bottom: 2px solid var(--site-text); }
  .rule-head h2, :is(h1, h2).rule-head { font-family: var(--site-display); font-weight: 700; font-size: var(--site-step-2); line-height: 1; letter-spacing: .06em; text-transform: uppercase; }

  .statement { container-type: inline-size; flex: 1; display: flex; flex-direction: column; inline-size: 100%; max-inline-size: var(--site-page); margin-inline: auto; padding: var(--site-fold-pad) var(--site-gutter); box-sizing: border-box; }
  .statement-grid { flex: 1; display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 21rem), 1fr)); grid-template-rows: auto; grid-auto-rows: 1fr; gap: var(--site-fold-pad) var(--site-space-l-xl); align-items: center; }
  /* --two is hugely positive when the grid holds two 21rem columns, hugely negative when it stacks. */
  .hero-photo { --two: calc((100cqi - 42rem - var(--site-space-l-xl)) * 999); display: grid; place-items: center; align-self: stretch; justify-self: center; inline-size: 100%; max-inline-size: max(30rem, calc(var(--two) * -1)); min-block-size: max(8rem, min(45svh, max(min(65vw - 6.5rem, var(--two)), min(56.25cqi, calc(var(--two) * -1))))); container-type: size; }
  .hero-photo .photo { inline-size: 100cqi; block-size: min(100cqb, 125cqi); object-position: 50% 12%; }
  .statement h1 { font: 700 var(--site-h1)/1.14 var(--site-display); text-transform: uppercase; text-wrap: balance; }
  .facts { display: flex; flex-wrap: wrap; gap: var(--site-space-2xs) var(--site-space-m-l); margin: var(--site-space-s-m) 0 0; padding: var(--site-space-xs-s) 0 0; border-top: 1px solid var(--site-rule); list-style: none; color: var(--site-mid); font-size: var(--site-step-0); line-height: 1.6; }
  .facts a { color: inherit; }

  .photo { display: block; width: 100%; height: auto; object-fit: cover; background: var(--site-frame); }
  .photo-4x3 { aspect-ratio: 4 / 3; }
  .photo-3x2 { aspect-ratio: 3 / 2; }
  .photo-16x11 { aspect-ratio: 16 / 11; }
  .photo-1x1 { flex: none; width: var(--site-thumb); aspect-ratio: 1; }
  .photo-cut { object-fit: contain; background: none; }
  .vest { flex: none; inline-size: var(--site-thumb); block-size: var(--site-thumb); color: var(--site-vest-line); --vest-fill: var(--site-vest-fill); --vest-label: var(--site-text); --vest-halo: var(--site-vest-halo); }

  .ways { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 21.25rem), 1fr)); gap: var(--site-space-s-m); }
  .way { display: flex; gap: var(--site-space-s-m); align-items: flex-start; padding: var(--site-card-pad); border: 1px solid var(--site-rule); background: var(--site-surface); color: var(--site-text); transition: border-color var(--site-quick); }.way:hover { border-color: var(--site-accent); color: var(--site-text); text-decoration-line: none; }
  .way :is(.photo, .vest) { transition: scale var(--site-quick); }
  .way:hover :is(.photo, .vest) { scale: 1.02; }
  .ways-top, .ways-rest { inline-size: 100%; max-inline-size: var(--site-page); margin-inline: auto; padding-inline: var(--site-gutter); box-sizing: border-box; }
  .ways-rest { padding: var(--site-space-s-m) 0 0; }
  .way-text { display: flex; flex-direction: column; gap: var(--site-space-2xs); min-width: 0; }
  .way h2 { font: 700 var(--site-step-1)/1.1 var(--site-display); text-transform: uppercase; }
  .way p { color: var(--site-mid); font-size: var(--site-step--1); line-height: 1.6; }
  .go { color: var(--site-accent); font-size: var(--site-step--1); letter-spacing: .16em; }

  .products { display: flex; flex-direction: column; gap: var(--site-space-m); }
  .tiles { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 18.75rem), 1fr)); gap: var(--site-space-l-xl) var(--site-space-m-l); margin: 0; padding: 0; list-style: none; }
  .tile, .tile-link { display: flex; flex-direction: column; gap: var(--site-space-xs); }
  .tile-link { flex: 1; color: var(--site-text); }
  .tile-link:hover { color: var(--site-text); text-decoration-line: none; }
  .tile-head { display: flex; justify-content: space-between; align-items: baseline; gap: var(--site-space-xs); padding-bottom: var(--site-space-2xs); border-bottom: 1px solid var(--site-rule); }
  .tile h3 { font: 700 var(--site-step-1)/1.1 var(--site-display); text-transform: uppercase; }
  .tile-link:hover h3 { color: var(--site-accent); }
  .tile-link .photo { transition: scale var(--site-quick); }
  .tile-link:hover .photo { scale: 1.02; }
  .tile-note { flex: none; color: var(--site-mid); font-size: var(--site-step--1); line-height: 1; }
  .tile > p, .tile-link > p { color: var(--site-mid); font-size: var(--site-step--1); line-height: 1.5; }

  .slot { display: inline-block; padding: 0 .4em; border: 1px dashed var(--site-edge); color: var(--site-muted); }
  p.slot { align-self: flex-start; padding: .1em .5em; }

  .reviews { display: flex; flex-direction: column; gap: var(--site-space-m); }
  .reviews-score { color: var(--site-mid); font-size: var(--site-step--1); line-height: 1.5; }
  .quotes { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 18.75rem), 1fr)); gap: var(--site-space-s-m); }
  .quote { display: flex; flex-direction: column; gap: var(--site-space-s); padding: var(--site-space-m-l); border: 1px solid var(--site-rule); background: var(--site-surface); }
  .stars { color: var(--site-accent); font: 600 var(--site-step--1)/1 var(--site-display); letter-spacing: .24em; }
  .quote blockquote { font-size: var(--site-step-0); line-height: 1.7; text-wrap: pretty; }
  .quote figcaption { display: flex; flex-wrap: wrap; justify-content: space-between; gap: var(--site-space-2xs); margin-top: auto; padding-top: var(--site-space-xs); border-top: 1px solid var(--site-rule); color: var(--site-muted); font-size: var(--site-step--1); line-height: 1.5; }
  .quote figcaption > :first-child { color: var(--site-text); }

  .more { align-self: flex-start; padding-block: calc((var(--site-hit) - 1lh) / 2); margin-block: calc((1lh - var(--site-hit)) / 2); text-decoration: underline 2px var(--site-accent); text-underline-offset: .45em; font-size: var(--site-step--1); font-weight: 700; letter-spacing: .1em; }
  .more-strong { font-size: var(--site-step--1); letter-spacing: .08em; }
  .slot-mid { color: var(--site-mid); }

  .shop { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 26.25rem), 1fr)); gap: var(--site-space-l-xl); align-items: start; }
  .shop-text { display: flex; flex-direction: column; gap: var(--site-space-s-m); }
  .shop-text p { font-size: var(--site-step-0); line-height: 1.75; text-wrap: pretty; }

  .says { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 15rem), 1fr)); gap: var(--site-space-l); }
  .say { display: flex; flex-direction: column; gap: var(--site-space-xs); margin: 0; }
  .say blockquote { margin: 0; font-size: var(--site-step-1); font-style: italic; line-height: 1.45; text-wrap: pretty; }
  .say figcaption { color: var(--site-muted); font-size: var(--site-step--1); line-height: 1.5; }
  .also { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: baseline; gap: var(--site-space-s) var(--site-space-m); margin-top: var(--site-space-xl-2xl); padding-block: var(--site-space-l) var(--site-space-l-xl); border-top: 1px solid var(--site-rule); font-size: var(--site-step--1); line-height: 1.5; }
  .also-title { margin: 0; font-size: var(--site-step--1); font-weight: 500; letter-spacing: .18em; line-height: 1.5; }
  .also-links { display: flex; flex-wrap: wrap; gap: calc(var(--site-hit) - 1lh) var(--site-space-l); }
  .also a:hover { text-decoration-line: none; }
  .in-service { display: flex; flex-direction: column; gap: var(--site-space-s); }
  .in-service-row { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: baseline; gap: var(--site-space-m); }
  .departments { display: flex; flex-wrap: wrap; gap: var(--site-space-2xs) var(--site-space-m); margin: 0; padding: 0; list-style: none; font-size: var(--site-step-0); line-height: 1.5; }
  .departments .slot { padding: .1em .6em; }
  .samples { font-size: var(--site-step--1); line-height: 1.5; }

  .site-footer { display: flex; flex-wrap: wrap; justify-content: space-between; gap: var(--site-space-m); padding: var(--site-space-l-xl) var(--site-gutter); border-top: 1px solid var(--site-rule); color: var(--site-muted); font-size: var(--site-step--1); line-height: 1.5; }
  .site-updated { flex: 1 1 100%; min-block-size: 1lh; }
  .site-footer a { color: inherit; }
  .site-footer a:hover { color: var(--site-accent); }
  .socials, .footer-links { display: flex; flex-wrap: wrap; gap: var(--site-space-2xs) var(--site-space-m); margin: 0; padding: 0; list-style: none; }
  .socials { font-size: var(--site-step--1); line-height: 1; letter-spacing: .14em; }
  .socials a { color: var(--site-text); }

  .stack { display: flex; flex-direction: column; gap: var(--site-space-s-m); }
  .split { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 25rem), 1fr)); gap: var(--site-space-l-xl); align-items: center; }
  .page-title { font: 700 var(--site-h1)/1.1 var(--site-display); text-transform: uppercase; text-wrap: balance; }
  .lede { font-size: var(--site-step-0); line-height: 1.75; text-wrap: pretty; }
  .stack > .facts { margin-top: 0; }
  .cols { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 18.75rem), 1fr)); gap: var(--site-space-s-m); }
  .point { display: flex; flex-direction: column; gap: var(--site-space-2xs); }
  .point h3, .owner h3 { font: 700 var(--site-step-1)/1.15 var(--site-display); text-transform: uppercase; }
  .point p { color: var(--site-mid); font-size: var(--site-step--1); line-height: 1.7; }
  .aside { color: var(--site-muted); font-size: var(--site-step--1); line-height: 1.5; }
  .aside a { color: inherit; }
  .owners { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 20rem), 1fr)); gap: var(--site-space-m-l); }
  .owner { display: flex; flex-wrap: wrap; align-items: flex-start; gap: var(--site-space-s-m); }
  .owner-text { display: flex; flex: 1 1 13.75rem; flex-direction: column; gap: var(--site-space-2xs); }
  .owner-text .slot { align-self: stretch; padding: var(--site-space-2xs) var(--site-space-xs); font-size: var(--site-step--1); line-height: 1.7; }
  .eyebrow { color: var(--site-muted); font-size: var(--site-step--1); letter-spacing: .18em; }
  .frame { display: grid; place-items: center; padding: var(--site-space-xs); box-sizing: border-box; border: 1px dashed var(--site-edge); background: var(--site-frame); color: var(--site-muted); font-size: var(--site-step--1); text-align: center; }
  .frame-1x1 { max-inline-size: 33.5rem; aspect-ratio: 1; }
  .frame-4x5 { flex: 1 1 10rem; max-inline-size: 11.25rem; aspect-ratio: 4 / 5; }
  .cta { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: flex-start; gap: var(--site-space-m); padding-top: var(--site-space-m); border-top: 2px solid var(--site-text); }
  .cta p { max-inline-size: 34em; font-size: var(--site-step-0); line-height: 1.75; }
  .actions { display: flex; flex-wrap: wrap; gap: var(--site-space-s); }
  .button { padding: 1.2em 2.1em; border: 1px solid var(--site-accent); background: var(--site-accent); color: var(--site-on-accent); font-size: var(--site-step--1); font-weight: 700; letter-spacing: .08em; transition: background-color var(--site-quick), border-color var(--site-quick); }
  .button:hover { border-color: var(--site-accent-hover); background: var(--site-accent-hover); color: var(--site-on-accent); text-decoration-line: none; }
  .button-ghost { border-color: var(--site-field-edge); background: none; color: var(--site-text); }
  .button-ghost:hover { border-color: var(--site-accent); background: var(--site-accent); }
  .intro { max-inline-size: 66ch; }
  .intro .lede { line-height: 1.65; }
  .eyebrow + * { margin-top: var(--site-space-s); }
  h2.eyebrow { font-weight: 600; letter-spacing: .14em; }
  .feature { padding-block: var(--site-space-m-l); border-top: 2px solid var(--site-text); border-bottom: 1px solid var(--site-rule); }
  .feature h3 { font: 700 var(--site-step-2)/1.1 var(--site-display); text-transform: uppercase; }
  .feature-price { font-size: var(--site-step-2); font-weight: 700; text-transform: none; }
  .feature-copy { color: var(--site-mid); font-size: var(--site-step-0); }
  .stack > .button { align-self: flex-start; }
  .note { color: var(--site-mid); font-size: var(--site-step--1); }
  .plist { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 17.5rem), 1fr)); gap: var(--site-space-m-l); margin: 0; padding: 0; list-style: none; }
  .pcard { display: flex; flex-direction: column; gap: var(--site-space-2xs); padding-top: var(--site-space-s); border-top: 1px solid var(--site-rule); }
  .pcard h3 { font: 700 var(--site-step-1)/1.1 var(--site-display); text-transform: uppercase; }
  .pcard .photo { margin-bottom: var(--site-space-2xs); }
  .from { color: var(--site-accent); font-size: var(--site-step--1); letter-spacing: .1em; text-transform: none; }
  .pcard-copy { color: var(--site-mid); font-size: var(--site-step--1); line-height: 1.55; }
  .ship { color: var(--site-muted); font-size: var(--site-step--1); }
  .deptband { padding: var(--site-space-l); background: var(--site-wash); }
  .deptband h2 { font: 700 var(--site-step-2)/1.1 var(--site-display); text-transform: uppercase; }
  .deptband-copy { max-inline-size: 60ch; color: var(--site-mid); }
  .cart-count:empty, .cart-count:has([hidden]) { display: none; }
  .cart-count { margin-inline-start: .3em; padding: .15em .45em; background: var(--site-accent); color: var(--site-on-accent); letter-spacing: 0; }
  .order { display: flex; flex-wrap: wrap; align-items: flex-end; gap: var(--site-space-xs); margin-top: var(--site-space-xs); padding-top: var(--site-space-s); border-top: 1px solid var(--site-rule); }
  .field { display: flex; flex: 1 1 9rem; flex-direction: column; gap: var(--site-space-3xs); color: var(--site-muted); font-size: var(--site-step--1); }
  .field-qty { flex: 0 1 5rem; }
  .field :is(select, input) { min-block-size: var(--site-hit); padding: 0 var(--site-space-2xs); border: 1px solid var(--site-field-edge); border-radius: 0; background: var(--site-surface); color: var(--site-text); font: 400 var(--site-step--1)/1 var(--site-body); box-sizing: border-box; inline-size: 100%; transition: border-color var(--site-quick); }
  .order-total { flex: 1 1 5rem; font: 700 var(--site-step-1)/1 var(--site-display); align-self: center; }
  button.button { cursor: pointer; font-family: var(--site-display); }
  .order .aside { flex: 1 1 100%; }
  .cart-lines { display: flex; flex-direction: column; margin: 0; padding: 0; list-style: none; }
  .cart-line { display: flex; flex-wrap: wrap; align-items: center; gap: var(--site-space-s) var(--site-space-m); padding-block: var(--site-space-s); border-bottom: 1px solid var(--site-rule); }
  .cart-what { flex: 1 1 14rem; }
  .cart-art { flex: 0 1 12.5rem; min-inline-size: 0; }
  .line-name { font: 700 var(--site-step-1)/1.1 var(--site-display); text-transform: uppercase; }
  .stepper { display: flex; align-items: center; border: 1px solid var(--site-field-edge); background: var(--site-surface); }
  .stepper button { inline-size: var(--site-hit); block-size: var(--site-hit); border: 0; background: none; color: var(--site-text); font: 400 var(--site-step-1)/1 var(--site-body); cursor: pointer; }
  .stepper button:hover { color: var(--site-accent); }
  .stepper:focus-within { border-color: var(--site-text); }
  .amount { min-inline-size: 5.5em; margin-inline-start: auto; text-align: end; font-weight: 500; }
  .cart-remove { min-block-size: var(--site-hit); min-inline-size: var(--site-hit); padding: 0; border: 0; background: none; color: var(--site-muted); font: 400 var(--site-step--1)/1 var(--site-body); text-decoration: underline; text-underline-offset: 3px; cursor: pointer; }
  .cart-remove:hover { color: var(--site-accent); }
  .checkout { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 21.25rem), 1fr)); gap: var(--site-space-l-xl); align-items: start; }
  .summary { position: sticky; top: var(--site-space-m); min-inline-size: 0; padding: var(--site-space-m); border: 1px solid var(--site-rule); border-top: 2px solid var(--site-accent); background: var(--site-surface); }
  .qty-help { display: none; flex: 1 1 100%; color: var(--site-accent); }
  .cart-line:has(:invalid) .qty-help { display: block; }
  .sums { display: flex; flex-direction: column; gap: var(--site-space-2xs); max-inline-size: 26rem; margin: var(--site-space-s) 0 0; }
  .sum { display: flex; justify-content: space-between; gap: var(--site-space-m); color: var(--site-mid); }
  .sum dd { margin: 0; text-align: end; }
  .sum-strong { color: var(--site-text); font: 700 var(--site-step-1)/1 var(--site-display); }
  .steps { display: flex; flex-wrap: wrap; gap: var(--site-space-m); margin: 0; padding: 0; list-style: none; color: var(--site-muted); font-size: var(--site-step--1); letter-spacing: .1em; }
  .steps li { padding-block-end: .5em; border-block-end: 2px solid transparent; }
  .steps [aria-current] { border-block-end-color: var(--site-accent); color: var(--site-text); }
  .ship-form { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 14rem), 1fr)); gap: var(--site-space-s); }
  .field-street { grid-column: 1 / -1; }
  .routes { display: flex; flex-wrap: wrap; gap: var(--site-space-s); }
  .route { flex: 1 1 calc((30rem - 100%) * 999); display: flex; flex-direction: column; gap: var(--site-space-2xs); min-block-size: var(--site-hit); padding: var(--site-space-s); border: 1px solid var(--site-field-edge); background: var(--site-surface); color: var(--site-mid); font: 400 var(--site-step--1)/1.5 var(--site-body); text-align: start; cursor: pointer; transition: border-color var(--site-quick); }
  .route b { color: var(--site-text); font-size: var(--site-step-1); font-weight: 700; }
  .route:hover, .route:has(:checked) { border-color: var(--site-accent); }
  .route:has(:checked) { outline: 1px solid var(--site-accent); }
  .route:has(:focus-visible) { outline: 2px solid var(--site-focus); outline-offset: 2px; }
  .route input { position: absolute; opacity: 0; pointer-events: none; }
  button.button:disabled, button.button[aria-disabled="true"], .checkout:has(.cart-line :invalid) [type=submit] { border-color: var(--site-edge); background: var(--site-wash); color: var(--site-muted); cursor: default; }
  .checkout:has(.cart-line :invalid) [type=submit] { pointer-events: none; }
  .field :is(select, input):hover { border-color: var(--site-text); }
  .field :is(select, input):focus-visible { border-color: var(--site-accent); outline-offset: 0; }
  .field :is(select, input):user-invalid { border-color: var(--site-accent); }
  .stepper button, .cart-remove, .steps li { transition: color var(--site-quick), border-color var(--site-quick); }
  .stack > .rule-head:not(:first-child) { margin-top: var(--site-space-l); }
  .sums + .actions, .stack > .actions { margin-top: var(--site-space-m); }
  .kicker { display: flex; align-items: center; gap: var(--site-space-m); color: var(--site-accent); font-size: var(--site-step--1); letter-spacing: .18em; }
  .kicker::before { content: ""; inline-size: var(--site-space-l); block-size: 2px; background: repeating-linear-gradient(to right, var(--site-accent) 0 var(--site-space-2xs), transparent var(--site-space-2xs) var(--site-space-xs)); }
  .display-title { max-inline-size: 22em; font: 700 var(--site-step-5)/1.04 var(--site-display); text-transform: uppercase; text-wrap: balance; }
  .reviews-lede { max-inline-size: 38em; font-size: var(--site-step-0); line-height: 1.7; }
  .filters { display: flex; flex-wrap: wrap; gap: var(--site-space-2xs); font-size: var(--site-step--1); letter-spacing: .12em; }
  .filter { min-block-size: var(--site-hit); padding: 0 1.2em; border: 1px solid var(--site-field-edge); background: none; color: var(--site-text); font: inherit; letter-spacing: inherit; text-transform: inherit; cursor: pointer; transition: border-color var(--site-quick), background-color var(--site-quick); }
  .filter:hover { border-color: var(--site-accent); }
  .filter[aria-pressed="true"], .choice:has(:checked) { border-color: var(--site-text); background: var(--site-text); color: var(--site-bg); }
  .quote-by { flex-direction: column; }
  .quote figcaption.quote-by > :first-child { color: var(--site-accent); }
  .quote-product { font-size: var(--site-step--1); letter-spacing: .14em; }
  .quote-meta { display: flex; flex-wrap: wrap; justify-content: space-between; gap: var(--site-space-2xs); }
  .quote-meta > :first-child { color: var(--site-text); }
  .dept { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 15rem), 1fr)); gap: var(--site-space-m-l) var(--site-space-l); align-items: start; padding: var(--site-space-l); border: 1px solid var(--site-rule); border-top: 2px solid var(--site-accent); background: var(--site-surface); }
  .dept h3 { font: 700 var(--site-step-2)/1.1 var(--site-display); text-transform: uppercase; }
  .dept-facts { margin: 0; border-top: 1px solid var(--site-rule); font-size: var(--site-step--1); line-height: 1.5; }
  .dept-fact { display: flex; justify-content: space-between; gap: var(--site-space-s); padding-block: var(--site-space-2xs); border-bottom: 1px solid var(--site-rule); }
  .dept-fact dt { color: var(--site-muted); }
  .dept-fact dd { margin: 0; text-align: end; }
  .dept-quote { display: flex; flex-direction: column; gap: var(--site-space-xs); }
  .dept-quote blockquote { font-size: var(--site-step-0); line-height: 1.7; text-wrap: pretty; }
  .dept-quote figcaption { color: var(--site-muted); font-size: var(--site-step--1); }
  .card { padding: var(--site-space-l); border: 1px solid var(--site-rule); background: var(--site-surface); }
  .card p { color: var(--site-mid); font-size: var(--site-step-0); line-height: 1.7; }
  .direct { margin: 0; border-top: 2px solid var(--site-text); }
  .direct-row { display: grid; grid-template-columns: minmax(5rem, 9rem) 1fr; gap: var(--site-space-s); align-items: baseline; padding-block: var(--site-space-xs); border-bottom: 1px solid var(--site-rule); }
  .direct-row dd { margin: 0; }
  .direct-links { display: flex; flex-wrap: wrap; gap: var(--site-space-m); }
  .card-title { font: 700 var(--site-step-1)/1.15 var(--site-display); text-transform: uppercase; }
  .card-link { color: var(--site-text); transition: border-color var(--site-quick); }
  .card-link:hover { border-color: var(--site-accent); color: var(--site-text); text-decoration-line: none; }
  .field textarea { padding: var(--site-space-2xs); border: 1px solid var(--site-field-edge); border-radius: 0; background: var(--site-surface); color: var(--site-text); font: 400 var(--site-step--1)/1.5 var(--site-body); box-sizing: border-box; inline-size: 100%; resize: vertical; transition: border-color var(--site-quick); }
  .field textarea:hover { border-color: var(--site-text); }
  .field textarea:focus-visible { border-color: var(--site-accent); outline-offset: 0; }
  .hit { display: inline-block; padding-block: calc((var(--site-hit) - 1lh) / 2); margin-block: calc((1lh - var(--site-hit)) / 2); }
  .text-link { text-decoration: underline; text-underline-offset: 3px; }
  a.filter { display: inline-flex; align-items: center; }
  .faq { border-top: 1px solid var(--site-rule); }
  .qa { border-bottom: 1px solid var(--site-rule); }
  .qa summary { display: flex; justify-content: space-between; align-items: center; gap: var(--site-space-m); min-block-size: var(--site-hit); padding-block: var(--site-space-xs); font: 700 var(--site-step-1)/1.15 var(--site-display); text-transform: uppercase; list-style: none; cursor: pointer; transition: color var(--site-quick); }
  .qa summary::-webkit-details-marker { display: none; }
  .qa summary:hover { color: var(--site-accent); }
  .qa-mark { flex: none; color: var(--site-accent); font: 400 var(--site-step-2)/1 var(--site-body); transition: rotate var(--site-quick); }
  .qa[open] .qa-mark { rotate: 45deg; }
  .qa p { max-inline-size: 44em; padding-bottom: var(--site-space-s); color: var(--site-mid); line-height: 1.7; }
  .direct-plain { border-top: 1px solid var(--site-rule); }
  .direct-row { line-height: 1.6; }
  .logo-star { fill: var(--site-logo-star); stroke: var(--site-logo-edge); }
  .logo-ink { fill: var(--site-logo-ink); }
  .logo-tagline { fill: currentColor; }
  .logo-name { fill: var(--site-logo-red); stroke: var(--site-logo-edge); }
  .spec-lines { display: flex; flex-direction: column; }
  .choices { min-inline-size: 0; margin: 0; padding: 0; border: 0; }
  .choices legend { padding: 0 0 var(--site-space-3xs); color: var(--site-muted); font-size: var(--site-step--1); }
  .choice { display: inline-flex; align-items: center; cursor: pointer; }
  .choice input { position: absolute; opacity: 0; pointer-events: none; }
  .choice:has(:focus-visible) { outline: 2px solid var(--site-focus); outline-offset: 2px; }
  .stepper input { inline-size: 5ch; min-inline-size: var(--site-hit); min-block-size: var(--site-hit); padding: 0; border: 0; background: none; color: var(--site-text); font: 500 var(--site-step-0)/1 var(--site-body); text-align: center; appearance: textfield; }
  .stepper input::-webkit-inner-spin-button, .stepper input::-webkit-outer-spin-button { appearance: none; margin: 0; }
  .line-qty { color: var(--site-mid); }
  .added { flex: 1 1 100%; color: var(--site-mid); font-size: var(--site-step--1); }
  .added:empty { display: none; }
  .sr { position: absolute; inline-size: 1px; block-size: 1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
  .search-results a { display: inline-block; padding-block: calc((var(--site-hit) - 1lh) / 2); }
  .search-results p { display: none; }
  .search-results ul:not(:has(> li:not([style*="none"]))) + p { display: block; }
  .site-footer .hit { margin-inline: -.5em; padding-inline: .5em; }
  .stepper input:user-invalid { outline: 2px solid var(--site-accent); outline-offset: -2px; }
  .qa-title { font: inherit; }
  .qa-body { display: flex; flex-direction: column; gap: var(--site-space-2xs); padding-bottom: var(--site-space-s); }
  .qa-body p { padding-bottom: 0; }
  .qa-body .eyebrow + * { margin-top: 0; }
  .qa-body .eyebrow:not(:first-child) { margin-top: var(--site-space-s); }
  .qa-body :is(ul, ol) { max-inline-size: 44em; margin: 0; padding-inline-start: 1.2em; color: var(--site-mid); line-height: 1.7; }
  .measures :is(b, em) { display: block; }
  .measures b { color: var(--site-text); }
  .crumb { padding-top: var(--site-space-m); color: var(--site-muted); font-size: var(--site-step--1); }
  .timeline, .terms { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 11rem), 1fr)); gap: var(--site-space-s-m); margin: 0; padding-inline: 0; list-style: none; }
  .terms { margin-top: var(--site-space-l); padding-block: var(--site-space-s); border-block: 1px solid var(--site-rule); }
  .terms dd { margin: 0; }
  .tiers { display: grid; grid-template-columns: repeat(auto-fill, minmax(max(9rem, (100% - 3 * var(--site-space-m)) / 4), 1fr)); gap: 0 var(--site-space-m); margin: 0; padding: 0; list-style: none; }
  .tier { display: flex; flex-direction: column; gap: var(--site-space-3xs); padding-block: var(--site-space-s); border-bottom: 1px solid var(--site-rule); }
  .tier-amount { font: 700 var(--site-step-2)/1 var(--site-display); }
  .tier-size { color: var(--site-muted); font-size: var(--site-step--1); }
  .sizerun, .swatchrow { display: flex; flex-wrap: wrap; gap: var(--site-space-2xs) var(--site-space-xs); margin: 0; padding: 0; list-style: none; }
  .sizerun li { padding: .2em .7em; border: 1px solid var(--site-rule); background: var(--site-surface); }
  .swatch { inline-size: 1.75rem; block-size: 1.75rem; border: 1px solid color-mix(in srgb, var(--site-text) 45%, transparent); border-radius: 50%; background: var(--swatch); }
  .swatch-tactical-black, .swatch-placard-tactical-black { --swatch: #1a1a1a; }
  .swatch-sheriff-gold { --swatch: #c9a227; }
  .swatch-duty-white { --swatch: #f5f5f5; }
  .swatch-granite-gray { --swatch: #707070; }
  .swatch-patrol-silver { --swatch: #c0c0c0; }
  .swatch-vegas-gold { --swatch: #b8860b; }
  .swatch-reflective-vegas-gold { --swatch: #d4a84a; }
  .swatch-shadow-gray { --swatch: #3a3a3a; }
  .swatch-placard-ranger-olive { --swatch: #4b5320; }
  .swatch-placard-patrol-navy { --swatch: #152238; }
  .swatch-placard-multicam { --swatch: #7a6a4a; }
  .swatch-placard-sheriff-brown { --swatch: #5a3825; }
  .swatch-placard-desert-tan { --swatch: #c2b280; }
  .swatch-placard-coyote { --swatch: #81613c; }
  .swatch-placard-safety-yellow { --swatch: #f3e600; }
  .card .eyebrow + * { margin-top: 0; }
  .cart-bar { position: sticky; inset-block-start: 0; z-index: 5; display: flex; flex-wrap: wrap; align-items: center; gap: var(--site-space-2xs) var(--site-space-s); padding-block: var(--site-space-xs); border-bottom: 1px solid var(--site-rule); background: var(--site-bg); box-shadow: 0 0 0 100vmax var(--site-bg); clip-path: inset(0 -100vmax); }
  .cart-bar .added { flex: 1 1 auto; }
  .cart-bar-go { padding: calc((var(--site-hit) - 1lh) / 2) var(--site-space-s); border: 1px solid var(--site-text); background: var(--site-text); color: var(--site-bg); font-size: var(--site-step--1); font-weight: 700; letter-spacing: .1em; }
  .cart-bar-go:hover { color: var(--site-bg); text-decoration-line: none; }
  .cart-brief .sums { max-inline-size: none; }
  .cart-brief:has(.cart-lines, #cart-brief-loading) .cart-brief-empty { display: none; }
  .cart-brief:not(:has(.cart-lines)) #cart-brief-count { display: none; }
  .build { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 21.25rem), 1fr)); gap: var(--site-space-l-xl); align-items: start; }
  .build-main { min-inline-size: 0; }
  .build-side { position: sticky; inset-block-start: var(--site-space-m); min-inline-size: 0; padding: var(--site-space-m); border: 1px solid var(--site-rule); border-top: 2px solid var(--site-text); background: var(--site-surface); }
  .staged { display: flex; flex-flow: row-reverse wrap; align-items: flex-start; gap: var(--site-space-l-xl); }
  .staged-main { flex: 1 1 21.25rem; min-inline-size: 0; }
  .staged-main .build-side { position: static; }
  .stage { position: sticky; inset-block-start: 0; z-index: 3; flex: 1 1 21.25rem; min-inline-size: 0; padding: var(--site-space-s); border: 1px solid var(--site-rule); background: var(--site-surface); }
  .staged-main :is(input, select, button, a) { scroll-margin-block-start: calc(45svh + 10rem); }
  .stage-art { display: grid; justify-items: center; gap: var(--site-space-xs); inline-size: 100%; }
  .stage-head { display: flex; justify-content: space-between; align-items: baseline; gap: var(--site-space-s); inline-size: 100%; margin: 0; }
  .stage-note { margin: 0; text-align: center; }
  .panel-art { display: block; inline-size: 100%; max-inline-size: 27.5rem; max-block-size: 45svh; overflow: visible; }
  .panel-art-ground { fill: var(--swatch, var(--site-surface)); stroke: var(--site-text); stroke-width: 3; }
  .panel-art-hem { fill: none; stroke: rgb(255 255 255 / .3); stroke-width: 3; stroke-dasharray: 10 8; }
  .panel-art-line { fill: var(--swatch, var(--site-text)); font-family: Inter, "Arial Black", sans-serif; font-weight: 900; font-kerning: none; font-feature-settings: "kern" 0, "calt" 0, "liga" 0; letter-spacing: .02em; text-anchor: middle; }
  .panel-art-prompt { opacity: .32; }
  .chips { display: grid; grid-template-columns: repeat(auto-fill, minmax(4.75rem, 1fr)); gap: var(--site-space-2xs); }
  .chip { position: relative; display: grid; place-items: center; min-block-size: var(--site-hit); border: 1px solid var(--site-field-edge); background: var(--site-surface); font: 600 var(--site-step--1)/1 var(--site-display); letter-spacing: .04em; cursor: pointer; transition: border-color var(--site-quick), background-color var(--site-quick), color var(--site-quick); }
  .chip:hover { border-color: var(--site-text); }
  .chip:has(:checked) { border-color: var(--site-text); background: var(--site-text); color: var(--site-surface); }
  .chip:has(:focus-visible) { outline: 2px solid var(--site-focus); outline-offset: 2px; }
  .chip input { position: absolute; opacity: 0; pointer-events: none; }
  .choices.stack { margin-top: var(--site-space-s); }
  .choices.stack > legend { padding-bottom: var(--site-space-xs); color: var(--site-text); font-size: var(--site-step-1); font-weight: 700; letter-spacing: .08em; }
  .request { max-inline-size: 32rem; }
  .request-fields { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 12rem), 1fr)); gap: var(--site-space-s); }
  .switch { align-self: flex-start; display: flex; border: 1px solid var(--site-text); }
  .switch-part { position: relative; display: grid; place-items: center; min-block-size: var(--site-hit); padding: 0 var(--site-space-m); font-size: var(--site-step-0); font-weight: 700; letter-spacing: .08em; cursor: pointer; transition: background-color var(--site-quick), color var(--site-quick); }
  .switch-part + .switch-part { border-inline-start: 1px solid var(--site-text); }
  .switch-part:has(:checked) { background: var(--site-text); color: var(--site-surface); }
  .switch-part:has(:focus-visible) { outline: 2px solid var(--site-focus); outline-offset: 2px; }
  .switch-part input { position: absolute; opacity: 0; pointer-events: none; }
  .model { display: flex; flex-direction: column; gap: var(--site-space-2xs); }
  .model-head { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: baseline; gap: var(--site-space-3xs) var(--site-space-s); }
  .model-name { font: 700 var(--site-step-4)/1 var(--site-display); }
  .model-price { font: 700 var(--site-step-2)/1 var(--site-display); }
  .size-tiles { display: grid; grid-template-columns: repeat(auto-fill, minmax(max(5.5rem, (100% - 3 * var(--site-space-2xs)) / 4), 1fr)); gap: var(--site-space-2xs); }
  .size-tile { display: flex; flex-direction: column; align-items: center; gap: var(--site-space-3xs); padding: var(--site-space-2xs) var(--site-space-3xs) var(--site-space-3xs); border: 1px solid var(--site-rule); background: var(--site-surface); }
  .size-tile .stepper { inline-size: 100%; border: 0; background: none; }
  .size-tile .stepper :is(button, input) { flex: 1 1 0; inline-size: 0; min-inline-size: 1.5rem; }
  .wording-line { display: flex; flex-wrap: wrap; align-items: flex-end; gap: var(--site-space-xs); }
  .add-line { border: 0; background: none; color: var(--site-text); cursor: pointer; }
  .price-qty { display: flex; flex-wrap: wrap; align-items: center; gap: var(--site-space-xs) var(--site-space-s); }
  .price-qty .hint { flex: 1 1 10rem; }
  .price-sums { max-inline-size: none; }
  .build-side > .button { align-self: stretch; text-align: center; }
  .cart-brief, .pouch-add { scroll-margin-top: calc(var(--site-hit) + var(--site-space-l)); }
  .pouch-set { padding-top: var(--site-space-l); }
  .pouch-group { padding-top: var(--site-space-s); border-top: 1px solid var(--site-rule); color: var(--site-muted); font-size: var(--site-step--1); letter-spacing: .14em; }
  .pouches { display: grid; grid-template-columns: repeat(auto-fill, minmax(max(min(100%, 18rem), (100% - 2 * var(--site-space-s)) / 3), 1fr)); gap: var(--site-space-s); margin: var(--site-space-s) 0 0; padding: 0; list-style: none; }
  .pouch { display: flex; align-items: center; gap: var(--site-space-s); padding: var(--site-space-s); border: 1px solid var(--site-rule); }
  .pouch-info { flex: 1; min-inline-size: 0; }
  .pouch-name { font: 700 var(--site-step-0)/1.2 var(--site-display); letter-spacing: .03em; text-transform: uppercase; }
  .pouch-from { color: var(--site-muted); font-size: var(--site-step--1); }
  .pouch-top { align-items: start; }
  .pouch-price { font: 700 var(--site-step-2)/1 var(--site-display); }
  .pouch-fits { padding-block: var(--site-space-s); border-top: 2px solid var(--site-text); border-bottom: 1px solid var(--site-rule); }
  .pouch-fits b { display: block; margin-bottom: var(--site-space-2xs); color: var(--site-muted); font-size: var(--site-step--1); letter-spacing: .14em; }
  .pouch-order { padding-inline-start: var(--site-space-s); border-inline-start: 2px solid var(--site-accent); }
  .pouch-specs { columns: 2 20rem; column-gap: var(--site-space-l-xl); }
  .pouch-spec { break-inside: avoid; padding-bottom: var(--site-space-s); }
  .pouch-spec h3 { margin-bottom: var(--site-space-2xs); color: var(--site-muted); font-size: var(--site-step--1); letter-spacing: .14em; }
  .pouch-spec ul { margin: 0; padding-inline-start: 1.1em; color: var(--site-mid); line-height: 1.6; }
  .pouch-others { display: flex; flex-wrap: wrap; gap: var(--site-space-2xs); }
  .pouch-others a { display: grid; place-items: center; min-block-size: var(--site-hit); padding-inline: var(--site-space-xs); border: 1px solid var(--site-edge); color: var(--site-mid); font-size: var(--site-step--1); letter-spacing: .09em; }
  .pouch-others a:hover { border-color: var(--site-text); color: var(--site-text); text-decoration-line: none; }
  .pouch-others a[aria-current] { border-color: var(--site-text); background: var(--site-text); color: var(--site-bg); }
  .pouch-add { flex: none; min-block-size: var(--site-hit); padding: 0 var(--site-space-s); border: 1px solid var(--site-text); background: none; color: var(--site-text); font-size: var(--site-step--1); font-weight: 700; letter-spacing: .1em; cursor: pointer; transition: background-color var(--site-quick), color var(--site-quick); }
  .pouch-add:hover { background: var(--site-text); color: var(--site-surface); }
  .sheet { inset: 0 0 0 auto; inline-size: min(26rem, 100%); block-size: 100dvb; max-inline-size: none; max-block-size: none; margin: 0; padding: 0; border: 0; border-inline-start: 1px solid var(--site-rule); background: var(--site-surface); color: var(--site-text); translate: 100% 0; transition: translate var(--site-quick) ease-out, overlay var(--site-quick) allow-discrete, display var(--site-quick) allow-discrete; }
  .sheet:popover-open { display: flex; flex-direction: column; translate: 0 0; }
  @starting-style { .sheet:popover-open { translate: 100% 0; } }
  .sheet::backdrop { background: rgb(0 0 0 / .45); }
  .sheet-head { flex: none; display: flex; justify-content: space-between; align-items: flex-start; gap: var(--site-space-s); padding: var(--site-space-m); border-bottom: 1px solid var(--site-rule); }
  .sheet-price { margin-top: var(--site-space-3xs); font: 700 var(--site-step-1)/1 var(--site-display); }
  .sheet-close { flex: none; inline-size: var(--site-hit); block-size: var(--site-hit); margin: calc(var(--site-space-xs) * -1); border: 0; background: none; color: var(--site-muted); font: 400 var(--site-step-2)/1 var(--site-body); cursor: pointer; }
  .sheet-close:hover { color: var(--site-text); }
  .sheet-body { flex: 1; min-block-size: 0; overflow-y: auto; }
  .sheet .pouch-form { box-sizing: border-box; min-block-size: 100%; padding: var(--site-space-m) var(--site-space-m) 0; }
  .sheet .pouch-form-foot { position: sticky; inset-block-end: 0; margin-inline: calc(var(--site-space-m) * -1); padding: var(--site-space-s) var(--site-space-m) max(var(--site-space-s), env(safe-area-inset-bottom)); border-top: 1px solid var(--site-rule); background: var(--site-surface); }
  .pouch-form { display: flex; flex-direction: column; gap: var(--site-space-s); }
  form.pouch-form > * { flex: none; }
  .field-name { font-family: var(--site-display); font-weight: 600; line-height: 1; letter-spacing: .14em; text-transform: uppercase; }
  .pouch-form .hint { margin-top: calc(var(--site-space-2xs) * -1); }
  .pouch-form-foot { display: flex; align-items: center; gap: var(--site-space-xs); margin-top: auto; }
  .pouch-form-foot .button { flex: 1; }
  .swatches { display: flex; min-inline-size: 0; margin: 0; padding: 0; border: 0; }
  .swatches legend { margin-bottom: var(--site-space-3xs); padding: 0; color: var(--site-muted); font-size: var(--site-step--1); letter-spacing: .1em; }
  .swatches-head { display: flex; flex-wrap: wrap; justify-content: space-between; gap: var(--site-space-3xs) var(--site-space-s); inline-size: 100%; }
  .swatches-chosen { color: var(--site-text); letter-spacing: .04em; }
  .swatch-pick { position: relative; flex: 1 1 0; display: grid; place-items: center; min-inline-size: 1.5rem; max-inline-size: var(--site-hit); aspect-ratio: 1; cursor: pointer; }
  .swatch-pick::before { content: ""; box-sizing: border-box; inline-size: 64%; aspect-ratio: 1; border: 1px solid color-mix(in srgb, var(--site-text) 45%, transparent); border-radius: 50%; background: var(--swatch); }
  .swatch-pick:has(:checked)::before { outline: 2px solid var(--site-text); outline-offset: 2px; }
  .swatch-pick:has(:focus-visible)::before { outline: 2px solid var(--site-focus); outline-offset: 2px; }
  .swatch-pick input { position: absolute; opacity: 0; pointer-events: none; }
  .swatch-pouch-black { --swatch: #161616; }
  .swatch-pouch-dark-navy { --swatch: #1d2a44; }
  .swatch-pouch-silver-tan { --swatch: #c6b393; }
  .swatch-pouch-coyote-brown { --swatch: #7d6547; }
  .swatch-pouch-brown { --swatch: #4b3a2a; }
  .swatch-pouch-olive-green { --swatch: #57573c; }
  .swatch-pouch-ranger-green { --swatch: #4e5843; }
  .swatch-pouch-forest-green { --swatch: #2f3d2f; }
  .swatch-pouch-gray { --swatch: #8a8d8f; }
  .swatch-pouch-multicam { --swatch: #6f6a4e; }
  .refused { color: var(--site-accent); font-size: var(--site-step--1); }
  .refused:empty { display: none; }
  .hint { flex: 1 1 100%; color: var(--site-muted); font-size: var(--site-step--1); line-height: 1.5; }
  .vest-card { display: flex; flex-direction: column; border: 1px solid var(--site-rule); background: var(--site-surface); }
  .vest-figure { display: grid; place-items: center; padding: var(--site-space-m) var(--site-space-m) var(--site-space-2xs); border-bottom: 1px solid var(--site-rule); }
  .vest-drawing { inline-size: min(100%, 11.25rem); block-size: auto; stroke: var(--site-text); stroke-width: 1.5; }
  .vest-body { fill: light-dark(#c7ccd1, #3a3f46); stroke-width: 2; }
  .vest-front { stroke-dasharray: 4 3; }
  .vest-id { fill: var(--site-surface); }
  .vest-pocket { fill: var(--site-muted); }
  .vest-text { flex: 1; display: flex; flex-direction: column; gap: var(--site-space-xs); padding: var(--site-space-m); }
  .vest-head { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: baseline; gap: var(--site-space-3xs) var(--site-space-xs); }
  .vest-name { font: 700 var(--site-step-2)/1 var(--site-display); text-transform: uppercase; }
  .vest-price { font: 700 var(--site-step-1)/1 var(--site-display); }
  .vest-tag { color: var(--site-accent); font-size: var(--site-step--1); letter-spacing: .14em; }
  .vest-holds { flex: 1; display: flex; flex-direction: column; gap: var(--site-space-2xs); }
  .vest-text .button { text-align: center; }
  .carries { margin: 0; padding-inline-start: 1.2em; color: var(--site-mid); font-size: var(--site-step--1); line-height: 1.6; }
  .tiles .card .more { margin-top: auto; }
  .receipts { display: flex; flex-direction: column; gap: var(--site-space-m); margin: 0; padding: 0; list-style: none; }
  .receipt { display: flex; flex-direction: column; gap: var(--site-space-s); padding: var(--site-space-m); border: 1px solid var(--site-rule); background: var(--site-surface); }
  .route-note { display: none; padding-top: var(--site-space-2xs); border-top: 1px solid var(--site-rule); color: var(--site-text); }
  .route:has(:checked) .route-note { display: block; }
  .when-quote, .pay:has([value="Quote"]:checked) .unless-quote { display: none; }
  .pay:has([value="Quote"]:checked) .when-quote { display: inline; }
}
