:root {
  --ink: #0b1230;
  --ink-soft: #263252;
  --muted: #65708d;
  --line: #e7e8f2;
  --line-strong: #d9dced;
  --surface: #ffffff;
  --surface-soft: #f8f9ff;
  --blue: #2f5bea;
  --blue-deep: #2648d8;
  --purple: #7c3aed;
  --pink: #ec4899;
  --green: #12a36d;
  --orange: #f26b2f;
  --radius-sm: 14px;
  --radius: 22px;
  --radius-lg: 32px;
  --shadow-sm: 0 10px 30px rgba(39, 45, 86, .07);
  --shadow: 0 24px 70px rgba(42, 48, 93, .11);
  --gradient: linear-gradient(120deg, #3158ed 5%, #6f45ee 52%, #a23ee8 100%);
  --shell: min(1220px, calc(100% - 40px));
}

* { box-sizing: border-box; }

html { overflow-x: hidden; overflow-x: clip; scroll-behavior: smooth; scroll-padding-top: 110px; }

body {
  margin: 0;
  min-width: 320px;
  color: var(--ink);
  background:
    radial-gradient(circle at 68% 3%, rgba(122, 92, 255, .15), transparent 29rem),
    radial-gradient(circle at 12% 12%, rgba(70, 119, 255, .10), transparent 25rem),
    linear-gradient(180deg, #fbfbff 0, #fff 32rem);
  font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  font-size: 16px;
  line-height: 1.55;
  overflow-x: hidden;
  transition: opacity .16s ease;
}

body.is-translating { opacity: .68; }
body.menu-open { overflow: hidden; }

a { color: inherit; text-decoration: none; }
button, input, select { font: inherit; }
button { color: inherit; }
img, svg { display: block; }

:focus-visible {
  outline: 3px solid rgba(47, 91, 234, .48);
  outline-offset: 3px;
}

.skip-link {
  position: fixed;
  inset-block-start: 12px;
  inset-inline-start: 12px;
  z-index: 999;
  padding: 11px 16px;
  border-radius: 10px;
  color: #fff;
  background: var(--ink);
  transform: translateY(-160%);
  transition: transform .2s ease;
}

.skip-link:focus { transform: translateY(0); }
.shell { width: var(--shell); margin-inline: auto; }
.section { padding-block: 88px; }

.page-glow {
  position: absolute;
  z-index: -1;
  border-radius: 999px;
  filter: blur(25px);
  pointer-events: none;
}

.page-glow--one { width: 360px; height: 360px; inset: 80px auto auto -170px; background: rgba(103, 148, 255, .22); }
.page-glow--two { width: 420px; height: 420px; inset: 250px -230px auto auto; background: rgba(190, 111, 255, .20); }

.site-header {
  position: sticky;
  inset-block-start: 0;
  z-index: 80;
  width: 100%;
  min-height: 76px;
  padding-inline: max(24px, calc((100vw - 1440px) / 2));
  display: grid;
  grid-template-columns: auto 1fr auto;
  align-items: center;
  gap: 26px;
  background: rgba(255, 255, 255, .88);
  border-bottom: 1px solid rgba(230, 231, 243, .82);
  backdrop-filter: blur(18px);
  box-shadow: 0 8px 28px rgba(35, 42, 79, .04);
}

.brand { display: inline-flex; align-items: center; gap: 10px; font-size: 21px; font-weight: 850; letter-spacing: -.55px; }
.brand img { border-radius: 11px; box-shadow: 0 8px 20px rgba(100, 66, 235, .24); }

.desktop-nav { justify-self: center; display: flex; align-items: center; gap: 4px; }
.desktop-nav a,
.nav-button {
  padding: 10px 12px;
  border: 0;
  border-radius: 10px;
  background: transparent;
  font-size: 13px;
  font-weight: 680;
  cursor: pointer;
  transition: color .18s ease, background .18s ease;
}
.desktop-nav a:hover, .nav-button:hover { color: var(--blue); background: #f4f6ff; }

.header-actions { display: flex; align-items: center; gap: 10px; }
.auth-actions { display: flex; align-items: center; gap: 10px; }

.language-picker { position: relative; }
.language-trigger {
  min-height: 42px;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 8px 11px;
  border: 1px solid transparent;
  border-radius: 12px;
  background: transparent;
  font-size: 13px;
  font-weight: 680;
  cursor: pointer;
}
.language-trigger:hover, .language-trigger[aria-expanded="true"] { background: #f5f6fd; border-color: var(--line); }
.language-trigger svg { width: 18px; height: 18px; fill: none; stroke: currentColor; stroke-width: 1.7; }
.chevron { width: 7px; height: 7px; border-inline-end: 1.5px solid; border-block-end: 1.5px solid; transform: rotate(45deg) translateY(-2px); transition: transform .18s ease; }
.language-trigger[aria-expanded="true"] .chevron { transform: rotate(225deg) translate(-2px, -1px); }

.language-menu {
  position: absolute;
  inset-block-start: calc(100% + 10px);
  inset-inline-end: 0;
  z-index: 100;
  width: 225px;
  max-height: min(520px, calc(100vh - 110px));
  overflow-y: auto;
  padding: 8px;
  border: 1px solid var(--line);
  border-radius: 16px;
  background: rgba(255, 255, 255, .98);
  box-shadow: var(--shadow);
  transform-origin: top right;
  animation: menu-in .16s ease both;
}
.language-menu[hidden] { display: none; }
.language-menu button {
  width: 100%;
  display: grid;
  grid-template-columns: 25px 1fr 18px;
  gap: 8px;
  align-items: center;
  padding: 9px 10px;
  border: 0;
  border-radius: 10px;
  background: transparent;
  text-align: start;
  font-size: 13px;
  cursor: pointer;
}
.language-menu button:hover, .language-menu button:focus-visible { background: #f4f5fd; }
.language-check { opacity: 0; color: var(--blue); font-weight: 900; }
.language-menu button[aria-selected="true"] { color: var(--blue); background: #f1f4ff; }
.language-menu button[aria-selected="true"] .language-check { opacity: 1; }

@keyframes menu-in { from { opacity: 0; transform: translateY(-7px) scale(.98); } }

.button {
  min-height: 44px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 9px;
  padding: 10px 18px;
  border: 1px solid transparent;
  border-radius: 12px;
  font-weight: 750;
  font-size: 14px;
  text-align: center;
  cursor: pointer;
  transition: transform .18s ease, box-shadow .18s ease, background .18s ease, border-color .18s ease;
}
.button:hover { transform: translateY(-2px); }
.button svg { width: 18px; height: 18px; fill: none; stroke: currentColor; stroke-width: 1.8; }
.button--compact { min-height: 40px; padding: 8px 16px; font-size: 13px; }
.button--large { min-height: 50px; padding: 12px 22px; }
.button--primary { color: #fff; background: var(--gradient); box-shadow: 0 12px 28px rgba(76, 65, 225, .22); }
.button--primary:hover { box-shadow: 0 16px 34px rgba(76, 65, 225, .30); }
.button--quiet { color: var(--ink); background: #fff; border-color: var(--line-strong); box-shadow: 0 7px 18px rgba(37, 45, 82, .04); }
.button--quiet:hover { border-color: #bcc4e6; background: #fafbff; }
.button--light { color: #2d3fd7; background: #fff; box-shadow: 0 16px 36px rgba(10, 15, 45, .2); }

.menu-trigger, .icon-button {
  width: 42px;
  height: 42px;
  display: none;
  place-items: center;
  padding: 0;
  border: 1px solid var(--line);
  border-radius: 12px;
  background: #fff;
  cursor: pointer;
}
.menu-trigger svg, .icon-button svg { width: 21px; height: 21px; fill: none; stroke: currentColor; stroke-width: 1.8; }

.mobile-menu {
  position: fixed;
  inset: 0 0 0 auto;
  z-index: 110;
  width: min(390px, 90vw);
  padding: 22px;
  background: #fff;
  box-shadow: -20px 0 60px rgba(23, 28, 62, .18);
  animation: drawer-in .22s ease both;
}
.mobile-menu[hidden], .menu-backdrop[hidden] { display: none; }
@keyframes drawer-in { from { transform: translateX(100%); } }
.mobile-menu__head { display: flex; justify-content: space-between; align-items: center; padding-block-end: 26px; border-bottom: 1px solid var(--line); }
.mobile-menu .icon-button { display: grid; }
.mobile-menu nav { display: grid; gap: 4px; padding-block: 22px; }
.mobile-menu nav a, .mobile-menu nav button { width: 100%; padding: 13px 12px; border: 0; border-radius: 11px; background: transparent; text-align: start; font-weight: 720; cursor: pointer; }
.mobile-menu nav a:hover, .mobile-menu nav button:hover { color: var(--blue); background: #f5f6fd; }
.mobile-menu__actions { display: grid; gap: 10px; padding-block-start: 20px; border-top: 1px solid var(--line); }
.menu-backdrop { position: fixed; inset: 0; z-index: 105; background: rgba(12, 16, 40, .34); backdrop-filter: blur(4px); }

.hero {
  min-height: 680px;
  display: grid;
  grid-template-columns: .92fr 1.08fr;
  gap: clamp(38px, 6vw, 78px);
  align-items: center;
  padding-block: 72px 66px;
}

.eyebrow, .section-kicker {
  margin: 0;
  color: #4e5a78;
  font-size: 12px;
  line-height: 1.2;
  font-weight: 800;
  letter-spacing: .08em;
  text-transform: uppercase;
}
.eyebrow {
  width: fit-content;
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 8px 11px;
  color: #344260;
  letter-spacing: 0;
  text-transform: none;
  border: 1px solid var(--line);
  border-radius: 999px;
  background: rgba(255, 255, 255, .74);
  box-shadow: 0 7px 24px rgba(44, 51, 92, .05);
}
.eyebrow span:first-child { color: var(--orange); }

.hero h1 {
  max-width: 690px;
  margin: 22px 0 18px;
  font-size: clamp(48px, 5.7vw, 78px);
  line-height: .98;
  letter-spacing: -.065em;
  font-weight: 880;
}
.gradient-text { color: transparent; background: var(--gradient); background-clip: text; -webkit-background-clip: text; }
.hero__lead { max-width: 625px; margin: 0; color: var(--ink-soft); font-size: clamp(17px, 1.65vw, 21px); line-height: 1.7; }
.hero__actions { display: flex; align-items: center; flex-wrap: wrap; gap: 12px; margin-block-start: 30px; }
.text-link { display: inline-flex; align-items: center; gap: 8px; padding: 12px 9px; color: var(--blue); font-size: 14px; font-weight: 750; }
.text-link:hover { color: var(--purple); }
.text-link svg { width: 18px; height: 18px; fill: none; stroke: currentColor; stroke-width: 1.8; transition: transform .18s ease; }
.text-link:hover svg { transform: translateX(3px); }

.hero__facts { display: flex; flex-wrap: wrap; gap: 14px 22px; margin: 28px 0 0; padding: 0; list-style: none; color: #53607d; font-size: 12px; font-weight: 650; }
.hero__facts li { display: flex; align-items: center; gap: 7px; }
.hero__facts svg { width: 16px; height: 16px; fill: none; stroke: currentColor; stroke-width: 1.7; }

.product-preview {
  position: relative;
  padding: 18px;
  border: 1px solid rgba(218, 219, 238, .9);
  border-radius: 28px;
  background: rgba(255, 255, 255, .92);
  box-shadow: 0 36px 90px rgba(67, 56, 145, .16);
  transform: rotate(-1.4deg);
}
.product-preview::before {
  content: "";
  position: absolute;
  z-index: -1;
  inset: -24px -28px -28px 36px;
  border-radius: 42px;
  background: linear-gradient(135deg, rgba(98, 138, 255, .12), rgba(175, 91, 255, .20));
  transform: rotate(5deg);
}
.product-preview__topbar { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-block-end: 14px; }
.preview-brand { display: flex; align-items: center; gap: 8px; font-size: 12px; font-weight: 800; }
.preview-brand img { border-radius: 7px; }
.status-pill { display: flex; align-items: center; gap: 6px; padding: 6px 9px; color: #58627d; background: #f7f8fd; border: 1px solid var(--line); border-radius: 999px; font-size: 10px; font-weight: 700; }
.status-pill > span:first-child { width: 6px; height: 6px; border-radius: 50%; background: var(--green); box-shadow: 0 0 0 4px rgba(18, 163, 109, .10); }

.product-preview__workspace { display: grid; grid-template-columns: 42px 1fr; overflow: hidden; border: 1px solid var(--line); border-radius: 20px; background: #fbfbff; }
.preview-rail { display: flex; flex-direction: column; align-items: center; gap: 17px; padding-block: 15px; color: #9aa2ba; border-inline-end: 1px solid var(--line); background: #fff; font-size: 14px; }
.preview-rail span { width: 25px; height: 25px; display: grid; place-items: center; border-radius: 8px; }
.preview-rail .is-active { color: #fff; background: var(--gradient); }
.preview-main { padding: 14px; }
.video-pair { display: grid; grid-template-columns: 1fr 1.28fr; gap: 10px; }
.video-frame { position: relative; min-height: 190px; overflow: hidden; border-radius: 15px; background: linear-gradient(145deg, #f5d9cb, #d29da4); }
.video-frame--target { background: linear-gradient(145deg, #cdb9a4, #7a6368); }
.video-frame::before { content: ""; position: absolute; inset: auto -20% -30% 15%; height: 80%; border-radius: 50% 50% 0 0; background: rgba(29, 31, 48, .65); }
.video-frame--target::after { content: ""; position: absolute; width: 48px; height: 82px; inset: 27px 20% auto auto; border-radius: 45% 45% 18px 18px; background: #171824; box-shadow: 0 46px 0 -20px #171824; }
.person { position: absolute; z-index: 1; width: 72px; height: 72px; inset: 32px auto auto 50%; border-radius: 50% 50% 45% 45%; background: linear-gradient(155deg, #e9b495, #9c5a55); transform: translateX(-50%); box-shadow: 0 12px 0 11px #3d2937; }
.person::before { content: ""; position: absolute; inset: -10px -9px 21px; border-radius: 60% 55% 35% 30%; border-block-start: 14px solid #342235; border-inline: 8px solid #342235; }
.person--two { background: linear-gradient(155deg, #d9aa91, #8d5a4f); box-shadow: 0 12px 0 11px #252935; }
.frame-label, .timecode { position: absolute; z-index: 2; inset: auto auto 9px 9px; padding: 4px 7px; border-radius: 7px; color: #fff; background: rgba(18, 21, 38, .72); font-size: 9px; font-weight: 700; }
.timecode { inset: auto 9px 9px auto; background: rgba(87, 48, 213, .9); }

.waveform { height: 42px; display: flex; align-items: center; gap: 3px; margin-block: 8px; padding-inline: 8px; border-radius: 10px; background: linear-gradient(90deg, #f9f6ff, #f3f6ff); }
.waveform span { flex: 1; height: var(--h); min-width: 2px; border-radius: 999px; background: linear-gradient(180deg, #9b4dea, #315bec); }
.language-flow { display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; gap: 10px; }
.language-flow div { padding: 9px 11px; border: 1px solid var(--line); border-radius: 11px; background: #fff; }
.language-flow small { display: block; color: var(--muted); font-size: 9px; }
.language-flow strong { font-size: 11px; }
.language-flow > span { color: var(--purple); font-weight: 900; }

.product-preview__features { display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px; margin-block-start: 10px; }
.product-preview__features > span { min-height: 42px; display: flex; align-items: center; justify-content: center; gap: 7px; padding: 8px; border: 1px solid var(--line); border-radius: 11px; background: #fff; font-size: 10px; font-weight: 700; }
.product-preview__features svg { width: 14px; height: 14px; fill: none; stroke: var(--purple); stroke-width: 1.8; }
.product-preview__features .is-muted { color: #737c95; background: #fafafe; }
.product-preview__features em { padding: 2px 4px; border-radius: 4px; color: #7b4be9; background: #efe9ff; font-size: 7px; font-style: normal; text-transform: uppercase; }

/* Homepage AI Video Dubbing hero */
.hero {
  position: relative;
  isolation: isolate;
  min-height: 690px;
  display: block;
  overflow: hidden;
  padding-block: clamp(62px, 6vw, 88px) clamp(54px, 5vw, 76px);
  color: #f7fbff;
  background:
    radial-gradient(circle at 79% 23%, rgba(0, 177, 255, .16), transparent 25rem),
    radial-gradient(circle at 12% 52%, rgba(19, 89, 230, .14), transparent 28rem),
    linear-gradient(118deg, #020817 0%, #041127 55%, #020916 100%);
}
.hero::before {
  content: "";
  position: absolute;
  z-index: -1;
  inset: 0;
  opacity: .22;
  background-image:
    linear-gradient(rgba(38, 153, 237, .12) 1px, transparent 1px),
    linear-gradient(90deg, rgba(38, 153, 237, .12) 1px, transparent 1px);
  background-size: 44px 44px;
  -webkit-mask-image: linear-gradient(90deg, transparent 4%, #000 67%, transparent 100%);
  mask-image: linear-gradient(90deg, transparent 4%, #000 67%, transparent 100%);
}
.hero::after {
  content: "";
  position: absolute;
  z-index: -1;
  width: 130%;
  height: 210px;
  inset: auto -15% -105px;
  border: 1px solid rgba(0, 169, 255, .28);
  border-radius: 50%;
  box-shadow:
    0 -16px 0 -15px rgba(0, 169, 255, .24),
    0 -35px 0 -34px rgba(0, 169, 255, .18),
    0 -57px 0 -56px rgba(0, 169, 255, .14),
    0 -82px 0 -81px rgba(0, 169, 255, .11);
  transform: rotate(-4deg);
}
.hero__aurora { position: absolute; z-index: -1; border-radius: 50%; filter: blur(7px); pointer-events: none; }
.hero__aurora--one { width: 480px; height: 480px; inset: -290px auto auto 22%; border: 1px solid rgba(0, 190, 255, .22); box-shadow: inset 0 0 100px rgba(0, 119, 255, .08); }
.hero__aurora--two { width: 320px; height: 320px; inset: auto -170px -150px auto; background: rgba(0, 110, 255, .08); filter: blur(50px); }
.hero__world { position: absolute; z-index: -1; width: 520px; height: 250px; inset: 14px 7% auto auto; overflow: hidden; opacity: .42; border-radius: 50%; border-block-end: 1px solid rgba(16, 179, 255, .32); transform: rotate(-4deg); pointer-events: none; }
.hero__world::before, .hero__world::after, .hero__world span { content: ""; position: absolute; border: 1px dotted rgba(19, 185, 255, .68); border-radius: 50%; }
.hero__world::before { width: 470px; height: 210px; inset: 18px 20px; }
.hero__world::after { width: 310px; height: 210px; inset: 18px 100px; }
.hero__world span:nth-child(1) { width: 470px; height: 70px; inset: 86px 20px; }
.hero__world span:nth-child(2) { width: 2px; height: 2px; inset: 80px 95px; border: 0; background: #67dbff; box-shadow: 76px 57px 0 1px #67dbff, 185px -16px 0 2px #67dbff, 292px 55px 0 1px #67dbff, 369px -22px 0 2px #67dbff; }
.hero__world span:nth-child(3) { width: 540px; height: 160px; inset: 45px -10px; transform: rotate(17deg); }

.hero__inner { position: relative; z-index: 1; display: grid; grid-template-columns: minmax(0, .9fr) minmax(560px, 1.1fr); gap: clamp(42px, 5vw, 74px); align-items: center; }
.hero__copy { min-width: 0; }
.hero__brand-lockup { width: fit-content; display: inline-flex; align-items: center; gap: 16px; color: #fff; }
.hero__brand-lockup img { width: clamp(58px, 5.4vw, 76px); height: auto; filter: drop-shadow(0 15px 28px rgba(0, 123, 255, .22)); }
.hero__brand-lockup > span { font-size: clamp(47px, 5vw, 70px); line-height: 1; font-weight: 820; letter-spacing: -.065em; }
.hero__brand-lockup strong { color: #159eff; font-weight: inherit; }
.hero h1 { max-width: 590px; margin: 30px 0 14px; color: #fff; font-size: clamp(37px, 3.5vw, 52px); line-height: 1.05; letter-spacing: -.045em; font-weight: 820; }
.hero__lead { max-width: 570px; margin: 0; color: #c9d3e3; font-size: clamp(17px, 1.65vw, 21px); line-height: 1.55; }
.hero__emphasis { margin: 8px 0 0; color: #17bafa; font-size: clamp(18px, 1.8vw, 23px); font-weight: 680; }
.hero__features { display: grid; grid-template-columns: repeat(4, 1fr); margin: clamp(38px, 5vw, 58px) 0 0; padding: 0; list-style: none; }
.hero__features li { min-width: 0; display: grid; justify-items: center; gap: 10px; padding: 0 12px; text-align: center; border-inline-end: 1px solid rgba(130, 176, 216, .25); }
.hero__features li:first-child { padding-inline-start: 0; }
.hero__features li:last-child { padding-inline-end: 0; border: 0; }
.hero__features li > span { width: 43px; height: 43px; display: grid; place-items: center; color: #16b8fa; }
.hero__features svg { width: 38px; height: 38px; fill: none; stroke: currentColor; stroke-width: 1.55; }
.hero__features strong { max-width: 110px; color: #eef6ff; font-size: 12px; line-height: 1.35; font-weight: 720; }

.hero__showcase { min-width: 0; padding-block-start: 22px; }
.hero__studio { display: grid; grid-template-columns: minmax(0, 1fr) 126px; gap: 18px; align-items: center; }
.hero-demo-preview {
  width: 100%;
  display: block;
  overflow: hidden;
  padding: 0;
  border: 1px solid rgba(190, 225, 255, .66);
  border-radius: 20px;
  color: #fff;
  background: rgba(2, 8, 19, .9);
  box-shadow: 0 30px 65px rgba(0, 0, 0, .38), 0 0 40px rgba(0, 157, 255, .08);
  cursor: pointer;
  text-align: start;
  transition: transform .22s ease, border-color .22s ease, box-shadow .22s ease;
}
.hero-demo-preview:hover { transform: translateY(-4px); border-color: rgba(43, 196, 255, .95); box-shadow: 0 34px 74px rgba(0, 0, 0, .44), 0 0 48px rgba(0, 174, 255, .15); }
.hero-demo-preview:focus-visible { outline-color: #3fd2ff; }
.hero-demo-preview__bar { height: 33px; display: flex; align-items: center; gap: 7px; padding: 0 12px; color: #8293aa; background: linear-gradient(180deg, #111923, #080f19); }
.hero-demo-preview__bar i { width: 8px; height: 8px; border-radius: 50%; background: #495461; }
.hero-demo-preview__bar b { margin-inline-start: auto; font-size: 8px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; }
.hero-demo-preview__screen { position: relative; display: grid; grid-template-columns: 1fr 1fr; aspect-ratio: 16 / 7.7; overflow: hidden; background: #07111d; }
.hero-demo-preview__pane { position: relative; overflow: hidden; background: radial-gradient(circle at 50% 22%, rgba(255, 210, 185, .37), transparent 16%), linear-gradient(145deg, #28313b, #090e15 70%); }
.hero-demo-preview__pane--dubbed { background: radial-gradient(circle at 50% 22%, rgba(94, 203, 255, .34), transparent 17%), linear-gradient(145deg, #083a5e, #030b17 72%); }
.hero-demo-preview__pane::after { content: ""; position: absolute; inset: 0; background: linear-gradient(90deg, transparent 49.6%, rgba(255, 255, 255, .12) 50%, transparent 50.4%); opacity: .2; }
.hero-demo-preview__pane small { position: absolute; z-index: 3; inset: 10px auto auto 10px; padding: 4px 7px; border: 1px solid rgba(255, 255, 255, .16); border-radius: 999px; color: #d9e4ef; background: rgba(1, 7, 15, .54); font-size: 8px; font-weight: 700; }
.hero-demo-preview__person { position: absolute; width: 54px; height: 66px; inset: 25% auto auto 50%; border-radius: 46% 46% 40% 40%; background: linear-gradient(145deg, #d9a184, #825449); box-shadow: 0 48px 0 27px #171d27; transform: translateX(-50%); }
.hero-demo-preview__person::before { content: ""; position: absolute; inset: -8px -7px 22px; border: 7px solid #171822; border-block-start-width: 13px; border-radius: 55% 50% 38% 40%; }
.hero-demo-preview__person::after { content: ""; position: absolute; width: 82px; height: 82px; inset: -12px auto auto 50%; border: 6px solid rgba(32, 39, 49, .92); border-radius: 50%; transform: translateX(-50%); }
.hero-demo-preview__pane--dubbed .hero-demo-preview__person { background: linear-gradient(145deg, #b78b78, #684944); box-shadow: 0 48px 0 27px #092039; }
.hero-demo-preview__pane--dubbed .hero-demo-preview__person::after { border-color: rgba(7, 50, 83, .95); }
.hero-demo-preview__play { position: absolute; z-index: 5; width: 58px; height: 58px; inset: 50% auto auto 50%; display: grid; place-items: center; border: 2px solid rgba(255, 255, 255, .9); border-radius: 50%; color: #fff; background: rgba(1, 9, 20, .58); box-shadow: 0 10px 30px rgba(0, 0, 0, .28); transform: translate(-50%, -50%); backdrop-filter: blur(8px); transition: background .2s ease, transform .2s ease; }
.hero-demo-preview:hover .hero-demo-preview__play { background: #079ee8; transform: translate(-50%, -50%) scale(1.06); }
.hero-demo-preview__play svg { width: 25px; height: 25px; fill: currentColor; stroke: currentColor; }
.hero-demo-preview__controls { height: 36px; display: grid; grid-template-columns: 12px 1fr auto; align-items: center; gap: 10px; padding: 0 13px; color: #c3cfdd; background: #080f18; }
.hero-demo-preview__controls > i { width: 0; height: 0; border-block: 5px solid transparent; border-inline-start: 8px solid #dfe8f3; }
.hero-demo-preview__controls > span { height: 3px; overflow: visible; border-radius: 999px; background: #394654; }
.hero-demo-preview__controls > span b { position: relative; width: 27%; height: 100%; display: block; border-radius: inherit; background: #0dbaf4; }
.hero-demo-preview__controls > span b::after { content: ""; position: absolute; width: 9px; height: 9px; inset: 50% 0 auto auto; border-radius: 50%; background: #1ebefe; transform: translate(50%, -50%); }
.hero-demo-preview__controls small { font-size: 8px; }

.hero__languages { display: grid; gap: 9px; margin: 0; padding: 0; list-style: none; }
.hero__languages li { min-height: 39px; display: flex; align-items: center; gap: 9px; padding: 7px 13px; border: 1px solid rgba(64, 145, 211, .48); border-radius: 999px; color: #e4ecf6; background: rgba(5, 15, 31, .74); box-shadow: inset 0 1px rgba(255, 255, 255, .04); font-size: 12px; font-weight: 650; }
.hero__languages li > span { font-size: 17px; line-height: 1; }
.hero__languages .hero__languages-more { width: fit-content; min-width: 92px; color: #aebed1; }

.hero__speaker-stack { position: relative; z-index: 2; width: calc(100% - 52px); display: grid; gap: 8px; margin: 15px 0 0 0; }
.hero__speaker { --track: #08aef1; height: 47px; display: grid; grid-template-columns: 41px minmax(0, 1fr) auto; align-items: center; gap: 10px; padding: 5px 11px 5px 5px; border: 1px solid color-mix(in srgb, var(--track) 42%, transparent); border-radius: 13px; background: rgba(5, 17, 36, .88); box-shadow: 0 10px 28px rgba(0, 0, 0, .18); backdrop-filter: blur(8px); }
.hero__speaker--2 { --track: #08b4a5; }
.hero__speaker--3 { --track: #9e4fdd; }
.hero__speaker-avatar { width: 37px; height: 37px; position: relative; overflow: hidden; border: 1px solid color-mix(in srgb, var(--track) 70%, white); border-radius: 50%; background: linear-gradient(145deg, color-mix(in srgb, var(--track) 36%, #162034), #08111d); }
.hero__speaker-avatar i { position: absolute; width: 14px; height: 16px; inset: 6px auto auto 50%; border-radius: 50% 50% 45% 45%; background: #d8a083; box-shadow: 0 15px 0 7px #1a2432; transform: translateX(-50%); }
.hero__speaker-avatar i::before { content: ""; position: absolute; inset: -3px -2px 7px; border-block-start: 5px solid #241a22; border-radius: 50%; }
.hero__waveform { height: 28px; display: flex; align-items: center; gap: 2px; overflow: hidden; }
.hero__waveform i { flex: 1 1 0; min-width: 1px; height: 28%; border-radius: 999px; background: var(--track); box-shadow: 0 0 7px color-mix(in srgb, var(--track) 42%, transparent); animation: hero-wave 2.4s ease-in-out infinite alternate; transform-origin: center; }
.hero__waveform i:nth-child(5n + 1) { height: 78%; animation-delay: -.7s; }
.hero__waveform i:nth-child(5n + 2) { height: 42%; animation-delay: -1.2s; }
.hero__waveform i:nth-child(5n + 3) { height: 92%; animation-delay: -.3s; }
.hero__waveform i:nth-child(5n + 4) { height: 56%; animation-delay: -1.7s; }
.hero__speaker strong { padding: 5px 8px; border: 1px solid color-mix(in srgb, var(--track) 60%, transparent); border-radius: 8px; color: #d9e7f5; font-size: 9px; font-weight: 650; white-space: nowrap; }
@keyframes hero-wave { from { transform: scaleY(.68); opacity: .7; } to { transform: scaleY(1); opacity: 1; } }

.hero__closing { display: flex; align-items: flex-end; justify-content: space-between; gap: 18px; margin-block-start: 18px; }
.hero__closing > p { max-width: 190px; margin: 0; color: #edf5ff; font-size: 19px; line-height: 1.25; font-weight: 670; }
.hero__closing > p strong { color: #16aef5; font-weight: inherit; }
.hero__actions { display: flex; align-items: center; justify-content: flex-end; flex-wrap: wrap; gap: 10px; margin: 0; }
.hero .button { min-height: 46px; border-radius: 999px; font-size: 12px; }
.hero .button--primary { color: #fff; border-color: transparent; background: linear-gradient(120deg, #06bff3, #1476f4); box-shadow: 0 12px 30px rgba(0, 135, 244, .28); }
.hero .button--primary:hover { box-shadow: 0 16px 36px rgba(0, 159, 245, .38); }
.hero .button--quiet { color: #dff6ff; border-color: rgba(22, 184, 250, .62); background: rgba(4, 17, 34, .68); box-shadow: none; }
.hero .button--quiet:hover { color: #fff; border-color: #27c4ff; background: rgba(7, 62, 95, .72); }
.hero .button svg { fill: currentColor; stroke: currentColor; }

/* Reference-matched three-zone hero composition */
.hero {
  min-height: 720px;
  display: flex;
  align-items: center;
  padding-block: clamp(42px, 4vw, 68px);
  background:
    radial-gradient(ellipse at 70% 36%, rgba(0, 113, 183, .16), transparent 37%),
    radial-gradient(ellipse at 48% 82%, rgba(0, 68, 137, .15), transparent 33%),
    linear-gradient(106deg, #020817 0%, #031024 54%, #020816 100%);
}
.hero::before {
  opacity: .2;
  background-image: radial-gradient(circle, rgba(31, 158, 225, .55) 1px, transparent 1.3px);
  background-size: 16px 16px;
  -webkit-mask-image: linear-gradient(90deg, transparent 35%, #000 72%, transparent 100%);
  mask-image: linear-gradient(90deg, transparent 35%, #000 72%, transparent 100%);
}
.hero::after { display: none; }

.hero__network { position: absolute; z-index: -1; width: min(850px, 48vw); height: 350px; inset: 8px 3.5% auto auto; opacity: .78; pointer-events: none; }
.hero__land { position: absolute; display: block; background-image: radial-gradient(circle, #079cdb 1.15px, transparent 1.45px); background-size: 6px 6px; filter: drop-shadow(0 0 7px rgba(0, 181, 255, .28)); }
.hero__land--americas { width: 29%; height: 73%; inset: 4% auto auto 0; clip-path: polygon(9% 8%, 44% 0, 68% 13%, 61% 27%, 76% 38%, 59% 48%, 67% 60%, 53% 69%, 48% 89%, 35% 100%, 29% 75%, 15% 59%, 20% 42%, 0 29%); }
.hero__land--europe { width: 20%; height: 28%; inset: 7% auto auto 42%; clip-path: polygon(0 34%, 17% 11%, 39% 18%, 51% 0, 70% 15%, 100% 18%, 86% 48%, 62% 51%, 53% 83%, 29% 100%, 12% 73%); }
.hero__land--africa { width: 19%; height: 46%; inset: 28% auto auto 44%; clip-path: polygon(9% 0, 77% 4%, 100% 22%, 82% 61%, 55% 100%, 31% 82%, 18% 52%, 0 26%); }
.hero__land--asia { width: 43%; height: 50%; inset: 5% 0 auto auto; clip-path: polygon(0 18%, 14% 0, 34% 9%, 48% 2%, 62% 17%, 82% 13%, 100% 32%, 92% 52%, 70% 58%, 61% 82%, 44% 68%, 28% 84%, 16% 59%, 3% 52%); }
.hero__land--australia { width: 16%; height: 23%; inset: 59% 4% auto auto; clip-path: polygon(4% 27%, 26% 5%, 66% 0, 100% 27%, 89% 72%, 53% 100%, 16% 81%, 0 54%); }
.hero__route { position: absolute; display: block; border: 1.5px solid rgba(31, 195, 255, .74); border-block-end: 0; border-radius: 50% 50% 0 0; filter: drop-shadow(0 0 5px rgba(0, 183, 255, .62)); transform-origin: center bottom; }
.hero__route--one { width: 44%; height: 45%; inset: 17% auto auto 17%; transform: rotate(-7deg); }
.hero__route--two { width: 42%; height: 41%; inset: 10% 11% auto auto; transform: rotate(10deg); }
.hero__route--three { width: 61%; height: 33%; inset: 31% 4% auto auto; transform: rotate(7deg); }
.hero__node { position: absolute; width: 6px; height: 6px; display: block; border: 1px solid #bdefff; border-radius: 50%; background: #27caff; box-shadow: 0 0 5px 2px #27caff, 0 0 16px 5px rgba(39, 202, 255, .65); }
.hero__node--one { inset: 37% auto auto 15%; }
.hero__node--two { inset: 20% auto auto 43%; }
.hero__node--three { inset: 31% 31% auto auto; }
.hero__node--four { inset: 42% 7% auto auto; }
.hero__node--five { inset: 61% 14% auto auto; }

.hero__flow-lines { position: absolute; z-index: -1; width: 112%; height: 235px; inset: auto -6% -88px; overflow: hidden; opacity: .55; pointer-events: none; transform: rotate(-2deg); }
.hero__flow-lines span { position: absolute; width: 118%; height: 185px; inset: auto -9% -115px; border: 1px solid rgba(0, 142, 232, .48); border-radius: 50%; }
.hero__flow-lines span:nth-child(2) { bottom: -99px; opacity: .82; }
.hero__flow-lines span:nth-child(3) { bottom: -81px; opacity: .66; }
.hero__flow-lines span:nth-child(4) { bottom: -61px; opacity: .48; }
.hero__flow-lines span:nth-child(5) { bottom: -39px; opacity: .3; }

.hero__inner {
  width: min(1840px, calc(100% - 64px));
  display: grid;
  grid-template-columns: minmax(0, .98fr) minmax(0, .82fr) minmax(170px, .3fr);
  gap: clamp(24px, 2.2vw, 44px);
  align-items: stretch;
}
.hero__copy { align-self: center; padding-block-start: 4px; }
.hero__brand-lockup { gap: clamp(17px, 1.5vw, 28px); }
.hero__brand-lockup img { width: clamp(92px, 7.5vw, 148px); filter: drop-shadow(0 20px 32px rgba(0, 126, 255, .25)); }
.hero__brand-lockup > span { font-size: clamp(76px, 7.35vw, 146px); line-height: .88; letter-spacing: -.075em; text-shadow: 0 5px 24px rgba(0, 0, 0, .28); }
.hero h1 { max-width: 760px; margin: clamp(45px, 4vw, 70px) 0 14px; font-size: clamp(34px, 2.75vw, 54px); line-height: 1.04; letter-spacing: -.035em; text-wrap: balance; }
.hero__lead { max-width: 760px; color: #cbd4e2; font-size: clamp(17px, 1.48vw, 29px); line-height: 1.48; text-wrap: balance; }
.hero__emphasis { margin-block-start: 7px; font-size: clamp(19px, 1.55vw, 31px); line-height: 1.38; }
.hero__features { width: min(100%, 760px); margin-block-start: clamp(43px, 4.2vw, 70px); }
.hero__features li { gap: 12px; padding-inline: clamp(10px, 1.3vw, 24px); }
.hero__features li > span { width: 55px; height: 55px; }
.hero__features svg { width: 49px; height: 49px; stroke-width: 1.45; }
.hero__features strong { max-width: 145px; font-size: clamp(11px, .9vw, 17px); line-height: 1.3; }

.hero__media { align-self: start; min-width: 0; padding-block-start: clamp(76px, 6.1vw, 116px); }
.hero-demo-preview { border-width: 2px; border-color: rgba(204, 231, 250, .72); border-radius: 20px; background: rgba(2, 8, 16, .94); box-shadow: 0 28px 65px rgba(0, 0, 0, .4), 0 0 50px rgba(0, 166, 255, .07); }
.hero-demo-preview__bar { height: 30px; padding-inline: 15px; background: linear-gradient(180deg, rgba(14, 21, 30, .98), rgba(6, 11, 18, .98)); }
.hero-demo-preview__bar i { width: 9px; height: 9px; background: #48515b; }
.hero-demo-preview__screen { aspect-ratio: 16 / 6.65; border-block: 1px solid rgba(102, 139, 166, .13); }
.hero-demo-preview__pane {
  background-image: linear-gradient(rgba(2, 8, 16, .16), rgba(1, 7, 15, .42)), url("images/ai-video-dubbing-dashboard.svg");
  background-repeat: no-repeat;
  background-size: 100% 100%, 475% 428%;
  background-position: center, 19% 28%;
}
.hero-demo-preview__pane--dubbed { background-image: linear-gradient(rgba(0, 68, 114, .14), rgba(0, 21, 46, .42)), url("images/ai-video-dubbing-dashboard.svg"); background-position: center, 81% 28%; }
.hero-demo-preview__pane::after { background: linear-gradient(180deg, transparent 55%, rgba(1, 7, 15, .38)); opacity: 1; }
.hero-demo-preview__pane small { inset: 11px auto auto 12px; color: #dcecf7; background: rgba(1, 8, 17, .62); }
.hero-demo-preview__voice-pulse { position: absolute; z-index: 4; width: 56%; height: 32px; inset: auto 7% 16% auto; display: flex; align-items: center; gap: 2px; opacity: .82; }
.hero-demo-preview__voice-pulse i { flex: 1; height: 28%; border-radius: 999px; background: #08baf1; box-shadow: 0 0 7px rgba(8, 186, 241, .58); }
.hero-demo-preview__voice-pulse i:nth-child(3n + 1) { height: 86%; }
.hero-demo-preview__voice-pulse i:nth-child(3n + 2) { height: 52%; }
.hero-demo-preview__play { width: 64px; height: 64px; }
.hero-demo-preview__controls { height: 39px; grid-template-columns: 14px 1fr auto; gap: 12px; padding-inline: 15px; }
.hero-demo-preview__controls small { font-size: 10px; }

.hero__speaker-stack { width: 105%; gap: 9px; margin-block-start: 24px; }
.hero__speaker-stack::before { content: ""; position: absolute; z-index: 5; width: 1px; inset: -13px auto 0 41%; background: #12bdfa; box-shadow: 0 0 8px rgba(18, 189, 250, .7); pointer-events: none; }
.hero__speaker-stack::after { content: ""; position: absolute; z-index: 6; width: 13px; height: 13px; inset: -14px auto auto calc(41% - 6px); border-radius: 50%; background: #16bdf8; box-shadow: 0 0 11px rgba(22, 189, 248, .65); }
.hero__speaker { height: 58px; grid-template-columns: 58px minmax(0, 1fr) auto; gap: 10px; padding: 5px 10px 5px 5px; border-radius: 14px; background: rgba(4, 17, 37, .93); }
.hero__speaker--1::before { content: ""; position: absolute; height: 7px; inset: -13px 12px auto 70px; background: repeating-linear-gradient(90deg, rgba(167, 205, 232, .68) 0 1px, transparent 1px 34px); }
.hero__speaker-avatar { width: 50px; height: 50px; margin-inline-start: -4px; border-width: 1.5px; }
.hero__speaker-avatar i { width: 19px; height: 22px; inset-block-start: 8px; box-shadow: 0 20px 0 10px #172538; }
.hero__speaker--2 .hero__speaker-avatar { background: linear-gradient(145deg, #1d5a65, #071522); }
.hero__speaker--2 .hero__speaker-avatar i { background: #bd8469; box-shadow: 0 20px 0 10px #0d2732; }
.hero__speaker--3 .hero__speaker-avatar { background: linear-gradient(145deg, #613676, #151127); }
.hero__speaker--3 .hero__speaker-avatar i { background: #c9907b; box-shadow: 0 20px 0 10px #31203e; }
.hero__waveform { height: 35px; gap: 2px; }
.hero__speaker strong { padding: 6px 10px; font-size: 10px; }

.hero__rail { min-width: 0; display: flex; align-self: stretch; flex-direction: column; padding-block: clamp(96px, 7.3vw, 138px) 10px; }
.hero__languages { gap: 9px; }
.hero__languages li { min-height: 51px; gap: 11px; padding: 8px 15px; border-color: rgba(42, 124, 188, .62); color: #f1f6fb; background: rgba(3, 13, 28, .84); font-size: clamp(12px, 1.05vw, 20px); box-shadow: inset 0 1px rgba(255, 255, 255, .04), 0 8px 24px rgba(0, 0, 0, .12); }
.hero__languages li > span { font-size: clamp(17px, 1.35vw, 25px); }
.hero__languages .hero__languages-more { min-width: 132px; color: #bdc9d8; }
.hero__closing { display: block; margin-block-start: auto; }
.hero__closing > p { max-width: 260px; margin: 0 0 22px; color: #edf5ff; font-size: clamp(20px, 1.65vw, 32px); line-height: 1.28; font-weight: 650; text-align: start; }
.hero__closing > p strong { color: #13aef2; }
.hero__coming-soon { min-width: 100%; min-height: 59px; display: inline-flex; align-items: center; justify-content: center; gap: 14px; padding: 11px 20px; border: 2px solid #05aff2; border-radius: 999px; color: #17bdff; background: rgba(2, 16, 32, .72); box-shadow: 0 0 24px rgba(0, 164, 239, .08), inset 0 0 20px rgba(0, 149, 231, .04); font-size: clamp(14px, 1.15vw, 22px); font-weight: 680; cursor: pointer; transition: color .2s ease, background .2s ease, transform .2s ease, box-shadow .2s ease; }
.hero__coming-soon:hover { color: #e9faff; background: rgba(4, 65, 100, .7); box-shadow: 0 0 30px rgba(0, 177, 245, .2); transform: translateY(-2px); }
.hero__coming-soon span:last-child { font-size: 21px; }

.trust-strip {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  overflow: hidden;
  border: 1px solid var(--line);
  border-radius: 22px;
  background: #fff;
  box-shadow: var(--shadow-sm);
}
.trust-strip > span { padding: 20px 24px; border-inline-end: 1px solid var(--line); }
.trust-strip > span:last-child { border: 0; }
.trust-strip strong, .trust-strip small { display: block; }
.trust-strip strong { font-size: 13px; }
.trust-strip small { margin-block-start: 3px; color: var(--muted); font-size: 11px; }

.featured {
  display: grid;
  grid-template-columns: .9fr 1.1fr;
  align-items: center;
  gap: clamp(42px, 7vw, 92px);
}
.featured__visual {
  position: relative;
  min-height: 430px;
  display: grid;
  place-items: center;
  overflow: hidden;
  border: 1px solid rgba(199, 193, 245, .45);
  border-radius: var(--radius-lg);
  background:
    radial-gradient(circle at 50% 50%, rgba(255, 255, 255, .9), transparent 22%),
    linear-gradient(140deg, #eef2ff, #f4eefe 55%, #eaf8ff);
  box-shadow: var(--shadow-sm);
}
.featured__visual::before, .featured__visual::after { content: ""; position: absolute; border: 1px solid rgba(119, 86, 235, .14); border-radius: 50%; }
.featured__visual::before { width: 340px; height: 340px; }
.featured__visual::after { width: 470px; height: 470px; }
.featured__badge { position: absolute; inset: 22px auto auto 22px; padding: 7px 10px; border-radius: 999px; color: #fff; background: var(--gradient); font-size: 10px; font-weight: 800; text-transform: uppercase; letter-spacing: .08em; }
.featured__orbit { position: relative; z-index: 2; width: 230px; height: 230px; display: grid; place-items: center; border: 1px dashed rgba(90, 69, 211, .4); border-radius: 50%; animation: orbit 22s linear infinite; }
.featured__orbit > div { width: 116px; height: 116px; display: grid; place-items: center; border-radius: 32px; color: #fff; background: var(--gradient); box-shadow: 0 25px 50px rgba(91, 61, 216, .3); animation: orbit 22s linear infinite reverse; }
.featured__orbit svg { width: 54px; height: 54px; fill: none; stroke: currentColor; stroke-width: 1.3; }
.featured__orbit > span { position: absolute; width: 17px; height: 17px; border: 4px solid #fff; border-radius: 50%; background: var(--blue); box-shadow: 0 5px 15px rgba(38, 43, 95, .18); }
.featured__orbit > span:nth-child(1) { inset: 5px 34px auto auto; }
.featured__orbit > span:nth-child(2) { inset: auto auto 22px 18px; background: var(--pink); }
.featured__orbit > span:nth-child(3) { inset: 88px -8px auto auto; background: var(--green); }
@keyframes orbit { to { transform: rotate(360deg); } }
.mini-card { position: absolute; z-index: 3; display: flex; align-items: center; gap: 9px; padding: 12px 14px; border: 1px solid rgba(218, 219, 236, .88); border-radius: 14px; background: rgba(255, 255, 255, .92); box-shadow: var(--shadow-sm); font-size: 11px; font-weight: 720; backdrop-filter: blur(10px); }
.mini-card svg { width: 20px; height: 20px; fill: none; stroke: var(--purple); stroke-width: 1.7; }
.mini-card--one { inset: 80px auto auto 28px; }
.mini-card--two { inset: auto 25px 58px auto; }

.featured__content h2, .section-heading h2, .split-section h2, .company h2, .final-cta h2 {
  margin: 9px 0 14px;
  font-size: clamp(35px, 4vw, 52px);
  line-height: 1.07;
  letter-spacing: -.045em;
}
.section-lead, .section-heading > p:last-child { color: var(--muted); font-size: 16px; }
.check-list { display: grid; gap: 12px; margin: 25px 0 28px; padding: 0; list-style: none; color: var(--ink-soft); }
.check-list li { display: flex; align-items: flex-start; gap: 10px; }
.check-list svg { flex: 0 0 auto; width: 20px; height: 20px; margin-block-start: 2px; padding: 4px; border-radius: 50%; fill: none; stroke: #fff; stroke-width: 2.5; background: var(--green); }

.tool-section { position: relative; }
.tool-section::before { content: ""; position: absolute; z-index: -1; inset: 25px -30px; border-radius: 42px; background: linear-gradient(180deg, rgba(249, 249, 255, .76), rgba(255, 255, 255, .2)); }
.section-heading { max-width: 650px; margin-block-end: 34px; }
.section-heading--center { margin-inline: auto; text-align: center; }
.section-heading--center .section-icon { margin-inline: auto; }
.section-heading--center > p:last-child { margin-inline: auto; }
.section-icon { width: 52px; height: 52px; display: grid; place-items: center; margin-block-end: 14px; border-radius: 17px; }
.section-icon svg { width: 26px; height: 26px; fill: none; stroke: currentColor; stroke-width: 1.6; }
.section-icon--purple { color: #7440eb; background: #f0eaff; }
.section-icon--blue { color: #315bea; background: #eaf0ff; }
.section-icon--green { color: #0b9a67; background: #e7f8f0; }
.section-icon--pink { color: #e53071; background: #ffedf3; }

.tool-grid { display: grid; gap: 15px; }
.tool-grid--six { grid-template-columns: repeat(3, 1fr); }
.tool-grid--five { grid-template-columns: repeat(5, 1fr); }
.tool-card {
  position: relative;
  min-width: 0;
  min-height: 252px;
  display: flex;
  flex-direction: column;
  padding: 20px;
  overflow: hidden;
  border: 1px solid var(--line);
  border-radius: 19px;
  background: rgba(255, 255, 255, .93);
  box-shadow: 0 7px 26px rgba(38, 44, 80, .045);
  transition: transform .2s ease, border-color .2s ease, box-shadow .2s ease;
}
.tool-card::before { content: ""; position: absolute; width: 120px; height: 120px; inset: -70px -55px auto auto; border-radius: 50%; background: rgba(104, 77, 227, .06); }
a.tool-card:hover { transform: translateY(-6px); border-color: #ccd1eb; box-shadow: 0 20px 46px rgba(41, 47, 91, .10); }
.tool-card__icon { width: 46px; height: 46px; display: grid; place-items: center; border-radius: 14px; }
.tool-card__icon svg { width: 23px; height: 23px; fill: none; stroke: currentColor; stroke-width: 1.65; }
.tone-purple { color: #7440eb; background: #f0eaff; }
.tone-blue { color: #2760ed; background: #eaf0ff; }
.tone-green { color: #0c9b69; background: #e7f8f0; }
.tone-orange { color: #ed642b; background: #fff0e8; }
.tone-pink { color: #e53274; background: #ffedf3; }
.tone-teal { color: #009b91; background: #e5f8f5; }
.tool-card h3 { margin: 18px 0 8px; font-size: 17px; line-height: 1.25; letter-spacing: -.025em; }
.tool-card p { margin: 0; color: var(--muted); font-size: 12.5px; line-height: 1.62; }
.card-link { display: flex; align-items: center; gap: 6px; margin-block-start: auto; padding-block-start: 20px; color: var(--blue); font-size: 12px; font-weight: 800; }
.card-link svg { width: 14px; height: 14px; fill: none; stroke: currentColor; stroke-width: 2; transition: transform .18s ease; }
a.tool-card:hover .card-link svg { transform: translateX(3px); }
.tag { position: absolute; inset: 17px 17px auto auto; padding: 5px 7px; border-radius: 999px; color: #7350d7; background: #f0ebff; font-size: 8px; font-weight: 850; letter-spacing: .05em; text-transform: uppercase; }
.tag--popular { color: #3157df; background: #eaf0ff; }
.tool-card--disabled { color: #6b748e; background: #fafafe; border-style: dashed; box-shadow: none; }
.tool-card--disabled::after { content: ""; position: absolute; inset: 0; background: linear-gradient(135deg, transparent 65%, rgba(126, 87, 228, .04)); pointer-events: none; }
.tool-card--compact { min-height: 220px; }

.tool-section--pdf::before { background: linear-gradient(180deg, rgba(255, 247, 250, .76), rgba(255, 255, 255, .25)); }
.pdf-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 12px; }
.pdf-card { min-height: 132px; display: grid; grid-template-columns: 38px 1fr auto; gap: 12px; align-items: start; padding: 16px; border: 1px solid #f0dfe6; border-radius: 16px; background: #fff; transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease; }
a.pdf-card:hover { transform: translateY(-4px); border-color: #f0c4d3; box-shadow: 0 14px 32px rgba(119, 38, 69, .08); }
.pdf-card > span { width: 36px; height: 36px; display: grid; place-items: center; color: #e93570; border-radius: 11px; background: #ffedf3; }
.pdf-card svg { width: 18px; height: 18px; fill: none; stroke: currentColor; stroke-width: 1.7; }
.pdf-card h3 { margin: 2px 0 6px; font-size: 13px; line-height: 1.25; }
.pdf-card p { margin: 0; color: var(--muted); font-size: 10.5px; line-height: 1.5; }
.pdf-card b { align-self: center; color: #e93570; font-size: 16px; transition: transform .18s ease; }
a.pdf-card:hover b { transform: translateX(3px); }
.pdf-card small { display: block; margin-block-end: 5px; color: #9d5a71; font-size: 7px; font-weight: 850; letter-spacing: .06em; text-transform: uppercase; }
.pdf-card--disabled { color: #777f95; background: #fcfafa; border-style: dashed; }

.workflow {
  display: grid;
  grid-template-columns: .85fr 1.15fr;
  gap: clamp(35px, 8vw, 105px);
  align-items: center;
}
.workflow__steps { display: grid; gap: 14px; margin: 0; padding: 0; list-style: none; }
.workflow__steps li { display: grid; grid-template-columns: 56px 1fr; gap: 16px; align-items: start; padding: 20px; border: 1px solid var(--line); border-radius: 18px; background: #fff; box-shadow: 0 8px 24px rgba(40, 46, 84, .04); }
.workflow__steps > li > span { width: 50px; height: 50px; display: grid; place-items: center; border-radius: 15px; color: #fff; background: var(--gradient); font-size: 12px; font-weight: 850; }
.workflow__steps h3 { margin: 2px 0 5px; font-size: 16px; }
.workflow__steps p { margin: 0; color: var(--muted); font-size: 13px; }

.split-section { display: grid; grid-template-columns: 1fr 420px; gap: clamp(35px, 7vw, 95px); align-items: center; }
.split-section > div:first-child > p:last-child, .company p { color: var(--muted); }
.honest-card { padding: 28px; border: 1px solid #dcd9f1; border-radius: 24px; background: linear-gradient(145deg, #fff, #f6f4ff); box-shadow: var(--shadow-sm); }
.honest-card .tag { position: static; display: inline-block; }
.honest-card h3 { margin: 16px 0 7px; font-size: 20px; }
.honest-card p { margin: 0 0 20px; color: var(--muted); font-size: 13px; }

.guide-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 15px; }
.guide-grid article { min-height: 190px; padding: 24px; border: 1px solid var(--line); border-radius: 20px; background: linear-gradient(145deg, #fff, #f9f8ff); }
.guide-grid article > span { width: 46px; height: 46px; display: grid; place-items: center; color: var(--purple); border-radius: 14px; background: #f0eaff; }
.guide-grid svg { width: 23px; height: 23px; fill: none; stroke: currentColor; stroke-width: 1.6; }
.guide-grid small { display: block; margin-block: 22px 7px; color: var(--purple); font-size: 9px; font-weight: 850; letter-spacing: .06em; text-transform: uppercase; }
.guide-grid h3 { margin: 0; font-size: 17px; line-height: 1.35; }

.company {
  position: relative;
  display: grid;
  grid-template-columns: 120px 1fr auto;
  gap: 34px;
  align-items: center;
  overflow: hidden;
  padding: 44px;
  border: 1px solid #dedcf0;
  border-radius: var(--radius-lg);
  background: linear-gradient(135deg, #fff, #f7f4ff 55%, #edf6ff);
  box-shadow: var(--shadow-sm);
}
.company__mark { width: 110px; height: 110px; display: grid; place-items: center; color: #fff; border-radius: 32px; background: var(--gradient); box-shadow: 0 22px 45px rgba(83, 57, 220, .25); font-size: 34px; font-weight: 900; }
.company h2 { margin-block-end: 8px; font-size: clamp(30px, 3.4vw, 44px); }
.company p:last-child { max-width: 730px; margin: 0; }

.final-cta {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 30px;
  margin-block: 90px;
  padding: 44px;
  overflow: hidden;
  border-radius: var(--radius-lg);
  color: #fff;
  background: radial-gradient(circle at 85% 15%, rgba(255, 255, 255, .2), transparent 28%), linear-gradient(125deg, #1e3bcc, #6334dd 58%, #9232d6);
  box-shadow: 0 30px 70px rgba(56, 40, 166, .22);
}
.final-cta .section-kicker { color: #dcd8ff; }
.final-cta h2 { margin-block: 8px; font-size: clamp(31px, 4vw, 48px); }
.final-cta p:last-child { margin: 0; color: #e3e2fa; }

.site-footer { padding-block: 58px 24px; color: #c8cce0; background: #0e1430; }
.site-footer .brand { color: #fff; }
.site-footer__grid { display: grid; grid-template-columns: 1.6fr repeat(3, 1fr); gap: 42px; }
.site-footer__grid > div { display: flex; flex-direction: column; align-items: flex-start; gap: 9px; }
.site-footer p { max-width: 300px; margin: 13px 0 3px; color: #aab0c8; font-size: 13px; }
.site-footer h2 { margin: 6px 0 10px; color: #fff; font-size: 13px; }
.site-footer a, .site-footer button { padding: 0; border: 0; color: #aab0c8; background: transparent; font-size: 12px; cursor: pointer; }
.site-footer a:hover, .site-footer button:hover { color: #fff; }
.site-footer__bottom { display: flex; justify-content: space-between; gap: 20px; margin-block-start: 44px; padding-block-start: 20px; border-block-start: 1px solid rgba(255, 255, 255, .1); color: #858da9; font-size: 11px; }

.demo-dialog {
  width: min(680px, calc(100% - 28px));
  padding: 0;
  overflow: hidden;
  border: 1px solid var(--line);
  border-radius: 24px;
  color: var(--ink);
  background: #fff;
  box-shadow: 0 40px 100px rgba(12, 17, 45, .3);
}
.demo-dialog::backdrop { background: rgba(12, 16, 40, .55); backdrop-filter: blur(7px); }
.demo-dialog__head { display: flex; justify-content: space-between; gap: 20px; padding: 25px; border-block-end: 1px solid var(--line); background: linear-gradient(135deg, #fff, #f5f3ff); }
.demo-dialog h2 { margin: 6px 0 0; font-size: 26px; letter-spacing: -.035em; }
.demo-dialog .icon-button { display: grid; flex: 0 0 auto; }
.demo-video-shell { margin: 24px 24px 0; overflow: hidden; border: 1px solid #202d43; border-radius: 16px; background: #020817; box-shadow: 0 16px 38px rgba(7, 14, 35, .16); }
.demo-video-shell[hidden] { display: none; }
.demo-video-shell video { width: 100%; max-height: min(52vh, 390px); display: block; aspect-ratio: 16 / 9; object-fit: contain; background: #000; }
.demo-steps { display: grid; gap: 11px; padding: 24px; }
.demo-steps article { display: grid; grid-template-columns: 44px 1fr; gap: 14px; align-items: start; padding: 15px; border: 1px solid var(--line); border-radius: 15px; }
.demo-steps article > span { width: 42px; height: 42px; display: grid; place-items: center; border-radius: 12px; color: #fff; background: var(--gradient); font-size: 11px; font-weight: 850; }
.demo-steps h3 { margin: 0 0 4px; font-size: 15px; }
.demo-steps p { margin: 0; color: var(--muted); font-size: 12px; }
.demo-dialog__actions { display: flex; justify-content: flex-end; gap: 10px; padding: 18px 24px; border-block-start: 1px solid var(--line); background: #fafafe; }

.toast {
  position: fixed;
  z-index: 200;
  inset: auto auto 24px 50%;
  max-width: min(520px, calc(100% - 30px));
  padding: 12px 17px;
  border-radius: 13px;
  color: #fff;
  background: #111834;
  box-shadow: 0 20px 50px rgba(8, 13, 38, .25);
  font-size: 13px;
  font-weight: 680;
  opacity: 0;
  pointer-events: none;
  transform: translate(-50%, 18px);
  transition: opacity .18s ease, transform .18s ease;
}
.toast.is-visible { opacity: 1; transform: translate(-50%, 0); }

[dir="rtl"] .language-menu { transform-origin: top left; }
[dir="rtl"] .card-link svg, [dir="rtl"] .text-link svg, [dir="rtl"] .button svg { transform: scaleX(-1); }

@media (max-width: 1160px) {
  .site-header { grid-template-columns: auto 1fr; }
  .desktop-nav { display: none; }
  .header-actions { justify-self: end; }
  .menu-trigger { display: grid; }
  .tool-grid--five { grid-template-columns: repeat(3, 1fr); }
  .pdf-grid { grid-template-columns: repeat(3, 1fr); }
}

@media (max-width: 900px) {
  :root { --shell: min(100% - 30px, 760px); }
  .section { padding-block: 68px; }
  .auth-actions { display: none; }
  .hero { min-height: auto; grid-template-columns: 1fr; padding-block-start: 56px; }
  .hero__copy { max-width: 720px; }
  .product-preview { width: min(680px, 100%); margin-inline: auto; transform: none; }
  .trust-strip { grid-template-columns: repeat(2, 1fr); }
  .trust-strip > span:nth-child(2) { border-inline-end: 0; }
  .trust-strip > span:nth-child(-n + 2) { border-block-end: 1px solid var(--line); }
  .featured, .workflow, .split-section { grid-template-columns: 1fr; }
  .featured__visual { min-height: 390px; }
  .featured__content { max-width: 690px; }
  .tool-grid--six, .tool-grid--five { grid-template-columns: repeat(2, 1fr); }
  .pdf-grid { grid-template-columns: repeat(2, 1fr); }
  .split-section { gap: 28px; }
  .honest-card { max-width: 580px; }
  .company { grid-template-columns: 90px 1fr; padding: 34px; }
  .company__mark { width: 82px; height: 82px; border-radius: 24px; font-size: 26px; }
  .company .button { grid-column: 2; justify-self: start; }
  .final-cta { align-items: flex-start; flex-direction: column; }
  .site-footer__grid { grid-template-columns: 1.4fr 1fr 1fr; }
  .site-footer__grid > div:last-child { grid-column: 2; }
}

@media (max-width: 640px) {
  :root { --shell: calc(100% - 24px); }
  html { scroll-padding-top: 82px; }
  .page-glow--one { inset-inline-start: 0; }
  .page-glow--two { width: min(420px, 100vw); inset-inline-end: 0; }
  .site-header { min-height: 68px; padding-inline: 12px; gap: 8px; }
  .site-header > .brand span { display: none; }
  .site-header > .brand img { width: 35px; height: 35px; }
  .header-actions { gap: 6px; }
  .language-trigger { min-height: 40px; padding-inline: 9px; }
  .language-trigger [data-current-language] { max-width: 64px; overflow: hidden; text-overflow: ellipsis; }
  .language-menu { position: fixed; inset: 72px 12px auto; width: auto; max-height: calc(100vh - 90px); }
  .section { padding-block: 56px; }
  .hero { padding-block: 40px 48px; gap: 42px; }
  .hero h1 { margin-block-start: 18px; font-size: clamp(43px, 14vw, 62px); letter-spacing: -.06em; }
  .hero__lead { font-size: 16px; }
  .hero__actions { align-items: stretch; }
  .hero__actions .button { flex: 1 1 160px; }
  .hero__actions .text-link { flex: 1 1 100%; justify-content: center; }
  .hero__facts { display: grid; grid-template-columns: 1fr; gap: 9px; }
  .product-preview { padding: 11px; border-radius: 21px; }
  .product-preview::before { inset: -12px; border-radius: 28px; }
  .product-preview__workspace { grid-template-columns: 32px 1fr; }
  .preview-rail { gap: 12px; }
  .video-pair { grid-template-columns: 1fr 1fr; }
  .video-frame { min-height: 132px; }
  .person { width: 51px; height: 51px; inset-block-start: 24px; box-shadow: 0 9px 0 8px #3d2937; }
  .video-frame--target::after { width: 34px; height: 58px; inset-block-start: 18px; }
  .language-flow div { padding: 7px; }
  .product-preview__features { grid-template-columns: 1fr; }
  .trust-strip { grid-template-columns: 1fr; }
  .trust-strip > span { border-inline-end: 0; border-block-end: 1px solid var(--line); }
  .trust-strip > span:last-child { border-block-end: 0; }
  .featured__visual { min-height: 340px; }
  .featured__orbit { width: 185px; height: 185px; }
  .featured__orbit > div { width: 92px; height: 92px; border-radius: 26px; }
  .featured__orbit svg { width: 43px; height: 43px; }
  .mini-card { max-width: 150px; padding: 9px; font-size: 9px; }
  .mini-card--one { inset: 66px auto auto 14px; }
  .mini-card--two { inset: auto 14px 38px auto; }
  .tool-grid--six, .tool-grid--five, .pdf-grid, .guide-grid { grid-template-columns: 1fr; }
  .tool-card { min-height: 225px; }
  .pdf-card { min-height: 114px; }
  .workflow__steps li { grid-template-columns: 48px 1fr; padding: 15px; }
  .workflow__steps > li > span { width: 44px; height: 44px; }
  .company { grid-template-columns: 1fr; gap: 22px; padding: 27px 22px; }
  .company__mark { width: 68px; height: 68px; border-radius: 20px; }
  .company .button { grid-column: 1; }
  .final-cta { margin-block: 60px; padding: 31px 24px; }
  .site-footer__grid { grid-template-columns: 1fr 1fr; }
  .site-footer__grid > div:first-child, .site-footer__grid > div:last-child { grid-column: 1 / -1; }
  .site-footer__bottom { align-items: flex-start; flex-direction: column; }
  .demo-dialog__actions { flex-direction: column; }
}

@media (max-width: 1160px) {
  .hero__inner { grid-template-columns: minmax(0, .84fr) minmax(500px, 1.16fr); gap: 36px; }
  .hero__brand-lockup > span { font-size: clamp(43px, 4.7vw, 61px); }
  .hero__features li { padding-inline: 8px; }
  .hero__studio { grid-template-columns: minmax(0, 1fr) 112px; gap: 12px; }
  .hero__languages li { min-height: 36px; padding-inline: 10px; font-size: 11px; }
  .hero__closing { align-items: flex-start; flex-direction: column; }
  .hero__closing > p { max-width: none; }
  .hero__actions { justify-content: flex-start; }
}

@media (max-width: 900px) {
  .hero { min-height: auto; padding-block: 58px 64px; }
  .hero__inner { grid-template-columns: 1fr; gap: 54px; }
  .hero__copy { max-width: 720px; margin-inline: auto; text-align: center; }
  .hero__brand-lockup { margin-inline: auto; }
  .hero h1, .hero__lead { margin-inline: auto; }
  .hero__features { max-width: 620px; margin-inline: auto; }
  .hero__showcase { width: min(700px, 100%); margin-inline: auto; padding-block-start: 0; }
  .hero__speaker-stack { width: calc(100% - 46px); }
  .hero__closing { align-items: center; flex-direction: row; }
  .hero__closing > p { max-width: 190px; text-align: start; }
  .hero__actions { justify-content: flex-end; }
}

@media (max-width: 640px) {
  .hero { padding-block: 40px 48px; }
  .hero::before { background-size: 32px 32px; }
  .hero__world { width: 400px; height: 210px; inset-inline-end: -175px; opacity: .28; }
  .hero__inner { gap: 42px; }
  .hero__brand-lockup { gap: 11px; }
  .hero__brand-lockup img { width: 52px; }
  .hero__brand-lockup > span { font-size: 44px; }
  .hero h1 { margin-block: 25px 12px; font-size: clamp(34px, 10.7vw, 47px); line-height: 1.08; letter-spacing: -.045em; }
  .hero__lead { font-size: 16px; line-height: 1.5; }
  .hero__emphasis { font-size: 17px; }
  .hero__features { grid-template-columns: repeat(2, 1fr); gap: 0; margin-block-start: 34px; }
  .hero__features li { min-height: 112px; padding: 14px 10px; border-block-end: 1px solid rgba(130, 176, 216, .25); }
  .hero__features li:nth-child(2) { border-inline-end: 0; }
  .hero__features li:nth-child(n + 3) { border-block-end: 0; }
  .hero__studio { grid-template-columns: 1fr; }
  .hero-demo-preview { border-radius: 17px; }
  .hero-demo-preview__screen { aspect-ratio: 16 / 8.6; }
  .hero-demo-preview__play { width: 50px; height: 50px; }
  .hero__languages { display: flex; flex-wrap: wrap; gap: 7px; }
  .hero__languages li, .hero__languages .hero__languages-more { width: auto; min-width: 0; min-height: 34px; flex: 1 1 auto; justify-content: center; padding: 6px 10px; }
  .hero__speaker-stack { width: 100%; gap: 7px; margin-block-start: 12px; }
  .hero__speaker { height: 43px; grid-template-columns: 35px minmax(0, 1fr) auto; gap: 7px; padding: 4px 7px 4px 4px; }
  .hero__speaker-avatar { width: 33px; height: 33px; }
  .hero__waveform i:nth-child(n + 23) { display: none; }
  .hero__speaker strong { padding-inline: 6px; font-size: 8px; }
  .hero__closing { align-items: stretch; flex-direction: column; margin-block-start: 20px; }
  .hero__closing > p { max-width: none; text-align: center; }
  .hero__actions { align-items: stretch; display: grid; grid-template-columns: 1fr; }
  .hero__actions .button { width: 100%; justify-content: center; }
  .demo-video-shell { margin: 16px 16px 0; border-radius: 13px; }
}

@media (max-width: 1400px) {
  .hero__inner { width: min(100% - 40px, 1320px); grid-template-columns: minmax(0, .96fr) minmax(0, .84fr) minmax(160px, .3fr); gap: 20px; }
  .hero__brand-lockup img { width: clamp(82px, 7.4vw, 112px); }
  .hero__brand-lockup > span { font-size: clamp(68px, 7.1vw, 104px); }
  .hero h1 { margin-block-start: 48px; font-size: clamp(32px, 2.9vw, 40px); }
  .hero__lead { font-size: clamp(16px, 1.55vw, 21px); }
  .hero__emphasis { font-size: clamp(18px, 1.82vw, 24px); }
  .hero__features { margin-block-start: 44px; }
  .hero__features li { padding-inline: 9px; }
  .hero__features li > span { width: 47px; height: 47px; }
  .hero__features svg { width: 42px; height: 42px; }
  .hero__features strong { font-size: clamp(10px, 1.05vw, 14px); }
  .hero__media { padding-block-start: 78px; }
  .hero__speaker-stack { width: 100%; }
  .hero__rail { padding-block-start: 99px; }
  .hero__languages li { min-height: 43px; padding-inline: 11px; font-size: 14px; }
  .hero__languages li > span { font-size: 18px; }
  .hero__languages .hero__languages-more { min-width: 112px; }
  .hero__closing > p { font-size: 22px; }
  .hero__coming-soon { min-height: 52px; padding-inline: 12px; font-size: 15px; }
}

@media (max-width: 1040px) {
  .hero { min-height: auto; padding-block: 52px 62px; }
  .hero__network { width: 72vw; opacity: .48; }
  .hero__inner { width: min(100% - 36px, 960px); grid-template-columns: minmax(0, .9fr) minmax(0, 1.1fr); gap: 38px 30px; }
  .hero__copy { align-self: center; }
  .hero__brand-lockup img { width: clamp(76px, 9vw, 96px); }
  .hero__brand-lockup > span { font-size: clamp(62px, 9vw, 88px); }
  .hero h1 { margin-block-start: 38px; font-size: clamp(31px, 4.2vw, 40px); white-space: normal; }
  .hero__lead { font-size: 17px; white-space: normal; }
  .hero__emphasis { font-size: 19px; }
  .hero__features { grid-template-columns: repeat(2, 1fr); margin-block-start: 36px; }
  .hero__features li { min-height: 102px; padding: 11px; border-block-end: 1px solid rgba(130, 176, 216, .25); }
  .hero__features li:nth-child(2) { border-inline-end: 0; }
  .hero__features li:nth-child(n + 3) { border-block-end: 0; }
  .hero__media { padding-block-start: 48px; }
  .hero__speaker-stack { width: 100%; }
  .hero__rail { grid-column: 1 / -1; display: grid; grid-template-columns: minmax(0, 1fr) 235px; gap: 28px; align-items: end; padding: 0; }
  .hero__languages { display: flex; flex-wrap: wrap; gap: 8px; }
  .hero__languages li, .hero__languages .hero__languages-more { width: auto; min-width: 0; flex: 1 1 128px; justify-content: center; }
  .hero__closing { margin: 0; }
  .hero__closing > p { margin-block-end: 15px; }
}

@media (max-width: 900px) {
  .hero { padding-block: 40px 50px; }
  .hero__network { width: 125vw; height: 280px; inset-inline-end: -52%; opacity: .35; }
  .hero__flow-lines { height: 175px; }
  .hero__inner { width: calc(100% - 28px); grid-template-columns: 1fr; gap: 40px; }
  .hero__copy { max-width: 650px; margin-inline: auto; padding: 0; text-align: center; }
  .hero__brand-lockup { margin-inline: auto; }
  .hero__brand-lockup img { width: clamp(68px, 18vw, 92px); }
  .hero__brand-lockup > span { font-size: clamp(58px, 18vw, 88px); }
  .hero h1 { max-width: 620px; margin-block: 32px 12px; font-size: clamp(32px, 8.7vw, 45px); }
  .hero__lead { font-size: clamp(15px, 4.3vw, 19px); }
  .hero__emphasis { font-size: clamp(17px, 4.6vw, 21px); }
  .hero__features { max-width: 520px; margin-block-start: 34px; }
  .hero__features strong { font-size: 12px; }
  .hero__media { width: min(650px, 100%); margin-inline: auto; padding: 0; }
  .hero-demo-preview { border-radius: 16px; }
  .hero-demo-preview__screen { aspect-ratio: 16 / 7.25; }
  .hero__speaker { grid-template-columns: 46px minmax(0, 1fr) auto; height: 51px; }
  .hero__speaker-avatar { width: 42px; height: 42px; }
  .hero__speaker--1::before { inset-inline-start: 58px; }
  .hero__rail { width: min(650px, 100%); display: block; margin-inline: auto; }
  .hero__languages { display: flex; }
  .hero__languages li, .hero__languages .hero__languages-more { flex-basis: 30%; }
  .hero__closing { margin-block-start: 30px; }
  .hero__closing > p { max-width: none; text-align: center; }
  .hero__coming-soon { width: min(270px, 100%); min-width: 0; margin-inline: auto; display: flex; }
}

@media (max-width: 460px) {
  .hero__inner { width: calc(100% - 22px); }
  .hero__brand-lockup { gap: 10px; }
  .hero__brand-lockup img { width: 62px; }
  .hero__brand-lockup > span { font-size: 57px; }
  .hero h1 { font-size: clamp(30px, 9.3vw, 39px); }
  .hero__features li { min-height: 105px; }
  .hero-demo-preview__bar { height: 25px; }
  .hero-demo-preview__play { width: 48px; height: 48px; }
  .hero-demo-preview__controls { height: 34px; padding-inline: 10px; }
  .hero__speaker-stack { margin-block-start: 20px; }
  .hero__speaker { grid-template-columns: 39px minmax(0, 1fr) auto; height: 46px; gap: 6px; padding-inline-end: 6px; }
  .hero__speaker-avatar { width: 37px; height: 37px; }
  .hero__speaker--1::before { inset-inline-start: 50px; }
  .hero__speaker strong { padding-inline: 5px; font-size: 8px; }
  .hero__waveform i:nth-child(n + 21) { display: none; }
  .hero__languages li, .hero__languages .hero__languages-more { flex-basis: 42%; font-size: 12px; }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { scroll-behavior: auto !important; animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; }
}
