/* ============================================================
   RESPONSIVE — hamburger shows at <=768px
============================================================ */
@media(max-width:1100px) {
    .about-grid {
        gap: 50px;
    }

    .services-grid {
        grid-template-columns: repeat(2, 1fr);
    }

    .gallery-masonry {
        grid-template-columns: repeat(2, 1fr);
    }

    .gallery-item:nth-child(1) {
        grid-row: span 1;
    }

    .gallery-item:nth-child(4) {
        grid-row: span 1;
    }

    .gallery-item:nth-child(7) {
        grid-column: span 1;
    }

    .footer-top {
        grid-template-columns: 1fr 1fr;
    }

    .testimonials-track {
        grid-template-columns: 1fr 1fr;
    }
}

@media(max-width:880px) {
    .about-grid {
        grid-template-columns: 1fr;
    }

    .about-img-accent {
        display: none;
    }

    .about-experience-badge {
        left: 16px;
    }

    .contact-grid {
        grid-template-columns: 1fr;
        gap: 50px;
    }

    .process-step:not(:last-child)::after {
        display: none;
    }

    .process-step {
        flex-basis: 45%;
    }
}

/* ─── 768px BREAKPOINT — hamburger becomes visible ─── */
@media(max-width:768px) {
    .container {
        padding: 0 20px;
    }

    .nav-inner {
        padding: 0 20px;
    }

    /* Hide desktop nav */
    .nav-links {
        display: none;
    }

    /* SHOW hamburger */
    .hamburger {
        display: flex;
    }

    .hero-scroll-hint {
        display: none;
    }

    .services-grid {
        grid-template-columns: 1fr;
    }

    .gallery-masonry {
        grid-template-columns: 1fr 1fr;
        grid-auto-rows: 200px;
    }

    .testimonials-track {
        grid-template-columns: 1fr;
    }

    .footer-top {
        grid-template-columns: 1fr;
        gap: 36px;
    }

    .form-row-grid {
        grid-template-columns: 1fr;
    }

    .about-pillars {
        grid-template-columns: 1fr;
    }

    .footer-bottom {
        flex-direction: column;
        text-align: center;
    }

    .footer-legal {
        justify-content: center;
    }

    #about {
        padding: 80px 0;
    }

    #services {
        padding: 80px 0;
    }

    #gallery {
        padding: 80px 0;
    }

    #testimonials {
        padding: 80px 0;
    }

    #contact {
        padding: 80px 0;
    }

    #process {
        padding: 60px 0;
    }

    .ap-cta-section {
        padding: 70px 0;
    }
}

@media(max-width:480px) {
    .gallery-masonry {
        grid-template-columns: 1fr;
        grid-auto-rows: 220px;
    }

    .hero-actions {
        flex-direction: column;
        align-items: flex-start;
    }

    .services-header {
        flex-direction: column;
        align-items: flex-start;
    }

    .gallery-header {
        flex-direction: column;
        align-items: flex-start;
    }

    .process-step {
        flex-basis: 100%;
    }

    .about-experience-badge {
        top: 16px;
    }
}

/* Breakpoints — change aspect-ratio to suit each screen size */
@media (max-width: 991px) {
    .contact-grid {
        grid-template-columns: 1fr;
        gap: 40px;
    }

    .ap-timeline::before {
        left: 24px;
    }

    .ap-tl-dot {
        left: 24px;
    }

    .ap-tl-left,
    .ap-tl-right {
        text-align: left;
        padding-left: 60px;
        padding-right: 0;
    }

    .map-wrapper {
        aspect-ratio: 16 / 7;
    }
}

@media (max-width: 767px) {
    #contact {
        padding: 70px 0;
    }

    .map-wrapper {
        aspect-ratio: 4 / 3;
    }
}

@media (max-width: 480px) {
    .map-wrapper {
        aspect-ratio: 1 / 1;
    }
}

/* ── About Page  ── */
@media(max-width:1100px) {
    .ab-team-grid {
        grid-template-columns: repeat(2, 1fr);
    }

    .ab-values-grid {
        grid-template-columns: repeat(2, 1fr);
    }

    .ab-stats-grid {
        grid-template-columns: repeat(2, 1fr);
    }

    .ab-stat-item:nth-child(2)::after {
        display: none;
    }
}

@media(max-width:880px) {
    .ab-philosophy-grid {
        grid-template-columns: 1fr;
        gap: 50px;
    }

    .ab-img-secondary {
        display: none;
    }

    .ab-img-badge {
        left: 16px;
    }

    .ab-timeline::before {
        left: 24px;
    }

    .ab-timeline-item {
        grid-template-columns: 40px 1fr;
    }

    .ab-timeline-left {
        display: none;
    }

    .ab-timeline-center {
        grid-column: 1;
        grid-row: 1;
    }

    .ab-timeline-right {
        grid-column: 2;
        grid-row: 1;
        padding-left: 24px;
        text-align: left !important;
        padding-right: 0 !important;
    }

    .ab-timeline-item.ab-flip .ab-timeline-left {
        display: none;
    }

    .ab-timeline-item.ab-flip .ab-timeline-center {
        order: 1;
    }

    .ab-timeline-item.ab-flip .ab-timeline-right {
        order: 2;
        text-align: left !important;
        padding-left: 24px !important;
        padding-right: 0 !important;
    }

    .ab-timeline-item.ab-flip .ab-timeline-left {
        order: 3;
    }

    .ab-timeline-dot {
        margin-top: 10px;
    }
}

@media(max-width:768px) {

    .ab-philosophy,
    .ab-team,
    .ab-values,
    .ab-journey,
    .ab-cta {
        padding: 80px 0;
    }

    .ab-stats-strip {
        padding: 48px 0;
    }

    .ab-team-grid {
        grid-template-columns: 1fr;
        max-width: 420px;
        margin: 0 auto;
    }

    .ab-values-grid {
        grid-template-columns: 1fr;
    }

    .ab-hero {
        height: 60vh;
        min-height: 420px;
    }
}

@media(max-width:480px) {
    .ab-stats-grid {
        grid-template-columns: 1fr 1fr;
    }

    .ab-stat-item::after {
        display: none !important;
    }

    .ab-cta-actions {
        flex-direction: column;
        align-items: center;
    }
}

/* ================================================================
       HERO
    ================================================================ */
@media (max-width: 991px) {
    .hb-nav-prev {
        left: 12px;
    }

    .hb-nav-next {
        right: 12px;
    }

    .hb-counter {
        top: 16px;
        right: 16px;
    }

    .hb-scroll {
        display: none;
    }

    .hb-badge {
        right: 16px;
        bottom: 60px;
    }
}

@media (max-width: 767px) {
    .hb-carousel .carousel-inner {
        height: 92vh;
        min-height: 520px;
    }

    .hb-heading {
        letter-spacing: -.5px;
    }

    .hb-sub {
        font-size: .83rem;
    }

    .hb-nav {
        width: 40px;
        height: 40px;
    }

    .hb-badge {
        display: none;
    }

    .hb-ornament {
        display: none;
    }
}

@media (max-width: 480px) {
    .hb-actions {
        flex-direction: column;
        align-items: flex-start;
        gap: 12px;
    }

    .hb-dots {
        bottom: 16px;
    }
}