@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700&family=Manrope:wght@600;700;800&display=swap');

:root { --navy:#102b36; --navy-2:#173c47; --cream:#f5f1e8; --paper:#fffdf8; --teal:#2b746f; --teal-light:#dcebe7; --amber:#dc9d45; --ink:#17313a; --muted:#65757a; --line:#d9ddd8; }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { margin:0; background:var(--paper); color:var(--ink); font-family:'DM Sans',sans-serif; }
a { color:inherit; text-decoration:none; }
.site-header { align-items:center; background:rgba(255,253,248,.94); border-bottom:1px solid rgba(16,43,54,.09); display:flex; justify-content:space-between; padding:18px clamp(24px,6vw,96px); position:sticky; top:0; z-index:20; backdrop-filter:blur(12px); }
.brand { align-items:center; display:flex; gap:12px; }
.brand-mark { align-items:center; background:var(--navy); border-radius:4px 14px 4px 14px; color:white; display:flex; font:800 17px 'Manrope',sans-serif; height:44px; justify-content:center; letter-spacing:-1px; width:44px; }
.brand strong,.brand small { display:block; }.brand strong { font:800 15px 'Manrope',sans-serif; }.brand small { color:var(--muted); font-size:11px; letter-spacing:.12em; text-transform:uppercase; }
nav { align-items:center; display:flex; gap:30px; font-size:14px; font-weight:600; } nav a:hover { color:var(--teal); }.nav-cta { border:1px solid var(--navy); border-radius:99px; padding:10px 18px; }
.hero { background:var(--cream); display:grid; gap:7vw; grid-template-columns:minmax(0,1.35fr) minmax(300px,.65fr); padding:clamp(70px,9vw,130px) clamp(24px,8vw,130px); position:relative; overflow:hidden; }
.hero:after { background:var(--amber); border-radius:50%; content:''; height:280px; opacity:.12; position:absolute; right:-120px; top:-130px; width:280px; }
.kicker { color:var(--teal); font-size:12px; font-weight:700; letter-spacing:.18em; margin:0 0 20px; text-transform:uppercase; }.kicker.light { color:#8ed1c8; }
h1,h2,h3 { font-family:'Manrope',sans-serif; letter-spacing:-.035em; margin-top:0; }
h1 { color:var(--navy); font-size:clamp(46px,6vw,82px); line-height:1.02; margin-bottom:28px; max-width:850px; } h1 em { color:var(--teal); font-style:normal; }
.hero-intro { color:#52696f; font-size:clamp(18px,2vw,22px); line-height:1.6; max-width:720px; }
.hero-actions { display:flex; flex-wrap:wrap; gap:14px; margin-top:36px; }.button { border-radius:4px; display:inline-block; font-weight:700; padding:15px 22px; transition:.2s transform,.2s background; }.button:hover { transform:translateY(-2px); }.primary { background:var(--navy); color:white; }.secondary { border:1px solid #9aa9a8; color:var(--navy); }
.service-card { align-self:center; background:var(--navy); border-radius:7px 30px 7px 30px; box-shadow:22px 24px 0 rgba(43,116,111,.13); color:white; padding:34px; position:relative; z-index:1; }.signal { color:#a9d6cf; font-size:12px; font-weight:700; letter-spacing:.1em; text-transform:uppercase; }.signal span { background:#5ec8a5; border-radius:50%; display:inline-block; height:8px; margin-right:8px; width:8px; }.service-card h2 { font-size:26px; line-height:1.25; margin:22px 0 28px; }.service-card ul { list-style:none; margin:0; padding:0; }.service-card li { border-top:1px solid rgba(255,255,255,.13); display:flex; justify-content:space-between; padding:15px 0; }.service-card b { color:#f2bb6f; }.service-card span { color:#c4d0d2; }
.plans-section,.questions-section,.services-section { padding:clamp(75px,9vw,125px) clamp(24px,6vw,96px); }.section-heading { margin-bottom:52px; max-width:760px; }.section-heading h2,.why-lead h2,.contact-section h2,.migration-copy h2 { color:var(--navy); font-size:clamp(34px,4vw,52px); line-height:1.12; margin-bottom:20px; }.section-heading>p:last-child,.why-lead>p:last-child,.contact-section p { color:var(--muted); font-size:18px; line-height:1.65; }.compact { margin-bottom:34px; }
.plans-grid { display:grid; gap:18px; grid-template-columns:repeat(4,1fr); }.plan-card { border:1px solid var(--line); border-radius:5px; display:flex; flex-direction:column; min-height:640px; padding:30px; position:relative; }.plan-card.featured { background:var(--navy); border-color:var(--navy); color:white; transform:translateY(-10px); }.badge { background:var(--amber); border-radius:99px; color:var(--navy); font-size:11px; font-weight:800; padding:7px 11px; position:absolute; right:18px; top:18px; text-transform:uppercase; }.plan-eyebrow { color:var(--teal); font-size:12px; font-weight:700; letter-spacing:.11em; text-transform:uppercase; }.featured .plan-eyebrow { color:#8ed1c8; }.plan-card h3 { font-size:31px; margin:9px 0 12px; }.plan-description { color:var(--muted); line-height:1.5; min-height:72px; }.featured .plan-description,.featured .plan-note { color:#bfd0d3; }.price { align-items:baseline; display:flex; flex-wrap:wrap; margin:8px 0 4px; }.price strong { color:var(--navy); font:800 32px 'Manrope',sans-serif; letter-spacing:-.04em; }.price span { color:var(--muted); font-size:14px; margin-left:5px; }.price small { color:var(--teal); display:block; flex-basis:100%; font-weight:700; margin-top:3px; }.featured .price strong { color:white; }.featured .price span { color:#bfd0d3; }.featured .price small { color:#8ed1c8; }.plan-card ul { border-top:1px solid var(--line); list-style:none; margin:20px 0; padding:18px 0 0; }.featured ul { border-color:rgba(255,255,255,.18); }.plan-card li { font-size:15px; padding:7px 0 7px 22px; position:relative; }.plan-card li:before { color:var(--teal); content:'✓'; font-weight:800; left:0; position:absolute; }.featured li:before { color:#74c9bd; }.plan-note { color:var(--muted); font-size:13px; line-height:1.5; }.plan-link { border-top:1px solid var(--line); font-weight:700; margin-top:auto; padding-top:18px; }.featured .plan-link { border-color:rgba(255,255,255,.18); color:#f3bd72; }.plan-link span { float:right; }.plans-footnote { color:var(--muted); font-size:13px; line-height:1.6; margin:25px 0 0; }
.migration-section { align-items:start; background:var(--teal-light); display:grid; gap:clamp(40px,7vw,100px); grid-template-columns:1.15fr .85fr; padding:clamp(75px,9vw,115px) clamp(24px,8vw,130px); }.migration-copy>p:not(.kicker) { color:#48646a; font-size:18px; line-height:1.7; max-width:760px; }.text-link { border-bottom:2px solid var(--teal); color:var(--navy); display:inline-block; font-weight:700; margin-top:14px; padding-bottom:6px; }.text-link span { color:var(--teal); margin-left:8px; }.migration-note { background:var(--paper); border-radius:5px 24px 5px 24px; box-shadow:16px 18px 0 rgba(16,43,54,.08); padding:34px; }.migration-note h3 { color:var(--navy); font-size:24px; margin-bottom:18px; }.migration-note p { color:var(--muted); line-height:1.65; }.migration-note .safety-note { border-top:1px solid var(--line); color:var(--ink); margin:24px 0 0; padding-top:22px; }.safety-note strong { color:var(--teal); display:block; margin-bottom:4px; }
.services-section { background:var(--paper); }.service-prices { display:grid; gap:16px; grid-template-columns:repeat(3,1fr); }.service-prices article { background:#f8f6f0; border:1px solid var(--line); border-radius:5px; padding:25px; }.service-prices span { color:var(--teal); display:block; font-size:12px; font-weight:700; letter-spacing:.09em; margin-bottom:12px; text-transform:uppercase; }.service-prices strong { color:var(--navy); display:block; font:800 25px 'Manrope',sans-serif; }.service-prices p { color:var(--muted); font-size:14px; line-height:1.55; margin-bottom:0; }.service-caveat { color:var(--muted); font-size:13px; line-height:1.6; margin:20px 0 55px; }.support-boundaries { display:grid; gap:18px; grid-template-columns:1fr 1fr; }.support-boundaries article { border-top:4px solid var(--teal); background:var(--cream); padding:30px; }.support-boundaries h3 { color:var(--navy); font-size:25px; }.support-boundaries ul { color:#48646a; line-height:1.6; margin:0; padding-left:20px; }.support-boundaries li { padding:4px 0; }
.why-section { background:var(--navy); color:white; display:grid; gap:8vw; grid-template-columns:.8fr 1.2fr; padding:clamp(75px,9vw,125px) clamp(24px,8vw,130px); }.why-lead h2 { color:white; }.why-lead>p:last-child { color:#b9c9cc; }.assurances article { border-top:1px solid rgba(255,255,255,.16); display:grid; gap:18px; grid-template-columns:50px 1fr 1.4fr; padding:25px 0; }.assurances span { color:var(--amber); font:700 13px 'Manrope'; }.assurances h3 { font-size:20px; margin:0; }.assurances p { color:#b9c9cc; line-height:1.55; margin:0; }
.questions-section { background:#f8f6f0; }.faq-list { border-top:1px solid var(--line); max-width:920px; }.faq-list details { border-bottom:1px solid var(--line); padding:22px 0; }.faq-list summary { cursor:pointer; font:700 18px 'Manrope'; list-style:none; }.faq-list summary span { color:var(--teal); float:right; font-size:24px; }.faq-list details[open] summary span { transform:rotate(45deg); }.faq-list p { color:var(--muted); line-height:1.65; max-width:750px; }
.contact-section { align-items:center; background:var(--teal); color:white; display:flex; gap:40px; justify-content:space-between; padding:65px clamp(24px,8vw,130px); }.contact-section h2 { color:white; margin-bottom:10px; }.contact-section p { color:#d8ece8; margin-bottom:0; max-width:700px; }.warm { background:var(--amber); color:var(--navy); flex:none; }
footer { align-items:center; background:#0a2028; color:#99aaad; display:flex; gap:30px; justify-content:space-between; padding:35px clamp(24px,6vw,96px); font-size:12px; }.footer-brand strong { color:white; }.footer-brand .brand-mark { background:var(--teal); }
@media (max-width:1100px) { .plans-grid { grid-template-columns:repeat(2,1fr); }.plan-card.featured { transform:none; }.plan-card { min-height:590px; }.why-section { grid-template-columns:1fr; }.migration-section { grid-template-columns:1fr; }.migration-note { max-width:760px; }.service-prices { grid-template-columns:repeat(2,1fr); } }
@media (max-width:760px) { nav a:not(.nav-cta) { display:none; }.hero { grid-template-columns:1fr; }.service-card { max-width:520px; }.plans-grid,.service-prices,.support-boundaries { grid-template-columns:1fr; }.plan-card { min-height:auto; }.assurances article { grid-template-columns:40px 1fr; }.assurances p { grid-column:2; }.contact-section,footer { align-items:flex-start; flex-direction:column; }.site-header { padding:14px 20px; }.brand strong { font-size:13px; }.brand small { font-size:9px; }.migration-note { padding:28px; } }
