/* =============================================================================
   Kloop Screens · anuncios de ejemplo dentro de las pantallas (portada y Screens)
   Todo en unidades cqw: el contenedor (.tv o .m-tv) declara container-type:inline-size,
   así un anuncio se ve igual en la pantalla grande y en la miniatura de la portada.
   Negocios y anunciantes inventados; fotos generadas para Kloop.
   ============================================================================= */
.ad{position:absolute;inset:0;overflow:hidden;color:#fff;font-family:var(--disp);padding:0!important;display:block!important}
.ad-img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block}
.ad-scrim{position:absolute;inset:0}
.ad-c{position:absolute;inset:0;padding:5.4cqw 6cqw 6.6cqw}
.ad-brand{position:absolute;left:6cqw;top:5.4cqw;display:flex;align-items:center;gap:1.4cqw;font-weight:800;font-size:2.7cqw;letter-spacing:-.01em;line-height:1}
.ad-brand small{display:block;font-family:var(--mono);font-weight:500;font-size:1.45cqw;letter-spacing:.18em;text-transform:uppercase;opacity:.8;margin-top:.6cqw}
.ad-mark{display:grid;place-items:center;width:5cqw;height:5cqw;flex:none;border-radius:1.3cqw;font-style:normal;font-size:2cqw;font-weight:800;letter-spacing:-.02em}
.ad-kick{display:inline-block;font-family:var(--mono);font-weight:500;font-size:1.8cqw;letter-spacing:.16em;text-transform:uppercase;padding:.8cqw 1.4cqw;border-radius:99px}
.ad-h{display:block;font-weight:800;line-height:.9;letter-spacing:-.04em}
.ad-sub{display:block;font-family:var(--sans);font-weight:500;line-height:1.3}
.ad-tag{position:absolute;left:6cqw;bottom:2.6cqw;font-family:var(--mono);font-size:1.3cqw;letter-spacing:.2em;text-transform:uppercase;opacity:.6}

