/* Phone layout overrides — loaded after all portfolio styles. */
html, body { overflow-x: hidden; }

@media (max-width: 760px) {
  .folio nav, .folio footer, .folio main > section { width: calc(100% - 32px) !important; }
  .folio nav { padding: 16px 0 !important; gap: 12px; }
  .navlinks { display: none !important; }
  .talk { padding: 9px 10px !important; font-size: 10px !important; white-space: nowrap; }

  .newhero { grid-template-columns: 1fr !important; min-height: 0 !important; padding: 58px 0 !important; gap: 38px !important; }
  .folio h1 { font-size: clamp(54px, 19vw, 72px) !important; line-height: .8 !important; }
  .folio h2 { font-size: clamp(39px, 12vw, 52px) !important; margin: 16px 0 28px !important; }
  .lead { font-size: 15px !important; }
  .actions { flex-direction: column !important; align-items: stretch !important; }
  .actions a { text-align: center; }

  .terminal { width: 100%; }
  .terminal pre { padding: 16px 12px !important; font-size: 10px !important; line-height: 1.62 !important; white-space: pre-wrap !important; overflow-wrap: anywhere; }
  .terminal small { display: inline-block; width: 24px; }

  .proof { grid-template-columns: 1fr 1fr !important; gap: 25px 16px !important; padding: 24px 0 !important; }
  .proof b { font-size: 24px !important; }

  .folio main > section:not(.newhero):not(.proof) { padding: 68px 0 !important; }
  .about-long { font-size: 16px !important; line-height: 1.65 !important; }
  .metrics, .mini { gap: 24px !important; flex-wrap: wrap !important; margin-top: 38px !important; }
  .metrics b, .mini b { font-size: 24px !important; }

  .cards { grid-template-columns: 1fr !important; }
  .cards article { min-height: 0 !important; padding: 25px !important; border-right: 0 !important; border-bottom: 1px solid #283031 !important; }
  .cards article:last-child { border-bottom: 0 !important; }

  .timeline article { grid-template-columns: 1fr !important; gap: 16px !important; padding: 26px 0 !important; }
  .timeline article > div { padding-left: 25px !important; }
  .timeline h3 { font-size: 21px !important; }
  .timeline h4 { line-height: 1.5 !important; }
  .timeline p { font-size: 15px !important; }

  .process { grid-template-columns: 1fr !important; gap: 18px !important; }
  .process li { grid-template-columns: 42px 1fr !important; }

  #contact.contact-left { width: calc(100% - 32px) !important; margin: 42px auto !important; padding: 42px 26px !important; }
  #contact.contact-left h2 { font-size: 42px !important; }
  #contact.contact-left .contact-actions a { width: 100%; }
  .folio footer { align-items: flex-start !important; flex-wrap: wrap !important; gap: 12px !important; padding: 24px 0 !important; }
  .folio footer a:last-child { margin-left: 0 !important; }
}

@media (max-width: 390px) {
  .folio nav, .folio footer, .folio main > section { width: calc(100% - 28px) !important; }
  .logo { font-size: 19px !important; }
  .talk { font-size: 9px !important; }
  .proof { gap: 22px 12px !important; }
  .proof span { font-size: 9px !important; }
}