/*
Theme Name: THE ALT/LAB
Theme URI: https://github.com/momomuscle/altlab
Author: MoMo Muscle
Description: THE ALT/LAB RUO research-compound store theme. Apothecary editorial, WooCommerce-ready.
Version: 0.2.0
Text Domain: altlab
*/

:root {
    /* v10 base — preserved from the image-backed v4/v5 direction */
    --paper:        #F6F8F6;        /* Le Labo cool near-white */
    --paper-2:      #ECEFEC;        /* cool light divider tone */
    --product-bg:   #6C6D6C;        /* neutral gray — product tile bg (de-warmed) */
    --product-bg-2: #585958;        /* slightly darker neutral variant */
    --dark:         #0F0F0F;        /* near-black hero background */
    --dark-2:       #1A1A1A;
    --ink:          #141414;
    --ink-soft:     #2B2B2B;
    --ink-mute:     #807B6F;
    --label:        #FBFAF4;
    --label-aged:   #E8E2D3;
    --chrome:       #C8CBCD;
    --chrome-dark:  #8F9495;
    --accent:       #A9FF2F;
    --grid:         rgba(20,20,20,0.025); /* VERY subtle — barely there */
    --grid-strong:  rgba(20,20,20,0.055);
    --rule:         #141414;
    --rule-soft:    rgba(20,20,20,0.18);
    --tracker:      0.14em;
    --tracker-wide: 0.28em;
  }

  *, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }

  html, body {
    background-color: var(--paper);
    color: var(--ink);
    font-family: "Helvetica Neue", "Helvetica", "Arial", sans-serif;
    font-weight: 400;
    font-size: 13px;
    line-height: 1.55;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    overflow-x: hidden;
  }

  /* Graph paper — kept but pulled WAY back, just a whisper */
  body::before {
    content: "";
    position: fixed; inset: 0;
    pointer-events: none; z-index: 1;
    background-image:
      linear-gradient(to right,  var(--grid) 1px, transparent 1px),
      linear-gradient(to bottom, var(--grid) 1px, transparent 1px),
      linear-gradient(to right,  var(--grid-strong) 1px, transparent 1px),
      linear-gradient(to bottom, var(--grid-strong) 1px, transparent 1px);
    background-size: 24px 24px, 24px 24px, 144px 144px, 144px 144px;
  }

  body > * { position: relative; z-index: 2; }
  body.gated { overflow: hidden; height: 100vh; }

  a { color: inherit; text-decoration: none; }
  a:hover { text-decoration: underline; text-underline-offset: 3px; text-decoration-thickness: 1px; }
  img { display: block; max-width: 100%; height: auto; }
  em, i { font-style: italic; }

  .descriptor { font-style: italic; font-weight: 400; text-transform: lowercase; letter-spacing: 0.01em; }

  .loc-stamp {
    display: inline-block;
    border: 1px solid currentColor;
    padding: 3px 7px 2px;
    font-size: 9px;
    line-height: 1;
    letter-spacing: 0.16em;
    text-transform: uppercase;
    transform: rotate(-1deg);
  }

  /* ===== ENTRY GATE ===== */
  #gate {
    position: fixed; inset: 0; z-index: 1000;
    background: var(--paper);
    display: flex; flex-direction: column;
    padding: 28px 36px;
    overflow-y: auto;
  }
  #gate.hidden { display: none; }

  .gate-top, .gate-foot {
    display: flex; justify-content: space-between; align-items: center;
    font-size: 10px; text-transform: uppercase;
    letter-spacing: var(--tracker-wide);
    color: var(--ink-mute);
  }
  .gate-top { padding-bottom: 16px; border-bottom: 1px solid var(--rule-soft); }
  .gate-foot { padding-top: 18px; border-top: 1px solid var(--rule-soft); }

  .gate-body {
    flex: 1; display: flex; flex-direction: column;
    justify-content: center; align-items: center;
    max-width: 600px; margin: 0 auto; width: 100%;
    padding: 64px 0; text-align: center;
  }
  .gate-mark {
    font-weight: 700; font-size: 34px; line-height: 1;
    letter-spacing: 0.02em; text-transform: uppercase;
    margin-bottom: 8px;
  }
  .gate-mark .br { font-weight: 400; opacity: 0.7; }
  .gate-sub {
    font-size: 10px; text-transform: uppercase;
    letter-spacing: var(--tracker-wide);
    color: var(--ink-soft); margin-bottom: 72px;
    font-style: italic;
  }
  .gate-h {
    font-size: 10px; text-transform: uppercase;
    letter-spacing: var(--tracker-wide);
    margin-bottom: 36px; color: var(--ink-soft);
  }
  .gate-h::before, .gate-h::after { content: " — "; opacity: 0.5; }

  .gate-disclaimer {
    font-size: 12.5px; line-height: 1.85;
    color: var(--ink-soft); max-width: 520px;
    margin: 0 auto 40px; text-align: left;
  }
  .gate-disclaimer p { margin-bottom: 14px; }
  .gate-disclaimer .warn {
    border-left: 1px solid var(--ink);
    padding: 6px 0 6px 16px; margin: 20px 0;
    font-size: 11.5px; line-height: 1.7;
  }

  .gate-checks {
    display: flex; flex-direction: column; gap: 14px;
    text-align: left; max-width: 520px;
    margin: 0 auto 40px;
  }
  .check-row {
    display: flex; gap: 12px; align-items: flex-start;
    cursor: pointer; font-size: 11.5px; line-height: 1.6;
  }
  .check-row .box {
    width: 13px; height: 13px;
    border: 1px solid var(--ink); background: transparent;
    flex-shrink: 0; margin-top: 3px;
    position: relative; transition: background 0.15s;
  }
  .check-row.checked .box { background: var(--ink); }
  .check-row.checked .box::after {
    content: "×"; color: var(--paper);
    position: absolute; inset: 0;
    display: flex; align-items: center; justify-content: center;
    font-size: 13px; line-height: 1;
  }

  .gate-btn {
    background: var(--ink); color: var(--paper);
    border: 1px solid var(--ink);
    padding: 16px 48px;
    font-family: inherit; font-size: 11px;
    text-transform: uppercase; letter-spacing: var(--tracker-wide);
    cursor: pointer; transition: all 0.18s;
    min-width: 320px;
  }
  .gate-btn:hover:not(:disabled) { background: var(--paper); color: var(--ink); }
  .gate-btn:disabled { opacity: 0.22; cursor: not-allowed; }

  .gate-decline {
    display: inline-block; margin-top: 18px;
    font-size: 10px; text-transform: uppercase;
    letter-spacing: var(--tracker); color: var(--ink-mute);
  }

  /* ===== ANNOUNCEMENT — neutral gray strip, like product ===== */
  .annc {
    background: #4A4A47;
    color: var(--paper);
    text-align: center; font-size: 11px;
    letter-spacing: 0.04em;
    padding: 9px 16px;
    font-style: italic;
  }
  .annc a { text-decoration: underline; text-underline-offset: 2px; }

  .lab-bar {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    border-bottom: 1px solid var(--rule);
    background: var(--paper);
  }
  .lab-bar span {
    padding: 11px 18px 10px;
    border-right: 1px solid var(--rule-soft);
    font-size: 9px;
    letter-spacing: var(--tracker-wide);
    text-transform: uppercase;
    color: var(--ink-soft);
    white-space: nowrap;
  }
  .lab-bar span:last-child { border-right: 0; }

  /* ===== HEADER — restructured to match apothecary layout ===== */
  header.site {
    border-bottom: 1px solid var(--rule);
    position: sticky; top: 0;
    background: var(--paper); z-index: 60;
  }

  .header-top {
    display: grid;
    grid-template-columns: 1fr 1.4fr 1fr;
    align-items: center;
    padding: 20px 32px 14px;
    gap: 24px;
  }

  .brand {
    display: flex; flex-direction: column;
    line-height: 1; text-align: left;
  }
  .brand .mark {
    font-weight: 700; font-size: 24px;
    letter-spacing: 0.015em; text-transform: uppercase;
  }
  .brand .mark .br { font-weight: 400; opacity: 0.55; }
  .brand .tag {
    font-size: 9px; letter-spacing: 0.32em;
    text-transform: uppercase; margin-top: 8px;
    color: var(--ink-soft);
  }

  .search {
    display: flex; align-items: center;
    gap: 10px; padding: 0 0;
    border-bottom: 1px solid var(--ink);
    padding-bottom: 6px;
  }
  .search svg { flex-shrink: 0; opacity: 0.7; }
  .search input {
    background: transparent; border: 0;
    flex: 1; font-family: inherit;
    font-size: 12px;
    color: var(--ink-soft);
    outline: none;
  }
  .search input::placeholder {
    color: var(--ink-mute);
    font-style: italic;
  }

  .header-icons {
    display: flex; justify-content: flex-end;
    gap: 22px; align-items: center;
  }
  .header-icons a { display: flex; align-items: center; gap: 6px; }
  .header-icons svg { opacity: 0.85; }
  .header-icons .count {
    font-size: 11px; letter-spacing: 0.04em;
  }

  /* Nav row */
  nav.primary {
    border-top: 1px solid var(--rule-soft);
    padding: 14px 32px;
  }
  nav.primary ul {
    list-style: none; display: flex; justify-content: center;
    gap: 36px;
    font-size: 11px; text-transform: uppercase;
    letter-spacing: var(--tracker);
    font-weight: 700;
  }

  /* ===== IMG SLOT — graceful placeholder ===== */
  .img-slot {
    position: relative;
    background: var(--product-bg);
    overflow: hidden;
  }
  .img-slot img {
    width: 100%; height: 100%; object-fit: cover;
    transition: transform 0.5s ease;
  }
  .img-slot img[src=""] { display: none; }
  .img-slot .ph {
    position: absolute; inset: 0;
    display: flex; flex-direction: column;
    align-items: center; justify-content: center;
    text-align: center; padding: 24px;
    color: rgba(244,243,238,0.55);
    font-size: 9px; text-transform: uppercase;
    letter-spacing: var(--tracker-wide);
    line-height: 1.8;
  }
  .img-slot .ph::before, .img-slot .ph::after {
    content: ""; width: 24px; height: 1px;
    background: rgba(244,243,238,0.4); margin: 10px 0;
  }
  .img-slot.has-img .ph { display: none; }
  .img-slot.mock .ph { display: none; }

  /* v4 built-in art direction: apothecary-style staging without needing final photos */
  .img-slot.mock {
    isolation: isolate;
    background:
      radial-gradient(circle at 50% 28%, rgba(255,255,255,0.34), transparent 28%),
      linear-gradient(135deg, #77776f 0%, #5f605a 55%, #4d4e49 100%);
  }
  .img-slot.mock::before {
    content: "";
    position: absolute;
    left: 50%;
    top: 48%;
    width: 34%;
    max-width: 170px;
    min-width: 88px;
    aspect-ratio: 0.42 / 1;
    transform: translate(-50%, -50%);
    border-radius: 18px 18px 9px 9px;
    background:
      linear-gradient(90deg, rgba(255,255,255,0.24), rgba(255,255,255,0.05) 18%, rgba(0,0,0,0.18) 50%, rgba(255,255,255,0.18) 75%, rgba(0,0,0,0.12)),
      linear-gradient(180deg, rgba(245,247,245,0.82), rgba(202,205,203,0.68));
    border: 1px solid rgba(255,255,255,0.38);
    box-shadow: 0 30px 55px rgba(0,0,0,0.38);
    z-index: 1;
  }
  .img-slot.mock::after {
    content: "THE ALT/LAB\A UNITED STATES\A LOT / RUO-01\A for research use only";
    white-space: pre;
    position: absolute;
    left: 50%;
    top: 52%;
    width: min(160px, 43%);
    transform: translate(-50%, -50%) rotate(-1deg);
    background: var(--label);
    border: 1px solid rgba(20,20,20,0.82);
    padding: 12px 10px;
    color: var(--ink);
    font-size: 8px;
    line-height: 1.42;
    letter-spacing: 0.11em;
    text-transform: uppercase;
    text-align: left;
    box-shadow: 0 10px 18px rgba(0,0,0,0.18);
    z-index: 2;
  }
  .hero-media .img-slot.mock {
    background:
      radial-gradient(circle at 58% 42%, rgba(255,255,255,0.12), transparent 16%),
      linear-gradient(90deg, rgba(0,0,0,0.3), transparent 45%),
      linear-gradient(140deg, #111 0%, #191917 38%, #52534e 100%);
  }
  .hero-media .img-slot.mock::before {
    left: 72%;
    top: 52%;
    width: 22%;
    max-width: 220px;
  }
  .hero-media .img-slot.mock::after {
    content: "THE ALT/LAB\A UNITED STATES\A RESEARCH COMPOUNDS\A LOT / RUO-26\A not for human use";
    left: 72%;
    top: 54%;
    width: min(220px, 24%);
    font-size: 9px;
    padding: 16px 14px;
  }
  .stack-hero .img-slot.mock::after {
    content: "THE ALT/LAB\A UNITED STATES\A MONOGRAPH / EDITION 04\A research use only";
  }
  .editorial .img-slot.mock {
    background:
      linear-gradient(rgba(0,0,0,0.34), rgba(0,0,0,0.45)),
      repeating-linear-gradient(0deg, rgba(255,255,255,0.03) 0 1px, transparent 1px 26px),
      linear-gradient(140deg, #101010, #2f302d 62%, #67685f);
  }
  .editorial .img-slot.mock::before {
    width: 25%;
    max-width: 260px;
    left: 32%;
    transform: translate(-50%, -50%) rotate(-6deg);
    border-radius: 0;
    aspect-ratio: .72 / 1;
    background: var(--label-aged);
  }
  .editorial .img-slot.mock::after {
    content: "UNITED STATES\A LAB NOTES\A ON BATCH TESTING\A THE ALT/LAB / 2026";
    left: 32%;
    top: 50%;
    width: min(230px, 26%);
  }

  /* Dark-background variant for hero slots */
  .img-slot.dark { background: var(--dark); }
  .img-slot.dark .ph { color: rgba(244,243,238,0.4); }
  .img-slot.dark .ph::before, .img-slot.dark .ph::after { background: rgba(244,243,238,0.3); }

  /* ===== HERO — DARK dramatic still-life, centered overlay ===== */
  .hero { position: relative; border-bottom: 1px solid var(--rule); }
  .hero-media {
    position: relative;
    height: clamp(560px, 90vh, 1100px); /* scales with the screen instead of locking to 16/9 */
    min-height: 560px;
    overflow: hidden;
  }
  .hero-media .img-slot { width: 100%; height: 100%; }
  .hero-media .img-slot img { filter: brightness(0.85); }

  .hero-caption {
    position: absolute;
    inset: 0;
    display: flex; flex-direction: column;
    align-items: flex-start; justify-content: center;
    color: var(--paper); z-index: 3;
    text-align: left;
    padding: 24px 8vw;
  }
  .hero-caption h1 {
    font-weight: 700; font-size: clamp(40px, 7vw, 80px);
    line-height: 1; letter-spacing: 0.005em;
    text-transform: uppercase; margin-bottom: 14px;
  }
  .hero-caption .sub {
    font-size: 13px; max-width: 480px;
    margin: 0 0 24px; line-height: 1.7;
    font-style: italic;
    opacity: 0.95;
  }
  .hero-caption .vm {
    display: inline-block;
    font-size: 11px; text-transform: uppercase;
    letter-spacing: var(--tracker);
    border-bottom: 1px solid var(--paper);
    padding-bottom: 4px;
    font-weight: 700;
  }

  /* ===== STACKED HERO BLOCKS — product "VIOLETTE 30 / introducing..." pattern ===== */
  .stack-heroes {
    display: grid;
    grid-template-columns: 1fr 1fr;
    border-bottom: 1px solid var(--rule);
  }
  .stack-hero {
    position: relative;
    aspect-ratio: 4/3;
    min-height: 380px;
    overflow: hidden;
    border-right: 1px solid var(--rule);
  }
  .stack-hero:last-child { border-right: 0; }
  .stack-hero .img-slot { width: 100%; height: 100%; }
  .stack-hero .img-slot img { filter: brightness(0.82); }

  .stack-cap {
    position: absolute;
    inset: 0;
    display: flex; flex-direction: column;
    align-items: center; justify-content: center;
    text-align: center;
    color: var(--paper); z-index: 3;
    padding: 24px;
  }
  .stack-cap h3 {
    font-weight: 700; font-size: clamp(28px, 4vw, 44px);
    line-height: 1; letter-spacing: 0.005em;
    text-transform: uppercase; margin-bottom: 10px;
  }
  .stack-cap .sub {
    font-size: 12px;
    font-style: italic; margin-bottom: 18px;
    opacity: 0.92;
  }
  .stack-cap .vm {
    font-size: 10px; text-transform: uppercase;
    letter-spacing: var(--tracker);
    border-bottom: 1px solid var(--paper);
    padding-bottom: 3px;
    font-weight: 700;
  }

  /* ===== LABEL SYSTEM ===== */
  .label-lab {
    display: grid;
    grid-template-columns: 1.08fr .92fr;
    border-bottom: 1px solid var(--rule);
    background: var(--paper);
  }
  .label-copy {
    padding: 64px 32px;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    min-height: 520px;
    border-right: 1px solid var(--rule);
  }
  .label-copy h2 {
    font-weight: 700;
    font-size: clamp(32px, 5.6vw, 82px);
    line-height: .95;
    letter-spacing: -0.02em;
    text-transform: uppercase;
    max-width: 760px;
  }
  .label-copy p {
    max-width: 520px;
    font-size: 13px;
    line-height: 1.8;
    color: var(--ink-soft);
    font-style: italic;
  }
  .label-sheet {
    padding: 38px 32px;
    display: grid;
    gap: 18px;
    align-content: center;
    background:
      linear-gradient(rgba(20,20,20,0.018) 1px, transparent 1px),
      linear-gradient(90deg, rgba(20,20,20,0.018) 1px, transparent 1px),
      var(--paper-2);
    background-size: 18px 18px;
  }
  .formula-label {
    background: var(--label);
    border: 1px solid var(--rule);
    padding: 18px;
    min-height: 160px;
    display: grid;
    grid-template-columns: 1fr auto;
    gap: 12px;
    box-shadow: 0 12px 26px rgba(20,20,20,0.08);
  }
  .formula-label:nth-child(2) { transform: rotate(.8deg); }
  .formula-label:nth-child(3) { transform: rotate(-.6deg); }
  .formula-main strong {
    display: block;
    font-size: 24px;
    line-height: 1;
    letter-spacing: 0.01em;
    text-transform: uppercase;
    margin-bottom: 8px;
  }
  .formula-main small,
  .formula-side {
    font-size: 9px;
    line-height: 1.6;
    letter-spacing: 0.16em;
    text-transform: uppercase;
    color: var(--ink-soft);
  }
  .formula-side {
    writing-mode: vertical-rl;
    text-align: center;
    border-left: 1px solid var(--rule-soft);
    padding-left: 12px;
  }

  /* ===== GRID SECTIONS — section-head border extends full width via negative margin matching parent padding ===== */
  .grid-section {
    padding: 64px var(--gs-px, 32px) 56px;
    border-bottom: 1px solid var(--rule);
    --gs-px: 32px;
  }
  /* Wide-screen: cap content centerline (lines stay edge-to-edge via negative-margin trick on .section-head) */
  @media (min-width: 1600px) {
    .grid-section { padding-left: max(32px, calc((100vw - 1440px) / 2)); padding-right: max(32px, calc((100vw - 1440px) / 2)); --gs-px: max(32px, calc((100vw - 1440px) / 2)); }
  }
  .section-head {
    display: flex; justify-content: space-between; align-items: baseline;
    padding-bottom: 20px; margin: 0 calc(-1 * var(--gs-px, 32px)) 0;
    padding-left: var(--gs-px, 32px); padding-right: var(--gs-px, 32px);
    border-bottom: 1px solid var(--rule);
  }
  .section-head h2 {
    font-weight: 700; font-size: 22px;
    text-transform: uppercase; letter-spacing: 0.015em;
  }
  .section-head .meta {
    font-size: 10px; text-transform: uppercase;
    letter-spacing: var(--tracker-wide);
    color: var(--ink-mute); font-style: italic;
  }

  /* ===== PRODUCT GRID — product signature: gray-bg tiles ===== */
  .product-grid {
    display: grid; grid-template-columns: repeat(4, 1fr);
    gap: 0;
  }
  .product {
    padding: 28px 24px 32px 0;
    display: flex; flex-direction: column;
  }
  .product:not(:first-child) { padding-left: 24px; }

  .product .img-slot {
    aspect-ratio: 1/1;             /* product tiles are SQUARE on gray */
    margin-bottom: 18px;
    background: var(--product-bg);
  }
  .product:hover .img-slot img { transform: scale(1.02); }

  .product-name {
    font-weight: 700; font-size: 15px;
    text-transform: uppercase; letter-spacing: 0.015em;
    margin-bottom: 4px;
  }
  .product-class {
    font-size: 12px;
    color: var(--ink-soft); margin-bottom: 4px;
  }
  .product-vol {
    font-size: 11px; color: var(--ink-mute);
    margin-bottom: 14px;
  }
  .product-actions {
    display: flex; gap: 12px; margin-top: auto;
  }
  .product-actions a {
    font-size: 10px; text-transform: uppercase;
    letter-spacing: var(--tracker);
  }
  .product-actions a + a::before {
    content: "·"; margin-right: 12px; color: var(--ink-mute);
  }

  /* ===== RESEARCH AREAS ===== */
  .research-grid {
    display: grid; grid-template-columns: repeat(4, 1fr);
    border-top: 1px solid var(--rule-soft);
  }
  .proto {
    border-right: 1px solid var(--rule-soft);
    border-bottom: 1px solid var(--rule-soft);
    padding: 36px 28px;
    display: flex; flex-direction: column;
    min-height: 380px;
  }
  .proto:nth-child(4n) { border-right: 0; }

  .proto-code {
    font-size: 10px; text-transform: uppercase;
    letter-spacing: var(--tracker-wide);
    color: var(--ink-mute); margin-bottom: 18px;
    font-style: italic;
  }
  .proto-name {
    font-weight: 700; font-size: 28px;
    text-transform: uppercase; letter-spacing: 0.01em;
    line-height: 1; margin-bottom: 10px;
  }
  .proto-tag {
    font-size: 13px;
    color: var(--ink-soft); margin-bottom: 26px;
  }
  .proto-list {
    list-style: none; font-size: 12px; line-height: 2.1;
    text-transform: uppercase; letter-spacing: 0.03em;
    margin-bottom: 24px;
  }
  .proto-list .l {
    font-size: 9px; color: var(--ink-mute);
    letter-spacing: var(--tracker-wide);
    margin-bottom: 8px; display: block;
    font-style: italic;
  }
  .proto-foot {
    margin-top: auto; padding-top: 16px;
    border-top: 1px solid var(--rule-soft);
    display: flex; justify-content: space-between;
    font-size: 10px; text-transform: uppercase;
    letter-spacing: var(--tracker);
  }

  /* ===== EDITORIAL — dark hero pattern ===== */
  .editorial {
    position: relative;
    aspect-ratio: 16/9;
    min-height: 480px;
    overflow: hidden;
    border-bottom: 1px solid var(--rule);
  }
  .editorial .img-slot { width: 100%; height: 100%; background: var(--dark); }
  .editorial .img-slot img { filter: brightness(0.7); }

  .editorial-cap {
    position: absolute;
    inset: 0;
    display: flex; flex-direction: column;
    align-items: center; justify-content: center;
    text-align: center;
    color: var(--paper); z-index: 3;
    padding: 32px;
  }
  .editorial-cap .eyebrow {
    font-size: 10px; text-transform: uppercase;
    letter-spacing: var(--tracker-wide);
    margin-bottom: 18px; opacity: 0.9;
    font-style: italic;
  }
  .editorial-cap h2 {
    font-weight: 700; font-size: clamp(28px, 4vw, 44px);
    text-transform: uppercase; letter-spacing: 0.005em;
    line-height: 1.1; margin-bottom: 16px;
    max-width: 720px;
  }
  .editorial-cap p {
    font-size: 13px; line-height: 1.75;
    max-width: 540px; margin-bottom: 22px;
    font-style: italic;
    opacity: 0.92;
  }
  .editorial-cap .vm {
    display: inline-block;
    font-size: 11px; text-transform: uppercase;
    letter-spacing: var(--tracker);
    border-bottom: 1px solid var(--paper);
    padding-bottom: 3px;
    font-weight: 700;
  }

  /* ===== PROCESS ===== */
  .process { padding: 72px 32px 64px; border-bottom: 1px solid var(--rule); }
  .process-head { text-align: center; margin-bottom: 48px; }
  .process-head .eyebrow {
    font-size: 10px; text-transform: uppercase;
    letter-spacing: var(--tracker-wide);
    color: var(--ink-mute); margin-bottom: 16px;
    font-style: italic;
  }
  .process-head h2 {
    font-weight: 700; font-size: 28px;
    text-transform: uppercase; letter-spacing: 0.005em;
  }
  .steps {
    display: grid; grid-template-columns: repeat(4, 1fr);
    border-top: 1px solid var(--rule);
    /* full-bleed to match .product-grid / .research-grid (was a 1280px centered island) */
  }
  .step {
    border-right: 1px solid var(--rule-soft);
    border-bottom: 1px solid var(--rule);
    padding: 36px 24px;
  }
  .step:nth-child(4n) { border-right: 0; }
  .step-num {
    font-size: 10px; text-transform: uppercase;
    letter-spacing: var(--tracker-wide);
    margin-bottom: 22px;
    color: var(--ink-mute); font-style: italic;
  }
  .step-title {
    font-weight: 700; font-size: 17px;
    text-transform: uppercase; letter-spacing: 0.015em;
    margin-bottom: 14px;
  }
  .step-text { font-size: 12px; line-height: 1.75; color: var(--ink-soft); max-width: 34ch; }

  /* ===== MANIFESTO ===== */
  .manifesto { padding: 88px 32px; text-align: center; border-bottom: 1px solid var(--rule); }
  .manifesto .eyebrow {
    font-size: 10px; text-transform: uppercase;
    letter-spacing: var(--tracker-wide);
    color: var(--ink-mute); margin-bottom: 24px;
    font-style: italic;
  }
  .manifesto blockquote {
    font-weight: 700; font-size: clamp(22px, 3vw, 32px);
    line-height: 1.35; text-transform: uppercase;
    letter-spacing: 0.01em;
    max-width: 900px; margin: 0 auto;
  }
  .manifesto cite {
    display: block; margin-top: 26px;
    font-size: 10px; text-transform: uppercase;
    letter-spacing: var(--tracker-wide);
    color: var(--ink-mute); font-style: italic;
  }

  /* ===== FOOTER — paper-version of SBA editorial grid ===== */
  footer.site {
    background:
      linear-gradient(rgba(20,20,20,0.022) 1px, transparent 1px),
      linear-gradient(90deg, rgba(20,20,20,0.022) 1px, transparent 1px),
      var(--paper);
    background-size: 44px 44px;
    color: var(--ink);
    padding: 56px 32px 24px;
    border-top: 1px solid var(--rule);
  }

  /* Wide-screen content cap — keeps things from sprawling on 1600px+ */
  footer.site > * { max-width: 1440px; margin-left: auto; margin-right: auto; }

  .foot-grid {
    display: grid; grid-template-columns: 1.6fr 1fr 1fr 1fr 1.3fr;
    gap: 0; padding-bottom: 36px;
    border-bottom: 1px solid var(--rule-soft);
  }
  .foot-grid > div { overflow-wrap: anywhere; word-break: normal; }
  .foot-grid > div {
    padding: 0 22px;
    border-left: 1px solid var(--rule-hair);
    min-height: 142px;
  }
  .foot-grid > div:first-child {
    padding-left: 0;
    border-left: 0;
  }
  .foot-brand-mark {
    font-weight: 700; font-size: 20px;
    text-transform: uppercase; letter-spacing: 0.02em;
    margin-bottom: 6px;
  }
  .foot-brand-mark .br { font-weight: 400; opacity: 0.55; }
  .foot-brand-tag {
    font-size: 9px; letter-spacing: 0.32em;
    text-transform: uppercase; color: var(--ink-soft);
    margin-bottom: 16px;
  }
  .foot-tag {
    font-size: 11.5px; line-height: 1.65;
    color: var(--ink-soft); max-width: 320px;
  }
  .foot-col h4 {
    font-size: 9px; text-transform: uppercase;
    letter-spacing: var(--tracker-wide);
    margin-bottom: 14px;
    color: var(--ink-mute); font-weight: 400;
    font-style: italic;
  }
  .foot-col ul {
    list-style: none; font-size: 10.5px;
    text-transform: uppercase; letter-spacing: 0.04em;
    line-height: 2;
  }
  .foot-col a, .foot-grid > div:last-child a {
    color: var(--ink-soft);
    transition: color 0.18s ease;
  }
  .foot-col a:hover, .foot-grid > div:last-child a:hover {
    color: var(--ink);
  }

  /* RUO disclaimer block — the one "safe details" addition */
  .foot-ruo {
    padding: 24px 0 22px;
    border-bottom: 1px solid var(--rule-soft);
    font-size: 10.5px; line-height: 1.85;
    color: var(--ink-mute);
    max-width: 1080px;
  }
  .foot-ruo strong {
    display: block;
    font-size: 10px; letter-spacing: var(--tracker-wide);
    text-transform: uppercase; color: var(--ink-soft);
    margin-bottom: 10px; font-weight: 700;
  }

  .foot-base {
    display: flex; justify-content: space-between; gap: 18px;
    padding-top: 18px;
    font-size: 9px; text-transform: uppercase;
    letter-spacing: var(--tracker-wide);
    color: var(--ink-mute);
  }
  .foot-base em { font-style: italic; }

  /* ===== RESPONSIVE ===== */
  @media (max-width: 980px) {
    .header-top { grid-template-columns: 1fr 1fr; gap: 16px; }
    .search { grid-column: span 2; order: 3; margin-top: 8px; }
    nav.primary ul { flex-wrap: wrap; justify-content: center; gap: 14px; }
    .stack-heroes { grid-template-columns: 1fr; }
    .stack-hero { border-right: 0; border-bottom: 1px solid var(--rule); }
    .stack-hero:last-child { border-bottom: 0; }
    .label-lab { grid-template-columns: 1fr; }
    .label-copy { border-right: 0; border-bottom: 1px solid var(--rule); min-height: 420px; }
    .lab-bar { grid-template-columns: 1fr 1fr; }
    .lab-bar span:nth-child(2n) { border-right: 0; }
    .product-grid, .research-grid, .steps { grid-template-columns: 1fr 1fr; }
    .product:nth-child(2n), .proto:nth-child(2n), .step:nth-child(2n) { border-right: 0; }
    .product:nth-child(4n), .proto:nth-child(4n), .step:nth-child(4n) { border-right: 1px solid var(--rule-soft); }
    /* Footer tablet/mobile — SBA-style 3-col nav grid; brand + contact span full row */
    footer.site { padding: 40px 20px 20px; background-size: 32px 32px; }
    .foot-grid { grid-template-columns: repeat(3, 1fr); gap: 0; padding-bottom: 28px; }
    .foot-grid > div { padding: 18px 14px; border-left: 1px solid var(--rule-hair); min-height: 0; border-top: 1px solid var(--rule-hair); }
    .foot-grid > div:first-child { grid-column: 1 / -1; padding: 0 0 24px; border-left: 0; border-top: 0; }
    .foot-grid > div:last-child { grid-column: 1 / -1; padding: 22px 0 0; border-left: 0; border-top: 1px solid var(--rule-hair); margin-top: 6px; }
    .foot-tag { font-size: 11px; max-width: 100%; }
    .foot-col h4 { margin-bottom: 10px; font-size: 8.5px; }
    .foot-col ul { font-size: 10px; line-height: 2.2; }
    .foot-ruo { padding: 20px 0 18px; font-size: 10px; }
    .foot-base { padding-top: 16px; gap: 12px; font-size: 8.5px; flex-direction: column; align-items: flex-start; }
    .hero-media { height: auto; aspect-ratio: 4/3; min-height: 460px; }
    .editorial { aspect-ratio: 4/3; min-height: 420px; }
  }

  @media (max-width: 520px) {
    .header-top { grid-template-columns: 1fr; text-align: center; }
    .header-icons { justify-content: center; }
    .brand { align-items: center; }
    .product-grid, .research-grid, .steps { grid-template-columns: 1fr; }
    .product, .proto, .step { border-right: 0 !important; }
    .product { padding-left: 0 !important; padding-right: 0; }
    /* Keep footer 3-col on small phones — preserves SBA editorial structure */
    .foot-grid { grid-template-columns: repeat(3, 1fr); }
    .foot-grid > div { padding: 14px 10px; }
    .foot-grid > div:first-child { padding: 0 0 18px; }
    .foot-grid > div:last-child { padding: 18px 0 0; }
    .foot-col h4 { font-size: 8px; }
    .foot-col ul { font-size: 9.5px; line-height: 2; }
    .lab-bar { grid-template-columns: 1fr; }
    .lab-bar span { border-right: 0; border-bottom: 1px solid var(--rule-soft); }
    .lab-bar span:last-child { border-bottom: 0; }
    .label-copy, .label-sheet { padding: 42px 20px; }
    .grid-section { padding: 48px 20px 40px; --gs-px: 20px; }
    .section-head { flex-direction: column; align-items: flex-start; gap: 8px; }
    .gate-mark { font-size: 28px; }
    .annc { font-size: 10px; padding: 8px 12px; }
    .hero-media .img-slot.mock::before,
    .hero-media .img-slot.mock::after { display: none; }
    .hero-caption {
      align-items: flex-start;
      padding: 28px 40px;
    }
    .hero-caption h1 { font-size: 38px; }
    .hero-caption .sub { max-width: 290px; }
    .stack-cap h3 { font-size: 32px; }
  }

  .product .img-slot{position:relative}
  .vlabel{position:absolute;left:50%;top:52.5%;transform:translate(-50%,-50%) rotate(-.5deg);
    width:clamp(58px,13%,100px);background:#FBFAF4;border:1px solid rgba(20,20,20,.5);
    padding:5px 4px 4px;text-align:center;box-shadow:0 3px 8px rgba(0,0,0,.16);z-index:3;pointer-events:none;
    word-break:normal;overflow-wrap:break-word;hyphens:manual}
  .vlabel .bm{display:block;font-size:5px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:#141414;line-height:1.2}
  .vlabel b{display:block;font-size:7px;font-weight:700;letter-spacing:.01em;text-transform:uppercase;margin:2px 0 2px;color:#141414;line-height:1.15}
  .vlabel span:last-child{display:block;font-size:4.5px;letter-spacing:.14em;text-transform:uppercase;color:#807B6F;line-height:1.2}
  .vlabel .ruo{display:block;font-size:4px;line-height:1.3;letter-spacing:.06em;text-transform:uppercase;color:#141414;font-weight:600;margin:2px 0 2px}
  @media (max-width:520px){.vlabel{width:26%;padding:4px 3px 3px}}

  /* PDP hero gets a slightly larger label than shop cards — sized to fit ACROSS the vial face, not the whole image */
  .pdp .pdp-media .vlabel{width:clamp(104px,16%,142px);padding:9px 7px 7px;box-shadow:0 5px 12px rgba(0,0,0,.18)}
  .pdp .pdp-media .vlabel .bm{font-size:7.5px;letter-spacing:.15em}
  .pdp .pdp-media .vlabel b{font-size:11px;margin:4px 0 3px;letter-spacing:.015em;line-height:1.18}
  .pdp .pdp-media .vlabel span:last-child{font-size:6px;letter-spacing:.18em}
  .pdp .pdp-media .vlabel .ruo{font-size:5.5px;line-height:1.35;letter-spacing:.1em;margin:4px 0 3px}
  @media (max-width:980px){
    .pdp .pdp-media .vlabel{width:clamp(92px,22%,130px);padding:7px 6px 6px}
    .pdp .pdp-media .vlabel b{font-size:10px}
    .pdp .pdp-media .vlabel .ruo{font-size:5px}
  }

  .menu-btn{display:none;background:none;border:0;padding:6px;cursor:pointer;color:var(--ink)}
  /* Mobile menu — slides from LEFT, drawer-style with overlay + graph paper bg */
  .mobile-menu-overlay{position:fixed;inset:0;z-index:94;background:rgba(15,15,15,.32);opacity:0;visibility:hidden;transition:opacity .28s ease,visibility .28s ease}
  body.menu-open .mobile-menu-overlay{opacity:1;visibility:visible}
  .mobile-menu{position:fixed;top:0;left:0;bottom:0;width:min(86vw,420px);z-index:95;
    background:linear-gradient(rgba(20,20,20,0.022) 1px,transparent 1px),linear-gradient(90deg,rgba(20,20,20,0.022) 1px,transparent 1px),var(--paper);
    background-size:32px 32px;
    transform:translateX(-100%);transition:transform .32s cubic-bezier(.32,.72,.32,1);
    display:flex;flex-direction:column;padding:18px 22px 24px;overflow-y:auto;visibility:hidden;
    box-shadow:6px 0 28px rgba(0,0,0,.18)}
  body.menu-open .mobile-menu{transform:translateX(0);visibility:visible}
  body.menu-open{overflow:hidden}
  .mm-top{display:flex;justify-content:space-between;align-items:center;padding-bottom:14px;border-bottom:1px solid var(--rule-soft)}
  .mm-close{background:none;border:0;padding:6px;cursor:pointer;color:var(--ink);display:flex;align-items:center;justify-content:center;border-radius:0;transition:opacity .15s}
  .mm-close:hover{opacity:.6}
  .mm-search{display:flex;align-items:center;gap:8px;border-bottom:1px solid var(--ink);padding:11px 0;margin:18px 0 22px;color:var(--ink-mute)}
  .mm-search input{background:transparent;border:0;flex:1;font-family:inherit;font-size:14px;color:var(--ink);outline:none}
  .mm-search input::placeholder{color:var(--ink-mute);font-style:italic;font-size:13px}
  .mm-eyebrow{font-size:9px;letter-spacing:var(--tracker-wide);text-transform:uppercase;font-style:italic;color:var(--ink-mute);margin-bottom:8px;padding-bottom:8px;border-bottom:1px solid var(--rule-hair)}
  .mobile-menu nav ul{list-style:none;display:flex;flex-direction:column;margin:0;padding:0}
  .mobile-menu nav li{border-bottom:1px solid var(--rule-hair)}
  .mobile-menu nav li:last-child{border-bottom:0}
  .mobile-menu nav a{display:grid;grid-template-columns:48px 1fr auto;align-items:center;gap:14px;padding:17px 4px;text-decoration:none;transition:padding-left .18s,color .18s}
  .mobile-menu nav a:hover,.mobile-menu nav a:active{padding-left:8px;color:var(--ink)}
  .mobile-menu nav .mm-num{font-size:9px;letter-spacing:.14em;text-transform:uppercase;font-style:italic;color:var(--ink-mute);line-height:1}
  .mobile-menu nav .mm-lbl{font-size:15px;text-transform:uppercase;letter-spacing:.04em;font-weight:700;color:var(--ink);line-height:1.1}
  .mobile-menu nav .mm-arr{font-size:13px;color:var(--ink-mute);line-height:1;transition:transform .18s,color .18s}
  .mobile-menu nav a:hover .mm-arr,.mobile-menu nav a:active .mm-arr{transform:translateX(3px);color:var(--ink)}
  .mm-foot{margin-top:auto;padding-top:22px;border-top:1px solid var(--rule-hair);display:flex;flex-direction:column;gap:6px}
  .mm-foot-tag{font-size:10px;text-transform:uppercase;letter-spacing:var(--tracker-wide);color:var(--ink-soft);font-weight:700}
  .mm-foot-mail{font-size:11.5px;color:var(--ink);border-bottom:1px solid var(--ink);padding-bottom:1px;align-self:flex-start;text-decoration:none}
  .mm-foot-mail:hover{color:var(--ink-mute);border-color:var(--ink-mute)}
  .mm-foot-ruo{font-size:9px;text-transform:uppercase;letter-spacing:var(--tracker-wide);color:var(--ink-mute);font-style:italic;line-height:1.55;margin-top:6px}
  @media (max-width:860px){
    .lab-bar{display:none}
    .menu-btn{display:flex;align-items:center;justify-content:flex-start}
    .header-top{grid-template-columns:1fr auto 1fr;align-items:center;padding:15px 18px;gap:10px}
    .brand{align-items:center;text-align:center;grid-column:2}
    .brand .tag{display:none}
    .brand .mark{font-size:19px}
    .search{display:none}
    nav.primary{display:none}
    .header-icons{justify-content:flex-end;gap:18px}
    .header-icons a[title="Contact"]{display:none}
  }
  @media (max-width:520px){
    .header-top{padding:14px 14px}
    .annc{font-size:9px;padding:7px 10px;line-height:1.4}
    .brand .mark{font-size:17px}
  }

  /* hero caption: centered + H1 -25% */
  .hero-caption{align-items:center !important;text-align:center !important;padding-left:6vw;padding-right:6vw}
  .hero-caption h1{font-size:clamp(30px,5.25vw,60px) !important}
  .hero-caption .sub{margin-left:auto;margin-right:auto}

  /* logotype: uniform, solid, no faded brackets */
  .brand .mark,.gate-mark,.foot-brand-mark{letter-spacing:-0.012em}
  .brand .mark .br,.gate-mark .br,.foot-brand-mark .br{font-weight:700 !important;opacity:1 !important}
  .mobile-menu .mark span{font-weight:700 !important;opacity:1 !important}

/* ===== WooCommerce skin — on-brand apothecary ===== */
.woo-wrap,.page-wrap{max-width:1280px;margin:0 auto;padding:56px 32px 80px}
.page-title{font-weight:700;text-transform:uppercase;letter-spacing:.01em;font-size:clamp(28px,4vw,46px);margin-bottom:24px}
.woocommerce .products,.woocommerce ul.products{display:grid!important;grid-template-columns:repeat(4,1fr);gap:0;list-style:none;margin:0;padding:0}
.woocommerce ul.products li.product{padding:24px;border-right:1px solid var(--rule-soft);border-bottom:1px solid var(--rule-soft);text-align:left;margin:0!important;width:auto!important;float:none!important}
.woocommerce ul.products li.product img{background:var(--product-bg);margin-bottom:16px}
.woocommerce ul.products li.product .woocommerce-loop-product__title{font-weight:700;font-size:15px;text-transform:uppercase;letter-spacing:.015em;padding:0;color:var(--ink)}
.woocommerce ul.products li.product .price,.woocommerce div.product p.price,.woocommerce .price{color:var(--ink);font-weight:700;font-size:14px}
.woocommerce span.onsale{display:none}
.woocommerce #respond input#submit,.woocommerce a.button,.woocommerce button.button,.woocommerce input.button,.woocommerce .button,.woocommerce .button.alt{background:var(--ink);color:var(--paper);border:1px solid var(--ink);border-radius:0;text-transform:uppercase;letter-spacing:var(--tracker);font-size:11px;padding:14px 28px;font-weight:700;transition:all .18s}
.woocommerce a.button:hover,.woocommerce button.button:hover,.woocommerce .button:hover,.woocommerce .button.alt:hover{background:var(--paper);color:var(--ink)}
.woocommerce div.product .product_title{font-weight:700;text-transform:uppercase;letter-spacing:.01em;font-size:clamp(26px,3.5vw,42px)}
.woocommerce div.product p.price,.woocommerce div.product span.price{font-size:20px}
.woocommerce div.product .woocommerce-product-details__short-description{color:var(--ink-mute);font-size:11px;border-top:1px solid var(--rule-soft);padding-top:14px;margin-top:14px}
.woocommerce-tabs .panel{font-size:13px;line-height:1.85;color:var(--ink-soft)}
.woocommerce-tabs h2{font-weight:700;text-transform:uppercase;font-size:18px}
.woocommerce .woocommerce-result-count,.woocommerce .woocommerce-ordering,.woocommerce-breadcrumb{color:var(--ink-mute);font-size:10px;text-transform:uppercase;letter-spacing:var(--tracker)}
.woocommerce-breadcrumb{margin-bottom:28px}
.woocommerce-message,.woocommerce-info,.woocommerce-error{border-top:2px solid var(--ink);background:var(--paper-2);color:var(--ink);border-radius:0}
@media(max-width:980px){.woocommerce .products,.woocommerce ul.products{grid-template-columns:1fr 1fr!important}.woo-wrap,.page-wrap{padding:40px 20px 60px}}
@media(max-width:560px){.woocommerce .products,.woocommerce ul.products{grid-template-columns:1fr!important}}

/* ===== PDP + shop — apothecary WooCommerce ===== */
.product a.img-slot{display:block}
.pdp{display:grid;grid-template-columns:1.05fr .95fr;border-bottom:1px solid var(--rule)}
.pdp .pdp-media{position:relative;min-height:560px;background:var(--product-bg);border-right:1px solid var(--rule);overflow:hidden}
.pdp .pdp-media img{width:100%;height:100%;object-fit:cover}
.pdp .pdp-info{padding:64px 56px;display:flex;flex-direction:column;gap:18px;justify-content:center}
.pdp .proto-code{font-size:10px;letter-spacing:var(--tracker-wide);text-transform:uppercase;color:var(--ink-mute);font-style:italic}
.pdp .product_title{font-weight:700;text-transform:uppercase;letter-spacing:-.01em;font-size:clamp(28px,3.6vw,52px);line-height:1;margin:0}
.pdp .pdp-price{font-size:20px;font-weight:700}
.pdp .pdp-price del{opacity:.4;font-weight:400;margin-right:8px}
.pdp .pdp-short{font-size:11.5px;line-height:1.85;color:var(--ink-mute);border-top:1px solid var(--rule-soft);border-bottom:1px solid var(--rule-soft);padding:16px 0}
.pdp form.cart{display:flex;gap:12px;align-items:stretch;margin:4px 0;flex-wrap:wrap}

/* Quick-pick chip row above the quantity stepper */
.pdp .qty-quick{
  flex:1 1 100%;display:flex;align-items:center;gap:8px;
  margin:0 0 4px;padding:0;
}
.pdp .qty-quick-label{
  font-size:9px;letter-spacing:var(--tracker-wide);text-transform:uppercase;
  color:var(--ink-mute);font-style:italic;margin-right:4px;
}
.pdp .qty-chip{
  display:inline-flex;align-items:center;justify-content:center;
  min-width:46px;min-height:36px;padding:0 12px;
  background:var(--paper);color:var(--ink-soft);
  border:1px solid var(--rule-soft);
  font-family:inherit;font-size:12px;font-weight:700;
  cursor:pointer;transition:all .15s;
  -webkit-tap-highlight-color:transparent;
}
.pdp .qty-chip:hover{border-color:var(--ink);color:var(--ink)}
.pdp .qty-chip.is-active{background:var(--ink);color:var(--paper);border-color:var(--ink)}

.pdp form.cart .quantity{display:inline-flex;align-items:stretch;border:1px solid var(--rule);background:var(--paper)}
.pdp form.cart .quantity .qty-btn{
  display:inline-flex;align-items:center;justify-content:center;
  min-width:44px;padding:0 14px;
  background:var(--paper);color:var(--ink);
  border:0;font-family:inherit;font-size:20px;font-weight:700;line-height:1;
  cursor:pointer;transition:background .15s,color .15s;
  -webkit-tap-highlight-color:transparent;
}
.pdp form.cart .quantity .qty-btn:hover{background:var(--ink);color:var(--paper)}
.pdp form.cart .quantity .qty-btn:active{transform:scale(.96)}
.pdp form.cart .quantity input{
  width:64px;padding:13px 6px;
  border:0;border-left:1px solid var(--rule);border-right:1px solid var(--rule);
  background:var(--paper);
  font-family:inherit;font-size:15px;font-weight:700;text-align:center;
  -moz-appearance:textfield;appearance:textfield;
}
.pdp form.cart .quantity input::-webkit-outer-spin-button,
.pdp form.cart .quantity input::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}
.pdp-coa{font-size:11px;text-transform:uppercase;letter-spacing:var(--tracker);border-bottom:1px solid var(--ink);padding-bottom:3px;align-self:flex-start;font-weight:700}
.pdp-desc .pdp-body{max-width:840px;font-size:13px;line-height:1.95;color:var(--ink-soft);padding-top:8px}
.pdp-desc .pdp-body p{margin-bottom:14px}.pdp-desc .pdp-body strong{color:var(--ink)}
.pdp-desc .pdp-body small{color:var(--ink-mute)}
@media(max-width:980px){
  .pdp{grid-template-columns:1fr}
  .pdp .pdp-media{min-height:0;height:62vw;max-height:380px;border-right:0;border-bottom:1px solid var(--rule)}
  .pdp .pdp-info{padding:28px 22px;gap:14px}
  .pdp .product_title{font-size:clamp(24px,7vw,40px);line-height:1.05}
  .pdp .pdp-short{font-size:11px;line-height:1.7;padding:12px 0}
  .pdp form.cart{gap:10px;flex-wrap:wrap}
  .pdp form.cart .quantity{flex:0 0 auto}
  .pdp form.cart .quantity .qty-btn{min-width:48px;font-size:22px}
  .pdp form.cart .quantity input{min-height:48px;width:56px;font-size:16px}
  .pdp .single_add_to_cart_button{min-height:52px;padding:0 24px;flex:1 1 100%;width:100%;font-size:12px}
  .pdp .qty-quick{margin-bottom:6px}
  .pdp .qty-chip{min-height:38px;font-size:12px}
  .pdp-desc .pdp-body{font-size:12px;line-height:1.75}
  .pdp-desc .pdp-body p{margin-bottom:12px}
  .pdp-desc .pdp-body ol{font-size:10.5px;line-height:1.6}
}

/* ===== PDP STICKY ATC BAR (all viewports) ===== */
.pdp-sticky{
  display:grid;
  position:fixed;bottom:0;left:0;right:0;z-index:90;
  padding:14px 32px;
  background:var(--ink);color:var(--paper);
  border-top:1px solid #000;
  box-shadow:0 -4px 18px rgba(0,0,0,.22);
  grid-template-columns:1fr auto;align-items:center;gap:18px;
  transform:translateY(100%);transition:transform .25s ease;
}
.pdp-sticky.is-visible{transform:translateY(0)}
.pdp-sticky-info{min-width:0;display:flex;flex-direction:column;gap:3px;max-width:1380px;margin:0 auto;width:100%}
.pdp-sticky > *{max-width:none}
.pdp-sticky-name{font-size:13px;font-weight:700;text-transform:uppercase;letter-spacing:.04em;line-height:1.2;color:var(--paper);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.pdp-sticky-price{font-size:15px;font-weight:700;color:var(--chrome);line-height:1.2}
.pdp-sticky-price del{opacity:.5;margin-right:6px;font-weight:400}
.pdp-sticky-btn{
  background:var(--paper);color:var(--ink);
  border:0;padding:15px 32px;
  font-size:11.5px;font-weight:700;letter-spacing:var(--tracker-wide);text-transform:uppercase;
  font-family:inherit;cursor:pointer;
  transition:background .2s,color .2s,transform .15s;
  white-space:nowrap;
}
.pdp-sticky-btn:hover{background:var(--chrome);color:var(--ink)}
.pdp-sticky-btn:active{transform:translateY(1px)}
body.single-product{padding-bottom:84px}
@media(max-width:980px){
  .pdp-sticky{padding:10px 14px;gap:12px}
  .pdp-sticky-name{font-size:11px}
  .pdp-sticky-price{font-size:13px}
  .pdp-sticky-btn{padding:13px 22px;font-size:10.5px}
  body.single-product{padding-bottom:72px}
}
/* Phone + small tablet: smaller PDP hero image with breathing room — pure-white bg blends with vial photo */
@media(max-width:980px){
  .pdp .pdp-media{
    background:#fff !important;
    box-sizing:border-box;
  }
  .pdp .pdp-media img{
    object-fit:contain;
  }
}
@media(max-width:600px){
  .pdp .pdp-media{
    height:54vw;max-height:260px;
    padding:8px 36px;
    border-bottom:1px solid var(--rule-soft);
  }
  .pdp .pdp-media .vlabel{width:clamp(72px,14%,108px);padding:6px 5px 5px}
  .pdp .pdp-media .vlabel b{font-size:9px}
  .pdp .pdp-media .vlabel .ruo{font-size:4.5px}
}

/* ===== MOBILE OVERFLOW FIX — media boxes were sized by aspect-ratio*min-height,
   computing WIDER than the viewport and shoving the hero caption off-screen. ===== */
.hero-media,.stack-hero,.editorial{max-width:100%}
@media (max-width:980px){
  .hero-media,.stack-hero,.editorial{aspect-ratio:auto !important;width:100% !important;min-height:0 !important}
  .hero-media{height:64vh !important}
  .stack-hero{height:60vw !important;min-height:300px !important}
  .editorial{height:58vw !important;min-height:320px !important}
}
@media (max-width:560px){
  .hero-media{height:76vh !important}
  .hero-caption{padding-left:20px !important;padding-right:20px !important}
  .hero-caption .sub{max-width:100% !important}
  .annc{font-size:9px;line-height:1.45;white-space:normal}
}

/* ===== PDP fixes: ink cart button (kill WP/WC purple) + mobile containment ===== */
.woocommerce button.single_add_to_cart_button,
.woocommerce a.button,.woocommerce button.button,.woocommerce input.button,
.woocommerce .button,.woocommerce .button.alt,.woocommerce #respond input#submit,
.woocommerce a.added_to_cart,.woocommerce .wp-element-button,
.wc-block-components-button,.wp-block-button__link{
  background:var(--ink) !important;color:var(--paper) !important;
  border:1px solid var(--ink) !important;border-radius:0 !important;box-shadow:none !important;
  text-transform:uppercase;letter-spacing:var(--tracker);font-weight:700}
.woocommerce button.single_add_to_cart_button:hover,
.woocommerce a.button:hover,.woocommerce button.button:hover,.woocommerce .button:hover,
.woocommerce .button.alt:hover,.woocommerce .wp-element-button:hover,
.wc-block-components-button:hover{background:var(--paper) !important;color:var(--ink) !important}
.annc,.pdp-info,.pdp-desc,.pdp-body,.foot-ruo,.woo-wrap,.page-wrap,.grid-section{max-width:100%;overflow-wrap:break-word}
@media (max-width:560px){
  .annc{white-space:normal !important;overflow-wrap:break-word;padding:8px 14px !important;font-size:9px;line-height:1.45}
  .pdp .pdp-info{padding:34px 18px !important}
  .pdp-desc.grid-section{padding-left:18px !important;padding-right:18px !important}
  .foot-ruo{padding-left:18px !important;padding-right:18px !important}
}

/* ===== /shop/?area= filter pills ===== */
.area-filter{display:flex;flex-wrap:wrap;gap:6px;padding:18px 32px 10px;border-bottom:1px solid var(--rule-soft);margin-bottom:8px}
.area-pill{display:inline-block;padding:7px 14px;font-size:9.5px;letter-spacing:var(--tracker);text-transform:uppercase;border:1px solid var(--rule-soft);color:var(--ink-soft);background:transparent;text-decoration:none;transition:all .15s;font-weight:700}
.area-pill:hover{border-color:var(--ink);color:var(--ink);text-decoration:none}
.area-pill.is-active{background:var(--ink);color:var(--paper);border-color:var(--ink)}
@media(max-width:700px){.area-filter{padding:14px 18px 8px;gap:4px;flex-wrap:wrap}.area-pill{padding:5px 9px;font-size:8.5px;letter-spacing:.08em;border-color:var(--rule-hair)}}
@media(max-width:560px){.area-filter{padding:12px 16px 6px;gap:4px}.area-pill{padding:4px 8px;font-size:8px;letter-spacing:.06em}}

/* ===== 404 page ===== */
.notfound{min-height:60vh;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:48px 32px}
.notfound .eyebrow{font-size:9px;letter-spacing:var(--tracker-wide);text-transform:uppercase;color:var(--ink-mute);margin-bottom:18px;font-style:italic}
.notfound h1{font-size:clamp(48px,7vw,96px);font-weight:700;text-transform:uppercase;letter-spacing:-0.015em;line-height:1;margin-bottom:18px}
.notfound p{font-size:13px;line-height:1.7;color:var(--ink-soft);max-width:32em;margin-bottom:28px}
.notfound .actions{display:flex;gap:18px;flex-wrap:wrap;justify-content:center}
.notfound .actions a{font-size:11px;text-transform:uppercase;letter-spacing:var(--tracker);border-bottom:1px solid var(--ink);padding-bottom:3px;font-weight:700;text-decoration:none}

/* ===== Knowledge Hub area nav ===== */
.kh-nav{display:flex;flex-wrap:wrap;gap:6px;padding:14px 0 0;margin-bottom:8px;border-top:1px solid var(--rule-soft);padding-top:18px;margin-top:18px}
.kh-nav-pill{display:inline-block;padding:6px 12px;font-size:9.5px;letter-spacing:var(--tracker);text-transform:uppercase;border:1px solid var(--rule-soft);color:var(--ink-soft);background:transparent;text-decoration:none;font-weight:700}
.kh-nav-pill:hover{border-color:var(--ink);color:var(--ink);text-decoration:none}

/* ===== Cookie consent banner ===== */
#xx-cookie{position:fixed;left:0;right:0;bottom:0;z-index:90;background:var(--ink);color:var(--paper);padding:14px 18px;display:none;font-size:11.5px;line-height:1.55;letter-spacing:0.01em}
#xx-cookie.show{display:flex;gap:18px;align-items:center;justify-content:center;flex-wrap:wrap}
#xx-cookie a{color:var(--paper);text-decoration:underline;text-underline-offset:2px}
#xx-cookie button{font-family:inherit;font-size:10px;text-transform:uppercase;letter-spacing:var(--tracker);background:var(--paper);color:var(--ink);border:0;padding:10px 22px;cursor:pointer;font-weight:700}
#xx-cookie button:hover{background:var(--paper-2)}
@media(max-width:560px){#xx-cookie{font-size:10px;padding:12px 14px}#xx-cookie button{padding:9px 18px;font-size:9px}}

/* ===== Cart drawer (mini-cart) ===== */
/* ===== CART DRAWER — SBA-style apothecary ===== */
.xx-cart-drawer{position:fixed;inset:0;z-index:200;visibility:hidden;pointer-events:none}
.xx-cart-drawer.is-open{visibility:visible;pointer-events:auto}
.xx-cart-overlay{position:absolute;inset:0;background:rgba(20,20,20,.32);backdrop-filter:blur(2px);-webkit-backdrop-filter:blur(2px);opacity:0;transition:opacity .25s ease}
.xx-cart-drawer.is-open .xx-cart-overlay{opacity:1}
.xx-cart-panel{position:absolute;top:0;right:0;bottom:0;width:420px;max-width:92vw;background:var(--paper);border-left:1px solid var(--rule-soft);box-shadow:-8px 0 40px rgba(0,0,0,.08);padding:0;transform:translateX(100%);transition:transform .32s cubic-bezier(.32,.72,.32,1);display:flex;flex-direction:column;font-family:inherit;overflow:hidden}
.xx-cart-drawer.is-open .xx-cart-panel{transform:translateX(0)}

/* Header */
.xx-cart-head{display:flex;align-items:center;justify-content:space-between;padding:20px 22px 16px;border-bottom:1px solid var(--rule-hair);margin:0;background:var(--paper)}
.xx-cart-title{font-size:13px;font-weight:700;text-transform:uppercase;letter-spacing:.04em;color:var(--ink);margin:0}
.xx-cart-close{width:32px;height:32px;display:flex;align-items:center;justify-content:center;background:transparent;border:0;cursor:pointer;color:var(--ink);font-size:18px;line-height:1;padding:0;border-radius:0;transition:opacity .15s}
.xx-cart-close:hover{opacity:.5}

/* Body */
.xx-cart-drawer-body{flex:1;overflow-y:auto;padding:0;font-size:12px;line-height:1.55;color:var(--ink-soft);background:var(--paper)}
.xx-cart-drawer-body::-webkit-scrollbar{width:0}
.xx-cart-drawer-body{scrollbar-width:none}

/* List reset across WC markup variants */
.xx-cart-drawer-body ul,.xx-cart-drawer-body ul.cart_list,.xx-cart-drawer-body ul.woocommerce-mini-cart{list-style:none !important;padding:0 !important;margin:0 !important}

/* Item rows — 88x110 image + details grid */
.xx-cart-drawer-body li.mini_cart_item,.xx-cart-drawer-body ul.woocommerce-mini-cart > li,.xx-cart-drawer-body ul.cart_list > li{display:grid !important;grid-template-columns:88px 1fr;gap:14px;padding:18px 22px !important;border-bottom:1px solid var(--rule-hair);list-style:none;background:transparent;position:relative}
.xx-cart-drawer-body li.mini_cart_item:last-child,.xx-cart-drawer-body ul.woocommerce-mini-cart > li:last-child{border-bottom:0}

/* Image */
.xx-cart-drawer-body img,.xx-cart-drawer-body li img,.xx-cart-drawer-body ul.woocommerce-mini-cart img,.xx-cart-drawer-body .mini_cart_item img{width:88px !important;height:110px !important;max-width:88px !important;float:none !important;margin:0 !important;background:#fff;object-fit:contain;border:1px solid var(--rule-hair);flex-shrink:0;display:block !important}

/* Name link (not remove) */
.xx-cart-drawer-body li a:not(.remove){color:var(--ink);text-decoration:none;font-weight:600;font-size:12px;letter-spacing:.01em;text-transform:none;line-height:1.25;display:block;margin:0 0 6px;padding-right:24px}
.xx-cart-drawer-body li a:not(.remove):hover{color:var(--chrome-dark)}

/* Quantity / variant text from WC */
.xx-cart-drawer-body .quantity,.xx-cart-drawer-body li .quantity{font-size:10px;color:var(--ink-mute);letter-spacing:.05em;text-transform:uppercase;font-style:normal;display:block;margin-top:4px;font-weight:400}

/* Remove × — top-right of item */
.xx-cart-drawer-body a.remove,.xx-cart-drawer-body li a.remove{position:absolute !important;width:auto !important;height:auto !important;font-size:18px !important;line-height:1 !important;color:var(--ink-mute) !important;background:transparent !important;border:0;margin:0 !important;padding:0 !important;text-decoration:none !important;font-weight:400 !important;top:18px;right:22px}
.xx-cart-drawer-body a.remove:hover,.xx-cart-drawer-body li a.remove:hover{color:var(--ink) !important;background:transparent !important}

/* Empty */
.xx-cart-drawer-body .woocommerce-mini-cart__empty-message,.xx-cart-drawer-body p.empty{padding:64px 22px;text-align:center;font-size:12px;color:var(--ink-mute);text-transform:uppercase;letter-spacing:var(--tracker);font-style:italic;margin:0;line-height:1.7}

/* Subtotal */
.xx-cart-drawer-body .woocommerce-mini-cart__total,.xx-cart-drawer-body p.total{display:flex;align-items:baseline;justify-content:space-between;padding:18px 22px 6px;margin:0;border-top:1px solid var(--rule-hair);font-size:12px;text-transform:uppercase;letter-spacing:.04em;font-weight:600;color:var(--ink);background:var(--paper)}
.xx-cart-drawer-body p.total strong{font-weight:600}
.xx-cart-drawer-body .woocommerce-mini-cart__total .woocommerce-Price-amount,.xx-cart-drawer-body p.total .woocommerce-Price-amount{font-size:14px;font-weight:700;color:var(--ink);letter-spacing:.01em}

/* Buttons */
.xx-cart-drawer-body .woocommerce-mini-cart__buttons,.xx-cart-drawer-body p.buttons{display:flex !important;flex-direction:column;gap:10px;padding:12px 22px 22px !important;margin:0 !important;border-top:1px solid var(--rule-hair);background:var(--paper)}
.xx-cart-drawer-body .woocommerce-mini-cart__buttons a,.xx-cart-drawer-body p.buttons a{display:flex !important;align-items:center;justify-content:center;width:100% !important;height:48px;padding:0 !important;font-size:11px !important;font-weight:600;text-transform:uppercase;letter-spacing:.1em;text-decoration:none !important;border-radius:0;border:1px solid var(--ink) !important;background:var(--ink) !important;color:var(--paper) !important;transition:background .2s,color .2s}
.xx-cart-drawer-body .woocommerce-mini-cart__buttons a:hover,.xx-cart-drawer-body p.buttons a:hover{background:transparent !important;color:var(--ink) !important}
/* Ghost View Cart, primary Checkout */
.xx-cart-drawer-body p.buttons a.wc-forward:not(.checkout),.xx-cart-drawer-body .woocommerce-mini-cart__buttons a:first-child{background:transparent !important;color:var(--ink) !important;font-weight:500;letter-spacing:.06em}
.xx-cart-drawer-body p.buttons a.wc-forward:not(.checkout):hover,.xx-cart-drawer-body .woocommerce-mini-cart__buttons a:first-child:hover{background:var(--ink) !important;color:var(--paper) !important}
.xx-cart-drawer-body p.buttons a.checkout,.xx-cart-drawer-body .woocommerce-mini-cart__buttons a.checkout{background:var(--ink) !important;color:var(--paper) !important;font-weight:600}

@media(max-width:520px){
  .xx-cart-panel{width:100%;max-width:100%}
  .xx-cart-drawer-body li.mini_cart_item,.xx-cart-drawer-body ul.woocommerce-mini-cart > li{grid-template-columns:76px 1fr;gap:12px;padding:16px 18px !important}
  .xx-cart-drawer-body img,.xx-cart-drawer-body li img{width:76px !important;height:96px !important;max-width:76px !important}
  .xx-cart-head{padding:18px 18px 14px}
  .xx-cart-drawer-body p.total,.xx-cart-drawer-body .woocommerce-mini-cart__total{padding:16px 18px 6px}
  .xx-cart-drawer-body p.buttons,.xx-cart-drawer-body .woocommerce-mini-cart__buttons{padding:10px 18px 18px !important}
  .xx-cart-drawer-body a.remove,.xx-cart-drawer-body li a.remove{top:16px;right:18px}
}

/* ===== PDP volume / quantity pricing ===== */
.xx-tier-pricing{display:flex;flex-direction:column;gap:6px;padding:12px 14px;margin:4px 0 2px;border:1px solid var(--rule-soft);background:var(--paper);font-size:11px;line-height:1.5}
.xx-tier-label{font-size:9px;letter-spacing:var(--tracker-wide);text-transform:uppercase;color:var(--ink-mute);font-weight:700;font-style:italic}
.xx-tier-rows{display:flex;flex-wrap:wrap;gap:6px 14px;color:var(--ink);font-size:11px;letter-spacing:0.02em}
.xx-tier-rows span{font-weight:700}

/* ===== WOOCOMMERCE CHECKOUT — apothecary skin ===== */
.woocommerce-checkout .woo-wrap,.woocommerce-checkout .page-wrap{max-width:1180px;margin:0 auto;padding:48px 32px 96px}
.woocommerce-checkout .woocommerce>h1,.woocommerce-checkout .entry-title{font-weight:700;font-size:clamp(28px,4vw,44px);text-transform:uppercase;letter-spacing:-.005em;margin:0 0 28px;color:var(--ink)}

/* Top info notices (coupon prompt, login prompt, shipping notice) */
.woocommerce-checkout .woocommerce-info,
.woocommerce-checkout .woocommerce-form-coupon-toggle .woocommerce-info{
  display:flex;align-items:center;gap:14px;
  background:var(--paper);border:1px solid var(--rule-soft);border-left:3px solid var(--ink);
  padding:14px 18px;margin:0 0 18px;
  font-size:12px;line-height:1.5;color:var(--ink-soft);
  border-radius:0;box-shadow:none
}
.woocommerce-checkout .woocommerce-info::before{display:none}
.woocommerce-checkout .woocommerce-info a{color:var(--ink);border-bottom:1px solid var(--ink);padding-bottom:1px;font-weight:700;text-transform:uppercase;font-size:11px;letter-spacing:var(--tracker)}
.woocommerce-checkout .woocommerce-message{
  background:#FBFAF4;border:1px solid var(--ink);
  padding:14px 18px;margin:0 0 18px;
  font-size:12px;border-radius:0;box-shadow:none
}

/* Coupon form */
.woocommerce-checkout form.checkout_coupon{
  background:var(--paper);border:1px solid var(--rule-soft);padding:18px;margin:0 0 22px;border-radius:0
}
.woocommerce-checkout form.checkout_coupon input[type="text"]{
  width:auto;flex:1;min-width:200px;
  padding:12px 14px;border:1px solid var(--rule);background:#fff;
  font-family:inherit;font-size:13px;
  border-radius:0
}
.woocommerce-checkout form.checkout_coupon .button{
  padding:12px 22px !important;font-size:11px !important;
  background:var(--ink) !important;color:var(--paper) !important;
  border:1px solid var(--ink) !important;border-radius:0 !important;
  text-transform:uppercase;letter-spacing:var(--tracker);font-weight:700
}

/* Checkout layout grid: form on left, order summary on right */
.woocommerce-checkout form.checkout{display:grid;grid-template-columns:1.4fr 1fr;gap:48px;align-items:start}

/* Section headers — Billing details / Shipping details / Additional information */
.woocommerce-checkout h3{
  font-weight:700;font-size:11px;
  text-transform:uppercase;letter-spacing:var(--tracker-wide);
  color:var(--ink-mute);font-style:italic;
  padding-bottom:14px;margin:0 0 22px;
  border-bottom:1px solid var(--rule-soft)
}
.woocommerce-checkout h3#order_review_heading{
  font-weight:700;font-size:11px;
  text-transform:uppercase;letter-spacing:var(--tracker-wide);
  color:var(--ink-mute);font-style:italic;
  padding-bottom:14px;margin:0 0 16px;
  border-bottom:1px solid var(--rule-soft)
}

/* Field rows */
.woocommerce-checkout .form-row{
  display:flex;flex-direction:column;gap:6px;margin:0 0 14px;padding:0
}
.woocommerce-checkout .form-row.form-row-first,
.woocommerce-checkout .form-row.form-row-last{
  width:calc(50% - 7px);display:inline-flex;vertical-align:top
}
.woocommerce-checkout .form-row.form-row-first{margin-right:14px}
.woocommerce-checkout .form-row.form-row-wide{width:100%}
.woocommerce-checkout .form-row label{
  font-size:11px;text-transform:uppercase;letter-spacing:.04em;
  font-weight:600;color:var(--ink-soft);line-height:1.2;
  margin:0 0 2px
}
.woocommerce-checkout .form-row label .required,
.woocommerce-checkout .form-row label .optional{
  color:var(--ink-mute);font-weight:400;font-style:italic;
  text-transform:none;letter-spacing:0;font-size:10px;margin-left:6px
}
.woocommerce-checkout .form-row label .required{color:var(--ink-mute);text-decoration:none}

/* Inputs */
.woocommerce-checkout input[type="text"],
.woocommerce-checkout input[type="email"],
.woocommerce-checkout input[type="tel"],
.woocommerce-checkout input[type="password"],
.woocommerce-checkout input[type="number"],
.woocommerce-checkout textarea,
.woocommerce-checkout select{
  width:100%;
  padding:13px 14px;
  border:1px solid var(--rule);background:#fff;color:var(--ink);
  font-family:inherit;font-size:14px;line-height:1.4;
  border-radius:0;box-shadow:none;
  transition:border-color .15s,box-shadow .15s
}
.woocommerce-checkout input:focus,
.woocommerce-checkout textarea:focus,
.woocommerce-checkout select:focus{
  outline:0;border-color:var(--ink);box-shadow:0 0 0 2px rgba(20,20,20,.08)
}
.woocommerce-checkout textarea{min-height:90px;resize:vertical}

/* Select2 dropdowns (country / state) */
.woocommerce-checkout .select2-container--default .select2-selection--single{
  height:auto;padding:9px 14px;
  border:1px solid var(--rule) !important;background:#fff;border-radius:0
}
.woocommerce-checkout .select2-container--default .select2-selection--single .select2-selection__rendered{
  color:var(--ink);font-size:14px;line-height:1.4;padding:0
}
.woocommerce-checkout .select2-container--default .select2-selection--single .select2-selection__arrow{height:100%;right:10px}
.woocommerce-checkout .select2-dropdown{border-color:var(--ink);border-radius:0}
.woocommerce-checkout .select2-search--dropdown .select2-search__field{border-color:var(--rule);border-radius:0;padding:8px 10px}
.woocommerce-checkout .select2-results__option--highlighted[aria-selected]{background:var(--ink) !important;color:var(--paper) !important}

/* Checkbox / radio rows */
.woocommerce-checkout .input-checkbox,
.woocommerce-checkout .input-radio{
  width:16px;height:16px;margin-right:8px;
  accent-color:var(--ink);vertical-align:middle
}
.woocommerce-checkout .woocommerce-form__label-for-checkbox{font-size:12px;color:var(--ink-soft);font-weight:400;text-transform:none;letter-spacing:0}

/* Order review table on the right */
.woocommerce-checkout #order_review{
  position:sticky;top:24px;
  background:var(--paper);
  border:1px solid var(--rule-soft);
  padding:24px;
}
.woocommerce-checkout table.shop_table{
  width:100%;border:0;background:transparent;border-collapse:collapse
}
.woocommerce-checkout table.shop_table thead{display:none}
.woocommerce-checkout table.shop_table th,
.woocommerce-checkout table.shop_table td{
  padding:12px 0;border:0;border-bottom:1px solid var(--rule-hair);
  font-size:12px;line-height:1.4;color:var(--ink)
}
.woocommerce-checkout table.shop_table .cart_item td{vertical-align:top}
.woocommerce-checkout table.shop_table .product-name{font-weight:700;text-transform:uppercase;letter-spacing:.02em;font-size:11.5px}
.woocommerce-checkout table.shop_table .product-name .product-quantity{color:var(--ink-mute);font-weight:400;font-style:italic;margin-left:6px}
.woocommerce-checkout table.shop_table .product-total{font-weight:700;font-size:13px;text-align:right;white-space:nowrap}
.woocommerce-checkout table.shop_table tfoot th{
  font-size:10px;text-transform:uppercase;letter-spacing:var(--tracker-wide);
  color:var(--ink-mute);font-style:italic;font-weight:400
}
.woocommerce-checkout table.shop_table tfoot .order-total th,
.woocommerce-checkout table.shop_table tfoot .order-total td{
  border-bottom:0;border-top:1px solid var(--ink);
  padding-top:14px;font-size:14px;color:var(--ink);font-style:normal;font-weight:700;text-transform:uppercase
}
.woocommerce-checkout table.shop_table tfoot .order-total .amount{font-size:18px}

/* Payment methods */
.woocommerce-checkout #payment{background:transparent;border-radius:0}
.woocommerce-checkout #payment ul.payment_methods{
  border:0;border-top:1px solid var(--rule-hair);margin:18px 0 0;padding:14px 0 0;
  background:transparent
}
.woocommerce-checkout #payment ul.payment_methods li{
  padding:12px 0;border-bottom:1px solid var(--rule-hair);background:transparent
}
.woocommerce-checkout #payment ul.payment_methods li:last-child{border-bottom:0}
.woocommerce-checkout #payment ul.payment_methods label{
  font-weight:700;font-size:12px;text-transform:uppercase;letter-spacing:.04em;color:var(--ink)
}
.woocommerce-checkout #payment div.payment_box{
  background:#fff;border:1px solid var(--rule-hair);
  padding:14px;margin-top:8px;font-size:12px;line-height:1.55;color:var(--ink-soft);
  border-radius:0
}
.woocommerce-checkout #payment div.payment_box::before{display:none}

/* Place order button */
.woocommerce-checkout #place_order{
  width:100%;padding:18px 24px;
  background:var(--ink) !important;color:var(--paper) !important;
  border:1px solid var(--ink) !important;border-radius:0 !important;
  font-size:12px !important;font-weight:700;text-transform:uppercase;letter-spacing:var(--tracker-wide);
  cursor:pointer;transition:background .2s,color .2s
}
.woocommerce-checkout #place_order:hover{background:#000 !important}

/* Terms & conditions row */
.woocommerce-checkout .woocommerce-terms-and-conditions-wrapper{
  margin:18px 0;font-size:11.5px;color:var(--ink-soft);line-height:1.5
}
.woocommerce-checkout .woocommerce-terms-and-conditions{
  background:#fff;border:1px solid var(--rule-hair);padding:14px;
  max-height:160px;overflow-y:auto;font-size:11px;line-height:1.6
}

/* Validation errors */
.woocommerce-checkout .woocommerce-error{
  background:#FBF3F3;border:1px solid #B22234;border-left:3px solid #B22234;
  padding:14px 18px;margin:0 0 18px;font-size:12px;color:#141414;
  border-radius:0;list-style:none
}
.woocommerce-checkout .woocommerce-error li{padding:2px 0}

/* Mobile checkout */
@media (max-width:900px){
  .woocommerce-checkout form.checkout{grid-template-columns:1fr;gap:32px}
  .woocommerce-checkout .form-row.form-row-first,
  .woocommerce-checkout .form-row.form-row-last{width:100%;margin-right:0}
  .woocommerce-checkout #order_review{position:relative;top:0;padding:20px}
  .woocommerce-checkout .woo-wrap,.woocommerce-checkout .page-wrap{padding:32px 18px 80px}
  .woocommerce-checkout input,.woocommerce-checkout select,.woocommerce-checkout textarea{font-size:16px;min-height:48px}
  .woocommerce-checkout .select2-container--default .select2-selection--single{min-height:48px;padding:11px 14px}
  .woocommerce-checkout #place_order{min-height:52px;font-size:12px !important}
}