/* ═══════════════════════════════════════════════════════
   NEOSCRIPT — GLOBAL RESPONSIVE FIXES  (responsive-fixes.css v1)
   Site-wide mobile / tablet / iPad fixes. Loaded on every page.
   ═══════════════════════════════════════════════════════ */

/* ── GLOBAL RESETS ── */
*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; overflow-x: hidden; }
body { overflow-x: hidden; -webkit-font-smoothing: antialiased; }
img, video, canvas, svg { max-width: 100%; height: auto; display: block; }

/* Use dvh for hero sections on mobile (handles address bar) */
@supports (min-height: 100dvh) {
  .hero-modern, .fe-hero, .cd-hero, .ft-hero, .ind-hero,
  .ss-hero, .au-hero, .ht-hero, .gt-hero, .cs-hero,
  .me-hero, .de-hero, .ml-hero, .es-hero, .mvp-hero,
  .bs-hero, .cr-hero {
    min-height: 100dvh;
  }
}

/* ═══════════════════════════════════════
   TABLET LANDSCAPE — max 1024px
   (iPad landscape, small laptops)
   ═══════════════════════════════════════ */
@media (max-width: 1024px) {

  /* ── Homepage hero ── */
  .hero-modern { padding: 100px 24px 50px; min-height: auto; }
  .hero-container { gap: 32px; }
  .hero-title { font-size: 42px; }
  .hero-visual { height: 400px; }
  .floating-card { font-size: 11px; padding: 10px 14px; }

  /* ── Page heroes (all service/expertise pages) ── */
  .page-hero, .hero-section { padding: 120px 24px 70px !important; }

  /* ── Page-specific heroes ── */
  .fe-hero, .cd-hero, .ft-hero, .ind-hero, .ss-hero,
  .ht-hero, .gt-hero, .cs-hero, .me-hero, .de-hero,
  .ml-hero, .es-hero, .mvp-hero, .bs-hero {
    padding: 110px 32px 60px;
  }
  .fe-hero-title, .cd-hero-title, .ft-hero-title,
  .ind-hero-title, .ss-hero-title, .ht-hero-title,
  .gt-hero-title, .cs-hero-title, .me-hero-title,
  .de-hero-title, .ml-hero-title, .es-hero-title,
  .mvp-hero-title, .bs-hero-title {
    font-size: 48px;
  }

  /* ── Section headers ── */
  .fe-section-header h2, .cd-section-header h2, .ft-section-header h2,
  .ind-section-header h2, .ss-section-header h2, .ht-section-header h2,
  .gt-section-header h2, .cs-section-header h2, .au-section-header h2 {
    font-size: 36px;
  }

  /* ── Stats / impact grids — 2 columns ── */
  .stats-grid { grid-template-columns: repeat(2, 1fr); gap: 24px; }
  .stat-item::after { display: none; }

  /* ── CTA sections ── */
  .cta-section { padding: 60px 24px; margin: 50px 0; }
  .cta-section h2 { font-size: 32px; }
  .cta-section p { font-size: 16px; }

  /* ── Services showcase ── */
  .services-showcase { padding: 80px 24px; }

  /* ── Case studies ── */
  .case-studies-grid { grid-template-columns: repeat(2, 1fr); }

  /* ── Testimonials ── */
  .testimonials-grid { grid-template-columns: 1fr; }

  /* ── Engineering / philosophy sections ── */
  .engineering-container { grid-template-columns: 1fr; }

  /* ── Testimonial split layouts ── */
  .fe-testimonial-inner { grid-template-columns: 1fr; gap: 40px; }

  /* ── Final CTA sections (all pages) ── */
  .fe-final-cta h2, .cd-final-cta h2, .ft-final-cta h2,
  .ind-final-cta h2, .ss-final-cta h2, .au-final-cta h2 {
    font-size: 40px;
  }
  .fe-final-cta, .cd-final-cta, .ft-final-cta,
  .ind-final-cta, .ss-final-cta, .au-final-cta {
    padding: 80px 32px;
  }

  /* ── All section padding ── */
  .fe-pillars, .fe-stack, .fe-testimonial,
  .cd-mandates, .cd-noops, .cd-matrix, .cd-testimonials,
  .ft-caps, .ft-sectors, .ft-cases, .ft-compliance, .ft-impact,
  .ind-impact, .ind-sectors,
  .ss-featured, .ss-portfolio,
  .ht-capabilities, .ht-engage, .ht-compliance,
  .gt-capabilities, .gt-derisking,
  .cs-framework, .cs-cards,
  .me-frameworks, .me-lifecycle,
  .de-mandates, .de-stack,
  .ml-mandates, .ml-stack,
  .es-capabilities, .es-bento,
  .mvp-firepower, .mvp-advantage,
  .bs-matrix, .bs-tabs {
    padding-left: 32px;
    padding-right: 32px;
  }
}

