/** Shopify CDN: Minification failed

Line 90:0 All "@import" rules must come first

**/
/* =============================================================
   HALF/LIFE -- Theme-wide CSS overrides
   Loaded on top of Dawn base. Variables are source of truth
   from stores/half-life.design.md. Do not introduce new colors
   or fonts without updating the design system doc first.
   ============================================================= */

/* ---------- 1. Design tokens ---------- */
:root {
  /* Color -- v2.0 palette (paper-white + ink + one warm note)
     Roundtable 2026-04-17 killed sage + terracotta + cream.
     Token names retained temporarily to avoid sweeping rule rewrites;
     values reassigned to the new palette. Rename tokens post-launch. */
  --hl-off-black: #1F1F1F;   /* Ink (was #1C1C1E) */
  --hl-ink: #1F1F1F;
  --hl-paper: #F6F3EE;
  --hl-flag: #D94F1E;         /* lab-tag orange -- TBD vs bruised red */
  --hl-sage: #1F1F1F;         /* deprecated -- re-pointed to Ink so legacy rules read as ink */
  --hl-terracotta: #D94F1E;   /* deprecated -- re-pointed to Flag */
  --hl-cream: #F6F3EE;        /* deprecated -- re-pointed to Paper */

  /* Color -- extended (muted, for secondary rules only) */
  --hl-warm-gray: #1F1F1F; /* was #7A756D -- too low contrast on paper bg (4.2:1). Swept to ink. */
  --hl-light-warm: #E8E4DD;
  --hl-pale-cream: #FAF8F4;
  --hl-charcoal: #2C2C2E;

  /* Color -- SKU accent removed (v2.0: one warm note across the brand, not per-SKU) */
  --hl-dusty-blue: #1F1F1F;

  /* Typography stacks -- v2.0: Space Grotesk reserved for wordmark only.
     Body + headings go to a serif. Mono handles data/dose/price/caption. */
  --hl-font-wordmark: "Space Grotesk", system-ui, -apple-system, "Helvetica Neue", Arial, sans-serif;
  --hl-font-heading: "IBM Plex Serif", "Source Serif 4", Georgia, "Times New Roman", serif;
  --hl-font-body: "IBM Plex Serif", "Source Serif 4", Georgia, "Times New Roman", serif;
  --hl-font-mono: "IBM Plex Mono", "JetBrains Mono", ui-monospace, "Courier New", monospace;

  /* Spacing scale (4px base) */
  --hl-space-1: 4px;
  --hl-space-2: 8px;
  --hl-space-3: 12px;
  --hl-space-4: 16px;
  --hl-space-6: 24px;
  --hl-space-8: 32px;
  --hl-space-10: 40px;
  --hl-space-12: 48px;
  --hl-space-16: 64px;
  --hl-space-20: 80px;
  --hl-space-24: 96px;

  /* Containers -- bumped from 1200 -> 1440 on 2026-04-17 per founder.
     Horizontal rows (DISCUSSED ON with 7 faces, price comparison with 4
     competitor cards) were cramped at 1200. 1440 gives ~48px gutters on a
     1440 viewport and breathes on wider desktops. */
  --hl-max-content: 1440px;
  --hl-max-text: 720px;
  --hl-max-wide: 1680px;

  /* Radii */
  --hl-radius-sm: 2px;
  --hl-radius-md: 4px;
  --hl-radius-lg: 8px;

  /* Motion */
  --hl-ease: cubic-bezier(0.4, 0, 0.2, 1);
}

/* ---------- 2. Override Dawn color scheme tokens ----------
   Dawn uses RGB triplets in --color-foreground / --color-background.
   Force the base scheme to HALF/LIFE cream + off-black regardless of
   what the theme editor sets.
*/
.color-scheme-1,
.color-background-1,
body {
  --color-background: 245, 240, 232;   /* cream */
  --color-foreground: 28, 28, 30;      /* off-black */
  --color-button: 143, 166, 140;       /* sage */
  --color-button-text: 28, 28, 30;     /* off-black */
  --color-link: 28, 28, 30;
  --color-secondary-button-text: 28, 28, 30;
}

/* ---------- 3. Web font loading ---------- */
@import url("https://fonts.googleapis.com/css2?family=Space+Grotesk:wght@500;700&family=DM+Sans:wght@300;400;500&family=Space+Mono:wght@400;700&display=swap");

