/* Bhu-Mithra landing page.
   Concept: paddy field rolling into cleared soil; the hero shows the one document that matters —
   a land-tax record where "nilam" is struck through and a "purayidam" seal lands on it. */
:root{
  --h-deep:#0b4a1c; --h-paddy:#5fa31b; --h-leaf:#8cc63f; --h-soil:#8a4614; --h-clay:#c4691c; --h-sun:#e9a116;
  --h-paper:#fffdf6; --h-ink:#1d2a1f; --h-bg:#f2f6ef; --h-card:#ffffff; --h-line:#dce5d6; --h-muted:#55665a;
  --h-red:#b3261e;
}
@media (prefers-color-scheme:dark){:root{
  --h-deep:#0e2b16; --h-paddy:#3f7d1a; --h-leaf:#9fd65a; --h-soil:#a35a1f; --h-clay:#d98636; --h-sun:#f2b544;
  --h-paper:#f7f1e1; --h-ink:#1d2a1f; --h-bg:#0f1611; --h-card:#17211a; --h-line:#2a382d; --h-muted:#9aab9c; --h-red:#e5534b;
}}
body.is-home{background:var(--h-bg)}
body.is-home main.bleed{padding-block:0 0}
body.is-home .top{background:color-mix(in srgb,var(--surface) 88%,transparent);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px)}

