:root { --navy:#071b3a; --navy-2:#0b2e5f; --ink:#102744; --muted:#617189; --line:#dbe4ed; --blue:#0c5caa; --aqua:#10d1ce; --aqua-soft:#d9fbf6; --gold:#ffb51b; --paper:#f6f9fc; --white:#fff; --shadow:0 24px 64px rgba(9,35,75,.14); }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { margin:0; min-width:320px; background:var(--white); color:var(--ink); font-family:Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif; line-height:1.55; }
a { color:inherit; }
.shell { width:min(1180px, calc(100% - 56px)); margin:auto; }
.skip-link { position:fixed; z-index:100; top:12px; left:12px; padding:10px 14px; transform:translateY(-160%); background:var(--white); border-radius:8px; font-weight:700; text-decoration:none; box-shadow:var(--shadow); transition:transform .2s; }
.skip-link:focus { transform:translateY(0); }
.site-header { position:sticky; z-index:10; top:0; border-bottom:1px solid rgba(15,53,91,.1); background:rgba(255,255,255,.92); backdrop-filter:blur(16px); }
.navigation { display:flex; min-height:80px; align-items:center; justify-content:space-between; gap:28px; }
.brand { display:flex; width:170px; align-items:center; }
.brand img { display:block; width:100%; height:auto; }
.main-nav { display:flex; align-items:center; gap:28px; font-size:.91rem; font-weight:700; }
.main-nav a { color:#294767; text-decoration:none; }
.main-nav a:hover,.main-nav a:focus { color:var(--blue); }
.main-nav .nav-cta { padding:9px 16px; border:1px solid #bdd1df; border-radius:99px; color:var(--navy); }
.hero { position:relative; overflow:hidden; padding:104px 0 112px; background:linear-gradient(118deg,#f2fbfb 0%,#fff 49%,#f5f9fd 100%); }
.hero::before { position:absolute; width:640px; height:640px; top:-390px; right:-100px; border-radius:50%; background:radial-gradient(circle,rgba(16,209,206,.17),rgba(16,209,206,0) 68%); content:""; }
.hero-grid { position:relative; display:grid; grid-template-columns:minmax(0,1.02fr) minmax(420px,.86fr); gap:66px; align-items:center; }
.kicker,.eyebrow { display:flex; align-items:center; gap:10px; margin:0 0 17px; color:var(--blue); font-size:.74rem; font-weight:800; letter-spacing:.16em; text-transform:uppercase; }
.kicker span { width:30px; height:2px; background:var(--aqua); }
h1,h2,h3,p { margin-top:0; }
h1,h2,h3 { letter-spacing:-.045em; line-height:1.06; }
h1 { max-width:680px; margin-bottom:25px; color:var(--navy); font-size:clamp(3rem,6.1vw,5.45rem); }
h2 { font-size:clamp(2.25rem,4vw,4rem); }
h3 { font-size:1.22rem; }
.hero-text { max-width:610px; margin-bottom:31px; color:#50647b; font-size:1.16rem; }
.hero-actions { display:flex; align-items:center; flex-wrap:wrap; gap:24px; }
.button { display:inline-flex; align-items:center; justify-content:center; gap:14px; min-height:52px; padding:13px 21px; border-radius:999px; font-size:.94rem; font-weight:800; text-decoration:none; transition:transform .2s, background .2s, color .2s; }
.button:hover,.button:focus { transform:translateY(-2px); }
.button--primary { background:var(--navy); color:var(--white); box-shadow:0 10px 24px rgba(7,27,58,.17); }
.button--primary:hover,.button--primary:focus { background:var(--blue); }
.text-link { color:var(--navy); font-weight:800; text-decoration:none; }
.text-link span { color:var(--blue); font-size:1.15rem; }
.availability { display:flex; align-items:center; gap:9px; margin:29px 0 0; color:#718096; font-size:.83rem; }
.pulse { width:8px; height:8px; border-radius:50%; background:var(--gold); box-shadow:0 0 0 5px rgba(255,181,27,.17); }
.hero-visual { position:relative; min-height:510px; border-radius:28px; overflow:hidden; background:linear-gradient(145deg,#092e60,#071b3a 74%); box-shadow:var(--shadow); }
.visual-grid { position:absolute; inset:0; opacity:.22; background-image:linear-gradient(rgba(255,255,255,.18) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.18) 1px,transparent 1px); background-size:36px 36px; mask-image:linear-gradient(to bottom,black,transparent); }
.orbit { position:absolute; border:1px solid rgba(70,234,228,.33); border-radius:50%; }
.orbit--one { width:420px; height:420px; top:-170px; right:-170px; }
.orbit--two { width:310px; height:310px; bottom:-190px; left:-125px; border-color:rgba(255,181,27,.35); }
.preview-window { position:absolute; top:68px; right:44px; bottom:64px; left:44px; overflow:hidden; border:1px solid rgba(255,255,255,.32); border-radius:18px; background:rgba(248,252,255,.98); box-shadow:0 26px 45px rgba(0,0,0,.22); }
.window-bar { display:flex; align-items:center; gap:6px; height:39px; padding:0 14px; border-bottom:1px solid #e1e9f0; background:#f5f8fb; }
.window-bar span { width:7px; height:7px; border-radius:50%; background:#b6c5d2; }
.window-bar span:first-child { background:#ffbd35; }.window-bar span:nth-child(2) { background:#69d7ca; }
.window-bar i { margin-left:8px; color:#6c7e91; font-size:.68rem; font-style:normal; }
.window-body { padding:31px 31px 24px; }
.window-label,.card-overline { margin-bottom:12px; color:#168d9e; font-size:.65rem; font-weight:900; letter-spacing:.13em; text-transform:uppercase; }
.window-head { display:flex; justify-content:space-between; gap:14px; padding-bottom:25px; border-bottom:1px solid #e6edf3; }
.window-head b { display:block; color:var(--navy); font-size:1.42rem; letter-spacing:-.04em; }.window-head small { display:block; margin-top:1px; color:#76879a; font-size:.78rem; }.window-head em { align-self:start; padding:5px 8px; border-radius:99px; background:#fff3d6; color:#986509; font-size:.61rem; font-style:normal; font-weight:800; text-transform:uppercase; }
.rule-list { display:grid; gap:11px; margin-top:23px; }.rule-list>div { display:flex; align-items:center; gap:12px; padding:9px; border:1px solid #e5edf2; border-radius:10px; }.rule-icon { display:grid; width:32px; height:32px; place-items:center; border-radius:8px; font-size:.85rem; font-weight:900; }.rule-icon--a { background:#dbf7f4; color:#057f86; }.rule-icon--b { background:#e4eefc; color:#1256a4; }.rule-icon--c { background:#fff1d8; color:#bd7710; }.rule-list p { flex:1; margin:0; line-height:1.25; }.rule-list b,.rule-list small { display:block; }.rule-list b { color:#24415e; font-size:.8rem; }.rule-list small { color:#8797a8; font-size:.69rem; }.rule-list i { color:#a0afbc; font-size:.65rem; font-style:normal; }
.visual-tag { position:absolute; right:18px; bottom:21px; display:flex; align-items:center; gap:7px; padding:9px 13px; border:1px solid rgba(255,255,255,.16); border-radius:99px; background:rgba(7,27,58,.8); color:#fff; font-size:.72rem; font-weight:700; backdrop-filter:blur(8px); }.visual-tag span { color:var(--aqua); }
.intro-band { border-top:1px solid #e5edf2; border-bottom:1px solid #e5edf2; background:#fff; }.intro-band__inner { display:flex; align-items:center; justify-content:space-between; gap:30px; padding:27px 0; }.intro-band p { max-width:720px; margin:0; color:#47617d; font-size:1rem; font-weight:650; }.intro-band span { color:var(--aqua); font-size:1.5rem; }
.section { padding:126px 0; }.section-heading { display:grid; grid-template-columns:1fr .9fr; gap:70px; align-items:end; margin-bottom:54px; }.section-heading p:last-child { max-width:450px; margin:0; color:var(--muted); font-size:1.04rem; }
.feature { background:var(--paper); }.feature-layout { display:grid; grid-template-columns:.93fr 1.07fr; gap:20px; }.plugin-card { display:flex; min-height:400px; flex-direction:column; justify-content:space-between; padding:31px; border-radius:18px; background:linear-gradient(155deg,#104c8c,#082b5c 76%); color:#fff; box-shadow:0 20px 35px rgba(9,56,110,.19); }.plugin-card__top,.plugin-card__foot { display:flex; align-items:center; justify-content:space-between; }.card-symbol { display:grid; width:50px; height:50px; place-items:center; border-radius:15px; background:var(--aqua); color:var(--navy); font-size:1.7rem; font-weight:900; }.status { padding:6px 10px; border:1px solid rgba(255,255,255,.3); border-radius:99px; color:#d9f9f6; font-size:.67rem; font-weight:800; letter-spacing:.08em; text-transform:uppercase; }.plugin-card h3 { margin-bottom:15px; font-size:2.2rem; }.plugin-card p:not(.card-overline) { max-width:310px; margin-bottom:0; color:#d3e5f7; }.plugin-card .card-overline { color:#62e5df; }.plugin-card__foot { padding-top:22px; border-top:1px solid rgba(255,255,255,.18); color:#bcd4ec; font-size:.82rem; }.plugin-card__foot span:last-child { color:var(--aqua); font-size:1.35rem; }
.question-grid { display:grid; gap:20px; }.question-card { position:relative; min-height:120px; padding:24px 68px 22px 25px; border:1px solid #e0e8ef; border-radius:16px; background:#fff; }.question-card>span { position:absolute; top:23px; right:25px; color:#afbdc9; font-size:.73rem; font-weight:800; }.question-card h3 { margin-bottom:8px; color:var(--navy); }.question-card p { max-width:470px; margin:0; color:var(--muted); font-size:.91rem; }.disclaimer { max-width:810px; margin:31px auto 0; color:#718197; font-size:.78rem; text-align:center; }
.future { background:var(--navy); color:#fff; }.future-grid { display:grid; grid-template-columns:.9fr 1.1fr; gap:100px; align-items:center; }.eyebrow--light { color:#5ce7df; }.future-copy h2 { margin-bottom:25px; }.future-copy>p:last-child { max-width:460px; margin-bottom:0; color:#bfd0e1; font-size:1.02rem; }.future-topics { display:grid; grid-template-columns:repeat(3,1fr); gap:13px; }.future-topics>div { min-height:220px; padding:24px 19px; border:1px solid rgba(196,226,246,.17); border-radius:14px; background:rgba(255,255,255,.04); }.topic-icon { display:grid; width:37px; height:37px; place-items:center; margin-bottom:39px; border-radius:50%; background:#173c6d; color:var(--aqua); font-size:1.2rem; }.future-topics h3 { margin-bottom:9px; font-size:1.08rem; letter-spacing:-.025em; }.future-topics p { margin:0; color:#b7cbdd; font-size:.82rem; }
.approach { background:#fff; }.approach-lead { display:grid; grid-template-columns:180px minmax(0,690px); gap:45px; margin-bottom:75px; }.approach-lead h2 { color:var(--navy); }.principles { display:grid; grid-template-columns:repeat(3,1fr); gap:45px; }.principles article { padding-top:21px; border-top:2px solid #c6e5e6; }.principles span { display:block; margin-bottom:38px; color:#15989d; font-size:.73rem; font-weight:900; }.principles h3 { margin-bottom:12px; color:var(--navy); }.principles p { max-width:270px; margin-bottom:0; color:var(--muted); font-size:.92rem; }
.contact-section { padding:0 0 104px; background:#fff; }.contact-panel { display:grid; grid-template-columns:1fr auto; gap:70px; padding:65px; border-radius:23px; background:linear-gradient(120deg,#09254e,#0e4079); color:#fff; box-shadow:var(--shadow); }.contact-copy h2 { margin-bottom:17px; }.contact-copy>p:last-of-type { max-width:530px; margin-bottom:27px; color:#c8d9e9; }.button--light { background:#fff; color:var(--navy); }.button--light:hover,.button--light:focus { background:var(--aqua); }.contact-details { display:grid; align-content:center; min-width:240px; gap:10px; font-style:normal; }.contact-details>a { color:#fff; font-size:1.05rem; font-weight:800; text-decoration-color:#59ded9; text-underline-offset:4px; }.contact-details p { margin:10px 0 0; color:#b8cde2; font-size:.88rem; line-height:1.7; }
.site-footer { padding:33px 0; border-top:1px solid #e1e8ee; background:#fbfcfd; }.footer-inner { display:grid; grid-template-columns:auto 1fr auto auto; align-items:center; gap:23px; color:#708196; font-size:.77rem; }.footer-brand { color:var(--navy); font-size:1.16rem; font-weight:900; letter-spacing:-.06em; text-decoration:none; }.footer-inner p { margin:0; }.footer-links { display:flex; gap:18px; }.footer-links a { color:#405c78; text-decoration:none; }.footer-links a:hover,.footer-links a:focus { text-decoration:underline; }.copyright { text-align:right; }
.legal-page { background:linear-gradient(135deg,#f2fafb,#f8fbff 52%,#edf5fb); }.legal-wrap { width:min(780px,calc(100% - 40px)); margin:0 auto; padding:76px 0 100px; }.legal-wrap h1 { margin-bottom:30px; font-size:clamp(2.7rem,6vw,4.4rem); }.legal-wrap h2 { margin:40px 0 12px; font-size:1.45rem; }.legal-wrap>p { color:#53677f; }.back-link { display:inline-block; margin-bottom:64px; color:var(--blue); font-weight:800; text-decoration:none; }.back-link:hover,.back-link:focus { text-decoration:underline; }.legal-notice { margin:0 0 34px; padding:21px 23px; border-left:4px solid var(--gold); border-radius:0 12px 12px 0; background:#fff7e6; color:#735319; }.legal-notice strong { color:#563b08; }
@media (max-width:900px) { .hero-grid,.section-heading,.future-grid { grid-template-columns:1fr; }.hero-grid { gap:54px; }.hero-visual { max-width:600px; width:100%; }.section-heading { gap:22px; }.section-heading p:last-child { max-width:600px; }.future-grid { gap:55px; }.approach-lead { grid-template-columns:1fr; gap:17px; margin-bottom:52px; }.contact-panel { gap:42px; }.footer-inner { grid-template-columns:auto 1fr auto; }.copyright { grid-column:2/4; text-align:left; } }
@media (max-width:650px) { .shell { width:min(100% - 36px,560px); }.navigation { min-height:68px; }.brand { width:143px; }.main-nav { gap:16px; font-size:.8rem; }.main-nav a:not(.nav-cta) { display:none; }.main-nav .nav-cta { padding:8px 13px; }.hero { padding:69px 0 76px; }.hero-grid { gap:43px; }.hero-text { font-size:1.02rem; }.hero-visual { min-height:410px; border-radius:20px; }.preview-window { top:42px; right:19px; bottom:50px; left:19px; }.window-body { padding:25px 19px; }.window-head b { font-size:1.17rem; }.visual-tag { right:12px; bottom:14px; font-size:.65rem; }.intro-band__inner { padding:21px 0; }.intro-band p { font-size:.91rem; }.section { padding:78px 0; }.feature-layout,.principles { grid-template-columns:1fr; }.plugin-card { min-height:330px; }.future-topics { grid-template-columns:1fr; gap:10px; }.future-topics>div { display:grid; min-height:0; grid-template-columns:50px 1fr; column-gap:12px; padding:18px; }.topic-icon { grid-row:span 2; margin:0; }.future-topics h3 { align-self:end; margin:0; }.future-topics p { align-self:start; }.contact-section { padding-bottom:70px; }.contact-panel { grid-template-columns:1fr; padding:39px 28px; border-radius:17px; }.contact-details { min-width:0; }.footer-inner { grid-template-columns:1fr auto; gap:14px; }.footer-inner>p:nth-child(2) { grid-column:1/3; }.footer-links { justify-self:end; }.copyright { grid-column:1/3; } }
@media (prefers-reduced-motion:reduce) { html { scroll-behavior:auto; } *,*::before,*::after { transition-duration:.01ms !important; animation-duration:.01ms !important; animation-iteration-count:1 !important; } }