/*
 * LustreView Blinds — "Minimal Beige" colour theme.
 *
 * The six brand colours below are the only source of truth for the site palette.
 * Every page loads this file first; other stylesheets refer to these tokens.
 * The *-rgb versions are for translucent colours: rgba(var(--lv-espresso-rgb), 0.5).
 */
:root {
    /* Brand palette */
    --lv-latte: #D2B48C;      /* Latte Beige — primary accent: fills, badges, highlights */
    --lv-linen: #F5F1EA;      /* Linen — page background */
    --lv-khaki: #D7C9B8;      /* Khaki — soft surfaces, borders, text on dark */
    --lv-camel: #B2967D;      /* Camel — secondary accent */
    --lv-cocoa: #7D5A44;      /* Cocoa — accent text, links, hover states */
    --lv-espresso: #4A342A;   /* Espresso — headings, body text, dark sections */

    --lv-latte-rgb: 210, 180, 140;
    --lv-linen-rgb: 245, 241, 234;
    --lv-khaki-rgb: 215, 201, 184;
    --lv-camel-rgb: 178, 150, 125;
    --lv-cocoa-rgb: 125, 90, 68;
    --lv-espresso-rgb: 74, 52, 42;

    /* Supporting neutrals, mixed from the palette */
    --lv-cream: #FBF9F5;      /* Linen lifted towards white — cards on a Linen page */
    --lv-cream-rgb: 251, 249, 245;
    --lv-muted: #6F5E53;      /* Espresso softened — secondary/body copy on light backgrounds */
    --lv-muted-rgb: 111, 94, 83;
}

/*
 * Typography. Two families only:
 *   Display — Playfair Display: headings and editorial accents; a high-contrast serif that echoes the logo.
 *   Body    — Inter: paragraphs, navigation, buttons, forms, prices and labels.
 * Weights in use: Inter 400/500/600/700, Playfair 500/600 (+ italic). Nothing heavier than 700.
 * Every page loads both from Google Fonts with the same <link>.
 */
:root {
    --font-display: 'Playfair Display', Georgia, 'Times New Roman', serif;
    --font-body: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif;
}

html {
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    text-rendering: optimizeLegibility;
}

body {
    font-family: var(--font-body);
}

h1, h2, h3 {
    font-family: var(--font-display);
    font-weight: 600;
    letter-spacing: -0.01em;
    text-wrap: balance;
}

h4, h5, h6 {
    font-family: var(--font-body);
    font-weight: 600;
}

button, input, select, textarea {
    font: inherit;
}