.ai-agent-page {
  position: relative;
  background:
    radial-gradient(circle at 10% 2%, rgba(244, 196, 48, .11), transparent 34%),
    radial-gradient(circle at 88% -4%, rgba(122, 99, 255, .13), transparent 38%),
    radial-gradient(circle at 82% 44%, rgba(120, 244, 219, .1), transparent 46%),
    linear-gradient(180deg, #f8fbff 0%, #f4f8ff 52%, #f2f7ff 100%);
  color: #1a2440;
  overflow: hidden;
}
.ai-agent-page::before,
.ai-agent-page::after {
  content: "";
  position: absolute;
  pointer-events: none;
  border-radius: 50%;
  filter: blur(68px);
  z-index: 0;
}
.ai-agent-page::before {
  width: 420px;
  height: 420px;
  top: 22%;
  left: -150px;
  background: radial-gradient(circle at 50% 50%, rgba(119, 156, 255, .23), transparent 72%);
}
.ai-agent-page::after {
  width: 460px;
  height: 460px;
  right: -170px;
  bottom: 8%;
  background: radial-gradient(circle at 50% 50%, rgba(83, 255, 208, .2), transparent 74%);
}
.ai-agent-page .container { position: relative; z-index: 2; }
.ai-agent-page [data-reveal] { opacity: 0; transform: translateY(20px); transition: opacity .7s ease, transform .7s ease; }
.ai-agent-page [data-reveal].is-visible { opacity: 1; transform: translateY(0); }
.ai-agent-hero {
  padding: 88px 0 58px;
  background:
    radial-gradient(circle at 14% 10%, rgba(91, 121, 255, .14), transparent 44%),
    radial-gradient(circle at 88% 14%, rgba(0, 255, 184, .1), transparent 34%),
    linear-gradient(180deg, rgba(255, 255, 255, .55), rgba(246, 250, 255, .5));
}
.ai-agent-hero__grid { display: grid; grid-template-columns: 1.05fr .95fr; gap: 28px; align-items: center; }
.ai-agent-badge { display: inline-block; padding: 8px 14px; border: 1px solid rgba(106, 131, 240, .4); border-radius: 999px; font-size: 12px; letter-spacing: .08em; text-transform: uppercase; color: #4a61c4; background: rgba(255, 255, 255, .72); }
.ai-agent-hero h1 { color: #101c3d; font-size: clamp(36px, 5vw, 60px); margin: 18px 0 10px; line-height: 1.03; }
.ai-agent-hero__subtitle { font-size: clamp(19px, 2.5vw, 26px); color: #2a3f77; margin-bottom: 12px; }
.ai-agent-hero__lead { color: #566b96; max-width: 680px; margin-bottom: 26px; }
.ai-agent-actions { display: flex; flex-wrap: wrap; gap: 12px; }
.ai-agent-section {
  padding: 56px 0;
  background: transparent;
}
.ai-agent-section--dark { background: transparent; }
.ai-agent-section__head { margin-bottom: 26px; }
.ai-agent-section__head h2, .ai-agent-risk h2, .ai-agent-story h2, .ai-agent-cta h2 { color: #12214a; margin-bottom: 12px; font-size: clamp(28px, 3.3vw, 42px); }
.ai-agent-section__head p, .ai-agent-risk p, .ai-agent-story p, .ai-agent-cta p { color: #4f6290; max-width: 920px; }
.ai-agent-grid { display: grid; gap: 16px; }
.ai-agent-grid--4 { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.ai-agent-grid--3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.ai-agent-card { background: linear-gradient(180deg, rgba(255, 255, 255, .95), rgba(247, 251, 255, .95)); border: 1px solid rgba(129, 152, 238, .28); border-radius: 18px; padding: 22px; box-shadow: 0 12px 30px rgba(85, 104, 155, .12); transition: transform .28s ease, border-color .28s ease, box-shadow .28s ease; }
.ai-agent-card:hover { transform: translateY(-5px); border-color: rgba(92, 209, 177, .45); box-shadow: 0 18px 38px rgba(83, 110, 176, .2); }
.ai-agent-card h3 { color: #12214a; margin-bottom: 10px; font-size: 20px; }
.ai-agent-card p, .ai-agent-card li { color: #4f6290; margin-bottom: 0; }
.ai-agent-card ul { margin: 0; padding-left: 20px; display: grid; gap: 8px; }
.ai-agent-card--step { position: relative; }
.ai-agent-card--step::before { content: ''; position: absolute; top: 0; left: 0; right: 0; height: 2px; background: linear-gradient(90deg, #6fa8ff, #74ffd3); }
.ai-agent-risk { padding: 60px 0; background: radial-gradient(circle at 18% 8%, rgba(99, 133, 255, .12), transparent 44%), radial-gradient(circle at 82% 80%, rgba(109, 242, 204, .08), transparent 42%); border-top: 1px solid rgba(119, 146, 255, .14); border-bottom: 1px solid rgba(119, 146, 255, .14); }
.ai-agent-compare { display: grid; gap: 18px; grid-template-columns: repeat(2, minmax(0, 1fr)); }
.ai-agent-card--accent { border-color: rgba(69, 188, 154, .45); background: linear-gradient(180deg, rgba(237, 251, 248, .96), rgba(229, 246, 241, .96)); }
.ai-agent-story { padding: 62px 0; background: radial-gradient(circle at 50% -8%, rgba(140, 94, 255, .1), transparent 48%); }
.ai-agent-faq { display: grid; gap: 12px; }
.ai-agent-faq details { border: 1px solid rgba(127, 145, 255, .26); border-radius: 14px; padding: 16px 18px; background: rgba(255, 255, 255, .92); box-shadow: 0 10px 24px rgba(85, 104, 155, .1); }
.ai-agent-faq summary { cursor: pointer; color: #14224d; font-weight: 600; }
.ai-agent-faq p { margin: 10px 0 0; color: #4f6290; }
.ai-agent-cta { padding: 62px 0 76px; }
.ai-agent-cta__box { border-radius: 22px; border: 1px solid rgba(132, 161, 255, .3); background: radial-gradient(circle at 10% 12%, rgba(104, 138, 255, .24), transparent 38%), linear-gradient(180deg, rgba(255, 255, 255, .96), rgba(237, 246, 255, .95)); padding: 36px; box-shadow: 0 22px 42px rgba(85, 104, 155, .16); }
.ai-agent-hero__visual { display: flex; justify-content: center; }
.ai-dashboard { position: relative; width: min(100%, 500px); height: 380px; border-radius: 22px; border: 1px solid rgba(143, 162, 255, .28); background: radial-gradient(circle at 12% 8%, rgba(255, 255, 255, .9), transparent 36%), radial-gradient(circle at 85% 88%, rgba(132, 171, 255, .2), transparent 40%), linear-gradient(158deg, rgba(242, 248, 255, .94), rgba(231, 240, 255, .9)); box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .55), inset 0 -40px 90px rgba(114, 139, 213, .11), 0 26px 48px rgba(91, 116, 183, .2); overflow: hidden; }
.ai-dashboard__grid { position: absolute; inset: 0; background-image: linear-gradient(rgba(108, 136, 231, .13) 1px, transparent 1px), linear-gradient(90deg, rgba(108, 136, 231, .13) 1px, transparent 1px); background-size: 42px 42px; }
.ai-dashboard__line { position: absolute; height: 2px; background: linear-gradient(90deg, transparent, #2ad8a5, transparent); filter: drop-shadow(0 0 4px rgba(42, 216, 165, .3)); animation: floatLine 4s ease-in-out infinite; }
.ai-dashboard__line--1 { width: 85%; top: 35%; left: 7%; transform: rotate(-7deg); }
.ai-dashboard__line--2 { width: 70%; top: 58%; left: 12%; transform: rotate(9deg); animation-delay: -1.8s; }
.ai-dashboard__candles {
  position: absolute;
  display: flex;
  align-items: flex-end;
  gap: 12px;
  top: 34%;
  left: 10%;
  height: 126px;
}
.ai-dashboard__candles span { display: block; width: 12px; border-radius: 12px; background: linear-gradient(180deg, #57bef4, #6f83e8); box-shadow: 0 0 10px rgba(95, 160, 241, .35); animation: candlePulse 3.2s ease-in-out infinite; }
.ai-dashboard__candles span:nth-child(1){height:62px}.ai-dashboard__candles span:nth-child(2){height:88px;animation-delay:-1s}.ai-dashboard__candles span:nth-child(3){height:48px}.ai-dashboard__candles span:nth-child(4){height:106px;animation-delay:-1.8s}.ai-dashboard__candles span:nth-child(5){height:77px}.ai-dashboard__candles span:nth-child(6){height:92px;animation-delay:-.7s}
.ai-dashboard__node { position: absolute; width: 11px; height: 11px; border-radius: 50%; background: #28d6a3; box-shadow: 0 0 0 5px rgba(40, 214, 163, .16), 0 0 9px rgba(40, 214, 163, .55); animation: pulse 2.3s ease-in-out infinite; }
.ai-dashboard__node--1 { top: 22%; right: 20%; }
.ai-dashboard__node--2 { top: 49%; right: 34%; animation-delay: -.8s; }
.ai-dashboard__node--3 { top: 67%; right: 13%; animation-delay: -1.4s; }
.ai-dashboard__panel { position: absolute; bottom: 10%; right: 7%; border-radius: 12px; border: 1px solid rgba(111, 136, 232, .34); padding: 12px 14px; background: linear-gradient(180deg, rgba(232, 241, 255, .92), rgba(220, 232, 251, .9)); color: #304678; font-size: 14px; box-shadow: 0 8px 20px rgba(96, 122, 187, .14); }
.ai-dashboard__panel strong { color: #197d63; }
@keyframes pulse { 0%,100%{transform:scale(1)}50%{transform:scale(1.25)} }
@keyframes candlePulse { 0%,100%{opacity:.75}50%{opacity:1} }
@keyframes floatLine { 0%,100%{transform:translateY(0) rotate(-7deg)}50%{transform:translateY(-8px) rotate(-6deg)} }
@media (max-width: 1199px){ .ai-agent-grid--4 { grid-template-columns: repeat(2, minmax(0, 1fr)); } .ai-agent-grid--3 { grid-template-columns: repeat(2, minmax(0, 1fr)); } .ai-agent-hero__grid { grid-template-columns: 1fr; } }
@media (max-width: 767px){ .ai-agent-section, .ai-agent-risk, .ai-agent-story, .ai-agent-cta { padding: 44px 0; } .ai-agent-grid--4, .ai-agent-grid--3, .ai-agent-compare { grid-template-columns: 1fr; } .ai-dashboard { height: 300px; } .ai-agent-cta__box { padding: 26px; } }
