/* =========================================================
   Kutamiz — анимации сайта: фон, свечение, наклон, рябь
   ========================================================= */
.ambient-dust { position: fixed; inset: 0; z-index: 0; pointer-events: none; mix-blend-mode: screen; }
body > header, body > section, body > footer, body > div.marquee, body > .dash-top, body > .dash-hero, body > .dash-content { position: relative; z-index: 1; }

/* переливающийся узор */
body::after { content: ""; position: fixed; inset: -10%; z-index: 0; pointer-events: none; opacity: .06;
  background: url(../art/pattern.svg) 0 0 / 240px 240px repeat; animation: pattern-drift 80s linear infinite;
  -webkit-mask-image: radial-gradient(circle at 50% 30%, #000 0%, transparent 70%); mask-image: radial-gradient(circle at 50% 30%, #000 0%, transparent 70%); }
@keyframes pattern-drift { to { background-position: 240px 480px; } }

.cursor-glow { position: fixed; left: 0; top: 0; width: 520px; height: 520px; margin: -260px 0 0 -260px; z-index: 0; pointer-events: none; opacity: 0; transition: opacity .6s;
  background: radial-gradient(circle, rgba(212,178,106,.13), rgba(212,178,106,.04) 40%, transparent 65%); mix-blend-mode: screen; will-change: transform; }

/* наклон */
.tpl-card, .phone-stage .phone, .exp-scene, .plan, .feat, .review { transform-style: preserve-3d; }
.is-tilt { transform: perspective(900px) rotateX(var(--rx, 0)) rotateY(var(--ry, 0)) translateY(-4px) !important; transition: transform .12s ease-out, box-shadow .3s !important; }
.tpl-card .scene::after, .exp-scene::after { content: ""; position: absolute; inset: 0; pointer-events: none; opacity: 0; transition: opacity .3s;
  background: radial-gradient(circle at var(--gx, 50%) var(--gy, 50%), rgba(255,255,255,.18), transparent 55%); }
.tpl-card.is-tilt .scene::after, .exp-scene.is-tilt::after { opacity: 1; }
.exp-scene { position: relative; }

/* рябь */
.btn, .chip, .type-btn, .tariff-opt, .tpl-opt, .lang-switch button { position: relative; overflow: hidden; }
.ripple { position: absolute; border-radius: 50%; background: radial-gradient(circle, rgba(255,255,255,.35), rgba(255,255,255,0) 60%); transform: scale(0); animation: ripple .65s ease-out forwards; pointer-events: none; }
@keyframes ripple { to { transform: scale(1); opacity: 0; } }

/* блик на кнопках */
.btn-primary::after, .btn-gold::after { content: ""; position: absolute; top: 0; bottom: 0; left: -60%; width: 40%; background: linear-gradient(100deg, transparent, rgba(255,255,255,.45), transparent); transform: skewX(-20deg); transition: left .6s ease; }
.btn-primary:hover::after, .btn-gold:hover::after { left: 130%; }

/* телефон парит, за ним пульсирует свечение */
.phone-stage .phone { animation: float 7s ease-in-out infinite; }
.phone-stage::before { animation: glow-pulse 6s ease-in-out infinite; }
@keyframes float { 0%, 100% { transform: translateY(0) rotate(-1deg); } 50% { transform: translateY(-10px) rotate(1deg); } }
@keyframes glow-pulse { 0%, 100% { opacity: .7; transform: scale(1); } 50% { opacity: 1; transform: scale(1.08); } }
.phone-stage .phone.is-tilt { animation: none; }

/* мягкое золотое мерцание заголовков-курсивов */
h1 em, .cta-grid h2 { background: linear-gradient(90deg, #EBD394 0%, #FFF3C4 25%, #D4B26A 50%, #FFF3C4 75%, #EBD394 100%); background-size: 200% auto; -webkit-background-clip: text; background-clip: text; -webkit-text-fill-color: transparent; animation: shine 6s linear infinite; }
@keyframes shine { to { background-position: 200% center; } }

/* логотип — золотая искра при наведении */
.logo:hover span:last-child { text-shadow: 0 0 18px rgba(212,178,106,.45); transition: text-shadow .4s; }

/* появление: чуть выразительнее */
.reveal { transform: translateY(22px) scale(.985); }
.reveal.in-view { transform: none; }

/* карточки-сцены: медленное «дыхание» изображений */
.tpl-card .scene img { animation: breathe 14s ease-in-out infinite; }
@keyframes breathe { 0%, 100% { transform: scale(1); } 50% { transform: scale(1.04); } }
.tpl-card:hover .scene img { animation-play-state: paused; }

/* ссылки в навигации — золотая линия выезжает */
.nav-links a::before { content: ""; position: absolute; left: 0; bottom: -2px; width: 100%; height: 1px; background: var(--gold); transform: scaleX(0); transform-origin: right; transition: transform .35s var(--ease); }
.nav-links a:hover::before { transform: scaleX(1); transform-origin: left; }

/* FAQ — плавное раскрытие */
.faq details .a { animation: faq-open .4s ease-out; }
@keyframes faq-open { from { opacity: 0; transform: translateY(-6px); } to { opacity: 1; transform: none; } }

@media (max-width: 900px) {
  .cursor-glow { display: none; }
  body::after { opacity: .05; }
}
@media (prefers-reduced-motion: reduce) {
  .ambient-dust, .cursor-glow { display: none; }
  body::after { animation: none; }
  .phone-stage .phone, .phone-stage::before, .tpl-card .scene img, h1 em, .cta-grid h2 { animation: none; }
  .reveal { transform: none; }
}