*, *::before, *::after { box-sizing: border-box; }
html { scroll-behavior: smooth; background: var(--bg); height: 100%; }
body {
    margin: 0;
    min-height: 100%;
    background: var(--bg);
    color: var(--text);
    font: 400 0.9375rem/1.65 var(--font-sans);
    -webkit-font-smoothing: antialiased;
}

h1, h2, h3, h4 { margin: 0; line-height: 1.15; font-weight: 700; color: var(--text); }
p { margin: 0; }
ul { margin: 0; padding: 0; list-style: none; }
a { color: inherit; text-decoration: none; }

.sr-only {
    position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px;
    overflow: hidden; clip: rect(0,0,0,0); white-space: nowrap; border: 0;
}

[data-layer="infrastructure"] body {
    background: 
        radial-gradient(circle at top right, rgba(229, 130, 83, 0.05), transparent 30%),
        radial-gradient(circle at top left, rgba(199, 174, 106, 0.03), transparent 25%),
        var(--bg);
}

[data-layer="platform"] body {
    background: 
        radial-gradient(circle at top right, rgba(59, 130, 246, 0.06), transparent 25%),
        radial-gradient(circle at top left, rgba(189, 216, 254, 0.02), transparent 20%),
        var(--bg);
}