/* AILuce responsive architecture. Mobile-first corrections; desktop >= 1024px stays approved. */

@media (max-width: 1023px) {
  :root { --mobile-gutter: 24px; }
  html, body { max-width: 100%; overflow-x: clip; }
  .container { width: 100%; padding-inline: var(--mobile-gutter); }
  .section, .internal-page .section { padding-block: 4.5rem; }
  .section-head { margin-bottom: 2rem; }
  .btn, button, .nav-mobile a { min-height: 44px; }

  .nav-mobile {
    top: 72px; bottom: auto; max-height: calc(100dvh - 72px);
    overflow-y: auto; overscroll-behavior: contain;
    padding: .7rem var(--mobile-gutter) max(1.25rem, env(safe-area-inset-bottom));
  }
  .nav-mobile a { display: flex; align-items: center; padding: .7rem 0; }
  .nav-mobile .btn { justify-content: center; }

  .footer-grid { grid-template-columns: 1.4fr 1fr 1fr; gap: 2rem; }
  .footer-brand { grid-column: 1 / -1; }
  .footer-bottom { margin-top: 2rem; }

  .book-modal { height: min(760px, calc(100dvh - 2rem)); }
  .cal-embed { height: min(720px, 78dvh); }

  /* Internal pages: copy first, bounded visual second. */
  .internal-page .page-hero { padding-block: 7.5rem 4.5rem; }
  .internal-page .page-hero > .container { grid-template-columns: 1fr; gap: 2.5rem; }
  .internal-page .page-hero h1 { font-size: clamp(3rem, 8vw, 5rem); max-width: 12ch; }
  .page-system { min-height: 0; }
  .system-body { position: relative; inset: auto; min-height: 430px; }
  .internal-page .svc-block { min-height: 0; padding-block: 3.5rem; }
}

