*,
*::before,
*::after {
    box-sizing: border-box;
}

html {
    min-height: 100%;
    scroll-behavior: smooth;
}

body {
    margin: 0;
    min-height: 100vh;
    background: var(--ink-950);
    color: var(--text-main);
    font-family: var(--font-sans);
    line-height: 1.55;
    -webkit-font-smoothing: antialiased;
    text-rendering: optimizeLegibility;
}

body[data-app-surface="marketing"],
body[data-app-surface="auth"],
body[data-app-surface="dashboard"] {
    background:
        linear-gradient(180deg, rgba(23, 25, 29, 0.96), var(--ink-950) 42%),
        var(--ink-950);
}

body[data-app-surface="studio"] {
    overflow-x: hidden;
    background: var(--ink-950);
}

a {
    color: inherit;
    text-decoration: none;
}

button,
input,
select {
    font: inherit;
}

button {
    cursor: pointer;
}

img,
svg {
    display: block;
}

ul {
    margin: 0;
    padding: 0;
    list-style: none;
}

h1,
h2,
h3,
p {
    margin-top: 0;
}

.container,
.page-container {
    width: min(1180px, calc(100% - 48px));
    margin: 0 auto;
}

.app-page {
    padding: calc(72px + var(--space-10)) 0 var(--space-16);
}

.eyebrow {
    color: var(--accent);
    font-size: 0.76rem;
    font-weight: 800;
    letter-spacing: 0.06em;
    text-transform: uppercase;
}

.page-title {
    margin: var(--space-3) 0 var(--space-4);
    max-width: 820px;
    color: var(--text-main);
    font-size: clamp(2.5rem, 6vw, 4.9rem);
    line-height: 0.96;
    letter-spacing: 0;
}

.page-copy {
    max-width: 680px;
    color: var(--text-soft);
    font-size: clamp(1rem, 1.6vw, 1.15rem);
}

.section-title {
    margin-bottom: var(--space-3);
    color: var(--text-main);
    font-size: clamp(1.75rem, 3vw, 2.5rem);
    line-height: 1.05;
}

.muted {
    color: var(--muted);
}

@media (max-width: 760px) {
    .container,
    .page-container {
        width: min(100% - 32px, 1180px);
    }

    .app-page {
        padding-top: 88px;
        padding-bottom: 96px;
    }
}

@media (prefers-reduced-motion: reduce) {
    *,
    *::before,
    *::after {
        animation-duration: 1ms !important;
        animation-iteration-count: 1 !important;
        scroll-behavior: auto !important;
        transition-duration: 1ms !important;
    }
}

/* Shared editorial hierarchy: keep controls compact and headings readable. */
.page-title, .section-title {
    font-family: var(--font-display);
    font-weight: 400;
    line-height: 1.12;
    text-wrap: balance;
}
:focus-visible { outline: 2px solid var(--accent); outline-offset: 4px; }
@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } }