:root{
  --bg:#050c14;--panel:#0b1c2b;--text:#f6fbff;--muted:#9eb3c3;--line:#1d3b50;
  --mint:#75f2c6;--mint2:#b7ffe6;--cyan:#5ccfff;--shadow:0 28px 90px rgba(0,0,0,.34);
  --shadow-soft:0 18px 60px rgba(0,0,0,.22);--max:1180px
}
*{box-sizing:border-box}html{scroll-behavior:smooth}
body{margin:0;font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;color:var(--text);background:radial-gradient(circle at 85% -5%,rgba(92,207,255,.14),transparent 28rem),radial-gradient(circle at 7% 23%,rgba(117,242,198,.08),transparent 25rem),linear-gradient(180deg,#050c14 0%,#071522 44%,#050c14 100%);line-height:1.6;min-height:100vh;overflow-x:hidden}
body::before{content:"";position:fixed;inset:0;pointer-events:none;background-image:linear-gradient(rgba(255,255,255,.018) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.018) 1px,transparent 1px);background-size:38px 38px;opacity:.28;mask-image:linear-gradient(to bottom,black,transparent 75%)}
::selection{background:rgba(117,242,198,.25);color:#fff}a{color:inherit}img{max-width:100%}button,input,textarea,select{font:inherit}.container{width:min(var(--max),calc(100% - 36px));margin:0 auto}
.announce{position:relative;z-index:50;text-align:center;padding:9px 16px;font-size:.86rem;color:#d8fff2;border-bottom:1px solid rgba(117,242,198,.14);background:linear-gradient(90deg,rgba(117,242,198,.08),rgba(92,207,255,.09))}.announce strong{color:#fff}
.nav{position:sticky;top:0;z-index:45;background:rgba(5,12,20,.76);backdrop-filter:blur(20px);border-bottom:1px solid rgba(29,59,80,.55)}
.nav-inner{height:74px;display:flex;align-items:center;justify-content:space-between;gap:28px}.brand{display:flex;align-items:center;gap:11px;text-decoration:none;font-weight:900;letter-spacing:-.02em}.brand img{width:43px;height:43px;border-radius:13px;object-fit:cover;border:1px solid rgba(255,255,255,.08);box-shadow:0 10px 32px rgba(0,0,0,.3)}.brand span{font-size:1.01rem}
.nav-links{display:flex;align-items:center;gap:23px}.nav-links>a:not(.btn){text-decoration:none;color:#b7c7d3;font-size:.93rem;transition:.2s ease}.nav-links>a:not(.btn):hover{color:#fff}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:9px;min-height:48px;padding:0 19px;border-radius:999px;border:0;text-decoration:none;font-weight:900;cursor:pointer;transition:transform .2s ease,filter .2s ease,border-color .2s ease}.btn:hover{transform:translateY(-1px)}.btn-primary{color:#031611;background:linear-gradient(135deg,var(--mint),var(--mint2));box-shadow:0 12px 36px rgba(117,242,198,.16)}.btn-secondary{color:#eff9ff;border:1px solid #31536a;background:rgba(10,27,42,.72)}.btn-small{min-height:40px;padding:0 15px;font-size:.88rem}
.hero{position:relative;overflow:hidden;padding:92px 0 54px}.hero-grid{display:grid;grid-template-columns:1.08fr .92fr;gap:60px;align-items:center}
.eyebrow{display:inline-flex;align-items:center;gap:8px;padding:7px 11px;border-radius:999px;background:rgba(117,242,198,.09);border:1px solid rgba(117,242,198,.23);color:#c1f9e7;font-size:.81rem;font-weight:900}.pulse{width:7px;height:7px;border-radius:50%;background:#4ade80;box-shadow:0 0 0 5px rgba(74,222,128,.09)}
h1{max-width:780px;margin:20px 0;font-size:clamp(2.8rem,6.7vw,5.65rem);line-height:.965;letter-spacing:-.066em}.gradient-text{background:linear-gradient(90deg,#fff 8%,var(--mint) 55%,var(--cyan));-webkit-background-clip:text;background-clip:text;color:transparent}.hero-copy{max-width:710px;color:#b1c4d1;font-size:1.13rem;line-height:1.72}.hero-actions{display:flex;flex-wrap:wrap;gap:12px;margin:30px 0 19px}
.trustline{display:flex;align-items:center;flex-wrap:wrap;gap:9px;color:#8ba3b5;font-size:.85rem}.trustline i{width:5px;height:5px;border-radius:50%;background:#496679}
.metrics{display:grid;grid-template-columns:repeat(3,1fr);gap:11px;max-width:640px;margin-top:29px}.metric{padding:15px 16px;border:1px solid rgba(29,59,80,.76);border-radius:17px;background:rgba(7,24,38,.56)}.metric strong{display:block;font-size:1.06rem}.metric span{font-size:.79rem;color:#819cad}
.product-shell{position:relative;overflow:hidden;border:1px solid #2b526a;border-radius:30px;background:linear-gradient(180deg,rgba(15,39,57,.97),rgba(7,23,36,.98));box-shadow:var(--shadow);transform:perspective(1200px) rotateY(-2.2deg) rotateX(1.1deg)}
.windowbar{height:48px;display:flex;align-items:center;justify-content:space-between;padding:0 16px;border-bottom:1px solid #23445d;background:#081a28}.dots{display:flex;gap:7px}.dots span{width:9px;height:9px;border-radius:50%;background:#315069}.dots span:nth-child(1){background:#ff7b72}.dots span:nth-child(2){background:#f6c453}.dots span:nth-child(3){background:#55d98b}.window-url{font-size:.73rem;color:#7893a6;border:1px solid #1f4057;border-radius:999px;background:#061521;padding:4px 12px}
.assistant-top{display:flex;align-items:center;justify-content:space-between;padding:18px 18px 14px}.assistant-brand{display:flex;align-items:center;gap:11px}.bot-avatar{width:43px;height:43px;display:grid;place-items:center;border-radius:14px;background:linear-gradient(135deg,var(--mint),var(--cyan));color:#04151a;font-weight:950}.assistant-brand strong{display:block;font-size:.92rem}.assistant-brand small{color:#82a0b2}.online{display:flex;align-items:center;gap:7px;color:#afe8d8;font-size:.77rem}.online::before{content:"";width:8px;height:8px;border-radius:50%;background:#4ade80;box-shadow:0 0 0 4px rgba(74,222,128,.09)}
.chat{min-height:408px;padding:4px 18px 20px;display:flex;flex-direction:column;gap:12px}.bubble{position:relative;z-index:2;max-width:84%;padding:11px 13px;border-radius:16px;font-size:.9rem}.bubble.bot{align-self:flex-start;color:#edf8ff;background:#102c41;border:1px solid #294d66;border-bottom-left-radius:5px}.bubble.user{align-self:flex-end;color:#041710;font-weight:750;background:linear-gradient(135deg,#70f0c3,#9bffdf);border-bottom-right-radius:5px}.quick{position:relative;z-index:2;display:flex;flex-wrap:wrap;gap:8px;margin-top:auto}.quick button{padding:8px 11px;border:1px solid #2b5069;border-radius:999px;color:#d9e8f2;background:#091c2a;cursor:pointer;font-size:.79rem}.quick button:hover{border-color:var(--mint)}.quick button:disabled{opacity:.42;cursor:default}.demo-label{padding:12px 18px;border-top:1px solid #203f56;color:#7592a5;font-size:.75rem;background:#071723}
.logo-strip{padding:8px 0 0}.logo-strip p{text-align:center;margin:0 0 16px;color:#7892a4;font-size:.81rem}.industry-row{display:flex;justify-content:center;flex-wrap:wrap;gap:9px}.industry-pill{padding:8px 12px;border:1px solid #1d394f;border-radius:999px;background:#081827;color:#9fb4c3;font-size:.78rem}
.section{padding:88px 0}.section.alt{background:rgba(3,13,22,.50);border-top:1px solid rgba(29,59,80,.5);border-bottom:1px solid rgba(29,59,80,.5)}.section-head{max-width:790px;margin-bottom:39px}.kicker{color:#82efd1;font-size:.77rem;font-weight:950;letter-spacing:.14em;text-transform:uppercase}h2{margin:8px 0 14px;font-size:clamp(2.15rem,4vw,3.82rem);line-height:1.035;letter-spacing:-.047em}.section-head p{max-width:710px;color:#9eb4c4;font-size:1.03rem}
.grid3{display:grid;grid-template-columns:repeat(3,1fr);gap:17px}.feature{position:relative;overflow:hidden;padding:25px;border:1px solid #1d3b51;border-radius:22px;background:linear-gradient(180deg,rgba(11,31,47,.90),rgba(7,23,36,.85));box-shadow:var(--shadow-soft)}.feature-icon{width:44px;height:44px;display:grid;place-items:center;border:1px solid #2c526b;border-radius:14px;background:linear-gradient(135deg,rgba(117,242,198,.15),rgba(92,207,255,.15));color:#dffaf2}.feature-icon svg{width:21px;height:21px}.feature h3{margin:15px 0 8px;font-size:1.05rem}.feature p{margin:0;color:#93adbd;font-size:.92rem}
.workflow{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}.step{padding:25px;border:1px solid #1f4057;border-radius:22px;background:#081a29}.step-num{width:38px;height:38px;display:grid;place-items:center;border:1px solid rgba(117,242,198,.24);border-radius:50%;background:rgba(117,242,198,.09);color:#c6f9e9;font-weight:950}.step h3{margin:18px 0 8px}.step p{margin:0;color:#92aabb}
.split{display:grid;grid-template-columns:.9fr 1.1fr;gap:50px;align-items:center}.benefit-list{display:grid;gap:12px}.benefit{display:flex;gap:13px;padding:16px;border:1px solid #1b3b51;border-radius:17px;background:#081a29}.check{flex:0 0 30px;width:30px;height:30px;display:grid;place-items:center;border-radius:10px;background:rgba(117,242,198,.09);color:var(--mint);font-weight:950}.benefit strong{display:block;margin-bottom:3px}.benefit span{color:#91aabb;font-size:.89rem}.value-card{margin-top:18px;padding:18px;border:1px solid #254b62;border-radius:17px;background:linear-gradient(135deg,rgba(117,242,198,.07),rgba(92,207,255,.06));color:#c7d8e3}
.pricing-grid{display:grid;grid-template-columns:1fr .82fr;gap:22px}.price-card{padding:31px;border:1px solid #2a5972;border-radius:28px;background:radial-gradient(circle at 90% 0,rgba(117,242,198,.12),transparent 16rem),linear-gradient(180deg,#0d273a,#091b29);box-shadow:var(--shadow)}.price-top{display:flex;align-items:center;justify-content:space-between;gap:20px}.tag{padding:6px 10px;border:1px solid rgba(117,242,198,.24);border-radius:999px;color:#bcf7e4;background:rgba(117,242,198,.09);font-size:.73rem;font-weight:950}.price{margin:18px 0 8px;font-size:4.25rem;line-height:1;font-weight:950;letter-spacing:-.072em}.price small{font-size:1rem;font-weight:750;letter-spacing:0;color:#8ea9ba}.price-sub{color:#9eb4c4}.price-list{list-style:none;padding:0;margin:24px 0}.price-list li{margin:11px 0;color:#dce8f1}.price-list li::before{content:"✓";margin-right:9px;color:var(--mint);font-weight:950}.side-card{padding:30px;border:1px solid #1f4057;border-radius:28px;background:#081927}.side-card h3{margin-top:0;font-size:1.45rem}.side-card p{color:#97afbf}.mini-proof{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:24px}.mini-proof div{padding:15px;border:1px solid #1d3c52;border-radius:15px;background:#071521}.mini-proof strong{display:block}.mini-proof span{font-size:.77rem;color:#7e99ab}
.faq{display:grid;gap:11px;max-width:920px}details{padding:18px 20px;border:1px solid #1d3b51;border-radius:17px;background:#081927}summary{cursor:pointer;font-weight:850}details p{margin:11px 0 0;color:#92aabb}
.cta{padding:86px 0}.cta-box{padding:40px;border:1px solid #315e77;border-radius:31px;background:radial-gradient(circle at 100% 0,rgba(92,207,255,.15),transparent 22rem),radial-gradient(circle at 0 100%,rgba(117,242,198,.10),transparent 22rem),#0a2030;box-shadow:var(--shadow)}.cta-grid{display:grid;grid-template-columns:.78fr 1.22fr;gap:40px}.cta h2{margin-top:0}.cta-copy p{color:#9fb5c6}.contact-links{display:flex;flex-direction:column;gap:9px;margin-top:25px}.contact-links a{text-decoration:none;color:#dceaf3}.contact-links span{display:block;color:#7f9aab;font-size:.78rem}
.lead-form{display:grid;grid-template-columns:1fr 1fr;gap:11px}.lead-form input,.lead-form select,.lead-form textarea{width:100%;padding:13px 14px;border:1px solid #2a4b62;border-radius:13px;outline:none;background:#061521;color:#fff}.lead-form input:focus,.lead-form select:focus,.lead-form textarea:focus{border-color:var(--mint);box-shadow:0 0 0 3px rgba(117,242,198,.08)}.lead-form textarea{grid-column:1/-1;resize:vertical}.lead-form .full{grid-column:1/-1}.form-note{grid-column:1/-1;margin:0;color:#7894a6;font-size:.74rem}
.subhero{padding:70px 0 34px}.breadcrumbs{font-size:.8rem;color:#7894a6;margin-bottom:18px}.breadcrumbs a{text-decoration:none;color:#9db4c4}.subhero h1{font-size:clamp(2.6rem,5.5vw,4.8rem);max-width:950px}.subhero p{max-width:760px;color:#abc0ce;font-size:1.07rem}.content-grid{display:grid;grid-template-columns:1.05fr .65fr;gap:34px}.article{padding:27px;border:1px solid #1d3b51;border-radius:22px;background:#081927}.article h2{font-size:2rem}.article h3{margin-top:30px}.article p,.article li{color:#9db2c1}.sticky-card{position:sticky;top:104px;padding:24px;border:1px solid #2a5972;border-radius:22px;background:linear-gradient(180deg,#0d273a,#091b29)}.sticky-card h3{margin-top:0}.sticky-card p{color:#93adbd}.sticky-card .btn{width:100%;margin-top:10px}
.footer{padding:32px 0 46px;border-top:1px solid #183448;color:#7894a6}.footer-inner{display:flex;justify-content:space-between;gap:20px}.footer strong{color:#d5e7f1}.footer a{text-decoration:none;color:#a9bfcd}.footer-nav{display:flex;gap:14px;flex-wrap:wrap}.mobile-cta{display:none}
@media(max-width:960px){.hero-grid,.split,.pricing-grid,.cta-grid,.content-grid{grid-template-columns:1fr}.hero{padding-top:60px}.product-shell{transform:none;max-width:700px}.grid3,.workflow{grid-template-columns:1fr 1fr}.nav-links>a:not(.btn){display:none}.sticky-card{position:static}}
@media(max-width:660px){.container{width:min(100% - 24px,var(--max))}.announce{font-size:.76rem}.nav-inner{height:64px}.brand img{width:37px;height:37px}.brand span{font-size:.92rem}.hero{padding:50px 0 34px}h1{font-size:3.05rem}.hero-copy{font-size:1.01rem}.hero-actions .btn{width:100%}.metrics{grid-template-columns:1fr}.grid3,.workflow{grid-template-columns:1fr}.section{padding:68px 0}.cta-box{padding:27px 20px}.lead-form{grid-template-columns:1fr}.lead-form textarea,.lead-form .full,.form-note{grid-column:1}.footer-inner{flex-direction:column}.price{font-size:3.55rem}.mobile-cta{display:flex;position:fixed;z-index:60;left:12px;right:12px;bottom:12px;padding:8px;border:1px solid #284c64;border-radius:999px;background:rgba(5,13,22,.88);backdrop-filter:blur(16px);box-shadow:0 18px 50px rgba(0,0,0,.42)}.mobile-cta .btn{width:100%}body{padding-bottom:76px}}

/* Contact form submission status */
.form-status {
  grid-column: 1 / -1;
  min-height: 24px;
  padding: 0;
  margin-top: 4px;
  font-size: 0.9rem;
}

.form-status.success {
  padding: 13px 15px;
  border: 1px solid rgba(117, 242, 198, 0.35);
  border-radius: 13px;
  background: rgba(117, 242, 198, 0.08);
  color: #bff9e6;
}

.form-status.error {
  padding: 13px 15px;
  border: 1px solid rgba(255, 124, 145, 0.35);
  border-radius: 13px;
  background: rgba(255, 124, 145, 0.08);
  color: #ffc4cd;
}

.lead-form button:disabled {
  opacity: 0.65;
  cursor: wait;
}


/* ==========================================
   REAL AI CHAT
========================================== */

.real-ai-chat {
  padding: 0 18px 18px;
}

.chat-log {
  height: 300px;
  overflow-y: auto;
  display: flex;
  flex-direction: column;
  gap: 12px;
  padding: 8px 2px 16px;
  scrollbar-width: thin;
}

.chat-log::-webkit-scrollbar {
  width: 6px;
}

.chat-log::-webkit-scrollbar-thumb {
  background: #294d66;
  border-radius: 99px;
}

.chat-suggestions {
  display: flex;
  flex-wrap: wrap;
  gap: 7px;
  margin: 5px 0 12px;
}

.chat-suggestions button {
  border: 1px solid #294d66;
  background: #091c2a;
  color: #cce0eb;
  padding: 7px 10px;
  border-radius: 999px;
  cursor: pointer;
  font-size: 0.76rem;
}

.chat-suggestions button:hover {
  border-color: #75f2c6;
  color: #fff;
}

.chat-composer {
  display: flex;
  gap: 8px;
}

.chat-composer input {
  flex: 1;
  min-width: 0;
  border: 1px solid #2a4b62;
  background: #061521;
  color: #fff;
  border-radius: 13px;
  padding: 12px 13px;
  outline: none;
}

.chat-composer input:focus {
  border-color: #75f2c6;
  box-shadow: 0 0 0 3px rgba(117,242,198,.08);
}

.chat-composer button {
  border: 0;
  border-radius: 13px;
  padding: 0 17px;
  background: linear-gradient(
    135deg,
    #75f2c6,
    #b7ffe6
  );
  color: #031611;
  font-weight: 900;
  cursor: pointer;
}

.chat-composer button:hover {
  filter: brightness(1.05);
}

.chat-disclaimer {
  margin-top: 9px;
  color: #68879b;
  font-size: 0.68rem;
}


/* FORM RESULT */

.form-status {
  grid-column: 1 / -1;
  min-height: 24px;
  margin-top: 4px;
  font-size: 0.9rem;
}

.form-status.success {
  padding: 13px 15px;
  border: 1px solid rgba(117,242,198,.35);
  border-radius: 13px;
  background: rgba(117,242,198,.08);
  color: #bff9e6;
}

.form-status.error {
  padding: 13px 15px;
  border: 1px solid rgba(255,124,145,.35);
  border-radius: 13px;
  background: rgba(255,124,145,.08);
  color: #ffc4cd;
}

.lead-form button:disabled {
  opacity: .65;
  cursor: wait;
}

@media(max-width:660px) {
  .chat-log {
    height: 330px;
  }

  .chat-composer button {
    padding: 0 14px;
  }
}


/* =========================================
   PREMIUM AI CHAT V3
========================================= */

.ai-console {
  position: relative;
  overflow: hidden;

  border:
    1px solid rgba(
      92,
      207,
      255,
      .25
    );

  border-radius:
    30px;

  background:
    linear-gradient(
      180deg,
      rgba(13,34,51,.98),
      rgba(6,20,32,.99)
    );

  box-shadow:
    0 35px 120px rgba(0,0,0,.45),
    0 0 70px rgba(92,207,255,.06);
}


.ai-console::before {
  content: "";

  position: absolute;

  width: 300px;
  height: 300px;

  top: -190px;
  right: -100px;

  border-radius: 50%;

  background:
    radial-gradient(
      circle,
      rgba(92,207,255,.17),
      transparent 70%
    );

  pointer-events: none;
}


.ai-console-header {
  min-height: 74px;

  display: flex;

  align-items: center;

  justify-content:
    space-between;

  gap: 20px;

  padding:
    14px 18px;

  border-bottom:
    1px solid
    rgba(43,82,106,.7);

  background:
    rgba(5,18,29,.75);

  backdrop-filter:
    blur(20px);
}


.ai-brand {
  display: flex;

  align-items: center;

  gap: 12px;
}


.ai-logo {
  width: 46px;
  height: 46px;

  display: grid;

  place-items: center;

  border-radius: 15px;

  color: #041710;

  font-size: .83rem;

  font-weight: 950;

  background:
    linear-gradient(
      135deg,
      #75f2c6,
      #5ccfff
    );

  box-shadow:
    0 10px 30px
    rgba(92,207,255,.16);
}


.ai-brand strong {
  font-size:
    .96rem;
}


.ai-brand small {
  display: block;

  margin-top: 2px;

  color:
    #7f9cae;

  font-size:
    .76rem;
}


.ai-title-row {
  display: flex;

  align-items:
    center;

  gap: 9px;
}


.ai-status {
  display:
    inline-flex;

  align-items:
    center;

  gap: 5px;

  color:
    #9ee4cf;

  font-size:
    .66rem;
}


.status-dot {
  width: 7px;

  height: 7px;

  border-radius:
    50%;

  background:
    #4ade80;

  box-shadow:
    0 0 0 4px
    rgba(74,222,128,.08);
}


.new-chat-button {
  border:
    1px solid
    #294b62;

  border-radius:
    10px;

  background:
    rgba(8,27,42,.8);

  color:
    #a9bfcd;

  padding:
    8px 11px;

  cursor:
    pointer;

  font-size:
    .72rem;
}


.new-chat-button:hover {
  color: #fff;

  border-color:
    #42708c;
}


.ai-chat-area {
  padding:
    20px;
}


.ai-chat-intro {
  margin-bottom:
    20px;
}


.ai-chat-intro span {
  color:
    #75f2c6;

  font-size:
    .67rem;

  font-weight:
    950;

  letter-spacing:
    .14em;
}


.ai-chat-intro h3 {
  margin:
    6px 0 3px;

  font-size:
    1.35rem;

  letter-spacing:
    -.025em;
}


.ai-chat-intro p {
  margin: 0;

  color:
    #819dad;

  font-size:
    .82rem;
}


.premium-chat-log {
  height:
    360px;

  overflow-y:
    auto;

  display:
    flex;

  flex-direction:
    column;

  gap:
    18px;

  padding:
    12px 4px
    20px;

  scroll-behavior:
    smooth;

  scrollbar-width:
    thin;

  scrollbar-color:
    #294b62
    transparent;
}


.premium-chat-log::-webkit-scrollbar {
  width:
    6px;
}


.premium-chat-log::-webkit-scrollbar-thumb {
  background:
    #294b62;

  border-radius:
    99px;
}


.message-row {
  display:
    flex;

  gap:
    10px;

  align-items:
    flex-start;

  opacity: 0;

  transform:
    translateY(8px);

  animation:
    message-in
    .28s ease
    forwards;
}


@keyframes message-in {

  to {
    opacity: 1;

    transform:
      translateY(0);
  }

}


.user-message {
  flex-direction:
    row-reverse;
}


.message-avatar {
  flex:
    0 0
    34px;

  width:
    34px;

  height:
    34px;

  display:
    grid;

  place-items:
    center;

  border-radius:
    11px;

  font-size:
    .62rem;

  font-weight:
    950;
}


.ai-avatar {
  color:
    #041710;

  background:
    linear-gradient(
      135deg,
      #75f2c6,
      #5ccfff
    );
}


.user-avatar {
  color:
    #e3edf4;

  background:
    #16344a;

  border:
    1px solid
    #31536a;
}


.message-content {
  max-width:
    78%;
}


.user-message
.message-content {
  display: flex;

  flex-direction:
    column;

  align-items:
    flex-end;
}


.message-name {
  margin:
    0 0 5px;

  color:
    #708c9e;

  font-size:
    .67rem;

  font-weight:
    800;
}


.message-bubble {
  padding:
    12px 14px;

  border-radius:
    17px;

  font-size:
    .87rem;

  line-height:
    1.58;

  white-space:
    pre-wrap;
}


.bot-message
.message-bubble {
  color:
    #dfeef6;

  border:
    1px solid
    rgba(45,80,105,.85);

  border-top-left-radius:
    5px;

  background:
    linear-gradient(
      180deg,
      #102b3f,
      #0d2435
    );
}


.user-message
.message-bubble {
  color:
    #041710;

  font-weight:
    650;

  border-top-right-radius:
    5px;

  background:
    linear-gradient(
      135deg,
      #75f2c6,
      #a5ffe0
    );
}


.typing-bubble {
  display:
    flex;

  align-items:
    center;

  gap:
    5px;

  min-width:
    58px;

  min-height:
    42px;
}


.typing-bubble span {
  width:
    6px;

  height:
    6px;

  border-radius:
    50%;

  background:
    #7c99aa;

  animation:
    typing-dot
    1.2s infinite
    ease-in-out;
}


.typing-bubble span:nth-child(2) {
  animation-delay:
    .15s;
}


.typing-bubble span:nth-child(3) {
  animation-delay:
    .30s;
}


@keyframes typing-dot {

  0%,
  60%,
  100% {
    opacity: .3;

    transform:
      translateY(0);
  }

  30% {
    opacity: 1;

    transform:
      translateY(-3px);
  }

}


.premium-suggestions {
  display:
    flex;

  gap:
    8px;

  flex-wrap:
    wrap;

  margin:
    6px 0 13px;

  max-height:
    100px;

  opacity: 1;

  transition:
    all .25s ease;
}


.premium-suggestions
button {
  padding:
    8px 11px;

  border:
    1px solid
    #294d66;

  border-radius:
    999px;

  color:
    #bcd0dc;

  background:
    rgba(9,28,42,.82);

  cursor:
    pointer;

  font-size:
    .73rem;

  transition:
    .18s ease;
}


.premium-suggestions
button:hover {
  color: #fff;

  border-color:
    #75f2c6;

  transform:
    translateY(-1px);
}


.suggestions-hidden {
  opacity: 0;

  max-height: 0;

  overflow: hidden;

  margin:
    0;
}


.premium-composer {
  position:
    relative;
}


.composer-inner {
  display: flex;

  align-items:
    center;

  gap: 8px;

  padding:
    7px;

  border:
    1px solid
    #2b4e65;

  border-radius:
    17px;

  background:
    rgba(4,17,27,.92);

  box-shadow:
    inset
    0 1px 0
    rgba(255,255,255,.025);

  transition:
    .2s ease;
}


.composer-inner:focus-within {
  border-color:
    rgba(117,242,198,.62);

  box-shadow:
    0 0 0 4px
    rgba(117,242,198,.06);
}


.composer-inner input {
  flex: 1;

  min-width: 0;

  border: 0;

  outline: 0;

  color:
    #f4fbff;

  background:
    transparent;

  padding:
    8px 9px;

  font-size:
    .88rem;
}


.composer-inner input::placeholder {
  color:
    #5e7a8c;
}


.send-button {
  flex:
    0 0 42px;

  width:
    42px;

  height:
    42px;

  display:
    grid;

  place-items:
    center;

  border: 0;

  border-radius:
    12px;

  color:
    #031611;

  cursor:
    pointer;

  background:
    linear-gradient(
      135deg,
      #75f2c6,
      #b7ffe6
    );

  transition:
    .18s ease;
}


.send-button:hover {
  transform:
    translateY(-1px);

  filter:
    brightness(1.05);
}


.send-button svg {
  width:
    19px;

  height:
    19px;
}


.ai-footer-note {
  margin-top:
    9px;

  text-align:
    center;

  color:
    #597587;

  font-size:
    .64rem;
}


@media(
  max-width: 660px
) {

  .ai-console {
    border-radius:
      23px;
  }


  .ai-chat-area {
    padding:
      15px;
  }


  .premium-chat-log {
    height:
      420px;
  }


  .message-content {
    max-width:
      84%;
  }


  .ai-chat-intro
  h3 {
    font-size:
      1.18rem;
  }


  .new-chat-button {
    padding:
      7px 9px;
  }

}