/* 1 · Casa Martín · menú del día (promo del propio local) */
.ad-menu .ad-img{object-position:50% 60%}
.ad-menu .ad-scrim{background:linear-gradient(0deg,rgba(18,8,2,.92) 0%,rgba(18,8,2,.55) 38%,rgba(18,8,2,0) 62%),linear-gradient(180deg,rgba(18,8,2,.55) 0%,rgba(18,8,2,0) 26%)}
.ad-menu .ad-brand{font-family:Georgia,"Times New Roman",serif;font-style:italic;font-weight:700;font-size:3.4cqw;letter-spacing:0}
.ad-menu .ad-main{position:absolute;left:6cqw;bottom:6.6cqw;max-width:62%}
.ad-menu .ad-kick{background:#E8952A;color:#1e1002}
.ad-menu .ad-h{margin-top:1.6cqw;font-size:9.6cqw}
.ad-menu .ad-sub{margin-top:1.3cqw;font-size:2.4cqw;opacity:.88}
.ad-price{position:absolute;right:6cqw;bottom:6.6cqw;width:17cqw;height:17cqw;border-radius:50%;background:#E8952A;color:#1e1002;display:grid;place-content:center;text-align:center;transform:rotate(-8deg);
  box-shadow:0 1.6cqw 4cqw -1cqw rgba(0,0,0,.6)}
.ad-price small{display:block;font-family:var(--mono);font-size:1.5cqw;letter-spacing:.14em;text-transform:uppercase}
.ad-price b{display:block;font-weight:800;font-size:5cqw;letter-spacing:-.04em;line-height:1}

/* 2 · Clínica Vitalis · fisioterapia (anunciante local) */
.ad-physio .ad-img{width:62%;object-position:50% 40%}
.ad-physio .ad-panel{position:absolute;top:0;right:0;bottom:0;width:42%;background:#0f5f59;padding:9.4cqw 4.6cqw 6cqw 5cqw;display:flex;flex-direction:column}
.ad-physio .ad-panel::before{content:"";position:absolute;left:-3.4cqw;top:0;bottom:0;width:3.6cqw;background:linear-gradient(90deg,rgba(15,95,89,0),#0f5f59)}
.ad-physio .ad-brand{position:static}
.ad-physio .ad-mark{background:#d9f3ee;color:#0f5f59}
.ad-physio .ad-h{margin-top:auto;font-size:5.6cqw}
.ad-physio .ad-sub{margin-top:1.2cqw;font-size:2.2cqw;color:#d9f3ee}
.ad-physio .ad-cta{display:flex;align-items:center;gap:1.8cqw;margin-top:2.6cqw}
.ad-physio .ad-cta img{width:9.6cqw;height:9.6cqw;border-radius:1cqw;flex:none}
.ad-physio .ad-cta span{font-family:var(--mono);font-size:1.55cqw;letter-spacing:.12em;text-transform:uppercase;line-height:1.5;color:#d9f3ee}
.ad-physio .ad-cta b{display:block;font-family:var(--disp);font-size:2.3cqw;letter-spacing:-.01em;text-transform:none;color:#fff}
.ad-physio .ad-tag{left:auto;right:4.6cqw;color:#d9f3ee}

/* 3 · DriveÁgil · autoescuela (anunciante local) */
.ad-drive .ad-img{object-position:50% 40%}
.ad-drive .ad-scrim{background:linear-gradient(0deg,rgba(10,10,8,.78) 0%,rgba(10,10,8,0) 48%)}
.ad-drive .ad-brand{background:#FFD23F;color:#141414;padding:1cqw 1.6cqw;border-radius:1cqw}
.ad-drive .ad-mark{width:3.6cqw;height:3.6cqw;border-radius:.8cqw;background:#141414;color:#FFD23F;font-size:2.2cqw}
.ad-drive .ad-block{position:absolute;left:6cqw;bottom:6.6cqw;background:#FFD23F;color:#141414;padding:2.6cqw 3.2cqw 2.8cqw;border-radius:1.6cqw;max-width:56%;box-shadow:0 1.6cqw 4cqw -1.4cqw rgba(0,0,0,.7)}
.ad-drive .ad-h{font-size:6.4cqw}
.ad-drive .ad-sub{margin-top:1cqw;font-size:2.2cqw;color:#3a3a2c}
.ad-drive .ad-sticker{position:absolute;right:6cqw;bottom:8cqw;width:18cqw;padding:2cqw;border-radius:50%;aspect-ratio:1;background:#16a34a;color:#fff;display:grid;place-content:center;text-align:center;transform:rotate(9deg);
  font-weight:800;font-size:2.6cqw;line-height:1.05;letter-spacing:-.02em;box-shadow:0 1.6cqw 4cqw -1cqw rgba(0,0,0,.6)}
.ad-drive .ad-sticker small{display:block;font-family:var(--mono);font-weight:500;font-size:1.4cqw;letter-spacing:.14em;text-transform:uppercase;margin-bottom:.6cqw}

/* 4 · Casa Martín · música en directo (promo del propio local) */
.ad-music .ad-img{object-position:60% 50%}
.ad-music .ad-scrim{background:linear-gradient(90deg,rgba(14,6,20,.92) 0%,rgba(14,6,20,.7) 36%,rgba(14,6,20,0) 66%)}
.ad-music .ad-brand{font-family:Georgia,"Times New Roman",serif;font-style:italic;font-weight:700;font-size:3.4cqw;letter-spacing:0}
.ad-music .ad-main{position:absolute;left:6cqw;bottom:6.6cqw;max-width:52%}
.ad-music .ad-kick{background:rgba(255,255,255,.14);color:#f5d0fe;border:1px solid rgba(245,208,254,.35)}
.ad-music .ad-h{margin-top:1.6cqw;font-size:7.6cqw}
.ad-music .ad-sub{margin-top:1.4cqw;font-size:2.3cqw;opacity:.9}
.ad-music .ad-pill{display:inline-flex;align-items:center;gap:1cqw;margin-top:2.2cqw;padding:1cqw 1.8cqw;border-radius:99px;background:#25b864;color:#04140a;font-weight:800;font-size:2.2cqw}
.ad-music .ad-pill::before{content:"";width:1.4cqw;height:1.4cqw;border-radius:50%;background:#04140a}

/* 5 · tu anuncio (Panadería Flor de Sal por defecto) · tres colores */
.ad-yours .ad-img{object-position:40% 50%}
.ad-yours .ad-scrim{background:linear-gradient(0deg,rgba(20,10,2,.9) 0%,rgba(20,10,2,.5) 40%,rgba(20,10,2,0) 66%)}
.ad-yours .ad-main{position:absolute;left:6cqw;right:6cqw;bottom:6.6cqw}
.ad-yours .ad-kick{background:var(--yk,#E8952A);color:var(--yk-ink,#1e1002)}
.ad-yours .ad-h{margin-top:1.6cqw;font-size:7cqw;max-width:80%}
.ad-yours .ad-sub{margin-top:1.3cqw;font-size:2.4cqw;opacity:.9}
.ad-yours .ad-mark{background:var(--yk,#E8952A);color:var(--yk-ink,#1e1002)}
.ad-yours.a2{--yk:#E8952A;--yk-ink:#1e1002}
.ad-yours.v{--yk:#4FA3F7;--yk-ink:#04121f}
.ad-yours.v .ad-scrim{background:linear-gradient(0deg,rgba(4,14,30,.92) 0%,rgba(4,14,30,.5) 40%,rgba(4,14,30,0) 66%)}
.ad-yours.a1{--yk:#0E1726;--yk-ink:#fff;color:#0E1726}
.ad-yours.a1 .ad-scrim{background:linear-gradient(0deg,rgba(250,246,238,.96) 0%,rgba(250,246,238,.7) 40%,rgba(250,246,238,0) 68%)}
.ad-yours.a1 .ad-brand{color:#fff;text-shadow:0 .3cqw 1.2cqw rgba(0,0,0,.45)}
/* las marcas sobre foto se leen siempre */
.ad-menu .ad-brand,.ad-music .ad-brand,.ad-yours .ad-brand,.ad-menu .ad-sub,.ad-music .ad-sub,.ad-yours .ad-sub{text-shadow:0 .3cqw 1.4cqw rgba(0,0,0,.55)}
.ad-yours.a1 .ad-sub{text-shadow:none}