/* CC&A StratEx — Responsive Hardening V9
   Consolidates mobile behavior after legacy/iterative CSS layers. */

html, body { max-width: 100%; overflow-x: clip; }
.site-shell, main, section, article, aside, header, footer, nav { min-width: 0; }
img, picture, video, iframe, svg, canvas { max-width: 100%; }
img { height: auto; }
.container, .hv82-container { min-width: 0; }
[class*="grid"] > *, [class*="hero"] > *, [class*="layout"] > * { min-width: 0; }

@media (max-width: 860px) {
  .container, .hv82-container {
    width: min(calc(100% - 32px), 1180px) !important;
    max-width: calc(100% - 32px) !important;
    margin-left: auto !important;
    margin-right: auto !important;
  }

  .cca-header-v8 .header-inner {
    width: calc(100% - 24px) !important;
    max-width: calc(100% - 24px) !important;
    min-width: 0 !important;
    display: flex !important;
    align-items: center !important;
    gap: 12px !important;
  }
  .cca-header-v8 .brand { min-width: 0; max-width: calc(100% - 66px); overflow: visible; }
  .cca-header-v8 .brand img { width: min(166px, 48vw) !important; max-width: 100% !important; max-height: 43px !important; object-fit: contain; }
  .cca-header-v8 .menu-toggle { flex: 0 0 auto; margin-left: auto !important; }
  .cca-header-v8 .mobile-nav.open {
    max-height: calc(100dvh - 70px);
    overflow-y: auto;
    overscroll-behavior: contain;
  }

  h1, h2, h3, h4, p, li, a, strong, span { word-break: normal; overflow-wrap: break-word; hyphens: none; }
  h1, h2, h3 { max-width: 100% !important; text-wrap: balance; }
  p, li { max-width: 100%; }

  /* Outsourcing 360: final cascade override. */
  .oc360-page .container { width: min(calc(100% - 32px), 100%) !important; }
  .oc360-hero-grid,
  .oc360-process-wrap,
  .oc360-model-grid,
  .oc360-diagnostic-layout,
  .oc360-score-item {
    grid-template-columns: minmax(0, 1fr) !important;
    width: 100% !important;
  }
  .oc360-hero-grid { gap: 26px !important; padding: 54px 0 46px !important; }
  .oc360-hero-copy, .oc360-hero-visual { width: 100% !important; min-width: 0 !important; }
  .oc360-hero-copy h1 { font-size: clamp(2.55rem, 12vw, 4rem) !important; line-height: 1.01 !important; letter-spacing: -.055em !important; }
  .oc360-hero-copy p { font-size: 1.02rem !important; line-height: 1.72 !important; }
  .oc360-hero-photo { width: 100% !important; border-radius: 24px !important; }
  .oc360-hero-photo img { width: 100% !important; height: auto !important; min-height: 0 !important; aspect-ratio: 4 / 3; object-fit: cover; }
  .oc360-hero-card { width: 100% !important; margin: 12px 0 0 !important; padding: 20px !important; }
  .oc360-value-band { grid-template-columns: minmax(0, 1fr) !important; padding: 22px !important; }
  .oc360-badge { width: 72px !important; height: 72px !important; }
  .oc360-grid-2, .oc360-grid-3, .oc360-grid-5, .oc360-kpi-grid, .oc360-dual-card, .oc360-metrics, .oc360-steps, .oc360-scale { grid-template-columns: minmax(0, 1fr) !important; }
  .oc360-anchor-nav .container {
    display: flex !important;
    flex-wrap: nowrap !important;
    overflow-x: auto !important;
    scrollbar-width: thin;
    padding-block: 10px !important;
  }
  .oc360-anchor-nav a { flex: 0 0 auto; white-space: nowrap; }

  /* Core corporate layouts. */
  .premium-services-grid, .page-hero-grid, .hero-inner, .split, .intro-grid, .contact-grid, .footer-grid { grid-template-columns: minmax(0, 1fr) !important; }
  .premium-map-card { grid-template-columns: 42px minmax(0, 1fr) !important; gap: 14px !important; padding: 20px !important; }
  .premium-map-card strong:first-child { width: 42px !important; height: 42px !important; }
  .hv82-solution-grid { grid-template-columns: minmax(0, 1fr) !important; }
  .hv82-solution-featured { grid-column: auto !important; }
  .hv82-solution-card { min-height: 0 !important; }

  .hero-actions, .oc360-actions, .oc360-cta-actions, .hv82-card-actions { max-width: 100%; }
  .hero-actions .btn, .oc360-actions .btn, .oc360-cta-actions .btn { max-width: 100%; white-space: normal !important; }
  .whatsapp-float { right: 12px !important; max-width: calc(100vw - 24px) !important; }
}

@media (max-width: 640px) {
  .container, .hv82-container, .oc360-page .container {
    width: calc(100% - 28px) !important;
    max-width: calc(100% - 28px) !important;
  }
  .cca-header-v8 .brand img { width: min(154px, 50vw) !important; }
  .section, .hv82-section { padding-top: 58px !important; padding-bottom: 58px !important; }
  .premium-services-hero h1, .page-hero h1 { font-size: clamp(2.35rem, 11.5vw, 3.6rem) !important; line-height: 1.02 !important; }
  .hv82-solution-card, .service-card, .fast-service-card, .oc360-card, .oc360-package { padding-left: 20px !important; padding-right: 20px !important; }
  table { display: block; width: 100%; max-width: 100%; overflow-x: auto; -webkit-overflow-scrolling: touch; }
  input, select, textarea, button { max-width: 100%; }
}

@media (max-width: 420px) {
  .container, .hv82-container, .oc360-page .container {
    width: calc(100% - 24px) !important;
    max-width: calc(100% - 24px) !important;
  }
  .cca-header-v8 .brand img { width: min(144px, 52vw) !important; }
  .oc360-hero-copy h1 { font-size: clamp(2.35rem, 12.5vw, 3.25rem) !important; }
  .btn, .hv82-btn { max-width: 100%; white-space: normal !important; text-align: center; }
}
