/* RMS_HOME_HEADINGS_V1_20261022 */
/* Homepage ONLY: this stylesheet is loaded via home.html head_extra block.
   Keeps existing RMS brand/pastel site palette and all content intact. */

/* Main message: distinct in size/contrast, but no visual clutter. */
.hero-copy h1 {
  color: #14382f;
  font-weight: 900;
  font-size: clamp(36px, 4.15vw, 62px);
  line-height: 1.39;
  letter-spacing: -.035em;
  text-wrap: balance;
  max-width: 740px;
}
.hero-copy h1 em {
  font-style: normal;
  color: #246a56;
  /* A soft gold editorial underline rather than a distracting banner. */
  background: linear-gradient(to top, rgba(199, 164, 99, .33) 0 13%, transparent 13%);
  box-decoration-break: clone;
  -webkit-box-decoration-break: clone;
}
.hero-copy > p {
  color: #435a52;
  font-size: clamp(15px, 1.12vw, 17px);
  line-height: 2;
}
.hero .overline {
  color: #2e6050;
  font-weight: 800;
  letter-spacing: .015em;
}

/* Consistent visual hierarchy for ALL homepage section headings. */
.section-heading > div:first-child,
.rms-highlights-top > div:first-child {
  border-inline-start: 4px solid #bb9659;
  padding-inline-start: clamp(12px, 1.35vw, 19px);
  min-width: 0;
}
.section-heading h2,
.rms-highlights-top h2 {
  color: #13372e;
  font-size: clamp(28px, 2.65vw, 40px);
  font-weight: 900;
  line-height: 1.48;
  letter-spacing: -.025em;
  margin-block: 10px 8px;
  text-wrap: pretty;
}
.section-heading p {
  color: #4b6258;
  font-size: 15px;
  line-height: 1.9;
  max-width: 760px;
}
.section-heading { margin-bottom: 34px; }
.eyebrow,
.rms-highlights-top .eyebrow {
  display: inline-flex;
  align-items: center;
  background: #dce9df;
  border: 1px solid #cadcd0;
  border-radius: 999px;
  color: #275947;
  font-size: 13px;
  font-weight: 800;
  line-height: 1.6;
  padding: 4px 13px;
  width: fit-content;
}
.section-heading .text-link { font-weight: 800; }

/* Section-specific titles: strong contrast even on the dark media section. */
.sample-copy h2 {
  color: #f8fcf8;
  font-weight: 900;
  font-size: clamp(29px, 3vw, 43px);
  line-height: 1.5;
  letter-spacing: -.015em;
  margin-block: 16px 13px;
}
.sample-copy h2 em { color: #f0cd93; font-style: normal; }
.sample-copy .eyebrow.warm {
  color: #f0d4a7;
  background: rgba(231, 199, 143, .12);
  border-color: rgba(231, 199, 143, .32);
}

/* The secondary hierarchy: category cards, editorial tiles, product titles. */
.path-card strong { color: #153f34; font-weight: 850; }
.product-card .card-inner h3 {
  color: #183f34;
  font-size: clamp(17px, 1.25vw, 20px);
  font-weight: 850;
  line-height: 1.75;
}
.beyond-card h3 {
  color: #fbfdf9;
  font-weight: 850;
  font-size: clamp(21px, 1.8vw, 26px);
  line-height: 1.65;
}
.beyond-card.light h3 { color: #173d33; }
.rms-highlight-card h3 { color: #163e33; font-weight: 850; font-size: 20px; line-height: 1.7; }
.rms-highlights-top .eyebrow { margin-bottom: 4px; }

/* The mobile header typography must remain concise and never overflow. */
@media (max-width: 650px) {
  .hero-copy h1 {
    font-size: clamp(32px, 8.15vw, 41px);
    line-height: 1.47;
    letter-spacing: -.018em;
    margin-block: 15px 14px;
  }
  .section-heading h2, .rms-highlights-top h2 {
    font-size: clamp(26px, 6.8vw, 32px);
    line-height: 1.55;
  }
  .section-heading { margin-bottom: 23px; }
  .section-heading > div:first-child,
  .rms-highlights-top > div:first-child { padding-inline-start: 12px; border-inline-start-width: 3px; }
  .section-heading p { font-size: 14px; }
  .sample-copy h2 { font-size: clamp(27px, 7vw, 34px); }
  .product-card .card-inner h3 { font-size: 16px; }
  .beyond-card h3 { font-size: 21px; }
}
@media (prefers-reduced-motion: reduce) { .hero-copy h1 em { scroll-behavior: auto; } }