/* Phone composition only. Keep the approved desktop cascade untouched. */
@media (max-width:600px){
  .nav{display:grid;grid-template-columns:minmax(0,1fr) auto 44px;gap:8px;min-height:70px}
  .nav .brand{margin-right:0;min-width:0}
  .nav-links{grid-column:1/-1;grid-row:2;order:0}
  .header-link{grid-column:2;grid-row:1}
  .nav-toggle{grid-column:3;grid-row:1}
  .hero{padding:40px 0 48px}
  .hero-grid{gap:32px}
  .eyebrow,.privacy .eyebrow{font-size:12.5px;line-height:1.5;margin:0 0 20px;letter-spacing:.1em}
  h1,h2,.privacy .privacy-copy h2{font-family:'Space Grotesk',sans-serif;font-weight:700;letter-spacing:-.055em}
  h1{font-size:clamp(48px,15.4vw,66px);line-height:1.02;margin:0 0 24px}
  h1 em,h2 em{font-family:inherit;font-style:normal;color:#cc97ff;-webkit-text-stroke:0}
  .hero .lede{font-size:16.5px;line-height:1.7;margin:0;max-width:none}
  .actions{margin-top:20px}
  .text-link{min-height:44px;display:inline-flex;align-items:center}
  .hero-visual{margin:0 auto;width:100%;max-width:410px;padding:0}
  .today{width:170px;margin-left:12px}
  .caption{margin-top:16px;font-size:12.5px}
  .hero-foot{display:flex;flex-wrap:wrap;gap:8px 20px;margin-top:24px;padding-top:18px;font-size:12.5px;letter-spacing:.02em}
  .hero-foot span:nth-child(2){flex-basis:100%;order:3}
  .story,.privacy{padding-block:64px}
  .story-grid,.media-story .story-grid{grid-template-columns:minmax(0,1fr);gap:0}
  /* Bring the real illustration next to the explanation, before the detail. */
  .media-story .copy,.history-story .copy{display:contents}
  .media-story .eyebrow,.history-story .eyebrow{grid-row:1}
  .media-story h2,.history-story h2{grid-row:2}
  .media-story .copy>p:not(.eyebrow):not(.secondary-note),.history-story .copy>p:not(.eyebrow){grid-row:3}
  .media-composition,.history-story .excerpt{grid-row:4}
  .media-story .detail-list,.history-story .detail-list{grid-row:5}
  .media-story .copy>.secondary-note{grid-row:6}
  .media-story .copy>.secondary-note:last-child{grid-row:7}
  h2,.privacy .privacy-copy h2{font-size:clamp(34px,10.8vw,46px);line-height:1.08;margin:0 0 22px}
  .copy>p:not(.eyebrow),.privacy p:not(.eyebrow),.privacy .privacy-copy p:not(.eyebrow),.privacy .tracking-text p{font-size:16.5px;line-height:1.7;margin:0}
  .media-composition{margin-top:28px;padding-bottom:8px;max-width:410px}
  .media-composition .video-device{margin-top:26px;border-radius:20px}
  .media-composition .video-device img{border-radius:15px}
  .audio-device{width:clamp(128px,38vw,158px);margin-top:calc(clamp(-140px,-32vw,-102px) - 48px);margin-right:22px;transform:rotate(7deg)}
  .video-device figcaption,.audio-device figcaption{font-size:12.5px;letter-spacing:.04em}
  .detail-list{margin:28px 0 0;padding:0}
  .detail-list li{font-size:16.5px;line-height:1.55;padding-block:16px;gap:14px}
  .detail-list span{font-size:12.5px}
  .copy>p.secondary-note{font-size:16.5px;line-height:1.7;margin:24px 0 0}
  .history-story .excerpt{width:100%;max-width:425px;margin:30px auto 0}
  .excerpt-label{font-size:12.5px;letter-spacing:.04em;gap:5px 12px}
  .history-window{padding:8px}
  .history-window .history-image{width:100%;height:auto;max-height:none;object-fit:contain}
  .privacy-card{gap:24px}
  .privacy-mark{width:128px;margin:16px 0}
  .privacy-mark svg{width:52px}
  .privacy-points>div{padding-block:16px}
  .privacy-details{margin:24px 0 0}
  .privacy .tracking-text{margin-top:26px}
  .privacy .tracking-text h3{font-size:17.5px}
  .privacy .tracking-text p+p{margin-top:16px}
  .site-footer{padding-block:40px}
  .site-footer .footer-grid{grid-template-columns:1fr;gap:22px}
  .site-footer .footer-meta{justify-items:center;text-align:center;gap:6px}
  .site-footer .footer-meta a{min-height:44px;display:inline-flex;align-items:center}
}