/* Final storefront type scale. Keep reading sizes independent of compact layouts. */
body.immersive-theme {
  --reading-body: 19px;
  --reading-small: 16px;
  --reading-label: 14px;
  --section-heading: clamp(38px, 3.5vw, 54px);
  font-size: var(--reading-body);
}
body.immersive-theme main > section:not(.experience),
body.immersive-theme .site-footer,
body.immersive-theme dialog { font-size: var(--reading-body); line-height: 1.65; }
body.immersive-theme :is(.eyebrow, .section-index, .shop-small-note, .product-category, .product-count) {
  font-size: var(--reading-label); line-height: 1.5; letter-spacing: .045em;
}
body.immersive-theme :is(.desktop-nav a, .header-order, .talk-link, .mobile-menu a) { font-size: 18px; }
body.immersive-theme .brand-lockup[data-brand] .brand-lockup__tagline { font-size: 14px; }
body.immersive-theme .announcement { font-size: 14px; }
body.immersive-theme .cart-count { font-size: 14px; width: 24px; height: 24px; }
body.immersive-theme :is(.button, .text-link, .quick-add, .profile-link, .product-reading-link) {
  font-size: 18px; line-height: 1.4; min-height: 48px;
}

/* Give the opening story the same comfortable size as the rest of the shop. */
#hero-stage .scene-chapter .scene-description { font-size: 20px; line-height: 1.6; max-width: 48ch; color: #d0d7c8; }
#hero-stage .scene-eyebrow { font-size: 14px; letter-spacing: .05em; }
#hero-stage .scene-actions :is(.scene-cta, .scene-secondary),
#hero-stage .scene-formula .scene-text-button { font-size: 18px; line-height: 1.4; min-height: 48px; }
#hero-stage .hero-service-note { font-size: 16px; line-height: 1.5; color: #c7d0bd; }
#hero-stage :is(.ingredient-story-top, .ingredient-story-top [data-beat-amount], .ingredient-cue) { font-size: 14px; line-height: 1.5; }
#hero-stage .ingredient-benefit { font-size: 19px; line-height: 1.45; }
#hero-stage .ingredient-explanation { font-size: 18px; line-height: 1.55; color: #d0d7c8; }
#hero-stage .ingredient-steps button { font-size: 14px; min-height: 44px; }
#hero-stage :is(.scroll-invitation, .scene-skip) { font-size: 14px; color: #c7d0bd; }
#hero-stage .scene-navigation button { font-size: 14px; color: #c7d0bd; }
#hero-stage .scene-navigation button span { font-size: 17px; }
#hero-stage .scene-navigation button.active { color: var(--acid); }
#hero-stage .scene-model-zone { --model-note-space: 44px; }
#hero-stage .scene-illustration-note { font-size: 14px; line-height: 1.4; color: #bac7ac; }
#hero-stage .scene-loading { font-size: 14px; }
#hero-stage[data-hero-layout="stack"] .scene-chapter h1 { font-size: clamp(40px, 7vw, 60px); }
#hero-stage[data-hero-layout="stack"] .scene-chapter h2 { font-size: clamp(32px, 5vw, 42px); }
#hero-stage[data-hero-layout="stack"] .scene-chapter .scene-description { font-size: 18px; line-height: 1.55; }
#hero-stage[data-hero-layout="stack"] .scene-eyebrow { font-size: 14px; }
#hero-stage[data-hero-layout="stack"] .hero-service-note { font-size: 15px; }
#hero-stage[data-hero-layout="stack"] .ingredient-story h3 { font-size: 28px; }
#hero-stage[data-hero-layout="stack"] .scene-model-zone { --model-note-space: 42px; }
#hero-stage[data-hero-layout="stack"] .scene-illustration-note { font-size: 14px; }
/* Stacked scenes retain the accessible numbered navigation without squeezed labels. */
#hero-stage[data-hero-layout="stack"] .scene-navigation button { font-size: 0; }
#hero-stage[data-hero-layout="stack"] .scene-navigation button span { font-size: 17px; }