/* ---------- 4. Base typography ---------- */
html { font-size: 16px; }

body {
  background: var(--hl-cream);
  color: var(--hl-off-black);
  font-family: var(--hl-font-body);
  font-weight: 400;
  line-height: 1.6;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

h1, h2, h3, h4, h5, h6,
.h1, .h2, .h3, .h4, .h5, .h6 {
  font-family: var(--hl-font-heading);
  color: var(--hl-off-black);
  font-weight: 700;
}

h1 { font-size: 3.5rem; line-height: 1.05; letter-spacing: -0.02em; }
h2 { font-size: 2.5rem; line-height: 1.1;  letter-spacing: -0.015em; }
h3 { font-size: 1.75rem; line-height: 1.2; letter-spacing: -0.01em; }
h4 { font-size: 1.375rem; line-height: 1.25; font-weight: 500; }
h5 { font-size: 1.125rem; line-height: 1.3; font-weight: 500; letter-spacing: 0.01em; }
h6 { font-size: 0.75rem;  line-height: 1.4; font-weight: 500; letter-spacing: 0.1em; text-transform: uppercase; }

p { font-family: var(--hl-font-body); margin: 0 0 var(--hl-space-6) 0; }

.hl-mono { font-family: var(--hl-font-mono); letter-spacing: 0.04em; }
.hl-overline {
  font-family: var(--hl-font-heading);
  text-transform: uppercase;
  font-size: 0.75rem;
  letter-spacing: 0.1em;
  font-weight: 500;
  color: var(--hl-warm-gray);
}

@media (max-width: 640px) {
  h1 { font-size: 2.5rem; }
  h2 { font-size: 2rem; }
  h3 { font-size: 1.5rem; }
}

/* ---------- 5. Buttons -- replace Dawn defaults ---------- */
.button,
.shopify-payment-button__button--unbranded,
button.hl-btn {
  font-family: var(--hl-font-heading);
  font-weight: 500;
  font-size: 0.875rem;
  letter-spacing: 0.02em;
  padding: 12px 24px;
  border-radius: var(--hl-radius-md);
  border: 1px solid transparent;
  cursor: pointer;
  text-decoration: none;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  line-height: 1;
  min-height: 44px;
  transition: background-color 150ms var(--hl-ease), color 150ms var(--hl-ease), border-color 150ms var(--hl-ease);
}

/* Primary button -- ink ground, paper label. Horizon's Dawn-derived button
   classes cascade late, so the !important wins over their `color` rules
   (page_review confirmed computed color was still ink without them). */
.button--primary,
.hl-btn--primary,
.shopify-payment-button__button--unbranded {
  background: var(--hl-ink) !important;
  color: var(--hl-paper) !important;
  border-color: var(--hl-ink) !important;
}

.button--primary:hover,
.hl-btn--primary:hover,
.shopify-payment-button__button--unbranded:hover {
  background: var(--hl-paper) !important;
  color: var(--hl-ink) !important;
  border-color: var(--hl-ink) !important;
}

.button--secondary,
.hl-btn--secondary {
  background: transparent;
  color: var(--hl-ink);
  border-color: var(--hl-ink);
}

.button--secondary:hover,
.hl-btn--secondary:hover {
  background: var(--hl-ink);
  color: var(--hl-paper);
}

.hl-btn--accent {
  background: var(--hl-flag);
  color: var(--hl-paper);
  border-color: var(--hl-flag);
}

.hl-btn--accent:hover {
  filter: brightness(0.9);
}

/* ---------- 6. Section scaffolding ---------- */
.hl-section {
  padding: var(--hl-space-16) var(--hl-space-6);
}

@media (max-width: 640px) {
  .hl-section { padding: var(--hl-space-12) var(--hl-space-4); }
}

.hl-container {
  max-width: var(--hl-max-content);
  margin: 0 auto;
}

.hl-container--wide {
  max-width: var(--hl-max-wide);
  margin: 0 auto;
}

.hl-container--text {
  max-width: var(--hl-max-text);
  margin: 0 auto;
}

.hl-section--cream   { background: var(--hl-cream); }
.hl-section--pale    { background: var(--hl-pale-cream); }
.hl-section--dark    { background: var(--hl-off-black); color: var(--hl-cream); }
.hl-section--dark h1,
.hl-section--dark h2,
.hl-section--dark h3,
.hl-section--dark h4 { color: var(--hl-cream); }

/* ---------- 7. Hero (sections/hero.liquid) ---------- */
.hl-hero {
  position: relative;
  background: var(--hl-cream);
  overflow: hidden;
}

.hl-hero__media {
  position: relative;
  width: 100%;
  aspect-ratio: 21 / 9;
  min-height: 480px;
  max-height: 780px;
}

.hl-hero__media img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

.hl-hero__overlay {
  position: absolute;
  inset: 0;
  display: flex;
  align-items: center;
  justify-content: flex-end;
  padding: var(--hl-space-16) var(--hl-space-12);
}

.hl-hero__panel {
  max-width: 520px;
  text-align: left;
  color: var(--hl-off-black);
  background: rgba(246, 243, 238, 0.94);
  padding: var(--hl-space-10) var(--hl-space-10) var(--hl-space-8);
  border-radius: var(--hl-radius-sm);
  backdrop-filter: blur(4px);
}

.hl-hero__wordmark {
  font-family: var(--hl-font-wordmark);
  font-weight: 700;
  font-size: clamp(1.25rem, 1.8vw, 1.625rem);
  letter-spacing: 0.06em;
  color: var(--hl-off-black);
  margin: 0 0 var(--hl-space-4) 0;
  line-height: 1;
  text-transform: none;
}

/* Hero tagline -- scaled up 2026-04-17 (founder: "make all fonts bigger"). */
.hl-hero__tagline {
  font-family: var(--hl-font-heading);
  font-weight: 500;
  font-size: clamp(2.25rem, 4vw, 3.75rem);
  line-height: 1.15;
  letter-spacing: -0.015em;
  margin: 0 0 var(--hl-space-5) 0;
}

.hl-hero__subline {
  font-family: var(--hl-font-body);
  font-weight: 400;
  font-size: 1.25rem;
  line-height: 1.55;
  color: var(--hl-off-black);
  margin: 0 0 var(--hl-space-8) 0;
  max-width: 480px;
}

.hl-hero__cta {
  display: inline-flex;
  align-items: center;
  gap: var(--hl-space-2);
}

/* Mobile hero panel -- rendered BELOW the image, not overlaid. */
.hl-hero__mobile-panel {
  display: none;
}

@media (max-width: 900px) {
  .hl-hero__media { aspect-ratio: 4 / 5; min-height: 440px; }
  .hl-hero__overlay { display: none; }
  .hl-hero__mobile-panel {
    display: block;
    background: var(--hl-paper);
    padding: var(--hl-space-10) var(--hl-space-6) var(--hl-space-8);
    color: var(--hl-ink);
  }
  .hl-hero__mobile-panel .hl-hero__tagline { margin-bottom: var(--hl-space-4); }
  .hl-hero__mobile-panel .hl-hero__cta { margin-top: var(--hl-space-4); }
}

/* ---------- 8. Product hero (sections/product-hero.liquid) ---------- */
.hl-product {
  background: var(--hl-cream);
}

.hl-product__grid {
  display: grid;
  grid-template-columns: minmax(0, 1.1fr) minmax(0, 1fr);
  gap: var(--hl-space-16);
  align-items: start;
}

@media (max-width: 900px) {
  .hl-product__grid { grid-template-columns: 1fr; gap: var(--hl-space-8); }
}

.hl-product__gallery {
  display: flex;
  flex-direction: column;
  gap: var(--hl-space-4);
}

.hl-product__hero-img {
  width: 100%;
  aspect-ratio: 4 / 5;
  object-fit: cover;
  border-radius: var(--hl-radius-lg);
  background: var(--hl-pale-cream);
  transition: transform 300ms var(--hl-ease);
}

.hl-product__hero-img:hover { transform: scale(1.01); }

.hl-product__thumbs {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: var(--hl-space-3);
}

.hl-product__thumb {
  width: 100%;
  aspect-ratio: 1 / 1;
  object-fit: cover;
  border-radius: var(--hl-radius-md);
  background: var(--hl-pale-cream);
  cursor: pointer;
  border: 1px solid var(--hl-light-warm);
  transition: border-color 150ms var(--hl-ease);
}

.hl-product__thumb:hover { border-color: var(--hl-off-black); }

.hl-product__content {
  padding-top: var(--hl-space-4);
}

.hl-product__eyebrow {
  font-family: var(--hl-font-heading);
  font-weight: 500;
  font-size: 0.75rem;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--hl-warm-gray);
  margin: 0 0 var(--hl-space-3) 0;
}

