/** Shopify CDN: Minification failed

Line 10595:2 Unexpected "/"

**/
/* ========================================
   REFLUX GOURMET — Custom Theme Stylesheet
   Fonts: Archivo Narrow (headings + body) + Libre Baskerville (overlines only)
   Type & color tokens are defined in layout/theme.liquid :root
   ======================================== */

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

html {
  scroll-behavior: smooth;
  -webkit-text-size-adjust: 100%
}

body {
  font-family: var(--font-body);
  font-size: var(--fs-body);
  font-weight: 400;
  line-height: 1.6;
  color: var(--color-text);
  background: var(--color-body-bg);
  overflow-x: hidden
}

img,
video {
  max-width: 100%;
  height: auto;
  display: block
}

a {
  color: inherit;
  text-decoration: none
}

button {
  cursor: pointer;
  font-family: inherit;
  border: none;
  background: none
}

ul,
ol {
  list-style: none
}

input,
textarea,
select {
  font-family: inherit;
  font-size: inherit
}

h1,
h2,
h3,
h4,
h5,
h6 {
  font-family: var(--font-heading);
  font-weight: 700;
  line-height: 1.2
}

/* Canonical type scale (Reflux Gourmet font kit). Sections may override
   per-design, but these are the defaults every heading inherits. */
h1 { font-size: clamp(34px, 6vw, var(--fs-h1)); }
h2 { font-size: clamp(30px, 5vw, var(--fs-h2)); }
h3 { font-size: clamp(24px, 3.5vw, var(--fs-h3)); }
h4 { font-size: clamp(20px, 2.5vw, var(--fs-h4)); font-weight: 500; }

/* ── Global overline / eyebrow lock-up ──────────────────────────────
   Single source of truth so the overline reads identically site-wide
   (DD: "overline copy and heading are wrong fonts / letterspacing is
   inconsistent — use 'Nature's Answer…' as the guide").
   Higher specificity than the per-section eyebrow rules so it wins
   without editing every section. Color stays section-controlled so
   overlines can sit on light or dark backgrounds. */
body [class$="__eyebrow"],
body [class*="__eyebrow "],
body [class$="__label"]:not(label),
body [class*="__label "]:not(label),
body [class$="__kicker"],
body .dyhr-eyebrow,
body .os-team__subtitle,
body .reflux-rescue__subheading,
body .overline {
  font-family: var(--font-heading);
  font-size: var(--fs-overline);
  font-weight: 600;
  letter-spacing: 2px;
  text-transform: uppercase;
  /* Comfortable leading so overlines that wrap to two lines can breathe.
     Single-line overlines are unaffected (spacing below is set by margin). */
  line-height: 1.8;
}


/* --- SKIP LINK --- */
.skip-to-content {
  position: absolute;
  top: -100%;
  left: 50%;
  transform: translateX(-50%);
  background: var(--color-primary);
  color: #fff;
  padding: 12px 24px;
  z-index: 9999;
  border-radius: 0 0 var(--radius-md) var(--radius-md);
  transition: top var(--transition-fast)
}

.skip-to-content:focus {
  top: 0
}

/* --- UTILITY --- */
.container {
  width: 100%;
  max-width: var(--container-width);
  margin: 0 auto;
  padding: 0 var(--gutter)
}

.container--narrow {
  max-width: var(--container-narrow)
}

.sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  border: 0
}

.text-center {
  text-align: center
}

/* --- BUTTONS --- */
.btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  padding: 14px 32px;
  font-family: var(--font-body);
  font-size: 14px;
  font-weight: 600;
  letter-spacing: 1.5px;
  text-transform: uppercase;
  border-radius: 0;
  transition: all var(--transition-base);
  cursor: pointer;
  border: 2px solid transparent;
  line-height: 1
}

.btn--primary {
  background: #000;
  color: #fff;
  border-color: #000
}

.btn--primary:hover {
  background: #000;
  border-color: #000;
  transform: translateY(-2px);
  box-shadow: var(--shadow-md)
}

.btn--secondary {
  background: transparent;
  color: var(--color-white);
  border-color: var(--color-white)
}

.btn--secondary:hover {
  background: var(--color-white);
  color: var(--color-dark)
}

.btn--dark {
  background: var(--color-dark);
  color: var(--color-white);
  border-color: var(--color-dark)
}

.btn--dark:hover {
  background: #333;
  transform: translateY(-2px);
  box-shadow: var(--shadow-md)
}

.btn--outline {
  background: transparent;
  color: #000;
  border-color: #000;
}

.btn--outline:hover {
  background: #000;
  color: #fff;
}

.btn--small {
  padding: 10px 24px;
  font-size: 12px
}

.btn--full {
  width: 100%
}

/* ========== HEADER ========== */
.site-header {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  z-index: 1000;
  background: #202020;
  border-bottom: 1px solid rgba(255, 255, 255, 0.08);
}

.site-header__bar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  max-width: 100%;
  padding: 0 36px;
  height: 85px;
}

.site-header__logo a {
  display: flex;
  align-items: center;
}

.site-header__logo img {
  height: 24px;
  width: auto;
  display: block;
  margin-top: 15px;
}

.site-header__logo-img {
  height: 20px;
  width: auto;
  display: block;
  filter: brightness(0) invert(1);
}

.site-header__logo-text {
  font-family: var(--font-body);
  font-size: 18px;
  font-weight: 700;
  color: #fff;
  letter-spacing: 3px;
  white-space: nowrap;
}

.site-header__nav {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 20px;
}

.site-header__nav a {
  color: rgba(255, 255, 255, 0.75);
  font-family: var(--font-body);
  font-size: 12px;
  font-weight: 400;
  letter-spacing: 0px;
  text-transform: uppercase;
  white-space: nowrap;
  transition: color 0.2s;
}

.site-header__nav a:hover {
  color: #fff;
}
.menu-container {
    display: flex;
    flex-direction: row;
    justify-content: space-around;
    gap: 30px;
}

/* Dropdown styling */
.site-header__dropdown-wrapper {
  position: relative;
  display: inline-flex;
  align-items: center;
}

.site-header__dropdown-trigger {
  cursor: pointer;
}

.site-header__dropdown-menu {
  position: absolute;
  top: 100%;
  left: 0;
  background: #000;
  min-width: 280px;
  padding: 16px 20px;
  display: flex;
  flex-direction: column;
  gap: 12px;
  opacity: 0;
  visibility: hidden;
  transform: translateY(8px);
  transition: all 0.25s ease;
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.3);
  z-index: 1001;
  margin-top: 12px;
}

.site-header__dropdown-wrapper:hover .site-header__dropdown-menu {
  opacity: 1;
  visibility: visible;
  transform: translateY(0);
}

.site-header__dropdown-menu a {
  font-family: var(--font-body);
  font-size: 16px;
  font-weight: 500;
  color: rgba(255, 255, 255, 0.7);
  text-decoration: none;
  text-transform: uppercase;
  letter-spacing: 0.3px;
  transition: color 0.2s;
  white-space: nowrap;
}

.site-header__dropdown-menu a:hover {
  color: #fff;
}

.site-header__actions {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 16px
}

.site-header__cart {
  position: relative;
  color: #fff;
  padding: 8px;
  border-radius: 50%;
  transition: background var(--transition-fast)
}

.site-header__cart:hover {
  background: rgba(255, 255, 255, 0.1)
}

.site-header__cart svg {
  width: 22px;
  height: 22px
}

.site-header__cart-count {
  position: absolute;
  top: 0;
  right: 0;
  background: var(--color-accent);
  color: var(--color-dark);
  font-size: 10px;
  font-weight: 700;
  width: 18px;
  height: 18px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center
}

.site-header__menu-toggle {
  display: none;
  color: #fff;
  padding: 8px
}

.site-header__menu-toggle svg {
  width: 24px;
  height: 24px
}

/* ── Header Responsive: 1600px ── */
@media (max-width: 1600px) {
  .site-header__bar {
    padding: 0 24px;
  }

  .site-header__nav {
    gap: 20px;
  }
}

/* ── Header Responsive: 1440px ── */
@media (max-width: 1440px) {
  .site-header__nav {
    gap: 15px;
  }

  .site-header__nav a {
    font-size: 13px;
    letter-spacing: 0.3px;
  }

  .site-header__dropdown-menu a {
    font-size: 14px;
  }
}

/* ── Header Responsive: 1340px — collapse to hamburger before the nav crowds the logo ── */
@media (max-width: 1340px) {
  .site-header__nav {
    display: none;
  }

  .site-header__menu-toggle {
    display: block;
  }

  .site-header__bar {
    padding: 0 24px;
    height: 72px;
  }

  .site-header__logo img {
    height: 20px;
  }

  .site-header__logo-img {
    height: 20px;
  }
}

/* ── Header Responsive: 768px — tablets ── */
@media (max-width: 1024px) {
  .site-header__bar {
    padding: 0 16px;
    height: 64px;
  }

  .site-header__logo img {
    height: 18px;
  }

  .site-header__logo-img {
    height: 18px;
  }

  .site-header__logo-text {
    font-size: 15px;
    letter-spacing: 2px;
  }

  .site-header__cart svg {
    width: 20px;
    height: 20px;
  }

  .site-header__cart-count {
    width: 16px;
    height: 16px;
    font-size: 9px;
  }

  .site-header__menu-toggle svg {
    width: 22px;
    height: 22px;
  }

  .mobile-nav {
    padding: 70px 20px 32px;
  }

  .mobile-nav a {
    font-size: 17px;
    padding: 14px 0;
  }

  .mobile-nav__close {
    top: 16px;
    right: 16px;
  }

  .mobile-nav__dropdown-menu a {
    font-size: 13px;
    padding: 10px 0;
  }
}

/* ── Header Responsive: 480px — small phones ── */
@media (max-width: 480px) {
  .site-header__bar {
    padding: 0 12px;
    height: 56px;
  }

  .site-header__logo img {
    height: 16px;
  }

  .site-header__logo-img {
    height: 16px;
  }

  .site-header__logo-text {
    font-size: 13px;
    letter-spacing: 1.5px;
  }

  .site-header__actions {
    gap: 10px;
  }

  .site-header__cart {
    padding: 6px;
  }

  .site-header__cart svg {
    width: 18px;
    height: 18px;
  }

  .site-header__cart-count {
    width: 14px;
    height: 14px;
    font-size: 8px;
  }

  .site-header__menu-toggle {
    padding: 6px;
  }

  .site-header__menu-toggle svg {
    width: 20px;
    height: 20px;
  }

  .mobile-nav {
    padding: 60px 16px 24px;
  }

  .mobile-nav a {
    font-size: 15px;
    padding: 12px 0;
  }

  .mobile-nav__close {
    top: 12px;
    right: 12px;
  }

  .mobile-nav__dropdown-menu {
    padding-left: 16px;
  }

  .mobile-nav__dropdown-menu a {
    font-size: 12px;
    padding: 8px 0;
  }
}

/* Mobile Nav */
.mobile-nav {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100dvh;
  background: var(--color-dark);
  z-index: 9998;
  transform: translateX(100%);
  transition: transform var(--transition-base);
  padding: 80px var(--gutter) 40px;
  overflow-y: auto;
  display: flex;
  flex-direction: column
}

.mobile-nav.is-open {
  transform: translateX(0)
}

.mobile-nav__close {
  position: absolute;
  top: 20px;
  right: 20px;
  color: #fff;
  padding: 8px
}

.mobile-nav__close svg {
  width: 24px;
  height: 24px
}

.mobile-nav a {
  display: block;
  color: #fff;
  font-size: 20px;
  font-weight: 600;
  letter-spacing: 1px;
  text-transform: uppercase;
  padding: 16px 0;
  border-bottom: 1px solid rgba(255, 255, 255, 0.08)
}

.mobile-nav__dropdown-wrapper {
  display: flex;
  flex-direction: column;
}

.mobile-nav__dropdown-menu {
  display: flex;
  flex-direction: column;
  padding-left: 20px;
  margin-top: -10px;
  margin-bottom: 10px;
}

.mobile-nav__dropdown-menu a {
  font-size: 14px;
  padding: 12px 0;
  border-bottom: none;
  opacity: 0.8;
}

/* ========== HERO ========== */
.hero {
  position: relative;
  min-height: 100vh;
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
  text-align: center;
  color: var(--color-white)
}

.hero__bg {
  position: absolute;
  inset: 0;
  z-index: 0
}

.hero__bg img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  /* Warm + brighten slightly to match the richer tone of the live vineyard hero. */
  filter: brightness(1.07) saturate(1.12) contrast(1.02);
}

.hero__overlay {
  position: absolute;
  inset: 0;
  background: transparent;
  z-index: 1
}

.hero__content {
  position: relative;
  z-index: 2;
  padding: 40px var(--gutter);
  max-width: 800px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center
}

.hero__logo-img {
  width: 100%;
  max-width: 800px;
  height: auto;
  margin-bottom: 80px;
  filter: drop-shadow(0 4px 12px rgba(0, 0, 0, 0.3))
}

.hero__title {
  font-family: var(--font-heading);
  font-size: clamp(36px, 6vw, 72px);
  font-weight: 700;
  letter-spacing: 6px;
  text-transform: uppercase;
  margin-bottom: 16px;
  text-shadow: 0 2px 20px rgba(0, 0, 0, 0.4)
}

.hero__subtitle {
  font-family: var(--font-body);
  font-size: clamp(14px, 2vw, 22px);
  font-weight: 600;
  letter-spacing: 3px;
  text-transform: uppercase;
  opacity: 1;
  text-shadow: 0 1px 10px rgba(0, 0, 0, 0.4)
}

.hero__scroll {
  position: absolute;
  bottom: 40px;
  left: 50%;
  transform: translateX(-50%);
  z-index: 2;
  animation: bounce 2s infinite
}

.hero__scroll svg {
  width: 28px;
  height: 28px;
  color: rgba(255, 255, 255, 0.7)
}

@keyframes bounce {

  0%,
  20%,
  50%,
  80%,
  100% {
    transform: translateX(-50%) translateY(0)
  }

  40% {
    transform: translateX(-50%) translateY(-10px)
  }

  60% {
    transform: translateX(-50%) translateY(-5px)
  }
}

/* ========== FEATURED PRODUCTS ========== */
.featured-products {
  padding: var(--section-spacing) 0;
  background: var(--color-body-bg)
}

.featured-products__header {
  text-align: center;
  margin-bottom: 48px
}

.featured-products__label {
  font-family: var(--font-body);
  font-size: 12px;
  font-weight: 600;
  letter-spacing: 3px;
  text-transform: uppercase;
  color: var(--color-accent);
  margin-bottom: 8px
}

.featured-products__title {
  font-size: clamp(28px, 4vw, 42px);
  color: var(--color-dark);
  margin-bottom: 16px
}

.featured-products__desc {
  font-size: 16px;
  color: var(--color-text-light);
  max-width: 640px;
  margin: 0 auto;
  line-height: 1.8
}

.featured-products__grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 32px;
  margin-top: 48px
}

/* ========== PRODUCT CARD ========== */
.product-card {
  background: var(--color-white);
  border-radius: var(--radius-lg);
  overflow: hidden;
  box-shadow: var(--shadow-sm);
  transition: all var(--transition-base);
  border: 1px solid var(--color-border)
}

.product-card:hover {
  transform: translateY(-6px);
  box-shadow: var(--shadow-lg)
}

.product-card__image {
  position: relative;
  aspect-ratio: 1/1;
  overflow: hidden;
  background: #f0ede6
}

.product-card__image img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform var(--transition-slow)
}

.product-card:hover .product-card__image img {
  transform: scale(1.05)
}

.product-card__badge {
  position: absolute;
  top: 12px;
  left: 12px;
  background: var(--color-accent);
  color: var(--color-dark);
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 1px;
  text-transform: uppercase;
  padding: 4px 12px;
  border-radius: var(--radius-sm)
}

.product-card__body {
  padding: 20px
}

.product-card__title {
  font-family: var(--font-heading);
  font-size: 16px;
  font-weight: 700;
  margin-bottom: 8px;
  color: var(--color-dark)
}

.product-card__price {
  font-family: var(--font-body);
  font-size: 18px;
  font-weight: 700;
  color: var(--color-primary);
  margin-bottom: 16px
}

.product-card__price s {
  color: var(--color-text-light);
  font-weight: 400;
  font-size: 14px;
  margin-left: 8px
}

.product-card__btn {
  width: 100%;
  padding: 12px;
  background: var(--color-dark);
  color: #fff;
  font-size: 12px;
  font-weight: 600;
  letter-spacing: 1.5px;
  text-transform: uppercase;
  border-radius: var(--radius-sm);
  transition: all var(--transition-fast);
  border: none;
  cursor: pointer
}

.product-card__btn:hover {
  background: var(--color-primary)
}

.product-card__btn.added {
  background: var(--color-primary)
}

/* ========== CLEAN PRODUCT CARD (MATCHING REFERENCE IMAGE) ========== */
.product-card--clean {
  background: transparent;
  border-radius: 0;
  border: none;
  box-shadow: none;
  display: flex;
  flex-direction: column;
  padding: 0;
  box-sizing: border-box;
  overflow: hidden;
}

.product-card--clean:hover {
  transform: none;
  box-shadow: none;
}

.product-card--clean .product-card__image {
  aspect-ratio: 3 / 4;
  background: linear-gradient(180deg, #1fa4a2 0%, #0d7b7e 100%);
  border-radius: 0;
  overflow: hidden;
  display: flex;
  align-items: center;
  justify-content: center;
  position: relative;
}

.product-card--clean .product-card__image img {
  width: 100%;
  height: 100%;
  object-fit: contain;
  padding: 4% 10%;
  box-sizing: border-box;
  transition: transform var(--transition-slow);
}

.product-card--clean:hover .product-card__image img {
  transform: scale(1.03);
}

.product-card--clean .product-card__body {
  background: #182628;
  padding: 12px 16px 14px;
  text-align: left;
  border-radius: 0;
  box-sizing: border-box;
}

.product-card--clean .product-card__title {
  font-family: var(--font-body);
  font-size: 14px;
  font-weight: 700;
  color: #ffffff;
  margin: 0 0 2px;
  text-transform: none;
  letter-spacing: 0.2px;
  line-height: 1.3;
}

.product-card--clean .product-card__body a {
  text-decoration: none;
}

.product-card--clean .product-card__desc {
  font-family: var(--font-body);
  font-size: 11px;
  color: #5bbcb8;
  margin: 0;
  line-height: 1.3;
  letter-spacing: 0.2px;
}

/* Hide price and buttons in clean layout */
.product-card--clean .product-card__price,
.product-card--clean .product-card__btn,
.product-card--clean .product-card__badge {
  display: none !important;
}

/* ========== CTA BANNER ========== */
.cta-banner {
  padding: 40px 0;
  background: var(--color-accent);
  text-align: center
}

.cta-banner__inner {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 24px;
  flex-wrap: wrap
}

.cta-banner__text {
  font-family: var(--font-heading);
  font-size: clamp(18px, 3vw, 28px);
  color: var(--color-dark);
  font-weight: 700
}

.cta-banner .btn {
  background: var(--color-dark);
  color: #fff;
  border-color: var(--color-dark)
}

.cta-banner .btn:hover {
  background: #333
}

/* ========== STORY SECTION ========== */
.story-section {
  padding: var(--section-spacing) 0;
  background: var(--color-white)
}

.story-section__inner {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 64px;
  align-items: center
}

.story-section__images {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 16px
}

.story-section__images img {
  border-radius: var(--radius-md);
  width: 100%;
  height: 100%;
  object-fit: cover
}

.story-section__content {
  padding: 20px 0
}

.story-section__label {
  font-size: 12px;
  font-weight: 600;
  letter-spacing: 3px;
  text-transform: uppercase;
  color: var(--color-accent);
  margin-bottom: 12px
}

.story-section__title {
  font-size: clamp(28px, 3.5vw, 40px);
  color: var(--color-dark);
  margin-bottom: 20px;
  line-height: 1.3
}

.story-section__text {
  font-size: 16px;
  color: var(--color-text-light);
  line-height: 1.8;
  margin-bottom: 32px
}

/* ========== LIFESTYLE BANNER ========== */
.lifestyle-banner {
  position: relative;
  min-height: 500px;
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
  text-align: center
}

.lifestyle-banner__bg {
  position: absolute;
  inset: 0
}

.lifestyle-banner__bg img {
  width: 100%;
  height: 100%;
  object-fit: cover
}

.lifestyle-banner__overlay {
  position: absolute;
  inset: 0;
  background: rgba(0, 0, 0, 0.35)
}

.lifestyle-banner__content {
  position: relative;
  z-index: 2;
  color: #fff;
  padding: 40px
}

.lifestyle-banner__title {
  font-size: clamp(28px, 4vw, 48px);
  margin-bottom: 24px;
  text-shadow: 0 2px 12px rgba(0, 0, 0, 0.4)
}

/* ========== GOLDEN COMFORT ========== */
.golden-comfort {
  padding: var(--section-spacing) 0;
  background: var(--color-dark);
  color: var(--color-white)
}

.golden-comfort__header {
  text-align: center;
  margin-bottom: 48px
}

.golden-comfort__label {
  font-size: 12px;
  font-weight: 600;
  letter-spacing: 3px;
  text-transform: uppercase;
  color: var(--color-accent);
  margin-bottom: 8px
}

.golden-comfort__title {
  font-size: clamp(28px, 4vw, 42px)
}

.golden-comfort__desc {
  font-size: 16px;
  color: rgba(255, 255, 255, 0.7);
  max-width: 640px;
  margin: 16px auto 0;
  line-height: 1.8
}

.golden-comfort__grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 24px
}

.golden-comfort__item {
  background: var(--color-dark-alt);
  border-radius: var(--radius-md);
  overflow: hidden;
  border: 1px solid rgba(255, 255, 255, 0.08);
  transition: all var(--transition-base)
}

.golden-comfort__item:hover {
  transform: translateY(-4px);
  border-color: var(--color-accent)
}

.golden-comfort__item img {
  width: 100%;
  aspect-ratio: 1/1;
  object-fit: cover
}

.golden-comfort__item-title {
  padding: 16px;
  font-family: var(--font-body);
  font-size: 14px;
  font-weight: 600;
  text-align: center;
  letter-spacing: 0.5px
}

/* ========== PRODUCT GRID ========== */
.product-grid-section {
  padding: var(--section-spacing) 0;
  background: var(--color-body-bg)
}

.product-grid-section__header {
  text-align: center;
  margin-bottom: 48px
}

.product-grid-section__title {
  font-size: clamp(28px, 4vw, 42px);
  color: var(--color-dark)
}

.product-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 28px
}

/* ========== WEDGE PILLOW ========== */
.wedge-pillow {
  padding: var(--section-spacing) 0;
  background: var(--color-white)
}

.wedge-pillow__inner {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 64px;
  align-items: center
}

.wedge-pillow__image {
  border-radius: var(--radius-lg);
  overflow: hidden
}

.wedge-pillow__image img {
  width: 100%;
  height: auto
}

.wedge-pillow__content {
  padding: 20px 0
}

.wedge-pillow__label {
  font-size: 12px;
  font-weight: 600;
  letter-spacing: 3px;
  text-transform: uppercase;
  color: var(--color-accent);
  margin-bottom: 12px
}

.wedge-pillow__title {
  font-size: clamp(28px, 3.5vw, 40px);
  color: var(--color-dark);
  margin-bottom: 20px;
  line-height: 1.3
}

.wedge-pillow__text {
  font-size: 16px;
  color: var(--color-text-light);
  line-height: 1.8;
  margin-bottom: 32px
}

/* ========== FOOTER ========== */
.site-footer {
  background: var(--color-dark);
  color: rgba(255, 255, 255, 0.7);
  padding: 64px 0 32px
}

.site-footer__inner {
  display: grid;
  grid-template-columns: 2fr 1fr 1fr 1fr;
  gap: 48px;
  margin-bottom: 48px
}

.site-footer__brand {
  font-family: var(--font-heading);
  font-size: 22px;
  font-weight: 700;
  color: #fff;
  letter-spacing: 2px;
  margin-bottom: 16px
}

.site-footer__about {
  font-size: 14px;
  line-height: 1.8;
  color: rgba(255, 255, 255, 0.6)
}

.site-footer__heading {
  font-family: var(--font-body);
  font-size: 13px;
  font-weight: 700;
  letter-spacing: 2px;
  text-transform: uppercase;
  color: var(--color-accent);
  margin-bottom: 20px
}

.site-footer__links a {
  display: block;
  font-size: 14px;
  color: rgba(255, 255, 255, 0.6);
  padding: 6px 0;
  transition: color var(--transition-fast)
}

.site-footer__links a:hover {
  color: #fff
}

.site-footer__bottom {
  border-top: 1px solid rgba(255, 255, 255, 0.08);
  padding-top: 24px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  font-size: 13px
}

.site-footer__social {
  display: flex;
  gap: 16px
}

.site-footer__social a {
  color: rgba(255, 255, 255, 0.5);
  transition: color var(--transition-fast)
}

.site-footer__social a:hover {
  color: var(--color-accent)
}

/* ========== MAIN PRODUCT ========== */
.product-page {
  padding: calc(var(--header-height) + 40px) 0 var(--section-spacing)
}

.product-page__inner {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 64px;
  align-items: start
}

.product-page__gallery {
  position: sticky;
  top: calc(var(--header-height) + 24px)
}

.product-page__main-image {
  border-radius: var(--radius-lg);
  overflow: hidden;
  background: #f0ede6;
  aspect-ratio: 1/1
}

.product-page__main-image img {
  width: 100%;
  height: 100%;
  object-fit: cover
}

.product-page__thumbnails {
  display: flex;
  gap: 12px;
  margin-top: 16px
}

.product-page__thumb {
  width: 80px;
  height: 80px;
  border-radius: var(--radius-md);
  overflow: hidden;
  border: 2px solid transparent;
  cursor: pointer;
  transition: border-color var(--transition-fast)
}

.product-page__thumb.active,
.product-page__thumb:hover {
  border-color: var(--color-accent)
}

.product-page__thumb img {
  width: 100%;
  height: 100%;
  object-fit: cover
}

.product-page__info {
  padding-top: 20px
}

.product-page__title {
  font-size: clamp(28px, 3vw, 40px);
  margin-bottom: 12px;
  color: var(--color-dark)
}

.product-page__price {
  font-size: 28px;
  font-weight: 700;
  color: var(--color-primary);
  margin-bottom: 24px
}

.product-page__price s {
  font-size: 18px;
  color: var(--color-text-light);
  font-weight: 400;
  margin-left: 12px
}

.product-page__desc {
  font-size: 16px;
  color: var(--color-text-light);
  line-height: 1.8;
  margin-bottom: 32px
}

.product-page__variants {
  margin-bottom: 24px
}

.product-page__variant-label {
  font-size: 13px;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 1px;
  margin-bottom: 8px;
  color: var(--color-text)
}

.product-page__variant-select {
  width: 100%;
  padding: 12px 16px;
  border: 1px solid var(--color-border);
  border-radius: var(--radius-sm);
  font-size: 15px;
  background: #fff;
  appearance: none
}

.product-page__quantity {
  display: flex;
  align-items: center;
  gap: 12px;
  margin-bottom: 24px
}

.product-page__qty-btn {
  width: 40px;
  height: 40px;
  border: 1px solid var(--color-border);
  border-radius: var(--radius-sm);
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 18px;
  transition: all var(--transition-fast)
}

.product-page__qty-btn:hover {
  border-color: var(--color-primary);
  background: var(--color-primary);
  color: #fff
}

.product-page__qty-input {
  width: 60px;
  height: 40px;
  text-align: center;
  border: 1px solid var(--color-border);
  border-radius: var(--radius-sm);
  font-size: 16px
}

/* ========== COLLECTION PAGE ========== */
.collection-page {
  padding: calc(var(--header-height) + 40px) 0 var(--section-spacing)
}

.collection-page__header {
  text-align: center;
  margin-bottom: 48px
}

.collection-page__title {
  font-size: clamp(32px, 4vw, 48px);
  color: var(--color-dark);
  margin-bottom: 12px
}

.collection-page__desc {
  font-size: 16px;
  color: var(--color-text-light);
  max-width: 640px;
  margin: 0 auto
}

