/* =====================================================================
   Base — reset + typography
   No frameworks. Minimal reset. Body sets the document tone.
   ===================================================================== */

*, *::before, *::after {
    box-sizing: border-box;
    margin: 0;
    padding: 0;
    -webkit-tap-highlight-color: transparent;
}

html {
    font-size: 16px;
    -webkit-text-size-adjust: 100%;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    scroll-behavior: auto;
    text-rendering: optimizeLegibility;
}

html.is-locked,
html.is-locked body { overflow: hidden; }

body {
    font-family: var(--aie-body);
    font-weight: 400;
    font-size: var(--aie-text-md);
    line-height: var(--aie-leading-loose);
    color: var(--aie-text);
    background: var(--aie-bg);
    overflow-x: hidden;
    text-underline-offset: 0.2em;
    text-decoration-thickness: 1px;
}

img, svg, video {
    display: block;
    max-width: 100%;
    height: auto;
}

button {
    font: inherit;
    color: inherit;
    background: none;
    border: 0;
    cursor: pointer;
}

ul, ol { list-style: none; }

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

::selection {
    background: var(--aie-gold);
    color: var(--aie-noir);
}

*:focus { outline: 0; }
*:focus-visible {
    outline: 1px solid var(--aie-gold);
    outline-offset: 4px;
    border-radius: var(--aie-radius);
}

hr {
    border: 0;
    border-top: 1px solid var(--aie-hair);
    margin: var(--aie-space-6) 0;
}

/* =====================================================================
   Typography
   ===================================================================== */

h1, h2, h3, h4 {
    font-family: var(--aie-display);
    font-weight: 400;
    line-height: var(--aie-leading-snug);
    letter-spacing: var(--aie-tracking-normal);
    color: var(--aie-heading);
    text-wrap: balance;
}

h1 {
    font-size: var(--aie-text-3xl);
    line-height: var(--aie-leading-tight);
    letter-spacing: var(--aie-tracking-tight);
}

h2 {
    font-size: var(--aie-text-2xl);
    line-height: var(--aie-leading-tight);
    letter-spacing: var(--aie-tracking-tight);
}

h3 {
    font-size: var(--aie-text-xl);
    line-height: var(--aie-leading-snug);
}

h4, h5, h6 {
    font-family: var(--aie-body);
    font-size: var(--aie-text-xs);
    font-weight: 500;
    letter-spacing: var(--aie-tracking-wider);
    text-transform: uppercase;
    color: var(--aie-text-soft);
}

p {
    font-family: var(--aie-body);
    max-width: 68ch;
    color: var(--aie-text);
    text-wrap: pretty;
}

p + p { margin-top: var(--aie-space-4); }

strong {
    font-weight: 500;
    color: var(--aie-heading);
}

em { font-style: italic; }

small {
    font-size: var(--aie-text-sm);
    color: var(--aie-text-soft);
}

abbr[title] {
    text-decoration: none;
    border-bottom: 1px dotted currentColor;
    cursor: help;
}

blockquote {
    font-family: var(--aie-display);
    font-weight: 400;
    font-size: var(--aie-text-2xl);
    line-height: var(--aie-leading-snug);
    color: var(--aie-heading);
    max-width: 28ch;
    text-wrap: balance;
}

/* Prose blocks (used inside content areas) */
.aie-prose {
    color: var(--aie-text);
    line-height: var(--aie-leading-loose);
    max-width: 68ch;
}
.aie-prose > * + * { margin-top: var(--aie-space-4); }
.aie-prose h2,
.aie-prose h3 {
    margin-top: var(--aie-space-7);
    margin-bottom: var(--aie-space-3);
}
.aie-prose h2 { font-size: var(--aie-text-2xl); }
.aie-prose h3 { font-size: var(--aie-text-xl); }
.aie-prose ul,
.aie-prose ol {
    padding-left: 1.5rem;
    list-style: disc;
    color: var(--aie-text);
}
.aie-prose ol { list-style: decimal; }
.aie-prose li + li { margin-top: var(--aie-space-2); }
.aie-prose a {
    color: var(--aie-accent);
    border-bottom: 1px solid var(--aie-gold);
    padding-bottom: 1px;
    transition: color var(--aie-dur) var(--aie-ease);
}
.aie-prose a:hover { color: var(--aie-gold-dark); }