.embed-consent-card{
  position: relative;
  background: #0b0b0b;
  /*border-radius: 12px;*/
  overflow: hidden;
  /*aspect-ratio: 16/9;*/
  display: block;
}

.embed-consent-card.hero{
  width: 100%;
  height: 40vh;
  aspect-ratio: auto;
}
.embed-consent-card iframe{
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  border: 0;
}
.embed-consent-card .poster{
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  opacity: .85;
}
.embed-consent-card .overlay{
  position: absolute;
  inset: 0;
  display: grid;
  place-items: center;
  padding: 16px;
}
.embed-consent-card .overlay .inner{
  backdrop-filter: blur(4px);
  background: rgba(0,0,0,.42);
  padding: 12px 16px;
  /*border-radius: 12px;*/
  text-align: center;
  max-width: 640px;
  color: #fff;
  font: 400 15px/1.45 system-ui, -apple-system, Segoe UI, Roboto, Helvetica, Arial, sans-serif;
}
.embed-consent-card .btn-row{
  margin-top: 10px;
  display: inline-flex;
  gap: 10px;
  flex-wrap: wrap;
  justify-content: center;
}
.embed-consent-card .btn-row button{
  border: 0;
  border-radius: 999px;
  padding: 8px 14px;
  cursor: pointer;
}
.embed-consent-card .btn-row a{
  /*color: #fff;*/
  text-decoration: underline;
  border-radius: 999px;
  padding: 8px 14px;
}

/* Show overlay/poster on the hero when NOT loaded; hide once loaded */
.embed-consent-card.hero:not(.is-loaded) .overlay,
.embed-consent-card.hero:not(.is-loaded) .poster { display: block; }

.embed-consent-card.hero.is-loaded .overlay,
.embed-consent-card.hero.is-loaded .poster { display: none; }


/* Layering & clickability for consented embeds */
.embed-consent-card { position: relative; }
.embed-consent-card iframe { position: absolute; inset: 0; z-index: 1; }
.embed-consent-card .poster { 
  position: absolute; 
  inset: 0; z-index: 1;
   width: 100%; height: 100%; 
   object-fit: cover;
   }
.embed-consent-card .overlay { 
  position: absolute; 
  inset: 0; z-index: 2;
   display: grid; 
   place-items: center; 
   padding: 16px; 
  }

/* Block interactions until the video is actually loaded */
.embed-consent-card:not(.is-loaded) iframe { pointer-events: none; }
.embed-consent-card.is-loaded iframe { pointer-events: auto; }

/* When loaded, hide overlay/poster on all cards (hero rules below can override) */
.embed-consent-card.is-loaded .overlay,
.embed-consent-card.is-loaded .poster { display: none; }

/* You already have hero-specific visibility rules; keep them as is */
/* ---- Safari sizing/stacking hardening (added) ---- */
.embed-consent-card{ position: relative; width: 100%; overflow: hidden; }
.embed-consent-card .poster-wrap,
.embed-consent-card .poster,
.embed-consent-card iframe,
.embed-consent-card .overlay{ position:absolute; inset:0; width:100%; height:100%; }
.embed-consent-card iframe{ border:0; opacity:0; pointer-events:none; }
.embed-consent-card.is-loaded iframe{ opacity:1; pointer-events:auto; z-index:3; }
.embed-consent-card .overlay{ z-index:2; }
.embed-consent-card .poster-wrap,
.embed-consent-card .poster{ z-index:1; }
@supports not (aspect-ratio: 1 / 1){
  .embed-consent-card{ height:0; padding-top:56.25%; }
}
/* ----------------------------------------------- */