:root { --features-ink:#0b2a44; --features-muted:#647b8e; --features-orange:#ff6a2b; --features-cream:#fdf8f1; }
* { box-sizing:border-box; }
body.features-page { margin:0; background:#fff; color:var(--features-ink); font-family:Satoshi,system-ui,sans-serif; }
.features-page main a { text-decoration:none; }
.features-page main a:focus-visible { outline:3px solid #ffaf86; outline-offset:4px; }
.features-page h1,.features-page h2,.features-page h3,.features-page p { margin-top:0; }
.features-page h1,.features-page h2,.features-page h3 { letter-spacing:-.045em; }
.features-page p { line-height:1.65; }
.features-wrap { width:min(1200px,calc(100% - 48px)); margin-inline:auto; }
.features-eyebrow { display:block; color:#d95a24; font-size:.71rem; font-weight:850; letter-spacing:.18em; text-transform:uppercase; }
.features-hero { padding:92px 0 84px; background:var(--features-cream); text-align:center; }
.features-hero h1 { max-width:910px; margin:16px auto 18px; font-size:clamp(3rem,5.6vw,5.15rem); line-height:1.08; font-weight:850; text-wrap:balance; }
.features-hero h1 em { color:var(--features-orange); font-style:normal; }
.features-hero p { max-width:700px; margin:0 auto 26px; color:#60788d; font-size:1.08rem; }
.features-primary-link { display:inline-flex; align-items:center; justify-content:center; gap:12px; min-width:245px; min-height:58px; padding:0 28px; border-radius:11px; background:#0b2a44; color:#fff; font-size:1rem; font-weight:850; transition:background .2s,transform .2s; }
.features-primary-link:hover { background:#174467; transform:translateY(-2px); }
.features-pill-row { display:flex; justify-content:center; flex-wrap:wrap; gap:12px; max-width:930px; margin:35px auto 0; }
.features-pill-row span { display:inline-flex; align-items:center; justify-content:center; min-height:41px; padding:0 17px; border:1px solid #e3e1dc; border-radius:999px; background:#fff; color:#3b6079; font-size:.77rem; font-weight:800; box-shadow:0 5px 15px rgba(16,48,72,.04); }
.features-catalog { padding:91px 0 105px; background:#fff; }
.features-section-heading { max-width:825px; margin:0 auto 58px; text-align:center; }
.features-section-heading h2 { margin:14px 0 10px; font-size:clamp(2.25rem,4vw,3.55rem); line-height:1.14; text-wrap:balance; }
.features-section-heading p { margin-bottom:0; color:var(--features-muted); font-size:1rem; }
.features-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); column-gap:60px; row-gap:43px; }
.feature-item { min-width:0; }
.feature-glyph { display:inline-grid; place-items:center; width:38px; height:38px; margin-bottom:15px; color:#ed742b; font-size:1.75rem; font-weight:500; line-height:1; }
.glyph-1 { color:#4eafbd; }.glyph-2 { color:#8f7bd2; }.glyph-3 { color:#efad31; }.glyph-4 { color:#6a9cbb; }
.feature-item h3 { margin:0 0 7px; font-size:1.05rem; line-height:1.3; }
.feature-item p { margin:0; color:#63778a; font-size:.91rem; line-height:1.6; }
.features-focus { padding:89px 0; background:#0b2a44; color:#fff; }
.features-focus-grid { display:grid; grid-template-columns:.9fr 1.1fr; align-items:center; gap:72px; }
.features-focus .features-eyebrow { color:#ffab7b; }
.features-focus h2 { max-width:600px; margin:15px 0 18px; font-size:clamp(2.2rem,3.5vw,3.25rem); line-height:1.14; text-wrap:balance; }
.features-focus-copy>p { max-width:510px; color:#c5daea; }
.features-focus ul { display:grid; gap:12px; margin:23px 0 27px; padding:0; list-style:none; }
.features-focus li { position:relative; padding-left:25px; color:#edf6fb; font-size:.91rem; }
.features-focus li::before { content:"✓"; position:absolute; left:0; top:0; color:#69d5ad; font-weight:900; }
.features-focus-copy>a { color:#ffae80; font-weight:850; }
.features-focus-copy>a:hover { text-decoration:underline; }
.features-illustration { position:relative; display:grid; place-items:center; min-height:410px; padding:32px; border:1px solid rgba(255,255,255,.16); border-radius:26px; background:radial-gradient(circle at 73% 22%,rgba(255,112,53,.3),transparent 37%),radial-gradient(circle at 28% 80%,rgba(71,162,210,.34),transparent 43%),#123b5d; }
.features-illustration::before,.features-illustration::after { content:""; position:absolute; width:130px; height:130px; border:1px solid rgba(255,255,255,.2); border-radius:50%; }
.features-illustration::before { top:18px; right:25px; }.features-illustration::after { bottom:12px; left:18px; width:74px; height:74px; }
.illustration-window { position:relative; z-index:1; width:min(100%,490px); border-radius:16px; overflow:hidden; background:#fff; color:var(--features-ink); box-shadow:0 28px 60px rgba(0,10,25,.23); transform:rotate(-2deg); }
.illustration-window-bar { display:flex; align-items:center; gap:5px; min-height:35px; padding:0 15px; border-bottom:1px solid #e4edf2; background:#f7fafc; }
.illustration-window-bar i { display:block; width:7px; height:7px; border-radius:50%; background:#ff8b6f; }.illustration-window-bar i:nth-child(2) { background:#f7c970; }.illustration-window-bar i:nth-child(3) { background:#88d7ae; }
.illustration-window-bar span { margin-left:9px; color:#7a93a5; font-size:.65rem; font-weight:700; }
.illustration-window-body { padding:27px; }
.illustration-window-body>small { display:block; color:#80a1b6; font-size:.58rem; font-weight:850; letter-spacing:.16em; }
.illustration-window-body>strong { display:block; margin:8px 0 19px; font-size:1.2rem; letter-spacing:-.035em; }
.illustration-progress { height:9px; margin-bottom:19px; border-radius:999px; background:#e5edf2; overflow:hidden; }.illustration-progress span { display:block; width:68%; height:100%; border-radius:inherit; background:var(--features-orange); }
.illustration-person { display:flex; align-items:center; gap:10px; padding:12px 0; border-top:1px solid #e7eef3; }
.illustration-person>b { display:grid; place-items:center; width:34px; height:34px; flex:none; border-radius:50%; background:#e5f1f9; color:#397294; font-size:.62rem; }
.illustration-person span { flex:1; min-width:0; }.illustration-person span strong,.illustration-person span small { display:block; }.illustration-person span strong { font-size:.77rem; }.illustration-person span small { margin-top:2px; color:#879cab; font-size:.65rem; }.illustration-person em { color:#e45b25; font-size:.75rem; font-style:normal; font-weight:850; }
.features-detail { padding:94px 0 107px; background:#f5f9fc; }
.detail-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:22px; }
.detail-grid article { padding:28px; border:1px solid #dce8f0; border-radius:17px; background:#fff; }
.detail-number { display:block; margin-bottom:28px; color:#ed6d2c; font-size:.72rem; font-weight:900; letter-spacing:.13em; }
.detail-grid h3 { margin-bottom:10px; font-size:1.14rem; }.detail-grid p { margin:0; color:var(--features-muted); font-size:.91rem; }
.features-cta { padding:87px 0 94px; background:#fdf8f1; text-align:center; }.features-cta h2 { max-width:650px; margin:14px auto 13px; font-size:clamp(2.2rem,4vw,3.5rem); line-height:1.15; text-wrap:balance; }.features-cta p { margin-bottom:25px; color:var(--features-muted); }
@media(max-width:900px) { .features-grid { grid-template-columns:repeat(2,minmax(0,1fr)); gap:36px; }.features-focus-grid { gap:32px; }.features-illustration { min-height:360px; padding:20px; } }
@media(max-width:650px) { .features-wrap { width:min(100% - 32px,540px); }.features-hero { padding:68px 0 63px; }.features-hero h1 { font-size:clamp(2.5rem,10vw,3.7rem); }.features-hero p { font-size:.98rem; }.features-primary-link { min-width:0; width:100%; }.features-pill-row { gap:8px; }.features-pill-row span { min-height:35px; padding:0 11px; font-size:.69rem; }.features-catalog,.features-detail { padding:72px 0; }.features-section-heading { margin-bottom:40px; }.features-grid,.detail-grid,.features-focus-grid { grid-template-columns:1fr; }.features-grid { row-gap:30px; }.features-focus { padding:72px 0; }.features-illustration { min-height:330px; }.features-cta { padding:73px 0; } }
@media(prefers-reduced-motion:reduce) { .features-page main a { transition:none; } }