/* ========== CART PAGE ========== */
.cart-page {
  padding: calc(var(--header-height) + 40px) 0 var(--section-spacing)
}

.cart-page__title {
  font-size: clamp(32px, 4vw, 48px);
  color: var(--color-dark);
  text-align: center;
  margin-bottom: 48px
}

.cart-page__empty {
  text-align: center;
  padding: 80px 0
}

.cart-page__empty p {
  font-size: 18px;
  color: var(--color-text-light);
  margin-bottom: 24px
}

.cart-page__table {
  width: 100%;
  border-collapse: collapse
}

.cart-page__table th {
  font-size: 12px;
  font-weight: 600;
  letter-spacing: 1.5px;
  text-transform: uppercase;
  color: var(--color-text-light);
  padding: 16px 0;
  border-bottom: 1px solid var(--color-border);
  text-align: left
}

.cart-page__table td {
  padding: 24px 0;
  border-bottom: 1px solid var(--color-border);
  vertical-align: middle
}

.cart-page__item {
  display: flex;
  align-items: center;
  gap: 16px
}

.cart-page__item-img {
  width: 80px;
  height: 80px;
  border-radius: var(--radius-md);
  overflow: hidden;
  flex-shrink: 0
}

.cart-page__item-img img {
  width: 100%;
  height: 100%;
  object-fit: cover
}

.cart-page__item-title {
  font-family: var(--font-heading);
  font-size: 15px;
  font-weight: 700;
  color: var(--color-dark)
}

.cart-page__footer {
  display: flex;
  justify-content: flex-end;
  padding-top: 32px
}

.cart-page__summary {
  width: 360px
}

.cart-page__subtotal {
  display: flex;
  justify-content: space-between;
  font-size: 18px;
  font-weight: 700;
  margin-bottom: 24px;
  color: var(--color-dark)
}

/* ========== CART DRAWER ========== */
.cart-drawer {
  position: fixed;
  inset: 0;
  z-index: 9999;
  pointer-events: none
}

.cart-drawer.is-open {
  pointer-events: all
}

.cart-drawer__overlay {
  position: absolute;
  inset: 0;
  background: rgba(0, 0, 0, 0.5);
  opacity: 0;
  transition: opacity var(--transition-base)
}

.cart-drawer.is-open .cart-drawer__overlay {
  opacity: 1
}

.cart-drawer__content {
  position: absolute;
  top: 0;
  right: 0;
  width: 420px;
  max-width: 90vw;
  height: 100%;
  background: #fff;
  transform: translateX(100%);
  transition: transform var(--transition-base);
  display: flex;
  flex-direction: column
}

.cart-drawer.is-open .cart-drawer__content {
  transform: translateX(0)
}

.cart-drawer__header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 20px 24px;
  border-bottom: 1px solid var(--color-border)
}

.cart-drawer__title {
  font-family: var(--font-heading);
  font-size: 20px;
  font-weight: 700
}

.cart-drawer__close {
  padding: 8px
}

.cart-drawer__close svg {
  width: 20px;
  height: 20px
}

.cart-drawer__items {
  flex: 1;
  overflow-y: auto;
  padding: 24px
}

.cart-drawer__empty {
  text-align: center;
  padding: 60px 0;
  color: var(--color-text-light)
}

.cart-drawer__line-item {
  display: flex;
  gap: 16px;
  padding: 16px 0;
  border-bottom: 1px solid var(--color-border)
}

.cart-drawer__line-img {
  width: 72px;
  height: 72px;
  border-radius: var(--radius-md);
  overflow: hidden;
  flex-shrink: 0;
  background: #f0ede6
}

.cart-drawer__line-img img {
  width: 100%;
  height: 100%;
  object-fit: cover
}

.cart-drawer__line-info {
  flex: 1
}

.cart-drawer__line-title {
  font-size: 14px;
  font-weight: 600;
  margin-bottom: 4px
}

.cart-drawer__line-price {
  font-size: 14px;
  color: var(--color-primary);
  font-weight: 700
}

.cart-drawer__line-remove {
  font-size: 12px;
  color: var(--color-text-light);
  text-decoration: underline;
  cursor: pointer;
  margin-top: 8px;
  background: none;
  border: none;
  padding: 0
}

.cart-drawer__qty-controls {
  display: flex;
  align-items: center;
  gap: 0;
  margin-top: 10px;
  margin-bottom: 4px
}

.cart-drawer__qty-btn {
  width: 32px;
  height: 32px;
  border: 1px solid var(--color-border);
  background: #fff;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 16px;
  font-weight: 600;
  cursor: pointer;
  transition: all var(--transition-fast);
  color: var(--color-text);
  line-height: 1;
  padding: 0
}

.cart-drawer__qty-btn:first-child {
  border-radius: var(--radius-sm) 0 0 var(--radius-sm)
}

.cart-drawer__qty-btn:last-child {
  border-radius: 0 var(--radius-sm) var(--radius-sm) 0
}

.cart-drawer__qty-btn:hover {
  background: var(--color-dark);
  border-color: var(--color-dark);
  color: #fff
}

.cart-drawer__qty-value {
  width: 40px;
  height: 32px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 14px;
  font-weight: 600;
  border-top: 1px solid var(--color-border);
  border-bottom: 1px solid var(--color-border);
  background: #fafaf5;
  color: var(--color-text)
}

.cart-drawer__footer {
  padding: 20px 24px;
  border-top: 1px solid var(--color-border);
  background: #fafaf5
}

.cart-drawer__subtotal {
  display: flex;
  justify-content: space-between;
  font-size: 16px;
  font-weight: 700;
  margin-bottom: 16px
}

.cart-drawer__footer .btn--dark {
  background: #000;
  color: #fff;
  border-color: #000;
  text-align: center;
  display: block;
  padding: 14px 24px;
  font-size: 15px
}

.cart-drawer__footer .btn--dark:hover {
  background: #222;
  border-color: #222
}


/* ========== 404 PAGE ========== */
.page-404 {
  padding: calc(var(--header-height) + 80px) 0 var(--section-spacing);
  text-align: center
}

.page-404__title {
  font-size: clamp(48px, 8vw, 120px);
  color: var(--color-accent);
  margin-bottom: 16px
}

.page-404__text {
  font-size: 20px;
  color: var(--color-text-light);
  margin-bottom: 32px
}

/* ========== REFLUX RESCUE ========== */
.reflux-rescue {
  width: 100%;
}

.reflux-rescue__inner {
  display: grid;
  grid-template-columns: 1fr 1fr;
  width: 100%;
}

.reflux-rescue__text-col {
  padding: 80px 40px;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #fff;
  text-align: center;
}

/* .reflux-rescue__content {
  max-width: 685px;
} */

.reflux-rescue__subheading {
  font-family: var(--font-heading) !important;
  font-size: 24px;
  font-weight: 700;
  letter-spacing: 1px;
  margin-bottom: 16px;
  text-align: left;
}

.reflux-rescue__title {
  font-family: var(--font-body);
  font-size: clamp(36px, 5vw, 50px);
  font-weight: 400;
  margin-bottom: 24px;
  line-height: 1.2;
  text-align: left;
}

.reflux-rescue__text {
  font-family: var(--font-body);
  font-size: 22px;
  line-height: 1.2;
  margin-bottom: 40px;
  text-align: left;
}

.reflux-rescue__bottom {
  margin: 40px auto;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
}

.reflux-rescue__subheading-small {
  font-family: var(--font-body);
  font-size: 16px;
  margin-bottom: 0px;
}

.reflux-rescue__link {
  font-family: var(--font-body);
  font-size: var(--fs-body);
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 1px;
  color: #fff;
  text-decoration: none;
  border-bottom: 2px solid;
}

.reflux-rescue__link .reflux-rescue__subheading-small {
  font-family: var(--font-body);
  font-size: var(--fs-body);
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 1px;
  color: #fff;
  text-decoration: none;
  border-bottom: none;
}

.reflux-rescue__media-col {
  background: #1c2122;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 10% 6%;
}

.reflux-rescue__media-inner {
  width: 100%;
  max-width: 700px;
  height: 360px;
}

video {
  max-width: 100%;
  height: 100%;
  display: block;
}

.reflux-rescue__media-inner img {
  width: 100%;
  height: auto;
  display: block;
}

/* ========== ALGINATE THERAPY ========== */
.alginate-therapy {
  position: relative;
  padding: 120px 0;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #fff;
  text-align: center;
  overflow: hidden;
}

.alginate-therapy__bg {
  position: absolute;
  inset: 0;
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  z-index: 0;
}

.alginate-therapy__inner {
  position: relative;
  z-index: 2;
  max-width: 870px;
  margin: 0 auto;
}

.alginate-therapy__text {
  font-family: var(--font-body);
  font-size: clamp(20px, 3vw, 32px);
  line-height: 1.5;
  font-weight: 400;
}

.alginate-therapy__text p {
  margin-bottom: 0;
}


/* ========== PRODUCT FEATURES ========== */
.product-features {
  width: 100%;
}

.product-features__grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  width: 100%;
}

.product-features__item {
  display: flex;
  flex-direction: column;
}

.product-features__image-link {
  position: relative;
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  background-size: cover;
  background-position: center;
  padding: 0px;
  overflow: hidden;
  text-decoration: none;
}

.product-features__image-link::after {
  content: "";
  position: absolute;
  inset: 0;
  background: rgba(0, 0, 0, 0.45);
  opacity: 0;
  transition: opacity 0.35s ease;
  pointer-events: none;
  z-index: 99;
}

.product-features__item:hover .product-features__image-link::after {
  opacity: 0.5;
}

.product-features__img {
  width: 100%;
  /* height: 100%; */
  /* max-height: 100%; */
  object-fit: cover;
  transition: transform 0.4s ease;
  position: relative;
  z-index: 2;
  height: 800px;
}

/* .product-features__item:hover .product-features__img {
  transform: scale(0.95);
} */

.product-features__info {
  background: #d8f3ec;
  padding: 50px 32px 20px 32px;
  flex: 1;
  display: none;
  flex-direction: column;
}

.product-features__title-link {
  text-decoration: none;
  color: inherit;
}

.product-features__title-link:hover {
  color: inherit;
}

.product-features__title {
  font-family: var(--font-body);
  font-size: 36px;
  font-weight: 700;
  margin-bottom: 12px;
  color: var(--color-dark);
}

.product-features__desc {
  font-family: var(--font-body);
  font-size: 19px;
  font-weight: 400;
  line-height: 1.2;
  color: var(--color-text);
  margin-bottom: 24px;
  flex: 1;
  max-width: 400px;
}

