/* FDR mobile-first refinement layer · 2026-09-07
   Loaded last on public pages. Desktop is intentionally untouched. */

@media (max-width: 900px) {
  html { scroll-padding-top: 4.5rem; }
  body { overflow-x: hidden; }

  /* Keep the official global identity, but make the mobile header feel intentional. */
  .fdr-public-header {
    background: rgba(251, 251, 248, .96);
    border-color: var(--fdr-line) !important;
    backdrop-filter: blur(18px);
    -webkit-backdrop-filter: blur(18px);
  }
  .fdr-public-header-inner {
    min-height: 4rem;
    padding-left: 1rem !important;
    padding-right: 1rem !important;
    gap: .75rem !important;
  }
  .fdr-public-header .fdr-brand-lockup { gap: .58rem; }
  .fdr-public-header .fdr-brandmark {
    width: 2.35rem;
    height: 2.35rem;
    border-radius: .8rem;
  }
  .fdr-public-header .fdr-wordmark { font-size: .88rem; }
  .fdr-public-header .fdr-descriptor { font-size: .59rem; }
  .fdr-public-mobile-menu > summary {
    min-height: 2.65rem;
    padding: .55rem .82rem !important;
    border-radius: .8rem;
    font-size: .78rem !important;
  }
  .fdr-public-mobile-panel {
    position: fixed !important;
    top: 4.35rem !important;
    left: 1rem !important;
    right: 1rem !important;
    width: auto !important;
    max-height: calc(100svh - 5.35rem);
    overflow-y: auto;
    overscroll-behavior: contain;
    margin-top: 0 !important;
    padding: .65rem !important;
    border-radius: 1.1rem !important;
    box-shadow: 0 24px 70px rgba(13, 27, 34, .18);
  }
  .fdr-public-mobile-panel .fdr-nav-item {
    min-height: 2.75rem;
    display: flex;
    align-items: center;
    padding: .7rem .85rem !important;
  }
  .fdr-public-mobile-panel .fdr-btn-primary,
  .fdr-public-mobile-panel .fdr-btn-secondary {
    min-height: 2.8rem;
    border-radius: .8rem;
  }

  /* Home: mobile should be a designed composition, not a compressed desktop page. */
  .fdr-home-v3-hero {
    min-height: min(38rem, calc(100svh - 4rem));
  }
  .fdr-home-v3-hero-inner {
    padding: clamp(3.8rem, 11vw, 5rem) 0 3rem;
  }
  .fdr-home-v3-hero-copy { max-width: 38rem; }
  .fdr-home-v3-title { max-width: 10ch; text-wrap: balance; }
  .fdr-home-v3-section-title { text-wrap: balance; }
  .fdr-home-v3-final-inner { gap: 1.35rem; }

  /* Institutional pages: remove desktop-only geometry before the narrowest breakpoint. */
  .fdr-inst-section { padding: 3.75rem 0; }
  .fdr-inst-hero-grid,
  .fdr-inst-founder { gap: 1.75rem; }
  .fdr-inst h1 { max-width: 14ch; text-wrap: balance; }
  .fdr-inst h2 { text-wrap: balance; }
  .fdr-inst-visual { min-height: 18rem; }
  .fdr-inst-card { min-height: 12rem; }
  .fdr-inst-photo-placeholder { min-height: 17rem; }
  .fdr-inst-radial { min-height: 23rem; }
}

