/* ANS responsive hardening: keep the revenue demo readable on tablets and mobile browsers that report desktop-like viewports. */
html,body{max-width:100%;overflow-x:hidden}
.demo-shell,.chat-panel,.operator-panel,.panel-title,.chat-body,.suggestions,.chat-input,.metric-row,.lead-card,.action-log{min-width:0;max-width:100%}
.demo-shell{width:100%}
.chat-input input{min-width:0;width:100%}
.panel-title>div,.panel-title>div>div{min-width:0}
.panel-title b,.panel-title span,.lead-fields b{overflow-wrap:anywhere}

@media (max-width:1100px){
  .nav-links{display:none}
  .hero{grid-template-columns:1fr;min-height:auto;padding-top:80px;gap:44px}
  .hero-console{max-width:720px}
  .section-head,.usp-grid,.safety-grid,.contact-card{grid-template-columns:1fr;gap:34px}
  .demo-shell{grid-template-columns:minmax(0,1fr);max-width:840px;margin-inline:auto}
  .chat-panel{border-right:0;border-bottom:1px solid var(--line);min-height:600px;width:100%}
  .operator-panel{min-height:auto;width:100%}
  .integration-board{grid-template-columns:1fr;gap:22px}
  .connector-line{width:1px;height:30px;margin:auto}
  .right-line{transform:none}
  .source-stack{max-width:520px;width:100%;margin:auto}
  .usp-copy{position:static}
  .process-line{grid-template-columns:1fr 1fr;border-top:0}
  .process-line article{border-top:1px solid var(--line)}
  .footer-grid{grid-template-columns:1fr 1fr}
}

@media (max-width:720px){
  .shell{width:calc(100% - 24px);max-width:1180px}
  .nav{height:62px}
  .nav .button{display:none}
  .hero{padding-top:62px;gap:36px;padding-bottom:64px}
  .hero h1{font-size:clamp(42px,13vw,54px)}
  .hero-sub{font-size:16px}
  .hero-actions{align-items:flex-start;flex-direction:column;gap:5px}
  .statement{padding:72px 0}
  .section,.demo-section{padding:72px 0}
  .section-head{margin-bottom:32px}
  .flow-grid{grid-template-columns:1fr}
  .flow-card,.flow-card:nth-child(3n),.flow-card:nth-child(2n),.flow-card:nth-child(n+4){border-right:0;border-bottom:1px solid var(--line)}
  .flow-card:last-child{border-bottom:0}
  .demo-shell{max-width:100%;border-radius:17px;overflow:hidden}
  .chat-panel{min-height:570px}
  .operator-panel{min-height:auto}
  .panel-title{padding:0 16px;width:100%;overflow:hidden}
  .panel-title .channel-pill,.panel-title .mono{flex:0 0 auto}
  .chat-body{padding:17px;max-height:410px;width:100%}
  .message{max-width:92%;min-width:0}
  .bubble{font-size:14px;line-height:1.5;overflow-wrap:anywhere}
  .suggestions{display:flex;flex-wrap:wrap;overflow:visible;gap:8px;padding:0 14px 12px;width:100%}
  .suggestions button{white-space:normal;max-width:100%;text-align:left;overflow-wrap:anywhere}
  .chat-input{width:calc(100% - 28px);margin:0 14px 14px;grid-template-columns:minmax(0,1fr) 42px}
  .metric-row{grid-template-columns:1fr 1fr 1fr;margin:14px;width:calc(100% - 28px)}
  .metric-row>div{padding:13px 11px;min-width:0}
  .metric-row strong{font-size:22px;max-width:100%;overflow-wrap:anywhere}
  .lead-card,.action-log{margin-left:14px;margin-right:14px;width:calc(100% - 28px)}
  .lead-fields{grid-template-columns:1fr 1fr;min-width:0}
  .lead-fields>div{min-width:0}
  .lead-fields>div:nth-child(3n){border-right:1px solid var(--line)}
  .lead-fields>div:nth-child(2n){border-right:0}
  .lead-fields>div:nth-child(n+4){border-bottom:1px solid var(--line)}
  .lead-fields>div:nth-last-child(-n+2){border-bottom:0}
  .source-stack{grid-template-columns:1fr 1fr}
  .integration-note{grid-template-columns:1fr}
  .safety-points{grid-template-columns:1fr}
  .process-line{grid-template-columns:1fr}
  .contact-card{padding:24px}
  .footer-grid{grid-template-columns:1fr}
}

@media (max-width:430px){
  .metric-row{grid-template-columns:1fr}
  .metric-row>div{border-right:0;border-bottom:1px solid var(--line)}
  .metric-row>div:last-child{border-bottom:0}
  .lead-fields{grid-template-columns:1fr}
  .lead-fields>div{border-right:0!important;border-bottom:1px solid var(--line)!important}
  .lead-fields>div:last-child{border-bottom:0!important}
}

.brand-badge {
  font-size: 11px;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  background: rgba(255, 255, 255, 0.06);
  border: 1px solid var(--line);
  color: #a5b0be;
  padding: 3px 7px;
  border-radius: 6px;
  margin-left: 8px;
  font-weight: 600;
}

