@import url('https://fonts.googleapis.com/css2?family=Jost:wght@200;300;400;500&family=Instrument+Serif:ital@1&display=swap');
/* Live preview: a professional site inside a browser window */
@media (min-width:961px){.win-body{grid-template-columns:.78fr 1.22fr}}
.preview{padding:24px}
.browser{width:100%;border-radius:14px;overflow:hidden;background:#fff;border:1px solid rgba(169,193,242,.3);box-shadow:0 30px 70px -25px rgba(0,0,0,.75),0 0 80px -30px rgba(56,94,178,.6);container-type:inline-size}
.b-bar{display:flex;align-items:center;gap:10px;padding:8px 12px;background:#eef1f7;border-bottom:1px solid #dde2ec}
.b-bar .dots i{width:9px;height:9px}
.b-url{flex:1;text-align:center;font-size:11px;color:#5b6474;background:#fff;border-radius:6px;padding:3px 10px;font-family:var(--sans);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.site{--a:#1f4fe0;color:#0a0e1f;font-family:"Jost","Avenir Next",system-ui,sans-serif;background:#fff}
.s-strip{background:var(--a);color:#fff;text-align:center;font-size:1.9cqw;letter-spacing:.16em;padding:1.3cqw 2cqw;transition:background .4s;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.s-nav{display:flex;align-items:center;gap:3cqw;padding:2.6cqw 4cqw;border-bottom:1px solid #eef0f5}
#s-logo{font-weight:500;letter-spacing:.2em;font-size:2.5cqw;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:34cqw}
.s-links{display:flex;gap:2.6cqw;margin-left:auto;font-size:1.7cqw;letter-spacing:.16em;text-transform:uppercase;color:#2a2f40}
.s-links i{font-style:normal}
.s-btn{background:var(--a);color:#fff;border-radius:99px;padding:1.2cqw 2.8cqw;font-size:1.7cqw;letter-spacing:.14em;text-transform:uppercase;font-weight:500;white-space:nowrap;transition:background .4s}
.s-hero{display:grid;grid-template-columns:1.15fr .85fr;gap:2cqw;padding:5.5cqw 4cqw 6cqw 6cqw;align-items:center}
#s-eyebrow{display:block;font-size:1.7cqw;letter-spacing:.24em;text-transform:uppercase;color:var(--a);font-weight:500;margin-bottom:2.2cqw}
#s-h1{margin:0;font-weight:200;font-size:6.4cqw;line-height:1.02;letter-spacing:-.01em;color:#0a0e1f}
#s-serif{display:block;font-family:"Instrument Serif",Georgia,serif;font-style:italic;font-weight:400;color:var(--a);font-size:7.2cqw;line-height:1.05;margin:.4cqw 0 2.4cqw;transition:color .4s}
#s-p{font-size:2cqw;color:#4a5068;line-height:1.55;margin:0 0 3.2cqw;font-weight:300}
.s-cta{display:inline-block;background:var(--a);color:#fff;border-radius:99px;padding:1.7cqw 3.4cqw;font-size:1.7cqw;letter-spacing:.14em;text-transform:uppercase;font-weight:500;transition:background .4s}
.s-art{position:relative;aspect-ratio:1;display:grid;place-items:center}
.ring{position:absolute;border-radius:50%;border:1px solid color-mix(in srgb,var(--a) 22%,transparent)}
.r1{inset:2%}.r2{inset:18%}
.orb{width:48%;aspect-ratio:1;border-radius:50%;background:radial-gradient(circle at 35% 30%,#fff,color-mix(in srgb,var(--a) 16%,#fff) 60%,color-mix(in srgb,var(--a) 34%,#fff));display:grid;place-items:center;box-shadow:0 3cqw 6cqw -2cqw color-mix(in srgb,var(--a) 45%,transparent);transition:background .4s}
.orb svg{width:44%;height:44%;color:var(--a)}
.stat{position:absolute;background:#fff;border-radius:2cqw;padding:1.6cqw 2.3cqw;box-shadow:0 1.4cqw 4cqw -1cqw rgba(10,14,31,.2);display:grid;gap:.5cqw;border:1px solid #f0f2f7}
.stat small{font-size:1.4cqw;letter-spacing:.16em;text-transform:uppercase;color:#4a5068}
.stat b{font-size:2.8cqw;font-weight:400;color:var(--a);white-space:nowrap}
.st1{top:4%;right:-2%}.st2{bottom:4%;left:-4%}
@media (max-width:680px){.preview{padding:16px}.s-links{display:none}}
/* Business band under the packages */
.biz{margin-top:28px;display:grid;grid-template-columns:1.3fr 1fr auto;gap:24px 36px;align-items:center;border:1px solid var(--line-2);border-radius:22px;padding:30px 32px;background:linear-gradient(120deg,#13254a,var(--card))}
.biz h3{font-size:26px;margin:8px 0 8px}
.biz p{color:var(--muted);font-size:15px;max-width:52ch}
@media (max-width:960px){.biz{grid-template-columns:1fr}}
/* Account: visible in the header and explained in its own section */
.nav-account{gap:8px}
.nav-account svg{width:16px;height:16px}
header nav .nav-account{display:inline-flex}
.acct-actions{display:flex;gap:12px;flex-wrap:wrap}
.acct-list{margin:4px 0 6px}
.acct-body{padding:20px;display:grid;gap:8px;font-size:14px}
.acct-body .mini-title{font-weight:700;margin-top:6px}
.st{font-size:12px;font-weight:800;border-radius:999px;padding:2px 10px}
.st-proc{background:rgba(196,181,253,.14);color:#c4b5fd}
.st-ok{background:rgba(61,220,132,.14);color:#3ddc84}
.st-warn{background:rgba(245,196,81,.14);color:#f5c451}
.nudge{border:1px dashed rgba(169,193,242,.45);border-radius:14px;padding:14px 16px;display:flex;gap:10px 16px;align-items:center;justify-content:space-between;flex-wrap:wrap;background:rgba(169,193,242,.06);font-size:14px;color:var(--muted)}
.nudge b{color:var(--text)}
.nudge a{font-weight:800;color:var(--accent);white-space:nowrap}
/* Contact icons and social links */
.contact-icons{display:flex;gap:12px;justify-content:center;flex-wrap:wrap}
.ci{width:52px;height:52px;border-radius:16px;display:grid;place-items:center;border:1px solid var(--line-2);background:rgba(255,255,255,.03);color:var(--text);text-decoration:none;transition:border-color .2s,transform .2s}
.ci:hover{border-color:var(--accent);transform:translateY(-2px)}
.ci svg{width:24px;height:24px}
.ci.wa{background:#25d366;border-color:#25d366;color:#fff}
.ci.soon{opacity:.4;cursor:default;transform:none}
.ci-label{font-size:13px;color:var(--dim)}
footer .ci{width:40px;height:40px;border-radius:12px}
footer .ci svg{width:19px;height:19px}
.foot-social{display:flex;gap:10px;align-items:center}
.fab{position:fixed;right:calc(20px + env(safe-area-inset-right,0px));bottom:calc(20px + env(safe-area-inset-bottom,0px));width:60px;height:60px;border-radius:50%;background:#25d366;color:#fff;display:grid;place-items:center;box-shadow:0 12px 30px -8px rgba(0,0,0,.6),0 0 0 6px rgba(37,211,102,.15);z-index:40;text-decoration:none;transition:transform .2s}
.fab:hover{transform:scale(1.06)}
.fab svg{width:32px;height:32px}
.q-nav{gap:10px}
footer{padding-bottom:calc(96px + env(safe-area-inset-bottom,0px))}