/* ============================================================
   InVision shared visual theme
   Reference direction: clear sky hero, glass panels, blue-cyan
   product UI, soft shadows, deep growth CTA/footer.
   ============================================================ */

:root {
  --primary: #126BFF;
  --primary-dark: #0B1838;
  --primary-light: #5CA8FF;
  --primary-blue: #126BFF;
  --primary-blue-hover: #0758E6;
  --primary-blue-light: #EAF5FF;
  --accent: #19C8FF;
  --accent-blue: #2E83FF;
  --accent-green: #16C7A2;
  --accent-purple: #775DFF;
  --accent-orange: #37A8FF;
  --accent-pink: #D95CFF;

  --brand: var(--primary);
  --brand-600: var(--primary-blue-hover);
  --brand-700: #0A3A8C;
  --brand-light: #EAF5FF;
  --brand-soft: rgba(18, 107, 255, 0.08);
  --brand-border: rgba(86, 150, 255, 0.2);
  --brand-border-strong: rgba(60, 130, 255, 0.36);
  --purple: var(--accent-purple);
  --cyan: var(--accent);
  --green: var(--accent-green);

  --bg-primary: #F7FCFF;
  --bg-secondary: #EEF8FF;
  --bg-tertiary: #E5F2FF;
  --bg-white: rgba(255, 255, 255, 0.9);
  --bg-card: rgba(255, 255, 255, 0.82);
  --bg: #F7FCFF;
  --bg-soft: #EEF8FF;
  --bg-section: linear-gradient(180deg, #F8FDFF 0%, #FFFFFF 100%);
  --bg-hero:
    radial-gradient(ellipse at 70% 8%, rgba(28, 190, 255, 0.28) 0%, transparent 38%),
    radial-gradient(ellipse at 20% 12%, rgba(67, 132, 255, 0.28) 0%, transparent 36%),
    linear-gradient(180deg, #66A7FF 0%, #CDEBFF 47%, #FFFFFF 100%);
  --bg-brand: linear-gradient(135deg, #EAF5FF 0%, #F7FCFF 100%);
  --bg-dark: linear-gradient(135deg, #071229 0%, #0C1B46 58%, #030711 100%);

  --text-primary: #0D1837;
  --text-secondary: #3D4A67;
  --text-muted: #7B8BAB;
  --text: var(--text-primary);
  --text-inverse: #FFFFFF;
  --text-inverse-muted: rgba(236, 246, 255, 0.72);
  --border: rgba(110, 164, 255, 0.22);
  --border-light: rgba(124, 178, 255, 0.22);
  --border-subtle: rgba(219, 237, 255, 0.8);
  --border-hover: rgba(63, 135, 255, 0.42);

  --shadow-sm: 0 8px 24px rgba(43, 108, 196, 0.07);
  --shadow-md: 0 18px 44px rgba(43, 108, 196, 0.11);
  --shadow-lg: 0 28px 70px rgba(41, 101, 194, 0.15);
  --shadow-xl: 0 38px 96px rgba(37, 89, 181, 0.2);
  --shadow-btn: 0 14px 28px rgba(18, 107, 255, 0.26);

  --radius-sm: 12px;
  --radius-md: 16px;
  --radius-lg: 20px;
  --radius-xl: 28px;
  --radius-full: 999px;

  --gradient-primary: linear-gradient(135deg, #0D6CFF 0%, #28B8FF 54%, #765DFF 100%);
  --gradient-btn: linear-gradient(135deg, #0B6BFF 0%, #1BBEFF 100%);
  --gradient-blue: linear-gradient(135deg, #0B6BFF 0%, #20C7FF 100%);
  --gradient-hero: var(--bg-hero);
  --gradient-title: linear-gradient(100deg, #075DFF 0%, #1AA7FF 48%, #765DFF 100%);
  --gradient-accent-1: linear-gradient(135deg, #126BFF 0%, #1FCAFF 100%);
  --gradient-accent-2: linear-gradient(135deg, #745DFF 0%, #CF67FF 100%);
  --gradient-accent-3: linear-gradient(135deg, #11BFA4 0%, #31D5FF 100%);
  --gradient-accent-4: linear-gradient(135deg, #3FA0FF 0%, #7D8CFF 100%);

  --glass-card: linear-gradient(145deg, rgba(255, 255, 255, 0.92), rgba(239, 248, 255, 0.68));
  --glass-soft: linear-gradient(145deg, rgba(255, 255, 255, 0.78), rgba(229, 244, 255, 0.48));
}

html { scroll-behavior: smooth; }

[id] { scroll-margin-top: 86px; }

* { letter-spacing: 0 !important; }

body {
  color: var(--text-primary) !important;
  background:
    linear-gradient(180deg, #F7FCFF 0%, #FFFFFF 38%, #F3FAFF 72%, #FFFFFF 100%) !important;
  position: relative;
}

body::before {
  content: "";
  position: fixed;
  inset: 0;
  z-index: -2;
  pointer-events: none;
  background-image:
    linear-gradient(rgba(66, 142, 255, 0.045) 1px, transparent 1px),
    linear-gradient(90deg, rgba(66, 142, 255, 0.045) 1px, transparent 1px);
  background-size: 52px 52px;
  mask-image: linear-gradient(180deg, rgba(0,0,0,0.7) 0%, rgba(0,0,0,0.14) 50%, transparent 82%);
}

body::after {
  content: "";
  position: fixed;
  left: 0;
  right: 0;
  bottom: 0;
  height: 48vh;
  z-index: -1;
  pointer-events: none;
  background: linear-gradient(0deg, rgba(218, 244, 255, 0.45), transparent 78%);
}

/* Navigation */
.nav {
  height: 68px !important;
  padding: 0 clamp(18px, 5vw, 86px) !important;
  background: rgba(255, 255, 255, 0.76) !important;
  border-bottom: 1px solid rgba(136, 183, 255, 0.24) !important;
  box-shadow: 0 12px 36px rgba(39, 103, 196, 0.08) !important;
  backdrop-filter: blur(20px) saturate(1.25) !important;
  -webkit-backdrop-filter: blur(20px) saturate(1.25) !important;
}

.nav-logo { gap: 10px !important; color: var(--text-primary) !important; }

.nav-logo-icon {
  width: 34px !important;
  height: 34px !important;
  flex: 0 0 34px;
  border-radius: 0 !important;
  background: url("./insai-invision-logo.png") center / contain no-repeat !important;
  box-shadow: none !important;
  color: transparent !important;
  font-size: 0 !important;
  filter: drop-shadow(0 10px 18px rgba(31, 111, 255, 0.16)) !important;
}

.nav-logo-icon::before,
.nav-logo-icon::after { display: none !important; content: none !important; }

.nav-brand-text { display: grid !important; gap: 0 !important; line-height: 1.12 !important; }
.nav-brand-cn { font-size: 15px !important; font-weight: 850 !important; color: var(--text-primary) !important; -webkit-text-fill-color: var(--text-primary) !important; }
.nav-brand-en { font-size: 10px !important; font-weight: 750 !important; color: #5B6C90 !important; text-transform: uppercase !important; margin-left: 0 !important; }

.nav-links { gap: clamp(18px, 2.8vw, 34px) !important; }
.nav-links a {
  color: rgba(24, 39, 75, 0.72) !important;
  font-size: 14px !important;
  font-weight: 750 !important;
  position: relative !important;
}
.nav-links a::after {
  content: "";
  position: absolute;
  left: 6px;
  right: 6px;
  bottom: -23px;
  height: 2px;
  border-radius: var(--radius-full);
  background: var(--gradient-btn);
  transform: scaleX(0);
  transform-origin: center;
  transition: transform 0.24s ease;
}
.nav-links a:hover,
.nav-links a.active { color: #0B65FF !important; }
.nav-links a:hover::after,
.nav-links a.active::after { transform: scaleX(1); }

.btn-nav-login,
.btn-hero-secondary,
.btn-cta-secondary {
  color: #16406F !important;
  background: rgba(255, 255, 255, 0.78) !important;
  border: 1px solid rgba(102, 164, 255, 0.26) !important;
  border-radius: var(--radius-full) !important;
  box-shadow: 0 10px 24px rgba(38, 103, 201, 0.08) !important;
  font-weight: 800 !important;
  transition: transform 0.28s ease, box-shadow 0.28s ease, border-color 0.28s ease !important;
}

.btn-nav-cta,
.btn-hero-primary,
.btn-cta-primary,
.filter-btn.active {
  color: #FFFFFF !important;
  background: var(--gradient-btn) !important;
  border: none !important;
  border-radius: var(--radius-full) !important;
  box-shadow: var(--shadow-btn), inset 0 1px 0 rgba(255, 255, 255, 0.36) !important;
  font-weight: 850 !important;
  transition: transform 0.28s ease, box-shadow 0.28s ease !important;
}

.btn-nav-login:hover,
.btn-hero-secondary:hover,
.btn-cta-secondary:hover,
.btn-nav-cta:hover,
.btn-hero-primary:hover,
.btn-cta-primary:hover {
  transform: translateY(-2px) !important;
  border-color: rgba(60, 136, 255, 0.44) !important;
  box-shadow: 0 18px 40px rgba(36, 107, 218, 0.2) !important;
}

/* Hero */
.hero,
.cases-hero {
  min-height: 720px !important;
  padding: 122px clamp(18px, 5vw, 86px) 84px !important;
  background: var(--bg-hero) !important;
  isolation: isolate;
  overflow: hidden !important;
}

.cases-hero { min-height: 430px !important; display: flex !important; align-items: center !important; }

.rules-hero {
  min-height: 430px !important;
  display: flex !important;
  align-items: center !important;
  padding-bottom: 70px !important;
}

.hero::before,
.cases-hero::before {
  content: "";
  position: absolute;
  left: -12%;
  right: -10%;
  bottom: -110px;
  height: 275px;
  z-index: 0;
  pointer-events: none;
  background:
    linear-gradient(90deg, rgba(255,255,255,0.16), rgba(255,255,255,0.84) 36%, rgba(98, 153, 255, 0.24) 68%, rgba(255,255,255,0.1)),
    linear-gradient(180deg, rgba(210, 231, 255, 0.68), rgba(255,255,255,0.2));
  border: 1px solid rgba(255,255,255,0.58);
  border-radius: 50% 50% 0 0 / 100% 100% 0 0;
  transform: rotate(-2deg);
  box-shadow: 0 -24px 90px rgba(38, 113, 221, 0.16);
}

.hero::after,
.cases-hero::after {
  content: "";
  position: absolute;
  right: -7vw;
  bottom: 12%;
  width: min(760px, 58vw);
  height: min(260px, 22vw);
  z-index: 0;
  pointer-events: none;
  background: linear-gradient(90deg, rgba(79, 137, 255, 0.18), rgba(255,255,255,0.72), rgba(24, 198, 255, 0.2));
  border: 1px solid rgba(255,255,255,0.62);
  border-radius: 999px;
  transform: perspective(900px) rotateX(64deg) rotateZ(-5deg);
  box-shadow: 0 28px 80px rgba(26, 101, 214, 0.14);
}

.hero-orb-1,
.hero-orb-2,
.hero-glow {
  display: none !important;
}

.hero-container {
  max-width: 1210px !important;
  gap: clamp(44px, 6vw, 82px) !important;
  position: relative !important;
  z-index: 2 !important;
}

.hero-left,
.hero-right { position: relative !important; z-index: 2 !important; }

.hero-badge {
  padding: 8px 18px !important;
  background: rgba(255, 255, 255, 0.64) !important;
  border: 1px solid rgba(105, 165, 255, 0.26) !important;
  border-radius: var(--radius-full) !important;
  color: #075DFF !important;
  box-shadow: 0 16px 42px rgba(55, 117, 218, 0.12) !important;
  backdrop-filter: blur(18px) saturate(1.2) !important;
  -webkit-backdrop-filter: blur(18px) saturate(1.2) !important;
}
.hero-badge-dot { background: #21C7FF !important; box-shadow: 0 0 18px rgba(33, 199, 255, 0.8) !important; }

.hero h1,
.cases-hero h1 {
  color: #0D1837 !important;
  line-height: 1.1 !important;
  letter-spacing: 0 !important;
  font-weight: 900 !important;
  text-shadow: 0 16px 52px rgba(31, 83, 172, 0.12) !important;
}

.hero h1 .highlight-text,
.cases-hero h1 .highlight-text {
  background: var(--gradient-title) !important;
  -webkit-background-clip: text !important;
  background-clip: text !important;
}

.hero-desc,
.cases-hero p {
  color: #22324F !important;
  font-size: 17px !important;
  line-height: 1.85 !important;
}
.hero-sub { color: #60718F !important; }
.hero-sub strong { color: #075DFF !important; }
.hero-btns { gap: 16px !important; }

.hero-visual {
  width: 100% !important;
  max-width: 640px !important;
  height: min(470px, 48vw) !important;
  min-height: 390px;
  aspect-ratio: auto !important;
  perspective: 1100px;
}

.hero-agent-visual {
  position: relative;
  filter: drop-shadow(0 38px 74px rgba(40, 92, 184, 0.18)) !important;
}

.hero-agent-visual::before,
.hero-agent-visual::after,
.hero-visual-bg,
.float-card,
.iso-scene,
.iso-block {
  display: none !important;
}

.agent-platform {
  position: absolute;
  left: 4%;
  right: -2%;
  bottom: 3%;
  height: 31%;
  border-radius: 50%;
  background:
    linear-gradient(90deg, rgba(255,255,255,0.14), rgba(255,255,255,0.78) 45%, rgba(129, 177, 255, 0.2)),
    linear-gradient(180deg, rgba(224,238,255,0.7), rgba(255,255,255,0.08));
  border: 1px solid rgba(255,255,255,0.58);
  transform: perspective(720px) rotateX(63deg) rotateZ(-4deg);
  box-shadow: 0 26px 70px rgba(49, 112, 218, 0.18);
}

.agent-toolbar,
.agent-panel,
.agent-phone,
.agent-chip {
  position: absolute;
  border: 1px solid rgba(255, 255, 255, 0.78);
  background: linear-gradient(145deg, rgba(255,255,255,0.9), rgba(233,246,255,0.68));
  box-shadow: 0 22px 56px rgba(43, 105, 204, 0.15), inset 0 1px 0 rgba(255,255,255,0.84);
  backdrop-filter: blur(18px) saturate(1.12);
  -webkit-backdrop-filter: blur(18px) saturate(1.12);
}

.agent-toolbar {
  z-index: 5;
  left: 17%;
  top: 6%;
  width: 48%;
  height: 44px;
  border-radius: 16px;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 18px;
  background: linear-gradient(135deg, rgba(20,109,255,0.95), rgba(35,195,255,0.86));
}
.agent-toolbar span {
  width: 15px;
  height: 15px;
  border-radius: 5px;
  background: rgba(255,255,255,0.88);
  box-shadow: 0 0 0 5px rgba(255,255,255,0.12);
}
.agent-toolbar span:nth-child(1) { border-radius: 50%; }
.agent-toolbar span:nth-child(2) { width: 18px; height: 12px; }
.agent-toolbar span:nth-child(3) { width: 13px; height: 17px; }
.agent-toolbar span:nth-child(4) { width: 16px; height: 16px; background: rgba(218,235,255,0.96); }

.agent-phone {
  z-index: 4;
  right: 8%;
  top: 16%;
  width: 35%;
  height: 68%;
  border-radius: 28px;
  background:
    radial-gradient(circle at 50% 33%, rgba(255,255,255,0.95) 0 11%, transparent 12%),
    linear-gradient(180deg, rgba(255,255,255,0.94), rgba(221,239,255,0.86));
  transform: rotateY(-10deg) rotateX(2deg) rotateZ(1deg);
}
.agent-phone-title {
  position: absolute;
  top: 24px;
  left: 0;
  right: 0;
  text-align: center;
  color: #5E75A2;
  font-size: 13px;
  font-weight: 900;
}
.agent-avatar {
  position: absolute;
  top: 36%;
  left: 50%;
  width: 56px;
  height: 56px;
  border-radius: 50%;
  transform: translate(-50%, -50%);
  background:
    radial-gradient(circle at 50% 42%, #FFFFFF 0 17%, transparent 18%),
    radial-gradient(circle at 50% 68%, #FFFFFF 0 24%, transparent 25%),
    linear-gradient(135deg, #5D8FFF, #20D0FF);
  box-shadow: 0 16px 38px rgba(18,107,255,0.18);
}
.agent-wave {
  position: absolute;
  left: 20%;
  right: 20%;
  bottom: 38px;
  height: 56px;
  border-radius: 16px;
  background:
    linear-gradient(90deg, rgba(18,107,255,0.18) 0 8%, transparent 8% 16%, rgba(18,107,255,0.42) 16% 24%, transparent 24% 32%, rgba(25,200,255,0.34) 32% 40%, transparent 40% 48%, rgba(18,107,255,0.24) 48% 56%, transparent 56%),
    linear-gradient(180deg, rgba(255,255,255,0.72), rgba(218,238,255,0.52));
  box-shadow: inset 0 0 0 1px rgba(77, 146, 255, 0.12);
}

.agent-panel {
  z-index: 6;
  border-radius: 20px;
  padding: 18px 20px;
}
.agent-panel strong {
  display: flex;
  align-items: center;
  gap: 8px;
  color: #17325F;
  font-size: 13px;
  font-weight: 900;
}
.agent-panel strong::before,
.agent-chip span {
  content: "";
  width: 9px;
  height: 9px;
  border-radius: 50%;
  background: #1F7BFF;
  box-shadow: 0 0 0 6px rgba(31,123,255,0.12);
}
.agent-panel > span {
  display: block;
  height: 8px;
  margin-top: 12px;
  border-radius: 999px;
  background: rgba(18,107,255,0.15);
}
.agent-panel > span:last-child { width: 68%; }
.agent-script {
  left: 5%;
  top: 26%;
  width: 33%;
}
.agent-script strong::before { background: #18C9A7; box-shadow: 0 0 0 6px rgba(24,201,167,0.12); }
.agent-batch {
  left: 15%;
  bottom: 15%;
  width: 34%;
}
.agent-bars {
  display: flex;
  gap: 8px;
  align-items: flex-end;
  height: 42px;
  margin-top: 13px;
}
.agent-bars span {
  width: 13px;
  border-radius: 7px 7px 4px 4px;
  background: linear-gradient(180deg, #0B6BFF, #23C6FF);
}
.agent-bars span:nth-child(1) { height: 54%; opacity: 0.62; }
.agent-bars span:nth-child(2) { height: 100%; }
.agent-bars span:nth-child(3) { height: 72%; background: linear-gradient(180deg, #775DFF, #23C6FF); }
.agent-bars span:nth-child(4) { height: 42%; opacity: 0.75; }

.agent-chip {
  z-index: 7;
  display: inline-flex;
  align-items: center;
  gap: 10px;
  padding: 13px 20px;
  border-radius: 999px;
  color: #17325F;
  font-size: 14px;
  font-weight: 900;
  white-space: nowrap;
}
.agent-model {
  right: 0;
  top: 34%;
}
.agent-digital {
  right: 4%;
  bottom: 27%;
}
.agent-digital span { background: #775DFF; box-shadow: 0 0 0 6px rgba(119,93,255,0.12); }

/* Sections */
.section,
.scenes-tools-section,
.stats-section,
.cta-section {
  position: relative;
  padding: 104px clamp(18px, 5vw, 86px) !important;
  background: transparent !important;
}

.compare-section,
.flow-section,
.quickstart-section,
.cases-section,
.enterprise-section {
  background: linear-gradient(180deg, #FFFFFF 0%, #F7FCFF 100%) !important;
}

.model-section,
.features-section,
.industries-section,
.scenes-tools-section {
  background:
    linear-gradient(180deg, rgba(238, 248, 255, 0.88), rgba(255,255,255,0.96)) !important;
}

.section-header,
.scenes-tools-section .section-header {
  max-width: 760px !important;
  margin-bottom: 58px !important;
}
.section-tag {
  display: inline-flex !important;
  align-items: center !important;
  gap: 8px !important;
  padding: 7px 18px !important;
  background: rgba(255,255,255,0.76) !important;
  border: 1px solid rgba(105, 165, 255, 0.24) !important;
  border-radius: var(--radius-full) !important;
  color: #075DFF !important;
  box-shadow: 0 14px 34px rgba(52, 114, 211, 0.08) !important;
  backdrop-filter: blur(14px) !important;
  -webkit-backdrop-filter: blur(14px) !important;
}
.section-tag::before {
  content: "";
  width: 17px;
  height: 17px;
  flex: 0 0 17px;
  border-radius: 6px;
  background:
    radial-gradient(circle at 66% 34%, rgba(255,255,255,0.95) 0 12%, transparent 13%),
    linear-gradient(135deg, #0B6BFF, #22C7FF);
  box-shadow: 0 8px 18px rgba(18, 107, 255, 0.2);
}
.section-tag-core::before { border-radius: 50%; background: radial-gradient(circle, #FFFFFF 0 18%, transparent 19%), linear-gradient(135deg, #0B6BFF, #22C7FF); }
.section-tag-flow::before { background: linear-gradient(90deg, transparent 0 22%, #FFFFFF 22% 32%, transparent 32% 44%, #FFFFFF 44% 54%, transparent 54%), linear-gradient(135deg, #0B6BFF, #22C7FF); }
.section-tag-model::before { background: radial-gradient(circle at 50% 50%, #FFFFFF 0 16%, transparent 17%), conic-gradient(from 0deg, #0B6BFF, #22C7FF, #775DFF, #0B6BFF); }
.section-tag-video::before { background: linear-gradient(90deg, #FFFFFF 0 18%, transparent 18% 100%), linear-gradient(135deg, #0B6BFF, #775DFF); }
.section-tag-tool::before { background: radial-gradient(circle at 30% 36%, #FFFFFF 0 10%, transparent 11%), radial-gradient(circle at 68% 66%, #FFFFFF 0 10%, transparent 11%), linear-gradient(135deg, #0B6BFF, #22C7FF); }
.section-tag-data::before { background: linear-gradient(90deg, transparent 0 18%, #FFFFFF 18% 30%, transparent 30% 42%, #FFFFFF 42% 54%, transparent 54% 66%, #FFFFFF 66% 78%, transparent 78%), linear-gradient(135deg, #0B6BFF, #22C7FF); }
.section-tag-enterprise::before { border-radius: 50%; background: radial-gradient(circle at 50% 38%, #FFFFFF 0 15%, transparent 16%), radial-gradient(circle at 50% 78%, #FFFFFF 0 24%, transparent 25%), linear-gradient(135deg, #0B6BFF, #22C7FF); }
.section-tag-industry::before { background: linear-gradient(180deg, #FFFFFF 0 16%, transparent 16% 100%), linear-gradient(90deg, transparent 0 18%, #FFFFFF 18% 28%, transparent 28% 44%, #FFFFFF 44% 54%, transparent 54% 70%, #FFFFFF 70% 80%, transparent 80%), linear-gradient(135deg, #0B6BFF, #775DFF); }
.section-tag-start::before { border-radius: 50%; background: conic-gradient(from 315deg, #FFFFFF 0 22%, transparent 22% 100%), linear-gradient(135deg, #0B6BFF, #22C7FF); }
.section-tag-case::before { background: linear-gradient(90deg, transparent 0 42%, #FFFFFF 42% 58%, transparent 58%), linear-gradient(180deg, transparent 0 42%, #FFFFFF 42% 58%, transparent 58%), linear-gradient(135deg, #0B6BFF, #22C7FF); }
.section-header h2,
.scenes-tools-section .section-header h2,
.st-tools-title h3 {
  color: #0D1837 !important;
  font-weight: 900 !important;
  line-height: 1.18 !important;
  letter-spacing: 0 !important;
}
.section-header p,
.scenes-tools-section .section-header p,
.st-tools-title p { color: #596985 !important; }

/* Glass cards and tables */
.compare-table-wrap,
.model-aggregate-block,
.model-summary,
.flow-card,
.feature-card,
.enterprise-card,
.industry-card,
.qs-step,
.case-card,
.st-card,
.info-card,
.highlight-box,
.table-wrap,
.resource-card {
  background: var(--glass-card) !important;
  border: 1px solid var(--border-light) !important;
  box-shadow: var(--shadow-md) !important;
  backdrop-filter: blur(20px) saturate(1.12) !important;
  -webkit-backdrop-filter: blur(20px) saturate(1.12) !important;
}

.compare-table-wrap,
.model-aggregate-block,
.flow-card,
.feature-card,
.enterprise-card,
.industry-card,
.qs-step,
.case-card,
.st-card,
.info-card,
.table-wrap { border-radius: 22px !important; }

.compare-table-wrap {
  max-width: 1060px !important;
  overflow: hidden !important;
}
.compare-table thead th,
.data-table thead th {
  background: rgba(231, 244, 255, 0.9) !important;
  color: #173561 !important;
}
.compare-table thead th:nth-child(2) {
  color: #075DFF !important;
  background: rgba(218, 239, 255, 0.94) !important;
}
.compare-table tbody td,
.data-table tbody td {
  border-top: 1px solid rgba(125, 178, 255, 0.14) !important;
  color: #4D5B76 !important;
}
.compare-table tbody td:first-child { color: #142044 !important; }
.compare-table tbody td:nth-child(2) { background: rgba(231, 246, 255, 0.46) !important; }
.compare-table tbody tr:hover td,
.data-table tbody tr:hover td { background: rgba(221, 241, 255, 0.7) !important; }
.check-yes {
  color: #264563 !important;
  position: relative;
  padding-left: 44px !important;
}
.check-yes::before,
.ec-value::before {
  content: "";
  display: inline-flex;
  width: 18px;
  height: 18px;
  border-radius: 50%;
  background:
    radial-gradient(circle at 50% 50%, #FFFFFF 0 18%, transparent 19%),
    linear-gradient(135deg, #12BFA7, #22C7FF);
  box-shadow: 0 8px 18px rgba(18, 191, 167, 0.16);
}
.check-yes::before {
  position: absolute;
  left: 20px;
  top: 50%;
  transform: translateY(-50%);
}
.ec-value {
  display: inline-flex !important;
  align-items: center !important;
  gap: 8px !important;
}
.ec-value::before {
  width: 14px;
  height: 14px;
  flex: 0 0 14px;
}

.flow-grid,
.features-grid,
.enterprise-grid,
.industries-grid,
.cases-grid,
.st-scene-grid,
.st-tool-grid,
.card-grid { gap: 22px !important; }

.flow-card,
.feature-card,
.enterprise-card,
.industry-card,
.qs-step,
.case-card,
.st-card,
.info-card,
.model-aggregate-block {
  transition: transform 0.3s ease, box-shadow 0.3s ease, border-color 0.3s ease !important;
}
.flow-card:hover,
.feature-card:hover,
.enterprise-card:hover,
.industry-card:hover,
.qs-step:hover,
.case-card:hover,
.st-card:hover,
.info-card:hover,
.model-aggregate-block:hover {
  transform: translateY(-7px) !important;
  border-color: var(--border-hover) !important;
  box-shadow: var(--shadow-xl) !important;
}

.flow-num,
.qs-num,
.feat-icon-wrap,
.industry-icon,
.section h2 .num {
  background: var(--gradient-btn) !important;
  color: #FFFFFF !important;
  box-shadow: 0 16px 34px rgba(18, 107, 255, 0.22) !important;
}

.feat-icon-wrap,
.industry-icon,
.k4-card-icon,
.st-card-icon,
.model-icon-side {
  position: relative !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  overflow: hidden !important;
  color: transparent !important;
  font-size: 0 !important;
  line-height: 1 !important;
}
.feat-icon-wrap::before,
.industry-icon::before,
.k4-card-icon::before,
.st-card-icon::before,
.model-icon-side::before {
  content: "";
  width: 50%;
  height: 50%;
  border-radius: 6px;
  background: currentColor;
  color: #FFFFFF;
  box-shadow: 0 0 0 999px rgba(255,255,255,0);
}
.feat-icon-wrap::after,
.industry-icon::after,
.k4-card-icon::after,
.st-card-icon::after,
.model-icon-side::after {
  content: "";
  position: absolute;
  inset: 18%;
  border: 2px solid rgba(255,255,255,0.86);
  border-radius: 10px;
}
.feat-icon-wrap,
.industry-icon,
.k4-card-icon,
.st-card-icon,
.model-icon-side,
.enterprise-card h4::before {
  background: linear-gradient(135deg, #0B6BFF 0%, #22C7FF 100%) !important;
  box-shadow: 0 16px 34px rgba(18, 107, 255, 0.2) !important;
}
.feat-icon-wrap:nth-of-type(2n),
.industry-card:nth-child(3n+2) .industry-icon,
.st-card:nth-child(3n+2) .st-card-icon,
.k4-card:nth-child(2) .k4-card-icon,
.mc-purple .model-icon-side {
  background: linear-gradient(135deg, #5B7DFF 0%, #8B6BFF 100%) !important;
}
.industry-card:nth-child(3n) .industry-icon,
.st-card:nth-child(3n) .st-card-icon,
.k4-card:nth-child(3) .k4-card-icon,
.mc-green .model-icon-side {
  background: linear-gradient(135deg, #13BFA6 0%, #22C7FF 100%) !important;
}
.st-card-icon {
  width: 30px !important;
  height: 30px !important;
  border-radius: 10px !important;
  flex: 0 0 30px !important;
}
.st-card-icon::before {
  width: 10px;
  height: 10px;
  border-radius: 50%;
}
.st-card-icon::after {
  inset: 8px 7px;
  border-radius: 5px;
  border-width: 1.5px;
}
.industry-icon {
  width: 48px !important;
  height: 48px !important;
  border-radius: 15px !important;
}
.industry-icon::before {
  width: 18px;
  height: 18px;
  border-radius: 50%;
}
.industry-icon::after {
  inset: 12px;
  border-radius: 9px;
}
.k4-card-icon {
  width: 52px !important;
  height: 52px !important;
  border-radius: 16px !important;
}
.k4-card-icon::before {
  width: 24px;
  height: 14px;
  border-radius: 5px;
}
.k4-card-icon::after {
  inset: 13px;
}
.k4-card:nth-child(2) .k4-card-icon::before {
  width: 18px;
  height: 18px;
  border-radius: 50%;
  background: conic-gradient(from 0deg, #FFFFFF 0 78%, transparent 78% 100%);
}
.k4-card:nth-child(3) .k4-card-icon::before {
  width: 22px;
  height: 22px;
  border-radius: 50%;
  background:
    radial-gradient(circle, transparent 0 33%, #FFFFFF 34% 52%, transparent 53%),
    conic-gradient(#FFFFFF 0 12%, transparent 12% 22%, #FFFFFF 22% 34%, transparent 34% 44%, #FFFFFF 44% 56%, transparent 56% 66%, #FFFFFF 66% 78%, transparent 78% 88%, #FFFFFF 88% 100%);
}
.k4-card:nth-child(4) .k4-card-icon::before {
  width: 22px;
  height: 22px;
  border-radius: 50%;
  background: radial-gradient(circle, #FFFFFF 0 24%, transparent 25%), conic-gradient(from 45deg, #FFFFFF 0 12%, transparent 12% 100%);
}
.model-icon-side {
  width: 76px !important;
  height: 76px !important;
  border-radius: 24px !important;
  flex: 0 0 76px !important;
}
.model-icon-side::before {
  width: 34px;
  height: 22px;
  border-radius: 8px;
}
.model-icon-side::after { inset: 20px; }
.mc-purple .model-icon-side::before {
  width: 30px;
  height: 30px;
  border-radius: 8px;
  background: linear-gradient(135deg, #FFFFFF 0 50%, transparent 50% 100%);
}
.mc-green .model-icon-side::before {
  width: 30px;
  height: 20px;
  border-radius: 5px;
  background: linear-gradient(180deg, #FFFFFF 0 18%, transparent 18% 36%, #FFFFFF 36% 54%, transparent 54% 72%, #FFFFFF 72% 100%);
}
.ec-icon { display: none !important; }
.enterprise-card h4 {
  display: flex !important;
  align-items: center !important;
  gap: 10px !important;
}
.enterprise-card h4::before {
  content: "";
  width: 30px;
  height: 30px;
  flex: 0 0 30px;
  border-radius: 10px;
  background:
    radial-gradient(circle at 50% 38%, #FFFFFF 0 12%, transparent 13%),
    radial-gradient(circle at 50% 72%, #FFFFFF 0 22%, transparent 23%),
    linear-gradient(135deg, #0B6BFF, #22C7FF) !important;
}
.qs-tip {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
}
.qs-tip::before {
  content: "";
  width: 18px;
  height: 18px;
  flex: 0 0 18px;
  border-radius: 50%;
  background:
    radial-gradient(circle at 50% 42%, #FFFFFF 0 13%, transparent 14%),
    linear-gradient(135deg, #0B6BFF, #22C7FF);
  box-shadow: 0 10px 18px rgba(18,107,255,0.16);
}
.feature-card::before { height: 4px !important; background: var(--gradient-btn) !important; opacity: 1 !important; }
.feature-card h3,
.flow-card h3,
.enterprise-card h4,
.industry-card h4,
.qs-step h3,
.st-card-name,
.model-detail-side h3,
.info-card h4,
.section h2 { color: #13203F !important; }
.feature-card p,
.flow-card p,
.enterprise-card p,
.industry-card p,
.qs-step p,
.st-card-desc,
.model-highlights li,
.info-card p,
.section p,
.section li { color: #566680 !important; }

.model-section .section-header {
  margin-bottom: 50px !important;
}

.model-section .section-header h2 {
  font-size: clamp(2.5rem, 6vw, 4.7rem) !important;
  font-weight: 500 !important;
  letter-spacing: 0 !important;
  margin-bottom: 12px !important;
}

.model-brand-en {
  margin-bottom: 24px;
  color: #6B7489;
  font-size: clamp(1.35rem, 2.5vw, 2rem);
  font-weight: 700;
  letter-spacing: 0.22em !important;
  text-transform: none;
  line-height: 1;
}

.model-section .section-header p {
  font-size: clamp(1.1rem, 2.1vw, 1.6rem) !important;
  color: #69758B !important;
}

.model-section .section-header::after {
  content: "";
  display: block;
  width: 138px;
  height: 6px;
  margin: 26px auto 0;
  border-radius: var(--radius-full);
  background: var(--gradient-btn);
  box-shadow: 0 12px 24px rgba(18, 107, 255, 0.22);
}

.model-capability-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 28px;
  max-width: 1240px;
  margin: 0 auto;
}

.model-capability-card {
  min-height: 220px;
  display: grid;
  grid-template-columns: 72px 1fr;
  gap: 22px;
  align-items: start;
  padding: 38px 34px;
  border-radius: 22px;
  background: rgba(255, 255, 255, 0.66);
  border: 1px solid rgba(255, 255, 255, 0.86);
  box-shadow: var(--shadow-md), inset 0 1px 0 rgba(255, 255, 255, 0.78);
  backdrop-filter: blur(22px) saturate(1.08);
  -webkit-backdrop-filter: blur(22px) saturate(1.08);
  transition: transform 0.3s ease, box-shadow 0.3s ease, border-color 0.3s ease;
}

.model-capability-card:hover {
  transform: translateY(-6px);
  border-color: rgba(112, 170, 255, 0.34);
  box-shadow: var(--shadow-xl), inset 0 1px 0 rgba(255, 255, 255, 0.84);
}

.model-capability-icon {
  width: 56px;
  height: 56px;
  border-radius: 16px;
  position: relative;
  background: rgba(215, 226, 255, 0.82);
  box-shadow: 0 16px 34px rgba(18, 107, 255, 0.14);
}

.model-capability-icon::before {
  content: "";
  position: absolute;
  left: 50%;
  top: 50%;
  width: 54%;
  height: 54%;
  transform: translate(-50%, -50%);
  background: #126BFF;
  -webkit-mask: var(--cap-glyph) center / contain no-repeat;
  mask: var(--cap-glyph) center / contain no-repeat;
}

.model-capability-copy h3 {
  margin: 4px 0 18px !important;
  color: #14203A !important;
  font-size: clamp(1.25rem, 1.9vw, 1.65rem) !important;
  font-weight: 850 !important;
  line-height: 1.28 !important;
}

.model-capability-copy p {
  margin: 0 !important;
  color: #65718A !important;
  font-size: clamp(1rem, 1.35vw, 1.18rem) !important;
  line-height: 1.78 !important;
}

.mc-director { --cap-glyph: var(--glyph-video); }
.mc-global { --cap-glyph: var(--glyph-globe); }
.mc-growth { --cap-glyph: var(--glyph-chart); }
.mc-enterprise { --cap-glyph: var(--glyph-users); }

.scenes-tools-section .st-category {
  margin-bottom: 46px !important;
}

.scenes-tools-section .st-category-title {
  width: fit-content;
  max-width: 100%;
  min-width: min(520px, 100%);
  justify-content: center !important;
  align-items: center !important;
  gap: 14px !important;
  margin: 0 auto 26px !important;
  padding: 11px 18px !important;
  text-align: center !important;
  flex-wrap: wrap !important;
  border-radius: 18px !important;
  background: linear-gradient(180deg, rgba(255,255,255,0.78), rgba(235,247,255,0.54)) !important;
  border: 1px solid rgba(114, 173, 255, 0.22) !important;
  box-shadow: 0 18px 42px rgba(47, 112, 211, 0.08), inset 0 1px 0 rgba(255,255,255,0.9) !important;
}

.scenes-tools-section .st-category-title::before,
.scenes-tools-section .st-category-title::after {
  content: "";
  width: clamp(34px, 6vw, 88px);
  height: 1px;
  flex: 1 1 44px;
  max-width: 96px;
  background: linear-gradient(90deg, transparent, rgba(18,107,255,0.34));
}

.scenes-tools-section .st-category-title::after {
  background: linear-gradient(90deg, rgba(18,107,255,0.34), transparent);
}

.scenes-tools-section .st-category-title h3 {
  font-size: clamp(1.12rem, 2vw, 1.38rem) !important;
  font-weight: 900 !important;
  line-height: 1.2 !important;
  color: #101C38 !important;
}

.scenes-tools-section .st-category-count {
  min-height: 34px !important;
  padding: 6px 14px !important;
  border-radius: 12px !important;
  font-size: 0.95rem !important;
  font-weight: 850 !important;
  background: rgba(18, 107, 255, 0.08) !important;
  border: 1px solid rgba(18, 107, 255, 0.22) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,0.82), 0 10px 22px rgba(18,107,255,0.08) !important;
}

@media (max-width: 768px) {
  .model-capability-grid {
    grid-template-columns: 1fr !important;
    gap: 18px !important;
  }

  .model-capability-card {
    min-height: auto !important;
    grid-template-columns: 52px 1fr !important;
    gap: 16px !important;
    padding: 24px 20px !important;
  }

  .model-capability-icon {
    width: 48px !important;
    height: 48px !important;
    border-radius: 14px !important;
  }

  .scenes-tools-section .st-category-title {
    width: min(100%, 480px) !important;
    min-width: 0 !important;
    gap: 10px !important;
    padding: 10px 12px !important;
  }

  .scenes-tools-section .st-category-title::before,
  .scenes-tools-section .st-category-title::after {
    display: none !important;
  }
}

@media (max-width: 480px) {
  .model-section .section-header h2 {
    font-size: 2.15rem !important;
  }

  .model-brand-en {
    margin-bottom: 18px !important;
    font-size: 1.3rem !important;
  }

  .model-capability-card {
    grid-template-columns: 1fr !important;
    padding: 22px 18px !important;
  }

  .model-capability-copy h3 {
    font-size: 1.18rem !important;
  }

  .model-capability-copy p {
    font-size: 0.96rem !important;
  }
}

/* Dark cinematic blocks */
.k4-section,
.cta-section,
.footer {
  background:
    radial-gradient(ellipse at 16% 0%, rgba(49, 137, 255, 0.34), transparent 38%),
    radial-gradient(ellipse at 84% 12%, rgba(25, 200, 255, 0.24), transparent 34%),
    linear-gradient(145deg, #071229 0%, #0D1D48 56%, #030711 100%) !important;
  color: #FFFFFF !important;
  overflow: hidden !important;
}
.k4-section::before,
.cta-section::before {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  background:
    linear-gradient(115deg, transparent 0 55%, rgba(118, 93, 255, 0.28) 56% 58%, transparent 62%),
    linear-gradient(rgba(255,255,255,0.045) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255,255,255,0.045) 1px, transparent 1px);
  background-size: auto, 46px 46px, 46px 46px;
  mask-image: linear-gradient(180deg, rgba(0,0,0,0.82), transparent 88%);
}
.k4-section .section-header,
.cta-content { position: relative !important; z-index: 2 !important; }
.k4-section .section-header h2,
.cta-section h2 { color: #FFFFFF !important; text-shadow: 0 0 32px rgba(31, 190, 255, 0.28) !important; }
.k4-section .section-header p,
.cta-section > .cta-content > p { color: rgba(234, 245, 255, 0.72) !important; }
.k4-card {
  background: linear-gradient(145deg, rgba(255,255,255,0.12), rgba(255,255,255,0.046)) !important;
  border: 1px solid rgba(255,255,255,0.16) !important;
  box-shadow: 0 26px 80px rgba(0,0,0,0.24) !important;
  backdrop-filter: blur(22px) !important;
  -webkit-backdrop-filter: blur(22px) !important;
}
.k4-card h4 { color: #BFE2FF !important; }
.k4-card p { color: rgba(238, 246, 255, 0.74) !important; }
.k4-feature-pill {
  background: rgba(58, 146, 255, 0.18) !important;
  border-color: rgba(130, 193, 255, 0.28) !important;
}

/* Stats return to the light reference style */
.stats-section {
  background:
    linear-gradient(180deg, #F3FAFF 0%, #FFFFFF 100%) !important;
  overflow: hidden !important;
}
.stats-section::before {
  content: "";
  position: absolute;
  left: 50%;
  bottom: -190px;
  width: min(820px, 92vw);
  height: min(520px, 58vw);
  pointer-events: none;
  background:
    radial-gradient(circle, rgba(18, 107, 255, 0.42) 1.5px, transparent 2.5px);
  background-size: 19px 19px;
  transform: translateX(-50%) perspective(720px) rotateX(58deg);
  border-radius: 50%;
  opacity: 0.62;
  mask-image: radial-gradient(ellipse at center, rgba(0,0,0,0.86) 0%, transparent 68%);
}
.stats-grid { position: relative !important; z-index: 1 !important; }
.stat-item {
  padding: 28px 24px !important;
  border-radius: 22px !important;
  background: rgba(255,255,255,0.78) !important;
  border: 1px solid rgba(119, 176, 255, 0.22) !important;
  box-shadow: var(--shadow-sm) !important;
  backdrop-filter: blur(16px) !important;
  -webkit-backdrop-filter: blur(16px) !important;
}
.stat-item h3 { white-space: nowrap !important; }
.stat-item p { color: #657593 !important; white-space: nowrap !important; }
.stat-1 h3 { color: #075DFF !important; }
.stat-2 h3 { color: #12A897 !important; }
.stat-3 h3 { color: #8761FF !important; }
.stat-4 h3 { color: #1FAFDB !important; }

.st-category-title h3,
.st-tools-title h3 { color: #13203F !important; }

.scenes-tools-section .st-category-title {
  justify-content: center !important;
  text-align: center !important;
  flex-wrap: wrap !important;
}

.st-category-count,
.st-card-tag,
.tag-paid,
.tag-free {
  background: rgba(18, 107, 255, 0.08) !important;
  color: #075DFF !important;
  border: 1px solid rgba(77, 143, 255, 0.16) !important;
}
.st-tools-block { border-top: 1px solid rgba(105, 165, 255, 0.18) !important; }
.qs-tip {
  background: rgba(255,255,255,0.76) !important;
  border: 1px solid rgba(102, 164, 255, 0.22) !important;
  color: #36527E !important;
  border-radius: 18px !important;
  box-shadow: var(--shadow-sm) !important;
}

.cases-section > div[style] > div[style*="display:grid"] > div {
  border-radius: 22px !important;
  border: 1px solid rgba(126, 178, 255, 0.22) !important;
  box-shadow: var(--shadow-lg) !important;
}
.filter-bar {
  background: rgba(255, 255, 255, 0.82) !important;
  border-bottom: 1px solid rgba(119, 176, 255, 0.22) !important;
  backdrop-filter: blur(18px) saturate(1.15) !important;
  -webkit-backdrop-filter: blur(18px) saturate(1.15) !important;
}
.filter-btn {
  border-radius: var(--radius-full) !important;
  border-color: rgba(102, 164, 255, 0.24) !important;
  color: #345174 !important;
}

.footer { border-top: 1px solid rgba(255,255,255,0.08) !important; }
.footer p { color: rgba(238, 246, 255, 0.48) !important; }
.footer a { color: rgba(238, 246, 255, 0.72) !important; }
.footer a:hover { color: #8EDFFF !important; }

@media (min-width: 1440px) {
  .hero { min-height: 760px !important; }
}

@media (max-width: 1024px) {
  .hero,
  .cases-hero { padding-top: 104px !important; min-height: auto !important; }
  .hero-container { grid-template-columns: 1fr !important; text-align: center !important; }
  .hero-right { max-width: 520px !important; margin: 0 auto !important; }
  .hero-desc,
  .hero-sub { margin-left: auto !important; margin-right: auto !important; }
  .hero-btns { justify-content: center !important; }
  .hero-visual { height: 390px !important; min-height: 340px !important; }
}

@media (max-width: 768px) {
  .nav { height: 62px !important; padding: 0 16px !important; }
  .nav-links { display: none !important; }
  .nav-actions { gap: 8px !important; }
  .hero,
  .cases-hero { padding: 86px 16px 54px !important; }
  .section,
  .scenes-tools-section,
  .stats-section,
  .cta-section { padding: 62px 16px !important; }
  .hero h1 { font-size: 2rem !important; }
  .hero-desc { font-size: 15px !important; }
  .hero-visual { max-width: 390px !important; height: 330px !important; min-height: 300px !important; }
  .hero-visual::before { left: 0 !important; width: 58% !important; }
  .hero-visual::after { left: 0 !important; width: 58% !important; }
  .float-card,
  .iso-block { font-size: 12px !important; padding: 8px 12px !important; }
  .compare-table-wrap { border-radius: 18px !important; }
  .model-aggregate-block { padding: 24px 20px !important; }
  .stat-item { padding: 20px 16px !important; }
}

@media (max-width: 480px) {
  .nav { height: 56px !important; }
  .nav-logo-icon { width: 28px !important; height: 28px !important; flex-basis: 28px !important; }
  .nav-brand-cn { font-size: 14px !important; }
  .nav-brand-en { font-size: 9px !important; }
  .btn-nav-login,
  .btn-nav-cta { padding: 7px 12px !important; font-size: 12px !important; }
  .hero { padding-top: 76px !important; }
  .hero h1 { font-size: 1.62rem !important; }
  .hero-desc { font-size: 13px !important; }
  .hero-sub { font-size: 12px !important; }
  .hero-badge { font-size: 11px !important; }
  .hero-visual { display: none !important; }
  .section-header h2,
  .cases-hero h1 { font-size: 1.42rem !important; }
  .flow-card,
  .feature-card,
  .enterprise-card,
  .industry-card,
  .qs-step,
  .st-card,
  .info-card { border-radius: 18px !important; }
  .st-scene-grid,
  .st-tool-grid,
  .card-grid { grid-template-columns: 1fr !important; }
}

/* Homepage hero floating cards */
.home-agent-visual {
  --agent-blue: #1F7BFF;
  --agent-cyan: #22C7FF;
  --agent-purple: #775DFF;
  --agent-green: #18C9A7;
  width: 100% !important;
  isolation: isolate;
}

.home-hero-right {
  width: 100% !important;
}

.home-agent-visual .agent-platform {
  left: 2% !important;
  right: -3% !important;
  bottom: 1% !important;
  height: 34% !important;
  background:
    radial-gradient(ellipse at 58% 36%, rgba(255,255,255,0.84), transparent 45%),
    linear-gradient(90deg, rgba(255,255,255,0.12), rgba(255,255,255,0.78) 47%, rgba(117, 169, 255, 0.24)),
    linear-gradient(180deg, rgba(222,239,255,0.74), rgba(255,255,255,0.08)) !important;
  border-color: rgba(255,255,255,0.72) !important;
  box-shadow:
    0 34px 86px rgba(49, 112, 218, 0.22),
    inset 0 2px 0 rgba(255,255,255,0.58) !important;
}

.home-agent-visual .agent-toolbar {
  left: 25% !important;
  top: 5% !important;
  width: 50% !important;
  height: 46px !important;
  border-radius: 17px !important;
  box-shadow:
    0 18px 44px rgba(23, 126, 255, 0.26),
    inset 0 1px 0 rgba(255,255,255,0.56) !important;
}

.home-agent-visual .agent-panel,
.home-agent-visual .agent-chip,
.home-agent-visual .agent-phone {
  border-color: rgba(255,255,255,0.84) !important;
  background:
    radial-gradient(circle at 18% 12%, rgba(255,255,255,0.98), transparent 34%),
    linear-gradient(150deg, rgba(255,255,255,0.92), rgba(231,244,255,0.7) 64%, rgba(221,239,255,0.86)) !important;
  box-shadow:
    0 24px 58px rgba(37, 106, 211, 0.16),
    0 8px 20px rgba(255,255,255,0.46),
    inset 0 1px 0 rgba(255,255,255,0.92) !important;
}

.home-agent-visual .agent-panel {
  overflow: hidden !important;
  padding: 16px 18px 15px !important;
  border-radius: 21px !important;
}

.home-agent-visual .agent-panel::after {
  content: "";
  position: absolute;
  inset: 1px;
  border-radius: inherit;
  pointer-events: none;
  background:
    linear-gradient(135deg, rgba(255,255,255,0.68), transparent 38%),
    linear-gradient(315deg, rgba(35,198,255,0.1), transparent 46%);
}

.home-agent-visual .agent-panel > * {
  position: relative;
  z-index: 1;
}

.home-agent-visual .agent-panel strong {
  gap: 10px !important;
  color: #17325F !important;
  font-size: 14px !important;
  line-height: 1.2 !important;
  letter-spacing: 0 !important;
  white-space: nowrap;
}

.home-agent-visual .agent-panel strong::before {
  display: none !important;
}

.home-agent-visual .agent-card-icon {
  position: relative;
  width: 24px;
  height: 24px;
  flex: 0 0 24px;
  border-radius: 9px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  box-shadow:
    0 10px 20px rgba(31,123,255,0.18),
    inset 0 1px 0 rgba(255,255,255,0.46);
}

.home-agent-visual .agent-card-icon::before,
.home-agent-visual .agent-card-icon::after {
  content: "";
  position: absolute;
  pointer-events: none;
}

.home-agent-visual .agent-icon-script {
  background: linear-gradient(135deg, var(--agent-green), var(--agent-cyan));
}

.home-agent-visual .agent-icon-script::before {
  left: 7px;
  top: 7px;
  width: 10px;
  height: 2px;
  border-radius: 999px;
  background: #FFFFFF;
  box-shadow: 0 5px 0 rgba(255,255,255,0.88), 0 10px 0 rgba(255,255,255,0.66);
}

.home-agent-visual .agent-icon-script::after {
  right: 5px;
  bottom: 5px;
  width: 7px;
  height: 7px;
  border-right: 2px solid #FFFFFF;
  border-bottom: 2px solid #FFFFFF;
  transform: rotate(-16deg);
  border-radius: 1px;
}

.home-agent-visual .agent-icon-video {
  background: linear-gradient(135deg, var(--agent-blue), var(--agent-cyan));
}

.home-agent-visual .agent-icon-video::before {
  inset: 6px 5px;
  border: 2px solid rgba(255,255,255,0.9);
  border-radius: 5px;
}

.home-agent-visual .agent-icon-video::after {
  left: 10px;
  top: 8px;
  width: 0;
  height: 0;
  border-top: 4px solid transparent;
  border-bottom: 4px solid transparent;
  border-left: 7px solid #FFFFFF;
}

.home-agent-visual .agent-icon-image {
  background: linear-gradient(135deg, #5B7DFF, var(--agent-purple));
}

.home-agent-visual .agent-icon-image::before {
  inset: 6px;
  border: 2px solid rgba(255,255,255,0.9);
  border-radius: 5px;
}

.home-agent-visual .agent-icon-image::after {
  left: 8px;
  bottom: 7px;
  width: 11px;
  height: 8px;
  background:
    radial-gradient(circle at 78% 18%, #FFFFFF 0 2px, transparent 2.5px),
    linear-gradient(135deg, transparent 0 35%, #FFFFFF 36% 52%, transparent 53%),
    linear-gradient(45deg, #FFFFFF 0 46%, transparent 47%);
}

.home-agent-visual .agent-script {
  left: 4% !important;
  top: 26% !important;
  width: 34% !important;
  min-width: 188px;
  min-height: 106px;
}

.home-agent-visual .agent-video {
  z-index: 7;
  left: 13% !important;
  bottom: 12% !important;
  width: 35% !important;
  min-width: 190px;
  min-height: 124px;
}

.home-agent-visual .agent-image {
  z-index: 8;
  left: 44% !important;
  top: 54% !important;
  width: 28% !important;
  min-width: 154px;
  min-height: 106px;
  transform: translateZ(18px);
}

.home-agent-visual .agent-script-lines {
  display: grid;
  gap: 10px;
  margin-top: 18px;
}

.home-agent-visual .agent-script-lines span {
  display: block;
  height: 8px;
  border-radius: 999px;
  background: linear-gradient(90deg, rgba(31,123,255,0.2), rgba(34,199,255,0.12));
}

.home-agent-visual .agent-script-lines span:first-child {
  width: 88%;
}

.home-agent-visual .agent-script-lines span:last-child {
  width: 62%;
}

.home-agent-visual .agent-video-preview {
  position: relative;
  display: flex;
  gap: 7px;
  align-items: flex-end;
  height: 46px;
  margin-top: 15px;
  padding-left: 4px;
}

.home-agent-visual .agent-video-frame {
  display: block;
  width: 44px;
  height: 34px;
  border-radius: 10px;
  background:
    linear-gradient(135deg, rgba(255,255,255,0.86), rgba(215,236,255,0.4)),
    linear-gradient(135deg, rgba(31,123,255,0.22), rgba(34,199,255,0.28));
  border: 1px solid rgba(97, 166, 255, 0.2);
  box-shadow: inset 0 1px 0 rgba(255,255,255,0.74);
}

.home-agent-visual .agent-video-frame:nth-child(2) {
  height: 42px;
  background:
    linear-gradient(135deg, rgba(119,93,255,0.28), rgba(35,198,255,0.36)),
    linear-gradient(135deg, rgba(255,255,255,0.84), rgba(215,236,255,0.36));
}

.home-agent-visual .agent-video-play {
  position: absolute;
  left: 50px;
  top: 12px;
  width: 25px;
  height: 25px;
  border-radius: 50%;
  background: linear-gradient(135deg, var(--agent-blue), var(--agent-cyan));
  box-shadow: 0 10px 22px rgba(31,123,255,0.24);
}

.home-agent-visual .agent-video-play::after {
  content: "";
  position: absolute;
  left: 10px;
  top: 7px;
  width: 0;
  height: 0;
  border-top: 5px solid transparent;
  border-bottom: 5px solid transparent;
  border-left: 7px solid #FFFFFF;
}

.home-agent-visual .agent-image-preview {
  display: grid;
  grid-template-columns: 1.1fr 0.9fr;
  grid-template-rows: repeat(2, 27px);
  gap: 6px;
  margin-top: 14px;
}

.home-agent-visual .agent-image-preview span {
  display: block;
  border-radius: 10px;
  border: 1px solid rgba(108, 159, 255, 0.18);
  box-shadow: inset 0 1px 0 rgba(255,255,255,0.72);
}

.home-agent-visual .agent-image-preview span:first-child {
  grid-row: span 2;
  background:
    radial-gradient(circle at 66% 24%, rgba(255,255,255,0.92) 0 5px, transparent 6px),
    linear-gradient(135deg, rgba(31,123,255,0.32), rgba(34,199,255,0.2));
}

.home-agent-visual .agent-image-preview span:nth-child(2) {
  background: linear-gradient(135deg, rgba(24,201,167,0.34), rgba(34,199,255,0.18));
}

.home-agent-visual .agent-image-preview span:nth-child(3) {
  background: linear-gradient(135deg, rgba(119,93,255,0.28), rgba(31,123,255,0.16));
}

.home-agent-visual .agent-phone {
  right: 6% !important;
  top: 15% !important;
  width: 36% !important;
  height: 70% !important;
  border-radius: 30px !important;
}

.home-agent-visual .agent-phone::after {
  content: "";
  position: absolute;
  left: 14%;
  right: 14%;
  bottom: 22%;
  height: 42px;
  border-radius: 16px;
  background:
    linear-gradient(90deg, rgba(31,123,255,0.18) 0 15%, transparent 15% 28%, rgba(34,199,255,0.34) 28% 45%, transparent 45% 58%, rgba(119,93,255,0.22) 58% 72%, transparent 72% 100%),
    rgba(255,255,255,0.36);
  box-shadow: inset 0 0 0 1px rgba(99, 160, 255, 0.14);
}

.home-agent-visual .agent-chip {
  padding: 12px 18px !important;
  font-size: 14px !important;
  letter-spacing: 0 !important;
}

.home-agent-visual .agent-model {
  right: -1% !important;
  top: 35% !important;
}

.home-agent-visual .agent-digital {
  right: 3% !important;
  bottom: 25% !important;
}

@media (min-width: 1440px) {
  .home-agent-visual {
    max-width: 680px !important;
    height: 500px !important;
  }
}

@media (max-width: 1024px) {
  .home-hero-right {
    width: min(100%, 540px) !important;
    max-width: 540px !important;
  }

  .home-agent-visual {
    width: min(calc(100vw - 56px), 540px) !important;
    max-width: 540px !important;
    height: 400px !important;
  }

  .home-agent-visual .agent-script {
    left: 2% !important;
    top: 25% !important;
  }

  .home-agent-visual .agent-video {
    left: 9% !important;
    bottom: 12% !important;
  }

  .home-agent-visual .agent-image {
    left: 42% !important;
    top: 55% !important;
  }
}

@media (max-width: 768px) {
  .home-hero-right {
    width: min(100%, 410px) !important;
    max-width: 410px !important;
  }

  .home-agent-visual {
    width: min(calc(100vw - 32px), 410px) !important;
    max-width: 410px !important;
    height: 340px !important;
    min-height: 320px !important;
  }

  .home-agent-visual .agent-toolbar {
    left: 23% !important;
    width: 54% !important;
    height: 38px !important;
    border-radius: 15px !important;
    gap: 13px !important;
  }

  .home-agent-visual .agent-toolbar span {
    width: 12px !important;
    height: 12px !important;
    box-shadow: 0 0 0 4px rgba(255,255,255,0.12) !important;
  }

  .home-agent-visual .agent-panel {
    padding: 13px 14px 12px !important;
    border-radius: 17px !important;
  }

  .home-agent-visual .agent-panel strong,
  .home-agent-visual .agent-chip {
    font-size: 12px !important;
  }

  .home-agent-visual .agent-card-icon {
    width: 21px;
    height: 21px;
    flex-basis: 21px;
    border-radius: 8px;
  }

  .home-agent-visual .agent-script {
    width: 39% !important;
    min-width: 138px;
    min-height: 94px;
  }

  .home-agent-visual .agent-video {
    left: 7% !important;
    width: 38% !important;
    min-width: 136px;
    min-height: 108px;
  }

  .home-agent-visual .agent-image {
    left: 39% !important;
    top: 57% !important;
    width: 33% !important;
    min-width: 118px;
    min-height: 92px;
  }

  .home-agent-visual .agent-phone {
    right: 2% !important;
    width: 36% !important;
    border-radius: 24px !important;
  }

  .home-agent-visual .agent-chip {
    padding: 10px 13px !important;
    gap: 8px !important;
  }

  .home-agent-visual .agent-chip span {
    width: 7px;
    height: 7px;
    box-shadow: 0 0 0 5px rgba(31,123,255,0.12);
  }

  .home-agent-visual .agent-script-lines {
    gap: 8px;
    margin-top: 14px;
  }

  .home-agent-visual .agent-video-preview {
    height: 38px;
    margin-top: 12px;
  }

  .home-agent-visual .agent-video-frame {
    width: 34px;
    height: 28px;
    border-radius: 8px;
  }

  .home-agent-visual .agent-video-frame:nth-child(2) {
    height: 34px;
  }

  .home-agent-visual .agent-video-play {
    left: 39px;
    top: 10px;
    width: 21px;
    height: 21px;
  }

  .home-agent-visual .agent-image-preview {
    grid-template-rows: repeat(2, 22px);
    gap: 5px;
    margin-top: 11px;
  }
}

@media (max-width: 480px) {
  .home-hero-right {
    width: min(100%, 330px) !important;
    max-width: 330px !important;
  }

  .home-agent-visual {
    display: block !important;
    width: min(calc(100vw - 32px), 330px) !important;
    max-width: 330px !important;
    height: 278px !important;
    min-height: 278px !important;
    margin: 0 auto 10px !important;
  }

  .home-agent-visual .agent-toolbar {
    left: 25% !important;
    top: 4% !important;
    width: 52% !important;
    height: 34px !important;
  }

  .home-agent-visual .agent-script {
    left: 1% !important;
    top: 25% !important;
    width: 42% !important;
    min-width: 126px;
    min-height: 86px;
  }

  .home-agent-visual .agent-video {
    left: 4% !important;
    bottom: 12% !important;
    width: 39% !important;
    min-width: 122px;
    min-height: 96px;
  }

  .home-agent-visual .agent-image {
    left: 40% !important;
    top: 58% !important;
    width: 32% !important;
    min-width: 104px;
    min-height: 84px;
  }

  .home-agent-visual .agent-phone {
    right: 0 !important;
    top: 16% !important;
    width: 37% !important;
    height: 69% !important;
    border-radius: 22px !important;
  }

  .home-agent-visual .agent-phone-title {
    top: 18px !important;
    font-size: 10px !important;
  }

  .home-agent-visual .agent-avatar {
    width: 42px !important;
    height: 42px !important;
  }

  .home-agent-visual .agent-wave {
    left: 16% !important;
    right: 16% !important;
    bottom: 24px !important;
    height: 40px !important;
    border-radius: 12px !important;
  }

  .home-agent-visual .agent-chip {
    padding: 8px 10px !important;
    font-size: 11px !important;
  }

  .home-agent-visual .agent-model {
    right: -2% !important;
    top: 34% !important;
  }

  .home-agent-visual .agent-digital {
    right: 1% !important;
    bottom: 25% !important;
  }

  .home-agent-visual .agent-panel {
    padding: 11px 11px 10px !important;
  }

  .home-agent-visual .agent-panel strong {
    font-size: 11px !important;
    gap: 7px !important;
  }

  .home-agent-visual .agent-card-icon {
    width: 19px;
    height: 19px;
    flex-basis: 19px;
    border-radius: 7px;
  }

  .home-agent-visual .agent-script-lines span {
    height: 6px;
  }

  .home-agent-visual .agent-video-preview {
    height: 32px;
    gap: 5px;
    margin-top: 10px;
  }

  .home-agent-visual .agent-video-frame {
    width: 29px;
    height: 24px;
  }

  .home-agent-visual .agent-video-frame:nth-child(2) {
    height: 30px;
  }

  .home-agent-visual .agent-video-play {
    left: 33px;
    top: 8px;
    width: 18px;
    height: 18px;
  }

  .home-agent-visual .agent-video-play::after {
    left: 7px;
    top: 5px;
    border-top-width: 4px;
    border-bottom-width: 4px;
    border-left-width: 6px;
  }

  .home-agent-visual .agent-image-preview {
    grid-template-rows: repeat(2, 18px);
    gap: 4px;
    margin-top: 9px;
  }
}

/* Semantic icon glyph overrides: keep existing icon colors, redraw only the white inner symbols. */
:root {
  --glyph-check: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5,12l5,5L20,7'/%3E%3C/svg%3E");
  --glyph-target: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='8'/%3E%3Ccircle cx='12' cy='12' r='3'/%3E%3Cpath d='M12,2v4M12,18v4M2,12h4M18,12h4'/%3E%3C/svg%3E");
  --glyph-flow: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='2.1' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='4' width='6' height='6' rx='2'/%3E%3Crect x='15' y='4' width='6' height='6' rx='2'/%3E%3Crect x='9' y='15' width='6' height='6' rx='2'/%3E%3Cpath d='M9,7h6M12,10v5'/%3E%3C/svg%3E");
  --glyph-model: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='2.1' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='7' cy='8' r='3'/%3E%3Ccircle cx='17' cy='8' r='3'/%3E%3Ccircle cx='12' cy='17' r='3'/%3E%3Cpath d='M9.5,10.2l1.6,4M14.5,10.2l-1.6,4M10,8h4'/%3E%3C/svg%3E");
  --glyph-video: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='2.1' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='5' width='15' height='14' rx='3'/%3E%3Cpath d='M18,10l3,-2v8l-3,-2z'/%3E%3Cpath d='M9,9l5,3l-5,3z' fill='white' stroke='none'/%3E%3C/svg%3E");
  --glyph-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='2.1' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='5' width='18' height='14' rx='3'/%3E%3Ccircle cx='8' cy='10' r='1.7' fill='white' stroke='none'/%3E%3Cpath d='M5,17l5,-5l4,4l2,-2l3,3'/%3E%3C/svg%3E");
  --glyph-text: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5,5h14M7,5v14M17,5v14M8,19h8'/%3E%3C/svg%3E");
  --glyph-doc: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='2.1' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6,3h9l4,4v14H6z'/%3E%3Cpath d='M15,3v5h5M9,11h7M9,15h6M9,19h4'/%3E%3C/svg%3E");
  --glyph-data: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='white'%3E%3Crect x='4' y='12' width='3.5' height='8' rx='1.4'/%3E%3Crect x='10.25' y='7' width='3.5' height='13' rx='1.4'/%3E%3Crect x='16.5' y='4' width='3.5' height='16' rx='1.4'/%3E%3C/svg%3E");
  --glyph-user: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='2.1' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='8' r='4'/%3E%3Cpath d='M4.5,21c1.5,-4.2,13.5,-4.2,15,0'/%3E%3C/svg%3E");
  --glyph-users: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='9' cy='8' r='3.2'/%3E%3Cpath d='M3,20c1.2,-3.8,10.8,-3.8,12,0'/%3E%3Ccircle cx='17' cy='9' r='2.5'/%3E%3Cpath d='M15.2,15.6c2.5,.2,4.6,1.4,5.3,3.4'/%3E%3C/svg%3E");
  --glyph-sound-user: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='9' cy='8' r='3'/%3E%3Cpath d='M3.8,19c1,-3.4,9.4,-3.4,10.4,0M16,8c1.3,1.3,1.3,4.7,0,6M19,5.5c2.8,3,2.8,8,0,11'/%3E%3C/svg%3E");
  --glyph-industry: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='2.1' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4,21V7l6,-3v17M10,10l10,-5v16M3,21h18M7,10h1M7,14h1M13,11h1M17,9h1M13,15h1M17,13h1'/%3E%3C/svg%3E");
  --glyph-rocket: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='2.1' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12,3c4,1,7,4,9,9l-5,1l-5,5l-1,-5l-5,-1l5,-5z'/%3E%3Cpath d='M6,18l-3,3M15,6h.1'/%3E%3C/svg%3E");
  --glyph-case: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='2.1' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='4' y='6' width='16' height='13' rx='3'/%3E%3Cpath d='M9,6V4h6v2M4,11h16M9,14h6'/%3E%3C/svg%3E");
  --glyph-cart: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='2.1' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4,5h2l2,11h9l3,-7H7M9,20h.1M17,20h.1'/%3E%3C/svg%3E");
  --glyph-clock: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='8'/%3E%3Cpath d='M12,7v5l4,2'/%3E%3C/svg%3E");
  --glyph-pipeline: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='5' width='6' height='5' rx='1.5'/%3E%3Crect x='15' y='5' width='6' height='5' rx='1.5'/%3E%3Crect x='9' y='15' width='6' height='5' rx='1.5'/%3E%3Cpath d='M9,7.5h6M12,10v5'/%3E%3C/svg%3E");
  --glyph-zap: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='white'%3E%3Cpath d='M13,2L4,14h7l-1,8l10,-13h-7z'/%3E%3C/svg%3E");
  --glyph-megaphone: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='2.1' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4,13h4l10,5V6L8,11H4zM8,13l2,7h3M19,9l2,-1M19,15l2,1'/%3E%3C/svg%3E");
  --glyph-gamepad: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='2.1' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M7,10h10a4,4,0,0,1,3.5,6l-1,2a2,2,0,0,1,-3,.5L14,16h-4l-2.5,2.5a2,2,0,0,1,-3,-.5l-1,-2A4,4,0,0,1,7,10z'/%3E%3Cpath d='M8,13v4M6,15h4M16.5,14h.1M18.5,16h.1'/%3E%3C/svg%3E");
  --glyph-package: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4,8l8,-4l8,4v10l-8,4l-8,-4zM4,8l8,4l8,-4M12,12v10M8,6l8,4'/%3E%3C/svg%3E");
  --glyph-fabric: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4,7c3,-3,5,3,8,0s5,3,8,0M4,12c3,-3,5,3,8,0s5,3,8,0M4,17c3,-3,5,3,8,0s5,3,8,0'/%3E%3C/svg%3E");
  --glyph-chart: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='2.1' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4,19h16M7,16l4,-5l3,3l5,-7M17,7h2v2'/%3E%3C/svg%3E");
  --glyph-compare: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='2.1' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6,7h12M6,7l3,-3M6,7l3,3M18,17H6M18,17l-3,-3M18,17l-3,3M12,5v14'/%3E%3C/svg%3E");
  --glyph-proof: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='2.1' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12,3l7,3v6c0,4.5,-3,7.5,-7,9c-4,-1.5,-7,-4.5,-7,-9V6zM8.5,12.5l2.2,2.2l4.8,-5.2'/%3E%3C/svg%3E");
  --glyph-replace: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='2.1' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M7,7h10l-3,-3M17,17H7l3,3M17,7l-3,3M7,17l3,-3'/%3E%3C/svg%3E");
  --glyph-variants: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='2.1' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4,12h5c3,0,3,-6,7,-6h4M16,6l-2,-2M16,6l-2,2M4,12h5c3,0,3,6,7,6h4M16,18l-2,-2M16,18l-2,2'/%3E%3C/svg%3E");
  --glyph-brand: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='2.1' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6,20V5h11l-2,4l2,4H6M10,9h4'/%3E%3C/svg%3E");
  --glyph-monitor: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='2.1' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='5' width='18' height='12' rx='2'/%3E%3Cpath d='M8,21h8M12,17v4M8,9h8M8,13h5'/%3E%3C/svg%3E");
  --glyph-subtitles: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='2.1' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='5' width='18' height='14' rx='3'/%3E%3Cpath d='M7,13h4M13,13h4M7,16h7M16,7l3,3M19,7l-3,3'/%3E%3C/svg%3E");
  --glyph-motion: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='2.1' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4,12a8,8,0,0,1,13,-6M20,12a8,8,0,0,1,-13,6M17,3v5h-5M7,21v-5h5'/%3E%3Ccircle cx='12' cy='12' r='2'/%3E%3C/svg%3E");
  --glyph-frames: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='2.1' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='4' y='6' width='10' height='10' rx='2'/%3E%3Cpath d='M8,4h10a2,2,0,0,1,2,2v10M8,20h10a2,2,0,0,0,2,-2V8'/%3E%3C/svg%3E");
  --glyph-search: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='10.5' cy='10.5' r='6.5'/%3E%3Cpath d='M16,16l5,5M8,10.5h5M10.5,8v5'/%3E%3C/svg%3E");
  --glyph-first-last: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='5' width='7' height='14' rx='2'/%3E%3Crect x='14' y='5' width='7' height='14' rx='2'/%3E%3Cpath d='M10,12h4M12,10l2,2l-2,2'/%3E%3C/svg%3E");
  --glyph-phone: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='2.1' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='7' y='3' width='10' height='18' rx='2.5'/%3E%3Cpath d='M11,18h2M10,6h4'/%3E%3C/svg%3E");
  --glyph-cap: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='2.1' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3,8l9,-4l9,4l-9,4zM7,10v5c3,2,7,2,10,0v-5M20,9v6'/%3E%3C/svg%3E");
  --glyph-wallet: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='2.1' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4,7h15a2,2,0,0,1,2,2v9a2,2,0,0,1,-2,2H4zM4,7l3,-3h10v3M17,13h.1'/%3E%3C/svg%3E");
  --glyph-car: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='2.1' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5,16h14l-2,-6H7zM7,16v3M17,16v3M6,19h2M16,19h2M8,10l2,-4h4l2,4'/%3E%3C/svg%3E");
  --glyph-home: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='2.1' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4,11l8,-7l8,7v9H6v-9M10,20v-6h4v6'/%3E%3C/svg%3E");
  --glyph-globe: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='2.1' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='9'/%3E%3Cpath d='M3,12h18M12,3c3,3,3,15,0,18M12,3c-3,3,-3,15,0,18'/%3E%3C/svg%3E");
  --glyph-team: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='6' r='3'/%3E%3Ccircle cx='6' cy='17' r='3'/%3E%3Ccircle cx='18' cy='17' r='3'/%3E%3Cpath d='M10,8.5L7.5,14M14,8.5L16.5,14M9,17h6'/%3E%3C/svg%3E");
  --glyph-shield: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='2.1' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12,3l7,3v6c0,4.5,-3,7.5,-7,9c-4,-1.5,-7,-4.5,-7,-9V6zM9,12l2,2l4,-4'/%3E%3C/svg%3E");
}

.section-tag::before,
.check-yes::before,
.ec-value::before,
.enterprise-card h4::before,
.qs-tip::before {
  background: var(--glyph-check) center / 62% no-repeat, linear-gradient(135deg, #12BFA7, #22C7FF) !important;
}

.section-tag::before {
  border-radius: 6px !important;
  background: var(--glyph-target) center / 76% no-repeat, linear-gradient(135deg, #0B6BFF, #22C7FF) !important;
}

.section-tag-core::before { border-radius: 50% !important; background: var(--glyph-target) center / 78% no-repeat, linear-gradient(135deg, #0B6BFF, #22C7FF) !important; }
.section-tag-flow::before { background: var(--glyph-flow) center / 78% no-repeat, linear-gradient(135deg, #0B6BFF, #22C7FF) !important; }
.section-tag-model::before { background: var(--glyph-model) center / 80% no-repeat, conic-gradient(from 0deg, #0B6BFF, #22C7FF, #775DFF, #0B6BFF) !important; }
.section-tag-video::before { background: var(--glyph-video) center / 78% no-repeat, linear-gradient(135deg, #0B6BFF, #775DFF) !important; }
.section-tag-tool::before { background: var(--glyph-pipeline) center / 78% no-repeat, linear-gradient(135deg, #0B6BFF, #22C7FF) !important; }
.section-tag-data::before { background: var(--glyph-data) center / 74% no-repeat, linear-gradient(135deg, #0B6BFF, #22C7FF) !important; }
.section-tag-enterprise::before { border-radius: 50% !important; background: var(--glyph-user) center / 78% no-repeat, linear-gradient(135deg, #0B6BFF, #22C7FF) !important; }
.section-tag-industry::before { background: var(--glyph-industry) center / 80% no-repeat, linear-gradient(135deg, #0B6BFF, #775DFF) !important; }
.section-tag-start::before { border-radius: 50% !important; background: var(--glyph-rocket) center / 78% no-repeat, linear-gradient(135deg, #0B6BFF, #22C7FF) !important; }
.section-tag-case::before { background: var(--glyph-case) center / 78% no-repeat, linear-gradient(135deg, #0B6BFF, #22C7FF) !important; }

.k4-card-icon::before,
.st-card-icon::before,
.industry-icon::before,
.model-title-icon::before,
.home-agent-visual .agent-card-icon::before,
.home-agent-visual .agent-chip span::before {
  content: "" !important;
  position: absolute !important;
  left: 50% !important;
  top: 50% !important;
  width: var(--glyph-w, 58%) !important;
  height: var(--glyph-h, 58%) !important;
  border-radius: 0 !important;
  background: #FFFFFF !important;
  box-shadow: none !important;
  transform: translate(-50%, -50%) !important;
  -webkit-mask: var(--glyph) center / contain no-repeat !important;
  mask: var(--glyph) center / contain no-repeat !important;
}

.k4-card-icon::after,
.st-card-icon::after,
.industry-icon::after,
.model-title-icon::after,
.home-agent-visual .agent-card-icon::after {
  display: none !important;
}

.home-agent-visual .agent-card-icon,
.home-agent-visual .agent-chip span,
.k4-card-icon,
.st-card-icon,
.industry-icon,
.model-title-icon {
  position: relative !important;
  --glyph: var(--glyph-target);
}

.home-agent-visual .agent-icon-script { --glyph: var(--glyph-doc); --glyph-w: 62%; --glyph-h: 62%; }
.home-agent-visual .agent-icon-video { --glyph: var(--glyph-video); --glyph-w: 64%; --glyph-h: 64%; }
.home-agent-visual .agent-icon-image { --glyph: var(--glyph-image); --glyph-w: 64%; --glyph-h: 64%; }

.home-agent-visual .agent-chip span {
  width: 1.18em !important;
  height: 1.18em !important;
  min-width: 14px;
  min-height: 14px;
}
.home-agent-visual .agent-model span { --glyph: var(--glyph-model); }
.home-agent-visual .agent-digital span { --glyph: var(--glyph-sound-user); }

.model-detail-side h3 {
  display: flex !important;
  align-items: center !important;
  gap: 12px !important;
}
.model-title-icon {
  display: inline-flex;
  width: 42px;
  height: 42px;
  flex: 0 0 42px;
  border-radius: 14px;
  box-shadow: 0 16px 34px rgba(18, 107, 255, 0.2);
}
.model-title-video { --glyph: var(--glyph-video); background: linear-gradient(135deg, #0B6BFF 0%, #22C7FF 100%); }
.model-title-image { --glyph: var(--glyph-image); background: linear-gradient(135deg, #5B7DFF 0%, #8B6BFF 100%); }
.model-title-text { --glyph: var(--glyph-text); background: linear-gradient(135deg, #13BFA6 0%, #22C7FF 100%); }

.k4-icon-quality { --glyph: var(--glyph-video); --glyph-w: 62%; --glyph-h: 62%; }
.k4-icon-duration { --glyph: var(--glyph-clock); --glyph-w: 62%; --glyph-h: 62%; }
.k4-icon-pipeline { --glyph: var(--glyph-pipeline); --glyph-w: 66%; --glyph-h: 66%; }
.k4-icon-scene { --glyph: var(--glyph-target); --glyph-w: 64%; --glyph-h: 64%; }

.st-icon-benefit { --glyph: var(--glyph-zap); }
.st-icon-preroll { --glyph: var(--glyph-megaphone); }
.st-icon-gameplay,
.st-icon-game-recording,
.industry-icon-game { --glyph: var(--glyph-gamepad); }
.st-icon-product-closeup { --glyph: var(--glyph-search); }
.st-icon-package { --glyph: var(--glyph-package); }
.st-icon-fabric { --glyph: var(--glyph-fabric); }
.st-icon-selling-page { --glyph: var(--glyph-chart); }
.st-icon-compare { --glyph: var(--glyph-compare); }
.st-icon-proof { --glyph: var(--glyph-proof); }
.st-icon-image-video { --glyph: var(--glyph-video); }
.st-icon-product-replace,
.st-icon-role-replace,
.st-icon-live-scene-replace { --glyph: var(--glyph-replace); }
.st-icon-scene-image { --glyph: var(--glyph-image); }
.st-icon-product-video,
.industry-icon-ecommerce { --glyph: var(--glyph-cart); }
.st-icon-portrait-video,
.st-icon-avatar-talk,
.st-icon-avatar-tool { --glyph: var(--glyph-sound-user); }
.st-icon-variants { --glyph: var(--glyph-variants); }
.st-icon-brand-endcard { --glyph: var(--glyph-brand); }
.st-icon-app-recording { --glyph: var(--glyph-monitor); }
.st-icon-fill-shot { --glyph: var(--glyph-case); }
.st-icon-remove-subtitles { --glyph: var(--glyph-subtitles); }
.st-icon-product-motion { --glyph: var(--glyph-motion); }
.st-icon-frame-interpolation { --glyph: var(--glyph-frames); }
.st-icon-quality-enhance { --glyph: var(--glyph-search); }
.st-icon-first-last-video { --glyph: var(--glyph-first-last); }

.industry-icon-ecommerce { --glyph: var(--glyph-cart); }
.industry-icon-webservice { --glyph: var(--glyph-phone); }
.industry-icon-education { --glyph: var(--glyph-cap); }
.industry-icon-finance { --glyph: var(--glyph-wallet); }
.industry-icon-auto { --glyph: var(--glyph-car); }
.industry-icon-home { --glyph: var(--glyph-home); }
.industry-icon-global { --glyph: var(--glyph-globe); }
.industry-icon-verified { --glyph: var(--glyph-proof); }

.enterprise-owner h4::before { background: var(--glyph-user) center / 72% no-repeat, linear-gradient(135deg, #0B6BFF, #22C7FF) !important; }
.enterprise-accounts h4::before { background: var(--glyph-users) center / 74% no-repeat, linear-gradient(135deg, #0B6BFF, #22C7FF) !important; }
.enterprise-budget h4::before { background: var(--glyph-wallet) center / 72% no-repeat, linear-gradient(135deg, #0B6BFF, #22C7FF) !important; }
.enterprise-usage h4::before { background: var(--glyph-data) center / 70% no-repeat, linear-gradient(135deg, #0B6BFF, #22C7FF) !important; }
.enterprise-permission h4::before { background: var(--glyph-shield) center / 72% no-repeat, linear-gradient(135deg, #0B6BFF, #22C7FF) !important; }
.enterprise-team h4::before { background: var(--glyph-team) center / 74% no-repeat, linear-gradient(135deg, #0B6BFF, #22C7FF) !important; }

.qs-tip::before {
  background: var(--glyph-check) center / 66% no-repeat, linear-gradient(135deg, #0B6BFF, #22C7FF) !important;
}

/* Targeted polish: keep content unchanged while fixing contrast, centering, and thumbnail crops. */
.stats-section > div[style] h2 {
  color: #0D1837 !important;
  text-shadow: none !important;
}

.stats-section > div[style] > p {
  color: #596985 !important;
}

.st-category,
.st-tools-block {
  max-width: 1080px !important;
  margin-left: auto !important;
  margin-right: auto !important;
}

.st-scene-grid,
.st-tool-grid {
  grid-template-columns: repeat(auto-fit, minmax(260px, 320px)) !important;
  justify-content: center !important;
  justify-items: stretch !important;
}

.st-card {
  width: 100% !important;
}

.cases-section > div[style] > div[style*="display:grid"] > div {
  aspect-ratio: 2.35 / 1 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  background: linear-gradient(180deg, #F6FBFF 0%, #EEF8FF 100%) !important;
  box-shadow: var(--shadow-md), inset 0 1px 0 rgba(255, 255, 255, 0.9) !important;
}

.cases-section > div[style] > div[style*="display:grid"] img {
  display: block !important;
  width: 100% !important;
  height: 100% !important;
  object-fit: contain !important;
  object-position: center center !important;
  background: transparent !important;
}

.cases-section > div[style] > div[style*="display:grid"] > div:first-child img {
  object-fit: cover !important;
}

@media (max-width: 900px) {
  .cases-section > div[style] > div[style*="display:grid"] {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }
}

@media (max-width: 560px) {
  .cases-section > div[style] > div[style*="display:grid"] {
    grid-template-columns: 1fr !important;
    gap: 16px !important;
  }
}
