/* Reset & Basics */
*, *::before, *::after { box-sizing: border-box; }
body, h1, h2, h3, h4, p, ul, ol, figure { margin: 0; padding: 0; }
body {
    background-color: var(--bg);
    color: var(--fg);
    font-family: var(--font-sans);
    line-height: 1.6;
    -webkit-font-smoothing: antialiased;
}
a { color: var(--fg); text-decoration: none; }
img { max-width: 100%; display: block; height: auto; }
.container { max-width: var(--container-max); margin: 0 auto; padding: 0 var(--space-4); }
table { width: 100%; border-collapse: collapse; margin-bottom: var(--space-8); }
th, td { border: 1px solid var(--surface-border); padding: var(--space-4); text-align: left; }
th { background: var(--surface); font-family: var(--font-display); }

/* Typography */
h1, h2, h3, h4 { font-family: var(--font-display); line-height: 1.1; font-weight: 700; }
h1 { font-size: var(--text-5xl); text-transform: uppercase; letter-spacing: -0.03em; margin-bottom: var(--space-8); }
h2 { font-size: var(--text-4xl); margin-bottom: var(--space-6); letter-spacing: -0.02em; }
h3 { font-size: var(--text-2xl); margin-bottom: var(--space-4); }
p { margin-bottom: var(--space-4); font-size: var(--text-lg); color: var(--fg-muted); }
.hl { color: var(--accent); }

/* Header & Nav */
.site-header { border-bottom: 2px solid var(--surface-border); padding: var(--space-4) 0; position: sticky; top: 0; background: rgba(10,10,10,0.9); z-index: 100; backdrop-filter: blur(10px); }
.header-inner { display: flex; justify-content: space-between; align-items: center; }
.logo { font-family: var(--font-display); font-size: var(--text-2xl); font-weight: 700; letter-spacing: -0.05em; }
.main-nav { display: flex; gap: var(--space-8); }
.main-nav a { font-size: var(--text-sm); text-transform: uppercase; font-weight: 600; letter-spacing: 0.1em; transition: color 0.2s; }
.main-nav a:hover, .main-nav a.active { color: var(--accent); }

/* Footer */
.site-footer { border-top: 2px solid var(--surface-border); padding: var(--space-16) 0 var(--space-4); margin-top: var(--space-24); background: var(--surface); }
.footer-grid { display: grid; grid-template-columns: 2fr repeat(4, 1fr); gap: var(--space-8); margin-bottom: var(--space-12); }
.footer-title { font-size: var(--text-xl); margin-bottom: var(--space-4); }
.cluster-title { font-size: var(--text-sm); text-transform: uppercase; color: var(--fg); margin-bottom: var(--space-4); font-family: var(--font-display); letter-spacing: 0.05em; }
.link-cluster { display: flex; flex-direction: column; gap: var(--space-2); }
.link-cluster a { font-size: var(--text-sm); color: var(--fg-muted); transition: color 0.2s; }
.link-cluster a:hover { color: var(--accent); }
.footer-bottom { border-top: 1px solid var(--surface-border); padding-top: var(--space-4); font-size: var(--text-sm); color: var(--fg-muted); }

/* Buttons & Inputs */
.btn { display: inline-block; background: var(--accent); color: #fff; padding: var(--space-4) var(--space-8); font-family: var(--font-display); font-weight: 700; text-transform: uppercase; letter-spacing: 0.05em; transition: background 0.2s; border: none; cursor: pointer; }
.btn:hover { background: var(--accent-hover); }
input, select { width: 100%; padding: var(--space-4); background: var(--bg); border: 1px solid var(--surface-border); color: var(--fg); font-family: var(--font-sans); margin-bottom: var(--space-4); }
label { display: block; margin-bottom: var(--space-2); font-family: var(--font-display); font-size: var(--text-sm); text-transform: uppercase; }

/* Blocks */
.hero { padding: var(--space-24) 0; border-bottom: 1px solid var(--surface-border); }
.hero-split { display: grid; grid-template-columns: 1.5fr 1fr; gap: var(--space-12); align-items: center; }
.editorial-grid { display: grid; grid-template-columns: repeat(12, 1fr); gap: var(--space-4); margin: var(--space-16) 0; }
.col-4 { grid-column: span 4; }
.col-8 { grid-column: span 8; }
.col-12 { grid-column: span 12; }
.card { background: var(--surface); padding: var(--space-8); border: 1px solid var(--surface-border); }
.card-title { font-size: var(--text-2xl); margin-bottom: var(--space-4); }
.data-block { border-left: 4px solid var(--accent); padding-left: var(--space-4); margin-bottom: var(--space-8); }
.data-big { font-family: var(--font-display); font-size: var(--text-4xl); color: var(--fg); font-weight: 700; line-height: 1; margin-bottom: var(--space-2); }
.faq-item { border-bottom: 1px solid var(--surface-border); padding: var(--space-4) 0; }
.faq-q { font-family: var(--font-display); font-size: var(--text-xl); margin-bottom: var(--space-2); color: var(--fg); }

/* Responsive */
@media (max-width: 1024px) {
    h1 { font-size: var(--text-4xl); }
    .hero-split { grid-template-columns: 1fr; }
    .editorial-grid { grid-template-columns: 1fr; }
    .col-4, .col-8 { grid-column: span 1; }
    .footer-grid { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 768px) {
    h1 { font-size: var(--text-3xl); }
    .main-nav { display: none; }
    .footer-grid { grid-template-columns: 1fr; }
}