/* The home page theme: light. index.html sets html[data-theme="light"]; the
   base files (v2.css, screens.css, analytics.css, assets/ainura.css) were
   drawn dark first, and these rules repaint them light. The demo windows use
   the light theme of the cabinet itself. */

/* ---------- Tokens and page ---------- */
:root[data-theme="light"] {
  color-scheme: light;
  --paper: #f5f6fb;
  --ink: #0d1024;
  --muted: #5b6178;
  --line: #0d102414;
  --card: #ffffff;
  --hair: 0 0 0 1px #0d10240f;
  --shadow:
    inset 0 1px 0 #fff, 0 0 0 1px #0d10240f, 0 1px 2px #0d10240a,
    0 18px 40px -22px #1b2a7a33;
  --lift:
    0 0 0 1px #0d10240d, 0 1px 2px #0d10240a, 0 12px 28px -14px #1b2a7a2e,
    0 40px 80px -48px #3e60ff40;
}
[data-theme="light"] body {
  background:
    radial-gradient(1200px 600px at 50% 0, #ffffff, transparent 70%),
    var(--paper);
}
[data-theme="light"] .frame {
  border-color: #0d10240f;
  background: var(--card);
  box-shadow: var(--lift);
}
[data-theme="light"] ::selection {
  background: #3e60ff;
  color: #fff;
}
[data-theme="light"] .text-link:hover {
  color: #3e60ff;
}

/* ---------- Buttons: ink primary, white hairline secondary ---------- */
[data-theme="light"] .button-light {
  color: #fff;
  background: linear-gradient(180deg, #232a5c, #0d1024);
  box-shadow:
    inset 0 1px 0 #ffffff2e,
    0 0 0 1px #0d1024,
    0 10px 24px -10px #0d1024a0,
    0 18px 40px -18px #3e60ff99;
}
[data-theme="light"] .button-light:hover {
  box-shadow:
    inset 0 1px 0 #ffffff38,
    0 0 0 1px #0d1024,
    0 14px 30px -10px #0d1024b0,
    0 22px 48px -16px #3e60ffb0;
}
[data-theme="light"] .button-outline-light {
  color: var(--ink);
  background:
    linear-gradient(180deg, #ffffff, #f4f6ff) padding-box,
    linear-gradient(180deg, #0d10241f, #0d102414) border-box;
  box-shadow:
    inset 0 1px 0 #fff,
    0 1px 2px #0d10240f,
    0 10px 24px -14px #1b2a7a40;
}
[data-theme="light"] .button-outline-light:hover {
  background:
    linear-gradient(180deg, #ffffff, #eef1ff) padding-box,
    linear-gradient(180deg, #3e60ff4d, #0d10241f) border-box;
}

/* ---------- Header ---------- */
[data-theme="light"] .wordmark img {
  filter: brightness(0);
}
[data-theme="light"] .site-header {
  color: var(--ink);
}
[data-theme="light"] .site-header.is-scrolled {
  background: #ffffffc7;
  color: var(--ink);
  box-shadow:
    inset 0 0 0 1px #0d10240f,
    inset 0 1px 0 #fff,
    0 12px 32px -16px #1b2a7a40;
}
@media (max-width: 767px) {
  [data-theme="light"] .site-nav {
    background: #fffffff2;
    border-color: #0d102414;
    color: var(--ink);
    box-shadow: 0 20px 40px -12px #1b2a7a40;
  }
}

/* ---------- Hero: the same light, painted on a light sky ---------- */
[data-theme="light"] .hero {
  --hero-ink: #0d1024;
  --hero-muted: #4b5272;
  background:
    radial-gradient(ellipse 80% 46% at 50% 0, #dfe4ff, transparent 72%),
    radial-gradient(ellipse 70% 30% at 50% 84%, #e9e2ff, transparent 72%),
    linear-gradient(180deg, #eef0ff, #f7f8fd 60%, var(--paper));
  /* No bottom rim: the light sky fades into the page. */
  border-radius: 0;
}
[data-theme="light"] .hero::after {
  content: "";
  position: absolute;
  inset: auto 0 0;
  height: 22%;
  z-index: -1;
  pointer-events: none;
  background: linear-gradient(transparent, var(--paper));
}
/* The hero clips the painted plate; this fade sits above the plate, stacks
   and near tiles but under the phone and people, so the glow melts into the
   page instead of ending on a hard line. */
[data-theme="light"] .stage-fade {
  --overhang: 4.5cqw;
  position: absolute;
  inset: auto 0 0;
  height: calc(var(--overhang) + 12cqw);
  pointer-events: none;
  background: linear-gradient(#f5f6fb00, var(--paper) calc(100% - var(--overhang)));
}
@media (max-width: 767px) {
  [data-theme="light"] .stage-fade {
    --overhang: 1.8cqw;
  }
}
[data-theme="light"] .hero::before {
  opacity: 0.05;
  mix-blend-mode: multiply;
}
[data-theme="light"] :is(.hero, .final-cta) .sky-beams i {
  background: linear-gradient(#ffffff, #ffffffb0 45%, transparent);
  filter: blur(22px);
}
[data-theme="light"] :is(.hero, .final-cta) .sky-aura {
  filter: blur(70px);
}
[data-theme="light"] :is(.hero, .final-cta) .aura-violet {
  background: radial-gradient(closest-side, #b9a0ff, #c7b2ffb3 45%, transparent);
}
[data-theme="light"] :is(.hero, .final-cta) .aura-blue {
  background: radial-gradient(closest-side, #9fb3ffcc, transparent);
}
[data-theme="light"] :is(.hero, .final-cta) .aura-green {
  background: radial-gradient(closest-side, #8fe6c8, #a6efd6b3 45%, transparent);
}
[data-theme="light"] :is(.hero, .final-cta) .aura-core {
  background: radial-gradient(closest-side, #ffffff, #ffffff80 55%, transparent);
}
[data-theme="light"] .sky-dust {
  --dust-rgb: 92 104 255;
  opacity: 0.55;
}
/* scene-light.webp is the night plate pre-blended in "color" mode over the
   light sky (saturate 2.2): iOS Safari ignores mix-blend-mode on this
   composited, transformed layer and showed the dark plate with banding.
   The entrance starts from a colourless plate instead of a dark one. */
[data-theme="light"].js .hero:not(.is-in) .stage-scene {
  filter: saturate(0);
}
/* With the dark phone gone the aipie tile and the people need ground to
   stand on: a pastel pool of light with a soft contact shadow in its middle.
   Stage units, so it scales and crops with the scene. */
[data-theme="light"] .stage-base:has(> .stage-center)::before,
[data-theme="light"] .stage-base:has(> .stage-center)::after {
  content: "";
  position: absolute;
  border-radius: 50%;
  transform: translate(-50%, -50%);
  pointer-events: none;
}
[data-theme="light"] .stage-base:has(> .stage-center)::before {
  left: 48%;
  top: 82%;
  width: 44%;
  height: 11%;
  background: radial-gradient(closest-side, #a58cffd9, #bfaeff8c 50%, #d6ccff00);
  filter: blur(0.8cqw);
}
[data-theme="light"] .stage-base:has(> .stage-center)::after {
  left: 48.5%;
  top: 81.6%;
  width: 30%;
  height: 4%;
  background: radial-gradient(closest-side, #3a2b8f73, #5b48c833 60%, #5b48c800);
  filter: blur(0.4cqw);
}
[data-theme="light"] .stage-tile {
  background: linear-gradient(150deg, #ffffff, #e4e7fb 70%);
  box-shadow:
    inset 0 1px 0 #fff,
    0 0.6cqw 0 #cfd4f5,
    0 1.4cqw 2.4cqw -0.8cqw #1b2a7a33;
}
[data-theme="light"] .stage-tile.is-far,
[data-theme="light"] .stage-tile.is-icon {
  background: linear-gradient(150deg, #ffffff, #e8e4ff 70%);
  box-shadow:
    inset 0 1px 0 #fff,
    0 0.4cqw 0 #d6d0fb;
  opacity: 0.8;
}
[data-theme="light"] .stage-tile svg {
  stroke: #7d6bf0;
}
[data-theme="light"] .stage-tile.is-violet,
[data-theme="light"] .stage-tile.is-near {
  background: linear-gradient(150deg, #efe9ff, #c9bbff 70%);
  box-shadow:
    inset 0 1px 0 #fff,
    0 0.8cqw 0 #b3a2f5,
    0 0 4cqw #9b82ff40;
}
[data-theme="light"] .stage-tile.is-near {
  opacity: 0.6;
}

/* ---------- Film ---------- */
[data-theme="light"] .film-section::before {
  background:
    radial-gradient(ellipse 50% 45% at 30% 55%, #3e60ff1f, transparent 70%),
    radial-gradient(ellipse 45% 40% at 75% 45%, #7b5cff1a, transparent 70%);
}
[data-theme="light"] .film-ainura {
  color: transparent;
  background: linear-gradient(100deg, #5b6cff, #8a5cff);
  -webkit-background-clip: text;
  background-clip: text;
}
[data-theme="light"] .video-player {
  box-shadow:
    0 0 0 1px #0d102414,
    0 40px 90px -40px #1b2a7a66,
    0 60px 120px -60px #3e60ff59;
}

/* ---------- Product ---------- */
[data-theme="light"] .product-tabs,
[data-theme="light"] .screen-tabs {
  background: #0d10240a;
  border-color: #0d10240f;
}
[data-theme="light"] .product-tabs button,
[data-theme="light"] .screen-tabs button {
  color: var(--muted);
}
[data-theme="light"] .product-tabs button:hover,
[data-theme="light"] .screen-tabs button:hover {
  color: var(--ink);
  background: #0d10240a;
}
[data-theme="light"] .product-tabs button[aria-selected="true"],
[data-theme="light"] .screen-tabs button[aria-selected="true"] {
  color: var(--ink);
}
[data-theme="light"] .tab-indicator {
  color: var(--ink);
  background: #fff;
  box-shadow:
    0 0 0 1px #0d10240f,
    0 1px 2px #0d10241a,
    0 4px 12px -4px #1b2a7a33;
}
[data-theme="light"] .product-frame,
[data-theme="light"] .dashboard-section > .frame {
  background: #fff;
  box-shadow: var(--lift);
}
[data-theme="light"] .integration-label {
  color: #7a8099;
}
/* The product chats wear the cabinet's light chat. */
[data-theme="light"] .glass-window {
  color: #141a36;
  border-color: #fff;
  background: #f7f8fc;
  box-shadow:
    inset 0 1px 0 #fff,
    0 0 0 1px #101a3e1f,
    0 2px 8px #101a3e14,
    0 24px 64px -16px #111a3e40;
}
[data-theme="light"] .conversation-date {
  color: #8b9ab8;
}
[data-theme="light"] .bubble {
  box-shadow: 0 1px 2px #101a3e0d;
}
[data-theme="light"] .incoming {
  color: #27324f;
  background: #fff;
  box-shadow: inset 0 0 0 1px #e6eaf3;
}
[data-theme="light"] .outgoing {
  background: #3654ee;
}
[data-theme="light"] .bubble-author {
  color: #dfe6ff;
}
[data-theme="light"] .incoming small {
  color: #8b9ab8;
}
[data-theme="light"] .outgoing small {
  color: #c9d4ff;
}
[data-theme="light"] .integration-brand {
  color: #4b5272;
}
[data-theme="light"] .integration-brand img {
  filter: brightness(0);
  opacity: 0.55;
}

@media (max-width: 767px) {
  [data-theme="light"] .product-panel,
  [data-theme="light"] .product-panel[hidden] {
    border-color: #0d10240f;
    background: #fff;
    box-shadow: var(--lift);
  }
}

/* ---------- Segments ---------- */
[data-theme="light"] .large-number,
[data-theme="light"] .price {
  color: transparent;
  background: linear-gradient(180deg, #0d1024 35%, #3e4fd0);
  -webkit-background-clip: text;
  background-clip: text;
}

/* ---------- Dashboard ---------- */
[data-theme="light"] .dashboard-section::before {
  background:
    radial-gradient(ellipse 50% 30% at 50% 34%, #3e60ff1f, transparent 72%),
    radial-gradient(ellipse 34% 24% at 16% 74%, #7b5cff14, transparent 72%);
}
[data-theme="light"] .dashboard-stage {
  background:
    radial-gradient(ellipse at 50% 0, #dfe5ff, transparent 75%),
    #f3f5fc;
}

/* ---------- Quote, phone, numbers ---------- */
[data-theme="light"] .quote {
  background:
    radial-gradient(ellipse 45% 120% at 0 0, #7c5cff14, transparent 70%),
    radial-gradient(ellipse 50% 90% at 100% 100%, #3e60ff12, transparent 70%),
    #fff;
}
[data-theme="light"] .quote-mark {
  color: #3e60ff;
}
[data-theme="light"] .quote figcaption span:first-child {
  color: var(--ink);
}
[data-theme="light"] .mobile-stage::before {
  background:
    radial-gradient(closest-side at 50% 45%, #3e60ff40, #5b7bff1f 55%, transparent),
    radial-gradient(closest-side at 72% 78%, #9b82ff33, transparent);
}
[data-theme="light"] .phone-frame {
  border-color: #d5d9e6;
  background: #f2f3f7;
  box-shadow:
    inset 0 0 0 1px #fff,
    0 0 0 1px #0d10241a,
    0 2px 4px #0d10241a,
    0 40px 80px -24px #1b2a7a59,
    0 0 120px -30px #3e60ff59;
}
[data-theme="light"] .phone-island {
  background: #0b0f1a;
}
[data-theme="light"] .phone-status {
  color: #0b1030;
}
[data-theme="light"] .phone-app-header > span {
  border-color: #141e5a1a;
  color: #0b1030;
  background: #ffffff94;
  box-shadow: inset 0 1px 0 #fff;
}
[data-theme="light"] .phone-bottom-nav {
  background: #ffffffe6;
  border-top-color: #0d10240f;
}
[data-theme="light"] .phone-bottom-nav::after {
  background: #0b1030b3;
}
[data-theme="light"] .phone-nav-item {
  color: #8b93ad;
}
[data-theme="light"] .phone-nav-item[aria-pressed="true"],
[data-theme="light"] .phone-nav-item:hover {
  color: #3e60ff;
}
[data-theme="light"] .phone-nav-item[data-view="Сообщения"]::after {
  border-color: #fff;
}
[data-theme="light"] .phone-push {
  border-color: #0d10240f;
  background: #ffffffeb;
  box-shadow: 0 12px 32px -8px #1b2a7a40, inset 0 1px 0 #fff;
  color: var(--muted);
}
[data-theme="light"] .phone-push b {
  color: var(--ink);
}
[data-theme="light"] .phone-push b small {
  color: #8b93ad;
}
[data-theme="light"] .phone-chat {
  background: #f7f8fc;
}
[data-theme="light"] .numbers-grid {
  background:
    radial-gradient(ellipse 40% 80% at 50% 0, #3e60ff0f, transparent 75%),
    #fff;
}
[data-theme="light"] .numbers-grid::after {
  background: radial-gradient(
    340px circle at var(--mx, 50%) var(--my, 50%),
    #3e60ff12,
    transparent 70%
  );
}
@media (hover: hover) {
  [data-theme="light"] .numbers-grid > div:hover .large-number {
    filter: drop-shadow(0 0 22px #6d86ff40);
  }
  [data-theme="light"] .numbers-grid > div:hover p + p {
    color: var(--ink);
  }
}

/* ---------- Offer, form, FAQ, referral ---------- */
[data-theme="light"] .offer-section {
  background:
    radial-gradient(ellipse 55% 110% at 100% 0, #3e60ff17, transparent 70%),
    radial-gradient(ellipse 40% 90% at 0 100%, #7c5cff0f, transparent 70%),
    #fff;
}
[data-theme="light"] .referral-section {
  background:
    radial-gradient(ellipse 50% 100% at 0 0, #7c5cff14, transparent 70%),
    #fff;
}
[data-theme="light"] .field {
  color: var(--ink);
  background: #f6f7fb;
  box-shadow:
    inset 0 1px 2px #0d10240d,
    0 0 0 1px #0d102417;
}
[data-theme="light"] .field::placeholder {
  color: #8b91a8;
}
[data-theme="light"] .field:focus-visible {
  background: #fff;
  box-shadow:
    0 0 0 1px #3e60ff,
    0 0 0 4px #3e60ff26;
}
[data-theme="light"] .lead-check input {
  background-color: #fff;
  box-shadow: inset 0 0 0 1px #0d102433;
}
[data-theme="light"] .lead-check a {
  color: var(--ink);
}
[data-theme="light"] .lead-msg b {
  color: var(--ink);
}
[data-theme="light"] .lead-msg[data-state="error"] {
  color: #c23a4a;
}
[data-theme="light"] .lead-msg[data-state="ok"] {
  color: #1d7a52;
}
[data-theme="light"] .faq-list summary:hover,
[data-theme="light"] .faq-list summary::after {
  color: #3e60ff;
}

/* ---------- Final CTA: the light sky of the hero ---------- */
[data-theme="light"] .final-cta {
  color: var(--ink);
  background:
    radial-gradient(ellipse 60% 45% at 50% 100%, #e6dcff, transparent 72%),
    radial-gradient(ellipse 70% 40% at 50% 0, #dfe4ff, transparent 70%),
    linear-gradient(180deg, var(--paper), #eef0ff);
}
[data-theme="light"] .final-cta::before {
  opacity: 0.05;
  mix-blend-mode: multiply;
}
[data-theme="light"] .final-copy > p {
  color: var(--muted);
}
[data-theme="light"] .cta-dust {
  opacity: 0.6;
  filter: brightness(0) invert(38%) sepia(80%) saturate(2600%) hue-rotate(226deg);
}
[data-theme="light"] .cta-tile {
  background: linear-gradient(150deg, #ffffff, #e2dcff 70%);
  box-shadow:
    inset 0 1px 0 #fff,
    0 8px 0 #c9bdfa;
}
[data-theme="light"] .cta-block {
  background:
    radial-gradient(circle at 30% 20%, #ffffff, transparent 55%),
    linear-gradient(150deg, #ffffff, #e9e5ff 75%);
  box-shadow:
    inset 0 1px 0 #fff,
    inset 0 0 0 1px #ffffff,
    0 14px 0 #8f7bff,
    0 16px 0 #b9a8ff80,
    0 40px 60px -10px #5b3fd040;
}
[data-theme="light"] .cta-ring {
  color: var(--ink);
  background: radial-gradient(circle at 40% 30%, #ffffff, #eeeaff 70%);
  box-shadow:
    inset 0 1px 0 #fff,
    0 12px 0 #a38fff,
    0 14px 0 #c9bbff80,
    0 40px 60px -10px #5b3fd040;
}
[data-theme="light"] .ring-track {
  stroke: #0d102414;
}
[data-theme="light"] .ring-arc {
  stroke: #22c37a;
  filter: none;
}
[data-theme="light"] .cta-ring small {
  color: var(--muted);
}
[data-theme="light"] .cta-card-wrap::before {
  background: radial-gradient(closest-side, #9b82ff40, transparent);
}
[data-theme="light"] .cta-card {
  color: var(--ink);
  background:
    radial-gradient(ellipse 60% 90% at 0 100%, #c4b2ff59, transparent 70%),
    linear-gradient(170deg, #ffffff, #f2efff 70%);
  box-shadow:
    inset 0 1px 0 #fff,
    inset 0 0 0 1px #0d10240a,
    0 22px 0 #9a85ff,
    0 24px 0 #c4b5ff80,
    0 60px 80px -20px #3b2a9a4d;
}
[data-theme="light"] .cta-card-head b {
  color: var(--muted);
}
[data-theme="light"] .cta-card-bar {
  box-shadow: 0 4px 0 #c3aefb, 0 0 24px #a46bff59;
}
[data-theme="light"] .cta-card-chips span {
  box-shadow: inset 0 0 0 1.5px #0d10241f;
}
[data-theme="light"] .cta-card-chips span:last-child svg {
  stroke: #1fa86a;
}
/* ---------- Footer: the page paper under the CTA ---------- */
[data-theme="light"] .site-footer {
  --footer-bg: var(--paper);
  color: var(--ink);
}
[data-theme="light"] .site-footer::after {
  background:
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 88 64' preserveAspectRatio='none'%3E%3Cpath fill='%23f5f6fb' d='M0 64C44 64 44 0 88 0v64z'/%3E%3C/svg%3E")
      0 0 / var(--notch-w) 100% no-repeat,
    linear-gradient(var(--footer-bg), var(--footer-bg)) var(--notch-w) 0 /
      100% 100% no-repeat;
}
[data-theme="light"] .site-footer a {
  color: var(--muted);
}
[data-theme="light"] .site-footer a:hover {
  color: #3e60ff;
}
[data-theme="light"] .footer-top .wordmark,
[data-theme="light"] .footer-col-title,
[data-theme="light"] .site-footer .footer-telegram {
  color: var(--ink);
}
[data-theme="light"] .site-footer .footer-telegram {
  background: #fff;
  box-shadow: inset 0 0 0 1px #0d102414;
}
[data-theme="light"] .site-footer .footer-telegram:hover {
  background: #eef1ff;
  box-shadow: inset 0 0 0 1px #3e60ff40;
}
[data-theme="light"] .footer-bottom,
[data-theme="light"] .footer-cols {
  border-top-color: #0d10240f;
}
[data-theme="light"] .footer-bottom,
[data-theme="light"] .footer-note {
  color: #7a8099;
}
