/* ============================================================
   RESPONSIVE — tablet & mobile
   ============================================================ */

@media (max-width: 1080px){
  .about-grid{
    grid-template-columns:minmax(260px, .8fr) minmax(360px, 1.2fr);
    column-gap:3rem;
  }
  .training-split{ grid-template-columns: 1fr; }
  .hero-portrait{ width: min(42vw, 340px); }
  .treatments-grid{ grid-template-columns:repeat(2,1fr); }
}

@media (max-width: 860px){
  .site-nav, .site-nav.scrolled{
    top:.75rem;
    left:var(--gutter);
    right:var(--gutter);
    padding:.62rem .65rem .62rem 1.1rem;
    background:rgba(248,245,241,.94);
    border-color:rgba(210,178,122,.35);
    box-shadow:0 14px 38px -26px rgba(22,13,18,.5);
    backdrop-filter:none;
    -webkit-backdrop-filter:none;
  }
  .nav-links{
    position: fixed; inset: 0; z-index: 400;
    background: var(--plum); color: var(--ivory);
    flex-direction: column; justify-content:center; align-items:center;
    gap: 2.2rem;
    transform: translateY(-100%);
    transition: transform 0.6s var(--ease-silk);
  }
  .nav-links.open{ transform: translateY(0); }
  .nav-links a{ font-size: 1.1rem; }
  .nav-toggle{ display:flex; z-index: 450; }
  .nav-cta{ display:none; }

  .hero-frame{ grid-template-columns: 1fr; }
  .hero-portrait{
    width:min(84vw, 320px);
    justify-self:center;
    margin-right:0;
  }
  .portrait-frame{ height:auto; aspect-ratio:3/4; }
  .about-grid{
    grid-template-columns:1fr;
    grid-template-areas:'copy' 'portrait' 'timeline';
    gap:3.25rem;
  }
  .about-portrait{
    position:relative;
    top:auto;
    width:min(100%, 580px);
    justify-self:center;
  }
  .about-grid .timeline{ margin-top:.5rem; }
  .factor-intro{
    grid-template-columns:1fr;
    grid-template-areas:'eyebrow' 'heading' 'copy';
    row-gap:1.4rem;
  }
  .treatments-heading{ grid-template-columns:1fr; gap:1.5rem; }
  .treatments-heading .body-copy{ justify-self:start; }
  .journey-num{ left:auto; right:var(--gutter); }
  .journey-pin{ height:clamp(540px,72svh,680px); }
  .journey-panel{ padding-top:5.5rem; padding-bottom:4rem; }
  .journey-icon{ margin-bottom:1.35rem; }
  .journey-panel > p:last-child{ margin-top:1.1rem; line-height:1.65; }
  .journey-progress{ bottom:2rem; }
  .factor-grid{ grid-template-columns: 1fr 1fr; }

  .cursor-dot, .cursor-ring{ display:none; }
  .final-cta-inner{ grid-template-columns:1fr; }
  .final-cta-copy h2{ max-width:12ch; }
  .scroll-sequence{ height:700vh; }
  .cell-stage-copy{ left:var(--gutter); right:var(--gutter); top:clamp(1.5rem,5vh,3rem); width:auto; transform:none; text-align:center; }
  .cell-stage-copy .eyebrow{ justify-content:center; }
  .cell-stage-copy h2{ margin:.8rem 0; font-size:clamp(2rem,8vw,3.4rem); line-height:1; }
  .sequence-intro{ margin-inline:auto; font-size:.88rem; line-height:1.55; }
  .sequence-scroll-cue{ display:none; }
  #scroll-sequence-canvas,.growth-frames{ left:50%; top:54%; width:min(78vw,43vh,460px); }
  .cell-labels{ left:50%; bottom:clamp(4.25rem,8vh,6rem); width:min(90vw,520px); }
}

@media (max-width: 620px){
  :root{ --gutter: 1.3rem; --section-pad: 4.2rem; }
  .journey-pin{ height:min(78svh,620px); min-height:520px; }
  .journey-panel{ padding-top:5.5rem; padding-bottom:3.5rem; }
  .journey-progress{ bottom:1.75rem; }
  .hero{ padding-top: 6.5rem; }
  .hero-title{ max-width: 12ch; }
  .hero-frame{ padding-left:var(--gutter); padding-right:var(--gutter); }
  .hero-portrait{ width:min(88vw, 320px); }
  .hero-meta{ width:100%; }
  .practice-highlights{ padding:2.5rem 0; }
  .highlights-grid{ grid-template-columns:1fr; }
  .highlight-item{ min-height:130px; }
  .highlight-item + .highlight-item::before{
    left:18%; right:18%; top:0; bottom:auto; width:auto; height:1px;
    background:linear-gradient(90deg,transparent,rgba(37,99,98,.25),transparent);
    transform:scaleX(0);
  }
  .highlight-item.is-visible + .highlight-item.is-visible::before{ transform:scaleX(1); }
  .hero-actions{ align-items:stretch; width:100%; }
  .hero-actions .cta-solid, .hero-actions .cta-outline{ width:100%; justify-content:center; }
  .treatments-grid{ grid-template-columns:1fr; grid-template-rows:none; grid-auto-flow:row; }
  .treatment-card{ min-height:0; }
  .cell-visuals{ transform:translateY(1.5rem); }
  .embryo-sequence, .blastocyst-visual, .implantation-visual, .early-pregnancy-visual, .fetal-visual{ width:min(72vw, 40vh, 340px); }
  .factor-grid{ grid-template-columns: 1fr; }
  .journey-num{ font-size: 5rem; }
  .journey-panel{ padding-left:var(--gutter); padding-right:var(--gutter); }
  .journey-panel::before{ width:90vw; right:-45%; opacity:.65; }
  .journey-panel h3{ font-size:clamp(2.4rem,12vw,3.6rem); }
  .journey-icon{ width:54px; height:54px; margin-bottom:1.35rem; }
  footer{ grid-template-columns:1fr auto; padding-top:1.5rem; padding-bottom:1.5rem; gap:1.25rem; }
  .footer-center{ grid-column:1 / -1; grid-row:2; align-items:flex-start; }
  .back-to-top{ grid-column:2; grid-row:1; }
  .timeline-inst{ font-size: 1.25rem; }
  .about-portrait{ padding:.55rem .55rem 0 0; }
  .about-portrait::before{ inset:0 0 0 1rem; }
  .final-cta{ padding-left:var(--gutter); padding-right:var(--gutter); }
  .contact-form{ padding:1.5rem; }
  .form-row{ grid-template-columns:1fr; gap:0; }
}

/* Landscape / very small height */
@media (max-height: 480px) and (orientation: landscape){
  .hero{ min-height: auto; padding-top: 6rem; padding-bottom: 3rem; }
}
