/* ---- Self-hosted fonts. No third-party request is made by this page. ---- */
@font-face{font-family:'Inter';font-style:normal;font-weight:100 900;font-display:swap;src:url('fonts/inter-var.woff2') format('woff2')}
@font-face{font-family:'Fraunces';font-style:normal;font-weight:100 900;font-display:swap;src:url('fonts/fraunces-var.woff2') format('woff2')}
@font-face{font-family:'Fraunces';font-style:italic;font-weight:100 900;font-display:swap;src:url('fonts/fraunces-var-italic.woff2') format('woff2')}

/* ASHA PATH — public site.
   Every colour below is the app's own, taken from AshaPath/DesignSystem/Palette.swift.
   Light values are the design source's :root; dark values are the app's night scheme.
   Nothing here is invented. */

:root{
  color-scheme: light dark;

  --ink:#2F5A39;      /* headings, primary text */
  --ink2:#3F5235;     /* body */
  --soft:#56684F;     /* quiet supporting text */
  --gold:#6E6139;     /* small uppercase labels */
  --sage:#436A59;     /* the calm accent */
  --warm:#BD5A21;     /* the lifeline accent */
  --caution:#9A5A3A;

  --sky-top:#E4EFCF;
  --sky-mid:#DCEBD2;
  --sky-bot:#CDE4D0;
  --dawn:rgba(251,231,190,1);
  --ground:#DCE8D3;
  --glow1:rgba(244,213,138,.50);
  --glow2:rgba(159,197,142,.50);
  --glow3:rgba(224,152,106,.35);

  --pane:rgba(255,255,255,.50);
  --pane-raised:rgba(255,255,255,.62);
  --hair:rgba(255,255,255,.70);
  --solid:#FFFFFF;
  --solid-border:#DCE6CF;

  --caution-tint:#FBEEE6;
  --caution-border:#E7C3AE;

  --shadow:0 1px 2px rgba(47,90,57,.05), 0 8px 28px rgba(47,90,57,.07);

  --measure:34rem;
  --gutter:clamp(20px, 5vw, 40px);
}

@media (prefers-color-scheme: dark){
  :root:not([data-theme="light"]){
    --ink:#DCE9D4; --ink2:#C1D5B8; --soft:#9BAF93; --gold:#C7B27A;
    --sage:#7FB49B; --warm:#E9A272; --caution:#E0A585;
    --sky-top:#16241C; --sky-mid:#14201D; --sky-bot:#121C1B;
    --dawn:rgba(251,231,190,.16);
    --ground:rgba(182,208,164,.18);
    --glow1:rgba(244,213,138,.10);
    --glow2:rgba(159,197,142,.10);
    --glow3:rgba(224,152,106,.08);
    --pane:rgba(255,255,255,.07);
    --pane-raised:rgba(255,255,255,.10);
    --hair:rgba(255,255,255,.12);
    --solid:#1E2C24;
    --solid-border:#2E3E33;
    --caution-tint:#2C221D;
    --caution-border:#4A382C;
    --shadow:0 1px 2px rgba(0,0,0,.25), 0 10px 30px rgba(0,0,0,.28);
  }
}
:root[data-theme="dark"]{
  --ink:#DCE9D4; --ink2:#C1D5B8; --soft:#9BAF93; --gold:#C7B27A;
  --sage:#7FB49B; --warm:#E9A272; --caution:#E0A585;
  --sky-top:#16241C; --sky-mid:#14201D; --sky-bot:#121C1B;
  --dawn:rgba(251,231,190,.16);
  --ground:rgba(182,208,164,.18);
  --glow1:rgba(244,213,138,.10);
  --glow2:rgba(159,197,142,.10);
  --glow3:rgba(224,152,106,.08);
  --pane:rgba(255,255,255,.07);
  --pane-raised:rgba(255,255,255,.10);
  --hair:rgba(255,255,255,.12);
  --solid:#1E2C24;
  --solid-border:#2E3E33;
  --caution-tint:#2C221D;
  --caution-border:#4A382C;
  --shadow:0 1px 2px rgba(0,0,0,.25), 0 10px 30px rgba(0,0,0,.28);
}

*{margin:0;padding:0;box-sizing:border-box}

body{
  font-family:'Inter',-apple-system,BlinkMacSystemFont,'Segoe UI',system-ui,sans-serif;
  color:var(--ink2);
  background:var(--sky-mid);
  line-height:1.65;
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
  overflow-x:hidden;
}

/* The sky. Source: the app's `.sky` — a warm dawn radial over the top, a green
   radial rising from below the fold, over a three-stop vertical gradient. */
