/* Keep narrow layouts readable without scaling down the desktop canvas. */
html { -webkit-text-size-adjust: 100%; text-size-adjust: 100%; }
.hero-grid > *, .split > *, .workspace-layout > *, .brief-layout > * { min-width: 0; }
@media (max-width: 900px) {
  .menutoggle { min-width: 44px; min-height: 44px; flex-shrink: 0; }
  .mainnav > a, .navgroup > summary, .navdrop a { min-height: 44px; }
  .brief-form input, .brief-form select, .brief-form textarea { font-size: 16px; }
  .dash-filters button { min-height: 36px; }
  .journey-tabs button, .work-tabs button { min-height: 44px; }
  .dashrow > * { min-width: 0; overflow-wrap: anywhere; }
  .dashrow .tag { white-space: normal; }
}
@media (max-width: 580px) {
  .headinner { gap: 9px; }
  .headinner .logo { width: clamp(100px, 29vw, 128px); }
  .headercta { min-height: 44px; font-size: 10px; padding: 8px 10px; }
  .headercta .arrow { display: none; }
  .hero h1 { font-size: clamp(37px, 11.3vw, 44px); }
  .kicker { font-size: 9px; letter-spacing: .12em; }
  .kicker::before { flex-shrink: 0; }
  .hero .lede, .subhero .lede { font-size: 15px; line-height: 1.8; }
  .hero .actions .btn { min-height: 48px; }
  .platform-card p { font-size: 12px; }
  .platform-card { min-height: 200px; }
  .platform-card h3 { overflow-wrap: anywhere; }
  .dash-top { flex-wrap: wrap; gap: 8px; }
  .dashmetrics { gap: 5px; }
  .dashmetric { padding: 11px 7px; }
  .dashmetric span, .window.full .dashmetric span { font-size: 9px; line-height: 1.5; }
  .dashmetric strong, .window.full .dashmetric strong { font-size: clamp(20px, 6vw, 25px); }
  .dash-filters button, .window.full .dash-filters button { font-size: 10px; min-height: 38px; }
  .dashrow, .window.full .dashrow { font-size: 10px; grid-template-columns: 1.3fr 1fr auto; }
  .dashrow .tag, .window.full .dashrow .tag { font-size: 8px; }
  .dashbanner { font-size: 10px; }
  .floating-note { position: static; margin: 14px 0 0 auto; max-width: 100%; }
  .floating-note strong { font-size: 11px; }
  .floating-note p { font-size: 10px; }
  .scene-label, .dashboardcaption { font-size: 9px; }
  .brief-form, .brief-output { padding: 22px 18px; }
  .footer a { min-height: 36px; display: flex; align-items: center; margin-bottom: 4px; }
}
@media (max-width: 360px) {
  .wrap { width: calc(100% - 28px); }
  .headercta { font-size: 9px; padding-inline: 8px; }
  .hero .actions { align-items: stretch; }
  .hero .actions .btn { flex: 1 1 100%; }
  .dashmain, .window.full .dashmain { padding: 16px 10px; }
  .dashrow, .window.full .dashrow { gap: 5px; }
}