.hl-product__name {
  font-family: var(--hl-font-heading);
  font-weight: 700;
  font-size: 2.5rem;
  line-height: 1.1;
  letter-spacing: -0.015em;
  margin: 0 0 var(--hl-space-3) 0;
}

.hl-product__tagline {
  font-family: var(--hl-font-body);
  font-weight: 300;
  font-style: italic;
  font-size: 1.125rem;
  color: var(--hl-warm-gray);
  margin: 0 0 var(--hl-space-8) 0;
}

.hl-product__price-row {
  display: flex;
  align-items: baseline;
  gap: var(--hl-space-6);
  margin: 0 0 var(--hl-space-6) 0;
  font-family: var(--hl-font-mono);
}

.hl-product__price {
  font-size: 1.5rem;
  font-weight: 700;
  color: var(--hl-off-black);
  letter-spacing: 0.02em;
}

.hl-product__price--alt {
  font-size: 1rem;
  font-weight: 400;
  color: var(--hl-warm-gray);
}

/* Purchase toggle (one-time vs subscribe) */
.hl-purchase-toggle {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 0;
  border: 1px solid var(--hl-light-warm);
  border-radius: var(--hl-radius-md);
  overflow: hidden;
  margin: 0 0 var(--hl-space-6) 0;
  background: var(--hl-pale-cream);
}

