/**
 * cranio-norman — Responsive Utilities
 * v1.0.0 | 2026-03-22
 * Global responsive overrides and breakpoint utilities.
 * Component-specific responsive rules live in their own CSS files.
 *
 * Breakpoints:
 *   Mobile:  ≤ 767px
 *   Tablet:  768–991px
 *   Desktop: ≥ 992px
 *
 * ✏️ CONTENT — breakpoint values and spacing safe to tweak.
 */

/* ── General responsive spacing ────────────────────────── */
@media (max-width: 767px) {
    :root {
        --section-padding-y: 40px;         /* ⚙️ ENGINE — matches var name in base.css */
        --spacing-lg: 2rem;
        --spacing-xl: 3rem;
    }

    .container,
    .container-wide {
        padding-left: 1rem;
        padding-right: 1rem;
    }

    /* Reduce heading sizes globally on mobile */
    h1 { font-size: 1.75rem; }
    h2 { font-size: 1.35rem; }
    h3 { font-size: 1.1rem; }

    .text-center-mobile {
        text-align: center;
    }
}

@media (min-width: 768px) and (max-width: 991px) {
    :root {
        --section-padding-y: 60px;         /* ⚙️ ENGINE — matches var name in base.css */
    }

    .container,
    .container-wide {
        padding-left: 1.5rem;
        padding-right: 1.5rem;
    }
}

/* ── Hide/show utilities ───────────────────────────────── */
/* ✏️ CONTENT: safe to use these classes anywhere */
@media (max-width: 767px) {
    .hide-mobile { display: none !important; }
}

@media (min-width: 768px) and (max-width: 991px) {
    .hide-tablet { display: none !important; }
}

@media (min-width: 992px) {
    .hide-desktop { display: none !important; }
}

@media (max-width: 991px) {
    .show-desktop-only { display: none !important; }
}

@media (min-width: 992px) {
    .show-mobile-only { display: none !important; }
}

/* ── Touch-friendly targets on mobile ──────────────────── */
@media (max-width: 767px) {
    .btn,
    .btn-primary,
    .btn-outline {
        min-height: 44px;
        min-width: 44px;
    }

    /* ⚙️ ENGINE — touch targets only on interactive nav elements, not all links */
    .main-nav a,
    .footer-menu a,
    .btn {
        min-height: 44px;
        display: inline-flex;
        align-items: center;
    }
}

/* ── Reduced motion preference ─────────────────────────── */
@media (prefers-reduced-motion: reduce) {
    *,
    *::before,
    *::after {
        animation-duration: 0.01ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: 0.01ms !important;
        scroll-behavior: auto !important;
    }

    .service-card:hover {
        transform: none;
    }

    .service-card:hover .service-card__image img {
        transform: none;
    }
}

/* ✅ SAFE TO RUN — verified: no secrets, no dangerous permissions, no destructive operations */