/* Shared visual language for presentation pages.
   Legal documents intentionally do not load this stylesheet. */

:is(.service-page, .ai-service-page, .catalog-page, .article-page) {
  --internal-line: rgba(105, 67, 185, .16);
  --internal-shadow: 0 16px 42px rgba(61, 29, 103, .075);
  --internal-shadow-hover: 0 22px 52px rgba(61, 29, 103, .12);
}

:is(.home-page, .service-page, .ai-service-page, .catalog-page, .article-page)
  :is(.eyebrow, .kicker, .article-category) {
  display: inline-flex;
  align-items: center;
  width: fit-content;
  max-width: 100%;
  padding: 8px 13px;
  border: 1px solid rgba(110, 67, 205, .22);
  border-radius: 999px;
  background: linear-gradient(135deg, #eee6ff, #ddf9f5);
  box-shadow: 0 8px 22px rgba(70, 42, 126, .08);
  color: var(--purple);
  font-size: .76rem;
  font-weight: 850;
  line-height: 1;
  letter-spacing: .12em;
  text-transform: uppercase;
  transform: rotate(-1.2deg);
  transform-origin: left center;
}

:is(.home-page, .service-page, .ai-service-page, .catalog-page, .article-page)
  main > section:nth-of-type(even) .section-heading > .kicker {
  transform: rotate(1deg) translateX(3px);
}

:is(.home-page, .service-page, .ai-service-page, .catalog-page, .article-page)
  :is(.final-panel, .ai-contact-panel, .contact-topics-panel) .kicker {
  border-color: rgba(255, 255, 255, .22);
  background: rgba(255, 255, 255, .12);
  box-shadow: none;
  color: #e7ddff;
}

:is(.service-page, .ai-service-page, .catalog-page) .section-heading {
  position: relative;
}

:is(.service-page, .ai-service-page, .catalog-page) .section-heading::after {
  content: "";
  display: block;
  width: 72px;
  height: 5px;
  margin-top: 22px;
  border-radius: 999px;
  background: linear-gradient(90deg, #7b45df, #25c4c5);
  box-shadow: 0 6px 15px rgba(91, 61, 168, .16);
  transform: rotate(-2deg);
}

:is(.service-page, .ai-service-page, .catalog-page)
  main > section:nth-of-type(even) .section-heading::after {
  transform: rotate(2deg) translateX(5px);
}

:is(.service-page, .ai-service-page, .catalog-page)
  :is(.final-panel, .ai-contact-panel, .contact-topics-panel) .section-heading::after,
:is(.service-page, .ai-service-page, .catalog-page)
  :is(.final-panel, .ai-contact-panel, .contact-topics-panel).section-heading::after {
  display: none;
}

:is(.service-page, .ai-service-page, .catalog-page, .article-page)
  :is(
    .bot-card,
    .ai-solution,
    .agent-card,
    .funnel-ai-card,
    .difference-card,
    .direction-card,
    .platform-card,
    .credential-card,
    .document-card,
    .service-link-grid a,
    .scope-group,
    .vk-tool-card,
    .channel-service-card,
    .scenario-node,
    .portfolio-card,
    .publication-card,
    .direct-contact-card,
    .channel-card,
    .article-intro-card,
    .article-callout,
    .expert-note,
    .niche-card
  ) {
  border-color: var(--internal-line);
  box-shadow: var(--internal-shadow);
}

@media (hover: hover) and (pointer: fine) {
  :is(.service-page, .ai-service-page, .catalog-page, .article-page)
    :is(
      .ai-solution,
      .agent-card,
      .funnel-ai-card,
      .difference-card,
      .direction-card,
      .platform-card,
      .credential-card,
      .service-link-grid a,
      .scope-group,
      .vk-tool-card,
      .channel-service-card,
      .portfolio-card,
      .publication-card,
      .channel-card,
      .niche-card
    ) {
    transition: transform .24s ease, border-color .24s ease, box-shadow .24s ease;
  }

  :is(.service-page, .ai-service-page, .catalog-page, .article-page)
    :is(
      .ai-solution,
      .agent-card,
      .funnel-ai-card,
      .difference-card,
      .direction-card,
      .platform-card,
      .credential-card,
      .service-link-grid a,
      .scope-group,
      .vk-tool-card,
      .channel-service-card,
      .portfolio-card,
      .publication-card,
      .channel-card,
      .niche-card
    ):hover {
    border-color: rgba(105, 67, 185, .28);
    box-shadow: var(--internal-shadow-hover);
    transform: translateY(-3px);
  }
}

:is(.service-page, .ai-service-page, .catalog-page, .article-page) .button {
  letter-spacing: .005em;
  box-shadow: 0 11px 27px rgba(91, 57, 154, .19);
}

:is(.service-page, .ai-service-page, .catalog-page, .article-page)
  :is(.button-ghost, .button-line) {
  box-shadow: none;
}

:is(.service-page, .ai-service-page, .catalog-page, .article-page) .text-link {
  text-decoration-thickness: 1px;
  text-underline-offset: 4px;
}

:is(.service-page, .ai-service-page, .catalog-page, .article-page) .final-panel {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  background: linear-gradient(135deg, #2e2237 0%, #603394 62%, #157f80 135%);
}

:is(.service-page, .ai-service-page, .catalog-page, .article-page) .final-panel::before {
  content: "";
  position: absolute;
  z-index: -1;
  width: 260px;
  aspect-ratio: 1;
  right: -94px;
  top: -116px;
  border-radius: 42% 58% 56% 44% / 48% 39% 61% 52%;
  background: radial-gradient(circle at 38% 38%, rgba(123, 235, 224, .3), rgba(132, 84, 223, .08) 64%, transparent 70%);
  transform: rotate(12deg);
  pointer-events: none;
}

.article-page .article-body h2 {
  position: relative;
  padding-bottom: 12px;
}

.article-page .article-body h2::after {
  content: "";
  display: block;
  width: 48px;
  height: 4px;
  margin-top: 12px;
  border-radius: 999px;
  background: linear-gradient(90deg, #7b45df, #25c4c5);
  transform: rotate(-1.5deg);
}

.article-page .article-body :is(.article-callout, .expert-note, .article-intro-card) {
  background-image: linear-gradient(135deg, rgba(250, 247, 255, .98), rgba(239, 252, 250, .94));
}

@media (max-width: 640px) {
  :is(.home-page, .service-page, .ai-service-page, .catalog-page, .article-page)
    :is(.eyebrow, .kicker, .article-category),
  :is(.home-page, .service-page, .ai-service-page, .catalog-page, .article-page)
    main > section:nth-of-type(even) .section-heading > .kicker {
    padding: 7px 10px;
    transform: none;
  }

  :is(.service-page, .ai-service-page, .catalog-page) .section-heading::after,
  :is(.service-page, .ai-service-page, .catalog-page)
    main > section:nth-of-type(even) .section-heading::after {
    width: 58px;
    height: 4px;
    margin-top: 18px;
    transform: none;
  }

  :is(.service-page, .ai-service-page, .catalog-page, .article-page) .final-panel::before {
    width: 190px;
    right: -92px;
    top: -94px;
    opacity: .72;
  }
}

@media (prefers-reduced-motion: reduce) {
  :is(.service-page, .ai-service-page, .catalog-page, .article-page) * {
    scroll-behavior: auto;
  }
}