.hl-purchase-toggle__option {
  padding: var(--hl-space-4) var(--hl-space-4);
  cursor: pointer;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: var(--hl-space-1);
  background: transparent;
  border: none;
  text-align: left;
  font-family: var(--hl-font-heading);
  transition: background 150ms var(--hl-ease);
}

.hl-purchase-toggle__option[aria-pressed="true"] {
  background: #1F1F1F !important;
  color: #F6F3EE !important;
}
.hl-purchase-toggle__option[aria-pressed="true"] .hl-purchase-toggle__label,
.hl-purchase-toggle__option[aria-pressed="true"] .hl-purchase-toggle__price,
.hl-purchase-toggle__option[aria-pressed="true"] .hl-purchase-toggle__save {
  color: #F6F3EE !important;
}
.hl-purchase-toggle__option:not([aria-pressed="true"]) .hl-purchase-toggle__label,
.hl-purchase-toggle__option:not([aria-pressed="true"]) .hl-purchase-toggle__price {
  color: #1F1F1F !important;
}

.hl-purchase-toggle__label {
  font-size: 0.875rem;
  font-weight: 500;
  letter-spacing: 0.02em;
}

.hl-purchase-toggle__price {
  font-family: var(--hl-font-mono);
  font-size: 1rem;
  font-weight: 700;
}

.hl-purchase-toggle__save {
  font-family: var(--hl-font-body);
  font-size: 0.75rem;
  font-weight: 400;
  color: var(--hl-sage);
  letter-spacing: 0.04em;
}

.hl-purchase-toggle__option[aria-pressed="true"] .hl-purchase-toggle__save {
  color: var(--hl-cream);
}

/* Bullet value props */
.hl-bullets {
  list-style: none;
  padding: 0;
  margin: 0 0 var(--hl-space-8) 0;
  display: flex;
  flex-direction: column;
  gap: var(--hl-space-3);
}

.hl-bullets li {
  font-family: var(--hl-font-body);
  font-size: 1.125rem;
  line-height: 1.55;
  color: var(--hl-off-black);
  padding-left: var(--hl-space-6);
  position: relative;
}

.hl-bullets li::before {
  content: "";
  position: absolute;
  left: 0;
  top: 0.65em;
  width: 12px;
  height: 1px;
  background: var(--hl-sage);
}

/* Fulfillment note -- full ink, no opacity. User flagged opacity made it
   illegible. Font-size + mono family alone carry the quiet hierarchy. */
.hl-shipping-note {
  font-family: var(--hl-font-mono);
  font-size: 0.8125rem;
  letter-spacing: 0.04em;
  color: #1F1F1F;
  margin: var(--hl-space-4) 0 0 0;
}

/* ---------- 9. Transparency teaser (sections/transparency-teaser.liquid) ---------- */
.hl-transparency {
  background: var(--hl-pale-cream);
}

.hl-transparency__inner {
  max-width: var(--hl-max-text);
  margin: 0 auto;
}

