/* ============================================================
   Главная (index.php) — лёгкое осовременивание без смены структуры.
   Всё под body.home-v2: перебивает старые стили шаблона и инлайн-<style>
   в index.php, не трогая остальные страницы сайта.
   ============================================================ */
body.home-v2 { --hv-acc: #f4d242; --hv-ink: #141414; --hv-card: #17171c; --hv-line: rgba(255, 255, 255, .08); --hv-dim: #b4b4bb; }

/* ---------- Hero ---------- */
.home-v2 .video-hero::after {
  content: ''; position: absolute; left: 0; right: 0; bottom: 0; height: 40%; z-index: 2; pointer-events: none;
  background: linear-gradient(180deg, rgba(17, 17, 20, 0) 0%, rgba(17, 17, 20, .55) 60%, #111114 100%);
}
.home-v2 .video-hero-content { padding: 0 16px; text-align: center; }
.home-v2 .video-hero-content h1 {
  font-size: clamp(30px, 5.4vw, 70px) !important;
  line-height: 1.06 !important;
  letter-spacing: -0.005em;
  max-width: 1040px; margin: 0 auto 18px !important;
  text-wrap: balance;
}
.home-v2 .video-hero-content > div { font-size: inherit !important; margin-bottom: 30px !important; }
.home-v2 .video-hero-content h3 {
  margin: 0; font-size: clamp(13px, 1.5vw, 18px); font-weight: 600;
  letter-spacing: .32em; color: var(--hv-acc);
  text-shadow: 0 2px 12px rgba(0, 0, 0, .5);
}
.home-v2 .hero-actions { display: flex; flex-wrap: wrap; gap: 14px; justify-content: center; }
.home-v2 .hero-actions .quiz-cta-btn { margin: 0 !important; }
.home-v2 .hero-ghost, .home-v2 .hero-ghost:hover, .home-v2 .hero-ghost:focus {
  display: inline-flex; align-items: center; justify-content: center; min-height: 54px; padding: 14px 30px;
  border: 2px solid rgba(255, 255, 255, .55); border-radius: 999px; color: #fff !important;
  font-size: 14px; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; text-decoration: none !important;
  background: rgba(0, 0, 0, .18); -webkit-backdrop-filter: blur(6px); backdrop-filter: blur(6px);
  transition: border-color .2s, background .2s, transform .2s;
}
.home-v2 .hero-ghost:hover { border-color: #fff; background: rgba(255, 255, 255, .1); transform: translateY(-2px); }
@media (max-width: 520px) {
  .home-v2 .hero-actions { flex-direction: column; align-items: stretch; width: 100%; max-width: 340px; }
}

/* ---------- Кнопка «Узнать стоимость» (обе на странице) ---------- */
.home-v2 .quiz-cta-btn.quizOpenBtn {
  background: var(--hv-acc) !important; color: var(--hv-ink) !important; opacity: 1 !important; /* quiz.css гасит до .7 */
  border: 0 !important; border-radius: 999px !important;
  min-height: 54px; padding: 16px 34px !important;
  font-size: 14px !important; font-weight: 800 !important; letter-spacing: .06em; text-transform: uppercase;
  box-shadow: 0 14px 34px -12px rgba(244, 210, 66, .65);
  transition: transform .2s, box-shadow .2s, background .2s;
}
.home-v2 .quiz-cta-btn.quizOpenBtn:hover { background: #ffe066 !important; transform: translateY(-2px); box-shadow: 0 18px 40px -12px rgba(244, 210, 66, .8); }

/* ---------- Заголовки секций ---------- */
.home-v2 section.content-row > h2.text-center,
.home-v2 .portfolio-gallery > h2.text-center {
  font-size: clamp(24px, 3.1vw, 36px) !important; letter-spacing: .04em; text-transform: uppercase; margin-bottom: 40px !important;
}
.home-v2 section.content-row > h2.text-center::after,
.home-v2 .portfolio-gallery > h2.text-center::after {
  content: ''; display: block; width: 48px; height: 3px; margin: 16px auto 0; border-radius: 2px; background: var(--hv-acc);
}

/* ---------- «У нас всё своё» — карточки ---------- */
.home-v2 .home-pillars { margin-top: 24px; margin-bottom: 24px; }
.home-v2 .home-pillars > .row { display: flex; flex-wrap: wrap; row-gap: 18px; }
.home-v2 .home-pillars > .row > .clearfix { display: none !important; }
.home-v2 .home-pillars > .row > [class*="col-"] { position: relative; z-index: 0; float: none; padding: 28px 30px 30px; }
.home-v2 .home-pillars > .row > [class*="col-"]::before {
  content: ''; position: absolute; inset: 0 9px; z-index: -1;
  background: var(--hv-card); border: 1px solid var(--hv-line); border-radius: 18px;
  transition: border-color .25s, transform .25s, box-shadow .25s;
}
.home-v2 .home-pillars > .row > [class*="col-"]:hover::before {
  border-color: rgba(244, 210, 66, .35); transform: translateY(-3px); box-shadow: 0 20px 40px -24px rgba(0, 0, 0, .9);
}
.home-v2 .home-pillars .icon-float-left { float: none; width: auto; margin: 0 0 18px; }
.home-v2 .home-pillars .icon-circle {
  width: 60px; height: 60px; margin: 0 !important; border-radius: 16px; background: rgba(244, 210, 66, .1);
}
.home-v2 .home-pillars .icon-circle .icon { font-size: 32px; line-height: 60px; color: var(--hv-acc); }
.home-v2 .home-pillars [class*="col-"]:hover .icon-circle { background: var(--hv-acc); }
.home-v2 .home-pillars [class*="col-"]:hover .icon-circle .icon { color: var(--hv-ink); }
.home-v2 .home-pillars .text-float-right,
.home-v2 .home-pillars .text-float-right .inside { display: block; height: auto; padding: 0; }
.home-v2 .home-pillars h6 { margin: 0 0 10px; font-size: 14px; letter-spacing: .06em; line-height: 1.3; }
.home-v2 .home-pillars p { margin: 0; color: var(--hv-dim); font-size: 14px; line-height: 1.6; }
.home-v2 .home-pillars p a {
  display: inline-flex; align-items: center; gap: 6px; margin-top: 14px;
  color: #fff; font-weight: 700 !important; text-decoration: none; transition: color .2s, gap .2s;
}
.home-v2 .home-pillars p a::after { content: '→'; color: var(--hv-acc); }
.home-v2 .home-pillars p a:hover { color: var(--hv-acc); gap: 10px; }

/* ---------- «Наши работы» ---------- */
.home-v2 .portfolio-gallery { max-width: 1320px; margin: 72px auto 24px !important; padding: 0 20px; scroll-margin-top: 20px; }
.home-v2 .portfolio-videos-row { gap: 18px; }
.home-v2 .portfolio-video { flex: 1 1 340px; max-width: 420px; }
.home-v2 .video-preview {
  height: auto !important; min-height: 0 !important; aspect-ratio: 16 / 9;
  /* обложки YouTube 4:3 с чёрными полосами: растягиваем по ширине — полосы уходят за край */
  background-size: 100% auto !important; background-position: center !important;
  border-radius: 14px !important; box-shadow: 0 18px 40px -24px rgba(0, 0, 0, .9);
}
.home-v2 .video-preview:hover { transform: translateY(-3px); box-shadow: 0 26px 50px -24px rgba(0, 0, 0, 1); }
.home-v2 .video-overlay { background: linear-gradient(180deg, rgba(10, 10, 12, 0) 45%, rgba(10, 10, 12, .85) 100%); }
.home-v2 .video-meta { background: none; box-shadow: none; padding: 16px 18px 14px; }
.home-v2 .video-title { color: #fff; font-size: 15px; text-shadow: 0 1px 10px rgba(0, 0, 0, .6); }
.home-v2 .video-category { color: var(--hv-acc); opacity: 1; font-size: 12px; font-weight: 600; letter-spacing: .04em; margin-top: 3px; }
.home-v2 .play-icon {
  width: 58px; height: 58px; border-radius: 50%; display: flex; align-items: center; justify-content: center;
  background: rgba(244, 210, 66, .95); color: var(--hv-ink) !important; opacity: 1 !important;
  font-size: 20px !important; text-shadow: none !important; padding-left: 4px;
  box-shadow: 0 10px 30px rgba(0, 0, 0, .45); transition: transform .2s;
}
.home-v2 .video-preview:hover .play-icon { transform: translate(-50%, -50%) scale(1.1); }
@media (max-width: 767px) {
  .home-v2 .portfolio-gallery { padding: 0 14px; margin-top: 48px !important; }
  .home-v2 .portfolio-videos-row { gap: 14px; }
  .home-v2 .play-icon { width: 48px; height: 48px; font-size: 16px !important; }
}

/* ---------- Логотипы клиентов ---------- */
.home-v2 .clients-carousel .swiper-slide img { opacity: .7; transition: opacity .2s; }
.home-v2 .clients-carousel .swiper-slide img:hover { opacity: 1; }

@media (prefers-reduced-motion: reduce) {
  .home-v2 .home-pillars > .row > [class*="col-"]::before, .home-v2 .video-preview, .home-v2 .quiz-cta-btn.quizOpenBtn, .home-v2 .hero-ghost { transition: none; }
}