:root{
  --navy:#13355e;
  --slate:#6c8299;
  --ink:#1b2430;
  --line:#e7edf2;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;font-family:"Century Gothic","Futura","Trebuchet MS",-apple-system,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;color:var(--ink);background:#fff;line-height:1.6}
a{color:var(--navy)}
.wrap{max-width:1080px;margin:0 auto;padding:0 24px}

/* header */
header{background:#fff;border-bottom:1px solid var(--line);position:sticky;top:0;z-index:20}
.topbar{display:flex;justify-content:flex-end;padding:8px 24px 0}
.topbar a{color:var(--navy);text-decoration:none;font-size:13px;opacity:.8}
.nav{display:flex;align-items:center;justify-content:space-between;min-height:88px;padding:10px 0}
.logo img{height:60px;width:auto;display:block}
.menu{display:flex;align-items:center;gap:20px;flex-wrap:wrap}
.menu a{color:#33414f;text-decoration:none;font-size:14px}
.menu a:hover,.menu a.active{color:var(--navy);font-weight:600}
.menu .contact-btn{background:var(--navy);color:#fff;padding:10px 20px;border-radius:2px;font-weight:600}
.menu .contact-btn:hover{color:#fff}
.soc{display:inline-flex;gap:10px}
.soc a{color:var(--navy);font-size:16px;text-decoration:none}

/* buttons */
.btn{display:inline-block;background:#f7f5f0;color:var(--navy);font-weight:700;text-decoration:none;padding:16px 40px;border:none;border-radius:1px;font-size:16px;cursor:pointer;transition:background .15s}
.btn:hover{background:#e9e6df}
.btn.navy{background:var(--navy);color:#fff}
.btn.navy:hover{background:#0f2a4c}

/* page hero band */
.pagehead{background:var(--navy);color:#fff;padding:56px 0}
.pagehead h1{margin:0;font-size:40px;font-weight:800;text-transform:uppercase;letter-spacing:.5px}

/* slate content */
.slatewrap{background:var(--slate);color:#fff}
.slatewrap .wrap{padding:60px 24px}
.qa{padding-bottom:40px}
.qa:last-child{padding-bottom:0}
.qa h2{font-size:27px;line-height:1.25;margin:0 0 16px;font-weight:800;text-transform:uppercase;color:#fff}
.qa p{font-size:17px;color:#f2f5f8;max-width:840px;margin:0 0 16px}
.quote{font-size:21px;font-style:italic;border-left:4px solid #fff;padding-left:18px;margin:0 0 10px;max-width:840px}
.quote-src{font-size:14px;opacity:.85;margin:0 0 26px}

/* plain content */
.content{padding:56px 0}
.content h2{color:var(--navy);font-size:26px;text-transform:uppercase;margin:34px 0 14px}
.content p{font-size:17px;color:#33414f;max-width:840px;margin:0 0 16px}

/* pricing cards */
.plans{display:flex;gap:26px;flex-wrap:wrap;justify-content:center;margin-top:30px}
.plan{flex:1 1 320px;max-width:380px;border:1px solid var(--line);border-radius:10px;padding:30px;box-shadow:0 8px 24px rgba(19,53,94,.06)}
.plan h3{color:var(--navy);margin:0 0 6px;font-size:22px}
.plan .price{font-size:40px;font-weight:800;color:var(--navy);margin:6px 0}
.plan .tag{color:#5a6b7b;margin:0 0 18px}
.plan ul{padding-left:18px;margin:16px 0 0;color:#33414f}
.plan li{margin:8px 0}

/* footer */
footer{background:#fff;text-align:center;padding:54px 24px 40px;color:#4a5563;border-top:1px solid var(--line)}
footer h3{color:var(--navy);font-weight:700;font-size:22px;margin:0 0 18px}
.news{max-width:460px;margin:0 auto 30px}
.news input{width:100%;border:none;border-bottom:1px solid #c3cdd7;color:var(--ink);text-align:left;padding:8px 2px;font-size:16px;font-family:inherit}
.news input:focus{outline:none;border-bottom-color:var(--navy)}
.news button{margin-top:14px;width:100%;background:var(--navy);color:#fff;border:none;padding:14px;font-weight:600;cursor:pointer;border-radius:1px}
.legal{font-size:13px;color:#7a8794;max-width:680px;margin:24px auto 0;line-height:1.7}

@media(max-width:640px){.pagehead h1{font-size:28px}.menu{gap:12px}.menu a{font-size:13px}}