.hl-transparency__eyebrow {
  font-family: var(--hl-font-heading);
  font-size: 0.75rem;
  font-weight: 500;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--hl-sage);
  margin: 0 0 var(--hl-space-4) 0;
}

.hl-transparency__heading {
  font-family: var(--hl-font-heading);
  font-weight: 700;
  font-size: 2.25rem;
  line-height: 1.15;
  letter-spacing: -0.015em;
  margin: 0 0 var(--hl-space-8) 0;
}

.hl-transparency__body {
  font-family: var(--hl-font-body);
  font-weight: 300;
  font-size: 1.125rem;
  line-height: 1.65;
  color: var(--hl-off-black);
}

.hl-transparency__body p { margin: 0 0 var(--hl-space-6) 0; }

.hl-pullquote {
  font-family: var(--hl-font-mono);
  font-weight: 400;
  font-size: 1rem;
  line-height: 1.6;
  letter-spacing: 0.02em;
  color: var(--hl-sage);
  border-left: 2px solid var(--hl-sage);
  padding: var(--hl-space-3) 0 var(--hl-space-3) var(--hl-space-6);
  margin: var(--hl-space-8) 0;
  max-width: 560px;
}

.hl-transparency__link {
  display: inline-flex;
  align-items: center;
  gap: var(--hl-space-2);
  font-family: var(--hl-font-heading);
  font-weight: 500;
  font-size: 0.875rem;
  letter-spacing: 0.02em;
  color: var(--hl-off-black);
  text-decoration: none;
  border-bottom: 1px solid var(--hl-off-black);
  padding-bottom: 2px;
  transition: color 150ms var(--hl-ease), border-color 150ms var(--hl-ease);
}

.hl-transparency__link:hover {
  color: var(--hl-sage);
  border-bottom-color: var(--hl-sage);
}

/* ---------- 10. Lineup preview (sections/lineup-preview.liquid) ---------- */
.hl-lineup {
  position: relative;
  background: var(--hl-cream);
  padding: 0;
}

.hl-lineup__media {
  position: relative;
  width: 100%;
  aspect-ratio: 16 / 9;
  min-height: 420px;
  overflow: hidden;
}

.hl-lineup__media img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

.hl-lineup__overlay {
  position: absolute;
  inset: 0;
  display: flex;
  align-items: flex-end;
  padding: var(--hl-space-12) var(--hl-space-12);
  background: linear-gradient(180deg, rgba(245,240,232,0) 50%, rgba(245,240,232,0.85) 100%);
}

.hl-lineup__caption {
  max-width: 640px;
}

.hl-lineup__heading {
  font-family: var(--hl-font-heading);
  font-weight: 700;
  font-size: clamp(1.5rem, 3vw, 2.25rem);
  line-height: 1.2;
  letter-spacing: -0.015em;
  color: var(--hl-off-black);
  margin: 0 0 var(--hl-space-3) 0;
}

.hl-lineup__sub {
  font-family: var(--hl-font-mono);
  font-size: 0.875rem;
  letter-spacing: 0.04em;
  color: var(--hl-sage);
  margin: 0;
}

@media (max-width: 640px) {
  .hl-lineup__overlay { padding: var(--hl-space-6); }
}

/* ---------- 11. Footer manifesto (sections/footer-manifesto.liquid) ---------- */
.hl-manifesto {
  background: var(--hl-off-black);
  color: var(--hl-cream);
  padding: var(--hl-space-20) var(--hl-space-6);
  text-align: center;
}

.hl-manifesto__inner {
  max-width: var(--hl-max-text);
  margin: 0 auto;
}

.hl-manifesto__wordmark {
  font-family: var(--hl-font-heading);
  font-weight: 700;
  font-size: 1.125rem;
  letter-spacing: 0.08em;
  color: var(--hl-cream);
  margin: 0 0 var(--hl-space-8) 0;
  opacity: 0.8;
}

.hl-manifesto__body {
  font-family: var(--hl-font-heading);
  font-weight: 500;
  font-size: clamp(1.5rem, 2.5vw, 2rem);
  line-height: 1.35;
  letter-spacing: -0.01em;
  color: var(--hl-cream);
  margin: 0 0 var(--hl-space-10) 0;
}

.hl-manifesto__sign {
  font-family: var(--hl-font-mono);
  font-size: 0.875rem;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--hl-sage);
  margin: 0;
}