.product-features__bottom {
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.product-features__price {
  font-family: var(--font-body);
  font-size: 24px;
  font-weight: 700;
  color: var(--color-dark);
}

.product-features__btn {
  display: inline-block;
  background: #25282a;
  color: #fff;
  font-family: var(--font-body);
  font-size: 18px;
  font-weight: 600;
  padding: 12px 24px;
  border-radius: 0px;
  border: none;
  cursor: pointer;
  text-decoration: none;
  text-align: center;
  transition: background var(--transition-fast);
}

.product-features__btn:hover {
  background: #000;
  color: #fff;
}

/* ========== SCROLL ANIMATIONS ========== */
.reveal {
  opacity: 0;
  transform: translateY(30px);
  transition: opacity 0.6s ease, transform 0.6s ease
}

.reveal.is-visible {
  opacity: 1;
  transform: translateY(0)
}

/* ========== RESPONSIVE ========== */

@media(min-width:1921px) {
  .product-features__img {
      width: 100%;
      object-fit: cover;
      transition: transform .4s ease;
      position: relative;
      z-index: 2;
      height: 1100px;
  }
}
@media(max-width:1440px) {
  .product-features__img {
      width: 100%;
      object-fit: cover;
      transition: transform .4s ease;
      position: relative;
      z-index: 2;
      height: 650px;
  }
}
@media(max-width:1024px) {
  .site-header__nav {
    display: none
  }

  .site-header__menu-toggle {
    display: block
  }

  .site-header__inner {
    padding: 12px var(--gutter)
  }

  .site-header__logo a {
    font-size: 20px;
    letter-spacing: 2px
  }

  .reflux-rescue__inner {
    grid-template-columns: 1fr;
  }

  .product-features__grid {
    grid-template-columns: 1fr;
  }

  .featured-products__grid {
    grid-template-columns: 1fr;
    gap: 24px
  }

  .golden-comfort__grid {
    grid-template-columns: repeat(2, 1fr)
  }

  .product-grid {
    grid-template-columns: repeat(2, 1fr)
  }

  .story-section__inner {
    grid-template-columns: 1fr;
    gap: 40px
  }

  .wedge-pillow__inner {
    grid-template-columns: 1fr;
    gap: 40px
  }

  .product-page__inner {
    grid-template-columns: 1fr;
    gap: 40px
  }

  .product-page__gallery {
    position: static
  }

  .site-footer__inner {
    grid-template-columns: 1fr
  }
  .product-features__img {
      height: 100%;
  }
}

@media(max-width:640px) {
  :root {
    --section-spacing: 56px;
    --gutter: 16px
  }

  .featured-products__grid {
    grid-template-columns: 1fr
  }

  .golden-comfort__grid {
    grid-template-columns: 1fr 1fr
  }

  .product-grid {
    grid-template-columns: 1fr 1fr;
    gap: 16px
  }

  .site-footer__inner {
    grid-template-columns: 1fr
  }

  .site-footer__bottom {
    flex-direction: column;
    gap: 16px;
    text-align: center
  }

  .cart-page__table th:nth-child(3),
  .cart-page__table td:nth-child(3) {
    display: none
  }

  .hero__title {
    letter-spacing: 3px
  }
}



/* ========== PRODUCT PAGE 3 COL LAYOUT ========== */
.product-page-3col {
  padding: 150px 0;
  background: var(--color-white);
}

.product-page-3col__inner {
  display: grid;
  grid-template-columns: 1fr 1fr 1fr;
  gap: 40px;
  align-items: start;
  max-width: 100% !important;
  margin: 0 auto;
  padding: 0 60px;
}

/* Left Column */
.product-page-3col__left {
  position: sticky;
  top: 100px;
}

.product-page-3col__title {
  font-family: var(--font-body);
  font-size: 32px;
  font-weight: 700;
  color: var(--color-dark);
  margin-bottom: 8px;
  line-height: 1.2;
}
/* Main headline */
.product-page-3col__title {
  font-size: 52px;
  font-weight: 700;
  letter-spacing: -0.5px;
  line-height: 1.1;
  text-transform: capitilize;
  color: #1a1a1a;
  width: 64%;
}
.title-light { color: #ffffff; }

.product-page-3col__price {
  font-family: var(--font-body);
  font-size: 32px;
  font-weight: 700;
  color: var(--color-dark);
  margin-bottom: 16px;
  margin-top: 10px;
}

.product-page-3col__price s {
  color: var(--color-text-light);
  font-size: 16px;
  margin-left: 8px;
}

.product-page-3col__desc {
  font-size: 14px;
  line-height: 1.6;
  color: var(--color-text);
  margin-bottom: 24px;
}

/* Form Row */
.product-page-3col__form-row {
  display: flex;
  gap: 12px;
  margin-bottom: 24px;
  width: 145px;
}

.product-page-3col__quantity {
  display: none;
  align-items: center;
  background: #f0f0f0;
  border-radius: 4px;
  overflow: hidden;
  width: 100px;
}

.product-page-3col__quantity .qty-btn {
  width: 32px;
  height: 40px;
  background: #666;
  color: #fff;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 18px;
  border: none;
  cursor: pointer;
}

.product-page-3col__quantity .qty-input {
  width: calc(100% - 64px);
  height: 40px;
  border: none;
  text-align: center;
  font-family: var(--font-body);
  font-size: 14px;
  background: transparent;
  color: #fff;
  padding: 0;
  -moz-appearance: textfield;
}

.product-page-3col__quantity .qty-input::-webkit-outer-spin-button,
.product-page-3col__quantity .qty-input::-webkit-inner-spin-button {
  -webkit-appearance: none;
  margin: 0;
}

/* Center background of quantity to be dark */
.product-page-3col__quantity {
  background: #666;
}

.btn--add-to-cart {
  flex: 1;
  background: #000;
  color: #fff;
  text-transform: uppercase;
  font-weight: 700;
  letter-spacing: 1px;
  border-radius: 0;
  padding: 0 24px;
  height: 40px;
}

/* Center Column */
.product-page-3col__center {
  display: flex;
  flex-direction: column;
  gap: 20px;
}

.product-page-3col__media-item img {
  width: 100%;
  height: auto;
  display: block;
  /* White-background product PNGs carry a faint anti-aliased edge that reads as
     a thin grey hairline against the white page. Shaving 1px clips that fringe. */
  clip-path: inset(1px);
}

/* Supplement Facts override (Product Info & Ingredients accordion) */
.supfacts {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 16px;
}

.supfacts__img {
  width: 100%;
  max-width: 480px;
  height: auto;
  display: block;
  margin: 0 auto;
}

/* Landscape facts panels (e.g. gum) need the full column width to stay legible. */
.supfacts--wide .supfacts__img {
  max-width: 100%;
}

/* Right Column & Text Blocks */
.product-page-3col__right {
  position: sticky;
  top: 100px;
  display: flex;
  flex-direction: column;
  gap: 24px;
}

.product-page-3col__subheading {
  font-family: var(--font-body);
  font-size: 20px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 1px;
  color: var(--color-dark);
  margin-bottom: 0px;
}

.product-page-3col__text {
  font-size: 20px;
  line-height: 1.6;
  color: #000;
}

.product-page-3col__text p {
  margin-bottom: 8px;
}

.product-page-3col__text p:last-child {
  margin-bottom: 0;
}

.product-page-3col__image-block img {
  width: 100%;
  height: auto;
  display: block;
  border: 1px solid #ddd;
}

/* ═══════════════════════════════════════════════
   PRODUCT ACCORDION — Right Column
   ═══════════════════════════════════════════════ */
.product-accordion {
  display: flex;
  flex-direction: column;
  width: 100%;
}

.product-accordion__item {
  border: 1px solid var(--color-border, #E0DCD4);
}

.product-accordion__item:first-child {
  border: 1px solid var(--color-border, #E0DCD4);
}

.product-accordion__trigger {
  display: flex;
  align-items: center;
  justify-content: space-between;
  width: 100%;
  padding: 20px 20px;
  background: none;
  border: none;
  cursor: pointer;
  font-family: var(--font-body);
  text-align: left;
  transition: color 0.2s ease;
}

/* .product-accordion__trigger:hover {
  color: var(--color-primary, #1EAB93);
} */

.product-accordion__trigger-text {
  font-family: var(--font-body);
  font-size: 18px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 1px;
  color: var(--color-dark, #000000ff);
  line-height: 1.3;
}

/* .product-accordion__trigger:hover .product-accordion__trigger-text {
  color: var(--color-primary, #1EAB93);
} */

.product-accordion__chevron {
  flex-shrink: 0;
  width: 18px;
  height: 18px;
  color: var(--color-text-light, #666);
  transition: transform 0.3s ease;
  margin-left: 12px;
}

.product-accordion__item.is-open .product-accordion__chevron {
  transform: rotate(180deg);
}

/* Panel: collapsed by default, animated open */
.product-accordion__panel {
  max-height: 0;
  overflow: hidden;
  transition: max-height 0.35s ease;
}

.product-accordion__panel-inner {
  padding: 0 24px;
  font-family: var(--font-body);
  font-size: var(--fs-body);
  line-height: var(--lh-body);
  color: var(--color-text, #333);
}

.product-accordion__panel-inner p {
  margin: 0 0 10px;
}

.product-accordion__panel-inner p:last-child {
  margin-bottom: 0;
}

.product-accordion__panel-inner img {
  width: 100%;
  height: auto;
  display: block;
  border-radius: var(--radius-sm, 4px);
  margin: 8px 0;
}

.product-accordion__panel-inner ul,
.product-accordion__panel-inner ol {
  padding-left: 20px;
  margin: 8px 0;
}

.product-accordion__panel-inner li {
  margin-bottom: 6px;
  list-style: disc;
}

.product-accordion__panel-inner ol li {
  list-style: decimal;
}

.product-accordion__panel-inner a {
  color: var(--color-primary, #1EAB93);
  text-decoration: underline;
  text-underline-offset: 2px;
}

/* Responsive */
@media(max-width: 1024px) {
  .product-page-3col__inner {
    grid-template-columns: 1fr;
    gap: 32px;
  }

  .product-page-3col__left,
  .product-page-3col__right {
    position: static;
  }
}

/* ========== FAQ SECTION ========== */
.faq-section {
  padding: 48px 0 40px;
  background: #1a1a1a;
}

/* Accordion */
.faq-accordion {
  max-width: 960px;
  margin: 0 auto;
}

.faq-accordion__item {
  border-bottom: 1px solid rgba(255, 255, 255, 0.1);
}

.faq-accordion__item:first-child {
  border-top: 1px solid rgba(255, 255, 255, 0.1);
}

.faq-accordion__trigger {
  display: flex;
  align-items: flex-start;
  gap: 12px;
  width: 100%;
  padding: 16px 4px;
  text-align: left;
  font-family: var(--font-body);
  font-size: 13px;
  font-weight: 600;
  color: rgba(255, 255, 255, 0.9);
  background: none;
  border: none;
  cursor: pointer;
  transition: color var(--transition-fast);
  line-height: 1.5;
  letter-spacing: 0.3px;
  text-transform: uppercase;
}

.faq-accordion__trigger:hover {
  color: #2D9B7A;
}

.faq-accordion__icon {
  flex-shrink: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #2D9B7A;
  margin-top: 2px;
  transition: transform var(--transition-base);
}

.faq-accordion__item.is-open .faq-accordion__icon {
  transform: rotate(180deg);
}

.faq-accordion__panel {
  max-height: 0;
  overflow: hidden;
  transition: max-height 0.4s ease;
}

.faq-accordion__item.is-open .faq-accordion__panel {
  max-height: 800px;
}

.faq-accordion__answer {
  padding: 0 4px 20px 28px;
  font-family: var(--font-body);
  font-size: 14px;
  color: rgba(255, 255, 255, 0.65);
  line-height: 1.8;
}

.faq-accordion__answer p {
  margin-bottom: 10px;
}

.faq-accordion__answer p:last-child {
  margin-bottom: 0;
}

.faq-accordion__answer a {
  color: #2D9B7A;
  text-decoration: underline;
}

.faq-accordion__answer a:hover {
  color: var(--color-accent);
}

/* FAQ Responsive */
@media (max-width: 1024px) {
  .faq-hero {
    min-height: 220px;
  }

  .faq-hero__title {
    letter-spacing: 3px;
  }

  .faq-section {
    padding: 32px 0 24px;
  }

  .faq-accordion__trigger {
    font-size: 12px;
    padding: 14px 0;
  }

  .faq-accordion__answer {
    font-size: 13px;
    padding: 0 0 16px 26px;
  }
}

/* ========== FAQ PRODUCTS GRID ========== */
.faq-products {
  background: #1a1a1a;
  padding: 40px 40px 0;
}

.faq-products__grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 6px;
  max-width: 1200px;
  margin: 0 auto;
}

.faq-products__item {
  display: block;
  overflow: hidden;
  position: relative;
  aspect-ratio: 1 / 1;
}

.faq-products__item img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  transition: transform 0.5s ease;
}

.faq-products__item:hover img {
  transform: scale(1.05);
}

.faq-products__cta {
  text-align: center;
  padding: 40px 0;
  background: #1a1a1a;
}

.faq-products__btn {
  display: inline-block;
  padding: 14px 40px;
  background: #2D9B7A;
  color: #fff;
  font-family: var(--font-body);
  font-size: 13px;
  font-weight: 700;
  letter-spacing: 2px;
  text-transform: uppercase;
  text-decoration: none;
  border: none;
  border-radius: 3px;
  cursor: pointer;
  transition: all var(--transition-base);
}

.faq-products__btn:hover {
  background: #248a6b;
  transform: translateY(-2px);
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.3);
}

@media (max-width: 1024px) {
  .faq-products {
    padding: 24px 24px 0;
  }

  .faq-products__grid {
    grid-template-columns: 1fr;
    gap: 4px;
  }
}

@media (max-width: 480px) {
  .faq-products {
    padding: 16px 16px 0;
  }

  .faq-products__grid {
    grid-template-columns: 1fr;
  }
}


/* ========== BLOG HERO ========== */
.blog-hero {
  position: relative;
  min-height: 120vh;
  display: flex;
  align-items: flex-start;
  justify-content: center;
  overflow: hidden;
  text-align: center;
  padding: 80px 0 20px;
}

.blog-hero__bg {
  position: absolute;
  inset: 0;
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  background-attachment: fixed;
  z-index: 0;
}

.blog-hero__overlay {
  position: absolute;
  inset: 0;
  background: linear-gradient(
    180deg,
    rgba(0, 20, 30, 0.2) 0%,
    rgba(0, 20, 30, 0.4) 50%,
    rgba(0, 20, 30, 0.55) 100%
  );
  z-index: 1;
}

.blog-hero__content {
  position: relative;
  z-index: 2;
  padding: 35vh var(--gutter) 0;
  max-width: 960px;
  transform: translateY(-80px);
}

.blog-hero__eyebrow {
  display: block;
  font-family: var(--font-heading);
  font-size: 16px;
  font-weight: 700;
  letter-spacing: 3.5px;
  text-transform: uppercase;
  color: #fff;
  margin-bottom: 8px;
  text-align: left;
}

.blog-hero__title {
  font-family: var(--font-body);
  font-size: clamp(32px, 5vw, 54px);
  font-weight: 700;
  color: var(--color-white);
  text-shadow: 0 2px 20px rgba(0, 0, 0, 0.3);
  margin: 0 0 24px;
  line-height: 1.15;
  text-align: left;
}

/* ── Avatar Circle ── */
.blog-hero__avatar {
  width: 56px;
  height: 56px;
  border-radius: 50%;
  background: linear-gradient(135deg, #7C3AED, #A78BFA);
  display: flex;
  align-items: center;
  justify-content: center;
  margin: 0 auto 20px;
  box-shadow: 0 4px 16px rgba(124, 58, 237, 0.4);
  overflow: hidden;
}

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

.blog-hero__avatar-initial {
  font-family: var(--font-heading);
  font-size: 24px;
  font-weight: 700;
  color: #fff;
  line-height: 1;
}

.blog-hero__subtitle {
  font-family: var(--font-body);
  font-size: 28px;
  font-weight: 400;
  font-style: normal;
  color: rgba(255, 255, 255, 0.88);
  line-height: 1.6;
  margin: 0;
  text-align: left;
}

/* ========== BLOG SECTION (full-bleed bg) ========== */
.blog-section {
  position: relative;
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  background-attachment: fixed;
  padding: 56px 0 60px;
}

.blog-section__overlay {
  position: absolute;
  inset: 0;
  /* Matches the hero gradient's end value (0.55). Both sections share the same
     fixed background image, so matching the overlay opacity makes the darkening
     continuous and removes the hard seam where the hero meets the grid. */
  background: rgba(0, 20, 30, 0.55);
  z-index: 0;
}

.blog-section__inner {
  position: relative;
  z-index: 1;
  max-width: 960px;
  margin: 0 auto;
  padding: 0 32px;
  display: none;
}

.blog-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 28px;
  /* Pull the cards up under the headline (which sits ~52vh from the top of
     the 120vh hero) so the posts ride up with it instead of stranding at
     the bottom. vh-based so it tracks the hero height. */
  margin-top: -42vh;
}

/* ========== BLOG CARD ========== */
.blog-card {
  background: #f9f9f9;
  backdrop-filter: blur(4px);
  border-radius: 0;
  overflow: hidden;
  transition: box-shadow 0.3s ease, transform 0.3s ease;
}

.blog-card:hover {
  box-shadow: 0 8px 32px rgba(0, 0, 0, 0.25);
  transform: translateY(-3px);
}

.blog-card__body {
  padding: 28px 28px 24px;
}

.blog-card__title {
  font-family: var(--font-body);
  font-size: 17px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.5px;
  line-height: 1.35;
  margin-bottom: 6px;
  color: var(--color-dark);
}

.blog-card__title a,
.blog-card__title span {
  color: var(--color-dark);
  text-decoration: none;
}

.blog-card__title a:hover {
  color: #2D9B7A;
}

.blog-card__date {
  display: block;
  font-family: var(--font-body);
  font-size: 10px;
  color: #999;
  letter-spacing: 0.5px;
  margin-bottom: 12px;
}

.blog-card__excerpt {
  font-family: var(--font-body);
  font-size: 12px;
  color: #262626;
  line-height: 1.65;
  margin-bottom: 18px;
}

.blog-card__link {
  display: inline-block;
  font-family: var(--font-body);
  font-size: 11px;
  font-weight: 700;
  color: var(--color-dark);
  text-transform: uppercase;
  letter-spacing: 1px;
  text-decoration: none;
  border-bottom: 1.5px solid var(--color-dark);
  padding-bottom: 2px;
  transition: color 0.2s ease, border-color 0.2s ease;
}

.blog-card__link:hover {
  color: #2D9B7A;
  border-color: #2D9B7A;
}

/* ========== BLOG PAGINATION ========== */
.blog-pagination {
  grid-column: 1 / -1;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  padding: 36px 0 0;
}

.blog-pagination__link {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 28px;
  height: 28px;
  padding: 4px 8px;
  font-family: var(--font-body);
  font-size: 13px;
  font-weight: 600;
  color: rgba(255, 255, 255, 0.75);
  text-decoration: none;
  letter-spacing: 0.5px;
  transition: color 0.2s ease;
}

.blog-pagination__link:hover {
  color: #2DD4BF;
}

.blog-pagination__link--active {
  color: #2DD4BF;
  font-weight: 700;
}



/* BLOG MAINTENANCE / COMING-SOON */
.blog-maintenance {
  grid-column: 1 / -1;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  text-align: center;
  padding: 64px 32px;
  background: #f9f9f9;
  backdrop-filter: blur(4px);
}

.blog-maintenance__icon {
  width: 80px;
  height: 80px;
  border-radius: 50%;
  background: linear-gradient(135deg, #2D9B7A, #2DD4BF);
  display: flex;
  align-items: center;
  justify-content: center;
  margin-bottom: 28px;
  color: #fff;
  box-shadow: 0 6px 24px rgba(45, 155, 122, 0.3);
}

.blog-maintenance__heading {
  font-family: var(--font-body);
  font-size: clamp(22px, 3vw, 32px);
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 1.5px;
  color: var(--color-dark);
  margin: 0 0 16px;
}

.blog-maintenance__message {
  font-family: var(--font-body);
  font-size: 15px;
  color: #555;
  line-height: 1.7;
  max-width: 520px;
  margin: 0 auto;
}

/* ========== ARTICLE PAGE (White theme) ========== */
.article-page {
  margin-top: var(--header-height);
  background: var(--color-white);
  padding: 60px 0 80px;
}

.article-page__container {
  max-width: 760px;
  margin: 0 auto;
  padding: 0 var(--gutter);
}

.article-page__header {
  text-align: center;
  margin-bottom: 40px;
  padding-bottom: 24px;
  border-bottom: 1px solid #eee;
}

.article-page__meta-top {
  font-family: var(--font-body);
  font-size: 11px;
  color: #999;
  letter-spacing: 1px;
  text-transform: uppercase;
  margin-bottom: 24px;
}

.article-page__blog-link {
  color: #999;
  text-decoration: none;
  transition: color var(--transition-fast);
}

.article-page__blog-link:hover {
  color: #2D9B7A;
}

.article-page__meta-sep {
  margin: 0 8px;
  color: #ccc;
}

.article-page__title {
  font-family: var(--font-heading);
  font-size: clamp(28px, 5vw, 42px);
  font-weight: 400;
  color: var(--color-dark);
  line-height: 1.2;
  margin-bottom: 12px;
  text-transform: uppercase;
  letter-spacing: 1px;
}

.article-page__date {
  font-family: var(--font-body);
  font-size: 12px;
  color: #999;
  letter-spacing: 0.5px;
}

.article-page__featured-image {
  margin-bottom: 36px;
  border-radius: 4px;
  overflow: hidden;
}

.article-page__featured-image img {
  width: 100%;
  height: auto;
  display: block;
}

.article-page__content.rte {
  font-family: var(--font-body);
  font-size: 15px;
  color: #444;
  line-height: 1.9;
}

.article-page__content.rte h2,
.article-page__content.rte h3 {
  font-family: var(--font-heading);
  color: var(--color-dark);
  margin: 32px 0 16px;
  font-size: 22px;
  font-weight: 600;
}

.article-page__content.rte h3 {
  font-size: 18px;
}

.article-page__content.rte p {
  margin-bottom: 16px;
}

.article-page__content.rte a {
  color: #2D9B7A;
  text-decoration: underline;
}

.article-page__content.rte img {
  max-width: 100%;
  height: auto;
  border-radius: 4px;
  margin: 24px 0;
}

.article-page__content.rte ul,
.article-page__content.rte ol {
  margin: 16px 0;
  padding-left: 24px;
}

.article-page__content.rte li {
  margin-bottom: 8px;
}

.article-page__content.rte blockquote {
  border-left: 3px solid #2D9B7A;
  padding: 12px 20px;
  margin: 24px 0;
  color: #666;
  font-style: italic;
  background: #f9f9f9;
}

.article-page__back {
  margin-top: 48px;
  padding-top: 24px;
  border-top: 1px solid #eee;
}

/* ========== BLOG RESPONSIVE ========== */
@media (max-width: 1140px) {
  .blog-section__inner {
    padding: 0 24px;
  }
}

@media (max-width: 1024px) {
  .blog-hero {
    min-height: 380px;
  }

  .blog-hero__subtitle {
    font-size: 15px;
  }

  .blog-section {
    padding: 40px 0 48px;
  }

  .blog-section__inner {
    padding: 0 20px;
  }

  .blog-grid {
    grid-template-columns: 1fr;
    gap: 20px;
    margin-top: -120px;
  }

  .blog-card__body {
    padding: 22px 22px 20px;
  }

  .blog-card__title {
    font-size: 14px;
  }

  .blog-card__excerpt {
    font-size: 12px;
  }

  .article-page {
    padding: 40px 0 60px;
  }

  .article-page__title {
    font-size: 26px;
  }
}

@media (max-width: 480px) {
  .blog-hero {
    min-height: 320px;
  }

  .blog-hero__eyebrow {
    font-size: 10px;
    letter-spacing: 2.5px;
  }

  .blog-hero__avatar {
    width: 46px;
    height: 46px;
  }

  .blog-hero__avatar-initial {
    font-size: 20px;
  }

  .blog-hero__subtitle {
    font-size: 13px;
  }

  .blog-section {
    padding: 32px 0 40px;
  }

  .blog-section__inner {
    padding: 0 14px;
  }

  .blog-grid {
    gap: 16px;
  }

  .blog-card__body {
    padding: 18px 18px 16px;
  }

  .blog-card__title {
    font-size: 13px;
  }

  .blog-card__excerpt {
    font-size: 11px;
    margin-bottom: 14px;
  }

  .blog-pagination__link {
    font-size: 12px;
  }
}

/* ========== CLINICIAN HERO ========== */
.clinician-hero  {
  position: relative;
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  min-height: 120vh;
  display: flex;
  align-items: flex-start;
  justify-content: center;
  color: #fff;
  padding: 80px 0 20px;
}

/* .clinician-hero__bg {
  position: absolute;
  inset: 0;
  z-index: 0;
} */

.clinician-hero__bg img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

/* .clinician-hero__content {
    position: relative;
    z-index: 2;
    max-width: 950px;
    margin: 0 auto;
    padding-top: 30vh;
} */


.clinician-hero__title {
  font-family: var(--font-body);
  font-size: clamp(22px, 4vw, 36px);
  font-weight: 700;
  letter-spacing: 5px;
  text-transform: capitilize;
  color: var(--color-white);
  text-shadow: 0 2px 16px rgba(0, 0, 0, 0.4);
  margin-bottom: 30px;
}

.clinician-hero__subtitle {
  font-family: var(--font-body);
  font-size: 13px;
  color: rgba(255, 255, 255, 0.85);
  line-height: 1.2;
  letter-spacing: 0.3px;
}

.clinician-hero__subtitle strong {
  color: #fff;
}

.clinician-hero__subtitle em {
  font-style: italic;
}

/* ========== CLINICIAN FORM SECTION ========== */
.clinician-section {
  padding: 48px 0 60px;
  background-image: url("/cdn/shop/files/clinician_bubbles_2.png?v=1779126322");
}

.clinician-form-wrapper {
  max-width: 700px;
  margin: 0 auto;
}

.clinician-form__header {
  margin-bottom: 32px;
}

.clinician-form__heading {
  font-family: var(--font-body);
  font-size: 18px;
  font-weight: 700;
  color: var(--color-white);
  text-transform: uppercase;
  letter-spacing: 1px;
  margin-bottom: 12px;
}

.clinician-form__heading span {
  color: #e74c3c;
}

.clinician-form__subtext {
  font-family: var(--font-body);
  font-size: 13px;
  color: rgba(255, 255, 255, 0.6);
  line-height: 1.6;
}

/* Form Fields */
.clinician-form__field {
  margin-bottom: 20px;
}

.clinician-form__field label {
  display: block;
  font-family: var(--font-body);
  font-size: 12px;
  font-weight: 600;
  color: rgba(255, 255, 255, 0.8);
  text-transform: uppercase;
  letter-spacing: 0.5px;
  margin-bottom: 6px;
}

.clinician-form__field input,
.clinician-form__field select,
.clinician-form__field textarea {
  width: 100%;
  padding: 12px 14px;
  font-family: var(--font-body);
  font-size: 14px;
  color: var(--color-dark);
  background: var(--color-white);
  border: 1px solid #ddd;
  border-radius: 3px;
  outline: none;
  transition: border-color var(--transition-fast);
}

.clinician-form__field input:focus,
.clinician-form__field select:focus,
.clinician-form__field textarea:focus {
  border-color: #2D9B7A;
  box-shadow: 0 0 0 2px rgba(45, 155, 122, 0.15);
}

.clinician-form__field textarea {
  resize: vertical;
  min-height: 100px;
}

.clinician-form__field select {
  appearance: none;
  background-image: url("data:image/svg+xml,%3Csvg width='12' height='8' viewBox='0 0 12 8' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M1 1.5L6 6.5L11 1.5' stroke='%23666' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: right 14px center;
  padding-right: 40px;
  cursor: pointer;
}

/* Row Layout */
.clinician-form__row--two {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 16px;
}

/* Disclaimer */
.clinician-form__disclaimer {
  font-family: var(--font-body);
  font-size: 12px;
  color: rgba(255, 255, 255, 0.4);
  text-transform: uppercase;
  letter-spacing: 1px;
  margin: 16px 0 24px;
  font-style: italic;
}

/* Submit */
.clinician-form__submit {
  display: inline-block;
  padding: 14px 48px;
  background: #2D9B7A;
  color: #fff;
  font-family: var(--font-body);
  font-size: 13px;
  font-weight: 700;
  letter-spacing: 2px;
  text-transform: uppercase;
  border: none;
  border-radius: 3px;
  cursor: pointer;
  transition: all var(--transition-base);
}

.clinician-form__submit:hover {
  background: #248a6b;
  transform: translateY(-2px);
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.3);
}

/* ========== CLINICIAN RESPONSIVE ========== */
@media (max-width: 1024px) {
  .clinician-hero {
    min-height: 240px;
  }

  .clinician-hero__title {
    letter-spacing: 3px;
  }

  .clinician-section {
    padding: 32px 0 40px;
  }

  .clinician-form__row--two {
    grid-template-columns: 1fr;
    gap: 0;
  }
}

/* ========== RESTORED CLASSES ========== */

.container--narrow-1 {
  max-width: 1280px;
}
.container--narrow-2 {
  max-width: 1140px;
}
/* ========== REFERENCES SECTION ========== */
.references-section {
  padding: 60px 0;
  background: var(--color-dark-alt, #222222);
  color: rgba(255, 255, 255, 0.85);
}

.references-section__title {
  font-family: var(--font-body);
  font-size: clamp(24px, 3vw, 28px);
  color: #00B2A9;
  margin-bottom: 24px;
}

.references-section__subtitle {
  font-family: var(--font-body);
  font-size: 22px;
  font-weight: 700;
  color: #fff;
  margin-bottom: 20px;
}

.references-section__content {
  font-family: var(--font-body);
  font-size: 16px;
  line-height: 1.6;
}

.references-section__content ol {
  padding-left: 20px;
  margin: 0;
  list-style: decimal;
}
.references-section__content ol li a{
  color: #a8a8a8;
  border-bottom: 1px solid #a8a8a8;
}

.references-section__content li {
  margin-bottom: 5px;
}

/* ========== DO YOU HAVE REFLUX PAGE ========== */
.do-you-have-reflux-page {
  background: var(--color-dark, #111);
  color: #fff;
}

/* ── Hero Section ── */
.dyhr-eyebrow {
  font-family: var(--font-heading);
  font-size: 14px;
  font-weight: 600;
  letter-spacing: 2px;
  text-transform: uppercase;
  color: #fff;
  margin-bottom: 15px;
}

.dyhr-title {
  font-family: var(--font-body);
  font-size: clamp(32px, 5vw, 54px);
  font-weight: 700;
  line-height: 1.15;
  letter-spacing: normal;
  color: #ffffff;
  margin: 0 0 20px;
}

.dyhr-text {
  font-family: var(--font-body);
  font-size: 28px;
  line-height: 1.4;
  color: #fff;
}

.dyhr-text p {
  margin-bottom: 20px;
}

.dyhr-text ul {
  list-style: disc;
  padding-left: 20px;
  margin-bottom: 20px;
}

.dyhr-text strong {
  font-weight: 700;
}

.dyhr-hero {
  position: relative;
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  background-attachment: fixed;
  min-height: 120vh;
  display: flex;
  align-items: flex-start;
  justify-content: center;
  color: #fff;
  padding: 80px 0 20px;
}

.dyhr-hero::before {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg, rgba(18, 18, 18, 0) 0%, rgba(18, 18, 18, 0.3) 100%);
  z-index: 1;
  pointer-events: none;
}

.dyhr-hero__content {
  position: relative;
  z-index: 2;
  max-width: var(--container-narrow);
  margin: 0 auto;
  padding-top: 52vh;
  transform: translateY(-80px);
}

/* ── Text Block Section ── */
.dyhr-text-block {
  padding: 80px 0;
}

.dyhr-text-block--has-bg {
  position: relative;
  padding: 120px 0;
  background-size: cover;
  background-position: center;
  background-attachment: fixed;
}

.dyhr-text-block__overlay {
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg, rgba(18, 18, 18, 0.3) 0%, rgba(18, 18, 18, 0.5) 100%);
  pointer-events: none;
}

.dyhr-text-block__content {
  position: relative;
  z-index: 2;
  max-width: var(--container-narrow);
  text-align: left !important;
}

.dyhr-text-block__eyebrow {
  font-family: var(--font-heading);
  font-size: 16px;
  font-weight: 600;
  letter-spacing: 2px;
  text-transform: uppercase;
  color: #fff;
  margin-bottom: 15px;
}

.dyhr-text-block__title {
  font-family: var(--font-body);
  font-size: clamp(32px, 4vw, 50px);
  font-weight: 600;
  line-height: 1.2;
  color: #ffffff;
  margin: 0 0 20px;
}

.dyhr-text-block__text {
  font-family: var(--font-body);
  font-size: 28px;
  line-height: 1.2;
  color: #e8e8e8;
}

.dyhr-text-block__text p {
  margin-bottom: 20px;
}

.dyhr-text-block__text ul {
  list-style: disc;
  padding-left: 20px;
  margin-bottom: 20px;
}

.dyhr-text-block__text strong {
  font-weight: 700;
}

.dyhr-split {
  padding: 100px 0;
  background: linear-gradient(180deg, rgba(30,170,148,0.10) 0%, rgba(20,28,25,1) 22%, rgba(20,28,25,1) 78%, rgba(30,170,148,0.10) 100%), #141c19;
}

.dyhr-split__grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 80px;
}

.dyhr-split__col {
  display: flex;
  flex-direction: column;
}

.dyhr-split__eyebrow {
  font-family: var(--font-heading);
  font-size: 14px;
  font-weight: 600;
  letter-spacing: 2px;
  text-transform: uppercase;
  color: #fff;
  margin-bottom: 0px;
}

.dyhr-split__title {
  font-family: var(--font-body);
  font-size: clamp(32px, 4vw, 50px);
  font-weight: 600;
  line-height: 1.2;
  color: #ffffff;
  margin: 0 0 20px;
}

.dyhr-split__text {
  font-family: var(--font-body);
  font-size: 18px;
  line-height: 1.2;
  color: #e8e8e8;
}

.dyhr-split__text p {
  margin: 0 0 20px;
}

.dyhr-split__text p:last-child {
  margin-bottom: 0;
}

.dyhr-split__text ul {
  margin: -15px 0 20px;
  padding-left: 20px;
  list-style: disc;
}

.dyhr-split__text li {
  margin-bottom: 8px;
}

.dyhr-split__text strong {
  font-weight: 700;
  color: #fff;
}

@media (max-width: 1024px) {
  .dyhr-split__grid {
    grid-template-columns: 1fr;
    gap: 60px;
  }
}

.dyhr-image-table {
  position: relative;
  padding: 120px 0;
  background-size: cover;
  background-position: center;
  background-attachment: fixed;
}

.dyhr-image-table__overlay {
  position: absolute;
  inset: 0;
  /* In case the background image needs a slight darkening to keep text readable */
  background: rgba(0, 0, 0, 0.2);
}

.dyhr-image-table__content {
  position: relative;
  z-index: 2;
  max-width: var(--container-narrow);
  margin: 0 auto;
}

.dyhr-image-table__text-content {
  text-align: left;
  margin-bottom: 60px;
}

.dyhr-image-table__eyebrow {
  font-family: var(--font-heading);
  font-size: 16px;
  font-weight: 700;
  letter-spacing: 2px;
  text-transform: uppercase;
  color: #fff;
  margin-bottom: 15px;
}

.dyhr-image-table__title {
  font-family: var(--font-body);
  font-size: clamp(32px, 4vw, 42px);
  font-weight: 600;
  line-height: 1.2;
  color: #ffffff;
  margin: 0 0 30px;
}

.dyhr-image-table__text {
  font-family: var(--font-body);
  font-size: 28px;
  line-height: 1.4;
  color: #fff;
}

.dyhr-image-table__text p {
  margin: 0 0 18px;
}

.dyhr-image-table__text p:last-child {
  margin-bottom: 0;
}

.dyhr-image-table__text ul {
  margin: 0 0 20px;
  padding-left: 20px;
  list-style: disc;
}

.dyhr-image-table__text li {
  margin-bottom: 0px;
}

/* Indented callout styling */
.dyhr-image-table__callout {
  border-top: 2px solid #3ec1a1;
  border-bottom: 2px solid #3ec1a1;
  border-left: none;
  padding: 24px 0;
  margin: 40px auto;
  font-size: 34px;
  line-height: 42px;
  color: #fff;
  width: 520px;
  max-width: 100%;
  text-align: center;
}

/* RSI section heading */
.dyhr-image-table__rsi-heading {
  font-family: var(--font-body);
  font-size: clamp(28px, 3.2vw, 38px);
  font-weight: 600;
  line-height: 1.2;
  color: #ffffff;
  margin: 0 0 20px;
}

.dyhr-image-table__callout p {
  margin: 0;
}

@media (max-width: 1024px) {
  .dyhr-image-table__callout {
    margin: 30px 0;
    width: 340px;
    font-size: 28px;
  }
}

.dyhr-image-table__text strong {
  font-weight: 700;
  color: #fff;
}

.dyhr-image-table__img-wrapper {
  margin-top: 40px;
  text-align: center;
}


/* ═══════════════════════════════════════════════
   RSI TABLE — Reflux Symptom Index (coded)
   ═══════════════════════════════════════════════ */
.rsi-table {
  background: #1a1a1a;
  border-radius: 6px;
  max-width: 650px;
  margin: 0 auto;
  overflow: hidden;
  border: 1px solid rgba(255, 255, 255, 0.12);
  padding: 20px;
}

.rsi-table__header {
  padding: 24px 12px 0;
}

.rsi-table__title {
  font-family: var(--font-body);
  font-size: 30px;
  font-weight: 700;
  text-align: left;
  color: #fff;
  text-transform: uppercase;
  letter-spacing: 0.5px;
  margin: 0;
  padding-bottom: 16px;
  border-bottom: 2px solid rgba(255, 255, 255, 0.3);
}

.rsi-table__grid {
  width: 100%;
  border-collapse: collapse;
  table-layout: fixed;
}

/* Header row */
.rsi-table__desc-header {
  font-family: var(--font-body);
  font-size: 18px;
  font-weight: 400;
  color: rgba(255, 255, 255, 0.75);
  text-align: left;
  padding: 16px 12px;
  vertical-align: top;
  line-height: 1.5;
  width: 60%;
  border-bottom: 1px solid #fff;
}

.rsi-table__scale-header {
  font-family: var(--font-body);
  font-size: 18px;
  font-weight: 500;
  color: rgba(255, 255, 255, 0.75);
  text-align: left;
  padding: 16px 12px;
  vertical-align: middle;
  line-height: 1.5;
  border-bottom: 1px solid #fff;
}

/* Symptom rows */
/* .rsi-table__grid tbody tr {
  border: 1px solid rgba(255, 255, 255, 0.57);
} */

.rsi-table__grid tbody tr:last-child {
  border-bottom: none;
}

.rsi-table__symptom {
  font-family: var(--font-body);
  font-size: 18px;
  font-weight: 400;
  color: #fff;
  padding: 14px 10px;
  text-align: left;
  vertical-align: middle;
  line-height: 1.45;
  border: 1px solid #fff;
  border-top: 1px solid #fff !important;
}

/* Score cells (0–5) */
.rsi-table__score {
  font-family: var(--font-body);
  font-size: 15px;
  font-weight: 700;
  color: #fff;
  text-align: center;
  vertical-align: middle;
  padding: 14px 0;
  width: calc(40% / 6);
  border: 1px solid #fff;
}

/* First score cell border */
.rsi-table__symptom + .rsi-table__score {
  border-left: 1px solid rgba(255, 255, 255, 0.15);
}

/* ── RSI Table Responsive ── */
@media (max-width: 600px) {
  .rsi-table {
    border-radius: 4px;
  }

  .rsi-table__header {
    padding: 18px 16px 0;
  }

  .rsi-table__title {
    font-size: 16px;
    padding-bottom: 12px;
  }

  .rsi-table__desc-header {
    font-size: 11px;
    padding: 12px 16px;
  }

  .rsi-table__scale-header {
    font-size: 11px;
    padding: 12px 6px;
  }

  .rsi-table__symptom {
    font-size: 12px;
    padding: 10px 16px;
  }

  .rsi-table__score {
    font-size: 13px;
    padding: 10px 0;
  }
}


/* ========== PRODUCT IMAGE GRID ========== */
.product-image-grid {
  background: #1e1e1e;
  padding: 0;
}

.product-image-grid__wrapper {
  max-width: 1000px;
  margin: 0 auto;
  padding: 60px 20px;
}

.product-image-grid__grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 0;
}

.product-image-grid__item {
  display: block;
  position: relative;
  /* aspect-ratio: 1/1; */
  overflow: hidden;
  background: var(--color-dark);
}

.product-image-grid__item {
  height: auto !important;
  aspect-ratio: auto;
}

.product-image-grid__item::after {
  content: "";
  position: absolute;
  inset: 0;
  background: rgba(0, 0, 0, 0.2);
  opacity: 0;
  transition: opacity 0.35s ease;
  pointer-events: none;
  z-index: 1;
}

.product-image-grid__item:hover::after {
  opacity: 1;
}

.product-image-grid__img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform 0.4s ease;
  background: #fff;
}

/* .product-image-grid__item:hover .product-image-grid__img {
  transform: scale(1.05);
} */

.product-image-grid__footer {
  margin-top: 40px;
  text-align: center;
}

.product-image-grid__btn {
  background: var(--color-white);
  color: var(--color-dark);
  border-radius: 0;
  padding: 12px 16px;
  font-family: var(--font-body);
  font-size: 18px;
  font-weight: 700;
  letter-spacing: 1px;
  text-transform: uppercase;
  border: none;
  cursor: pointer;
  transition: all var(--transition-fast);
  display: inline-block;
}

.product-image-grid__btn:hover {
  background: var(--color-off-white);
  transform: translateY(-2px);
}

@media (max-width: 900px) {
  .product-image-grid__grid {
    grid-template-columns: repeat(2, 1fr);
  }
}

@media (max-width: 1024px) {
  .product-image-grid__wrapper {
    padding: 40px 15px;
  }

  .product-image-grid__grid {
    grid-template-columns: repeat(1, 1fr);
  }
}

@media (max-width: 480px) {
  .product-image-grid__grid {
    grid-template-columns: repeat(1, 1fr);
  }
}

/* ========== THE SCIENCE PAGE ========== */
/* ── Hero Banner ── */
.ts-hero {
  position: relative;
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  min-height: 100vh;
  display: flex;
  align-items: center;
  /* Changed to center vertically */
  justify-content: center;
  /* Changed to center horizontally */
  color: #fff;
  padding: 80px 40px;
  /* Adjusted padding */
}

.ts-hero__overlay {
  position: absolute;
  inset: 0;
  /* Adjust gradient if needed, or remove if the image is naturally dark enough */
  background: rgba(0, 0, 0, 0.2);
  z-index: 1;
}

.ts-hero__content {
  position: relative;
  z-index: 2;
  max-width: var(--container-narrow);
  margin: 0 auto;
  padding-bottom: 18vh;
  /* Push content down slightly to match image */
  transform: translateY(-80px);
}

.ts-hero__eyebrow {
  display: block;
  font-family: var(--font-heading);
  /* Use heading font or a serif font */
  font-size: 16px;
  /* Adjust size */
  font-weight: 600;
  letter-spacing: 2px;
  /* Adjust spacing */
  text-transform: uppercase;
  color: #fff;
  /* Ensure solid white */
  margin-bottom: 0px;
  /* Adjust margin */
}

.ts-hero__title {
  font-family: var(--font-body);
  /* Ensure serif/heading font */
  font-size: clamp(36px, 5vw, 50px);
  /* Adjust size */
  font-weight: 600;
  /* Bolder */
  line-height: 1.2;
  color: #ffffff;
  margin: 0 0 40px;
  /* Adjust margin */
}

.ts-hero__body {
  text-align: left;
  /* Left align the body text even though the container is centered */
}

.ts-hero__paragraph {
  font-family: var(--font-body);
  font-size: 28px;
  /* Increase size */
  font-weight: 400;
  line-height: 1.5;
  /* Adjust line height */
  color: #fff;
  /* Solid white */
  margin-bottom: 25px;
  /* Adjust margin */
}

.ts-hero__paragraph p {
  margin-bottom: 20px;
}

.ts-hero__paragraph strong {
  font-weight: 700;
  color: #fff;
}

/* ── Content Section ── */
.ts-content {
  padding: 80px 60px;
  background: #fff;
}

.ts-content--dark {
  background: #111;
  color: #fff;
}

.ts-content__inner {
  max-width: 860px;
  margin: 0 auto;
}

.ts-content__title {
  font-family: var(--font-body);
  font-size: clamp(28px, 3.5vw, 42px);
  font-weight: 400;
  line-height: 1.2;
  margin: 0 0 28px;
  color: inherit;
}

.ts-content--dark .ts-content__title {
  color: #fff;
}

.ts-content__text {
  font-family: var(--font-body);
  font-size: 17px;
  line-height: 1.7;
  color: #333;
}

.ts-content--dark .ts-content__text {
  color: rgba(255, 255, 255, 0.85);
}

.ts-content__text p {
  margin: 0 0 18px;
}

.ts-content__text p:last-child {
  margin-bottom: 0;
}

.ts-content__text strong {
  font-weight: 700;
}

/* ── Image Banner ── */
.ts-image-banner {
  position: relative;
  width: 100%;
  line-height: 0;
}

.ts-image-banner img {
  width: 100%;
  height: auto;
  display: block;
}

.ts-image-banner__overlay {
  position: absolute;
  inset: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  background: rgba(0, 0, 0, 0.35);
  padding: 40px;
}

.ts-image-banner__text {
  font-family: var(--font-body);
  font-size: clamp(24px, 3vw, 40px);
  font-weight: 400;
  color: #fff;
  text-align: center;
  max-width: 800px;
  line-height: 1.3;
}

/* ── Two Column ── */
.ts-twocol {
  padding: 80px 60px;
  background: #fff;
}

.ts-twocol--dark {
  background: #111;
  color: #fff;
}

.ts-twocol__inner {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 60px;
  max-width: 1200px;
  margin: 0 auto;
  align-items: center;
}

.ts-twocol__title {
  font-family: var(--font-body);
  font-size: clamp(26px, 3vw, 38px);
  font-weight: 400;
  line-height: 1.2;
  margin: 0 0 24px;
  color: inherit;
}

.ts-twocol--dark .ts-twocol__title {
  color: #fff;
}

.ts-twocol__text {
  font-family: var(--font-body);
  font-size: 17px;
  line-height: 1.7;
  color: #333;
}

.ts-twocol--dark .ts-twocol__text {
  color: rgba(255, 255, 255, 0.85);
}

.ts-twocol__text p {
  margin: 0 0 16px;
}

.ts-twocol__right img {
  width: 100%;
  height: auto;
  display: block;
}

/* ── Video Split Section ── */
.ts-video-split {
  display: flex;
  flex-wrap: wrap;
  width: 100%;
}

.ts-video-split__left {
  flex: 1 1 50%;
  position: relative;
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  padding: 80px 60px;
  color: #fff;
  display: flex;
  align-items: center;
}

.ts-video-split__left-overlay {
  position: absolute;
  inset: 0;
  background: rgba(0, 0, 0, 0.4);
  /* Dark overlay to make text pop */
  z-index: 1;
}

.ts-video-split__left-inner {
  max-width: 600px;
  margin: 0 auto;
  width: 100%;
  position: relative;
  z-index: 2;
}

.ts-video-split__eyebrow {
  display: block;
  font-family: var(--font-heading);
  font-size: 14px;
  font-weight: 600;
  letter-spacing: 2px;
  text-transform: uppercase;
  color: #fff;
  margin-bottom: 15px;
}

.ts-video-split__heading {
  font-family: var(--font-body);
  font-size: clamp(32px, 4vw, 42px);
  font-weight: 600;
  line-height: 1.2;
  color: #ffffff;
  margin: 0 0 30px;
}

.ts-video-split__text {
  font-family: var(--font-body);
  font-size: 16px;
  line-height: 1.6;
  color: #e8e8e8;
}

.ts-video-split__text p {
  margin: 0 0 20px;
}

.ts-video-split__text p:last-child {
  margin-bottom: 0;
}

.ts-video-split__text strong,
.ts-video-split__text em {
  font-weight: 700;
  font-style: italic;
  color: #fff;
}

.ts-video-split__right {
  flex: 1 1 50%;
  background: #252525;
  padding: 80px 60px;
  display: flex;
  align-items: center;
  justify-content: center;
}

.ts-video-split__right-inner {
  max-width: 600px;
  width: 100%;
}

.ts-video-split__video-wrapper {
  position: relative;
  width: 100%;
  line-height: 0;
  margin-bottom: 20px;
}

.ts-video-split__video-img {
  width: 100%;
  height: auto;
  display: block;
  opacity: 0.85;
}

.ts-video-split__video-overlay {
  position: absolute;
  inset: 0;
  display: flex;
  align-items: center;
  justify-content: center;
}

.ts-video-split__video-text {
  font-family: var(--font-body);
  font-size: clamp(20px, 2.5vw, 28px);
  font-weight: 500;
  color: #fff;
  text-align: center;
  max-width: 80%;
  line-height: 1.3;
}

.ts-video-split__caption {
  font-family: var(--font-body);
  font-size: 14px;
  color: #e0e0e0;
  text-align: left;
}

/* ── Responsive ── */
@media (max-width: 1024px) {
  .ts-hero {
    min-height: 80vh;
    padding: 40px 24px;
    align-items: flex-end;
  }

  .ts-hero__title {
    font-size: 28px;
  }

  .ts-hero__paragraph {
    font-size: 14px;
  }

  .ts-content {
    padding: 50px 24px;
  }

  .ts-twocol {
    padding: 50px 24px;
  }

  .ts-twocol__inner {
    grid-template-columns: 1fr;
    gap: 32px;
  }

  .ts-video-split__left,
  .ts-video-split__right {
    flex: 1 1 100%;
    padding: 50px 24px;
  }
}

/* ── Text Split Section ── */
.ts-text-split {
  display: flex;
  flex-wrap: wrap;
  width: 100%;
}

.ts-text-split__left {
  flex: 1 1 50%;
  position: relative;
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  padding: 80px 60px;
  color: #fff;
  display: flex;
  align-items: center;
}

.ts-text-split__left-overlay {
  position: absolute;
  inset: 0;
  background: rgba(0, 0, 0, 0.45);
  z-index: 1;
}

/* ========== GUM PAGE SECTIONS ========== */
.gum-sec {
  padding: 0px;
  position: relative;
}

.gum-sec__wrap {
  max-width: 1000px;
  margin: 0 auto;
  padding: 0 var(--gutter);
}

.gum-sec__wrap--rel {
  position: relative;
  z-index: 2;
}

.gum-sec__wrap--narrow {
  max-width: 960px;
}

/* ---- Backgrounds ---- */
.gum-sec--white {
  background: #fff;
}

.gum-sec--nature {
  background-size: cover;
  background-position: center;
  background-attachment: fixed;
  position: relative;
  height: 100%;
  padding: 50px;
  display: flex;
  align-items: center;
}

.gum-sec--sage {
  background: #ACD8AA;
}

.gum-sec--sage .gum-sec__wrap {
  max-width: 100%;
  margin: 0;
  padding: 80px 64px;
}

.gum-sec--sage .gum-sec__heading {
  font-family: var(--font-body);
  font-size: clamp(34px, 4.5vw, 50px);
  font-weight: 700;
  color: #1a1a1a;
  line-height: 1.12;
  margin-bottom: 40px;
}

.gum-sec--sage .gum-sec__cols {
  gap: 60px;
}

.gum-sec--sage .gum-sec__col {
  font-size: 20px;
  line-height: 1.4;
  color: #202020;
}

.gum-sec--sage .gum-sec__col p {
  margin-bottom: 18px;
}


.gum-sec--sage .gum-sec__callout {
  margin: 28px 0;
  border: none;
  border-top: 2px solid #1EAB93;
  border-bottom: 2px solid #1EAB93;
  font-family: var(--font-body);
  font-size: 24px;
  line-height: 1.3;
  color: #1a1a1a;
  font-style: normal;
  font-weight: 400;
  background: transparent;
  width: 445px;
}

.gum-sec--lightblue {
  background: #d5e8f0;
}

.gum-sec--lightblue .gum-sec__wrap {
  max-width: 100%;
  margin: 0;
  padding: 0;
}

.gum-sec--lightblue .gum-sec__row {
  grid-template-columns: 1fr 1fr;
  gap: 0;
  align-items: stretch;
}

/* Text aligns to the shared container left edge; image bleeds to screen right */
.gum-sec--lightblue .gum-sec__col-text {
  padding: 80px 56px 80px 64px;
}

.gum-sec--lightblue .gum-sec__infographic {
  align-self: stretch;
}

.gum-sec--lightblue .gum-sec__infographic img {
  width: 100%;
  height: auto;
  display: block;
}

.gum-sec--lightblue .gum-sec__infographic {
  position: relative;
  overflow: hidden;
}

.gum-sec--lightblue .gum-sec__infographic img {
  width: 100%;
  height: 100%;
  object-fit: contain;
  object-position: bottom;
  display: block;
}

.gum-sec--lightblue .gum-sec__label {
  font-size: 16px;
  letter-spacing: 2px;
  color: #202020;
  margin-bottom: 0px;
}

.gum-sec--lightblue .gum-sec__heading {
  font-family: var(--font-body);
  font-size: clamp(34px, 4vw, 50px);
  font-weight: 700;
  color: #1a1a1a;
  line-height: 1.12;
  margin-bottom: 15px;
}

.gum-sec--lightblue .gum-sec__p {
  font-size: 20px;
  line-height: 1.4;
  color: #202020;
  margin-bottom: 10px;
}

.gum-sec--lightblue .gum-sec__divider {
  border: none;
  border-top: 2px solid #1EAB93;
  margin: 24px 270px;
  max-width: 500px;
}

.gum-sec--lightblue .gum-sec__p--italic {
  font-style: normal;
  font-weight: 600;
  font-size: 24px;
  line-height: 32px;
  color: #202020;
  max-width: 500px;
  margin: 40px 0;
  border-top: 2px solid #1EAB93;
  border-bottom: 2px solid #1EAB93;
  padding: 18px 0;
}

.gum-sec__wrap--wide {
  max-width: 1200px;
}

.gum-sec--darkbg {
  background: #1a1a1a;
}

/* Divider line */
.gum-sec__divider {
  border: none;
  border-top: 1px solid rgba(0, 0, 0, 0.2);
  margin: 20px 0;
}

/* Italic paragraph */
.gum-sec__p--italic {
  font-style: italic;
}

/* Disclaimer text */
.gum-sec__disclaimer {
  font-family: var(--font-body);
  font-size: 14px;
  color: rgba(255, 255, 255, 0.6);
  line-height: 1.5;
  margin-top: 24px;
}

/* Centered logo */
.gum-sec__logo-center {
  display: flex;
  justify-content: center;
  padding: 30px 0;
}

.gum-sec__logo-center img {
  width: 150px;
  height: auto;
}

/* Functional Gum bordered box */
.gum-func-box {
  max-width: 520px;
  margin: 0 auto 40px;
  border: 1.5px solid #fff;
  background: rgba(32, 32, 32, 0.25);
  padding: 36px 40px;
  text-align: center;
  color: #fff;
}

.gum-func-box__heading {
  font-family: var(--font-body);
  font-size: 20px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 1.4px;
  margin-bottom: 10px;
  color: #fff;
}

.gum-func-box p {
  font-family: var(--font-body);
  font-size: 20px;
  font-weight: 400;
  color: rgba(255, 255, 255, 0.9);
  line-height: 1.4;
  margin-bottom: 4px;
}

.gum-func-box__bold {
  font-weight: 700;
  font-style: italic;
  margin-top: 16px;
}

.gum-sec__overlay {
  position: absolute;
  inset: 0;
  z-index: 1;
}

.ts-text-split__left-inner {
  max-width: 600px;
  margin: 0 auto;
  width: 100%;
  position: relative;
  z-index: 2;
}

.ts-text-split__right {
  flex: 1 1 50%;
  background: #252525;
  padding: 80px 60px;
  color: #fff;
  display: flex;
  align-items: center;
  justify-content: center;
}

.ts-text-split__right-inner {
  max-width: 600px;
  margin: 0 auto;
  width: 100%;
}

.ts-text-split__eyebrow {
  display: block;
  font-family: var(--font-heading);
  font-size: 14px;
  font-weight: 600;
  letter-spacing: 2px;
  text-transform: uppercase;
  color: #fff;
  margin-bottom: 15px;
}

.ts-text-split__heading {
  font-family: var(--font-body);
  font-size: clamp(32px, 4vw, 42px);
  font-weight: 600;
  line-height: 1.2;
  color: #ffffff;
  margin: 0 0 30px;
}

.ts-text-split__left-text {
  font-family: var(--font-body);
  font-size: 16px;
  line-height: 1.6;
  color: #e8e8e8;
  border-left: 2px solid rgba(255, 255, 255, 0.4);
  padding-left: 24px;
  margin-top: 30px;
}

.ts-text-split__left-text p {
  margin: 0 0 20px;
}

.ts-text-split__left-text p:last-child {
  margin-bottom: 0;
}

.ts-text-split__right-text {
  font-family: var(--font-body);
  font-size: 16px;
  line-height: 1.6;
  color: #e8e8e8;
  margin-bottom: 30px;
}

.ts-text-split__right-text p {
  margin: 0 0 20px;
}

.ts-text-split__right-text ul {
  margin: 0 0 20px;
  padding-left: 20px;
  list-style: disc;
}

.ts-text-split__right-text li {
  margin-bottom: 8px;
}

.ts-text-split__right-highlight {
  font-family: var(--font-body);
  font-size: 18px;
  line-height: 1.5;
  color: #3ec1a1;
}

.ts-text-split__right-highlight p {
  margin: 0 0 8px;
}

.ts-text-split__right-highlight em {
  font-style: italic;
}

/* ── Dark Text Split Section ── */
.ts-dark-text-split {
  background: #1e1e1e;
  padding: 100px 60px;
  color: #fff;
}

.ts-dark-text-split__inner {
  max-width: 1100px;
  margin: 0 auto;
  display: flex;
  gap: 80px;
}

.ts-dark-text-split__left,
.ts-dark-text-split__right {
  flex: 1 1 50%;
}

.ts-dark-text-split__eyebrow {
  display: block;
  font-family: var(--font-heading);
  font-size: 13px;
  font-weight: 600;
  letter-spacing: 2px;
  text-transform: uppercase;
  color: #fff;
  margin-bottom: 15px;
}

.ts-dark-text-split__heading {
  font-family: var(--font-body);
  font-size: clamp(32px, 4vw, 42px);
  font-weight: 600;
  line-height: 1.2;
  color: #ffffff;
  margin: 0 0 30px;
}

.ts-dark-text-split__text {
  font-family: var(--font-body);
  font-size: 15px;
  line-height: 1.6;
  color: #cccccc;
}

.ts-dark-text-split__text p {
  margin: 0 0 20px;
}

.ts-dark-text-split__text p:last-child {
  margin-bottom: 0;
}

.ts-dark-text-split__callout {
  font-family: var(--font-body);
  font-size: 17px;
  line-height: 1.5;
  color: #fff;
  border-top: 1px solid #3ec1a1;
  border-bottom: 1px solid #3ec1a1;
  padding: 24px 0;
  margin-bottom: 30px;
}

.ts-dark-text-split__callout p {
  margin: 0;
}

@media (max-width: 1140px) {

  .ts-text-split__left,
  .ts-text-split__right {
    flex: 1 1 100%;
    padding: 50px 24px;
  }

  .ts-dark-text-split {
    padding: 60px 24px;
  }

  .ts-dark-text-split__inner {
    flex-direction: column;
    gap: 40px;
  }
}

.gum-sec__overlay--light {
  background: rgba(255, 255, 255, 0.35);
}

/* ---- Label ---- */
.gum-sec__label {
  font-family: var(--font-heading);
  font-size: 16px;
  font-weight: 600;
  letter-spacing: 2px;
  text-transform: uppercase;
  color: #202020;
  margin-bottom: 0px;
}

/* ---- Headings ---- */
.gum-sec__heading {
  font-family: var(--font-body);
  font-size: clamp(24px, 4vw, 50px);
  font-weight: 700;
  color: var(--color-dark);
  line-height: 1.2;
  margin-bottom: 20px;
}

.gum-sec__heading--serif {
  font-family: var(--font-body);
  font-weight: 700;
  font-size: 50px;
  line-height: 1.12;
}

.gum-sec__heading--italic {
  font-style: normal;
}

.gum-sec__heading--white {
  color: #fff;
}

/* ---- Paragraphs ---- */
.gum-sec__p {
  font-family: var(--font-body);
  font-size: 28px;
  color: #202020;
  line-height: 1.36;
  margin-bottom: 14px;
}

.gum-sec__p--white {
  color: rgba(255, 255, 255, 0.85);
}

.gum-sec__p--muted {
  color: rgba(255, 255, 255, 0.4);
  font-size: 12px;
  margin-top: 20px;
}

.gum-sec__aside {
  font-family: var(--font-body);
  font-size: 13px;
  color: #777;
  line-height: 1.7;
  margin-top: 16px;
  font-style: italic;
}

/* ---- Row (text + image) ---- */
.gum-sec__row {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 48px;
  align-items: center;
}

.gum-sec--bar .gum-sec__wrap {
  max-width: 100%;
  margin: 0;
  padding: 0;
}

.gum-sec--bar .gum-sec__row {
  grid-template-columns: 1fr 1fr;
  gap: 0;
  align-items: stretch;
  min-height: 400px;
}

/* Text aligns to the shared container left edge; image bleeds to screen right */
.gum-sec--bar .gum-sec__col-text {
  padding: 80px 48px 80px 64px;
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
}

.gum-sec__col-text {
  display: flex;
  flex-direction: column;
  justify-content: center;
  padding: 40px 20px 20px 20px;
}

.gum-sec__row--badges {
  align-items: start;
}

.gum-sec__col-text {
  /* text column */
}

.gum-sec__col-img {
  display: flex;
  flex-direction: column;
  align-items: center;
}

/* Image Card (full-bleed with overlaid quote) */
.gum-sec--bar .gum-sec__col-img {
  align-items: stretch;
  position: relative;
}

/* Image card fills the grid cell without dictating its height, so the text
   column drives the section height and the top/bottom spacing stays a
   consistent 80px at every viewport width (matching the sage section).
   Desktop only — on mobile the columns stack and the card flows normally. */
@media (min-width: 1025px) {
  .gum-sec--bar .gum-sec__imgcard {
    position: absolute;
    inset: 0;
  }
}

.gum-sec__imgcard {
  position: relative;
  overflow: hidden;
  height: 100%;
}

.gum-sec__imgcard img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  min-height: 340px;
}

.gum-sec__imgcard-text {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  max-width: 445px;
  width: calc(100% - 80px);
  padding: 16px 0;
  font-family: var(--font-body);
  font-weight: 600;
  font-size: 34px;
  color: #202020;
  line-height: 44px;
  text-align: center;
  background: transparent;
  border-bottom: 2px solid #1EAB93;
  border-top: 2px solid #1EAB93;
}

/* Bottom green bar on section */
.gum-sec--bar::after {
  content: '';
  display: block;
  width: 100%;
  height: 6px;
  background: #c5d4a8;
  position: absolute;
  bottom: 0;
  left: 0;
}

/* ---- Two Columns ---- */
.gum-sec__cols {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 40px;
}

.gum-sec__col {
  font-family: var(--font-body);
  font-size: 14px;
  line-height: 1.8;
}

.gum-sec--nature .gum-sec__col {
  color: rgba(255, 255, 255, 0.85);
}

.gum-sec--white .gum-sec__col {
  color: #555;
}

.gum-sec__col p {
  margin-bottom: 14px;
}

.gum-sec--sage .gum-sec__col {
  color: #202020;
}

/* Callout / Pull Quote Box */
.gum-sec__callout {
  margin: 20px 0;
  padding: 20px 24px;
  border: 1px solid rgba(0, 0, 0, 0.15);
  font-family: var(--font-body);
  font-size: 14px;
  line-height: 1.7;
  color: #202020;
  background: transparent;
  font-style: normal;
}

/* ---- Pull quote (Figma: Archivo Narrow SemiBold, brand-green rules) ---- */
.gum-pullquote {
  font-family: var(--font-body);
  font-weight: 600;
  font-size: 24px;
  line-height: 32px;
  color: #202020;
  font-style: normal;
  border-top: 2px solid #1EAB93;
  border-bottom: 2px solid #1EAB93;
  padding: 18px 0;
  margin: 32px 0;
}

/* In "What Any Gum Can Do" and "What Only RxG's Gum Can Do" the pull quotes
   are constrained to 480px and centered within their column (per Figma), so
   the rules read shorter. */
.gum-sec--sage .gum-pullquote,
.gum-sec--lightblue .gum-pullquote {
  max-width: 480px;
  margin-left: auto;
  margin-right: auto;
}

.gum-pullquote--lg {
  font-size: 34px;
  line-height: 44px;
}

.gum-pullquote--white {
  color: #fff;
  border-color: rgba(255, 255, 255, 0.7);
}

/* ---- Infographic Image ---- */
.gum-sec__row--ingredients {
  align-items: start;
}

.gum-sec__infographic {
  width: 100%;
}

.gum-sec__infographic img {
  width: 100%;
  height: auto;
  display: block;
}

/* ---- Product Showcase ---- */
.gum-products__layout {
  display: grid;
  grid-template-columns: 1fr auto 1fr;
  align-items: center;
  gap: 20px;
  margin-bottom: 40px;
}

.gum-products__img img {
  width: 100%;
  max-width: 300px;
  height: auto;
  display: block;
}

.gum-products__center {
  text-align: center;
}

.gum-products__heading {
  font-family: var(--font-heading);
  font-size: clamp(24px, 4vw, 38px);
  font-weight: 400;
  color: #fff;
  line-height: 1.2;
}

.gum-benefits-box {
  max-width: 680px;
  margin: 0 auto 24px;
  border: 1px solid rgba(255, 255, 255, 0.35);
  padding: 24px 32px;
  text-align: center;
}

.gum-benefits-box p {
  font-family: var(--font-body);
  font-size: 11px;
  color: rgba(255, 255, 255, 0.8);
  line-height: 1.7;
  margin: 0;
}

.gum-directions {
  text-align: center;
  font-family: var(--font-body);
  font-size: 11px;
  color: rgba(255, 255, 255, 0.7);
  margin-bottom: 24px;
}

.gum-cta {
  text-align: center;
  padding-bottom: 10px;
}

.gum-cta__btn {
  display: inline-block;
  padding: 12px 36px;
  background: #2a6b5a;
  color: #fff;
  font-family: var(--font-body);
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 1.5px;
  text-transform: uppercase;
  text-decoration: none;
  border: none;
  cursor: pointer;
  transition: background 0.2s;
}

.gum-cta__btn:hover {
  background: #1f5244;
}

/* ---- References ---- */
.gum-refs {
  padding: 48px 0;
}

.gum-refs__title {
  font-family: var(--font-heading);
  font-size: 28px;
  font-weight: 400;
  color: #5bbfad;
  margin-bottom: 12px;
}

.gum-refs__heading {
  font-family: var(--font-body);
  font-size: 15px;
  font-weight: 600;
  color: var(--color-white);
  margin-bottom: 24px;
}

.gum-refs__heading--dark {
  color: #333;
  font-weight: 700;
}

.gum-refs__line {
  border: none;
  border-top: 1px solid #ddd;
  margin: 16px 0 24px;
}

.gum-refs__list {
  padding-left: 20px;
  font-family: var(--font-body);
  font-size: 11px;
  color: rgba(255, 255, 255, 0.5);
  line-height: 1.7;
}

.gum-refs__list--dark {
  color: #555;
}

.gum-refs__list--dark a {
  color: #5bbfad;
  text-decoration: underline;
}

.gum-refs__list li {
  margin-bottom: 8px;
}

/* Hero margin */
.gum-reflux-relief {
  margin-top: var(--header-height);
}

/* ========== GUM PAGE RESPONSIVE ========== */
@media (max-width: 1024px) {
  .gum-sec {
    padding: 40px 0;
  }

  .gum-sec__row {
    grid-template-columns: 1fr;
    gap: 32px;
  }

  .gum-sec--bar .gum-sec__row {
    grid-template-columns: 1fr;
    min-height: auto;
  }

  .gum-sec--bar .gum-sec__col-text {
    padding: 40px 24px;
  }

  .gum-sec__imgcard {
    min-height: 300px;
  }

  .gum-sec__imgcard-text {
    position: relative;
    bottom: auto;
    right: auto;
    left: auto;
    transform: none;
    width: 100%;
    max-width: 100%;
    padding: 16px 24px;
    background: rgba(255, 255, 255, 0.85);
  }

  .gum-sec__cols {
    grid-template-columns: 1fr;
    gap: 24px;
  }

  .gum-sec--sage .gum-sec__wrap {
    padding: 48px 24px;
  }

  .gum-sec--sage .gum-sec__callout {
    padding: 16px 0;
  }

  .gum-products__layout {
    grid-template-columns: 1fr;
    text-align: center;
  }

  .gum-products__img img {
    max-width: 220px;
    margin: 0 auto;
  }

  .gum-benefits-box {
    padding: 16px 20px;
  }

  .gum-sec--lightblue .gum-sec__wrap {
    padding: 40px 24px;
  }

  .gum-sec--lightblue .gum-sec__row {
    grid-template-columns: 1fr;
    gap: 32px;
  }

  .gum-sec--lightblue .gum-sec__col-text {
    padding: 0;
  }

  .gum-sec--lightblue .gum-sec__infographic {
    position: relative;
    max-width: 400px;
    margin: 0 auto;
    align-self: center;
  }

  .gum-sec--lightblue .gum-sec__divider {
    max-width: 100%;
  }

  .gum-sec--lightblue .gum-sec__p--italic {
    max-width: 100%;
  }
}

/* ═══════════════════════════════════════════════
   DAILY SUPPORT BANNER
   ═══════════════════════════════════════════════ */
.daily-support {
  position: relative;
  width: 100%;
  min-height: 420px;
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  display: flex;
  align-items: center;
  padding: 80px 0;
  overflow: hidden;
  justify-content: flex-start;
  flex-direction: column;
  background-color: #1e1e1e;
}

.daily-support__overlay {
  position: absolute;
  inset: 0;
  z-index: 1;
}

.daily-support__inner {
  position: relative;
  z-index: 2;
  width: 100%;
  max-width: var(--container-narrow);
  margin: 0 auto;
  padding: 0 var(--gutter);
}

.daily-support__eyebrow {
  display: block;
  font-family: var(--font-heading);
  font-size: 16px;
  font-weight: 700;
  letter-spacing: 2px;
  text-transform: uppercase;
  color: #fff;
  margin-bottom: 0px;
  line-height: 1.6;
}

.daily-support__heading {
  font-family: var(--font-body);
  font-size: clamp(28px, 3.5vw, 40px);
  font-weight: 700;
  color: #fff;
  line-height: 1.15;
  margin: 0 0 20px;
}

.daily-support__text {
  font-family: var(--font-body);
  font-size: 20px;
  line-height: 1.5;
  color: rgba(255, 255, 255, 0.92);
  margin-bottom: 24px;
}

.daily-support__text p {
  margin: 0 0 14px;
}

.daily-support__text p:last-child {
  margin-bottom: 0;
}

.daily-support__text strong {
  font-weight: 700;
  color: #fff;
}

/* Embedded headings inside the rich-text body */
.daily-support__text h1,
.daily-support__text h2,
.daily-support__text h3 {
  font-family: var(--font-body);
  font-size: clamp(28px, 3.5vw, 40px);
  font-weight: 700;
  line-height: 1.15;
  color: #fff;
  margin: 6px 0 18px;
}

.daily-support__text h4,
.daily-support__text h5,
.daily-support__text h6 {
  font-family: var(--font-overline);
  font-size: 16px;
  font-weight: 600;
  letter-spacing: 2px;
  text-transform: uppercase;
  color: #fff;
  line-height: 1.8;
  margin: 52px 0 6px;
}

.daily-support__text li {
    list-style: disc;
    margin-left: 35px;
}

.daily-support__cta {
  font-family: var(--font-body);
  font-size: 14px;
  font-weight: 600;
  color: #fff;
  margin: 0;
  line-height: 1.6;
}

.daily-support__cta a {
  color: #fff;
  text-decoration: underline;
  text-underline-offset: 3px;
  transition: opacity 0.2s ease;
}

.daily-support__cta a:hover {
  opacity: 0.8;
}

/* ── Daily Support Responsive ── */
@media (max-width: 1140px) {
  .daily-support {
    min-height: 380px;
    padding: 64px 0;
  }

  .daily-support__inner {
    padding: 0 var(--gutter);
  }
}

@media (max-width: 1024px) {
  .daily-support {
    min-height: 340px;
    padding: 56px 0;
  }

  .daily-support__inner {
    padding: 0 var(--gutter);
  }

  .daily-support__heading {
    font-size: 26px;
  }

  .daily-support__text {
    font-size: 13px;
  }

  .daily-support__cta {
    font-size: 13px;
  }
}

@media (max-width: 480px) {
  .daily-support {
    min-height: 300px;
    padding: 40px 0;
  }

  .daily-support__inner {
    padding: 0 16px;
  }

  .daily-support__eyebrow {
    font-size: 10px;
    letter-spacing: 2px;
  }

  .daily-support__heading {
    font-size: 22px;
    margin-bottom: 14px;
  }

  .daily-support__text {
    font-size: 12px;
    margin-bottom: 16px;
  }

  .daily-support__cta {
    font-size: 12px;
  }
}

/* ═══════════════════════════════════════════════
   NOCTURNAL REFLUX PAGE
   ═══════════════════════════════════════════════ */

/* ── Hero ── */
.nr-hero {
  position: relative;
  min-height: 120vh;
  background-size: cover;
  background-position: center bottom;
  background-repeat: no-repeat;
  background-attachment: fixed;
  display: flex;
  align-items: flex-start;
  padding: 80px 0 20px;
  color: #fff;
  justify-content: center;
}

.nr-hero__overlay {
  position: absolute;
  inset: 0;
  background:
    linear-gradient(to top, rgba(0, 0, 0, 0.55) 0%, rgba(0, 0, 0, 0.15) 40%, transparent 65%),
    linear-gradient(to right, rgba(0, 0, 0, 0.25) 0%, transparent 60%);
  z-index: 1;
}

.nr-hero__content {
  position: relative;
  z-index: 2;
  width: 100%;
  max-width: var(--container-narrow);
  margin: 0 auto;
  padding: 52vh var(--gutter) 0;
  transform: translateY(-80px);
}

.nr-hero__eyebrow {
  display: block;
  font-family: var(--font-heading);
  font-size: 16px;
  font-weight: 600;
  letter-spacing: 3px;
  text-transform: uppercase;
  color: #fff;
  margin-bottom: 14px;
}

.nr-hero__title {
  font-family: var(--font-body);
  font-size: clamp(34px, 4.5vw, 52px);
  font-weight: 700;
  line-height: 1.15;
  color: #fff;
  margin: 0 0 32px;
}

.nr-hero__text {
  font-family: var(--font-body);
  font-size: 28px;
  line-height: 1.4;
  color: #fff;
}

.nr-hero__text p {
  margin: 0 0 20px;
}

.nr-hero__text p:last-child {
  margin-bottom: 0;
}

/* ── Text Section ── */
.nr-text-section {
  position: relative;
  padding: 90px 0;
  background-color: #111;
  background-size: cover;
  background-position: center;
  color: #fff;
}

.nr-text-section__overlay {
  position: absolute;
  inset: 0;
  background: rgba(0, 0, 0, 0.55);
  z-index: 1;
}

.nr-text-section__inner {
  position: relative;
  z-index: 2;
  max-width: var(--container-narrow);
  margin: 0 auto;
  padding: 0 var(--gutter);
}

.nr-text-section__eyebrow {
  display: block;
  font-family: var(--font-heading);
  font-size: 13px;
  font-weight: 600;
  letter-spacing: 2.5px;
  text-transform: uppercase;
  color: #5bbfad;
  margin-bottom: 14px;
}

.nr-text-section__title {
  font-family: var(--font-body);
  font-size: clamp(28px, 3.5vw, 42px);
  font-weight: 600;
  line-height: 1.2;
  color: #fff;
  margin: 0 0 28px;
}

.nr-text-section__text {
  font-family: var(--font-body);
  font-size: 16px;
  line-height: 1.75;
  color: rgba(255, 255, 255, 0.85);
}

.nr-text-section__text p {
  margin: 0 0 18px;
}

.nr-text-section__text p:last-child {
  margin-bottom: 0;
}

.nr-text-section__text strong {
  color: #fff;
  font-weight: 700;
}

.nr-text-section__text ul {
  padding-left: 20px;
  margin: 0 0 18px;
}

.nr-text-section__text li {
  margin-bottom: 8px;
}

/* ── Text Split (dark + image 50/50) ── */
.nr-text-split {
  display: flex;
  min-height: 480px;
}

.nr-text-split__left {
  flex: 0 0 50%;
  background: linear-gradient(160deg, #1c1c1c 0%, #111 100%);
  display: flex;
  align-items: center;
  padding: 72px 56px;
}

.nr-text-split__content {
  position: relative;
  z-index: 2;
  max-width: 480px;
}

.nr-text-split__eyebrow {
  display: block;
  font-family: var(--font-heading);
  font-size: 16px;
  font-weight: 600;
  letter-spacing: 3px;
  text-transform: uppercase;
  color: #fff;
  margin-bottom: 14px;
}

.nr-text-split__title {
  font-family: var(--font-body);
  font-size: clamp(26px, 3vw, 50px);
  font-weight: 700;
  line-height: 1.2;
  color: #fff;
  margin: 0 0 20px;
}

.nr-text-split__divider {
  display: block;
  width: 60px;
  height: 3px;
  background: #1EAB93;
  margin-bottom: 24px;
  border-radius: 2px;
}

.nr-text-split__text {
  font-family: var(--font-body);
  font-size: 34px;
  line-height: 1.2;
  color: #ffffff;
  border-top: 2px solid #1EAB93;
  border-bottom: 2px solid #1EAB93;
  padding: 20px;
  margin-top: 20px;
  margin-left: 0;
  margin-right: 0;
}

.nr-text-split__text p {
  margin: 0 0 16px;
}

.nr-text-split__text p:last-child {
  margin-bottom: 0;
}

.nr-text-split__text strong {
  color: #fff;
  font-weight: 700;
}

/* Pull quote (panel with no heading): centered block + centered text + semi-bold */
.nr-text-split__right:has(> .nr-text-split__content > .nr-text-split__text:only-child) {
  justify-content: center;
}

.nr-text-split__content > .nr-text-split__text:only-child {
  text-align: center;
  font-weight: 600;
}

.nr-text-split__content > .nr-text-split__text:only-child p {
  font-weight: 600;
}

/* Panel with heading + pull quote: keep heading left, center the quote */
.nr-text-split__content:has(> .nr-text-split__title) {
  width: 100%;
  max-width: none;
}

.nr-text-split__content:has(> .nr-text-split__title) > .nr-text-split__title {
  max-width: 480px;
}

.nr-text-split__content:has(> .nr-text-split__title) > .nr-text-split__text {
  text-align: center;
  font-weight: 600;
  max-width: 480px;
  margin-left: auto;
  margin-right: auto;
}

.nr-text-split__content:has(> .nr-text-split__title) > .nr-text-split__text p {
  font-weight: 600;
}

/* ── Right panel ── */
.nr-text-split__right {
  flex: 0 0 50%;
  position: relative;
  background-size: cover;
  background-position: center;
  display: flex;
  align-items: center;
  padding: 60px 48px;
}

.nr-text-split__right-overlay {
  position: absolute;
  inset: 0;
  background: rgba(0, 0, 0, 0.35);
  z-index: 1;
}

.nr-text-split__right-content {
  position: relative;
  z-index: 2;
  width: 100%;
}

.nr-text-split__right-title {
  font-family: var(--font-body);
  font-size: clamp(28px, 3.5vw, 50px);
  font-weight: 700;
  line-height: 1.15;
  color: #fff;
  margin: 0 0 16px;
}

.nr-text-split__right-divider {
  display: block;
  width: 60px;
  height: 3px;
  background: #1EAB93;
  margin-bottom: 24px;
  border-radius: 2px;
}

.nr-text-split__right-columns {
  display: grid;
  gap: 32px;
  margin-bottom: 28px;
}

.nr-text-split__right-col {
  font-family: var(--font-body);
  font-size: 20px;
  line-height: 1.7;
  color: #ffffff;
}

.nr-text-split__right-col p {
  margin: 0 0 12px;
}

.nr-text-split__right-col p:last-child {
  margin-bottom: 0;
}

.nr-text-split__right-col strong {
  color: #fff;
  font-weight: 700;
}

.nr-text-split__right-col ul {
  padding-left: 18px;
  margin: 8px 0 12px;
  list-style: disc;
}

.nr-text-split__right-col li {
  margin-bottom: 4px;
  color: #ffffff;
}

.nr-text-split__right-cta {
  font-family: var(--font-body);
  font-size: 14px;
  font-weight: 600;
  font-style: italic;
  color: #fff;
  line-height: 1.6;
}

.nr-text-split__right-cta a {
  color: #fff;
  text-decoration: underline;
  text-underline-offset: 3px;
  transition: opacity 0.2s ease;
}

.nr-text-split__right-cta a:hover {
  opacity: 0.8;
}

/* ── Legacy highlight (kept for backward compat) ── */
.nr-text-split__highlight {
  position: relative;
  max-width: 450px;
  padding: 20px 20px;
  border-bottom: 2px solid #1EAB93;
  border-top: 2px solid #1EAB93;
}

.nr-text-split__highlight-text {
  font-family: var(--font-body);
  font-size: clamp(18px, 2.2vw, 24px);
  font-weight: 400;
  line-height: 1.3;
  color: #fff;
}

/* ── Dark Split (dark left + image/text right) ── */
.nr-text-dark-split {
  display: flex;
  min-height: 480px;
}

.nr-text-dark-split__left {
  flex: 0 0 50%;
  background: linear-gradient(160deg, #1a1a1a 0%, #111 100%);
  display: flex;
  align-items: flex-start;
  padding: 72px 48px;
}

.nr-text-dark-split__content {
  max-width: 620px;
}

.nr-text-dark-split__eyebrow {
  display: block;
  font-family: var(--font-heading);
  font-size: 16px;
  font-weight: 600;
  letter-spacing: 3px;
  text-transform: uppercase;
  color: #fff;
  margin-bottom: 12px;
}

.nr-text-dark-split__title {
  font-family: var(--font-body);
  font-size: clamp(26px, 3vw, 50px);
  font-weight: 700;
  line-height: 1.2;
  color: #fff;
  margin: 0;
  width: 475px;
}

.nr-text-dark-split__divider {
  display: block;
  width: 60px;
  height: 3px;
  background: #1EAB93;
  margin: 24px 0;
  border-radius: 2px;
}

.nr-text-dark-split__text {
  font-family: var(--font-body);
  font-size: 24px;
  line-height: 1.2;
  color: #ffffffbf;
  padding: 10px 0px 10px 0px;
  border-top: 2px solid #1EAB93;
  border-bottom: 2px solid #1EAB93;
  margin-left: 0;
  margin-top: 20px;
}

.nr-text-dark-split__text p {
  margin: 0 0 16px;
}

.nr-text-dark-split__text p:last-child {
  margin-bottom: 0;
}

.nr-text-dark-split__text strong {
  color: #fff;
  font-weight: 700;
}

.nr-text-dark-split__right {
  flex: 0 0 50%;
  position: relative;
  background-size: cover;
  background-position: center;
  display: flex;
  align-items: flex-start;
  padding: 72px 48px;
}

.nr-text-dark-split__right-overlay {
  position: absolute;
  inset: 0;
  background: rgba(0, 15, 20, 0.35);
  z-index: 1;
}

.nr-text-dark-split__right-content {
  position: relative;
  z-index: 2;
  width: 100%;
}

.nr-text-dark-split__right-title {
  font-family: var(--font-body);
  font-size: clamp(28px, 3.5vw, 50px);
  font-weight: 700;
  line-height: 1.2;
  color: #fff;
  margin: 0 0 28px;
  width: 380px;
}

.nr-text-dark-split__right-text {
  font-family: var(--font-body);
  font-size: 20px;
  line-height: 1.4;
  color: rgba(255, 255, 255, 0.88);
  column-count: 2;
  column-gap: 40px;
}

.nr-text-dark-split__right-text p {
  margin: 0 0 14px;
  break-inside: avoid;
}

.nr-text-dark-split__right-text p:last-child {
  margin-bottom: 0;
}

.nr-text-dark-split__right-text strong {
  color: #fff;
  font-weight: 700;
}

.nr-text-dark-split__right-text ul {
  padding-left: 20px;
  margin: 4px 0 14px;
  list-style: disc;
  break-inside: avoid;
}

.nr-text-dark-split__right-text li {
  margin-bottom: 4px;
  color: rgba(255, 255, 255, 0.88);
}

/* ── Split Content ── */
.nr-split {
  position: relative;
  background-color: #0a0e1a;
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  background-attachment: fixed;
  color: #fff;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
}

.nr-split__overlay {
  position: absolute;
  inset: 0;
  background:
    linear-gradient(to right, rgba(0, 0, 0, 0.45) 0%, rgba(0, 0, 0, 0.15) 55%, transparent 80%),
    linear-gradient(to top, rgba(0, 0, 0, 0.3) 0%, transparent 40%);
  z-index: 1;
}

.nr-split__inner {
  position: relative;
  z-index: 2;
  max-width: var(--container-width);
  margin: 0 auto;
  padding: 90px var(--gutter);
}

.nr-split__eyebrow {
  display: block;
  font-family: var(--font-heading);
  font-size: 16px;
  font-weight: 600;
  letter-spacing: 3px;
  text-transform: uppercase;
  color: #fff;
  margin-bottom: 14px;
}

.nr-split__title {
  font-family: var(--font-body);
  font-size: clamp(28px, 3.5vw, 50px);
  font-weight: 700;
  line-height: 1.2;
  color: #fff;
  margin: 0 0 28px;
}

.nr-split__text {
  font-family: var(--font-body);
  font-size: 20px;
  line-height: 1.6;
  color: rgba(255, 255, 255, 0.85);
  max-width: 820px;
}

.nr-split__text p {
  margin: 0 0 20px;
}

.nr-split__text p:last-child {
  margin-bottom: 0;
}

.nr-split__text strong {
  color: #fff;
  font-weight: 700;
}

.nr-split__text ul {
  padding-left: 24px;
  margin: 0px 0 20px;
  list-style: disc;
}

.nr-split__text li {
  margin-bottom: 0px;
  color: rgba(255, 255, 255, 0.85);
}

.nr-split__btn {
  display: inline-block;
  margin-top: 24px;
  padding: 14px 32px;
  background: #2a6b5a;
  color: #fff;
  font-family: var(--font-body);
  font-size: 13px;
  font-weight: 700;
  letter-spacing: 1.5px;
  text-transform: uppercase;
  text-decoration: none;
  transition: background var(--transition-fast);
}

.nr-split__btn:hover {
  background: #1f5244;
}

/* ── Two Column Text ── */
.nr-two-col {
  position: relative;
  padding: 90px 0;
  background-color: #111;
  background-size: cover;
  background-position: center;
  color: #fff;
}

.nr-two-col--dark {
  background-color: #0d1b1e;
}

.nr-two-col__overlay {
  position: absolute;
  inset: 0;
  background: rgba(0, 0, 0, 0.5);
  z-index: 1;
}

.nr-two-col__inner {
  position: relative;
  z-index: 2;
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 60px;
  max-width: var(--container-width);
  margin: 0 auto;
  padding: 0 var(--gutter);
}

.nr-two-col__eyebrow {
  display: block;
  font-family: var(--font-heading);
  font-size: 13px;
  font-weight: 600;
  letter-spacing: 2.5px;
  text-transform: uppercase;
  color: #5bbfad;
  margin-bottom: 14px;
}

.nr-two-col__title {
  font-family: var(--font-body);
  font-size: clamp(24px, 3vw, 34px);
  font-weight: 600;
  line-height: 1.2;
  color: #fff;
  margin: 0 0 24px;
}

.nr-two-col__text {
  font-family: var(--font-body);
  font-size: 15px;
  line-height: 1.75;
  color: rgba(255, 255, 255, 0.85);
}

.nr-two-col__text p {
  margin: 0 0 16px;
}

.nr-two-col__text strong {
  color: #fff;
  font-weight: 700;
}

.nr-two-col__text ul {
  padding-left: 20px;
  margin: 0 0 16px;
}

.nr-two-col__text li {
  margin-bottom: 8px;
}

/* ── Image + Text Split (dark variant of two-col) ── */
.nr-img-text-split {
  display: flex;
  min-height: 480px;
}

.nr-img-text-split__image {
  flex: 0 0 50%;
  position: relative;
  background-color: #0a1520;
  background-size: cover;
  background-position: center;
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
}

.nr-img-text-split__illustration {
  position: relative;
  z-index: 2;
  width: 100%;
  max-width: 520px;
  height: auto;
  display: block;
  object-fit: contain;
}

.nr-img-text-split__content {
  flex: 0 0 50%;
  background: #1a1e24;
  display: flex;
  align-items: center;
  padding: 72px 56px;
}

.nr-img-text-split__title {
  max-width: 560px;
}

.nr-img-text-split__eyebrow {
  display: block;
  font-family: var(--font-heading);
  font-size: 16px;
  font-weight: 600;
  letter-spacing: 3px;
  text-transform: uppercase;
  color: #fff;
  margin-bottom: 14px;
}

.nr-img-text-split__title {
  font-family: var(--font-body);
  font-size: clamp(26px, 3vw, 50px);
  font-weight: 700;
  line-height: 1.2;
  color: #fff;
  margin: 0 0 28px;
}

.nr-img-text-split__text {
  font-family: var(--font-body);
  font-size: 20px;
  line-height: 1.6;
  color: rgba(255, 255, 255, 0.78);
}

.nr-img-text-split__text p {
  margin: 0 0 16px;
}

.nr-img-text-split__text p:last-child {
  margin-bottom: 0;
}

.nr-img-text-split__text strong {
  display: block;
  color: #fff;
  font-weight: 700;
  font-size: 20px;
  letter-spacing: 1px;
  text-transform: uppercase;
}

/* ── Pillow Showcase ── */
.nr-pillow {
  display: flex;
  min-height: 600px;
}

.nr-pillow__left {
  flex: 0 0 50%;
  background: #fff;
  padding: 48px 48px 48px 56px;
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
}

.nr-pillow__logo {
  margin-bottom: 56px;
}

.nr-pillow__logo img {
  max-width: 118px;
  height: auto;
  display: block;
}

.nr-pillow__eyebrow {
  display: block;
  font-family: var(--font-heading);
  font-size: 16px;
  letter-spacing: 3px;
  color: #555;
  text-transform: uppercase;
  margin-bottom: 6px;
  font-weight: 600;
}

.nr-pillow__title {
  font-family: var(--font-body);
  font-size: clamp(26px, 3vw, 50px);
  font-weight: 700;
  color: #1a1a1a;
  margin: 0 0 20px;
  line-height: 1.15;
}

.nr-pillow__text {
  font-family: var(--font-body);
  font-size: 20px;
  line-height: 1.65;
  color: #444;
  margin-bottom: 24px;
}

.nr-pillow__text p {
  margin: 0 0 12px;
}

.nr-pillow__text p:last-child {
  margin-bottom: 0;
}

.nr-pillow__text strong {
  font-weight: 700;
  color: #1a1a1a;
}

.nr-pillow__illustrations {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 20px;
  margin: 8px 0 40px;
}

.nr-pillow__illustration {
  width: 100%;
  max-width: 380px;
  display: flex;
  justify-content: center;
  border: none;
}

.nr-pillow__illustration img {
  width: 100%;
  height: auto;
  display: block;
}

.nr-pillow__btn {
  display: inline-block;
  background: #1a1a1a;
  color: #fff;
  padding: 12px 28px;
  font-family: var(--font-body);
  font-size: 18px;
  font-weight: 700;
  letter-spacing: 2px;
  text-decoration: none;
  text-transform: uppercase;
  transition: background var(--transition-fast);
  align-self: flex-start;
  margin-top: 20px;
}

.nr-pillow__btn:hover {
  background: #333;
}

.nr-pillow__right {
  flex: 0 0 50%;
  position: relative;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  overflow: hidden;
}

.Pillow-image {
  height: 65%;
}

.nr-pillow__product-img {
  width: 100%;
  height: 100%;
  display: block;
  object-fit: cover;
  object-position: center;
}

.nr-pillow__highlight {
  position: absolute;
  bottom: 70px;
  right: 250px;
  max-width: 445px;
  padding: 8px 0;
  border-top: 2px solid #1EAB93;
  border-bottom: 2px solid #1EAB93;
}

.nr-pillow__highlight-text {
  font-family: var(--font-body);
  font-size: 24px;
  line-height: 1.3;
  font-weight: 600;
  color: #333;
  margin: 0;
}

/* ── Full Width Image ── */
.nr-full-image {
  position: relative;
  width: 100%;
  line-height: 0;
}

.nr-full-image img {
  width: 100%;
  height: auto;
  display: block;
}

.nr-full-image__overlay {
  position: absolute;
  inset: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  background: rgba(0, 0, 0, 0.35);
  padding: 40px;
}

.nr-full-image__text {
  font-family: var(--font-body);
  font-size: clamp(20px, 3vw, 36px);
  font-weight: 400;
  color: #fff;
  text-align: center;
  max-width: 800px;
  line-height: 1.3;
}

/* ── Nocturnal Responsive ── */
@media (max-width: 1140px) {

  .nr-split__inner {
    padding: 70px 40px;
  }

  .nr-two-col__inner {
    grid-template-columns: 1fr;
    gap: 40px;
  }

  .nr-pillow {
    flex-direction: column;
  }

  .nr-pillow__left,
  .nr-pillow__right {
    flex: 1 1 100%;
  }

  .nr-pillow__right {
    min-height: 400px;
  }

  .nr-pillow__highlight {
    position: relative;
    bottom: auto;
    right: auto;
    max-width: 100%;
    margin: 32px 32px 32px;
  }

  .nr-text-split {
    flex-direction: column;
  }

  .nr-text-split__left,
  .nr-text-split__right {
    flex: 1 1 100%;
  }

  .nr-text-split__right {
    min-height: 400px;
  }

  .nr-text-split__right-columns {
    gap: 24px;
  }

  .nr-img-text-split {
    flex-direction: column;
  }

  .nr-img-text-split__image,
  .nr-img-text-split__content {
    flex: 1 1 100%;
  }

  .nr-img-text-split__image {
    min-height: 360px;
  }

  .nr-text-dark-split {
    flex-direction: column;
  }

  .nr-text-dark-split__left,
  .nr-text-dark-split__right {
    flex: 1 1 100%;
  }
}

@media (max-width: 1024px) {
  .nr-hero {
    min-height: 75vh;
    padding: 40px 24px;
  }

  .nr-hero__title {
    font-size: 32px;
  }

  .nr-hero__text {
    font-size: 15px;
  }

  .nr-text-section {
    padding: 50px 0;
  }

  .nr-split__inner {
    padding: 50px 24px;
  }

  .nr-two-col {
    padding: 50px 0;
  }

  .nr-pillow__left {
    padding: 40px 24px;
  }

  .nr-pillow__highlight {
    margin: 24px 24px 24px;
  }

  .nr-text-split__left {
    padding: 48px 24px;
  }

  .nr-text-split__right {
    padding: 32px 24px;
    min-height: 340px;
  }

  .nr-text-split__right-title {
    font-size: 26px;
  }

  .nr-text-split__right-columns {
    grid-template-columns: 1fr;
    gap: 20px;
  }

  .nr-text-split__right-col {
    font-size: 13px;
  }

  .nr-text-split__right-cta {
    font-size: 13px;
  }

  .nr-text-split__highlight {
    padding: 28px 24px;
  }

  .nr-text-split__highlight-text {
    font-size: 17px;
  }

  .nr-img-text-split__content {
    padding: 48px 24px;
  }

  .nr-img-text-split__image {
    min-height: 300px;
  }

  .nr-text-dark-split__left {
    padding: 48px 24px;
  }

  .nr-text-dark-split__right {
    padding: 48px 24px;
  }

  .nr-text-dark-split__right-text {
    column-count: 1;
  }
}


/* ═══════════════════════════════════════════════
   GOLDEN COMFORT BLENDS
   ═══════════════════════════════════════════════ */

/* ── Intro ── */
.gc-blends__intro {
  padding-bottom: 40px;
}

.gc-blends__intro-inner {
  max-width: 950px;
  margin: 0 auto;
  text-align: center;
}

.gc-blends__intro-text {
  font-family: var(--font-body);
  font-size: 28px;
  font-weight: 400;
  line-height: 1.4;
  color: #ffffffff;
}

.gc-blends__intro-text p {
  margin: 0 0 14px;
}

.gc-blends__intro-text p:last-child {
  margin-bottom: 0;
}

.gc-blends__intro-text strong {
  font-weight: 700;
  color: #fff;
}

/* ── Blends area (golden bg) ── */
.gc-blends__area {
  position: relative;
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  background-attachment: fixed;
  padding: 60px 0 48px;
}

.gc-blends__area-overlay {
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg,
      rgba(0, 0, 0, 0.08) 0%,
      transparent 30%,
      transparent 70%,
      rgba(0, 0, 0, 0.12) 100%);
  z-index: 1;
}

.gc-blends__area-inner {
  position: relative;
  z-index: 2;
  max-width: 920px;
  margin: 0 auto;
  padding: 0 32px;
}

/* ── Single image panel ── */
.gc-blends__panel {
  margin-bottom: 32px;
  line-height: 0;
}

.gc-blends__panel-img {
  width: 100%;
  height: auto;
  display: flex;
  box-shadow: 0 2px 20px #0000001a;
  margin: 0 auto;
}

/* ── Disclaimer ── */
.gc-blends__disclaimer {
  font-family: var(--font-body);
  font-size: 10px;
  line-height: 1.65;
  color: rgba(255, 255, 255, 0.7);
  max-width: 860px;
  margin: 0 auto 36px;
  text-align: center;
}

.gc-blends__disclaimer p {
  margin: 0;
}

.gc-blends__disclaimer strong {
  font-weight: 700;
  color: rgba(255, 255, 255, 0.9);
}

/* ── Directions ── */
.gc-blends__directions {
  display: flex;
  justify-content: center;
  margin-bottom: 40px;
}

.gc-blends__directions-box-1 {
  display: inline-block;
  border: 2px solid rgba(255, 255, 255, 0.45);
  padding: 14px 24px;
  font-family: var(--font-body);
  font-size: 14px;
  line-height: 1.6;
  color: #fff;
  text-align: center;
  max-width: 520px;
  font-style: normal;
}

.gc-blends__directions-box-1 p {
  margin: 0;
}

.gc-blends__directions-box-1 strong {
  font-weight: 700;
  font-style: normal;
  letter-spacing: 1px;
}

/* ── References ── */
.gc-blends__references {
  text-align: center;
  padding-bottom: 16px;
}

.gc-blends__references-link {
  display: inline-flex;
  flex-direction: column;
  align-items: center;
  gap: 10px;
  font-family: var(--font-body);
  font-size: 18px;
  font-weight: 700;
  letter-spacing: 2.5px;
  text-transform: uppercase;
  color: #fff;
  text-decoration: none;
  transition: opacity 0.2s ease;
}

.gc-blends__references-link:hover {
  opacity: 0.75;
}

.gc-blends__references-link svg {
  display: block;
}

/* ── Golden Comfort Blends Responsive ── */
@media (max-width: 1140px) {
  .gc-blends__area-inner {
    max-width: 780px;
    padding: 0 24px;
  }
}

@media (max-width: 1024px) {
  .gc-blends__intro {
    padding: 40px 24px;
  }

  .gc-blends__intro-text {
    font-size: 15px;
  }

  .gc-blends__area {
    padding: 40px 0 36px;
  }

  .gc-blends__area-inner {
    padding: 0 16px;
  }

  .gc-blends__directions-box-1 {
    padding: 12px 18px;
    font-size: 11px;
    max-width: 100%;
  }
}

@media (max-width: 480px) {
  .gc-blends__intro {
    padding: 32px 16px;
  }

  .gc-blends__intro-text {
    font-size: 13px;
  }

  .gc-blends__area {
    padding: 28px 0 24px;
  }

  .gc-blends__area-inner {
    padding: 0 10px;
  }

  .gc-blends__disclaimer {
    font-size: 9px;
    margin-bottom: 24px;
  }

  .gc-blends__directions-box-1 {
    font-size: 10px;
    padding: 10px 14px;
  }

  .gc-blends__references-link {
    font-size: 11px;
    letter-spacing: 2px;
  }
}

/* ── Blends area (golden bg) ── */
.gc-blends__area {
  position: relative;
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  background-attachment: fixed;
  padding: 60px 0 48px;
}

.gc-blends__area-overlay {
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg,
      rgba(0, 0, 0, 0.08) 0%,
      transparent 30%,
      transparent 70%,
      rgba(0, 0, 0, 0.12) 100%);
  z-index: 1;
}

.gc-blends__area-inner {
  position: relative;
  z-index: 2;
  max-width: 920px;
  margin: 0 auto;
  padding: 0 32px;
}


/* ── Disclaimer ── */
.gc-blends__disclaimer {
  font-family: var(--font-body);
  font-size: 10px;
  line-height: 1.65;
  color: rgba(255, 255, 255, 0.7);
  max-width: 860px;
  margin: 0 auto 36px;
  text-align: center;
}

.gc-blends__disclaimer p {
  margin: 0;
}

.gc-blends__disclaimer strong {
  font-weight: 700;
  color: rgba(255, 255, 255, 0.9);
}

/* ── Directions ── */
.gc-blends__directions {
  display: flex;
  justify-content: center;
  margin-bottom: 40px;
}

.gc-blends__directions-box {
  display: inline-block;
  border: 2px solid rgba(255, 255, 255, 0.45);
  padding: 14px 24px;
  font-family: var(--font-body);
  font-size: 12px;
  line-height: 1.6;
  color: #fff;
  text-align: center;
  max-width: 580px;
  font-style: italic;
}

.gc-blends__directions-box p {
  margin: 0;
}

.gc-blends__directions-box strong {
  font-weight: 700;
  font-style: normal;
  letter-spacing: 1px;
}

/* ── References ── */
.gc-blends__references {
  text-align: center;
  padding-bottom: 16px;
}

.gc-blends__references-link {
  display: inline-flex;
  flex-direction: column;
  align-items: center;
  gap: 10px;
  font-family: var(--font-body);
  font-size: 18px;
  font-weight: 700;
  letter-spacing: 2.5px;
  text-transform: uppercase;
  color: #fff;
  text-decoration: none;
  transition: opacity 0.2s ease;
}

.gc-blends__references-link:hover {
  opacity: 0.75;
}

.gc-blends__references-link svg {
  display: block;
}

/* ── Golden Comfort Blends Responsive ── */
@media (max-width: 1140px) {
  .gc-blends__area-inner {
    max-width: 780px;
    padding: 0 24px;
  }
}

@media (max-width: 1024px) {
  .gc-blends__intro {
    padding: 40px 24px;
  }

  .gc-blends__intro-text {
    font-size: 15px;
  }

  .gc-blends__area {
    padding: 40px 0 36px;
  }

  .gc-blends__area-inner {
    padding: 0 16px;
  }

  .gc-blends__directions-box {
    padding: 12px 18px;
    font-size: 11px;
    max-width: 100%;
  }
}

@media (max-width: 480px) {
  .gc-blends__intro {
    padding: 32px 16px;
  }

  .gc-blends__intro-text {
    font-size: 13px;
  }

  .gc-blends__area {
    padding: 28px 0 24px;
  }

  .gc-blends__area-inner {
    padding: 0 10px;
  }

  .gc-blends__disclaimer {
    font-size: 9px;
    margin-bottom: 24px;
  }

  .gc-blends__directions-box {
    font-size: 10px;
    padding: 10px 14px;
  }

  .gc-blends__references-link {
    font-size: 11px;
    letter-spacing: 2px;
  }
}

/* ═══════════════════════════════════════════════
   GC BLEND SHOWCASE (50/50 Split)
   ═══════════════════════════════════════════════ */
.gc-showcase__inner {
  display: flex;
  min-height: 480px;
}

.gc-showcase__inner--reverse {
  flex-direction: row-reverse;
}

/* ── Content (left) ── */
.gc-showcase__content {
  flex: 0 0 50%;
  display: flex;
  flex-direction: column;
  justify-content: center;
  padding: 72px 64px;
}

.gc-showcase__eyebrow {
  display: block;
  font-family: var(--font-heading);
  font-size: 16px;
  font-weight: 700;
  letter-spacing: 1px;
  text-transform: uppercase;
  color: #1a1a1a;
  margin-bottom: 0px;
}

.gc-showcase__heading {
  font-family: var(--font-body);
  font-size: clamp(28px, 3.5vw, 50px);
  font-weight: 700;
  line-height: 1.15;
  color: #1a1a1a;
  margin: 0 0 24px;
  width: 430px;
}

.gc-showcase__text {
  font-family: var(--font-body);
  font-size: 20px;
  line-height: 1.6;
  color: #444;
  margin-bottom: 28px;
}

.gc-showcase__text p {
  margin: 0 0 14px;
}

.gc-showcase__text p:last-child {
  margin-bottom: 0;
}

.gc-showcase__text strong {
  font-weight: 700;
  color: #1a1a1a;
}

.gc-showcase__btn {
  display: inline-block;
  background: #1a1a1a;
  color: #fff;
  font-family: var(--font-body);
  font-size: 18px;
  font-weight: 500;
  letter-spacing: 2px;
  text-transform: uppercase;
  text-decoration: none;
  padding: 10px 20px;
  transition: background 0.2s ease;
  align-self: flex-start;
  margin-top: 4px;
}

.gc-showcase__btn:hover {
  background: #333;
}

/* ── Light text modifier (for dark backgrounds) ── */
.gc-showcase__content--light .gc-showcase__eyebrow {
  color: #fff;
}

.gc-showcase__content--light .gc-showcase__heading {
  color: #fff;
}

.gc-showcase__content--light .gc-showcase__text {
  color: rgba(255, 255, 255, 0.85);
}

.gc-showcase__content--light .gc-showcase__text strong {
  color: #fff;
}

.gc-showcase__content--light .gc-showcase__btn {
  background: #fff;
  color: #1a1a1a;
}

.gc-showcase__content--light .gc-showcase__btn:hover {
  background: rgba(255, 255, 255, 0.85);
}

/* ── Image (right) ── */
.gc-showcase__image {
  flex: 0 0 50%;
  position: relative;
  overflow: hidden;
}

.gc-showcase__img {
  width: 100%;
  height: 100%;
  display: block;
  object-fit: cover;
  object-position: center;
}

/* ── GC Showcase Responsive ── */
@media (max-width: 1140px) {
  .gc-showcase__content {
    padding: 56px 40px;
  }

  .gc-showcase__inner {
    flex-direction: column;
    min-height: auto;
  }
}

@media (max-width: 1024px) {
  .gc-showcase__inner {
    flex-direction: column;
    min-height: auto;
  }

  .gc-showcase__content {
    flex: none;
    padding: 40px 24px;
  }

  .gc-showcase__heading {
    font-size: 28px;
    width: 100%;
  }

  .gc-showcase__image {
    flex: none;
    min-height: 100%;
  }
}

@media (max-width: 480px) {
  .gc-showcase__content {
    padding: 32px 16px;
  }

  .gc-showcase__eyebrow {
    font-size: 10px;
    letter-spacing: 2px;
  }

  .gc-showcase__heading {
    font-size: 24px;
    margin-bottom: 18px;
  }

  .gc-showcase__text {
    font-size: 13px;
    margin-bottom: 20px;
  }

  .gc-showcase__btn {
    font-size: 11px;
    padding: 12px 24px;
  }

  .gc-showcase__image {
    min-height: 100%;
  }
}

/* ═══════════════════════════════════════════════
   GC VISUAL IMAGE (Centered Image Section)
   ═══════════════════════════════════════════════ */
.gc-visual__inner {
  max-width: 1000px;
  margin: 0 auto;
  padding: 0px 32px;
  line-height: 0;
}

.gc-visual__img {
  width: 100%;
  height: auto;
  display: block;
}

@media (max-width: 1024px) {
  .gc-visual__inner {
    padding: 32px 16px;
  }
}

@media (max-width: 480px) {
  .gc-visual__inner {
    padding: 24px 10px;
  }
}

/* ═══════════════════════════════════════════════
   GC PRODUCT GRID (Full Width 3-Column)
   ═══════════════════════════════════════════════ */
.gc-products__grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  width: 100%;
}

.gc-products__card-link {
  display: block;
  text-decoration: none;
  color: inherit;
}

.gc-products__card {
  display: flex;
  flex-direction: column;
  background: #fff;
}

.gc-products__card-image {
  position: relative;
  overflow: hidden;
  aspect-ratio: 1 / 1;
}

/* Dark overlay on hover */
.gc-products__card-image::after {
  content: "";
  position: absolute;
  inset: 0;
  background: rgba(0, 0, 0, 0.45);
  opacity: 0;
  z-index: 2;
  transition: opacity 0.35s ease;
  pointer-events: none;
}

.gc-products__card-link:hover .gc-products__card-image::after {
  opacity: 0.5;
}

.gc-products__card-img {
  width: 100%;
  height: 100%;
  display: block;
  object-fit: cover;
  object-position: center;
  transition: transform 0.4s ease;
}

.gc-products__card-info {
  padding: 16px 20px 20px;
  background: #fff;
  display: none;
}

.gc-products__card-title {
  font-family: var(--font-body);
  font-size: 18px;
  font-weight: 700;
  color: #1a1a1a;
  margin: 0 0 4px;
  line-height: 1.35;
}

.gc-products__card-subtitle {
  display: block;
  font-family: var(--font-body);
  font-size: 18px;
  font-weight: 400;
  color: #777;
  line-height: 1.4;
}

/* ── GC Product Grid Responsive ── */
@media (max-width: 1024px) {
  .gc-products__grid {
    grid-template-columns: 1fr;
  }

  .gc-products__card-image {
    aspect-ratio: 1 / 1;
  }

  .gc-products__card-info {
    padding: 14px 16px 18px;
  }
}

@media (max-width: 480px) {
  .gc-products__card-title {
    font-size: 12px;
  }

  .gc-products__card-subtitle {
    font-size: 11px;
  }

  .gc-products__card-info {
    padding: 12px 14px 16px;
  }
}


/* ═══════════════════════════════════════════════
   GC QUALITY FEATURES
   ═══════════════════════════════════════════════ */
.gc-quality {
  position: relative;
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  padding: 64px 40px;
}

.gc-quality__overlay {
  position: absolute;
  inset: 0;
  background: rgba(0, 0, 0, 0.35);
  z-index: 1;
}

.gc-quality__inner {
  position: relative;
  z-index: 2;
  max-width: 780px;
  margin: 0 auto;
  text-align: center;
}

.gc-quality__heading {
  font-family: var(--font-heading);
  font-size: clamp(24px, 3vw, 32px);
  font-weight: 400;
  font-style: italic;
  color: #fff;
  line-height: 1.35;
  margin: 0 0 36px;
  white-space: pre-line;
}

.gc-quality__features {
  display: flex;
  flex-direction: column;
  gap: 24px;
}

.gc-quality__feature-title {
  font-family: var(--font-body);
  font-size: 14px;
  font-weight: 700;
  letter-spacing: 2px;
  text-transform: uppercase;
  color: #fff;
  margin: 0 0 6px;
}

.gc-quality__feature-desc {
  font-family: var(--font-body);
  font-size: 13px;
  font-weight: 400;
  line-height: 1.5;
  color: rgba(255, 255, 255, 0.8);
  margin: 0;
}

/* ── GC Quality Responsive ── */
@media (max-width: 1024px) {
  .gc-quality {
    padding: 48px 24px;
  }

  .gc-quality__heading {
    margin-bottom: 28px;
  }

  .gc-quality__features {
    gap: 20px;
  }

  .gc-quality__feature-title {
    font-size: 13px;
  }

  .gc-quality__feature-desc {
    font-size: 12px;
  }
}

@media (max-width: 480px) {
  .gc-quality {
    padding: 36px 16px;
  }

  .gc-quality__heading {
    margin-bottom: 24px;
  }

  .gc-quality__features {
    gap: 18px;
  }

  .gc-quality__feature-title {
    font-size: 12px;
    letter-spacing: 1.5px;
  }

  .gc-quality__feature-desc {
    font-size: 11px;
  }
}

/* ═══════════════════════════════════════════════
   COLLECTION PAGE
   ═══════════════════════════════════════════════ */

/* ── Hero Banner ── */
.coll-page__hero {
  position: relative;
  min-height: 60vh;
  display: flex;
  align-items: center;
  justify-content: center;
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  padding-top: 80px;
}

.coll-page__hero-overlay {
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg,
      rgba(0, 0, 0, 0.15) 0%,
      rgba(0, 0, 0, 0.05) 40%,
      rgba(0, 0, 0, 0.2) 100%);
  z-index: 1;
}

