/* page never scrolls sideways (the spinning ring around the logo otherwise widens it) */
html,body{overflow-x:clip}
.chat-lock,.chat-lock body{overflow:hidden}

.chat-msg .row{display:flex;gap:.4rem;flex-wrap:wrap}

@media (max-width:560px){
  body{font-size:16px;padding-inline:16px}
  input,select,textarea{font-size:16px!important}

  /* header and menu: one tidy row you can swipe */
  header.top .wrap{gap:.2rem;padding-block:.5rem}
  nav{flex-wrap:nowrap;overflow-x:auto;width:calc(100% + 32px);margin:0 -16px;padding:0 12px;scrollbar-width:none;-webkit-overflow-scrolling:touch}
  nav::-webkit-scrollbar{display:none}
  nav button{white-space:nowrap;padding:.75rem .7rem;min-height:44px;flex:none}
  nav button::after{left:.7rem;right:.7rem}

  /* bigger touch targets */
  .btn{min-height:46px}
  .btn.small{min-height:42px;padding-inline:.9rem}
  .chip{min-height:42px;display:inline-flex;align-items:center;padding-inline:1rem}
  label.f{font-size:.78rem}

  /* layout */
  main{padding-block:1.2rem 5.5rem}
  section.block{padding-block:1.6rem}
  .hero{padding-block:.8rem 0;gap:1.6rem}
  .hero .cta .btn{flex:1 1 100%}
  .proof{width:min(64vw,250px)}
  .secthead{align-items:center}
  .grid{grid-template-columns:1fr}
  .summary{padding:1rem}
  .modal{padding:1rem;max-height:none}
  .scrim{padding:max(12px,env(safe-area-inset-top,0px)) 12px calc(12px + env(safe-area-inset-bottom,0px))}
  footer{padding-block:1.4rem 5.5rem}
  footer .wrap{flex-direction:column;gap:1rem}
  .toast{bottom:calc(84px + env(safe-area-inset-bottom,0px))}

  /* chat becomes a full-screen sheet */
  #chat-root{right:12px;bottom:calc(12px + env(safe-area-inset-bottom,0px))}
  .chat-fab{min-height:48px;padding-inline:1.2rem}
  .chat-panel{position:fixed;left:0;right:0;top:0;bottom:auto;width:auto;height:100dvh;border:0;box-shadow:none}
  .chat-panel header{padding:calc(.7rem + env(safe-area-inset-top,0px)) .9rem .7rem}
  .chat-x{width:44px;height:44px;font-size:1.8rem}
  .chat-msg{max-width:90%}
  .chat-msg p{font-size:1rem}
  .chat-form{padding:.7rem .7rem calc(.7rem + env(safe-area-inset-bottom,0px))}
  .chat-form input{min-height:46px}
  .chat-form .btn{min-height:46px}
}

/* faq chat */
.chat-quick{display:flex;gap:.4rem;overflow-x:auto;padding:.5rem .7rem;border-top:1px solid var(--line);scrollbar-width:none}
.chat-quick::-webkit-scrollbar{display:none}
.chat-quick button{flex:none;border:1px solid var(--accent);background:transparent;color:var(--ink);padding:.45rem .8rem;border-radius:999px;font:500 .82rem var(--f-body);cursor:pointer;white-space:nowrap}
.chat-quick button:hover{background:var(--glow)}
.chat-lead{display:flex;flex-direction:column;gap:.4rem;width:100%;min-width:230px}
.chat-lead input{width:100%}
@media (max-width:560px){.chat-quick button{min-height:42px}.chat-lead input{min-height:46px}}