/* ===== Tokens ===== */
:root{
  --blue-900:#0B0B0C;
  --blue-600:#0052CC;
  --aqua-500:#00E1E0;
  --orange-500:#FF6A3D;
  --bg-75:#F0F8FC;
  --muted-700:#354153;
  --white:#fff;

  --radius:20px;
  --shadow-sm:0 6px 18px rgba(8,16,24,.06);
  --shadow-md:0 14px 36px rgba(8,16,24,.10);
  --shadow-lg:0 18px 48px rgba(8,16,24,.14);
  --transition:220ms cubic-bezier(.2,.8,.2,1);
}

body{
  font-family:Poppins, ui-sans-serif, system-ui, -apple-system, Segoe UI, Roboto, Arial, Helvetica Neue;
  color:var(--blue-900);
  background:
    radial-gradient(1200px 600px at 70% -10%, #E6F0FF 0%, transparent 60%),
    linear-gradient(#fff, var(--bg-75) 38%, #fff 100%);
}

.text-blue-900{color:var(--blue-900)!important}
.text-muted-700{color:var(--muted-700)!important}
.text-aqua-500{color:var(--aqua-500)!important}

/* ===== Buttons ===== */
.btn-primary-cta{
  background:var(--orange-500);color:#fff;border:2px solid transparent;border-radius:999px;
  box-shadow:0 8px 24px rgba(255,106,61,.35);font-weight:600
}
.btn-primary-cta:hover{transform:translateY(-1px);box-shadow:0 12px 30px rgba(255,106,61,.45)}
.btn-outline-primary-cta{
  color:var(--blue-600);border:2px solid var(--blue-600);border-radius:999px;background:transparent;font-weight:600
}
.btn-outline-primary-cta:hover{background:rgba(0,82,204,.06)}

/* ===== Sections ===== */
.section-hero{padding:88px 0}
.section-default{padding:88px 0}
.section-cta{padding:88px 0;background:
  radial-gradient(700px 220px at 15% -20%, rgba(0,82,204,.10), transparent 70%),
  radial-gradient(700px 220px at 85% 120%, rgba(0,225,224,.10), transparent 70%),
  linear-gradient(#fff,#F7FBFF 60%, #fff);
  border-top:1px solid #EEF3FA;border-bottom:1px solid #EEF3FA
}
.section-faq{
  padding:88px 0;
  background:linear-gradient(180deg,#001633 0%, #052A61 100%);
}

/* ===== Hero Visual (Chat) ===== */
.hero-visual{
  max-width:520px; border-radius:24px; background:linear-gradient(145deg,#ffffff 0%, #F4FAFF 100%);
  box-shadow:var(--shadow-md); padding:26px; overflow:hidden; position:relative
}
.orb{position:absolute;border-radius:50%;filter:blur(44px);opacity:.28}
.orb-a{width:320px;height:320px;background:radial-gradient(circle at 30% 30%, #71B6FF 0%, transparent 60%);top:-70px;left:-70px}
.orb-b{width:280px;height:280px;background:radial-gradient(circle at 70% 60%, #7AF2F1 0%, transparent 60%);bottom:-60px;right:-60px}

.chat-window{
  position:relative;background:#fff;border-radius:18px;border:1px solid #EEF3FA;box-shadow:var(--shadow-lg);
}
.chat-header{height:48px;background:linear-gradient(90deg,#CDE5FF,#F0FAFF);border-top-left-radius:18px;border-top-right-radius:18px}
.chat-body{max-height:360px;overflow:auto}
.msg .bubble{
  background:#F7FAFF;border:1px solid #E8F0FB;border-radius:14px;padding:12px
}
.msg.user .bubble{background:#FFF9F6;border-color:#FFE1D6}
.msg.ai .bubble{background:#F6FFFE;border-color:#D7FFFD}
.msg .hint{color:var(--muted-700)}
.msg .bubble-cta{display:flex;flex-direction:column;gap:6px}
.inline-cta{color:var(--blue-600);text-decoration:none;font-weight:600}
.inline-cta:hover{text-decoration:underline}

.chip{
  position:absolute;display:flex;align-items:center;justify-content:center;
  width:48px;height:48px;border-radius:50%;
  background:linear-gradient(180deg,#F6FBFF,#E9F4FF);border:1px solid #E5F0FF;
  box-shadow:0 12px 22px rgba(8,16,24,.10);z-index:3
}
.chip-bot{bottom:16px;left:22px}
.chip-graph{bottom:22px;right:18px}

/* ===== Why Visual (Panel) ===== */
.why-visual{
  background:linear-gradient(160deg,#ffffff 0%, #F4FAFF 100%);border:1px solid #EEF3FA;border-radius:20px;
  box-shadow:var(--shadow-sm)
}
.panel{
  border-radius:18px;background:#fff;border:1px solid #E6EDF8;box-shadow:var(--shadow-sm);padding:16px;max-width:420px
}
.kpi{background:#F7FAFF;border:1px solid #E8F0FB;border-radius:12px;padding:10px}
.kpi-value{color:var(--blue-600);font-size:22px;font-weight:700;line-height:1}
.mini-spark{height:64px;border-radius:12px;border:1px solid #E8F0FB;background:#fff}

/* bullets */
.bullet .dot{width:12px;height:12px;border-radius:3px;background:var(--blue-600)}

/* tags */
.tag{display:inline-block;padding:6px 10px;border-radius:10px;background:rgba(0,82,204,.08);color:var(--blue-600);font-weight:600;font-size:12px}
.bg-aqua-ghost{background:rgba(0,225,224,.12)!important}

/* ===== Feature Cards ===== */
.feature-card{
  background:#fff;border-radius:var(--radius);border:1px solid #EEF3FA;
  box-shadow:var(--shadow-sm);padding:18px;transition:transform var(--transition), box-shadow var(--transition)
}
.feature-card:hover{transform:translateY(-3px);box-shadow:var(--shadow-md)}
.icon-circle{
  width:56px;height:56px;border-radius:50%;
  background:conic-gradient(from 110deg at 50% 50%, #7BD5FF, #7AF2F1 55%, #D8EEFF 100%);
  display:grid;place-items:center;box-shadow:0 6px 18px rgba(0,82,204,.18)
}

/* ===== FAQ ===== */
.accordion .accordion-button.faq-btn{
  background:rgba(255,255,255,.06); color:#EAF2FF; border-radius:12px; 
  border:1px solid rgba(255,255,255,.15); box-shadow:0 10px 28px rgba(0,0,0,.18);
}
.accordion .accordion-button.faq-btn:not(.collapsed){
  background:rgba(255,255,255,.12); color:#fff;
}
.accordion .accordion-item,
.accordion .accordion-body{
  background:transparent; color:#EAF2FF;
}
.accordion .accordion-button:focus{
  box-shadow:0 0 0 .25rem rgba(0,82,204,.25);
}