:root{--navy:#0F1B33;--ink:#1c2740;--muted:#5b6784;--blue:#1565C0;--green:#2E7D32;--orange:#E65100;--purple:#6A1B9A;--cream:#F7F3EA;--card:#fff;--line:#e4dfd2}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{font-family:'Plus Jakarta Sans',system-ui,-apple-system,Segoe UI,Roboto,sans-serif;color:var(--ink);background:var(--cream);font-size:19px;line-height:1.6;-webkit-font-smoothing:antialiased}
a{color:var(--blue)}
.wrap{max-width:1080px;margin:0 auto;padding:0 24px}
header.top{display:flex;align-items:center;justify-content:space-between;padding:20px 0}
.brand{display:flex;align-items:center;gap:12px;font-weight:800;font-size:26px;color:var(--navy);text-decoration:none;letter-spacing:-.02em}
.brand img{width:44px;height:44px;border-radius:12px}
nav a{margin-left:22px;font-weight:700;color:var(--navy);text-decoration:none;font-size:17px}
nav a:hover{text-decoration:underline}
.hero{background:radial-gradient(1200px 700px at 80% 100%,#2750C4 0%,#13307F 45%,#0A1636 100%);color:#fff;border-radius:0 0 44px 44px;padding:20px 0 70px;position:relative;overflow:hidden}
.hero header.top .brand,.hero nav a{color:#fff}
.hero .grid{display:grid;grid-template-columns:1.1fr .9fr;gap:40px;align-items:center;margin-top:30px}
h1{font-size:clamp(40px,6.2vw,68px);line-height:1.03;letter-spacing:-.035em;font-weight:800}
.lead{font-size:clamp(20px,2.4vw,25px);color:#c9d6f7;margin:22px 0 30px;max-width:30ch}
.btn{display:inline-block;background:#fff;color:var(--navy);font-weight:800;padding:18px 30px;border-radius:999px;text-decoration:none;font-size:19px;box-shadow:0 12px 30px rgba(0,0,0,.3)}
.btn.alt{background:transparent;color:#fff;box-shadow:inset 0 0 0 2px rgba(255,255,255,.5);margin-left:10px}
.hero img.shot{width:100%;max-width:400px;border-radius:30px;display:block;margin:0 auto;box-shadow:0 40px 80px rgba(0,0,0,.45);transform:rotate(3deg)}
.pills{display:flex;flex-wrap:wrap;gap:10px;margin-top:26px}
.pill{background:rgba(255,255,255,.14);border:2px solid rgba(255,255,255,.3);padding:8px 18px;border-radius:999px;font-weight:700;font-size:16px}
section{padding:74px 0}
h2{font-size:clamp(32px,4.4vw,46px);letter-spacing:-.03em;line-height:1.08;font-weight:800;color:var(--navy);margin-bottom:14px}
.sub{color:var(--muted);font-size:21px;max-width:44ch}
.features{display:grid;grid-template-columns:repeat(auto-fit,minmax(290px,1fr));gap:22px;margin-top:38px}
.f{background:var(--card);border-radius:28px;padding:30px;box-shadow:0 10px 30px rgba(15,27,51,.07);border:1px solid var(--line)}
.f .dot{width:54px;height:54px;border-radius:16px;display:flex;align-items:center;justify-content:center;font-size:28px;margin-bottom:16px;color:#fff}
.f h3{font-size:23px;color:var(--navy);margin-bottom:6px;letter-spacing:-.02em}
.f p{color:var(--muted);font-size:18px}
.shots{display:flex;gap:22px;overflow-x:auto;padding:10px 24px 34px;scroll-snap-type:x mandatory;margin:30px -24px 0}
.shots img{height:560px;border-radius:26px;box-shadow:0 18px 44px rgba(15,27,51,.22);scroll-snap-align:center;flex:none}
.band{background:var(--navy);color:#fff;border-radius:44px;padding:60px 40px;margin:0 0}
.band h2{color:#fff}.band .sub{color:#b9c6e6}
.three{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:20px;margin-top:34px}
.three div{background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.14);border-radius:24px;padding:26px}
.three b{display:block;font-size:22px;margin-bottom:6px}
.three span{color:#b9c6e6;font-size:17px}
.steps{counter-reset:s;display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:22px;margin-top:34px}
.step{background:var(--card);border-radius:28px;padding:28px;border:1px solid var(--line)}
.step::before{counter-increment:s;content:counter(s);display:flex;width:46px;height:46px;border-radius:50%;background:var(--orange);color:#fff;font-weight:800;align-items:center;justify-content:center;margin-bottom:12px;font-size:22px}
.step h3{color:var(--navy);margin-bottom:4px;font-size:22px}
.faq details{background:var(--card);border:1px solid var(--line);border-radius:20px;padding:20px 24px;margin-top:14px}
.faq summary{font-weight:800;color:var(--navy);cursor:pointer;font-size:20px}
.faq p{margin-top:10px;color:var(--muted)}
footer{padding:44px 0 60px;color:var(--muted);font-size:16px;border-top:1px solid var(--line);margin-top:30px}
footer a{color:var(--muted)}
.doc{max-width:760px;margin:0 auto;padding:30px 24px 70px}
.doc h1{font-size:clamp(34px,5vw,48px);color:var(--navy);margin:20px 0 8px}
.doc h2{font-size:28px;margin:40px 0 10px}
.doc p,.doc li{color:#34405a;margin-bottom:12px}
.doc ul{padding-left:24px}
.updated{color:var(--muted);font-weight:600}
.box{background:#fff;border:1px solid var(--line);border-left:8px solid var(--green);border-radius:20px;padding:22px 26px;margin:26px 0}
.box strong{color:var(--navy)}
table{width:100%;border-collapse:collapse;background:#fff;border-radius:18px;overflow:hidden;border:1px solid var(--line);margin:16px 0 24px;font-size:17px}
th,td{text-align:left;padding:14px 16px;border-bottom:1px solid var(--line);vertical-align:top}
th{background:#f0ebdf;color:var(--navy)}
@media(max-width:820px){.hero .grid{grid-template-columns:1fr}.hero img.shot{max-width:300px;margin-top:20px}.lead{max-width:none}.shots img{height:440px}nav a{margin-left:14px;font-size:15px}.band{padding:40px 24px;border-radius:30px}.btn.alt{margin:12px 0 0}}
