/* Cohlo responsive production landing — narrow phones and foldables. */
@media(max-width:900px){
  .site-header .nav-wrap{min-width:0}
  .section-width{max-width:100%;min-width:0}
  .hero{min-width:0}
  .hero-copy{min-width:0}
  .hero-actions{min-width:0}
  .hero h1{max-width:100%;overflow-wrap:normal}
  .button{min-height:48px}
}
@media(max-width:520px){
  .announcement{height:auto;min-height:31px;gap:8px;padding:5px 10px;letter-spacing:.045em;font-size:9px}
  .announcement>span:nth-child(2){min-width:0;text-wrap:balance}
  .announcement a{margin-left:auto;white-space:nowrap;font-size:10px}
  .site-header{height:69px}
  .nav-wrap{padding-inline:max(15px,env(safe-area-inset-left,0px));gap:9px}
  .brand{font-size:25px;gap:7px}
  .brand img{width:39px;height:40px}
  .nav-toggle{min-width:44px;min-height:44px;display:grid;place-items:center;flex-shrink:0}
  .nav-cta{min-height:43px;padding:11px 12px;font-size:11px;border-radius:10px;white-space:nowrap}
  .nav-cta span{margin-left:5px}
  .hero{padding-top:30px;padding-bottom:34px;min-height:0;gap:10px}
  .hero h1{font-size:clamp(40px,12.8vw,62px);line-height:1.01;letter-spacing:-.075em;margin:19px 0}
  .hero-copy{padding:8px 0 0}
  .hero-subtitle{font-size:clamp(14px,4vw,17px);line-height:1.6;margin-bottom:22px}
  .hero .eyebrow{font-size:10px;letter-spacing:.08em;line-height:1.5}
  .hero-actions{display:grid;grid-template-columns:minmax(0,1fr);gap:10px;width:100%}
  .hero-actions .button{min-width:0;width:100%;max-width:100%;min-height:49px;padding:0 12px;gap:9px}
  .hero-proof{font-size:9px;gap:7px;margin-top:19px;line-height:1.5}
  .hero-illustration{height:380px;min-height:0}
  .hero-mascot{width:min(67vw,270px)}
  .float-voice{min-width:0;max-width:84%;left:0;bottom:38px}
  .float-message{max-width:78%;right:0}
  .section-width{padding-inline:18px}
  .preview-section{padding-bottom:55px}
  .preview-caption{height:auto;min-height:62px;font-size:9px;gap:8px;line-height:1.5}
  .product-window{min-height:360px}
  .feature-section{padding-top:65px;padding-bottom:70px}
  .section-heading-row h2{font-size:clamp(29px,8vw,46px)}
  .support-section{padding-bottom:65px}
}
@media(max-width:340px){
  .section-width{padding-inline:12px}
  .announcement{font-size:8px;letter-spacing:0}
  .announcement a{font-size:9px}
  .brand{font-size:23px}
  .brand img{width:35px;height:36px}
  .nav-wrap{padding-inline:11px}
  .nav-cta{display:none}
  .nav-toggle{margin-left:auto}
  .hero h1{font-size:clamp(36px,12.6vw,43px);line-height:1.04}
  .hero-subtitle{font-size:14px}
  .hero-illustration{height:320px}
  .hero .hero-proof{font-size:8px}
  .hero .eyebrow{font-size:9px}
  .hero-actions .button{font-size:12px}
}
@media(max-width:900px) and (orientation:landscape) and (max-height:500px){
 .hero-illustration{height:250px}
 .hero{padding-block:20px}
 .hero h1{font-size:clamp(38px,6vw,62px)}
}
@media(prefers-reduced-motion:reduce){
 .hero-mascot,.strip-track,.typing-dots i,.voice-bars i{animation:none!important}
}
