/* Choeur Ineffable - page Photos / videos : tabs Photos / Videos Instagram
   (reutilise les classes .ia-tabs/.ia-tab deja chargees par ineffable-agenda.css)
   + vignettes video a hauteur homogene (desktop/tablette, alignee sur la
   hauteur des vignettes de la galerie photo), coins arrondis a 8px comme le
   div .gallery-icon de la galerie photo, jamais de crop. Sur mobile : pleine largeur, hauteur naturelle (pas de
   calcul hauteur-fixe/largeur-auto en flex, plus sur Safari iOS).

   Recentrage de l'icone Play (widget video Elementor) : .elementor-wrapper
   est reduit a la largeur reelle de l'image (aspect-ratio + hauteur fixee),
   mais le widget .elementor-widget-video qui le contient est un enfant flex
   du conteneur grille et grossit par defaut (--container-widget-flex-grow)
   jusqu'a occuper toute la largeur disponible de sa ligne. C'est CE widget
   qui sert de repere de positionnement (position:relative + transform) pour
   l'icone Play absolue a 50%/50% : sans le bloquer a sa largeur de contenu,
   l'icone se centre sur une boite plus large que l'image visible, donc
   visuellement decalee vers la droite. */

.pv-panel { display: none !important; }
.pv-panel.pv-panel--active { display: flex !important; }

.pv-reel-thumb .elementor-wrapper {
  border-radius: 8px;
  overflow: hidden;
}

@media (min-width: 768px) {
  .pv-reel-thumb.elementor-widget-video {
    flex-grow: 0 !important;
    flex-shrink: 0 !important;
    flex-basis: auto !important;
    width: auto !important;
  }
  .pv-reel-thumb .elementor-wrapper {
    height: 250px;
    width: auto !important;
    max-width: 100%;
  }
}
@media (max-width: 767px) {
  .pv-reel-thumb.elementor-widget {
    width: 100% !important;
  }
  .pv-reel-thumb .elementor-wrapper {
    width: 100% !important;
    height: auto !important;
  }
}

/* Bandeau Instagram, au-dessus des onglets Photos / Videos Instagram.
   Scope .pv-ig-banner sur chaque selecteur : une classe seule perd contre
   .elementor-kit-8 h3 / .elementor-kit-8 a a specificite egale ou
   superieure (piege plateforme #19) ; deux classes (0,2,0) l'emporte sans
   avoir a mettre !important partout. */

.pv-ig-banner {
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 24px;
  flex-wrap: wrap;
  background: linear-gradient(115deg, #fffaf0, #FAF3E6 60%);
  border: 1px solid rgba(6, 35, 68, .12);
  border-radius: 14px;
  padding: 20px 24px;
  box-sizing: border-box;
}

.pv-ig-banner .pv-ig-banner__left {
  display: flex;
  align-items: center;
  gap: 16px;
  min-width: 0;
}

.pv-ig-banner .pv-ig-banner__ring {
  width: 40px;
  height: 40px;
  border-radius: 50%;
  padding: 2px;
  background: linear-gradient(140deg, #f6c453, #e8536b, #6E2A3C 75%);
  flex-shrink: 0;
  box-sizing: border-box;
}

.pv-ig-banner .pv-ig-banner__ring-inner {
  width: 100%;
  height: 100%;
  border-radius: 50%;
  background: #FAF3E6;
  display: flex;
  align-items: center;
  justify-content: center;
}

.pv-ig-banner .pv-ig-banner__ring-inner svg {
  width: 17px;
  height: 17px;
  display: block;
}

.pv-ig-banner .pv-ig-banner__text {
  min-width: 0;
}

.pv-ig-banner .pv-ig-banner__kicker {
  margin: 0 0 4px;
  font-size: .66rem;
  text-transform: uppercase;
  letter-spacing: .12em;
  color: #6E2A3C;
  font-weight: 600;
}

.pv-ig-banner .pv-ig-banner__title {
  margin: 0 0 4px;
  font-family: 'Bodoni Moda', 'Times New Roman', serif;
  font-size: 1.18rem;
  line-height: 1.28;
  font-weight: 500;
  color: #062344;
}

.pv-ig-banner .pv-ig-banner__desc {
  margin: 0;
  font-size: .85rem;
  line-height: 1.5;
  color: rgba(6, 35, 68, .68);
  max-width: 44ch;
}

.pv-ig-banner .pv-ig-banner__btn {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  background: #FDD296;
  color: #062344;
  text-decoration: none;
  font-size: .85rem;
  font-weight: 600;
  padding: 12px 22px;
  border-radius: 999px;
  white-space: nowrap;
  flex-shrink: 0;
  transition: background .15s ease, transform .15s ease;
}

.pv-ig-banner .pv-ig-banner__btn:hover,
.pv-ig-banner .pv-ig-banner__btn:focus-visible {
  background: #fcc677;
  transform: translateY(-1px);
}

.pv-ig-banner .pv-ig-banner__btn svg {
  width: 12px;
  height: 12px;
  transition: transform .15s ease;
}

.pv-ig-banner .pv-ig-banner__btn:hover svg {
  transform: translateX(2px);
}

@media (max-width: 640px) {
  .pv-ig-banner {
    flex-direction: column;
    align-items: flex-start;
    padding: 18px 20px;
  }
  .pv-ig-banner .pv-ig-banner__btn {
    width: 100%;
    justify-content: center;
  }
}

@media (prefers-reduced-motion: reduce) {
  .pv-ig-banner .pv-ig-banner__btn,
  .pv-ig-banner .pv-ig-banner__btn svg {
    transition: none;
  }
}