/* ==========================================================================
   Kriyasya Ayurveda — Design System
   Premium · Calm · Earthy · Trustworthy · Senior-readable · Bilingual
   ========================================================================== */

:root {
  /* Brand palette */
  --lv-teal: #0E4A45;
  --lv-deep-teal: #073A36;
  --lv-sandal: #E8D8B8;
  --lv-ivory: #FFF8EC;
  --lv-tulsi: #6F8F45;
  --lv-turmeric: #D99A28;
  --lv-clay: #B66A4A;
  --lv-brown: #4B3428;
  --lv-muted-green: #A8B88A;
  --lv-paper: #FBF4E6;

  /* Semantic */
  --bg: var(--lv-ivory);
  --surface: #ffffff;
  --surface-2: var(--lv-paper);
  --ink: #2A2018;
  --ink-soft: #5C5043;
  --line: #E7DCC6;
  --accent: var(--lv-tulsi);
  --ok: var(--lv-tulsi);
  --warn: var(--lv-turmeric);
  --danger: var(--lv-clay);

  /* Type */
  --font-head: "Fraunces", Georgia, "Noto Serif", serif;
  --font-body: "Inter", "Noto Sans Devanagari", system-ui, -apple-system, "Segoe UI", sans-serif;

  /* Layout */
  --radius: 16px;
  --radius-sm: 10px;
  --radius-lg: 24px;
  --shadow-sm: 0 1px 2px rgba(75, 52, 40, .06), 0 2px 8px rgba(75, 52, 40, .05);
  --shadow-md: 0 6px 22px rgba(14, 74, 69, .10);
  --shadow-lg: 0 18px 48px rgba(14, 74, 69, .16);
  --maxw: 1140px;
  --gap: clamp(1rem, 2.5vw, 1.6rem);
}

html[lang="hi"] { --font-body: "Noto Sans Devanagari", "Inter", system-ui, sans-serif; }

* { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; scroll-behavior: smooth; }

body {
  margin: 0;
  font-family: var(--font-body);
  font-size: 1.05rem;
  line-height: 1.7;
  color: var(--ink);
  background:
    radial-gradient(1200px 600px at 80% -10%, rgba(168, 184, 138, .18), transparent 60%),
    radial-gradient(900px 500px at -10% 10%, rgba(217, 154, 40, .10), transparent 55%),
    var(--bg);
  -webkit-font-smoothing: antialiased;
}

body.large-text { font-size: 1.18rem; }

h1, h2, h3, h4 { font-family: var(--font-head); font-weight: 600; line-height: 1.18; color: var(--lv-deep-teal); margin: 0 0 .5em; }
.h1 { font-size: clamp(2rem, 4.5vw, 3.1rem); letter-spacing: -.01em; }
.h2 { font-size: clamp(1.5rem, 3vw, 2.1rem); }
.h3 { font-size: clamp(1.25rem, 2.2vw, 1.55rem); }
.h4 { font-size: 1.12rem; }
p { margin: 0 0 1rem; }
.lead { font-size: 1.15rem; color: var(--ink-soft); }
.muted { color: var(--ink-soft); }
a { color: var(--lv-teal); }
.link { color: var(--lv-teal); font-weight: 600; text-decoration: none; border-bottom: 1px solid rgba(14,74,69,.25); }
.link:hover { border-color: var(--lv-teal); }
.link--back { border: none; font-size: .95rem; }

.container { width: 100%; max-width: var(--maxw); margin-inline: auto; padding-inline: clamp(1rem, 4vw, 2rem); }
.section { padding-block: clamp(2.2rem, 5vw, 4rem); }
.section__head { max-width: 720px; margin-bottom: 1.8rem; }
.text-center { text-align: center; }
.mt-md { margin-top: 1rem; } .mt-lg { margin-top: 2rem; } .mb-md { margin-bottom: 1rem; }
.pad-md { padding: 1.25rem; } .pad-lg { padding: clamp(1.5rem, 4vw, 2.5rem); }

