*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:#0c1723;color:#edf3fa;font-family:system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",Arial,sans-serif;font-size:16px;line-height:1.55}a{color:inherit}a:focus-visible,button:focus-visible,input:focus-visible,summary:focus-visible{outline:3px solid #f8bd24;outline-offset:3px}.skip{position:absolute;top:-100px;left:12px;background:#fff;color:#111;padding:10px;z-index:5}.skip:focus{top:10px}.page{max-width:1260px;margin:auto;padding:0 26px}.site-header{padding:25px 0;display:flex;align-items:center;justify-content:space-between;gap:16px;border-bottom:1px solid #34475c}.brand{text-decoration:none;display:inline-flex;align-items:center;gap:12px;font-size:20px;letter-spacing:-.4px;color:#f8bd24}.brand-icon{font-size:32px;line-height:1}.brand-white{color:#fff}.brand small{color:#fff;font-size:16px;font-weight:750}.nav-right{display:flex;align-items:center;gap:20px}.nav-right a{font-size:13px;font-weight:700;text-decoration:none;color:#d3deea}.nav-right a:hover{color:#fff}.beta{font-weight:900;color:#0c1723;background:#ff7c47;border-radius:20px;padding:5px 11px;font-size:11px;letter-spacing:.05em}.hero{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(330px,.85fr);gap:52px;align-items:center;padding:72px 0 82px}.eyebrow{font-size:12px;font-weight:900;letter-spacing:.13em;color:#ff7c47;margin:0 0 16px}.hero h1{font-size:clamp(40px,4.8vw,68px);line-height:1.04;letter-spacing:-.05em;margin:0 0 24px;max-width:630px;color:#fff}.hero h1 span{color:#f8bd24}.lead{font-size:20px;max-width:615px;color:#d8e3f0;margin:0 0 17px}.hero-promise{font-size:15px;color:#aebfd2;margin:0 0 28px}.hero-tags{display:flex;flex-wrap:wrap;gap:8px}.hero-tags span{padding:8px 12px;color:#dce8f5;border:1px solid #43536a;background:#142638;border-radius:22px;font-weight:650;font-size:13px}.login{background:#1a2b3f;border:1px solid #4e6580;border-radius:19px;padding:28px;box-shadow:0 25px 75px #0005}.login-heading{display:flex;gap:14px;align-items:center}.login-lock{display:grid;place-items:center;border-radius:12px;background:#273f59;border:1px solid #506783;color:#f8bd24;width:47px;height:47px;font-size:27px}.mini-label{font-size:11px;color:#ff7c47;font-weight:900;letter-spacing:.1em;margin:0}.login h2{font-size:22px;margin:0;color:#fff}.login>p{color:#bac9db;font-size:14px;margin:16px 0 23px}.login form{display:flex;flex-direction:column;gap:8px}.login label{color:#f2f6fa;font-size:13px;font-weight:750}.login input{width:100%;height:49px;padding:0 14px;background:#101e2e;border:1px solid #4b5e76;border-radius:9px;color:white;font:inherit;margin-bottom:10px}.login input::placeholder{color:#7d90a5}.password-label{display:flex;align-items:center;justify-content:space-between;gap:8px}.password-label a,.account-note a{font-size:12px;color:#f8bd24;text-decoration:none;font-weight:700}.login button,.cta-primary{background:#f8bd24;color:#102033;border:0;border-radius:10px;padding:15px 17px;min-height:51px;font-size:13px;font-weight:900;text-align:center;cursor:pointer;display:flex;align-items:center;justify-content:center;gap:10px;text-decoration:none}.login button:hover,.cta-primary:hover{background:#ffcd52}.login .account-note{text-align:center;font-size:13px;margin:18px 0 8px;color:#d2dded}.login .small-note{margin:0;font-size:12px;text-align:center;color:#9eb2c8}.section{padding:75px 0;border-top:1px solid #304255}.section-heading{max-width:820px;margin:0 0 35px}.section h2,.bottom-cta h2{color:#fff;font-size:clamp(29px,3vw,42px);line-height:1.14;letter-spacing:-.035em;margin:0 0 14px}.section-heading>p:last-child{color:#bac9d9;font-size:16px;margin:0}.screenshot-figure{margin:0;background:#152438;padding:10px;border:1px solid #476077;border-radius:16px;box-shadow:0 20px 60px #0003}.screenshot-figure img{width:100%;height:auto;display:block;border-radius:9px}.screenshot-figure figcaption,.shot-detail figcaption{font-size:12px;color:#9badc1;text-align:center;margin:10px 0 4px}.features{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:13px}.feature{border:1px solid #394e66;background:#142539;padding:25px 20px;border-radius:14px;min-height:235px}.feature-symbol{font-size:25px;color:#f8bd24;display:inline-grid;place-items:center;background:#273b50;width:45px;height:45px;border-radius:11px;margin-bottom:17px}.feature h3,.step-grid h3{color:#fff;font-size:18px;margin:0 0 10px}.feature p,.step-grid p{color:#b7c8db;font-size:14px;line-height:1.65;margin:0}.image-explain{display:grid;grid-template-columns:.73fr 1.27fr;align-items:center;gap:42px}.image-explain-copy p:not(.eyebrow){color:#bac9d9}.shot-detail{background:#17283b;border:1px solid #435a74;border-radius:14px;padding:12px;margin:0}.shot-detail img{display:block;width:100%;border-radius:8px}.step-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:15px}.step-grid article{border:1px solid #394e65;border-radius:15px;background:#142539;padding:27px}.step-number{color:#ff7c47;font-size:23px;font-weight:900;margin-bottom:15px}.mobile-story{display:flex;justify-content:center;align-items:center;gap:90px}.mobile-frame{width:245px;flex:0 0 245px;border:7px solid #455b74;border-radius:28px;overflow:hidden;box-shadow:0 20px 50px #0007;background:#091826}.mobile-frame img{display:block;width:100%;height:auto}.mobile-copy{max-width:550px}.mobile-copy p:not(.eyebrow){color:#bac9d9}.faq-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px}.faq-grid details{border:1px solid #3b4e65;border-radius:11px;background:#17283b;align-self:start;overflow:hidden}.faq-grid summary{color:#edf3fb;padding:19px 20px;cursor:pointer;font-weight:750;list-style:none;display:flex;gap:10px;align-items:center;justify-content:space-between}.faq-grid summary::-webkit-details-marker{display:none}.faq-grid summary:after{content:'+';font-size:22px;color:#f8bd24}.faq-grid details[open] summary:after{content:'−'}.faq-grid details p{color:#b9cadd;margin:0;padding:0 20px 20px;font-size:14px}.bottom-cta{background:#1a3045;border:1px solid #5c7184;border-radius:20px;padding:42px;display:flex;align-items:center;justify-content:space-between;gap:35px;margin:35px 0 60px}.bottom-cta p:not(.eyebrow){color:#afc2d6;font-size:14px;max-width:610px}.cta-actions{display:grid;min-width:230px;gap:12px}.cta-secondary{text-align:center;padding:13px 18px;text-decoration:none;border:1px solid #788da4;border-radius:10px;font-weight:800;font-size:13px}.cta-secondary:hover{background:#344e69}.footer{border-top:1px solid #34485f;padding:30px 0 45px;display:flex;flex-wrap:wrap;gap:17px;justify-content:space-between;color:#93a7be;font-size:12px}.footer strong{color:#d7e4f1}.footer a{color:#f8bd24;text-decoration:none}@media(max-width:1020px){.hero{gap:25px}.features{grid-template-columns:repeat(2,1fr)}.image-explain{grid-template-columns:1fr}.mobile-story{gap:45px}}@media(max-width:760px){.page{padding:0 17px}.site-header{padding:19px 0}.brand{font-size:15px}.brand-icon{font-size:26px}.brand small{font-size:14px}.nav-right{gap:8px}.nav-right a{font-size:11px}.beta{font-size:10px;padding:4px 7px}.hero{grid-template-columns:1fr;padding:40px 0 50px;gap:29px}.hero h1{font-size:43px}.lead{font-size:17px}.login{padding:22px}.section{padding:50px 0}.features,.step-grid,.faq-grid{grid-template-columns:1fr}.feature{min-height:auto}.mobile-story{flex-direction:column;gap:25px;align-items:flex-start}.mobile-frame{width:220px;flex-basis:auto;align-self:center}.bottom-cta{padding:25px;flex-direction:column;align-items:stretch;margin-bottom:40px}.footer{flex-direction:column;gap:7px}.section h2{font-size:32px}}@media(max-width:375px){.brand{font-size:13px}.brand small{font-size:12px}.nav-right .beta{display:none}.hero h1{font-size:37px}}@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
/* Alternating explanations keep long educational copy easy to scan. */
.image-explain.flip { grid-template-columns:1.27fr .73fr; }
.image-explain.flip .image-explain-copy { order:2; }
.image-explain.flip .shot-detail { order:1; }
.image-explain-copy strong { color:#f8bd24; font-weight:750; }
.hero .lead strong { font-weight:700; color:#f1f6fd; }
.hero .hero-promise strong { color:#f8bd24; }
.image-explain-copy p:not(.eyebrow) { font-size:16px; line-height:1.75; }
.shot-detail img { background:#091521; }
@media(max-width:1020px) { .image-explain.flip { grid-template-columns:1fr; }.image-explain.flip .image-explain-copy,.image-explain.flip .shot-detail { order:initial; } }