/* ── Jet Fuel Coffee — Custom Styles ── */

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

/* ── Smooth scroll offset for fixed nav ── */
html {
    scroll-padding-top: 80px;
}

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

/* ── Image aspect ratio fallback ── */
img {
    max-width: 100%;
    height: auto;
}

/* ── Subtle page transition on load ── */
body {
    animation: fadeInPage 0.6s ease-out;
}

@keyframes fadeInPage {
    from { opacity: 0; }
    to   { opacity: 1; }
}

/* ── Tablet adjustments ── */
@media (max-width: 768px) {
    .hero-grid {
        grid-template-rows: auto 1fr;
        min-height: auto;
    }

    #top {
        min-height: 100vh;
    }

    .menu-item:hover {
        padding-left: 0;
    }
}

/* ── Print styles ── */
@media print {
    nav, .mobile-menu, .marquee-track, #experience, footer {
        display: none;
    }

    body {
        color: #000;
        background: #fff;
    }

    a {
        text-decoration: none;
        color: #000;
    }
}