@import url("https://fonts.googleapis.com/css2?family=Archivo+Black&family=Inter:wght@400;500;600;700&display=swap");

:root { --black:#1f1f1e; --blue:#2382d8; --navy:#0a1a28; --white:#fff; --muted:#667481; --line:#dce3e8; --soft:#f4f7f9; }
* { box-sizing:border-box; }
html { background:var(--navy); }
body { margin:0; min-height:100vh; background:radial-gradient(circle at 6% 46%,rgba(35,130,216,.08),transparent 28rem),#f7f9fa; color:var(--black); font-family:"Inter",Arial,sans-serif; }
[hidden] { display:none !important; }
button,a { font:inherit; } a { color:inherit; }
.site-header { height:94px; padding:0 max(5vw,28px); background:var(--black); color:#fff; display:flex; align-items:center; justify-content:space-between; border-bottom:3px solid var(--blue); }
.brand { display:flex; align-items:center; gap:13px; text-decoration:none; }
.brand img { width:48px; height:48px; border-radius:8px; object-fit:cover; }
.brand-copy { display:flex; flex-direction:column; gap:2px; }
.brand-copy strong { font-family:"Archivo Black",Arial,sans-serif; font-size:19px; text-transform:uppercase; letter-spacing:-.04em; font-style:normal; }
.brand-copy strong em { color:var(--blue); font-style:normal; }
.brand-copy small { font-size:8px; font-weight:700; letter-spacing:.08em; text-transform:uppercase; color:#c9d0d5; }
.brand-copy small b { color:var(--blue); }
.secure-label { display:flex; align-items:center; gap:8px; color:#d3dae0; font-size:13px; font-weight:600; }
.secure-label svg { width:16px; fill:none; stroke:var(--blue); stroke-width:1.8; }
.checkout-shell { width:min(1180px,calc(100% - 48px)); margin:0 auto; padding:76px 0 82px; display:grid; grid-template-columns:minmax(0,.9fr) minmax(450px,1fr); gap:clamp(48px,8vw,108px); align-items:start; }
.checkout-shell-wide { width:min(1240px,calc(100% - 48px)); grid-template-columns:minmax(330px,.72fr) minmax(560px,1.28fr); gap:clamp(44px,6vw,84px); }
.sticky-intro { position:sticky; top:34px; }
.intro-panel { padding-top:26px; }
.eyebrow { display:flex; align-items:center; gap:10px; margin-bottom:22px; color:var(--blue); font-size:12px; font-weight:800; letter-spacing:.15em; text-transform:uppercase; }
.eyebrow span { width:24px; height:3px; background:var(--blue); }
.intro-panel h1 { margin:0; font-family:"Archivo Black",Arial,sans-serif; font-size:clamp(42px,5vw,69px); line-height:.98; letter-spacing:-.055em; text-transform:uppercase; }
.intro-panel h1 em { color:var(--blue); font-style:normal; }
.lead { max-width:550px; margin:26px 0 34px; color:#52616d; font-size:17px; line-height:1.7; }
.steps { display:grid; max-width:520px; border-top:1px solid var(--line); }
.step { display:flex; gap:14px; align-items:center; padding:16px 0; border-bottom:1px solid var(--line); color:#8a969f; }
.step span { width:30px; height:30px; display:grid; place-items:center; border:1px solid #b9c3ca; border-radius:50%; font-size:11px; font-weight:800; }
.step div { display:flex; flex-direction:column; gap:2px; } .step b { color:#56646f; font-size:13px; } .step small { font-size:11px; }
.step.active span { background:var(--blue); border-color:var(--blue); color:#fff; } .step.active b { color:var(--black); }
blockquote { margin:34px 0 0; padding:3px 0 3px 18px; max-width:500px; border-left:3px solid var(--blue); color:#62717d; font-size:13px; font-style:italic; line-height:1.65; }
.payment-card { min-height:568px; padding:clamp(28px,4vw,44px); background:#fff; border:1px solid #e0e6ea; border-radius:2px; box-shadow:0 24px 70px rgba(10,26,40,.12); }
.payment-card-wide { padding:clamp(28px,3.6vw,44px); }
.card-heading { display:flex; justify-content:space-between; align-items:flex-start; margin-bottom:26px; }
.card-heading span { color:var(--blue); font-size:10px; font-weight:800; letter-spacing:.13em; text-transform:uppercase; }
.card-heading h2 { margin:6px 0 0; font-family:"Archivo Black",Arial,sans-serif; font-size:28px; line-height:1.1; text-transform:uppercase; letter-spacing:-.035em; }
.card-heading .aud { margin-top:5px; padding:5px 8px; border:1px solid var(--line); color:#6c7983; letter-spacing:.05em; }
.plan-list { display:grid; gap:10px; }
.plan-option { width:100%; min-height:76px; padding:14px 16px; border:1px solid var(--line); background:#fff; color:inherit; display:grid; grid-template-columns:20px 1fr auto; gap:13px; align-items:center; text-align:left; cursor:pointer; transition:border-color .18s,background .18s,transform .18s; }
.plan-option:hover { border-color:#8cabc4; transform:translateY(-1px); } .plan-option.selected { border:2px solid var(--blue); padding:13px 15px; background:#f5faff; }
.radio-dot { width:17px; height:17px; border:1px solid #a8b3bb; border-radius:50%; } .selected .radio-dot { border:5px solid var(--blue); }
.plan-name { display:flex; flex-direction:column; gap:5px; } .plan-name b { font-size:14px; } .plan-name small { color:#7a8791; font-size:11px; } .plan-option>strong { font-size:16px; }
.section-divider { margin:30px 0 14px; padding-top:24px; border-top:1px solid var(--line); display:flex; justify-content:space-between; align-items:end; }
.section-divider span { font-family:"Archivo Black",Arial,sans-serif; font-size:20px; text-transform:uppercase; letter-spacing:-.035em; }
.section-divider small { color:#82909a; font-size:10px; }
.addon-list { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:9px; }
.addon-option { min-height:95px; padding:15px; border:1px solid var(--line); background:#fff; color:inherit; display:grid; grid-template-columns:19px 1fr auto; gap:11px; align-items:start; text-align:left; cursor:pointer; transition:border-color .18s,background .18s,transform .18s; }
.addon-option:hover { border-color:#8cabc4; transform:translateY(-1px); }
.addon-option.selected { border-color:var(--blue); background:#f5faff; box-shadow:inset 0 0 0 1px var(--blue); }
.check-box { width:18px; height:18px; margin-top:1px; border:1px solid #a8b3bb; display:grid; place-items:center; color:#fff; font-size:11px; font-weight:800; }
.addon-option.selected .check-box { border-color:var(--blue); background:var(--blue); }
.addon-title { display:flex; flex-wrap:wrap; align-items:center; gap:6px; }
.addon-title b { font-size:12px; }
.addon-title em { padding:3px 5px; background:#e5f2fd; color:#126fbd; font-size:8px; font-style:normal; font-weight:800; letter-spacing:.05em; text-transform:uppercase; }
.addon-option .plan-name small { max-width:210px; line-height:1.4; }
.addon-option>strong { white-space:nowrap; font-size:13px; }
.addon-option>strong small { margin-left:2px; color:#73818b; font-size:8px; text-transform:uppercase; }
.summary { margin:26px 0 20px; padding-top:18px; border-top:1px solid var(--line); }
.summary>div { display:flex; justify-content:space-between; align-items:center; color:#6d7a84; font-size:12px; }
.detailed-summary { display:grid; gap:9px; }
.detailed-summary>div:not(.total):not(.recurring-note) { font-size:11px; }
.summary .total { margin-top:14px; color:var(--black); font-size:14px; font-weight:700; }
.summary .total b { font-family:"Archivo Black",Arial,sans-serif; font-size:25px; letter-spacing:-.04em; } .summary .total small { color:#6d7a84; font-family:"Inter",Arial,sans-serif; font-size:9px; letter-spacing:.08em; }
.summary .recurring-note { margin-top:3px; padding:11px 12px; background:#eef7fe; color:#126fbd; font-weight:700; }
.price-promise { margin-top:34px; padding:17px 18px; border:1px solid #bfd9ec; background:rgba(255,255,255,.55); display:flex; flex-direction:column; gap:5px; }
.price-promise b { color:var(--black); font-size:12px; }
.price-promise span { color:#74828c; font-size:10px; line-height:1.5; }
.pay-button { width:100%; min-height:58px; padding:0 22px; border:0; background:var(--blue); color:#fff; display:flex; align-items:center; justify-content:space-between; font-weight:800; cursor:pointer; transition:background .18s,transform .18s; }
.pay-button:hover:not(:disabled) { background:#116bb8; transform:translateY(-1px); } .pay-button:disabled { cursor:wait; opacity:.7; } .pay-button span { font-size:22px; font-weight:400; }
.setup-message { margin:12px 0 0; padding:10px 12px; background:#fff8e6; color:#685525; font-size:12px; line-height:1.5; }
.assurances { margin-top:19px; display:flex; justify-content:center; flex-wrap:wrap; gap:9px 18px; color:#77848e; font-size:10px; } .assurances b { color:var(--blue); }
.back-button { margin:0 0 20px; padding:0; border:0; background:none; color:var(--blue); font-weight:700; cursor:pointer; } #stripe-checkout { min-height:500px; }
footer { min-height:72px; padding:20px max(5vw,28px); background:var(--navy); color:#8fa1af; display:flex; align-items:center; justify-content:space-between; gap:24px; font-size:11px; } footer nav { display:flex; gap:24px; } footer a { text-decoration:none; } footer a:hover { color:#fff; }
.success-page { min-height:100vh; padding:40px 20px; background:var(--navy); display:grid; place-items:center; }
.success-card { width:min(620px,100%); padding:clamp(38px,7vw,72px); background:#fff; text-align:center; box-shadow:0 28px 80px rgba(0,0,0,.25); }
.success-mark { width:58px; height:58px; margin:0 auto 25px; border-radius:50%; background:var(--blue); color:#fff; display:grid; place-items:center; font-size:27px; font-weight:800; }
.success-card .eyebrow { justify-content:center; margin-bottom:18px; }
.success-card h1 { margin:0; font-family:"Archivo Black",Arial,sans-serif; font-size:clamp(34px,6vw,54px); line-height:1; letter-spacing:-.05em; text-transform:uppercase; } .success-card h1 em { color:var(--blue); font-style:normal; }
.success-card>p:not(.eyebrow) { margin:24px auto 28px; max-width:450px; color:#65737e; font-size:15px; line-height:1.7; }
.success-card>a { min-height:54px; padding:0 20px; background:var(--blue); color:#fff; display:flex; justify-content:space-between; align-items:center; text-decoration:none; font-weight:800; }
@media (max-width:900px) { .checkout-shell { grid-template-columns:1fr; width:min(720px,calc(100% - 36px)); padding:48px 0 60px; gap:42px; } .intro-panel { padding-top:0; } .sticky-intro { position:static; } .steps { grid-template-columns:repeat(3,1fr); border-bottom:1px solid var(--line); } .step { border:0; align-items:flex-start; } blockquote { display:none; } .price-promise { display:none; } }
@media (max-width:560px) { .site-header { height:78px; padding:0 18px; } .brand img { width:40px; height:39px; } .brand-copy strong { font-size:16px; } .brand-copy small { display:none; } .secure-label { font-size:0; } .secure-label svg { width:19px; } .checkout-shell { width:calc(100% - 28px); padding:36px 0 44px; } .intro-panel h1 { font-size:40px; } .lead { font-size:15px; margin:20px 0 28px; } .steps { display:none; } .payment-card { min-height:0; padding:24px 18px; } .card-heading h2 { font-size:24px; } .plan-option { grid-template-columns:18px 1fr auto; gap:10px; padding-left:13px; padding-right:13px; } .plan-option.selected { padding-left:12px; padding-right:12px; } .plan-name b { font-size:12px; } .plan-name small { max-width:155px; } .addon-list { grid-template-columns:1fr; } .addon-option .plan-name small { max-width:220px; } .section-divider small { display:none; } footer { flex-direction:column; align-items:flex-start; } }
@media (prefers-reduced-motion:reduce) { * { scroll-behavior:auto!important; transition:none!important; } }
