:root { --ink: #f7f9ff; --muted: #aab8d3; --line: rgba(255,255,255,.14); --accent: #8ed8ff; --purple: #9e83ff; --panel: rgba(17,29,61,.64); }
* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin: 0; min-width: 320px; color: var(--ink); background: #101b3c; font: 15px/1.6 "DM Sans", Arial, sans-serif; }
body::before { position: fixed; inset: 0; z-index: -3; content: ""; background: linear-gradient(145deg, #182e67, #17234b 52%, #322150); }
a { color: inherit; }
.overview-scene { position: fixed; inset: 0; z-index: -2; overflow: hidden; pointer-events: none; }
.overview-scene::after { position: absolute; inset: 0; content: ""; background: linear-gradient(180deg, transparent 30%, #101b3c 90%); }
.orb { position: absolute; top: 7%; right: 16%; width: 230px; height: 230px; border-radius: 50%; background: #ffe1a2; box-shadow: 0 0 90px 30px rgba(255,201,108,.2); animation: float 7s ease-in-out infinite; }
.overview-cloud { position: absolute; width: 300px; height: 50px; border-radius: 80px; background: rgba(207,229,255,.1); filter: blur(2px); animation: drift 30s linear infinite; }
.overview-cloud::before, .overview-cloud::after { position: absolute; content: ""; bottom: 0; border-radius: 50%; background: inherit; }
.overview-cloud::before { left: 45px; width: 115px; height: 100px; }.overview-cloud::after { right: 40px; width: 80px; height: 75px; }
.cloud-a { top: 22%; left: -330px; }.cloud-b { top: 45%; left: 65%; opacity: .5; animation-duration: 42s; }
.overview-nav, main, footer { width: min(1160px, calc(100% - 48px)); margin: auto; }
.overview-nav { display: flex; align-items: center; justify-content: space-between; padding: 28px 0; }
.overview-brand { font: 700 24px "Space Grotesk", Arial, sans-serif; letter-spacing: -.06em; text-decoration: none; }.overview-brand span { display: inline-grid; width: 30px; height: 30px; margin-right: 6px; place-items: center; border-radius: 10px; color: #17244e; background: var(--accent); font-size: 16px; }.overview-brand em { color: var(--accent); font: 700 11px "DM Sans", sans-serif; letter-spacing: .04em; text-transform: uppercase; vertical-align: top; }
nav { display: flex; align-items: center; gap: 28px; color: var(--muted); }nav a { text-decoration: none; }nav a:hover { color: var(--ink); }.nav-cta { padding: 9px 14px; border: 1px solid var(--line); border-radius: 11px; color: var(--ink); background: rgba(255,255,255,.08); }
.overview-hero { display: grid; grid-template-columns: 1fr .85fr; gap: 70px; align-items: center; min-height: 650px; padding: 55px 0 90px; }.eyebrow { margin: 0 0 12px; color: var(--accent); font-size: 12px; font-weight: 700; letter-spacing: .14em; text-transform: uppercase; }.hero-copy h1 { max-width: 700px; margin: 0 0 22px; font: 700 clamp(48px, 7vw, 85px)/.98 "Space Grotesk", Arial, sans-serif; letter-spacing: -.08em; }.hero-copy h1 span { color: var(--accent); }.hero-lede { max-width: 540px; margin-bottom: 30px; color: var(--muted); font-size: 18px; }.hero-actions { display: flex; align-items: center; gap: 24px; }.primary-button { display: inline-flex; align-items: center; gap: 15px; padding: 14px 18px; border-radius: 12px; color: #122550; background: var(--accent); font-weight: 700; text-decoration: none; box-shadow: 0 12px 30px rgba(93,169,255,.2); transition: .2s; }.primary-button:hover { transform: translateY(-3px); background: #b8ecff; }.text-link { color: var(--muted); text-decoration: none; }.text-link:hover { color: var(--ink); }.trust-row { display: flex; flex-wrap: wrap; gap: 17px; margin-top: 32px; color: var(--muted); font-size: 12px; }.trust-row i { display: inline-grid; width: 18px; height: 18px; margin-right: 4px; place-items: center; border-radius: 50%; color: var(--accent); background: rgba(142,216,255,.12); font-style: normal; }
.preview-wrap { position: relative; }.preview-glow { position: absolute; inset: 10% -10%; background: linear-gradient(120deg, rgba(142,216,255,.28), rgba(158,131,255,.25)); filter: blur(70px); }.preview-card { position: relative; padding: 23px; border: 1px solid rgba(255,255,255,.22); border-radius: 24px; background: rgba(17,29,61,.76); box-shadow: 0 30px 90px rgba(0,0,0,.3); backdrop-filter: blur(22px); transform: rotate(3deg); animation: card-float 6s ease-in-out infinite; }.preview-top, .preview-temp, .preview-stats { display: flex; align-items: center; justify-content: space-between; }.preview-brand { font: 700 16px "Space Grotesk", sans-serif; }.preview-pill { padding: 5px 9px; border-radius: 12px; color: var(--accent); background: rgba(142,216,255,.12); font-size: 11px; }.preview-location { display: grid; gap: 2px; margin: 58px 0 30px; }.preview-location small { color: var(--muted); }.preview-location strong { font: 700 42px "Space Grotesk", sans-serif; letter-spacing: -.08em; }.preview-location span { color: var(--muted); }.preview-temp { justify-content: flex-start; gap: 14px; padding-bottom: 30px; border-bottom: 1px solid var(--line); }.preview-temp strong { font: 600 92px/.8 "Space Grotesk", sans-serif; letter-spacing: -.1em; }.preview-temp span { color: var(--muted); font-size: 12px; line-height: 1.7; }.preview-temp b { margin-left: auto; color: #ffd98a; font-size: 57px; text-shadow: 0 0 25px rgba(255,217,138,.5); }.preview-stats { gap: 10px; padding-top: 22px; }.preview-stats span { display: grid; gap: 3px; }.preview-stats small { color: var(--muted); font-size: 10px; }.preview-stats b { font-size: 13px; }
.section { padding: 90px 0; }.section-heading { max-width: 630px; margin-bottom: 35px; }.section-heading h2, .final-cta h2 { margin: 0 0 10px; font: 600 clamp(30px, 4vw, 50px)/1.05 "Space Grotesk", sans-serif; letter-spacing: -.07em; }.section-heading > p:last-child { margin: 0; color: var(--muted); font-size: 16px; }.feature-grid { display: grid; grid-template-columns: 1.3fr 1fr 1fr; gap: 15px; }.feature-card { min-height: 230px; padding: 24px; border: 1px solid var(--line); border-radius: 19px; background: var(--panel); box-shadow: 0 20px 55px rgba(0,0,0,.12); backdrop-filter: blur(16px); transition: .25s; }.feature-card:hover { border-color: rgba(142,216,255,.4); transform: translateY(-5px); }.feature-large { grid-row: span 2; }.feature-icon { display: grid; width: 40px; height: 40px; margin-bottom: 30px; place-items: center; border-radius: 12px; color: var(--accent); background: rgba(142,216,255,.12); font-size: 20px; }.feature-card h3 { margin: 0 0 8px; font: 600 20px "Space Grotesk", sans-serif; }.feature-card p { margin: 0; color: var(--muted); font-size: 13px; }.feature-card a { display: inline-block; margin-top: 22px; color: var(--accent); font-size: 13px; text-decoration: none; }
.workflow-section { padding-top: 50px; }.workflow { display: grid; grid-template-columns: 1fr 70px 1fr 70px 1fr; align-items: center; }.workflow-step { display: flex; gap: 16px; }.workflow-step > span { color: var(--accent); font: 700 13px "Space Grotesk", sans-serif; }.workflow-step h3 { margin: 0 0 6px; font: 600 18px "Space Grotesk", sans-serif; }.workflow-step p { margin: 0; color: var(--muted); font-size: 13px; }.workflow-line { height: 1px; background: linear-gradient(90deg, var(--accent), rgba(142,216,255,.1)); }
.capability-section { padding-top: 25px; }.capability-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 15px; }.capability-card { min-height: 245px; padding: 25px; border: 1px solid var(--line); border-radius: 19px; background: linear-gradient(145deg, rgba(142,216,255,.1), rgba(158,131,255,.08)); }.capability-number { color: var(--accent); font: 700 13px "Space Grotesk", sans-serif; }.capability-card h3 { margin: 35px 0 8px; font: 600 21px "Space Grotesk", sans-serif; }.capability-card p { margin: 0; color: var(--muted); font-size: 13px; }.capability-tags { display: flex; flex-wrap: wrap; gap: 7px; margin-top: 23px; }.capability-tags span { padding: 5px 9px; border: 1px solid rgba(142,216,255,.2); border-radius: 20px; color: var(--accent); background: rgba(142,216,255,.08); font-size: 11px; }
.principles-panel { display: grid; grid-template-columns: 1.2fr .8fr; gap: 60px; align-items: center; padding: 45px; border: 1px solid var(--line); border-radius: 24px; background: rgba(17,29,61,.45); }.principles-panel h2 { margin: 0 0 13px; font: 600 clamp(30px,4vw,50px)/1.05 "Space Grotesk", sans-serif; letter-spacing: -.07em; }.principles-panel p:not(.eyebrow) { max-width: 580px; margin: 0; color: var(--muted); }.principle-list { display: grid; gap: 12px; }.principle-list div { display: flex; align-items: center; gap: 14px; padding: 14px 0; border-bottom: 1px solid var(--line); }.principle-list strong { color: var(--accent); font: 700 12px "Space Grotesk", sans-serif; }.principle-list span { color: var(--ink); font-size: 14px; }
.faq-list { display: grid; gap: 10px; max-width: 800px; }.faq-list details { padding: 18px 20px; border: 1px solid var(--line); border-radius: 14px; background: rgba(17,29,61,.48); }.faq-list summary { cursor: pointer; font: 600 16px "Space Grotesk", sans-serif; }.faq-list p { max-width: 650px; margin: 12px 0 0; color: var(--muted); font-size: 14px; }
.final-cta { display: flex; align-items: center; justify-content: space-between; margin: 70px 0; padding: 45px; border: 1px solid var(--line); border-radius: 24px; background: linear-gradient(110deg, rgba(93,169,255,.15), rgba(158,131,255,.13)); }.final-cta .eyebrow { margin-bottom: 8px; }.final-cta h2 { margin: 0; font-size: 35px; }footer { display: flex; justify-content: space-between; padding: 0 0 28px; color: rgba(220,230,255,.6); font-size: 12px; }
.newsletter-section { padding-top: 0; }
.newsletter-panel { display: grid; grid-template-columns: minmax(0, .9fr) minmax(0, 1fr); align-items: center; gap: 38px; padding: 32px; border: 1px solid var(--line); border-radius: 22px; background: var(--panel); box-shadow: 0 20px 55px rgba(0,0,0,.12); backdrop-filter: blur(16px); }
.newsletter-copy h2 { margin: 0 0 12px; font: 600 clamp(28px, 4vw, 42px)/1.08 "Space Grotesk", sans-serif; }
.newsletter-copy > p:last-child { max-width: 380px; margin: 0; color: var(--muted); }
#mlb2-46388045.ml-form-embedContainer { display: block !important; width: 100% !important; }
#mlb2-46388045 .ml-form-align-center { display: block !important; text-align: left !important; }
#mlb2-46388045 .ml-form-embedWrapper.embedForm { display: block !important; width: 100%; max-width: none; background: transparent; border: 0; }
#mlb2-46388045 .ml-form-embedBody, #mlb2-46388045 .ml-form-successBody { padding: 0 !important; }
#mlb2-46388045 .ml-form-fieldRow { margin: 0 0 14px !important; }
#mlb2-46388045 .ml-form-fieldRow input[type="email"] { width: 100% !important; min-height: 48px; padding: 12px 14px !important; color: var(--ink) !important; background: rgba(12,24,55,.8) !important; border: 1px solid var(--line) !important; border-radius: 10px !important; font: inherit !important; box-sizing: border-box !important; }
#mlb2-46388045 .ml-form-fieldRow input[type="email"]::placeholder { color: var(--muted); }
#mlb2-46388045 .ml-form-checkboxRow { float: none !important; margin: 0 0 14px !important; }
#mlb2-46388045 .ml-form-checkboxRow .newsletter-consent { display: flex; align-items: flex-start; gap: 9px; min-height: auto; padding: 0; }
#mlb2-46388045 .ml-form-checkboxRow input[type="checkbox"] { position: static !important; z-index: auto !important; width: 16px; height: 16px; margin: 2px 0 0 !important; opacity: 1 !important; accent-color: var(--accent-strong); flex: 0 0 auto; }
#mlb2-46388045 .ml-form-checkboxRow .label-description, #mlb2-46388045 .ml-form-checkboxRow .label-description p { margin: 0 !important; color: var(--muted) !important; font-size: 12px !important; line-height: 1.5 !important; }
#mlb2-46388045 .ml-form-recaptcha { clear: both; float: none !important; margin: 0 0 14px; }
#mlb2-46388045 .ml-form-embedSubmit { float: none !important; margin: 0 !important; width: 100%; }
#mlb2-46388045 .ml-form-embedSubmit button { width: 100% !important; min-height: 48px; padding: 12px 16px !important; color: #122550 !important; background: var(--accent) !important; border: 0 !important; border-radius: 10px !important; font: inherit !important; font-weight: 700 !important; cursor: pointer; }
#mlb2-46388045 .ml-form-embedSubmit button:hover { background: #b8ecff !important; }
#mlb2-46388045 .ml-form-successContent h4 { margin: 0 0 7px; color: var(--ink); font: 600 18px "Space Grotesk", sans-serif; }
#mlb2-46388045 .ml-form-successContent p { margin: 0; color: var(--muted); font-size: 13px; line-height: 1.6; }
.newsletter-sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0,0,0,0); white-space: nowrap; border: 0; }
.newsletter-panel .ml-form-embedSubmit button:focus-visible, .newsletter-panel input:focus-visible { outline: 3px solid rgba(142,216,255,.75); outline-offset: 3px; }
@keyframes float { 50% { transform: translateY(-12px) scale(1.03); } }@keyframes card-float { 50% { transform: rotate(1deg) translateY(-8px); } }@keyframes drift { from { transform: translateX(0); } to { transform: translateX(calc(100vw + 430px)); } }
@media (max-width: 800px) { .newsletter-panel { grid-template-columns: 1fr; gap: 24px; padding: 25px; } }
@media (max-width: 800px) { .overview-nav, main, footer { width: min(100% - 32px, 580px); }.overview-nav { padding: 16px 0; }.overview-nav nav { gap: 10px; }.overview-nav nav a:not(.nav-cta) { display: none; }.overview-hero { display: block; min-height: auto; padding: 48px 0 62px; }.hero-copy h1 { font-size: clamp(42px, 13vw, 68px); }.hero-lede { margin-bottom: 24px; font-size: 16px; }.preview-wrap { margin: 52px 4px 0; }.preview-card { transform: rotate(0); padding: 20px; }.preview-location { margin: 42px 0 25px; }.preview-location strong { font-size: 36px; }.section { padding: 62px 0; }.section-heading { margin-bottom: 26px; }.section-heading h2, .final-cta h2 { font-size: clamp(30px, 9vw, 44px); }.feature-grid { grid-template-columns: 1fr 1fr; gap: 10px; }.feature-card { min-height: 210px; padding: 18px; }.feature-card h3 { font-size: 18px; }.feature-icon { margin-bottom: 22px; }.feature-large { grid-column: span 2; grid-row: auto; }.workflow { grid-template-columns: 1fr; gap: 21px; }.workflow-line { width: 1px; height: 22px; margin-left: 7px; }.capability-grid, .principles-panel { grid-template-columns: 1fr; }.capability-card { min-height: 0; padding: 20px; }.capability-card h3 { margin-top: 25px; }.principles-panel { gap: 26px; padding: 28px 20px; }.faq-list details { padding: 16px; }.final-cta { align-items: flex-start; flex-direction: column; gap: 22px; margin: 46px 0; padding: 26px 20px; }footer { align-items: flex-start; flex-direction: column; gap: 8px; } }
@media (max-width: 480px) { .overview-nav, main, footer { width: min(100% - 24px, 420px); }.overview-brand { font-size: 21px; }.nav-cta { padding: 8px 10px; font-size: 13px; }.hero-actions { align-items: flex-start; flex-direction: column; gap: 14px; }.primary-button { width: 100%; justify-content: center; }.trust-row { display: grid; gap: 9px; }.feature-grid { grid-template-columns: 1fr; }.feature-large { grid-column: auto; }.feature-card { min-height: 0; }.preview-temp strong { font-size: 68px; }.preview-temp b { font-size: 40px; }.preview-stats { gap: 6px; }.preview-stats b { font-size: 12px; }.workflow-step { gap: 11px; }.section { padding: 52px 0; } }