/* ═══════════════════════════════════════════════════════════
   Le Pignondor — base.css
   Reset, CSS custom properties, typography base.
   ═══════════════════════════════════════════════════════════ */

/* ── Reset ──────────────────────────────────────────────── */
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
html { scroll-behavior: smooth; -webkit-text-size-adjust: 100%; }
body { -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; }
img, picture, video, canvas, svg { max-width: 100%; }
img { display: block; }
input, button, textarea, select { font: inherit; }
button { cursor: pointer; }
a { color: inherit; text-decoration: none; }
ul, ol { list-style: none; }
table { border-collapse: collapse; }

/* ── Custom Properties ──────────────────────────────────── */
:root {
    /* Palette */
    --c-bg:              #1A1D23;
    --c-surface:         #242830;
    --c-text:            #F0EDE6;
    --c-text-dim:        #A09B92;
    --c-accent:          #C9A84C;
    --c-accent-hover:    #DABB5E;
    --c-accent-sec:      #2E5A3A;
    --c-accent-sec-text: #3A7A4E;
    --c-border:          #2F343C;
    --c-white:           #FFFFFF;
    --c-error:           #C4463A;

    /* Typography */
    --f-heading: 'Playfair Display', Georgia, 'Times New Roman', serif;
    --f-body:    'DM Sans', 'Helvetica Neue', Arial, sans-serif;

    /* Spacing */
    --s-4:  0.25rem;
    --s-8:  0.5rem;
    --s-12: 0.75rem;
    --s-16: 1rem;
    --s-24: 1.5rem;
    --s-32: 2rem;
    --s-40: 2.5rem;
    --s-48: 3rem;
    --s-56: 3.5rem;
    --s-64: 4rem;
    --s-80: 5rem;
    --s-96: 6rem;

    /* Layout */
    --max-w:    1180px;
    --header-h: 72px;
    --dur:      280ms;
    --ease:     cubic-bezier(0.4, 0, 0.2, 1);

    /* Border Radius (crisp — mechanical cycling precision) */
    --r-sm: 2px;
    --r-md: 4px;
    --r-lg: 6px;
}

/* ── Body ───────────────────────────────────────────────── */
body {
    font-family: var(--f-body);
    font-size: 1rem;
    font-weight: 400;
    line-height: 1.7;
    color: var(--c-text);
    background: var(--c-bg);
    overflow-wrap: break-word;
    word-break: break-word;
}

/* ── Typography ─────────────────────────────────────────── */
h1, h2, h3, h4, h5, h6 {
    font-family: var(--f-heading);
    line-height: 1.15;
    color: var(--c-text);
}

h1 {
    font-weight: 600;
    font-size: clamp(2.25rem, 5vw, 3.75rem);
    line-height: 1.08;
}

h2 {
    font-weight: 500;
    font-size: clamp(1.625rem, 3vw, 2.25rem);
}

h3 {
    font-weight: 500;
    font-size: 1.25rem;
}

h1 em, h2 em {
    font-style: italic;
    font-weight: 500;
}

p { margin-bottom: var(--s-16); }
p:last-child { margin-bottom: 0; }

a:not(.btn-primary):not(.btn-secondary):not(.btn-tertiary) {
    color: var(--c-accent);
    transition: color var(--dur) var(--ease);
}
a:not(.btn-primary):not(.btn-secondary):not(.btn-tertiary):hover {
    color: var(--c-accent-hover);
}

/* Hero link override — rule 3 */
.hero a:not(.btn-primary):not(.btn-secondary):not(.btn-tertiary) {
    color: var(--c-accent);
}

strong, b { font-weight: 600; }

/* ── Selection ──────────────────────────────────────────── */
::selection {
    background: var(--c-accent);
    color: var(--c-bg);
}