
:root{
  --navy:#071c34;--blue:#087df5;--cyan:#21c2d6;--ink:#0a1424;
  --muted:#64748b;--line:#dbe6f0;--surface:#f6f9fc;--white:#fff;
  --radius:28px;--shadow:0 24px 70px rgba(8,32,62,.14);
}
*{box-sizing:border-box}html{scroll-behavior:smooth}
body{margin:0;font-family:-apple-system,BlinkMacSystemFont,"SF Pro Display","Segoe UI",sans-serif;color:var(--ink);background:#fff;line-height:1.55}
a{color:inherit;text-decoration:none}.wrap{width:min(1160px,calc(100% - 40px));margin:auto}
nav{position:sticky;top:0;z-index:50;background:rgba(255,255,255,.88);backdrop-filter:blur(18px);border-bottom:1px solid rgba(219,230,240,.75)}
.nav-inner{height:76px;display:flex;align-items:center;justify-content:space-between}
.brand{font-weight:850;font-size:25px;letter-spacing:-.8px}.brand span{color:var(--blue)}
.links{display:flex;gap:28px;align-items:center}.links a{font-weight:650;color:#334155}
.button{display:inline-flex;align-items:center;justify-content:center;border-radius:999px;padding:14px 22px;font-weight:750;background:var(--ink);color:#fff;box-shadow:0 10px 28px rgba(10,20,36,.16)}
.button.alt{background:#fff;color:var(--ink);border:1px solid var(--line);box-shadow:none}
.hero{overflow:hidden;background:radial-gradient(circle at 75% 20%,rgba(33,194,214,.28),transparent 35%),linear-gradient(135deg,#05172c,#0a3767 58%,#078db0);color:#fff}
.hero-grid{min-height:760px;display:grid;grid-template-columns:1.05fr .95fr;align-items:center;gap:60px;padding:90px 0}
.eyebrow{text-transform:uppercase;letter-spacing:.16em;font-size:13px;font-weight:800;color:#bcecff}
h1{font-size:clamp(54px,7vw,92px);line-height:.98;letter-spacing:-4px;margin:18px 0 28px}
.hero p{font-size:21px;color:#d7e9f8;max-width:620px}
.actions{display:flex;gap:14px;margin-top:34px;flex-wrap:wrap}
.phone-stack{position:relative;height:650px}.phone{position:absolute;width:310px;border-radius:48px;box-shadow:0 35px 90px rgba(0,0,0,.35);border:8px solid rgba(5,16,31,.92)}
.phone.one{right:92px;top:0;transform:rotate(4deg)}.phone.two{right:0;top:115px;transform:rotate(11deg);opacity:.9}.phone.three{right:205px;top:135px;transform:rotate(-8deg);opacity:.92}
section{padding:100px 0}.section-head{max-width:750px;margin-bottom:52px}
.kicker{color:var(--blue);font-weight:800;text-transform:uppercase;letter-spacing:.13em;font-size:13px}
h2{font-size:clamp(38px,5vw,64px);line-height:1.05;letter-spacing:-2.5px;margin:12px 0 18px}
.lead{font-size:20px;color:var(--muted)}
.cards{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}
.card{background:var(--surface);border:1px solid #e5edf5;border-radius:var(--radius);padding:32px;min-height:250px}
.icon{width:52px;height:52px;border-radius:16px;background:linear-gradient(135deg,var(--blue),var(--cyan));display:grid;place-items:center;color:#fff;font-size:24px;margin-bottom:24px}
.card h3{font-size:24px;margin:0 0 10px}.card p{color:var(--muted);margin:0}
.showcase{background:#071c34;color:#fff}.shots{display:grid;grid-template-columns:repeat(3,1fr);gap:26px}
.shot{background:linear-gradient(180deg,#13385d,#071c34);border:1px solid rgba(255,255,255,.12);border-radius:34px;padding:24px;overflow:hidden}
.shot img{width:100%;border-radius:24px;display:block}.shot h3{font-size:22px;margin:22px 4px 4px}.shot p{color:#bad0e4;margin:0 4px}
.split{display:grid;grid-template-columns:1fr 1fr;gap:70px;align-items:center}
.quote{background:linear-gradient(135deg,#eff8ff,#f4fffd);border-radius:36px;padding:46px;border:1px solid #d9edf7}
.quote strong{font-size:34px;line-height:1.15;display:block;letter-spacing:-1px}
.faq{display:grid;gap:14px}.faq details{border:1px solid var(--line);border-radius:18px;padding:20px 22px;background:#fff}.faq summary{font-weight:760;cursor:pointer}.faq p{color:var(--muted)}
.cta{background:linear-gradient(135deg,#087df5,#11a9be);color:#fff;border-radius:40px;padding:65px;text-align:center}.cta h2{margin-top:0}
footer{padding:45px 0;border-top:1px solid var(--line);color:#64748b}.footer-inner{display:flex;justify-content:space-between;gap:25px;flex-wrap:wrap}.footer-links{display:flex;gap:20px;flex-wrap:wrap}
.legal{max-width:850px;margin:auto;padding:70px 0 110px}.legal h1{font-size:54px;color:var(--ink);letter-spacing:-2px}.legal h2{font-size:30px;letter-spacing:-1px;margin-top:42px}.legal p,.legal li{color:#475569}
.notice{padding:18px 20px;border-radius:16px;background:#eff6ff;border:1px solid #bfdbfe;color:#1e3a8a}
@media(max-width:900px){
 .links a:not(.button){display:none}.hero-grid,.split{grid-template-columns:1fr}.hero-grid{padding-top:65px}.phone-stack{height:560px;margin-top:10px}.phone{width:260px}.phone.one{right:20%;}.phone.two{right:2%}.phone.three{right:42%}
 .cards,.shots{grid-template-columns:1fr}.shots{max-width:520px;margin:auto}.cta{padding:44px 24px}
}
@media(max-width:560px){
 .wrap{width:min(100% - 26px,1160px)}nav .button{padding:11px 15px;font-size:14px}
 h1{letter-spacing:-2.4px}.hero-grid{min-height:auto}.phone-stack{height:470px}.phone{width:210px;border-width:6px;border-radius:36px}.phone.one{right:17%}.phone.two{right:-5%;top:100px}.phone.three{right:43%;top:115px}
 section{padding:74px 0}.cta{border-radius:26px}.legal h1{font-size:43px}
}