.coll-page__hero-content {
  position: relative;
  z-index: 2;
  text-align: center;
  padding: 60px 40px;
}

.coll-page__hero-logo {
  max-width: 750px;
  width: 100%;
  height: auto;
  display: block;
  margin: 0 auto;
}

/* ── Product Grid ── */
.coll-page__grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 0;
  width: 100%;
}

.coll-page__product {
  display: flex;
  flex-direction: column;
}

.coll-page__product-link {
  display: block;
  text-decoration: none;
  position: relative;
}

/* ── Product Image ── */
@media (max-width: 1920px) {
  .coll-page__product-image {
    position: relative;
    overflow: hidden;
    background: #f0f0f0;
    height: auto;
  }
}

@media (min-width: 1921px) {
  .coll-page__product-image {
    position: relative;
    overflow: hidden;
    background: #f0f0f0;
    height: auto;
  }
  .coll-page__product-subtitle {
    font-size: 22px;
  }
  .coll-page__product-title {
    font-size: 28px;
  }
}

@media (max-width: 1500px) {
  .coll-page__product-image {
    position: relative;
    overflow: hidden;
    background: #f0f0f0;
    height: auto;
  }
}
@media (max-width: 1300px) {
  .coll-page__product-image {
    position: relative;
    overflow: hidden;
    background: #f0f0f0;
    height: auto;
  }
}
/* Dark overlay on hover */
.coll-page__product-image::after {
  content: "";
  position: absolute;
  inset: 0;
  background: rgba(0, 0, 0, 0.45);
  opacity: 0;
  z-index: 2;
  transition: opacity 0.35s ease;
  pointer-events: none;
}