/* ═══════════════════════════════════════
   TABLET PORTRAIT / iPAD — max 768px
   ═══════════════════════════════════════ */
@media (max-width: 768px) {

  /* ── Homepage hero ── */
  .hero-modern { padding: 90px 20px 40px; }
  .hero-container { grid-template-columns: 1fr; text-align: center; }
  .hero-content { text-align: center; }
  .hero-title { font-size: 34px; letter-spacing: -0.5px; }
  .hero-description { font-size: 15px; margin: 0 auto 30px; }
  .hero-cta { flex-direction: column; align-items: center; }
  .btn-primary, .btn-secondary { width: 100%; justify-content: center; }
  .hero-stats { flex-direction: column; gap: 16px; align-items: center; }
  .stat-divider { width: 40px; height: 1px; }
  .stat-number { font-size: 36px; }
  .hero-visual { height: 300px; }
  .floating-card { display: none; }
  .center-illustration { width: 220px; height: 220px; }
  .main-illustration { width: 180px; }

  /* ── Page heroes ── */
  .page-hero, .hero-section { padding: 100px 20px 50px !important; }

  /* ── Page-specific heroes ── */
  .fe-hero, .cd-hero, .ft-hero, .ind-hero, .ss-hero,
  .ht-hero, .gt-hero, .cs-hero, .me-hero, .de-hero,
  .ml-hero, .es-hero, .mvp-hero, .bs-hero {
    padding: 100px 24px 50px;
    min-height: auto;
  }
  .fe-hero-title, .cd-hero-title, .ft-hero-title,
  .ind-hero-title, .ss-hero-title, .ht-hero-title,
  .gt-hero-title, .cs-hero-title, .me-hero-title,
  .de-hero-title, .ml-hero-title, .es-hero-title,
  .mvp-hero-title, .bs-hero-title {
    font-size: 36px;
    letter-spacing: -1px;
  }
  .fe-hero-sub, .cd-hero-sub, .ft-hero-sub,
  .ind-hero-sub, .ss-hero-sub {
    font-size: 15px;
    margin-bottom: 32px;
  }

  /* ── Section headers ── */
  .fe-section-header h2, .cd-section-header h2, .ft-section-header h2,
  .ind-section-header h2, .ss-section-header h2, .ht-section-header h2,
  .gt-section-header h2, .cs-section-header h2, .au-section-header h2 {
    font-size: 30px;
  }
  .fe-section-header p, .cd-section-header p, .ft-section-header p,
  .ind-section-header p, .ss-section-header p {
    font-size: 15px;
  }

  /* ── Grids — single column ── */
  .services-grid, .features-grid, .team-grid,
  .case-studies-grid, .testimonials-grid { grid-template-columns: 1fr; gap: 20px; margin: 40px 0; }
  .fe-pillars-grid { grid-template-columns: 1fr; }

  /* ── Stats ── */
  .stats-section { padding: 40px 20px; margin: 40px 0; }
  .stats-grid { grid-template-columns: repeat(2, 1fr); gap: 20px; }

  /* ── CTA ── */
  .cta-section { padding: 50px 20px; margin: 40px 0; }
  .cta-section h2 { font-size: 28px; }

  /* ── Cards — reduce padding ── */
  .service-item, .feature-item { padding: 28px 20px; }
  .service-item h3, .feature-item h3 { font-size: 18px; }
  .team-member { padding: 24px 20px; }

  /* ── Final CTA sections ── */
  .final-cta { padding: 60px 20px; }
  .fe-final-cta h2, .cd-final-cta h2, .ft-final-cta h2,
  .ind-final-cta h2, .ss-final-cta h2, .au-final-cta h2 {
    font-size: 32px;
  }

  /* ── Tech stack rows ── */
  .fe-stack-row { flex-direction: column; align-items: flex-start; gap: 12px; }
  .fe-stack-label { width: auto; }

  /* ── Testimonial ── */
  .fe-testimonial-inner { grid-template-columns: 1fr; gap: 32px; }
  .fe-quote-text { font-size: 18px; }
  .fe-quote-mark { font-size: 80px; }

  /* ── All section padding ── */
  .fe-pillars, .fe-stack, .fe-testimonial,
  .cd-mandates, .cd-noops, .cd-matrix, .cd-testimonials,
  .ft-caps, .ft-sectors, .ft-cases, .ft-compliance, .ft-impact,
  .ind-impact, .ind-sectors,
  .ss-featured, .ss-portfolio,
  .fe-final-cta, .cd-final-cta, .ft-final-cta,
  .ind-final-cta, .ss-final-cta, .au-final-cta {
    padding-left: 24px;
    padding-right: 24px;
  }

  /* ── CTA buttons — full width ── */
  .fe-cta-btn, .cd-cta-btn, .ft-cta-btn,
  .ind-cta-btn, .ss-btn-primary, .ss-btn-secondary,
  .fe-cta-large, .cd-cta-large, .ft-cta-large,
  .ind-cta-large, .ss-btn-large {
    width: 100%;
    justify-content: center;
    text-align: center;
  }

  /* ── ROI / metrics grids ── */
  .ss-roi-grid { grid-template-columns: repeat(3, 1fr); }
  .ss-card-metrics { flex-wrap: wrap; gap: 12px; }
}

