:root {
    --violetfield: #1A1422;
    --deepnight: #0A0612;
    --card: #221A2C;
    --signal: #B026FF;
    --softviolet: #9D4EDD;
    --paper: #F8F6FA;
    --graphite: #1A1422;
    --ash: #6B6478;
    --hairline-light: #E5E1EC;
    --hairline-dark: #2A1F38;
    --ease-spring: cubic-bezier(0.34, 1.56, 0.64, 1);
    --ease-smooth: cubic-bezier(0.22, 1, 0.36, 1);
  }

  html, body {
    background: var(--paper);
    color: var(--graphite);
    font-family: 'Instrument Sans', ui-sans-serif, system-ui, sans-serif;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    text-rendering: optimizeLegibility;
    font-feature-settings: "ss01", "kern", "liga";
  }

  ::selection { background: var(--signal); color: #fff; }

  .display {
    font-family: 'Instrument Serif', serif;
    font-weight: 400;
    letter-spacing: -0.022em;
    line-height: 0.95;
  }
  .display-italic { font-style: italic; }

  .wordmark {
    font-family: 'Instrument Sans', sans-serif;
    font-weight: 700;
    letter-spacing: 0.20em;
    text-transform: uppercase;
  }

  .mono-label {
    font-family: 'Geist Mono', monospace;
    font-weight: 500;
    font-size: 11px;
    letter-spacing: 0.18em;
    text-transform: uppercase;
  }
  .mono-label-sm {
    font-family: 'Geist Mono', monospace;
    font-weight: 500;
    font-size: 10px;
    letter-spacing: 0.16em;
    text-transform: uppercase;
  }

  .tabular { font-variant-numeric: tabular-nums; }

  .body-text {
    font-size: 17px;
    line-height: 1.6;
    color: var(--graphite);
  }
  .body-text-dark {
    font-size: 17px;
    line-height: 1.6;
    color: rgba(255,255,255,0.78);
  }

  .grain::before {
    content: '';
    position: absolute;
    inset: 0;
    pointer-events: none;
    opacity: 0.06;
    mix-blend-mode: overlay;
    background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='200' height='200'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2' stitchTiles='stitch'/></filter><rect width='200' height='200' filter='url(%23n)' opacity='1'/></svg>");
    background-size: 200px 200px;
  }

  .hero-atmosphere {
    background:
      radial-gradient(ellipse 60% 50% at 80% 20%, rgba(176, 38, 255, 0.22), transparent 60%),
      radial-gradient(ellipse 80% 60% at 10% 90%, rgba(157, 78, 221, 0.12), transparent 50%),
      linear-gradient(180deg, #1A1422 0%, #15101D 100%);
  }

  .lab-atmosphere {
    background:
      radial-gradient(ellipse 50% 70% at 50% 0%, rgba(176, 38, 255, 0.15), transparent 60%),
      linear-gradient(180deg, #15101D 0%, #1A1422 100%);
  }

  .btn-primary {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    padding: 14px 26px;
    background: var(--signal);
    color: #fff;
    font-weight: 600;
    font-size: 15px;
    letter-spacing: -0.005em;
    border-radius: 999px;
    transition: transform 220ms var(--ease-spring), background 200ms ease, box-shadow 200ms ease;
    box-shadow:
      0 1px 0 rgba(255,255,255,0.18) inset,
      0 12px 32px -12px rgba(176, 38, 255, 0.55),
      0 4px 14px -4px rgba(176, 38, 255, 0.35);
  }
  .btn-primary:hover { background: var(--softviolet); transform: translateY(-1px); }
  .btn-primary:active { transform: translateY(0); }
  .btn-primary:focus-visible { outline: 2px solid var(--signal); outline-offset: 3px; }

  .btn-ghost-light {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    padding: 13px 24px;
    background: transparent;
    color: #fff;
    font-weight: 500;
    font-size: 15px;
    border: 1px solid rgba(255,255,255,0.22);
    border-radius: 999px;
    transition: transform 220ms var(--ease-spring), background 200ms ease, border-color 200ms ease;
  }
  .btn-ghost-light:hover { background: rgba(255,255,255,0.05); border-color: rgba(255,255,255,0.4); transform: translateY(-1px); }
  .btn-ghost-light:focus-visible { outline: 2px solid #fff; outline-offset: 3px; }

  .btn-ghost-dark {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    padding: 13px 24px;
    background: transparent;
    color: var(--graphite);
    font-weight: 500;
    font-size: 15px;
    border: 1px solid var(--hairline-light);
    border-radius: 999px;
    transition: transform 220ms var(--ease-spring), background 200ms ease, border-color 200ms ease;
  }
  .btn-ghost-dark:hover { background: #fff; border-color: var(--graphite); transform: translateY(-1px); }
  .btn-ghost-dark:focus-visible { outline: 2px solid var(--signal); outline-offset: 3px; }

  .inline-link {
    color: inherit;
    border-bottom: 1px solid currentColor;
    padding-bottom: 1px;
    transition: opacity 200ms ease;
  }
  .inline-link:hover { opacity: 0.7; }

  .surface-card {
    background: #fff;
    border: 1px solid var(--hairline-light);
    border-radius: 16px;
    box-shadow:
      0 1px 0 rgba(255,255,255,0.6) inset,
      0 4px 16px -8px rgba(26, 20, 34, 0.08),
      0 16px 48px -24px rgba(176, 38, 255, 0.08);
    transition: transform 320ms var(--ease-smooth), box-shadow 320ms var(--ease-smooth), border-color 200ms ease;
  }
  .surface-card:hover {
    transform: translateY(-3px);
    box-shadow:
      0 1px 0 rgba(255,255,255,0.6) inset,
      0 8px 24px -8px rgba(26, 20, 34, 0.10),
      0 24px 56px -20px rgba(176, 38, 255, 0.18);
    border-color: var(--hairline-dark);
  }

  .surface-card-dark {
    background: var(--card);
    border: 1px solid var(--hairline-dark);
    border-radius: 16px;
    transition: transform 320ms var(--ease-smooth), box-shadow 320ms var(--ease-smooth), border-color 200ms ease;
  }
  .surface-card-dark:hover {
    transform: translateY(-3px);
    border-color: rgba(176, 38, 255, 0.4);
    box-shadow:
      0 24px 56px -20px rgba(176, 38, 255, 0.25),
      0 4px 16px -8px rgba(0,0,0,0.4);
  }

  .dose-pill {
    display: inline-flex;
    align-items: center;
    background: var(--signal);
    color: #fff;
    font-family: 'Instrument Sans', sans-serif;
    font-weight: 700;
    letter-spacing: 0.10em;
    padding: 4px 10px;
    border-radius: 6px;
    font-size: 11px;
    text-transform: uppercase;
  }

  .hl-light { border-color: var(--hairline-light); }
  .hl-dark { border-color: var(--hairline-dark); }

  .hex-mark {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 36px;
    height: 36px;
  }

  .trust-icon {
    width: 44px;
    height: 44px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: var(--paper);
    border: 1px solid var(--hairline-light);
    border-radius: 50%;
  }

  .reveal {
    opacity: 0;
    transform: translateY(18px);
    transition: opacity 800ms var(--ease-smooth), transform 800ms var(--ease-smooth);
  }
  .reveal.in { opacity: 1; transform: none; }

  #age-gate[hidden] { display: none !important; }
  #age-gate {
    position: fixed;
    inset: 0;
    z-index: 100;
    background: rgba(10, 6, 18, 0.94);
    backdrop-filter: blur(18px) saturate(140%);
    -webkit-backdrop-filter: blur(18px) saturate(140%);
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 24px;
    animation: fade-in 320ms var(--ease-smooth);
  }
  @keyframes fade-in { from { opacity: 0; } to { opacity: 1; } }
  @keyframes lift { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: none; } }

  #cookie-banner {
    position: fixed;
    bottom: 0; left: 0; right: 0;
    z-index: 70;
    transform: translateY(100%);
    transition: transform 420ms var(--ease-smooth);
  }
  #cookie-banner.show { transform: translateY(0); }

  .nav-blur {
    backdrop-filter: blur(14px) saturate(160%);
    -webkit-backdrop-filter: blur(14px) saturate(160%);
    background: rgba(248, 246, 250, 0.84);
  }

  .vial-slot {
    position: relative;
    background:
      radial-gradient(ellipse 80% 60% at 50% 50%, rgba(176, 38, 255, 0.10), transparent 60%),
      linear-gradient(180deg, #1F1729 0%, #15101D 100%);
    border-radius: 12px;
    overflow: hidden;
  }
  .vial-slot-dark {
    position: relative;
    background:
      radial-gradient(ellipse 80% 60% at 50% 50%, rgba(176, 38, 255, 0.18), transparent 60%),
      linear-gradient(180deg, #1F1729 0%, #15101D 100%);
    border-radius: 12px;
    overflow: hidden;
  }

  /* ===================== NLL VIAL ===================== */
  .nll-vial {
    position: absolute;
    inset: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 4% 0;
    /* no z-index , keeps stacking context flat so mix-blend works against slot bg */
  }
  .vial-img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
    display: block;
    transition: transform 420ms var(--ease-smooth);
  }
  /* Scale up so the vial inside the photo fills more of the slot */
  .vial-slot-dark .vial-img,
  .vial-slot .vial-img { transform: scale(1.18); }
  .product-card:hover .vial-img { transform: scale(1.22) translateY(-4px); }
  .goal-card:hover .vial-img { transform: scale(1.22) translateY(-2px); }
  /* Slim peptide vial proportions , height-driven, ~1:2 ratio */
  .vial {
    position: relative;
    height: 100%;
    aspect-ratio: 1 / 2;
    container-type: inline-size;
    filter: drop-shadow(0 22px 24px rgba(0,0,0,.45));
  }

  /* CAP , rounded flip-top with dome */
  .vial__cap {
    position: absolute;
    top: 1%;
    left: 30%;
    right: 30%;
    height: 7%;
    background:
      radial-gradient(ellipse 75% 50% at 50% 25%, rgba(255,255,255,.28), transparent 65%),
      radial-gradient(ellipse 90% 70% at 50% 110%, rgba(0,0,0,.55), transparent 60%),
      linear-gradient(90deg, #050208 0%, #18111e 12%, #2c2040 40%, #2c2040 60%, #18111e 88%, #050208 100%);
    border-radius: 28% 28% 6% 6% / 50% 50% 14% 14%;
    box-shadow:
      inset 0 1px 0 rgba(255,255,255,.28),
      inset 0 -3px 5px rgba(0,0,0,.6);
  }
  /* center dimple/button */
  .vial__cap::before {
    content: "";
    position: absolute;
    top: 24%;
    left: 30%;
    right: 30%;
    height: 28%;
    border-radius: 50%;
    background:
      radial-gradient(circle at 50% 35%, rgba(255,255,255,.10), rgba(0,0,0,.6) 70%);
    box-shadow:
      inset 0 1px 1px rgba(0,0,0,.75),
      inset 0 -1px 0 rgba(255,255,255,.06);
  }
  /* tiny seam line where cap top meets cap side */
  .vial__cap::after {
    content: "";
    position: absolute;
    bottom: 18%;
    left: 6%; right: 6%;
    height: 1px;
    background: rgba(0,0,0,.45);
  }
  /* FERRULE , aluminum crimp flange (slightly wider than cap) */
  .vial__ferrule {
    position: absolute;
    top: 7.6%;
    left: 24%;
    right: 24%;
    height: 4.2%;
    background:
      linear-gradient(180deg,
        #4a3a5e 0%,
        #2a1f38 18%,
        #1a1422 38%,
        #06030c 60%,
        #1a1422 88%,
        #06030c 100%);
    border-radius: 1px 1px 0 0;
    box-shadow:
      inset 0 1px 0 rgba(255,255,255,.32),
      inset 0 -1px 0 rgba(0,0,0,.7);
  }
  /* horizontal aluminum sheen lines */
  .vial__ferrule::after {
    content: "";
    position: absolute;
    inset: 0;
    background:
      linear-gradient(180deg,
        transparent 18%,
        rgba(255,255,255,.10) 30%,
        transparent 38%,
        rgba(0,0,0,.35) 58%,
        transparent 64%,
        rgba(255,255,255,.06) 80%,
        transparent 88%);
  }

  /* GLASS BODY , slim cylinder */
  .vial__body {
    position: absolute;
    top: 11.8%;
    left: 4%;
    right: 4%;
    bottom: 0;
    border-radius: 6% 6% 14% 14% / 3% 3% 8% 8%;
    background:
      /* top shoulder shadow */
      radial-gradient(ellipse 90% 10% at 50% 0%, rgba(0,0,0,.4), transparent 70%),
      /* faint magenta interior */
      linear-gradient(180deg, rgba(176,38,255,.03), rgba(176,38,255,.0) 30%),
      /* glass curvature side highlights */
      linear-gradient(90deg,
        rgba(207,199,216,.20) 0%,
        rgba(255,255,255,.62) 9%,
        rgba(168,157,186,.16) 24%,
        rgba(122,111,140,.05) 50%,
        rgba(168,157,186,.16) 76%,
        rgba(255,255,255,.50) 91%,
        rgba(207,199,216,.20) 100%);
    box-shadow:
      inset 0 -8px 20px rgba(0,0,0,.18),
      inset 1px 0 0 rgba(255,255,255,.20),
      inset -1px 0 0 rgba(255,255,255,.10);
  }
  /* Neck/shoulder taper between ferrule and body */
  .vial__neck {
    position: absolute;
    top: 12%;
    left: 14%;
    right: 14%;
    height: 2.5%;
    background: linear-gradient(180deg, rgba(255,255,255,.18), rgba(0,0,0,.18));
    border-radius: 60% 60% 0 0 / 100% 100% 0 0;
  }
  .vial--powder .vial__body::after {
    content: "";
    position: absolute;
    left: 8%; right: 8%;
    bottom: 2%;
    height: 11%;
    border-radius: 50% / 18%;
    background: linear-gradient(180deg, rgba(245,240,255,.85) 0%, rgba(220,210,235,.65) 100%);
    box-shadow:
      inset 0 1px 1px rgba(255,255,255,.7),
      inset 0 -1px 1px rgba(0,0,0,.15),
      0 -1px 0 rgba(255,255,255,.5);
  }
  .vial--liquid .vial__body::after {
    content: "";
    position: absolute;
    left: 4%; right: 4%;
    top: 14%; bottom: 1.5%;
    background: linear-gradient(180deg, rgba(255,255,255,.30), rgba(176,38,255,.06));
    border-radius: 4px 4px 12px 12px;
    box-shadow: 0 -1px 0 rgba(255,255,255,.5);
  }

  /* LABEL , wraps middle of vial body, leaves clear glass above and below */
  .vial__label {
    position: absolute;
    top: 32%;
    bottom: 22%;
    left: 6%;
    right: 6%;
    background: #0c0716;
    border-radius: 2px;
    padding: 5cqi 5cqi 4cqi;
    box-shadow:
      inset 0 0 0 .5px rgba(176,38,255,.25),
      0 4px 14px rgba(0,0,0,.55);
    color: #fff;
    font-family: 'Inter', system-ui, sans-serif;
    font-size: 4cqi;
    line-height: 1.15;
    letter-spacing: .04em;
    display: flex;
    flex-direction: column;
    overflow: hidden;
  }
  /* Subtle highlight band on the label (cylindrical wrap suggestion) */
  .vial__label::before {
    content: "";
    position: absolute;
    top: 0; bottom: 0;
    left: 8%;
    width: 4%;
    background: linear-gradient(180deg, transparent, rgba(255,255,255,.06) 30%, rgba(255,255,255,.06) 70%, transparent);
    pointer-events: none;
  }
  .vial__label-corner { position:absolute; width: 4cqi; height: 4cqi; border: 1px solid rgba(176,38,255,.6); }
  .vial__label-corner.tl { top:2cqi; left:2cqi; border-right:0; border-bottom:0; }
  .vial__label-corner.tr { top:2cqi; right:2cqi; border-left:0; border-bottom:0; }
  .vial__label-corner.bl { bottom:2cqi; left:2cqi; border-right:0; border-top:0; }
  .vial__label-corner.br { bottom:2cqi; right:2cqi; border-left:0; border-top:0; }

  .vial__head {
    display: flex; align-items: center; gap: 2.5cqi;
    margin-bottom: 4cqi;
  }
  .vial__hex {
    flex: none;
    width: 8cqi; height: 9cqi;
    display: grid; place-items: center;
    background:
      linear-gradient(transparent calc(50% - 4.5cqi), rgba(176,38,255,.08) calc(50% - 4.5cqi), rgba(176,38,255,.08) calc(50% + 4.5cqi), transparent calc(50% + 4.5cqi));
    clip-path: polygon(50% 0, 100% 25%, 100% 75%, 50% 100%, 0 75%, 0 25%);
    border: .5px solid #fff;
  }
  .vial__hex span {
    font-size: 3.4cqi; font-weight:700; letter-spacing:.5px;
  }
  .vial__brand { flex: 1; min-width: 0; }
  .vial__brand-name {
    font-size: 4.6cqi; font-weight: 700; letter-spacing: .14em;
    line-height: 1; color: #fff; white-space: nowrap;
  }
  .vial__brand-sub {
    font-size: 2.7cqi; font-weight: 500; letter-spacing: .14em;
    color: rgba(255,255,255,.4); margin-top: 1.2cqi;
    white-space: nowrap;
  }
  .vial__head-icon {
    flex: none;
    width: 6cqi; height: 7cqi;
    display: grid; place-items: center;
    border: .5px solid rgba(176,38,255,.85);
    clip-path: polygon(50% 0, 100% 25%, 100% 75%, 50% 100%, 0 75%, 0 25%);
  }
  .vial__head-icon::after {
    content: ""; width: 0; height: 0;
    border-left: 1.6cqi solid transparent;
    border-right: 1.6cqi solid transparent;
    border-top: 2.2cqi solid rgba(176,38,255,.9);
  }

  .vial__divider {
    height: .5px; background: rgba(255,255,255,.1);
    margin: 0 0 4cqi;
  }
  .vial__compound-tag {
    font-size: 2.6cqi; font-weight: 600; letter-spacing: .16em;
    color: rgba(255,255,255,.42); margin-bottom: 2cqi;
  }
  .vial__product-name {
    font-family: 'Instrument Serif', 'Times New Roman', serif;
    font-size: 13cqi; font-weight: 500; letter-spacing: -.02em;
    line-height: 1; color: #fff;
    margin: 0;
    word-break: break-word;
  }
  .vial__product-name.long { font-size: 9.5cqi; }
  .vial__product-name.xlong { font-size: 7.5cqi; }
  .vial__composition {
    font-size: 2.7cqi; font-weight: 500; letter-spacing: .1em;
    color: rgba(255,255,255,.48); margin-top: 1.6cqi;
  }

  .vial__dose {
    margin-top: 4cqi;
    align-self: flex-end;
    padding: 2.6cqi 4cqi 2cqi;
    border: .5px solid rgba(176,38,255,.78);
    background: rgba(176,38,255,.06);
    text-align: center;
    border-radius: 1.5px;
    min-width: 22cqi;
  }
  .vial__dose-num {
    display: block;
    font-family: 'Instrument Serif', 'Times New Roman', serif;
    font-size: 12cqi; font-weight: 500;
    line-height: 1; color: #fff;
  }
  .vial__dose-unit {
    display: block;
    font-size: 3cqi; font-weight: 700; letter-spacing: .14em;
    color: #B026FF; margin-top: 1cqi;
  }

  .vial__foot {
    margin-top: auto;
    padding-top: 3cqi;
    border-top: .5px solid rgba(255,255,255,.1);
    display: flex; justify-content: space-between;
    gap: 2cqi;
  }
  .vial__foot-left {
    font-size: 2.2cqi; font-weight: 600; letter-spacing: .06em;
    color: rgba(255,255,255,.42); line-height: 1.4;
  }
  .vial__foot-batch {
    font-size: 2.2cqi; font-weight: 700; letter-spacing: .06em;
    color: #B026FF; line-height: 1.4; white-space: nowrap;
    align-self: end;
  }

  /* Edge speculars on glass , the bright vertical streak */
  .vial__shine {
    position: absolute;
    pointer-events: none;
    top: 18%; bottom: 2%;
    left: 11%;
    width: 3%;
    background: linear-gradient(180deg, transparent, rgba(255,255,255,.55) 12%, rgba(255,255,255,.55) 88%, transparent);
    border-radius: 50%;
    filter: blur(.4px);
  }
  .vial__shine--right {
    left: auto; right: 11%;
    width: 1.5%;
    background: linear-gradient(180deg, transparent, rgba(255,255,255,.22) 12%, rgba(255,255,255,.22) 88%, transparent);
  }

  .product-card .nll-vial { padding: 6% 6% 4%; }
  .goal-card .nll-vial { padding: 4% 14%; }
  .product-card:hover .vial { transform: translateY(-2px); transition: transform 320ms var(--ease-smooth); }

  .display-hero { font-size: clamp(44px, 7.2vw, 96px); }
  .display-xl   { font-size: clamp(40px, 5.6vw, 76px); }
  .display-l    { font-size: clamp(34px, 4.4vw, 60px); }
  .display-m    { font-size: clamp(26px, 3vw, 40px); }

  .goal-card .goal-arrow { transition: transform 320ms var(--ease-smooth); }
  .goal-card:hover .goal-arrow { transform: translate(4px, -4px); }

  .product-card .product-image { transition: transform 320ms var(--ease-smooth); }
  .product-card:hover .product-image { transform: scale(1.03); }

  .skip-link {
    position: absolute;
    left: -9999px;
    top: 0;
    padding: 10px 16px;
    background: var(--graphite);
    color: #fff;
    z-index: 200;
  }
  .skip-link:focus { left: 12px; top: 12px; }
/* ===== Reconstitution and dosing reference calculator ===== */
.recon-calc {
  background: #fff;
  border: 1px solid var(--hairline-light);
  border-radius: 16px;
  padding: 24px;
  box-shadow: 0 1px 3px rgba(26,20,34,.04);
}
.rc-warn {
  display: flex; align-items: flex-start; gap: 10px;
  background: rgba(176,38,255,0.06);
  border: 1px solid rgba(176,38,255,0.25);
  color: var(--graphite);
  padding: 10px 14px;
  border-radius: 10px;
  font-size: 12.5px;
  line-height: 1.4;
}
.rc-warn svg { flex: none; margin-top: 2px; color: var(--signal); }
.rc-warn-top { margin-bottom: 18px; }
.rc-warn-bottom { margin-top: 18px; }
.rc-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 14px;
}
@media (max-width: 640px) { .rc-grid { grid-template-columns: 1fr; } }
.rc-input label {
  display: block;
  font-family: 'Geist Mono', monospace;
  font-size: 11px;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--ash);
  margin-bottom: 6px;
}
.rc-input input, .rc-input select {
  width: 100%;
  padding: 11px 14px;
  border: 1px solid var(--hairline-light);
  border-radius: 10px;
  font-size: 15px;
  background: #fff;
  font-family: 'Instrument Sans', system-ui, sans-serif;
}
.rc-input input:focus, .rc-input select:focus {
  outline: none;
  border-color: var(--signal);
  box-shadow: 0 0 0 3px rgba(176,38,255,0.10);
}
.rc-hint { font-size: 11.5px; color: var(--ash); margin-top: 5px; }
.rc-out {
  margin-top: 18px;
  background: linear-gradient(180deg, #FAFAFA, #F2EFF6);
  border: 1px solid var(--hairline-light);
  border-radius: 12px;
  padding: 14px 18px;
}
.rc-empty { color: var(--ash); font-size: 13.5px; }
.rc-row {
  display: flex; justify-content: space-between; align-items: baseline;
  padding: 8px 0;
  border-bottom: 1px dashed var(--hairline-light);
  font-size: 13.5px;
  gap: 12px;
}
.rc-row:last-child { border-bottom: 0; }
.rc-row > span:first-child { color: var(--ash); }
.rc-val { font-family: 'Instrument Serif', serif; font-size: 18px; color: var(--graphite); font-variant-numeric: tabular-nums; text-align: right; }

/* Currently shipping batch banner on PDP */
.batch-banner {
  display: inline-flex; align-items: center; gap: 8px;
  background: rgba(176,38,255,0.08);
  border: 1px solid rgba(176,38,255,0.30);
  border-radius: 999px;
  padding: 6px 14px;
  font-family: 'Geist Mono', monospace;
  font-size: 11.5px;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--graphite);
}
.batch-banner span.batch-dot { width: 6px; height: 6px; border-radius: 50%; background: var(--signal); }

/* Attestation checkbox at checkout */
.attestation {
  margin-top: 18px;
  padding: 14px 16px;
  border: 1px solid var(--hairline-light);
  border-radius: 12px;
  background: #FAFAFA;
}
.attestation label {
  display: grid;
  grid-template-columns: 22px 1fr;
  gap: 12px;
  font-size: 13px;
  line-height: 1.5;
  color: var(--graphite);
  cursor: pointer;
  align-items: start;
}
.attestation input[type="checkbox"] {
  width: 18px; height: 18px;
  margin-top: 2px;
  accent-color: var(--signal);
  cursor: pointer;
}
.attestation:has(input:checked) {
  border-color: var(--signal);
  background: rgba(176,38,255,0.04);
}
