/* lhcviet.com — one brand green (logo #008854) on a survey-grid ground */
:root{
 --bg:#f6f8f6; --surface:#ffffff; --ink:#15211b; --muted:#56635c; --line:#d9e1dc;
 --brand:#007a4b; --brand-ink:#ffffff; --band:#0d3b2a; --band-ink:#e8f1ec; --tint:#eaf3ee;
 --display:"Literata",Georgia,"Times New Roman",serif;
 --body:"Be Vietnam Pro",system-ui,-apple-system,"Segoe UI",Arial,sans-serif;
 color-scheme:light;
}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]){
 --bg:#101713;--surface:#16201b;--ink:#e3ebe6;--muted:#9fb0a6;--line:#2a3830;--brand:#3fbf86;--brand-ink:#08130d;--band:#0a2a1e;--band-ink:#dcebe3;--tint:#14221b;color-scheme:dark}}
:root[data-theme="dark"]{--bg:#101713;--surface:#16201b;--ink:#e3ebe6;--muted:#9fb0a6;--line:#2a3830;--brand:#3fbf86;--brand-ink:#08130d;--band:#0a2a1e;--band-ink:#dcebe3;--tint:#14221b;color-scheme:dark}
*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
body{margin:0;background:var(--bg);color:var(--ink);font-family:var(--body);font-size:16px;line-height:1.65}
.wrap{max-width:1120px;margin:0 auto;padding-inline:16px}
@media (min-width:720px){.wrap{padding-inline:24px}}
a{color:var(--brand);text-underline-offset:3px}
a:focus-visible{outline:2px solid var(--brand);outline-offset:3px;border-radius:2px}
h1,h2,h3{font-family:var(--display);font-weight:600;line-height:1.25;text-wrap:balance;margin:0}
h3{font-size:1.08rem}
p,ul,ol,dl,dd{margin:0}
.skip{position:absolute;left:-9999px}.skip:focus{left:16px;top:8px;z-index:20;background:var(--surface);padding:8px 12px}

header.top{position:sticky;top:0;z-index:5;background:var(--surface);border-bottom:1px solid var(--line)}
header.top .wrap{display:flex;align-items:center;gap:8px 24px;min-height:64px;flex-wrap:wrap;padding-block:8px}
.brand{display:flex;color:var(--brand)}
.logo{height:30px;width:auto}
nav{display:flex;gap:4px 20px;flex-wrap:wrap;margin-left:auto}
nav a{color:var(--ink);text-decoration:none;font-size:.95rem;padding-block:6px;border-bottom:2px solid transparent}
nav a:hover{color:var(--brand)} nav a[aria-current]{border-bottom-color:var(--brand);color:var(--brand)}
.lang{font-size:.85rem;font-weight:600;text-decoration:none;border:1px solid var(--line);border-radius:6px;padding:5px 10px;color:var(--ink)}
.lang:hover{border-color:var(--brand);color:var(--brand)}
@media (max-width:640px){nav{order:3;width:100%;margin-left:0}.lang{margin-left:auto}}

.hero,.band{background:var(--band);color:var(--band-ink);
 background-image:linear-gradient(color-mix(in srgb,var(--band-ink) 7%,transparent) 1px,transparent 1px),linear-gradient(90deg,color-mix(in srgb,var(--band-ink) 7%,transparent) 1px,transparent 1px);
 background-size:48px 48px}
.hero .wrap{padding-block:72px 56px;display:grid;gap:24px}
.kicker{text-transform:uppercase;letter-spacing:.14em;font-size:.78rem;font-weight:600;color:var(--brand)}
.hero .kicker{color:color-mix(in srgb,var(--band-ink) 75%,transparent)}
.hero h1{font-size:clamp(2rem,5vw,3.4rem);max-width:18ch}
.pillars-line{font-size:1.1rem;color:color-mix(in srgb,var(--band-ink) 85%,transparent)}
.cta{display:flex;gap:12px;flex-wrap:wrap}
.btn{display:inline-block;background:var(--brand);color:var(--brand-ink);text-decoration:none;font-weight:600;padding:10px 18px;border-radius:6px;border:1px solid var(--brand)}
.btn.ghost{background:transparent;color:inherit;border-color:currentColor}
.hero .btn{background:#ffffff;color:#0d3b2a;border-color:#ffffff}.hero .btn.ghost{background:transparent;color:var(--band-ink);border-color:color-mix(in srgb,var(--band-ink) 60%,transparent)}
.stats{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,170px),1fr));gap:1px;background:color-mix(in srgb,var(--band-ink) 20%,transparent);border:1px solid color-mix(in srgb,var(--band-ink) 20%,transparent);margin-top:16px}
.stat{background:var(--band);padding:18px 16px}
.stat b{display:block;font-family:var(--display);font-size:2rem;font-variant-numeric:tabular-nums;line-height:1.1}
.stat p{font-size:.9rem;color:color-mix(in srgb,var(--band-ink) 80%,transparent)}

