
:root{--navy:#0B2D5B;--navy2:#153D70;--teal:#35B7C9;--tealsoft:#D9F5F8;--ink:#243244;--muted:#64748B;--line:#E3E8EF;--soft:#F7FAFC}
*{box-sizing:border-box}body{margin:0;font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Arial,sans-serif;color:var(--ink);line-height:1.6}a{color:var(--navy)}
.site-header{position:sticky;top:0;z-index:20;background:rgba(11,45,91,.97);color:white;box-shadow:0 8px 24px rgba(11,45,91,.12)}
.nav{max-width:1120px;margin:auto;padding:14px 24px;display:flex;align-items:center;justify-content:space-between;gap:24px}
.brand{display:flex;align-items:center;gap:12px;color:white;text-decoration:none;font-weight:800}.brand img{width:44px;height:44px;object-fit:contain}
.nav-links{display:flex;gap:18px;flex-wrap:wrap}.nav-links a{color:white;text-decoration:none;font-weight:700}
.hero{background:radial-gradient(circle at 84% 18%,rgba(53,183,201,.34),transparent 28%),linear-gradient(135deg,var(--navy),var(--navy2));color:white;padding:94px 24px 104px}
.hero-inner{max-width:1120px;margin:auto;display:grid;grid-template-columns:1.25fr .75fr;gap:56px;align-items:center}
.badge{display:inline-block;background:rgba(217,245,248,.12);color:#D9F5F8;border:1px solid rgba(217,245,248,.28);border-radius:999px;padding:7px 12px;text-transform:uppercase;letter-spacing:.1em;font-size:.77rem;font-weight:800;margin-bottom:16px}
h1{font-size:clamp(2.8rem,7vw,5.2rem);line-height:1.02;margin:0 0 18px}.hero h2{font-size:clamp(1.4rem,3vw,2.1rem);line-height:1.24;margin:0 0 18px;color:#D9F5F8}.hero p{font-size:1.14rem;color:#E7F6F8}
.availability{margin-top:18px;font-weight:800;color:#BFEAF0}.hero-logo-card{width:min(340px,100%);aspect-ratio:1;background:white;border-radius:34px;padding:36px;box-shadow:0 24px 70px rgba(0,0,0,.18)}.hero-logo-card img{width:100%;height:100%;object-fit:contain}
.button-row{display:flex;gap:12px;flex-wrap:wrap;margin-top:28px}.button{display:inline-block;border-radius:14px;padding:13px 19px;text-decoration:none;font-weight:800;border:1px solid transparent}.button-primary{background:var(--teal);color:#062B36}.button-secondary{color:white;border-color:rgba(255,255,255,.45)}.button-muted{background:rgba(255,255,255,.1);color:white;border-color:rgba(255,255,255,.25)}
main{max-width:1120px;margin:auto;padding:68px 24px 82px}.section{margin-bottom:72px}.section-title{color:var(--navy);font-size:clamp(2rem,4vw,2.8rem);margin:0 0 12px}.lead{color:var(--muted);max-width:850px;font-size:1.08rem}
.cards{display:grid;grid-template-columns:repeat(4,1fr);gap:18px;margin-top:30px}.card,.about-panel,.legal-main section{background:var(--soft);border:1px solid var(--line);border-radius:20px;padding:22px}.icon{width:46px;height:46px;border-radius:14px;background:var(--tealsoft);display:flex;align-items:center;justify-content:center;font-weight:900;margin-bottom:14px}.card h3,.about-panel h3,.legal-main h2{color:var(--navy);margin-top:0}
.about-grid{display:grid;grid-template-columns:1fr 1fr;gap:22px}.notice{margin-top:28px;border-left:5px solid var(--teal);background:#EEF9FA;padding:20px 22px;border-radius:14px}
.support-card{background:linear-gradient(135deg,#F7FAFC,#EEF9FA);border:1px solid var(--line);border-radius:24px;padding:30px;display:flex;justify-content:space-between;gap:24px;align-items:center}
.legal-header{background:linear-gradient(135deg,var(--navy),var(--navy2));color:white;padding:58px 24px}.legal-header .inner,.legal-main{max-width:920px;margin:auto}.legal-header h1{font-size:clamp(2.4rem,6vw,3.8rem);margin-bottom:8px}.legal-main section{margin-bottom:14px}
footer{border-top:1px solid var(--line);background:var(--soft)}.footer-inner{max-width:1120px;margin:auto;padding:28px 24px;color:var(--muted);text-align:center}.footer-links{margin-top:8px}.footer-inner a{text-decoration:none;font-weight:700}
@media(max-width:900px){.hero-inner{grid-template-columns:1fr}.hero-logo-card{width:240px}.cards{grid-template-columns:repeat(2,1fr)}.about-grid{grid-template-columns:1fr}}
@media(max-width:680px){.nav{align-items:flex-start;flex-direction:column}.cards{grid-template-columns:1fr}.support-card{flex-direction:column;align-items:flex-start}.hero{padding-top:66px}}
