/* =========================================================
   AJWA GROUP — responsive.css
   Breakpoints: 1920 / 1440 / 1280 / 1024 / 768 / 430 / 390 / 360
   ========================================================= */

/* Large desktop (1440+) — base styles already tuned for this */

/* 1280px */
@media (max-width: 1280px) {
  :root { --container: min(1180px, calc(100% - 40px)); }
}

/* 1024px — tablet */
@media (max-width: 1024px) {
  :root { --section-y: clamp(70px, 10vw, 110px); }

  .intro__grid,
  .about-intro__grid { grid-template-columns: 1fr; gap: 1.5rem; }
  .intro__label-col { padding-top: 0; }

  .purpose__grid { grid-template-columns: 1fr; }
  .purpose__media { aspect-ratio: 16/10; max-height: none; }

  .observer-panel { grid-template-columns: 1fr; gap: 1.5rem; padding: 1.5rem; align-content: center; }
  .observer-panel__media { aspect-ratio: 16/10; max-height: 40vh; }

  .stats__grid { grid-template-columns: repeat(2, 1fr); gap: 2.5rem 2rem; }

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

  .footer-grid { grid-template-columns: 1fr 1fr; gap: 2rem 2.5rem; }
  .footer-brand { grid-column: 1 / -1; }

  .leadership__grid { grid-template-columns: 1fr; }
  .leadership__portrait { max-width: none; aspect-ratio: 16 / 9; }

  .value-section { grid-template-columns: 1fr; gap: 2rem; }
  .value-section--dark .value-section__media { order: 0; }
  .value-index { display: none; }
  .values-layout { grid-template-columns: 1fr !important; gap: 1.5rem; }

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

  .priority-list { grid-template-columns: 1fr; }
  .priority-item { border-right: none; }

  .mv-split { grid-template-columns: 1fr; }
  .mv-half { border-right: none; border-bottom: 1px solid var(--border-dark); min-height: 50vh; }
  .mv-half:last-child { border-bottom: none; }
}

/* 768px — mobile / small tablet */
@media (max-width: 768px) {
  :root { --section-y: clamp(60px, 9vw, 90px); --container: min(720px, calc(100% - 32px)); }

  .header-inner { padding: 1.2rem 1rem; }
  .header-contact { display: none; }

  .fm-body { grid-template-columns: 1fr; gap: 2rem; padding-top: 1rem; align-content: start; }
  .fm-nav a { font-size: clamp(2rem, 9vw, 3rem); }
  .fm-aside { gap: 1.6rem; }

  /* Companies grid → single column on mobile */
  .companies-stack > .container { grid-template-columns: 1fr; gap: 2.5rem; }
  .company-card { gap: 1rem; }
  .company-card__media { aspect-ratio: 16/10; }

  .hero { min-height: 90vh; }
  .hero__bottom { position: static; padding-inline: 0; margin-top: 2.5rem; }
  .hero__bottom-inner { flex-direction: column; align-items: flex-start; gap: 1rem; }

  .values-preview__head { grid-template-columns: 1fr; }
  .value-row { grid-template-columns: 50px 1fr 30px; gap: 1rem; }
  .value-row__desc { display: none; }

  /* Value sections → stacked cards on mobile */
  .value-section {
    background: var(--white);
    border: 1px solid var(--border-light);
    border-radius: 16px;
    padding: clamp(1.4rem, 5vw, 2rem);
    gap: 1.4rem;
    box-shadow: 0 10px 30px rgba(8, 21, 16, 0.06);
  }
  .value-section--dark { background: var(--primary-deep); border-color: transparent; }
  .value-section__media { aspect-ratio: 16 / 10; border-radius: 12px; }
  .value-section__num { font-size: clamp(3rem, 14vw, 4.5rem); margin-bottom: 0.4rem; }
  .value-section__title { font-size: clamp(1.6rem, 7vw, 2.2rem); margin-bottom: 0.8rem; }
  .value-section__text { font-size: 1.02rem; max-width: none; }

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

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

  .footer-grid { grid-template-columns: 1fr; gap: 2rem; }
  .footer-bottom { flex-direction: column; align-items: flex-start; }

  .timeline__item { grid-template-columns: 1fr; gap: 0.5rem; margin-bottom: 2.5rem; }
  .timeline__line { left: 8px; }
  .timeline__dot { grid-column: 1; justify-self: start; }
  .timeline__item:nth-child(odd) .timeline__content,
  .timeline__item:nth-child(even) .timeline__content { grid-column: 1; text-align: left; padding: 0 0 0 2.5rem; }

  .form-row { grid-template-columns: 1fr; }

  .cta__actions .btn { flex: 1; justify-content: center; }
}

/* 430px — large phone */
@media (max-width: 430px) {
  .hero__actions { flex-direction: column; align-items: stretch; width: 100%; }
  .hero__actions .btn { justify-content: center; }
  .stats__grid { grid-template-columns: 1fr; }
  .btn { width: 100%; justify-content: center; }
  .btn.text-link, .text-link { width: auto; }
}

/* 390px */
@media (max-width: 390px) {
  .hero-title { font-size: clamp(2.6rem, 13vw, 3.4rem); }
  .section-title { font-size: clamp(2rem, 9vw, 2.8rem); }
  .fm-nav a { font-size: 1.9rem; }
}

/* 360px */
@media (max-width: 360px) {
  :root { --container: calc(100% - 24px); }
  .header-inner { padding: 1rem 0.6rem; }
  .brand-logo { font-size: 0.95rem; }
}

/* Disable custom cursor below 1024px */
@media (max-width: 1024px), (pointer: coarse) {
  .cursor, .cursor-follower, .cursor-label { display: none !important; }
  body.cursor-ready, body.cursor-ready a, body.cursor-ready button { cursor: auto !important; }
}