/* ─────────────────────────────────────────────────────
   OSUS Responsive System
   Breakpoints: 1440 / 1280 / 1024 / 768 / 430 / 390 / 360
   ───────────────────────────────────────────────────── */

/* ── Desktop Large: 1440px+ ─────────────────────────── */
/* Base styles already target 1440 via fluid clamp() */

/* ── Desktop: 1024–1280px ───────────────────────────── */
@media (max-width: 1280px) {
  .mega-menu {
    max-width: 900px;
  }
  .section-title {
    font-size: clamp(1.875rem, 3.5vw, 2.5rem);
  }
}

/* ── Tablet/Large: 1024px ───────────────────────────── */
@media (max-width: 1023px) {
  .nav-desktop { display: none; }
  .nav-mobile-trigger { display: flex; }

  /* Hero (new light homepage) — handled in home.css */

  .decision-grid {
    grid-template-columns: 1fr;
  }
  .decision-persona-list {
    grid-template-columns: repeat(3, 1fr);
  }
  .decision-panel { grid-row: 2; }

  .ecosystem-stages { flex-wrap: wrap; }

  .programs-grid { grid-template-columns: repeat(2, 1fr); }

  .community-grid { grid-template-columns: repeat(2, 1fr); }

  .layout-split,
  .layout-split--60-40,
  .layout-split--40-60 {
    grid-template-columns: 1fr;
    gap: var(--space-12);
  }

  .layout-split > *:first-child { order: 2; }
  .layout-split > *:last-child  { order: 1; }
}

/* ── Tablet: 768–1023px ─────────────────────────────── */
@media (max-width: 767px) {
  :root {
    --container-padding: 1.25rem;
    --section-py: clamp(3rem, 6vw, 5rem);
  }

  .decision-persona-list {
    grid-template-columns: repeat(2, 1fr);
  }

  .programs-grid { grid-template-columns: 1fr; }

  .community-grid { grid-template-columns: 1fr; }

  .grid--2,
  .grid--3,
  .grid--4 { grid-template-columns: 1fr; }

  .stats-grid {
    grid-template-columns: repeat(2, 1fr);
  }

  .cta-buttons {
    flex-direction: column;
    align-items: stretch;
  }
  .cta-buttons .btn {
    justify-content: center;
  }

  /* Hero responsive — handled in home.css */

  .mega-menu { display: none; }

  .footer-grid { grid-template-columns: 1fr 1fr; gap: var(--space-8); }
  .footer-brand { grid-column: 1 / -1; padding-inline-end: 0; border-inline-end: none; border-bottom: 1px solid rgba(145, 185, 180, 0.08); padding-bottom: var(--space-8); }

  .ai-flow-grid { grid-template-columns: 1fr; }

  .investment-grid { grid-template-columns: 1fr; }

  .opportunity-card__meta { grid-template-columns: 1fr 1fr; }
}

/* ── Mobile: 430px ───────────────────────────────────── */
@media (max-width: 430px) {
  .hero-shell { padding-block: var(--space-12); padding-inline: var(--space-6); }
  .hero-headline { font-size: clamp(1.625rem, 7vw, 2rem); }
  .hero-btn-primary { padding: 0.75rem 1.25rem; font-size: var(--text-sm); }
  .hero-scroll-cue { display: none; }
}

@media (max-width: 430px) {
  :root { --container-padding: 1rem; }

  .decision-persona-list { grid-template-columns: 1fr; }

  .stats-grid { grid-template-columns: repeat(2, 1fr); }

  .network-tile { padding: var(--space-6); }

  .modal {
    padding: var(--space-6);
    border-radius: var(--radius-xl);
  }

  .footer-grid { grid-template-columns: 1fr; gap: var(--space-6); }
  .footer-brand { grid-column: 1; }

  .assessment-options { grid-template-columns: 1fr; }
}

/* ── Mobile: 360px ───────────────────────────────────── */
@media (max-width: 360px) {
  :root { --container-padding: 0.875rem; }

  .btn--xl { padding: 1rem 1.75rem; font-size: var(--text-base); }
}

/* ── Touch target sizing ────────────────────────────── */
@media (hover: none) {
  .btn { min-height: 48px; }
  .accordion-trigger { min-height: 52px; }
  .filter-btn { min-height: 44px; }
  .persona-card { cursor: pointer; }

  /* Disable hover-only effects */
  .btn--primary:hover { transform: none; }
  .card:hover { transform: none; }
  .network-tile:hover { transform: none; }
}

/* ── No horizontal overflow ─────────────────────────── */
html, body {
  overflow-x: clip;
  max-width: 100%;
}

/* Prevent any element from causing overflow */
.section,
.container,
.hero-section {
  max-width: 100%;
  overflow-x: clip;
}
