/* ==========================================================
   Responsive
========================================================== */
@media (max-width:1180px){
    .nav-links{gap:24px;}
    .navbar-btn{margin-left:24px; padding:14px 18px;}
    .logo img{width:200px;}
    .header.scrolled .logo img{width:185px;}
    .process-grid,.value-grid{grid-template-columns:repeat(2,1fr);}
    .stats-grid{grid-template-columns:repeat(2,1fr);}
}
@media (max-width:992px){
    .navbar{min-height:88px;}
    .mobile-toggle{display:flex; align-items:center; justify-content:center; width:48px; height:48px; color:#fff; font-size:26px; z-index:1101;}
    .header.scrolled .mobile-toggle{color:#0F172A;}
    .navbar-btn{display:none;}
    .nav-menu{position:fixed; top:128px; left:-100%; width:100%; height:calc(100vh - 128px); background:#07111F; transition:.35s ease; padding:42px; overflow:auto;}
    .nav-menu.active{left:0;}
    .nav-links{flex-direction:column; align-items:flex-start; gap:26px;}
    .nav-links a{color:#fff !important; font-size:20px;}
    .services-grid,.service-detail-grid,.project-grid,.page-project-grid,.testimonial-grid,.about-grid,.contact-grid,.why-grid,.faq-grid,.split-heading,.footer-grid{grid-template-columns:1fr;}
    .page-project-grid .large-card{grid-row:auto; min-height:430px;}
    .why-card-stack article:nth-child(2),.dark-panel{margin-left:0; transform:none;}
    .contact-info-panel{position:relative; top:auto;}
    .cta-box{align-items:flex-start; flex-direction:column;}
}
@media (max-width:768px){
    .topbar{display:none;}
    .header{top:0;}
    .nav-menu{top:88px; height:calc(100vh - 88px);}
    .logo{padding:8px 12px; border-radius:14px;}
    .logo img,.header.scrolled .logo img{width:168px;}
    .hero{padding-top:88px; min-height:100svh;}
    .hero-container{min-height:calc(100svh - 88px);}
    .hero h1{font-size:clamp(39px,11vw,58px); letter-spacing:-1.2px;}
    .hero p{font-size:17px;}
    .hero-buttons{margin-bottom:36px;}
    .hero-stats>div{min-width:100%; padding:22px;}
    .page-hero{padding:150px 0 78px;}
    .page-hero h1{font-size:clamp(36px,10vw,52px); letter-spacing:-1px;}
    .page-hero p{font-size:17px;}
    .services,.why-accord,.process,.projects-showcase,.project-listing,.testimonials,.faq-section,.service-overview,.about-story,.values-section,.contact-section{padding:78px 0;}
    .section-heading,.split-heading{margin-bottom:42px;}
    .service-card,.service-detail-card,.contact-form,.contact-info-panel,.cta-box{padding:28px; border-radius:22px;}
    .form-row,.stats-grid,.process-grid,.value-grid{grid-template-columns:1fr;}
    .project-card{min-height:380px;}
    .footer{padding-top:60px;}
    .footer-grid{gap:32px;}
    .footer-bottom{flex-direction:column; align-items:flex-start;}
    .whatsapp-float{right:18px; bottom:18px; width:54px; height:54px; font-size:28px;}
}
@media (max-width:520px){
    .container{width:min(90%, var(--container));}
    .hero-buttons,.page-hero-actions,.about-actions{flex-direction:column; align-items:stretch;}
    .btn-primary,.btn-secondary,.btn-light,.btn-white{width:100%;}
    .trusted-track{gap:36px;}
    .trusted-track span{font-size:18px;}
    .service-detail-card .service-number{font-size:38px; right:22px; top:24px;}
    .stats-grid h3{font-size:34px;}
}

/* ==========================================================
   Hero Responsive Fixes
========================================================== */

@media (max-width: 1180px) {
    .hero-container {
        grid-template-columns: 1fr;
    }

    .hero-content {
        max-width: 100%;
    }

    .hero-visual {
        min-height: 560px;
    }

    .floating-card-one {
        left: 0;
    }

    .floating-card-two {
        right: 0;
    }
}

@media (max-width: 768px) {
    .hero {
        padding-top: 88px;
        min-height: 100svh;
    }

    .hero-container {
        min-height: calc(100svh - 88px);
    }

    .hero-visual {
        min-height: 520px;
    }

    .hero-dashboard {
        padding: 28px;
        border-radius: 26px;
    }

    .hero-dashboard h3 {
        font-size: 28px;
    }

    .floating-card {
        max-width: 250px;
        padding: 16px;
    }

    .floating-card-one {
        bottom: 35px;
    }

    .floating-card-two {
        top: 24px;
    }
}

@media (max-width: 520px) {
    .hero {
        padding-top: 96px;
    }

    .hero-container {
        gap: 32px;
    }

    .hero h1 {
        font-size: clamp(39px, 11vw, 58px);
        letter-spacing: -1.2px;
    }

    .hero p {
        font-size: 17px;
    }

    .hero-buttons {
        margin-bottom: 36px;
    }

    .hero-stats > div {
        min-width: 100%;
        padding: 22px;
    }

    .hero-dashboard {
        padding: 24px;
    }

    .dashboard-top,
    .dashboard-footer {
        gap: 10px;
    }

    .dashboard-metrics article {
        padding: 16px;
    }

    .dashboard-metrics i,
    .floating-card i {
        width: 42px;
        height: 42px;
    }

    .hero-visual {
        min-height: auto;
    }

    .floating-card {
        position: relative;
        inset: auto;
        max-width: 100%;
        margin-top: 16px;
    }
}
/* ==========================================================
   Header + Hero Mobile Fix
========================================================== */

@media (max-width: 992px) {
    .navbar {
        min-height: 86px;
    }

    .nav-menu {
        top: 86px;
        height: calc(100vh - 86px);
        background: rgba(255, 255, 255, 0.96);
        backdrop-filter: blur(18px);
    }

    .nav-links a {
        color: #0F172A !important;
    }

    .mobile-toggle {
        color: #0F172A;
    }

    .hero-container {
        grid-template-columns: 1fr;
        gap: 44px;
    }

    .hero-graphic {
        justify-content: flex-start;
    }

    .hero-stat-strip {
        grid-template-columns: repeat(2, 1fr);
        bottom: -92px;
    }

    #hero + #trusted .trusted {
        padding-top: 170px;
    }
}

@media (max-width: 768px) {
    .logo img,
    .header.scrolled .logo img {
        width: 170px;
    }

    .hero {
        padding-top: 115px;
        padding-bottom: 150px;
    }

    .hero h1 {
        font-size: clamp(40px, 11vw, 58px);
    }

    .hero p {
        font-size: 17px;
    }

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

    .hero-stat-strip {
        grid-template-columns: 1fr;
        bottom: -185px;
    }

    .hero-stat-strip div {
        padding: 22px 24px;
        border-right: 0;
        border-bottom: 1px solid #E5E7EB;
    }

    .hero-stat-strip div:last-child {
        border-bottom: 0;
    }

    #hero + #trusted .trusted {
        padding-top: 260px;
    }
}

@media (max-width: 520px) {
    .hero-buttons {
        flex-direction: column;
    }

    .hero-buttons .btn-primary,
    .hero-buttons .btn-secondary {
        width: 100%;
    }

    .hero-trusted div {
        gap: 10px;
    }

    .graphic-card {
        padding: 24px;
        border-radius: 24px;
    }

    .mini-drawing span {
        height: 64px;
    }
}