/* ============================================================
   VIRAJ ENGINEERS — COMPREHENSIVE RESPONSIVE CSS
   Covers: all pages, all components, tablet (1023px), mobile (767px), small (479px)
   ============================================================ */

/* ── TABLET (≤1023px) ─────────────────────────────────────── */
@media (max-width:1023px){
  .page-hero{height:360px}
  .container{padding-left:1.5rem!important;padding-right:1.5rem!important}
  .site-nav__topbar{display:none!important}
  .contact-grid{grid-template-columns:1fr!important;gap:2.5rem!important}
  .contact-form{padding:2.5rem!important}
  .contact-form-body{gap:1.5rem!important}
  .resume-page__inner{max-width:100%!important;padding:0 2rem!important}
  .resume-card__body{padding:2.5rem!important}
  .apply-form-wrap{grid-template-columns:1fr!important;gap:2rem!important}
  .apply-sidebar{display:none!important}
  .cs-grid{grid-template-columns:repeat(2,1fr)!important}
  .cs-card__specs{grid-template-columns:repeat(2,1fr)!important}
  .blog-feature{grid-template-columns:1fr!important}
  .blog-feature__img{min-height:280px!important}
  .ins-grid{grid-template-columns:repeat(2,1fr)!important}
  .careers-intro-grid{grid-template-columns:1fr!important;gap:2rem!important}
  .careers-openings{gap:1.5rem!important}
  .perks-grid{grid-template-columns:repeat(2,1fr)!important}
  .careers-statement__headline{font-size:clamp(2rem,5vw,3rem)!important}
  .podcast-card{grid-template-columns:1fr!important}
  .podcast-card__visual{min-height:260px!important}
  .podcast-card__body{border-left:none!important;border-top:4px solid var(--yellow,#f5a623)!important;padding:2.5rem 2rem!important}
  .svc-overview{grid-template-columns:1fr!important}
  .svc-cap-grid{grid-template-columns:repeat(2,1fr)!important}
  .svc-why .container{grid-template-columns:1fr!important;gap:3rem!important}
  .svc-cta__inner{flex-direction:column!important;align-items:flex-start!important}
  .home-about{grid-template-columns:1fr!important}
  .why-viraj{grid-template-columns:1fr!important}
  .clients-section__header{grid-template-columns:1fr!important;gap:2rem!important}
  .services-grid{grid-template-columns:repeat(2,1fr)!important}
  .case-grid{grid-template-columns:1fr!important}
  .case-card--featured{min-height:400px!important}
  .pp-hero__inner{grid-template-columns:1fr!important;gap:3rem!important}
  .pp-hero__visual{display:none!important}
  .pp-advantage__grid{grid-template-columns:repeat(2,1fr)!important}
  .pp-applications__grid{grid-template-columns:1fr!important}
  .pp-app-panel{padding:2rem!important}
  .pp-specs-table{font-size:0.85rem!important}
  .pp-cta__inner{grid-template-columns:1fr!important;gap:2rem!important}
  .pp-breadcrumb{padding:0.75rem 1.5rem!important}
}

/* ── MOBILE (≤767px) ──────────────────────────────────────── */
@media (max-width:767px){
  /* Global */
  .page-hero{height:300px!important;padding-top:80px!important}
  .page-hero__content{padding:1.75rem 1.25rem!important}
  .page-hero__content .display-lg,.page-hero__content .display-xl{font-size:clamp(1.6rem,8vw,2.4rem)!important}
  .page-hero__breadcrumb{font-size:0.72rem!important}
  .page-hero__marker{display:none!important}
  .section{padding:3rem 0!important}
  .section--lg{padding:3.5rem 0!important}
  .container{padding-left:1.25rem!important;padding-right:1.25rem!important}
  .display-xl,.display-lg{font-size:clamp(1.8rem,7vw,2.6rem)!important}
  .display-md{font-size:clamp(1.5rem,6vw,2rem)!important}
  .heading-lg{font-size:clamp(1.2rem,5vw,1.6rem)!important}
  .btn{min-height:44px!important;padding:0.75rem 1.25rem!important}

  /* Contact */
  .contact-grid{grid-template-columns:1fr!important;gap:2rem!important}
  .contact-form{padding:1.75rem 1.25rem!important}
  .contact-form-body{gap:1.25rem!important}
  .contact-form-header{margin-bottom:1.5rem!important}
  .contact-form-header__step{font-size:0.68rem!important}
  .contact-form-header__sub{font-size:0.82rem!important}
  .form-grid{grid-template-columns:1fr!important}
  .form-group--full{grid-column:1!important}
  .contact-info-cards{gap:1rem!important}
  .contact-info-card{padding:1.25rem!important}
  .contact-success{padding:3rem 1.5rem!important}

  /* Apply / Careers form */
  .resume-page{padding-top:90px!important;padding-bottom:4rem!important}
  .resume-page__inner{max-width:100%!important;padding:0 1.25rem!important}
  .resume-card__body{padding:1.75rem 1.25rem!important}
  .rf-grid{grid-template-columns:1fr!important}
  .rf-grid .form-group--full{grid-column:1!important}
  .rf-section{margin-bottom:2rem!important;padding-bottom:2rem!important}
  .rf-submit-row .btn-primary{width:100%!important;justify-content:center!important}
  .rf-privacy{font-size:0.72rem!important;text-align:center!important}
  .rf-success{padding:3rem 1.5rem!important}
  .apply-form-wrap{grid-template-columns:1fr!important}
  .apply-sidebar{display:none!important}
  .apply-process{padding-left:0!important}
  .apply-process li{padding-left:2.5rem!important}
  .apply-checklist{gap:0.75rem!important}
  .apply-form__section-header{flex-direction:column!important;gap:0.5rem!important}
  .apply-form__btn{width:100%!important;justify-content:center!important}
  .apply-form__consent{font-size:0.82rem!important}
  .apply-form__privacy{font-size:0.72rem!important;text-align:center!important}

  /* Case Studies */
  .cs-grid{grid-template-columns:1fr!important}
  .cs-card{margin-bottom:0!important}
  .cs-card__img-wrap{height:200px!important}
  .cs-card__body{padding:1.25rem!important}
  .cs-card__specs{grid-template-columns:1fr 1fr!important;gap:0.75rem!important}
  .cs-card__spec{padding:0.6rem 0.75rem!important}
  .cs-card__spec-key{font-size:0.62rem!important}
  .cs-card__spec-val{font-size:0.78rem!important}
  .cs-card__summary{font-size:0.82rem!important;-webkit-line-clamp:3!important}
  .cs-card__tag{font-size:0.62rem!important;padding:0.3rem 0.6rem!important}
  .cs-card__meta{flex-wrap:wrap!important;gap:0.5rem!important}
  .cs-card__link{font-size:0.78rem!important}
  .cs-filters{flex-wrap:wrap!important;gap:0.5rem!important;justify-content:flex-start!important}
  .cs-filter-btn{font-size:0.72rem!important;padding:0.5rem 0.9rem!important;min-height:36px!important}
  .cs-detail-grid{grid-template-columns:1fr!important}
  .cs-detail-sidebar{position:static!important}
  .cs-detail-gallery{grid-template-columns:1fr!important}

  /* Blog / Insights */
  .blog-feature{grid-template-columns:1fr!important}
  .blog-feature__img{min-height:220px!important;height:220px!important}
  .blog-feature__body{padding:1.75rem 1.25rem!important}
  .blog-feature__title{font-size:clamp(1.3rem,5vw,1.8rem)!important}
  .ins-grid{grid-template-columns:1fr!important}
  .ins-card{flex-direction:column!important}
  .ins-card__img{width:100%!important;height:180px!important}
  .ins-card__body{padding:1.25rem!important}
  .ins-card__title{font-size:1rem!important}
  .ins-card__excerpt{font-size:0.82rem!important}
  .ins-featured__card{flex-direction:column!important}
  .ins-featured__img-wrap{width:100%!important;height:220px!important}
  .ins-featured__body{padding:1.5rem 1.25rem!important}
  .ins-band{padding:2.5rem 1.25rem!important}
  .ins-band__body{flex-direction:column!important;gap:1rem!important}
  .ins-band__topics{flex-wrap:wrap!important;gap:0.5rem!important}
  .ins-band__title{font-size:clamp(1.2rem,5vw,1.6rem)!important}
  .post-table-wrap,.cs-table-wrap{overflow-x:auto!important;-webkit-overflow-scrolling:touch!important}

  /* Careers listing */
  .careers-hero__title{font-size:clamp(2rem,9vw,3rem)!important;line-height:1.1!important}
  .careers-hero__sub{font-size:0.9rem!important}
  .careers-hero__actions{flex-direction:column!important;gap:0.75rem!important}
  .careers-hero__actions .btn{width:100%!important;justify-content:center!important}
  .careers-hero__scroll-hint{display:none!important}
  .careers-openings{gap:1rem!important}
  .careers-openings__header{flex-direction:column!important;align-items:flex-start!important;gap:1rem!important}
  .perks-grid{grid-template-columns:1fr!important}
  .careers-statement__headline{font-size:clamp(1.8rem,7vw,2.5rem)!important}
  .careers-statement__quote{padding:1.5rem!important}
  .careers-statement__body{padding:2rem 1.25rem!important}
  .careers-spec-cta{flex-direction:column!important;gap:1rem!important;padding:2rem 1.25rem!important}
  .careers-spec-cta .btn{width:100%!important;justify-content:center!important}
  .careers-perks__no-role-left{flex-direction:column!important;gap:1rem!important}
  .careers-perks__no-role-btn{width:100%!important;justify-content:center!important}

  /* Events */
  .podcast-card{grid-template-columns:1fr!important;margin:0 1.25rem!important}
  .podcast-card__visual{min-height:220px!important;padding:2rem 1.5rem!important}
  .podcast-card__body{border-left:none!important;border-top:4px solid var(--yellow,#f5a623)!important;padding:2rem 1.5rem!important}
  .podcast-card__title{font-size:clamp(1.3rem,5vw,1.8rem)!important}
  .podcast-card__host{flex-direction:column!important;gap:1rem!important;align-items:flex-start!important}
  .podcast-card__cta{width:100%!important;justify-content:center!important}
  .podcast-card__people{flex-direction:column!important;gap:1.5rem!important}

  /* Services */
  .svc-overview{grid-template-columns:1fr!important}
  .svc-overview__text{padding:2rem 1.25rem!important}
  .svc-overview__visual{min-height:260px!important}
  .svc-cap-grid{grid-template-columns:1fr!important}
  .svc-cap-card{padding:1.5rem!important}
  .svc-why .container{grid-template-columns:1fr!important;gap:2rem!important}
  .svc-why__pillars{gap:1rem!important}
  .svc-why__pillar{padding:1.25rem!important}
  .svc-cta{padding:3rem 0!important}
  .svc-cta__inner{flex-direction:column!important;align-items:flex-start!important;gap:1.5rem!important}
  .svc-cta__actions{flex-direction:column!important;width:100%!important}
  .svc-cta__actions .btn{width:100%!important;justify-content:center!important}
  .svc-hero{min-height:380px!important}
  .svc-hero__content{padding:2rem 1.25rem!important}
  .svc-hero__h1{font-size:clamp(1.8rem,9vw,2.8rem)!important}
  .svc-hero__tags{flex-wrap:wrap!important;gap:0.4rem!important}

  /* Home — hero */
  .hero-slider{height:100svh!important;min-height:500px!important}
  .hero-slide__content .container{padding:0 1.25rem 5rem!important}
  .hero-slide__sub{font-size:0.85rem!important;max-width:100%!important}
  .hero-slide__actions{flex-direction:column!important;gap:0.75rem!important;align-items:flex-start!important}
  .hero-slide__actions .btn{width:100%!important;max-width:280px!important}
  .hero-dots{bottom:1.5rem!important}
  .hero-prev,.hero-next{display:none!important}
  .hero-stats-row{flex-wrap:wrap!important;gap:1rem!important;padding:1rem 1.25rem!important}
  .hero-stat{flex:1 1 calc(50% - 0.5rem)!important;min-width:120px!important}
  .hero-stat-divider{display:none!important}

  /* Home — services */
  .services-grid{grid-template-columns:1fr!important}
  .service-card{padding:1.5rem!important}

  /* Home — WWD panels */
  .wwd-panels{flex-direction:column!important}
  .wwd-panel{min-height:200px!important}
  .wwd-panel--wide{flex:none!important;width:100%!important}
  .wwd-intro{padding:2rem 1.25rem!important}

  /* Home — about */
  .home-about{grid-template-columns:1fr!important;gap:2rem!important}
  .home-about__img-wrap{height:280px!important}
  .home-about__badge{display:none!important}
  .home-about__stats{flex-wrap:wrap!important;gap:1rem!important}
  .home-about__right{padding:2.5rem 1.25rem!important}

  /* Home — why */
  .why-viraj{grid-template-columns:1fr!important}
  .why-viraj__left,.why-viraj__right{padding:3rem 1.25rem!important}
  .why-grid{grid-template-columns:1fr!important;gap:1rem!important}

  /* Home — counters */
  .counters-row{flex-wrap:wrap!important;gap:1.5rem!important;justify-content:center!important}
  .counter-item{flex:1 1 calc(50% - 0.75rem)!important;min-width:130px!important;text-align:center!important}
  .counter-divider{display:none!important}

  /* Home — clients */
  .clients-section__header{grid-template-columns:1fr!important;gap:1.5rem!important}
  .clients-logo-grid{grid-template-columns:repeat(2,1fr)!important;gap:1rem!important}
  .client-logo{padding:0.75rem!important}

  /* Home — case teaser */
  .case-teaser__header{flex-direction:column!important;align-items:flex-start!important;gap:1rem!important}
  .case-grid{grid-template-columns:1fr!important;gap:1rem!important}
  .case-card--featured{min-height:320px!important}
  .case-col{grid-template-columns:1fr!important;gap:1rem!important}

  /* Home — CTA band */
  .cta-band__inner{flex-direction:column!important;align-items:flex-start!important;gap:1.5rem!important}
  .cta-band__actions{flex-direction:column!important;gap:0.75rem!important;width:100%!important}
  .cta-band__actions .btn{width:100%!important;justify-content:center!important}

  /* Home — tabs */
  .tabs-header{overflow-x:auto!important;-webkit-overflow-scrolling:touch!important;scrollbar-width:none!important;padding-bottom:0.25rem!important}
  .tabs-header::-webkit-scrollbar{display:none!important}
  .tab-btn{white-space:nowrap!important;flex-shrink:0!important;font-size:0.75rem!important;padding:0.5rem 1rem!important}

  /* About */
  .founders-grid{grid-template-columns:1fr!important;gap:2rem!important}
  .founders-portrait__frame{aspect-ratio:16/9!important;max-height:280px!important}
  .founders-desk__body{padding:2rem 1.25rem!important}
  .mv-editorial{grid-template-columns:1fr!important}
  .mv-panel{padding:2.5rem 1.25rem!important}
  .mv-panel__center-rule,.mv-panel__center-line,.mv-panel__center-diamond{display:none!important}
  .wwa-inner{grid-template-columns:1fr!important}
  .wwa-label-col{display:none!important}
  .ve-row{flex-direction:column!important;gap:1.5rem!important}
  .ve-big-num{font-size:clamp(3rem,12vw,5rem)!important}
  .ve-row__accent-word{font-size:clamp(1.5rem,6vw,2.2rem)!important}
  .cv-grid{grid-template-columns:1fr!important}
  .cv-card{padding:1.5rem!important}
  .values-grid{grid-template-columns:1fr 1fr!important}
  .counters-strip__inner{flex-wrap:wrap!important;gap:1.5rem!important;justify-content:center!important}

  /* Footer */
  .footer-grid{grid-template-columns:1fr!important}
  .footer-bottom__grid{grid-template-columns:1fr!important;text-align:center!important}
  .footer-bottom__tagline{text-align:center!important}
  .footer-legal-links{justify-content:center!important}

  /* PrimaPlastech / PolyKrib */
  .pp-hero__inner{grid-template-columns:1fr!important;gap:2rem!important}
  .pp-hero__visual{display:none!important}
  .pp-hero__title{font-size:clamp(1.8rem,7vw,2.6rem)!important}
  .pp-hero__sub{font-size:0.9rem!important}
  .pp-hero__actions{flex-direction:column!important;gap:0.75rem!important}
  .pp-hero__actions .btn{width:100%!important;justify-content:center!important}
  .pp-advantage__grid{grid-template-columns:1fr!important}
  .pp-adv-card{padding:1.5rem!important}
  .pp-adv-card__body{padding-top:0.75rem!important}
  .pp-applications__grid{grid-template-columns:1fr!important}
  .pp-app-panel{padding:1.5rem!important}
  .pp-app-panel__list{columns:1!important}
  .pp-specs-table{display:block!important;overflow-x:auto!important;-webkit-overflow-scrolling:touch!important}
  .pp-cta__inner{grid-template-columns:1fr!important;gap:1.5rem!important}
  .pp-cta__actions{flex-direction:column!important;gap:0.75rem!important}
  .pp-cta__actions .btn{width:100%!important;justify-content:center!important}
  .pp-breadcrumb{padding:0.75rem 1.25rem!important;font-size:0.72rem!important}
  .pp-section-label{font-size:0.65rem!important}
  .pp-advantage__header .display-md{font-size:clamp(1.5rem,6vw,2rem)!important}
}

/* ── SMALL MOBILE (≤479px) ────────────────────────────────── */
@media (max-width:479px){
  /* Global */
  .page-hero{height:260px!important}
  .page-hero__deco{display:none!important}
  .container{padding-left:1rem!important;padding-right:1rem!important}
  .display-xl,.display-lg{font-size:clamp(1.5rem,8vw,2rem)!important}
  .display-md{font-size:clamp(1.3rem,6vw,1.7rem)!important}

  /* Nav */
  .site-nav__main{padding:0 1rem!important}
  .nav-logo img{height:38px!important}
  .nav-toggle{width:42px!important;height:42px!important}
  .nav-links.open{width:100vw!important}
  .nav-links.open .nav-link{font-size:.94rem!important;padding:.86rem 0!important}
  .nav-links.open .nav-cta{margin:1rem 0 0!important}

  /* Footer */
  .footer-grid{grid-template-columns:1fr!important;gap:2rem!important}
  .footer-bottom{flex-direction:column!important;gap:0.75rem!important;text-align:center!important}
  .footer-legal{flex-wrap:wrap!important;justify-content:center!important;gap:0.5rem 1rem!important}

  /* Home — hero */
  .hero-slide__content .container{padding-left:1rem!important;padding-right:1rem!important}
  .hero-stat{flex:1 1 100%!important}
  .hero-stats-row{flex-direction:column!important;gap:0.75rem!important}

  /* Home — counters */
  .counter-item{flex:1 1 100%!important}

  /* Home — clients */
  .clients-logo-grid{grid-template-columns:repeat(2,1fr)!important}

  /* Case studies */
  .cs-card__specs{grid-template-columns:1fr!important}
  .cs-filters{gap:0.4rem!important}
  .cs-filter-btn{font-size:0.68rem!important;padding:0.4rem 0.75rem!important}
  .cs-card__body{padding:1rem!important}

  /* Blog */
  .blog-feature__img{min-height:180px!important;height:180px!important}
  .blog-feature__body{padding:1.25rem 1rem!important}

  /* Careers */
  .careers-hero__title{font-size:clamp(1.8rem,9vw,2.5rem)!important}
  .careers-statement__quote{padding:1.25rem 1rem!important}

  /* Apply form */
  .resume-card__body{padding:1.25rem 1rem!important}
  .rf-section__label{font-size:0.62rem!important}

  /* Contact */
  .contact-form{padding:1.25rem 1rem!important}
  .contact-info-card{padding:1rem!important}

  /* Events */
  .podcast-card{margin:0 1rem!important}
  .podcast-card__visual{padding:1.5rem 1rem!important}
  .podcast-card__body{padding:1.5rem 1rem!important}

  /* Services */
  .svc-cap-card{padding:1.25rem!important}
  .svc-hero__content{padding:1.5rem 1rem!important}

  /* About */
  .founders-portrait__frame{max-height:220px!important}
  .mv-panel{padding:1.5rem 1rem!important}
  .cv-card{padding:1.25rem!important}

  /* PrimaPlastech */
  .pp-adv-card{padding:1.25rem!important}
  .pp-app-panel{padding:1.25rem 1rem!important}
  .pp-breadcrumb{padding:0.6rem 1rem!important}

  /* Tabs / filters — horizontal scroll on small screens */
  .tabs-header,.cs-filters{overflow-x:auto!important;-webkit-overflow-scrolling:touch!important;flex-wrap:nowrap!important;padding-bottom:0.5rem!important;scrollbar-width:none!important}
  .tabs-header::-webkit-scrollbar,.cs-filters::-webkit-scrollbar{display:none!important}
  .tab-btn,.cs-filter-btn{white-space:nowrap!important;flex-shrink:0!important}

  /* Stats */
  .mvv-stat{flex:0 0 45%!important}
  .mvv-stat-sep{display:none!important}
  .clients-stat-row{flex-wrap:wrap!important;gap:1rem!important}
  .values-grid{grid-template-columns:1fr!important}

  /* WhatsApp float */
  #wa-float{bottom:1rem!important;right:1rem!important;width:48px!important;height:48px!important}
  #wa-float svg{width:24px!important;height:24px!important}
}

/* ── FIXED-PX GRID OVERRIDES (mobile) ───────────────────── */
@media (max-width:767px){
  /* case-studies.css: .cs-detail-body uses 1fr 340px */
  .cs-detail-body{grid-template-columns:1fr!important}
  /* case-study-detail.css: .csd-body uses 1fr 340px */
  .csd-body{grid-template-columns:1fr!important}
  /* apply.css: .apply-layout uses 340px 1fr */
  .apply-layout{grid-template-columns:1fr!important}
  /* blog.css: .post-layout uses 1fr 300px */
  .post-layout{grid-template-columns:1fr!important}
  /* prima-plastech.css: .pp-spec-item uses 180px/160px 1fr */
  .pp-spec-item{grid-template-columns:1fr!important;gap:0.25rem!important}
  .pp-spec-item dt,.pp-spec-item dd{grid-column:1!important}
  /* inner.css: .founders-grid uses 360px 1fr */
  .founders-grid{grid-template-columns:1fr!important}
  /* careers.css: .cjob uses 48px 1fr auto auto */
  .cjob{grid-template-columns:1fr!important;gap:0.75rem!important}
  .cjob__num{display:none!important}
  .cjob__tags{flex-wrap:wrap!important;gap:0.4rem!important}
  .cjob__actions{grid-column:1!important;justify-content:flex-start!important}
}
@media (max-width:1023px){
  /* Tablet overrides for fixed-px grids */
  .cs-detail-body{grid-template-columns:1fr!important}
  .csd-body{grid-template-columns:1fr!important}
  .apply-layout{grid-template-columns:1fr!important}
  .post-layout{grid-template-columns:1fr!important}
  .founders-grid{grid-template-columns:1fr!important}
}

/* ── OVERFLOW PREVENTION (all sizes) ─────────────────────── */
*{box-sizing:border-box}
img,video,svg{max-width:100%;height:auto}
pre,code{overflow-x:auto;max-width:100%;word-break:break-word}
table{max-width:100%;word-break:normal}
.overflow-x-scroll{overflow-x:auto!important;-webkit-overflow-scrolling:touch!important}