/* Layout and touch targets follow Apple HIG principles, adapted for the web. */
body { overflow-wrap: anywhere; }
.site-header { z-index: 50; backdrop-filter: blur(20px); -webkit-backdrop-filter: blur(20px); border-bottom: 1px solid #1d1d1f12; }
.header-inner { min-height: 72px; }
.header-inner nav > a, .button, .contact-pill { min-height: 44px; }
.button { border-radius: 999px; padding-inline: 24px; }
a:focus-visible, button:focus-visible, summary:focus-visible { outline: 3px solid #007aff; outline-offset: 4px; }
.hero { padding-top: clamp(64px, 8vw, 116px); }
.hero h1 { line-height: 1.12; text-wrap: balance; }
.hero-description { line-height: 1.7; }
.feature-card { border-radius: 28px; overflow: hidden; }
.feature-heading h2, .document-heading h1 { text-wrap: balance; }
.policy-summary { border-radius: 20px; padding: 24px; }
.prose { line-height: 1.85; min-width: 0; }
.prose p, .prose li { overflow-wrap: anywhere; }
.document-layout > *, .command-layout > * { min-width: 0; }
.prose table { display: block; max-width: 100%; overflow-x: auto; }
.faq-item summary { min-height: 64px; }
.menu-toggle { display: none; }

@media (max-width: 820px) {
  .shell { width: calc(100% - 40px); }
  .header-inner { position: relative; min-height: 64px; padding-block: 8px; flex-wrap: wrap; justify-content: space-between; gap: 0; }
  .brand { min-height: 48px; display: inline-flex; align-items: center; }
  .header-inner nav { flex: 1 1 100%; flex-direction: column; align-items: stretch; flex-wrap: nowrap; overflow: visible; gap: 2px; padding: 8px 0 16px; }
  .has-menu .header-inner nav { display: none; }
  .has-menu.menu-open .header-inner nav { display: flex; max-height: calc(100dvh - 80px); overflow-y: auto; }
  .header-inner nav > a { display: flex; align-items: center; min-height: 48px; padding: 10px 14px; border-radius: 12px; font-size: 16px; white-space: normal; }
  .header-inner nav > a:hover { background: #f5f5f7; }
  .header-inner nav > .contact-pill { justify-content: center; margin-top: 8px; background: #0071e3; color: white; }
  .menu-toggle { display: inline-flex; position: relative; flex: 0 0 48px; width: 48px; height: 48px; align-items: center; justify-content: center; border-radius: 50%; background: transparent; cursor: pointer; color: #1d1d1f; }
  .menu-toggle:hover { background: #f5f5f7; }
  .menu-toggle span { position: absolute; width: 22px; height: 2px; border-radius: 2px; background: currentColor; transition: transform .18s ease; }
  .menu-toggle span:first-child { transform: translateY(-4px); }
  .menu-toggle span:last-child { transform: translateY(4px); }
  .menu-open .menu-toggle span:first-child { transform: rotate(45deg); }
  .menu-open .menu-toggle span:last-child { transform: rotate(-45deg); }
  .document-layout, .command-layout { display: block; }
  .toc { position: static; max-height: none; margin-bottom: 32px; }
  .document-heading { padding-top: 44px; }
  .hero h1 { font-size: clamp(36px, 8.5vw, 64px); }
  .hero-shortcuts { margin-top: 40px; }
  .hero-shortcuts a { padding: 20px 0; }
  .section { padding-block: 56px; }
  .feature-card { border-radius: 22px; }
  .feature-card-copy { padding: 24px; }
  .two-features, .feature-intro { grid-template-columns: 1fr; }
  .command-item dt { flex-wrap: wrap; gap: 10px; }
  .command-item code { white-space: normal; overflow-wrap: anywhere; }
  .footer { padding-bottom: max(28px, env(safe-area-inset-bottom)); }
}

@media (max-width: 420px) {
  .shell { width: calc(100% - 32px); }
  .hero .actions { flex-direction: column; align-items: center; gap: 18px; }
  .policy-summary { padding: 20px; }
  .extras-grid { grid-template-columns: 1fr; }
}
@media (prefers-reduced-motion: reduce) { .menu-toggle span { transition: none; } }
@media print { .menu-toggle { display: none; } }