/*
Theme Name: Andy's Custom 2026
Theme URI: https://andyscustombasslures.com
Author: Ed Bermudez / Ember Branding LLC
Author URI: https://emberbrandinglc.com
Description: Custom WordPress theme for Andy's Custom Bass Lures. Editorial / heritage / Patagonia-inspired design. Built on WooCommerce. Replaces the Divi theme.
Version: 1.0.22
Requires at least: 6.0
Tested up to: 6.9.4
Requires PHP: 7.4
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: andys-custom-2026
Tags: woocommerce, e-commerce, custom-logo, custom-menu, editor-style

This theme is built for Andy's Custom Bass Lures (https://andyscustombasslures.com).
Hand-tied bass jigs from Madison, Connecticut since 1981.
*/

  :root {
    --paper: #F4EFE6;
    --paper-2: #EAE3D3;
    --paper-3: #DED5C2;
    --ink: #1A1814;
    --ink-2: #2D2A24;
    --ink-3: #4A4639;
    --rust: #B5481F;
    --rust-deep: #8B2F1A;
    --rust-hover: #962F12;
    --brass: #C49A5C;
    --brass-deep: #A07A3F;
    --wave: #2C4F60;
    --wave-deep: #1B3845;
    --muted: #6B6357;
    --line: #D0C8B8;
    --line-2: #C4BAA5;
    --success: #5C7A3F;
  }

  * { margin: 0; padding: 0; box-sizing: border-box; }
  html { scroll-behavior: smooth; }

  body {
    font-family: 'Inter Tight', sans-serif;
    background: var(--paper);
    color: var(--ink);
    line-height: 1.55;
    -webkit-font-smoothing: antialiased;
    overflow-x: hidden;
  }

  ::selection { background: var(--rust); color: var(--paper); }

  a { color: inherit; text-decoration: none; }
  button { font-family: inherit; cursor: pointer; border: none; background: none; }

  .mono {
    font-family: 'JetBrains Mono', monospace;
    font-size: 0.7em;
    letter-spacing: 0.08em;
  }

  /* ═══════════════════════════════════════════════════════════════
     UTILITY BAR
  ═══════════════════════════════════════════════════════════════ */
  .util-bar {
    background: var(--ink);
    color: var(--paper);
    height: 34px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0 32px;
    font-size: 12px;
    letter-spacing: 0.04em;
    overflow: hidden;
  }
  .util-marquee {
    display: flex;
    gap: 48px;
    animation: marquee 45s linear infinite;
    white-space: nowrap;
  }
  @keyframes marquee {
    0% { transform: translateX(0); }
    100% { transform: translateX(-50%); }
  }
  .util-marquee span {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    color: var(--paper-2);
  }
  .util-marquee span::before {
    content: '◆';
    color: var(--rust);
    font-size: 8px;
  }
  .util-right {
    display: flex;
    gap: 24px;
    flex-shrink: 0;
    padding-left: 24px;
    background: var(--ink);
    position: relative;
    z-index: 2;
  }
  .util-right a {
    color: var(--paper-2);
    transition: color 0.2s;
  }
  .util-right a:hover { color: var(--brass); }

  /* ═══════════════════════════════════════════════════════════════
     MAIN NAV
  ═══════════════════════════════════════════════════════════════ */
  nav {
    background: var(--paper);
    border-bottom: 1px solid var(--line);
    height: 76px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0 32px;
    position: sticky;
    top: 0;
    z-index: 50;
  }
  .nav-left { display: flex; align-items: center; gap: 56px; }
  .logo {
    display: flex;
    align-items: center;
    text-decoration: none;
  }
  .logo img {
    height: 44px;
    width: auto;
    display: block;
  }
  .footer-brand .logo img { height: 60px; }
  .nav-links {
    display: flex;
    gap: 32px;
    list-style: none;
  }
  .nav-links li {
    list-style: none;
    position: relative;
  }
  /* WordPress wp_nav_menu adds .menu-item / .menu-item-has-children classes —
     style submenu (sub-menu UL) as a hover dropdown. */
  .nav-links .sub-menu,
  .nav-links ul {
    list-style: none;
    margin: 0;
    padding: 12px 0;
    position: absolute;
    top: 100%;
    left: -16px;
    min-width: 200px;
    background: var(--paper);
    border: 1px solid var(--line);
    box-shadow: 0 8px 32px rgba(26, 24, 20, 0.08);
    opacity: 0;
    visibility: hidden;
    transform: translateY(8px);
    transition: opacity 0.18s ease, transform 0.18s ease, visibility 0s linear 0.18s;
    z-index: 50;
  }
  .nav-links li:hover > .sub-menu,
  .nav-links li:hover > ul,
  .nav-links li:focus-within > .sub-menu,
  .nav-links li:focus-within > ul {
    opacity: 1;
    visibility: visible;
    transform: translateY(0);
    transition-delay: 0s;
  }
  .nav-links .sub-menu li,
  .nav-links ul li {
    display: block;
    margin: 0;
  }
  .nav-links .sub-menu a,
  .nav-links ul a {
    display: block;
    padding: 10px 20px;
    font-size: 12px;
    font-weight: 500;
    letter-spacing: 0.16em;
    text-transform: uppercase;
    color: var(--ink);
    white-space: nowrap;
  }
  .nav-links .sub-menu a::after,
  .nav-links ul a::after {
    display: none;
  }
  .nav-links .sub-menu a:hover,
  .nav-links ul a:hover {
    background: var(--paper-2);
    color: var(--rust);
  }
  /* Show caret on items with children */
  .nav-links .menu-item-has-children > a::before {
    content: '';
  }
  .nav-links .menu-item-has-children > a::after {
    /* underline animation stays the same — but we add the caret as a separate
       pseudo via background isn't ideal. Use a real character via JS-free CSS: */
  }
  .nav-links .menu-item-has-children > a {
    padding-right: 14px;
  }
  .nav-links .menu-item-has-children > a:after {
    /* leave the original underline ::after alone; caret comes from text node */
  }
  /* Add a caret glyph to parent items via a span that doesn't exist in WP output —
     fall back to a CSS ::before that overlays the existing underline. */
  .nav-links .menu-item-has-children > a span.caret { /* fallback if HTML provided one */ }
  .nav-links a {
    font-size: 13px;
    font-weight: 500;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    color: var(--ink);
    position: relative;
    padding: 8px 0;
    display: flex;
    align-items: center;
    gap: 4px;
  }
  .nav-links a::after {
    content: '';
    position: absolute;
    bottom: 4px;
    left: 0;
    right: 0;
    height: 2px;
    background: var(--rust);
    transform: scaleX(0);
    transform-origin: left;
    transition: transform 0.3s;
  }
  .nav-links a:hover::after { transform: scaleX(1); }
  .caret { font-size: 8px; opacity: 0.6; }

  .nav-right {
    display: flex;
    align-items: center;
    gap: 8px;
  }
  .icon-btn {
    width: 40px; height: 40px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    transition: background 0.2s;
    position: relative;
  }
  .icon-btn:hover { background: var(--paper-2); }
  .icon-btn svg { width: 18px; height: 18px; stroke: var(--ink); fill: none; stroke-width: 1.6; }
  .cart-count {
    position: absolute;
    top: 4px; right: 4px;
    background: var(--rust);
    color: var(--paper);
    font-size: 10px;
    font-weight: 600;
    width: 18px; height: 18px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    border: 2px solid var(--paper);
  }
  .nav-cta {
    background: var(--ink);
    color: var(--paper);
    padding: 12px 22px;
    font-family: 'Anton', sans-serif;
    font-size: 14px;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    margin-left: 8px;
    transition: background 0.2s;
  }
  .nav-cta:hover { background: var(--rust); }

  /* ═══════════════════════════════════════════════════════════════
     HERO
  ═══════════════════════════════════════════════════════════════ */
  .hero {
    position: relative;
    background: var(--paper);
    overflow: hidden;
    border-bottom: 1px solid var(--line);
  }
  .hero-brand {
    display: block;
    margin-bottom: 24px;
    width: fit-content;
  }
  .hero-brand img {
    height: clamp(100px, 9vw, 150px);
    width: auto;
    max-width: 100%;
    display: block;
    background: transparent;
    border: none;
    outline: none;
    box-shadow: none;
  }
  .hero-grid {
    display: grid;
    grid-template-columns: 1.05fr 1fr;
    min-height: 520px;
    position: relative;
  }
  .hero-text {
    padding: 56px 56px 64px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    text-align: center;
    position: relative;
    z-index: 2;
  }
  .hero-eyebrow {
    display: inline-flex;
    align-items: center;
    gap: 12px;
    font-size: 11px;
    font-weight: 600;
    letter-spacing: 0.18em;
    text-transform: uppercase;
    color: var(--rust);
    margin-bottom: 28px;
    width: fit-content;
  }
  .hero-eyebrow::before, .hero-eyebrow::after {
    content: '';
    width: 24px;
    height: 1px;
    background: var(--rust);
  }
  .hero-h1 {
    font-family: 'Anton', sans-serif;
    font-size: clamp(56px, 7vw, 104px);
    line-height: 0.92;
    letter-spacing: -0.01em;
    text-transform: uppercase;
    color: var(--ink);
    margin-bottom: 32px;
  }
  .hero-h1 em {
    font-family: 'Fraunces', serif;
    font-style: italic;
    font-weight: 400;
    letter-spacing: -0.02em;
    color: var(--rust);
    display: block;
  }
  .hero-sub {
    font-size: 17px;
    line-height: 1.6;
    color: var(--ink-3);
    max-width: 480px;
    margin: 0 auto 40px;
  }
  .hero-actions {
    display: flex;
    gap: 14px;
    margin-bottom: 0;
    flex-wrap: wrap;
    justify-content: center;
  }
  .btn-primary {
    background: var(--rust);
    color: var(--paper);
    padding: 18px 32px;
    font-family: 'Anton', sans-serif;
    font-size: 15px;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    display: inline-flex;
    align-items: center;
    gap: 12px;
    transition: all 0.25s;
  }
  .btn-primary:hover {
    background: var(--rust-hover);
    transform: translateY(-2px);
    box-shadow: 0 12px 24px -8px rgba(181, 72, 31, 0.5);
  }
  .btn-primary svg { width: 16px; height: 16px; }
  .btn-secondary {
    background: transparent;
    color: var(--ink);
    padding: 18px 28px;
    font-family: 'Anton', sans-serif;
    font-size: 15px;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    border: 1.5px solid var(--ink);
    transition: all 0.25s;
  }
  .btn-secondary:hover {
    background: var(--ink);
    color: var(--paper);
  }
  /* SUB-HERO STATS STRIP */
  .sub-hero {
    background: var(--paper-2, #f3ede3);
    border-bottom: 1px solid var(--line);
    padding: 36px 32px;
  }
  .sub-hero-inner {
    max-width: 980px;
    margin: 0 auto;
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 24px;
    text-align: center;
  }
  .sub-hero-inner > div {
    border-right: 1px solid var(--line);
    padding: 4px 16px;
  }
  .sub-hero-inner > div:last-child { border-right: none; }
  @media (max-width: 700px) {
    .sub-hero-inner { grid-template-columns: 1fr; }
    .sub-hero-inner > div { border-right: none; border-bottom: 1px solid var(--line); padding-bottom: 16px; }
    .sub-hero-inner > div:last-child { border-bottom: none; padding-bottom: 0; }
  }
  .stat-num {
    font-family: 'Anton', sans-serif;
    font-size: 38px;
    line-height: 1;
    color: var(--ink);
    margin-bottom: 6px;
  }
  .stat-label {
    font-size: 11px;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    color: var(--muted);
  }

  .hero-visual {
    position: relative;
    background: var(--ink);
    overflow: hidden;
  }
  .hero-visual::before {
    content: '';
    position: absolute;
    inset: 0;
    background:
      radial-gradient(circle at 30% 40%, rgba(181, 72, 31, 0.25), transparent 55%),
      radial-gradient(circle at 70% 70%, rgba(196, 154, 92, 0.18), transparent 55%),
      linear-gradient(135deg, var(--wave-deep), var(--ink) 60%);
  }
  .hero-photo {
    position: absolute;
    inset: 0;
    background-image:
      linear-gradient(135deg, rgba(26,24,20,0.55) 0%, rgba(26,24,20,0.15) 50%, rgba(26,24,20,0.7) 100%),
      url('https://images.unsplash.com/photo-1601248981876-29b78bd607df?w=1600&q=80&auto=format');
    background-size: cover;
    background-position: center;
    filter: contrast(1.05) saturate(0.85);
  }
  .hero-card {
    position: absolute;
    background: var(--paper);
    color: var(--ink);
    z-index: 3;
  }
  .hero-card.classic {
    bottom: 48px;
    left: 48px;
    padding: 28px 32px;
    max-width: 320px;
    border-left: 4px solid var(--rust);
  }
  .hero-card.classic .label {
    font-size: 10px;
    letter-spacing: 0.18em;
    text-transform: uppercase;
    color: var(--rust);
    margin-bottom: 8px;
    font-weight: 600;
  }
  .hero-card.classic h3 {
    font-family: 'Anton', sans-serif;
    font-size: 24px;
    line-height: 1;
    margin-bottom: 6px;
    text-transform: uppercase;
  }
  .hero-card.classic p {
    font-size: 13px;
    color: var(--ink-3);
  }
  .hero-card.product {
    top: 48px;
    right: 48px;
    padding: 18px;
    width: 220px;
    box-shadow: 0 24px 60px -20px rgba(0,0,0,0.4);
  }
  .hero-card.product .product-img {
    height: 140px;
    background: linear-gradient(135deg, var(--paper-2), var(--paper-3));
    margin-bottom: 14px;
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
  }
  .hero-card.product .product-img svg { width: 80%; }
  .hero-card.product .name {
    font-family: 'Anton', sans-serif;
    font-size: 14px;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    margin-bottom: 4px;
  }
  .hero-card.product .meta {
    display: flex;
    justify-content: space-between;
    align-items: center;
  }
  .hero-card.product .price {
    font-weight: 700;
    font-size: 15px;
  }
  .hero-card.product .stars {
    color: var(--brass);
    font-size: 11px;
    letter-spacing: 1px;
  }
  .hero-tape {
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    background: var(--brass);
    color: var(--ink);
    padding: 12px 0;
    overflow: hidden;
    z-index: 4;
    border-top: 1px solid rgba(0,0,0,0.1);
  }
  .hero-tape-track {
    display: flex;
    gap: 56px;
    animation: marquee 35s linear infinite;
    white-space: nowrap;
    font-family: 'Anton', sans-serif;
    font-size: 14px;
    letter-spacing: 0.15em;
    text-transform: uppercase;
  }
  .hero-tape-track span {
    display: inline-flex;
    align-items: center;
    gap: 14px;
  }
  .hero-tape-track span::after {
    content: '✦';
    color: var(--rust-deep);
    font-size: 11px;
  }

  /* ═══════════════════════════════════════════════════════════════
     SHOP BY TECHNIQUE — the Panther Martin "Shop by Fish" pattern, elevated
  ═══════════════════════════════════════════════════════════════ */
  .section { padding: 96px 80px; }
  .section-head {
    display: flex;
    justify-content: space-between;
    align-items: end;
    margin-bottom: 48px;
    gap: 48px;
  }
  .section-head .left { max-width: 640px; }
  .section-eyebrow {
    font-size: 11px;
    letter-spacing: 0.2em;
    text-transform: uppercase;
    color: var(--rust);
    font-weight: 600;
    margin-bottom: 18px;
    display: inline-flex;
    align-items: center;
    gap: 12px;
  }
  .section-eyebrow::before {
    content: '';
    width: 28px;
    height: 1.5px;
    background: var(--rust);
  }
  .section-title {
    font-family: 'Anton', sans-serif;
    font-size: clamp(40px, 5vw, 64px);
    line-height: 0.95;
    text-transform: uppercase;
    letter-spacing: -0.005em;
    margin-bottom: 16px;
  }
  .section-title em {
    font-family: 'Fraunces', serif;
    font-style: italic;
    font-weight: 400;
    color: var(--rust);
    text-transform: lowercase;
    letter-spacing: -0.02em;
  }
  .section-sub {
    font-size: 16px;
    color: var(--ink-3);
    max-width: 520px;
  }
  .section-link {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    font-family: 'Anton', sans-serif;
    font-size: 14px;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    padding-bottom: 8px;
    border-bottom: 1.5px solid var(--ink);
    flex-shrink: 0;
    transition: color 0.2s, border-color 0.2s;
  }
  .section-link:hover { color: var(--rust); border-color: var(--rust); }

  .technique-grid {
    display: grid;
    grid-template-columns: 1.4fr 1fr 1fr;
    grid-template-rows: 1fr 1fr;
    gap: 16px;
    height: 620px;
  }
  .technique-card {
    position: relative;
    overflow: hidden;
    background: var(--ink);
    color: var(--paper);
    cursor: pointer;
    transition: transform 0.4s;
  }
  .technique-card:hover { transform: translateY(-4px); }
  .technique-card:nth-child(1) {
    grid-row: 1 / 3;
    background-image:
      linear-gradient(180deg, rgba(26,24,20,0.3) 0%, rgba(26,24,20,0.85) 90%),
      url('https://images.unsplash.com/photo-1763047085182-737f6f21385a?w=1200&q=80&auto=format');
    background-size: cover;
    background-position: center;
  }
  .technique-card:nth-child(2) {
    background-image:
      linear-gradient(180deg, rgba(26,24,20,0.25) 0%, rgba(26,24,20,0.85) 90%),
      url('https://images.unsplash.com/photo-1722798485975-8933f4d23344?w=1200&q=80&auto=format');
    background-size: cover;
    background-position: center;
  }
  .technique-card:nth-child(3) {
    background-image:
      linear-gradient(180deg, rgba(26,24,20,0.25) 0%, rgba(26,24,20,0.85) 90%),
      url('https://images.unsplash.com/photo-1762110751033-882a1ecc63ea?w=1200&q=80&auto=format');
    background-size: cover;
    background-position: center;
  }
  .technique-card:nth-child(4) {
    background-image:
      linear-gradient(180deg, rgba(26,24,20,0.25) 0%, rgba(26,24,20,0.85) 90%),
      url('https://images.unsplash.com/photo-1695189527359-76b0dff61872?w=1200&q=80&auto=format');
    background-size: cover;
    background-position: center;
  }
  .technique-card:nth-child(5) {
    background-image:
      linear-gradient(180deg, rgba(26,24,20,0.25) 0%, rgba(26,24,20,0.85) 90%),
      url('https://images.unsplash.com/photo-1762110745505-68a0a9a10d68?w=1200&q=80&auto=format');
    background-size: cover;
    background-position: center;
  }
  .technique-content {
    position: absolute;
    inset: 0;
    padding: 32px;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
  }
  .technique-num {
    font-family: 'JetBrains Mono', monospace;
    font-size: 11px;
    letter-spacing: 0.15em;
    color: var(--brass);
    opacity: 0.8;
  }
  .technique-bottom h3 {
    font-family: 'Anton', sans-serif;
    font-size: clamp(28px, 3vw, 44px);
    text-transform: uppercase;
    line-height: 0.95;
    margin-bottom: 8px;
    letter-spacing: -0.005em;
  }
  .technique-card:nth-child(1) .technique-bottom h3 { font-size: 56px; }
  .technique-bottom p {
    font-size: 13px;
    color: rgba(244, 239, 230, 0.75);
    margin-bottom: 18px;
    max-width: 360px;
  }
  .technique-link {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    font-family: 'Anton', sans-serif;
    font-size: 13px;
    letter-spacing: 0.14em;
    text-transform: uppercase;
    color: var(--paper);
    border-bottom: 1px solid var(--brass);
    padding-bottom: 4px;
    width: fit-content;
    transition: gap 0.25s, color 0.25s;
  }
  .technique-card:hover .technique-link { gap: 16px; color: var(--brass); }

  /* ═══════════════════════════════════════════════════════════════
     PRODUCT GRID
  ═══════════════════════════════════════════════════════════════ */
  .products-section {
    background: var(--paper-2);
    padding: 96px 80px;
    border-top: 1px solid var(--line);
    border-bottom: 1px solid var(--line);
  }
  .filter-bar {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 32px;
    flex-wrap: wrap;
    gap: 16px;
    padding-bottom: 20px;
    border-bottom: 1px solid var(--line);
  }
  .filter-chips {
    display: flex;
    gap: 8px;
    flex-wrap: wrap;
  }
  .chip {
    padding: 9px 18px;
    background: transparent;
    border: 1px solid var(--line-2);
    color: var(--ink-2);
    font-size: 12px;
    font-weight: 500;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    transition: all 0.2s;
    border-radius: 999px;
  }
  .chip:hover { border-color: var(--ink); }
  .chip.active {
    background: var(--ink);
    color: var(--paper);
    border-color: var(--ink);
  }
  .sort-control {
    display: flex;
    align-items: center;
    gap: 12px;
    font-size: 12px;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    color: var(--muted);
  }
  .sort-control select {
    background: transparent;
    border: 1px solid var(--line-2);
    padding: 8px 14px;
    font-family: inherit;
    font-size: 12px;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    color: var(--ink);
    border-radius: 999px;
    cursor: pointer;
  }

  .product-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 24px;
  }
  .product {
    background: var(--paper);
    position: relative;
    transition: transform 0.3s, box-shadow 0.3s;
    display: flex;
    flex-direction: column;
  }
  .product:hover {
    transform: translateY(-4px);
    box-shadow: 0 16px 40px -12px rgba(26, 24, 20, 0.18);
  }
  .product-image {
    aspect-ratio: 1;
    background: var(--paper-2);
    position: relative;
    overflow: hidden;
    display: flex;
    align-items: center;
    justify-content: center;
  }
  .product .product-image {
    background: var(--paper);
  }
  .product-image img {
    width: 88%;
    height: 88%;
    object-fit: contain;
    z-index: 2;
    transition: transform 0.5s;
    mix-blend-mode: multiply;
    filter: contrast(1.02);
  }
  .product:hover .product-image img { transform: scale(1.06) rotate(-2deg); }
  .product-image::before {
    content: '';
    position: absolute;
    inset: 0;
    background:
      radial-gradient(ellipse at 50% 100%, rgba(26,24,20,0.06), transparent 60%);
    z-index: 1;
  }
  .product-image::after {
    content: '';
    position: absolute;
    bottom: 0; left: 0; right: 0;
    height: 1px;
    background: var(--line);
    z-index: 1;
  }
  .product-badge {
    position: absolute;
    top: 14px;
    left: 14px;
    background: var(--rust);
    color: var(--paper);
    font-family: 'Anton', sans-serif;
    font-size: 11px;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    padding: 5px 10px;
    z-index: 5;
  }
  .product-badge.new { background: var(--ink); }
  .product-badge.bestseller { background: var(--brass); color: var(--ink); }
  .product-quickadd {
    position: absolute;
    bottom: 14px;
    left: 14px;
    right: 14px;
    background: var(--ink);
    color: var(--paper);
    padding: 12px;
    font-family: 'Anton', sans-serif;
    font-size: 13px;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    text-align: center;
    transform: translateY(calc(100% + 14px));
    transition: transform 0.3s;
    z-index: 4;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
  }
  .product:hover .product-quickadd { transform: translateY(0); }
  .product-quickadd:hover { background: var(--rust); }
  .product-fav {
    position: absolute;
    top: 14px;
    right: 14px;
    width: 36px;
    height: 36px;
    border-radius: 50%;
    background: rgba(244, 239, 230, 0.95);
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 5;
    transition: background 0.2s;
  }
  .product-fav:hover { background: var(--paper); }
  .product-fav svg { width: 16px; height: 16px; stroke: var(--ink); fill: none; stroke-width: 1.6; }
  .product-fav.active svg { fill: var(--rust); stroke: var(--rust); }

  .product-info {
    padding: 18px 20px 22px;
    display: flex;
    flex-direction: column;
    flex: 1;
  }
  .product-code {
    font-family: 'JetBrains Mono', monospace;
    font-size: 10px;
    letter-spacing: 0.12em;
    color: var(--muted);
    margin-bottom: 6px;
    text-transform: uppercase;
  }
  .product-name {
    font-family: 'Anton', sans-serif;
    font-size: 19px;
    text-transform: uppercase;
    letter-spacing: 0.02em;
    line-height: 1.05;
    margin-bottom: 8px;
  }
  .product-desc {
    font-size: 12.5px;
    color: var(--ink-3);
    margin-bottom: 14px;
    line-height: 1.5;
  }
  .product-rating {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 14px;
  }
  .stars {
    color: var(--brass);
    font-size: 12px;
    letter-spacing: 1px;
  }
  .rating-count {
    font-size: 11px;
    color: var(--muted);
  }
  .product-variations {
    display: flex;
    gap: 14px;
    margin-bottom: 14px;
    padding: 10px 12px;
    background: var(--paper-2);
    border-left: 2px solid var(--brass);
    font-size: 11px;
    letter-spacing: 0.04em;
    color: var(--ink-3);
  }
  .product-variations strong {
    font-family: 'Anton', sans-serif;
    font-size: 12px;
    color: var(--ink);
    margin-right: 4px;
    letter-spacing: 0.06em;
  }
  .product-variations .vsep {
    color: var(--line-2);
  }

  .product-bottom {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-top: auto;
    padding-top: 14px;
    border-top: 1px solid var(--line);
  }
  .product-price {
    display: flex;
    flex-direction: column;
  }
  .price-amt {
    font-family: 'Anton', sans-serif;
    font-size: 22px;
    color: var(--ink);
    line-height: 1;
  }
  .price-sub {
    font-size: 11px;
    color: var(--muted);
    margin-top: 3px;
  }
  .product-stock {
    font-size: 11px;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    color: var(--success);
    display: inline-flex;
    align-items: center;
    gap: 6px;
  }
  .product-stock::before {
    content: '';
    width: 7px; height: 7px;
    border-radius: 50%;
    background: var(--success);
  }
  .product-stock.low { color: var(--rust); }
  .product-stock.low::before { background: var(--rust); }

  /* ═══════════════════════════════════════════════════════════════
     STORY SECTION — editorial split
  ═══════════════════════════════════════════════════════════════ */
  .story-section {
    background: var(--ink);
    color: var(--paper);
    padding: 0;
    position: relative;
    overflow: hidden;
  }
  .story-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    min-height: 720px;
  }
  .story-image {
    position: relative;
    background-image:
      linear-gradient(135deg, rgba(26,24,20,0.55), rgba(26,24,20,0.25)),
      url('https://images.unsplash.com/photo-1707059833911-8a3ab7b396ec?w=1400&q=80&auto=format');
    background-size: cover;
    background-position: center;
  }
  .story-image::after {
    content: '';
    position: absolute;
    inset: 0;
    background: linear-gradient(90deg, transparent 70%, var(--ink));
  }
  .story-quote {
    position: absolute;
    bottom: 48px;
    left: 48px;
    right: 60px;
    font-family: 'Fraunces', serif;
    font-style: italic;
    font-size: 22px;
    line-height: 1.4;
    color: var(--paper);
    z-index: 2;
    border-left: 3px solid var(--rust);
    padding-left: 20px;
  }
  .story-quote::before {
    content: '"';
    position: absolute;
    top: -28px;
    left: 14px;
    font-size: 96px;
    color: var(--rust);
    line-height: 1;
    font-style: normal;
  }
  .story-quote-author {
    display: block;
    margin-top: 16px;
    font-family: 'Inter Tight', sans-serif;
    font-style: normal;
    font-size: 12px;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    color: var(--brass);
  }
  .story-text {
    padding: 96px 80px;
    display: flex;
    flex-direction: column;
    justify-content: center;
  }
  .story-text .section-eyebrow { color: var(--brass); }
  .story-text .section-eyebrow::before { background: var(--brass); }
  .story-text h2 {
    font-family: 'Anton', sans-serif;
    font-size: clamp(40px, 5vw, 64px);
    line-height: 0.95;
    text-transform: uppercase;
    margin-bottom: 28px;
    letter-spacing: -0.005em;
  }
  .story-text h2 em {
    font-family: 'Fraunces', serif;
    font-style: italic;
    font-weight: 400;
    color: var(--brass);
    text-transform: lowercase;
    letter-spacing: -0.02em;
  }
  .story-text p {
    font-size: 16px;
    color: rgba(244, 239, 230, 0.75);
    margin-bottom: 18px;
    line-height: 1.7;
  }
  .story-text p strong { color: var(--paper); font-weight: 500; }
  .build-list {
    list-style: none;
    margin: 32px 0;
    border-top: 1px solid rgba(244, 239, 230, 0.15);
  }
  .build-list li {
    display: grid;
    grid-template-columns: 60px 1fr;
    gap: 20px;
    padding: 18px 0;
    border-bottom: 1px solid rgba(244, 239, 230, 0.15);
    align-items: start;
  }
  .build-num {
    font-family: 'Anton', sans-serif;
    font-size: 26px;
    color: var(--rust);
    line-height: 1;
  }
  .build-step h4 {
    font-family: 'Anton', sans-serif;
    font-size: 16px;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    margin-bottom: 4px;
  }
  .build-step p {
    font-size: 13.5px;
    color: rgba(244, 239, 230, 0.65);
    margin: 0;
  }
  .story-cta {
    display: inline-flex;
    align-items: center;
    gap: 12px;
    background: var(--rust);
    color: var(--paper);
    padding: 16px 28px;
    font-family: 'Anton', sans-serif;
    font-size: 14px;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    width: fit-content;
    transition: all 0.25s;
    margin-top: 16px;
  }
  .story-cta:hover {
    background: var(--rust-hover);
    transform: translateY(-2px);
  }

  /* ═══════════════════════════════════════════════════════════════
     FIELD REPORTS — the customer fish photo + lure code (Panther Martin pattern, elevated)
  ═══════════════════════════════════════════════════════════════ */
  .field-section {
    padding: 96px 80px;
    background: var(--paper);
  }
  .field-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 24px;
    margin-top: 16px;
  }
  .field-card {
    background: var(--paper);
    border: 1px solid var(--line);
    transition: all 0.3s;
    overflow: hidden;
  }
  .field-card:hover {
    border-color: var(--ink);
    transform: translateY(-3px);
  }
  .field-photo {
    aspect-ratio: 4 / 3;
    background-size: cover;
    background-position: center;
    position: relative;
    overflow: hidden;
  }
  .field-card:nth-child(1) .field-photo {
    background-image: url('https://images.unsplash.com/photo-1601248981942-89b99a5b7427?w=1200&q=80&auto=format');
  }
  .field-card:nth-child(2) .field-photo {
    background-image: url('https://images.unsplash.com/photo-1762655210992-e2dd74cf3118?w=1200&q=80&auto=format');
  }
  .field-card:nth-child(3) .field-photo {
    background-image: url('https://images.unsplash.com/photo-1762110740691-6ecda4f51642?w=1200&q=80&auto=format');
  }
  .field-photo::after {
    content: '';
    position: absolute;
    inset: 0;
    background: linear-gradient(180deg, transparent 50%, rgba(26,24,20,0.7));
  }
  .field-photo-stamp {
    position: absolute;
    top: 14px;
    left: 14px;
    background: var(--paper);
    padding: 6px 12px;
    font-family: 'JetBrains Mono', monospace;
    font-size: 10px;
    letter-spacing: 0.1em;
    z-index: 2;
  }
  .field-photo-loc {
    position: absolute;
    bottom: 14px;
    left: 14px;
    color: var(--paper);
    z-index: 2;
    font-family: 'Fraunces', serif;
    font-style: italic;
    font-size: 14px;
  }
  .field-info {
    padding: 22px 24px;
  }
  .field-stats {
    display: flex;
    gap: 24px;
    margin-bottom: 14px;
  }
  .field-stat {
    flex: 1;
  }
  .field-stat-num {
    font-family: 'Anton', sans-serif;
    font-size: 26px;
    line-height: 1;
    margin-bottom: 4px;
  }
  .field-stat-label {
    font-size: 10px;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    color: var(--muted);
  }
  .field-quote {
    font-size: 13.5px;
    color: var(--ink-3);
    margin-bottom: 16px;
    font-style: italic;
    font-family: 'Fraunces', serif;
    line-height: 1.5;
  }
  .field-product {
    display: flex;
    align-items: center;
    gap: 12px;
    padding-top: 14px;
    border-top: 1px solid var(--line);
    transition: color 0.2s;
  }
  .field-product:hover { color: var(--rust); }
  .field-product-tag {
    font-family: 'JetBrains Mono', monospace;
    font-size: 10px;
    background: var(--ink);
    color: var(--paper);
    padding: 4px 8px;
    letter-spacing: 0.05em;
  }
  .field-product-name {
    font-family: 'Anton', sans-serif;
    font-size: 13px;
    text-transform: uppercase;
    letter-spacing: 0.03em;
    flex: 1;
  }
  .field-product-arrow {
    font-size: 14px;
    transition: transform 0.2s;
  }
  .field-product:hover .field-product-arrow { transform: translateX(4px); }

  /* ═══════════════════════════════════════════════════════════════
     PRESS / TRUST BAR
  ═══════════════════════════════════════════════════════════════ */
  .press-bar {
    background: var(--paper-2);
    padding: 56px 80px;
    border-top: 1px solid var(--line);
    border-bottom: 1px solid var(--line);
  }
  .press-grid {
    display: grid;
    grid-template-columns: 200px 1fr;
    gap: 64px;
    align-items: center;
  }
  .press-label {
    font-family: 'Anton', sans-serif;
    font-size: 14px;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    line-height: 1.2;
  }
  .press-label small {
    display: block;
    font-family: 'Fraunces', serif;
    font-style: italic;
    font-size: 12px;
    color: var(--muted);
    text-transform: none;
    letter-spacing: 0;
    margin-top: 4px;
  }
  .press-logos {
    display: flex;
    justify-content: space-between;
    align-items: center;
    flex-wrap: wrap;
    gap: 32px;
  }
  .press-logo {
    font-family: 'Anton', sans-serif;
    font-size: 22px;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    color: var(--ink-3);
    opacity: 0.65;
    transition: opacity 0.2s;
  }
  .press-logo:hover { opacity: 1; }
  .press-logo em {
    font-family: 'Fraunces', serif;
    font-style: italic;
    font-weight: 400;
    text-transform: lowercase;
  }

  /* ═══════════════════════════════════════════════════════════════
     PRO ANGLERS / TESTIMONIAL
  ═══════════════════════════════════════════════════════════════ */
  .testimonial-section {
    padding: 120px 80px;
    background: var(--paper);
    position: relative;
  }
  .testimonial-block {
    max-width: 1000px;
    margin: 0 auto;
    text-align: center;
    position: relative;
  }
  .testimonial-block::before {
    content: '"';
    font-family: 'Fraunces', serif;
    font-size: 240px;
    line-height: 1;
    color: var(--rust);
    opacity: 0.12;
    position: absolute;
    top: -40px;
    left: 50%;
    transform: translateX(-50%);
    z-index: 0;
  }
  .test-quote {
    font-family: 'Fraunces', serif;
    font-size: clamp(28px, 3.5vw, 44px);
    line-height: 1.25;
    margin-bottom: 40px;
    position: relative;
    z-index: 1;
    color: var(--ink);
    font-weight: 400;
  }
  .test-quote em {
    font-style: italic;
    color: var(--rust);
  }
  .test-author {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 16px;
    margin-bottom: 32px;
  }
  .test-avatar {
    width: 56px;
    height: 56px;
    border-radius: 50%;
    background-image: url('https://images.unsplash.com/photo-1564564321837-a57b7070ac4f?w=200&q=80');
    background-size: cover;
    background-position: center;
    border: 2px solid var(--rust);
  }
  .test-meta { text-align: left; }
  .test-name {
    font-family: 'Anton', sans-serif;
    font-size: 16px;
    letter-spacing: 0.04em;
    text-transform: uppercase;
  }
  .test-title {
    font-size: 12px;
    color: var(--muted);
    letter-spacing: 0.06em;
    text-transform: uppercase;
  }
  .test-dots {
    display: flex;
    justify-content: center;
    gap: 8px;
  }
  .test-dot {
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: var(--line-2);
    border: none;
    cursor: pointer;
    transition: background 0.2s;
  }
  .test-dot.active { background: var(--rust); }

  /* ═══════════════════════════════════════════════════════════════
     NEWSLETTER / CTA
  ═══════════════════════════════════════════════════════════════ */
  .newsletter {
    background: var(--ink);
    color: var(--paper);
    padding: 96px 80px;
    position: relative;
    overflow: hidden;
  }
  .newsletter::before {
    content: '';
    position: absolute;
    inset: 0;
    background:
      radial-gradient(circle at 80% 50%, rgba(181, 72, 31, 0.18), transparent 50%),
      radial-gradient(circle at 20% 30%, rgba(196, 154, 92, 0.08), transparent 50%);
  }
  .newsletter-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 64px;
    align-items: center;
    position: relative;
    z-index: 1;
  }
  .newsletter h2 {
    font-family: 'Anton', sans-serif;
    font-size: clamp(40px, 5vw, 64px);
    line-height: 0.95;
    text-transform: uppercase;
    margin-bottom: 20px;
    letter-spacing: -0.005em;
  }
  .newsletter h2 em {
    font-family: 'Fraunces', serif;
    font-style: italic;
    font-weight: 400;
    color: var(--brass);
    text-transform: lowercase;
    letter-spacing: -0.02em;
  }
  .newsletter p {
    font-size: 16px;
    color: rgba(244, 239, 230, 0.7);
    max-width: 460px;
  }
  .newsletter-form {
    display: flex;
    flex-direction: column;
    gap: 14px;
  }
  .newsletter-input-wrap {
    display: flex;
    border: 1px solid rgba(244, 239, 230, 0.25);
    background: rgba(244, 239, 230, 0.05);
  }
  .newsletter-input {
    flex: 1;
    background: transparent;
    border: none;
    padding: 18px 22px;
    color: var(--paper);
    font-family: inherit;
    font-size: 15px;
    outline: none;
  }
  .newsletter-input::placeholder { color: rgba(244, 239, 230, 0.45); }
  .newsletter-btn {
    background: var(--rust);
    color: var(--paper);
    padding: 0 28px;
    font-family: 'Anton', sans-serif;
    font-size: 14px;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    transition: background 0.2s;
  }
  .newsletter-btn:hover { background: var(--rust-hover); }
  .newsletter-fine {
    font-size: 12px;
    color: rgba(244, 239, 230, 0.5);
  }
  /* Direct-element fallbacks — the front-page template renders
     <form class="newsletter-form"><input><button></form> WITHOUT
     the .newsletter-input-wrap / .newsletter-input / .newsletter-btn
     classes, so without these rules the input + button revert to
     browser defaults and disappear against the dark section. */
  .newsletter-form {
    align-items: stretch;
    justify-content: center;
  }
  .newsletter-form input[type="email"],
  .newsletter-form input[type="text"] {
    width: 100%;
    background: rgba(244, 239, 230, 0.06);
    border: 1px solid rgba(244, 239, 230, 0.28);
    color: var(--paper);
    font-family: 'Inter Tight', sans-serif;
    font-size: 15px;
    padding: 16px 18px;
    outline: none;
    transition: border-color 0.2s, background 0.2s;
    box-sizing: border-box;
  }
  .newsletter-form input[type="email"]::placeholder,
  .newsletter-form input[type="text"]::placeholder {
    color: rgba(244, 239, 230, 0.6);
  }
  .newsletter-form input[type="email"]:focus,
  .newsletter-form input[type="text"]:focus {
    border-color: var(--rust);
    background: rgba(244, 239, 230, 0.1);
  }
  .newsletter-form button[type="submit"] {
    background: var(--rust);
    color: var(--paper);
    border: none;
    padding: 16px 28px;
    font-family: 'JetBrains Mono', monospace;
    font-size: 12px;
    font-weight: 500;
    letter-spacing: 0.14em;
    text-transform: uppercase;
    cursor: pointer;
    transition: background 0.2s;
    align-self: flex-start;
  }
  .newsletter-form button[type="submit"]:hover {
    background: var(--rust-hover);
  }

  /* ═══════════════════════════════════════════════════════════════
     FOOTER
  ═══════════════════════════════════════════════════════════════ */
  footer {
    background: var(--paper-2);
    padding: 80px 80px 40px;
    border-top: 1px solid var(--line);
  }
  .footer-top {
    display: grid;
    grid-template-columns: 1.6fr 1fr 1fr 1fr 1fr;
    gap: 48px;
    margin-bottom: 64px;
  }
  .footer-brand .logo { margin-bottom: 22px; }
  .footer-brand p {
    font-size: 14px;
    color: var(--ink-3);
    margin-bottom: 22px;
    max-width: 320px;
    line-height: 1.6;
  }
  .footer-social {
    display: flex;
    gap: 10px;
  }
  .social-icon {
    width: 38px; height: 38px;
    border: 1px solid var(--line-2);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: all 0.2s;
  }
  .social-icon:hover {
    background: var(--ink);
    border-color: var(--ink);
    color: var(--paper);
  }
  .social-icon svg { width: 16px; height: 16px; fill: currentColor; }

  .footer-col h4 {
    font-family: 'Anton', sans-serif;
    font-size: 14px;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    margin-bottom: 22px;
    color: var(--ink);
  }
  .footer-col ul { list-style: none; }
  .footer-col li { margin-bottom: 12px; }
  .footer-col a {
    font-size: 14px;
    color: var(--ink-3);
    transition: color 0.2s;
  }
  .footer-col a:hover { color: var(--rust); }

  .footer-bottom {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding-top: 32px;
    border-top: 1px solid var(--line);
    font-size: 12.5px;
    color: var(--muted);
    flex-wrap: wrap;
    gap: 16px;
  }
  .footer-bottom-links {
    display: flex;
    gap: 24px;
  }
  .footer-bottom-links a:hover { color: var(--ink); }
  .footer-flag {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    font-family: 'Anton', sans-serif;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: var(--ink);
    font-size: 13px;
  }

  /* ═══════════════════════════════════════════════════════════════
     SLIDE-IN CART
  ═══════════════════════════════════════════════════════════════ */
  .cart-overlay {
    position: fixed;
    inset: 0;
    background: rgba(26, 24, 20, 0.5);
    z-index: 999;
    opacity: 0;
    pointer-events: none;
    transition: opacity 0.3s;
    backdrop-filter: blur(2px);
  }
  .cart-overlay.open { opacity: 1; pointer-events: auto; }
  .cart-drawer {
    position: fixed;
    top: 0;
    right: 0;
    bottom: 0;
    width: 440px;
    max-width: 100%;
    background: var(--paper);
    z-index: 1000;
    transform: translateX(100%);
    transition: transform 0.35s cubic-bezier(0.4, 0, 0.2, 1);
    display: flex;
    flex-direction: column;
  }
  .cart-drawer.open { transform: translateX(0); }
  .cart-header {
    padding: 24px 28px;
    border-bottom: 1px solid var(--line);
    display: flex;
    justify-content: space-between;
    align-items: center;
  }
  .cart-header h3 {
    font-family: 'Anton', sans-serif;
    font-size: 22px;
    letter-spacing: 0.04em;
    text-transform: uppercase;
  }
  .cart-close {
    width: 36px; height: 36px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: background 0.2s;
  }
  .cart-close:hover { background: var(--paper-2); }
  .cart-items {
    flex: 1;
    overflow-y: auto;
    padding: 16px 28px;
  }
  .cart-item {
    display: grid;
    grid-template-columns: 80px 1fr auto;
    gap: 14px;
    padding: 18px 0;
    border-bottom: 1px solid var(--line);
    align-items: center;
  }
  .cart-item-img {
    width: 80px; height: 80px;
    background: var(--paper-2);
    display: flex;
    align-items: center;
    justify-content: center;
  }
  .cart-item-img svg { width: 70%; }
  .cart-item-name {
    font-family: 'Anton', sans-serif;
    font-size: 14px;
    text-transform: uppercase;
    margin-bottom: 4px;
  }
  .cart-item-meta {
    font-size: 11px;
    color: var(--muted);
    margin-bottom: 8px;
  }
  .cart-item-qty {
    display: inline-flex;
    align-items: center;
    border: 1px solid var(--line-2);
  }
  .cart-item-qty button {
    width: 24px; height: 24px;
    font-size: 14px;
    color: var(--ink);
  }
  .cart-item-qty span {
    padding: 0 10px;
    font-size: 13px;
    font-weight: 500;
  }
  .cart-item-price {
    font-family: 'Anton', sans-serif;
    font-size: 16px;
  }
  .cart-empty {
    text-align: center;
    padding: 60px 20px;
    color: var(--muted);
  }
  .cart-empty .icon {
    font-size: 48px;
    margin-bottom: 16px;
    opacity: 0.4;
  }
  .cart-footer {
    padding: 24px 28px;
    border-top: 1px solid var(--line);
    background: var(--paper-2);
  }
  .cart-summary {
    display: flex;
    justify-content: space-between;
    margin-bottom: 16px;
    font-size: 14px;
  }
  .cart-summary.total {
    font-family: 'Anton', sans-serif;
    font-size: 22px;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    margin-bottom: 20px;
    padding-top: 14px;
    border-top: 1px solid var(--line);
  }
  .cart-checkout {
    width: 100%;
    background: var(--rust);
    color: var(--paper);
    padding: 16px;
    font-family: 'Anton', sans-serif;
    font-size: 15px;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    transition: background 0.2s;
  }
  .cart-checkout:hover { background: var(--rust-hover); }
  .cart-trust {
    text-align: center;
    margin-top: 14px;
    font-size: 11px;
    color: var(--muted);
    letter-spacing: 0.04em;
  }

  /* TOAST */
  .toast {
    position: fixed;
    bottom: 24px;
    left: 50%;
    transform: translate(-50%, 200%);
    background: var(--ink);
    color: var(--paper);
    padding: 14px 24px;
    font-size: 13px;
    letter-spacing: 0.04em;
    z-index: 1001;
    transition: transform 0.3s;
    display: flex;
    align-items: center;
    gap: 12px;
    box-shadow: 0 12px 32px -8px rgba(0,0,0,0.3);
  }
  .toast.show { transform: translate(-50%, 0); }
  .toast::before {
    content: '✓';
    background: var(--success);
    color: var(--paper);
    width: 22px; height: 22px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 13px;
    font-weight: 700;
  }

  /* ═══════════════════════════════════════════════════════════════
     PRODUCT VARIANT SELECTS + ADD TO CART
  ═══════════════════════════════════════════════════════════════ */
  .product-selects {
    display: flex;
    flex-direction: column;
    gap: 8px;
    margin-bottom: 14px;
  }
  .product-select-wrap { display: flex; flex-direction: column; gap: 4px; }
  .product-select-label {
    font-family: 'JetBrains Mono', monospace;
    font-size: 9px;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    color: var(--muted);
  }
  .product-select {
    width: 100%;
    padding: 7px 10px;
    font-family: 'Inter Tight', sans-serif;
    font-size: 12px;
    background: var(--paper-2);
    color: var(--ink);
    border: 1px solid var(--line-2);
    outline: none;
    cursor: pointer;
    appearance: none;
    -webkit-appearance: none;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='6'%3E%3Cpath d='M0 0l5 6 5-6z' fill='%231A1814'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: right 10px center;
    transition: border-color 0.2s;
  }
  .product-select:focus { border-color: var(--ink); }

  .product-add-btn {
    width: 100%;
    background: var(--rust);
    color: var(--paper);
    padding: 11px 16px;
    font-family: 'Anton', sans-serif;
    font-size: 13px;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    transition: background 0.2s, transform 0.1s;
    margin-top: 10px;
    cursor: pointer;
    border: none;
  }
  .product-add-btn:hover { background: var(--rust-hover); }
  .product-add-btn:active { transform: scale(0.98); }

  .price-sale {
    color: var(--rust);
    font-family: 'Anton', sans-serif;
    font-size: 22px;
    line-height: 1;
  }
  .price-orig {
    font-size: 14px;
    color: var(--muted);
    text-decoration: line-through;
    margin-left: 4px;
  }

  /* RESPONSIVE — basic */
  @media (max-width: 1100px) {
    .technique-grid { grid-template-columns: 1fr 1fr; height: auto; grid-template-rows: auto; }
    .technique-card:nth-child(1) { grid-row: auto; aspect-ratio: 4/3; }
    .technique-card { aspect-ratio: 4/3; }
    .product-grid { grid-template-columns: repeat(3, 1fr); }
    .footer-top { grid-template-columns: 1fr 1fr 1fr; }
    .footer-brand { grid-column: 1/4; }
  }
  @media (max-width: 800px) {
    .util-bar, nav, .section, .products-section, .field-section, .press-bar, .testimonial-section, .newsletter, footer { padding-left: 24px; padding-right: 24px; }
    .nav-links, .util-marquee { display: none; }
    .hero-grid, .story-grid, .newsletter-grid { grid-template-columns: 1fr; }
    .hero-text, .story-text { padding: 56px 24px; }
    .product-grid { grid-template-columns: 1fr 1fr; gap: 14px; }
    .field-grid { grid-template-columns: 1fr; }
    .technique-grid { grid-template-columns: 1fr; }
    .footer-top { grid-template-columns: 1fr 1fr; }
    .footer-brand { grid-column: 1/3; }
    .press-grid { grid-template-columns: 1fr; gap: 24px; }
    .section-head { flex-direction: column; align-items: flex-start; }
  }

  /* ═══════════════════════════════════════════════════════════════
     POST-LAUNCH FIXES — v1.0.1
  ═══════════════════════════════════════════════════════════════ */

  /* FIX: Hide mobile hamburger on desktop */
  .mobile-menu-toggle {
    display: none;
    background: transparent;
    border: none;
    color: var(--ink);
    cursor: pointer;
    padding: 8px;
  }
  @media (max-width: 800px) {
    .mobile-menu-toggle { display: inline-flex; align-items: center; }
    .nav-links { display: none; }
    /* Mobile submenus: expand inline below parent instead of floating */
    .nav-links .sub-menu,
    .nav-links ul {
      position: static !important;
      opacity: 1 !important;
      visibility: visible !important;
      transform: none !important;
      background: transparent !important;
      border: none !important;
      box-shadow: none !important;
      padding: 4px 0 8px 16px !important;
    }
    .nav-links .sub-menu a,
    .nav-links ul a {
      padding: 8px 0 !important;
      font-size: 11px !important;
    }
    .nav-links.is-open {
      display: flex;
      flex-direction: column;
      position: absolute;
      top: 100%;
      left: 0;
      right: 0;
      background: var(--paper);
      border-top: 1px solid var(--line);
      padding: 20px 24px;
      gap: 16px;
    }
  }

  /* FIX: WooCommerce wraps products in <ul class="products">. Make that ul behave
     like our grid. Also clean up the pagination placement. */
  .products-section .products {
    display: grid !important;
    grid-template-columns: repeat(4, 1fr);
    gap: 32px 24px;
    list-style: none;
    padding: 0;
    margin: 0 0 40px;
  }
  .products-section .products .product {
    /* product cards inherit the v6 .product styling from earlier in this stylesheet */
    margin: 0;
  }
  .products-section .products::before,
  .products-section .products::after {
    display: none !important;
  }
  @media (max-width: 1200px) {
    .products-section .products { grid-template-columns: repeat(3, 1fr); }
  }
  @media (max-width: 800px) {
    .products-section .products { grid-template-columns: repeat(2, 1fr); }
  }
  @media (max-width: 480px) {
    .products-section .products { grid-template-columns: 1fr; }
  }

  /* FIX: WooCommerce pagination — move it below the grid, center it, style consistent with v6 */
  .products-section .woocommerce-pagination {
    grid-column: 1 / -1;
    text-align: center;
    margin-top: 40px;
    clear: both;
  }
  .products-section .woocommerce-pagination ul {
    display: inline-flex;
    list-style: none;
    padding: 0;
    margin: 0;
    gap: 8px;
    border: none;
  }
  .products-section .woocommerce-pagination ul li {
    border: none;
    margin: 0;
  }
  .products-section .woocommerce-pagination ul li .page-numbers {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 44px;
    height: 44px;
    padding: 0 12px;
    border: 1.5px solid var(--line);
    background: var(--paper);
    color: var(--ink);
    font-family: 'Anton', sans-serif;
    font-size: 14px;
    letter-spacing: 0.06em;
    text-decoration: none;
    transition: all 0.2s;
  }
  .products-section .woocommerce-pagination ul li .page-numbers.current {
    background: var(--ink);
    color: var(--paper);
    border-color: var(--ink);
  }
  .products-section .woocommerce-pagination ul li .page-numbers:hover {
    background: var(--ink);
    color: var(--paper);
    border-color: var(--ink);
  }

  /* FIX: Hide WooCommerce result count + duplicate ordering (we have our own sort) */
  .products-section .woocommerce-result-count {
    display: none;
  }

  /* FIX: WooCommerce Add to Cart button styling for shop loop */
  .products-section .products .product .button,
  .products-section .products .product .added_to_cart {
    background: var(--ink);
    color: var(--paper);
    padding: 12px 20px;
    font-family: 'Anton', sans-serif;
    font-size: 13px;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    border: none;
    text-decoration: none;
    cursor: pointer;
    transition: background 0.2s;
    display: inline-block;
    margin-top: 8px;
  }
  .products-section .products .product .button:hover,
  .products-section .products .product .added_to_cart:hover {
    background: var(--rust);
  }

  /* ═══════════════════════════════════════════════════════════════
     SHOP WIDTH / LAYOUT FIX — v1.0.3
     Earlier rule had .products-section .products limited by some inherited
     constraint, making the grid use ~50% of viewport. Force full-width.
  ═══════════════════════════════════════════════════════════════ */
  .products-section {
    padding: 64px 56px 80px !important;
    max-width: none !important;
    width: 100% !important;
    box-sizing: border-box;
  }
  .products-section .section-head {
    max-width: 1480px;
    margin: 0 auto 40px;
    width: 100%;
  }
  .products-section .filter-bar {
    max-width: 1480px;
    margin: 0 auto 40px;
    width: 100%;
  }
  .products-section .product-grid {
    max-width: 1480px !important;
    width: 100% !important;
    margin: 0 auto !important;
    padding: 0 !important;
  }
  .products-section .products {
    display: grid !important;
    grid-template-columns: repeat(4, 1fr) !important;
    gap: 48px 32px !important;
    list-style: none !important;
    padding: 0 !important;
    margin: 0 auto !important;
    max-width: 1480px !important;
    width: 100% !important;
  }
  .products-section .products .product {
    width: 100% !important;
    max-width: none !important;
    margin: 0 !important;
    float: none !important;
    clear: both !important;
  }
  /* Reasonable image area — make product cards feel like a premium catalog */
  .products-section .products .product .product-image,
  .products-section .products .product img,
  .products-section .products .product .woocommerce-loop-product__link img,
  .products-section .products .product a img {
    width: 100% !important;
    aspect-ratio: 1 / 1 !important;
    object-fit: cover !important;
    height: auto !important;
    max-height: none !important;
    display: block !important;
    background: var(--paper-2);
  }
  /* Tighter description so cards don't stretch absurdly tall */
  .products-section .products .product .product-desc,
  .products-section .products .product .woocommerce-product-details__short-description {
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
    max-height: 4.5em;
  }

  @media (max-width: 1280px) {
    .products-section .products { grid-template-columns: repeat(3, 1fr) !important; }
  }
  @media (max-width: 900px) {
    .products-section { padding: 48px 32px 64px !important; }
    .products-section .products { grid-template-columns: repeat(2, 1fr) !important; gap: 32px 20px !important; }
  }
  @media (max-width: 540px) {
    .products-section { padding: 32px 20px 48px !important; }
    .products-section .products { grid-template-columns: 1fr !important; }
  }

  /* ═══════════════════════════════════════════════════════════════
     CRITICAL FIX: .product-grid wrapper was itself display:grid
     (inherited from v6 CSS), making its single <ul> child only fill
     1/4 of width. Override to a plain block wrapper.
  ═══════════════════════════════════════════════════════════════ */
  .products-section .product-grid {
    display: block !important;
    grid-template-columns: none !important;
    gap: 0 !important;
  }

  /* ═══════════════════════════════════════════════════════════════
     SINGLE PRODUCT PAGE — purchase section sizing & branding.
     The default WC variation table renders <select> at 13px in Arial,
     and the add-to-cart button comes in default purple. Override all
     of it to match the v6 editorial scale and rust accent.
  ═══════════════════════════════════════════════════════════════ */

  /* Price — WC defaults to olive/yellow; we want ink + rust */
  .summary .price,
  .summary p.price,
  div.product .price {
    font-family: 'Anton', sans-serif !important;
    font-size: 32px !important;
    color: var(--ink) !important;
    letter-spacing: 0.01em;
    margin-bottom: 24px !important;
    display: block;
  }
  .summary .price ins,
  .summary p.price ins {
    text-decoration: none;
    color: var(--rust) !important;
  }
  .summary .price del,
  .summary p.price del {
    color: var(--muted) !important;
    font-size: 22px !important;
    margin-right: 12px;
    opacity: 0.7;
  }
  .summary .price .woocommerce-Price-amount,
  .summary p.price .woocommerce-Price-amount {
    color: inherit !important;
  }

  /* Variations table — Size / Color etc. */
  .variations,
  table.variations {
    border-collapse: collapse;
    margin: 24px 0 28px !important;
    width: 100%;
  }
  .variations tr {
    border: none;
  }
  .variations th,
  .variations td,
  table.variations th,
  table.variations td {
    padding: 14px 0 !important;
    border: none !important;
    background: transparent !important;
    vertical-align: middle;
  }
  .variations th.label,
  .variations label,
  table.variations th label {
    font-family: 'JetBrains Mono', monospace !important;
    font-size: 13px !important;
    font-weight: 500 !important;
    letter-spacing: 0.18em !important;
    text-transform: uppercase !important;
    color: var(--ink) !important;
    padding-right: 24px !important;
    width: 110px;
  }

  /* The actual <select> dropdown — currently rendering at 13px Arial */
  .variations select,
  table.variations select,
  .summary select,
  div.product select {
    font-family: 'Inter Tight', sans-serif !important;
    font-size: 17px !important;
    line-height: 1.4 !important;
    color: var(--ink) !important;
    background: var(--paper) !important;
    border: 1.5px solid var(--line-2) !important;
    padding: 14px 44px 14px 16px !important;
    min-width: 240px;
    width: 100%;
    max-width: 360px;
    border-radius: 0;
    appearance: none;
    -webkit-appearance: none;
    -moz-appearance: none;
    background-image: url("data:image/svg+xml;charset=UTF-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 8'%3E%3Cpath fill='%231A1814' d='M6 8L0 0h12z'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: right 16px center;
    background-size: 11px;
    cursor: pointer;
    transition: border-color 0.2s;
  }
  .variations select:focus,
  .summary select:focus {
    outline: none;
    border-color: var(--rust) !important;
  }

  /* "Clear" link after color select */
  .reset_variations,
  a.reset_variations {
    font-family: 'JetBrains Mono', monospace !important;
    font-size: 11px !important;
    letter-spacing: 0.14em !important;
    text-transform: uppercase !important;
    color: var(--muted) !important;
    margin-left: 16px !important;
    border-bottom: 1px solid var(--line-2);
    padding-bottom: 2px;
  }
  .reset_variations:hover {
    color: var(--rust) !important;
    border-color: var(--rust);
  }

  /* Quantity input */
  .summary .quantity,
  div.product form.cart .quantity {
    margin-right: 18px !important;
  }
  .summary input.qty,
  form.cart input.qty,
  div.product input.qty {
    font-family: 'Anton', sans-serif !important;
    font-size: 22px !important;
    width: 88px !important;
    height: 64px !important;
    padding: 0 12px !important;
    text-align: center !important;
    background: var(--paper) !important;
    border: 1.5px solid var(--ink) !important;
    color: var(--ink) !important;
    border-radius: 0 !important;
    box-sizing: border-box;
  }

  /* Add to Cart button — kill the WC default purple */
  .single_add_to_cart_button,
  button.single_add_to_cart_button,
  .summary .single_add_to_cart_button,
  div.product form.cart button[type="submit"],
  form.cart .single_add_to_cart_button {
    font-family: 'Anton', sans-serif !important;
    font-size: 18px !important;
    letter-spacing: 0.12em !important;
    text-transform: uppercase !important;
    color: var(--paper) !important;
    background: var(--ink) !important;
    border: none !important;
    border-radius: 0 !important;
    padding: 0 36px !important;
    height: 64px !important;
    min-width: 220px;
    cursor: pointer;
    transition: background 0.2s, transform 0.1s;
    box-sizing: border-box;
    vertical-align: middle;
  }
  .single_add_to_cart_button:hover,
  button.single_add_to_cart_button:hover {
    background: var(--rust) !important;
    color: var(--paper) !important;
  }
  .single_add_to_cart_button:active,
  button.single_add_to_cart_button:active {
    transform: translateY(1px);
  }

  /* Align quantity + add-to-cart on the same row */
  .summary form.cart,
  div.product form.cart {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 0;
    margin: 16px 0 32px !important;
  }

  /* Product meta — SKU, Category */
  .product_meta,
  .summary .product_meta {
    padding-top: 24px !important;
    margin-top: 24px !important;
    border-top: 1px solid var(--line) !important;
    font-family: 'JetBrains Mono', monospace !important;
    font-size: 12px !important;
    letter-spacing: 0.12em !important;
    text-transform: uppercase !important;
    color: var(--muted) !important;
    line-height: 2 !important;
  }
  .product_meta > span,
  .product_meta .sku_wrapper,
  .product_meta .posted_in,
  .product_meta .tagged_as {
    display: block !important;
    font-size: 12px !important;
    color: var(--muted) !important;
    margin: 0 !important;
  }
  .product_meta .sku,
  .product_meta a {
    color: var(--ink) !important;
    font-weight: 500;
    letter-spacing: 0.08em;
  }
  .product_meta a:hover {
    color: var(--rust) !important;
  }

  /* Stock indicator */
  .stock {
    font-family: 'JetBrains Mono', monospace !important;
    font-size: 11px !important;
    letter-spacing: 0.14em !important;
    text-transform: uppercase !important;
    margin-bottom: 16px !important;
  }
  .stock.in-stock { color: var(--success) !important; }
  .stock.out-of-stock { color: var(--rust-deep) !important; }

  /* Single variation display (price for selected combo) */
  .single_variation_wrap .woocommerce-variation-price {
    margin: 12px 0 18px !important;
  }
  .woocommerce-variation-availability {
    font-family: 'JetBrains Mono', monospace !important;
    font-size: 12px !important;
    letter-spacing: 0.12em !important;
    text-transform: uppercase !important;
    margin-bottom: 12px !important;
  }

  /* ═══════════════════════════════════════════════════════════════
     WOOCOMMERCE MY ACCOUNT PAGE
     Default WC markup is a flat bulleted list. This restructures it
     into the editorial 2-column layout with a real sidebar nav.
  ═══════════════════════════════════════════════════════════════ */

  /* Widen the legal-page-inner wrapper when WC my-account is the page. The
     woocommerce-account class lives on <body>, so we cascade from there. */
  body.woocommerce-account .legal-page-inner {
    max-width: 1080px;
  }
  /* Same for cart/checkout — they need the room too. */
  body.woocommerce-cart .legal-page-inner,
  body.woocommerce-checkout .legal-page-inner {
    max-width: 1080px;
  }

  /* Main account grid: sidebar + content. WC's default CSS floats these
     children with width:30%/68%, so we must reset float + width + explicitly
     assign grid columns to force the layout. */
  .woocommerce-account .woocommerce {
    display: grid !important;
    grid-template-columns: 240px 1fr !important;
    gap: 64px !important;
    align-items: start;
    margin-top: 16px !important;
    clear: both;
  }
  /* Add visible breathing room between the header and the my-account grid */
  body.woocommerce-account .legal-page-header {
    margin-bottom: 64px !important;
  }
  /* Hide the admin "Edit this page" link on WooCommerce account/cart/checkout pages —
     it's an admin-only link but visually intrusive in the styled layout. */
  body.woocommerce-account .edit-link,
  body.woocommerce-cart .edit-link,
  body.woocommerce-checkout .edit-link {
    display: none !important;
  }
  .woocommerce-account .woocommerce::before,
  .woocommerce-account .woocommerce::after {
    display: none !important;
  }
  .woocommerce-account .woocommerce-MyAccount-navigation {
    float: none !important;
    width: 100% !important;
    grid-column: 1 !important;
    position: relative;
  }
  .woocommerce-account .woocommerce-MyAccount-content {
    float: none !important;
    width: 100% !important;
    grid-column: 2 !important;
    margin: 0 !important;
  }
  .woocommerce-account .woocommerce-MyAccount-navigation ul {
    list-style: none !important;
    margin: 0 !important;
    padding: 0 !important;
  }
  .woocommerce-account .woocommerce-MyAccount-navigation li {
    list-style: none !important;
    margin: 0 !important;
    padding: 0 !important;
    display: block !important;
    border-bottom: 1px solid var(--line);
  }
  .woocommerce-account .woocommerce-MyAccount-navigation li:last-child {
    border-bottom: none;
    margin-top: 16px !important;
  }
  .woocommerce-account .woocommerce-MyAccount-navigation li a {
    display: block;
    padding: 14px 0;
    font-family: 'JetBrains Mono', monospace;
    font-size: 12px;
    font-weight: 500;
    letter-spacing: 0.16em;
    text-transform: uppercase;
    color: var(--ink-3);
    text-decoration: none;
    border: none !important;
    transition: color 0.2s, padding-left 0.2s;
  }
  .woocommerce-account .woocommerce-MyAccount-navigation li a:hover {
    color: var(--rust);
    padding-left: 6px;
  }
  .woocommerce-account .woocommerce-MyAccount-navigation li.is-active a {
    color: var(--rust);
    font-weight: 600;
  }
  .woocommerce-account .woocommerce-MyAccount-navigation li.is-active a::before {
    content: '— ';
    color: var(--rust);
  }
  /* Log out item — visually distinct */
  .woocommerce-account .woocommerce-MyAccount-navigation-link--customer-logout a {
    color: var(--muted) !important;
    font-size: 11px !important;
  }
  .woocommerce-account .woocommerce-MyAccount-navigation-link--customer-logout a:hover {
    color: var(--rust-deep) !important;
  }

  /* Right content area */
  .woocommerce-account .woocommerce-MyAccount-content {
    font-family: 'Inter Tight', sans-serif;
    font-size: 16px;
    line-height: 1.6;
    color: var(--ink-3);
  }
  .woocommerce-account .woocommerce-MyAccount-content p {
    margin: 0 0 18px;
  }
  .woocommerce-account .woocommerce-MyAccount-content a {
    color: var(--rust);
    text-decoration: underline;
    text-underline-offset: 3px;
  }
  .woocommerce-account .woocommerce-MyAccount-content a:hover {
    color: var(--rust-deep);
  }
  .woocommerce-account .woocommerce-MyAccount-content strong {
    color: var(--ink);
    font-weight: 600;
  }
  .woocommerce-account .woocommerce-MyAccount-content h2,
  .woocommerce-account .woocommerce-MyAccount-content h3 {
    font-family: 'Anton', sans-serif;
    font-weight: 400;
    color: var(--ink);
    text-transform: uppercase;
    letter-spacing: 0.02em;
    margin: 32px 0 18px;
  }
  .woocommerce-account .woocommerce-MyAccount-content h2 { font-size: 28px; }
  .woocommerce-account .woocommerce-MyAccount-content h3 { font-size: 20px; }

  /* WC info/notice boxes (e.g. "No order has been made yet.") */
  .woocommerce-account .woocommerce-info,
  .woocommerce-account .woocommerce-message,
  .woocommerce-account .woocommerce-error {
    background: var(--paper-2) !important;
    border: 1px solid var(--line) !important;
    border-left: 3px solid var(--rust) !important;
    border-radius: 0 !important;
    padding: 18px 22px !important;
    font-family: 'Inter Tight', sans-serif !important;
    font-size: 14px !important;
    color: var(--ink-3) !important;
    margin: 0 0 24px !important;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    flex-wrap: wrap;
  }
  .woocommerce-account .woocommerce-info::before,
  .woocommerce-account .woocommerce-message::before {
    display: none !important;
  }
  .woocommerce-account .woocommerce-info .button,
  .woocommerce-account .woocommerce-message .button {
    background: var(--ink) !important;
    color: var(--paper) !important;
    border: none !important;
    border-radius: 0 !important;
    padding: 10px 18px !important;
    font-family: 'JetBrains Mono', monospace !important;
    font-size: 11px !important;
    font-weight: 500 !important;
    letter-spacing: 0.14em !important;
    text-transform: uppercase !important;
    text-decoration: none !important;
  }
  .woocommerce-account .woocommerce-info .button:hover,
  .woocommerce-account .woocommerce-message .button:hover {
    background: var(--rust) !important;
  }

  /* Orders table */
  .woocommerce-account .woocommerce-orders-table,
  .woocommerce-account table.shop_table {
    width: 100%;
    border-collapse: collapse;
    margin: 0 0 24px;
    background: var(--paper);
    border: 1px solid var(--line);
  }
  .woocommerce-account .woocommerce-orders-table th,
  .woocommerce-account table.shop_table th {
    background: var(--paper-2);
    padding: 14px 18px;
    text-align: left;
    font-family: 'JetBrains Mono', monospace;
    font-size: 11px;
    letter-spacing: 0.14em;
    text-transform: uppercase;
    color: var(--ink);
    font-weight: 500;
    border-bottom: 1px solid var(--line);
  }
  .woocommerce-account .woocommerce-orders-table td,
  .woocommerce-account table.shop_table td {
    padding: 16px 18px;
    border-bottom: 1px solid var(--line);
    font-size: 14px;
    color: var(--ink-3);
    vertical-align: middle;
  }
  .woocommerce-account .woocommerce-orders-table tr:last-child td,
  .woocommerce-account table.shop_table tr:last-child td {
    border-bottom: none;
  }
  .woocommerce-account .woocommerce-orders-table .button,
  .woocommerce-account table.shop_table .button {
    background: var(--ink) !important;
    color: var(--paper) !important;
    border: none !important;
    border-radius: 0 !important;
    padding: 8px 14px !important;
    font-family: 'JetBrains Mono', monospace !important;
    font-size: 10px !important;
    letter-spacing: 0.14em !important;
    text-transform: uppercase !important;
    text-decoration: none !important;
  }
  .woocommerce-account .woocommerce-orders-table .button:hover,
  .woocommerce-account table.shop_table .button:hover {
    background: var(--rust) !important;
  }

  /* Address column layout */
  .woocommerce-account .woocommerce-Addresses,
  .woocommerce-account .u-columns {
    display: grid !important;
    grid-template-columns: 1fr 1fr !important;
    gap: 32px !important;
    margin: 0 !important;
  }
  .woocommerce-account .woocommerce-Address {
    width: 100% !important;
    float: none !important;
    background: var(--paper);
    border: 1px solid var(--line);
    padding: 24px;
  }
  .woocommerce-account .woocommerce-Address-title {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 12px;
    margin-bottom: 16px;
    padding-bottom: 12px;
    border-bottom: 1px solid var(--line);
  }
  .woocommerce-account .woocommerce-Address-title h3 {
    margin: 0 !important;
    font-size: 18px !important;
  }
  .woocommerce-account .woocommerce-Address-title .edit {
    font-family: 'JetBrains Mono', monospace;
    font-size: 11px;
    letter-spacing: 0.14em;
    text-transform: uppercase;
    color: var(--rust);
  }
  .woocommerce-account .woocommerce-Address address {
    font-style: normal;
    line-height: 1.7;
    color: var(--ink-3);
  }

  /* Forms — login, register, edit-account, edit-address */
  .woocommerce-account form.woocommerce-EditAccountForm,
  .woocommerce-account form.woocommerce-form-login,
  .woocommerce-account form.woocommerce-form-register,
  .woocommerce-account form.edit-account,
  .woocommerce-account form.woocommerce-address-fields,
  .woocommerce-account .woocommerce-form {
    max-width: 540px;
  }
  .woocommerce-account .form-row {
    margin: 0 0 18px;
    display: block;
  }
  .woocommerce-account .form-row label {
    display: block;
    font-family: 'JetBrains Mono', monospace;
    font-size: 11px;
    font-weight: 500;
    letter-spacing: 0.16em;
    text-transform: uppercase;
    color: var(--ink);
    margin-bottom: 6px;
  }
  .woocommerce-account .form-row input[type="text"],
  .woocommerce-account .form-row input[type="email"],
  .woocommerce-account .form-row input[type="tel"],
  .woocommerce-account .form-row input[type="password"],
  .woocommerce-account .form-row select,
  .woocommerce-account .form-row textarea {
    width: 100% !important;
    background: var(--paper) !important;
    border: 1.5px solid var(--line-2) !important;
    border-radius: 0 !important;
    padding: 12px 14px !important;
    font-family: 'Inter Tight', sans-serif !important;
    font-size: 15px !important;
    color: var(--ink) !important;
    box-sizing: border-box;
    transition: border-color 0.2s;
  }
  .woocommerce-account .form-row input:focus,
  .woocommerce-account .form-row select:focus,
  .woocommerce-account .form-row textarea:focus {
    outline: none;
    border-color: var(--rust) !important;
  }
  .woocommerce-account .form-row .required {
    color: var(--rust);
    text-decoration: none;
  }
  .woocommerce-account button[type="submit"],
  .woocommerce-account .woocommerce-Button,
  .woocommerce-account .button {
    background: var(--ink) !important;
    color: var(--paper) !important;
    border: none !important;
    border-radius: 0 !important;
    padding: 14px 28px !important;
    font-family: 'Anton', sans-serif !important;
    font-size: 14px !important;
    letter-spacing: 0.14em !important;
    text-transform: uppercase !important;
    cursor: pointer;
    transition: background 0.2s;
  }
  .woocommerce-account button[type="submit"]:hover,
  .woocommerce-account .woocommerce-Button:hover,
  .woocommerce-account .button:hover {
    background: var(--rust) !important;
  }

  /* Login / register two-column layout on /my-account/ when logged out */
  .woocommerce-account .u-columns.col2-set {
    grid-template-columns: 1fr 1fr;
  }

  /* Mobile: stack sidebar + content */
  @media (max-width: 800px) {
    .woocommerce-account .woocommerce {
      grid-template-columns: 1fr;
      gap: 32px;
    }
    .woocommerce-account .woocommerce-MyAccount-navigation {
      position: static;
      border: 1px solid var(--line);
      padding: 0 16px;
    }
    .woocommerce-account .woocommerce-Addresses,
    .woocommerce-account .u-columns {
      grid-template-columns: 1fr !important;
    }
  }

  /* ═══════════════════════════════════════════════════════════════
     END WOOCOMMERCE MY ACCOUNT
  ═══════════════════════════════════════════════════════════════ */

  /* ═══════════════════════════════════════════════════════════════
     WOOCOMMERCE CART & CHECKOUT BLOCKS — kill the default purple
     The newer Cart/Checkout block experience uses .wc-block-* selectors
     that bypass the classic shortcode button styles. Override the
     primary action color globally for any WC Block button.
     PayPal/Venmo/Apple Pay/Amazon Pay gateway buttons are explicitly
     EXCLUDED — they require their brand colors by gateway terms.
  ═══════════════════════════════════════════════════════════════ */

  /* Classic shortcode WC buttons — Proceed to Checkout (a.checkout-button),
     Update Cart, Apply Coupon, Place Order. Source of the purple is
     WC's default .button.alt color (settable in Customizer but we override). */
  a.checkout-button,
  .wc-proceed-to-checkout a.checkout-button,
  .woocommerce a.button.alt,
  .woocommerce button.button.alt,
  .woocommerce input.button.alt,
  .woocommerce a.button,
  .woocommerce button.button,
  .woocommerce input.button[type="submit"],
  .woocommerce-cart .actions button[name="update_cart"],
  .woocommerce-cart .actions button[name="apply_coupon"],
  #place_order {
    background: var(--ink) !important;
    background-color: var(--ink) !important;
    color: var(--paper) !important;
    border: none !important;
    border-radius: 0 !important;
    font-family: 'Anton', sans-serif !important;
    font-size: 16px !important;
    letter-spacing: 0.12em !important;
    text-transform: uppercase !important;
    padding: 16px 28px !important;
    text-shadow: none !important;
    box-shadow: none !important;
    transition: background 0.2s;
    text-decoration: none !important;
  }
  a.checkout-button:hover,
  .wc-proceed-to-checkout a.checkout-button:hover,
  .woocommerce a.button.alt:hover,
  .woocommerce button.button.alt:hover,
  .woocommerce input.button.alt:hover,
  .woocommerce a.button:hover,
  .woocommerce button.button:hover,
  .woocommerce input.button[type="submit"]:hover,
  #place_order:hover {
    background: var(--rust) !important;
    background-color: var(--rust) !important;
    color: var(--paper) !important;
  }
  /* Secondary actions (Apply coupon, Update cart) get the lighter treatment */
  .woocommerce-cart .actions button[name="apply_coupon"],
  .woocommerce-cart .actions input[name="update_cart"],
  .woocommerce-cart .actions button[name="update_cart"] {
    background: var(--paper-2) !important;
    color: var(--ink) !important;
    border: 1.5px solid var(--ink) !important;
  }
  .woocommerce-cart .actions button[name="apply_coupon"]:hover,
  .woocommerce-cart .actions input[name="update_cart"]:hover,
  .woocommerce-cart .actions button[name="update_cart"]:hover {
    background: var(--ink) !important;
    color: var(--paper) !important;
  }

  /* Primary action buttons (Proceed to Checkout, Place Order, etc.) */
  .wp-block-woocommerce-proceed-to-checkout-block .wc-block-cart__submit-button,
  .wp-block-woocommerce-checkout-actions-block .wc-block-components-checkout-place-order-button,
  .wc-block-cart__submit-container .wc-block-cart__submit-button,
  .wc-block-components-button.wc-block-cart__submit-button,
  .wc-block-components-button.contained,
  .wc-block-components-button.wc-block-components-checkout-place-order-button {
    background: var(--ink) !important;
    background-color: var(--ink) !important;
    color: var(--paper) !important;
    border: none !important;
    border-radius: 0 !important;
    font-family: 'Anton', sans-serif !important;
    font-size: 18px !important;
    letter-spacing: 0.12em !important;
    text-transform: uppercase !important;
    padding: 18px 32px !important;
    min-height: 60px;
    transition: background 0.2s;
    box-shadow: none !important;
  }
  .wp-block-woocommerce-proceed-to-checkout-block .wc-block-cart__submit-button:hover,
  .wp-block-woocommerce-checkout-actions-block .wc-block-components-checkout-place-order-button:hover,
  .wc-block-cart__submit-container .wc-block-cart__submit-button:hover,
  .wc-block-components-button.wc-block-cart__submit-button:hover,
  .wc-block-components-button.contained:hover,
  .wc-block-components-button.wc-block-components-checkout-place-order-button:hover {
    background: var(--rust) !important;
    background-color: var(--rust) !important;
    color: var(--paper) !important;
  }

  /* The button text inside the block button (sometimes wrapped in span) */
  .wc-block-components-button .wc-block-components-button__text {
    color: inherit !important;
    font-family: inherit !important;
    letter-spacing: inherit !important;
  }

  /* Cart Block totals area — make typography consistent */
  .wc-block-cart .wc-block-cart__totals-title,
  .wc-block-components-totals-wrapper,
  .wc-block-cart-items {
    font-family: 'Inter Tight', sans-serif;
    color: var(--ink-3);
  }
  .wc-block-cart .wc-block-cart__totals-title {
    font-family: 'JetBrains Mono', monospace;
    font-size: 11px;
    letter-spacing: 0.18em;
    text-transform: uppercase;
    color: var(--ink);
  }

  /* "Add a coupon" + change address links in rust */
  .wc-block-components-totals-coupon__button,
  .wc-block-components-address-card__edit,
  .wc-block-components-totals-shipping__change-address-button {
    color: var(--rust) !important;
  }
  .wc-block-components-totals-coupon__button:hover,
  .wc-block-components-address-card__edit:hover,
  .wc-block-components-totals-shipping__change-address-button:hover {
    color: var(--rust-deep) !important;
  }

  /* Form fields inside checkout block */
  .wc-block-components-text-input input,
  .wc-block-components-text-input textarea,
  .wc-block-components-select select {
    border-radius: 0 !important;
    border-color: var(--line-2) !important;
    background: var(--paper) !important;
    font-family: 'Inter Tight', sans-serif !important;
  }
  .wc-block-components-text-input input:focus,
  .wc-block-components-text-input textarea:focus,
  .wc-block-components-select select:focus {
    border-color: var(--rust) !important;
    box-shadow: none !important;
  }

  /* Radio buttons for shipping options — color the dot rust */
  .wc-block-components-radio-control__option input[type="radio"]:checked {
    accent-color: var(--rust);
  }

  /* Mobile tweaks for product purchase section */
  @media (max-width: 640px) {
    .variations th.label,
    .variations label {
      display: block;
      width: 100% !important;
      padding-right: 0 !important;
      padding-bottom: 4px !important;
    }
    .variations select {
      min-width: 0;
      max-width: 100%;
    }
    .summary input.qty,
    form.cart input.qty {
      width: 72px !important;
      height: 56px !important;
      font-size: 18px !important;
    }
    .single_add_to_cart_button {
      height: 56px !important;
      font-size: 16px !important;
      padding: 0 24px !important;
      flex: 1;
    }
  }
