/* Shared typography for the first three brand sections only. */
:root{
  --font-display:"Noto Serif SC","Source Han Serif SC","Songti SC","STSong","SimSun",serif;
  --font-body:"Noto Sans SC","Source Han Sans SC","PingFang SC","Microsoft YaHei UI","Microsoft YaHei",sans-serif;
  --font-label:"Segoe UI","Noto Sans SC","Source Han Sans SC","PingFang SC","Microsoft YaHei UI",sans-serif;
  --type-ink:#173c32;
  --type-body:#33473f;
  --type-body-strong:#29443a;
  --type-label:#687b72;
  --type-weight-body:450;
  --type-weight-medium:500;
  --type-weight-semibold:600;
  --type-weight-display:700;
  --type-leading-body:1.82;
  --type-leading-compact:1.45;
  --type-tracking-display:-.045em;
  --type-tracking-label:.18em;
  --type-size-home-title:clamp(68px,7.1vw,92px);
  --type-size-story-title:clamp(58px,6.2vw,80px);
  --type-size-formula-title:clamp(38px,4.15vw,58px);
  --type-size-body:14px;
  --type-size-card-body:13px;
  --type-size-label:9px;
  --type-size-card-title:29px;
}

/* Display titles: one family, weight, color and rhythm across all three pages. */
.hero h1,
.story-section .story-heading h2,
.formula-section .formula-intro h2{
  color:var(--type-ink);
  font-family:var(--font-display);
  font-weight:var(--type-weight-display);
  line-height:1.12;
  letter-spacing:var(--type-tracking-display);
}

.hero h1{font-size:var(--type-size-home-title)}
.story-section .story-heading h2{font-size:var(--type-size-story-title)}
.formula-section .formula-intro h2{font-size:var(--type-size-formula-title)}

/* Explanatory copy is always modern sans-serif and slightly darker. */
.hero .hero-claim,
.hero .hero-note,
.story-section .story-text p,
.formula-section .formula-transition p,
.formula-section .formula-statement>p,
.formula-section .herbal-editorial p,
.formula-section .formula-principles span{
  color:var(--type-body);
  font-family:var(--font-body);
  font-weight:var(--type-weight-body);
  line-height:var(--type-leading-body);
}

.story-section .story-text .story-opening,
.formula-section .formula-transition p:first-child{
  color:var(--type-body-strong);
  font-family:var(--font-body);
  font-weight:var(--type-weight-medium);
}

.story-section .story-text p{font-size:17.5px}
.story-section .story-text .story-opening{font-size:19.5px}

.story-section .section-kicker{
  color:#586f64;
  font-weight:700;
}

/* Labels and numbering use a compact modern voice with controlled tracking. */
.hero .eyebrow,
.hero .brand-origin,
.story-section .section-kicker,
.formula-section .section-kicker,
.formula-section .herbal-editorial article>span,
.formula-section .herbal-editorial small,
.formula-section .formula-statement>small{
  color:var(--type-label);
  font-family:var(--font-label);
  font-size:var(--type-size-label);
  font-weight:var(--type-weight-semibold);
  line-height:var(--type-leading-compact);
  letter-spacing:var(--type-tracking-label);
}

/* Card anchors are sans-serif semibold, distinct from display titles. */
.formula-section .herbal-editorial h3,
.formula-section .formula-principles b{
  color:#214538;
  font-family:var(--font-body);
  font-weight:var(--type-weight-semibold);
  line-height:1.3;
  letter-spacing:.025em;
}

.formula-section .herbal-editorial h3{font-size:var(--type-size-card-title)}
.formula-section .herbal-editorial p{
  color:#354a41;
  font-size:calc(var(--type-size-card-body) + 1px);
  font-weight:var(--type-weight-medium);
}
.formula-section .formula-statement>p{
  color:#2f473d;
  font-size:var(--type-size-body);
  font-weight:var(--type-weight-medium);
}
.formula-section .formula-principles b{font-weight:650}
.formula-section .formula-principles span{
  color:#40554b;
  font-size:13px;
  font-weight:var(--type-weight-medium);
}

.formula-section .formula-principles b{
  margin:0;
  line-height:1.35;
}

.formula-section .formula-principles span{
  margin:0;
  line-height:1.8;
}

.hero .button{
  font-family:var(--font-body);
  font-weight:var(--type-weight-semibold);
  line-height:var(--type-leading-compact);
}

.site-header nav a,
.site-header .header-cta{
  color:#43564e;
  font-family:var(--font-body);
  font-weight:var(--type-weight-medium);
  line-height:var(--type-leading-compact);
  letter-spacing:.015em;
}

.site-header nav a{font-size:12px}
.site-header .header-cta{font-size:11px;font-weight:var(--type-weight-semibold)}

@media(max-width:640px){
  :root{
    --type-size-home-title:clamp(50px,14vw,68px);
    --type-size-story-title:clamp(43px,11.4vw,50px);
    --type-size-formula-title:39px;
    --type-size-card-title:27px;
  }
  .story-section .story-text p{font-size:15.5px}
  .story-section .story-text .story-opening{font-size:17.5px}
}

@media(max-width:375px){
  :root{
    --type-size-home-title:47px;
    --type-size-story-title:43px;
    --type-size-formula-title:36px;
  }
}

@media(min-width:641px) and (max-width:1023px){
  .story-section .story-text p{font-size:16.5px}
  .story-section .story-text .story-opening{font-size:18.5px}
}

/* Locked story label: same size, one step stronger and slightly deeper. */
.story-section .section-kicker{
  color:#586f64;
  font-weight:700;
}
