/* ============================================================
   NN RENEWABLES — responsive.css
   ============================================================ */
@media(max-width:1200px){
  .nav a{padding:9px 8px;font-size:12.5px}
  .grid-4,.prod-grid{grid-template-columns:repeat(3,1fr)}
  .brand-grid{grid-template-columns:repeat(3,1fr)}
}
@media(max-width:1100px){
  .nav{display:none}
  .burger{display:flex}
  .nav-cta .btn{display:none}
  .hero-grid{grid-template-columns:1fr;gap:70px}
  .hero-media{max-width:560px;margin-inline:auto}
  .proc-grid{grid-template-columns:1fr;gap:40px}
  .proc-left{position:static}
}
@media(max-width:992px){
  .sec{padding:74px 0}
  .split{grid-template-columns:1fr;gap:44px}
  .grid-3{grid-template-columns:repeat(2,1fr)}
  .proj-grid,.aud-grid{grid-template-columns:repeat(2,1fr)}
  .foot-grid{grid-template-columns:1fr 1fr;gap:38px}
  .mobile-bar{display:flex}
  body{padding-bottom:66px}
  .to-top{bottom:158px}
  .wa-float{bottom:92px}
  .topbar-right{display:none}
  .hm-frame img{height:400px}
  .cta-in{flex-direction:column;align-items:flex-start}
}
@media(max-width:768px){
  .sec{padding:60px 0}
  .sec-head{margin-bottom:38px}
  .hero{padding:80px 0 96px}
  .hero-h{font-size:clamp(36px,9.5vw,52px)}
  .hero-ctas .btn{flex:1;min-width:220px}
  .hm-years{left:-6px;top:-16px}
  .hm-projects{left:-8px;bottom:44px}
  .hm-customers{right:6px}
  .hm-live{right:-4px;top:16px}
  .hm-frame img{height:340px}
  .grid-2,.grid-3,.grid-4,.prod-grid,.form-grid,.calc-out{grid-template-columns:1fr}
  .form-grid{gap:0}
  .aud-grid{grid-template-columns:1fr}
  .gal-grid{grid-template-columns:repeat(2,1fr)}
  .gal-item.wide{grid-column:span 2}
  .t-card{padding:38px 26px}
  .pm-specs{grid-template-columns:1fr 1fr}
  .grev{flex-direction:column;align-items:flex-start}
  .grev-score{border-right:0;border-bottom:1px solid var(--line);padding:0 0 22px;width:100%}
  .page-hero{padding:58px 0 64px}
  .scroll-cue{display:none}
  .modal-box{padding:26px 20px}
  .modal-lg{padding:0}
  .toast-wrap{left:16px;right:16px;max-width:none}
  .kicker-stat{gap:26px}
  .kicker-stat div b{font-size:30px}
}
@media(max-width:560px){
  .proj-grid,.brand-grid{grid-template-columns:1fr}
  .foot-grid{grid-template-columns:1fr;gap:34px;padding:60px 0 40px}
  .hero-media::after{display:none}
  .hm-card{padding:11px 15px}
  .hm-card b{font-size:21px}
  .topbar-msg span.opt{display:none}
  .filter-bar{gap:8px}
  .f-chip{padding:9px 16px;font-size:11.5px}
  .pm-specs{grid-template-columns:1fr}
  .cta-btns .btn{width:100%}
  .steps,.p-step{grid-template-columns:1fr}
  .p-num{margin-left:0}
  .proc-steps{border-left:0}
  .ind-row{grid-template-columns:1fr;gap:8px}
}