.skip-link { position: absolute; left: -999px; top: 0; background: var(--lv-teal); color: #fff; padding: .6rem 1rem; border-radius: 0 0 8px 0; z-index: 100; }
.skip-link:focus { left: 0; }

.icon { vertical-align: middle; flex: none; }

/* -------------------------------------------------------------- Buttons */
.btn {
  display: inline-flex; align-items: center; justify-content: center; gap: .5rem;
  font: inherit; font-weight: 600; cursor: pointer;
  padding: .72rem 1.3rem; border-radius: 999px; border: 1.5px solid transparent;
  text-decoration: none; transition: transform .12s ease, box-shadow .2s ease, background .2s ease;
  line-height: 1.2;
}
.btn:active { transform: translateY(1px); }
.btn-primary { background: var(--lv-teal); color: #fff; box-shadow: var(--shadow-md); }
.btn-primary:hover { background: var(--lv-deep-teal); }
.btn-secondary { background: var(--lv-turmeric); color: #3a2a08; }
.btn-secondary:hover { filter: brightness(1.04); }
.btn-ghost { background: transparent; border-color: var(--line); color: var(--lv-deep-teal); }
.btn-ghost:hover { background: var(--surface); }
.btn-lg { padding: .95rem 1.7rem; font-size: 1.05rem; }
.btn-sm { padding: .45rem .9rem; font-size: .9rem; }
.btn-block { display: flex; width: 100%; margin-top: .6rem; }

/* -------------------------------------------------------------- Header */
.site-header { position: sticky; top: 0; z-index: 50; background: rgba(255,248,236,.85); backdrop-filter: blur(12px); border-bottom: 1px solid var(--line); }
.site-header__inner { display: flex; align-items: center; gap: 1rem; padding-block: .7rem; }
.brand { display: flex; align-items: center; gap: .6rem; text-decoration: none; color: var(--lv-deep-teal); }
.brand__mark { display: grid; place-items: center; width: 42px; height: 42px; border-radius: 12px; background: linear-gradient(135deg, var(--lv-tulsi), var(--lv-teal)); color: #fff; }
.brand__text { display: flex; flex-direction: column; line-height: 1.05; }
.brand__name { font-family: var(--font-head); font-weight: 600; font-size: 1.15rem; }
.brand__sub { font-size: .72rem; color: var(--ink-soft); letter-spacing: .04em; text-transform: uppercase; }
.site-nav { display: flex; gap: .3rem; margin-left: auto; }
.site-nav__link { padding: .5rem .85rem; border-radius: 999px; text-decoration: none; color: var(--lv-deep-teal); font-weight: 500; font-size: .98rem; }
.site-nav__link:hover, .site-nav__link.is-active { background: rgba(111,143,69,.14); }
.site-header__actions { display: flex; align-items: center; gap: .6rem; }
.lang-switch { display: inline-flex; border: 1px solid var(--line); border-radius: 999px; overflow: hidden; background: var(--surface); }
.lang-switch__btn { padding: .35rem .65rem; font-size: .82rem; font-weight: 700; color: var(--ink-soft); text-decoration: none; }
.lang-switch__btn.is-active { background: var(--lv-teal); color: #fff; }

.topbar-safety { background: var(--lv-deep-teal); color: #f3ecdd; font-size: .82rem; }
.topbar-safety .container { display: flex; align-items: center; gap: .5rem; padding-block: .4rem; justify-content: center; text-align: center; }

@media (max-width: 820px) {
  .site-nav { display: none; }
}

/* -------------------------------------------------------------- Hero */
.hero { padding-block: clamp(2rem, 6vw, 4.5rem); }
.hero__inner { display: grid; grid-template-columns: 1.3fr .9fr; gap: clamp(1.5rem, 4vw, 3rem); align-items: center; }
.hero__kicker { display: inline-flex; align-items: center; gap: .4rem; font-weight: 600; color: var(--lv-tulsi); background: rgba(111,143,69,.12); padding: .35rem .8rem; border-radius: 999px; font-size: .85rem; }
.hero__title { margin-top: .8rem; font-size: clamp(2.1rem, 5vw, 3.6rem); }
.hero__lead { font-size: 1.2rem; color: var(--ink-soft); max-width: 36ch; }
.hero__actions { display: flex; flex-wrap: wrap; gap: .8rem; margin-top: 1.4rem; }
.hero__card { display: grid; }
.daily-promise { background: linear-gradient(160deg, var(--surface), var(--surface-2)); border: 1px solid var(--line); border-radius: var(--radius-lg); padding: clamp(1.5rem, 3vw, 2.2rem); box-shadow: var(--shadow-lg); }
.daily-promise__icon { display: inline-grid; place-items: center; width: 56px; height: 56px; border-radius: 16px; background: rgba(217,154,40,.18); color: var(--lv-turmeric); margin-bottom: .6rem; }
.daily-promise__title { font-size: 1.4rem; }
@media (max-width: 860px) { .hero__inner { grid-template-columns: 1fr; } }

/* -------------------------------------------------------------- Trust bar */
.trust-bar { display: grid; grid-template-columns: repeat(4, 1fr); gap: 1rem; background: var(--surface); border: 1px solid var(--line); border-radius: var(--radius); padding: 1.2rem; box-shadow: var(--shadow-sm); }
.trust-bar__item { display: flex; gap: .7rem; align-items: flex-start; }
.trust-bar__icon { display: grid; place-items: center; width: 38px; height: 38px; border-radius: 10px; background: rgba(14,74,69,.08); color: var(--lv-teal); flex: none; }
.trust-bar__item strong { display: block; font-size: .98rem; }
.trust-bar__item .muted { font-size: .82rem; }
@media (max-width: 820px) { .trust-bar { grid-template-columns: 1fr 1fr; } }
@media (max-width: 480px) { .trust-bar { grid-template-columns: 1fr; } }

/* -------------------------------------------------------------- Grids & cards */
.grid { display: grid; gap: var(--gap); }
.grid--cards { grid-template-columns: repeat(auto-fill, minmax(265px, 1fr)); }
.grid--cats { grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); }

.card { background: var(--surface); border: 1px solid var(--line); border-radius: var(--radius); box-shadow: var(--shadow-sm); }

.tool-card {
  display: flex; flex-direction: column; gap: .5rem;
  background: var(--surface); border: 1px solid var(--line); border-radius: var(--radius);
  padding: 1.25rem; text-decoration: none; color: var(--ink);
  box-shadow: var(--shadow-sm); transition: transform .15s ease, box-shadow .2s ease, border-color .2s;
  position: relative; overflow: hidden;
}
.tool-card::before { content: ""; position: absolute; inset: 0 0 auto 0; height: 4px; background: var(--accent); opacity: .85; }
.tool-card:hover { transform: translateY(-3px); box-shadow: var(--shadow-md); border-color: var(--accent); }
.tool-card__top { display: flex; align-items: center; justify-content: space-between; margin-top: .2rem; }
.tool-card__icon { display: grid; place-items: center; width: 44px; height: 44px; border-radius: 12px; background: color-mix(in srgb, var(--accent) 16%, white); color: var(--accent); }
.tool-card__title { font-size: 1.18rem; margin: .3rem 0 0; }
.tool-card__sub { color: var(--ink-soft); font-size: .92rem; margin: 0; flex: 1; }
.tool-card__meta { display: flex; flex-wrap: wrap; gap: .8rem; font-size: .82rem; color: var(--ink-soft); }
.tool-card__meta span { display: inline-flex; align-items: center; gap: .3rem; }
.tool-card__cta { display: inline-flex; align-items: center; gap: .4rem; font-weight: 600; color: var(--lv-teal); font-size: .92rem; margin-top: .3rem; }

.cat-card { display: flex; align-items: center; gap: .8rem; background: var(--surface); border: 1px solid var(--line); border-radius: var(--radius); padding: 1rem 1.1rem; text-decoration: none; color: var(--ink); box-shadow: var(--shadow-sm); transition: transform .15s, box-shadow .2s; }
.cat-card:hover { transform: translateY(-2px); box-shadow: var(--shadow-md); }
.cat-card__icon { display: grid; place-items: center; width: 42px; height: 42px; border-radius: 11px; background: rgba(111,143,69,.14); color: var(--lv-tulsi); flex: none; }
.cat-card__body { display: flex; flex-direction: column; flex: 1; }
.cat-card__label { font-weight: 600; }
.cat-card__count { font-size: .8rem; color: var(--ink-soft); }

/* badges & pills */
.badge { display: inline-flex; align-items: center; gap: .3rem; font-size: .74rem; font-weight: 700; padding: .25rem .6rem; border-radius: 999px; text-transform: uppercase; letter-spacing: .03em; }
.badge--free { background: rgba(111,143,69,.16); color: #3f5722; }
.badge--premium { background: rgba(217,154,40,.18); color: #875c12; }
.pill { display: inline-flex; align-items: center; font-size: .76rem; font-weight: 600; padding: .25rem .6rem; border-radius: 999px; background: var(--surface-2); border: 1px solid var(--line); color: var(--ink-soft); }
.pill--ev-a { background: rgba(14,74,69,.12); color: var(--lv-deep-teal); }
.pill--ev-b { background: rgba(111,143,69,.16); color: #3f5722; }
.pill--ev-c { background: rgba(217,154,40,.16); color: #875c12; }
.pill--ev-d { background: rgba(168,184,138,.22); color: #4b5a30; }
.pill--ev-x { background: rgba(182,106,74,.18); color: #7a3c24; }

/* search */
.search-box { display: flex; align-items: center; gap: .6rem; background: var(--surface); border: 1px solid var(--line); border-radius: 999px; padding: .5rem 1rem; box-shadow: var(--shadow-sm); margin-bottom: 1.5rem; max-width: 520px; color: var(--ink-soft); }
.search-box input { border: none; background: transparent; font: inherit; flex: 1; outline: none; color: var(--ink); }

/* -------------------------------------------------------------- Breadcrumb */
.breadcrumb { display: flex; flex-wrap: wrap; gap: .4rem; align-items: center; font-size: .88rem; padding-top: 1rem; color: var(--ink-soft); }
.breadcrumb a { text-decoration: none; color: var(--lv-teal); }
.breadcrumb span { color: var(--ink-soft); }

/* -------------------------------------------------------------- Safety / lists */
.safety-card { display: flex; gap: .7rem; align-items: flex-start; background: rgba(14,74,69,.06); border: 1px solid rgba(14,74,69,.18); border-left: 4px solid var(--lv-teal); border-radius: var(--radius-sm); padding: .9rem 1.1rem; color: var(--ink); margin: 1rem 0; font-size: .95rem; }
.safety-card--strong { background: rgba(217,154,40,.10); border-color: rgba(217,154,40,.3); border-left-color: var(--lv-turmeric); }
.safety-card svg { color: var(--lv-teal); margin-top: 2px; }

.icon-list { list-style: none; margin: 0; padding: 0; display: grid; gap: .55rem; }
.icon-list li { display: flex; gap: .6rem; align-items: flex-start; }
.icon-list li svg { color: var(--lv-tulsi); margin-top: 4px; flex: none; }
.list-block { margin: 1rem 0; }
.list-block__title { font-size: 1.05rem; margin-bottom: .5rem; }
.list-block--caution .icon-list li svg { color: var(--lv-turmeric); }
.list-block--consult .icon-list li svg { color: var(--lv-clay); }
.list-block--actions { background: rgba(111,143,69,.08); border: 1px solid var(--line); border-radius: var(--radius-sm); padding: 1rem 1.2rem; }

.steps-list { counter-reset: s; list-style: none; margin: 0; padding: 0; display: grid; gap: .7rem; }
.steps-list li { counter-increment: s; display: flex; gap: .8rem; align-items: flex-start; }
.steps-list li::before { content: counter(s); display: grid; place-items: center; width: 28px; height: 28px; border-radius: 50%; background: var(--lv-teal); color: #fff; font-weight: 700; font-size: .85rem; flex: none; }

/* meta card */
.meta-card { background: var(--surface); border: 1px solid var(--line); border-radius: var(--radius); padding: 1.2rem; box-shadow: var(--shadow-sm); }
.meta-card__title { display: flex; align-items: center; gap: .5rem; font-size: 1.05rem; margin-bottom: .8rem; }
.meta-card__grid { display: grid; gap: .7rem; margin: 0; }
.meta-card__grid div { display: flex; flex-direction: column; gap: .1rem; }
.meta-card__grid dt { font-size: .78rem; text-transform: uppercase; letter-spacing: .04em; color: var(--ink-soft); }
.meta-card__grid dd { margin: 0; font-weight: 500; }

/* alerts */
.alert { padding: .8rem 1rem; border-radius: var(--radius-sm); margin: .8rem 0; font-size: .95rem; }
.alert--info { background: rgba(14,74,69,.08); border: 1px solid rgba(14,74,69,.2); }
.alert--error { background: rgba(182,106,74,.12); border: 1px solid rgba(182,106,74,.3); color: #7a3c24; }

/* -------------------------------------------------------------- Landing page */
.landing-hero { display: grid; grid-template-columns: 1.4fr .8fr; gap: 2rem; padding-top: 1.5rem; align-items: start; }
.landing-hero__badges { display: flex; gap: .5rem; margin-bottom: .6rem; flex-wrap: wrap; }
.landing-hero__meta { list-style: none; display: flex; flex-wrap: wrap; gap: 1.1rem; padding: 0; margin: 1rem 0; color: var(--ink-soft); font-size: .92rem; }
.landing-hero__meta li { display: inline-flex; align-items: center; gap: .4rem; }
.landing-hero__cta { margin-top: 1.2rem; }
.landing-hero__aside { background: var(--surface); border: 1px solid var(--line); border-radius: var(--radius); padding: 1.2rem; box-shadow: var(--shadow-sm); border-top: 4px solid var(--accent); }
.landing-hero__icon { display: grid; place-items: center; width: 72px; height: 72px; border-radius: 18px; background: color-mix(in srgb, var(--accent) 16%, white); color: var(--accent); margin-bottom: .8rem; }
.landing-body { display: grid; grid-template-columns: 1.6fr .8fr; gap: 2rem; padding-block: 1rem 3rem; }
.landing-body__aside { display: grid; gap: 1.2rem; align-content: start; }
.section-block { margin-bottom: 2rem; }
.prose-page { padding-block: 1rem 3rem; max-width: 800px; }
.prose-page h2 { margin-top: 1.8rem; }
.cta-card { background: linear-gradient(160deg, var(--lv-teal), var(--lv-deep-teal)); color: #fff; border-radius: var(--radius); padding: 1.3rem; }
.cta-card h3 { color: #fff; }
.cta-card .btn-primary { background: var(--lv-turmeric); color: #3a2a08; }
@media (max-width: 880px) { .landing-hero, .landing-body { grid-template-columns: 1fr; } }

/* faq */
.faq-list { display: grid; gap: .6rem; }
.faq-item { background: var(--surface); border: 1px solid var(--line); border-radius: var(--radius-sm); padding: .3rem .2rem; }
.faq-item summary { cursor: pointer; font-weight: 600; padding: .7rem 1rem; list-style: none; display: flex; justify-content: space-between; align-items: center; }
.faq-item summary::after { content: "+"; font-size: 1.3rem; color: var(--lv-tulsi); }
.faq-item[open] summary::after { content: "–"; }
.faq-item p { padding: 0 1rem 1rem; margin: 0; color: var(--ink-soft); }

/* evidence grid */
.evidence-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(200px,1fr)); gap: 1rem; margin: 1rem 0 2rem; }
.evidence-grid__item { background: var(--surface); border: 1px solid var(--line); border-radius: var(--radius-sm); padding: 1rem; display: grid; gap: .3rem; }
.evidence-grid__item .pill { width: fit-content; }

/* category hero */
.cat-hero { padding-block: 1.5rem 1rem; }

/* -------------------------------------------------------------- Footer */
.site-footer { background: var(--lv-deep-teal); color: #e9e0cf; margin-top: 3rem; padding-block: 2.5rem 1.5rem; }
.site-footer a { color: #d9e6cf; text-decoration: none; display: block; padding: .2rem 0; font-size: .92rem; }
.site-footer a:hover { color: #fff; }
.site-footer__grid { display: grid; grid-template-columns: 1.6fr 1fr 1fr 1fr; gap: 2rem; }
.site-footer__name { color: #fff; margin: .5rem 0 .3rem; }
.site-footer__brand .brand__mark { margin-bottom: .4rem; }
.site-footer__col h3 { color: #fff; font-size: 1rem; margin-bottom: .6rem; }
.site-footer__safety { display: flex; gap: .7rem; align-items: flex-start; margin: 2rem 0 1rem; padding: 1rem; background: rgba(255,255,255,.06); border-radius: var(--radius-sm); font-size: .82rem; line-height: 1.55; }
.site-footer__safety svg { color: var(--lv-turmeric); flex: none; margin-top: 2px; }
.site-footer__base { display: flex; justify-content: space-between; flex-wrap: wrap; gap: .5rem; border-top: 1px solid rgba(255,255,255,.12); padding-top: 1rem; font-size: .82rem; color: #bdb29c; }
.site-footer__base p { margin: 0; }
@media (max-width: 760px) { .site-footer__grid { grid-template-columns: 1fr 1fr; } }
@media (max-width: 480px) { .site-footer__grid { grid-template-columns: 1fr; } }

/* -------------------------------------------------------------- Gate / auth */
.gate-wrap { display: grid; place-items: center; min-height: 50vh; }
.gate-card { background: var(--surface); border: 1px solid var(--line); border-radius: var(--radius-lg); padding: clamp(1.5rem, 4vw, 2.5rem); box-shadow: var(--shadow-lg); max-width: 460px; width: 100%; text-align: center; }
.gate-card--premium { border-top: 5px solid var(--lv-turmeric); }
.gate-card__icon { display: inline-grid; place-items: center; width: 64px; height: 64px; border-radius: 18px; background: rgba(14,74,69,.1); color: var(--lv-teal); margin-bottom: .8rem; }
.gate-card--premium .gate-card__icon { background: rgba(217,154,40,.16); color: var(--lv-turmeric); }
.gate-form { display: grid; gap: .9rem; margin-top: 1rem; text-align: left; }
.gate-benefits { text-align: left; margin: 1rem 0; }
.gate-card__fine { margin-top: 1rem; font-size: .8rem; color: var(--ink-soft); display: flex; gap: .4rem; align-items: center; justify-content: center; }
.field { display: grid; gap: .35rem; }
.field span { font-weight: 600; font-size: .92rem; }
.field input, .field select, .field textarea { font: inherit; padding: .7rem .9rem; border: 1.5px solid var(--line); border-radius: var(--radius-sm); background: var(--surface); color: var(--ink); width: 100%; }
.field input:focus, .field select:focus, .field textarea:focus { outline: none; border-color: var(--lv-tulsi); box-shadow: 0 0 0 3px rgba(111,143,69,.18); }
.field-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 1rem; }
@media (max-width: 560px) { .field-grid { grid-template-columns: 1fr; } }

/* -------------------------------------------------------------- Play / Journey */
.play-topbar { display: flex; align-items: center; justify-content: space-between; padding-top: 1rem; }
.play-wrap { padding-block: 1rem 3rem; max-width: 760px; }
.journey { background: var(--surface); border: 1px solid var(--line); border-radius: var(--radius-lg); box-shadow: var(--shadow-md); overflow: hidden; }
.journey__progress { height: 6px; background: var(--surface-2); }
.journey__progress-bar { display: block; height: 100%; width: 0; background: linear-gradient(90deg, var(--lv-tulsi), var(--lv-teal)); transition: width .4s ease; }
.journey__progress-label { font-size: .8rem; color: var(--ink-soft); text-align: right; padding: .5rem 1.5rem 0; margin: 0; }

.journey-step { padding: clamp(1.4rem, 4vw, 2.6rem); animation: stepIn .4s ease; }
.journey-step[hidden] { display: none; }
@keyframes stepIn { from { opacity: 0; transform: translateY(10px); } to { opacity: 1; transform: none; } }
.journey-step__kicker { display: inline-block; font-size: .78rem; font-weight: 700; text-transform: uppercase; letter-spacing: .06em; color: var(--lv-tulsi); background: rgba(111,143,69,.12); padding: .25rem .7rem; border-radius: 999px; margin-bottom: .7rem; }
.journey-step__title { font-size: clamp(1.4rem, 3vw, 1.9rem); }
.journey-step__body { font-size: 1.08rem; color: var(--ink-soft); }
.journey-step__micro { font-size: .9rem; }
.journey-step__time { display: inline-flex; align-items: center; gap: .4rem; font-size: .9rem; color: var(--lv-teal); background: rgba(14,74,69,.07); padding: .35rem .8rem; border-radius: 999px; }
.journey-step__icon-done { display: inline-grid; place-items: center; width: 80px; height: 80px; border-radius: 50%; background: rgba(111,143,69,.16); color: var(--lv-tulsi); margin-bottom: .5rem; }
.journey-step--quiz .quiz-answers { margin-top: 1rem; }

.journey__nav { display: flex; justify-content: space-between; gap: 1rem; padding: 1.2rem clamp(1.4rem,4vw,2.6rem); border-top: 1px solid var(--line); background: var(--surface-2); }
.journey__nav .btn { min-width: 120px; }

/* confirm checkbox / choices */
.check-confirm { display: flex; gap: .6rem; align-items: flex-start; margin-top: 1rem; cursor: pointer; font-size: .98rem; }
.check-confirm input { margin-top: 4px; width: 18px; height: 18px; accent-color: var(--lv-tulsi); }
.choice-grid { display: grid; gap: .7rem; margin-top: 1rem; }
.choice { display: flex; gap: .7rem; align-items: center; padding: .9rem 1.1rem; border: 1.5px solid var(--line); border-radius: var(--radius-sm); cursor: pointer; background: var(--surface); transition: border-color .15s, background .15s; }
.choice:hover { border-color: var(--lv-muted-green); }
.choice input { accent-color: var(--lv-tulsi); width: 18px; height: 18px; }
.choice:has(input:checked) { border-color: var(--lv-tulsi); background: rgba(111,143,69,.08); }

/* quiz answers */
.quiz-answer { display: flex; gap: .7rem; align-items: center; padding: .9rem 1.1rem; border: 1.5px solid var(--line); border-radius: var(--radius-sm); cursor: pointer; margin-bottom: .6rem; background: var(--surface); transition: border-color .15s, background .15s; }
.quiz-answer:hover { border-color: var(--lv-muted-green); }
.quiz-answer input { accent-color: var(--lv-tulsi); width: 18px; height: 18px; flex: none; }
.quiz-answer:has(input:checked) { border-color: var(--lv-tulsi); background: rgba(111,143,69,.08); }
.quiz-answer__label { font-size: 1rem; }

/* checklist */
.checklist { list-style: none; margin: 1rem 0 0; padding: 0; display: grid; gap: .5rem; }
.checklist__item { display: flex; gap: .7rem; align-items: center; padding: .8rem 1rem; border: 1.5px solid var(--line); border-radius: var(--radius-sm); cursor: pointer; background: var(--surface); }
.checklist__item input { accent-color: var(--lv-tulsi); width: 20px; height: 20px; flex: none; }
.checklist__item:has(input:checked) { background: rgba(111,143,69,.1); border-color: var(--lv-tulsi); }
.checklist__item:has(input:checked) span { text-decoration: line-through; color: var(--ink-soft); }

/* edu note */
.edu-note { margin: 1rem 0; border: 1px solid var(--line); border-radius: var(--radius-sm); background: var(--surface-2); }
.edu-note summary { cursor: pointer; padding: .7rem 1rem; font-weight: 600; display: flex; align-items: center; gap: .5rem; }
.edu-note p { padding: 0 1rem 1rem; margin: 0; color: var(--ink-soft); }

/* breathing timer */
.breath-timer { display: grid; place-items: center; gap: 1.2rem; margin: 1.5rem 0; }
.breath-timer__ring { display: grid; place-items: center; width: 220px; height: 220px; border-radius: 50%; background: radial-gradient(circle, rgba(111,143,69,.16), rgba(14,74,69,.08)); border: 3px solid var(--lv-muted-green); transition: transform 4s ease-in-out, background .5s; }
.breath-timer__ring.is-inhale { transform: scale(1.18); background: radial-gradient(circle, rgba(111,143,69,.3), rgba(14,74,69,.12)); }
.breath-timer__ring.is-exhale { transform: scale(.85); }
.breath-timer__phase { font-family: var(--font-head); font-size: 1.5rem; color: var(--lv-deep-teal); }
.breath-timer__count { font-size: 1.05rem; color: var(--ink-soft); font-variant-numeric: tabular-nums; }
.breath-timer__controls { display: flex; gap: .8rem; }

/* trackers */
.tracker { margin: 1.2rem 0; }
.tracker-counter { display: flex; align-items: center; justify-content: center; gap: 1.5rem; margin: 1rem 0; }
.tracker-counter__btn { width: 56px; height: 56px; border-radius: 50%; border: 2px solid var(--lv-teal); background: var(--surface); color: var(--lv-teal); font-size: 1.8rem; cursor: pointer; line-height: 1; }
.tracker-counter__btn:hover { background: var(--lv-teal); color: #fff; }
.tracker-counter__value { font-family: var(--font-head); font-size: 2.2rem; text-align: center; min-width: 90px; }
.tracker-counter__value small { display: block; font-family: var(--font-body); font-size: .85rem; color: var(--ink-soft); }
.tracker-counter__progress { height: 10px; border-radius: 999px; background: var(--surface-2); overflow: hidden; }
.tracker-counter__progress span { display: block; height: 100%; width: 0; background: linear-gradient(90deg, var(--lv-teal), var(--lv-tulsi)); transition: width .4s; }
.tracker-scale { display: flex; flex-wrap: wrap; gap: .6rem; justify-content: center; margin: 1rem 0; }
.tracker-scale__opt { display: grid; place-items: center; gap: .3rem; cursor: pointer; }
.tracker-scale__opt input { position: absolute; opacity: 0; }
.tracker-scale__dot { display: grid; place-items: center; width: 52px; height: 52px; border-radius: 50%; border: 2px solid var(--line); font-weight: 700; font-size: 1.1rem; transition: all .15s; }
.tracker-scale__opt:has(input:checked) .tracker-scale__dot { background: var(--lv-tulsi); color: #fff; border-color: var(--lv-tulsi); transform: scale(1.08); }
.tracker-scale__lbl { font-size: .78rem; color: var(--ink-soft); }
.tracker-time { display: grid; gap: .8rem; max-width: 300px; }
.tracker__note { font-size: .8rem; display: flex; align-items: center; gap: .4rem; margin-top: .6rem; }

/* summary / result */
.journey-result { margin: 1rem 0; }
.summary-section { margin: 1.2rem 0; }
.result-dosha { display: grid; gap: 1rem; margin: 1rem 0; }
.result-dosha__bar { display: grid; grid-template-columns: 90px 1fr 46px; align-items: center; gap: .7rem; }
.result-dosha__track { height: 14px; border-radius: 999px; background: var(--surface-2); overflow: hidden; }
.result-dosha__fill { display: block; height: 100%; border-radius: 999px; transition: width .6s ease; }
.result-card { background: linear-gradient(160deg, var(--surface), var(--surface-2)); border: 1px solid var(--line); border-left: 5px solid var(--accent); border-radius: var(--radius); padding: 1.3rem; margin: 1rem 0; }
.result-card h3 { font-size: 1.4rem; }
.journey-report-actions { display: flex; flex-wrap: wrap; gap: .7rem; margin-top: 1.2rem; }

/* report */
.report-mount { margin-top: 2rem; }
.report { background: #fff; border: 1px solid var(--line); border-radius: var(--radius); padding: clamp(1.5rem, 4vw, 2.5rem); box-shadow: var(--shadow-sm); }
.report__cover { text-align: center; padding-bottom: 1.5rem; border-bottom: 2px solid var(--line); margin-bottom: 1.5rem; }
.report__brand { display: inline-flex; align-items: center; gap: .4rem; color: var(--lv-tulsi); font-weight: 600; }
.report__title { font-size: 2rem; margin: .5rem 0 .2rem; }
.report__disclaimer { display: flex; gap: .5rem; align-items: flex-start; background: rgba(217,154,40,.1); border-radius: var(--radius-sm); padding: .8rem 1rem; font-size: .88rem; margin-bottom: 1.5rem; }
.report__section { margin-bottom: 1.5rem; }
.report__section h2 { font-size: 1.3rem; border-bottom: 1px solid var(--line); padding-bottom: .3rem; }
.report__reflection { border-left: 3px solid var(--lv-muted-green); padding-left: 1rem; color: var(--ink-soft); font-style: italic; }
.report__plan { padding-left: 1.2rem; }
.report__footer { border-top: 1px solid var(--line); padding-top: 1rem; font-size: .85rem; color: var(--ink-soft); }
.report-actions { margin-top: 1.5rem; }

/* offline */
.offline-page { display: grid; place-items: center; min-height: 100vh; }

@media print {
  .site-header, .topbar-safety, .site-footer, .journey__nav, .no-print, .play-topbar, .report-actions, .journey-report-actions { display: none !important; }
  body { background: #fff; }
  .report { box-shadow: none; border: none; }
}

/* reduced motion */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation-duration: .01ms !important; transition-duration: .01ms !important; }
  .breath-timer__ring { transition: none; }
}

/* -------------------------------------------------------------- Utility features */
.utility { max-width: 680px; }
.utility__head { display: flex; gap: 1rem; align-items: center; margin-bottom: 1.5rem; }
.utility__icon { display: grid; place-items: center; width: 64px; height: 64px; border-radius: 18px; background: rgba(14,74,69,.1); color: var(--lv-teal); flex: none; }
.utility__card { background: var(--surface); border: 1px solid var(--line); border-radius: var(--radius); padding: clamp(1.2rem, 3vw, 1.8rem); box-shadow: var(--shadow-sm); margin-bottom: 1rem; }
.utility__card h2 { margin-bottom: .5rem; }
.utility__action { margin-top: 1.2rem; display: grid; gap: .8rem; }
.utility__status { font-size: .92rem; font-weight: 600; margin: 0; min-height: 1.2em; }
.utility__footnote { display: flex; gap: .4rem; align-items: flex-start; font-size: .82rem; color: var(--ink-soft); margin: .3rem 0 1rem; }
.utility__pin { display: grid; gap: .8rem; }
.utility__pin-actions { display: flex; gap: .7rem; flex-wrap: wrap; }
.btn-danger { background: var(--lv-clay); color: #fff; }
.btn-danger:hover { background: #9a4f33; }

/* toggle switch */
.utility__toggle { display: flex; align-items: center; gap: .8rem; cursor: pointer; font-weight: 600; }
.utility__toggle input { position: absolute; opacity: 0; }
.utility__switch { position: relative; width: 52px; height: 30px; border-radius: 999px; background: var(--line); transition: background .2s; flex: none; }
.utility__switch::after { content: ""; position: absolute; top: 3px; left: 3px; width: 24px; height: 24px; border-radius: 50%; background: #fff; box-shadow: 0 1px 3px rgba(0,0,0,.2); transition: transform .2s; }
.utility__toggle input:checked + .utility__switch { background: var(--lv-tulsi); }
.utility__toggle input:checked + .utility__switch::after { transform: translateX(22px); }
.utility__toggle input:focus-visible + .utility__switch { box-shadow: 0 0 0 3px rgba(111,143,69,.3); }

/* family profiles */
.utility__profiles { display: grid; gap: 1rem; }
.utility__profile-list { list-style: none; margin: .5rem 0 0; padding: 0; display: grid; gap: .5rem; }
.utility__profile { display: flex; align-items: center; justify-content: space-between; gap: .8rem; padding: .8rem 1rem; border: 1.5px solid var(--line); border-radius: var(--radius-sm); background: var(--surface); }
.utility__profile.is-active { border-color: var(--lv-tulsi); background: rgba(111,143,69,.08); }
.utility__profile-actions { display: flex; gap: .5rem; align-items: center; }

/* -------------------------------------------------------------- Accessibility themes */
body.large-text { font-size: 1.2rem; }
body.large-text .tool-card__sub, body.large-text .muted { font-size: 1rem; }
body.large-text .btn { font-size: 1.05rem; }

body.color-friendly {
  --lv-teal: #005a8c;
  --lv-deep-teal: #003f63;
  --lv-tulsi: #2e7d32;
  --lv-turmeric: #b8860b;
  --lv-clay: #a13a1f;
  --ink: #1a1a1a;
  --ink-soft: #3a3a3a;
  --line: #b0b0b0;
  --bg: #fdfdf7;
  --surface: #ffffff;
}
body.color-friendly .badge--premium { background: #b8860b; color: #fff; }
body.color-friendly .badge--free { background: #2e7d32; color: #fff; }
body.color-friendly .muted { color: #3a3a3a; }

/* -------------------------------------------------------------- Settings page */
.settings-wrap { max-width: 720px; }
.settings-head { display: flex; gap: 1rem; align-items: center; margin-bottom: 1.5rem; }
.settings-wrap .utility__card { margin-bottom: 1.2rem; }
.settings-wrap .utility__card h2 { display: flex; align-items: center; gap: .5rem; }

/* ============================================================== Premium Assessment UI */
.assess-step__count { display: inline-block; font-size: .8rem; font-weight: 700; letter-spacing: .04em; text-transform: uppercase; color: var(--lv-tulsi); background: rgba(111,143,69,.12); padding: .3rem .8rem; border-radius: 999px; margin-bottom: 1rem; }
.assess-step__q { font-family: var(--font-head); font-size: clamp(1.4rem, 3.2vw, 2rem); line-height: 1.25; color: var(--lv-deep-teal); margin: 0 0 .5rem; }
.assess-step__help { color: var(--ink-soft); font-size: .95rem; margin-bottom: 1.3rem; }

.assess-options { display: grid; gap: .7rem; }
.assess-option { display: grid; grid-template-columns: auto 1fr auto; align-items: center; gap: .9rem; padding: 1rem 1.1rem; border: 1.6px solid var(--line); border-radius: var(--radius); cursor: pointer; background: var(--surface); transition: border-color .15s, background .15s, transform .1s, box-shadow .2s; }
.assess-option:hover { border-color: var(--lv-muted-green); transform: translateY(-1px); box-shadow: var(--shadow-sm); }
.assess-option input { position: absolute; opacity: 0; }
.assess-option__badge { display: grid; place-items: center; width: 34px; height: 34px; border-radius: 10px; background: var(--surface-2); color: var(--ink-soft); font-weight: 700; font-family: var(--font-head); transition: all .15s; }
.assess-option__label { font-size: 1.02rem; line-height: 1.4; }
.assess-option__check { color: var(--lv-tulsi); opacity: 0; transition: opacity .15s; }
.assess-option:has(input:checked) { border-color: var(--lv-tulsi); background: rgba(111,143,69,.09); box-shadow: 0 0 0 1px var(--lv-tulsi) inset; }
.assess-option:has(input:checked) .assess-option__badge { background: var(--lv-tulsi); color: #fff; }
.assess-option:has(input:checked) .assess-option__check { opacity: 1; }

.assess-scale { display: flex; flex-wrap: wrap; gap: .6rem; justify-content: space-between; margin-top: .5rem; }
.assess-scale__opt { display: grid; place-items: center; gap: .35rem; cursor: pointer; flex: 1; min-width: 60px; }
.assess-scale__opt input { position: absolute; opacity: 0; }
.assess-scale__dot { display: grid; place-items: center; width: 50px; height: 50px; border-radius: 50%; border: 2px solid var(--line); font-weight: 700; font-size: 1.1rem; transition: all .15s; }
.assess-scale__lbl { font-size: .75rem; color: var(--ink-soft); text-align: center; }
.assess-scale__opt:has(input:checked) .assess-scale__dot { background: var(--lv-tulsi); color: #fff; border-color: var(--lv-tulsi); transform: scale(1.08); }
.assess-text textarea { width: 100%; }
.assess-text__note { display: flex; gap: .4rem; align-items: center; font-size: .8rem; color: var(--ink-soft); margin-top: .4rem; }

/* ---- Premium recommendation result ---- */
.reco-hero { background: linear-gradient(160deg, var(--lv-teal), var(--lv-deep-teal)); color: #fff; border-radius: var(--radius-lg); padding: clamp(1.4rem, 4vw, 2.2rem); margin-bottom: 1.2rem; box-shadow: var(--shadow-lg); }
.reco-hero__kicker { font-size: .78rem; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; color: var(--lv-sandal); }
.reco-hero__title { font-family: var(--font-head); font-size: clamp(1.6rem, 4vw, 2.4rem); margin: .3rem 0 .5rem; color: #fff; }
.reco-hero__tie { color: var(--lv-sandal); font-weight: 600; margin: 0 0 .5rem; }
.reco-hero__summary { color: rgba(255,255,255,.92); margin: 0; font-size: 1.05rem; line-height: 1.6; }

.reco-bars { display: grid; gap: .8rem; margin: 1.2rem 0; background: var(--surface); border: 1px solid var(--line); border-radius: var(--radius); padding: 1.2rem; }
.reco-bar { display: grid; grid-template-columns: 90px 1fr 46px; align-items: center; gap: .8rem; }
.reco-bar__name { font-weight: 600; font-size: .92rem; }
.reco-bar__track { height: 14px; border-radius: 999px; background: var(--surface-2); overflow: hidden; }
.reco-bar__fill { display: block; height: 100%; border-radius: 999px; transition: width .8s cubic-bezier(.22,1,.36,1); }
.reco-bar__pct { text-align: right; font-variant-numeric: tabular-nums; font-weight: 700; font-size: .9rem; color: var(--ink-soft); }

.reco-card { background: var(--surface); border: 1px solid var(--line); border-radius: var(--radius); padding: 1.1rem 1.3rem; margin-bottom: .9rem; box-shadow: var(--shadow-sm); }
.reco-card h4 { font-size: 1.05rem; margin: 0 0 .6rem; color: var(--lv-deep-teal); }
.reco-card--note { border-left: 4px solid var(--lv-muted-green); background: var(--surface-2); }
.reco-card--note p { margin: 0; color: var(--ink-soft); }
.reco-card--reflection { border-left: 4px solid var(--lv-turmeric); }
.reco-list { list-style: none; margin: 0; padding: 0; display: grid; gap: .5rem; }
.reco-list li { position: relative; padding-left: 1.5rem; line-height: 1.5; }
.reco-list li::before { content: ""; position: absolute; left: 0; top: .55em; width: 8px; height: 8px; border-radius: 50%; background: var(--lv-tulsi); }
.reco-list--quote li { font-style: italic; color: var(--ink-soft); }
.reco-list--quote li::before { background: var(--lv-turmeric); }

/* -------------------------------------------------------------- Tracker insights */
.tracker-insights { margin: 1.4rem 0; background: var(--surface); border: 1px solid var(--line); border-radius: var(--radius); padding: 1.3rem; box-shadow: var(--shadow-sm); }
.ti__title { display: flex; align-items: center; gap: .5rem; font-size: 1.1rem; margin: 0 0 1rem; color: var(--lv-deep-teal); }
.ti__grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(140px, 1fr)); gap: .8rem; }
.ti__stat { background: var(--surface-2); border-radius: var(--radius-sm); padding: 1rem; text-align: center; }
.ti__big { display: block; font-family: var(--font-head); font-size: 1.8rem; color: var(--lv-teal); line-height: 1; }
.ti__label { display: block; font-size: .8rem; color: var(--ink-soft); margin-top: .35rem; }
.ti__note { grid-column: 1 / -1; display: flex; gap: .5rem; align-items: flex-start; background: rgba(111,143,69,.08); border-radius: var(--radius-sm); padding: .8rem 1rem; font-size: .92rem; }
.ti__note svg { color: var(--lv-tulsi); flex: none; margin-top: 2px; }
.ti__empty { color: var(--ink-soft); }
.ti__disclaimer { display: flex; gap: .4rem; align-items: center; font-size: .8rem; color: var(--ink-soft); margin: 1rem 0 0; }
.ti__disclaimer svg { color: var(--lv-teal); flex: none; }

/* -------------------------------------------------------------- Report aggregate */
.report-aggregate { margin: 1.4rem 0; }
.ragg__sec { background: var(--surface); border: 1px solid var(--line); border-radius: var(--radius); padding: 1.2rem 1.3rem; margin-bottom: .9rem; box-shadow: var(--shadow-sm); }
.ragg__sec h3 { font-size: 1.05rem; margin: 0 0 .7rem; color: var(--lv-deep-teal); }

/* -------------------------------------------------------------- Library */
.library { margin-top: 2rem; }
.library__head { margin-bottom: 1.2rem; }
.library__controls { display: flex; flex-wrap: wrap; gap: 1rem; align-items: center; justify-content: space-between; margin-bottom: 1.4rem; }
.library__controls .search-box { margin: 0; flex: 1; min-width: 220px; }
.library__filters { display: flex; flex-wrap: wrap; gap: .5rem; }
.lib-chip { font: inherit; font-size: .88rem; font-weight: 600; padding: .45rem .9rem; border-radius: 999px; border: 1.5px solid var(--line); background: var(--surface); color: var(--ink-soft); cursor: pointer; transition: all .15s; }
.lib-chip:hover { border-color: var(--lv-muted-green); }
.lib-chip.is-active { background: var(--lv-teal); color: #fff; border-color: var(--lv-teal); }
.library__grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(250px, 1fr)); gap: 1rem; }
.lib-card { background: var(--surface); border: 1px solid var(--line); border-radius: var(--radius); padding: 1.1rem; box-shadow: var(--shadow-sm); transition: transform .15s, box-shadow .2s; }
.lib-card:hover { transform: translateY(-2px); box-shadow: var(--shadow-md); }
.lib-card__top { display: flex; align-items: center; justify-content: space-between; gap: .5rem; }
.lib-card__name { font-size: 1.1rem; margin: 0; color: var(--lv-deep-teal); }
.lib-card__energy { font-size: .72rem; font-weight: 700; padding: .2rem .55rem; border-radius: 999px; text-transform: uppercase; letter-spacing: .03em; }
.lib-card__energy--heating { background: rgba(217,154,40,.18); color: #875c12; }
.lib-card__energy--cooling { background: rgba(14,74,69,.12); color: var(--lv-deep-teal); }
.lib-card__energy--neutral { background: rgba(168,184,138,.22); color: #4b5a30; }
.lib-card__sanskrit { font-style: italic; color: var(--ink-soft); font-size: .85rem; margin: .2rem 0; }
.lib-card__summary { font-size: .92rem; color: var(--ink-soft); margin: .5rem 0; }
.lib-card__taste { font-size: .82rem; color: var(--ink-soft); margin: .3rem 0 0; }
.library__empty { text-align: center; color: var(--ink-soft); padding: 2rem; }