/* Fresophy VI 1.1 — shared with the brand design system, 2026-10-06.
   Loaded last so legacy page styles cannot restore the former gold palette. */
:root {
  --paper: #F4F0E7;
  --paper-soft: #DED7C9;
  --paper-strong: #F4F0E7;
  --forest: #243C32;
  --ink: #26342E;
  --ink-muted: #58635B;
  --line: #DED7C9;
  --line-dark: rgba(244,240,231,.24);
  --bg: var(--paper);
  --bg-section: var(--paper);
  --bg-card: var(--paper);
  --text: var(--forest);
  --text-secondary: var(--ink-muted);
  --text-dim: var(--ink-muted);
  /* Compatibility aliases for the existing page components. */
  --gold: var(--forest);
  --gold-dark: var(--forest);
  --gold-light: var(--forest);
  --jade: var(--forest);
  --jade-light: var(--forest);
  --tea: var(--forest);
}
html, body { background: var(--paper); color: var(--ink); }
::selection { background: var(--forest); color: var(--paper); }
a:focus-visible, button:focus-visible, summary:focus-visible {
  outline: 2px solid currentColor;
  outline-offset: 4px;
}
.nav, .nav.is-scrolled {
  background: var(--paper);
  border-bottom: 1px solid var(--line);
  backdrop-filter: none;
  -webkit-backdrop-filter: none;
}
.nav-inner { height: 68px; }
.nav-logo img { height: 42px; }
.nav-links a, .nav-links a:hover, .nav-links a.active,
.nav-mobile-btn { color: var(--forest); }
.nav-links a:hover, .nav-links a.active { text-decoration: underline; text-underline-offset: 6px; }
.nav-mobile-btn { border-color: var(--line); }
.mobile-menu { background: var(--paper); }
.mobile-menu a { color: var(--forest); border-color: var(--line); }
.mobile-menu-close { color: var(--forest); border-color: var(--forest); }
.skip-link { background: var(--forest); color: var(--paper); }

.hero { background: var(--paper); color: var(--ink); padding-top: 68px; }
.hero-inner { background: var(--paper); }
.hero-eyebrow, .hero-title, .hero-slogan,
.section-title, .section-eyebrow,
.story-title, .story-eyebrow, .story-subtitle, .story-subtitle span,
.product-title, .product-tile h3, .philosophy-card h3 { color: var(--forest); }
.hero-title, .story-title, .data-number {
  background: none;
  -webkit-text-fill-color: currentColor;
  background-clip: border-box;
}
.hero-subtitle, .hero-proof, .section-desc,
.story-intro, .product-hero .product-headline { color: var(--ink-muted); }
.hero-proof { border-color: var(--line); }
.hero-proof li::before { background: var(--forest); transform: none; }
.hero .btn-primary, .btn-primary, .qr-trigger {
  background: var(--forest);
  color: var(--paper);
  border: 1px solid var(--forest);
  border-radius: 3px;
}
.btn-primary:hover, .qr-trigger:hover { background: var(--ink); color: var(--paper); transform: none; }
.hero .btn-secondary, .btn-secondary {
  background: transparent;
  color: var(--forest);
  border: 1px solid var(--forest);
  border-radius: 3px;
}
.btn-secondary:hover { background: var(--forest); color: var(--paper); border-color: var(--forest); transform: none; }

