/* IYESCHAT Comercial R1 — refinamento responsivo de iPhone / Android. */
html,body{max-width:100%;width:100%;overflow-x:clip}
body{position:relative}
.container,.hero,.hero-copy,.hero-art,.section,.how-inner,.demo-area,.pricing-intro,.faq,.cta,.footer{min-width:0;max-width:100%}
.hero-copy,.hero-art,.demo-area>*{min-width:0}
.hero h1,h2,h3,p{overflow-wrap:break-word}
.chat-app{max-width:none}
@media (max-width:1100px){
  .hero{grid-template-columns:minmax(0,1fr)}
  .hero-copy{width:100%}
  .hero-art{overflow:hidden}
  .how-inner,.demo-area{grid-template-columns:minmax(0,1fr)}
}
@media (max-width:760px){
  html,body{overscroll-behavior-x:none}
  .container{width:calc(100% - 36px);max-width:560px;margin-inline:auto}
  .announcement{width:100%;min-height:36px;padding:8px 14px;line-height:1.45;font-size:10px}
  .header,.nav-bar{width:100%;max-width:100%}
  .nav-bar{width:calc(100% - 36px)}
  .logo{min-width:0}
  .mobile-menu{display:flex;align-items:center;justify-content:center;flex:0 0 44px;width:44px;height:44px;border-radius:8px;touch-action:manipulation}
  .nav{position:absolute;left:0;right:0;top:68px;width:100%;max-width:100vw;box-sizing:border-box;z-index:30;max-height:calc(100dvh - 68px);overflow-y:auto;box-shadow:0 14px 28px #0006}
  .nav.open{display:flex}
  .nav a{display:block;padding:4px 0;overflow-wrap:anywhere}
  .hero{display:grid;grid-template-columns:minmax(0,1fr);width:calc(100% - 36px);gap:0;padding:46px 0 42px}
  .eyebrow{font-size:clamp(8px,2.2vw,10px);max-width:100%;white-space:normal;line-height:1.45;padding:10px 12px;letter-spacing:.45px}
  .hero h1{font-size:clamp(34px,9vw,44px);line-height:1.12;letter-spacing:-1.6px;max-width:100%;min-width:0;overflow-wrap:anywhere;hyphens:auto;margin:25px 0 20px}
  .hero h1 em{display:inline;overflow-wrap:anywhere}
  .hero-copy>p{max-width:100%;font-size:14px;line-height:1.7;overflow-wrap:anywhere}
  .hero-buttons{display:flex;flex-direction:column;gap:12px;width:100%}
  .hero-buttons .button{display:flex;width:100%;max-width:100%;min-width:0;white-space:normal;text-align:center;padding:15px 16px;line-height:1.35;overflow-wrap:anywhere}
  .hero-bottom{width:100%;align-items:center;margin-top:28px}
  .hero-bottom>div:last-child{min-width:0;overflow-wrap:anywhere}
  .hero-art{width:100%;max-width:100%;height:auto;min-height:0;display:block;overflow:hidden;margin:34px 0 0;transform:none}
  .chat-app{position:relative;width:100%;max-width:100%;min-width:0;transform:none;border-radius:14px;box-shadow:0 18px 45px #0008}
  .app-title{min-width:0;height:40px;padding-inline:11px}
  .app-title>span:nth-child(2){min-width:0;font-size:9px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  .app-title b{font-size:6px;padding:3px}
  .app-main{display:block;height:310px}
  .app-rail,.conversations{display:none}
  .chat-pane{height:100%;width:100%;min-width:0;padding-inline:12px;overflow:hidden}
  .chat-head{height:54px}
  .chat-head b{font-size:11px}
  .chat-head small{font-size:8px}
  .today{padding:11px}
  .bubble{max-width:87%;font-size:10px;padding:10px 12px;margin-bottom:9px}
  .fake-input{padding:11px}
  .floating-chip{display:none}
  .integrations{overflow:hidden}
  .integrations-inner{width:calc(100% - 36px);padding:22px 0;gap:15px;text-align:center}
  .integrations-inner>div{line-height:1.7;overflow-wrap:anywhere}
  .section{width:calc(100% - 36px);padding:65px 0}
  .section-heading{display:block;min-width:0}
  h2{font-size:clamp(30px,8vw,36px);line-height:1.17;letter-spacing:-1px;overflow-wrap:anywhere;hyphens:auto}
  .feature-grid,.plan-grid{display:grid;grid-template-columns:minmax(0,1fr);gap:16px}
  .feature-card,.plan-card{min-width:0;max-width:100%;width:100%;overflow-wrap:anywhere}
  .how-inner{width:calc(100% - 36px);display:grid;grid-template-columns:minmax(0,1fr);padding:65px 0;gap:32px}
  .steps{min-width:0;padding-left:14px}
  .steps>div{grid-template-columns:42px minmax(0,1fr) 18px;gap:10px}
  .steps h3{font-size:16px}
  .demo-area{display:grid;grid-template-columns:minmax(0,1fr);padding:27px 18px;gap:24px;overflow:hidden}
  .demo-switch{max-width:100%}
  .demo-switch button{padding:10px 12px}
  .phone{max-width:100%;width:100%}
  .pricing-intro{max-width:100%}
  .plan-card{padding:28px 23px}
  .plan-card h3{font-size:27px}
  .plan-card .button{width:100%;max-width:100%;white-space:normal}
  .faq{display:grid;grid-template-columns:minmax(0,1fr);gap:23px}
  .faq-items{min-width:0}
  .faq-items summary{overflow-wrap:anywhere}
  .cta{width:calc(100% - 36px);padding:55px 17px}
  .cta .button{max-width:100%;white-space:normal;text-align:center}
  .footer{width:calc(100% - 36px);gap:14px}
}
@media (max-width:380px){
  .hero h1{font-size:clamp(32px,8.6vw,35px);letter-spacing:-1.2px}
  .eyebrow{font-size:8px}
  .app-main{height:295px}
  .bubble{font-size:9.5px}
  .plan-price{font-size:32px}
}