/* responsive.css
   Responsive overrides for Central Era
   Load AFTER style.css and contact.css
*/

@media (max-width:1200px){
  .container,.nav-container{width:94%}
  .hero-grid,.about-grid,.ce-contact-grid{gap:40px}
}

@media (max-width:992px){
  h1{font-size:48px!important}
  h2{font-size:36px!important}
  .hero-grid,.about-grid,.ce-contact-grid,
  .contact-grid,.about-container{grid-template-columns:1fr!important}
  .hero-image,.about-left,.ce-contact-info,.about-visual{order:2}
  .hero-content,.about-right,.ce-contact-form-card,.about-content{order:1}
  .service-grid,.industry-grid,.trusted-grid,
  .hero-contact-cards,.ce-contact-cards{
    grid-template-columns:repeat(2,1fr)!important;
  }
  .roadmap:before{left:24px!important}
  .roadmap-item,.roadmap-item.left,.roadmap-item.right{
    width:100%!important;padding-left:70px!important;
    padding-right:0!important;left:0!important;text-align:left!important;
  }
  .roadmap-icon{left:0!important}
  .about-visual{height:auto!important;padding:40px 0}
  .stats-row{flex-wrap:wrap;gap:24px!important}
}

/* =========================================================
   MOBILE NAV TOGGLE
========================================================= */
.menu-toggle{
  display:none;
  background:none;
  border:none;
  font-size:24px;
  line-height:1;
  color:var(--dark,#102A43);
  cursor:pointer;
  padding:6px 10px;
}
.menu-toggle:focus{outline:2px solid #0F62FE;outline-offset:2px}

@media (max-width:900px){
  .nav-container{flex-wrap:wrap;row-gap:12px}
  .menu-toggle{display:block;order:2}
  .nav-container .primary-btn{order:3}
  nav{order:4;width:100%}
  .nav-menu{
    display:none;
    width:100%;
  }
  .nav-menu.active{
    display:flex;
    background:rgba(255,255,255,.97);
    box-shadow:0 15px 35px rgba(0,0,0,.12);
  }
}

@media (max-width:768px){
  section{padding:70px 0!important}
  header{padding:10px 0}
  .nav-container{flex-wrap:wrap;gap:15px}
  nav{width:100%}
  .nav-menu{
    flex-direction:column;align-items:flex-start;
    gap:8px;padding:15px;border-radius:16px;
  }
  .hero,.ce-contact-hero{padding:130px 0 70px!important}
  h1{font-size:40px!important;line-height:1.15}
  h2{font-size:30px!important}
  p{font-size:16px!important}
  .hero-buttons,.social-icons{flex-direction:column}
  .primary-btn,.secondary-btn,.ce-submit-btn{width:100%;text-align:center}
  .hero-stats{grid-template-columns:repeat(2,1fr)!important}
  .service-grid,.industry-grid,.trusted-grid,
  .hero-contact-cards,.ce-contact-cards,
  .checkbox-grid,.ce-checkbox-grid{
    grid-template-columns:1fr!important;
  }
  .input-row,.ce-input-row{grid-template-columns:1fr!important}
  .contact-form-card,.ce-contact-form-card{padding:28px!important}
  iframe{height:320px!important}
}

@media (max-width:576px){
  .logo img{height:42px}
  .logo span{font-size:20px}
  h1{font-size:32px!important}
  h2{font-size:26px!important}
  .hero-stats{grid-template-columns:1fr!important}
  .service-card,.industry-card,.info-box,.ce-info-box{
    padding:22px!important;border-radius:18px;
  }
  .hero-image img,.about-left img{width:100%;height:auto}
}