.coll-page__product-link:hover .coll-page__product-image::after {
  opacity: 1;
}

.coll-page__product-img {
  width: 100%;
  height: auto;
  display: block;
  object-fit: cover;
  object-position: center;
  transition: transform 0.4s ease;
}

/* .coll-page__product-link:hover .coll-page__product-img {
  transform: scale(1.05);
} */

.coll-page__product-placeholder {
  aspect-ratio: 1 / 1;
  background: #e8e4dc;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #999;
  font-size: 14px;
}

/* ── Product Info ── */
.coll-page__product-info {
    padding: 10px 16px;
    background: #c7c7c773;
    margin-top: -72px;
    z-index: 99;
}

.coll-page__product-title-link {
  text-decoration: none;
  color: inherit;
}

.coll-page__product-title {
  font-family: var(--font-body);
  font-size: 18px;
  font-weight: 700;
  text-transform: uppercase;
  color: #1a1a1a;
  margin: 0 0 4px;
  line-height: 1.35;
}

.coll-page__product-title-link:hover .coll-page__product-title {
  color: #555;
}

.coll-page__product-subtitle {
  font-family: var(--font-body);
  font-size: 16px;
  font-weight: 400;
  color: #000;
  margin: 0;
  line-height: 1.45;
}

@media (max-width: 1331px) {
    .coll-page__product-subtitle {
    font-size: 12px;
  }  
  .coll-page__product-info {
    margin-top: -65px;
  }
}
/* ── Pagination ── */
.coll-page__pagination {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 8px;
  padding: 40px 20px;
  flex-wrap: wrap;
}