/* ---------- 12. Utility -- film grain overlay hook ---------- */
.hl-grain {
  position: relative;
}
.hl-grain::after {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='120' height='120'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2' stitchTiles='stitch'/><feColorMatrix values='0 0 0 0 0  0 0 0 0 0  0 0 0 0 0  0 0 0 0.08 0'/></filter><rect width='100%' height='100%' filter='url(%23n)'/></svg>");
  opacity: 0.5;
  mix-blend-mode: multiply;
}

/* ---------- 13. Motion ---------- */
@media (prefers-reduced-motion: no-preference) {
  .hl-fade-up {
    animation: hlFadeUp 400ms var(--hl-ease) both;
  }
  @keyframes hlFadeUp {
    from { opacity: 0; transform: translateY(16px); }
    to   { opacity: 1; transform: translateY(0); }
  }
}

/* ---------- 14-email. Email signup layout ----------
   Horizon's .footer-content is a grid-template-columns: 395px 395px --
   forcing 2 fixed columns and a huge gap between the heading and the
   email form. Collapse that grid so columns are auto-sized and hug each
   other naturally. Also vertical-center. */
.footer-content {
  grid-template-columns: auto 1fr !important;
  justify-content: start !important;
  align-items: center !important;
  column-gap: 2.5rem !important;
  row-gap: 1rem !important;
}
.footer-content > * {
  max-width: 560px !important;
}
.email-signup__form,
form[id*="email_signup"],
form[action*="/contact#contact_form"] {
  align-self: center !important;
  justify-self: start !important;
  margin: 0 !important;
  max-width: 480px !important;
  width: 100% !important;
}
.email-signup__input-group,
[class*="email-signup__input-group"] {
  align-self: center !important;
  max-width: 480px !important;
  margin: 0 !important;
  width: 100% !important;
}
/* ---------- 14-page. Widen content pages + bigger body type ----------
   Horizon's real constraint is .layout-panel-flex--column.section which
   caps body content at ~672px. Override. */
.layout-panel-flex,
.layout-panel-flex--column,
.layout-panel-flex--column.section,
[data-template="page"] .layout-panel-flex,
[data-template="page"] .spacing-style.section,
.shopify-block.rte,
main .page,
[data-template="page"] main,
[data-template="page"] .rte,
.page__content,
.rte {
  max-width: 1100px !important;
  width: 100% !important;
  margin-left: auto !important;
  margin-right: auto !important;
}
/* The outer page section should NOT be capped so it centers the inner
   1100px block within the 1440 body-width. */
[data-template="page"] .section.page-width-content,
.shopify-section.section-wrapper {
  max-width: none !important;
}
/* Cart page layout -- center the 2-column grid + recs. */
[data-template="cart"] main,
[data-template="cart"] .layout-panel-flex,
[data-template="cart"] .section.page-width-content {
  max-width: 1200px !important;
  margin-left: auto !important;
  margin-right: auto !important;
}
/* Scale up body text on pages. */
.rte p, .rte li, .rte ul, .rte ol,
.main-page p, .main-page li,
[data-template="page"] .rte p,
[data-template="page"] p,
[data-template="page"] li,
.shopify-section--main-page p,
.shopify-section--main-page li {
  font-size: 1.1875rem !important;
  line-height: 1.6 !important;
}
[data-template="page"] h2,
.shopify-section--main-page h2,
.main-page h2 {
  font-size: clamp(1.75rem, 3vw, 2.5rem) !important;
  margin-top: 2rem !important;
}
[data-template="page"] h3,
.shopify-section--main-page h3 {
  font-size: clamp(1.375rem, 2vw, 1.75rem) !important;
}
[data-template="page"] .page-title,
.shopify-section--main-page .page-title,
.main-page__title {
  font-size: clamp(3rem, 6vw, 5rem) !important;
  line-height: 1.05 !important;
  letter-spacing: -0.02em !important;
  margin-bottom: 1.5rem !important;
}

/* ---------- 14-logo. Bump header wordmark to match nav weight ---------- */
.header-logo__image,
header img.header-logo__image,
.header a img[alt*="HALF/LIFE"],
.header a img[alt*="halflife"] {
  height: 44px !important;
  width: auto !important;
}
@media (max-width: 900px) {
  .header-logo__image,
  header img.header-logo__image {
    height: 32px !important;
  }
}

