:root { color-scheme: dark; font-family: "Segoe UI", Arial, sans-serif; background: #081116; color: #edf5f4; }
* { box-sizing: border-box; }
body { margin: 0; background: radial-gradient(circle at 90% 0, rgba(24, 114, 100, .22), transparent 34%), #081116; }
a { color: #63e6c7; }
.site-shell { width: min(1120px, calc(100% - 40px)); margin: 0 auto; }
.seo-header { display: flex; justify-content: space-between; align-items: center; gap: 20px; padding: 22px 0; border-bottom: 1px solid #26414a; }
.seo-brand { display: inline-flex; align-items: center; gap: 12px; color: #f3f8f7; font-weight: 800; text-decoration: none; }
.seo-brand img { width: 42px; height: 42px; object-fit: contain; border-radius: 6px; background: #0c171d; }
.seo-nav { display: flex; flex-wrap: wrap; gap: 16px; font-size: .92rem; }
.seo-nav a { text-decoration: none; }
.seo-hero { display: grid; grid-template-columns: 1.05fr .95fr; gap: clamp(28px, 6vw, 72px); align-items: center; padding: 78px 0 48px; }
.seo-hero h1 { margin: 0 0 18px; max-width: 16ch; font-size: clamp(2.25rem, 5vw, 4.4rem); line-height: 1.04; }
.seo-hero p { max-width: 62ch; color: #b5c8cd; font-size: 1.08rem; line-height: 1.65; }
.seo-hero img { width: 100%; max-height: 480px; object-fit: cover; border: 1px solid #31505a; border-radius: 8px; }
.eyebrow { color: #ff9b62; font-size: .78rem; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; }
.cta { display: inline-block; margin-top: 12px; padding: 13px 18px; border-radius: 7px; background: #28b89d; color: #071214; font-weight: 800; text-decoration: none; }
.seo-section { padding: 32px 0 60px; border-top: 1px solid #26414a; }
.seo-section h2 { margin-top: 0; font-size: 1.55rem; }
.feature-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; }
.feature-card { padding: 20px; border: 1px solid #29444e; border-radius: 8px; background: rgba(15, 29, 36, .8); }
.feature-card h3 { margin-top: 0; }
.feature-card p, .seo-section li { color: #b5c8cd; line-height: 1.6; }
.seo-footer { padding: 28px 0 42px; color: #9db1b7; font-size: .9rem; }
@media (max-width: 760px) { .site-shell { width: min(100% - 28px, 1120px); } .seo-header, .seo-hero { display: block; } .seo-nav { margin-top: 16px; } .seo-hero { padding-top: 48px; } .seo-hero img { margin-top: 28px; } .feature-grid { grid-template-columns: 1fr; } }