.coll-page__pagination-btn,
.coll-page__pagination-num {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 8px 16px;
  font-family: var(--font-body);
  font-size: 13px;
  font-weight: 600;
  color: #1a1a1a;
  text-decoration: none;
  border: 1px solid #ddd;
  border-radius: 2px;
  transition: all 0.2s ease;
}

.coll-page__pagination-btn:hover,
.coll-page__pagination-num:hover {
  background: #1a1a1a;
  color: #fff;
  border-color: #1a1a1a;
}

.coll-page__pagination-num--active {
  background: #1a1a1a;
  color: #fff;
  border-color: #1a1a1a;
}

/* ── Collection Page Responsive ── */
@media (max-width: 1140px) {
  .coll-page__hero-logo {
    max-width: 620px;
  }
  .coll-page__product-subtitle {
    font-size: 10px;
  }  
}

@media (max-width: 1024px) {
  .coll-page__hero {
    min-height: 35vh;
  }

  .coll-page__hero-content {
    padding: 40px 24px;
  }

  .coll-page__hero-logo {
    max-width: 440px;
  }

  .coll-page__grid {
    grid-template-columns: repeat(1, 1fr);
  }

  .coll-page__product-info {
    padding: 12px 14px 16px;
    margin-top: -85px;
  }

  .coll-page__product-title {
    font-size: 18px;
  }

  .coll-page__product-subtitle {
    font-size: 16px;
  }

  .coll-page__pagination {
    padding: 28px 16px;
  }

  .coll-page__product-image {
    height: auto;
  }
}

@media (max-width: 480px) {
  .coll-page__hero {
    min-height: 28vh;
  }

  .coll-page__hero-content {
    padding: 32px 16px;
  }

  .coll-page__hero-logo {
    max-width: 280px;
  }

  .coll-page__grid {
    grid-template-columns: 1fr;
  }

  .coll-page__product-info {
    padding: 10px 12px 14px;
  }

  .coll-page__pagination-btn,
  .coll-page__pagination-num {
    font-size: 12px;
    padding: 6px 12px;
  }
}


/* ===================== TURMERIC QUALITY SECTION ===================== */
.turmeric-quality-section {
  position: relative;
  background-color: #1a2024;
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  background-attachment: fixed;
  padding: 80px 0;
  min-height: 600px;
  display: flex;
  align-items: center;
  justify-content: center;
}

.turmeric-quality-section::before {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg, rgba(0,0,0,0.6) 0%, rgba(0,0,0,0.38) 50%, rgba(0,0,0,0.6) 100%);
  z-index: 1;
}

.tq-container {
  position: relative;
  z-index: 2;
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  gap: 30px;
  max-width: 1000px;
  margin: 0 auto;
}

.tq-block {
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.tq-block--first .tq-title {
  font-family: var(--font-body);
  font-size: 28px;
  font-weight: 500;
  text-transform: none;
  letter-spacing: 0;
  line-height: 1.4;
  margin-bottom: 20px;
}

.tq-title {
  color: var(--color-white);
  font-family: var(--font-body);
  font-size: 28px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  margin: 0;
}

.tq-text {
  color: var(--color-white);
  font-family: var(--font-body);
  font-size: 20px;
  font-weight: 400;
  line-height: 1.6;
  margin: 0;
}

@media (max-width: 1024px) {
  .turmeric-quality-section {
    padding: 60px 0;
  }

  .tq-container {
    gap: 24px;
    padding: 0 20px;
  }

  .tq-block--first .tq-title {
    font-size: 18px;
    margin-bottom: 16px;
  }

  .tq-title {
    font-size: 15px;
  }

  .tq-text {
    font-size: 14px;
  }
}


/* ═══════════════════════════════════════════════
   CLINICIAN PROGRAM — Hero Banner + Form Card
   ═══════════════════════════════════════════════ */

/* ── Hero Banner ── */
.clinician-hero {
  position: relative;
  min-height: 120vh;
  display: flex;
  align-items: flex-start;
  justify-content: center;
  overflow: hidden;
  padding: 80px 0 20px;
}

.clinician-hero__bg {
  position: absolute;
  inset: 0;
  background-size: cover;
  background-position: center top;
  background-repeat: no-repeat;
  background-attachment: fixed;
  z-index: 0;
}

.clinician-hero__overlay {
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg, rgba(18, 18, 18, 0) 0%, rgba(18, 18, 18, 0.35) 100%);
  z-index: 1;
  pointer-events: none;
}

.clinician-hero__content {
  position: relative;
  z-index: 2;
  width: 100%;
  max-width: var(--container-narrow);
  margin: 0 auto;
  padding: 52vh var(--gutter) 0;
  transform: translateY(-80px);
}

.clinician-hero__eyebrow {
  display: block;
  font-family: var(--font-heading);
  font-size: 19px;
  font-weight: 700;
  letter-spacing: 3px;
  text-transform: uppercase;
  color: #fff;
  margin-bottom: 5px;
  text-align: left;
}

.clinician-hero__title {
  font-family: var(--font-body);
  font-size: clamp(32px, 5vw, 54px);
  font-weight: 700;
  letter-spacing: normal;
  color: #ffffff;
  margin: 0 0 30px;
  line-height: 1.15;
  text-align: left;
}

.clinician-hero__subtitle {
  font-family: var(--font-body);
  font-size: 28px;
  line-height: 1.2;
  color: rgba(255, 255, 255, 0.85);
  margin: 0;
  text-align: left;
}

.clinician-hero__subtitle strong {
  font-weight: 700;
  color: #fff;
}

.clinician-hero__subtitle em {
  font-style: italic;
}

/* ── Form Section (overlaps hero) ── */
.clinician-section {
  background-color: transparent;
  background-size: cover;
  background-position: center top;
  background-repeat: no-repeat;
  background-attachment: fixed;
  padding: 50px 0 60px;
  margin-top: -60px;
  position: relative;
  z-index: 3;
}

/* Continues the hero gradient so the shared image reads as one — no seam */
.clinician-section::before {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg, rgba(18, 18, 18, 0.35) 0%, rgba(18, 18, 18, 0.55) 100%);
  z-index: 0;
  pointer-events: none;
}

.clinician__card {
  position: relative;
  z-index: 1;
  max-width: 960px;
  margin: 0px auto 0 auto;
  background: #fff;
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  box-shadow: 0 8px 40px rgba(0, 0, 0, 0.12);
  padding: 48px 52px 40px;
}

.clinician__inner {
  width: 100%;
}

/* ── Header ── */
.clinician__header {
  margin-bottom: 24px;
  border-bottom: 1px solid #e0e0e0;
  padding-bottom: 18px;
}

.clinician__title {
  font-family: var(--font-body);
  font-size: 28px;
  font-weight: 700;
  color: #1a1a1a;
  margin: 0 0 8px;
  line-height: 1.2;
}

.clinician__desc {
  font-family: var(--font-body);
  font-size: 14px;
  font-weight: 400;
  line-height: 1.55;
  color: #444;
  margin: 0 0 5px;
}

.clinician__required-note {
  font-family: var(--font-body);
  font-size: 14px;
  font-weight: 400;
  font-style: italic;
  color: #888;
  margin: 0;
}

/* ── Checkboxes ── */
.clinician__checkboxes {
  display: flex;
  flex-direction: column;
  gap: 8px;
  margin-bottom: 28px;
}

.clinician__checkbox-label {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  font-family: var(--font-body);
  font-size: 14px;
  font-weight: 400;
  color: #333;
  cursor: pointer;
  line-height: 1.45;
}

.clinician__checkbox {
  appearance: none;
  -webkit-appearance: none;
  width: 15px;
  height: 15px;
  min-width: 15px;
  border: 1px solid #e0e0e0;
  border-radius: 2px;
  background: #fff;
  cursor: pointer;
  position: relative;
  margin-top: 1px;
  transition: border-color 0.2s ease, background 0.2s ease;
}

.clinician__checkbox:checked {
  border-color: #2D9B8B;
  background: #2D9B8B;
}

.clinician__checkbox:checked::after {
  content: '';
  position: absolute;
  left: 4px;
  top: 1px;
  width: 5px;
  height: 8px;
  border: solid #fff;
  border-width: 0 2px 2px 0;
  transform: rotate(45deg);
}

.clinician__checkbox:hover {
  border-color: #2D9B8B;
}

/* ── Form ── */
.clinician__form {
  width: 100%;
}

/* ── Two-Column Grid ── */
.clinician__grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 0 44px;
}

.clinician__col {
  display: flex;
  flex-direction: column;
  gap: 0;
}

/* ── Field ── */
.clinician__field {
  margin-bottom: 16px;
}

.clinician__row--two {
  grid-template-columns: 1fr;
  gap: 0;
}
.clinician__row--two {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 0 20px;
}

.clinician__label {
  display: block;
  font-family: var(--font-body);
  font-size: 14px;
  font-weight: 700;
  color: #1a1a1a;
  margin-bottom: 3px;
  letter-spacing: 0.2px;
}

.clinician__req {
  color: #FD0D15;
  margin-left: 1px;
}

.clinician__input {
  width: 100%;
  border: none;
  border: 1.5px solid #e0e0e0;
  padding: 5px 0;
  font-family: var(--font-body);
  font-size: 13px;
  color: #333;
  background: transparent;
  outline: none;
  border-radius: 0;
  transition: border-color 0.25s ease;
}

.clinician__input:focus {
  border-bottom-color: #2D9B8B;
}

.clinician__textarea {
  width: 100%;
  border: 1.5px solid #e0e0e0;
  padding: 10px 12px;
  font-family: var(--font-body);
  font-size: 13px;
  color: #333;
  background: transparent;
  outline: none;
  border-radius: 0;
  resize: vertical;
  min-height: 120px;
  transition: border-color 0.25s ease;
}

.clinician__textarea:focus {
  border-color: #2D9B8B;
}

/* ── Wholesale Note ── */
.clinician__wholesale-note {
  font-family: var(--font-body);
  font-size: 14px;
  font-weight: 700;
  color: #1a1a1a;
  margin: -10px 0 0;
}

/* ── Submit ── */
.clinician__submit-wrap {
  display: flex;
  justify-content: center;
  margin-top: 32px;
  margin-bottom: 36px;
}

.clinician__submit {
  display: inline-block;
  background: #202020;
  color: #fff;
  font-family: var(--font-body);
  font-size: 16px;
  font-weight: 700;
  letter-spacing: 3px;
  text-transform: uppercase;
  padding: 20px 40px;
  border: none;
  cursor: pointer;
  transition: background 0.3s ease, transform 0.2s ease, box-shadow 0.3s ease;
}

.clinician__submit:hover {
  background: #202020;
  transform: translateY(-1px);
  box-shadow: 0 4px 16px rgba(45, 74, 90, 0.35);
}

.clinician__submit:active {
  transform: translateY(0);
  box-shadow: none;
}

/* ── RxG Logo ── */
.clinician__logo-wrap {
  display: flex;
  justify-content: center;
  padding: 8px 0 0;
}

.clinician__rxg-logo {
  width: 120px;
  height: auto;
}

.clinician__rxg-svg {
  width: 100%;
  height: auto;
  display: block;
}

/* ═══════════════════════════════════════════════
   CLINICIAN PROGRAM — Responsive
   ═══════════════════════════════════════════════ */

@media (max-width: 1140px) {
  .clinician-hero__content {
    padding: 0 40px 70px;
  }

  .clinician__card {
    max-width: 860px;
    padding: 40px 40px 36px;
  }
}

@media (max-width: 1024px) {
  .clinician-hero {
    min-height: 400px;
  }

  .clinician-hero__content {
    padding: 0 24px 60px;
  }

  .clinician-hero__eyebrow {
    font-size: 11px;
    letter-spacing: 2.5px;
  }

  .clinician-hero__subtitle {
    font-size: 13px;
  }

  .clinician-section {
    margin-top: -48px;
    padding-bottom: 40px;
  }

  .clinician__card {
    margin: 0 16px;
    padding: 32px 28px 28px;
  }

  .clinician__title {
    font-size: 22px;
  }

  .clinician__grid {
    grid-template-columns: 1fr;
    gap: 0;
  }

  .clinician__submit {
    width: 100%;
    padding: 13px 32px;
  }
}

@media (max-width: 480px) {
  .clinician-hero {
    min-height: 340px;
  }

  .clinician-hero__content {
    padding: 0 16px 48px;
  }

  .clinician-hero__eyebrow {
    font-size: 10px;
    letter-spacing: 2px;
  }

  .clinician-hero__title {
    font-size: 28px;
  }

  .clinician-hero__subtitle {
    font-size: 12px;
  }

  .clinician-section {
    margin-top: -40px;
    padding-bottom: 32px;
  }

  .clinician__card {
    margin: 0 10px;
    padding: 24px 18px 22px;
  }

  .clinician__title {
    font-size: 20px;
  }

  .clinician__desc {
    font-size: 10px;
  }

  .clinician__checkbox-label {
    font-size: 11px;
  }

  .clinician__label {
    font-size: 10px;
  }

  .clinician__input {
    font-size: 12px;
  }

  .clinician__textarea {
    font-size: 12px;
    min-height: 100px;
  }

  .clinician__submit {
    font-size: 13px;
    padding: 12px 24px;
    letter-spacing: 2.5px;
  }

  .clinician__rxg-logo {
    width: 72px;
  }
}  



