/* ===== Responsive ===== */
@media (max-width: 1040px){
    .hero-grid,
    .split-layout,
    .contact-grid,
    .cta-box,
    .tech-showcase,
    .footer-grid{grid-template-columns:1fr}
    .cards-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
    .portfolio-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
    .metrics-grid,.perks-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
    .hero-stats,.authority-grid{grid-template-columns:1fr}
    .section{padding:5rem 0}
    .page-hero{padding-top:3rem;padding-bottom:2.25rem}
    .page-hero-inner p{font-size:1rem}
    .contact-list{margin:1.35rem 0}
}
@media (max-width: 820px){
    .site-nav{
        position:absolute;top:100%;left:1rem;right:1rem;
        display:grid;gap:1rem;padding:1rem;border-radius:20px;
        background:rgba(6,11,22,.96);border:1px solid var(--line);box-shadow:var(--shadow);
        opacity:0;visibility:hidden;transform:translateY(-10px);transition:all .25s ease
    }
    .site-nav.is-open{opacity:1;visibility:visible;transform:none}
    .nav-toggle{display:block}
    .nav-cta{margin-left:0}
    .lang-switcher{margin-left:0;flex-wrap:wrap}
    .hero{padding-top:1.5rem}
    .hero-grid{gap:1.4rem}
    .hero-actions{margin:1.4rem 0 1rem}
    .hero-stats{margin-top:1.25rem}
    h1{font-size:clamp(2.3rem, 10vw, 3.5rem)}
    .cards-grid,
    .portfolio-grid,
    .service-layout,
    .hero-stats,
    .metrics-grid,
    .perks-grid,
    .mini-grid,
    .form-row{grid-template-columns:1fr}
    .tech-tabs{grid-template-columns:repeat(2,minmax(0,1fr))}
    .timeline-item{grid-template-columns:1fr}
    .section{padding:4.25rem 0}
    .page-hero{padding-top:2.25rem;padding-bottom:1.6rem}
    .page-hero-inner,
    .contact-panel,
    .form-panel,
    .timeline-item,
    .alert,
    .faq-card,
    .tech-panel,
    .cta-box{padding:1.2rem}
    .contact-grid{gap:1rem}
    .contact-form{gap:.85rem}
    input,select,textarea{padding:.9rem .95rem}
    textarea{min-height:8.5rem}
}
@media (max-width: 560px){
    .section{padding:3.5rem 0}
    .header-inner{min-height:4.4rem}
    .glass-panel{min-height:auto}
    .btn{width:100%}
    .hero-actions{display:grid}
    .tech-tabs{grid-template-columns:1fr}
    .container{width:min(calc(100% - 1.2rem), var(--max))}
    .site-nav{left:.6rem;right:.6rem;padding:.85rem}
    .brand img{width:2.35rem;height:2.35rem}
    .brand small{font-size:.72rem}
    h1{font-size:clamp(2rem, 11vw, 2.8rem)}
    h2{font-size:clamp(1.65rem, 8.5vw, 2.2rem)}
    p{margin-bottom:.85rem}
    .page-hero{padding-top:1.5rem;padding-bottom:1.1rem}
    .page-hero-inner,
    .contact-panel,
    .form-panel,
    .timeline-item,
    .alert,
    .faq-card,
    .tech-panel,
    .cta-box,
    .feature-card,
    .portfolio-card,
    .perk,
    .metric-card,
    .stack-card,
    .service-detail,
    .stats-panel article{padding:1rem}
    .contact-list{gap:.85rem;margin:1rem 0}
    .hero-bar{gap:.55rem}
    .hero-bar span{padding:.5rem .8rem;font-size:.84rem}
    .kpi-card,
    .stat-card,
    .mini-grid article{padding:1rem}
    .line-chart{height:8.5rem}
}
