/* ── Base & Utilities ── */
    *, *::before, *::after {
        box-sizing: border-box;
    }

    html {
        scroll-behavior: smooth;
        -webkit-font-smoothing: antialiased;
        -moz-osx-font-smoothing: grayscale;
    }

    body {
        margin: 0;
        overflow-x: hidden;
    }

    ::selection {
        background: rgba(200, 149, 108, 0.3);
        color: #f5f0f7;
    }

    /* ── Scroll Reveal (progressive enhancement) ── */
    @media (prefers-reduced-motion: no-preference) {
        .reveal-down,
        .reveal-left,
        .reveal-right,
        .reveal-up {
            opacity: 0;
            transition: opacity 0.8s cubic-bezier(0.25, 0.46, 0.45, 0.94),
                        transform 0.8s cubic-bezier(0.25, 0.46, 0.45, 0.94);
        }

        .reveal-down {
            transform: translateY(30px);
        }

        .reveal-left {
            transform: translateX(-40px);
        }

        .reveal-right {
            transform: translateX(40px);
        }

        .reveal-up {
            transform: translateY(40px);
        }

        .reveal-visible {
            opacity: 1;
            transform: translate(0, 0);
        }
    }

    /* Fallback: ensure content is visible if JS is disabled */
    .reveal-down,
    .reveal-left,
    .reveal-right,
    .reveal-up {
        opacity: 1;
        transform: none;
    }

    /* ── Navigation ── */
    .nav-link {
        position: relative;
    }

    .nav-link::after {
        content: '';
        position: absolute;
        bottom: -4px;
        left: 0;
        width: 0;
        height: 1px;
        background: currentColor;
        transition: width 0.3s ease;
    }

    .nav-link:hover::after {
        width: 100%;
    }

    /* ── Mobile Menu ── */
    .mobile-link {
        position: relative;
    }

    #mobile-menu {
        transform: translateY(-10px);
        opacity: 0;
        visibility: hidden;
        transition: all 0.3s ease;
    }

    #mobile-menu.open {
        transform: translateY(0);
        opacity: 1;
        visibility: visible;
    }

    /* ── Menu Tabs ── */
    .menu-tab {
        background: transparent;
        color: #d6bfd9;
        border: none;
        cursor: pointer;
    }

    .menu-tab.active {
        background: #7B2D5B;
        color: #f5f0f7;
    }

    .menu-tab:hover:not(.active) {
        background: rgba(123, 45, 91, 0.3);
        color: #f5f0f7;
    }

    /* ── Button Focus States ── */
    a:focus-visible,
    button:focus-visible,
    input:focus-visible,
    textarea:focus-visible,
    select:focus-visible {
        outline: 2px solid #C8956C;
        outline-offset: 2px;
    }

    /* ── Custom Scrollbar ── */
    ::-webkit-scrollbar {
        width: 8px;
    }

    ::-webkit-scrollbar-track {
        background: #240a17;
    }

    ::-webkit-scrollbar-thumb {
        background: #5a1c3d;
        border-radius: 4px;
    }

    ::-webkit-scrollbar-thumb:hover {
        background: #7B2D5B;
    }

    /* ── Image Lazy Load Fallback ── */
    img {
        max-width: 100%;
        height: auto;
    }

    /* ── Print Styles ── */
    @media print {
        body {
            background: white;
            color: black;
        }

        .no-print {
            display: none;
        }
    }