:root {
/* Brand */
--brand: #2b5cff;           /* primary */
--brand-ink: #0f1b40;       /* dark text color */
--accent: #22c55e;          /* pass badge */
--danger: #ef4444;          /* fail badge */

/* Neutrals */
--bg: #fbfcff;
--bg-elev: #ffffff;
--ink: #0b1220;
--ink-dim: #5b6475;
--line: #e6e8f2;

/* Effects */
--shadow-sm: 0 1px 2px rgba(15, 27, 64, 0.06);
--shadow-md: 0 6px 20px rgba(15, 27, 64, 0.08);
--radius: 16px;
--radius-sm: 12px;
--radius-lg: 28px;
--maxw: 1100px;
}

@media (prefers-color-scheme: dark) {
:root{
--bg: #0a0f1a;
--bg-elev: #0f1626;
--ink: #e8ecf8;
--ink-dim: #a9b3c7;
--line: #1f2a44;
--brand-ink: #c7d2fe;
--shadow-sm: none;
--shadow-md: none;
}
}

*, *::before, *::after { box-sizing: border-box; }
html, body { height: 100%; }
body {
margin: 0;
font-family: Inter, system-ui, -apple-system, Segoe UI, Roboto, Helvetica, Arial, "Apple Color Emoji", "Segoe UI Emoji";
background: var(--bg);
color: var(--ink);
line-height: 1.6;
}
a { color: var(--brand); text-decoration: none; }
a:hover { text-decoration: underline; }
.container { max-width: var(--maxw); margin: 0 auto; padding: 0 20px; }

