/* Responsive polish layer */

/* Mobile-only refinement. Desktop remains governed by styles.css. */
@media (max-width: 768px) {
  :root {
    --mobile-paper: #f7f2e8;
    --mobile-paper-alt: #f1e8d8;
    --mobile-blue: #063a59;
    --mobile-contact: #d7e7e8;
  }

  body { overflow-x: hidden; }

  .hero,.why,.signature,.how,.outcome,.team { background: var(--mobile-paper); }
  .contexts { background: var(--mobile-paper-alt); }
  .evidence { background: var(--mobile-blue); color:#fff; }
  .contact,#contact { background: var(--mobile-contact); }

  /* Mobile header: a single centered brand. */
  .site-header {
    height:96px;
    padding:12px 18px 6px;
    display:flex;
    justify-content:center;
    align-items:center;
  }
  .site-header .brand { transform:none; align-self:center; margin:0; }
  .site-header .brand img { width:74px; height:74px; }
  .site-header nav,.site-header > .btn-small { display:none; }

  /* Base mobile rhythm. */
  .hero { padding-top:12px; padding-bottom:38px; }
  .why,.signature,.how { padding-top:40px; padding-bottom:40px; }
  .contexts { padding-top:26px; padding-bottom:42px; }
  .outcome { padding-top:28px; padding-bottom:30px; }
  .team { padding-top:24px; padding-bottom:26px; }
  .evidence { padding-top:44px; padding-bottom:44px; }
  .contact,#contact { padding-top:30px; padding-bottom:32px; }

  .visual-story { margin-bottom:0; }
  .section-head { margin-bottom:22px; }
  .steps { gap:4px; }
  .steps article,.steps article:nth-child(even) { gap:14px; padding:18px 0; }
  .steps article:nth-child(3) img { height:220px; object-position:center 88%; }

  .kicker { margin-bottom:10px; }
  .section-head h2,.why h2,.contexts h2,.outcome h2,.team h2,.contact h2 { margin-top:0; }
  .desktop-break { display:none; }

  .context-types { margin-top:6px; border-top:2px solid var(--ink); }
  .context-types > div { padding-top:13px; padding-bottom:13px; }

  .video-shell { overflow:hidden; }
  .video-shell video { display:block; width:100%; height:auto; border:0; box-shadow:none; background:transparent; }

  .hero-media .ring-a,.contexts::before { display:none; }

  input,textarea,button,.btn { min-height:44px; }
  .contact .btn-outline { width:100%; }
}
