/* Универсальный финальный CTA-блок: partials/cta-card.html
   Тема (градиент/акцент) задаётся data-theme, декор — data-art. */
.cta-card {
  --cta-from: #24182f;
  --cta-to: #151217;
  --cta-border: #503668;
  --cta-accent: #bca4ff;
  --cta-glow: #8b5cf6;
  --cta-angle: 120deg;
  position: relative;
  isolation: isolate;
  overflow: hidden;
  width: min(1200px, calc(100% - 96px));
  margin: 25px auto 75px;
  padding: 55px;
  border: 1px solid var(--cta-border);
  border-radius: 20px;
  background: linear-gradient(var(--cta-angle), var(--cta-from), var(--cta-to));
}
.cta-card[data-theme="violet"]  { }
.cta-card[data-theme="indigo"]  { --cta-from:#1a1c3a; --cta-to:#0f1017; --cta-border:#39407a; --cta-accent:#9fb0ff; --cta-glow:#5b6cf0; --cta-angle:135deg; }
.cta-card[data-theme="magenta"] { --cta-from:#33163a; --cta-to:#15101a; --cta-border:#6d3a79; --cta-accent:#f0a4ff; --cta-glow:#d946ef; --cta-angle:105deg; }
.cta-card[data-theme="teal"]    { --cta-from:#12302f; --cta-to:#0e1414; --cta-border:#2f6461; --cta-accent:#8ee6dc; --cta-glow:#2dd4bf; --cta-angle:125deg; }
.cta-card[data-theme="amber"]   { --cta-from:#33240f; --cta-to:#15120e; --cta-border:#6b5028; --cta-accent:#f2c57c; --cta-glow:#f59e0b; --cta-angle:115deg; }
.cta-card[data-theme="rose"]    { --cta-from:#361621; --cta-to:#151013; --cta-border:#743448; --cta-accent:#ffa5bd; --cta-glow:#f43f5e; --cta-angle:110deg; }
.cta-card[data-theme="moon"]    { --cta-from:#2a2c33; --cta-to:#111215; --cta-border:#5a5e68; --cta-accent:#d7deeb; --cta-glow:#cfd6e4; --cta-angle:120deg; }
.cta-card[data-theme="moon"] .btn-primary { color: #15161a; }

/* мягкое свечение справа — одинаково для всех тем */
.cta-card::before {
  content: "";
  position: absolute;
  z-index: -1;
  right: -10%;
  top: -40%;
  width: 60%;
  aspect-ratio: 1;
  background: radial-gradient(circle, color-mix(in srgb, var(--cta-glow) 22%, transparent), transparent 65%);
  pointer-events: none;
}

.cta-card .cta-card__eyebrow {
  margin: 0 0 20px;
  font-size: 11px;
  letter-spacing: 1.6px;
  text-transform: uppercase;
  color: var(--cta-accent);
}
.cta-card .cta-card__title {
  margin: 0 0 28px;
  max-width: 760px;
  font-family: 'Jost', sans-serif;
  font-size: clamp(34px, 4.4vw, 56px);
  font-weight: 500;
  letter-spacing: -1.6px;
  line-height: 1.12;
  color: var(--text);
}
.cta-card .cta-card__title em { font-style: normal; color: var(--cta-accent); }
.cta-card .cta-card__text {
  margin: -8px 0 28px;
  max-width: 520px;
  font-size: 16px;
  line-height: 1.65;
  color: var(--text-mid);
}
.cta-card__actions { display: flex; flex-wrap: wrap; gap: 12px; position: relative; z-index: 2; }
.cta-card .btn-primary { background: color-mix(in srgb, var(--cta-glow) 88%, #fff 0%); }
.cta-card__note { margin: 20px 0 0; max-width: 560px; font-size: 11px; line-height: 1.5; color: var(--text-muted); position: relative; z-index: 2; }
.cta-card__note a { color: inherit; text-decoration: underline; }

/* ── декор ── */
.cta-card__art { position: absolute; z-index: -1; pointer-events: none; color: var(--cta-glow); }

/* glyph: крупный символ (§, ¶ …) */
.cta-card__art--glyph {
  right: 60px; top: -65px;
  font-size: 300px; line-height: 1;
  opacity: .13;
}
/* rings: концентрические окружности */
.cta-card__art--rings {
  right: -120px; top: 50%;
  width: 520px; aspect-ratio: 1;
  transform: translateY(-50%);
  border-radius: 50%;
  background: repeating-radial-gradient(circle, transparent 0 34px, color-mix(in srgb, currentColor 22%, transparent) 34px 35px);
  mask-image: radial-gradient(circle, #000 30%, transparent 72%);
}
/* grid: сетка, растворяющаяся к центру */
.cta-card__art--grid {
  inset: 0 0 0 40%;
  background-image:
    linear-gradient(color-mix(in srgb, currentColor 16%, transparent) 1px, transparent 1px),
    linear-gradient(90deg, color-mix(in srgb, currentColor 16%, transparent) 1px, transparent 1px);
  background-size: 32px 32px;
  mask-image: radial-gradient(ellipse at 80% 50%, #000, transparent 70%);
}
/* beams: диагональные лучи */
.cta-card__art--beams {
  inset: 0 0 0 45%;
  background: repeating-linear-gradient(115deg, transparent 0 26px, color-mix(in srgb, currentColor 14%, transparent) 26px 27px);
  mask-image: linear-gradient(90deg, transparent, #000 60%);
}
/* dots: точечный растр */
.cta-card__art--dots {
  inset: 0 0 0 40%;
  background-image: radial-gradient(color-mix(in srgb, currentColor 35%, transparent) 1.3px, transparent 1.6px);
  background-size: 22px 22px;
  mask-image: radial-gradient(ellipse at 85% 40%, #000, transparent 68%);
}
/* stack: три «листа» документа */
.cta-card__art--stack {
  right: 90px; top: 50%;
  width: 190px; height: 240px;
  transform: translateY(-50%) rotate(6deg);
  border: 1px solid color-mix(in srgb, currentColor 35%, transparent);
  border-radius: 12px;
  box-shadow: -22px 16px 0 -1px color-mix(in srgb, currentColor 10%, transparent), -44px 32px 0 -2px color-mix(in srgb, currentColor 6%, transparent);
  background: repeating-linear-gradient(transparent 0 22px, color-mix(in srgb, currentColor 14%, transparent) 22px 23px);
  opacity: .8;
}

@media (max-width: 1000px) { .cta-card { width: calc(100% - 48px); } }
@media (max-width: 700px) {
  .cta-card { width: calc(100% - 40px); padding: 30px; margin-bottom: 50px; }
  .cta-card__art--glyph { right: -45px; top: 40px; font-size: 210px; }
  .cta-card__art--rings, .cta-card__art--stack { right: -200px; opacity: .6; }
  .cta-card__art--grid, .cta-card__art--beams, .cta-card__art--dots { inset: 0; }
}