/* shared bits */
.h-sec{padding-block:clamp(48px,8vw,96px)}
.h-kicker{font-size:.8rem;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--h-soil);margin:0 0 10px}
.h-kicker.light{color:var(--h-sun)}
.h-title{font-family:var(--display);font-size:clamp(1.7rem,4vw,2.6rem);line-height:1.15;color:var(--green);margin:0 0 22px;max-width:22ch;text-wrap:balance}
.h-body{font-size:1.05rem;color:var(--muted);max-width:58ch}
.h-btn{display:inline-flex;align-items:center;gap:8px;border-radius:999px;padding:14px 26px;font-weight:700;font-size:1rem;text-decoration:none;border:0;cursor:pointer;transition:transform .15s ease,box-shadow .15s ease}
.h-btn:hover{transform:translateY(-1px)}
.h-btn-main{background:var(--h-deep);color:#fff;box-shadow:0 10px 24px -10px color-mix(in srgb,var(--h-deep) 70%,transparent)}
.h-btn-ghost{background:color-mix(in srgb,#fff 70%,transparent);color:var(--h-deep);border:1.5px solid color-mix(in srgb,var(--h-deep) 25%,transparent)}
.h-btn-line{background:transparent;color:var(--green);border:1.5px solid var(--green)}
.h-btn-sun{background:var(--h-sun);color:#2a1a05;box-shadow:0 12px 28px -12px var(--h-sun)}
.h-cta{display:flex;flex-wrap:wrap;gap:12px;margin-top:26px}
.h-split{display:grid;grid-template-columns:1fr 1fr;gap:clamp(28px,5vw,64px);align-items:center}

/* ---------- hero ---------- */
.h-hero{position:relative;overflow:hidden;padding-block:clamp(40px,7vw,84px) clamp(150px,18vw,230px);
  background:
    radial-gradient(60% 70% at 92% 0%,color-mix(in srgb,var(--h-sun) 28%,transparent),transparent 70%),
    radial-gradient(50% 60% at 0% 20%,color-mix(in srgb,var(--h-leaf) 22%,transparent),transparent 70%),
    var(--h-bg)}
.h-field{position:absolute;left:0;right:0;bottom:0;width:100%;height:clamp(140px,20vw,260px)}
.h-hero-in{position:relative;display:grid;grid-template-columns:1.15fr .85fr;gap:clamp(28px,5vw,64px);align-items:center}
.h-eyebrow{display:inline-flex;align-items:center;gap:8px;background:var(--h-card);border:1px solid var(--h-line);border-radius:999px;padding:6px 14px;font-weight:600;font-size:.88rem;color:var(--green);margin:0 0 18px}
.h-eyebrow .dot{width:8px;height:8px;border-radius:50%;background:var(--h-paddy);box-shadow:0 0 0 4px color-mix(in srgb,var(--h-paddy) 25%,transparent)}
.h-hero h1{font-family:var(--display);font-weight:800;font-size:clamp(2.3rem,6.2vw,4.3rem);line-height:1.08;color:var(--green);margin:0;text-wrap:balance}
.h-hero h1 em{font-style:normal;color:var(--h-soil);position:relative;white-space:nowrap}
.h-hero h1 em::after{content:"";position:absolute;left:0;right:0;bottom:.06em;height:.18em;background:color-mix(in srgb,var(--h-sun) 55%,transparent);z-index:-1;border-radius:4px}
.h-lead{font-size:clamp(1rem,1.6vw,1.15rem);color:var(--muted);margin-top:18px;max-width:54ch}
.h-proof{list-style:none;padding:0;margin:26px 0 0;display:flex;gap:22px;flex-wrap:wrap;color:var(--muted);font-size:.92rem}
.h-proof b{font-family:var(--display);font-size:1.4rem;color:var(--h-soil);margin-right:4px}

/* the land record */
.h-record{margin:0;justify-self:center;width:min(380px,100%)}
.rec-paper{position:relative;background:var(--h-paper);color:var(--h-ink);border-radius:6px;padding:22px 22px 18px;
  box-shadow:0 1px 0 #e9e2cc,0 30px 60px -28px rgba(30,40,20,.45),0 10px 20px -12px rgba(30,40,20,.25);
  transform:rotate(-2.5deg);
  background-image:repeating-linear-gradient(0deg,transparent 0 31px,#ece4cd 31px 32px)}
.rec-paper::before{content:"";position:absolute;inset:8px;border:1px solid #e1d7bb;border-radius:3px;pointer-events:none}
.rec-head{display:flex;justify-content:space-between;align-items:center;gap:8px;font-weight:700;font-size:.82rem;letter-spacing:.04em;color:#6b5a2e;border-bottom:2px solid #6b5a2e;padding-bottom:8px}
.rec-tag{font-size:.68rem;font-weight:700;border:1px solid #b9a67a;border-radius:4px;padding:1px 6px;color:#8a7746}
.rec-paper dl{margin:10px 0 0}
.rec-paper dl>div{display:grid;grid-template-columns:44% 1fr;gap:8px;padding:6px 0;border-bottom:1px dashed #d8cdab;font-size:.92rem}
.rec-paper dt{color:#7a6c4a}
.rec-paper dd{margin:0;font-weight:600}
.mono{font-variant-numeric:tabular-nums;letter-spacing:.02em}
.rec-type dd{display:flex;gap:10px;align-items:baseline;flex-wrap:wrap}
.rec-type s{color:var(--h-red);text-decoration-thickness:2px}
.rec-new{color:#0b4a1c;font-family:var(--display);font-size:1.15rem}
.rec-foot{display:flex;justify-content:space-between;margin-top:12px;font-size:.78rem;color:#7a6c4a}
.rec-seal{position:absolute;right:-26px;bottom:-30px;width:120px;height:120px;color:#0b6b28;display:grid;place-items:center;
  transform:rotate(-14deg);animation:seal .7s cubic-bezier(.2,1.4,.4,1) .5s both;filter:drop-shadow(0 2px 0 rgba(255,255,255,.6))}
.rec-seal svg{position:absolute;inset:0;width:100%;height:100%}
.rec-seal span{font-family:var(--display);font-weight:800;font-size:1.05rem;line-height:1;text-align:center}
@keyframes seal{0%{transform:rotate(-14deg) scale(1.7);opacity:0}100%{transform:rotate(-14deg) scale(1);opacity:.92}}
.h-record figcaption{font-size:.8rem;color:var(--muted);text-align:center;margin-top:42px}

/* ---------- pains ---------- */
.h-pains{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}
.h-pain{background:var(--h-card);border:1px solid var(--h-line);border-radius:18px;padding:22px;transition:border-color .2s,transform .2s}
.h-pain:hover{border-color:var(--h-paddy);transform:translateY(-2px)}
.h-pain .ic{display:grid;place-items:center;width:48px;height:48px;border-radius:14px;background:color-mix(in srgb,var(--h-sun) 18%,var(--h-card));font-size:1.5rem;margin-bottom:14px}
.h-pain h3{font-family:var(--display);font-size:1.12rem;color:var(--green);margin:0 0 6px}
.h-pain p{color:var(--muted);font-size:.93rem;margin:0}

/* ---------- what ---------- */
.h-what{background:var(--h-card);border-block:1px solid var(--h-line)}
.chip-n,.chip-p{display:inline-block;border-radius:12px;padding:2px 14px}
.chip-n{background:color-mix(in srgb,var(--h-paddy) 18%,transparent);color:var(--green)}
.chip-p{background:color-mix(in srgb,var(--h-clay) 18%,transparent);color:var(--h-soil)}
.arrow-long{display:inline-block;width:56px;height:3px;vertical-align:middle;background:repeating-linear-gradient(90deg,var(--h-sun) 0 8px,transparent 8px 13px);position:relative}
.h-note{margin-top:18px;display:inline-block;background:color-mix(in srgb,var(--h-sun) 14%,transparent);border-radius:12px;padding:10px 14px;font-size:.93rem}
.h-docs{list-style:none;margin:0;padding:22px;border-radius:20px;background:var(--h-bg);border:1px dashed var(--h-line);display:grid;gap:10px}
.h-docs-head{font-family:var(--display);font-weight:700;color:var(--h-soil);font-size:1.05rem}
.h-docs li:not(.h-docs-head){display:flex;gap:12px;align-items:center;background:var(--h-card);border-radius:12px;padding:10px 14px;font-weight:600}
.tick{display:grid;place-items:center;width:26px;height:26px;border-radius:50%;background:var(--h-paddy);color:#fff;font-size:.8rem;flex:none}
.tick.vid{background:var(--h-clay)}

/* ---------- legacy ---------- */
.h-legacy{position:relative;color:#fff;padding-block:clamp(56px,8vw,100px);
  background:linear-gradient(160deg,var(--h-deep),color-mix(in srgb,var(--h-deep) 70%,var(--h-soil)));overflow:hidden}
.h-legacy::after{content:"";position:absolute;right:-120px;top:-120px;width:360px;height:360px;border-radius:50%;border:28px solid color-mix(in srgb,var(--h-sun) 35%,transparent);border-left-color:transparent;border-bottom-color:transparent;transform:rotate(20deg)}
.h-nums{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;position:relative;z-index:1}
.h-nums b{display:block;font-family:var(--display);font-weight:800;font-size:clamp(2.6rem,7vw,4.6rem);line-height:1;font-variant-numeric:tabular-nums}
.h-nums b i{font-style:normal;color:var(--h-sun)}
.h-nums span{display:block;margin-top:6px;opacity:.85}
.h-split-bar{display:flex;height:14px;border-radius:999px;overflow:hidden;margin-top:34px;background:rgba(255,255,255,.12);position:relative;z-index:1}
.h-split-bar .won{width:50%;background:var(--h-leaf)}
.h-split-bar .on{width:50%;background:var(--h-sun)}
.h-bar-legend{display:flex;gap:22px;flex-wrap:wrap;margin-top:10px;font-size:.88rem;opacity:.9}
.h-bar-legend i{display:inline-block;width:10px;height:10px;border-radius:3px;margin-right:6px}
.h-bar-legend i.won{background:var(--h-leaf)} .h-bar-legend i.on{background:var(--h-sun)}
.h-legacy-p{max-width:60ch;margin-top:24px;opacity:.9;position:relative;z-index:1}

/* ---------- steps (a real sequence) ---------- */
.h-steps{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(4,1fr);gap:18px;position:relative}
.h-steps::before{content:"";position:absolute;top:26px;left:26px;right:26px;height:3px;background:repeating-linear-gradient(90deg,var(--h-paddy) 0 10px,transparent 10px 16px)}
.h-steps li{position:relative}
.h-steps .n{position:relative;z-index:1;display:grid;place-items:center;width:54px;height:54px;border-radius:50%;background:var(--h-deep);color:#fff;font-family:var(--display);font-weight:800;font-size:1.3rem;box-shadow:0 0 0 6px var(--h-bg)}
.h-steps li:last-child .n{background:var(--h-sun);color:#2a1a05}
.h-steps h3{font-family:var(--display);color:var(--green);font-size:1.15rem;margin:16px 0 6px}
.h-steps p{color:var(--muted);margin:0;font-size:.95rem}

/* ---------- app ---------- */
.h-app{background:linear-gradient(180deg,var(--h-bg),color-mix(in srgb,var(--h-leaf) 12%,var(--h-bg)))}
.h-phone{justify-self:center;width:min(290px,100%);aspect-ratio:9/18;max-width:100%;border-radius:38px;background:#111;padding:12px;box-shadow:0 40px 70px -30px rgba(10,40,20,.55)}
.ph-screen{height:100%;border-radius:28px;background:#f4f8f1;padding:18px 14px;display:flex;flex-direction:column;gap:10px;overflow:hidden;color:#17251a;font-size:.82rem}
.ph-top{display:flex;gap:10px;align-items:center}
.ph-top b{display:block;font-family:var(--display);color:#0d5a20}
.ph-top small{color:#5b6b5e}
.ph-msg{max-width:85%;padding:8px 11px;border-radius:14px;line-height:1.45}
.ph-msg.ai{background:#fff;border:1px solid #dbe3d7}
.ph-msg.me{align-self:flex-end;background:#0d5a20;color:#fff}
.ph-joined{display:flex;gap:10px;align-items:center;background:#fff;border:1.5px solid #1f7a35;border-radius:14px;padding:8px 10px;margin-top:auto}
.ph-joined .av{width:34px;height:34px;border-radius:50%;background:#8a4614;color:#fff;display:grid;place-items:center;font-weight:800}
.ph-joined b{display:block}.ph-joined small{color:#1f7a35;font-weight:700}
.ph-track{display:flex;gap:4px}
.ph-track span{flex:1;height:6px;border-radius:3px;background:#dbe3d7}
.ph-track .done{background:#1f7a35}.ph-track .now{background:#e39a12}
.ph-st{color:#8a4614;font-weight:700}
.h-feats{list-style:none;margin:0;padding:0;display:grid;gap:14px}
.h-feats li{display:grid;gap:2px;padding-left:14px;border-left:3px solid var(--h-paddy)}
.h-feats b{font-size:1.02rem}
.h-feats span{color:var(--muted);font-size:.94rem}

/* ---------- faq ---------- */
.h-faq-wrap{display:grid;grid-template-columns:.8fr 1.2fr;gap:clamp(24px,5vw,64px);align-items:start}
.h-faq{display:grid;gap:10px}
.h-faq details{background:var(--h-card);border:1px solid var(--h-line);border-radius:14px;padding:4px 18px}
.h-faq details[open]{border-color:var(--h-paddy)}
.h-faq summary{list-style:none;cursor:pointer;font-weight:700;padding:14px 28px 14px 0;position:relative}
.h-faq summary::-webkit-details-marker{display:none}
.h-faq summary::after{content:"+";position:absolute;right:0;top:10px;font-size:1.4rem;color:var(--h-soil);transition:transform .2s}
.h-faq details[open] summary::after{transform:rotate(45deg)}
.h-faq p{margin:0 0 16px;color:var(--muted)}

/* ---------- final ---------- */
.h-final{background:var(--h-soil);background:linear-gradient(135deg,var(--h-soil),var(--h-clay));color:#fff;overflow:hidden}
.h-final-in{position:relative;text-align:center;padding-block:clamp(56px,8vw,96px)}
.h-final .sun{position:absolute;left:50%;top:-140px;width:280px;height:280px;margin-left:-140px;border-radius:50%;background:radial-gradient(circle,color-mix(in srgb,var(--h-sun) 70%,transparent),transparent 70%);opacity:.6}
.h-final h2{position:relative;font-family:var(--display);font-size:clamp(1.8rem,4.5vw,2.8rem);margin:0 auto 10px;max-width:24ch;text-wrap:balance}
.h-final p{position:relative;opacity:.9;max-width:52ch;margin:0 auto 26px}
.h-final .h-btn{position:relative}

/* ---------- responsive ---------- */
@media (max-width:980px){
  .h-pains{grid-template-columns:1fr 1fr}
  .h-steps{grid-template-columns:1fr 1fr;row-gap:30px}
  .h-steps::before{display:none}
}
@media (max-width:820px){
  .h-hero-in,.h-split,.h-faq-wrap{grid-template-columns:1fr}
  .h-record{margin-top:10px;width:min(340px,92%)}
  .h-phone{order:2;width:min(250px,80%)}
}
@media (max-width:520px){
  .h-pains,.h-steps{grid-template-columns:1fr}
  .h-nums{grid-template-columns:1fr;gap:18px}
  .h-btn{width:100%;justify-content:center}
  .rec-seal{right:-10px;width:100px;height:100px}
  .h-hero h1 em{white-space:normal}
}
@media (prefers-reduced-motion:reduce){.rec-seal{animation:none}.h-btn,.h-pain{transition:none}}
.h-hero h1{position:relative;isolation:isolate}
.h-final h2{color:#fff}
@media (prefers-color-scheme:dark){
  .h-btn-main{background:var(--h-leaf);color:#0f1611}
  .h-btn-ghost{background:transparent;color:var(--fg);border-color:var(--h-line)}
  .h-steps .n{background:var(--h-paddy)}
}
@media (max-width:520px){
  .h-pains{grid-template-columns:1fr 1fr;gap:10px}
  .h-pain{padding:14px}
  .h-pain .ic{width:40px;height:40px;font-size:1.25rem;margin-bottom:10px}
  .h-pain h3{font-size:1rem}
  .h-pain p{font-size:.85rem}
}

/* ---------- guide page ---------- */
.h-more{font-weight:700;color:var(--h-soil);text-decoration:none}
.g-hero{padding-block:clamp(36px,6vw,72px) clamp(28px,4vw,48px);background:radial-gradient(60% 80% at 100% 0%,color-mix(in srgb,var(--h-sun) 22%,transparent),transparent 70%),var(--h-bg);border-bottom:1px solid var(--h-line)}
.g-hero h1{font-family:var(--display);font-weight:800;font-size:clamp(2rem,5vw,3.2rem);line-height:1.12;color:var(--green);margin:8px 0 0;max-width:24ch;text-wrap:balance}
.g-crumb{font-size:.85rem;color:var(--muted)}
.g-crumb a{color:var(--h-soil)}
.g-body{display:grid;grid-template-columns:240px minmax(0,1fr);gap:clamp(24px,5vw,56px);padding-block:clamp(28px,5vw,56px)}
.g-toc{position:sticky;top:calc(80px + env(safe-area-inset-top,0px));align-self:start;background:var(--h-card);border:1px solid var(--h-line);border-radius:14px;padding:16px;font-size:.9rem}
.g-toc ol{margin:8px 0 0;padding-left:18px;display:grid;gap:6px}
.g-toc a{color:var(--fg);text-decoration:none}
.g-toc a:hover{color:var(--green)}
.g-main{max-width:70ch}
.g-main section{margin:0 0 30px;scroll-margin-top:90px}
.g-main h2{font-family:var(--display);font-size:clamp(1.3rem,3vw,1.7rem);color:var(--green);margin:0 0 10px}
.g-main p{margin:0 0 10px;font-size:1.02rem;line-height:1.75}
.g-list{margin:0;padding-left:20px;display:grid;gap:6px;line-height:1.7}
.g-steps{list-style:none;counter-reset:s;margin:0;padding:0;display:grid;gap:10px}
.g-steps li{counter-increment:s;display:flex;gap:12px;align-items:center;background:var(--h-card);border:1px solid var(--h-line);border-radius:12px;padding:10px 14px;font-weight:600}
.g-steps li::before{content:counter(s);display:grid;place-items:center;flex:none;width:32px;height:32px;border-radius:50%;background:var(--h-deep);color:#fff;font-family:var(--display)}
.g-districts{display:flex;flex-wrap:wrap;gap:8px}
.g-districts span{background:var(--h-card);border:1px solid var(--h-line);border-radius:999px;padding:4px 12px;font-size:.88rem}
.footnav{display:flex;gap:6px}
@media (max-width:820px){.g-body{grid-template-columns:1fr}.g-toc{position:static}}
@media (prefers-color-scheme:dark){.g-steps li::before{background:var(--h-paddy)}}
