/* ==========================================================
   indexvideo2 — видеото като фон зад надписа в hero
   ========================================================== */

.hero--video{isolation:isolate}
.hero--video .hero-grid{position:relative;z-index:2;grid-template-columns:minmax(0,1fr)}
.hero--video .hero-grid > div{max-width:620px}
.hero--video .stylobate{z-index:2}

.hero-bg{position:absolute;inset:0;z-index:0;overflow:hidden;background:var(--graphite)}
.hero-bg video{
  position:absolute;top:0;right:0;height:100%;width:52%;
  object-fit:cover;object-position:50% 22%;
}
/* тъмен преход откъм текста — видеото „изплува“ отдясно */
.hero-bg::after{
  content:"";position:absolute;inset:0;pointer-events:none;
  background:
    linear-gradient(90deg,
      rgba(38,42,47,1) 0%, rgba(38,42,47,1) 44%,
      rgba(38,42,47,.78) 56%, rgba(38,42,47,.38) 72%, rgba(38,42,47,.22) 100%),
    linear-gradient(0deg, rgba(38,42,47,.55) 0%, rgba(38,42,47,0) 30%);
}

/* бутон „Гледайте видеото“ в реда с бутоните */
.btn-video{
  display:inline-flex;align-items:center;gap:10px;
  background:transparent;color:var(--stone);
  border:1px solid rgba(184,146,90,.65);cursor:pointer;font:inherit;
}
.btn-video svg{width:16px;height:16px;color:var(--brass)}
@media (hover:hover){.btn-video:hover{border-color:var(--brass);background:rgba(184,146,90,.1)}}

/* таблети */
@media (max-width:960px){
  .hero-bg video{width:60%}
}

/* телефон — видеото е фон на целия hero, текстът е долу */
@media (max-width:767px){
  .hero--video .hero-grid{min-height:calc(100svh - 64px);align-content:end;padding-top:48vh}
  .hero-bg video{width:100%;object-position:50% 18%}
  .hero-bg::after{
    background:linear-gradient(180deg,
      rgba(38,42,47,.10) 0%, rgba(38,42,47,.15) 30%,
      rgba(38,42,47,.80) 52%, rgba(38,42,47,.94) 68%, rgba(38,42,47,.97) 100%);
  }
  .btn-video{width:100%;justify-content:center}
}

@media print{
  .hero-bg{display:none}
}