.sky{
  position:fixed; inset:0; z-index:-2; pointer-events:none;
  background:
    radial-gradient(120% 62% at 50% -12%, var(--dawn) 0%, rgba(251,231,190,0) 52%),
    radial-gradient(150% 46% at 50% 108%, var(--ground) 0%, rgba(220,232,211,0) 60%),
    linear-gradient(180deg, var(--sky-top) 0%, var(--sky-mid) 52%, var(--sky-bot) 100%);
}
.glow{position:fixed;inset:0;z-index:-1;pointer-events:none;overflow:hidden}
.glow i{
  position:absolute; display:block; border-radius:50%; filter:blur(46px);
  animation:drift 34s ease-in-out infinite alternate;
}
.glow i:nth-child(1){width:min(46vw,420px);aspect-ratio:1;left:-8%;top:6%;background:var(--glow1)}
.glow i:nth-child(2){width:min(40vw,360px);aspect-ratio:1;right:-6%;top:38%;background:var(--glow2);animation-duration:44s;animation-delay:-9s}
.glow i:nth-child(3){width:min(34vw,300px);aspect-ratio:1;left:14%;bottom:4%;background:var(--glow3);animation-duration:52s;animation-delay:-20s}
@keyframes drift{from{transform:translate3d(0,0,0)}to{transform:translate3d(2.5rem,-2rem,0)}}
@media (prefers-reduced-motion: reduce){ .glow i{animation:none} }

.wrap{width:100%;max-width:62rem;margin-inline:auto;padding-inline:var(--gutter)}
.narrow{max-width:var(--measure)}

h1,h2,h3{
  font-family:'Fraunces',Georgia,'Times New Roman',serif;
  font-weight:500; color:var(--ink); line-height:1.16;
  text-wrap:balance; font-optical-sizing:auto;
}
p{max-width:var(--measure)}
a{color:var(--sage)}
a:focus-visible,button:focus-visible{outline:2px solid var(--sage);outline-offset:3px;border-radius:4px}

.kick{
  font-size:.72rem; letter-spacing:.18em; text-transform:uppercase;
  color:var(--gold); font-weight:600; margin-bottom:.55rem;
}

/* ── masthead ─────────────────────────────────────────── */
.top{
  display:flex; align-items:center; justify-content:space-between;
  flex-wrap:wrap; gap:.6rem 1rem;
  padding-block:1.4rem 0;
}
.brand{display:flex;align-items:center;gap:.6rem;text-decoration:none}
.brand svg{width:30px;height:30px;flex:none}
.brand span{
  font-family:'Fraunces',Georgia,serif; font-size:1.05rem; font-weight:600;
  letter-spacing:.08em; color:var(--ink);
}
.top nav{display:flex;flex-wrap:wrap;gap:.5rem 1.1rem;font-size:.86rem}
@media (max-width:420px){ .top nav{gap:.4rem .85rem;font-size:.8rem} }
.top nav a{color:var(--soft);text-decoration:none}
.top nav a:hover{color:var(--sage)}

/* ── hero ─────────────────────────────────────────────── */
.hero{padding-block:clamp(3rem,9vw,5.5rem) clamp(2.5rem,7vw,4rem)}
.hero .sun{
  width:72px;height:72px;border-radius:50%;margin-bottom:1.6rem;
  background:radial-gradient(circle at 50% 40%,#FCEBBE,#E9C77A 58%,#CBA75E);
  box-shadow:0 0 44px rgba(233,199,115,.45);
}
.hero h1{
  font-size:clamp(2.6rem,7.5vw,4.1rem); letter-spacing:.005em; margin-bottom:.45rem;
}
.hero .lead{
  font-family:'Fraunces',Georgia,serif; font-style:italic; font-weight:400;
  font-size:clamp(1.15rem,2.6vw,1.45rem); color:var(--sage); margin-bottom:1.1rem;
}
.hero p.body{font-size:1.04rem}
.badge{
  display:inline-flex;align-items:center;gap:.55rem;margin-top:1.6rem;
  font-size:.83rem;color:var(--soft);background:var(--pane-raised);
  border:1px solid var(--hair);border-radius:999px;padding:.55rem 1.05rem;
  backdrop-filter:blur(8px);
}
.badge b{color:var(--ink);font-weight:600}

/* ── sections ─────────────────────────────────────────── */
section{padding-block:clamp(2.6rem,6vw,4rem)}
section h2{font-size:clamp(1.5rem,3.4vw,2rem);margin-bottom:.6rem}
.lede{font-size:1.03rem}

.rule{height:1px;background:var(--hair);border:0}

/* ── the screens ──────────────────────────────────────── */
.screens{display:flex;flex-direction:column;gap:clamp(3rem,7vw,5rem);margin-top:2.6rem}
.screen{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.05fr);gap:clamp(1.5rem,4vw,3.2rem);align-items:center}
.screen:nth-child(even) .shot{order:2}
.screen h3{font-size:1.28rem;margin-bottom:.5rem}
.screen p{font-size:.97rem;color:var(--ink2)}
.shot{margin:0;display:flex;justify-content:center}
.shot img{
  display:block;width:100%;max-width:278px;height:auto;
  border-radius:26px;border:1px solid var(--hair);
  box-shadow:var(--shadow);
}
@media (max-width:760px){
  .screen{grid-template-columns:1fr;gap:1.4rem}
  .screen:nth-child(even) .shot{order:0}
  .shot img{max-width:236px}
}