body.immersive-theme :is(.section-top > p, .product-editorial-header > p, .formula-explorer .formula-intro > p, .story-copy > p, .manifesto-bottom p) {
  font-size: 20px; line-height: 1.65;
}
body.immersive-theme :is(.section-top h2, .product-editorial-header h2, .formula-explorer .formula-intro h2, .story-copy h2, .faq-heading h2, .order-journey .order-journey-title) {
  font-size: var(--section-heading); line-height: 1.15;
}
body.immersive-theme .filter-tab { font-size: 18px; min-height: 48px; }
body.immersive-theme .filter-tab span { font-size: 14px; }
body.immersive-theme .product-heading h3 { font-size: 34px; line-height: 1.15; }
body.immersive-theme .product-price { font-size: 24px; line-height: 1.5; }
body.immersive-theme :is(.product-price small, .profile-pricing small, .formula-pricing small) { font-size: 17px; }
body.immersive-theme .delivery-charge-note { font-size: 16px; line-height: 1.55; color: #536047; }
body.immersive-theme .product-tagline { font-size: 21px; line-height: 1.45; }
body.immersive-theme .product-description { font-size: var(--reading-body); line-height: 1.65; color: #46523e; }
body.immersive-theme .product-tags { gap: 6px; }
body.immersive-theme .product-tags span { font-size: 14px; line-height: 1.5; padding: 5px 9px; }
body.immersive-theme .product-actions :is(.button, .text-link) { font-size: 18px; min-height: 50px; white-space: normal; }
body.immersive-theme .shop-footnote { font-size: 17px; line-height: 1.65; }
body.immersive-theme .profile-product-name > strong { font-size: 32px; line-height: 1.2; }
body.immersive-theme .product-profile .profile-product-name .quick-add { font-size: 18px; min-height: 48px; }
body.immersive-theme .product-profile > h3 { font-size: 29px; line-height: 1.25; }
body.immersive-theme .product-profile > p,
body.immersive-theme .product-profile details p { font-size: var(--reading-body); line-height: 1.65; }
body.immersive-theme :is(.profile-pricing strong, .formula-pricing strong) { font-size: 24px; }
body.immersive-theme .profile-details dt { font-size: 16px; line-height: 1.5; color: #536047; }
body.immersive-theme .profile-details dd { font-size: 20px; line-height: 1.45; }
body.immersive-theme :is(.profile-learn, .formula-benefits) > summary { font-size: 18px; line-height: 1.5; min-height: 52px; }
body.immersive-theme .profile-link { font-size: 18px; line-height: 1.45; min-height: 52px; }
body.immersive-theme .benefit-summary .benefit-eyebrow { font-size: 14px; }
body.immersive-theme .benefit-summary .benefit-heading { font-size: 27px; line-height: 1.3; }
body.immersive-theme .benefit-list li { font-size: var(--reading-body); line-height: 1.6; }
body.immersive-theme .benefit-number { font-size: 14px; }
body.immersive-theme :is(.benefit-boundary, .ingredient-source) { font-size: 16px; line-height: 1.6; }
/* These legacy education rules used !important; keep one consistent reading size. */
body.immersive-theme .ingredient-explainer > p,
body.immersive-theme .detail-context p { font-size: var(--reading-body) !important; line-height: 1.65 !important; }
body.immersive-theme .ingredient-explainer > p > strong { font-size: 16px; }
body.immersive-theme .ingredient-disclosure > summary strong { font-size: 20px; line-height: 1.4; }
body.immersive-theme :is(.ingredient-disclosure-amount, .ingredient-role) { font-size: 16px; line-height: 1.5; }
body.immersive-theme .ingredient-disclosure-copy > p { font-size: var(--reading-body); line-height: 1.65; }

body.immersive-theme .formula-selection { max-width: 400px; }
body.immersive-theme .formula-selection > span { font-size: 14px; }
body.immersive-theme .formula-explorer .formula-switch button { font-size: 18px; min-height: 48px; }
body.immersive-theme .formula-card-heading h3 { font-size: 32px; line-height: 1.25; }
body.immersive-theme .formula-card-heading > div > p { font-size: 14px; }
body.immersive-theme .formula-count b { font-size: 34px; }
body.immersive-theme .formula-count span { font-size: 14px; }
body.immersive-theme :is(.formula-explore-cue, .formula-table thead th, .formula-table thead small) { font-size: 16px; line-height: 1.5; }
body.immersive-theme .formula-ingredient-button { font-size: 22px; line-height: 1.35; min-height: 72px; }
body.immersive-theme .formula-ingredient-label .ingredient-role { font-size: 16px !important; line-height: 1.4; color: #536047; }
body.immersive-theme .formula-explorer .formula-illustrated-table td { font-size: 22px; }
body.immersive-theme .formula-label-link { font-size: 18px; min-height: 52px; }
body.immersive-theme .formula-explorer-note { font-size: 16px; line-height: 1.65; color: #c6d0b9; }
body.immersive-theme .formula-bottle-top > p { font-size: 14px; }
body.immersive-theme .formula-bottle-top h3 { font-size: 30px; line-height: 1.25; }
body.immersive-theme .formula-bottle-controls button { font-size: 18px; min-height: 48px; }
body.immersive-theme .formula-bottle-hint { font-size: 16px; line-height: 1.5; }

/* The portrait stays compact; the name and credentials get more breathing room. */
body.immersive-theme .founder-card .story-contact-label { font-size: 14px; letter-spacing: .04em; }
body.immersive-theme .founder-card h3 { font-size: clamp(30px, 2.6vw, 38px); line-height: 1.2; }
body.immersive-theme .founder-card .story-owner-role { font-size: 17px; }
body.immersive-theme .founder-credentials-title { font-size: 21px; }
body.immersive-theme .founder-credentials strong { font-size: 18px; line-height: 1.45; }
body.immersive-theme .founder-credentials li > span { font-size: 16px; line-height: 1.5; color: #536047; }
body.immersive-theme .founder-credentials li > .founder-credential-type { font-size: 14px; letter-spacing: .04em; }
body.immersive-theme .founder-card .story-contact-description { font-size: var(--reading-body); line-height: 1.65; }
body.immersive-theme .founder-card :is(.story-contact-button, .story-contact-links .contact-label) { font-size: 18px; }
body.immersive-theme .founder-card .story-contact-button > .contact-label { font-size: 18px; }
body.immersive-theme .story-value h3 { font-size: 25px; line-height: 1.3; }
body.immersive-theme .story-value p { font-size: var(--reading-body); line-height: 1.65; }
body.immersive-theme :is(.order-journey-welcome > p, .order-journey-stage > p, .order-delivery-desk > div > p:last-child, .faq-heading p, .faq-list details p, .closing-inner p) { font-size: var(--reading-body); line-height: 1.65; }
body.immersive-theme .order-journey .order-journey-stage h3 { font-size: 28px; line-height: 1.25; }
body.immersive-theme :is(.order-stage-top, .order-stage-link, .order-delivery-note) { font-size: 16px; line-height: 1.5; }
body.immersive-theme .faq-list summary { font-size: 21px; line-height: 1.5; min-height: 64px; gap: 16px; }
body.immersive-theme .faq-list details p { color: #cbd3be; }
body.immersive-theme .footer-main h3 { font-size: 20px; }
body.immersive-theme :is(.footer-main p, .footer-links a, .footer-contact a, .footer-bottom, .footer-bottom button) { font-size: 17px; line-height: 1.65; }

/* Ordering and product dialogs use the same scale as the page. */
body.immersive-theme :is(.detail-copy > p, .detail-benefits, .privacy-dialog > p, .order-summary, .success-state p) { font-size: var(--reading-body); line-height: 1.65; }
body.immersive-theme :is(.field > span, .field label, .payment-option p, .form-note, .form-error, .cart-note, .checkout-privacy) { font-size: 17px; line-height: 1.55; }
body.immersive-theme .field :is(input, select, textarea) { font-size: 18px; line-height: 1.5; min-height: 50px; }
body.immersive-theme .field small { font-size: 16px; line-height: 1.5; }
body.immersive-theme .payment-option strong { font-size: 20px; }
body.immersive-theme :is(.cart-summary, .cart-summary .total-line) { font-size: 20px; }
body.immersive-theme .cart-summary > div { gap: 12px; align-items: baseline; }
body.immersive-theme .cart-summary > div > :last-child { flex-shrink: 0; white-space: nowrap; }
body.immersive-theme #cart-dialog .cart-item-info h3 { font-size: 28px; }
body.immersive-theme #cart-dialog .cart-item-info p { font-size: 16px; }
body.immersive-theme #cart-dialog .cart-item-info .cart-unit-price { font-size: 18px; }
body.immersive-theme #cart-dialog .cart-item-info .delivery-charge-note { font-size: 16px; }
body.immersive-theme :is(.bank-details > span, .success-state .order-reference) { font-size: 16px; }
body.immersive-theme .bank-details :is(p, dl) { font-size: 18px; }
body.immersive-theme #cart-dialog .cart-line-price > span { font-size: 14px; }
body.immersive-theme #cart-dialog .cart-line-price > strong { font-size: 21px; }
body.immersive-theme .checkout-dialog .button { font-size: 18px; white-space: normal; }
body.immersive-theme .ingredient-table { font-size: 20px; }
body.immersive-theme :is(.ingredient-table th, .detail-copy .ingredient-caption, .detail-photo .detail-label-link) { font-size: 16px; }

@media (max-width: 1100px) {
  body.immersive-theme .founder-credentials { grid-template-columns: minmax(0, 1fr); }
  #hero-stage .scene-skip { display: none; }
}
@media (max-width: 760px) {
  body.immersive-theme { --reading-body: 18px; --section-heading: clamp(36px, 8.5vw, 44px); }
  body.immersive-theme .desktop-nav a { font-size: 16px; }
  body.immersive-theme .announcement { font-size: 0; }
  body.immersive-theme .announcement > span:last-child { font-size: 14px; }
  body.immersive-theme .site-header .brand-lockup[data-brand] .brand-lockup__tagline { font-size: 13px; }
  body.immersive-theme :is(.section-top > p, .product-editorial-header > p, .formula-explorer .formula-intro > p, .story-copy > p, .manifesto-bottom p) { font-size: 19px; }
  body.immersive-theme .product-heading h3 { font-size: 34px; }
  body.immersive-theme .product-profile .profile-product-name .quick-add { grid-column: 1 / -1; grid-row: auto; justify-self: start; }
  body.immersive-theme .profile-product-name > strong { font-size: 30px; }
  body.immersive-theme .formula-card-heading h3 { font-size: 30px; }
  body.immersive-theme .formula-ingredient-button { font-size: 20px; }
  body.immersive-theme .formula-explorer .formula-illustrated-table td { font-size: 20px; }
  body.immersive-theme .formula-explorer .formula-illustrated-table th:first-child { width: 65%; }
  body.immersive-theme .founder-card h3 { font-size: 28px; }
  body.immersive-theme .founder-card .story-owner-role { font-size: 16px; }
  body.immersive-theme .faq-list summary { font-size: 20px; }
  #hero-stage .scene-navigation { gap: 8px; }
  #hero-stage .scroll-invitation { font-size: 12px; }
}
@media (max-width: 380px) {
  body.immersive-theme :is(.cart-summary, .cart-summary .total-line) { font-size: 18px; }
  body.immersive-theme .cart-summary > div { gap: 8px; }
  body.immersive-theme .founder-card h3 { font-size: 26px; }
  body.immersive-theme #cart-dialog .cart-item-info h3 { font-size: 25px; margin-right: 20px; }
  #hero-stage[data-hero-layout="stack"] .scene-chapter h1 { font-size: 38px; }
}
@media (max-height: 500px) {
  #hero-stage[data-hero-layout="columns"] .scene-navigation button { font-size: 0; }
  #hero-stage[data-hero-layout="columns"] .scene-model-zone { --model-note-space: 0px; }
}