/* ═══════════════════════════════════════
   LARGE PHONES — max 600px
   ═══════════════════════════════════════ */
@media (max-width: 600px) {

  /* ── Homepage hero ── */
  .hero-modern { padding: 80px 16px 32px; }
  .hero-title { font-size: 28px; }
  .hero-description { font-size: 14px; line-height: 1.7; }
  .hero-badge { font-size: 12px; padding: 8px 14px; }
  .btn-primary, .btn-secondary { padding: 14px 24px; font-size: 14px; }

  /* ── Page heroes ── */
  .page-hero, .hero-section { padding: 90px 16px 40px !important; }
  .fe-hero, .cd-hero, .ft-hero, .ind-hero, .ss-hero,
  .ht-hero, .gt-hero, .cs-hero, .me-hero, .de-hero,
  .ml-hero, .es-hero, .mvp-hero, .bs-hero {
    padding: 90px 16px 40px;
  }
  .fe-hero-title, .cd-hero-title, .ft-hero-title,
  .ind-hero-title, .ss-hero-title, .ht-hero-title,
  .gt-hero-title, .cs-hero-title, .me-hero-title,
  .de-hero-title, .ml-hero-title, .es-hero-title,
  .mvp-hero-title, .bs-hero-title {
    font-size: 30px;
    letter-spacing: -0.5px;
  }
  .fe-hero-sub, .cd-hero-sub, .ft-hero-sub,
  .ind-hero-sub, .ss-hero-sub {
    font-size: 14px;
    margin-bottom: 28px;
  }
  .fe-hero-badge, .cd-hero-badge, .ft-hero-badge,
  .ind-hero-badge, .ss-hero-badge {
    font-size: 10px;
    padding: 5px 12px;
  }

  /* ── Section headers ── */
  .fe-section-header h2, .cd-section-header h2, .ft-section-header h2,
  .ind-section-header h2, .ss-section-header h2, .ht-section-header h2,
  .gt-section-header h2, .cs-section-header h2, .au-section-header h2 {
    font-size: 26px;
  }
  .fe-section-header p, .cd-section-header p, .ft-section-header p,
  .ind-section-header p, .ss-section-header p {
    font-size: 14px;
  }
  .fe-section-header, .cd-section-header, .ft-section-header,
  .ind-section-header, .ss-section-header {
    margin-bottom: 40px;
  }

  /* ── Section padding — tighter ── */
  section, .section { padding: 50px 16px !important; }

  /* ── Stats ── */
  .stats-grid { grid-template-columns: 1fr 1fr; gap: 16px; }
  .stat-number { font-size: 32px; }
  .stat-label { font-size: 12px; }

  /* ── Impact grids ── */
  .ind-impact-num, .ft-impact-num { font-size: 40px; }

  /* ── Cards ── */
  .service-item, .feature-item { padding: 24px 16px; }
  .service-icon, .feature-icon { width: 48px; height: 48px; font-size: 22px; }
  .fe-pillar-card { padding: 28px 20px; }
  .fe-pillar-card h3 { font-size: 15px; }
  .fe-pillar-card p { font-size: 13px; }
  .cd-mandate-card { padding: 28px 20px; }

  /* ── CTA ── */
  .cta-section h2 { font-size: 24px; }
  .cta-section p { font-size: 14px; }

  /* ── Final CTAs ── */
  .fe-final-cta h2, .cd-final-cta h2, .ft-final-cta h2,
  .ind-final-cta h2, .ss-final-cta h2, .au-final-cta h2 {
    font-size: 28px;
  }
  .fe-final-cta p, .cd-final-cta p, .ft-final-cta p,
  .ind-final-cta p, .ss-final-cta p, .au-final-cta p {
    font-size: 14px;
  }

  /* ── Center illustration ── */
  .center-illustration { width: 180px; height: 180px; }
  .main-illustration { width: 150px; }
  .hero-visual { height: 250px; }

  /* ── ROI grids ── */
  .ss-roi-grid { grid-template-columns: 1fr 1fr; }
  .ss-split-text h2 { font-size: 26px; }

  /* ── Trust badges ── */
  .fe-trust-num { font-size: 40px; }
  .fe-trust-badge { padding: 20px 24px; }

  /* ── Quote ── */
  .fe-quote-text { font-size: 16px; }
  .fe-quote-mark { font-size: 60px; }

  /* ── About page ── */
  .au-hero-title { font-size: 32px; }
  .au-origin-text h2 { font-size: 28px; }
  .au-year-text { font-size: 64px; }
  .au-hubs { flex-wrap: wrap; gap: 16px; justify-content: center; }
  .au-hub-line { display: none; }
  .au-origin-stats { flex-direction: column; gap: 20px; }
  .au-dna-card { padding: 28px 20px; }
  .au-step { padding: 0; }
  .au-step-number { font-size: 48px; }
}