.phead{background:var(--surface);border-bottom:1px solid var(--line)}
.phead .wrap{padding-block:48px 40px;display:grid;gap:12px}
.phead h1{font-size:clamp(1.8rem,4vw,2.6rem)}

section{padding-block:64px;border-bottom:1px solid var(--line)}
section.tint{background:var(--tint)}
.band{border-bottom:0}.band .wrap{display:grid;gap:24px;justify-items:start}
.band .credo{border-left-color:color-mix(in srgb,var(--band-ink) 60%,transparent);max-width:60ch}
.band .btn{background:#ffffff;color:#0d3b2a;border-color:#ffffff}
.shead{display:grid;gap:8px;margin-bottom:28px;align-content:start}
.shead h2{font-size:clamp(1.5rem,3vw,2.1rem)}
.lede{max-width:68ch;color:var(--muted)}
.two{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,420px),1fr));gap:32px}
.two>*{min-width:0}
.prose{display:grid;gap:14px;max-width:68ch;align-content:start}
.more{font-weight:600}
.vm{display:grid;gap:8px}.vm h2{font-size:1.3rem}

.pillars{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,280px),1fr));gap:20px}
.pillar{background:var(--surface);border:1px solid var(--line);border-radius:8px;padding:22px;display:grid;gap:10px;align-content:start}
.pillar h3{font-size:1.3rem;color:var(--brand)}

.cards{list-style:none;padding:0;display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,300px),1fr));gap:12px}
.card{display:flex;gap:14px;align-items:baseline;height:100%;padding:18px 20px;background:var(--surface);border:1px solid var(--line);border-radius:8px;color:var(--ink);text-decoration:none}
.card:hover{border-color:var(--brand)}
.cards.compact{margin-top:12px}.cards.compact .card{padding:12px 14px;font-size:.95rem}
.scode{font-family:var(--display);font-size:1.4rem;color:var(--brand);min-width:1.1em}
.stitle{font-weight:600}

.values{list-style:none;padding:0;display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,190px),1fr));gap:20px}
.values li{border-top:2px solid var(--brand);padding-top:12px;display:grid;gap:4px;align-content:start}
.vnum{font-weight:600;font-size:.8rem;color:var(--brand);letter-spacing:.08em}

.svc .lbl,.lbl{text-transform:uppercase;letter-spacing:.1em;font-family:var(--body);font-size:.76rem;color:var(--muted);margin-bottom:12px}
.svc:nth-of-type(even){background:var(--tint)}
.caps{padding-left:1.1em;display:grid;gap:8px}.caps li::marker{color:var(--brand)}
.projs{list-style:none;padding:0;display:grid;gap:10px}
.proj{display:grid;grid-template-columns:auto 1fr;gap:2px 12px;padding:12px 14px;background:var(--surface);border:1px solid var(--line);border-radius:6px}
.pfund{grid-row:span 3;font-weight:600;font-size:.78rem;color:var(--brand);border:1px solid var(--brand);border-radius:4px;padding:2px 6px;align-self:start;max-width:9em}
.pname{font-weight:600}.pmeta{font-size:.88rem;color:var(--muted)}.pout{font-size:.92rem}

.groups{list-style:none;padding:0;display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,240px),1fr));gap:16px}
.groups li{padding:18px;border:1px solid var(--line);border-radius:8px;background:var(--surface);font-weight:500}
.fin{margin-top:28px}
.why{list-style:none;padding:0;display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,300px),1fr));gap:24px}
.why li{display:grid;gap:6px;align-content:start}.why p{color:var(--muted)}