@media (max-width: 620px) {
  /* A stable 16px content gutter restores the editorial proportions on phones. */
  .fdr-home-v3-shell,
  .fdr-inst-shell {
    width: calc(100% - 2rem) !important;
  }

  /* Home hero: stronger image/text separation, less wasted vertical space. */
  .fdr-home-v3-hero {
    min-height: min(34rem, calc(100svh - 4rem));
    align-items: end;
  }
  .fdr-home-v3-hero-media img { object-position: 52% center; }
  .fdr-home-v3-hero-media::after {
    background: linear-gradient(
      0deg,
      rgba(13, 27, 34, .96) 0%,
      rgba(13, 27, 34, .82) 38%,
      rgba(22, 49, 58, .42) 72%,
      rgba(22, 49, 58, .20) 100%
    );
  }
  .fdr-home-v3-hero-inner { padding: 3.2rem 0 2.7rem; }
  .fdr-home-v3-eyebrow { margin-bottom: .65rem; font-size: .66rem; }
  .fdr-home-v3-title {
    max-width: 9ch;
    font-size: clamp(2.35rem, 12vw, 3.35rem);
    line-height: .95;
    letter-spacing: -.04em;
  }
  .fdr-home-v3-copy {
    font-size: 1rem;
    line-height: 1.6;
  }
  .fdr-home-v3-hero-copy .fdr-home-v3-copy {
    max-width: 34ch;
    margin-top: 1rem;
  }
  .fdr-home-v3-actions {
    margin-top: 1.35rem;
    gap: .55rem;
  }
  .fdr-home-v3-btn {
    min-height: 2.85rem;
    border-radius: .8rem;
    padding: .68rem 1rem;
  }
  .fdr-home-v3-credit {
    right: auto;
    left: 1rem;
    bottom: .5rem;
    max-width: 82%;
    font-size: .58rem;
    text-align: left;
  }

  .fdr-home-v3-section { padding: 3rem 0; }
  .fdr-home-v3-intro { margin-bottom: 1.5rem; }
  .fdr-home-v3-section-title {
    font-size: clamp(1.75rem, 8.6vw, 2.35rem);
    line-height: 1.03;
  }

  /* Preserve the desktop multi-card rhythm using swipeable editorial rails. */
  .fdr-home-v3-health-grid,
  .fdr-home-v3-access-grid {
    display: grid;
    grid-template-columns: none !important;
    grid-auto-flow: column;
    gap: .75rem;
    overflow-x: auto;
    overscroll-behavior-inline: contain;
    scroll-snap-type: inline mandatory;
    scrollbar-width: thin;
    padding: 0 0 .75rem;
  }
  .fdr-home-v3-health-grid { grid-auto-columns: min(82vw, 20rem); }
  .fdr-home-v3-access-grid { grid-auto-columns: min(86vw, 21.5rem); }
  .fdr-home-v3-health,
  .fdr-home-v3-card { scroll-snap-align: start; }
  .fdr-home-v3-health {
    min-height: 10.5rem;
    padding: 1.1rem;
    border-radius: 1.1rem;
  }
  .fdr-home-v3-health h3 {
    margin: .65rem 0 .35rem;
    font-size: 1.3rem;
  }
  .fdr-home-v3-card {
    min-height: 11rem;
    padding: 1.2rem;
    border-radius: 1.1rem;
  }
  .fdr-home-v3-card h3 {
    margin: .3rem 0 .45rem;
    font-size: 1.45rem;
  }
  .fdr-home-v3-card-action { margin-top: 1rem; }
  .fdr-home-v3-final .fdr-home-v3-section-title { max-width: 12ch; }

  /* Institutional typography: shorter line lengths and lighter vertical rhythm. */
  .fdr-inst-section { padding: 3rem 0; }
  .fdr-inst-breadcrumb {
    gap: .35rem;
    padding-top: 1rem;
    font-size: .72rem;
    line-height: 1.45;
  }
  .fdr-inst h1 {
    margin-bottom: .9rem;
    font-size: clamp(2.2rem, 11vw, 3.15rem);
    line-height: .96;
  }
  .fdr-inst h2 {
    margin-bottom: .9rem;
    font-size: clamp(1.7rem, 8.3vw, 2.3rem);
    line-height: 1.03;
  }
  .fdr-inst h3 { font-size: 1.28rem; }
  .fdr-inst-copy {
    font-size: 1rem;
    line-height: 1.62;
  }
  .fdr-inst-lead {
    max-width: 28ch;
    font-size: clamp(1.2rem, 5.8vw, 1.55rem);
    line-height: 1.35;
  }
  .fdr-inst-hero-grid,
  .fdr-inst-founder { gap: 1.35rem; }

  /* Absolute desktop diagrams become a clean mobile grid. */
  .fdr-inst-visual {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: .65rem;
    align-content: center;
    min-height: 0;
    padding: .9rem;
    border-radius: 1.1rem;
  }
  .fdr-inst-visual > svg {
    grid-column: 1 / -1;
    width: 100%;
    height: auto;
    max-height: 15rem;
  }
  .fdr-inst-visual > .fdr-inst-node {
    position: static !important;
    min-width: 0;
    min-height: 4.6rem;
    padding: .65rem;
    border-radius: 1rem;
    font-size: .68rem;
  }
  .fdr-inst-visual > .fdr-inst-node.is-core {
    grid-column: 1 / -1;
    width: 100%;
  }
  .fdr-inst-visual > .fdr-inst-line { display: none; }

  .fdr-inst-flow { margin-top: 1.5rem; }
  .fdr-inst-step {
    padding: .9rem 1rem .9rem 1.25rem;
  }
  .fdr-inst-step::before { top: 1.15rem; }
  .fdr-inst-step span { margin-top: .35rem; }

  .fdr-inst-challenge { gap: 0; margin-top: 1.2rem; }
  .fdr-inst-challenge article {
    padding: 1rem 0 1rem 1rem;
    border-left: 2px solid var(--i-line);
  }
  .fdr-inst-challenge article + article { border-top: 1px solid var(--i-line); }

  .fdr-inst-card-grid { gap: .75rem; }
  .fdr-inst-card {
    min-height: 10.5rem;
    padding: 1.15rem;
    border-radius: 1.1rem;
  }

  /* Future-discipline states stay compact and swipeable instead of becoming a long stack. */
  .fdr-inst-status-row {
    display: grid;
    grid-template-columns: none !important;
    grid-auto-flow: column;
    grid-auto-columns: min(76vw, 16rem);
    gap: .65rem;
    margin-top: 1.35rem;
    overflow-x: auto;
    overscroll-behavior-inline: contain;
    scroll-snap-type: inline mandatory;
    scrollbar-width: thin;
    padding-bottom: .65rem;
  }
  .fdr-inst-status {
    min-height: 5.6rem;
    padding: 1rem;
    scroll-snap-align: start;
  }

  .fdr-inst-photo-placeholder {
    min-height: 14rem;
    border-radius: 1.1rem;
    padding: 1.2rem;
  }

  /* Radial desktop diagrams become a semantic card constellation on phones. */
  .fdr-inst-radial {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: .65rem;
    min-height: 0;
    margin-top: 1.5rem;
  }
  .fdr-inst-radial .fdr-inst-node {
    position: static !important;
    transform: none !important;
    min-width: 0;
    min-height: 4.5rem;
    border-radius: 1rem;
    padding: .65rem;
  }
  .fdr-inst-radial .fdr-inst-node.is-core {
    grid-column: 1 / -1;
    width: 100%;
  }

  .fdr-inst-progress {
    margin-top: 1.4rem;
    border-radius: 1.1rem;
  }
  .fdr-inst-progress div { padding: 1rem; }

  .fdr-inst-btns {
    gap: .55rem;
    margin-top: 1.25rem;
  }
  .fdr-inst-btn {
    min-height: 2.85rem;
    padding: .68rem 1rem;
    border-radius: .8rem;
  }
}

@media (max-width: 380px) {
  .fdr-public-header-inner { padding-left: .75rem !important; padding-right: .75rem !important; }
  .fdr-public-header .fdr-descriptor { display: none; }
  .fdr-home-v3-shell,
  .fdr-inst-shell { width: calc(100% - 1.5rem) !important; }
  .fdr-home-v3-title { font-size: clamp(2.15rem, 12vw, 2.8rem); }
  .fdr-inst h1 { font-size: clamp(2rem, 11vw, 2.65rem); }
}

@media (prefers-reduced-motion: reduce) {
  .fdr-home-v3-health-grid,
  .fdr-home-v3-access-grid,
  .fdr-inst-status-row { scroll-behavior: auto; }
}