/* ---------- 14-nav. Larger header nav + bigger evidence subtitles ----------
   Bump nav from ~14px to 18-20px so it reads as a premium brand header.
   Broad selector list targets every possible Horizon nav class. */
header a,
header nav a,
.header__menu-link,
.header__menu a,
.header__menu-item,
.header__menu-item a,
.header nav a,
.header-menu a,
.menu a,
.menu__item,
.menu__item a,
nav.header__menu a,
[class*="header__menu"] a,
[class*="header__nav"] a {
  font-family: "IBM Plex Serif", Georgia, serif !important;
  font-size: clamp(1.125rem, 1.5vw, 1.25rem) !important;
  letter-spacing: 0 !important;
  font-weight: 500 !important;
}

/* Evidence hero stat labels -- bigger and more readable */
.hl-evidence__label,
.shopify-section .hl-evidence__label,
section.hl-evidence .hl-evidence__label {
  font-size: 1.375rem !important;
  line-height: 1.4 !important;
  max-width: 22ch !important;
  color: #1F1F1F !important;
}

/* Transparency pullquote -- break into three lines, increase size,
   mono typography for spec-sheet feel. User flagged run-on unclear. */
.hl-pullquote,
blockquote.hl-pullquote {
  font-family: "IBM Plex Mono", ui-monospace, monospace !important;
  font-size: clamp(1.125rem, 1.8vw, 1.5rem) !important;
  line-height: 1.7 !important;
  letter-spacing: 0.04em !important;
  color: #1F1F1F !important;
  padding: 1.5rem 1.75rem !important;
  margin: 2rem 0 !important;
  border-left: 3px solid #D94F1E !important;
  background: #FFFBF6 !important;
  white-space: pre-line !important;
}

/* ---------- 14-btn. Horizon native button overrides (cart, customer, empty states) ----------
   Horizon's `.button` base class + cart-specific `.cart-items__empty-button`
   default to Shopify blue (#000F9F). Repaint ALL to ink+paper so cart, login,
   and collection empty states read on-brand. */
/* Scope button overrides away from search + predictive search modals -- they
   use .button but need their own native styling. */
a.button:not([class*="search"]):not([class*="modal"]),
.cart-items__empty-button,
.empty-state__action,
.customer__button,
.shopify-challenge__button,
.shopify-section:not([class*="search"]) button.button:not([class*="search"]),
button.button:not(.button--secondary):not(.button--tertiary):not(.hl-btn--accent):not([class*="search"]):not([class*="predictive"]):not([class*="modal"]):not([class*="clear"]) {
  background: #1F1F1F !important;
  color: #F6F3EE !important;
  border-color: #1F1F1F !important;
}
a.button:hover,
.cart-items__empty-button:hover,
button.button:hover:not(.button--secondary) {
  background: #F6F3EE !important;
  color: #1F1F1F !important;
}

/* ---------- 14-pre. Shopify default-color overrides (global) ----------
   Shopify's Horizon native components use a default blue on links,
   "Continue shopping" buttons, product titles on cart page, and login links.
   These leak through our theme settings. Clamp them all to ink. */
