/*
 * growthfulmind.com — static tenant theme.
 * Бренд: особистісний ріст / усвідомленість / mindset. Настрій — "grounded growth":
 * органічна тепла палітра (emerald-зелень + золотий акцент), м'який serif Fraunces
 * для заголовків + округлий гуманістичний Nunito Sans для тексту, щедрі радіуси
 * та м'які, дифузні тіні — спокій і turbота.
 *
 * Усе — override семантичних токенів core'у (`src/styles/tokens/semantic.tokens.ts`).
 * Значення кольорів — 'r g b' триплети (щоб працювало `rgb(var(--color-…) / alpha)`).
 */
@import url("https://fonts.googleapis.com/css2?family=Fraunces:opsz,wght@9..144,400..700&family=Nunito+Sans:wght@400;500;600;700;800&display=swap");

:root {
  /* — Typography — м'який органічний serif + округлий humanist sans — */
  --font-sans: "Nunito Sans", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  --font-display: "Fraunces", Georgia, "Times New Roman", serif;

  /* — Brand accent — grounded emerald (ріст) — */
  --color-primary: 4 120 87; /* #047857 emerald-700 */
  --color-primary-fg: 255 255 255;

  /* — Secondary — теплий золотий «sun» для балансу зелені — */
  --color-secondary: 245 158 11; /* #F59E0B amber-500 */
  --color-secondary-fg: 69 26 3; /* #451A03 amber-950 — читабельно на amber */

  /* — Surface stack — тепла cream-палітра з ледь зеленим відтінком — */
  --color-background: 250 250 247; /* #FAFAF7 warm cream */
  --color-surface: 244 246 242; /* faint sage */
  --color-surface-elevated: 255 255 255;
  --color-border: 226 232 224; /* green-tinted neutral */
  --color-border-strong: 203 213 199; /* sage-300 */

  /* — Foreground — тепла глибока зелень-ink — */
  --color-foreground: 38 50 44; /* deep green-gray */
  --color-foreground-muted: 91 107 98; /* muted sage */
  --color-heading: 20 39 29; /* #14271D rich forest — спокійні заголовки */

  /* — Site dark/vibrant — footer + dark-секції прив'язані до зеленого бренду — */
  --color-site-deep: 20 36 27; /* deep forest */
  --color-site-vibrant: 16 185 129; /* #10B981 emerald-500 */

  /* — Membership tiers — органічна green/teal-шкала (basic→premium = глибше/авторитетніше) — */
  --color-tier-basic: 5 150 105; /* emerald-600 */
  --color-tier-basic-deep: 4 120 87; /* emerald-700 */
  --color-tier-medium: 13 148 136; /* teal-600 */
  --color-tier-medium-deep: 15 118 110; /* teal-700 */
  --color-tier-premium: 6 95 70; /* emerald-800 */
  --color-tier-premium-deep: 6 78 59; /* emerald-900 */

  /* — Радіуси — м'які, органічні (pillowy картки) — */
  --radius-button: 0.875rem;
  --radius-input: 0.75rem;
  --radius-card: 1.5rem;
  --radius-dialog: 1.5rem;
  --radius-badge: 9999px;

  /* — Тіні — м'які, дифузні, green-tinted — */
  --shadow-card: 0 6px 24px -10px rgba(6, 78, 59, 0.18);
  --shadow-card-hover: 0 16px 36px -12px rgba(6, 78, 59, 0.28);
  --shadow-button: 0 2px 10px -2px rgba(4, 120, 87, 0.35);
  --shadow-button-hover: 0 6px 18px -4px rgba(4, 120, 87, 0.5);
  --shadow-dropdown: 0 12px 32px -12px rgba(20, 39, 29, 0.18);
}

/* ─── Home blocks — hook-class overrides ───────────────────────────────────
 * Двоакцентна палітра: emerald (primary, дефолт компонентів) — eyebrow-лейбли +
 * CTA; warm amber (secondary) — title-accents (акцентні слова в заголовках) +
 * іконки pillars + лапка цитат. Заголовки секцій → Fraunces serif (генерик-блоки
 * за замовч. НЕ font-display) — tenant-scoped, разом зі старими блоками
 * (journey/guarantee) через їхній `className`. */

/* Hero — eyebrow = м'який emerald pill (узгоджено з рештою eyebrow = primary). */
.hero-stats .hero-stats__eyebrow {
  border-color: rgb(var(--color-primary) / 0.28);
  background: rgb(var(--color-primary) / 0.07);
  color: rgb(var(--color-primary));
  text-transform: uppercase;
  letter-spacing: 0.1em;
  font-size: 0.7rem;
  font-weight: 700;
}

/* Акцентні слова в заголовках + лапка цитат → теплий amber. */
.hero-stats .hero-stats__accent,
.split-features .split-features__title-accent,
.feature-cards .feature-cards__title-accent,
.testimonials .testimonials__title-accent,
.testimonials .testimonials__quote-mark {
  color: rgb(var(--color-secondary));
}

/* Заголовки секцій + заголовки колонок/карток → Fraunces serif (за брендом).
 * Старі блоки (journey/guarantee) не мають hook-класів → таргет по `h2`. */
.feature-columns .feature-columns__title,
.feature-columns .feature-columns__item-title,
.split-features .split-features__title,
.feature-cards .feature-cards__title,
.feature-cards .feature-cards__card-title,
.testimonials .testimonials__title,
.gm-journey h2,
.gm-guarantee h2 {
  font-family: var(--font-display);
}

/* Pillars — іконка в блідому теплому amber-колі. */
.feature-columns .feature-columns__icon {
  box-sizing: content-box;
  width: 1.5rem;
  height: 1.5rem;
  padding: 0.85rem;
  border-radius: 9999px;
  color: rgb(var(--color-secondary));
  background: rgb(var(--color-secondary) / 0.13);
}

/* Modules (featureCards.gm-modules) — мʼякі sage-картки на білій секції. */
.gm-modules .feature-cards__card {
  background: rgb(var(--color-surface));
  border-color: rgb(var(--color-border));
}