*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
:root{
  --bg:#F6FAFF;
  --bg1:#000000;
  --bg2:#FFFFFF;
  --bg3:#EEF6FF;
  --bg4:#E6F1FF;
  --bg5:#f1fcfa;
  --sky:#0087FF;
  --sky2:#4DB0FF;
  --sky3:#006BCC;
  --sky4:#D8ECFF;
  --sky5:#02DD02;
  --sky6:#0cff0c;
  /*--text:#394451;*/
  --text:#394451;
  --text2:#4B647A;
  --text3:#7C8FA3;
  --border:#D6E6F5;
  --border2:#B8D7F2;
  --green:#02DD02;
  --red:#E85A5A;
  --nav-h:68px;
  --silk:cubic-bezier(0.16,1,0.3,1);
  --silk-fast:cubic-bezier(0.25,1,0.4,1);
  --max-w:1280px;
}
html{scroll-behavior:smooth}
body{
  background:var(--bg);
  color:var(--text);
  font-family:'DM Sans',sans-serif;
  font-size:16px;
  line-height:1.6;
  overflow-x:hidden;
}

/* TICKER */
.ticker{
  background:var(--bg2);
  border-bottom:1px solid var(--border);
  height:36px;
  overflow:hidden;
  display:flex;
  align-items:center;
  width:100%;
  max-width:100%;
}
.ticker:hover .ticker-track{animation-play-state:paused}
.ticker-track{
  display:flex;
  gap:0;
  animation:ticker-scroll 30s linear infinite;
  white-space:nowrap;
  will-change:transform;
  flex-shrink:0;
}
.ticker-item{
  display:inline-flex;
  align-items:center;
  gap:8px;
  padding:0 28px;
  font-size:12px;
  font-weight:500;
  letter-spacing:.04em;
  border-right:1px solid var(--border);
}
.ticker-sym{color:var(--text2)}
.ticker-price{color:var(--text)}
.ticker-up{color:var(--green)}
.ticker-dn{color:var(--red)}
@keyframes ticker-scroll{from{transform:translateX(0)}to{transform:translateX(-50%)}}
@keyframes silk-in{from{opacity:0;transform:translateY(24px)}to{opacity:1;transform:translateY(0)}}
@keyframes silk-in-left{from{opacity:0;transform:translateX(-20px)}to{opacity:1;transform:translateX(0)}}
@keyframes silk-in-right{from{opacity:0;transform:translateX(20px)}to{opacity:1;transform:translateX(0)}}
.silk-reveal{opacity:0}
.silk-reveal.visible{animation:silk-in .9s var(--silk) forwards}
.silk-reveal-left{opacity:0}
.silk-reveal-left.visible{animation:silk-in-left .9s var(--silk) forwards}
.silk-reveal-right{opacity:0}
.silk-reveal-right.visible{animation:silk-in-right .9s var(--silk) forwards}

/* NAV */
nav{
  position:fixed;
  top:0;
  left:0;
  right:0;
  z-index:100;
  height:var(--nav-h);
  display:flex;
  align-items:center;
  padding:0 max(48px, calc((100vw - var(--max-w)) / 2));
  border-bottom:1px solid transparent;
  transform:translateY(36px);
  transition:background .6s var(--silk),border-color .6s var(--silk),transform .5s var(--silk);
}
nav > *{position:relative}
nav.scrolled{background:rgba(15,19,25,.95);backdrop-filter:blur(20px);border-color:var(--border);transform:translateY(0)}
.nav-logo{
  font-family:'Outfit',sans-serif;
  font-size:22px;
  font-weight:800;
  color:var(--text);
  letter-spacing:-.02em;
  text-decoration:none;
  display:flex;
  align-items:center;
  gap:8px;
}
.nav-logo-mark{
  width:30px;height:30px;
  background:var(--sky);
  border-radius:8px;
  display:flex;align-items:center;justify-content:center;
}
.nav-logo-mark svg{width:16px;height:16px;fill:none;stroke:#fff;stroke-width:2.5;stroke-linecap:round}
.nav-links{
  display:flex;
  align-items:center;
  gap:2px;
  margin-left:auto;
}
.nav-links a{
  color:var(--text2);
  text-decoration:none;
  font-size:14px;
  font-weight:400;
  padding:6px 14px;
  border-radius:6px;
  transition:color .4s var(--silk),background .4s var(--silk);
  letter-spacing:.01em;
}
.nav-links a:hover{color:var(--text);background:rgba(255,255,255,.05)}
.nav-cta{
  margin-left:12px;
  display:flex;
  align-items:center;
  gap:8px;
}
.btn-ghost{
  background:transparent;
  border:1px solid var(--border2);
  color:var(--text2);
  font-family:'DM Sans',sans-serif;
  font-size:14px;
  font-weight:500;
  padding:8px 18px;
  border-radius:8px;
  cursor:pointer;
  transition:border-color .5s var(--silk),color .5s var(--silk);
  text-decoration:none;
}
.btn-ghost:hover{border-color:var(--sky);color:var(--sky)}
.btn-primary{
  background:var(--sky);
  border:1px solid var(--sky);
  color:#FFFFFF;
  font-family:'DM Sans',sans-serif;
  font-size:14px;
  font-weight:600;
  padding:8px 20px;
  border-radius:8px;
  cursor:pointer;
  transition:background .5s var(--silk),transform .4s var(--silk);
  text-decoration:none;
}
.btn-primary:hover{background:var(--sky2);transform:translateY(-1px)}

/* HAMBURGER */
.hamburger{
  display:none;
  flex-direction:column;
  gap:5px;
  cursor:pointer;
  margin-left:auto;
  padding:4px;
  background:none;
  border:none;
}
.hamburger span{
  display:block;width:22px;height:2px;
  background:var(--text2);
  border-radius:2px;
  transition:all .3s;
}
.hamburger.open span:nth-child(1){transform:translateY(7px) rotate(45deg)}
.hamburger.open span:nth-child(2){opacity:0}
.hamburger.open span:nth-child(3){transform:translateY(-7px) rotate(-45deg)}

/* MOBILE MENU */
.mobile-menu{
  display:none;
  position:fixed;
  top:0;left:0;right:0;bottom:0;
  background:var(--bg);
  z-index:99;
  flex-direction:column;
  align-items:center;
  justify-content:flex-start;
  gap:4px;
  padding:100px 24px 60px;
  overflow-y:auto;
  -webkit-overflow-scrolling:touch;
  opacity:0;
  pointer-events:none;
  transition:opacity .3s;
}
.mobile-menu.open{opacity:1;pointer-events:all}
.mobile-menu a{
  font-family:'Outfit',sans-serif;
  font-size:20px;
  font-weight:600;
  color:var(--text2);
  text-decoration:none;
  padding:8px 0;
  transition:color .2s;
  flex-shrink:0;
}
.mobile-menu a:hover{color:var(--sky)}
.mobile-menu .m-btns{
  display:flex;flex-direction:column;gap:10px;width:100%;max-width:260px;margin-top:20px;
  flex-shrink:0;
}
.mobile-menu .btn-primary,.mobile-menu .btn-ghost{
  width:100%;text-align:center;padding:12px;font-size:14px;
}

/* HERO */
.hero{
  min-height:100vh;
  padding-top:calc(36px + var(--nav-h) + 60px);
  padding-bottom:80px;
  padding-left:max(48px, calc((100vw - var(--max-w)) / 2));
  padding-right:max(48px, calc((100vw - var(--max-w)) / 2));
  display:grid;
  /*grid-template-columns:1fr 1fr;*/
  grid-template-columns: 0.50fr 0.60fr;
  gap:60px;
  align-items:center;
  position:relative;
  overflow:hidden;
}
.hero::before{
  content:'';
  position:absolute;
  top:0;
  left:0;
  width:100%;
  height:100%;

  background-image:
    repeating-linear-gradient(
      45deg,
      transparent 0,
      transparent 119px,
      rgba(132,255,0,.65) 119px,
      rgba(132,255,0,.65) 120px
    ),
    repeating-linear-gradient(
      -45deg,
      transparent 0,
      transparent 119px,
      rgba(132,255,0,.65) 119px,
      rgba(132,255,0,.65) 120px
    );

  -webkit-mask-image:radial-gradient(
    ellipse 100% 100% at 0% 0%,
    #000 0%,
    transparent 70%
  );

  mask-image:radial-gradient(
    ellipse 100% 100% at 0% 0%,
    #000 0%,
    transparent 70%
  );

  pointer-events:none;
  z-index:0;
}
.hero::after{
  content:'';
  position:absolute;
  top:-200px;right:-200px;
  width:600px;height:600px;
  background:radial-gradient(circle,rgba(74,158,232,.08) 0%,transparent 70%);
  pointer-events:none;
  z-index:0;
}
.hero > *{position:relative;z-index:1}
.hero-badge{
  display:inline-flex;
  align-items:center;
  gap:8px;
  background:rgba(74,158,232,.1);
  border:1px solid rgba(74,158,232,.25);
  color:var(--sky);
  font-size:12px;
  font-weight:500;
  letter-spacing:.06em;
  text-transform:uppercase;
  padding:6px 14px;
  border-radius:20px;
  margin-bottom:24px;
}
.badge-dot{width:6px;height:6px;background:var(--sky);border-radius:50%;animation:pulse 2s infinite}
@keyframes pulse{0%,100%{opacity:1}50%{opacity:.4}}
.hero h1{
  font-family:'Outfit',sans-serif;
  font-size:clamp(44px,5vw,44px);
  font-weight:800;
  line-height:1.05;
  letter-spacing:-.03em;
  color:var(--sky5);
  margin-bottom:24px;
}
.hero h1 span{color:var(--sky)}
.hero-sub{
  font-size:17px;
  color:var(--text2);
  line-height:1.7;
  max-width:460px;
  margin-bottom:36px;
  font-weight:300;
}
.hero-btns{
  display:flex;
  align-items:center;
  gap:12px;
  flex-wrap:wrap;
  margin-bottom:48px;
}
.btn-hero{
  background:var(--sky);
  border:none;
  color:#FFFFFF;
  font-family:'DM Sans',sans-serif;
  font-size:15px;
  font-weight:600;
  padding:14px 28px;
  border-radius:10px;
  cursor:pointer;
  transition:background .6s var(--silk),transform .6s var(--silk),box-shadow .6s var(--silk);
  text-decoration:none;
  display:inline-flex;
  align-items:center;
  gap:8px;
}
.btn-hero:hover{background:var(--sky2);transform:translateY(-2px);box-shadow:0 12px 32px rgba(74,158,232,.25)}
.btn-hero svg{width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;transition:transform .5s var(--silk)}
.btn-hero:hover svg{transform:translateX(3px)}
.btn-outline{
  background:transparent;
  border:1px solid var(--border2);
  color:var(--text);
  font-family:'DM Sans',sans-serif;
  font-size:15px;
  font-weight:400;
  padding:14px 28px;
  border-radius:10px;
  cursor:pointer;
  transition:border-color .5s var(--silk),color .5s var(--silk);
  text-decoration:none;
}
.btn-outline:hover{border-color:var(--sky);color:var(--sky)}
.hero-trust{
  display:flex;
  align-items:center;
  gap:12px;
}
.hero-avatars{display:flex}
.hero-avatars span{
  width:32px;height:32px;
  border-radius:50%;
  border:2px solid var(--bg);
  background:var(--bg3);
  display:flex;align-items:center;justify-content:center;
  font-size:11px;font-weight:600;
  color:var(--sky);
  margin-right:-10px;
}
.hero-trust-text{
  font-size:13px;
  color:var(--text2);
  margin-left:18px;
}
.hero-trust-text strong{color:var(--text);font-weight:500}

/* HERO DASHBOARD MOCKUP */
.hero-visual{
  position:relative;
}
.dash-card{
  background:var(--bg2);
  border:1px solid var(--border);
  border-radius:16px;
  overflow:hidden;
  position:relative;
}
.dash-topbar{
  background:var(--bg3);
  padding:14px 20px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  border-bottom:1px solid var(--border);
}
.dash-dots{display:flex;gap:6px}
.dash-dots span{width:10px;height:10px;border-radius:50%}
.dash-title-bar{font-size:12px;color:var(--text3);font-weight:500;letter-spacing:.04em}
.dash-body{padding:20px}
.dash-stats{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-bottom:16px}
.dash-stat{
  background:var(--bg3);
  border:1px solid var(--border);
  border-radius:10px;
  padding:12px 14px;
}
.dash-stat-label{font-size:10px;color:var(--text3);letter-spacing:.05em;text-transform:uppercase;margin-bottom:6px}
.dash-stat-val{font-family:'Outfit',sans-serif;font-size:18px;font-weight:700;color:var(--text)}
.dash-stat-change{font-size:10px;margin-top:2px}
.chart-wrap{
  background:var(--bg3);
  border:1px solid var(--border);
  border-radius:10px;
  padding:14px;
  margin-bottom:12px;
}
.chart-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:12px}
.chart-head-title{font-size:12px;font-weight:500;color:var(--text2)}
.chart-badge{font-size:10px;background:rgba(61,204,142,.12);color:var(--green);border:1px solid rgba(61,204,142,.2);padding:2px 8px;border-radius:10px}
.tx-list{display:flex;flex-direction:column;gap:6px}
.tx-item{
  display:flex;align-items:center;gap:10px;
  background:var(--bg3);border:1px solid var(--border);
  border-radius:8px;padding:8px 12px;
}
.tx-icon{
  width:28px;height:28px;border-radius:7px;
  display:flex;align-items:center;justify-content:center;
  font-size:11px;font-weight:700;
  flex-shrink:0;
}
.tx-info{flex:1}
.tx-name{font-size:12px;font-weight:500;color:var(--text)}
.tx-date{font-size:10px;color:var(--text3)}
.tx-amount{font-size:13px;font-weight:600}

/* FLOAT BADGES */
.float-badge{
  position:absolute;
  background:var(--bg2);
  border:1px solid var(--border2);
  border-radius:12px;
  padding:10px 16px;
  display:flex;align-items:center;gap:10px;
  animation:float 3s ease-in-out infinite;
  z-index:2;
}
.float-badge:nth-child(2){animation-delay:1.5s}
.float-badge-icon{width:32px;height:32px;border-radius:8px;display:flex;align-items:center;justify-content:center;font-size:14px}
.float-badge-info .val{font-family:'Outfit',sans-serif;font-size:14px;font-weight:700;color:var(--text)}
.float-badge-info .lbl{font-size:10px;color:var(--text3)}
.fb-left{left:-50px;bottom:2%}
.fb-right{right:-70px;top:29%}
@keyframes float{0%,100%{transform:translateY(0)}50%{transform:translateY(-20px)}}

/* LOGOS */
.logos-section{
  padding:40px max(48px, calc((100vw - var(--max-w)) / 2));
  border-top:1px solid var(--border);
  border-bottom:1px solid var(--border);
  overflow:hidden;
  max-width:100%;
}
.logos-label{
  text-align:center;
  font-size:12px;
  letter-spacing:.1em;
  text-transform:uppercase;
  color:var(--text3);
  margin-bottom:24px;
}
.logos-track-wrap{overflow:hidden;position:relative;max-width:100%;width:100%}
.logos-track-wrap::before,.logos-track-wrap::after{
  content:'';
  position:absolute;top:0;bottom:0;width:120px;z-index:2;
  pointer-events:none;
}
.logos-track-wrap::before{left:0;background:linear-gradient(to right,var(--bg),transparent)}
.logos-track-wrap::after{right:0;background:linear-gradient(to left,var(--bg),transparent)}
.logos-track{
  display:flex;gap:0;
  animation:ticker-scroll 22s linear infinite;
  width:max-content;
  will-change:transform;
  flex-shrink:0;
}
.logo-item{
  padding:0 40px;
  font-family:'Outfit',sans-serif;
  font-size:15px;
  font-weight:700;
  color:var(--text3);
  letter-spacing:.05em;
  white-space:nowrap;
  border-right:1px solid var(--border);
  transition:color .2s;
}

/* STATS */
.stats-section{
  padding:60px max(48px, calc((100vw - var(--max-w)) / 2));
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:16px;
  background:var(--bg);
}
.stat-block{
  background:var(--bg2);
  border:1px solid var(--border);
  border-radius:16px;
  padding:28px 24px;
  position:relative;
  overflow:hidden;
  transition:border-color .6s var(--silk),transform .6s var(--silk),background .6s var(--silk);
}
.stat-block:hover{border-color:var(--border2);transform:translateY(-3px);background:var(--bg3)}
.stat-icon{
  width:38px;height:38px;
  background:rgba(74,158,232,.1);
  border:1px solid rgba(74,158,232,.15);
  border-radius:10px;
  display:flex;align-items:center;justify-content:center;
  margin-bottom:16px;
  position:relative;
  transition:transform .6s var(--silk);
}
.stat-block:hover .stat-icon{transform:scale(1.08) rotate(-4deg)}
.stat-icon::before,.stat-icon::after{
  content:'';
  position:absolute;
  inset:-1px;
  border-radius:10px;
  border:1px solid var(--sky);
  opacity:0;
  pointer-events:none;
}
.stat-block:hover .stat-icon::before{
  animation:ring-pulse 1.4s var(--silk) infinite;
}
.stat-block:hover .stat-icon::after{
  animation:ring-pulse 1.4s var(--silk) infinite;
  animation-delay:.7s;
}
@keyframes ring-pulse{
  0%{opacity:.7;transform:scale(1)}
  100%{opacity:0;transform:scale(1.7)}
}
.stat-icon svg{width:18px;height:18px;fill:none;stroke:var(--sky);stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.stat-num{
  font-family:'Outfit',sans-serif;
  font-size:clamp(25px,3vw,25px);
  font-weight:800;
  color:var(--text);
  letter-spacing:-.03em;
  line-height:1;
  margin-bottom:6px;
}
.stat-label{font-size:13px;color:var(--text3);font-weight:400;margin-bottom:14px}
.stat-bar-wrap{background:var(--bg3);border-radius:4px;height:4px;margin-bottom:8px}
.stat-bar{height:100%;border-radius:4px;background:var(--sky);transition:width 1.2s ease}
.stat-trend{
  display:flex;align-items:center;gap:5px;
  font-size:11px;font-weight:600;
}
.stat-trend svg{width:12px;height:12px;fill:none;stroke:currentColor;stroke-width:2.5;stroke-linecap:round;stroke-linejoin:round}

/* FEATURES STICKY STACK */
.features-section{
  padding:100px max(48px, calc((100vw - var(--max-w)) / 2));
}
.features-header{
  text-align:center;
  max-width:700px;
  margin:0 auto 80px;
}
.section-tag{
  display:inline-block;
  font-size:11px;
  font-weight:600;
  letter-spacing:.12em;
  text-transform:uppercase;
  color:var(--sky);
  margin-bottom:16px;
}
.section-title{
  font-family:'Outfit',sans-serif;
  font-size:clamp(32px,4vw,35px);
  font-weight:800;
  letter-spacing:-.03em;
  line-height:1.1;
  margin-bottom:16px;
}
.section-sub{font-size:16px;color:var(--text2);font-weight:300;line-height:1.7}

.sticky-layout{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:80px;
  align-items:start;
}
.sticky-cards{
  display:flex;
  flex-direction:column;
  gap:16px;
}
.sticky-card{
  background:var(--bg2);
  border:1px solid var(--border);
  border-radius:16px;
  padding:28px;
  cursor:pointer;
  transition:border-color .6s var(--silk),background .6s var(--silk),transform .6s var(--silk);
  position:relative;
  overflow:hidden;
}
.sticky-card::before{
  content:'';
  position:absolute;
  left:0;top:0;bottom:0;
  width:3px;
  background:var(--sky);
  opacity:0;
  transition:opacity .5s var(--silk);
}
.sticky-card:hover{transform:translateX(4px)}
.sticky-card.active{border-color:var(--border2);background:var(--bg3)}
.sticky-card.active::before{opacity:1}
.sticky-card-icon{
  width:44px;height:44px;
  background:rgba(74,158,232,.1);
  border:1px solid rgba(74,158,232,.2);
  border-radius:10px;
  display:flex;align-items:center;justify-content:center;
  margin-bottom:16px;
  transition:background .3s;
}
.sticky-card.active .sticky-card-icon{background:rgba(74,158,232,.18)}
.sticky-card-icon svg{width:20px;height:20px;fill:none;stroke:var(--sky);stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.sticky-card h3{
  font-family:'Outfit',sans-serif;
  font-size:18px;
  font-weight:700;
  margin-bottom:8px;
  color:var(--text);
}
.sticky-card p{font-size:14px;color:var(--text2);line-height:1.65;font-weight:300}
.sticky-card-pills{display:flex;gap:6px;margin-top:14px;flex-wrap:wrap}
.sc-pill{
  font-size:11px;font-weight:500;
  padding:3px 10px;border-radius:20px;
  background:rgba(74,158,232,.08);
  border:1px solid rgba(74,158,232,.15);
  color:var(--sky2);
}

/* STICKY PANEL */
.sticky-panel-wrap{
  position:sticky;
  top:calc(36px + var(--nav-h) + 32px);
}
.sticky-panel{
  background:var(--bg2);
  border:1px solid var(--border);
  border-radius:20px;
  overflow:hidden;
  min-height:400px;
}
.panel-topbar{
  background:var(--bg3);
  padding:14px 18px;
  display:flex;
  align-items:center;
  gap:8px;
  border-bottom:1px solid var(--border);
}
.panel-dots{display:flex;gap:5px}
.panel-dots span{width:9px;height:9px;border-radius:50%}
.panel-content{
  padding:24px;
  min-height:360px;
  display:flex;
  flex-direction:column;
  gap:14px;
}
.panel-view{display:none}
.panel-view.active{display:flex;flex-direction:column;gap:12px;animation:fadein .35s ease}
@keyframes fadein{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}

/* panel mockups */
.pm-row{display:flex;gap:10px}
.pm-card{
  flex:1;
  background:var(--bg3);
  border:1px solid var(--border);
  border-radius:10px;
  padding:14px;
}
.pm-label{font-size:10px;color:var(--text3);text-transform:uppercase;letter-spacing:.06em;margin-bottom:6px}
.pm-val{font-family:'Outfit',sans-serif;font-size:20px;font-weight:700;color:var(--text)}
.pm-change{font-size:11px;margin-top:3px}
.pm-bar-wrap{background:var(--bg);border-radius:6px;height:6px;margin-top:8px;overflow:hidden}
.pm-bar{height:100%;border-radius:6px;background:var(--sky)}
.pm-list{display:flex;flex-direction:column;gap:8px}
.pm-list-item{
  display:flex;align-items:center;gap:10px;
  background:var(--bg3);border:1px solid var(--border);
  border-radius:8px;padding:10px 12px;
}
.pm-list-icon{
  width:30px;height:30px;border-radius:7px;
  display:flex;align-items:center;justify-content:center;
  font-size:12px;font-weight:700;flex-shrink:0;
}
.pm-list-info{flex:1}
.pm-list-name{font-size:12px;font-weight:500}
.pm-list-sub{font-size:10px;color:var(--text3)}
.pm-list-amt{font-size:13px;font-weight:600}
.pm-chart-mini{
  background:var(--bg3);border:1px solid var(--border);
  border-radius:10px;padding:14px;
}
.pm-sparkline{
  display:flex;align-items:flex-end;gap:4px;height:50px;margin-top:8px;
}
.pm-spark-bar{
  flex:1;background:rgba(74,158,232,.25);border-radius:3px 3px 0 0;
  border-top:2px solid var(--sky);
  transition:height .4s ease;
}
.pm-security-grid{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.pm-sec-item{
  background:var(--bg3);border:1px solid var(--border);
  border-radius:10px;padding:14px 12px;
  display:flex;flex-direction:column;gap:6px;
}
.pm-sec-icon{font-size:20px}
.pm-sec-name{font-size:11px;font-weight:600;color:var(--text)}
.pm-sec-status{font-size:10px;color:var(--green)}

/* DASHBOARD PREVIEW */
.dashboard-section{
  padding:100px max(48px, calc((100vw - var(--max-w)) / 2));
  background:var(--bg2);
  border-top:1px solid var(--border);
  border-bottom:1px solid var(--border);
}
.dashboard-inner{max-width:900px;margin:0 auto}
.dashboard-preview{
  background:var(--bg);
  border:1px solid var(--border);
  border-radius:20px;
  overflow:hidden;
  margin-top:48px;
}
.dp-topbar{
  background:var(--bg2);
  padding:16px 24px;
  display:flex;align-items:center;justify-content:space-between;
  border-bottom:1px solid var(--border);
}
.dp-title{font-family:'Outfit',sans-serif;font-size:14px;font-weight:700;color:var(--text)}
.dp-live{
  display:flex;align-items:center;gap:6px;
  font-size:11px;color:var(--green);font-weight:500;
}
.dp-live-dot{width:6px;height:6px;background:var(--green);border-radius:50%;animation:pulse 1.5s infinite}
.dp-body{padding:24px;display:grid;grid-template-columns:2fr 1fr;gap:20px}
.dp-chart-area{
  background:var(--bg2);border:1px solid var(--border);
  border-radius:12px;padding:20px;
}
.dp-chart-head{display:flex;justify-content:space-between;align-items:flex-start;margin-bottom:16px}
.dp-chart-val{font-family:'Outfit',sans-serif;font-size:28px;font-weight:800;color:var(--text)}
.dp-chart-change{font-size:12px;color:var(--green);margin-top:4px}
.dp-chart-period{display:flex;gap:4px}
.dp-period-btn{
  font-size:11px;padding:4px 10px;border-radius:5px;
  background:transparent;border:1px solid var(--border);
  color:var(--text3);cursor:pointer;font-family:'DM Sans',sans-serif;
  transition:all .2s;
}
.dp-period-btn.active{background:var(--sky4);border-color:var(--sky3);color:var(--sky)}
.dp-side{display:flex;flex-direction:column;gap:12px}
.dp-side-card{
  background:var(--bg2);border:1px solid var(--border);
  border-radius:12px;padding:16px;
}
.dp-side-label{font-size:10px;color:var(--text3);text-transform:uppercase;letter-spacing:.06em;margin-bottom:8px}
.dp-side-val{font-family:'Outfit',sans-serif;font-size:22px;font-weight:700;color:var(--text)}
.dp-side-change{font-size:11px;margin-top:4px}
.dp-allocations{margin-top:12px;display:flex;flex-direction:column;gap:8px}
.dp-alloc-row{display:flex;align-items:center;gap:10px}
.dp-alloc-dot{width:8px;height:8px;border-radius:50%;flex-shrink:0}
.dp-alloc-name{font-size:12px;color:var(--text2);flex:1}
.dp-alloc-pct{font-size:12px;font-weight:500;color:var(--text)}
.dp-alloc-bar-wrap{flex:1;background:var(--bg3);border-radius:3px;height:4px}
.dp-alloc-bar{height:100%;border-radius:3px}

/* PRICING */
.pricing-section{padding:100px max(48px, calc((100vw - var(--max-w)) / 2))}
.pricing-toggle-wrap{
  display:flex;align-items:center;justify-content:center;
  gap:12px;margin-bottom:48px;margin-top:32px;
}
.toggle-label{font-size:14px;color:var(--text2)}
.toggle-switch{
  width:44px;height:24px;background:var(--bg3);
  border:1px solid var(--border2);border-radius:12px;
  cursor:pointer;position:relative;transition:background .2s;
}
.toggle-switch.on{background:var(--sky3)}
.toggle-knob{
  position:absolute;top:3px;left:3px;
  width:16px;height:16px;background:var(--text2);
  border-radius:50%;transition:transform .2s,background .2s;
}
.toggle-switch.on .toggle-knob{transform:translateX(20px);background:#fff}
.toggle-save{
  font-size:11px;font-weight:600;
  background:rgba(61,204,142,.12);
  color:var(--green);
  border:1px solid rgba(61,204,142,.2);
  padding:3px 10px;border-radius:20px;
}
.pricing-grid{
  display:grid;
  grid-template-columns:repeat(2,1fr);
  gap:16px;
  max-width:960px;
  margin:0 auto;
}
.price-card{
  background:var(--bg2);
  border:1px solid var(--border);
  border-radius:20px;
  padding:32px 28px;
  position:relative;
  transition:border-color .6s var(--silk),transform .6s var(--silk),box-shadow .6s var(--silk);
}
.price-card:hover{border-color:var(--border2);transform:translateY(-4px);box-shadow:0 20px 48px rgba(0,0,0,.3)}
.price-card.featured{border-color:var(--sky5);background:var(--bg5)}
.price-card.featured2{border-color:var(--sky3);background:var(--bg3)}
.featured-badge{
  position:absolute;top:-12px;left:50%;transform:translateX(-50%);
  background:var(--sky);
  color:var(--bg2);;
  font-size:11px;font-weight:700;
  padding:4px 16px;border-radius:20px;
  white-space:nowrap;letter-spacing:.04em;
}
.featured-badge2{
  position:absolute;top:-12px;left:50%;transform:translateX(-50%);
  background:var(--sky5);
  color:var(--bg2);
  font-size:11px;font-weight:700;
  padding:4px 16px;border-radius:20px;
  white-space:nowrap;letter-spacing:.04em;
}
.price-plan{font-size:12px;font-weight:600;letter-spacing:.1em;text-transform:uppercase;color:var(--text2);margin-bottom:16px}
.price-amount{
  font-family:'Outfit',sans-serif;
  font-size:42px;font-weight:800;
  color:var(--text);
  letter-spacing:-.03em;
  line-height:1;
  margin-bottom:4px;
}
.price-amount sup{font-size:20px;vertical-align:top;margin-top:8px;display:inline-block}
.price-period{font-size:13px;color:var(--text3);margin-bottom:24px}
.price-features{list-style:none;display:flex;flex-direction:column;gap:10px;margin-bottom:28px}
.price-features li{
  display:flex;align-items:center;gap:10px;
  font-size:14px;color:var(--text2);
}
.price-features li svg{width:16px;height:16px;fill:none;stroke:var(--green);stroke-width:2.5;stroke-linecap:round;stroke-linejoin:round;flex-shrink:0}
.price-btn{
  width:100%;
  padding:12px;border-radius:10px;
  font-family:'DM Sans',sans-serif;
  font-size:14px;font-weight:600;
  cursor:pointer;transition:all .2s;border:none;
}
.price-btn-ghost{
  background:transparent;
  border:1px solid var(--border2);
  color:var(--text);
}

.price-btn-ghost2{
  background:transparent;
  border:1px solid var(--border2);
  color:var(--bg2);
  background:var(--sky5);
}
.price-btn-ghost:hover{border-color:var(--sky);color:var(--sky)}
.price-btn-ghost2:hover{border-color:var(--sky5);color:var(--bg2);background:var(--sky6);}
.price-btn-primary{background:var(--sky);color:var(--bg2);}
.price-btn-primary:hover{background:var(--sky2)}

/* SECURITY */
.security-section{
  padding:100px max(48px, calc((100vw - var(--max-w)) / 2));
  background:var(--bg2);
  border-top:1px solid var(--border);
}
.security-inner{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:80px;
  align-items:center;
  max-width:1100px;
  margin:0 auto;
}
.security-badges{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.sec-badge{
  background:var(--bg);
  border:1px solid var(--border);
  border-radius:14px;
  padding:20px;
  display:flex;flex-direction:column;gap:8px;
  transition:border-color .6s var(--silk),transform .6s var(--silk);
}
.sec-badge:hover{border-color:var(--border2);transform:translateY(-2px)}
.sec-badge-icon{
  width:40px;height:40px;
  background:rgba(74,158,232,.1);
  border:1px solid rgba(74,158,232,.2);
  border-radius:10px;
  display:flex;align-items:center;justify-content:center;
}
.sec-badge-icon svg{width:20px;height:20px;fill:none;stroke:var(--sky);stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.sec-badge-name{font-size:14px;font-weight:600;color:var(--text)}
.sec-badge-desc{font-size:12px;color:var(--text3);line-height:1.5}
.sec-badge-status{
  display:inline-flex;align-items:center;gap:5px;
  font-size:11px;color:var(--green);font-weight:500;margin-top:4px;
}
.sec-badge-status::before{content:'';width:5px;height:5px;background:var(--green);border-radius:50%}

/* TESTIMONIALS */
.testimonials-section{padding:100px max(48px, calc((100vw - var(--max-w)) / 2))}
.testi-track-wrap{overflow:hidden;margin-top:48px;position:relative;max-width:100%;width:100%}
.testi-track-wrap::before,.testi-track-wrap::after{
  content:'';position:absolute;top:0;bottom:0;width:80px;z-index:2;pointer-events:none;
}
.testi-track-wrap::before{left:0;background:linear-gradient(to right,var(--bg),transparent)}
.testi-track-wrap::after{right:0;background:linear-gradient(to left,var(--bg),transparent)}
.testi-track{
  display:flex;gap:16px;
  animation:ticker-scroll 28s linear infinite;
  width:max-content;
  will-change:transform;
  flex-shrink:0;
}
.testi-card{
  background:var(--bg2);
  border:1px solid var(--border);
  border-radius:16px;
  padding:24px;
  width:320px;
  flex-shrink:0;
}
.testi-stars{display:flex;gap:3px;margin-bottom:14px}
.testi-stars svg{width:14px;height:14px;fill:var(--sky);stroke:none}
.testi-quote{font-size:14px;color:var(--text2);line-height:1.65;margin-bottom:16px;font-style:italic}
.testi-author{display:flex;align-items:center;gap:10px}
.testi-avatar{
  width:36px;height:36px;border-radius:50%;
  background:var(--bg3);border:1px solid var(--border2);
  display:flex;align-items:center;justify-content:center;
  font-size:12px;font-weight:700;color:var(--sky);
}
.testi-name{font-size:13px;font-weight:600;color:var(--text)}
.testi-role{font-size:11px;color:var(--text3)}

/* APP DOWNLOAD */
.app-section{
  padding:100px max(48px, calc((100vw - var(--max-w)) / 2));
  background:var(--bg2);
  border-top:1px solid var(--border);
  border-bottom:1px solid var(--border);
  position:relative;
  overflow:hidden;
}
.app-section::before{
  content:'';
  position:absolute;
  bottom:0;right:0;
  width:100%;height:100%;
  background-image:
    repeating-linear-gradient(45deg,transparent 0,transparent 119px,rgba(74,158,232,.35) 119px,rgba(74,158,232,.35) 120px),
    repeating-linear-gradient(-45deg,transparent 0,transparent 119px,rgba(74,158,232,.35) 119px,rgba(74,158,232,.35) 120px);
  -webkit-mask-image:radial-gradient(ellipse 100% 100% at 100% 100%,#000 0%,transparent 70%);
  mask-image:radial-gradient(ellipse 100% 100% at 100% 100%,#000 0%,transparent 70%);
  pointer-events:none;
  z-index:0;
}
.app-section > *{position:relative;z-index:1}
.app-inner{
  display:grid;grid-template-columns:3fr 2fr;
  gap:80px;align-items:center;max-width:1000px;margin:0 auto;
}
.app-btns{display:flex;gap:12px;flex-wrap:wrap;margin-top:28px}
.app-store-btn{
  display:flex;align-items:center;gap:12px;
  background:var(--bg3);border:1px solid var(--border2);
  border-radius:14px;padding:14px 26px;
  text-decoration:none;transition:border-color .5s var(--silk),background .5s var(--silk);
  min-width:200px;
}
.app-store-btn:hover{border-color:var(--sky);background:var(--bg4)}
.app-store-btn svg{fill:var(--text);flex-shrink:0}
.app-store-btn-info{display:flex;flex-direction:column}
.app-store-btn-sub{font-size:10px;color:var(--text3);letter-spacing:.02em}
.app-store-btn-name{font-size:16px;font-weight:700;color:var(--text);font-family:'Outfit',sans-serif;letter-spacing:-.01em}
.phone-mockup{
  width:220px;
  margin:0 auto;
  background:var(--bg3);
  border:2px solid var(--border2);
  border-radius:36px;
  padding:20px 14px;
  position:relative;
}
.phone-notch{
  width:70px;height:20px;background:var(--bg);
  border-radius:0 0 12px 12px;margin:0 auto 16px;
}
.phone-screen{
  background:var(--bg);
  border-radius:16px;
  padding:16px;
  min-height:320px;
  display:flex;flex-direction:column;gap:10px;
}
.phone-header{
  display:flex;align-items:center;justify-content:space-between;margin-bottom:4px;
}
.phone-greeting{font-size:12px;color:var(--text3)}
.phone-name{font-size:14px;font-weight:700;color:var(--text);font-family:'Outfit',sans-serif}
.phone-balance{
  background:var(--bg3);border:1px solid var(--border);
  border-radius:12px;padding:14px;
}
.phone-bal-label{font-size:9px;color:var(--text3);text-transform:uppercase;letter-spacing:.06em}
.phone-bal-val{font-family:'Outfit',sans-serif;font-size:22px;font-weight:800;color:var(--text);margin-top:4px}
.phone-bal-change{font-size:10px;color:var(--green);margin-top:2px}
.phone-quick{display:grid;grid-template-columns:repeat(3,1fr);gap:6px}
.phone-quick-btn{
  background:var(--bg3);border:1px solid var(--border);
  border-radius:8px;padding:8px 4px;text-align:center;
  font-size:9px;color:var(--text2);
}
.phone-quick-icon{font-size:16px;margin-bottom:3px}
.phone-chart-mini{
  background:var(--bg3);border:1px solid var(--border);
  border-radius:8px;padding:10px;
}
.phone-spark{display:flex;align-items:flex-end;gap:3px;height:30px}
.phone-spark-bar{flex:1;background:rgba(74,158,232,.2);border-radius:2px 2px 0 0;border-top:1.5px solid var(--sky)}
.phone-qr{
  width:60px;height:60px;
  background:var(--bg3);border:1px solid var(--border);
  border-radius:8px;margin-top:12px;
  display:flex;align-items:center;justify-content:center;
  font-size:10px;color:var(--text3);
}

/* FAQ */
.faq-section{
  padding:110px max(48px, calc((100vw - var(--max-w)) / 2));
  position:relative;
  overflow:hidden;
  background:
    radial-gradient(circle at 18% 18%, rgba(0,135,255,.10), transparent 34%),
    radial-gradient(circle at 82% 82%, rgba(2,221,2,.08), transparent 32%);
}
.faq-section::before{
  content:'';
  position:absolute;
  inset:0;
  background-image:
    linear-gradient(45deg, rgba(0,135,255,.16) 1px, transparent 1px),
    linear-gradient(-45deg, rgba(0,135,255,.10) 1px, transparent 1px);
  background-size:150px 150px;
  -webkit-mask-image:radial-gradient(ellipse 95% 85% at 0% 80%, #000 0%, transparent 70%);
  mask-image:radial-gradient(ellipse 95% 85% at 0% 80%, #000 0%, transparent 70%);
  pointer-events:none;
  z-index:0;
}
.faq-section::after{
  content:'';
  position:absolute;
  inset:auto 0 0 0;
  height:220px;
  background:linear-gradient(180deg, transparent, rgba(246,250,255,.96));
  pointer-events:none;
  z-index:0;
}
.faq-section > *{position:relative;z-index:1}
.faq-inner{max-width:880px;margin:0 auto}
.faq-head{
  display:flex;
  align-items:flex-end;
  justify-content:space-between;
  flex-wrap:wrap;
  gap:18px;
  margin-bottom:30px;
}
.faq-head-text{max-width:640px}
.faq-subtitle{margin-top:12px;max-width:560px;text-align:left}
.faq-toggle-all{
  background:rgba(255,255,255,.82);
  border:1px solid var(--border2);
  color:var(--text2);
  font-family:'DM Sans',sans-serif;
  font-size:13px;
  font-weight:700;
  padding:10px 16px;
  border-radius:999px;
  cursor:pointer;
  display:flex;
  align-items:center;
  gap:7px;
  transition:transform .25s var(--silk), border-color .25s var(--silk), color .25s var(--silk), box-shadow .25s var(--silk);
  white-space:nowrap;
  box-shadow:0 10px 26px rgba(0,64,128,.08);
}
.faq-toggle-all:hover{transform:translateY(-2px);border-color:rgba(0,135,255,.38);color:var(--sky);box-shadow:0 16px 34px rgba(0,135,255,.13)}
.faq-list{margin-top:0;display:flex;flex-direction:column;gap:12px}
.faq-item{
  background:rgba(255,255,255,.88);
  border:1px solid rgba(184,215,242,.86);
  border-radius:18px;
  overflow:hidden;
  box-shadow:0 18px 46px rgba(16,32,51,.08);
  backdrop-filter:blur(14px);
  transition:transform .35s var(--silk),border-color .35s var(--silk),box-shadow .35s var(--silk),background .35s var(--silk);
}
.faq-item:hover{transform:translateY(-2px);border-color:rgba(0,135,255,.42);box-shadow:0 24px 60px rgba(0,135,255,.13)}
.faq-item.open{border-color:rgba(0,135,255,.48);background:#fff;box-shadow:0 26px 70px rgba(0,135,255,.16)}
.faq-q{
  display:flex;align-items:center;justify-content:space-between;
  padding:21px 24px;
  cursor:pointer;
  gap:16px;
}
.faq-q-main{display:flex;align-items:center;gap:14px;min-width:0}
.faq-q-icon{
  width:34px;height:34px;flex:0 0 34px;
  border-radius:12px;
  display:flex;align-items:center;justify-content:center;
  color:var(--sky);
  background:linear-gradient(135deg, rgba(0,135,255,.14), rgba(2,221,2,.12));
  border:1px solid rgba(0,135,255,.18);
  font-weight:800;
  font-size:15px;
}
.faq-q-text{font-size:15px;font-weight:700;color:var(--text);transition:color .4s var(--silk)}
.faq-q:hover .faq-q-text{color:var(--sky)}
.faq-chevron{
  width:20px;height:20px;flex-shrink:0;
  fill:none;stroke:var(--text3);stroke-width:2.2;
  stroke-linecap:round;stroke-linejoin:round;
  transition:transform .6s var(--silk),stroke .4s var(--silk);
}
.faq-item.open .faq-chevron{transform:rotate(180deg);stroke:var(--sky)}
.faq-a{
  max-height:0;overflow:hidden;
  transition:max-height .6s var(--silk),padding .5s var(--silk),border-color .5s var(--silk);
  font-size:14px;color:var(--text2);line-height:1.75;
  padding:0 24px 0 72px;font-weight:400;
  border-top:1px solid transparent;
}
.faq-item.open .faq-a{max-height:260px;padding-bottom:22px;padding-top:18px;border-top-color:rgba(214,230,245,.8)}

/* FOOTER */
footer{
  padding:40px max(48px, calc((100vw - var(--max-w)) / 2)) 28px;
  border-top:1px solid var(--border);
}
.footer-grid{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:48px;
  margin-bottom:28px;
  align-items:start;
}
.footer-brand{max-width:300px}
.footer-logo{
  font-family:'Outfit',sans-serif;
  font-size:20px;font-weight:800;
  color:var(--text);margin-bottom:10px;
  display:flex;align-items:center;gap:8px;
}
.footer-desc{font-size:13px;color:var(--text3);line-height:1.6;margin-bottom:14px}
.footer-newsletter{display:flex;gap:8px}
.footer-input{
  flex:1;background:var(--bg2);
  border:1px solid var(--border);
  border-radius:8px;padding:10px 14px;
  color:var(--text);font-family:'DM Sans',sans-serif;
  font-size:13px;outline:none;
}
.footer-input::placeholder{color:var(--text3)}
.footer-input:focus{border-color:var(--sky)}
.footer-sub-btn{
  background:var(--sky);border:none;
  color:#FFFFFF;font-family:'DM Sans',sans-serif;
  font-size:13px;font-weight:600;
  padding:10px 16px;border-radius:8px;cursor:pointer;
  white-space:nowrap;transition:background .2s;
}
.footer-sub-btn:hover{background:var(--sky2)}
.footer-col-title{font-size:12px;font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:var(--text2);margin-bottom:16px}
.footer-links{list-style:none;display:flex;flex-direction:column;gap:10px}
.footer-links a{font-size:14px;color:var(--text3);text-decoration:none;transition:color .2s}
.footer-links a:hover{color:var(--sky)}
.footer-bottom{
  border-top:1px solid var(--border);
  padding-top:20px;
  display:flex;align-items:center;justify-content:space-between;
}
.footer-copy{font-size:13px;color:var(--text3)}
.footer-link{
  font-size:13px;color:var(--text3);text-decoration:none;
  transition:color .4s var(--silk);
}
.footer-link:hover{color:var(--sky)}
.footer-socials{display:flex;gap:8px}
.social-btn{
  width:34px;height:34px;border-radius:8px;
  background:var(--bg2);border:1px solid var(--border);
  display:flex;align-items:center;justify-content:center;
  text-decoration:none;transition:border-color .2s;
}
.social-btn:hover{border-color:var(--sky)}
.social-btn svg{width:16px;height:16px;fill:none;stroke:var(--text3);stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}

/* RESPONSIVE */
@media(max-width:900px){
  nav{padding:0 24px}
  .nav-links,.nav-cta{display:none}
  .hamburger{display:flex}
  .mobile-menu{display:flex}
  .hero{grid-template-columns:1fr;padding:calc(36px + var(--nav-h) + 40px) 24px 60px;gap:40px}
  .fb-left,.fb-right{display:none}
  .stats-section{grid-template-columns:1fr 1fr}
  .features-section,.pricing-section,.faq-section,.testimonials-section,.dashboard-section,.logos-section,.security-section,.app-section,.stats-section{padding:60px 24px}
  footer{padding-left:24px !important;padding-right:24px !important}
  .sticky-layout{grid-template-columns:1fr}
  .sticky-panel-wrap{position:static}
  .pricing-grid{grid-template-columns:1fr}
  .security-inner{grid-template-columns:1fr;gap:40px}
  .app-inner{grid-template-columns:1fr;gap:40px}
  .footer-grid{grid-template-columns:1fr;gap:32px}
  .footer-bottom{flex-direction:column;gap:16px;text-align:center}
  .dp-body{grid-template-columns:1fr}
}
@media(max-width:600px){
  .stats-section{grid-template-columns:1fr}
  .footer-grid{grid-template-columns:1fr}
  .hero h1{font-size:36px}
  .pricing-grid{gap:12px}
}


/* ============================================================================
   WhatsCompany Light Premium adjustments
   ============================================================================ */
body{
  background:linear-gradient(180deg,#F6FAFF 0%,#FFFFFF 42%,#F4FAFF 100%);
}
.ticker{
  background:#102033;
  border-bottom:1px solid rgba(0,135,255,.22);
}
.ticker-price{color:#FFFFFF}
.ticker-sym{color:#B8D7F2}
.ticker-item{border-right:1px solid rgba(255,255,255,.12)}
nav.scrolled{
  background:rgba(255,255,255,.92);
  backdrop-filter:blur(20px);
  border-color:var(--border);
  box-shadow:0 10px 30px rgba(16,32,51,.07);
}
.nav-logo-mark{
  background:linear-gradient(135deg,var(--sky),var(--green));
  box-shadow:0 10px 24px rgba(0,135,255,.18);
}
.nav-links a:hover{color:var(--sky);background:rgba(0,135,255,.07)}
.btn-primary,.btn-hero{
  background:linear-gradient(135deg,var(--sky),var(--green));
  border-color:transparent;
  color:#fff;
  box-shadow:0 10px 24px rgba(0,135,255,.18);
}
.btn-primary:hover,.btn-hero:hover{
  background:linear-gradient(135deg,#0078E5,var(--sky));
  color:#fff;
  box-shadow:0 14px 34px rgba(0,135,255,.24);
}
.btn-outline,.btn-ghost{
  background:rgba(255,255,255,.7);
  color:var(--text);
  border-color:var(--border2);
}
.btn-outline:hover,.btn-ghost:hover{
  background:rgba(0,135,255,.06);
  border-color:var(--sky);
  color:var(--sky);
}
.hero{
  background:linear-gradient(120deg,#F6FAFF 0%,#FFFFFF 48%,#EDF8FF 100%);
}
.hero::before{
  content:'';
  position:absolute;
  inset:0;

  background-image:
    repeating-linear-gradient(
      45deg,
      transparent 0,
      transparent 119px,
      rgba(132,255,0,.65) 119px,
      rgba(132,255,0,.65) 120px
    ),
    repeating-linear-gradient(
      -45deg,
      transparent 0,
      transparent 119px,
      rgba(132,255,0,.65) 119px,
      rgba(132,255,0,.65) 120px
    );

  -webkit-mask-image:radial-gradient(
    ellipse 100% 100% at 0% 0%,
    #000 0%,
    transparent 72%
  );

  mask-image:radial-gradient(
    ellipse 100% 100% at 0% 0%,
    #000 0%,
    transparent 72%
  );

  pointer-events:none;
  z-index:0;
}
.hero::after{
  background:radial-gradient(circle,rgba(2,221,2,.10) 0%,transparent 70%);
}
.hero-badge{
  background:rgba(0,135,255,.08);
  border-color:rgba(0,135,255,.18);
  color:var(--sky);
}
.badge-dot{background:var(--green)}
.hero h1 span{color:var(--sky)}
.hero-sub{color:var(--text2)}
.hero-avatars span{
  background:#FFFFFF;
  border-color:#F6FAFF;
  color:var(--sky);
  box-shadow:0 6px 16px rgba(16,32,51,.08);
}
.dash-card,.sticky-panel,.stat-block,.sticky-card,.pm-card,.pm-list-item,.chart-wrap,.tx-item,.dash-stat,.float-badge,.pricing-card,.faq-item,.testimonial-card{
  background:rgba(255,255,255,.88) !important;
  border-color:var(--border) !important;
  box-shadow:0 18px 45px rgba(16,32,51,.08);
}
.dash-topbar,.panel-topbar{
  background:linear-gradient(180deg,#F4FAFF,#EAF5FF) !important;
  border-bottom-color:var(--border) !important;
}
.dash-title-bar{color:var(--text3)}
.dash-stat-label,.tx-date,.float-badge-info .lbl,.pm-label,.pm-change{color:var(--text3)}
.dash-stat-val,.tx-name,.tx-amount,.float-badge-info .val,.pm-val,.pm-list-name,.section-title,.sticky-card h3{color:var(--text)}
.chart-badge{
  background:rgba(2,221,2,.10);
  border-color:rgba(2,221,2,.22);
  color:#00B900;
}
.logos-section{
  background:#FFFFFF;
  border-color:var(--border);
}
.logos-track-wrap::before{background:linear-gradient(to right,#FFFFFF,transparent)}
.logos-track-wrap::after{background:linear-gradient(to left,#FFFFFF,transparent)}
.logo-item{color:var(--text2);border-right-color:var(--border)}
.stat-block:hover,.sticky-card.active,.sticky-card:hover{
  background:#FFFFFF !important;
  border-color:var(--border2) !important;
  box-shadow:0 22px 60px rgba(0,135,255,.12);
}
.stat-icon,.sticky-card-icon{
  background:rgba(0,135,255,.08);
  border-color:rgba(0,135,255,.14);
}
.stat-bar,.pm-bar{background:linear-gradient(90deg,var(--sky),var(--green)) !important}
.sc-pill{
  background:rgba(0,135,255,.07);
  border-color:rgba(0,135,255,.13);
  color:var(--sky);
}
.sticky-card::before{background:linear-gradient(180deg,var(--sky),var(--green))}
.mobile-menu{
  background:#FFFFFF;
}
.hamburger span{background:var(--text)}
@media (max-width:900px){
  nav{background:rgba(255,255,255,.92);backdrop-filter:blur(18px);border-bottom:1px solid var(--border)}
}

/* ============================================================================
   WhatsCompany logo mark - W icon
   ============================================================================ */
.nav-logo-mark{
  width:30px;
  height:30px;
  min-width:30px;
  border-radius:5px;
  background:linear-gradient(135deg,#0087FF 0%,#00BFA6 48%,#02DD02 100%);
  display:flex;
  align-items:center;
  justify-content:center;
  box-shadow:0 12px 28px rgba(0,135,255,.18);
}

.nav-logo-letter{
  font-family:'Arial';
  font-size:16px;
  font-weight:800;
  line-height:1;
  color:#FFFFFF;
  letter-spacing:-.06em;
  transform:translateY(0px);
}

.nav-logo-mark svg{
  display:none;
}


/* ============================================================================
   Formulário de contratação dos planos
   ============================================================================ */
.plan-modal{
  position:fixed;
  inset:0;
  z-index:999;
  display:none;
  align-items:center;
  justify-content:center;
  padding:18px;
}
.plan-modal.open{display:flex}
.plan-modal-backdrop{
  position:absolute;
  inset:0;
  background:rgba(16,32,51,.58);
  backdrop-filter:blur(12px);
}
.plan-modal-box{
  position:relative;
  width:min(1180px,100%);
  background:rgba(255,255,255,.97);
  border:1px solid var(--border);
  border-radius:24px;
  box-shadow:0 28px 90px rgba(16,32,51,.22);
  padding:28px 32px 26px;
  animation:silk-in .7s var(--silk) forwards;
  overflow:visible;
}
.plan-modal-close{
  position:absolute;
  top:16px;
  right:16px;
  width:38px;
  height:38px;
  border-radius:12px;
  border:1px solid var(--border);
  background:#fff;
  color:var(--text2);
  font-size:26px;
  line-height:1;
  cursor:pointer;
  transition:all .3s var(--silk);
}
.plan-modal-close:hover{
  border-color:var(--sky);
  color:var(--sky);
  transform:translateY(-1px);
}
.plan-modal-header{
  max-width:820px;
  margin-bottom:20px;
  padding-right:48px;
}
.plan-modal-header .section-tag{
  margin-bottom:8px;
}
.plan-modal-header .section-title{
  margin-bottom:8px;
  font-size:clamp(30px,3.6vw,35px);
}
.plan-modal-header .section-sub{
  font-size:15px;
  line-height:1.55;
}
.plan-form{width:100%}
.plan-form-grid{
  display:grid;
  grid-template-columns:repeat(12,1fr);
  gap:12px 14px;
}
.field-span-3{grid-column:span 3}
.field-span-4{grid-column:span 4}
.field-span-6{grid-column:span 6}
.form-field{
  display:flex;
  flex-direction:column;
  gap:6px;
  min-width:0;
}
.form-field span{
  color:var(--text);
  font-size:13px;
  font-weight:700;
  letter-spacing:.01em;
}
.form-field small{
  color:var(--text3);
  font-size:11px;
  font-weight:500;
}
.form-field input,
.form-field select{
  width:100%;
  min-height:46px;
  border:1px solid var(--border);
  border-radius:12px;
  background:#F8FBFF;
  color:var(--text);
  font-family:'DM Sans',sans-serif;
  font-size:14px;
  outline:none;
  padding:0 14px;
  transition:border-color .35s var(--silk),box-shadow .35s var(--silk),background .35s var(--silk);
}
.form-field select{
  appearance:auto;
  cursor:pointer;
}
.form-field input::placeholder{color:var(--text3)}
.form-field input:focus,
.form-field select:focus{
  background:#fff;
  border-color:var(--sky);
  box-shadow:0 0 0 4px rgba(0,135,255,.10);
}
.form-field input[readonly]{
  background:linear-gradient(135deg,rgba(0,135,255,.08),rgba(2,221,2,.06));
  color:var(--text);
  font-weight:700;
}
.form-field.has-error input,
.form-field.has-error select,
.form-field.has-error .password-wrap{
  border-color:var(--red);
  box-shadow:0 0 0 4px rgba(232,90,90,.10);
}
.form-error{
  display:none;
  width:fit-content;
  max-width:100%;
  min-height:0;
  margin-top:2px;
  padding:5px 9px;
  border-radius:999px;
  background:rgba(232,90,90,.08);
  border:1px solid rgba(232,90,90,.16);
  color:var(--red) !important;
  font-size:11px !important;
  line-height:1.25;
  font-weight:700 !important;
}
.has-error > .form-error,
.has-error .form-error{
  display:inline-flex;
  align-items:center;
  gap:5px;
}
.has-error > .form-error::before,
.has-error .form-error::before{
  content:'!';
  width:15px;
  height:15px;
  border-radius:50%;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  flex:0 0 15px;
  background:var(--red);
  color:#fff;
  font-size:10px;
  font-weight:800;
  line-height:1;
}
.password-wrap{
  width:100%;
  min-height:46px;
  display:flex;
  align-items:center;
  border:1px solid var(--border);
  border-radius:12px;
  background:#F8FBFF;
  transition:border-color .35s var(--silk),box-shadow .35s var(--silk),background .35s var(--silk);
}
.password-wrap:focus-within{
  background:#fff;
  border-color:var(--sky);
  box-shadow:0 0 0 4px rgba(0,135,255,.10);
}
.password-wrap input{
  min-height:44px;
  border:0;
  background:transparent;
  box-shadow:none !important;
  padding-right:8px;
}
.password-toggle{
  width:42px;
  height:42px;
  border:0;
  background:transparent;
  color:var(--text3);
  cursor:pointer;
  display:flex;
  align-items:center;
  justify-content:center;
  border-radius:10px;
  transition:color .3s var(--silk),background .3s var(--silk);
  flex-shrink:0;
}
.password-toggle:hover{
  color:var(--sky);
  background:rgba(0,135,255,.08);
}
.password-toggle svg{
  width:19px;
  height:19px;
  fill:none;
  stroke:currentColor;
  stroke-width:1.8;
  stroke-linecap:round;
  stroke-linejoin:round;
}
.plan-form-alert{
  display:none;
  width:100%;
  min-height:0;
  margin-top:12px;
  padding:13px 15px;
  border-radius:14px;
  border:1px solid rgba(232,90,90,.18);
  background:linear-gradient(135deg,rgba(232,90,90,.10),rgba(255,255,255,.92));
  color:#C93434;
  font-size:13px;
  font-weight:800;
  line-height:1.35;
  box-shadow:0 12px 28px rgba(232,90,90,.10);
}
.plan-form-alert:not(:empty){
  display:flex;
  align-items:center;
  gap:10px;
}
.plan-form-alert:not(:empty)::before{
  content:'!';
  width:26px;
  height:26px;
  border-radius:50%;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  flex:0 0 26px;
  background:linear-gradient(135deg,#FF6B6B,var(--red));
  color:#fff;
  font-size:15px;
  font-weight:900;
  line-height:1;
  box-shadow:0 8px 18px rgba(232,90,90,.18);
}
.plan-form-alert.success{
  border-color:rgba(2,221,2,.22);
  background:linear-gradient(135deg,rgba(2,221,2,.12),rgba(255,255,255,.92));
  color:#009C00;
  box-shadow:0 12px 28px rgba(2,221,2,.10);
}
.plan-form-alert.success:not(:empty)::before{
  content:'✓';
  background:linear-gradient(135deg,var(--green),#00B900);
  box-shadow:0 8px 18px rgba(2,221,2,.18);
}
.plan-form-actions{
  display:flex;
  align-items:center;
  gap:12px;
  flex-wrap:wrap;
  margin-top:10px;
}
.plan-form-actions .btn-hero,
.plan-form-actions .btn-outline{
  min-height:46px;
  padding:12px 24px;
}
.plan-submit-btn{
  background:linear-gradient(135deg,var(--green),#00B900) !important;
  box-shadow:0 14px 34px rgba(2,221,2,.22) !important;
  text-transform:uppercase;
}
body.plan-modal-open{overflow:hidden}

@media(max-width:1100px){
  .plan-modal-box{
    max-height:calc(100vh - 28px);
    overflow:auto;
  }
  .field-span-3,.field-span-4,.field-span-6{grid-column:span 6}
}
@media(max-width:900px){
  .plan-modal{padding:14px}
  .plan-modal-box{
    padding:28px 18px;
    border-radius:20px;
    max-height:calc(100vh - 28px);
    overflow:auto;
  }
  .plan-modal-close{
    top:12px;
    right:12px;
  }
  .plan-form-grid{
    grid-template-columns:1fr;
    gap:10px;
  }
  .field-span-3,.field-span-4,.field-span-6{grid-column:span 1}
  .plan-form-actions{
    flex-direction:column;
    align-items:stretch;
  }
  .plan-form-actions .btn-hero,
  .plan-form-actions .btn-outline{
    width:100%;
    justify-content:center;
    text-align:center;
  }
}


/* ==========================================================================
   Seções SEO e diferenciação WhatsCompany
   ========================================================================== */
.solutions-section,.seo-section{padding:100px max(48px, calc((100vw - var(--max-w)) / 2));position:relative;overflow:hidden}.solutions-header{max-width:780px;margin:0 auto 48px;text-align:center}.solutions-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:22px;max-width:1100px;margin:0 auto}.solution-card{background:rgba(255,255,255,.9);border:1px solid var(--border);border-radius:24px;padding:34px;box-shadow:0 18px 45px rgba(16,32,51,.08);position:relative;overflow:hidden}.solution-card::before{content:'';position:absolute;inset:0;background:radial-gradient(circle at 100% 0%,rgba(0,135,255,.10),transparent 36%);pointer-events:none}.solution-ai::before{background:radial-gradient(circle at 100% 0%,rgba(2,221,2,.12),transparent 38%)}.solution-card>*{position:relative;z-index:1}.solution-badge{display:inline-flex;align-items:center;background:rgba(0,135,255,.08);border:1px solid rgba(0,135,255,.16);color:var(--sky);font-size:11px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;padding:5px 12px;border-radius:999px;margin-bottom:18px}.solution-ai .solution-badge{background:rgba(2,221,2,.08);border-color:rgba(2,221,2,.16);color:#00B900}.solution-icon{width:52px;height:52px;border-radius:16px;display:flex;align-items:center;justify-content:center;background:linear-gradient(135deg,var(--sky),#24A3FF);margin-bottom:18px;box-shadow:0 14px 32px rgba(0,135,255,.18)}.solution-ai .solution-icon{background:linear-gradient(135deg,var(--sky),var(--green))}.solution-icon svg{width:25px;height:25px;fill:none;stroke:#fff;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}.solution-card h3{font-family:'Outfit',sans-serif;font-size:28px;line-height:1.1;letter-spacing:-.03em;color:var(--text);margin-bottom:12px}.solution-card p{color:var(--text2);font-size:15px;line-height:1.7;margin-bottom:18px}.solution-list{list-style:none;display:flex;flex-direction:column;gap:10px;margin:0 0 24px}.solution-list li{color:var(--text);font-size:14px;display:flex;gap:10px;align-items:flex-start}.solution-list li::before{content:'✓';color:var(--green);font-weight:800;flex-shrink:0}.pricing-grid-simple{margin-top:48px}.seo-section{background:linear-gradient(180deg,#FFFFFF 0%,#F6FAFF 100%);border-top:1px solid var(--border);border-bottom:1px solid var(--border)}.seo-inner{max-width:980px;margin:0 auto}.seo-copy{background:rgba(255,255,255,.86);border:1px solid var(--border);border-radius:24px;padding:34px;box-shadow:0 18px 45px rgba(16,32,51,.06);margin-top:28px}.seo-copy p{color:var(--text2);font-size:16px;line-height:1.85;margin-bottom:16px}.seo-copy p:last-child{margin-bottom:0}@media(max-width:900px){.solutions-section,.seo-section{padding:60px 24px}.solutions-grid{grid-template-columns:1fr}.solution-card{padding:26px}.solution-card h3{font-size:24px}.seo-copy{padding:24px}}

/* ==========================================================================
   CRM/Kanban mockup - painel da seção Recursos
   ========================================================================== */
.crm-mockup{
  display:flex;
  flex-direction:column;
  gap:14px;
  width:100%;
}
.crm-mockup-top{
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:12px;
}
.crm-mockup-kicker{
  font-size:10px;
  color:var(--text3);
  text-transform:uppercase;
  letter-spacing:.08em;
  margin-bottom:2px;
}
.crm-mockup-title{
  font-family:'Outfit',sans-serif;
  font-size:18px;
  font-weight:800;
  color:var(--text);
}
.crm-mockup-btn{
  border:0;
  background:var(--sky);
  color:#fff;
  font-family:'DM Sans',sans-serif;
  font-size:12px;
  font-weight:700;
  padding:8px 12px;
  border-radius:9px;
  box-shadow:0 10px 22px rgba(0,135,255,.16);
  white-space:nowrap;
}
.crm-metrics{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:8px;
}
.crm-metric-card{
  background:var(--bg3);
  border:1px solid var(--border);
  border-radius:10px;
  padding:10px 12px;
}
.crm-metric-card span{
  display:block;
  color:var(--text3);
  font-size:10px;
  margin-bottom:4px;
}
.crm-metric-card strong{
  display:block;
  color:var(--text);
  font-family:'Outfit',sans-serif;
  font-size:18px;
  line-height:1;
}
.crm-kanban-mini{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:10px;
  overflow:hidden;
}
.crm-kanban-column{
  background:rgba(246,250,255,.82);
  border:1px solid var(--border);
  border-radius:12px;
  padding:10px;
  min-width:0;
}
.crm-kanban-head{
  display:flex;
  align-items:center;
  gap:7px;
  color:var(--text);
  font-size:12px;
  font-weight:800;
  margin-bottom:10px;
}
.crm-kanban-head small{
  color:var(--text3);
  font-weight:600;
  margin-left:auto;
}
.crm-kanban-head .dot{
  width:9px;
  height:9px;
  border-radius:50%;
  flex-shrink:0;
}
.crm-kanban-head .dot.blue{background:var(--sky)}
.crm-kanban-head .dot.purple{background:#8B5CF6}
.crm-kanban-head .dot.cyan{background:#14B8C8}
.crm-lead-card{
  background:#fff;
  border:1px solid var(--border);
  border-radius:10px;
  padding:10px;
  margin-bottom:8px;
  box-shadow:0 8px 18px rgba(16,32,51,.06);
}
.crm-lead-card strong,
.crm-lead-card span,
.crm-lead-card b,
.crm-lead-card em{
  display:block;
}
.crm-lead-card strong{
  color:var(--text);
  font-size:12px;
  line-height:1.2;
  margin-bottom:3px;
}
.crm-lead-card span{
  color:var(--text2);
  font-size:10px;
  line-height:1.25;
  margin-bottom:6px;
}
.crm-lead-card b{
  color:#24406F;
  font-size:11px;
  margin-bottom:6px;
}
.crm-lead-card em{
  background:#FFF1EA;
  color:#E85A2A;
  font-style:normal;
  font-size:9px;
  padding:4px 6px;
  border-radius:6px;
}
.crm-lead-card.compact em{display:none}

@media(max-width:600px){
  .crm-metrics{grid-template-columns:1fr}
  .crm-kanban-mini{grid-template-columns:1fr}
  .crm-mockup-top{align-items:flex-start;flex-direction:column}
}

/* ============================================================================
   CORREÇÃO — Mockup de chat do Multiatendimento
   Mantém o HTML existente e aplica a estrutura visual correta do chat.
   ============================================================================ */
.chat-preview{
  display:grid;
  grid-template-columns:230px 1fr;
  min-height:360px;
  background:#fff;
  border:1px solid var(--border);
  border-radius:16px;
  overflow:hidden;
  box-shadow:0 18px 45px rgba(16,32,51,.08);
}

.chat-preview-sidebar{
  background:#F8FBFF;
  border-right:1px solid var(--border);
  padding:14px;
  display:flex;
  flex-direction:column;
  gap:10px;
}

.chat-preview-sidebar-head{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
}

.chat-preview-sidebar-head strong,
.chat-preview-header strong{
  display:block;
  font-family:'Outfit',sans-serif;
  font-size:14px;
  font-weight:800;
  color:var(--text);
  line-height:1.2;
}

.chat-preview-sidebar-head span,
.chat-preview-header span{
  display:block;
  font-size:10px;
  color:var(--text3);
  margin-top:2px;
}

.chat-preview-filter{
  width:28px;
  height:28px;
  border-radius:8px;
  background:#fff;
  border:1px solid var(--border);
  color:var(--text2);
  display:flex;
  align-items:center;
  justify-content:center;
  font-size:14px;
}

.chat-preview-search{
  background:#fff;
  border:1px solid var(--border);
  border-radius:10px;
  padding:9px 11px;
  color:var(--text3);
  font-size:11px;
}

.chat-preview-tabs{
  display:flex;
  gap:6px;
  flex-wrap:wrap;
}

.chat-preview-tabs span{
  font-size:10px;
  font-weight:700;
  padding:5px 8px;
  border-radius:999px;
  background:#fff;
  border:1px solid var(--border);
  color:var(--text2);
}

.chat-preview-tabs span.active{
  background:rgba(2,221,2,.10);
  border-color:rgba(2,221,2,.25);
  color:#00B900;
}

.chat-preview-contact{
  display:flex;
  align-items:center;
  gap:9px;
  padding:9px;
  border-radius:12px;
  border:1px solid transparent;
  transition:background .35s var(--silk),border-color .35s var(--silk);
}

.chat-preview-contact.active,
.chat-preview-contact:hover{
  background:#fff;
  border-color:var(--border);
}

.chat-avatar{
  width:34px;
  height:34px;
  border-radius:50%;
  background:linear-gradient(135deg,var(--sky),var(--green));
  color:#fff;
  font-size:11px;
  font-weight:800;
  display:flex;
  align-items:center;
  justify-content:center;
  flex-shrink:0;
  box-shadow:0 8px 18px rgba(0,135,255,.16);
}

.chat-avatar.large{
  width:38px;
  height:38px;
}

.chat-contact-info{
  flex:1;
  min-width:0;
}

.chat-contact-info strong{
  display:block;
  font-size:12px;
  color:var(--text);
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}

.chat-contact-info span{
  display:block;
  font-size:10px;
  color:var(--text3);
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}

.chat-preview-contact small{
  font-size:9px;
  color:var(--text3);
}

.chat-preview-window{
  min-width:0;
  display:flex;
  flex-direction:column;
  background:
    radial-gradient(circle at 20% 20%, rgba(0,135,255,.05), transparent 28%),
    radial-gradient(circle at 80% 0%, rgba(2,221,2,.07), transparent 26%),
    #FDFEFF;
}

.chat-preview-header{
  display:flex;
  align-items:center;
  gap:10px;
  padding:14px 16px;
  border-bottom:1px solid var(--border);
  background:rgba(255,255,255,.82);
}

.chat-preview-status{
  margin-left:auto;
  font-size:10px;
  font-weight:700;
  color:#00B900;
  background:rgba(2,221,2,.10);
  border:1px solid rgba(2,221,2,.20);
  padding:4px 9px;
  border-radius:999px;
}

.chat-preview-body{
  flex:1;
  padding:16px;
  display:flex;
  flex-direction:column;
  gap:10px;
  justify-content:flex-end;
  background-image:
    linear-gradient(45deg, rgba(0,135,255,.025) 25%, transparent 25%),
    linear-gradient(-45deg, rgba(2,221,2,.025) 25%, transparent 25%);
  background-size:42px 42px;
}

.chat-message{
  max-width:78%;
  padding:10px 12px 16px;
  border-radius:14px;
  font-size:12px;
  line-height:1.45;
  position:relative;
  box-shadow:0 8px 22px rgba(16,32,51,.06);
}

.chat-message span{
  position:absolute;
  right:10px;
  bottom:4px;
  font-size:8px;
  color:var(--text3);
}

.chat-message.incoming{
  align-self:flex-start;
  background:#fff;
  border:1px solid var(--border);
  color:var(--text);
  border-bottom-left-radius:5px;
}

.chat-message.outgoing{
  align-self:flex-end;
  background:linear-gradient(135deg,rgba(2,221,2,.16),rgba(0,135,255,.12));
  border:1px solid rgba(2,221,2,.20);
  color:var(--text);
  border-bottom-right-radius:5px;
}

.chat-preview-composer{
  padding:12px;
  display:flex;
  align-items:center;
  gap:10px;
  border-top:1px solid var(--border);
  background:#fff;
}

.chat-preview-composer span{
  flex:1;
  background:#F6FAFF;
  border:1px solid var(--border);
  border-radius:999px;
  padding:9px 12px;
  color:var(--text3);
  font-size:11px;
}

.chat-preview-composer button{
  border:0;
  border-radius:999px;
  background:linear-gradient(135deg,var(--sky),var(--green));
  color:#fff;
  font-weight:800;
  font-size:11px;
  padding:9px 14px;
  font-family:'DM Sans',sans-serif;
}

@media(max-width:900px){
  .chat-preview{
    grid-template-columns:1fr;
  }

  .chat-preview-sidebar{
    border-right:0;
    border-bottom:1px solid var(--border);
  }

  .chat-preview-contact:nth-of-type(n+5){
    display:none;
  }
}

@media(max-width:600px){
  .chat-message{
    max-width:92%;
  }

  .chat-preview-sidebar{
    padding:12px;
  }

  .chat-preview-body{
    padding:12px;
  }
}


/* ==========================================================================
   Ajuste: dois sistemas na seção Recursos
   1 e 2 = Multiatendimento | 3 e 4 = NikiBot IA
   ========================================================================== */
.panel-chat-preview{
  min-height:420px;
  width:100%;
}
.multi-dashboard-mockup{
  background:#f8fbff;
  border:1px solid var(--border);
  border-radius:16px;
  overflow:hidden;
  box-shadow:0 18px 45px rgba(16,32,51,.06);
}
.multi-dashboard-top{
  height:48px;
  background:#fff;
  border-bottom:1px solid var(--border);
  display:flex;
  align-items:center;
  justify-content:space-between;
  padding:0 16px;
}
.multi-brand{
  font-family:'Outfit',sans-serif;
  font-size:14px;
  font-weight:800;
  color:var(--text);
}
.multi-actions{
  display:flex;
  align-items:center;
  gap:10px;
  color:var(--text2);
}
.multi-user{
  width:28px;
  height:28px;
  border-radius:50%;
  display:flex;
  align-items:center;
  justify-content:center;
  background:linear-gradient(135deg,var(--sky),var(--green));
  color:#fff;
  font-size:13px;
  font-weight:800;
  font-family:'Outfit',sans-serif;
}
.multi-dashboard-body{
  display:grid;
  grid-template-columns:165px 1fr;
  min-height:390px;
}
.multi-sidebar-mini{
  background:#fff;
  border-right:1px solid var(--border);
  padding:14px 10px;
  display:flex;
  flex-direction:column;
  gap:5px;
}
.multi-menu-item{
  display:flex;
  align-items:center;
  gap:8px;
  border-radius:9px;
  padding:6px 8px;
  font-size:11px;
  color:var(--text2);
  font-weight:600;
  line-height:1.2;
}
.multi-menu-item svg{
  width:14px;
  height:14px;
  flex:0 0 14px;
  fill:none;
  stroke:currentColor;
  stroke-width:2;
  stroke-linecap:round;
  stroke-linejoin:round;
}
.multi-menu-item.active{
  background:#243248;
  color:#fff;
}
.multi-menu-divider{
  height:1px;
  background:var(--border);
  margin:3px 0;
}
.multi-dashboard-content{
  padding:16px;
}
.multi-dashboard-title{
  font-family:'Outfit',sans-serif;
  font-size:16px;
  font-weight:800;
  color:var(--text);
  margin-bottom:12px;
}
.multi-kpi-grid{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:8px;
  margin-bottom:12px;
}
.multi-kpi{
  background:#fff;
  border:1px solid var(--border);
  border-radius:10px;
  padding:10px;
  min-height:70px;
  display:flex;
  flex-direction:column-reverse;
  align-items:flex-end;
  justify-content:center;
  gap:3px;
}
.multi-kpi span{
  font-size:10px;
  color:var(--text3);
  text-align:right;
}
.multi-kpi strong{
  font-family:'Outfit',sans-serif;
  font-size:18px;
  color:var(--text);
}
.multi-chart-grid{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:10px;
}
.multi-chart-card{
  background:#fff;
  border:1px solid var(--border);
  border-radius:12px;
  padding:14px;
  min-height:170px;
}
.multi-chart-card strong{
  font-size:13px;
  color:var(--text);
}
.multi-area-chart{
  height:110px;
  display:flex;
  align-items:flex-end;
  gap:5px;
  padding-top:22px;
}
.multi-area-chart span{
  flex:1;
  border-radius:4px 4px 0 0;
  background:linear-gradient(180deg,rgba(0,135,255,.75),rgba(0,135,255,.18));
  border-top:2px solid var(--sky);
}
.multi-bars{
  height:110px;
  display:flex;
  align-items:flex-end;
  gap:16px;
  justify-content:center;
  padding-top:22px;
}
.multi-bars span{
  width:46px;
  height:80%;
  border-radius:6px 6px 0 0;
  background:var(--sky);
}
.multi-bars span:nth-child(2){
  background:#33cc70;
}
.automation-flow-mockup{
  background:#fff;
  border:1px solid var(--border);
  border-radius:16px;
  padding:22px;
  box-shadow:0 18px 45px rgba(16,32,51,.06);
}
.automation-header{
  display:flex;
  justify-content:space-between;
  gap:16px;
  align-items:flex-start;
  margin-bottom:18px;
}
.automation-header span{
  display:block;
  font-size:11px;
  text-transform:uppercase;
  letter-spacing:.08em;
  color:var(--sky);
  font-weight:800;
  margin-bottom:5px;
}
.automation-header strong{
  font-family:'Outfit',sans-serif;
  font-size:22px;
  line-height:1.1;
  color:var(--text);
}
.automation-header em{
  font-style:normal;
  color:var(--green);
  background:rgba(2,221,2,.08);
  border:1px solid rgba(2,221,2,.18);
  padding:6px 10px;
  border-radius:999px;
  font-size:11px;
  font-weight:800;
  white-space:nowrap;
}
.automation-steps{
  display:flex;
  flex-direction:column;
  gap:7px;
}
.automation-step{
  display:flex;
  align-items:center;
  gap:12px;
  background:var(--bg3);
  border:1px solid var(--border);
  border-radius:12px;
  padding:12px;
}
.automation-step span{
  width:30px;
  height:30px;
  border-radius:9px;
  display:flex;
  align-items:center;
  justify-content:center;
  background:linear-gradient(135deg,var(--sky),var(--green));
  color:#fff;
  font-weight:800;
  flex-shrink:0;
}
.automation-step strong{
  display:block;
  font-size:13px;
  color:var(--text);
}
.automation-step small{
  display:block;
  font-size:11px;
  color:var(--text3);
  margin-top:2px;
}
.automation-step.highlight{
  background:linear-gradient(135deg,rgba(0,135,255,.08),rgba(2,221,2,.08));
  border-color:rgba(2,221,2,.28);
}
.automation-line{
  width:2px;
  height:12px;
  margin-left:27px;
  background:linear-gradient(180deg,var(--sky),var(--green));
  opacity:.45;
}
@media(max-width:900px){
  .multi-dashboard-body{grid-template-columns:1fr}
  .multi-sidebar-mini{display:none}
  .multi-kpi-grid{grid-template-columns:repeat(2,1fr)}
  .multi-chart-grid{grid-template-columns:1fr}
}

/* ==========================================================================
   NikiBot IA Dashboard Mockup
   ========================================================================== */
.niki-dashboard-mockup{
  width:100%;
  min-height:395px;
  display:grid;
  grid-template-columns:145px 1fr;
  background:#fff;
  border:1px solid var(--border);
  border-radius:16px;
  overflow:hidden;
  box-shadow:0 18px 45px rgba(16,32,51,.08);
}
.niki-sidebar-mini{
  background:#fff;
  border-right:1px solid var(--border);
  padding:14px 10px;
}
.niki-brand-row{
  display:flex;
  align-items:center;
  gap:8px;
  margin-bottom:16px;
}
.niki-brand-icon{
  width:26px;
  height:26px;
  border-radius:8px;
  background:#263D6D;
  color:#fff;
  display:flex;
  align-items:center;
  justify-content:center;
  font-size:13px;
  flex-shrink:0;
}
.niki-brand-row strong{
  display:block;
  font-size:9px;
  line-height:1.15;
  color:var(--text);
  white-space:nowrap;
}
.niki-brand-row span{
  display:block;
  font-size:7px;
  color:var(--text3);
  line-height:1.2;
}
.niki-menu-mini{
  display:flex;
  flex-direction:column;
  gap:3px;
}
.niki-menu-label{
  margin-top:6px;
  font-size:7px;
  color:var(--text3);
  text-transform:uppercase;
  letter-spacing:.06em;
}
.niki-menu-item{
  font-size:8px;
  color:var(--text2);
  padding:5px 7px;
  border-radius:7px;
  display:flex;
  align-items:center;
  gap:4px;
  white-space:nowrap;
}
.niki-menu-item.active{
  background:#263D6D;
  color:#fff;
  font-weight:700;
}
.niki-dashboard-main{
  background:#F7F9FC;
  padding:12px;
  min-width:0;
}
.niki-topbar{
  display:flex;
  justify-content:space-between;
  align-items:center;
  margin-bottom:10px;
}
.niki-assistant-select{
  background:#fff;
  border:1px solid var(--border);
  color:var(--text2);
  border-radius:8px;
  padding:5px 9px;
  font-size:8px;
  font-weight:700;
}
.niki-topbar button{
  border:none;
  background:#263D6D;
  color:#fff;
  border-radius:8px;
  padding:6px 10px;
  font-size:8px;
  font-weight:700;
  font-family:'DM Sans',sans-serif;
}
.niki-header-mini{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  margin-bottom:8px;
}
.niki-header-mini h4{
  font-family:'Outfit',sans-serif;
  font-size:16px;
  margin:0;
  color:var(--text);
}
.niki-header-mini span{
  display:block;
  font-size:9px;
  color:var(--text2);
}
.niki-assistant-card{
  display:flex;
  align-items:center;
  gap:8px;
  background:#fff;
  border:1px solid var(--border);
  border-radius:10px;
  padding:9px 10px;
  margin-bottom:10px;
}
.niki-bot-dot{
  width:28px;
  height:28px;
  border-radius:9px;
  background:#F0F3F8;
  display:flex;
  align-items:center;
  justify-content:center;
  font-size:12px;
  flex-shrink:0;
}
.niki-assistant-card strong{
  display:block;
  font-size:9px;
  color:var(--text);
  line-height:1.2;
}
.niki-assistant-card span{
  display:block;
  font-size:8px;
  color:var(--text2);
  line-height:1.25;
}
.niki-assistant-card em{
  margin-left:auto;
  font-style:normal;
  color:var(--green);
  background:rgba(2,221,2,.10);
  border:1px solid rgba(2,221,2,.18);
  border-radius:12px;
  padding:3px 7px;
  font-size:7px;
  font-weight:700;
}
.niki-kpi-grid{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:7px;
  margin-bottom:10px;
}
.niki-kpi-grid div{
  background:#fff;
  border:1px solid var(--border);
  border-radius:10px;
  padding:8px;
}
.niki-kpi-grid span{
  display:block;
  font-size:7px;
  color:var(--text3);
  line-height:1.15;
  margin-bottom:4px;
}
.niki-kpi-grid strong{
  display:block;
  font-family:'Outfit',sans-serif;
  font-size:15px;
  color:var(--text);
}
.niki-activity-card{
  background:#fff;
  border:1px solid var(--border);
  border-radius:12px;
  padding:10px;
  margin-bottom:10px;
}
.niki-card-head{
  display:flex;
  justify-content:space-between;
  align-items:center;
  margin-bottom:8px;
}
.niki-card-head strong{
  font-size:9px;
  color:var(--text);
}
.niki-card-head span{
  font-size:7px;
  color:var(--text3);
}
.niki-bars-chart{
  height:58px;
  display:flex;
  align-items:flex-end;
  gap:6px;
  padding:0 4px;
}
.niki-bars-chart div{
  flex:1;
  min-height:14px;
  background:#D4D4D4;
  border-radius:4px 4px 0 0;
  position:relative;
}
.niki-bars-chart div.highlight{
  background:#69D8E7;
}
.niki-bars-chart span{
  position:absolute;
  top:-14px;
  left:50%;
  transform:translateX(-50%);
  font-size:7px;
  color:var(--text2);
  font-weight:700;
}
.niki-bottom-grid{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:8px;
}
.niki-list-card{
  background:#fff;
  border:1px solid var(--border);
  border-radius:10px;
  padding:9px;
}
.niki-list-card strong{
  display:block;
  font-size:9px;
  color:var(--text);
  margin-bottom:6px;
}
.niki-list-card div{
  display:flex;
  justify-content:space-between;
  align-items:center;
  background:#F8FAFD;
  border-radius:7px;
  padding:5px 6px;
  margin-top:4px;
  font-size:8px;
  color:var(--text2);
}
.niki-list-card em{
  font-style:normal;
  color:var(--text3);
  font-size:7px;
}

@media(max-width:900px){
  .niki-dashboard-mockup{
    grid-template-columns:1fr;
  }
  .niki-sidebar-mini{
    display:none;
  }
  .niki-kpi-grid{
    grid-template-columns:repeat(2,1fr);
  }
  .niki-bottom-grid{
    grid-template-columns:1fr;
  }
}

/* ============================================================================
   Kanban da NikiBot IA - mockup do painel de recursos
   ============================================================================ */
.niki-kanban-mockup{
  display:flex;
  flex-direction:column;
  gap:14px;
  width:100%;
  background:#fff;
  border:1px solid var(--border);
  border-radius:16px;
  padding:18px;
  box-shadow:0 18px 45px rgba(16,32,51,.06);
}
.niki-kanban-mockup .crm-mockup-title{
  font-size:20px;
}
.niki-kanban-mockup .crm-kanban-mini{
  grid-template-columns:repeat(3,minmax(0,1fr));
}
.niki-kanban-mockup .crm-lead-card{
  min-height:102px;
}
@media(max-width:900px){
  .niki-kanban-mockup .crm-kanban-mini{grid-template-columns:1fr}
}


/* ==========================================================================
   Recursos por sistema — Cards clicáveis premium
   ========================================================================== */
.resource-product-list{
  gap:22px;
}

.resource-product-group{
  display:flex;
  flex-direction:column;
  gap:14px;
}

.resource-product-label{
  display:flex;
  align-items:flex-end;
  justify-content:space-between;
  gap:16px;
  padding:0 4px 2px;
}

.resource-product-label span{
  font-family:'Outfit',sans-serif;
  font-size:13px;
  font-weight:800;
  letter-spacing:.12em;
  text-transform:uppercase;
  color:var(--sky);
}

.resource-product-label small{
  font-size:12px;
  color:var(--text3);
  font-weight:500;
  text-align:right;
}

.resource-product-group + .resource-product-group{
  margin-top:8px;
  padding-top:22px;
  border-top:1px solid rgba(184,215,242,.65);
}

.resource-product-list .sticky-card{
  display:grid;
  grid-template-columns:52px 1fr;
  gap:18px;
  padding:24px;
  min-height:unset;
  cursor:pointer;
  border-color:rgba(184,215,242,.85);
  background:rgba(255,255,255,.86) !important;
}

.resource-product-list .sticky-card:hover{
  transform:translateY(-4px);
  border-color:rgba(0,135,255,.45) !important;
  box-shadow:0 22px 55px rgba(0,135,255,.10);
}

.resource-product-list .sticky-card.active{
  border-color:rgba(0,135,255,.70) !important;
  background:linear-gradient(135deg,rgba(0,135,255,.08),rgba(2,221,2,.05)) !important;
  box-shadow:0 24px 70px rgba(0,135,255,.14);
}

.resource-product-list .sticky-card.active::before{
  opacity:1;
  width:4px;
  background:linear-gradient(180deg,var(--sky),var(--green));
}

.resource-product-list .sticky-card-icon{
  margin-bottom:0;
}

.resource-card-content h3{
  margin-bottom:8px;
}

.resource-card-content p{
  max-width:560px;
}

.resource-active-indicator{
  display:none;
  align-items:center;
  gap:8px;
  margin-top:16px;
  font-size:12px;
  font-weight:800;
  color:#00B900;
  letter-spacing:.01em;
}

.sticky-card.active .resource-active-indicator{
  display:inline-flex;
}

.panel-view.switching{
  display:flex;
  opacity:0;
  transform:scale(.985) translateY(6px);
}

.panel-view.active{
  animation:feature-panel-in .32s var(--silk) forwards;
}

@keyframes feature-panel-in{
  from{opacity:0;transform:scale(.985) translateY(6px)}
  to{opacity:1;transform:scale(1) translateY(0)}
}

@media(max-width:900px){
  .resource-product-label{
    align-items:flex-start;
    flex-direction:column;
    gap:2px;
  }

  .resource-product-label small{
    text-align:left;
  }

  .resource-product-list .sticky-card{
    grid-template-columns:44px 1fr;
    gap:14px;
    padding:22px;
  }
}

/* ============================================================================
   Plataforma WhatsCompany — Demonstração Multiatendimento x NikiBot IA
   ============================================================================ */
.platform-demo-card{
  margin-top:48px;
  background:rgba(255,255,255,.92);
  border:1px solid var(--border);
  border-radius:22px;
  overflow:hidden;
  box-shadow:0 28px 80px rgba(16,32,51,.08);
}
.platform-demo-topbar{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:24px;
  padding:22px 26px;
  border-bottom:1px solid var(--border);
  background:linear-gradient(180deg,#FFFFFF 0%,#F5FAFF 100%);
}
.platform-demo-label{
  font-size:11px;
  font-weight:800;
  letter-spacing:.12em;
  text-transform:uppercase;
  color:var(--sky);
  margin-bottom:6px;
}
.platform-demo-topbar h3{
  font-family:'Outfit',sans-serif;
  font-size:22px;
  line-height:1.15;
  color:var(--text);
}
.platform-demo-tabs{
  display:flex;
  gap:8px;
  flex-shrink:0;
  background:#EEF6FF;
  border:1px solid var(--border);
  border-radius:16px;
  padding:6px;
}
.platform-demo-tab{
  border:0;
  background:transparent;
  color:var(--text2);
  font-family:'DM Sans',sans-serif;
  font-size:13px;
  font-weight:700;
  padding:10px 16px;
  border-radius:12px;
  cursor:pointer;
  transition:background .25s var(--silk),color .25s var(--silk),box-shadow .25s var(--silk),transform .25s var(--silk);
}
.platform-demo-tab:hover{
  color:var(--sky);
  transform:translateY(-1px);
}
.platform-demo-tab.active{
  background:linear-gradient(135deg,var(--sky),var(--green));
  color:#fff;
  box-shadow:0 12px 28px rgba(0,135,255,.18);
}
.platform-demo-view{
  display:none;
  grid-template-columns:1.25fr .75fr;
  gap:28px;
  padding:28px;
  opacity:0;
  transform:translateY(8px) scale(.99);
}
.platform-demo-view.active{
  display:grid;
  opacity:1;
  transform:translateY(0) scale(1);
  animation:platformDemoIn .32s var(--silk) both;
}
@keyframes platformDemoIn{
  from{opacity:0;transform:translateY(10px) scale(.985)}
  to{opacity:1;transform:translateY(0) scale(1)}
}
.platform-whatsapp-shell{
  background:linear-gradient(180deg,#F7FBFF,#FFFFFF);
  border:1px solid var(--border);
  border-radius:20px;
  overflow:hidden;
  min-height:430px;
  display:flex;
  flex-direction:column;
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.75);
}
.platform-phone-header{
  display:flex;
  align-items:center;
  justify-content:space-between;
  padding:18px 20px;
  border-bottom:1px solid var(--border);
  background:#FFFFFF;
}
.platform-phone-user{
  display:flex;
  align-items:center;
  gap:12px;
}
.platform-avatar{
  width:42px;
  height:42px;
  border-radius:50%;
  display:flex;
  align-items:center;
  justify-content:center;
  font-size:13px;
  font-weight:800;
  color:#fff;
  background:linear-gradient(135deg,var(--sky),var(--green));
}
.platform-avatar.ai{
  background:linear-gradient(135deg,#7C5CFF,var(--sky),var(--green));
}
.platform-phone-user strong{
  display:block;
  font-family:'Outfit',sans-serif;
  font-size:17px;
  color:var(--text);
  line-height:1.15;
}
.platform-phone-user span{
  display:block;
  font-size:12px;
  color:var(--text3);
  margin-top:2px;
}
.platform-online{
  font-size:12px;
  font-weight:700;
  color:#16B916;
  background:rgba(2,221,2,.10);
  border:1px solid rgba(2,221,2,.22);
  border-radius:999px;
  padding:6px 12px;
}
.platform-chat-body{
  flex:1;
  padding:22px;
  display:flex;
  flex-direction:column;
  gap:14px;
  background:
    radial-gradient(circle at 20% 15%,rgba(0,135,255,.06),transparent 30%),
    radial-gradient(circle at 85% 70%,rgba(2,221,2,.08),transparent 32%),
    #F8FCFF;
}
.platform-message{
  width:fit-content;
  max-width:74%;
  border:1px solid var(--border);
  border-radius:16px;
  padding:12px 14px 18px;
  font-size:14px;
  line-height:1.45;
  color:var(--text);
  position:relative;
  box-shadow:0 10px 25px rgba(16,32,51,.05);
}
.platform-message span{
  position:absolute;
  right:12px;
  bottom:4px;
  font-size:10px;
  color:var(--text3);
}
.platform-message.incoming{
  background:#FFFFFF;
  align-self:flex-start;
}
.platform-message.outgoing{
  background:linear-gradient(135deg,#EFFFF0,#EAF6FF);
  border-color:rgba(2,221,2,.22);
  align-self:flex-end;
}
.platform-message.ai-msg{
  background:linear-gradient(135deg,#F1F5FF,#EFFFF5);
  border-color:rgba(0,135,255,.18);
}
.platform-agent-note{
  align-self:center;
  font-size:11px;
  font-weight:700;
  color:var(--text3);
  background:#FFFFFF;
  border:1px dashed var(--border2);
  border-radius:999px;
  padding:6px 12px;
}
.platform-agent-note.success{
  color:#10A810;
  background:rgba(2,221,2,.08);
  border-color:rgba(2,221,2,.22);
}
.platform-composer{
  display:flex;
  align-items:center;
  gap:12px;
  padding:16px 18px;
  border-top:1px solid var(--border);
  background:#FFFFFF;
}
.platform-composer span{
  flex:1;
  border:1px solid var(--border);
  background:#F8FBFF;
  color:var(--text3);
  border-radius:999px;
  padding:12px 16px;
  font-size:13px;
}
.platform-composer button{
  border:0;
  border-radius:999px;
  background:linear-gradient(135deg,var(--sky),var(--green));
  color:#fff;
  padding:12px 18px;
  font-weight:800;
  font-family:'DM Sans',sans-serif;
}
.platform-composer.disabled span{
  background:#F1F8FF;
}
.platform-demo-info{
  align-self:stretch;
  background:linear-gradient(180deg,#FFFFFF,#F7FBFF);
  border:1px solid var(--border);
  border-radius:20px;
  padding:26px;
  display:flex;
  flex-direction:column;
  justify-content:center;
}
.platform-info-badge{
  display:inline-flex;
  width:max-content;
  color:var(--sky);
  background:rgba(0,135,255,.08);
  border:1px solid rgba(0,135,255,.16);
  border-radius:999px;
  font-size:11px;
  font-weight:800;
  letter-spacing:.06em;
  text-transform:uppercase;
  padding:6px 12px;
  margin-bottom:18px;
}
.platform-info-badge.ai{
  color:#12B812;
  background:rgba(2,221,2,.08);
  border-color:rgba(2,221,2,.18);
}
.platform-demo-info h4{
  font-family:'Outfit',sans-serif;
  font-size:30px;
  line-height:1.05;
  margin-bottom:14px;
  color:var(--text);
  letter-spacing:-.03em;
}
.platform-demo-info p{
  color:var(--text2);
  font-size:15px;
  line-height:1.7;
  margin-bottom:22px;
}
.platform-benefits{
  display:flex;
  flex-direction:column;
  gap:10px;
}
.platform-benefits div{
  display:flex;
  align-items:flex-start;
  gap:10px;
  color:var(--text2);
  font-size:14px;
  font-weight:600;
}
.platform-benefits strong{
  color:var(--green);
  font-weight:900;
}
@media(max-width:900px){
  .platform-demo-topbar{
    flex-direction:column;
    align-items:flex-start;
  }
  .platform-demo-tabs{
    width:100%;
  }
  .platform-demo-tab{
    flex:1;
  }
  .platform-demo-view.active{
    grid-template-columns:1fr;
  }
  .platform-demo-info h4{
    font-size:24px;
  }
}
@media(max-width:600px){
  .platform-demo-view{
    padding:18px;
  }
  .platform-demo-topbar{
    padding:18px;
  }
  .platform-message{
    max-width:90%;
  }
  .platform-phone-header{
    align-items:flex-start;
    gap:12px;
  }
  .platform-online{
    white-space:nowrap;
  }
}


/* ==========================================================================
   Ajuste: demonstração da plataforma mais horizontal e responsiva
   ========================================================================== */
.dashboard-inner{
  max-width:1120px;
}

.platform-demo-card{
  width:100%;
  margin-left:auto;
  margin-right:auto;
}

.platform-demo-topbar{
  align-items:center;
  padding:20px 24px;
}

.platform-demo-topbar h3{
  max-width:620px;
}

.platform-demo-view{
  grid-template-columns:minmax(0, 1.8fr) minmax(260px, .75fr);
  gap:22px;
  padding:24px;
  align-items:stretch;
}

.platform-whatsapp-shell{
  min-height:360px;
}

.platform-phone-header{
  padding:14px 18px;
}

.platform-chat-body{
  padding:18px;
  gap:10px;
}

.platform-message{
  max-width:70%;
  padding:10px 13px 16px;
  font-size:13px;
  line-height:1.38;
  border-radius:14px;
}

.platform-agent-note{
  padding:5px 11px;
  font-size:10px;
}

.platform-composer{
  padding:12px 16px;
}

.platform-composer span,
.platform-composer button{
  padding-top:10px;
  padding-bottom:10px;
}

.platform-demo-info{
  padding:22px;
}

.platform-demo-info h4{
  font-size:26px;
}

.platform-demo-info p{
  font-size:14px;
  line-height:1.62;
  margin-bottom:18px;
}

.platform-benefits{
  gap:8px;
}

.platform-benefits div{
  font-size:13px;
}

.platform-avatar{
  width:42px;
  height:42px;
  min-width:42px;
  flex:0 0 42px;
  aspect-ratio:1/1;
  border-radius:50%;
  line-height:1;
}

input,
select,
textarea,
button{
  font-size:16px;
}

@media(max-width:1100px){
  .dashboard-inner{
    max-width:calc(100vw - 48px);
  }

  .platform-demo-view{
    grid-template-columns:minmax(0, 1.55fr) minmax(240px, .8fr);
    gap:18px;
  }

  .platform-demo-info h4{
    font-size:24px;
  }
}

@media(max-width:900px){
  .dashboard-inner{
    max-width:100%;
  }

  .platform-demo-card{
    border-radius:20px;
  }

  .platform-demo-view.active{
    grid-template-columns:1fr;
  }

  .platform-whatsapp-shell{
    min-height:auto;
  }

  .platform-demo-info{
    padding:20px;
  }
}

@media(max-width:600px){
  .platform-demo-card{
    margin-top:32px;
  }

  .platform-demo-topbar{
    padding:18px;
  }

  .platform-demo-topbar h3{
    font-size:24px;
  }

  .platform-demo-tabs{
    border-radius:18px;
  }

  .platform-demo-tab{
    min-height:46px;
    font-size:16px;
  }

  .platform-demo-view{
    padding:16px;
  }

  .platform-phone-header{
    align-items:center;
    flex-direction:row;
  }

  .platform-phone-user{
    min-width:0;
  }

  .platform-phone-user strong,
  .platform-phone-user span{
    overflow-wrap:anywhere;
  }

  .platform-avatar{
    width:40px;
    height:40px;
    min-width:40px;
    flex-basis:40px;
  }

  .platform-message{
    max-width:88%;
    font-size:16px;
  }
}

/* ==========================================================================
   WHATS COMPANY - PROGRAMA DE AFILIADOS
   ========================================================================== */
.affiliate-section{
  position:relative;
  overflow:hidden;
  padding:100px max(48px, calc((100vw - var(--max-w)) / 2));
  background:linear-gradient(180deg,#FFFFFF 0%,#F6FAFF 100%);
  border-top:1px solid var(--border);
}
.affiliate-bg-glow{
  position:absolute;
  inset:auto -120px 20% auto;
  width:420px;
  height:420px;
  border-radius:50%;
  background:radial-gradient(circle,rgba(2,221,2,.12) 0%,rgba(0,135,255,.08) 38%,transparent 72%);
  pointer-events:none;
}
.affiliate-header{
  text-align:center;
  max-width:760px;
  margin:0 auto 56px;
  position:relative;
  z-index:1;
}
.affiliate-grid{
  display:grid;
  grid-template-columns:minmax(340px,.78fr) minmax(620px,1.22fr);
  gap:34px;
  align-items:start;
  position:relative;
  z-index:1;
}
.affiliate-content{
  display:grid;
  grid-template-columns:1fr;
  gap:18px;
}
.affiliate-card-main,
.affiliate-form,
.affiliate-preview{
  background:rgba(255,255,255,.9);
  border:1px solid var(--border);
  border-radius:22px;
  box-shadow:0 24px 70px rgba(16,32,51,.08);
}
.affiliate-card-main{
  padding:34px;
}
.affiliate-icon{
  width:54px;
  height:54px;
  border-radius:16px;
  display:flex;
  align-items:center;
  justify-content:center;
  background:linear-gradient(135deg,var(--sky),var(--green));
  box-shadow:0 14px 30px rgba(0,135,255,.18);
  margin-bottom:20px;
}
.affiliate-icon svg{
  width:24px;
  height:24px;
  fill:none;
  stroke:#fff;
  stroke-width:2;
  stroke-linecap:round;
  stroke-linejoin:round;
}
.affiliate-card-main h3{
  font-family:'Outfit',sans-serif;
  font-size:clamp(26px,3vw,30px);
  line-height:1.04;
  letter-spacing:-.035em;
  color:var(--text);
  margin-bottom:16px;
}
.affiliate-card-main p{
  color:var(--text2);
  font-size:16px;
  line-height:1.75;
  max-width:640px;
}
.affiliate-highlight-row{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:10px;
  margin:26px 0;
}
.affiliate-highlight-row div{
  background:linear-gradient(180deg,#F6FAFF,#FFFFFF);
  border:1px solid var(--border);
  border-radius:16px;
  padding:16px;
}
.affiliate-highlight-row strong{
  display:block;
  font-family:'Outfit',sans-serif;
  font-size:28px;
  font-weight:800;
  color:var(--sky);
  line-height:1;
  margin-bottom:6px;
}
.affiliate-highlight-row span{
  font-size:12px;
  color:var(--text2);
  font-weight:700;
  text-transform:uppercase;
  letter-spacing:.06em;
}
.affiliate-list{
  list-style:none;
  display:flex;
  flex-direction:column;
  gap:12px;
}
.affiliate-list li{
  display:flex;
  gap:10px;
  color:var(--text2);
  font-size:15px;
  line-height:1.55;
}
.affiliate-list li span{
  color:var(--green);
  font-weight:900;
  flex-shrink:0;
}
.affiliate-form{
  padding:28px;
}
.affiliate-form-head{
  margin-bottom:20px;
}
.affiliate-form-head span{
  display:block;
  font-family:'Outfit',sans-serif;
  font-size:22px;
  font-weight:800;
  color:var(--text);
  margin-bottom:4px;
}
.affiliate-form-head small,
.affiliate-form-note{
  color:var(--text3);
  font-size:13px;
}
.affiliate-form-grid{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:14px;
}
.affiliate-form label{
  display:flex;
  flex-direction:column;
  gap:7px;
  color:var(--text);
  font-size:13px;
  font-weight:700;
}
.affiliate-form-full{
  grid-column:1/-1;
}
.affiliate-form input,
.affiliate-form select{
  width:100%;
  min-height:50px;
  border:1px solid var(--border2);
  border-radius:12px;
  background:#FFFFFF;
  color:var(--text);
  font-family:'DM Sans',sans-serif;
  font-size:16px;
  outline:none;
  padding:0 15px;
  transition:border-color .25s ease,box-shadow .25s ease;
}
.affiliate-form input::placeholder{color:#7C8FA3}
.affiliate-form select{
  appearance:auto;
}
.affiliate-form input:focus,
.affiliate-form select:focus{
  border-color:var(--sky);
  box-shadow:0 0 0 4px rgba(0,135,255,.10);
}
.affiliate-submit{
  width:100%;
  min-height:54px;
  margin-top:18px;
  border:0;
  border-radius:14px;
  background:linear-gradient(135deg,var(--sky),var(--green));
  color:#fff;
  font-family:'DM Sans',sans-serif;
  font-size:16px;
  font-weight:800;
  cursor:pointer;
  box-shadow:0 18px 36px rgba(0,135,255,.18);
  transition:transform .25s ease,box-shadow .25s ease;
}
.affiliate-submit:hover{
  transform:translateY(-2px);
  box-shadow:0 22px 45px rgba(0,135,255,.24);
}
.affiliate-form-note{
  margin-top:12px;
  text-align:center;
}
.affiliate-preview{
  overflow:hidden;
  position:sticky;
  top:calc(36px + var(--nav-h) + 26px);
}
.affiliate-browser-bar{
  min-height:50px;
  background:linear-gradient(180deg,#F4FAFF,#EAF5FF);
  border-bottom:1px solid var(--border);
  display:flex;
  align-items:center;
  gap:12px;
  padding:0 18px;
}
.affiliate-browser-bar > span{
  color:var(--text2);
  font-size:12px;
  font-weight:700;
  letter-spacing:.02em;
}
.affiliate-browser-bar small{
  margin-left:auto;
  color:var(--green);
  font-size:11px;
  font-weight:800;
}
.affiliate-dashboard{
  background:#F3F6FA;
  padding:18px;
  display:grid;
  grid-template-columns:190px minmax(0,1fr);
  min-height:570px;
}
.affiliate-dash-sidebar{
  background:#FFFFFF;
  border:1px solid var(--border);
  border-radius:18px 0 0 18px;
  padding:22px 18px;
}
.affiliate-dash-logo{
  font-family:Arial,sans-serif;
  font-size:18px;
  font-weight:900;
  margin-bottom:28px;
}
.affiliate-dash-logo b{color:var(--sky)}
.affiliate-dash-logo span{color:var(--green)}
.affiliate-dash-menu{
  display:flex;
  flex-direction:column;
  gap:10px;
}
.affiliate-dash-menu span{
  padding:10px 12px;
  border-radius:10px;
  color:var(--text2);
  font-size:12px;
  font-weight:700;
}
.affiliate-dash-menu span.active{
  background:#26364D;
  color:#fff;
}
.affiliate-dash-main{
  background:#F7F9FC;
  border:1px solid var(--border);
  border-left:0;
  border-radius:0 18px 18px 0;
  padding:22px;
  min-width:0;
}
.affiliate-dash-top{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:14px;
  background:#FFFFFF;
  border:1px solid var(--border);
  border-radius:14px;
  padding:16px;
  margin-bottom:12px;
}
.affiliate-dash-top small{
  color:var(--sky);
  font-weight:800;
  letter-spacing:.08em;
  text-transform:uppercase;
  font-size:10px;
}
.affiliate-dash-top h3{
  font-family:'Outfit',sans-serif;
  font-size:20px;
  line-height:1.1;
  margin-top:4px;
}
.affiliate-dash-top button{
  border:0;
  border-radius:10px;
  padding:10px 14px;
  background:var(--sky);
  color:#fff;
  font-size:12px;
  font-weight:800;
  white-space:nowrap;
}
.affiliate-kpis{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:10px;
  margin-bottom:12px;
}
.affiliate-kpis div,
.affiliate-table-card,
.affiliate-code-card{
  background:#FFFFFF;
  border:1px solid var(--border);
  border-radius:14px;
  padding:14px;
}
.affiliate-kpis span,
.affiliate-code-card span{
  display:block;
  color:var(--text3);
  font-size:10px;
  text-transform:uppercase;
  letter-spacing:.06em;
  font-weight:800;
  margin-bottom:6px;
}
.affiliate-kpis strong{
  display:block;
  font-family:'Outfit',sans-serif;
  font-size:20px;
  color:var(--text);
}
.affiliate-dashboard-grid{
  display:grid;
  grid-template-columns:1.6fr .9fr;
  gap:12px;
}
.affiliate-card-title{
  font-family:'Outfit',sans-serif;
  font-weight:800;
  margin-bottom:12px;
}
.affiliate-table-row{
  display:grid;
  grid-template-columns:1.3fr .8fr .8fr;
  gap:8px;
  padding:9px 0;
  border-top:1px solid #EEF3F8;
  color:var(--text2);
  font-size:11px;
}
.affiliate-table-row.head{
  border-top:0;
  color:var(--text3);
  font-weight:800;
  text-transform:uppercase;
  letter-spacing:.05em;
}
.affiliate-table-row .ok{color:var(--green);font-weight:800}
.affiliate-table-row .wait{color:#F0A030;font-weight:800}
.affiliate-code-card strong{
  display:block;
  background:#F4FAFF;
  border:1px dashed var(--border2);
  border-radius:10px;
  padding:12px;
  color:var(--sky);
  font-family:'Outfit',sans-serif;
  font-size:22px;
  letter-spacing:.08em;
  margin-bottom:8px;
}
.affiliate-code-card small{
  color:var(--text3);
  font-size:11px;
  line-height:1.4;
}
.affiliate-mini-chart{
  display:flex;
  align-items:flex-end;
  gap:7px;
  height:84px;
  margin-top:16px;
  padding-top:10px;
  border-top:1px solid #EEF3F8;
}
.affiliate-mini-chart i{
  flex:1;
  border-radius:6px 6px 0 0;
  background:linear-gradient(180deg,var(--sky),rgba(0,135,255,.25));
}
.affiliate-mini-chart i:nth-child(even){background:linear-gradient(180deg,var(--green),rgba(2,221,2,.22))}


.affiliate-cta-box{
  background:linear-gradient(135deg,rgba(0,135,255,.08),rgba(2,221,2,.08));
  border:1px solid var(--border);
  border-radius:22px;
  padding:24px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:18px;
  box-shadow:0 18px 44px rgba(16,32,51,.07);
}
.affiliate-cta-box strong{
  display:block;
  font-family:'Outfit',sans-serif;
  font-size:20px;
  font-weight:800;
  color:var(--text);
  margin-bottom:4px;
}
.affiliate-cta-box span{
  display:block;
  color:var(--text2);
  font-size:14px;
  line-height:1.55;
}
.affiliate-open-modal{
  border:0;
  border-radius:14px;
  min-height:52px;
  padding:0 22px;
  background:linear-gradient(135deg,var(--sky),var(--green));
  color:#fff;
  font-family:'DM Sans',sans-serif;
  font-size:15px;
  font-weight:800;
  cursor:pointer;
  white-space:nowrap;
  box-shadow:0 16px 34px rgba(0,135,255,.20);
  transition:transform .25s ease,box-shadow .25s ease;
}
.affiliate-open-modal:hover{
  transform:translateY(-2px);
  box-shadow:0 22px 42px rgba(0,135,255,.26);
}
.affiliate-modal{
  position:fixed;
  inset:0;
  z-index:999;
  display:none;
  align-items:center;
  justify-content:center;
  padding:24px;
}
.affiliate-modal.open{display:flex}
.affiliate-modal-backdrop{
  position:absolute;
  inset:0;
  background:rgba(16,32,51,.55);
  backdrop-filter:blur(10px);
}
.affiliate-modal-box{
  position:relative;
  width:min(820px,100%);
  max-height:calc(100vh - 48px);
  overflow:auto;
  background:#fff;
  border:1px solid var(--border);
  border-radius:24px;
  box-shadow:0 34px 90px rgba(16,32,51,.24);
}
.affiliate-modal-close{
  position:absolute;
  top:18px;
  right:18px;
  width:40px;
  height:40px;
  border:1px solid var(--border);
  border-radius:12px;
  background:#fff;
  color:var(--text2);
  font-size:28px;
  line-height:1;
  cursor:pointer;
  z-index:2;
}
.affiliate-modal-close:hover{border-color:var(--sky);color:var(--sky)}
.affiliate-modal-form{
  border:0;
  box-shadow:none;
  border-radius:24px;
  padding:36px;
}

@media(max-width:1100px){
  .affiliate-grid{grid-template-columns:1fr}
  .affiliate-preview{position:relative;top:auto}
}
@media(max-width:700px){
  .affiliate-section{padding:70px 24px}
  .affiliate-card-main,.affiliate-form{padding:24px}
  .affiliate-cta-box{flex-direction:column;align-items:flex-start;padding:22px}
  .affiliate-open-modal{width:100%}
  .affiliate-modal{padding:14px}
  .affiliate-modal-form{padding:28px 20px 22px}
  .affiliate-highlight-row{grid-template-columns:1fr}
  .affiliate-form-grid{grid-template-columns:1fr}
  .affiliate-dashboard{grid-template-columns:1fr;padding:14px;min-height:auto}
  .affiliate-dash-sidebar{
    border-radius:16px 16px 0 0;
    border-bottom:0;
  }
  .affiliate-dash-menu{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:8px;
  }
  .affiliate-dash-main{
    border-left:1px solid var(--border);
    border-radius:0 0 16px 16px;
  }
  .affiliate-dash-top{align-items:flex-start;flex-direction:column}
  .affiliate-kpis,.affiliate-dashboard-grid{grid-template-columns:1fr}
}


/* ============================================================================
   Revenda White Label WhatsCompany
   ============================================================================ */
.reseller-section{
  position:relative;
  padding:100px max(48px, calc((100vw - var(--max-w)) / 2));
  overflow:hidden;
  background:linear-gradient(135deg,#FFFFFF 0%,#F6FAFF 50%,#ECFFF0 100%);
  border-top:1px solid var(--border);
}
.reseller-bg-glow{
  position:absolute;
  right:-220px;
  bottom:-260px;
  width:620px;
  height:620px;
  background:radial-gradient(circle,rgba(2,221,2,.16) 0%,rgba(0,135,255,.08) 38%,transparent 70%);
  pointer-events:none;
}
.reseller-header{
  max-width:760px;
  margin:0 auto 54px;
  text-align:center;
  position:relative;
  z-index:1;
}
.reseller-grid{
  position:relative;
  z-index:1;
  display:grid;
  grid-template-columns:minmax(0,.92fr) minmax(0,1.08fr);
  gap:42px;
  align-items:start;
}
.reseller-content{
  display:flex;
  flex-direction:column;
  gap:22px;
}
.reseller-card-main,
.reseller-preview,
.reseller-cta-box{
  background:rgba(255,255,255,.88);
  border:1px solid var(--border);
  border-radius:24px;
  box-shadow:0 24px 70px rgba(16,32,51,.08);
}
.reseller-card-main{
  padding:34px;
}
.reseller-icon{
  width:64px;
  height:64px;
  border-radius:18px;
  display:flex;
  align-items:center;
  justify-content:center;
  background:linear-gradient(135deg,rgba(0,135,255,.10),rgba(2,221,2,.16));
  border:1px solid var(--border2);
  margin-bottom:18px;
  box-shadow:0 16px 34px rgba(0,135,255,.10);
}
.reseller-icon svg{
  width:32px;
  height:32px;
  fill:none;
  stroke:var(--sky);
  stroke-width:1.8;
  stroke-linecap:round;
  stroke-linejoin:round;
}
.reseller-tag-premium{
  display:inline-flex;
  align-items:center;
  gap:8px;
  padding:6px 12px;
  border-radius:999px;
  background:rgba(0,135,255,.08);
  border:1px solid rgba(0,135,255,.16);
  color:var(--sky);
  font-size:11px;
  font-weight:900;
  text-transform:uppercase;
  letter-spacing:.08em;
  margin-bottom:14px;
}
.reseller-card-main h3{
  font-family:'Outfit',sans-serif;
  font-size:clamp(30px,3.4vw,30px);
  line-height:1.04;
  letter-spacing:-.04em;
  margin-bottom:18px;
  color:var(--text);
}
.reseller-card-main p{
  color:var(--text2);
  font-size:16px;
  line-height:1.75;
  margin-bottom:20px;
}
.reseller-profit-box{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:18px;
  padding:22px;
  border-radius:18px;
  background:linear-gradient(135deg,#263BFF 0%,var(--sky) 38%,var(--green) 100%);
  color:#fff;
  box-shadow:0 22px 50px rgba(0,135,255,.22);
  margin-bottom:18px;
  position:relative;
  overflow:hidden;
}
.reseller-profit-box::after{
  content:'';
  position:absolute;
  right:-60px;
  bottom:-80px;
  width:220px;
  height:220px;
  background:rgba(255,255,255,.16);
  border-radius:50%;
}
.reseller-profit-box span,
.reseller-profit-box small{
  display:block;
  position:relative;
  z-index:1;
}
.reseller-profit-box span{
  font-size:12px;
  text-transform:uppercase;
  letter-spacing:.08em;
  font-weight:800;
  opacity:.88;
}
.reseller-profit-box strong{
  position:relative;
  z-index:1;
  display:block;
  font-family:'Outfit',sans-serif;
  font-size:24px;
  line-height:1.1;
  margin:6px 0;
}
.reseller-profit-box small{font-size:13px;opacity:.92;line-height:1.45}
.reseller-profit-icon{
  position:relative;
  z-index:1;
  font-size:42px;
  line-height:1;
  filter:drop-shadow(0 10px 20px rgba(0,0,0,.12));
}
.reseller-feature-grid{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:12px;
  margin-bottom:22px;
}
.reseller-feature-grid div{
  display:flex;
  align-items:center;
  gap:12px;
  padding:14px;
  border:1px solid var(--border);
  border-radius:14px;
  background:linear-gradient(180deg,#FFFFFF,#F8FCFF);
  color:var(--text2);
  font-size:13px;
  font-weight:700;
  line-height:1.4;
}
.reseller-feature-grid svg{
  width:24px;
  height:24px;
  flex:0 0 24px;
  fill:none;
  stroke:var(--green);
  stroke-width:2;
  stroke-linecap:round;
  stroke-linejoin:round;
}
.reseller-list{
  list-style:none;
  display:flex;
  flex-direction:column;
  gap:12px;
  color:var(--text2);
}
.reseller-list li{
  display:flex;
  gap:10px;
  align-items:flex-start;
  font-size:15px;
  line-height:1.55;
}
.reseller-list li span{
  color:var(--green);
  font-weight:900;
}
.reseller-cta-box{
  width:100%;
  max-width:100%;
  padding:26px;
  display:grid;
  grid-template-columns:auto 1fr auto;
  align-items:center;
  gap:20px;
  background:linear-gradient(135deg,rgba(0,135,255,.08),rgba(2,221,2,.10));
}
.reseller-cta-icon{
  width:58px;
  height:58px;
  border-radius:18px;
  display:flex;
  align-items:center;
  justify-content:center;
  background:linear-gradient(135deg,var(--sky),var(--green));
  color:#fff;
  font-size:28px;
  box-shadow:0 18px 34px rgba(0,135,255,.18);
}
.reseller-cta-box strong{
  display:block;
  font-family:'Outfit',sans-serif;
  font-size:22px;
  line-height:1.15;
  margin-bottom:4px;
}
.reseller-cta-box span{
  color:var(--text2);
  font-size:14px;
  line-height:1.55;
}
.reseller-open-modal,
.reseller-submit{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  border:0;
  border-radius:12px;
  min-height:56px;
  padding:0 32px;
  background:linear-gradient(135deg,var(--sky),var(--green));
  color:#fff;
  font-family:'DM Sans',sans-serif;
  font-size:15px;
  font-weight:700;
  text-decoration:none;
  cursor:pointer;
  white-space:nowrap;
  box-shadow:0 18px 38px rgba(0,135,255,.22);
  transition:transform .25s ease,box-shadow .25s ease,filter .25s ease;
}
.reseller-open-modal:hover,
.reseller-submit:hover{
 transform:translateY(-2px);
 filter:brightness(1.03);
}
.reseller-open-modal:hover,
.reseller-submit:hover{
  transform:translateY(-2px);
  box-shadow:0 24px 48px rgba(0,135,255,.28);
}
.reseller-preview{
  overflow:hidden;
  position:sticky;
  top:calc(36px + var(--nav-h) + 26px);
}
.reseller-browser-bar{
  min-height:54px;
  background:linear-gradient(180deg,#F4FAFF,#EAF5FF);
  border-bottom:1px solid var(--border);
  display:flex;
  align-items:center;
  gap:12px;
  padding:0 18px;
}
.reseller-browser-bar > span{
  color:var(--text2);
  font-size:12px;
  font-weight:800;
}
.reseller-browser-bar small{
  margin-left:auto;
  color:var(--sky);
  background:#EAF5FF;
  border:1px solid var(--border2);
  border-radius:999px;
  padding:4px 9px;
  font-size:10px;
  font-weight:900;
  text-transform:uppercase;
}
.reseller-dashboard{
  background:#F3F6FA;
  padding:18px;
  display:grid;
  grid-template-columns:176px minmax(0,1fr);
  min-height:590px;
}
.reseller-dash-sidebar{
  background:#FFFFFF;
  border:1px solid var(--border);
  border-radius:18px 0 0 18px;
  padding:22px 16px;
}
.reseller-dash-logo{
  font-family:Arial,sans-serif;
  font-size:18px;
  font-weight:900;
  margin-bottom:26px;
}
.reseller-dash-logo b{color:var(--sky)}
.reseller-dash-logo span{color:var(--green)}
.reseller-dash-menu{
  display:flex;
  flex-direction:column;
  gap:8px;
}
.reseller-dash-menu span{
  padding:10px 11px;
  border-radius:10px;
  color:var(--text2);
  font-size:12px;
  font-weight:800;
}
.reseller-dash-menu span.active{
  background:#26364D;
  color:#fff;
}
.reseller-dash-main{
  background:#F7F9FC;
  border:1px solid var(--border);
  border-left:0;
  border-radius:0 18px 18px 0;
  padding:20px;
  min-width:0;
}
.reseller-dash-top{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:14px;
  background:#FFFFFF;
  border:1px solid var(--border);
  border-radius:14px;
  padding:14px 16px;
  margin-bottom:12px;
}
.reseller-dash-top small{
  color:var(--sky);
  font-weight:900;
  letter-spacing:.08em;
  text-transform:uppercase;
  font-size:10px;
}
.reseller-dash-top h3{
  font-family:'Outfit',sans-serif;
  font-size:20px;
  line-height:1.1;
  margin-top:4px;
}
.reseller-brand-chip{
  border:1px dashed var(--border2);
  background:#F4FAFF;
  border-radius:999px;
  padding:8px 12px;
  color:var(--sky);
  font-size:11px;
  font-weight:900;
  white-space:nowrap;
}
.reseller-kpis{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:10px;
  margin-bottom:12px;
}
.reseller-kpis div,
.reseller-chart-card,
.reseller-client-card,
.reseller-systems-card{
  background:#FFFFFF;
  border:1px solid var(--border);
  border-radius:14px;
  padding:14px;
}
.reseller-kpis span{
  display:block;
  color:var(--text3);
  font-size:10px;
  text-transform:uppercase;
  letter-spacing:.06em;
  font-weight:900;
  margin-bottom:6px;
}
.reseller-kpis strong{
  display:block;
  font-family:'Outfit',sans-serif;
  font-size:20px;
  color:var(--text);
}
.reseller-kpis small{
  color:var(--green);
  font-size:10px;
  font-weight:800;
}
.reseller-dashboard-grid{
  display:grid;
  grid-template-columns:1.45fr .9fr;
  gap:12px;
  margin-bottom:12px;
}
.reseller-card-title{
  font-family:'Outfit',sans-serif;
  font-weight:900;
  margin-bottom:12px;
}
.reseller-chart-line{
  height:170px;
  padding:10px 4px 0;
  border-top:1px solid #EEF3F8;
}
.reseller-chart-line svg{width:100%;height:100%}
.reseller-client-row{
  display:flex;
  justify-content:space-between;
  gap:10px;
  padding:10px 0;
  border-top:1px solid #EEF3F8;
  color:var(--text2);
  font-size:12px;
}
.reseller-client-row:first-of-type{border-top:0}
.reseller-client-row strong{color:var(--text);white-space:nowrap}
.reseller-system-list{
  display:grid;
  grid-template-columns:repeat(5,1fr);
  gap:10px;
}
.reseller-system-list span{
  min-height:54px;
  display:flex;
  align-items:center;
  justify-content:center;
  text-align:center;
  padding:8px;
  border:1px solid var(--border);
  border-radius:12px;
  background:#F8FCFF;
  color:var(--text2);
  font-size:11px;
  font-weight:800;
}
.reseller-system-list span:last-child{
  border-style:dashed;
  color:var(--sky);
  background:#FFFFFF;
}
.reseller-modal{
  position:fixed;
  inset:0;
  z-index:999;
  display:none;
  align-items:center;
  justify-content:center;
  padding:24px;
}
.reseller-modal.open{display:flex}
.reseller-modal-backdrop{
  position:absolute;
  inset:0;
  background:rgba(16,32,51,.55);
  backdrop-filter:blur(10px);
}
.reseller-modal-box{
  position:relative;
  width:min(920px,100%);
  max-height:calc(100vh - 48px);
  overflow:auto;
  background:#fff;
  border:1px solid var(--border);
  border-radius:24px;
  box-shadow:0 34px 90px rgba(16,32,51,.24);
}
.reseller-modal-close{
  position:absolute;
  top:18px;
  right:18px;
  width:40px;
  height:40px;
  border:1px solid var(--border);
  border-radius:12px;
  background:#fff;
  color:var(--text2);
  font-size:28px;
  line-height:1;
  cursor:pointer;
  z-index:2;
}
.reseller-modal-close:hover{border-color:var(--sky);color:var(--sky)}
.reseller-form{
  padding:38px;
}
.reseller-form-head{margin-bottom:24px;padding-right:44px}
.reseller-form-head span{
  display:block;
  font-family:'Outfit',sans-serif;
  font-size:24px;
  font-weight:900;
  color:var(--text);
  margin-bottom:6px;
}
.reseller-form-head small,
.reseller-form-note{
  color:var(--text3);
  font-size:13px;
}
.reseller-form-grid{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:16px;
}
.reseller-form label{
  display:flex;
  flex-direction:column;
  gap:8px;
  font-size:13px;
  font-weight:800;
  color:var(--text);
}
.reseller-form-full{grid-column:1/-1}
.reseller-form input,
.reseller-form select{
  width:100%;
  min-height:54px;
  border:1px solid var(--border2);
  border-radius:12px;
  background:#fff;
  color:var(--text);
  font-family:'DM Sans',sans-serif;
  font-size:16px;
  outline:none;
  padding:0 15px;
  transition:border-color .25s ease,box-shadow .25s ease;
}
.reseller-form input::placeholder{color:#7C8FA3}
.reseller-form input:focus,
.reseller-form select:focus{
  border-color:var(--sky);
  box-shadow:0 0 0 4px rgba(0,135,255,.10);
}
.reseller-submit{
  width:100%;
  margin-top:18px;
}
.reseller-form-note{
  margin-top:12px;
  text-align:center;
}
body.reseller-modal-open{
  overflow:hidden;
  touch-action:none;
}
@media(max-width:1100px){
  .reseller-grid{grid-template-columns:1fr;}
  .reseller-preview{position:relative;top:auto;}
}
@media(max-width:768px){
  .reseller-section{padding:70px 24px;}
  .reseller-card-main{padding:26px;}
  .reseller-feature-grid{grid-template-columns:1fr;}
  .reseller-cta-box{grid-template-columns:1fr;align-items:start;}
  .reseller-open-modal{width:100%;}
  .reseller-dashboard{grid-template-columns:1fr;padding:14px;min-height:auto;}
  .reseller-dash-sidebar{border-radius:16px 16px 0 0;}
  .reseller-dash-main{border-left:1px solid var(--border);border-top:0;border-radius:0 0 16px 16px;}
  .reseller-kpis,.reseller-dashboard-grid,.reseller-system-list,.reseller-form-grid{grid-template-columns:1fr;}
  .reseller-form{padding:30px 20px;}
  .reseller-modal{padding:14px;}
}

/* ==========================================================================
   Ajuste pontual: CTAs de Afiliados e Revenda em 100% da seção
   ========================================================================== */
.affiliate-grid,
.reseller-grid{
  align-items:start;
}

.affiliate-cta-box,
.reseller-cta-box{
  grid-column:1 / -1;
  width:100%;
  max-width:100%;
  box-sizing:border-box;
}

.affiliate-cta-box{
  display:grid;
  grid-template-columns:1fr auto;
  align-items:center;
  gap:24px;
  padding:30px;
}

.reseller-cta-box{
  display:grid;
  grid-template-columns:auto 1fr auto;
  align-items:center;
  gap:24px;
  border:1px solid var(--border);
  border-radius:24px;
  box-shadow:0 18px 44px rgba(16,32,51,.07);
}

@media(max-width:900px){
  .affiliate-cta-box,
  .reseller-cta-box{
    grid-template-columns:1fr;
    text-align:left;
    gap:18px;
    padding:24px;
  }

  .affiliate-open-modal,
  .reseller-open-modal{
    width:100%;
    justify-content:center;
    text-align:center;
  }
}


/* Ajustes de validação e DDI nos modais de Afiliado e Revenda */
.affiliate-form label.has-error input,
.affiliate-form label.has-error select,
.affiliate-form label.has-error .form-phone-row,
.reseller-form label.has-error input,
.reseller-form label.has-error select,
.reseller-form label.has-error .form-phone-row{
  border-color:var(--red) !important;
  box-shadow:0 0 0 4px rgba(232,90,90,.10) !important;
}



.form-phone-row{
  width:100%;
  display:grid;
  grid-template-columns:130px minmax(220px,1fr);
  gap:10px;
  align-items:center;
}

.affiliate-form .form-phone-row select,
.reseller-form .form-phone-row select,
.affiliate-form .form-phone-row input,
.reseller-form .form-phone-row input{
  min-width:0;
}

@media(max-width:600px){
  .form-phone-row{
    grid-template-columns:1fr;
  }
}

/* ==========================================================================
   Ajuste final: validação visual dos modais Afiliado e Revenda no mesmo padrão dos planos
   ========================================================================== */
.affiliate-form label.has-error input,
.affiliate-form label.has-error select,
.affiliate-form label.has-error .password-wrap,
.reseller-form label.has-error input,
.reseller-form label.has-error select,
.reseller-form label.has-error .password-wrap{
  border-color:var(--red) !important;
  box-shadow:0 0 0 4px rgba(232,90,90,.10) !important;
}

.affiliate-form label.has-error .form-phone-row input,
.affiliate-form label.has-error .form-phone-row select,
.reseller-form label.has-error .form-phone-row input,
.reseller-form label.has-error .form-phone-row select{
  border-color:var(--red) !important;
  box-shadow:0 0 0 4px rgba(232,90,90,.10) !important;
}

.affiliate-form .form-error,
.reseller-form .form-error{
  display:none;
}
.affiliate-form label.has-error .form-error,
.reseller-form label.has-error .form-error{
  display:inline-flex;
}

.simple-form-alert{
  display:none;
  width:100%;
  min-height:0;
  margin-top:12px;
  padding:13px 15px;
  border-radius:14px;
  border:1px solid rgba(232,90,90,.18);
  background:linear-gradient(135deg,rgba(232,90,90,.10),rgba(255,255,255,.92));
  color:#C93434;
  font-size:13px;
  font-weight:800;
  line-height:1.35;
  box-shadow:0 12px 28px rgba(232,90,90,.10);
}

.simple-form-alert.is-visible{
  display:flex;
  align-items:center;
  gap:10px;
}

.simple-form-alert.is-visible::before{
  content:'!';
  width:26px;
  height:26px;
  border-radius:50%;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  flex:0 0 26px;
  background:linear-gradient(135deg,#FF6B6B,var(--red));
  color:#fff;
  font-size:15px;
  font-weight:900;
  line-height:1;
  box-shadow:0 8px 18px rgba(232,90,90,.18);
}

.simple-form-alert.success{
  border-color:rgba(2,221,2,.22);
  background:linear-gradient(135deg,rgba(2,221,2,.12),rgba(255,255,255,.92));
  color:#009C00;
  box-shadow:0 12px 28px rgba(2,221,2,.10);
}

.simple-form-alert.success.is-visible::before{
  content:'✓';
  background:linear-gradient(135deg,var(--green),#00B900);
  box-shadow:0 8px 18px rgba(2,221,2,.18);
}


/* ============================================================================
   Etiquetas nos contatos do mockup de Multiatendimento
   ============================================================================ */
.chat-tags{
  display:flex;
  align-items:center;
  gap:3px;
  margin-top:2px;
  margin-bottom:2px;
  flex-wrap:nowrap;
}

.chat-tag{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  height:14px;
  padding:0 5px;
  border-radius:4px;
  font-size:7px;
  font-weight:700;
  line-height:1;
  color:#fff;
  letter-spacing:.2px;
  white-space:nowrap;
  box-shadow:none;
}

.chat-tag-negociando{
  background:#22c55e;
}

.chat-tag-multi{
  background:#0ea5e9;
}

.chat-tag-ia{
  background:#8b5cf6;
}

.chat-preview-contact .chat-contact-info{
  min-width:0;
}

.chat-preview-contact .chat-contact-info > span{
  display:block;
}

@media(max-width:600px){
  .chat-tags{
    gap:3px;
    margin:2px 0 2px;
  }

  .chat-tag{
    font-size:7px;
    padding:3px 6px;
    border-radius:6px;
  }
}



.chat-tag{
    color:#FFFFFF !important;
}

.chat-preview-contact{
    border:1px solid #D6E6F5;
    border-radius:18px;
}

/* Etiquetas abaixo da mensagem */
.chat-preview-contact .chat-tags{
    order:3;
    margin-top:4px;
}


/* ============================================================================
   Ajuste fino das etiquetas dos contatos no mockup de chat
   ============================================================================ */
.chat-preview-contact{
  border:1px solid #D6E6F5;
  border-radius:18px;
}

.chat-contact-info > span{
  display:block;
  line-height:1.25;
  margin-bottom:5px;
}

.chat-tags{
  display:flex;
  align-items:center;
  gap:4px;
  margin-top:0;
  margin-bottom:0;
  flex-wrap:nowrap;
  min-height:16px;
}

.chat-tag{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  height:16px;
  min-height:16px;
  padding:0 6px 1px;
  border-radius:5px;
  font-size:8px;
  font-weight:800;
  line-height:16px;
  color:#FFFFFF !important;
  letter-spacing:.1px;
  white-space:nowrap;
  box-shadow:none;
}

.chat-tag-negociando{
  background:#22c55e;
}

.chat-tag-multi{
  background:#0ea5e9;
}

.chat-tag-ia{
  background:#8b5cf6;
}

/* ============================================================================
   Meta Business Partner - selo em ícone no hero
   ============================================================================ */
.hero-partner{
  display:flex;
  align-items:center;
  gap:12px;
  flex-wrap:wrap;
}

.meta-partner-badge{
  display:inline-flex;
  align-items:center;
  gap:8px;
  min-height:40px;
  padding:5px 12px;
  border:1px solid var(--border2);
  border-radius:999px;
  background:rgba(255,255,255,.90);
  box-shadow:0 8px 20px rgba(16,32,51,.06);
  backdrop-filter:blur(10px);
}

.meta-partner-icon{
  width:34px;
  height:24px;
  display:flex;
  align-items:center;
  justify-content:center;
  flex-shrink:0;
}

.meta-partner-icon img{
  width:38px;
  height:auto;
  display:block;
}

.meta-partner-text{
  display:flex;
  flex-direction:column;
  justify-content:center;
  line-height:1;
  color:var(--text);
}

.meta-partner-text strong{
  font-size:12px;
  font-weight:700;
  letter-spacing:-0.02em;
  margin:0;
}

.meta-partner-text small{
  font-size:7px;
  font-weight:700;
  color:var(--text3);
  letter-spacing:.06em;
  text-transform:uppercase;
  margin-top:2px;
}

@media(max-width:600px){

  .hero-partner{
    gap:8px;
  }

  .meta-partner-badge{
    max-width:210px;
    width:100%;
    padding:5px 10px;
  }

  .meta-partner-icon{
    width:30px;
    height:22px;
  }

  .meta-partner-icon img{
    width:26px;
  }

  .meta-partner-text strong{
    font-size:11px;
  }

  .meta-partner-text small{
    font-size:6px;
  }
}


/* ============================================================================
   Dados oficiais da empresa + rodapé + modais legais
   ============================================================================ */
.company-info-section{
  padding:80px max(48px, calc((100vw - var(--max-w)) / 2));
  background:linear-gradient(180deg,#FFFFFF 0%,#F6FAFF 100%);
  border-top:1px solid var(--border);
}

.company-info-inner{
  max-width:1050px;
  margin:0 auto;
}

.company-info-head{
  text-align:center;
  max-width:720px;
  margin:0 auto 42px;
}

.company-info-grid{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:16px;
}

.company-info-card{
  background:rgba(255,255,255,.92);
  border:1px solid var(--border);
  border-radius:18px;
  padding:22px;
  box-shadow:0 18px 45px rgba(16,32,51,.06);
  display:flex;
  align-items:flex-start;
  gap:14px;
}

.company-info-main,
.company-info-finance{
  grid-column:span 2;
}

.company-info-icon{
  width:42px;
  height:42px;
  border-radius:12px;
  background:rgba(0,135,255,.08);
  border:1px solid rgba(0,135,255,.14);
  display:flex;
  align-items:center;
  justify-content:center;
  flex-shrink:0;
}

.company-info-icon svg{
  width:20px;
  height:20px;
  fill:none;
  stroke:var(--sky);
  stroke-width:1.9;
  stroke-linecap:round;
  stroke-linejoin:round;
}

.company-info-card h3{
  font-family:'Outfit',sans-serif;
  font-size:17px;
  line-height:1.2;
  color:var(--text);
  margin-bottom:8px;
}

.company-info-card p{
  font-size:14px;
  line-height:1.6;
  color:var(--text2);
  margin:0;
}

.company-info-card a{
  color:var(--sky);
  text-decoration:none;
  font-weight:700;
}

.company-info-card a:hover{
  text-decoration:underline;
}

.site-footer{
  padding:24px max(48px, calc((100vw - var(--max-w)) / 2));
  border-top:1px solid var(--border);
  display:flex;
  align-items:center;
  justify-content:space-between;
  flex-wrap:wrap;
  gap:12px;
  background:#FFFFFF;
}

.footer-copy{
  font-size:13px;
  color:var(--text3);
}

.footer-actions{
  display:flex;
  align-items:center;
  gap:18px;
  flex-wrap:wrap;
}

.footer-modal-open{
  background:none;
  border:none;
  padding:0;
  cursor:pointer;
  font-family:'DM Sans',sans-serif;
}

.legal-modal{
  position:fixed;
  inset:0;
  z-index:9999;
  display:none;
  align-items:center;
  justify-content:center;
  padding:24px;
}

.legal-modal.open{
  display:flex;
}

.legal-modal-overlay{
  position:absolute;
  inset:0;
  background:rgba(16,32,51,.58);
  backdrop-filter:blur(10px);
}

.legal-modal-box{
  position:relative;
  z-index:1;
  width:min(760px,100%);
  max-height:86vh;
  overflow:auto;
  background:#FFFFFF;
  border:1px solid var(--border);
  border-radius:24px;
  padding:34px;
  box-shadow:0 30px 90px rgba(16,32,51,.22);
}

.legal-modal-close{
  position:absolute;
  top:18px;
  right:18px;
  width:42px;
  height:42px;
  border:1px solid var(--border2);
  border-radius:14px;
  background:#FFFFFF;
  color:var(--text2);
  font-size:30px;
  line-height:1;
  cursor:pointer;
  display:flex;
  align-items:center;
  justify-content:center;
}

.legal-modal-close:hover{
  color:var(--sky);
  border-color:var(--sky);
}

.legal-modal-box h2{
  font-family:'Outfit',sans-serif;
  font-size:clamp(28px,4vw,30px);
  line-height:1.08;
  color:var(--text);
  margin:8px 52px 22px 0;
}

.legal-modal-content{
  display:flex;
  flex-direction:column;
  gap:14px;
}

.legal-modal-content p{
  font-size:15px;
  line-height:1.7;
  color:var(--text2);
}

.legal-modal-content a{
  color:var(--sky);
  font-weight:700;
  text-decoration:none;
}

.legal-modal-content a:hover{
  text-decoration:underline;
}

@media(max-width:900px){
  .company-info-section{
    padding:60px 24px;
  }

  .company-info-grid{
    grid-template-columns:1fr;
  }

  .company-info-main,
  .company-info-finance{
    grid-column:auto;
  }

  .site-footer{
    padding-left:24px;
    padding-right:24px;
    justify-content:center;
    text-align:center;
  }

  .footer-actions{
    justify-content:center;
  }
}

@media(max-width:600px){
  .company-info-card{
    flex-direction:column;
    padding:20px;
  }

  .legal-modal{
    padding:14px;
  }

  .legal-modal-box{
    padding:26px 20px;
    border-radius:20px;
  }

  .legal-modal-close{
    top:14px;
    right:14px;
    width:38px;
    height:38px;
  }
}

/* Correção final: modais legais sem deslocar a página */
html.legal-modal-open,
body.legal-modal-open{
  overflow:hidden;
}

.legal-modal{
  overscroll-behavior:contain;
}

.legal-modal-box{
  overscroll-behavior:contain;
}

.whatsapp-float{
  position:fixed;
  right:24px;
  bottom:24px;
  z-index:999;
  display:flex;
  align-items:center;
  gap:10px;
  padding:10px 16px 10px 10px;
  border-radius:999px;
  background:linear-gradient(135deg,#0087FF,#02DD02);
  color:#fff;
  text-decoration:none;
  box-shadow:0 18px 45px rgba(0,135,255,.28);
  transition:transform .35s ease, box-shadow .35s ease;
}

.whatsapp-float:hover{
  transform:translateY(-3px);
  box-shadow:0 24px 60px rgba(2,221,2,.28);
}

.whatsapp-float-icon{
  width:42px;
  height:42px;
  border-radius:50%;
  background:rgba(255,255,255,.18);
  display:flex;
  align-items:center;
  justify-content:center;
  flex-shrink:0;
}

.whatsapp-float-icon svg{
  width:24px;
  height:24px;
  fill:#fff;
}

.whatsapp-float-text{
  display:flex;
  flex-direction:column;
  line-height:1.05;
}

.whatsapp-float-text strong{
  font-size:14px;
  font-weight:800;
}

.whatsapp-float-text small{
  font-size:11px;
  font-weight:600;
  opacity:.86;
}

@media(max-width:600px){
  .whatsapp-float{
    right:16px;
    bottom:16px;
    padding:10px;
  }

  .whatsapp-float-text{
    display:none;
  }

  .whatsapp-float-icon{
    width:48px;
    height:48px;
  }
}

/* FAQ visual refresh - final overrides */
.faq-section .faq-item.open{
  background:#FFFFFF !important;
  border-color:rgba(0,135,255,.48) !important;
  box-shadow:0 26px 70px rgba(0,135,255,.16) !important;
}
@media(max-width:900px){
  .faq-head{align-items:flex-start}
  .faq-subtitle{text-align:left}
}
@media(max-width:600px){
  .faq-head{gap:14px}
  .faq-toggle-all{width:100%;justify-content:center}
  .faq-q{padding:18px 18px}
  .faq-q-main{gap:10px}
  .faq-q-icon{width:30px;height:30px;flex-basis:30px;border-radius:10px}
  .faq-a{padding-left:18px;padding-right:18px}
  .faq-item.open .faq-a{padding-top:14px}
}


/* ============================================================================
   Sobre nós - visual institucional
   ============================================================================ */
.about-section{
  padding:100px max(48px, calc((100vw - var(--max-w)) / 2));
  background:
    radial-gradient(circle at 90% 10%,rgba(2,221,2,.06),transparent 34%),
    radial-gradient(circle at 10% 0%,rgba(0,135,255,.06),transparent 36%),
    var(--bg2);
  border-top:1px solid var(--border);
  position:relative;
  overflow:hidden;
}

.about-section::before{
  content:'';
  position:absolute;
  inset:0;
  background-image:
    repeating-linear-gradient(45deg,transparent 0,transparent 139px,rgba(0,135,255,.08) 139px,rgba(0,135,255,.08) 140px),
    repeating-linear-gradient(-45deg,transparent 0,transparent 139px,rgba(2,221,2,.06) 139px,rgba(2,221,2,.06) 140px);
  -webkit-mask-image:radial-gradient(ellipse 95% 90% at 0% 0%,#000 0%,transparent 68%);
  mask-image:radial-gradient(ellipse 95% 90% at 0% 0%,#000 0%,transparent 68%);
  pointer-events:none;
}

.about-inner{
  position:relative;
  z-index:1;
  max-width:1100px;
  margin:0 auto;
}

.about-hero{
  display:grid;
  grid-template-columns:1fr 220px;
  gap:28px;
  align-items:end;
  margin-bottom:34px;
}

.about-hero .section-title{
  max-width:850px;
  margin-bottom:14px;
}

.about-lead{
  color:var(--text2);
  font-size:17px;
  line-height:1.75;
  max-width:760px;
}

.about-year-card{
  background:linear-gradient(135deg,rgba(0,135,255,.08),rgba(2,221,2,.08));
  border:1px solid var(--border);
  border-radius:24px;
  padding:24px;
  box-shadow:0 18px 45px rgba(16,32,51,.07);
}

.about-year-card span,
.about-year-card small{
  display:block;
  color:var(--text3);
  font-size:12px;
  font-weight:700;
  letter-spacing:.08em;
  text-transform:uppercase;
}

.about-year-card strong{
  display:block;
  font-family:'Outfit',sans-serif;
  font-size:56px;
  line-height:.95;
  letter-spacing:-.05em;
  color:var(--sky);
  margin:8px 0;
}

.about-grid{
  display:grid;
  grid-template-columns:1.35fr .85fr;
  gap:18px;
  align-items:stretch;
}

.about-story-card,
.about-mini-card,
.about-mvv-card,
.about-value-card{
  background:rgba(255,255,255,.90);
  border:1px solid var(--border);
  box-shadow:0 18px 45px rgba(16,32,51,.06);
}

.about-story-card{
  border-radius:28px;
  padding:34px;
  position:relative;
  overflow:hidden;
}

.about-story-card::after{
  content:'';
  position:absolute;
  right:-80px;
  bottom:-90px;
  width:240px;
  height:240px;
  background:radial-gradient(circle,rgba(2,221,2,.11),transparent 70%);
  pointer-events:none;
}

.about-card-icon{
  width:54px;
  height:54px;
  border-radius:16px;
  background:linear-gradient(135deg,var(--sky),var(--green));
  display:flex;
  align-items:center;
  justify-content:center;
  margin-bottom:20px;
  box-shadow:0 16px 34px rgba(0,135,255,.18);
}

.about-card-icon svg{
  width:25px;
  height:25px;
  fill:none;
  stroke:#fff;
  stroke-width:2;
  stroke-linecap:round;
  stroke-linejoin:round;
}

.about-story-card h3,
.about-mini-card h3,
.about-mvv-card h3{
  font-family:'Outfit',sans-serif;
  color:var(--text);
  letter-spacing:-.03em;
}

.about-story-card h3{
  font-size:27px;
  line-height:1.12;
  margin-bottom:16px;
}

.about-story-card p{
  color:var(--text2);
  font-size:15.5px;
  line-height:1.82;
  margin-bottom:15px;
  position:relative;
  z-index:1;
}

.about-story-card p:last-child{
  margin-bottom:0;
}

.about-side-cards{
  display:grid;
  gap:14px;
}

.about-mini-card{
  border-radius:22px;
  padding:24px;
  transition:transform .5s var(--silk),border-color .5s var(--silk);
}

.about-mini-card:hover{
  transform:translateY(-3px);
  border-color:var(--border2);
}

.about-mini-number{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:34px;
  height:34px;
  border-radius:12px;
  background:rgba(0,135,255,.09);
  color:var(--sky);
  font-family:'Outfit',sans-serif;
  font-size:13px;
  font-weight:800;
  margin-bottom:14px;
}

.about-mini-card h3{
  font-size:18px;
  margin-bottom:8px;
}

.about-mini-card p{
  color:var(--text2);
  font-size:14px;
  line-height:1.65;
}

.about-mvv{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:18px;
  margin-top:18px;
}

.about-mvv-card{
  border-radius:24px;
  padding:28px;
  display:grid;
  grid-template-columns:52px 1fr;
  column-gap:16px;
  align-items:start;
}

.about-mvv-icon{
  width:52px;
  height:52px;
  border-radius:16px;
  background:rgba(0,135,255,.08);
  border:1px solid rgba(0,135,255,.14);
  display:flex;
  align-items:center;
  justify-content:center;
  font-size:25px;
}

.about-mvv-card h3{
  font-size:22px;
  margin-bottom:8px;
}

.about-mvv-card p{
  color:var(--text2);
  font-size:14.5px;
  line-height:1.7;
}

.about-values{
  margin-top:18px;
  background:rgba(255,255,255,.82);
  border:1px solid var(--border);
  border-radius:28px;
  padding:30px;
  box-shadow:0 18px 45px rgba(16,32,51,.05);
}

.about-values-head{
  display:flex;
  align-items:end;
  justify-content:space-between;
  gap:20px;
  margin-bottom:18px;
}

.about-values-head h3{
  font-family:'Outfit',sans-serif;
  font-size:25px;
  line-height:1.12;
  letter-spacing:-.03em;
  color:var(--text);
  max-width:520px;
}

.about-values-title{
  font-size:22px !important;
  max-width:none !important;
  margin:0;
}

.about-values-head p{
  font-family:'Outfit',sans-serif;
  font-size:25px;
  line-height:1.12;
  letter-spacing:-.03em;
  color:var(--text);
  font-weight:800;
  max-width:520px;
  margin:0;
  text-align:right;
}

.about-values-grid{
  display:grid;
  grid-template-columns:repeat(5,1fr);
  gap:12px;
}

.about-value-card{
  border-radius:18px;
  padding:20px 16px;
  min-height:190px;
}

.about-value-card span{
  display:block;
  font-size:25px;
  margin-bottom:12px;
}

.about-value-card h4{
  font-family:'Outfit',sans-serif;
  font-size:17px;
  line-height:1.15;
  color:var(--text);
  margin-bottom:8px;
}

.about-value-card p{
  color:var(--text2);
  font-size:13px;
  line-height:1.58;
}

@media(max-width:1050px){
  .about-hero,
  .about-grid,
  .about-mvv{
    grid-template-columns:1fr;
  }

  .about-year-card{
    max-width:260px;
  }

  .about-values-grid{
    grid-template-columns:repeat(2,1fr);
  }
}

@media(max-width:900px){
  .about-section{
    padding:70px 24px;
  }
}

@media(max-width:600px){
  .about-section{
    padding:58px 18px;
  }

  .about-story-card,
  .about-values{
    padding:24px;
    border-radius:22px;
  }

  .about-mvv-card{
    grid-template-columns:1fr;
    gap:14px;
  }

  .about-values-head{
    display:block;
  }

  .about-values-grid{
    grid-template-columns:1fr;
  }

  .about-value-card{
    min-height:auto;
  }
}


/* ============================================================================
   Correção Sobre nós - Missão e Visão
   ============================================================================ */
.about-mvv{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:18px;
  margin-top:18px;
}

.about-mvv-card{
  display:grid;
  grid-template-columns:auto 1fr;
  column-gap:16px;
  align-items:start;
  min-width:0;
  width:100%;
}

.about-mvv-card > *{
  min-width:0;
}

.about-mvv-card h3,
.about-mvv-card p{
  min-width:0;
  max-width:100%;
  overflow-wrap:normal;
  word-break:normal;
  white-space:normal;
}

.about-mvv-card p{
  grid-column:2;
  width:100%;
}

.about-mvv-icon{
  grid-row:1 / span 2;
  flex-shrink:0;
}

@media(max-width:1050px){
  .about-mvv{
    grid-template-columns:1fr;
  }
}

@media(max-width:600px){
  .about-mvv-card{
    grid-template-columns:1fr;
  }

  .about-mvv-card p{
    grid-column:auto;
  }

  .about-mvv-icon{
    grid-row:auto;
  }
}



/* ==========================================================================
   MELHORIA VISUAL DOS PREÇOS DOS PLANOS
   ========================================================================== */

.price-amount{
  display:flex;
  align-items:flex-start;
  gap:4px;
  margin:12px 0 10px;
}

.price-amount sup{
  font-size:28px;
  font-weight:800;
  color:#5B6B81;
  margin-top:10px;
}



.price-amount .price-num{
  font-size:68px;
  line-height:1;
  font-weight:900;
  color:var(--text);
  text-shadow:0 8px 20px rgba(0,0,0,.04);
}

.featured .price-amount .price-num{
  background:linear-gradient(135deg,#0087FF,#02DD02);
  -webkit-background-clip:text;
  -webkit-text-fill-color:transparent;
  background-clip:text;
}

.featured2 .price-amount .price-num{
  background:linear-gradient(135deg,#0087FF,#2F6BFF);
  -webkit-background-clip:text;
  -webkit-text-fill-color:transparent;
  background-clip:text;
}

.price-period{
  font-size:14px;
  font-weight:600;
  margin-top:6px;
}

@media(max-width:768px){
  .price-amount .price-num{
    font-size:56px;
  }

  .price-amount sup{
    font-size:24px;
  }
}

/* ==========================================================================
   Correção mobile: menu por âncoras sem estourar largura da página
   ========================================================================== */
html{
  overflow-x:hidden;
  scroll-padding-top:calc(var(--nav-h) + 18px);
}

body.mobile-menu-lock{
  overflow:hidden;
  max-width:100vw;
}

body,
.ticker,
nav,
.mobile-menu,
section,
footer{
  max-width:100%;
}

img,
svg,
video,
canvas{
  max-width:100%;
}

@media(max-width:900px){
  nav,
  .mobile-menu{
    width:100%;
    max-width:100vw;
  }

  .mobile-menu{
    left:0;
    right:0;
  }
}

/* ============================================================================
   Ajuste pontual: modais de Afiliado e Revenda mais horizontais no desktop
   Evita rolagem vertical em telas com menor altura sem alterar o mobile.
   ============================================================================ */
@media(min-width:901px){
  .affiliate-modal,
  .reseller-modal{
    padding:16px 22px;
  }

  .affiliate-modal-box{
    width:min(1120px,100%);
    max-height:calc(100vh - 32px);
  }

  .reseller-modal-box{
    width:min(1180px,100%);
    max-height:calc(100vh - 32px);
  }

  .affiliate-modal-form,
  .reseller-form{
    padding:26px 32px 22px;
  }

  .affiliate-form-head,
  .reseller-form-head{
    margin-bottom:14px;
  }

  .affiliate-form-head span,
  .reseller-form-head span{
    font-size:22px;
    line-height:1.15;
  }

  .affiliate-form-head small,
  .reseller-form-head small{
    line-height:1.35;
  }

  .affiliate-form-grid,
  .reseller-form-grid{
    grid-template-columns:repeat(12,1fr);
    gap:11px 14px;
  }

  .affiliate-form label,
  .reseller-form label{
    gap:5px;
  }

  .affiliate-form input,
  .affiliate-form select,
  .reseller-form input,
  .reseller-form select{
    min-height:46px;
    font-size:14px;
  }

  .affiliate-form .form-phone-row,
  .reseller-form .form-phone-row{
    grid-template-columns:130px minmax(220px,1fr);
  }

  .affiliate-form-grid > label{
    grid-column:span 6;
  }

  .affiliate-form-grid > label.affiliate-form-full,
  .affiliate-form-grid > label:nth-child(6),
  .affiliate-form-grid > label:nth-child(7){
    grid-column:span 4;
  }

  .reseller-form-grid > label:nth-child(1){grid-column:span 5;}
  .reseller-form-grid > label:nth-child(2){grid-column:span 3;}
  .reseller-form-grid > label:nth-child(3){grid-column:span 4;}
  .reseller-form-grid > label:nth-child(4){grid-column:span 3;}
  .reseller-form-grid > label:nth-child(5){grid-column:span 3;}
  .reseller-form-grid > label.reseller-form-full{grid-column:span 6;}

  .affiliate-submit,
  .reseller-submit{
    min-height:48px;
    margin-top:14px;
    border-radius:12px;
  }

  .affiliate-form-note,
  .reseller-form-note{
    margin-top:8px;
    font-size:12px;
    line-height:1.35;
  }

  .simple-form-alert{
    margin-top:8px;
  }
}

@media(min-width:901px) and (max-height:760px){
  .affiliate-modal-form,
  .reseller-form{
    padding-top:22px;
    padding-bottom:18px;
  }

  .affiliate-form input,
  .affiliate-form select,
  .reseller-form input,
  .reseller-form select{
    min-height:42px;
  }

  .affiliate-submit,
  .reseller-submit{
    min-height:44px;
  }

  .affiliate-form-note,
  .reseller-form-note{
    display:none;
  }
}

/* Ajuste pontual: campo de código de atendimento no modal de revenda */
@media (min-width: 901px){
  .reseller-form-grid > label.reseller-code-field{
    grid-column:span 3;
  }
}

/* ============================================================================
   Ajuste pontual: organização visual dos inputs do modal de Revenda
   ============================================================================ */
@media (min-width:901px){
  .reseller-modal-box{
    width:min(1180px,calc(100vw - 48px));
  }

  .reseller-form-grid > label:nth-child(1){grid-column:span 5;}
  .reseller-form-grid > label:nth-child(2){grid-column:span 3;}
  .reseller-form-grid > label:nth-child(3){grid-column:span 4;}

  .reseller-form-grid > label:nth-child(4){grid-column:span 3;}
  .reseller-form-grid > label:nth-child(5){grid-column:span 3;}
  .reseller-form-grid > label.reseller-code-field{grid-column:span 2;}
  .reseller-form-grid > label.reseller-form-full{grid-column:span 4;}

  .reseller-form .form-phone-row{
    grid-template-columns:118px minmax(170px,1fr);
    gap:8px;
  }
}

@media (min-width:901px) and (max-width:1080px){
  .reseller-form-grid > label:nth-child(4){grid-column:span 4;}
  .reseller-form-grid > label:nth-child(5){grid-column:span 4;}
  .reseller-form-grid > label.reseller-code-field{grid-column:span 4;}
  .reseller-form-grid > label.reseller-form-full{grid-column:span 12;}

  .reseller-form .form-phone-row{
    grid-template-columns:130px minmax(260px,1fr);
  }
}


/* === Opção A - Ecossistema WhatsCompany === */
.ecosystem-hero .hero-sub,.product-hero .hero-sub{max-width:560px}
.ecosystem-panel,.product-showcase-card{background:var(--bg2);border:1px solid var(--border);border-radius:22px;padding:28px;box-shadow:0 24px 70px rgba(0,135,255,.10)}
.ecosystem-panel-head{display:flex;flex-direction:column;gap:4px;margin-bottom:18px}
.ecosystem-panel-head span{font-family:'Outfit',sans-serif;font-size:24px;font-weight:800;color:var(--text)}
.ecosystem-panel-head small{color:var(--text2)}
.ecosystem-mini-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.ecosystem-mini-card{display:flex;flex-direction:column;gap:6px;text-decoration:none;background:var(--bg3);border:1px solid var(--border);border-radius:16px;padding:18px;min-height:130px;transition:transform .4s var(--silk),border-color .4s var(--silk)}
.ecosystem-mini-card:hover{transform:translateY(-3px);border-color:var(--sky)}
.ecosystem-mini-card b{font-family:'Outfit',sans-serif;color:var(--sky);font-size:18px}
.ecosystem-mini-card span{color:var(--text2);font-size:14px;line-height:1.45}
.ecosystem-mini-card.ai b,.product-showcase-card.ai h3{color:var(--green)}
.ecosystem-mini-card.white b,.product-showcase-card.white h3{color:var(--sky3)}
.ecosystem-mini-card.soon{opacity:.78}
.ecosystem-solutions-grid{grid-template-columns:repeat(4,1fr)}
.product-hero{min-height:76vh}.product-showcase-card h3{font-family:'Outfit',sans-serif;font-size:28px;margin-bottom:16px;color:var(--sky)}
.product-showcase-card .solution-list{margin-top:0}.product-showcase-card .solution-list li{font-size:15px}
.product-benefits-section{padding:80px max(48px, calc((100vw - var(--max-w)) / 2));background:var(--bg2);border-top:1px solid var(--border);border-bottom:1px solid var(--border)}
.price-card .price-value{font-family:'Outfit',sans-serif;margin:20px 0}.price-card .price-value span{font-size:20px;color:var(--text2)}.price-card .price-value strong{font-size:48px;color:var(--text)}.price-card .price-value small{font-size:14px;color:var(--text2)}
@media(max-width:1000px){.ecosystem-solutions-grid{grid-template-columns:1fr 1fr}.ecosystem-mini-grid{grid-template-columns:1fr}.product-hero{min-height:auto}}
@media(max-width:720px){.ecosystem-solutions-grid{grid-template-columns:1fr}.ecosystem-panel,.product-showcase-card{padding:20px}.product-hero .hero-btns button,.product-hero .hero-btns a{width:100%;justify-content:center;text-align:center}}

/* Ajuste visual - card principal do ecossistema na index */
.ecosystem-hub{
  position:relative;
  overflow:hidden;
  padding:30px;
  background:
    radial-gradient(circle at 85% 12%, rgba(2,221,2,.12), transparent 34%),
    radial-gradient(circle at 12% 92%, rgba(0,135,255,.14), transparent 36%),
    var(--bg2);
}
.ecosystem-hub::before{
  content:'';
  position:absolute;
  inset:0;
  background-image:
    linear-gradient(90deg, rgba(0,135,255,.045) 1px, transparent 1px),
    linear-gradient(0deg, rgba(2,221,2,.04) 1px, transparent 1px);
  background-size:34px 34px;
  pointer-events:none;
}
.ecosystem-hub > *{position:relative;z-index:1}
.ecosystem-panel-top{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:18px;
  margin-bottom:22px;
}
.ecosystem-kicker{
  display:inline-flex;
  align-items:center;
  gap:6px;
  font-size:11px;
  font-weight:800;
  letter-spacing:.12em;
  text-transform:uppercase;
  color:var(--sky);
  background:rgba(0,135,255,.08);
  border:1px solid rgba(0,135,255,.18);
  border-radius:999px;
  padding:6px 12px;
  margin-bottom:12px;
}
.ecosystem-panel-top h3{
  font-family:'Outfit',sans-serif;
  font-size:28px;
  line-height:1.05;
  color:var(--text);
  letter-spacing:-.03em;
  margin:0 0 8px;
}
.ecosystem-panel-top p{
  color:var(--text2);
  font-size:14px;
  line-height:1.55;
  max-width:430px;
}
.ecosystem-live-badge{
  flex-shrink:0;
  font-size:11px;
  font-weight:800;
  color:var(--green);
  background:rgba(2,221,2,.09);
  border:1px solid rgba(2,221,2,.18);
  border-radius:999px;
  padding:7px 11px;
}
.ecosystem-hub .ecosystem-mini-card{
  position:relative;
  min-height:148px;
  background:rgba(255,255,255,.76);
  border-color:rgba(184,215,242,.85);
  box-shadow:0 14px 34px rgba(16,32,51,.06);
}
.ecosystem-hub .ecosystem-mini-card::after{
  content:'Conhecer';
  position:absolute;
  right:16px;
  bottom:14px;
  font-size:12px;
  font-weight:800;
  color:var(--sky);
  opacity:0;
  transform:translateX(-6px);
  transition:opacity .35s var(--silk),transform .35s var(--silk);
}
.ecosystem-hub .ecosystem-mini-card:hover::after{opacity:1;transform:translateX(0)}
.ecosystem-card-icon{
  width:40px;
  height:40px;
  border-radius:12px;
  display:flex;
  align-items:center;
  justify-content:center;
  background:linear-gradient(135deg,var(--sky),var(--green));
  color:#fff;
  font-size:18px;
  box-shadow:0 12px 24px rgba(0,135,255,.18);
  margin-bottom:4px;
}
.ecosystem-mini-card.soon .ecosystem-card-icon{background:var(--sky4);color:var(--sky)}
.ecosystem-mini-card.ai .ecosystem-card-icon{background:linear-gradient(135deg,#00a3ff,var(--green))}
.ecosystem-mini-card.white .ecosystem-card-icon{background:linear-gradient(135deg,var(--sky3),var(--sky2))}
@media(max-width:720px){
  .ecosystem-panel-top{flex-direction:column}
  .ecosystem-live-badge{align-self:flex-start}
  .ecosystem-panel-top h3{font-size:24px}
  .ecosystem-hub .ecosystem-mini-card{min-height:132px}
}

/* Ajuste Home: selo Meta + prova social no hero */
.ecosystem-hero .hero-partner{
  margin-top:18px;
  align-items:center;
  gap:22px;
}
.ecosystem-hero .hero-trust{
  display:flex;
  align-items:center;
  gap:12px;
}
.ecosystem-hero .hero-trust-text{
  margin-left:10px;
  font-size:13px;
  color:var(--text2);
  line-height:1.4;
}
.ecosystem-hero .hero-trust-text strong{
  color:var(--text);
  font-weight:600;
}
@media(max-width:700px){
  .ecosystem-hero .hero-partner{
    flex-direction:column;
    align-items:flex-start;
    gap:14px;
  }
  .ecosystem-hero .hero-trust-text{
    font-size:13px;
    margin-left:8px;
  }
}


/* BLOCO MULTIATENDIMENTO - OPERAÇÃO */
.multi-operation-section{
  padding:90px max(48px, calc((100vw - var(--max-w)) / 2));
  background:linear-gradient(180deg,#fff 0%,var(--bg) 100%);
  overflow:hidden;
}
.multi-operation-layout{
  display:grid;
  grid-template-columns:minmax(0,1fr) minmax(520px,1fr);
  gap:70px;
  align-items:start;
}
.multi-operation-copy{
  display:flex;
  flex-direction:column;
  gap:28px;
}
.resource-product-label{
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:16px;
  margin:0 0 20px;
  padding:0 6px;
  font-size:12px;
  letter-spacing:.12em;
  text-transform:uppercase;
  color:var(--sky);
  font-weight:800;
}
.resource-product-label small{
  color:var(--text3);
  font-size:12px;
  font-weight:700;
  letter-spacing:0;
  text-transform:none;
}
.resource-product-group{
  display:flex;
  flex-direction:column;
  gap:14px;
}
.resource-product-group .sticky-card{
  display:grid;
  grid-template-columns:54px 1fr;
  gap:18px;
  padding:28px;
  min-height:142px;
}
.resource-product-group .sticky-card-icon{
  margin:0;
}
.resource-card-content h3{
  margin-bottom:8px;
}
.resource-active-indicator{
  display:none;
  margin-top:14px;
  font-size:12px;
  font-weight:800;
  color:var(--green);
}
.sticky-card.active .resource-active-indicator{
  display:block;
}
.multi-operation-visual{
  position:sticky;
  top:calc(36px + var(--nav-h) + 30px);
}
.multi-dashboard-window{
  background:var(--bg2);
  border:1px solid var(--border2);
  border-radius:20px;
  overflow:hidden;
  box-shadow:0 30px 80px rgba(0,135,255,.08);
}
.multi-dashboard-topbar{
  min-height:54px;
  background:var(--bg3);
  border-bottom:1px solid var(--border);
  display:flex;
  align-items:center;
  gap:16px;
  padding:0 22px;
  color:var(--text3);
  font-size:13px;
  font-weight:700;
}
.multi-dashboard-topbar .dash-dots{
  flex-shrink:0;
}
.multi-dashboard-body{
  padding:22px;
  min-height:410px;
}
.multi-chat-panel,
.multi-dashboard-mock{
  background:#fff;
  border:1px solid var(--border);
  border-radius:16px;
  overflow:hidden;
  min-height:360px;
}
.multi-chat-panel{
  display:grid;
  grid-template-columns:250px 1fr;
}
.multi-chat-sidebar{
  background:#f7fbff;
  border-right:1px solid var(--border);
  padding:22px;
}
.multi-chat-sidebar h4{
  font-family:'Outfit',sans-serif;
  font-size:20px;
  margin-bottom:2px;
}
.multi-chat-sidebar small,
.multi-contact small,
.multi-chat-head span{
  display:block;
  color:var(--text3);
  font-size:12px;
}
.multi-search{
  margin:18px 0 12px;
  padding:12px 14px;
  background:#fff;
  border:1px solid var(--border);
  border-radius:12px;
  color:var(--text3);
  font-size:13px;
}
.multi-tabs{
  display:flex;
  gap:6px;
  margin-bottom:14px;
}
.multi-tabs span{
  font-size:11px;
  padding:6px 10px;
  border-radius:999px;
  background:#fff;
  border:1px solid var(--border);
  color:var(--text2);
}
.multi-tabs span:first-child{
  background:#eaffea;
  border-color:#b8f5b8;
  color:#13b913;
}
.multi-contact{
  background:#fff;
  border:1px solid var(--border);
  border-radius:14px;
  padding:12px;
  margin-top:10px;
}
.multi-contact.active{
  border-color:var(--sky4);
  box-shadow:0 10px 30px rgba(0,135,255,.08);
}
.multi-chat-content{
  display:flex;
  flex-direction:column;
}
.multi-chat-head{
  display:flex;
  align-items:center;
  gap:14px;
  padding:18px 22px;
  border-bottom:1px solid var(--border);
}
.multi-chat-head > div:nth-child(2){
  flex:1;
}
.multi-chat-head em{
  font-style:normal;
  color:var(--green);
  background:#eaffea;
  border:1px solid #b8f5b8;
  border-radius:999px;
  padding:6px 12px;
  font-size:12px;
  font-weight:800;
}
.multi-chat-messages{
  padding:22px;
  display:flex;
  flex-direction:column;
  gap:12px;
  background:linear-gradient(135deg,rgba(0,135,255,.03),rgba(2,221,2,.03));
  min-height:260px;
}
.multi-dashboard-mock{
  display:grid;
  grid-template-columns:180px 1fr;
}
.multi-dash-menu{
  background:#f7fbff;
  border-right:1px solid var(--border);
  padding:18px;
  display:flex;
  flex-direction:column;
  gap:8px;
}
.multi-dash-menu strong{
  font-family:'Outfit',sans-serif;
  font-size:17px;
  margin-bottom:8px;
}
.multi-dash-menu span{
  font-size:12px;
  font-weight:700;
  color:var(--text2);
  padding:8px 10px;
  border-radius:8px;
}
.multi-dash-menu span.active{
  color:#fff;
  background:#26364b;
}
.multi-dash-content{
  padding:20px;
}
.multi-dash-head{
  display:flex;
  align-items:center;
  justify-content:space-between;
  margin-bottom:16px;
}
.multi-dash-head h3{
  font-family:'Outfit',sans-serif;
  font-size:22px;
}
.multi-dash-user{
  width:32px;
  height:32px;
  display:flex;
  align-items:center;
  justify-content:center;
  border-radius:50%;
  background:linear-gradient(135deg,var(--sky),var(--green));
  color:#fff;
  font-weight:900;
}
.multi-dash-kpis{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:10px;
  margin-bottom:14px;
}
.multi-dash-kpis div{
  border:1px solid var(--border);
  border-radius:10px;
  padding:12px 8px;
  text-align:center;
}
.multi-dash-kpis strong{
  display:block;
  font-family:'Outfit',sans-serif;
  font-size:18px;
  color:var(--text);
}
.multi-dash-kpis small{
  font-size:10px;
  color:var(--text3);
}
.multi-dash-charts{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:12px;
}
.multi-dash-charts > div{
  border:1px solid var(--border);
  border-radius:12px;
  padding:14px;
}
.multi-dash-charts h4{
  font-size:13px;
  color:var(--text2);
  margin-bottom:14px;
}
.multi-bars{
  height:78px;
  display:flex;
  align-items:flex-end;
  gap:7px;
}
.multi-bars i{
  flex:1;
  border-radius:6px 6px 0 0;
  background:linear-gradient(180deg,var(--sky),#bfe2ff);
}
.multi-bars i:nth-child(1){height:25%}
.multi-bars i:nth-child(2){height:38%}
.multi-bars i:nth-child(3){height:70%}
.multi-bars i:nth-child(4){height:45%}
.multi-bars i:nth-child(5){height:30%}
.multi-bars i:nth-child(6){height:42%}
.multi-bars i:nth-child(7){height:78%}
.multi-bars i:nth-child(8){height:88%}
.multi-big-bars{
  height:96px;
  display:flex;
  align-items:flex-end;
  justify-content:center;
  gap:22px;
}
.multi-big-bars i{
  width:46px;
  border-radius:8px 8px 0 0;
}
.multi-big-bars i:first-child{
  height:75%;
  background:var(--sky);
}
.multi-big-bars i:last-child{
  height:75%;
  background:#35c76f;
}
@media (max-width:1050px){
  .multi-operation-layout{
    grid-template-columns:1fr;
    gap:36px;
  }
  .multi-operation-visual{
    position:relative;
    top:auto;
  }
}
@media (max-width:720px){
  .multi-operation-section{
    padding:70px 20px;
  }
  .resource-product-label{
    flex-direction:column;
    align-items:flex-start;
    gap:4px;
  }
  .resource-product-group .sticky-card{
    grid-template-columns:1fr;
  }
  .multi-chat-panel,
  .multi-dashboard-mock{
    grid-template-columns:1fr;
  }
  .multi-chat-sidebar,
  .multi-dash-menu{
    display:none;
  }
  .multi-dash-kpis,
  .multi-dash-charts{
    grid-template-columns:1fr 1fr;
  }
}



/* Ajuste Multiatendimento: dashboard ampliado sem cards laterais */
.multi-dashboard-only-section{
  padding-top:90px;
  padding-bottom:90px;
}
.multi-dashboard-only-wrap{
  max-width:1180px;
  margin:52px auto 0;
  padding:0 20px;
}
.multi-dashboard-only-wrap .sticky-panel-wrap{
  position:relative;
  top:auto;
  width:100%;
}
.multi-dashboard-only-wrap .sticky-panel{
  width:100%;
  min-height:auto;
  border-radius:22px;
  box-shadow:0 26px 90px rgba(0,135,255,.09);
}
.multi-dashboard-only-wrap .panel-content{
  min-height:auto;
  padding:28px;
}
.multi-dashboard-only-wrap .panel-view{
  display:flex !important;
  width:100%;
}
.multi-dashboard-only-wrap .multi-dashboard-mockup{
  width:100%;
  max-width:none;
}
.multi-dashboard-only-wrap .multi-dashboard-body{
  min-height:520px;
}
.multi-dashboard-only-wrap .multi-sidebar-mini{
  width:240px;
  flex:0 0 240px;
}
.multi-dashboard-only-wrap .multi-dashboard-content{
  flex:1;
  min-width:0;
}
.multi-dashboard-only-wrap .multi-kpi-grid{
  grid-template-columns:repeat(4,minmax(120px,1fr));
}
.multi-dashboard-only-wrap .multi-chart-grid{
  grid-template-columns:1fr 1fr;
}
@media (max-width:900px){
  .multi-dashboard-only-section{padding-top:70px;padding-bottom:70px}
  .multi-dashboard-only-wrap{padding:0 16px;margin-top:34px}
  .multi-dashboard-only-wrap .panel-content{padding:14px;overflow-x:auto}
  .multi-dashboard-only-wrap .multi-dashboard-mockup{min-width:760px}
  .multi-dashboard-only-wrap .multi-dashboard-body{min-height:480px}
}


/* Refinamento final Multiatendimento: dashboard mais compacto e equilibrado */
.multi-dashboard-only-section{
  padding-top:72px !important;
  padding-bottom:72px !important;
}

.multi-dashboard-only-wrap{
  max-width:1080px !important;
  margin-top:38px !important;
}

.multi-dashboard-only-wrap .sticky-panel{
  border-radius:20px !important;
  box-shadow:0 24px 72px rgba(0,135,255,.08) !important;
}

.multi-dashboard-only-wrap .panel-topbar{
  padding:13px 18px !important;
}

.multi-dashboard-only-wrap .panel-content{
  padding:20px !important;
}

.multi-dashboard-only-wrap .multi-dashboard-mockup{
  border-radius:16px !important;
}

.multi-dashboard-only-wrap .multi-dashboard-top{
  height:46px !important;
  padding:0 14px !important;
}

.multi-dashboard-only-wrap .multi-dashboard-body{
  min-height:365px !important;
  grid-template-columns:190px 1fr !important;
}

.multi-dashboard-only-wrap .multi-sidebar-mini{
  width:auto !important;
  flex:auto !important;
  padding:12px 10px !important;
  gap:4px !important;
}

.multi-dashboard-only-wrap .multi-menu-item{
  padding:6px 8px !important;
  font-size:11px !important;
}

.multi-dashboard-only-wrap .multi-dashboard-content{
  padding:14px 16px 16px !important;
}

.multi-dashboard-only-wrap .multi-dashboard-title{
  margin-bottom:10px !important;
  font-size:17px !important;
}

.multi-dashboard-only-wrap .multi-kpi-grid{
  gap:8px !important;
  margin-bottom:10px !important;
}

.multi-dashboard-only-wrap .multi-kpi{
  min-height:58px !important;
  padding:8px 10px !important;
  border-radius:9px !important;
}

.multi-dashboard-only-wrap .multi-kpi strong{
  font-size:17px !important;
}

.multi-dashboard-only-wrap .multi-kpi span{
  font-size:9.5px !important;
}

.multi-dashboard-only-wrap .multi-chart-grid{
  gap:10px !important;
}

.multi-dashboard-only-wrap .multi-chart-card{
  min-height:138px !important;
  padding:12px !important;
}

.multi-dashboard-only-wrap .multi-chart-card strong{
  font-size:12px !important;
}

.multi-dashboard-only-wrap .multi-area-chart{
  height:86px !important;
  padding-top:16px !important;
}

.multi-dashboard-only-wrap .multi-bars{
  height:86px !important;
  padding-top:16px !important;
  gap:16px !important;
}

.multi-dashboard-only-wrap .multi-bars span{
  width:40px !important;
}

@media (max-width:900px){
  .multi-dashboard-only-wrap{
    max-width:100% !important;
    margin-top:30px !important;
  }

  .multi-dashboard-only-wrap .panel-content{
    padding:14px !important;
    overflow-x:auto !important;
  }

  .multi-dashboard-only-wrap .multi-dashboard-mockup{
    min-width:720px !important;
  }

  .multi-dashboard-only-wrap .multi-dashboard-body{
    min-height:360px !important;
  }
}

/* Ajuste Multiatendimento: benefícios ao lado do dashboard */
.multi-operation-section{
  padding-top:88px !important;
  padding-bottom:96px !important;
  overflow:hidden;
}
.multi-operation-layout{
  max-width:1280px;
  margin:0 auto;
  display:grid;
  grid-template-columns:minmax(300px, 0.78fr) minmax(680px, 1.45fr);
  gap:34px;
  align-items:center;
}
.multi-operation-copy{
  align-self:center;
}
.multi-operation-copy .section-title{
  text-align:left;
  margin-bottom:16px;
  font-size:clamp(32px,3.5vw,48px);
}
.multi-operation-copy .section-sub{
  text-align:left;
  max-width:460px;
  margin:0 0 28px;
}
.multi-operation-benefits{
  display:flex;
  flex-direction:column;
  gap:12px;
}
.multi-operation-benefit{
  display:flex;
  gap:14px;
  align-items:flex-start;
  background:rgba(255,255,255,.78);
  border:1px solid var(--border);
  border-radius:18px;
  padding:18px 18px;
  box-shadow:0 18px 50px rgba(0,135,255,.06);
}
.multi-operation-icon{
  width:30px;
  height:30px;
  min-width:30px;
  border-radius:10px;
  display:flex;
  align-items:center;
  justify-content:center;
  background:rgba(2,221,2,.10);
  border:1px solid rgba(2,221,2,.24);
  color:var(--green);
  font-weight:900;
  line-height:1;
}
.multi-operation-benefit h3{
  font-family:'Outfit',sans-serif;
  font-size:18px;
  line-height:1.2;
  color:var(--text);
  margin:0 0 6px;
}
.multi-operation-benefit p{
  font-size:14px;
  line-height:1.55;
  color:var(--text2);
  margin:0;
}
.multi-operation-dashboard{
  min-width:0;
}
.multi-operation-dashboard .multi-dashboard-only-wrap{
  max-width:none !important;
  width:100% !important;
  margin:0 !important;
  padding:0 !important;
}
.multi-operation-dashboard .sticky-panel-wrap{
  position:relative !important;
  top:auto !important;
}
.multi-operation-dashboard .sticky-panel{
  min-height:auto !important;
  border-radius:22px !important;
  box-shadow:0 28px 90px rgba(0,135,255,.10) !important;
}
.multi-operation-dashboard .panel-content{
  padding:18px !important;
}
.multi-operation-dashboard .multi-dashboard-mockup{
  width:100%;
  border-radius:18px !important;
}
.multi-operation-dashboard .multi-dashboard-top{
  height:46px !important;
}
.multi-operation-dashboard .multi-dashboard-body{
  min-height:360px !important;
  grid-template-columns:178px 1fr !important;
}
.multi-operation-dashboard .multi-sidebar-mini{
  padding:11px 9px !important;
  gap:3px !important;
}
.multi-operation-dashboard .multi-menu-item{
  padding:6px 8px !important;
  font-size:10.5px !important;
}
.multi-operation-dashboard .multi-dashboard-content{
  padding:14px 15px 15px !important;
}
.multi-operation-dashboard .multi-dashboard-title{
  font-size:17px !important;
  margin-bottom:10px !important;
}
.multi-operation-dashboard .multi-kpi-grid{
  gap:8px !important;
  margin-bottom:10px !important;
}
.multi-operation-dashboard .multi-kpi{
  min-height:56px !important;
  padding:8px 10px !important;
}
.multi-operation-dashboard .multi-kpi strong{
  font-size:17px !important;
}
.multi-operation-dashboard .multi-kpi span{
  font-size:9.5px !important;
}
.multi-operation-dashboard .multi-chart-grid{
  gap:10px !important;
}
.multi-operation-dashboard .multi-chart-card{
  min-height:132px !important;
  padding:12px !important;
}
.multi-operation-dashboard .multi-area-chart{
  height:82px !important;
  padding-top:14px !important;
}
.multi-operation-dashboard .multi-bars{
  height:82px !important;
  padding-top:14px !important;
}
.multi-operation-dashboard .multi-bars span{
  width:38px !important;
}
@media (max-width:1100px){
  .multi-operation-layout{
    grid-template-columns:1fr;
    gap:34px;
  }
  .multi-operation-copy .section-title,
  .multi-operation-copy .section-sub{
    text-align:center;
    margin-left:auto;
    margin-right:auto;
  }
  .multi-operation-copy .section-tag{
    display:block;
    text-align:center;
  }
  .multi-operation-benefits{
    max-width:760px;
    margin:0 auto;
    display:grid;
    grid-template-columns:1fr 1fr;
  }
}
@media (max-width:760px){
  .multi-operation-section{
    padding-top:68px !important;
    padding-bottom:74px !important;
  }
  .multi-operation-layout{
    padding:0 16px;
  }
  .multi-operation-benefits{
    grid-template-columns:1fr;
  }
  .multi-operation-dashboard{
    overflow-x:auto;
    padding-bottom:10px;
  }
  .multi-operation-dashboard .sticky-panel{
    min-width:760px !important;
  }
}


.pricing-section-premium{
    padding-top:40px;
    margin-top:0;
}

.pricing-premium-wrap{
    max-width:1200px;
    margin:0 auto;
    display:grid;
    grid-template-columns:1.3fr .9fr;
    gap:40px;
    align-items:center;
    background:#f8fbff;
    border:1px solid #dbe8f7;
    border-radius:28px;
    padding:50px;
}

.pricing-premium-copy .section-title{
    text-align:left;
    margin-bottom:20px;
}

.pricing-premium-copy .section-sub{
    text-align:left;
    max-width:700px;
}

.premium-card{
    position:relative;
    box-shadow:0 25px 60px rgba(0,135,255,.12);
}

.premium-card:before{
    content:'';
    position:absolute;
    inset:-2px;
    border-radius:24px;
    background:linear-gradient(135deg,#0087ff,#02dd02);
    z-index:-1;
    opacity:.25;
    filter:blur(18px);
}

.premium-note{
    margin-top:16px;
    text-align:center;
    color:#3d6b4f;
    font-weight:600;
}

@media(max-width:900px){
    .pricing-premium-wrap{
        grid-template-columns:1fr;
        padding:30px;
    }

    .pricing-premium-copy .section-title,
    .pricing-premium-copy .section-sub{
        text-align:center;
    }
}


.multi-conversion-section{
padding:80px 0 100px;
background:linear-gradient(180deg,#f8fbff 0%,#ffffff 100%);
}
.multi-conversion-grid{
max-width:1200px;margin:0 auto;padding:0 24px;
display:grid;grid-template-columns:1.3fr .9fr;gap:40px;align-items:center;
}
.multi-conversion-copy h2{font-size:56px;line-height:1.05;margin:12px 0 20px;font-weight:800;}
.multi-conversion-copy p{font-size:20px;line-height:1.7;color:#58708e;margin-bottom:24px;}
.multi-conversion-copy ul{list-style:none;padding:0;margin:0;}
.multi-conversion-copy li{margin:12px 0;font-size:18px;font-weight:600;}
.multi-price-card{
background:#fff;border:2px solid #19db2d;border-radius:28px;
padding:36px;box-shadow:0 20px 60px rgba(0,135,255,.08);
}
.multi-price-card .plan-name{display:block;margin-bottom:20px;color:#50657f}
.multi-price-card .price-line{font-size:32px;color:#334155;margin-bottom:26px}
.multi-price-card .price-line strong{font-size:72px}
.multi-price-card button{
width:100%;border:0;border-radius:16px;padding:18px;
background:linear-gradient(90deg,#0087ff,#16e51f);color:#fff;
font-size:20px;font-weight:700;cursor:pointer;
}
.secure-note{text-align:center;margin-top:16px;color:#58708e;font-weight:600}
@media(max-width:900px){
.multi-conversion-grid{grid-template-columns:1fr}
.multi-conversion-copy h2{font-size:40px}
.multi-price-card .price-line strong{font-size:54px}
}

/* Multiatendimento — bloco Recursos conforme layout aprovado */
.multi-showcase-section{
  padding:88px 0 0 !important;
  background:
    radial-gradient(circle at 50% 16%, rgba(0,135,255,.08), transparent 34%),
    linear-gradient(180deg,#f7fbff 0%,#ffffff 56%,#f7fbff 100%);
  overflow:hidden;
}
.multi-showcase-wrap{
  max-width:1240px;
  margin:0 auto;
  padding:0 24px;
}
.multi-showcase-head{
  text-align:center;
  max-width:950px;
  margin:0 auto 28px;
}
.multi-showcase-head .section-tag{
  display:block;
  text-align:center;
  margin-bottom:8px;
}
.multi-showcase-head .section-title{
  text-align:center;
  margin:0 0 14px;
  font-size:clamp(35px,4vw,30px);
  line-height:1.02;
}
.multi-showcase-head .section-sub{
  text-align:center;
  max-width:850px;
  margin:0 auto;
  font-size:18px;
  line-height:1.55;
}
.multi-showcase-dashboard{
  max-width:1000px;
  margin:0 auto;
}
.multi-showcase-dashboard .multi-dashboard-only-wrap{
  max-width:none !important;
  width:100% !important;
  margin:0 !important;
  padding:0 !important;
}
.multi-showcase-dashboard .sticky-panel-wrap{
  position:relative !important;
  top:auto !important;
}
.multi-showcase-dashboard .sticky-panel{
  min-height:auto !important;
  border-radius:24px !important;
  background:rgba(255,255,255,.88) !important;
  border:1px solid rgba(215,229,244,.95) !important;
  box-shadow:0 30px 90px rgba(0,135,255,.11) !important;
}
.multi-showcase-dashboard .panel-content{
  padding:18px !important;
  background:rgba(255,255,255,.72) !important;
}
.multi-showcase-dashboard .multi-dashboard-mockup{
  border-radius:18px !important;
  overflow:hidden;
}
.multi-showcase-dashboard .multi-dashboard-body{
  min-height:344px !important;
  grid-template-columns:190px 1fr !important;
}
.multi-showcase-dashboard .multi-sidebar-mini{
  padding:11px 10px !important;
  gap:3px !important;
}
.multi-showcase-dashboard .multi-menu-item{
  padding:6px 8px !important;
  font-size:10.5px !important;
}
.multi-showcase-dashboard .multi-dashboard-content{
  padding:14px 16px 16px !important;
}
.multi-showcase-dashboard .multi-dashboard-title{
  font-size:17px !important;
  margin-bottom:10px !important;
}
.multi-showcase-dashboard .multi-kpi-grid{
  gap:9px !important;
  margin-bottom:10px !important;
}
.multi-showcase-dashboard .multi-kpi{
  min-height:56px !important;
  padding:8px 10px !important;
}
.multi-showcase-dashboard .multi-kpi strong{font-size:17px !important;}
.multi-showcase-dashboard .multi-kpi span{font-size:9.5px !important;}
.multi-showcase-dashboard .multi-chart-grid{gap:10px !important;}
.multi-showcase-dashboard .multi-chart-card{
  min-height:132px !important;
  padding:12px !important;
}
.multi-showcase-dashboard .multi-area-chart,
.multi-showcase-dashboard .multi-bars{
  height:82px !important;
  padding-top:14px !important;
}
.multi-showcase-dashboard .multi-bars span{width:38px !important;}
.multi-showcase-benefits{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:18px;
  margin:22px auto 28px;
  max-width:1200px;
}
.multi-showcase-benefit{
  display:flex;
  gap:14px;
  align-items:flex-start;
  min-height:112px;
  padding:22px 22px;
  border-radius:18px;
  background:rgba(255,255,255,.86);
  border:1px solid rgba(221,232,244,.95);
  box-shadow:0 18px 46px rgba(0,63,120,.06);
}
.multi-showcase-icon{
  width:40px;
  height:40px;
  min-width:40px;
  display:flex;
  align-items:center;
  justify-content:center;
  border-radius:14px;
}
.multi-showcase-icon svg{
  width:22px;
  height:22px;
  fill:none;
  stroke:currentColor;
  stroke-width:2.2;
  stroke-linecap:round;
  stroke-linejoin:round;
}
.multi-showcase-icon-green{color:#02bb32;background:rgba(2,221,2,.10);}
.multi-showcase-icon-blue{color:#0087ff;background:rgba(0,135,255,.10);}
.multi-showcase-icon-purple{color:#8b5cf6;background:rgba(139,92,246,.10);}
.multi-showcase-icon-orange{color:#f59e0b;background:rgba(245,158,11,.12);}
.multi-showcase-benefit h3{
  font-family:'Outfit',sans-serif;
  color:var(--text);
  font-size:17px;
  line-height:1.2;
  margin:0 0 7px;
}
.multi-showcase-benefit p{
  margin:0;
  color:var(--text2);
  font-size:14px;
  line-height:1.5;
}
.multi-showcase-section + .pricing-section-premium{
  padding:0 24px 92px !important;
  margin-top:0 !important;
  background:linear-gradient(180deg,#f7fbff 0%,#ffffff 100%);
}
.multi-showcase-section + .pricing-section-premium .pricing-premium-wrap{
  max-width:1200px;
  background:rgba(248,251,255,.92);
  border-color:rgba(219,232,247,.95);
  box-shadow:0 22px 70px rgba(0,135,255,.07);
}
@media(max-width:1050px){
  .multi-showcase-benefits{grid-template-columns:repeat(2,1fr);}
  .multi-showcase-dashboard{overflow-x:auto;padding-bottom:10px;}
  .multi-showcase-dashboard .sticky-panel{min-width:820px !important;}
}
@media(max-width:680px){
  .multi-showcase-section{padding-top:64px !important;}
  .multi-showcase-wrap{padding:0 16px;}
  .multi-showcase-benefits{grid-template-columns:1fr;}
  .multi-showcase-head .section-sub{font-size:16px;}
  .multi-showcase-section + .pricing-section-premium{padding-left:16px !important;padding-right:16px !important;padding-bottom:72px !important;}
}

/* Ajuste solicitado — cards de recursos mais compactos e plano mais fechado */
.multi-showcase-benefits{
  max-width:1220px !important;
  gap:14px !important;
  margin:18px auto 30px !important;
}
.multi-showcase-benefit{
  min-height:88px !important;
  padding:17px 18px !important;
  border-radius:16px !important;
  gap:13px !important;
  align-items:flex-start !important;
  box-shadow:0 12px 34px rgba(0,63,120,.055) !important;
}
.multi-showcase-icon{
  width:38px !important;
  height:38px !important;
  min-width:38px !important;
  border-radius:13px !important;
  margin-top:2px !important;
}
.multi-showcase-icon svg{
  width:21px !important;
  height:21px !important;
}
.multi-showcase-benefit h3{
  font-size:15.5px !important;
  line-height:1.12 !important;
  margin-bottom:5px !important;
}
.multi-showcase-benefit p{
  font-size:12.5px !important;
  line-height:1.45 !important;
}
.multi-showcase-section + .pricing-section-premium .pricing-premium-wrap{
  max-width:1224px !important;
  grid-template-columns:1.05fr .82fr !important;
  gap:30px !important;
  padding:34px 42px !important;
  border-radius:24px !important;
}
.multi-showcase-section + .pricing-section-premium .pricing-premium-copy .section-tag{
  margin-bottom:10px !important;
}
.multi-showcase-section + .pricing-section-premium .pricing-premium-copy .section-title{
  max-width:580px !important;
  font-size:clamp(30px,3.1vw,35px) !important;
  line-height:1.08 !important;
  margin-bottom:16px !important;
}
.multi-showcase-section + .pricing-section-premium .pricing-premium-copy .section-sub{
  max-width:560px !important;
  font-size:16.5px !important;
  line-height:1.6 !important;
}
.multi-showcase-section + .pricing-section-premium .premium-card{
  width:100% !important;
  max-width:390px !important;
  margin-left:auto !important;
  padding:30px 30px 26px !important;
  border-radius:20px !important;
  background:linear-gradient(180deg,rgba(241,255,247,.92),rgba(248,255,252,.96)) !important;
}
.multi-showcase-section + .pricing-section-premium .price-name{
  margin-bottom:18px !important;
  font-size:16px !important;
}
.multi-showcase-section + .pricing-section-premium .price-value{
  display:flex !important;
  align-items:flex-end !important;
  justify-content:center !important;
  gap:5px !important;
  margin:0 0 24px !important;
  line-height:1 !important;
}
.multi-showcase-section + .pricing-section-premium .price-value span{
  font-size:22px !important;
  margin-bottom:9px !important;
}
.multi-showcase-section + .pricing-section-premium .price-value strong{
  font-size:56px !important;
  letter-spacing:-2px !important;
}
.multi-showcase-section + .pricing-section-premium .price-value small{
  font-size:16px !important;
  margin-bottom:9px !important;
}
.multi-showcase-section + .pricing-section-premium .price-btn{
  min-height:48px !important;
  border-radius:10px !important;
  font-size:15px !important;
}
.multi-showcase-section + .pricing-section-premium .premium-note{
  margin-top:16px !important;
  font-size:14px !important;
}
@media(max-width:1050px){
  .multi-showcase-benefits{max-width:760px !important;}
  .multi-showcase-section + .pricing-section-premium .pricing-premium-wrap{max-width:760px !important;grid-template-columns:1fr !important;}
  .multi-showcase-section + .pricing-section-premium .premium-card{margin:0 auto !important;}
}
@media(max-width:680px){
  .multi-showcase-benefit{min-height:auto !important;}
  .multi-showcase-section + .pricing-section-premium .pricing-premium-wrap{padding:28px 20px !important;}
  .multi-showcase-section + .pricing-section-premium .price-value strong{font-size:48px !important;}
}


/* Ajuste Multiatendimento: lista de itens do plano dentro do bloco de contratação */
.multi-showcase-section + .pricing-section-premium .multi-plan-features{
  list-style:none !important;
  margin:22px 0 0 !important;
  padding:0 !important;
  display:grid !important;
  grid-template-columns:repeat(2,minmax(0,1fr)) !important;
  gap:12px 18px !important;
  max-width:660px !important;
}
.multi-showcase-section + .pricing-section-premium .multi-plan-features li{
  position:relative !important;
  padding-left:28px !important;
  color:var(--text2) !important;
  font-size:15.5px !important;
  line-height:1.35 !important;
  font-weight:600 !important;
}
.multi-showcase-section + .pricing-section-premium .multi-plan-features li::before{
  content:'✓' !important;
  position:absolute !important;
  left:0 !important;
  top:-1px !important;
  color:#00c900 !important;
  font-size:20px !important;
  line-height:1 !important;
  font-weight:900 !important;
}
@media(max-width:1050px){
  .multi-showcase-section + .pricing-section-premium .multi-plan-features{
    max-width:100% !important;
  }
}
@media(max-width:680px){
  .multi-showcase-section + .pricing-section-premium .multi-plan-features{
    grid-template-columns:1fr !important;
    gap:10px !important;
  }
  .multi-showcase-section + .pricing-section-premium .multi-plan-features li{
    font-size:14.5px !important;
  }
}

/* Multiatendimento — plano premium no layout do print enviado */
.multi-showcase-section + .pricing-section-premium{
  padding:0 24px 90px !important;
  background:linear-gradient(180deg,#f7fbff 0%,#ffffff 100%) !important;
}
.multi-showcase-section + .pricing-section-premium .pricing-premium-wrap{
  max-width:1220px !important;
  display:grid !important;
  grid-template-columns:minmax(0,1.42fr) minmax(360px,.92fr) !important;
  gap:54px !important;
  align-items:stretch !important;
  padding:54px 42px !important;
  border-radius:28px !important;
  background:rgba(255,255,255,.72) !important;
  border:1px solid rgba(211,226,244,.95) !important;
  box-shadow:0 28px 75px rgba(0,92,180,.07) !important;
}
.multi-showcase-section + .pricing-section-premium .pricing-premium-copy{
  display:flex !important;
  flex-direction:column !important;
  justify-content:center !important;
}
.multi-showcase-section + .pricing-section-premium .pricing-premium-copy .section-tag{
  margin-bottom:18px !important;
  letter-spacing:.10em !important;
}
.multi-showcase-section + .pricing-section-premium .pricing-premium-copy .section-title{
  max-width:620px !important;
  font-size:clamp(30px,3.7vw,30px) !important;
  line-height:1.12 !important;
  letter-spacing:-.045em !important;
  margin:0 0 22px !important;
  color: var(--text);
}
.multi-showcase-section + .pricing-section-premium .pricing-premium-copy .section-sub{
  max-width:650px !important;
  font-size:19px !important;
  line-height:1.58 !important;
  margin:0 0 34px !important;
  color:#526b86 !important;
}
.multi-showcase-section + .pricing-section-premium .multi-plan-features{
  list-style:none !important;
  margin:0 !important;
  padding:28px 28px 30px !important;
  display:grid !important;
  grid-template-columns:repeat(2,minmax(0,1fr)) !important;
  gap:26px 34px !important;
  max-width:680px !important;
  background:rgba(255,255,255,.72) !important;
  border:1px solid rgba(214,228,244,.95) !important;
  border-radius:24px !important;
  box-shadow:0 20px 50px rgba(16,32,51,.045) !important;
}
.multi-showcase-section + .pricing-section-premium .multi-plan-feature{
  display:grid !important;
  grid-template-columns:46px 1fr !important;
  gap:16px !important;
  align-items:flex-start !important;
}
.multi-showcase-section + .pricing-section-premium .multi-plan-check{
  width:40px !important;
  height:40px !important;
  border-radius:13px !important;
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  background:linear-gradient(180deg,rgba(2,221,2,.10),rgba(2,221,2,.05)) !important;
  border:1px solid rgba(2,188,60,.14) !important;
  box-shadow:0 10px 22px rgba(2,188,60,.08) !important;
}
.multi-showcase-section + .pricing-section-premium .multi-plan-check svg{
  width:22px !important;
  height:22px !important;
  fill:none !important;
  stroke:#10b84b !important;
  stroke-width:2.7 !important;
  stroke-linecap:round !important;
  stroke-linejoin:round !important;
}
.multi-showcase-section + .pricing-section-premium .multi-plan-feature h3{
  margin:0 0 8px !important;
  font-family:'Outfit',sans-serif !important;
  font-size:17px !important;
  line-height:1.25 !important;
  letter-spacing:-.02em !important;
  color: var(--text);
}
.multi-showcase-section + .pricing-section-premium .multi-plan-feature p{
  margin:0 !important;
  font-size:14.5px !important;
  line-height:1.58 !important;
  color:#526b86 !important;
}
.multi-showcase-section + .pricing-section-premium .multi-premium-card{
  width:100% !important;
  max-width:430px !important;
  min-height:620px !important;
  margin:0 0 0 auto !important;
  padding:32px 28px !important;
  display:flex !important;
  flex-direction:column !important;
  align-items:stretch !important;
  justify-content:flex-start !important;
  border-radius:30px !important;
  border:1.5px solid rgba(2,221,2,.32) !important;
  background:linear-gradient(180deg,rgba(255,255,255,.98) 0%,rgba(250,255,252,.98) 100%) !important;
  box-shadow:0 28px 80px rgba(0,135,255,.10),0 18px 50px rgba(2,221,2,.08) !important;
  overflow:hidden !important;
}
.multi-showcase-section + .pricing-section-premium .multi-premium-card:before{
  display:none !important;
}
.multi-showcase-section + .pricing-section-premium .premium-whatsapp-icon{
  width:64px !important;
  height:64px !important;
  margin:0 auto 18px !important;
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  border-radius:18px !important;
  background:linear-gradient(180deg,rgba(2,221,2,.10),rgba(2,221,2,.04)) !important;
  border:1px solid rgba(2,188,60,.14) !important;
  color:#14a84b !important;
}
.multi-showcase-section + .pricing-section-premium .premium-whatsapp-icon svg,
.multi-showcase-section + .pricing-section-premium .premium-support-icon svg{
  width:32px !important;
  height:32px !important;
  fill:none !important;
  stroke:currentColor !important;
  stroke-width:2 !important;
  stroke-linecap:round !important;
  stroke-linejoin:round !important;
}
.multi-showcase-section + .pricing-section-premium .price-name{
  margin:0 0 18px !important;
  text-align:center !important;
  font-family:'Outfit',sans-serif !important;
  font-size:23px !important;
  font-weight:800 !important;
  color: var(--text);
}
.multi-showcase-section + .pricing-section-premium .premium-divider{
  width:100% !important;
  height:1px !important;
  background:rgba(215,226,238,.95) !important;
  margin:0 0 26px !important;
}
.multi-showcase-section + .pricing-section-premium .price-value{
  display:flex !important;
  align-items:flex-end !important;
  justify-content:center !important;
  gap:8px !important;
  margin:0 0 10px !important;
  line-height:1 !important;
}
.multi-showcase-section + .pricing-section-premium .price-value span{
  font-size:25px !important;
  margin:0 0 15px !important;
  color:#4b627d !important;
  font-weight:800 !important;
}
.multi-showcase-section + .pricing-section-premium .price-value strong{
  font-size:72px !important;
  letter-spacing:-3.5px !important;
  color:#0878ff !important;
  font-weight:900 !important;
  text-shadow:0 12px 30px rgba(0,135,255,.12) !important;
}
.multi-showcase-section + .pricing-section-premium .price-value small{
  font-size:18px !important;
  margin:0 0 15px !important;
  color:#405772 !important;
  font-weight:800 !important;
}
.multi-showcase-section + .pricing-section-premium .premium-price-sub{
  margin:0 0 22px !important;
  text-align:center !important;
  font-size:14.5px !important;
  color:#526b86 !important;
  line-height:1.4 !important;
}
.multi-showcase-section + .pricing-section-premium .premium-note{
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  gap:10px !important;
  margin:0 0 22px !important;
  min-height:48px !important;
  border-radius:10px !important;
  background:linear-gradient(90deg,rgba(2,221,2,.09),rgba(2,221,2,.05)) !important;
  color:#217241 !important;
  font-size:15px !important;
  font-weight:800 !important;
  text-align:center !important;
}
.multi-showcase-section + .pricing-section-premium .premium-note span{
  color:#11a64b !important;
  font-size:20px !important;
  line-height:1 !important;
}
.multi-showcase-section + .pricing-section-premium .price-btn{
  min-height:54px !important;
  width:100% !important;
  border-radius:10px !important;
  background:linear-gradient(90deg,#0087ff,#086df4) !important;
  box-shadow:0 14px 28px rgba(0,135,255,.22) !important;
  font-size:18px !important;
  font-weight:800 !important;
  gap:10px !important;
  margin:0 0 28px !important;
}
.multi-showcase-section + .pricing-section-premium .price-btn span{
  font-size:18px !important;
}
.multi-showcase-section + .pricing-section-premium .premium-support-list{
  display:flex !important;
  flex-direction:column !important;
  gap:16px !important;
  margin:0 0 22px !important;
}
.multi-showcase-section + .pricing-section-premium .premium-support-item,
.multi-showcase-section + .pricing-section-premium .premium-loyalty-box{
  display:grid !important;
  grid-template-columns:42px 1fr !important;
  gap:14px !important;
  align-items:center !important;
}
.multi-showcase-section + .pricing-section-premium .premium-support-icon{
  width:38px !important;
  height:38px !important;
  border-radius:13px !important;
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  background:rgba(0,135,255,.06) !important;
  border:1px solid rgba(0,135,255,.13) !important;
  color:#0878ff !important;
  flex-shrink:0 !important;
}
.multi-showcase-section + .pricing-section-premium .premium-support-icon svg{
  width:21px !important;
  height:21px !important;
  stroke-width:2.2 !important;
}
.multi-showcase-section + .pricing-section-premium .premium-support-item strong,
.multi-showcase-section + .pricing-section-premium .premium-loyalty-box strong{
  display:block !important;
  color: var(--text);
  font-size:14.5px !important;
  line-height:1.25 !important;
  font-weight:800 !important;
}
.multi-showcase-section + .pricing-section-premium .premium-support-item small,
.multi-showcase-section + .pricing-section-premium .premium-loyalty-box small{
  display:block !important;
  margin-top:3px !important;
  color:#526b86 !important;
  font-size:13px !important;
  line-height:1.35 !important;
}
.multi-showcase-section + .pricing-section-premium .premium-loyalty-box{
  margin-top:auto !important;
  padding:18px !important;
  border-radius:12px !important;
  background:linear-gradient(180deg,rgba(0,135,255,.045),rgba(255,255,255,.82)) !important;
  border:1px solid rgba(0,135,255,.13) !important;
}
@media(max-width:1050px){
  .multi-showcase-section + .pricing-section-premium .pricing-premium-wrap{
    max-width:780px !important;
    grid-template-columns:1fr !important;
    gap:32px !important;
    padding:36px 26px !important;
  }
  .multi-showcase-section + .pricing-section-premium .pricing-premium-copy .section-title,
  .multi-showcase-section + .pricing-section-premium .pricing-premium-copy .section-sub{
    text-align:center !important;
    margin-left:auto !important;
    margin-right:auto !important;
  }
  .multi-showcase-section + .pricing-section-premium .multi-plan-features{
    margin-left:auto !important;
    margin-right:auto !important;
  }
  .multi-showcase-section + .pricing-section-premium .multi-premium-card{
    margin:0 auto !important;
  }
}
@media(max-width:680px){
  .multi-showcase-section + .pricing-section-premium{
    padding-left:16px !important;
    padding-right:16px !important;
  }
  .multi-showcase-section + .pricing-section-premium .pricing-premium-wrap{
    padding:28px 18px !important;
    border-radius:22px !important;
  }
  .multi-showcase-section + .pricing-section-premium .pricing-premium-copy .section-title{
    font-size:32px !important;
  }
  .multi-showcase-section + .pricing-section-premium .pricing-premium-copy .section-sub{
    font-size:16px !important;
  }
  .multi-showcase-section + .pricing-section-premium .multi-plan-features{
    grid-template-columns:1fr !important;
    padding:22px 18px !important;
    gap:20px !important;
  }
  .multi-showcase-section + .pricing-section-premium .multi-plan-feature{
    grid-template-columns:40px 1fr !important;
    gap:12px !important;
  }
  .multi-showcase-section + .pricing-section-premium .multi-plan-feature h3{
    font-size:16px !important;
  }
  .multi-showcase-section + .pricing-section-premium .multi-plan-feature p{
    font-size:14px !important;
  }
  .multi-showcase-section + .pricing-section-premium .multi-premium-card{
    min-height:auto !important;
    padding:28px 20px !important;
    border-radius:24px !important;
  }
  .multi-showcase-section + .pricing-section-premium .price-value strong{
    font-size:54px !important;
    letter-spacing:-2px !important;
  }
  .multi-showcase-section + .pricing-section-premium .price-value span{
    font-size:20px !important;
    margin-bottom:10px !important;
  }
  .multi-showcase-section + .pricing-section-premium .price-value small{
    font-size:15px !important;
    margin-bottom:10px !important;
  }
  .multi-showcase-section + .pricing-section-premium .price-btn{
    font-size:16px !important;
  }
}

/* =========================================================
   Página Assistente IA - layout SaaS moderno
   ========================================================= */
.ai-page-v2{
  background:linear-gradient(180deg,#F8FCFF 0%,#FFFFFF 55%,#F6FAFF 100%);
  padding:calc(var(--nav-h) + 88px) max(36px,calc((100vw - var(--max-w)) / 2)) 70px;
  overflow:hidden;
}
.ai-page-v2 h1,
.ai-page-v2 h2,
.ai-page-v2 h3 {
  font-family: 'Outfit', sans-serif;
  color: var(--text);
  letter-spacing: -.035em;
  line-height: 1.1
}

.ai-hero-v2 {
  display: grid;
  grid-template-columns: 1fr 1fr;
  align-items: center;
  gap: 72px;
  min-height: 640px;
  margin-bottom: 34px
}

.ai-pill,
.ai-section-head span,
.ai-plan-tag {
  display: inline-flex;
  align-items: center;
  width: max-content;
  border-radius: 999px;
  background: rgba(0, 135, 255, .09);
  color: #006cff;
  text-transform: uppercase;
  letter-spacing: .08em;
  font-size: 12px;
  font-weight: 800;
  padding: 7px 13px;
  margin-bottom: 24px
}

.ai-hero-copy h1 {
  font-size: clamp(40px, 5vw, 40px);
  max-width: 620px;
  margin-bottom: 24px
}

.ai-hero-copy p {
  font-size: 19px;
  line-height: 1.65;
  color: var(--text);
  max-width: 640px;
  margin-bottom: 28px
}

.ai-check-list {
  list-style: none;
  display: flex;
  flex-direction: column;
  gap: 16px;
  margin: 0 0 36px
}

.ai-check-list li {
  display: flex;
  align-items: flex-start;
  gap: 14px;
  color: #18314f;
  font-size: 17px;
  font-weight: 600;
  line-height: 1.45
}

.ai-check-list li::before {
  content: '✓';
  color: #00bd20;
  font-size: 20px;
  font-weight: 900;
  line-height: 1.1;
  flex: 0 0 auto
}

.ai-hero-actions {
  display: flex;
  align-items: center;
  gap: 24px;
  flex-wrap: wrap
}

.ai-primary-btn {
  border: 0;
  cursor: pointer;
  text-decoration: none;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  background: linear-gradient(135deg, #0077ff, #008fff);
  color: #fff;
  border-radius: 10px;
  min-height: 58px;
  padding: 0 28px;
  font-size: 16px;
  font-weight: 800;
  box-shadow: 0 18px 38px rgba(0, 135, 255, .20);
  transition: .35s var(--silk)
}

.ai-primary-btn::before {
  content: '⌁';
  font-size: 18px;
  line-height: 1
}

.ai-primary-btn:hover {
  transform: translateY(-2px);
  box-shadow: 0 22px 48px rgba(0, 135, 255, .28)
}

.ai-link-btn {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  text-decoration: none;
  color: #0075ff;
  font-weight: 800
}

.ai-link-btn::before {
  content: '▷';
  width: 22px;
  height: 22px;
  border-radius: 50%;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border: 2px solid currentColor;
  font-size: 10px
}

.ai-hero-demo {
  position: relative;
  min-height: 620px;
  display: flex;
  align-items: center;
  justify-content: center
}

.ai-phone {
  position: relative;
  width: min(410px, 100%);
  height: 610px;
  border: 10px solid #fff;
  border-radius: 46px;
  background: #EDF5FF;
  box-shadow: 0 28px 80px rgba(36, 75, 120, .16);
  overflow: hidden;
  z-index: 2
}

.ai-phone-head {
  height: 78px;
  display: grid;
  grid-template-columns: 28px 42px 1fr 52px;
  gap: 12px;
  align-items: center;
  padding: 0 22px;
  color: #17304f
}

.ai-phone-head strong {
  display: block;
  font-family: 'Outfit', sans-serif;
  font-size: 15px
}

.ai-phone-head span {
  display: block;
  color: #5d8b80;
  font-size: 11px
}

.ai-back {
  font-size: 35px;
  line-height: 1;
  color: #183b63
}

.ai-bot-avatar {
  width: 40px;
  height: 40px;
  border-radius: 50%;
  background: linear-gradient(135deg, #101b33, #16335f);
  display: flex;
  align-items: center;
  justify-content: center;
  color: #18e27d;
  box-shadow: inset 0 0 0 3px rgba(255, 255, 255, .55)
}

.ai-phone-icons {
  text-align: right;
  color: #31516f;
  font-weight: 800;
  letter-spacing: .08em
}

.ai-chat-area {
  display: flex;
  flex-direction: column;
  gap: 16px;
  padding: 12px 20px 12px
}

.ai-msg {
  position: relative;
  max-width: 78%;
  border-radius: 13px;
  padding: 14px 14px 20px;
  font-size: 13px;
  line-height: 1.48;
  color: #16304e;
  box-shadow: 0 8px 20px rgba(49, 80, 120, .06)
}

.ai-msg small {
  position: absolute;
  right: 10px;
  bottom: 5px;
  font-size: 10px;
  color: #8aa0b7
}

.ai-msg-left {
  align-self: flex-start;
  background: #fff;
  border-top-left-radius: 6px
}

.ai-msg-right {
  align-self: flex-end;
  background: #DAFFD5;
  border-top-right-radius: 6px
}

.ai-phone-input {
  position: absolute;
  left: 18px;
  right: 18px;
  bottom: 18px;
  height: 44px;
  border-radius: 22px;
  background: #fff;
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 0 8px 0 18px;
  color: #9aacbf;
  font-size: 12px
}

.ai-phone-input b {
  width: 34px;
  height: 34px;
  border-radius: 50%;
  background: #25D366;
  color: #fff;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 15px
}

.ai-floating-robot {
  position: absolute;
  right: 4px;
  top: 230px;
  width: 168px;
  height: 250px;
  z-index: 3;
  filter: drop-shadow(0 24px 28px rgba(22, 102, 155, .14))
}

.ai-robot-head {
  height: 104px;
  border-radius: 55px;
  background: linear-gradient(180deg, #fff, #DDF0FF);
  display: flex;
  align-items: center;
  justify-content: center;
  box-shadow: inset 0 -12px 24px rgba(0, 75, 145, .08)
}

.ai-robot-head::before,
.ai-robot-head::after {
  content: '';
  position: absolute;
  top: 45px;
  width: 24px;
  height: 48px;
  background: #AFCBEA;
  border-radius: 18px
}

.ai-robot-head::before {
  left: -11px
}

.ai-robot-head::after {
  right: -11px
}

.ai-robot-head span {
  width: 92px;
  height: 58px;
  border-radius: 24px;
  background: #102033;
  display: block;
  position: relative
}

.ai-robot-head span::before {
  content: '◠ ◠';
  position: absolute;
  inset: 0;
  color: #1CEB85;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 34px;
  font-weight: 800;
  letter-spacing: 6px
}

.ai-robot-body {
  width: 98px;
  height: 110px;
  margin: -4px auto 0;
  border-radius: 48px 48px 60px 60px;
  background: linear-gradient(180deg, #F7FCFF, #DDF1FF);
  display: flex;
  align-items: center;
  justify-content: center;
  color: #fff;
  font-size: 28px
}

.ai-robot-body::before {
  content: '';
  width: 54px;
  height: 54px;
  border-radius: 50%;
  background: #25D366;
  position: absolute
}

.ai-robot-body {
  position: relative
}

.ai-robot-body {
  color: #fff;
  z-index: 1
}

.ai-feature-strip {
  background: rgba(255, 255, 255, .92);
  border: 1px solid var(--border);
  border-radius: 20px;
  box-shadow: 0 24px 70px rgba(16, 32, 51, .08);
  display: grid;
  grid-template-columns: repeat(5, 1fr);
  padding: 34px 18px;
  margin: 0 auto 86px
}

.ai-feature-strip article {
  text-align: center;
  padding: 0 24px;
  border-right: 1px solid var(--border)
}

.ai-feature-strip article:last-child {
  border-right: 0
}

.ai-icon,
.ai-step-icon {
  width: 66px;
  height: 66px;
  border-radius: 18px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 29px;
  font-weight: 800;
  margin-bottom: 18px
}

.ai-icon.green,
.ai-step-icon {
  background: #E9FFF1;
  color: #0bb84a
}

.ai-icon.purple {
  background: #F1EBFF;
  color: #784CFF
}

.ai-icon.blue {
  background: #EAF4FF;
  color: #0087FF
}

.ai-icon.orange {
  background: #FFF4E1;
  color: #FF9900
}

.ai-icon.pink {
  background: #FFEAF5;
  color: #F23997
}

.ai-feature-strip h3,
.ai-business-grid h3 {
  font-size: 17px;
  margin-bottom: 8px
}

.ai-feature-strip p,
.ai-business-grid p,
.ai-step-grid p {
  font-size: 13px;
  color: #405b78;
  line-height: 1.65;
  margin: 0
}

.ai-section-head {
  text-align: center;
  margin: 0 auto 44px
}

.ai-section-head span {
  margin-left: auto;
  margin-right: auto;
  margin-bottom: 12px;
  background: transparent;
  padding: 0;
  color: #006cff
}

.ai-section-head h2 {
  font-size: clamp(30px, 3.5vw, 42px)
}

.ai-steps {
  padding: 16px 0 78px
}

.ai-step-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 38px;
  position: relative
}

.ai-step-grid article {
  text-align: center;
  position: relative;
  padding: 0 20px
}

.ai-step-grid article:not(:last-child)::after {
  content: '';
  position: absolute;
  top: 56px;
  right: -38px;
  width: 76px;
  border-top: 2px dashed #CFE1F3
}

.ai-step-grid b {
  width: 28px;
  height: 28px;
  border-radius: 50%;
  background: #10A845;
  color: #fff;
  display: flex;
  align-items: center;
  justify-content: center;
  margin: 0 auto 16px;
  font-size: 13px
}

.ai-step-icon {
  margin-bottom: 16px
}

.ai-step-grid h3 {
  font-size: 17px;
  margin-bottom: 10px
}

.ai-business {
  padding: 4px 0 46px
}

.ai-business-grid {
  display: grid;
  grid-template-columns: repeat(5, 1fr);
  gap: 18px
}

.ai-business-grid article {
  background: rgba(255, 255, 255, .9);
  border: 1px solid var(--border);
  border-radius: 18px;
  box-shadow: 0 18px 42px rgba(16, 32, 51, .07);
  text-align: center;
  padding: 28px 18px 26px
}

.ai-plan {
  display: grid;
  grid-template-columns: 1fr .85fr;
  gap: 70px;
  align-items: center;
  background: rgba(255, 255, 255, .9);
  border: 1px solid var(--border);
  border-radius: 20px;
  box-shadow: 0 20px 60px rgba(16, 32, 51, .08);
  padding: 64px 86px;
  margin: 8px 0 44px
}

.ai-plan-copy h2 {
  font-size: 42px;
  margin-bottom: 28px
}

.ai-check-list.compact {
  gap: 13px;
  margin-bottom: 0
}

.ai-check-list.compact li {
  font-size: 16px;
  font-weight: 600
}

.ai-price-card {
  border: 1.5px solid #00cf2d;
  border-radius: 14px;
  background: linear-gradient(180deg, #FFFFFF 0%, #F5FFF9 100%);
  padding: 46px 52px;
  text-align: center;
  box-shadow: 0 24px 60px rgba(0, 135, 255, .07)
}

.ai-price-card h3 {
  font-size: 17px;
  margin-bottom: 26px
}

.ai-price {
  display: flex;
  align-items: flex-end;
  justify-content: center;
  gap: 12px;
  margin-bottom: 30px;
  color: #102033
}

.ai-price span {
  font-size: 28px;
  font-weight: 800;
  margin-bottom: 12px
}

.ai-price strong {
  font-family: 'Outfit', sans-serif;
  font-size: 68px;
  line-height: .9;
  letter-spacing: -.05em
}

.ai-price small {
  font-size: 18px;
  font-weight: 800;
  margin-bottom: 11px;
  color: #405b78
}

.ai-price-card .ai-primary-btn {
  width: 100%;
  margin-bottom: 28px
}

.ai-price-card p {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  color: #14863d;
  font-weight: 800
}

.ai-price-card p::before {
  content: '⬟';
  color: #12B857
}

.ai-bottom-trust {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 26px
}

.ai-bottom-trust article {
  display: flex;
  align-items: center;
  gap: 14px;
  justify-content: center
}

.ai-bottom-trust span {
  width: 48px;
  height: 48px;
  border-radius: 16px;
  background: #EAF4FF;
  color: #0087FF;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 24px
}

.ai-bottom-trust h3 {
  font-size: 15px;
  margin: 0 0 2px
}

.ai-bottom-trust p {
  font-size: 13px;
  color: #405b78;
  margin: 0
}

@media(max-width:1100px) {

  .ai-hero-v2,
  .ai-plan {
    grid-template-columns: 1fr;
    gap: 44px
  }

  .ai-hero-demo {
    min-height: 540px
  }

  .ai-feature-strip {
    grid-template-columns: repeat(2, 1fr)
  }

  .ai-feature-strip article {
    border-right: 0;
    border-bottom: 1px solid var(--border);
    padding: 24px
  }

  .ai-feature-strip article:last-child {
    grid-column: 1/-1;
    border-bottom: 0
  }

  .ai-step-grid,
  .ai-business-grid,
  .ai-bottom-trust {
    grid-template-columns: 1fr 1fr
  }

  .ai-step-grid article:not(:last-child)::after {
    display: none
  }

  .ai-plan {
    padding: 44px
  }
}

@media(max-width:720px) {
  .ai-page-v2 {
    padding: calc(var(--nav-h) + 52px) 18px 48px
  }

  .ai-hero-v2 {
    gap: 24px;
    min-height: auto
  }

  .ai-hero-copy h1 {
    font-size: 38px
  }

  .ai-hero-copy p {
    font-size: 16px
  }

  .ai-hero-actions {
    gap: 14px
  }

  .ai-primary-btn {
    width: 100%;
    min-height: 54px
  }

  .ai-link-btn {
    width: 100%;
    justify-content: center
  }

  .ai-hero-demo {
    min-height: 500px;
    transform: scale(.88);
    transform-origin: top center;
    margin-bottom: -80px
  }

  .ai-floating-robot {
    right: -18px;
    transform: scale(.76)
  }

  .ai-feature-strip,
  .ai-step-grid,
  .ai-business-grid,
  .ai-bottom-trust {
    grid-template-columns: 1fr
  }

  .ai-feature-strip {
    padding: 10px;
    margin-bottom: 62px
  }

  .ai-feature-strip article {
    border-bottom: 1px solid var(--border)
  }

  .ai-plan {
    padding: 28px 20px;
    gap: 28px
  }

  .ai-plan-copy h2 {
    font-size: 34px
  }

  .ai-price-card {
    padding: 34px 22px
  }

  .ai-price strong {
    font-size: 54px
  }

  .ai-bottom-trust article {
    justify-content: flex-start;
    background: rgba(255, 255, 255, .8);
    border: 1px solid var(--border);
    border-radius: 16px;
    padding: 18px
  }
}

.hero-multi-style{
display:flex;
flex-direction:column;
gap:6px;
line-height:1.05!important;
}
.hero-multi-style .hero-green{
display:block;
color:#02DD02;
font-weight:800;
}
.hero-multi-style .hero-blue{
display:block;
color:#0087FF;
font-weight:800;
}

/* Demonstração interativa da Assistente IA */
.ai-phone-interactive .ai-chat-area {
  position: absolute;
  top: 78px;
  left: 0;
  right: 0;
  bottom: 74px;
  overflow-y: auto;
  padding: 16px 20px 18px;
  scroll-behavior: smooth;
}

.ai-phone-interactive .ai-chat-area::-webkit-scrollbar {
  width: 4px;
}

.ai-phone-interactive .ai-chat-area::-webkit-scrollbar-thumb {
  background: rgba(0, 135, 255, .22);
  border-radius: 20px;
}

.ai-quick-title {
  align-self: flex-start;
  font-size: 11px;
  font-weight: 800;
  color: #53708f;
  margin: -2px 0 -8px 2px;
}

.ai-quick-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  align-self: flex-start;
  max-width: 92%;
  margin-bottom: 2px;
}

.ai-quick-actions button,
.ai-msg-cta a {
  border: 1px solid rgba(0, 135, 255, .18);
  background: rgba(255, 255, 255, .78);
  color: #006cff;
  border-radius: 999px;
  padding: 8px 10px;
  font-size: 11px;
  font-weight: 800;
  cursor: pointer;
  box-shadow: 0 8px 18px rgba(37, 91, 150, .07);
  transition: .25s var(--silk);
}

.ai-quick-actions button:hover,
.ai-msg-cta a:hover {
  transform: translateY(-1px);
  background: #fff;
  border-color: rgba(0, 135, 255, .35);
}

.ai-demo-hint {
  background: linear-gradient(135deg, #ffffff, #f1fbff);
  border: 1px solid rgba(0, 135, 255, .10);
}

.ai-msg-typing {
  width: 82px;
  min-height: 38px;
  padding: 13px 15px;
  display: inline-flex;
  gap: 5px;
  align-items: center;
}

.ai-msg-typing i {
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: #8aa0b7;
  display: block;
  animation: aiTypingDot 1s infinite ease-in-out;
}

.ai-msg-typing i:nth-child(2) {
  animation-delay: .15s;
}

.ai-msg-typing i:nth-child(3) {
  animation-delay: .30s;
}

@keyframes aiTypingDot {
  0%, 80%, 100% { opacity: .35; transform: translateY(0); }
  40% { opacity: 1; transform: translateY(-4px); }
}

.ai-phone-input.ai-demo-form {
  gap: 8px;
  padding: 0 7px 0 16px;
}

.ai-phone-input.ai-demo-form input {
  width: 100%;
  border: 0;
  outline: 0;
  background: transparent;
  color: #17304f;
  font: inherit;
  min-width: 0;
}

.ai-phone-input.ai-demo-form input::placeholder {
  color: #9aacbf;
}

.ai-phone-input.ai-demo-form button {
  border: 0;
  width: 34px;
  height: 34px;
  flex: 0 0 34px;
  border-radius: 50%;
  background: linear-gradient(135deg, #0087ff, #02dd02);
  color: #fff;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 14px;
  font-weight: 900;
  cursor: pointer;
  box-shadow: 0 10px 22px rgba(0, 135, 255, .20);
}

.ai-msg-cta {
  display: flex;
  flex-wrap: wrap;
  gap: 7px;
  margin-top: 10px;
}

.ai-msg-cta a {
  display: inline-flex;
  text-decoration: none;
  background: linear-gradient(135deg, rgba(0, 135, 255, .10), rgba(2, 221, 2, .10));
  color: #075ed6;
}

@media(max-width:720px) {
  .ai-phone-interactive .ai-chat-area {
    bottom: 72px;
  }

  .ai-quick-actions button {
    font-size: 10px;
    padding: 7px 9px;
  }
}

/* Melhorias visuais do chat interativo - Assistente IA */
.ai-phone-interactive{
  overflow: visible;
}

.ai-phone-interactive .ai-chat-area{
  background:
    radial-gradient(circle at 18% 8%, rgba(255,255,255,.92), transparent 28%),
    linear-gradient(180deg, rgba(232,242,255,.92), rgba(242,248,255,.98));
  border-radius: 0 0 34px 34px;
  padding: 14px 18px 18px;
}

.ai-chat-intro{
  width: 100%;
  display: flex;
  align-items: center;
  gap: 7px;
  background: rgba(255,255,255,.68);
  border: 1px solid rgba(0,135,255,.12);
  border-radius: 16px;
  padding: 9px 11px;
  box-shadow: 0 12px 28px rgba(37,91,150,.06);
  color: #18314f;
  font-size: 11px;
  line-height: 1.1;
  margin-bottom: 2px;
}

.ai-chat-intro strong{
  font-weight: 900;
}

.ai-chat-intro small{
  margin-left: auto;
  color: #6e849b;
  font-size: 9.5px;
  font-weight: 700;
}

.ai-chat-intro-dot{
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: #02dd02;
  box-shadow: 0 0 0 5px rgba(2,221,2,.10);
  flex: 0 0 auto;
}

.ai-msg{
  box-shadow: 0 12px 28px rgba(35,75,120,.08);
}

.ai-msg-left{
  border: 1px solid rgba(255,255,255,.75);
}

.ai-msg-right{
  background: linear-gradient(135deg, #d9ffd4, #c7fbd1);
  border: 1px solid rgba(2,221,2,.16);
}

.ai-quick-box{
  align-self: stretch;
  background: rgba(255,255,255,.58);
  border: 1px solid rgba(0,135,255,.10);
  border-radius: 18px;
  padding: 10px;
  margin: 0 0 2px;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.85), 0 12px 24px rgba(37,91,150,.04);
}

.ai-quick-title{
  margin: 0 0 8px;
  color: #334a63;
  letter-spacing: .04em;
  text-transform: uppercase;
}

.ai-quick-actions{
  max-width: 100%;
  gap: 7px;
  margin: 0;
}

.ai-quick-actions button{
  background: #fff;
  border-color: rgba(0,135,255,.16);
  color: #17304f;
  padding: 8px 10px;
}

.ai-quick-actions button::before{
  content: '💬';
  margin-right: 4px;
  font-size: 10px;
}

.ai-quick-actions button:hover{
  color: #006cff;
  box-shadow: 0 10px 20px rgba(0,135,255,.10);
}

.ai-demo-hint{
  color: #35536f;
  border-color: rgba(0,135,255,.14);
}

.ai-phone-input.ai-demo-form{
  left: 18px;
  right: 18px;
  bottom: 18px;
  height: 54px;
  padding: 0 8px 0 17px;
  border-radius: 22px;
  border: 1px solid rgba(0,135,255,.13);
  background: rgba(255,255,255,.94);
  box-shadow: 0 16px 34px rgba(37,91,150,.13);
}

.ai-phone-input.ai-demo-form:focus-within{
  border-color: rgba(0,135,255,.38);
  box-shadow: 0 18px 38px rgba(0,135,255,.16);
}

.ai-phone-input.ai-demo-form button{
  width: 38px;
  height: 38px;
  flex-basis: 38px;
  font-size: 15px;
  transform: rotate(-12deg);
}

.ai-phone-input.ai-demo-form button:hover{
  transform: rotate(-12deg) translateY(-1px);
}

.ai-msg-cta{
  width: 100%;
}

.ai-msg-cta a{
  border-radius: 12px;
  padding: 9px 11px;
  background: linear-gradient(135deg, #0087ff, #02dd02);
  color: #fff;
  border: 0;
  box-shadow: 0 10px 22px rgba(0,135,255,.16);
}

.ai-msg-cta a:first-child{
  background: #fff;
  color: #006cff;
  border: 1px solid rgba(0,135,255,.16);
  box-shadow: none;
}

.ai-msg-typing{
  box-shadow: 0 10px 24px rgba(35,75,120,.08);
}

@media(max-width:720px){
  .ai-chat-intro{
    align-items:flex-start;
  }
  .ai-chat-intro small{
    display:none;
  }
  .ai-phone-input.ai-demo-form{
    left: 14px;
    right: 14px;
  }
}


/* =========================================================
   Assistente IA — Hero premium + chat interativo melhorado
   Ajuste pontual da página assistente-ia.html
   ========================================================= */

.ai-hero-premium{
  grid-template-columns:minmax(0, .92fr) minmax(460px, 1.08fr);
  align-items:center;
  gap:58px;
  min-height:820px;
  position:relative;
  padding:24px 0 42px;
}

.ai-hero-premium::before{
  content:'';
  position:absolute;
  inset:-80px -120px auto auto;
  width:520px;
  height:520px;
  background:
    repeating-linear-gradient(135deg, rgba(2,221,2,.14) 0 1px, transparent 1px 30px);
  opacity:.65;
  mask-image:linear-gradient(90deg, transparent 0%, #000 35%, #000 100%);
  pointer-events:none;
  z-index:0;
}

.ai-hero-copy-premium,
.ai-hero-demo-premium{
  position:relative;
  z-index:1;
}

.ai-pill-green{
  background:rgba(2,221,2,.07);
  border:1px solid rgba(2,221,2,.22);
  color:#008747;
  text-transform:none;
  letter-spacing:.02em;
  font-size:14px;
  padding:9px 17px;
  margin-bottom:30px;
}

.ai-pill-green span{
  width:9px;
  height:9px;
  border-radius:50%;
  background:#02dd02;
  display:inline-block;
  margin-right:10px;
  box-shadow:0 0 0 5px rgba(2,221,2,.10);
}

.ai-hero-copy-premium .hero-multi-style{
  font-size:clamp(44px, 5.2vw, 66px);
  line-height:.98;
  max-width:620px;
  margin-bottom:28px;
}

.ai-hero-copy-premium .hero-green{
  display:block;
  color:#02dd02;
}

.ai-hero-copy-premium .hero-blue{
  display:block;
  color:#087cff;
}

.ai-hero-copy-premium p{
  max-width:560px;
  font-size:20px;
  line-height:1.55;
  color:#456078;
  margin-bottom:30px;
}

.ai-hero-actions-premium{
  gap:18px;
  margin-bottom:18px;
}

.ai-hero-actions-premium .ai-primary-btn{
  min-width:300px;
  border-radius:12px;
  background:linear-gradient(135deg,#0087ff 0%,#02dd02 100%);
  box-shadow:0 20px 42px rgba(0,135,255,.18);
}

.ai-hero-actions-premium .ai-primary-btn span{
  width:28px;
  height:28px;
  border-radius:50%;
  background:#fff;
  color:#08a845;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  font-weight:900;
  font-size:14px;
}

.ai-link-btn-premium{
  min-height:58px;
  min-width:235px;
  justify-content:center;
  border:1px solid rgba(2,150,80,.28);
  border-radius:12px;
  background:#fff;
  color:#087747;
  font-weight:800;
}

.ai-link-btn-premium:hover{
  border-color:#02dd02;
  color:#00a944;
  background:rgba(2,221,2,.045);
}

.ai-hero-mini-trust{
  display:flex;
  align-items:center;
  flex-wrap:wrap;
  gap:18px;
  margin:0 0 44px;
  color:#31516f;
  font-size:13px;
  font-weight:600;
}

.ai-hero-mini-trust span{
  display:inline-flex;
  align-items:center;
  gap:6px;
}

.ai-demo-callouts{
  display:grid;
  grid-template-columns:1fr;
  gap:24px;
  max-width:430px;
}

.ai-demo-callouts article{
  display:grid;
  grid-template-columns:56px 1fr;
  gap:18px;
  align-items:flex-start;
  position:relative;
}

.ai-demo-callouts article:not(:last-child)::after{
  content:'';
  position:absolute;
  left:205px;
  top:62px;
  width:88px;
  height:26px;
  border-bottom:1.5px dashed rgba(56,80,105,.38);
  border-radius:50%;
  transform:rotate(10deg);
  opacity:.7;
}

.ai-demo-callouts article:nth-child(even)::after{
  left:245px;
  width:74px;
  transform:rotate(-8deg);
}

.ai-demo-callouts article > span{
  width:44px;
  height:44px;
  border-radius:14px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  color:#02c947;
  font-size:28px;
  font-weight:900;
}

.ai-demo-callouts h3{
  font-size:18px;
  margin:0 0 6px;
  letter-spacing:-.01em;
}

.ai-demo-callouts p{
  font-size:15px;
  line-height:1.45;
  color:#415a73;
  margin:0;
}

.ai-hero-demo-premium{
  display:flex;
  align-items:center;
  justify-content:center;
  min-height:760px;
}

.ai-phone-premium{
  width:min(520px, 100%);
  height:760px;
  border:7px solid #151b22;
  border-radius:42px;
  background:#fbf7f1;
  box-shadow:
    0 34px 90px rgba(18,55,90,.20),
    0 0 0 7px rgba(255,255,255,.75);
  overflow:hidden;
}

.ai-phone-premium::before{
  content:'';
  position:absolute;
  inset:132px 0 0;
  background:
    radial-gradient(circle at 18px 18px, rgba(18,32,51,.035) 0 1px, transparent 1px 16px),
    linear-gradient(180deg,rgba(255,255,255,.80),rgba(245,249,252,.55));
  opacity:.9;
  pointer-events:none;
}

.ai-phone-status{
  height:36px;
  background:linear-gradient(135deg,#132336,#1b3547);
  color:#fff;
  padding:0 24px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  font-size:13px;
  font-weight:800;
  position:relative;
  z-index:3;
}

.ai-phone-premium .ai-phone-head{
  height:96px;
  grid-template-columns:28px 52px 1fr 28px;
  background:linear-gradient(135deg,#152637,#203c50);
  color:#fff;
  padding:0 24px 14px;
  position:relative;
  z-index:3;
}

.ai-phone-premium .ai-back{
  color:#fff;
  font-size:34px;
  font-weight:600;
}

.ai-phone-premium .ai-bot-avatar{
  width:52px;
  height:52px;
  background:#172536;
  box-shadow:inset 0 0 0 4px rgba(255,255,255,.34), 0 0 0 1px rgba(255,255,255,.18);
}

.ai-phone-premium .ai-bot-avatar::after{
  content:'';
  width:11px;
  height:11px;
  border-radius:50%;
  background:#21e980;
  box-shadow:0 0 0 5px rgba(33,233,128,.10);
}

.ai-phone-premium .ai-bot-avatar{
  font-size:0;
}

.ai-phone-premium .ai-phone-head strong{
  color:#fff;
  font-size:20px;
  letter-spacing:-.02em;
}

.ai-phone-premium .ai-phone-head span{
  color:#28e87d;
  font-size:14px;
  font-weight:700;
}

.ai-phone-premium .ai-phone-icons{
  color:#fff;
  font-size:24px;
  letter-spacing:0;
  text-align:center;
}

.ai-phone-premium .ai-chat-area{
  position:relative;
  z-index:2;
  height:calc(100% - 96px - 36px - 178px);
  overflow:auto;
  gap:13px;
  padding:22px 26px 18px;
  scrollbar-width:thin;
  scrollbar-color:rgba(0,135,255,.25) transparent;
}

.ai-phone-premium .ai-chat-area::-webkit-scrollbar{width:5px}
.ai-phone-premium .ai-chat-area::-webkit-scrollbar-thumb{background:rgba(0,135,255,.23);border-radius:20px}

.ai-phone-premium .ai-msg{
  max-width:78%;
  border-radius:16px;
  padding:16px 16px 24px;
  font-size:15px;
  line-height:1.42;
  box-shadow:0 10px 28px rgba(35,63,94,.09);
}

.ai-phone-premium .ai-msg-left{
  background:#fff;
  border-bottom-left-radius:5px;
}

.ai-phone-premium .ai-msg-right{
  background:#d9ffd5;
  border:1px solid rgba(29,210,55,.14);
  border-bottom-right-radius:5px;
  color: var(--text);
}

.ai-chat-day{
  align-self:center;
  background:#fff;
  color:#39566d;
  border:1px solid rgba(25,55,80,.08);
  border-radius:999px;
  padding:5px 14px;
  font-size:12px;
  font-weight:800;
  box-shadow:0 5px 14px rgba(33,70,110,.07);
}

.ai-phone-premium .ai-phone-input.ai-demo-form{
  height:178px;
  left:26px;
  right:26px;
  bottom:18px;
  padding:0;
  border:0;
  background:transparent;
  box-shadow:none;
  display:block;
  z-index:5;
}

.ai-suggestions-panel{
  background:rgba(255,255,255,.94);
  border:1px solid rgba(18,64,104,.10);
  border-radius:18px 18px 12px 12px;
  padding:14px 14px 12px;
  box-shadow:0 14px 34px rgba(30,65,105,.13);
  transform:translateY(6px);
  opacity:0;
  pointer-events:none;
  max-height:0;
  overflow:hidden;
  transition:opacity .28s ease, transform .28s ease, max-height .28s ease, padding .28s ease;
}

.ai-demo-form.suggestions-open .ai-suggestions-panel{
  opacity:1;
  pointer-events:auto;
  max-height:142px;
  transform:translateY(0);
  padding:14px 14px 12px;
}

.ai-suggestions-head{
  display:flex;
  align-items:center;
  gap:9px;
  color:#20364e;
  font-size:13px;
  margin-bottom:10px;
}

.ai-suggestions-head span{
  color:#0fbd57;
  font-size:18px;
}

.ai-suggestions-head strong{
  flex:1;
  font-family:'Outfit',sans-serif;
  letter-spacing:-.01em;
}

.ai-suggestions-head button{
  border:0;
  background:transparent;
  color:#19364f;
  font-size:16px;
  cursor:pointer;
}

.ai-suggestions-grid{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:8px;
}

.ai-suggestions-grid button{
  border:1px solid rgba(14,71,112,.11);
  background:#fff;
  color:#2f4660;
  border-radius:999px;
  min-height:38px;
  padding:0 12px;
  font-family:'DM Sans',sans-serif;
  font-size:13px;
  font-weight:800;
  cursor:pointer;
  box-shadow:0 6px 15px rgba(33,70,110,.05);
  transition:.25s ease;
}

.ai-suggestions-grid button:hover{
  transform:translateY(-1px);
  color:#008747;
  border-color:rgba(2,221,2,.24);
}

.ai-input-row{
  height:58px;
  display:flex;
  align-items:center;
  gap:10px;
  padding:0 8px 0 15px;
  border:1px solid rgba(18,64,104,.12);
  border-radius:999px;
  background:#fff;
  box-shadow:0 12px 30px rgba(33,70,110,.12);
}

.ai-demo-form.suggestions-open .ai-input-row{
  border-top-left-radius:12px;
  border-top-right-radius:12px;
}

.ai-input-emoji{
  color:#9aaabb;
  font-size:20px;
}

.ai-input-row input{
  flex:1;
  border:0;
  outline:0;
  min-width:0;
  height:100%;
  color:#172f49;
  font-size:15px;
  background:transparent;
  font-family:'DM Sans',sans-serif;
}

.ai-input-row input::placeholder{
  color:#a2afbd;
}

.ai-input-row button{
  width:46px;
  height:46px;
  flex:0 0 46px;
  border-radius:50%;
  border:0;
  background:linear-gradient(135deg,#16b8a7,#02d454);
  color:#fff;
  font-size:20px;
  font-weight:900;
  cursor:pointer;
  transform:rotate(-8deg);
  box-shadow:0 12px 22px rgba(2,199,85,.24);
  transition:.25s ease;
}

.ai-input-row button:hover{
  transform:rotate(-8deg) translateY(-1px);
}

.ai-powered{
  margin-top:9px;
  text-align:center;
  color:#486078;
  font-size:11px;
  font-weight:800;
}

.ai-floating-robot-premium{
  right:-38px;
  top:330px;
  width:176px;
  height:260px;
  z-index:6;
  filter:drop-shadow(0 26px 32px rgba(20,80,130,.18));
}

.ai-floating-robot-premium .ai-robot-head{
  background:linear-gradient(180deg,#ffffff,#dff3ff);
  transform:rotate(8deg);
}

.ai-floating-robot-premium .ai-robot-head span::before{
  content:'⌒  ⌒';
  color:#22ef82;
  font-size:31px;
  letter-spacing:5px;
}

.ai-floating-robot-premium .ai-robot-head::before,
.ai-floating-robot-premium .ai-robot-head::after{
  background:#c7dceb;
}

.ai-floating-robot-premium .ai-robot-body{
  width:102px;
  height:116px;
  background:linear-gradient(180deg,#f7fcff,#e2f3ff);
}

.ai-floating-robot-premium .ai-robot-body::before{
  background:#27d267;
  box-shadow:inset 0 0 0 9px rgba(255,255,255,.65),0 10px 22px rgba(39,210,103,.18);
}

.ai-benefit-cards{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:16px;
  margin:-10px 0 72px;
}

.ai-benefit-cards article{
  display:flex;
  align-items:center;
  gap:14px;
  min-height:92px;
  border:1px solid rgba(18,64,104,.10);
  background:rgba(255,255,255,.78);
  border-radius:14px;
  padding:18px 22px;
  box-shadow:0 18px 45px rgba(35,63,94,.05);
}

.ai-benefit-cards span{
  width:42px;
  height:42px;
  border-radius:13px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  color:#02c947;
  font-size:26px;
  font-weight:900;
}

.ai-benefit-cards h3{
  font-size:17px;
  margin:0 0 2px;
}

.ai-benefit-cards p{
  margin:0;
  color:#5a7086;
  font-size:14px;
  line-height:1.3;
}

.ai-msg-cta{
  display:flex;
  gap:8px;
  margin-top:12px;
  flex-wrap:wrap;
}

.ai-msg-cta a{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:34px;
  padding:0 14px;
  border-radius:999px;
  background:#0087ff;
  color:#fff;
  text-decoration:none;
  font-size:12px;
  font-weight:800;
}

.ai-msg-cta a.secondary{
  background:rgba(2,221,2,.11);
  color:#008747;
}

.ai-msg-typing{
  width:70px;
  display:flex;
  gap:5px;
  padding:13px 16px;
}

.ai-msg-typing i{
  width:7px;
  height:7px;
  border-radius:50%;
  background:#7d93a8;
  animation:aiTypingDot 1s infinite ease-in-out;
}

.ai-msg-typing i:nth-child(2){animation-delay:.12s}
.ai-msg-typing i:nth-child(3){animation-delay:.24s}

@keyframes aiTypingDot{
  0%,80%,100%{opacity:.35;transform:translateY(0)}
  40%{opacity:1;transform:translateY(-4px)}
}

@media (max-width: 1080px){
  .ai-hero-premium{
    grid-template-columns:1fr;
    gap:36px;
    min-height:auto;
  }

  .ai-hero-demo-premium{
    min-height:auto;
  }

  .ai-demo-callouts{
    grid-template-columns:repeat(2,1fr);
    max-width:none;
  }

  .ai-demo-callouts article:not(:last-child)::after{
    display:none;
  }

  .ai-benefit-cards{
    grid-template-columns:repeat(2,1fr);
  }

  .ai-floating-robot-premium{
    right:calc(50% - 330px);
  }
}

@media (max-width: 680px){
  .ai-hero-premium{
    padding-top:0;
  }

  .ai-hero-copy-premium .hero-multi-style{
    font-size:clamp(38px, 13vw, 52px);
  }

  .ai-hero-actions-premium .ai-primary-btn,
  .ai-link-btn-premium{
    width:100%;
    min-width:0;
  }

  .ai-demo-callouts,
  .ai-benefit-cards{
    grid-template-columns:1fr;
  }

  .ai-phone-premium{
    height:720px;
    border-radius:34px;
  }

  .ai-phone-premium .ai-chat-area{
    padding:18px 16px;
  }

  .ai-phone-premium .ai-msg{
    max-width:88%;
    font-size:14px;
  }

  .ai-suggestions-grid{
    grid-template-columns:1fr;
  }

  .ai-demo-form.suggestions-open .ai-suggestions-panel{
    max-height:222px;
  }

  .ai-floating-robot-premium{
    display:none;
  }
}

/* =========================================================
   Ajuste pontual — Assistente IA hero mais compacto
   Base: Arquivo(56).zip
   Objetivo: reduzir topo sem alterar estrutura/chat existente
   ========================================================= */
.ai-page-v2{
  padding-top:calc(var(--nav-h) + 58px);
}

.ai-hero-premium{
  grid-template-columns:minmax(0,.92fr) minmax(390px,.92fr);
  gap:42px;
  min-height:620px;
  padding:8px 0 26px;
  margin-bottom:22px;
}

.ai-hero-premium::before{
  width:430px;
  height:430px;
  inset:-70px -90px auto auto;
  opacity:.48;
}

.ai-pill-green{
  font-size:12px;
  padding:7px 14px;
  margin-bottom:20px;
}

.ai-hero-copy-premium .hero-multi-style{
  font-size:clamp(40px,4.15vw,54px);
  line-height:1.02;
  max-width:520px;
  margin-bottom:20px;
}

.ai-hero-copy-premium p{
  max-width:500px;
  font-size:17px;
  line-height:1.52;
  margin-bottom:22px;
}

.ai-hero-actions-premium{
  gap:14px;
  margin-bottom:14px;
}

.ai-hero-actions-premium .ai-primary-btn,
.ai-link-btn-premium{
  min-height:52px;
  min-width:220px;
  padding-left:22px;
  padding-right:22px;
}

.ai-hero-actions-premium .ai-primary-btn span{
  width:24px;
  height:24px;
}

.ai-hero-mini-trust{
  gap:12px;
  margin-bottom:24px;
  font-size:12px;
}

.ai-demo-callouts{
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:16px 20px;
  max-width:560px;
}

.ai-demo-callouts article{
  grid-template-columns:36px 1fr;
  gap:12px;
}

.ai-demo-callouts article:not(:last-child)::after{
  display:none;
}

.ai-demo-callouts article > span{
  width:34px;
  height:34px;
  border-radius:11px;
  font-size:22px;
}

.ai-demo-callouts h3{
  font-size:16px;
  margin-bottom:3px;
}

.ai-demo-callouts p{
  font-size:13px;
  line-height:1.38;
}

.ai-hero-demo-premium{
  min-height:620px;
}

.ai-phone-premium{
  width:min(430px,100%);
  height:620px;
  border-width:6px;
  border-radius:38px;
}

.ai-phone-status{
  height:30px;
  padding:0 20px;
  font-size:12px;
}

.ai-phone-premium .ai-phone-head{
  height:80px;
  grid-template-columns:24px 44px 1fr 24px;
  gap:10px;
  padding:0 20px 10px;
}

.ai-phone-premium .ai-bot-avatar{
  width:44px;
  height:44px;
}

.ai-phone-premium .ai-phone-head strong{
  font-size:17px;
}

.ai-phone-premium .ai-phone-head span{
  font-size:12px;
}

.ai-phone-premium::before{
  inset:110px 0 0;
}

.ai-phone-premium .ai-chat-area{
  height:calc(100% - 80px - 30px - 146px);
  gap:10px;
  padding:16px 20px 12px;
}

.ai-phone-premium .ai-msg{
  max-width:82%;
  font-size:13px;
  line-height:1.38;
  padding:13px 14px 22px;
  border-radius:14px;
}

.ai-chat-day{
  padding:4px 12px;
  font-size:11px;
}

.ai-phone-premium .ai-phone-input.ai-demo-form{
  height:146px;
  left:20px;
  right:20px;
  bottom:14px;
}

.ai-demo-form.suggestions-open .ai-suggestions-panel{
  max-height:118px;
}

.ai-suggestions-panel{
  border-radius:16px 16px 10px 10px;
  padding:10px 12px 9px;
}

.ai-demo-form.suggestions-open .ai-suggestions-panel{
  padding:10px 12px 9px;
}

.ai-suggestions-head{
  font-size:12px;
  margin-bottom:8px;
}

.ai-suggestions-grid{
  gap:7px;
}

.ai-suggestions-grid button{
  min-height:32px;
  font-size:12px;
  padding:0 10px;
}

.ai-input-row{
  height:50px;
  padding-left:13px;
}

.ai-input-row input{
  font-size:14px;
}

.ai-input-row button{
  width:40px;
  height:40px;
  flex-basis:40px;
  font-size:17px;
}

.ai-powered{
  margin-top:7px;
  font-size:10px;
}

.ai-floating-robot-premium{
  width:132px;
  height:198px;
  right:-30px;
  top:282px;
}

.ai-floating-robot-premium .ai-robot-head{
  height:82px;
  border-radius:44px;
}

.ai-floating-robot-premium .ai-robot-head span{
  width:74px;
  height:46px;
  border-radius:20px;
}

.ai-floating-robot-premium .ai-robot-head span::before{
  font-size:24px;
  letter-spacing:4px;
}

.ai-floating-robot-premium .ai-robot-head::before,
.ai-floating-robot-premium .ai-robot-head::after{
  top:36px;
  width:20px;
  height:40px;
}

.ai-floating-robot-premium .ai-robot-body{
  width:78px;
  height:88px;
}

.ai-floating-robot-premium .ai-robot-body::before{
  width:42px;
  height:42px;
  box-shadow:inset 0 0 0 7px rgba(255,255,255,.65),0 8px 18px rgba(39,210,103,.16);
}

.ai-benefit-cards{
  margin:-2px 0 54px;
}

@media (max-width:1080px){
  .ai-page-v2{
    padding-top:calc(var(--nav-h) + 46px);
  }
  .ai-hero-premium{
    grid-template-columns:1fr;
    min-height:auto;
    gap:30px;
  }
  .ai-hero-demo-premium{
    min-height:auto;
  }
  .ai-phone-premium{
    width:min(430px,100%);
  }
  .ai-floating-robot-premium{
    right:calc(50% - 270px);
    top:260px;
  }
}

@media (max-width:680px){
  .ai-page-v2{
    padding-top:calc(var(--nav-h) + 34px);
  }
  .ai-hero-copy-premium .hero-multi-style{
    font-size:clamp(34px,10vw,44px);
  }
  .ai-hero-copy-premium p{
    font-size:15px;
  }
  .ai-demo-callouts{
    grid-template-columns:1fr;
  }
  .ai-phone-premium{
    height:660px;
  }
  .ai-phone-premium .ai-chat-area{
    height:calc(100% - 80px - 30px - 146px);
    padding:14px 14px 10px;
  }
  .ai-demo-form.suggestions-open .ai-suggestions-panel{
    max-height:204px;
  }
  .ai-suggestions-grid{
    grid-template-columns:1fr;
  }
}


/* Fixes chat IA premium */
.ai-phone-premium{height:680px!important;}
.ai-phone-screen{padding-top:16px!important;}
.ai-chat-area{padding-bottom:140px!important;}
.ai-phone-input.ai-demo-form{
position:absolute;left:12px;right:12px;bottom:12px;height:auto!important;
background:transparent!important;padding:0!important;display:block!important;
}
.ai-suggestions-panel{
position:relative!important;
max-height:0;
}
.ai-suggestions-panel.open{
max-height:220px!important;
margin-bottom:10px;
}
.ai-suggestions-grid{
display:grid!important;
grid-template-columns:1fr 1fr!important;
gap:10px!important;
}
.ai-suggestions-grid button{
font-size:14px!important;
padding:12px 14px!important;
white-space:nowrap;
overflow:hidden;
text-overflow:ellipsis;
}
.ai-input-row{position:relative;z-index:5;}


/* =========================================================
   AJUSTE DEFINITIVO — Assistente IA hero/celular
   Objetivo: reproduzir o print aprovado, sem espaço no topo/rodapé
   e sem sobreposição das sugestões.
   ========================================================= */

.ai-page-v2{
  padding-top:calc(var(--nav-h) + 78px) !important;
}

.ai-hero-v2.ai-hero-premium{
  grid-template-columns:minmax(0, 1fr) minmax(430px, 520px) !important;
  align-items:center !important;
  gap:58px !important;
  min-height:680px !important;
  padding:12px 0 28px !important;
  margin-bottom:22px !important;
}

.ai-hero-copy-premium .hero-multi-style{
  font-size:clamp(30px, 4.55vw, 42px) !important;
  line-height:1.02 !important;
  max-width:660px !important;
  margin-bottom:22px !important;
}

.ai-hero-copy-premium p{
  font-size:18px !important;
  line-height:1.55 !important;
  max-width:560px !important;
  margin-bottom:22px !important;
}

.ai-pill-green{
  margin-bottom:24px !important;
}

.ai-hero-actions-premium{
  margin-bottom:16px !important;
}

.ai-hero-actions-premium .ai-primary-btn{
  min-width:260px !important;
  min-height:54px !important;
  padding:0 22px !important;
}

.ai-link-btn-premium{
  min-width:210px !important;
  min-height:54px !important;
}

.ai-hero-mini-trust{
  margin-bottom:30px !important;
}

.ai-demo-callouts{
  grid-template-columns:1fr 1fr !important;
  gap:28px 36px !important;
  max-width:650px !important;
}

.ai-demo-callouts article{
  grid-template-columns:44px 1fr !important;
  gap:14px !important;
}

.ai-demo-callouts article::after{
  display:none !important;
}

.ai-demo-callouts article > span{
  width:38px !important;
  height:38px !important;
  font-size:26px !important;
}

.ai-demo-callouts h3{
  font-size:17px !important;
  margin-bottom:4px !important;
}

.ai-demo-callouts p{
  font-size:14px !important;
  line-height:1.38 !important;
}

.ai-hero-demo-premium{
  min-height:640px !important;
  align-items:center !important;
}

.ai-phone.ai-phone-premium{
  width:430px !important;
  height:610px !important;
  border:7px solid #151b22 !important;
  border-radius:38px !important;
  background:#f3f7fb !important;
  display:flex !important;
  flex-direction:column !important;
  overflow:hidden !important;
  box-shadow:
    0 28px 80px rgba(18,55,90,.18),
    0 0 0 7px rgba(255,255,255,.72) !important;
}

.ai-phone.ai-phone-premium::before{
  inset:108px 0 0 !important;
  background:
    radial-gradient(circle at 14px 14px, rgba(18,32,51,.035) 0 1px, transparent 1px 15px),
    linear-gradient(180deg,rgba(255,255,255,.86),rgba(236,246,255,.70)) !important;
  opacity:1 !important;
}

.ai-phone-premium .ai-phone-status{
  height:30px !important;
  flex:0 0 30px !important;
  padding:0 22px !important;
  background:linear-gradient(135deg,#0f2234,#1b3547) !important;
  font-size:13px !important;
}

.ai-phone-premium .ai-phone-head{
  height:78px !important;
  flex:0 0 78px !important;
  display:grid !important;
  grid-template-columns:24px 46px 1fr 24px !important;
  gap:12px !important;
  align-items:center !important;
  padding:0 22px 10px !important;
  background:linear-gradient(135deg,#0f2234,#1b3547) !important;
}

.ai-phone-premium .ai-back{
  font-size:30px !important;
}

.ai-phone-premium .ai-bot-avatar{
  width:46px !important;
  height:46px !important;
}

.ai-phone-premium .ai-phone-head strong{
  font-size:18px !important;
}

.ai-phone-premium .ai-phone-head span{
  font-size:13px !important;
}

.ai-phone-premium .ai-chat-area{
  flex:1 1 auto !important;
  height:auto !important;
  min-height:0 !important;
  overflow:hidden !important;
  padding:18px 20px 12px !important;
  display:flex !important;
  flex-direction:column !important;
  gap:14px !important;
  position:relative !important;
  z-index:2 !important;
}

.ai-phone-premium .ai-msg{
  max-width:82% !important;
  border-radius:15px !important;
  padding:13px 14px 23px !important;
  font-size:13px !important;
  line-height:1.38 !important;
  box-shadow:0 10px 26px rgba(35,63,94,.08) !important;
}

.ai-phone-premium .ai-msg-left{
  align-self:flex-start !important;
  background:#fff !important;
  border-bottom-left-radius:5px !important;
}

.ai-phone-premium .ai-msg-right{
  align-self:flex-end !important;
  background:#d9ffd5 !important;
  border:1px solid rgba(29,210,55,.14) !important;
  border-bottom-right-radius:5px !important;
}

.ai-phone-premium .ai-msg small{
  font-size:10px !important;
  right:10px !important;
  bottom:5px !important;
}

.ai-phone-premium .ai-phone-input.ai-demo-form{
  position:relative !important;
  left:auto !important;
  right:auto !important;
  bottom:auto !important;
  flex:0 0 auto !important;
  width:auto !important;
  height:auto !important;
  margin:0 18px 0 !important;
  padding:0 !important;
  border:0 !important;
  border-radius:0 !important;
  background:transparent !important;
  display:block !important;
  box-shadow:none !important;
  overflow:visible !important;
  z-index:4 !important;
}

.ai-suggestions-panel,
.ai-demo-form.suggestions-open .ai-suggestions-panel,
.ai-suggestions-panel.open{
  display:block !important;
  opacity:1 !important;
  pointer-events:auto !important;
  max-height:none !important;
  overflow:visible !important;
  transform:none !important;
  padding:12px 12px 11px !important;
  background:rgba(255,255,255,.96) !important;
  border:1px solid rgba(18,64,104,.10) !important;
  border-radius:16px 16px 10px 10px !important;
  box-shadow:0 12px 26px rgba(30,65,105,.10) !important;
}

.ai-suggestions-head{
  display:flex !important;
  align-items:center !important;
  gap:8px !important;
  margin:0 0 9px !important;
  font-size:12px !important;
  line-height:1.2 !important;
}

.ai-suggestions-head span{
  font-size:17px !important;
  flex:0 0 auto !important;
}

.ai-suggestions-head strong{
  font-size:12px !important;
  font-weight:800 !important;
  white-space:normal !important;
}

.ai-suggestions-head button{
  width:26px !important;
  height:26px !important;
  border-radius:50% !important;
  background:#fff !important;
  border:1px solid rgba(18,64,104,.11) !important;
  box-shadow:0 4px 12px rgba(30,65,105,.08) !important;
  font-size:13px !important;
  line-height:1 !important;
  flex:0 0 26px !important;
}

.ai-suggestions-grid{
  display:grid !important;
  grid-template-columns:1fr 1fr !important;
  gap:7px !important;
}

.ai-suggestions-grid button{
  min-height:37px !important;
  border-radius:11px !important;
  padding:0 8px !important;
  background:#fff !important;
  color:#2f4660 !important;
  border:1px solid rgba(14,71,112,.12) !important;
  font-size:12px !important;
  font-weight:800 !important;
  line-height:1.15 !important;
  white-space:nowrap !important;
  overflow:hidden !important;
  text-overflow:ellipsis !important;
  transform:none !important;
}

.ai-input-row{
  height:52px !important;
  margin-top:0 !important;
  display:flex !important;
  align-items:center !important;
  gap:9px !important;
  padding:0 7px 0 13px !important;
  border:1px solid rgba(18,64,104,.12) !important;
  border-top:0 !important;
  border-radius:0 0 16px 16px !important;
  background:#fff !important;
  box-shadow:0 12px 24px rgba(33,70,110,.10) !important;
}

.ai-demo-form.suggestions-open .ai-input-row{
  border-top-left-radius:0 !important;
  border-top-right-radius:0 !important;
}

.ai-input-emoji{
  font-size:18px !important;
}

.ai-input-row input{
  font-size:13px !important;
}

.ai-input-row button{
  width:42px !important;
  height:42px !important;
  flex:0 0 42px !important;
  font-size:18px !important;
}

.ai-powered{
  flex:0 0 auto !important;
  margin:9px 0 12px !important;
  text-align:center !important;
  font-size:11px !important;
  line-height:1.1 !important;
  color:#425b73 !important;
}

.ai-floating-robot-premium{
  right:-50px !important;
  top:306px !important;
  width:150px !important;
  height:220px !important;
  z-index:6 !important;
}

.ai-floating-robot-premium .ai-robot-head{
  height:88px !important;
}

.ai-floating-robot-premium .ai-robot-head span{
  width:78px !important;
  height:50px !important;
}

.ai-floating-robot-premium .ai-robot-head span::before{
  font-size:25px !important;
}

.ai-floating-robot-premium .ai-robot-head::before,
.ai-floating-robot-premium .ai-robot-head::after{
  top:38px !important;
  width:20px !important;
  height:42px !important;
}

.ai-floating-robot-premium .ai-robot-body{
  width:86px !important;
  height:100px !important;
}

.ai-floating-robot-premium .ai-robot-body::before{
  width:48px !important;
  height:48px !important;
}

.ai-benefit-cards{
  margin-top:0 !important;
}

@media(max-width:1100px){
  .ai-hero-v2.ai-hero-premium{
    grid-template-columns:1fr !important;
    gap:34px !important;
  }
  .ai-hero-demo-premium{
    min-height:620px !important;
  }
  .ai-phone.ai-phone-premium{
    width:min(430px, 92vw) !important;
  }
  .ai-floating-robot-premium{
    right:max(0px, calc(50% - 260px)) !important;
  }
}

@media(max-width:720px){
  .ai-hero-copy-premium .hero-multi-style{
    font-size:clamp(34px, 11vw, 46px) !important;
  }
  .ai-demo-callouts{
    grid-template-columns:1fr !important;
  }
  .ai-phone.ai-phone-premium{
    height:600px !important;
    border-radius:34px !important;
  }
  .ai-suggestions-grid button{
    font-size:11px !important;
  }
}



/* =========================================================
   AJUSTE DEFINITIVO — Celular Assistente IA
   Foco: remover espaços no topo/rodapé, corrigir sugestões e manter o visual do print aprovado.
   ========================================================= */
.ai-hero-demo-premium{
  min-height:620px !important;
}

.ai-phone.ai-phone-premium{
  width:430px !important;
  height:610px !important;
  max-width:100% !important;
  position:relative !important;
  display:block !important;
  overflow:hidden !important;
  border:7px solid #141b22 !important;
  border-radius:38px !important;
  background:#eef6ff !important;
  box-shadow:0 28px 80px rgba(17,48,80,.18),0 0 0 7px rgba(255,255,255,.72) !important;
}

.ai-phone.ai-phone-premium::before{
  content:"" !important;
  position:absolute !important;
  top:108px !important;
  left:0 !important;
  right:0 !important;
  bottom:0 !important;
  inset:108px 0 0 0 !important;
  background:
    radial-gradient(circle at 18px 18px, rgba(16,32,51,.035) 0 1px, transparent 1px 15px),
    linear-gradient(180deg,rgba(255,255,255,.92),rgba(235,246,255,.78)) !important;
  opacity:1 !important;
  z-index:0 !important;
}

.ai-phone-premium .ai-phone-status{
  position:absolute !important;
  top:0 !important;
  left:0 !important;
  right:0 !important;
  height:30px !important;
  display:flex !important;
  align-items:center !important;
  justify-content:space-between !important;
  padding:0 22px !important;
  background:linear-gradient(135deg,#0e2234,#1c3548) !important;
  color:#fff !important;
  font-size:13px !important;
  font-weight:800 !important;
  line-height:1 !important;
  z-index:4 !important;
}

.ai-phone-premium .ai-phone-head{
  position:absolute !important;
  left:0 !important;
  right:0 !important;
  height:78px !important;
  display:grid !important;
  grid-template-columns:24px 46px 1fr 24px !important;
  align-items:center !important;
  gap:12px !important;
  padding:0 22px 10px !important;
  margin:0 !important;
  background:linear-gradient(135deg,#0e2234,#1c3548) !important;
  color:#fff !important;
  z-index:4 !important;
}

.ai-phone-premium .ai-back{
  color:#fff !important;
  font-size:30px !important;
  font-weight:900 !important;
}

.ai-phone-premium .ai-bot-avatar{
  width:46px !important;
  height:46px !important;
  border-radius:50% !important;
  background:linear-gradient(135deg,#0f2032,#162f4a) !important;
  color:#20dd7a !important;
  box-shadow:0 0 0 5px rgba(255,255,255,.18),inset 0 0 0 5px rgba(255,255,255,.17) !important;
}

.ai-phone-premium .ai-phone-head strong{
  color:#fff !important;
  font-size:18px !important;
  line-height:1.1 !important;
}

.ai-phone-premium .ai-phone-head span{
  color:#24e87c !important;
  font-size:13px !important;
  font-weight:700 !important;
}

.ai-phone-premium .ai-phone-icons{
  color:#fff !important;
  font-size:26px !important;
  line-height:1 !important;
}

.ai-phone-premium .ai-chat-area{
  position:absolute !important;
  top:108px !important;
  left:0 !important;
  right:0 !important;
  bottom:190px !important;
  height:auto !important;
  min-height:0 !important;
  overflow:hidden !important;
  display:flex !important;
  flex-direction:column !important;
  justify-content:flex-start !important;
  align-items:stretch !important;
  gap:12px !important;
  padding:16px 18px 10px !important;
  margin:0 !important;
  background:transparent !important;
  z-index:2 !important;
}

.ai-phone-premium .ai-chat-day{display:none !important;}

.ai-phone-premium .ai-msg{
  max-width:82% !important;
  width:auto !important;
  margin:0 !important;
  border-radius:14px !important;
  padding:12px 13px 22px !important;
  font-size:12px !important;
  line-height:1.35 !important;
  color:#102b49 !important;
  box-shadow:0 10px 24px rgba(34,63,96,.08) !important;
  transform:none !important;
}

.ai-phone-premium .ai-msg-left{
  align-self:flex-start !important;
  background:#fff !important;
  border-bottom-left-radius:5px !important;
}

.ai-phone-premium .ai-msg-right{
  align-self:flex-end !important;
  background:#d9ffd5 !important;
  border:1px solid rgba(25,210,55,.14) !important;
  border-bottom-right-radius:5px !important;
}

.ai-phone-premium .ai-msg small{
  position:absolute !important;
  right:10px !important;
  bottom:5px !important;
  font-size:9px !important;
  color:#7891aa !important;
}

.ai-phone-premium .ai-phone-input.ai-demo-form{
  position:absolute !important;
  left:16px !important;
  right:16px !important;
  bottom:12px !important;
  height:auto !important;
  width:auto !important;
  margin:0 !important;
  padding:0 !important;
  display:block !important;
  background:transparent !important;
  border:0 !important;
  border-radius:0 !important;
  box-shadow:none !important;
  overflow:visible !important;
  z-index:5 !important;
}

.ai-suggestions-panel,
.ai-demo-form.suggestions-open .ai-suggestions-panel,
.ai-suggestions-panel.open{
  display:block !important;
  opacity:1 !important;
  visibility:visible !important;
  pointer-events:auto !important;
  transform:none !important;
  width:100% !important;
  max-width:100% !important;
  max-height:none !important;
  min-height:0 !important;
  overflow:hidden !important;
  box-sizing:border-box !important;
  padding:11px 12px 10px !important;
  margin:0 !important;
  background:rgba(255,255,255,.97) !important;
  border:1px solid rgba(18,64,104,.11) !important;
  border-bottom:0 !important;
  border-radius:16px 16px 0 0 !important;
  box-shadow:0 12px 26px rgba(30,65,105,.10) !important;
}

.ai-suggestions-head{
  display:flex !important;
  align-items:center !important;
  gap:7px !important;
  height:22px !important;
  margin:0 0 8px !important;
  padding:0 !important;
  color:#102b49 !important;
}

.ai-suggestions-head span{
  flex:0 0 auto !important;
  width:auto !important;
  height:auto !important;
  color:#11c957 !important;
  font-size:16px !important;
  line-height:1 !important;
  transform:none !important;
}

.ai-suggestions-head strong{
  flex:1 1 auto !important;
  min-width:0 !important;
  font-size:11px !important;
  line-height:1.15 !important;
  font-weight:900 !important;
  white-space:nowrap !important;
  overflow:hidden !important;
  text-overflow:ellipsis !important;
}

.ai-suggestions-head button{
  flex:0 0 25px !important;
  width:25px !important;
  height:25px !important;
  border-radius:50% !important;
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  margin:0 !important;
  padding:0 !important;
  background:#fff !important;
  border:1px solid rgba(18,64,104,.12) !important;
  color:#23435e !important;
  box-shadow:0 3px 10px rgba(30,65,105,.08) !important;
  font-size:12px !important;
  line-height:1 !important;
  transform:none !important;
}

.ai-suggestions-grid{
  display:grid !important;
  grid-template-columns:1fr 1fr !important;
  gap:7px !important;
  width:100% !important;
  min-width:0 !important;
  overflow:hidden !important;
}

.ai-suggestions-grid button{
  appearance:none !important;
  width:100% !important;
  min-width:0 !important;
  max-width:100% !important;
  min-height:34px !important;
  height:34px !important;
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  gap:4px !important;
  margin:0 !important;
  padding:0 7px !important;
  border-radius:10px !important;
  background:#fff !important;
  border:1px solid rgba(18,64,104,.12) !important;
  color:#28445e !important;
  box-shadow:none !important;
  font-size:10.5px !important;
  font-weight:800 !important;
  line-height:1 !important;
  white-space:nowrap !important;
  overflow:hidden !important;
  text-overflow:ellipsis !important;
  transform:none !important;
}

.ai-suggestions-grid button:hover{
  transform:none !important;
  border-color:rgba(0,135,255,.22) !important;
  background:#f9fdff !important;
}

.ai-input-row,
.ai-demo-form.suggestions-open .ai-input-row{
  position:relative !important;
  height:50px !important;
  min-height:50px !important;
  width:100% !important;
  box-sizing:border-box !important;
  display:flex !important;
  align-items:center !important;
  gap:8px !important;
  margin:0 !important;
  padding:0 7px 0 12px !important;
  background:#fff !important;
  border:1px solid rgba(18,64,104,.11) !important;
  border-radius:0 0 16px 16px !important;
  box-shadow:0 12px 26px rgba(33,70,110,.10) !important;
  overflow:hidden !important;
}

.ai-input-emoji{
  flex:0 0 auto !important;
  font-size:17px !important;
  color:#91a7ba !important;
}

.ai-input-row input{
  flex:1 1 auto !important;
  min-width:0 !important;
  height:100% !important;
  border:0 !important;
  outline:0 !important;
  background:transparent !important;
  color:#102b49 !important;
  font-size:12px !important;
  font-weight:600 !important;
}

.ai-input-row button{
  flex:0 0 39px !important;
  width:39px !important;
  height:39px !important;
  border:0 !important;
  border-radius:50% !important;
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  margin:0 !important;
  padding:0 !important;
  background:linear-gradient(135deg,#0087ff,#02dd02) !important;
  color:#fff !important;
  font-size:17px !important;
  line-height:1 !important;
  transform:none !important;
  box-shadow:0 8px 18px rgba(0,135,255,.18) !important;
}

.ai-powered{
  display:block !important;
  height:22px !important;
  margin:8px 0 0 !important;
  padding:0 !important;
  text-align:center !important;
  color:#405a72 !important;
  font-size:10.5px !important;
  font-weight:800 !important;
  line-height:22px !important;
}

.ai-floating-robot-premium{
  right:-48px !important;
  top:300px !important;
  width:145px !important;
  height:214px !important;
  z-index:6 !important;
}

@media(max-width:720px){
  .ai-phone.ai-phone-premium{
    width:min(430px,92vw) !important;
    height:600px !important;
  }
  .ai-suggestions-head strong{font-size:10.5px !important;}
  .ai-suggestions-grid button{font-size:10px !important;}
}


/* =========================================================
   AJUSTE FINAL — Sugestões só ao clicar no campo
   ========================================================= */
.ai-phone-premium .ai-chat-area{
  bottom:88px !important;
  padding-bottom:10px !important;
}
.ai-phone-premium:has(.ai-demo-form.suggestions-open) .ai-chat-area{
  bottom:190px !important;
}
.ai-phone-premium .ai-demo-form:not(.suggestions-open) .ai-suggestions-panel,
.ai-phone-premium .ai-demo-form:not(.suggestions-open) .ai-suggestions-panel.open{
  display:none !important;
  opacity:0 !important;
  visibility:hidden !important;
  pointer-events:none !important;
  max-height:0 !important;
  padding:0 !important;
  margin:0 !important;
  border:0 !important;
  box-shadow:none !important;
}
.ai-phone-premium .ai-demo-form.suggestions-open .ai-suggestions-panel{
  display:block !important;
  opacity:1 !important;
  visibility:visible !important;
  pointer-events:auto !important;
}
.ai-phone-premium .ai-demo-form:not(.suggestions-open) .ai-input-row{
  border-radius:16px !important;
  border-top:1px solid rgba(18,64,104,.11) !important;
}
.ai-phone-premium .ai-demo-form.suggestions-open .ai-input-row{
  border-radius:0 0 16px 16px !important;
  border-top:0 !important;
}
.ai-suggestions-grid button{
  cursor:pointer !important;
}

/* =========================================================
   Assistente IA — correção definitiva do celular interativo
   Base: Arquivo(60).zip
   Ajustes:
   - Conversa com scroll interno
   - Rodapé/campo fixo no fluxo do celular
   - Sugestões ocultas inicialmente
   - Sugestões abrem ao clicar no campo e fecham após escolha
   - Botão de fechar como X
   ========================================================= */

.ai-phone-premium.ai-phone-interactive{
  position:relative !important;
  display:flex !important;
  flex-direction:column !important;
  width:min(430px, 100%) !important;
  height:640px !important;
  min-height:640px !important;
  max-height:640px !important;
  overflow:hidden !important;
  border:7px solid #151b22 !important;
  border-radius:38px !important;
  background:#f3f8fc !important;
}

.ai-phone-premium.ai-phone-interactive::before{
  content:'' !important;
  position:absolute !important;
  inset:118px 0 0 !important;
  background:
    radial-gradient(circle at 18px 18px, rgba(18,32,51,.035) 0 1px, transparent 1px 16px),
    linear-gradient(180deg,rgba(255,255,255,.76),rgba(238,247,255,.75)) !important;
  opacity:.95 !important;
  pointer-events:none !important;
  z-index:0 !important;
}

.ai-phone-premium .ai-phone-status{
  flex:0 0 30px !important;
  height:30px !important;
  min-height:30px !important;
  padding:0 22px !important;
  position:relative !important;
  z-index:3 !important;
  background:linear-gradient(135deg,#132336,#1b3547) !important;
}

.ai-phone-premium .ai-phone-head{
  flex:0 0 88px !important;
  height:88px !important;
  min-height:88px !important;
  display:grid !important;
  grid-template-columns:26px 48px 1fr 26px !important;
  align-items:center !important;
  gap:14px !important;
  padding:0 22px 12px !important;
  margin:0 !important;
  position:relative !important;
  z-index:3 !important;
  background:linear-gradient(135deg,#152637,#203c50) !important;
  color:#fff !important;
}

.ai-phone-premium .ai-bot-avatar{
  width:48px !important;
  height:48px !important;
}

.ai-phone-premium .ai-phone-head strong{
  font-size:18px !important;
  line-height:1.05 !important;
}

.ai-phone-premium .ai-phone-head span{
  font-size:13px !important;
}

.ai-phone-premium .ai-chat-area{
  position:relative !important;
  z-index:2 !important;
  flex:1 1 auto !important;
  min-height:0 !important;
  height:auto !important;
  top:auto !important;
  left:auto !important;
  right:auto !important;
  bottom:auto !important;
  display:flex !important;
  flex-direction:column !important;
  align-items:stretch !important;
  justify-content:flex-start !important;
  gap:12px !important;
  margin:0 !important;
  padding:16px 18px 12px !important;
  overflow-y:auto !important;
  overflow-x:hidden !important;
  scroll-behavior:smooth !important;
  background:transparent !important;
}

.ai-phone-premium .ai-chat-area::-webkit-scrollbar{
  width:4px !important;
}
.ai-phone-premium .ai-chat-area::-webkit-scrollbar-track{
  background:transparent !important;
}
.ai-phone-premium .ai-chat-area::-webkit-scrollbar-thumb{
  background:rgba(24,55,84,.18) !important;
  border-radius:20px !important;
}

.ai-phone-premium .ai-msg{
  flex:0 0 auto !important;
  max-width:78% !important;
  min-width:0 !important;
  width:auto !important;
  margin:0 !important;
  padding:12px 13px 22px !important;
  border-radius:15px !important;
  font-size:12.5px !important;
  line-height:1.35 !important;
  color:#132b46 !important;
  box-sizing:border-box !important;
  overflow:visible !important;
  word-break:normal !important;
}

.ai-phone-premium .ai-msg-left{
  align-self:flex-start !important;
  background:#fff !important;
  border-top-left-radius:6px !important;
  box-shadow:0 10px 24px rgba(33,70,110,.08) !important;
}

.ai-phone-premium .ai-msg-right{
  align-self:flex-end !important;
  background:#d9ffd3 !important;
  border-top-right-radius:6px !important;
  box-shadow:0 8px 18px rgba(2,180,70,.10) !important;
}

.ai-phone-premium .ai-msg small{
  right:10px !important;
  bottom:5px !important;
  font-size:10px !important;
  color:#7f99b4 !important;
}

.ai-phone-premium .ai-msg-cta{
  margin-top:8px !important;
}

.ai-phone-premium .ai-msg-cta a{
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  min-height:30px !important;
  padding:7px 14px !important;
  border-radius:999px !important;
  background:#fff !important;
  border:1px solid rgba(0,135,255,.18) !important;
  color:#006cff !important;
  font-weight:800 !important;
  text-decoration:none !important;
  box-shadow:none !important;
}

.ai-phone-premium .ai-phone-input.ai-demo-form{
  position:relative !important;
  z-index:4 !important;
  flex:0 0 auto !important;
  left:auto !important;
  right:auto !important;
  bottom:auto !important;
  width:auto !important;
  height:auto !important;
  min-height:0 !important;
  margin:0 18px 12px !important;
  padding:0 !important;
  border:0 !important;
  border-radius:0 !important;
  background:transparent !important;
  box-shadow:none !important;
  display:block !important;
  overflow:visible !important;
}

/* painel fechado */
.ai-phone-premium .ai-demo-form:not(.suggestions-open) .ai-suggestions-panel,
.ai-phone-premium .ai-demo-form:not(.suggestions-open) .ai-suggestions-panel.open{
  display:none !important;
  opacity:0 !important;
  visibility:hidden !important;
  pointer-events:none !important;
  max-height:0 !important;
  padding:0 !important;
  margin:0 !important;
  border:0 !important;
  box-shadow:none !important;
}

/* painel aberto */
.ai-phone-premium .ai-demo-form.suggestions-open .ai-suggestions-panel{
  display:block !important;
  opacity:1 !important;
  visibility:visible !important;
  pointer-events:auto !important;
  position:relative !important;
  transform:none !important;
  max-height:none !important;
  width:100% !important;
  box-sizing:border-box !important;
  margin:0 !important;
  padding:12px 12px 11px !important;
  overflow:hidden !important;
  background:rgba(255,255,255,.97) !important;
  border:1px solid rgba(18,64,104,.11) !important;
  border-bottom:0 !important;
  border-radius:16px 16px 0 0 !important;
  box-shadow:0 12px 26px rgba(33,70,110,.10) !important;
}

.ai-phone-premium .ai-suggestions-head{
  display:flex !important;
  align-items:center !important;
  gap:8px !important;
  margin:0 0 10px !important;
  color:#18324d !important;
  font-size:12px !important;
  line-height:1.15 !important;
}

.ai-phone-premium .ai-suggestions-head span{
  flex:0 0 auto !important;
  width:18px !important;
  font-size:18px !important;
  line-height:1 !important;
  color:#0fbd57 !important;
  overflow:hidden !important;
}

.ai-phone-premium .ai-suggestions-head strong{
  flex:1 1 auto !important;
  min-width:0 !important;
  font-size:12px !important;
  font-weight:900 !important;
  white-space:nowrap !important;
  overflow:hidden !important;
  text-overflow:ellipsis !important;
}

.ai-phone-premium .ai-suggestions-head button{
  width:30px !important;
  height:30px !important;
  flex:0 0 30px !important;
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  border:1px solid rgba(18,64,104,.10) !important;
  border-radius:50% !important;
  background:#fff !important;
  color:#19364f !important;
  font-size:18px !important;
  line-height:1 !important;
  font-weight:900 !important;
  cursor:pointer !important;
  box-shadow:0 8px 16px rgba(33,70,110,.08) !important;
}

.ai-phone-premium .ai-suggestions-grid{
  display:grid !important;
  grid-template-columns:1fr 1fr !important;
  gap:8px !important;
}

.ai-phone-premium .ai-suggestions-grid button{
  min-width:0 !important;
  width:100% !important;
  min-height:36px !important;
  height:36px !important;
  padding:0 10px !important;
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  border:1px solid rgba(18,64,104,.12) !important;
  border-radius:12px !important;
  background:#fff !important;
  color:#2f4660 !important;
  font-family:'DM Sans',sans-serif !important;
  font-size:12px !important;
  line-height:1.1 !important;
  font-weight:800 !important;
  white-space:nowrap !important;
  overflow:hidden !important;
  text-overflow:ellipsis !important;
  box-shadow:none !important;
  cursor:pointer !important;
  transform:none !important;
}

.ai-phone-premium .ai-input-row,
.ai-phone-premium .ai-demo-form.suggestions-open .ai-input-row{
  position:relative !important;
  z-index:4 !important;
  width:100% !important;
  height:50px !important;
  min-height:50px !important;
  box-sizing:border-box !important;
  display:flex !important;
  align-items:center !important;
  gap:8px !important;
  margin:0 !important;
  padding:0 7px 0 12px !important;
  background:#fff !important;
  border:1px solid rgba(18,64,104,.11) !important;
  box-shadow:0 12px 26px rgba(33,70,110,.10) !important;
}

.ai-phone-premium .ai-demo-form:not(.suggestions-open) .ai-input-row{
  border-radius:16px !important;
}

.ai-phone-premium .ai-demo-form.suggestions-open .ai-input-row{
  border-radius:0 0 16px 16px !important;
  border-top:1px solid rgba(18,64,104,.07) !important;
}

.ai-phone-premium .ai-input-emoji{
  flex:0 0 auto !important;
  font-size:18px !important;
  line-height:1 !important;
  color:#9aaabb !important;
}

.ai-phone-premium .ai-input-row input{
  flex:1 1 auto !important;
  min-width:0 !important;
  height:100% !important;
  border:0 !important;
  outline:0 !important;
  background:transparent !important;
  color:#172f49 !important;
  font-size:13px !important;
  font-family:'DM Sans',sans-serif !important;
}

.ai-phone-premium .ai-input-row button[type="submit"]{
  flex:0 0 42px !important;
  width:42px !important;
  height:42px !important;
  min-width:42px !important;
  min-height:42px !important;
  border:0 !important;
  border-radius:50% !important;
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  background:linear-gradient(135deg,#16b8a7,#02d454) !important;
  color:#fff !important;
  font-size:18px !important;
  line-height:1 !important;
  font-weight:900 !important;
  box-shadow:0 12px 22px rgba(2,199,85,.24) !important;
  transform:rotate(-8deg) !important;
  cursor:pointer !important;
}

.ai-phone-premium .ai-powered{
  position:relative !important;
  z-index:4 !important;
  margin:8px 0 10px !important;
  text-align:center !important;
  color:#486078 !important;
  font-size:10.5px !important;
  line-height:1.1 !important;
  font-weight:800 !important;
}

@media (max-width: 980px){
  .ai-phone-premium.ai-phone-interactive{
    width:min(390px, 100%) !important;
    height:620px !important;
    min-height:620px !important;
    max-height:620px !important;
  }

  .ai-phone-premium .ai-suggestions-grid{
    grid-template-columns:1fr !important;
  }

  .ai-phone-premium .ai-demo-form.suggestions-open .ai-suggestions-panel{
    max-height:230px !important;
    overflow:auto !important;
  }
}



/* Ajuste visual do card do plano Assistente IA - baseado no card premium do Multiatendimento */
.ai-price-card.ai-price-card-premium {
  position: relative;
  border: 2px solid rgba(2, 221, 2, .34);
  border-radius: 34px;
  background:
    radial-gradient(circle at 50% 0%, rgba(2, 221, 2, .08), transparent 38%),
    linear-gradient(180deg, rgba(255, 255, 255, .98) 0%, rgba(248, 255, 251, .96) 100%);
  padding: 48px 44px 34px;
  text-align: center;
  box-shadow:
    0 34px 90px rgba(0, 135, 255, .10),
    0 18px 55px rgba(2, 221, 2, .08);
  overflow: hidden;
}

.ai-price-card.ai-price-card-premium::before {
  content: '';
  position: absolute;
  inset: 18px;
  border-radius: 28px;
  background: linear-gradient(180deg, rgba(255,255,255,.72), rgba(255,255,255,0));
  pointer-events: none;
}

.ai-price-card.ai-price-card-premium > * {
  position: relative;
  z-index: 1;
}

.ai-price-icon {
  width: 94px;
  height: 94px;
  border-radius: 26px;
  margin: 0 auto 24px;
  display: flex;
  align-items: center;
  justify-content: center;
  background: linear-gradient(180deg, #effff3, #f8fffb);
  border: 1px solid rgba(2, 221, 2, .22);
  color: #12a94a;
  font-size: 42px;
  box-shadow: 0 18px 42px rgba(2, 221, 2, .10);
}

.ai-price-card.ai-price-card-premium h3 {
  font-size: 30px;
  line-height: 1.15;
  color: var(--text);
  margin: 0 0 24px;
}

.ai-price-divider {
  height: 1px;
  width: 100%;
  background: linear-gradient(90deg, transparent, rgba(32, 74, 118, .20), transparent);
  margin: 0 0 34px;
}

.ai-price-card.ai-price-card-premium .ai-price {
  margin: 0 0 16px;
  gap: 12px;
  align-items: flex-end;
}

.ai-price-card.ai-price-card-premium .ai-price span {
  font-size: 34px;
  color: #4a6078;
  margin-bottom: 14px;
}

.ai-price-card.ai-price-card-premium .ai-price strong {
  font-size: clamp(68px, 7vw, 92px);
  color: #0878ff;
  letter-spacing: -.075em;
  text-shadow: 0 14px 32px rgba(0, 135, 255, .12);
}

.ai-price-card.ai-price-card-premium .ai-price small {
  font-size: 24px;
  color: #405b78;
  margin-bottom: 14px;
}

.ai-price-subtitle {
  margin: 0 0 28px !important;
  color: #506981 !important;
  font-size: 21px !important;
  font-weight: 500 !important;
  line-height: 1.45;
  display: block !important;
}

.ai-price-subtitle::before {
  display: none !important;
}

.ai-secure-strip {
  width: 100%;
  min-height: 74px;
  border-radius: 18px;
  background: linear-gradient(180deg, #effff2, #f7fff9);
  color: #177d3c;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 14px;
  font-size: 24px;
  font-weight: 800;
  margin: 0 0 34px;
  box-shadow: inset 0 0 0 1px rgba(2, 221, 2, .08);
}

.ai-secure-strip span {
  font-size: 36px;
  line-height: 1;
  color: #02c91f;
}

.ai-price-card.ai-price-card-premium .ai-primary-btn {
  min-height: 76px;
  border-radius: 16px;
  font-size: 25px;
  margin: 0 0 40px;
  background: linear-gradient(135deg, #0087ff 0%, #0072ff 100%);
  box-shadow: 0 22px 46px rgba(0, 135, 255, .25);
}

.ai-price-card.ai-price-card-premium .ai-primary-btn::before {
  content: '➤';
  font-size: 28px;
}

.ai-price-benefits {
  display: grid;
  gap: 24px;
  text-align: left;
  margin: 0 0 42px;
}

.ai-price-benefit {
  display: grid;
  grid-template-columns: 74px 1fr;
  gap: 18px;
  align-items: center;
}

.ai-price-benefit > span,
.ai-price-loyalty > span {
  width: 74px;
  height: 74px;
  border-radius: 20px;
  background: #eef7ff;
  border: 1px solid #cfe6ff;
  color: #0878ff;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 34px;
  box-shadow: 0 12px 26px rgba(0, 135, 255, .08);
}

.ai-price-benefit strong,
.ai-price-loyalty strong {
  display: block;
  color: #2f3e50;
  font-size: 25px;
  line-height: 1.15;
  margin-bottom: 6px;
}

.ai-price-benefit small,
.ai-price-loyalty small {
  display: block;
  color: #516b86;
  font-size: 21px;
  line-height: 1.35;
}

.ai-price-loyalty {
  display: grid;
  grid-template-columns: 74px 1fr;
  gap: 22px;
  align-items: center;
  text-align: left;
  border: 1px solid #cfe6ff;
  border-radius: 18px;
  background: rgba(247, 252, 255, .86);
  padding: 26px 30px;
  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .70);
}

@media(max-width: 1100px) {
  .ai-price-card.ai-price-card-premium {
    max-width: 620px;
    margin: 0 auto;
  }
}

@media(max-width: 640px) {
  .ai-price-card.ai-price-card-premium {
    border-radius: 26px;
    padding: 34px 22px 26px;
  }

  .ai-price-icon {
    width: 78px;
    height: 78px;
    border-radius: 22px;
    font-size: 34px;
  }

  .ai-price-card.ai-price-card-premium h3 {
    font-size: 25px;
  }

  .ai-price-card.ai-price-card-premium .ai-price strong {
    font-size: 62px;
  }

  .ai-price-card.ai-price-card-premium .ai-price span {
    font-size: 24px;
  }

  .ai-price-card.ai-price-card-premium .ai-price small {
    font-size: 18px;
  }

  .ai-price-subtitle {
    font-size: 17px !important;
  }

  .ai-secure-strip {
    min-height: 60px;
    font-size: 18px;
    padding: 0 12px;
  }

  .ai-secure-strip span {
    font-size: 26px;
  }

  .ai-price-card.ai-price-card-premium .ai-primary-btn {
    min-height: 62px;
    font-size: 18px;
  }

  .ai-price-benefit,
  .ai-price-loyalty {
    grid-template-columns: 56px 1fr;
    gap: 14px;
  }

  .ai-price-benefit > span,
  .ai-price-loyalty > span {
    width: 56px;
    height: 56px;
    border-radius: 16px;
    font-size: 26px;
  }

  .ai-price-benefit strong,
  .ai-price-loyalty strong {
    font-size: 20px;
  }

  .ai-price-benefit small,
  .ai-price-loyalty small {
    font-size: 16px;
  }

  .ai-price-loyalty {
    padding: 20px;
  }
}

/* Ajuste compacto do plano Assistente IA — reduz altura e mantém visual premium sem exagero */
.ai-plan{
  max-width: 1180px;
  margin: 8px auto 44px !important;
  padding: 48px 56px !important;
  gap: 48px !important;
  align-items: center !important;
}

.ai-plan-copy h2{
  font-size: clamp(32px, 3vw, 42px) !important;
  margin-bottom: 22px !important;
}

.ai-check-list.compact{
  gap: 10px !important;
}

.ai-check-list.compact li{
  font-size: 15px !important;
  line-height: 1.35 !important;
}

.ai-price-card.ai-price-card-premium{
  max-width: 430px !important;
  width: 100% !important;
  margin: 0 auto !important;
  padding: 30px 34px 32px !important;
  border-radius: 26px !important;
  box-shadow: 0 22px 60px rgba(0,135,255,.10), 0 12px 36px rgba(2,221,2,.06) !important;
}

.ai-price-card.ai-price-card-premium::before{
  inset: 12px !important;
  border-radius: 22px !important;
}

.ai-price-icon{
  width: 64px !important;
  height: 64px !important;
  border-radius: 18px !important;
  margin-bottom: 16px !important;
  font-size: 28px !important;
}

.ai-price-card.ai-price-card-premium h3{
  font-size: 24px !important;
  margin-bottom: 18px !important;
}

.ai-price-divider{
  margin-bottom: 24px !important;
}

.ai-price-card.ai-price-card-premium .ai-price{
  margin-bottom: 8px !important;
  gap: 8px !important;
}

.ai-price-card.ai-price-card-premium .ai-price span{
  font-size: 24px !important;
  margin-bottom: 9px !important;
}

.ai-price-card.ai-price-card-premium .ai-price strong{
  font-size: clamp(54px, 5vw, 68px) !important;
  line-height: .9 !important;
}

.ai-price-card.ai-price-card-premium .ai-price small{
  font-size: 17px !important;
  margin-bottom: 8px !important;
}

.ai-price-subtitle{
  max-width: 310px !important;
  margin: 0 auto 20px !important;
  font-size: 16px !important;
  line-height: 1.35 !important;
}

.ai-secure-strip{
  min-height: 52px !important;
  border-radius: 14px !important;
  font-size: 16px !important;
  gap: 10px !important;
  margin-bottom: 22px !important;
  padding: 0 14px !important;
}

.ai-secure-strip span{
  font-size: 24px !important;
}

.ai-price-card.ai-price-card-premium .ai-primary-btn{
  min-height: 58px !important;
  border-radius: 14px !important;
  font-size: 17px !important;
  margin-bottom: 0 !important;
}

.ai-price-card.ai-price-card-premium .ai-primary-btn::before{
  font-size: 19px !important;
}

@media(max-width: 1100px){
  .ai-plan{
    padding: 36px 24px !important;
    gap: 34px !important;
  }
  .ai-price-card.ai-price-card-premium{
    max-width: 430px !important;
  }
}

@media(max-width: 640px){
  .ai-plan{
    padding: 28px 16px !important;
  }
  .ai-price-card.ai-price-card-premium{
    padding: 26px 20px 28px !important;
  }
  .ai-price-card.ai-price-card-premium .ai-price strong{
    font-size: 52px !important;
  }
}

/* Ajuste visual refinado — seção do plano Assistente IA */
.ai-plan{
  position: relative !important;
  max-width: 1180px !important;
  margin: 8px auto 54px !important;
  padding: 46px 54px !important;
  gap: 46px !important;
  align-items: stretch !important;
  overflow: hidden !important;
  border: 1px solid rgba(183, 213, 244, .78) !important;
  border-radius: 28px !important;
  background:
    radial-gradient(circle at 82% 22%, rgba(2,221,2,.08), transparent 32%),
    radial-gradient(circle at 20% 80%, rgba(0,135,255,.07), transparent 34%),
    rgba(255,255,255,.92) !important;
  box-shadow: 0 26px 70px rgba(14, 48, 85, .07) !important;
}

.ai-plan::before{
  content:"";
  position:absolute;
  inset: 18px;
  border-radius: 24px;
  pointer-events:none;
  background: linear-gradient(90deg, rgba(0,135,255,.04), rgba(2,221,2,.035));
  opacity:.75;
}

.ai-plan-copy-premium,
.ai-price-card.ai-price-card-premium{
  position: relative !important;
  z-index: 1 !important;
}

.ai-plan-copy-premium{
  flex: 1 1 0 !important;
  display:flex !important;
  flex-direction:column !important;
  justify-content:center !important;
  min-width:0 !important;
}

.ai-plan-copy-premium .ai-plan-tag{
  width:max-content !important;
  margin-bottom:16px !important;
  padding: 9px 17px !important;
  border-radius:999px !important;
  background: rgba(0,135,255,.09) !important;
  color:#087dff !important;
  font-size:12px !important;
  letter-spacing:.12em !important;
  font-weight:800 !important;
}

.ai-plan-copy-premium h2{
  margin: 0 0 12px !important;
  font-size: clamp(34px, 3.1vw, 46px) !important;
  line-height: 1.05 !important;
  letter-spacing: -.045em !important;
  color: var(--text);
}

.ai-plan-intro{
  max-width: 590px !important;
  margin: 0 0 24px !important;
  color:#50657f !important;
  font-size: 17px !important;
  line-height: 1.55 !important;
}

.ai-plan-feature-grid{
  display:grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 12px !important;
  margin:0 !important;
  padding:0 !important;
}

.ai-plan-feature-grid li{
  position:relative !important;
  display:block !important;
  padding: 15px 15px 15px 46px !important;
  min-height: 86px !important;
  border:1px solid rgba(183,213,244,.68) !important;
  border-radius:18px !important;
  background: rgba(255,255,255,.78) !important;
  box-shadow:0 14px 34px rgba(14,48,85,.045) !important;
  color:#102238 !important;
  font-size:initial !important;
  line-height:1.25 !important;
}

.ai-plan-feature-grid li::before{
  content:"✓" !important;
  position:absolute !important;
  left:15px !important;
  top:17px !important;
  width:22px !important;
  height:22px !important;
  display:grid !important;
  place-items:center !important;
  border-radius:8px !important;
  background:rgba(2,221,2,.12) !important;
  color:#00b900 !important;
  font-size:16px !important;
  font-weight:900 !important;
}

.ai-plan-feature-grid li strong{
  display:block !important;
  margin: 0 0 5px !important;
  font-size:15.5px !important;
  line-height:1.2 !important;
  font-weight:800 !important;
  letter-spacing:-.01em !important;
  color:#102238 !important;
}

.ai-plan-feature-grid li small{
  display:block !important;
  color:#50657f !important;
  font-size:13.5px !important;
  line-height:1.32 !important;
  font-weight:500 !important;
}

.ai-price-card.ai-price-card-premium{
  flex: 0 0 390px !important;
  max-width:390px !important;
  align-self:center !important;
  padding: 28px 30px 30px !important;
  border-radius:26px !important;
  background: linear-gradient(180deg, rgba(255,255,255,.98), rgba(247,253,250,.96)) !important;
  border: 2px solid rgba(2,221,2,.30) !important;
  box-shadow:0 24px 70px rgba(0,135,255,.09), 0 18px 48px rgba(2,221,2,.08) !important;
}

.ai-price-card.ai-price-card-premium::before{
  display:none !important;
}

.ai-price-icon{
  width:58px !important;
  height:58px !important;
  margin: 0 auto 13px !important;
  border-radius:18px !important;
  font-size:25px !important;
  background: linear-gradient(180deg, rgba(2,221,2,.10), rgba(255,255,255,.92)) !important;
  border: 1px solid rgba(2,221,2,.24) !important;
}

.ai-price-card.ai-price-card-premium h3{
  font-size:23px !important;
  margin: 0 0 16px !important;
  color:#102238 !important;
}

.ai-price-divider{
  margin-bottom: 20px !important;
  background: linear-gradient(90deg, transparent, rgba(183,213,244,.9), transparent) !important;
}

.ai-price-card.ai-price-card-premium .ai-price strong{
  font-size: clamp(52px, 4.8vw, 64px) !important;
}

.ai-price-subtitle{
  max-width: 285px !important;
  margin-bottom:18px !important;
  font-size:15px !important;
}

.ai-secure-strip{
  min-height:48px !important;
  margin-bottom:18px !important;
  border-radius:14px !important;
  font-size:15px !important;
}

.ai-price-card.ai-price-card-premium .ai-primary-btn{
  width:100% !important;
  min-height:54px !important;
  border-radius:14px !important;
  font-size:16px !important;
  box-shadow:0 14px 30px rgba(0,135,255,.22) !important;
}

@media(max-width: 1100px){
  .ai-plan{
    grid-template-columns:1fr !important;
    padding:36px 24px !important;
  }
  .ai-price-card.ai-price-card-premium{
    flex-basis:auto !important;
    width:100% !important;
  }
}

@media(max-width: 720px){
  .ai-plan{
    padding:26px 16px !important;
    border-radius:22px !important;
  }
  .ai-plan-feature-grid{
    grid-template-columns:1fr !important;
  }
  .ai-plan-feature-grid li{
    min-height:auto !important;
  }
  .ai-plan-copy-premium h2{
    font-size:32px !important;
  }
}


/* =========================================================
   AJUSTE GERAL DE RESPONSIVIDADE — WhatsCompany
   Base: Arquivo(67)
   Objetivo:
   - Harmonizar largura/altura dos principais blocos em diferentes resoluções
   - Corrigir proporção do telefone da página Assistente IA
   - Evitar sensação de telefone achatado sem aumentar demais na horizontal
   - Preservar HTML e funcionalidades existentes
   ========================================================= */

html,
body{
  overflow-x:hidden !important;
}

/* Mantém as páginas centralizadas e com respiro controlado em telas amplas */
.ai-page-v2,
main:not(.ai-page-v2){
  width:100% !important;
}

.ai-page-v2{
  max-width:1360px !important;
  margin-left:auto !important;
  margin-right:auto !important;
  padding-left:clamp(18px, 5vw, 76px) !important;
  padding-right:clamp(18px, 5vw, 76px) !important;
}

/* Hero da IA com proporção mais flexível para notebooks, monitores médios e telas grandes */
.ai-hero-v2.ai-hero-premium{
  grid-template-columns:minmax(0, 1fr) minmax(350px, 430px) !important;
  gap:clamp(34px, 4.5vw, 62px) !important;
  align-items:center !important;
  min-height:clamp(610px, 58vw, 700px) !important;
  padding-top:clamp(0px, 1.8vw, 0px) !important;
  padding-bottom:clamp(22px, 2.8vw, 42px) !important;
}

/* Evita que a coluna direita fique gigante em telas largas */
.ai-hero-demo-premium{
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  min-height:clamp(620px, 52vw, 700px) !important;
  width:100% !important;
}

/* Telefone: mais alto e um pouco mais estreito, sem ficar largo na horizontal */
.ai-phone.ai-phone-premium,
.ai-phone-premium.ai-phone-interactive{
  width:clamp(360px, 29vw, 420px) !important;
  height:clamp(625px, 47vw, 670px) !important;
  min-height:clamp(625px, 47vw, 670px) !important;
  max-height:none !important;
  border-radius:clamp(34px, 2.8vw, 42px) !important;
  transform:none !important;
  flex:0 0 auto !important;
}

/* Cabeçalho do telefone proporcional */
.ai-phone-premium .ai-phone-status{
  height:30px !important;
  min-height:30px !important;
  flex:0 0 30px !important;
}

.ai-phone-premium .ai-phone-head{
  height:clamp(82px, 6.6vw, 92px) !important;
  min-height:clamp(82px, 6.6vw, 92px) !important;
  flex:0 0 clamp(82px, 6.6vw, 92px) !important;
}

/* A área de conversa cresce junto com o celular */
.ai-phone-premium .ai-chat-area{
  flex:1 1 auto !important;
  min-height:0 !important;
  overflow-y:auto !important;
  overflow-x:hidden !important;
  padding:clamp(14px, 1.4vw, 18px) clamp(14px, 1.5vw, 20px) 12px !important;
}

.ai-phone-premium .ai-chat-area::-webkit-scrollbar{
  width:4px !important;
}

.ai-phone-premium .ai-chat-area::-webkit-scrollbar-thumb{
  background:rgba(24,55,84,.18) !important;
  border-radius:20px !important;
}

/* Rodapé do telefone fixo e compacto */
.ai-phone-premium .ai-phone-input.ai-demo-form{
  flex:0 0 auto !important;
  margin:0 clamp(14px, 1.4vw, 18px) 12px !important;
}

.ai-phone-premium .ai-input-row,
.ai-phone-premium .ai-demo-form.suggestions-open .ai-input-row{
  height:50px !important;
  min-height:50px !important;
}

/* Sugestões: sempre organizadas, sem cortar texto */
.ai-phone-premium .ai-suggestions-grid{
  grid-template-columns:1fr 1fr !important;
  gap:8px !important;
}

.ai-phone-premium .ai-suggestions-grid button{
  min-width:0 !important;
  max-width:100% !important;
  height:38px !important;
  min-height:38px !important;
  padding:0 9px !important;
  font-size:clamp(10.5px, .78vw, 12px) !important;
  white-space:nowrap !important;
  overflow:hidden !important;
  text-overflow:ellipsis !important;
}

/* Robô acompanha o tamanho do telefone sem invadir demais */
.ai-floating-robot-premium{
  width:clamp(118px, 10vw, 145px) !important;
  height:auto !important;
  right:clamp(-48px, -3vw, -28px) !important;
  top:50% !important;
  transform:translateY(-36%) !important;
}

/* Em monitores menores, diminui a coluna direita sem quebrar o layout */
@media(max-width:1180px){
  .ai-hero-v2.ai-hero-premium{
    grid-template-columns:minmax(0, 1fr) minmax(330px, 390px) !important;
    gap:34px !important;
  }

  .ai-phone.ai-phone-premium,
  .ai-phone-premium.ai-phone-interactive{
    width:clamp(340px, 34vw, 390px) !important;
    height:clamp(600px, 56vw, 640px) !important;
    min-height:clamp(600px, 56vw, 640px) !important;
  }

  .ai-floating-robot-premium{
    right:-34px !important;
    width:118px !important;
  }
}

/* Tablet e telas estreitas: vira uma coluna, mantendo visual equilibrado */
@media(max-width:980px){
  .ai-hero-v2.ai-hero-premium{
    grid-template-columns:1fr !important;
    min-height:auto !important;
    gap:34px !important;
    text-align:left !important;
  }

  .ai-hero-demo-premium{
    min-height:auto !important;
    padding-top:8px !important;
  }

  .ai-phone.ai-phone-premium,
  .ai-phone-premium.ai-phone-interactive{
    width:min(390px, 92vw) !important;
    height:620px !important;
    min-height:620px !important;
    margin:0 auto !important;
  }

  .ai-floating-robot-premium{
    right:calc(50% - 255px) !important;
    top:50% !important;
    width:112px !important;
  }
}

/* Mobile: telefone ocupa bem a tela sem estourar */
@media(max-width:720px){
  .ai-page-v2{
    padding-left:16px !important;
    padding-right:16px !important;
  }

  .ai-phone.ai-phone-premium,
  .ai-phone-premium.ai-phone-interactive{
    width:min(360px, 94vw) !important;
    height:600px !important;
    min-height:600px !important;
    border-width:6px !important;
  }

  .ai-phone-premium .ai-phone-head{
    grid-template-columns:22px 42px 1fr 22px !important;
    gap:10px !important;
    padding-left:18px !important;
    padding-right:18px !important;
  }

  .ai-phone-premium .ai-bot-avatar{
    width:42px !important;
    height:42px !important;
  }

  .ai-phone-premium .ai-phone-head strong{
    font-size:16px !important;
  }

  .ai-phone-premium .ai-chat-area{
    padding-left:13px !important;
    padding-right:13px !important;
  }

  .ai-phone-premium .ai-msg{
    max-width:86% !important;
    font-size:12px !important;
  }

  .ai-phone-premium .ai-suggestions-grid{
    grid-template-columns:1fr !important;
  }

  .ai-floating-robot-premium{
    display:none !important;
  }
}

/* Ajustes preventivos para cards/grades das demais páginas não estourarem em resoluções menores */
.ai-benefit-cards,
.ai-feature-strip,
.ai-business-grid,
.ai-step-grid,
.ai-demo-callouts{
  max-width:100% !important;
}

@media(max-width:1100px){
  .ai-benefit-cards,
  .ai-feature-strip,
  .ai-business-grid{
    grid-template-columns:repeat(2, minmax(0, 1fr)) !important;
  }
}

@media(max-width:680px){
  .ai-benefit-cards,
  .ai-feature-strip,
  .ai-business-grid,
  .ai-step-grid,
  .ai-demo-callouts{
    grid-template-columns:1fr !important;
  }
}


/* =========================================================
   Assistente IA - novo modelo do celular frontal
   Ajuste final: visual premium, sem achatar e mantendo simulador
   ========================================================= */
.ai-hero-demo-premium{
  position:relative;
  min-height:clamp(560px, 68vh, 710px) !important;
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  isolation:isolate;
}

.ai-hero-demo-premium::before{
  content:'';
  position:absolute;
  width:clamp(420px, 38vw, 620px);
  height:clamp(420px, 38vw, 620px);
  border-radius:50%;
  background:linear-gradient(135deg, rgba(0,135,255,.10), rgba(2,221,2,.08));
  filter:blur(.2px);
  z-index:0;
}

.ai-phone-premium.ai-phone-front{
  position:relative !important;
  z-index:2 !important;
  width:clamp(330px, 25.5vw, 410px) !important;
  height:clamp(590px, 45vw, 690px) !important;
  min-height:0 !important;
  aspect-ratio:9 / 16 !important;
  border:5px solid #15191f !important;
  border-radius:36px !important;
  background:#f8fbff !important;
  overflow:hidden !important;
  box-shadow:
    0 34px 90px rgba(20,45,70,.18),
    0 15px 32px rgba(5,20,35,.10),
    inset 0 0 0 1px rgba(255,255,255,.75) !important;
  transform:none !important;
}

.ai-phone-premium.ai-phone-front::before{
  content:'' !important;
  position:absolute !important;
  inset:112px 0 0 !important;
  background:
    radial-gradient(circle at 14px 14px, rgba(20, 40, 60, .035) 0 1px, transparent 1px 16px),
    linear-gradient(180deg, #fbfdff 0%, #eef6ff 100%) !important;
  opacity:1 !important;
  pointer-events:none !important;
  z-index:0 !important;
}

.ai-phone-notch{
  position:absolute;
  top:12px;
  left:50%;
  transform:translateX(-50%);
  width:86px;
  height:26px;
  border-radius:0 0 18px 18px;
  background:#050b14;
  z-index:8;
  box-shadow:inset 0 -1px 0 rgba(255,255,255,.08);
}

.ai-phone-notch::after{
  content:'';
  position:absolute;
  right:16px;
  top:8px;
  width:10px;
  height:10px;
  border-radius:50%;
  background:radial-gradient(circle, #14253a 0 38%, #050b14 39% 100%);
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.08);
}

.ai-phone-front .ai-phone-status{
  height:40px !important;
  padding:0 24px !important;
  background:#fff !important;
  color:#0d1b2d !important;
  font-size:13px !important;
  font-weight:800 !important;
  position:relative !important;
  z-index:5 !important;
}

.ai-phone-front .ai-phone-head{
  position:relative !important;
  z-index:4 !important;
  height:84px !important;
  padding:0 22px 12px !important;
  display:grid !important;
  grid-template-columns:22px 44px minmax(0,1fr) 20px !important;
  align-items:center !important;
  gap:12px !important;
  background:#fff !important;
  color:#102033 !important;
  border-bottom:1px solid rgba(20,60,100,.06) !important;
}

.ai-phone-front .ai-back{
  color:#102033 !important;
  font-size:28px !important;
  font-weight:700 !important;
  line-height:1 !important;
}

.ai-phone-front .ai-bot-avatar{
  width:44px !important;
  height:44px !important;
  border-radius:50% !important;
  background:linear-gradient(135deg,#007bff,#02dd02) !important;
  color:#fff !important;
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  font-size:21px !important;
  font-weight:900 !important;
  box-shadow:0 8px 20px rgba(0,135,255,.22) !important;
}

.ai-phone-front .ai-bot-avatar::after{display:none !important;}

.ai-phone-front .ai-phone-head strong{
  display:flex !important;
  align-items:center !important;
  gap:5px !important;
  color:#102033 !important;
  font-size:16px !important;
  line-height:1.05 !important;
  letter-spacing:-.03em !important;
}

.ai-phone-front .ai-phone-head strong em{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:14px;
  height:14px;
  border-radius:50%;
  background:#18d95f;
  color:#fff;
  font-style:normal;
  font-size:9px;
  font-weight:900;
}

.ai-phone-front .ai-phone-head span{
  display:block !important;
  color:#02b844 !important;
  font-size:12px !important;
  font-weight:700 !important;
  margin-top:2px !important;
}

.ai-phone-front .ai-phone-icons{
  color:#102033 !important;
  font-size:22px !important;
  line-height:1 !important;
}

.ai-phone-front .ai-chat-area{
  position:relative !important;
  z-index:2 !important;
  height:calc(100% - 40px - 84px - 78px) !important;
  padding:18px 20px 12px !important;
  display:flex !important;
  flex-direction:column !important;
  gap:12px !important;
  overflow-y:auto !important;
  scrollbar-width:none !important;
  background:transparent !important;
}

.ai-phone-front .ai-chat-area::-webkit-scrollbar{display:none !important;}

.ai-phone-front .ai-msg{
  max-width:78% !important;
  width:fit-content !important;
  border-radius:14px !important;
  padding:13px 14px 21px !important;
  font-size:12px !important;
  line-height:1.38 !important;
  color:#102033 !important;
  box-shadow:0 10px 26px rgba(20,55,90,.10) !important;
  position:relative !important;
}

.ai-phone-front .ai-msg-left{
  align-self:flex-start !important;
  background:#fff !important;
  border-bottom-left-radius:5px !important;
}

.ai-phone-front .ai-msg-right{
  align-self:flex-end !important;
  background:#dcffd8 !important;
  border:1px solid rgba(2,221,2,.18) !important;
  border-bottom-right-radius:5px !important;
}

.ai-phone-front .ai-msg small{
  position:absolute !important;
  right:12px !important;
  bottom:6px !important;
  font-size:9px !important;
  color:#7e94aa !important;
  font-weight:600 !important;
}

.ai-phone-front .ai-msg-cta{
  margin-top:10px !important;
}

.ai-phone-front .ai-msg-cta a{
  display:block !important;
  text-align:center !important;
  border:1px solid rgba(0,135,255,.18) !important;
  border-radius:10px !important;
  color:#007bff !important;
  font-size:12px !important;
  font-weight:800 !important;
  padding:7px 10px !important;
  background:#fff !important;
}

.ai-phone-front .ai-phone-input.ai-demo-form{
  position:absolute !important;
  left:18px !important;
  right:18px !important;
  bottom:14px !important;
  height:auto !important;
  min-height:0 !important;
  padding:0 !important;
  background:transparent !important;
  border:0 !important;
  box-shadow:none !important;
  z-index:6 !important;
}

.ai-phone-front .ai-suggestions-panel{
  margin-bottom:8px !important;
  padding:11px 12px 10px !important;
  background:rgba(255,255,255,.96) !important;
  border:1px solid rgba(18,64,104,.10) !important;
  border-radius:16px !important;
  box-shadow:0 14px 34px rgba(30,65,105,.13) !important;
}

.ai-phone-front .ai-demo-form:not(.suggestions-open) .ai-suggestions-panel{
  display:none !important;
}

.ai-phone-front .ai-demo-form.suggestions-open .ai-suggestions-panel{
  display:block !important;
  opacity:1 !important;
  pointer-events:auto !important;
  max-height:none !important;
  transform:none !important;
}

.ai-phone-front .ai-suggestions-head{
  display:flex !important;
  align-items:center !important;
  gap:8px !important;
  margin-bottom:9px !important;
  font-size:11px !important;
  color:#102033 !important;
}

.ai-phone-front .ai-suggestions-head strong{
  flex:1 !important;
  font-size:11px !important;
  line-height:1.2 !important;
}

.ai-phone-front .ai-suggestions-head button{
  width:26px !important;
  height:26px !important;
  border-radius:50% !important;
  border:1px solid rgba(18,64,104,.10) !important;
  background:#fff !important;
  color:#394451 !important;
  box-shadow:0 4px 12px rgba(30,65,105,.08) !important;
}

.ai-phone-front .ai-suggestions-grid{
  display:grid !important;
  grid-template-columns:1fr 1fr !important;
  gap:7px !important;
}

.ai-phone-front .ai-suggestions-grid button{
  min-height:30px !important;
  padding:0 8px !important;
  border-radius:10px !important;
  font-size:10.5px !important;
  font-weight:800 !important;
  white-space:nowrap !important;
  overflow:hidden !important;
  text-overflow:ellipsis !important;
}

.ai-phone-front .ai-input-row{
  height:48px !important;
  border:1px solid rgba(18,64,104,.10) !important;
  border-radius:16px !important;
  background:#fff !important;
  box-shadow:0 10px 28px rgba(20,55,90,.11) !important;
  padding:0 7px 0 12px !important;
  display:flex !important;
  align-items:center !important;
  gap:8px !important;
}

.ai-phone-front .ai-input-emoji{
  color:#8da0b5 !important;
  font-size:16px !important;
}

.ai-phone-front .ai-input-row input{
  flex:1 !important;
  min-width:0 !important;
  border:0 !important;
  outline:0 !important;
  background:transparent !important;
  color:#394451 !important;
  font-size:12px !important;
  font-weight:600 !important;
}

.ai-phone-front .ai-input-row button{
  width:38px !important;
  height:38px !important;
  min-width:38px !important;
  border-radius:50% !important;
  background:linear-gradient(135deg,#0087ff,#02dd02) !important;
  color:#fff !important;
  border:0 !important;
  font-size:16px !important;
  box-shadow:0 8px 18px rgba(0,135,255,.24) !important;
}

.ai-phone-front .ai-powered{
  margin-top:8px !important;
  text-align:center !important;
  font-size:10px !important;
  color:#63788f !important;
  font-weight:700 !important;
}

.ai-floating-robot-premium{
  z-index:3 !important;
  width:98px !important;
  height:150px !important;
  right:clamp(-18px, -1.2vw, -8px) !important;
  top:50% !important;
  transform:translateY(-4%) !important;
}

.ai-floating-robot-premium .ai-robot-head{
  height:64px !important;
  border-radius:34px !important;
}

.ai-floating-robot-premium .ai-robot-head span{
  width:58px !important;
  height:36px !important;
  border-radius:16px !important;
}

.ai-floating-robot-premium .ai-robot-head span::before{
  font-size:19px !important;
  letter-spacing:3px !important;
}

.ai-floating-robot-premium .ai-robot-head::before,
.ai-floating-robot-premium .ai-robot-head::after{
  top:28px !important;
  width:15px !important;
  height:30px !important;
}

.ai-floating-robot-premium .ai-robot-body{
  width:58px !important;
  height:66px !important;
}

.ai-floating-robot-premium .ai-robot-body::before{
  width:32px !important;
  height:32px !important;
  box-shadow:inset 0 0 0 6px rgba(255,255,255,.65),0 8px 18px rgba(39,210,103,.16) !important;
}

@media(max-width:1200px){
  .ai-phone-premium.ai-phone-front{
    width:clamp(315px, 30vw, 380px) !important;
    height:clamp(570px, 54vw, 650px) !important;
  }
}

@media(max-width:1080px){
  .ai-phone-premium.ai-phone-front{
    width:min(380px, 92vw) !important;
    height:640px !important;
  }
  .ai-floating-robot-premium{
    right:calc(50% - 250px) !important;
  }
}

@media(max-width:720px){
  .ai-phone-premium.ai-phone-front{
    width:min(360px, 94vw) !important;
    height:620px !important;
    border-radius:32px !important;
  }
  .ai-phone-notch{
    width:76px;
    height:23px;
  }
  .ai-floating-robot-premium{
    display:none !important;
  }
}

/* =========================================================
   HOTFIX — Assistente IA chat acima da caixa de texto
   Garante que novas respostas nunca fiquem por trás do input.
   ========================================================= */
.ai-phone-premium.ai-phone-interactive{
  display:flex !important;
  flex-direction:column !important;
  overflow:hidden !important;
  background:linear-gradient(180deg,#ffffff 0%,#f3f8ff 100%) !important;
}

.ai-phone-premium .ai-chat-area{
  position:relative !important;
  flex:1 1 auto !important;
  min-height:0 !important;
  overflow-y:auto !important;
  overflow-x:hidden !important;
  padding:16px 18px 18px !important;
  margin:0 !important;
  scroll-padding-bottom:22px !important;
}

.ai-phone-premium .ai-phone-input.ai-demo-form{
  position:relative !important;
  flex:0 0 auto !important;
  width:auto !important;
  margin:0 18px 12px !important;
  padding:0 !important;
  background:transparent !important;
  z-index:20 !important;
}

.ai-phone-premium .ai-input-row{
  min-height:50px !important;
  background:#fff !important;
  border-radius:16px !important;
  box-shadow:0 12px 28px rgba(30,70,110,.12) !important;
}

.ai-phone-premium .ai-demo-form.suggestions-open .ai-input-row{
  border-radius:0 0 16px 16px !important;
}

.ai-phone-premium .ai-powered{
  margin:8px 0 0 !important;
}

.ai-phone-premium .ai-msg:last-child{
  margin-bottom:6px !important;
}

.ai-phone-premium .ai-msg-cta{
  display:flex !important;
  justify-content:flex-start !important;
  margin-top:10px !important;
}

.ai-phone-premium .ai-msg-cta a{
  white-space:nowrap !important;
}

/* =========================================================
   HOTFIX FINAL JULIO — Assistente IA hero/celular
   Ajustes solicitados:
   - Celular menor no desktop
   - Robô visível à frente/lateral do telefone
   - Caixa de texto centralizada com margens iguais
   - Botão X das opções acima do robô
   ========================================================= */
.ai-hero-v2.ai-hero-premium{
  grid-template-columns:minmax(0, 1fr) minmax(300px, 390px) !important;
  gap:clamp(34px, 4vw, 56px) !important;
}

.ai-hero-demo-premium{
  position:relative !important;
  overflow:visible !important;
  min-height:clamp(540px, 48vw, 630px) !important;
}

.ai-phone.ai-phone-premium.ai-phone-front,
.ai-phone-premium.ai-phone-front,
.ai-phone-premium.ai-phone-interactive.ai-phone-front{
  width:clamp(300px, 22vw, 360px) !important;
  height:clamp(545px, 40vw, 605px) !important;
  min-height:0 !important;
  max-height:none !important;
  border-width:5px !important;
  border-radius:34px !important;
  z-index:5 !important;
  margin:0 auto !important;
}

.ai-phone-front .ai-phone-status{
  height:34px !important;
  min-height:34px !important;
  flex:0 0 34px !important;
  padding:0 22px !important;
}

.ai-phone-front .ai-phone-head{
  height:74px !important;
  min-height:74px !important;
  flex:0 0 74px !important;
  grid-template-columns:20px 40px minmax(0,1fr) 20px !important;
  gap:10px !important;
  padding:0 20px 10px !important;
}

.ai-phone-front .ai-bot-avatar{
  width:40px !important;
  height:40px !important;
  font-size:19px !important;
}

.ai-phone-front .ai-phone-head strong{
  font-size:14px !important;
}

.ai-phone-front .ai-phone-head span{
  font-size:11px !important;
}

.ai-phone-front .ai-chat-area{
  flex:1 1 auto !important;
  min-height:0 !important;
  height:auto !important;
  padding:14px 16px 12px !important;
  gap:10px !important;
}

.ai-phone-front .ai-msg{
  max-width:80% !important;
  font-size:10.8px !important;
  line-height:1.34 !important;
  padding:11px 12px 20px !important;
}

.ai-phone-front .ai-phone-input.ai-demo-form,
.ai-phone-premium.ai-phone-front .ai-phone-input.ai-demo-form,
.ai-phone-premium.ai-phone-front .ai-demo-form{
  position:relative !important;
  left:auto !important;
  right:auto !important;
  bottom:auto !important;
  width:calc(100% - 32px) !important;
  max-width:calc(100% - 32px) !important;
  margin:0 auto 12px !important;
  padding:0 !important;
  box-sizing:border-box !important;
  z-index:30 !important;
}

.ai-phone-front .ai-suggestions-panel,
.ai-phone-front .ai-demo-form.suggestions-open .ai-suggestions-panel{
  width:100% !important;
  max-width:100% !important;
  box-sizing:border-box !important;
  margin:0 0 8px !important;
  border-radius:15px !important;
  padding:10px 11px 10px !important;
  position:relative !important;
  z-index:31 !important;
}

.ai-phone-front .ai-suggestions-head{
  gap:8px !important;
  margin-bottom:8px !important;
}

.ai-phone-front .ai-suggestions-head strong{
  font-size:10.5px !important;
  white-space:nowrap !important;
  overflow:hidden !important;
  text-overflow:ellipsis !important;
}

.ai-phone-front .ai-suggestions-head button,
.ai-phone-premium .ai-suggestions-head button{
  width:28px !important;
  height:28px !important;
  min-width:28px !important;
  flex:0 0 28px !important;
  position:relative !important;
  z-index:40 !important;
}

.ai-phone-front .ai-suggestions-grid{
  grid-template-columns:1fr 1fr !important;
  gap:7px !important;
}

.ai-phone-front .ai-suggestions-grid button{
  height:32px !important;
  min-height:32px !important;
  font-size:10px !important;
  padding:0 7px !important;
}

.ai-phone-front .ai-input-row,
.ai-phone-premium.ai-phone-front .ai-input-row{
  width:100% !important;
  height:46px !important;
  min-height:46px !important;
  box-sizing:border-box !important;
  margin:0 auto !important;
  border-radius:15px !important;
}

.ai-phone-front .ai-demo-form.suggestions-open .ai-input-row{
  border-radius:15px !important;
}

.ai-phone-front .ai-input-row input{
  font-size:11.5px !important;
}

.ai-phone-front .ai-input-row button,
.ai-phone-front .ai-input-row button[type="submit"]{
  width:36px !important;
  height:36px !important;
  min-width:36px !important;
  flex:0 0 36px !important;
}

.ai-phone-front .ai-powered{
  margin-top:7px !important;
  font-size:9.5px !important;
}

.ai-floating-robot-premium{
  width:108px !important;
  height:158px !important;
  right:clamp(-78px, -4.8vw, -54px) !important;
  top:52% !important;
  transform:translateY(-8%) !important;
  z-index:20 !important;
  pointer-events:none !important;
}

.ai-floating-robot-premium .ai-robot-head{
  height:66px !important;
}
.ai-floating-robot-premium .ai-robot-head span{
  width:58px !important;
  height:36px !important;
}
.ai-floating-robot-premium .ai-robot-body{
  width:60px !important;
  height:68px !important;
}

@media(max-width:1200px){
  .ai-hero-v2.ai-hero-premium{
    grid-template-columns:minmax(0,1fr) minmax(295px, 360px) !important;
  }
  .ai-phone.ai-phone-premium.ai-phone-front,
  .ai-phone-premium.ai-phone-front,
  .ai-phone-premium.ai-phone-interactive.ai-phone-front{
    width:clamp(292px, 28vw, 340px) !important;
    height:clamp(535px, 51vw, 585px) !important;
  }
  .ai-floating-robot-premium{
    right:-58px !important;
    width:96px !important;
  }
}

@media(max-width:980px){
  .ai-hero-v2.ai-hero-premium{
    grid-template-columns:1fr !important;
  }
  .ai-phone.ai-phone-premium.ai-phone-front,
  .ai-phone-premium.ai-phone-front,
  .ai-phone-premium.ai-phone-interactive.ai-phone-front{
    width:min(340px, 92vw) !important;
    height:585px !important;
  }
  .ai-floating-robot-premium{
    right:calc(50% - 238px) !important;
    width:94px !important;
  }
}

@media(max-width:720px){
  .ai-phone.ai-phone-premium.ai-phone-front,
  .ai-phone-premium.ai-phone-front,
  .ai-phone-premium.ai-phone-interactive.ai-phone-front{
    width:min(340px, 94vw) !important;
    height:585px !important;
  }
  .ai-phone-front .ai-suggestions-grid{
    grid-template-columns:1fr !important;
  }
  .ai-floating-robot-premium{
    display:none !important;
  }
}

/* =========================================================
   AJUSTE FINAL — Assistente IA / Hero com celular
   - Celular menor, porém legível
   - Robô fora do telefone, sem ficar atrás
   - Caixa de texto centralizada
   - Mensagens sempre acima do campo de digitação
   ========================================================= */
@media (min-width: 981px){
  .ai-page-v2{
    overflow-x:hidden !important;
  }

  .ai-hero-v2.ai-hero-premium{
    grid-template-columns:minmax(560px, 1fr) minmax(500px, 560px) !important;
    gap:clamp(28px, 3.8vw, 58px) !important;
    max-width:1360px !important;
    margin-left:auto !important;
    margin-right:auto !important;
    align-items:center !important;
  }

  .ai-hero-demo-premium{
    position:relative !important;
    overflow:visible !important;
    display:flex !important;
    justify-content:center !important;
    align-items:center !important;
    min-height:660px !important;
    padding-right:72px !important;
  }

  .ai-hero-demo-premium::before{
    width:520px !important;
    height:520px !important;
    right:6px !important;
    left:auto !important;
    top:50% !important;
    transform:translateY(-50%) !important;
  }

  .ai-phone.ai-phone-premium.ai-phone-front,
  .ai-phone-premium.ai-phone-front,
  .ai-phone-premium.ai-phone-interactive.ai-phone-front{
    width:372px !important;
    height:640px !important;
    min-height:640px !important;
    max-height:640px !important;
    margin:0 auto !important;
    position:relative !important;
    z-index:5 !important;
    overflow:hidden !important;
    flex:0 0 372px !important;
  }

  .ai-phone-front .ai-phone-status{
    height:36px !important;
    min-height:36px !important;
    flex:0 0 36px !important;
    padding:0 22px !important;
  }

  .ai-phone-front .ai-phone-head{
    height:78px !important;
    min-height:78px !important;
    flex:0 0 78px !important;
    padding:0 20px 10px !important;
    grid-template-columns:20px 42px minmax(0,1fr) 20px !important;
    gap:11px !important;
  }

  .ai-phone-front .ai-bot-avatar{
    width:42px !important;
    height:42px !important;
  }

  .ai-phone-front .ai-phone-head strong{
    font-size:15px !important;
  }

  .ai-phone-front .ai-chat-area,
  .ai-phone-premium .ai-chat-area{
    position:relative !important;
    z-index:2 !important;
    flex:1 1 auto !important;
    height:auto !important;
    min-height:0 !important;
    overflow-y:auto !important;
    overflow-x:hidden !important;
    padding:14px 17px 12px !important;
    margin:0 !important;
    gap:10px !important;
    scroll-padding-bottom:20px !important;
  }

  .ai-phone-front .ai-msg{
    max-width:79% !important;
    font-size:10.7px !important;
    line-height:1.33 !important;
    padding:11px 12px 19px !important;
  }

  .ai-phone-front .ai-msg small{
    font-size:8.5px !important;
    right:10px !important;
    bottom:5px !important;
  }

  .ai-phone-front .ai-phone-input.ai-demo-form,
  .ai-phone-premium.ai-phone-front .ai-phone-input.ai-demo-form,
  .ai-phone-premium.ai-phone-front .ai-demo-form,
  .ai-phone-premium .ai-phone-input.ai-demo-form{
    position:relative !important;
    left:auto !important;
    right:auto !important;
    bottom:auto !important;
    flex:0 0 auto !important;
    width:calc(100% - 30px) !important;
    max-width:calc(100% - 30px) !important;
    margin:0 auto 12px !important;
    padding:0 !important;
    background:transparent !important;
    border:0 !important;
    box-shadow:none !important;
    box-sizing:border-box !important;
    z-index:30 !important;
  }

  .ai-phone-front .ai-suggestions-panel,
  .ai-phone-front .ai-demo-form.suggestions-open .ai-suggestions-panel{
    width:100% !important;
    max-width:100% !important;
    margin:0 0 8px !important;
    padding:10px 11px !important;
    box-sizing:border-box !important;
    position:relative !important;
    z-index:32 !important;
  }

  .ai-phone-front .ai-suggestions-head{
    display:flex !important;
    align-items:center !important;
    gap:8px !important;
    margin-bottom:8px !important;
  }

  .ai-phone-front .ai-suggestions-head strong{
    min-width:0 !important;
    flex:1 1 auto !important;
    font-size:10.6px !important;
    white-space:nowrap !important;
    overflow:hidden !important;
    text-overflow:ellipsis !important;
  }

  .ai-phone-front .ai-suggestions-head button,
  .ai-phone-premium .ai-suggestions-head button{
    position:relative !important;
    z-index:60 !important;
    width:28px !important;
    height:28px !important;
    min-width:28px !important;
    flex:0 0 28px !important;
  }

  .ai-phone-front .ai-suggestions-grid{
    grid-template-columns:1fr 1fr !important;
    gap:7px !important;
  }

  .ai-phone-front .ai-suggestions-grid button{
    height:31px !important;
    min-height:31px !important;
    font-size:9.7px !important;
    padding:0 7px !important;
  }

  .ai-phone-front .ai-input-row,
  .ai-phone-premium.ai-phone-front .ai-input-row,
  .ai-phone-premium .ai-input-row{
    width:100% !important;
    height:46px !important;
    min-height:46px !important;
    margin:0 auto !important;
    box-sizing:border-box !important;
    border-radius:16px !important;
  }

  .ai-phone-front .ai-demo-form.suggestions-open .ai-input-row,
  .ai-phone-premium .ai-demo-form.suggestions-open .ai-input-row{
    border-radius:16px !important;
  }

  .ai-phone-front .ai-input-row input{
    font-size:11px !important;
  }

  .ai-phone-front .ai-input-row button,
  .ai-phone-front .ai-input-row button[type="submit"]{
    width:36px !important;
    height:36px !important;
    min-width:36px !important;
    flex:0 0 36px !important;
  }

  .ai-phone-front .ai-powered{
    margin-top:7px !important;
    font-size:9.3px !important;
  }

  .ai-floating-robot-premium{
    width:112px !important;
    height:160px !important;
    right:8px !important;
    top:40% !important;
    transform:translateY(-20%) !important;
    z-index:12 !important;
    pointer-events:none !important;
  }
}

@media (min-width: 981px) and (max-width: 1220px){
  .ai-hero-v2.ai-hero-premium{
    grid-template-columns:minmax(470px, 1fr) minmax(430px, 480px) !important;
    gap:28px !important;
  }
  .ai-hero-demo-premium{
    padding-right:58px !important;
  }
  .ai-phone.ai-phone-premium.ai-phone-front,
  .ai-phone-premium.ai-phone-front,
  .ai-phone-premium.ai-phone-interactive.ai-phone-front{
    width:350px !important;
    height:620px !important;
    min-height:620px !important;
    max-height:620px !important;
    flex-basis:350px !important;
  }
  .ai-floating-robot-premium{
    right:6px !important;
    width:98px !important;
  }
}

@media (max-width: 980px){
  .ai-phone-front .ai-phone-input.ai-demo-form,
  .ai-phone-premium .ai-phone-input.ai-demo-form{
    position:relative !important;
    left:auto !important;
    right:auto !important;
    bottom:auto !important;
    width:calc(100% - 30px) !important;
    max-width:calc(100% - 30px) !important;
    margin:0 auto 12px !important;
  }
  .ai-phone-front .ai-chat-area,
  .ai-phone-premium .ai-chat-area{
    flex:1 1 auto !important;
    height:auto !important;
    min-height:0 !important;
    overflow-y:auto !important;
  }
}


@keyframes robotBlink{
  0%,92%,100%{transform:scaleY(1);}
  94%,98%{transform:scaleY(0.08);}
}
.ai-robot-head span::before{
  animation:robotBlink 3s infinite;
  transform-origin:center center;
}

/* =========================================================
   HOTFIX MOBILE — Assistente IA
   Ajusta o mockup do celular na versão mobile para não sobrepor
   os cards abaixo, deixando o telefone menor e no fluxo da página.
   ========================================================= */
@media (max-width: 760px){
  .ai-page-v2{
    padding-left:16px !important;
    padding-right:16px !important;
    overflow-x:hidden !important;
  }

  .ai-hero-v2.ai-hero-premium{
    display:flex !important;
    flex-direction:column !important;
    align-items:stretch !important;
    justify-content:flex-start !important;
    grid-template-columns:1fr !important;
    min-height:auto !important;
    height:auto !important;
    gap:24px !important;
    margin-bottom:28px !important;
    padding-bottom:0 !important;
    overflow:visible !important;
  }

  .ai-hero-demo-premium{
    position:relative !important;
    display:flex !important;
    justify-content:center !important;
    align-items:flex-start !important;
    width:100% !important;
    min-height:auto !important;
    height:auto !important;
    margin:8px auto 30px !important;
    padding:0 !important;
    overflow:visible !important;
  }

  .ai-hero-demo-premium::before{
    width:118vw !important;
    height:118vw !important;
    max-width:520px !important;
    max-height:520px !important;
    left:50% !important;
    right:auto !important;
    top:50% !important;
    transform:translate(-50%, -50%) !important;
    opacity:.62 !important;
  }

  .ai-phone.ai-phone-premium,
  .ai-phone.ai-phone-premium.ai-phone-front,
  .ai-phone-premium.ai-phone-front,
  .ai-phone-premium.ai-phone-interactive,
  .ai-phone-premium.ai-phone-interactive.ai-phone-front{
    position:relative !important;
    display:flex !important;
    flex-direction:column !important;
    width:min(315px, calc(100vw - 48px)) !important;
    min-width:0 !important;
    max-width:315px !important;
    height:520px !important;
    min-height:520px !important;
    max-height:520px !important;
    flex:0 0 520px !important;
    margin:0 auto !important;
    transform:none !important;
    z-index:5 !important;
    border-width:5px !important;
    border-radius:34px !important;
    overflow:hidden !important;
  }

  .ai-phone-premium .ai-phone-status,
  .ai-phone-front .ai-phone-status{
    position:relative !important;
    flex:0 0 30px !important;
    height:30px !important;
    min-height:30px !important;
    padding:0 18px !important;
    font-size:12px !important;
  }

  .ai-phone-premium .ai-phone-head,
  .ai-phone-front .ai-phone-head{
    position:relative !important;
    top:auto !important;
    left:auto !important;
    right:auto !important;
    flex:0 0 74px !important;
    height:74px !important;
    min-height:74px !important;
    grid-template-columns:20px 40px minmax(0,1fr) 20px !important;
    gap:9px !important;
    padding:0 17px 10px !important;
  }

  .ai-phone-premium .ai-bot-avatar,
  .ai-phone-front .ai-bot-avatar{
    width:40px !important;
    height:40px !important;
    font-size:18px !important;
  }

  .ai-phone-premium .ai-phone-head strong,
  .ai-phone-front .ai-phone-head strong{
    font-size:14px !important;
  }

  .ai-phone-premium .ai-phone-head span,
  .ai-phone-front .ai-phone-head span{
    font-size:11px !important;
  }

  .ai-phone-premium .ai-chat-area,
  .ai-phone-front .ai-chat-area{
    position:relative !important;
    flex:1 1 auto !important;
    min-height:0 !important;
    height:auto !important;
    padding:13px 12px 10px !important;
    gap:9px !important;
    overflow-y:auto !important;
    overflow-x:hidden !important;
  }

  .ai-phone-premium .ai-msg,
  .ai-phone-front .ai-msg{
    max-width:84% !important;
    font-size:10.2px !important;
    line-height:1.32 !important;
    padding:10px 11px 18px !important;
  }

  .ai-phone-premium .ai-msg small,
  .ai-phone-front .ai-msg small{
    font-size:8.5px !important;
  }

  .ai-phone-premium .ai-phone-input.ai-demo-form,
  .ai-phone-front .ai-phone-input.ai-demo-form,
  .ai-phone-premium.ai-phone-front .ai-demo-form{
    position:relative !important;
    left:auto !important;
    right:auto !important;
    bottom:auto !important;
    flex:0 0 auto !important;
    width:calc(100% - 24px) !important;
    max-width:calc(100% - 24px) !important;
    margin:0 auto 10px !important;
    padding:0 !important;
    background:transparent !important;
    border:0 !important;
    box-shadow:none !important;
    box-sizing:border-box !important;
  }

  .ai-phone-premium .ai-input-row,
  .ai-phone-front .ai-input-row{
    width:100% !important;
    height:42px !important;
    min-height:42px !important;
    margin:0 auto !important;
    border-radius:15px !important;
  }

  .ai-phone-premium .ai-input-row input,
  .ai-phone-front .ai-input-row input{
    font-size:10.5px !important;
  }

  .ai-phone-premium .ai-input-row button[type="submit"],
  .ai-phone-front .ai-input-row button[type="submit"]{
    width:34px !important;
    height:34px !important;
    min-width:34px !important;
    flex:0 0 34px !important;
  }

  .ai-phone-premium .ai-suggestions-grid,
  .ai-phone-front .ai-suggestions-grid{
    grid-template-columns:1fr 1fr !important;
    gap:6px !important;
  }

  .ai-phone-premium .ai-suggestions-grid button,
  .ai-phone-front .ai-suggestions-grid button{
    height:28px !important;
    min-height:28px !important;
    font-size:8.7px !important;
    padding:0 5px !important;
  }

  .ai-phone-premium .ai-suggestions-head strong,
  .ai-phone-front .ai-suggestions-head strong{
    font-size:9.4px !important;
  }

  .ai-phone-premium .ai-powered,
  .ai-phone-front .ai-powered{
    margin-top:6px !important;
    font-size:8.3px !important;
  }

  .ai-floating-robot-premium{
    display:none !important;
  }

  .ai-benefit-cards{
    position:relative !important;
    z-index:1 !important;
    margin-top:18px !important;
  }
}

@media (max-width: 390px){
  .ai-phone.ai-phone-premium,
  .ai-phone.ai-phone-premium.ai-phone-front,
  .ai-phone-premium.ai-phone-front,
  .ai-phone-premium.ai-phone-interactive,
  .ai-phone-premium.ai-phone-interactive.ai-phone-front{
    width:min(300px, calc(100vw - 42px)) !important;
    max-width:300px !important;
    height:505px !important;
    min-height:505px !important;
    max-height:505px !important;
    flex-basis:505px !important;
  }
}

/* =========================================================
   AJUSTE — Assistente IA: robô entrando voando pela esquerda
   Baseado no Arquivo(74).zip
   - Usa margem animada para não conflitar com os transforms existentes
   - Mantém o piscar dos olhos já aplicado no rosto do robô
   ========================================================= */
@property --wc-robot-fly-x {
  syntax: '<length-percentage>';
  inherits: false;
  initial-value: 0px;
}

@keyframes wcRobotFlyFromLeft {
  0% {
    --wc-robot-fly-x: -120vw;
    opacity: 0;
    filter: blur(2px);
  }
  18% {
    opacity: 1;
  }
  72% {
    --wc-robot-fly-x: 18px;
    filter: blur(0);
  }
  100% {
    --wc-robot-fly-x: 0px;
    opacity: 1;
    filter: blur(0);
  }
}

@keyframes wcRobotSoftFloat {
  0%, 100% { margin-top: 0; }
  50% { margin-top: -8px; }
}

.ai-hero-demo-premium .ai-floating-robot-premium,
.ai-floating-robot.ai-floating-robot-premium {
  margin-left: var(--wc-robot-fly-x) !important;
  opacity: 0;
  will-change: margin-left, margin-top, opacity, filter;
  animation:
    wcRobotFlyFromLeft 1.85s cubic-bezier(.18,.88,.24,1) .25s both,
    wcRobotSoftFloat 4.5s ease-in-out 2.25s infinite !important;
}

.ai-floating-robot-premium .ai-robot-head span::before {
  animation: robotBlink 3s infinite !important;
  transform-origin: center center !important;
}

@media (max-width: 760px){
  .ai-hero-demo-premium .ai-floating-robot-premium,
  .ai-floating-robot.ai-floating-robot-premium{
    animation: none !important;
  }
}

@media (prefers-reduced-motion: reduce){
  .ai-hero-demo-premium .ai-floating-robot-premium,
  .ai-floating-robot.ai-floating-robot-premium{
    --wc-robot-fly-x: 0px;
    opacity: 1;
    animation: none !important;
  }
}

/* =========================================================
   AJUSTE FINAL — Assistente IA: robô voando da esquerda para a posição atual
   - Animação controlada por JS para não conflitar com regras antigas
   - Mantém a posição final do robô e o piscar dos olhos
   ========================================================= */
.ai-hero-demo-premium .ai-floating-robot-premium,
.ai-floating-robot.ai-floating-robot-premium{
  --wcRobotFlyX: 0px;
  --wcRobotFlyY: 0px;
  --wcRobotFlyRotate: 0deg;
  --wcRobotFlyScale: 1;
  opacity: 0;
  visibility: hidden;
  margin-left: 0 !important;
  animation: none !important;
  transform: translate3d(var(--wcRobotFlyX), var(--wcRobotFlyY), 0) translateY(-8%) rotate(var(--wcRobotFlyRotate)) scale(var(--wcRobotFlyScale)) !important;
  will-change: transform, opacity, filter !important;
}

.ai-floating-robot-premium.wc-robot-flying,
.ai-floating-robot-premium.wc-robot-flight-done{
  visibility: visible;
}

.ai-floating-robot-premium.wc-robot-flying{
  z-index: 90 !important;
  filter: drop-shadow(0 20px 24px rgba(0,135,255,.18));
}

.ai-floating-robot-premium.wc-robot-flying::after{
  content:'';
  position:absolute;
  right:78%;
  top:44%;
  width:110px;
  height:34px;
  pointer-events:none;
  opacity:var(--wcRobotTrailOpacity, .85);
  background:linear-gradient(90deg, rgba(0,135,255,0), rgba(0,135,255,.20), rgba(2,221,2,.22));
  filter:blur(7px);
  border-radius:999px;
  transform:translateY(-50%) rotate(-8deg);
}

.ai-floating-robot-premium .ai-robot-head span::before{
  animation: robotBlink 3s infinite !important;
  transform-origin:center center !important;
}

@media (max-width: 760px), (prefers-reduced-motion: reduce){
  .ai-hero-demo-premium .ai-floating-robot-premium,
  .ai-floating-robot.ai-floating-robot-premium{
    --wcRobotFlyX:0px !important;
    --wcRobotFlyY:0px !important;
    --wcRobotFlyRotate:0deg !important;
    --wcRobotFlyScale:1 !important;
    animation:none !important;
    opacity:1 !important;
    visibility:visible !important;
  }
}


/* =========================================================
   Ajuste pontual — Assistente IA: painel de perguntas flutuante
   Evita que a abertura das opções crie uma camada branca sobre o chat
   ========================================================= */
.ai-phone-premium.ai-phone-front.ai-phone-interactive{
  position:relative !important;
}

.ai-phone-premium.ai-phone-front.ai-phone-interactive .ai-chat-area{
  position:absolute !important;
  top:108px !important;
  left:0 !important;
  right:0 !important;
  bottom:86px !important;
  height:auto !important;
  flex:none !important;
  overflow-y:auto !important;
  overflow-x:hidden !important;
}

.ai-phone-premium.ai-phone-front.ai-phone-interactive.ai-suggestions-visible .ai-chat-area{
  bottom:220px !important;
}

.ai-phone-premium.ai-phone-front .ai-phone-input.ai-demo-form{
  position:absolute !important;
  left:15px !important;
  right:15px !important;
  bottom:12px !important;
  width:auto !important;
  max-width:none !important;
  height:auto !important;
  margin:0 !important;
  z-index:35 !important;
  overflow:visible !important;
}

.ai-phone-premium.ai-phone-front .ai-suggestions-panel{
  position:absolute !important;
  left:0 !important;
  right:0 !important;
  bottom:calc(100% + 10px) !important;
  margin:0 !important;
  z-index:36 !important;
}

.ai-phone-premium.ai-phone-front .ai-demo-form:not(.suggestions-open) .ai-suggestions-panel{
  padding-top:0 !important;
  padding-bottom:0 !important;
}

/* =========================================================
   AJUSTE PONTUAL — Assistente IA: botão enviar circular
   - Mantém o botão sempre redondo, sem esticar pelo container
   - Preserva o restante da estrutura do chat
   ========================================================= */
.ai-input-row button,
.ai-input-row button[type="submit"],
.ai-phone-premium .ai-input-row button,
.ai-phone-premium .ai-input-row button[type="submit"],
.ai-phone-front .ai-input-row button,
.ai-phone-front .ai-input-row button[type="submit"],
.ai-phone-premium.ai-phone-front .ai-input-row button,
.ai-phone-premium.ai-phone-front .ai-input-row button[type="submit"]{
  width:40px !important;
  height:40px !important;
  min-width:40px !important;
  min-height:40px !important;
  max-width:40px !important;
  max-height:40px !important;
  aspect-ratio:1 / 1 !important;
  flex:0 0 46px !important;
  padding:0 !important;
  border-radius:50% !important;
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  align-self:center !important;
  line-height:1 !important;
  box-sizing:border-box !important;
  overflow:hidden !important;
}

.ai-input-row,
.ai-phone-premium .ai-input-row,
.ai-phone-front .ai-input-row,
.ai-phone-premium.ai-phone-front .ai-input-row{
  align-items:center !important;
}

@media (max-width: 900px){
  .ai-input-row button,
  .ai-input-row button[type="submit"],
  .ai-phone-premium .ai-input-row button,
  .ai-phone-premium .ai-input-row button[type="submit"],
  .ai-phone-front .ai-input-row button,
  .ai-phone-front .ai-input-row button[type="submit"],
  .ai-phone-premium.ai-phone-front .ai-input-row button,
  .ai-phone-premium.ai-phone-front .ai-input-row button[type="submit"]{
    width:38px !important;
    height:38px !important;
    min-width:38px !important;
    min-height:38px !important;
    max-width:38px !important;
    max-height:38px !important;
    flex-basis:38px !important;
  }
}

@media (max-width: 420px){
  .ai-input-row button,
  .ai-input-row button[type="submit"],
  .ai-phone-premium .ai-input-row button,
  .ai-phone-premium .ai-input-row button[type="submit"],
  .ai-phone-front .ai-input-row button,
  .ai-phone-front .ai-input-row button[type="submit"],
  .ai-phone-premium.ai-phone-front .ai-input-row button,
  .ai-phone-premium.ai-phone-front .ai-input-row button[type="submit"]{
    width:34px !important;
    height:34px !important;
    min-width:34px !important;
    min-height:34px !important;
    max-width:34px !important;
    max-height:34px !important;
    flex-basis:34px !important;
  }
}


/* =========================================================
   Ajuste pontual — botões do simulador IA sem deslocar a página
   ========================================================= */
.ai-phone-front .ai-msg-cta a,
.ai-phone-front .ai-msg-cta button,
.ai-phone-premium .ai-msg-cta a,
.ai-phone-premium .ai-msg-cta button{
  appearance:none !important;
  -webkit-appearance:none !important;
  display:block !important;
  text-align:center !important;
  border:1px solid rgba(0,135,255,.18) !important;
  border-radius:10px !important;
  color:#007bff !important;
  font-family:'DM Sans',sans-serif !important;
  font-size:12px !important;
  font-weight:800 !important;
  line-height:1.2 !important;
  padding:7px 10px !important;
  background:#fff !important;
  cursor:pointer !important;
  text-decoration:none !important;
}

.ai-phone-front .ai-msg-cta button:hover,
.ai-phone-premium .ai-msg-cta button:hover{
  border-color:rgba(0,135,255,.32) !important;
  background:rgba(0,135,255,.05) !important;
}

/* ==========================================================================
   White Label hero premium card
   ========================================================================== */
.white-premium-card{
  position:relative;
  overflow:hidden;
  background:linear-gradient(145deg,rgba(255,255,255,.96),rgba(244,250,255,.92));
  border:1px solid rgba(184,215,242,.86);
  border-radius:28px;
  padding:30px;
  box-shadow:0 28px 80px rgba(16,32,51,.11);
  isolation:isolate;
}
.white-premium-card::before{
  content:'';
  position:absolute;
  inset:0;
  background:
    linear-gradient(135deg,rgba(0,135,255,.10),transparent 34%),
    radial-gradient(circle at 92% 12%,rgba(2,221,2,.14),transparent 28%);
  pointer-events:none;
  z-index:-2;
}
.white-premium-card::after{
  content:'';
  position:absolute;
  inset:1px;
  border-radius:27px;
  background:linear-gradient(180deg,rgba(255,255,255,.72),rgba(255,255,255,.24));
  pointer-events:none;
  z-index:-1;
}
.white-premium-glow{
  position:absolute;
  right:-80px;
  bottom:-90px;
  width:220px;
  height:220px;
  border-radius:50%;
  background:radial-gradient(circle,rgba(2,221,2,.18),transparent 68%);
  pointer-events:none;
}
.white-premium-head{
  max-width:520px;
  margin-bottom:22px;
}
.white-premium-badge{
  display:inline-flex;
  align-items:center;
  gap:7px;
  width:max-content;
  margin-bottom:14px;
  padding:6px 12px;
  border-radius:999px;
  background:rgba(0,135,255,.08);
  border:1px solid rgba(0,135,255,.16);
  color:var(--sky);
  font-size:11px;
  font-weight:800;
  letter-spacing:.08em;
  text-transform:uppercase;
}
.white-premium-badge::before{
  content:'';
  width:7px;
  height:7px;
  border-radius:50%;
  background:var(--green);
  box-shadow:0 0 0 5px rgba(2,221,2,.12);
}
.white-premium-head h3{
  font-family:'Outfit',sans-serif;
  font-size:clamp(28px,3vw,34px);
  line-height:1.05;
  letter-spacing:-.04em;
  color:var(--text);
  margin-bottom:10px;
}
.white-premium-head p{
  color:var(--text2);
  font-size:15px;
  line-height:1.65;
}
.white-premium-grid{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:12px;
}
.white-premium-item{
  min-height:112px;
  padding:16px;
  border-radius:18px;
  background:rgba(255,255,255,.78);
  border:1px solid rgba(214,230,245,.92);
  box-shadow:0 12px 30px rgba(16,32,51,.06);
}
.white-premium-item span{
  width:28px;
  height:28px;
  display:flex;
  align-items:center;
  justify-content:center;
  margin-bottom:10px;
  border-radius:10px;
  color:#fff;
  background:linear-gradient(135deg,var(--sky),var(--green));
  font-weight:900;
  box-shadow:0 10px 24px rgba(0,135,255,.16);
}
.white-premium-item strong{
  display:block;
  color:var(--text);
  font-size:14px;
  line-height:1.25;
  margin-bottom:4px;
}
.white-premium-item small{
  display:block;
  color:var(--text3);
  font-size:12px;
  line-height:1.45;
}
.white-premium-footer{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:16px;
  margin-top:14px;
  padding:16px;
  border-radius:18px;
  background:linear-gradient(135deg,rgba(0,135,255,.10),rgba(2,221,2,.10));
  border:1px solid rgba(0,135,255,.14);
}
.white-premium-footer strong,
.white-premium-footer span{
  display:block;
}
.white-premium-footer strong{
  color:var(--text);
  font-size:14px;
  line-height:1.25;
}
.white-premium-footer span{
  color:var(--text2);
  font-size:12px;
  margin-top:2px;
}
.white-premium-footer b{
  flex-shrink:0;
  padding:8px 12px;
  border-radius:999px;
  background:#fff;
  color:#00B900;
  border:1px solid rgba(2,221,2,.18);
  font-size:12px;
  box-shadow:0 10px 24px rgba(16,32,51,.06);
}
@media(max-width:720px){
  .white-premium-card{
    padding:22px;
    border-radius:24px;
  }
  .white-premium-grid{
    grid-template-columns:1fr;
  }
  .white-premium-item{
    min-height:auto;
  }
  .white-premium-footer{
    align-items:flex-start;
    flex-direction:column;
  }
}

/* Active menu indicator - green brush */
.nav-links a.nav-active,
.nav-links a.active{
  position:relative;
  color:var(--text);
  font-weight:700;
  background:transparent;
}

.nav-links a.nav-active::after,
.nav-links a.active::after{
  content:"";
  position:absolute;
  left:50%;
  bottom:-13px;
  width:82%;
  height:17px;
  pointer-events:none;
  transform:translateX(-50%) rotate(1.2deg);
  transform-origin:center;
  background-repeat:no-repeat;
  background-position:center;
  background-size:100% 100%;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 180 34' preserveAspectRatio='none'%3E%3Cpath d='M10 23 C 38 10, 78 8, 111 14 C 137 19, 154 25, 170 19' fill='none' stroke='%2302DD02' stroke-width='8' stroke-linecap='round' stroke-linejoin='round'/%3E%3Cpath d='M17 22 C 47 14, 77 13, 106 17 C 130 20, 146 24, 162 20' fill='none' stroke='%2302DD02' stroke-width='4' stroke-linecap='round' stroke-linejoin='round' opacity='.42'/%3E%3C/svg%3E");
  filter:drop-shadow(0 8px 9px rgba(2,221,2,.18));
}

.mobile-menu a.nav-active,
.mobile-menu a.active{
  color:var(--sky);
  background:rgba(0,135,255,.07);
  border:1px solid rgba(0,135,255,.12);
  border-radius:12px;
  padding-left:18px;
  padding-right:18px;
}

.mobile-menu a.nav-active::after,
.mobile-menu a.active::after,
.nav-links a.nav-active::before,
.nav-links a.active::before,
.mobile-menu a.nav-active::before,
.mobile-menu a.active::before{
  display:none;
}


/* Ajuste do quadro de pagamento da Assistente IA no mesmo padrão visual do Multiatendimento */
.ai-price-card.ai-price-card-premium .ai-primary-btn{
  margin-bottom:28px !important;
}

.ai-price-card.ai-price-card-premium .ai-price-benefits{
  display:flex !important;
  flex-direction:column !important;
  gap:16px !important;
  margin:0 0 22px !important;
  text-align:left !important;
}

.ai-price-card.ai-price-card-premium .ai-price-benefit,
.ai-price-card.ai-price-card-premium .ai-price-loyalty{
  display:grid !important;
  grid-template-columns:42px 1fr !important;
  gap:14px !important;
  align-items:center !important;
  text-align:left !important;
}

.ai-price-card.ai-price-card-premium .ai-price-benefit > span,
.ai-price-card.ai-price-card-premium .ai-price-loyalty > span{
  width:38px !important;
  height:38px !important;
  border-radius:13px !important;
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  background:rgba(0,135,255,.06) !important;
  border:1px solid rgba(0,135,255,.13) !important;
  color:#0878ff !important;
  flex-shrink:0 !important;
  font-size:21px !important;
  box-shadow:none !important;
}

.ai-price-card.ai-price-card-premium .ai-price-benefit strong,
.ai-price-card.ai-price-card-premium .ai-price-loyalty strong{
  display:block !important;
  color:var(--text) !important;
  font-size:14.5px !important;
  line-height:1.25 !important;
  font-weight:800 !important;
  margin:0 !important;
}

.ai-price-card.ai-price-card-premium .ai-price-benefit small,
.ai-price-card.ai-price-card-premium .ai-price-loyalty small{
  display:block !important;
  margin-top:3px !important;
  color:#526b86 !important;
  font-size:13px !important;
  line-height:1.35 !important;
  font-weight:500 !important;
}

.ai-price-card.ai-price-card-premium .ai-price-loyalty{
  margin-top:auto !important;
  padding:18px !important;
  border-radius:12px !important;
  background:linear-gradient(180deg,rgba(0,135,255,.045),rgba(255,255,255,.82)) !important;
  border:1px solid rgba(0,135,255,.13) !important;
}

@media(max-width:640px){
  .ai-price-card.ai-price-card-premium .ai-price-benefit,
  .ai-price-card.ai-price-card-premium .ai-price-loyalty{
    grid-template-columns:42px 1fr !important;
  }

  .ai-price-card.ai-price-card-premium .ai-price-benefit strong,
  .ai-price-card.ai-price-card-premium .ai-price-loyalty strong{
    font-size:14px !important;
  }

  .ai-price-card.ai-price-card-premium .ai-price-benefit small,
  .ai-price-card.ai-price-card-premium .ai-price-loyalty small{
    font-size:12.5px !important;
  }
}


/* ============================================================================
   Página exclusiva de cadastro White Label
   ============================================================================ */
.reseller-register-page{
  min-height:100vh;
  background:
    radial-gradient(circle at 18% 14%, rgba(0,135,255,.10), transparent 32%),
    radial-gradient(circle at 88% 20%, rgba(2,221,2,.12), transparent 34%),
    linear-gradient(135deg,#F6FAFF 0%,#FFFFFF 48%,#F1FFF6 100%);
}
.register-nav .nav-logo-text{
  display:inline-flex;
  align-items:center;
  white-space:nowrap;
  font-family:Arial,sans-serif;
  font-size:25px;
  font-weight:800;
  line-height:1;
}
.register-nav .brand-blue{color:#0087FF}
.register-nav .brand-green{color:#02DD02}
.register-page-main{
  min-height:calc(100vh - 36px);
  padding:calc(36px + var(--nav-h) + 54px) 24px 80px;
  display:flex;
  align-items:flex-start;
  justify-content:center;
}
.register-page-card{
  width:min(1120px,100%);
  background:rgba(255,255,255,.94);
  border:1px solid rgba(184,215,242,.88);
  border-radius:28px;
  box-shadow:0 34px 100px rgba(16,32,51,.14);
  overflow:hidden;
  position:relative;
}
.register-page-card::before{
  content:'';
  position:absolute;
  inset:0 0 auto 0;
  height:5px;
  background:linear-gradient(90deg,var(--sky),var(--green));
  pointer-events:none;
}
.register-page-intro{
  padding:34px 38px 0;
  max-width:760px;
}
.register-page-intro h1{
  font-family:'Outfit',sans-serif;
  font-size:clamp(30px,3vw,42px);
  line-height:1.08;
  font-weight:900;
  color:var(--text);
  letter-spacing:-.035em;
  margin-bottom:10px;
}
.register-page-intro p{
  color:var(--text2);
  font-size:16px;
  line-height:1.65;
}
.reseller-standalone-form{
  padding-top:26px;
}
@media(max-width:900px){
  .register-nav .nav-cta{display:flex}
  .register-page-main{
    padding:calc(36px + var(--nav-h) + 28px) 14px 50px;
  }
  .register-page-card{
    border-radius:22px;
  }
  .register-page-intro{
    padding:28px 20px 0;
  }
  .register-nav .nav-logo-text{
    font-size:22px;
  }
}
@media(max-width:560px){
  .register-nav .nav-cta .btn-primary{
    display:none;
  }
}

.hero-cta-primary{border-radius:16px;padding:0 34px;min-height:60px;display:inline-flex;align-items:center;gap:12px;box-shadow:0 12px 30px rgba(0,160,255,.18)}


/* ============================================================================
   Assistente IA - linhas verdes no fundo do primeiro bloco
   ============================================================================ */
.ai-hero-premium::after{
  content:'';
  position:absolute;
  inset:-120px -140px -90px -140px;
  background-image:
    repeating-linear-gradient(
      45deg,
      transparent 0,
      transparent 119px,
      rgba(132,255,0,.42) 119px,
      rgba(132,255,0,.42) 120px
    ),
    repeating-linear-gradient(
      -45deg,
      transparent 0,
      transparent 119px,
      rgba(132,255,0,.42) 119px,
      rgba(132,255,0,.42) 120px
    );
  -webkit-mask-image:radial-gradient(
    ellipse 110% 105% at 0% 0%,
    #000 0%,
    rgba(0,0,0,.82) 42%,
    transparent 74%
  );
  mask-image:radial-gradient(
    ellipse 110% 105% at 0% 0%,
    #000 0%,
    rgba(0,0,0,.82) 42%,
    transparent 74%
  );
  opacity:.62;
  pointer-events:none;
  z-index:0;
}


/* ============================================================================
   Assistente IA - fundo com linhas verdes igual ao Multiatendimento
   ============================================================================ */
.ai-page-v2{
  position:relative;
  overflow:hidden;
}

.ai-page-v2::before{
  content:'';
  position:absolute;
  top:0;
  left:0;
  right:0;
  height:900px;
  background-image:
    repeating-linear-gradient(
      45deg,
      transparent 0,
      transparent 119px,
      rgba(132,255,0,.65) 119px,
      rgba(132,255,0,.65) 120px
    ),
    repeating-linear-gradient(
      -45deg,
      transparent 0,
      transparent 119px,
      rgba(132,255,0,.65) 119px,
      rgba(132,255,0,.65) 120px
    );
  -webkit-mask-image:radial-gradient(
    ellipse 100% 100% at 0% 0%,
    #000 0%,
    transparent 72%
  );
  mask-image:radial-gradient(
    ellipse 100% 100% at 0% 0%,
    #000 0%,
    transparent 72%
  );
  pointer-events:none;
  z-index:0;
}

.ai-page-v2 > *{
  position:relative;
  z-index:1;
}

.ai-hero-premium::before,
.ai-hero-premium::after{
  display:none !important;
}

@media(max-width:900px){
  .ai-page-v2::before{
    height:760px;
    -webkit-mask-image:radial-gradient(
      ellipse 115% 100% at 0% 0%,
      #000 0%,
      transparent 74%
    );
    mask-image:radial-gradient(
      ellipse 115% 100% at 0% 0%,
      #000 0%,
      transparent 74%
    );
  }
}


/* ============================================================================
   Assistente IA - ajuste final das linhas verdes do hero
   Mantém o mesmo padrão visual do Multiatendimento, ocupando desde o canto da tela.
   ============================================================================ */
.ai-page-v2{
  position:relative !important;
  overflow:hidden !important;
  isolation:isolate;
}

.ai-page-v2::before{
  content:'' !important;
  position:absolute !important;
  top:0 !important;
  left:50% !important;
  right:auto !important;
  width:100vw !important;
  height:900px !important;
  transform:translateX(-50%) !important;
  background-image:
    repeating-linear-gradient(
      45deg,
      transparent 0,
      transparent 119px,
      rgba(132,255,0,.65) 119px,
      rgba(132,255,0,.65) 120px
    ),
    repeating-linear-gradient(
      -45deg,
      transparent 0,
      transparent 119px,
      rgba(132,255,0,.65) 119px,
      rgba(132,255,0,.65) 120px
    ) !important;
  background-size:auto !important;
  background-position:0 0 !important;
  -webkit-mask-image:radial-gradient(
    ellipse 100% 100% at 0% 0%,
    #000 0%,
    transparent 72%
  ) !important;
  mask-image:radial-gradient(
    ellipse 100% 100% at 0% 0%,
    #000 0%,
    transparent 72%
  ) !important;
  opacity:1 !important;
  pointer-events:none !important;
  z-index:-1 !important;
}

.ai-page-v2 > *{
  position:relative;
  z-index:1;
}

.ai-hero-premium::before,
.ai-hero-premium::after{
  display:none !important;
}

@media(max-width:900px){
  .ai-page-v2::before{
    height:760px !important;
    -webkit-mask-image:radial-gradient(
      ellipse 115% 100% at 0% 0%,
      #000 0%,
      transparent 74%
    ) !important;
    mask-image:radial-gradient(
      ellipse 115% 100% at 0% 0%,
      #000 0%,
      transparent 74%
    ) !important;
  }
}


/* ============================================================================
   Correção final - linhas verdes da Assistente IA iguais ao Multiatendimento
   ============================================================================ */
.ai-page-v2{
  max-width:none !important;
  width:100% !important;
  margin:0 !important;
  padding-left:0 !important;
  padding-right:0 !important;
  position:relative !important;
  overflow:hidden !important;
  isolation:isolate !important;
}

.ai-page-v2::before{
  content:'' !important;
  position:absolute !important;
  top:0 !important;
  left:0 !important;
  right:0 !important;
  width:100% !important;
  height:900px !important;
  transform:none !important;
  background-image:
    repeating-linear-gradient(
      45deg,
      transparent 0,
      transparent 119px,
      rgba(132,255,0,.65) 119px,
      rgba(132,255,0,.65) 120px
    ),
    repeating-linear-gradient(
      -45deg,
      transparent 0,
      transparent 119px,
      rgba(132,255,0,.65) 119px,
      rgba(132,255,0,.65) 120px
    ) !important;
  background-position:0 0 !important;
  background-size:auto !important;
  -webkit-mask-image:radial-gradient(
    ellipse 100% 100% at 0% 0%,
    #000 0%,
    transparent 72%
  ) !important;
  mask-image:radial-gradient(
    ellipse 100% 100% at 0% 0%,
    #000 0%,
    transparent 72%
  ) !important;
  opacity:1 !important;
  pointer-events:none !important;
  z-index:0 !important;
}

.ai-page-v2 > *{
  position:relative !important;
  z-index:1 !important;
}

.ai-hero-v2.ai-hero-premium{
  max-width:1280px !important;
  margin-left:auto !important;
  margin-right:auto !important;
  padding-left:0 !important;
  padding-right:0 !important;
}

.ai-hero-premium::before,
.ai-hero-premium::after{
  display:none !important;
}

@media(max-width:900px){
  .ai-page-v2{
    padding-left:0 !important;
    padding-right:0 !important;
  }

  .ai-page-v2::before{
    height:760px !important;
    -webkit-mask-image:radial-gradient(
      ellipse 115% 100% at 0% 0%,
      #000 0%,
      transparent 74%
    ) !important;
    mask-image:radial-gradient(
      ellipse 115% 100% at 0% 0%,
      #000 0%,
      transparent 74%
    ) !important;
  }

  .ai-hero-v2.ai-hero-premium{
    padding-left:16px !important;
    padding-right:16px !important;
  }
}