@media (max-width: 899px) {
  /* Homepage hero remains the approved composition, with compact mobile spacing. */
  .home-hero { min-height: auto; padding-block: 7rem 4rem; }
  .home-hero-shell { gap: 2.5rem; }
  .home-hero-copy h1 { font-size: clamp(3rem, 10vw, 5rem); line-height: .96; }
  .system-stage { min-height: 360px; }

  /* Every film scene becomes normal flow: headline, then a self-contained visual. */
  .home-film .film-scene,
  .home-film .film-orchestration,
  .home-film .film-voice,
  .home-film .film-crm,
  .home-film .film-web,
  .home-film .film-content,
  .home-film .film-demo,
  .home-film .film-control {
    min-height: 0;
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    grid-template-rows: auto auto;
    gap: 2.25rem;
    padding: 4.5rem var(--mobile-gutter);
    overflow: clip;
  }
  .home-film .film-copy,
  .home-film .film-copy-right,
  .home-film .film-demo .film-copy {
    position: relative; inset: auto; width: 100%; max-width: 680px;
    justify-self: start; text-align: left;
  }
  .home-film .film-copy-right h2 { margin-left: 0; }
  .home-film .film-copy h2,
  .home-film .film-demo .film-copy h2 {
    font-size: clamp(3.1rem, 9vw, 5rem); line-height: .94;
    max-width: 11ch; overflow-wrap: normal;
  }
  .home-film .film-canvas {
    position: relative; inset: auto; width: 100%; height: auto;
    min-width: 0; min-height: 0; overflow: clip; border-radius: 20px;
  }

  .home-film .orchestration-canvas { height: 530px; }
  .home-film .orchestration-map { width: 132%; max-width: none; left: 50%; top: 50%; bottom: auto; transform: translate(-50%, -50%); }
  .home-film .film-event-stack { right: 1rem; bottom: 1rem; }

  .home-film .voice-canvas { min-height: 610px; display: grid; grid-template-columns: 1fr 1fr; gap: 1.25rem; align-items: center; }
  .home-film .phone-system { position: relative; inset: auto; width: 100%; height: 560px; }
  .home-film .voice-routing { position: relative; inset: auto; width: 100%; }

  .home-film .crm-canvas { height: auto; min-height: 0; padding-top: 0; overflow: hidden; }
  .home-film .crm-top { position: relative; inset: auto; min-width: 0; height: 68px; }
  .home-film .crm-board { position: relative; inset: auto; min-width: 0; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .home-film .crm-column { min-height: 230px; }
  .home-film .crm-activity { position: relative; inset: auto; width: auto; height: auto; grid-template-columns: repeat(4, 1fr); }

  .home-film .web-canvas { overflow: visible; }
  .home-film .build-track { position: relative; inset: auto; width: 100%; height: auto; display: grid; grid-template-columns: repeat(5, 1fr); }
  .home-film .build-phase { min-height: 360px; }
  .home-film .build-progress { position: relative; inset: auto; margin-top: 1.5rem; }

  .home-film .idea-canvas { min-height: 560px; }
  .home-film .idea-paths { inset: 4% 5%; width: 90%; height: 92%; }
  .home-film .idea-core, .home-film .film-content .idea-core { top: 50%; }

  .home-film .demosphere-canvas { display: grid; grid-template-columns: 1fr; gap: 1rem; }
  .home-film .demo-browser { position: relative; inset: auto; width: 100%; height: 430px; }
  .home-film .demo-agent { position: relative; inset: auto; width: 100%; min-height: 0; }
  .home-film .intent-card { display: none; }

  .home-film .control-canvas { display: grid; grid-template-columns: 1fr; gap: 1rem; overflow: visible; }
  .home-film .control-map { position: relative; inset: auto; width: 100%; height: auto; }
  .home-film .control-log { position: relative; inset: auto; width: 100%; height: auto; }

  .home-film .film-finale { min-height: 80svh; padding: 5rem var(--mobile-gutter) 6rem; }
  .home-film .film-finale-copy { padding: 0; }

  /* Service narratives read before their demonstration on smaller screens. */
  .internal-page .svc-block { display: flex; flex-direction: column; gap: 2rem; }
  .internal-page .svc-copy { order: 1; }
  .internal-page .svc-visual { order: 2; width: 100%; }
  .internal-page .team-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}

@media (max-width: 767px) {
  :root { --mobile-gutter: 20px; }
  body { font-size: 1rem; }
  h1 { font-size: clamp(2.45rem, 10vw, 4rem); }
  h2 { font-size: clamp(1.85rem, 7vw, 2.8rem); }
  .section, .internal-page .section { padding-block: 3.75rem; }
  .footer-grid { grid-template-columns: 1fr 1fr; gap: 2rem 1.5rem; }
  .footer-brand { grid-column: 1 / -1; }

  .internal-page .page-hero { padding-block: 6.75rem 3.75rem; }
  .internal-page .page-hero > .container { gap: 2rem; }
  .internal-page .page-hero h1 { font-size: clamp(2.75rem, 10.5vw, 4.4rem); }
  .internal-page .team-grid { grid-template-columns: 1fr; max-width: 34rem; }
  .internal-page .team-photo { max-width: 28rem; margin-inline: auto; }

  .home-film .film-scene,
  .home-film .film-orchestration,
  .home-film .film-voice,
  .home-film .film-crm,
  .home-film .film-web,
  .home-film .film-content,
  .home-film .film-demo,
  .home-film .film-control { padding-block: 4rem; }
  .home-film .film-copy h2, .home-film .film-demo .film-copy h2 { font-size: clamp(2.9rem, 11.5vw, 4.5rem); }
  .home-film .orchestration-canvas { height: 470px; }
  .home-film .orchestration-map { width: 155%; }
  .home-film .film-event-stack p:nth-child(-n+2) { display: none; }
  .home-film .voice-canvas { grid-template-columns: 1fr; min-height: 0; }
  .home-film .phone-system { height: 500px; }
  .home-film .voice-routing { max-width: 560px; margin-inline: auto; }
  .home-film .build-track { grid-template-columns: repeat(5, minmax(150px, 1fr)); overflow-x: auto; padding-bottom: .5rem; scroll-snap-type: x proximity; }
  .home-film .build-phase { min-height: 330px; scroll-snap-align: start; }
  .home-film .idea-canvas { min-height: 520px; }
  .home-film .demo-browser { height: 400px; }
  .demo-app { grid-template-columns: 90px 1fr; }
}

@media (max-width: 639px) {
  .home-actions { align-items: stretch; }
  .home-actions .btn { justify-content: center; }
  .system-stage { min-height: 345px; padding-inline: .75rem; }
  .system-step { grid-template-columns: 28px minmax(0, 1fr); }
  .system-step small { grid-column: 2; text-align: left; }
  .system-rail { left: 27px; }

  .page-system header { height: auto; min-height: 46px; }
  .system-body { min-height: 390px; padding: 1rem; }
  .service-spectrum { grid-template-columns: 1fr 1fr; }
  .sales-journey { grid-template-columns: 1fr; grid-auto-rows: auto; overflow: visible; }
  .sales-journey div { min-height: 92px; }
  .concept-ui { grid-template-columns: 1fr; }
  .concept-nav { display: none; }
  .content-hub { min-height: 410px; display: grid; grid-template-columns: 1fr 1fr; gap: .65rem; align-content: end; padding-top: 110px; }
  .content-source { top: 1rem; transform: translateX(-50%); }
  .content-channel { position: relative; inset: auto !important; width: auto; min-width: 0; }
  .content-channel::after { display: none; }
  .team-process { grid-template-columns: 1fr 1fr; }
  .contact-paths { grid-template-columns: 1fr; }

  .home-film .orchestration-canvas { height: 420px; }
  .home-film .orchestration-map { width: 185%; }
  .home-film .film-event-stack { display: none; }
  .home-film .crm-board { grid-template-columns: 1fr 1fr; }
  .home-film .crm-column { padding: .7rem; min-height: 205px; }
  .home-film .crm-column article { padding: .7rem; }
  .home-film .crm-activity { grid-template-columns: 1fr 1fr; }
  .home-film .crm-activity p { border-right: 0; border-bottom: 1px solid var(--home-line); }

  .home-film .idea-canvas { min-height: 0; display: grid; grid-template-columns: 1fr 1fr; gap: .7rem; padding-top: 0; }
  .home-film .idea-paths { display: none; }
  .home-film .idea-core, .home-film .film-content .idea-core { position: relative; inset: auto; transform: none; width: 100%; min-height: 130px; grid-column: 1 / -1; }
  .home-film .channel { position: relative; inset: auto; width: 100%; min-width: 0; opacity: 1; transform: none; }
  .home-film .demo-browser { height: auto; min-height: 350px; }
  .home-film .demo-app { min-height: 306px; }
  .home-film .demo-app nav span:nth-last-child(-n+2) { display: none; }
  .home-film .integration-map { flex-wrap: wrap; justify-content: center; }
  .home-film .control-log p { grid-template-columns: auto 1fr; }
  .home-film .control-log b { grid-column: 2; }

  .lucy-panel { height: min(78dvh, 560px); }
  .lucy-fab { width: 44px; height: 44px; right: .65rem; bottom: max(.65rem, env(safe-area-inset-bottom)); }
}

@media (max-width: 479px) {
  :root { --mobile-gutter: 16px; }
  .site-header .container { padding-inline: 16px; }
  .logo img { height: 30px; }
  .home-hero { padding-block: 6.5rem 3.5rem; }
  .home-hero-copy h1 { font-size: clamp(2.7rem, 12.5vw, 3.8rem); }
  .home-actions { display: grid; grid-template-columns: 1fr; gap: .75rem; }
  .home-text-action { justify-self: start; }
  .section, .internal-page .section { padding-block: 3.25rem; }
  .footer-grid { grid-template-columns: 1fr; gap: 1.75rem; }
  .footer-brand { grid-column: auto; }
  .footer-bottom { display: grid; }

  .internal-page .page-hero { padding-block: 6.25rem 3.25rem; }
  .internal-page .page-hero h1 { font-size: clamp(2.6rem, 12vw, 3.7rem); line-height: .96; }
  .internal-page .page-hero .btn { width: 100%; justify-content: center; }
  .internal-page .svc-block { padding-block: 2.75rem; }
  .internal-page .svc-copy .btn { width: 100%; justify-content: center; }
  .page-system { border-radius: 15px; }

  .home-film .film-scene,
  .home-film .film-orchestration,
  .home-film .film-voice,
  .home-film .film-crm,
  .home-film .film-web,
  .home-film .film-content,
  .home-film .film-demo,
  .home-film .film-control { gap: 1.75rem; padding-block: 3.5rem; }
  .home-film .film-copy h2, .home-film .film-demo .film-copy h2 { font-size: clamp(2.65rem, 12.7vw, 3.75rem); max-width: 10ch; }
  .home-film .orchestration-canvas { height: 360px; }
  .home-film .phone-system { height: 455px; }
  .home-film .crm-top { padding-inline: .8rem; }
  .home-film .crm-top b { font-size: 1.05rem; }
  .home-film .crm-column { min-height: 190px; }
  .home-film .crm-column article:nth-of-type(n+2) { display: none; }
  .home-film .build-track { grid-template-columns: 1fr; overflow: visible; }
  .home-film .build-phase { min-height: 150px; }
  .home-film .wireframe div { grid-template-columns: repeat(4, 1fr); }
  .home-film .wireframe i { height: 42px; }
  .home-film .design div { grid-template-columns: repeat(3, 1fr); }
  .home-film .demo-browser { min-height: 330px; }
  .home-film .demo-app { grid-template-columns: 72px 1fr; min-height: 286px; }
  .home-film .demo-app nav { padding: .5rem; font-size: .62rem; }
  .home-film .demo-app nav strong { overflow-wrap: anywhere; }
  .home-film .demo-app-title strong { font-size: 1.35rem; }
  .home-film .demo-agent { padding: 1rem; }
  .home-film .control-map { min-width: 0; }
  .home-film .film-finale { min-height: 70svh; padding-block: 4.5rem 6rem; }
  .home-film .film-finale-copy h2 { font-size: clamp(3rem, 15vw, 4.6rem); }
  .home-film .film-finale-copy .home-actions { width: 100%; }

  .book-modal { width: calc(100vw - 1rem); height: calc(100dvh - 1rem); }
  .book-modal-bar { padding: .7rem; }
}

@media (prefers-reduced-motion: reduce) {
  .home-film .channel, .home-film .build-phase, .page-system * { animation: none !important; }
}