/* ============================================================
   PLUS27PRO v3 — Responsive
   ============================================================ */

/* ---- 1280px ---- */
@media (max-width:1280px){
  .footer-grid{grid-template-columns:1.5fr 1fr 1fr 1fr;gap:36px}
  .portfolio-grid .pf-item--lg{grid-column:span 7}
  .portfolio-grid .pf-item--md{grid-column:span 5}
  .portfolio-grid .pf-item--sm{grid-column:span 5}
}

/* ---- 1024px (tablet landscape) ---- */
@media (max-width:1024px){
  .hero-inner{grid-template-columns:1fr;gap:48px;padding:60px 0 40px}
  .hero-form-card{max-width:600px}
  .stats-row{grid-template-columns:repeat(2,1fr)}
  .stat-block:nth-child(2){border-right:none}
  .stat-block:nth-child(3){border-top:1px solid var(--border)}
  .portfolio-grid{grid-template-columns:repeat(6,1fr)}
  .pf-item--lg{grid-column:span 6;grid-row:span 1}
  .pf-item--md{grid-column:span 3}
  .pf-item--sm{grid-column:span 3}
  .testimonial-grid{grid-template-columns:1fr 1fr}
  .testimonial-card:last-child{grid-column:span 2}
  .process-grid{grid-template-columns:repeat(2,1fr)}
  .footer-grid{grid-template-columns:1fr 1fr;gap:32px}
  .cta-inner{grid-template-columns:1fr;gap:40px}
  .cta-form-wrap{max-width:600px}
  .nav-links{display:none}
  .nav-burger{display:flex}
  .nav-right .btn{display:none}
  .service-item{grid-template-columns:60px 1fr auto;gap:20px}
  .blog-grid{grid-template-columns:1fr 1fr}
  .blog-card:last-child{grid-column:span 2}
}

/* ---- 768px (tablet portrait) ---- */
@media (max-width:768px){
  :root{--pad:clamp(16px,5vw,32px)}
  .h-xl{font-size:clamp(2.4rem,7vw,3.5rem)}
  .h-lg{font-size:clamp(1.8rem,5vw,2.6rem)}
  .stats-row{grid-template-columns:1fr 1fr;border-radius:var(--r4)}
  .stat-block{border-right:none;border-bottom:1px solid var(--border)}
  .stat-block:nth-child(odd){border-right:1px solid var(--border)}
  .stat-block:last-child{border-bottom:none}
  .stat-block:nth-child(3){border-top:none}
  .portfolio-grid{grid-template-columns:1fr 1fr;gap:4px}
  .pf-item--lg,.pf-item--md,.pf-item--sm{grid-column:span 2;grid-row:span 1}
  .pf-item--md,.pf-item--sm{grid-column:span 1}
  .testimonial-grid{grid-template-columns:1fr}
  .testimonial-card:last-child{grid-column:span 1}
  .process-grid{grid-template-columns:1fr 1fr}
  .footer-grid{grid-template-columns:1fr}
  .footer-brand{grid-column:span 1}
  .service-item{grid-template-columns:48px 1fr auto;gap:16px;padding:24px 0}
  .service-num{font-size:2rem}
  .service-body h3{font-size:1.1rem}
  .form-row.cols-2{grid-template-columns:1fr}
  .portfolio-filters{gap:6px}
  .pf-btn{padding:7px 14px;font-size:0.72rem}
  .blog-grid{grid-template-columns:1fr}
  .blog-card:last-child{grid-column:span 1}
  .location-grid{grid-template-columns:1fr 1fr}
  .hero-proof{gap:12px}
  .grid-2{grid-template-columns:1fr}
  .grid-3{grid-template-columns:1fr}
}

/* ---- 540px (mobile) ---- */
@media (max-width:540px){
  .h-xl{font-size:clamp(2rem,8vw,2.8rem);letter-spacing:-0.03em}
  .h-lg{font-size:clamp(1.5rem,6vw,2rem)}
  .hero-ctas{flex-direction:column;align-items:flex-start}
  .hero-ctas .btn{width:100%;justify-content:center}
  .stats-row{grid-template-columns:1fr 1fr}
  .process-grid{grid-template-columns:1fr}
  .portfolio-grid{grid-template-columns:1fr;gap:2px}
  .pf-item--lg,.pf-item--md,.pf-item--sm{grid-column:span 1}
  .footer-bottom{flex-direction:column;align-items:flex-start}
  .footer-bottom-links{gap:12px}
  .location-grid{grid-template-columns:1fr}
  .cta-btns{flex-direction:column}
  .cta-btns .btn{width:100%;justify-content:center}
  .hero-form-card{padding:24px 20px}
  .exit-popup-card{padding:32px 24px}
  .wa-btn{bottom:20px;right:20px}
  .service-item{grid-template-columns:40px 1fr}
  .service-arrow{display:none}
  .testimonial-grid{grid-template-columns:1fr}
}

/* ---- 380px (small mobile) ---- */
@media (max-width:380px){
  .h-xl{font-size:2rem}
  .stats-row{grid-template-columns:1fr}
  .stat-block:nth-child(odd){border-right:none}
  .stat-block{border-bottom:1px solid var(--border)}
  .stat-block:last-child{border-bottom:none}
}

/* ---- Reduced motion ---- */
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{
    animation-duration:.01ms !important;
    animation-iteration-count:1 !important;
    transition-duration:.01ms !important;
  }
  [data-reveal]{opacity:1;transform:none;transition:none}
  .marquee-track{animation:none}
}

/* ---- Print ---- */
@media print{
  .nav,.wa-btn,.exit-popup,.nav-mobile{display:none!important}
  body{background:#fff;color:#000}
  [data-reveal]{opacity:1!important;transform:none!important}
}