/* ═══════════════════════════════════════════════
   REFLUX RESCUE — Video Section
   ═══════════════════════════════════════════════ */
.reflux-rescue {
  width: 100%;
}

.reflux-rescue__inner {
  display: flex;
  min-height: 480px;
}

.reflux-rescue__text-col {
  flex: 0 0 50%;
  display: flex;
  align-items: center;
  justify-content: center;
}

.reflux-rescue__content {
  padding: 56px 0px;
  /* max-width: 520px; */
}

.reflux-rescue__subheading {
  font-family: var(--font-heading);
  font-size: 16px;
  font-weight: 700;
  letter-spacing: 2.5px;
  text-transform: uppercase;
  color: #fff;
  margin: 0 0 12px;
}

.reflux-rescue__title {
  font-family: var(--font-body);
  font-size: clamp(28px, 3.5vw, 50px);
  font-weight: 600;
  color: #fff;
  line-height: 1.15;
  margin: 0 0 20px;
}

.reflux-rescue__caption {
  font-family: var(--font-body);
  font-size: 14px;
  font-weight: 400;
  letter-spacing: 0.5px;
  color: rgba(255, 255, 255, 0.8);
  text-align: center;
  margin: 16px 0 0;
}

.reflux-rescue__text {
  font-family: var(--font-body);
  font-size: 24px;
  line-height: 1.7;
  color: rgba(255, 255, 255, 0.85);
  margin-bottom: 28px;
}

.reflux-rescue__text p {
  margin: 0 0 12px;
}

.reflux-rescue__text p:last-child {
  margin-bottom: 0;
}

.reflux-rescue__bottom {
  display: flex;
  flex-direction: column;
  gap: 10px;
}

.reflux-rescue__subheading-small {
  font-family: var(--font-body);
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 2px;
  text-transform: uppercase;
  color: #fff;
  margin: 0;
}

.reflux-rescue__link {
  font-family: var(--font-body);
  font-size: var(--fs-body);
  font-weight: 700;
  letter-spacing: 2px;
  text-transform: uppercase;
  color: #fff;
  text-decoration: none;
  border-bottom: 1.5px solid rgba(255, 255, 255, 0.5);
  padding-bottom: 0px;
  display: inline-block;
  transition: border-color 0.2s ease, opacity 0.2s ease;
}

.reflux-rescue__link:hover {
  border-color: #fff;
  opacity: 0.85;
}

/* ── Media Column ── */
.reflux-rescue__media-col {
  flex: 0 0 50%;
  position: relative;
  background: #000;
}

.reflux-rescue__media-inner {
  width: 100%;
  height: 100%;
}

.reflux-rescue__video-wrap {
  position: relative;
  width: 100%;
  height: 100%;
  min-height: 360px;
  background: #000;
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
}

.reflux-rescue__video-thumb {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

.reflux-rescue__video {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  background: #000;
}

.reflux-rescue__video-placeholder {
  background: #111;
  display: flex;
  align-items: center;
  justify-content: center;
}

/* ── Play Button ── */
.reflux-rescue__play-btn {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 64px;
  height: 64px;
  border: none;
  background: none;
  cursor: pointer;
  z-index: 3;
  padding: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: transform 0.25s ease, opacity 0.25s ease;
}

.reflux-rescue__play-btn:hover {
  transform: translate(-50%, -50%) scale(1.1);
}

.reflux-rescue__play-btn svg {
  width: 64px;
  height: 64px;
  display: block;
}

/* ── Embedded iframe ── */
.reflux-rescue__video-wrap iframe {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  border: 0;
}

/* ═══════════════════════════════════════════════
   REFLUX RESCUE — Responsive
   ═══════════════════════════════════════════════ */
@media (max-width: 1024px) {
  .reflux-rescue__inner {
    flex-direction: column;
    min-height: auto;
  }

  .reflux-rescue__text-col,
  .reflux-rescue__media-col {
    flex: none;
    width: 100%;
  }

  .reflux-rescue__content {
    padding: 40px 24px;
  }

  .reflux-rescue__video-wrap {
    min-height: 300px;
    aspect-ratio: 16 / 9;
  }

  .reflux-rescue__play-btn {
    width: 56px;
    height: 56px;
  }

  .reflux-rescue__play-btn svg {
    width: 56px;
    height: 56px;
  }
}

@media (max-width: 480px) {
  .reflux-rescue__content {
    padding: 32px 16px;
  }

  .reflux-rescue__title {
    font-size: 26px;
  }

  .reflux-rescue__text {
    font-size: 13px;
  }

  .reflux-rescue__video-wrap {
    min-height: 240px;
  }

  .reflux-rescue__play-btn {
    width: 48px;
    height: 48px;
  }

  .reflux-rescue__play-btn svg {
    width: 48px;
    height: 48px;
  }
}


/* ═══════════════════════════════════════════════
   ARTICLE PAGE — Shell (featured-image bg) + full-length card
   ═══════════════════════════════════════════════ */
.article-shell {
  position: relative;
  background-color: var(--color-dark);
  padding: calc(var(--header-height) + 150px) var(--gutter) 90px;
}

/* Featured image spans only the top bar, then fades into the charcoal field */
.article-shell__banner {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  height: calc(var(--header-height) + 380px);
  background-color: var(--color-dark);
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  z-index: 0;
}

.article-shell__banner::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(
    180deg,
    rgba(18, 18, 18, 0.35) 0%,
    rgba(18, 18, 18, 0) 40%,
    rgba(18, 18, 18, 0) 100%
  );
  pointer-events: none;
}

.article-card {
  position: relative;
  z-index: 1;
  width: 100%;
  max-width: 820px;
  margin: 0 auto;
  background: #fff;
  box-shadow: 0 24px 60px rgba(0, 0, 0, 0.22);
  padding: 48px 56px 52px;
}

.article-card__head {
  text-align: center;
  margin-bottom: 4px;
}

.article-masthead__filed {
  font-family: var(--font-overline);
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 2.5px;
  text-transform: uppercase;
  color: var(--color-text-light);
  margin: 0 0 18px;
}

.article-masthead__title {
  font-family: var(--font-body);
  font-size: clamp(24px, 3.2vw, 40px);
  font-weight: 700;
  color: var(--color-dark);
  text-transform: uppercase;
  letter-spacing: 1px;
  line-height: 1.15;
  margin: 0 0 22px;
}

.article-masthead__byline {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-wrap: wrap;
  gap: 0 18px;
  padding-top: 18px;
  padding-bottom: 18px;
  border-top: 1px solid var(--color-border);
  border-bottom: 1px solid var(--color-border);
  font-family: var(--font-body);
  font-size: 12px;
  font-weight: 500;
  letter-spacing: 1.5px;
  text-transform: uppercase;
  color: var(--color-text-light);
}

.article-masthead__byline-sep {
  width: 1px;
  height: 12px;
  background: var(--color-border);
}

/* ═══════════════════════════════════════════════
   ARTICLE PAGE — Author Bio (1/3 image · 2/3 italic)
   ═══════════════════════════════════════════════ */
.article-bio {
  display: grid;
  grid-template-columns: 1fr 2fr;
  gap: 28px;
  align-items: center;
  margin: 44px 0 8px;
  padding: 28px 0;
  border-top: 1px solid var(--color-border);
  border-bottom: 1px solid var(--color-border);
}

.article-bio__media img {
  width: 100%;
  height: auto;
  display: block;
  border-radius: var(--radius-sm);
}

.article-bio__text {
  font-family: var(--font-body);
  font-size: 14px;
  font-style: italic;
  line-height: 1.7;
  color: var(--color-text-light);
}

.article-bio__text--full {
  grid-column: 1 / -1;
  text-align: center;
}

.article-bio__text p {
  margin: 0 0 10px;
}

.article-bio__text p:last-child {
  margin-bottom: 0;
}

/* ═══════════════════════════════════════════════
   ARTICLE PAGE — Body Content
   ═══════════════════════════════════════════════ */
.article-body {
  background: #fff;
  padding-bottom: 60px;
}

.article-body__container {
  max-width: 760px;
  margin: 0 auto;
  padding: 0 var(--gutter);
}

.article-body__content {
  font-family: var(--font-body);
  font-size: 14px;
  line-height: 1.75;
  color: var(--color-text);
  margin-top: 32px;
}

.article-body__content p {
  margin: 0;
}

/* Indent subsequent paragraphs instead of using line spacing */
.article-body__content p + p {
  text-indent: 1.6em;
}

/* WP-migrated content wraps each block in an empty comment <p>
   (<p><!-- wp:paragraph --></p>), so the first VISIBLE paragraph is really
   the 2nd <p> and gets wrongly indented. Keep the opening paragraph flush
   whether or not that leading empty paragraph is present. */
.article-body__content > p:first-child,
.article-body__content > p:first-child + p {
  text-indent: 0;
}

/* But never indent a paragraph that follows a block element */
.article-body__content h2 + p,
.article-body__content h3 + p,
.article-body__content h4 + p,
.article-body__content blockquote + p,
.article-body__content ul + p,
.article-body__content ol + p,
.article-body__content img + p,
.article-body__content figure + p {
  text-indent: 0;
}

/* Upgraded subheads */
.article-body__content h2,
.article-body__content h3,
.article-body__content h4 {
  font-family: var(--font-heading);
  color: var(--color-dark);
  text-transform: uppercase;
  line-height: 1.25;
}

.article-body__content h2 {
  font-size: 22px;
  font-weight: 700;
  letter-spacing: 1px;
  margin: 40px 0 14px;
  padding-bottom: 10px;
  border-bottom: 2px solid #262626;
}

.article-body__content h3 {
  font-size: 17px;
  font-weight: 700;
  letter-spacing: 1.5px;
  margin: 32px 0 12px;
  color: #262626;
}

/* Recipe section sub-heads (Ingredients Needed / Preparation / Directions):
   match the dish-name (h3) size but in charcoal #262626 per DD. */
.article-body__content h4 {
  font-size: 17px;
  font-weight: 700;
  letter-spacing: 1.5px;
  margin: 28px 0 4px;
  color: #262626;
}

.article-body__content img {
  border-radius: var(--radius-md);
  margin: 28px 0;
  box-shadow: 0 2px 16px rgba(0, 0, 0, 0.06);
}

/* Pull quotes: thin rules above + below, centered brand-color quote */
.article-body__content blockquote {
  border: 0;
  border-top: 1px solid #262626;
  border-bottom: 1px solid #262626;
  padding: 24px 8px;
  margin: 36px 0;
  background: none;
  border-radius: 0;
  text-align: center;
  text-indent: 0;
  font-family: var(--font-heading);
  font-style: italic;
  font-size: 21px;
  line-height: 1.4;
  color: #262626;
}

.article-body__content blockquote p {
  margin: 0;
  text-indent: 0;
}

.article-body__content blockquote p + p {
  text-indent: 0;
  margin-top: 8px;
}

.article-body__content ul,
.article-body__content ol {
  padding-left: 28px;
  margin: 16px 0;
}

.article-body__content li {
  margin-bottom: 8px;
  list-style: disc;
}

.article-body__content ol li {
  list-style: decimal;
}

/* Legal / medical disclaimer, auto-separated from the body with hairlines
   top + bottom and extra spacing (see main-article.liquid script). */
.article-body__content .article-legal {
  margin-top: 52px;
  padding: 26px 0;
  border-top: 1px solid var(--color-border);
  border-bottom: 1px solid var(--color-border);
  color: #262626;
  /* Smaller than the body copy, but keep the same #262626 color. */
  font-size: 0.85em;
}

.article-body__content .article-legal em,
.article-body__content .article-legal i,
.article-body__content .article-legal p,
.article-body__content .article-legal div {
  display: block;
  font-style: italic;
  text-indent: 0;
  margin: 0 0 12px;
}

.article-body__content .article-legal > :last-child {
  margin-bottom: 0;
}

/* Auto-generated ingredient bullets (see main-article.liquid script) */
.article-body__content ul.article-ingredients {
  margin: 14px 0 8px;
}

.article-body__content ul.article-ingredients li {
  margin-bottom: 6px;
  text-indent: 0;
  list-style: disc;
}

.article-body__content a {
  color: var(--color-primary);
  text-decoration: underline;
  text-underline-offset: 3px;
  transition: color 0.2s ease;
}

.article-body__content a:hover {
  color: var(--color-primary-dark);
}

/* ── Extra content blocks ── */
.article-body__extra-content {
  font-family: var(--font-body);
  font-size: 15px;
  line-height: 1.8;
  color: var(--color-text);
  margin-top: 24px;
}

.article-body__extra-content p {
  margin: 0 0 18px;
}

/* ═══════════════════════════════════════════════
   ARTICLE PAGE — Image Gallery
   ═══════════════════════════════════════════════ */
.article-gallery {
  margin: 32px 0;
}

.article-gallery--row {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 16px;
}

.article-gallery__item {
  overflow: hidden;
  border-radius: var(--radius-md);
  position: relative;
}

.article-gallery--row .article-gallery__item img {
  width: 100%;
  height: 220px;
  object-fit: cover;
}

.article-gallery__item img {
  width: 100%;
  height: auto;
  display: block;
  border-radius: var(--radius-md);
  transition: transform 0.4s ease;
}

.article-gallery__item:hover img {
  transform: scale(1.04);
}

.article-gallery__caption {
  font-family: var(--font-body);
  font-size: 12px;
  color: var(--color-text-light);
  text-align: center;
  margin-top: 8px;
  font-style: italic;
}

.article-gallery__caption--row {
  grid-column: 1 / -1;
}

/* ═══════════════════════════════════════════════
   ARTICLE PAGE — Feature Box (recipe / tips / list)
   ═══════════════════════════════════════════════ */
.article-feature {
  margin: 36px 0;
  background: var(--color-box-bg);
  border: 1px solid var(--color-border);
  border-top: 3px solid #262626;
  padding: 32px 36px;
}

.article-feature__media {
  margin-bottom: 24px;
}

.article-feature__media img {
  width: 100%;
  height: auto;
  display: block;
  border-radius: var(--radius-sm);
}

.article-feature--has-image.article-feature--image-left,
.article-feature--has-image.article-feature--image-right {
  display: grid;
  grid-template-columns: 1fr 1.4fr;
  gap: 32px;
  align-items: start;
}

.article-feature--image-left .article-feature__media,
.article-feature--image-right .article-feature__media {
  margin-bottom: 0;
}

.article-feature--image-right .article-feature__media {
  order: 2;
}

.article-feature__eyebrow {
  font-family: var(--font-overline);
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 2.5px;
  text-transform: uppercase;
  color: #262626;
  margin: 0 0 8px;
}

.article-feature__heading {
  font-family: var(--font-heading);
  font-size: 22px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.5px;
  color: var(--color-dark);
  line-height: 1.2;
  margin: 0 0 16px;
}

.article-feature__content {
  font-family: var(--font-body);
  font-size: 14px;
  line-height: 1.7;
  color: var(--color-text);
}

.article-feature__content p {
  margin: 0 0 12px;
}

.article-feature__content p:last-child {
  margin-bottom: 0;
}

.article-feature__content ul,
.article-feature__content ol {
  padding-left: 22px;
  margin: 12px 0;
}

.article-feature__content li {
  margin-bottom: 6px;
  list-style: disc;
}

.article-feature__content ol li {
  list-style: decimal;
}

/* ═══════════════════════════════════════════════
   ARTICLE PAGE — Video Embed
   ═══════════════════════════════════════════════ */
.article-video {
  margin: 36px 0;
}

.article-video__wrapper {
  position: relative;
  padding-bottom: 56.25%;
  height: 0;
  overflow: hidden;
  border-radius: var(--radius-md);
  box-shadow: 0 4px 20px rgba(0, 0, 0, 0.1);
  background: #000;
}

.article-video__wrapper iframe {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  border: 0;
}

.article-video__caption {
  font-family: var(--font-body);
  font-size: 12px;
  color: var(--color-text-light);
  text-align: center;
  margin-top: 12px;
  font-style: italic;
}

/* ═══════════════════════════════════════════════
   ARTICLE PAGE — Author Signature
   ═══════════════════════════════════════════════ */
.article-signature {
  margin-top: 48px;
  padding-top: 32px;
  border-top: 1px solid var(--color-border);
}

.article-signature__image {
  width: 100%;
  max-width: 560px;
  border-radius: var(--radius-md);
  margin-bottom: 28px;
  box-shadow: 0 2px 12px rgba(0, 0, 0, 0.06);
}

.article-signature__text {
  margin-bottom: 20px;
}

.article-signature__closing {
  font-family: var(--font-heading);
  font-size: 18px;
  font-style: italic;
  color: var(--color-text);
  margin: 0 0 6px;
}

.article-signature__name {
  font-family: var(--font-heading);
  font-size: 16px;
  font-weight: 700;
  color: var(--color-dark);
  margin: 0 0 2px;
}

.article-signature__role {
  font-family: var(--font-body);
  font-size: 13px;
  color: var(--color-text-light);
  font-style: italic;
  margin: 0;
}

.article-signature__bio {
  font-family: var(--font-body);
  font-size: 14px;
  line-height: 1.75;
  color: var(--color-text);
  margin-top: 16px;
}

.article-signature__bio p {
  margin: 0 0 12px;
}

.article-signature__bio p:last-child {
  margin-bottom: 0;
}

/* ═══════════════════════════════════════════════
   ARTICLE PAGE — Disclaimer (thin rule divides article)
   ═══════════════════════════════════════════════ */
.article-disclaimer {
  margin-top: 60px;
  padding-top: 28px;
  padding-bottom: 28px;
  border-top: 1px solid var(--color-border);
  border-bottom: 1px solid var(--color-border);
}

.article-disclaimer__heading {
  font-family: var(--font-body);
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 2px;
  text-transform: uppercase;
  color: var(--color-text-light);
  margin: 0 0 10px;
}

.article-disclaimer__text {
  font-family: var(--font-body);
  font-size: 12px;
  line-height: 1.65;
  color: var(--color-muted);
}

.article-disclaimer__text p {
  margin: 0 0 10px;
}

.article-disclaimer__text p:last-child {
  margin-bottom: 0;
}

.article-disclaimer__text a {
  color: var(--color-text-light);
  text-decoration: underline;
}

/* ═══════════════════════════════════════════════
   ARTICLE PAGE — Footer meta (tags) + Back to Blog
   ═══════════════════════════════════════════════ */
.article-footer-meta {
  margin-top: 40px;
  padding-top: 24px;
  border-top: 1px solid var(--color-border);
}

/* When the post ends with the separated legal/disclaimer block (it already
   has its own bottom hairline), drop the footer divider so they don't double. */
.article-card:has(.article-legal) .article-footer-meta {
  border-top: none;
  padding-top: 0;
}

.article-footer-meta__tags {
  font-family: var(--font-body);
  font-size: 12px;
  font-weight: 600;
  letter-spacing: 1px;
  text-transform: uppercase;
  color: var(--color-text-light);
  margin: 0 0 18px;
}

.article-footer-meta__tags a {
  color: var(--color-text-light);
  text-decoration: none;
  transition: color 0.2s ease;
}

.article-footer-meta__tags a:hover {
  color: var(--color-rule);
}

.article-footer-meta__tags span {
  opacity: 0.5;
  margin: 0 4px;
}

.article-back {
  margin-top: 0;
  padding-top: 0;
  border-top: 0;
}

.article-back__link {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  font-family: var(--font-body);
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 2.5px;
  text-transform: uppercase;
  color: var(--color-dark);
  text-decoration: none;
  transition: color 0.2s ease, gap 0.25s ease;
}

.article-back__link:hover {
  color: var(--color-primary);
  gap: 14px;
}

.article-back__link svg {
  width: 16px;
  height: 16px;
  transition: transform 0.25s ease;
}

.article-back__link:hover svg {
  transform: translateX(-3px);
}

/* ═══════════════════════════════════════════════
   ARTICLE PAGE — Related Articles
   ═══════════════════════════════════════════════ */
.article-related {
  background: var(--color-off-white);
  padding: 72px 0;
}

.article-related__inner {
  max-width: var(--container-width);
  margin: 0 auto;
  padding: 0 var(--gutter);
}

.article-related__heading {
  font-family: var(--font-body);
  font-size: 14px;
  font-weight: 700;
  letter-spacing: 3px;
  /* No uppercase transform so the brand lockup "RxG" keeps its lowercase x. */
  text-transform: none;
  color: var(--color-dark);
  text-align: center;
  margin-bottom: 40px;
}

.article-related__grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 28px;
}

.article-related__card {
  background: #fff;
  border-radius: var(--radius-md);
  overflow: hidden;
  text-decoration: none;
  box-shadow: var(--shadow-sm);
  transition: transform 0.3s ease, box-shadow 0.3s ease;
  display: flex;
  flex-direction: column;
}

.article-related__card:hover {
  transform: translateY(-5px);
  box-shadow: var(--shadow-lg);
}

.article-related__card-img {
  aspect-ratio: 16 / 10;
  overflow: hidden;
}

.article-related__card-img img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform 0.4s ease;
}

.article-related__card:hover .article-related__card-img img {
  transform: scale(1.06);
}

.article-related__card-body {
  padding: 20px 24px 24px;
}

.article-related__card-filed {
  font-family: var(--font-overline);
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 2px;
  text-transform: uppercase;
  color: var(--color-text-light);
  margin: 0 0 8px;
}

.article-related__card-title {
  font-family: var(--font-body);
  font-size: 16px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.8px;
  color: var(--color-dark);
  line-height: 1.3;
  margin: 0 0 8px;
}