/* Header */
header.site {
position: sticky; top: 0; z-index: 30;
backdrop-filter: saturate(180%) blur(10px);
background: color-mix(in oklab, var(--bg) 85%, transparent);
border-bottom: 1px solid var(--line);
}
.nav {
display: flex; align-items: center; justify-content: space-between;
padding: 16px 0;
}
.brand { display: inline-flex; align-items: center; gap: 10px; font-weight: 700; font-size: 1.15rem; color: var(--ink); }
.brand .logo { width: 34px; height: 34px; border-radius: 10px; background: linear-gradient(135deg, var(--brand) 0%, #7aa2ff 100%); box-shadow: var(--shadow-sm); display: grid; place-items: center; color: white; font-weight: 800; }
.nav-links { display: flex; gap: 18px; align-items: center; }
.nav-links a { color: var(--ink); font-weight: 500; }
.nav-cta { background: var(--brand); color: #fff; padding: 10px 14px; border-radius: 10px; box-shadow: var(--shadow-sm); }
.nav-cta:hover { filter: brightness(0.95); text-decoration: none; }

/* Hero */
.hero { padding: 56px 0 24px; }
.hero .wrap {
display: grid; grid-template-columns: 1.2fr 1fr; gap: 32px; align-items: center;
}
.hero h1 { font-size: clamp(1.9rem, 3.6vw, 3rem); line-height: 1.15; margin: 0 0 12px; letter-spacing: -0.02em; }
.hero p.lead { font-size: clamp(1rem, 1.6vw, 1.15rem); color: var(--ink-dim); margin: 0 0 22px; }

.searchbar { display: flex; gap: 10px; align-items: center; }
.searchbar input {
flex: 1; padding: 14px 14px; border-radius: 12px; border: 1px solid var(--line);
background: var(--bg-elev); color: var(--ink);
outline: none; box-shadow: var(--shadow-sm);
}
.searchbar button { padding: 12px 16px; border-radius: 12px; border: 1px solid var(--line); background: var(--bg-elev); color: var(--ink); font-weight: 600; }
.searchbar button.primary { background: var(--brand); color: #fff; border-color: transparent; }

.hero-card { background: var(--bg-elev); border: 1px solid var(--line); border-radius: var(--radius-lg); padding: 18px; box-shadow: var(--shadow-md); }
.hero-card h2 { margin: 0 0 8px; font-size: 1rem; color: var(--ink-dim); }
.hero-stats { display: grid; grid-template-columns: repeat(3, 1fr); gap: 12px; }
.stat { background: color-mix(in oklab, var(--bg) 92%, transparent); border: 1px solid var(--line); border-radius: var(--radius); padding: 12px; }
.stat .kpi { font-size: 1.25rem; font-weight: 700; }
.badge { display: inline-flex; align-items: center; gap: 6px; font-size: .8rem; padding: 4px 8px; border-radius: 999px; border: 1px solid var(--line); }
.badge.pass { background: color-mix(in oklab, var(--accent) 12%, transparent); color: color-mix(in oklab, var(--accent) 70%, black); border-color: color-mix(in oklab, var(--accent) 35%, var(--line)); }
.badge.fail { background: color-mix(in oklab, var(--danger) 12%, transparent); color: color-mix(in oklab, var(--danger) 70%, black); border-color: color-mix(in oklab, var(--danger) 35%, var(--line)); }

/* Sections */
section { padding: 40px 0; }
.section-head { display: flex; align-items: baseline; justify-content: space-between; gap: 16px; margin-bottom: 18px; }
.section-head h2 { margin: 0; font-size: 1.35rem; letter-spacing: -0.01em; }
.section-head a { font-weight: 600; }

/* Featured companies */
.grid { display: grid; grid-template-columns: repeat(12, 1fr); gap: 16px; }
.card { grid-column: span 4; background: var(--bg-elev); border: 1px solid var(--line); border-radius: var(--radius); padding: 16px; box-shadow: var(--shadow-sm); transition: transform .15s ease, box-shadow .15s ease; }
.card:hover { transform: translateY(-3px); box-shadow: var(--shadow-md); }
.card .row { display: flex; align-items: center; justify-content: space-between; gap: 10px; }
.chip { padding: 6px 10px; border-radius: 999px; background: color-mix(in oklab, var(--brand) 12%, transparent); color: var(--brand-ink); font-weight: 600; font-size: .8rem; border: 1px solid color-mix(in oklab, var(--brand) 35%, var(--line)); }
.kpis { display: grid; grid-template-columns: repeat(3, 1fr); gap: 10px; margin-top: 12px; }
.kpis div { background: color-mix(in oklab, var(--bg) 92%, transparent); border: 1px solid var(--line); border-radius: 10px; padding: 10px; text-align: center; }
.kpis .label { display: block; font-size: .75rem; color: var(--ink-dim); }
.kpis .value { font-weight: 700; }

/* News list */
.news-list { display: grid; grid-template-columns: repeat(2, 1fr); gap: 16px; }
.news-item { background: var(--bg-elev); border: 1px solid var(--line); border-radius: var(--radius); padding: 16px; box-shadow: var(--shadow-sm); }
.news-item h3 { margin: 0 0 8px; font-size: 1rem; }
.news-item time { color: var(--ink-dim); font-size: .85rem; }

/* CTA / Newsletter */
.cta { background: linear-gradient(135deg, color-mix(in oklab, var(--brand) 6%, var(--bg)) 0%, color-mix(in oklab, var(--brand) 14%, var(--bg)) 100%); border: 1px solid var(--line); border-radius: var(--radius-lg); padding: 22px; box-shadow: var(--shadow-md); text-align: center; }
.cta h3 { margin: 0 0 8px; }
.cta p { margin: 0 0 16px; color: var(--ink-dim); }
.cta .row { display: flex; gap: 10px; justify-content: center; }
.btn { display: inline-block; padding: 12px 16px; border-radius: 12px; border: 1px solid var(--line); background: var(--bg-elev); color: var(--ink); font-weight: 700; }
.btn.primary { background: var(--brand); color: #fff; border-color: transparent; }

/* Footer */
footer.site { border-top: 1px solid var(--line); padding: 30px 0; color: var(--ink-dim); }

/* Responsive */
@media (max-width: 960px) {
.hero .wrap { grid-template-columns: 1fr; }
.grid .card { grid-column: span 6; }
.news-list { grid-template-columns: 1fr; }
}
@media (max-width: 640px) {
.grid .card { grid-column: span 12; }
.nav-links { display: none; }
.hero { padding-top: 28px; }
}