a,
a:visited,
.link,
.link--unstyled,
.button--secondary,
.button--tertiary,
button.button.button--secondary,
.cart__checkout-button--empty,
.empty-state__link,
.empty-state a,
.cart-items__media + * a,
.cart__product-title,
a.cart__product-title,
[class*="cart__product"] a,
.customer__login,
.customer a {
  color: #1F1F1F !important;
}
a:hover { color: #D94F1E !important; text-decoration: underline; }

/* ---------- 14a. Nuclear cascade override for Horizon PDP ----------
   Horizon's product template uses Shopify's "Anonymous Pro" monospace as
   a default heading token and its own `.add-to-cart-button` class for the
   CTA -- neither inherits from the page body font or our `.button--primary`
   rules. Pinning both directly so the PDP carries the same typography and
   button color as the rest of the site. */

:where(.product-information, .product, .shopify-section--product, .shopify-section--main-product, [class*="product-information"]) :is(h1, h2, h3, h4, h5, h6, .heading),
.product__title, .product__description, .product-information__title,
.collapsible-row-content h3, .collapsible-row-content h4,
.block h3, .block h4, .block h5 {
  font-family: "IBM Plex Serif", Georgia, "Times New Roman", serif !important;
  font-weight: 500 !important;
  letter-spacing: -0.005em !important;
}

/* Horizon's native add-to-cart button -- repaint to ink/paper. */
.add-to-cart-button,
button.add-to-cart-button,
.button.add-to-cart-button,
button[name="add"],
form[action*="/cart/add"] button[type="submit"],
.product-form__submit,
.shopify-payment-button button {
  background: #1F1F1F !important;
  color: #F6F3EE !important;
  border-color: #1F1F1F !important;
}
.add-to-cart-button:hover,
button.add-to-cart-button:hover,
button[name="add"]:hover {
  background: #F6F3EE !important;
  color: #1F1F1F !important;
  border-color: #1F1F1F !important;
}
.add-to-cart-button[disabled],
button[name="add"][disabled] {
  background: #7A756D !important;
  color: #F6F3EE !important;
  border-color: #7A756D !important;
}

/* ---------- 14b. Force serif on all Horizon-native headings ----------
   Shopify may not honor `type_header_font: ibm_plex_serif_n4` for Horizon's
   built-in PDP/cart/collection templates. CSS override pins them to serif so
   "What's in it / How to take it / Shipping" etc. render on-brand. */
h1, h2, h3, h4, h5, h6,
.heading, .h1, .h2, .h3, .h4, .h5, .h6,
.product__title, .product-information__title,
.product-information h1, .product-information h2, .product-information h3,
.product-information h4, .product-information h5, .product-information h6,
.shopify-section--product h1, .shopify-section--product h2,
.shopify-section--product h3, .shopify-section--product h4,
.shopify-section--product h5, .shopify-section--product h6,
.block h3, .block h4, .block h5,
.collapsible-row-content h3, .collapsible-row-content h4 {
  font-family: "IBM Plex Serif", Georgia, "Times New Roman", serif !important;
  font-weight: 500 !important;
  letter-spacing: -0.005em !important;
}

/* Keep our wordmark classes on their Oswald heading treatment. */
.hl-hero__wordmark {
  font-family: var(--hl-font-wordmark) !important;
}

/* ---------- 14-footer. Footer copyright + terms (aggressive override) ---- */
footer *,
footer small,
footer a,
.footer small,
.footer a,
.copyright,
.copyright__content,
small.copyright__content,
.footer-utilities a,
.footer-utilities small,
[class*="copyright"],
[class*="footer-utilities"] a,
[class*="footer-utilities"] small,
[class*="footer-utilities"] span {
  font-size: 1rem !important;
  line-height: 1.55 !important;
  color: #1F1F1F !important;
  opacity: 0.9 !important;
}
/* Force uppercase for the shop.name display (it's lowercase via API). */
.copyright,
.copyright__content,
small.copyright__content,
footer small.copyright,
footer small.copyright__content,
footer [class*="copyright"] {
  text-transform: uppercase !important;
  letter-spacing: 0.05em !important;
}
footer [class*="copyright"] a,
footer .copyright a {
  text-transform: uppercase !important;
  font-weight: 500 !important;
}
/* Center the utility row + tighten gap. */
.footer-utilities,
.footer-utilities__row,
.footer-utilities > div,
[class*="footer-utilities"],
[class*="footer-utilities"] > div {
  justify-content: center !important;
  text-align: center !important;
  gap: 1.5rem !important;
  flex-wrap: wrap !important;
  padding-top: 1.75rem !important;
  padding-bottom: 1.75rem !important;
}

/* ---------- 14. Shopify boilerplate hides (footer) ----------
   Horizon ships a "Powered by Shopify" link + a lowercase shop.name in the
   default copyright. Shop.name is read-only via Admin API (406). Easiest
   path: hide those elements entirely via CSS, then replace the copyright
   via our own footer-manifesto section content. */
.shopify-powered-by,
a[href*="shopify.com"][rel="nofollow"],
a[href*="www.shopify.com"],
.copyright__content--shopify,
[data-powered-by-shopify],
small.copyright__content a:last-child {
  display: none !important;
}

/* Also uppercase any rendered shop-name text that leaks into the footer. */
.copyright__content,
.copyright {
  text-transform: none;
}
.copyright__content a,
.copyright a,
small.copyright__content {
  /* Cannot force case on dynamic shop.name content via CSS alone. Founder
     needs to flip shop.name to HALF/LIFE in Shopify admin -> Store details. */
}