.sub{font-size:1.2rem;margin-bottom:18px}
.princ{list-style:none;padding:0;display:grid;gap:18px;counter-reset:p}
.princ li{display:grid;gap:4px;padding-left:44px;position:relative;counter-increment:p}
.princ li::before{content:counter(p);position:absolute;left:0;top:0;width:30px;height:30px;border-radius:50%;background:var(--brand);color:var(--brand-ink);display:grid;place-items:center;font-weight:600;font-size:.9rem}
.steps{list-style:none;padding:0;display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,150px),1fr));gap:8px;counter-reset:s}
.steps li{counter-increment:s;background:var(--surface);border:1px solid var(--line);border-radius:6px;padding:14px;font-size:.92rem;font-weight:500}
.steps li::before{content:counter(s);display:block;font-family:var(--display);font-size:1.5rem;color:var(--brand)}

.contact{display:grid;grid-template-columns:max-content 1fr;gap:12px 24px;align-content:start}
.contact dt{color:var(--muted);font-size:.9rem;padding-top:2px}
@media (max-width:480px){.contact{grid-template-columns:1fr;gap:4px}.contact dd{margin-bottom:12px}}
.credo{font-family:var(--display);font-size:1.15rem;border-left:3px solid var(--brand);padding-left:16px}

footer{padding-block:32px;color:var(--muted);font-size:.88rem}
footer .wrap{display:flex;gap:16px 32px;flex-wrap:wrap;justify-content:space-between}
.fcol{display:grid;gap:4px;align-content:start}.fname{color:var(--ink);font-weight:600}
.fright{text-align:right}@media (max-width:640px){.fright{text-align:left}}
section[id]{scroll-margin-top:72px}
@media (max-width:640px){section[id]{scroll-margin-top:120px}.cards.compact{grid-template-columns:1fr 1fr;gap:8px}.cards.compact .card{gap:8px;font-size:.88rem;padding:10px}}
.prose.wide{max-width:72ch}
.hero .wrap.flush{padding-block:0}
.stmt{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,420px),1fr));gap:1px;background:color-mix(in srgb,var(--band-ink) 20%,transparent)}
.stmt>div{background:var(--band);padding:40px 28px;display:grid;gap:14px;align-content:start}
.stmt .kicker{color:color-mix(in srgb,var(--band-ink) 75%,transparent)}
.stmt .big{font-family:var(--display);font-size:clamp(1.15rem,2.2vw,1.45rem);line-height:1.5}
@media (max-width:640px){.stmt>div{padding:32px 4px}}
/* updates and links */
.wrap.narrow{max-width:780px}
.post{display:grid;gap:14px}
.post h2{font-size:1.3rem;margin-top:18px}
.post ul{padding-left:1.2em;display:grid;gap:6px}.post li::marker{color:var(--brand)}
.back{margin-top:32px;font-weight:600}
.plist{list-style:none;padding:0;display:grid;gap:12px;max-width:820px}
.pcard{display:grid;gap:6px;padding:20px 22px;background:var(--surface);border:1px solid var(--line);border-radius:8px;color:var(--ink);text-decoration:none}
.pcard:hover{border-color:var(--brand)}
.ptitle{font-family:var(--display);font-size:1.25rem;font-weight:600;line-height:1.3}
.psum{color:var(--muted)}
.empty{color:var(--muted)}
.links{list-style:none;padding:0;display:grid;gap:10px}
.links li{display:grid;gap:2px;padding:12px 14px;background:var(--surface);border:1px solid var(--line);border-radius:6px}
.links a{font-weight:600}
.host{font-size:.82rem;color:var(--muted)}
.vmrow{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,380px),1fr));gap:24px 48px;margin-bottom:40px}
.vmblk{display:grid;gap:8px;align-content:start}
.vmblk h3,.vmh{font-size:1.3rem;color:var(--brand)}
.vmh{margin-bottom:18px}
.fnav{display:grid;gap:4px;align-content:start}.fnav a{color:var(--muted)}.fnav a:hover{color:var(--brand)}
.fname2{color:var(--ink)}
@media (min-width:560px){
 .prose p,.post p,.post li,.vmblk p,.pillar p,.why p,.caps li,.princ p,.pout,.psum,.lede{text-align:justify;hyphens:auto}
}