/* ═══════════════════════════════════════
   SMALL PHONES — max 380px
   (iPhone SE, Galaxy S series, etc.)
   ═══════════════════════════════════════ */
@media (max-width: 380px) {

  .hero-modern { padding: 72px 14px 28px; }
  .hero-title { font-size: 24px; }
  .hero-description { font-size: 13px; }
  .hero-badge { font-size: 11px; padding: 6px 12px; }

  section, .section { padding: 40px 14px !important; }
  .page-hero, .hero-section { padding: 80px 14px 36px !important; }

  .fe-hero, .cd-hero, .ft-hero, .ind-hero, .ss-hero,
  .ht-hero, .gt-hero, .cs-hero, .me-hero, .de-hero,
  .ml-hero, .es-hero, .mvp-hero, .bs-hero {
    padding: 80px 14px 32px;
  }
  .fe-hero-title, .cd-hero-title, .ft-hero-title,
  .ind-hero-title, .ss-hero-title, .ht-hero-title,
  .gt-hero-title, .cs-hero-title, .me-hero-title,
  .de-hero-title, .ml-hero-title, .es-hero-title,
  .mvp-hero-title, .bs-hero-title {
    font-size: 26px;
  }

  .fe-section-header h2, .cd-section-header h2, .ft-section-header h2,
  .ind-section-header h2, .ss-section-header h2, .ht-section-header h2,
  .gt-section-header h2, .cs-section-header h2, .au-section-header h2 {
    font-size: 22px;
  }

  .stats-grid { gap: 12px; }
  .stat-number { font-size: 28px; }
  .stat-label { font-size: 11px; }

  .service-item, .feature-item { padding: 20px 14px; }
  .service-item h3, .feature-item h3 { font-size: 16px; }

  .cta-section { padding: 36px 14px; }
  .cta-section h2 { font-size: 22px; }

  .fe-final-cta h2, .cd-final-cta h2, .ft-final-cta h2,
  .ind-final-cta h2, .ss-final-cta h2, .au-final-cta h2 {
    font-size: 24px;
  }

  .ss-roi-grid { grid-template-columns: 1fr; }
  .ind-impact-grid { grid-template-columns: 1fr; }

  .au-hero-title { font-size: 28px; }
  .au-year-text { font-size: 52px; }
  .au-section-header h2 { font-size: 24px; }
  .au-final-cta h2 { font-size: 26px; }
}