/* ── the stages ───────────────────────────────────────── */
.stages{
  display:flex;flex-wrap:wrap;gap:.5rem;margin-top:1.5rem;padding:0;list-style:none;
}
.stages li{
  display:flex;align-items:baseline;gap:.5rem;
  background:var(--pane);border:1px solid var(--hair);border-radius:12px;
  padding:.5rem .85rem;font-size:.93rem;color:var(--ink2);
}
.stages li b{
  font-family:'Fraunces',Georgia,serif;font-weight:600;color:var(--sage);
  font-size:.82rem;font-variant-numeric:tabular-nums;
}

/* ── panes ────────────────────────────────────────────── */
.pane{
  background:var(--pane);border:1px solid var(--hair);border-radius:20px;
  padding:clamp(1.3rem,3.5vw,1.9rem);backdrop-filter:blur(10px);
}
.safebox{
  background:var(--caution-tint);border:1px solid var(--caution-border);
  border-radius:20px;padding:clamp(1.3rem,3.5vw,1.9rem);
}
.safebox h2{color:var(--ink)}
.safebox .kick{color:var(--caution)}
.crisis{
  margin-top:1.1rem;padding-top:1rem;border-top:1px solid var(--caution-border);
  font-size:.92rem;color:var(--ink2);
}
.crisis b{color:var(--caution)}

.twocol{display:grid;grid-template-columns:repeat(auto-fit,minmax(15rem,1fr));gap:1rem;margin-top:1.6rem}
.twocol .pane h3{font-size:1.05rem;margin-bottom:.35rem}
.twocol .pane p{font-size:.92rem;color:var(--soft)}

/* ── footer ───────────────────────────────────────────── */
footer{padding-block:2.8rem 3.6rem;border-top:1px solid var(--hair);margin-top:2rem}
footer p{font-size:.86rem;color:var(--soft);max-width:none}
footer .serif{
  font-family:'Fraunces',Georgia,serif;font-style:italic;
  font-size:1rem;color:var(--ink);margin-bottom:.9rem;
}
footer nav{display:flex;gap:1.1rem;margin-block:.7rem}
footer nav a{color:var(--sage);text-decoration:none;font-size:.88rem}

/* ── inner pages (privacy, support) ───────────────────── */
.doc{padding-block:2.2rem 1rem;max-width:44rem}
.doc h1{font-size:clamp(1.9rem,5vw,2.5rem);margin-bottom:.35rem}
.doc h2{font-size:1.18rem;margin:2rem 0 .5rem}
.doc p,.doc li{font-size:.97rem}
.doc p{margin-bottom:.75rem}
.doc ul{margin:0 0 .85rem 1.3rem}
.doc li{margin-bottom:.35rem}
.doc .meta{color:var(--soft);font-size:.86rem;margin-bottom:1.6rem}
.doc .q{
  font-family:'Fraunces',Georgia,serif;color:var(--ink);font-size:1.05rem;
  margin:1.6rem 0 .25rem;
}
.back{
  display:inline-block;margin-block:1.4rem .6rem;color:var(--sage);
  text-decoration:none;font-size:.88rem;
}

/* ── the landing page ─────────────────────────────────── */
.mark{
  width:58px;height:58px;display:block;margin-block:1.8rem 1.2rem;
  border-radius:15px;box-shadow:0 2px 10px rgba(47,90,57,.10);
}
.pane.card{
  display:block;text-decoration:none;color:inherit;
  transition:border-color .18s ease, transform .18s ease;
}
.pane.card h3{color:var(--sage)}
.pane.card:hover{border-color:var(--sage);transform:translateY(-1px)}
@media (prefers-reduced-motion:reduce){.pane.card{transition:none}.pane.card:hover{transform:none}}