:root {
    --annam-color-primary: #5a3500;
    --annam-color-primary-hover: #402500;
    --annam-color-accent: #8a5a24;
    --annam-color-paper: #fffbf2;
    --annam-color-surface: #fffdf8;
    --annam-color-ink: #30251d;
    --annam-color-muted: #695f56;
    --annam-color-line: rgba(90, 53, 0, .2);
    --annam-color-overlay: rgba(35, 24, 14, .76);
    --annam-font-display: "Cormorant Garamond", Georgia, serif;
    --annam-font-body: "Cormorant Garamond", Georgia, serif;
    --annam-container: 1360px;
    --annam-content-width: 1240px;
    --annam-gutter: 28px;
    --annam-section-space: clamp(72px, 8vw, 112px);
    --annam-space-1: 8px;
    --annam-space-2: 12px;
    --annam-space-3: 18px;
    --annam-space-4: 24px;
    --annam-space-5: 32px;
    --annam-space-6: 48px;
    --annam-border: 1px solid var(--annam-color-line);
    --annam-radius: 0;
    --annam-shadow: 0 18px 48px rgba(68, 43, 16, .08);
    --annam-motion: 220ms ease;
    --annam-focus: 0 0 0 3px rgba(90, 53, 0, .28);

    /* Backward-compatible aliases for exported page styles. */
    --annam-ink: var(--annam-color-ink);
    --annam-brown: var(--annam-color-primary);
    --annam-red: var(--annam-color-primary);
    --annam-line: var(--annam-color-line);
    --annam-paper: var(--annam-color-paper);

    /* CozyStay/Elementor aliases copied from the index.html baseline. */
    --primary-color: var(--annam-color-primary);
    --primary-color-semi: rgba(90, 53, 0, .3);
    --secondary-color: var(--annam-color-primary);
    --light-bg-color: var(--annam-color-paper);
    --dark-text-color: var(--annam-color-primary);
    --btn-bg-hover: var(--annam-color-primary);
    --heading-font: "Cormorant Garamond";
    --body-font: "Cormorant Garamond";
    --secondary-font: "Cormorant Garamond";
    --nav-font: "Cormorant Garamond";
}

@media (max-width: 767px) {
    :root {
        --annam-gutter: 20px;
        --annam-section-space: 64px;
    }
}