.article-related__card-excerpt {
  font-family: var(--font-body);
  font-size: 14px;
  font-weight: 300;
  line-height: 1.6;
  color: var(--color-text);
  margin: 0 0 12px;
  display: -webkit-box;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

.article-related__card-date {
  font-family: var(--font-body);
  font-size: 12px;
  color: var(--color-text-light);
  letter-spacing: 0.5px;
}

/* ═══════════════════════════════════════════════
   ARTICLE PAGE — Responsive: 1140px
   ═══════════════════════════════════════════════ */
@media (max-width: 1140px) {
  .article-shell {
    padding: calc(var(--header-height) + 110px) var(--gutter) 70px;
  }

  .article-shell__banner {
    height: calc(var(--header-height) + 300px);
  }

  .article-card {
    max-width: 680px;
  }

  .article-related__grid {
    grid-template-columns: repeat(3, 1fr);
    gap: 20px;
  }
}

/* ═══════════════════════════════════════════════
   ARTICLE PAGE — Responsive: 768px
   ═══════════════════════════════════════════════ */
@media (max-width: 1024px) {
  .article-shell {
    padding: calc(var(--header-height) + 70px) 16px 50px;
  }

  .article-shell__banner {
    height: calc(var(--header-height) + 220px);
  }

  .article-card {
    padding: 32px 28px 36px;
  }

  .article-masthead__title {
    font-size: 26px;
    letter-spacing: 0.5px;
  }

  .article-masthead__byline {
    font-size: 11px;
    gap: 0 12px;
  }

  .article-bio {
    grid-template-columns: 1fr;
    gap: 18px;
    text-align: center;
  }

  .article-bio__media {
    max-width: 200px;
    margin: 0 auto;
  }

  .article-body__content {
    font-size: 14px;
    margin-top: 24px;
  }

  .article-body__content h2 {
    font-size: 20px;
  }

  .article-body__content h3 {
    font-size: 16px;
  }

  .article-body__content blockquote {
    font-size: 19px;
  }

  .article-feature {
    padding: 26px 24px;
  }

  .article-feature--has-image.article-feature--image-left,
  .article-feature--has-image.article-feature--image-right {
    grid-template-columns: 1fr;
    gap: 20px;
  }

  .article-feature--image-right .article-feature__media {
    order: 0;
  }

  .article-gallery--row .article-gallery__item img {
    height: 160px;
  }

  .article-related__grid {
    grid-template-columns: 1fr;
    gap: 20px;
  }

  .article-related {
    padding: 48px 0;
  }

  .article-signature__image {
    max-width: 100%;
  }
}

/* ═══════════════════════════════════════════════
   ARTICLE PAGE — Responsive: 480px
   ═══════════════════════════════════════════════ */
@media (max-width: 480px) {
  .article-shell {
    padding: calc(var(--header-height) + 48px) 10px 40px;
  }

  .article-shell__banner {
    height: calc(var(--header-height) + 170px);
  }

  .article-card {
    padding: 26px 20px 30px;
  }

  .article-masthead__filed {
    font-size: 11px;
    letter-spacing: 2px;
    margin-bottom: 14px;
  }

  .article-masthead__title {
    font-size: 22px;
    letter-spacing: 0.5px;
    margin-bottom: 18px;
  }

  .article-masthead__byline {
    font-size: 10px;
    letter-spacing: 1px;
  }

  .article-bio__text {
    font-size: 13px;
  }

  .article-body__content {
    font-size: 13px;
  }

  .article-body__content h2 {
    font-size: 19px;
  }

  .article-body__content h3 {
    font-size: 15px;
  }

  .article-body__content blockquote {
    font-size: 17px;
    padding: 20px 4px;
  }

  .article-gallery--row {
    grid-template-columns: 1fr 1fr;
    gap: 10px;
  }

  .article-gallery--row .article-gallery__item img {
    height: 130px;
  }

  .article-related__grid {
    grid-template-columns: 1fr;
    gap: 16px;
  }

  .article-related__heading {
    font-size: 12px;
    letter-spacing: 2.5px;
    margin-bottom: 28px;
  }

  .article-back__link {
    font-size: 11px;
    letter-spacing: 2px;
  }

  .article-signature__closing {
    font-size: 16px;
  }

  .article-signature__name {
    font-size: 14px;
  }

  .article-signature__role {
    font-size: 12px;
  }

  .article-signature__bio {
    font-size: 13px;
  }
}

/* ═══════════════════════════════════════════════
   PRODUCT ALT — Alternate Product Layout
   ═══════════════════════════════════════════════ */
.product-alt {
  padding: 150px 0 0;
  background: var(--color-white);
}

.product-alt__inner {
  display: grid;
  grid-template-columns: 1fr 1fr 1fr;
  gap: 40px;
  align-items: start;
  max-width: 100% !important;
  margin: 0 auto;
  padding: 0 60px;
}

/* Left Column */
.product-alt__left {
  position: sticky;
  top: 100px;
}

.product-alt__title {
  font-family: var(--font-body);
  font-size: 52px;
  font-weight: 900;
  letter-spacing: -0.5px;
  line-height: 1.1;
  text-transform: uppercase;
  color: #1a1a1a;
  margin-bottom: 8px;
}

.product-alt__price {
  font-family: var(--font-body);
  font-size: 32px;
  font-weight: 700;
  color: var(--color-dark);
  margin-bottom: 16px;
  margin-top: 10px;
}

.product-alt__price s {
  color: var(--color-text-light);
  font-size: 16px;
  margin-left: 8px;
}

.product-alt__desc {
  font-size: 14px;
  line-height: 1.6;
  color: var(--color-text);
  margin-bottom: 24px;
}

/* Form Row */
.product-alt__form-row {
  display: flex;
  gap: 12px;
  margin-bottom: 24px;
  width: 145px;
}

.product-alt__quantity {
  display: none;
  align-items: center;
  background: #666;
  border-radius: 4px;
  overflow: hidden;
  width: 100px;
}

.product-alt__quantity .qty-btn {
  width: 32px;
  height: 40px;
  background: #666;
  color: #fff;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 18px;
  border: none;
  cursor: pointer;
}

.product-alt__quantity .qty-input {
  width: calc(100% - 64px);
  height: 40px;
  border: none;
  text-align: center;
  font-family: var(--font-body);
  font-size: 14px;
  background: transparent;
  color: #fff;
  padding: 0;
  -moz-appearance: textfield;
}

.product-alt__quantity .qty-input::-webkit-outer-spin-button,
.product-alt__quantity .qty-input::-webkit-inner-spin-button {
  -webkit-appearance: none;
  margin: 0;
}

/* Center Column */
.product-alt__center {
  display: flex;
  flex-direction: column;
  gap: 20px;
}

.product-alt__media-item img {
  width: 100%;
  height: auto;
  display: block;
}

/* Right Column & Text Blocks */
.product-alt__right {
  position: sticky;
  top: 100px;
  display: flex;
  flex-direction: column;
  gap: 24px;
}

.product-alt__subheading {
  font-family: var(--font-body);
  font-size: 20px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 1px;
  color: var(--color-dark);
  margin-bottom: 0;
}

.product-alt__text {
  font-size: 20px;
  line-height: 1.6;
  color: #000;
}

.product-alt__text p {
  margin-bottom: 8px;
}

.product-alt__text p:last-child {
  margin-bottom: 0;
}

.product-alt__image-block img {
  width: 100%;
  height: auto;
  display: block;
  border: 1px solid #ddd;
}

/* ═══════════════════════════════════════════════
   PRODUCT ALT ACCORDION — Full-Width Teal
   ═══════════════════════════════════════════════ */
.product-alt-accordion {
  background: #5BA4A4;
  padding: 0;
  margin-top: 80px;
}

.product-alt-accordion__inner {
  max-width: 100%;
  margin: 0 auto;
  padding: 0 60px;
}

.product-alt-accordion__item {
  border-top: 2px solid rgba(0, 0, 0, 0.15);
}

.product-alt-accordion__item:last-child {
  border-bottom: 2px solid rgba(0, 0, 0, 0.15);
}

.product-alt-accordion__trigger {
  display: flex;
  align-items: center;
  justify-content: space-between;
  width: 100%;
  padding: 22px 8px;
  background: none;
  border: none;
  cursor: pointer;
  font-family: var(--font-body);
  text-align: left;
  transition: opacity 0.2s ease;
}

.product-alt-accordion__trigger:hover {
  opacity: 0.8;
}

.product-alt-accordion__trigger-text {
  font-family: var(--font-body);
  font-size: 18px;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: 2px;
  color: #000;
  line-height: 1.3;
}

.product-alt-accordion__icon {
  flex-shrink: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 22px;
  height: 22px;
  color: #000;
  margin-left: 16px;
}

/* Show + by default, hide - */
.product-alt-accordion__icon-plus {
  display: block;
}

.product-alt-accordion__icon-minus {
  display: none;
}

/* When open: hide +, show - */
.product-alt-accordion__item.is-open .product-alt-accordion__icon-plus {
  display: none;
}

.product-alt-accordion__item.is-open .product-alt-accordion__icon-minus {
  display: block;
}

/* Panel: collapsed by default, animated open */
.product-alt-accordion__panel {
  max-height: 0;
  overflow: hidden;
  transition: max-height 0.4s ease;
}

.product-alt-accordion__panel-inner {
  padding: 0 8px 24px;
  font-family: var(--font-body);
  font-size: 16px;
  line-height: 1.7;
  color: #1a1a1a;
}

.product-alt-accordion__panel-inner p {
  margin: 0 0 10px;
}

.product-alt-accordion__panel-inner p:last-child {
  margin-bottom: 0;
}

.product-alt-accordion__panel-inner img {
  width: 100%;
  height: auto;
  display: block;
  border-radius: 4px;
  margin: 8px 0;
}

.product-alt-accordion__panel-inner ul,
.product-alt-accordion__panel-inner ol {
  padding-left: 20px;
  margin: 8px 0;
}

.product-alt-accordion__panel-inner li {
  margin-bottom: 6px;
  list-style: disc;
}

.product-alt-accordion__panel-inner ol li {
  list-style: decimal;
}

.product-alt-accordion__panel-inner a {
  color: #000;
  font-weight: 700;
  text-decoration: underline;
  text-underline-offset: 3px;
}

.product-alt-accordion__panel-inner a:hover {
  color: #1a1a1a;
  text-decoration-thickness: 2px;
}

/* Product Alt Responsive */
@media(max-width: 1024px) {
  .product-alt__inner {
    grid-template-columns: 1fr;
    gap: 32px;
  }

  .product-alt__left,
  .product-alt__right {
    position: static;
  }

  .product-alt {
    padding: 100px 0 0;
  }

  .product-alt__inner {
    padding: 0 24px;
  }

  .product-alt-accordion__inner {
    padding: 0 24px;
  }

  .product-alt-accordion {
    margin-top: 48px;
  }
}

@media(max-width: 640px) {
  .product-alt {
    padding: 80px 0 0;
  }

  .product-alt__title {
    font-size: 36px;
  }

  .product-alt__inner {
    padding: 0 16px;
  }

  .product-alt-accordion__inner {
    padding: 0 16px;
  }

  .product-alt-accordion__trigger-text {
    font-size: 15px;
    letter-spacing: 1px;
  }

  .product-alt-accordion__trigger {
    padding: 18px 4px;
  }
}

/* ═══════════════════════════════════════════════
   PILLOW POLICY MODAL — Add to Cart Popup
   ═══════════════════════════════════════════════ */
.pillow-modal-overlay {
  position: fixed;
  inset: 0;
  z-index: 9999;
  background: rgba(0, 0, 0, 0.55);
  display: flex;
  align-items: center;
  justify-content: center;
  opacity: 0;
  visibility: hidden;
  transition: opacity 0.3s ease, visibility 0.3s ease;
  padding: 24px;
}

.pillow-modal-overlay.is-open {
  opacity: 1;
  visibility: visible;
}

.pillow-modal {
  background: #fff;
  width: 100%;
  max-width: 720px;
  max-height: 85vh;
  overflow-y: auto;
  position: relative;
  border-radius: 0;
  box-shadow: 0 20px 60px rgba(0, 0, 0, 0.3);
  transform: translateY(20px);
  transition: transform 0.3s ease;
}

.pillow-modal-overlay.is-open .pillow-modal {
  transform: translateY(0);
}

.pillow-modal__close {
  position: absolute;
  top: 16px;
  right: 20px;
  background: none;
  border: none;
  font-size: 32px;
  line-height: 1;
  color: #333;
  cursor: pointer;
  padding: 0;
  width: 36px;
  height: 36px;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: color 0.2s ease;
  z-index: 2;
}

.pillow-modal__close:hover {
  color: #000;
}

.pillow-modal__body {
  padding: 40px 48px 48px;
}

.pillow-modal__title {
  font-family: var(--font-body);
  font-size: 28px;
  font-weight: 900;
  color: #1a1a1a;
  margin: 0 0 24px;
  line-height: 1.2;
  padding-right: 40px;
}

.pillow-modal__image {
  margin-bottom: 24px;
}

.pillow-modal__image img {
  width: 100%;
  height: auto;
  display: block;
}

/* Checkbox rows */
.pillow-modal__checkbox-label {
  display: flex;
  align-items: flex-start;
  gap: 12px;
  padding: 20px 0;
  border-top: 1px solid #e0e0e0;
  cursor: pointer;
}

.pillow-modal__checkbox-label:last-of-type {
  border-bottom: none;
}

.pillow-modal__checkbox {
  flex-shrink: 0;
  width: 20px;
  height: 20px;
  margin-top: 2px;
  accent-color: #333;
  cursor: pointer;
}

.pillow-modal__checkbox-text {
  font-family: var(--font-body);
  font-size: 15px;
  font-weight: 600;
  line-height: 1.5;
  color: #1a1a1a;
}

/* Policy content */
.pillow-modal__content {
  padding: 16px 0;
  font-family: var(--font-body);
  font-size: 15px;
  line-height: 1.7;
  color: #333;
}

.pillow-modal__content h3 {
  font-size: 16px;
  font-weight: 700;
  color: #1a1a1a;
  margin: 20px 0 8px;
}

.pillow-modal__content h3:first-child {
  margin-top: 0;
}

.pillow-modal__content p {
  margin: 0 0 10px;
}

.pillow-modal__content p:last-child {
  margin-bottom: 0;
}

.pillow-modal__content em {
  font-style: italic;
}

.pillow-modal__content strong {
  font-weight: 700;
  color: #1a1a1a;
}

.pillow-modal__content ul,
.pillow-modal__content ol {
  padding-left: 24px;
  margin: 8px 0 12px;
}

.pillow-modal__content li {
  margin-bottom: 4px;
  list-style: disc;
}

.pillow-modal__content ol li {
  list-style: decimal;
}

/* Modal submit button */
.pillow-modal__actions {
  padding-top: 24px;
}

.pillow-modal__submit {
  display: inline-block;
  background: #999;
  color: #fff;
  font-family: var(--font-body);
  font-size: 16px;
  font-weight: 700;
  text-transform: none;
  letter-spacing: 0.5px;
  padding: 14px 32px;
  border: none;
  border-radius: 0;
  cursor: not-allowed;
  transition: background 0.2s ease, transform 0.1s ease;
}

.pillow-modal__submit:not(:disabled) {
  background: #333;
  cursor: pointer;
}

.pillow-modal__submit:not(:disabled):hover {
  background: #000;
}

.pillow-modal__submit:not(:disabled):active {
  transform: scale(0.98);
}

/* Modal responsive */
@media (max-width: 640px) {
  .pillow-modal-overlay {
    padding: 12px;
    align-items: flex-end;
  }

  .pillow-modal {
    max-height: 90vh;
  }

  .pillow-modal__body {
    padding: 28px 24px 32px;
  }

  .pillow-modal__title {
    font-size: 22px;
    padding-right: 32px;
  }

  .pillow-modal__checkbox-text {
    font-size: 14px;
  }

  .pillow-modal__content {
    font-size: 14px;
  }
}
/* 
 ═══════════════════════════════════════════════
   MOBILE / TABLET (≤1024px) UX OPTIMIZATIONS
   Centralized so tablets render the mobile experience cleanly.
   Placed last so it wins the cascade over earlier breakpoints.
   ═══════════════════════════════════════════════ */
@media (max-width: 1024px) {
  /* Parallax: fixed backgrounds are ignored/janky on mobile —
     fall back to normal scrolling backgrounds.
     NOTE: .dyhr-hero + .dyhr-text-block--has-bg are intentionally excluded:
     they share the same water image and must stay fixed so it reads as one
     continuous parallax image (otherwise each section crops it separately
     and it looks "split into two"). */
  .blog-hero__bg,
  .blog-section,
  .dyhr-image-table,
  .gum-sec--nature,
  .turmeric-quality-section,
  .clinician-hero__bg,
  .clinician-section,
  .nr-hero,
  .nr-split {
    background-attachment: scroll;
    background-position: center;
  }

  /* Heroes: cap tall 120vh heroes and lift the headline up from the
     52vh inset so it's in view without a long scroll. */
  .dyhr-hero,
  .clinician-hero,
  .nr-hero {
    min-height: 72vh;
  }

  .dyhr-hero__content,
  .clinician-hero__content,
  .blog-hero__content,
  .nr-hero__content {
    padding-top: 28vh;
  }

  /* The 80px desktop "above the fold" lift is undone on mobile so short
     heroes don't push the headline under the nav. */
  .dyhr-hero__content,
  .clinician-hero__content,
  .ts-hero__content,
  .blog-hero__content,
  .faq-hero-banner__content,
  .nr-hero__content {
    transform: none;
  }

  .blog-hero {
    min-height: 70vh;
    padding-bottom: 48px;
  }

  /* Readable body copy on mobile. */
  .article-body__content {
    font-size: 16px;
  }

  .faq-accordion__trigger {
    font-size: 14px;
  }

  .faq-accordion__answer {
    font-size: 15px;
  }

  /* Single-column product/showcase grids: cap card width so they
     don't stretch oversized on tablets. The Golden Comfort sky tiles are
     intentionally full-bleed, so they're excluded. */
  .featured-products__grid {
    max-width: 460px;
    margin-left: auto;
    margin-right: auto;
  }

  /* Tap targets ≥44px (Apple/Google guidance). */
  .btn,
  .gum-cta__btn,
  .faq-products__btn,
  .product-image-grid__btn,
  .clinician-form__submit,
  button[type="submit"],
  .site-header__cart,
  .site-header__menu-toggle {
    min-height: 44px;
  }

  /* Consistent vertical rhythm for primary content sections. */
  .gum-sec--sage .gum-sec__wrap {
    padding-top: 48px;
    padding-bottom: 48px;
  }
}

/* ──────────────────────────────────────────────────────────────
   Universal CTA button sizing
   Primary call-to-action buttons were authored per-section with
   font sizes ranging 12–24px and inconsistent padding, leaving them
   "too large and tall." This normalizes every marketing CTA to one
   size/padding site-wide. Colors, backgrounds, and hover states stay
   per-component. !important is used to win over the inline <style>
   blocks in individual section files regardless of load order.
   Excludes functional controls (qty steppers, video play, cart,
   add-to-cart, product-card, tab selectors) and plain text links.
   ────────────────────────────────────────────────────────────── */
.contact-submit-btn,
.product-image-grid__btn,
.faq-products__btn,
.product-features__btn,
.gum-cta__btn,
.gum-info-banner__btn,
.gum-cta-section__btn,
.nr-split__btn,
.nr-pillow__btn,
.gc-showcase__btn,
.gc-turmeric__button,
.reflux-pillow__button,
.product-info-banner__btn,
.rxg-footer__submit-btn,
.how-to-use__btn {
  padding: 14px 32px !important;
  font-size: 14px !important;
  font-weight: 600 !important;
  letter-spacing: 1.5px !important;
  line-height: 1 !important;
  text-transform: uppercase !important;
  border-radius: 0 !important;
}

/* ── Square corners site-wide (DD: all tiles/cards/corners = 0 radius) ──
   Flattens every rectangular corner across the theme. Genuinely circular
   UI has no "corners" and is restored to a full pill below. */
*,
*::before,
*::after {
  border-radius: 0 !important;
}

.site-header__cart,
.site-header__cart-count,
.blog-hero__avatar,
.team-tabs__selector-avatar,
.team-tabs__avatar-wrap,
.team-tabs__rte li::before {
  border-radius: 50% !important;
}

/* ═══════════════════════════════════════════════════════════════════
   BODY TYPOGRAPHY NORMALIZATION (single source of truth)
   ───────────────────────────────────────────────────────────────────
   Sections historically each set their own body size + their own (often
   contradictory) mobile overrides, so the same paragraph rendered
   anywhere from 10px to 28px on a phone. This block maps every body-copy
   class to one of four responsive tiers (tokens in theme.liquid) so copy
   scales consistently across the whole site on every breakpoint.
   !important is intentional: it lets the tiers win over the legacy
   per-section sizes and media-query overrides (including section inline
   <style> blocks) without having to hunt down and delete each one.
   Tier modifiers (--muted / --italic) are declared AFTER the base tiers
   so they win for those specific elements via source order.
   ═══════════════════════════════════════════════════════════════════ */

/* Tier 1 — standard paragraph copy */
.dyhr-text-block__text,
.dyhr-split__text,
.dyhr-image-table__text,
.daily-support__text,
.ts-text-split__left-text,
.ts-text-split__right-text,
.ts-video-split__text,
.ts-dark-text-split__text,
.gum-sec__p,
.gum-sec__col,
.gum-func-box p,
.gc-blends__intro-text,
.gc-showcase__text,
.gc-intro__text,
.clinician__desc,
.reflux-pillow__text,
.os-team__text,
.os-team__bio,
.gc-turmeric__features-box p,
.gum-info-banner__directions,
.gum-info-banner__features-box p {
  font-size: var(--fs-body) !important;
  line-height: var(--lh-body) !important;
}

/* Tier 2 — hero / section lead-in intro copy (a touch larger) */
/* .dyhr-text, */
/* .ts-hero__paragraph, */
/* .os-hero__text, */
.reflux-rescue__text {
  font-size: var(--fs-body-lead) !important;
  line-height: 1.5 !important;
}

/* Tier 3 — pull quotes & emphasized callouts */
.gum-pullquote,
.gum-sec__imgcard-text,
.ts-dark-text-split__callout,
.dyhr-image-table__callout,
.gum-sec__p--italic {
  font-size: var(--fs-pullquote) !important;
  line-height: 1.3 !important;
}

/* Tier 4 — disclaimers, muted notes, fine print */
.gum-sec__disclaimer,
.gum-sec__p--muted,
.gc-blends__directions-box-1 {
  font-size: var(--fs-fineprint) !important;
  line-height: 1.5 !important;
}
 */

/* PILLOWCASES PRODUCT PAGE*/

/* Section root */
.pillowcases-section {
  width: 100%;
  overflow: hidden;
  background: #fff;
}

/* HERO ZONE */
.pillowcases-hero {
  position: relative;
  background: #f5f0ea;
  padding: 48px 0 0;
  text-align: center;
  overflow: hidden;
  margin-top: 80px;
}

/* Uploadable background pattern (botanical/cotton illustration) */
.pillowcases-hero__pattern-bg {
  position: absolute;
  inset: 0;
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  opacity: 0.12;
  pointer-events: none;
}

/* Fallback when no image is uploaded — subtle woven texture */
.pillowcases-hero__pattern-bg--fallback {
  background-image:
    repeating-linear-gradient(
      0deg, transparent, transparent 3px,
      rgba(0,0,0,.03) 3px, rgba(0,0,0,.03) 4px
    ),
    repeating-linear-gradient(
      90deg, transparent, transparent 3px,
      rgba(0,0,0,.03) 3px, rgba(0,0,0,.03) 4px
    );
  opacity: 0.06;
}

.pillowcases-hero__inner {
  position: relative;
  z-index: 1;
  max-width: 1200px;
  margin: 0 auto;
  padding: 40px 24px;
  display: flex;
  flex-direction: column;
  align-items: center;
}

/* ── Uploadable logo / text fallback ── */
.pillowcases-hero__logo-container {
  margin-bottom: 16px;
}

.pillowcases-hero__logo-img {
  display: block;
  max-width: 80px;
  height: auto;
}

.pillowcases-logo-box {
  display: inline-flex;
  flex-direction: column;
  align-items: center;
  gap: 0;
  line-height: 1;
}

.pillow-logo {
  width: 70px;
  height: 70px;
}

/* ── Headings ── */
.pillowcases-hero__headings {
  margin-bottom: 28px;
}

.pillowcases-hero__title-primary {
  font-family: var(--font-heading-family, 'Archivo Narrow', sans-serif);
  font-size: clamp(20px, 2.8vw, 30px);
  font-weight: 800;
  letter-spacing: 1px;
  color: #1a1a1a;
  text-transform: uppercase;
  margin: 0 0 2px;
}

.pillowcases-hero__title-secondary {
  font-family: var(--font-heading-family, 'Archivo Narrow', sans-serif);
  font-size: clamp(12px, 1.6vw, 16px);
  font-weight: 400;
  letter-spacing: 5px;
  color: #555;
  text-transform: uppercase;
  margin: 0;
}

/* ── Main product image ── */
.pillowcases-hero__image-wrap {
  width: 100%;
  max-width: 650px;
  margin: 0 auto;
}

.pillowcases-hero__img {
  width: 100%;
  height: auto;
  display: block;
  object-fit: contain;
  clip-path: inset(1px);
  transition: transform 0.45s ease;
}

.pillowcases-hero__image-wrap:hover .pillowcases-hero__img {
  transform: scale(1.02);
}

/* MIDDLE ZONE — Thumbnails + Description / Price*/
.pillowcases-mid {
  background: #fff;
  border-top: 1px solid #e8e3dc;
}

.pillowcases-mid__inner {
  max-width: 1200px;
  margin: 0 auto;
  padding: 36px 24px 28px;
  display: grid;
  grid-template-columns: auto 1fr;
  gap: 32px;
  align-items: start;
}

/* ── Variant image thumbnails ── */
.pillowcases-mid__thumbs {
  display: flex;
  gap: 10px;
  flex-wrap: wrap;
}

.pillowcases-thumb {
  width: 90px;
  height: 90px;
  padding: 0;
  border: 2px solid #ddd;
  background: #fff;
  cursor: pointer;
  overflow: hidden;
  transition: border-color 0.2s ease, box-shadow 0.2s ease;
}

.pillowcases-thumb.is-active {
  border-color: #1a1a1a;
  box-shadow: 0 0 0 1px #1a1a1a;
}

.pillowcases-thumb:hover:not(.is-active) {
  border-color: #999;
}

.pillowcases-thumb__img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

/* ── Description & price ── */
.pillowcases-mid__info {
  display: flex;
  flex-direction: column;
  gap: 12px;
}

.pillowcases-mid__desc {
  font-family: var(--font-body-family, sans-serif);
  font-size: var(--fs-body, 14px);
  line-height: var(--lh-body, 1.7);
  color: #444;
}

.pillowcases-mid__desc p {
  margin: 0 0 10px;
}

.pillowcases-mid__desc strong,
.pillowcases-mid__desc b {
  color: #1a1a1a;
  font-weight: 700;
}

.pillowcases-mid__price {
  font-family: var(--font-heading-family, 'Archivo Narrow', sans-serif);
  font-size: 22px;
  font-weight: 700;
  color: #1a1a1a;
  letter-spacing: 0.5px;
}

/* CONTROLS ZONE — Options dropdown + Qty + Add to Cart */
.pillowcases-controls {
  background: #fff;
  border-top: 1px solid #eee;
}

.pillowcases-controls__inner {
  max-width: 1200px;
  margin: 0 auto;
  padding: 28px 24px 36px;
}

/* ── Options row ── */
.pillowcases-options-row {
  display: flex;
  align-items: center;
  gap: 12px;
  margin-bottom: 20px;
}

.pillowcases-options-label {
  font-family: var(--font-heading-family, 'Archivo Narrow', sans-serif);
  font-size: 13px;
  font-weight: 700;
  letter-spacing: 1.5px;
  text-transform: uppercase;
  color: #1a1a1a;
  white-space: nowrap;
}

.pillowcases-select-wrapper {
  flex: 1;
  max-width: 260px;
  position: relative;
}

.pillowcases-select {
  width: 100%;
  appearance: none;
  -webkit-appearance: none;
  padding: 10px 36px 10px 14px;
  border: 1px solid #ccc;
  background: #fff
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='6' fill='none'%3E%3Cpath d='M1 1l4 4 4-4' stroke='%23333' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E")
    no-repeat right 12px center;
  font-family: var(--font-body-family, sans-serif);
  font-size: 14px;
  color: #1a1a1a;
  cursor: pointer;
  transition: border-color 0.2s;
}

.pillowcases-select:focus {
  outline: none;
  border-color: #1a1a1a;
}

.pillowcases-clear-btn {
  padding: 8px 16px;
  border: 1px solid #ccc;
  background: transparent;
  font-family: var(--font-heading-family, 'Archivo Narrow', sans-serif);
  font-size: 12px;
  font-weight: 600;
  letter-spacing: 1.5px;
  text-transform: uppercase;
  color: #888;
  cursor: pointer;
  transition: color 0.2s, border-color 0.2s;
}

.pillowcases-clear-btn:hover {
  color: #1a1a1a;
  border-color: #1a1a1a;
}

/* ── Actions row: qty + add-to-cart ── */
.pillowcases-actions-row {
  display: flex;
  gap: 10px;
  align-items: stretch;
  max-width: 360px;
}

/* Horizontal quantity stepper (matches reference) */
.pillowcases-qty {
  display: flex;
  flex-direction: row;
  border: 1px solid #ccc;
  flex-shrink: 0;
}

.pillowcases-qty__btn {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 40px;
  background: #fff;
  border: none;
  font-size: 18px;
  color: #1a1a1a;
  cursor: pointer;
  padding: 0;
  line-height: 1;
  transition: background 0.15s;
}

.pillowcases-qty__btn:hover {
  background: #f0ece6;
}

.pillowcases-qty__input {
  width: 44px;
  text-align: center;
  border: none;
  border-left: 1px solid #ccc;
  border-right: 1px solid #ccc;
  font-family: var(--font-body-family, sans-serif);
  font-size: 14px;
  color: #1a1a1a;
  padding: 10px 0;
  -moz-appearance: textfield;
  background: #fff;
}

.pillowcases-qty__input::-webkit-inner-spin-button,
.pillowcases-qty__input::-webkit-outer-spin-button {
  -webkit-appearance: none;
  margin: 0;
}

/* Teal Add to Cart (matching reference) */
.pillowcases-submit-btn {
  flex: 1;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  padding: 14px 28px;
  border: none;
  background: #7ec8b5;
  color: #fff;
  font-family: var(--font-heading-family, 'Archivo Narrow', sans-serif);
  font-size: 14px;
  font-weight: 600;
  letter-spacing: 1.5px;
  text-transform: uppercase;
  cursor: pointer;
  transition: background 0.25s ease, opacity 0.25s ease;
}

.pillowcases-submit-btn:hover {
  background: #5fb8a0;
}

.pillowcases-submit-btn:disabled {
  opacity: 0.45;
  cursor: not-allowed;
}

.pillowcases-submit-btn__icon {
  display: flex;
  align-items: center;
}

.pillowcases-submit-btn__icon svg {
  width: 18px;
  height: 18px;
}

/* SHIPPING ACCORDION */
.pillowcases-shipping {
  background: #fff;
  border-top: 1px solid #eee;
}

.pillowcases-shipping__inner {
  max-width: 1200px;
  margin: 0 auto;
  padding: 0 24px 48px;
}

.pillowcases-accordion {
  border-bottom: 1px solid #e0dcd6;
}

.pillowcases-accordion__header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 18px 0;
  cursor: pointer;
  list-style: none;
  user-select: none;
}

.pillowcases-accordion__header::-webkit-details-marker {
  display: none;
}

.pillowcases-accordion__title {
  font-family: var(--font-heading-family, 'Archivo Narrow', sans-serif);
  font-size: 14px;
  font-weight: 700;
  letter-spacing: 1.5px;
  text-transform: uppercase;
  color: #1a1a1a;
}

.pillowcases-accordion__icon {
  display: flex;
  align-items: center;
  transition: transform 0.3s ease;
}

.pillowcases-accordion[open] .pillowcases-accordion__icon {
  transform: rotate(180deg);
}

.pillowcases-accordion__body {
  padding: 0 0 20px;
  font-family: var(--font-body-family, sans-serif);
  font-size: var(--fs-body, 14px);
  line-height: var(--lh-body, 1.7);
  color: #555;
}

.pillowcases-accordion__body p {
  margin: 0 0 10px;
}

.pillowcases-details__inner {
    display: flex;
    align-items: center;
    flex-direction: row;
    justify-content: space-around;
    gap: 60px;
}
.pillowcases-details__left {
    width: 50%;
    padding: 20px;
}
.pillowcases-details__right {
    width: 50%;
    padding: 20px;
}
/* RESPONSIVE — ≤ 1024 px (tablet) */
@media (max-width: 1024px) {
  .pillowcases-hero {
    padding: 36px 0 0;
  }

  .pillowcases-mid__inner {
    grid-template-columns: 1fr;
    gap: 24px;
  }

  .pillowcases-mid__thumbs {
    justify-content: center;
  }

  .pillowcases-actions-row {
    max-width: 100%;
  }
}

/* RESPONSIVE — ≤ 600 px (phone) */
@media (max-width: 600px) {
  .pillowcases-hero {
    padding: 28px 0 0;
  }

  .pillowcases-hero__inner {
    padding: 0 16px;
  }

  .pillowcases-logo-box {
    padding: 8px 14px 6px;
  }

  .pillowcases-logo-box__rg {
    font-size: 22px;
    letter-spacing: 4px;
  }

  .pillowcases-logo-box__pillow {
    font-size: 9px;
    letter-spacing: 3px;
  }

  .pillowcases-hero__headings {
    margin-bottom: 20px;
  }

  .pillowcases-mid__inner {
    padding: 24px 16px 20px;
  }

  .pillowcases-thumb {
    width: 72px;
    height: 72px;
  }

  .pillowcases-controls__inner {
    padding: 20px 16px 28px;
  }

  .pillowcases-options-row {
    flex-wrap: wrap;
  }

  .pillowcases-options-label {
    width: 100%;
  }

  .pillowcases-select-wrapper {
    max-width: 100%;
    flex: 1;
  }

  .pillowcases-actions-row {
    flex-direction: column;
    max-width: 100%;
  }

  .pillowcases-qty {
    width: 100%;
    justify-content: center;
  }

  .pillowcases-qty__btn {
    flex: 1;
    height: 48px;
  }

  .pillowcases-qty__input {
    flex: 0 0 60px;
  }

  .pillowcases-shipping__inner {
    padding: 0 16px 36px;
  }
}