/* ─── Reset & Base ─── */
    *, *::before, *::after {
        margin: 0;
        padding: 0;
        box-sizing: border-box;
    }

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

    body {
        overflow-x: hidden;
    }

    img {
        display: block;
        max-width: 100%;
    }

    ::selection {
        background-color: rgba(13, 148, 136, 0.15);
        color: #134e4a;
    }

    /* ─── Scroll Reveal ─── */
    @media (prefers-reduced-motion: no-preference) {
        .reveal {
            opacity: 0;
            transform: translateY(24px);
            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.revealed {
            opacity: 1;
            transform: translateY(0);
        }

        .reveal:nth-child(2) { transition-delay: 0.1s; }
        .reveal:nth-child(3) { transition-delay: 0.2s; }
        .reveal:nth-child(4) { transition-delay: 0.3s; }
    }

    /* ─── Hero eyebrow animation ─── */
    @media (prefers-reduced-motion: no-preference) {
        .hero-eyebrow {
            animation: fadeSlideDown 0.8s cubic-bezier(0.25, 0.46, 0.45, 0.94) forwards;
        }

        @keyframes fadeSlideDown {
            from {
                opacity: 0;
                transform: translateY(-12px);
            }
            to {
                opacity: 1;
                transform: translateY(0);
            }
        }
    }

    /* ─── Navbar ─── */
    #navbar {
        background: transparent;
    }

    #navbar.scrolled {
        background: rgba(248, 250, 252, 0.95);
        backdrop-filter: blur(12px);
        -webkit-backdrop-filter: blur(12px);
        box-shadow: 0 1px 0 rgba(148, 163, 184, 0.15);
    }

    #navbar.scrolled .nav-logo {
        color: #0f172a;
    }

    /* ─── Mobile Menu ─── */
    #mobile-menu.open {
        opacity: 1;
        pointer-events: all;
    }

    #mobile-menu.open .mobile-menu-link {
        animation: mobileLinkIn 0.4s cubic-bezier(0.25, 0.46, 0.45, 0.94) forwards;
        opacity: 0;
    }

    #mobile-menu.open .mobile-menu-link:nth-child(1) { animation-delay: 0.1s; }
    #mobile-menu.open .mobile-menu-link:nth-child(2) { animation-delay: 0.18s; }
    #mobile-menu.open .mobile-menu-link:nth-child(3) { animation-delay: 0.26s; }
    #mobile-menu.open .mobile-menu-link:nth-child(4) { animation-delay: 0.34s; }

    @keyframes mobileLinkIn {
        from {
            opacity: 0;
            transform: translateY(16px);
        }
        to {
            opacity: 1;
            transform: translateY(0);
        }
    }

    /* ─── Hamburger ─── */
    .menu-line-1 {
        transform-origin: center;
    }

    .menu-line-2 {
        transform-origin: center;
    }

    body.menu-open .menu-line-1 {
        transform: translateY(5px) rotate(45deg);
    }

    body.menu-open .menu-line-2 {
        transform: translateY(-5px) rotate(-45deg);
    }

    /* ─── Subtle hover on cards ─── */
    .group:hover .group-hover\:scale-105 {
        transform: scale(1.05);
    }

    /* ─── Focus styles ─── */
    a:focus-visible,
    button:focus-visible {
        outline: 2px solid #0d9488;
        outline-offset: 2px;
        border-radius: 2px;
    }

    /* ─── Print ─── */
    @media print {
        nav, #mobile-menu, iframe {
            display: none;
        }
        body {
            color: #000;
            background: #fff;
        }
    }