.section-light, .section-dark, .story-section, .product-hero { background: var(--paper); color: var(--ink); }
.product-hero { border-block: 1px solid var(--line); }
.product-hero::before, .story-hero::before, .philosophy-card::before { display: none; }
.product-hero .product-tag, .philosophy-num, .data-item .data-number,
.product-tile .tile-tag, .product-tile .tile-price, .story-index { color: var(--forest); }
.product-tile .tile-tag { background: transparent; padding-inline: 0; }
.philosophy-card:hover { background: transparent; }
.product-grid { gap: 20px; }
.product-tile, .product-tile.wide { background: var(--paper); border-color: var(--line); border-radius: 3px; }
.product-tile:hover, .product-tile:focus-within { border-color: var(--forest); }
.hero-media, .tile-media { background: #fff; }
.hero-media img, .product-hero .eye-cream-model img, .product-tile .tile-media img {
  mix-blend-mode: normal;
  filter: none;
}
.product-hero .eye-cream-model img { background: #fff; }
.product-benefits li, .data-item, .data-bar { border-color: var(--line); }
.home-detail-link { color: var(--forest); }
.product-tile .tile-spec { color: var(--ink-muted); }
.package-caption { color: var(--ink-muted); }

/* A restrained inverse treatment for the science sections and footer. */
.section-forest, .marquee-section, .footer {
  --text: var(--paper);
  --text-secondary: var(--paper);
  --text-dim: var(--paper);
  --gold: var(--paper);
  --gold-light: var(--paper);
  color: var(--paper);
  background: var(--forest);
}
.section-forest .section-eyebrow, .section-forest .section-title,
.section-forest .section-desc, .feature-card h3, .feature-card p,
.feature-card .feature-num, .science-item .sci-icon, .science-item h4,
.science-item p { color: var(--paper); }
.feature-grid, .feature-card, .science-row, .science-item { border-color: var(--line-dark); }
.feature-card:hover { background: transparent; }
.science-item .sci-icon { background: none; }
.marquee-track span, .marquee-track span+span::before { color: var(--paper); }
.footer { border-color: var(--line-dark); }
.footer a, .footer-tagline, .footer-copy { color: var(--paper); }
.footer a:hover { color: var(--paper); text-decoration: underline; text-underline-offset: 4px; }

.story-hero { background: var(--paper); color: var(--ink); border-bottom: 1px solid var(--line); }
.story-hero-media, .story-image { box-shadow: none; border: 1px solid var(--line); border-radius: 3px; }
.story-copy h2, .story-copy h3, .story-point strong { color: var(--forest); }
.story-copy p, .story-point span, .story-image figcaption { color: var(--ink-muted); }
.story-point, .story-source-note { background: transparent; border-color: var(--line); border-radius: 3px; box-shadow: none; }
.story-source-note, .story-source-note p, .story-source-note a { color: var(--ink-muted); }
.story-source-note strong { color: var(--forest); }
.story-quote { background: var(--forest); color: var(--paper); border-color: var(--forest); box-shadow: none; border-radius: 3px; }
.story-quote p, .story-quote span { color: var(--paper); }
.story-avatar { background: transparent; box-shadow: none; border-radius: 3px; }
.story-avatar img { border-color: var(--line); box-shadow: none; }
.story-lightbox { background: rgba(36,60,50,.94); }
.story-lightbox-card { background: var(--paper); border-color: var(--line); box-shadow: none; border-radius: 3px; }
.story-lightbox-card img { background: var(--paper); border-radius: 0; }
.story-lightbox-close { background: var(--forest); color: var(--paper); }
.story-lightbox-caption { color: var(--ink); }

@media (max-width: 768px) {
  .nav-inner { height: 58px; }
  .nav-logo img { height: 36px; }
  .hero { padding-top: 58px; }
}
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
}

.product-purchase { margin: 24px 0; }
.catalog-page .purchase-link {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 24px;
  min-height: 46px;
  padding: 11px 22px;
  border: 1px solid var(--forest);
  border-radius: 3px;
  background: var(--forest);
  color: var(--paper);
  font-size: 14px;
  line-height: 1.5;
  text-decoration: none;
}
.catalog-page .purchase-link:hover { background: var(--ink); color: var(--paper); }
.product-purchase p { margin: 10px 0 0; color: var(--ink-muted); font-size: 12px; line-height: 1.6; }

.care-series-entry { display:flex; align-items:center; justify-content:space-between; gap:24px; padding:28px 0; border-block:1px solid var(--line); margin-bottom:32px; }
.care-series-entry h2 { margin:8px 0; font:400 30px/1.3 var(--font-serif); color:var(--forest); }
.care-series-entry p { color:var(--ink-muted); line-height:1.8; }
.care-series-entry .catalog-eyebrow { color:var(--forest); }
.care-series-entry>a { flex-shrink:0; }
.home-acne-series { display:inline-block; margin:16px 0 0 24px; color:var(--forest); font-size:15px; text-underline-offset:5px; }
.series-related { margin:20px 0; font-size:14px; line-height:1.8; }
.series-related a { text-underline-offset:5px; }
.care-series-hero { padding:48px 0 64px; max-width:800px; }
.care-series-hero h1 { margin:18px 0; font:400 clamp(40px,5vw,66px)/1.2 var(--font-serif); color:var(--forest); }
.care-series-headline { margin:20px 0; font:400 clamp(26px,3vw,40px)/1.5 var(--font-serif); color:var(--forest); }
.care-series-hero .routine-link { margin-top:24px; }
.care-core { display:grid; grid-template-columns:minmax(0,.8fr) minmax(0,1fr); gap:64px; align-items:center; padding:48px 0 64px; border-top:1px solid var(--line); }
.care-product-image { position:relative; background:var(--white,#fff); }
.care-product-image img { display:block; width:100%; height:auto; max-height:460px; padding:24px; object-fit:contain; }
.care-core h2,.care-routine h2,.care-options h2 { margin:12px 0 24px; font:400 clamp(28px,3vw,40px)/1.4 var(--font-serif); color:var(--forest); }
.care-core p,.care-mask p,.care-options-intro { color:var(--ink-muted); font-size:16px; line-height:1.9; }
.care-core .care-subtitle { color:var(--forest); font-size:20px; }
.care-core .routine-link,.care-mask .routine-link { margin-top:24px; }
.care-routine,.care-options { padding:64px 0; border-top:1px solid var(--line); }
.care-step { color:var(--forest); font-size:12px; letter-spacing:.04em; }
.care-routine .routine-card h3 { margin-top:16px; }
.care-routine .care-flow { color:var(--forest); font-weight:500; }
.care-mask { display:grid; grid-template-columns:200px minmax(0,1fr); align-items:center; gap:36px; margin:32px 0 48px; }
.care-mask h3,.care-cream-heading { font:400 24px/1.5 var(--font-serif); color:var(--forest); }
.care-mask .care-product-image img { max-height:240px; }
.care-cream-heading { margin-bottom:24px; }
.care-return { padding:0 0 64px; }
@media(max-width:760px) {
  .care-series-entry { align-items:flex-start; flex-direction:column; gap:16px; }
  .care-series-hero { padding:24px 0 40px; }
  .care-core { grid-template-columns:1fr; gap:28px; padding:32px 0 40px; }
  .care-product-image img { max-height:340px; }
  .care-routine,.care-options { padding:40px 0; }
  .care-mask { grid-template-columns:1fr; gap:24px; }
  .care-mask .care-product-image { max-width:220px; }
  .home-acne-series { display:block; margin:20px 0 0; }
}
