/* Módulos 11–15: CTA intermedio, CTA de cierre, CTA de producto y banners promocionales.
   Estructura de la librería de componentes, con los tokens de Data Hosting.
   Los títulos van en <div>: no son encabezados del contenido. */

/* 11 · CTA intermedio */
.cta-inline{display:flex;gap:24px;align-items:center;margin:36px 0;padding:26px 30px;background:var(--surface);color:var(--c-morado-osc);border:1px solid var(--line);border-radius:var(--radius-lg);box-shadow:0 2px 6px rgba(var(--c-sombra),.04),0 12px 32px rgba(var(--c-sombra),.08)}
.cta-inline .ico{flex:none}
.cta-inline-txt{flex:1;min-width:0}
.cta-inline-title{font-size:1.2rem;font-weight:700;line-height:1.3;color:var(--c-morado-osc);margin:0 0 4px}
.cta-inline p{margin:0;color:var(--c-texto-2);font-size:.98rem;line-height:1.55}
.cta-inline .btn{flex:none}

/* 12 · CTA de cierre (degradado navy → naranja oscuro: texto blanco legible en todo el recorrido) */
.cta-close{margin:44px 0;padding:44px 40px;border-radius:var(--radius-lg);background:linear-gradient(135deg,var(--c-morado-osc) 0%,var(--c-morado) 55%,var(--c-naranja-fin) 100%);color:#fff;text-align:center;display:flex;flex-direction:column;align-items:center;gap:14px}
.cta-close .ico{background:rgba(255,255,255,.12);color:var(--c-naranja-claro)}
.cta-close-title{font-size:clamp(1.4rem,2.6vw,1.75rem);font-weight:800;letter-spacing:-.02em;line-height:1.2;color:#fff;max-width:28ch}
.cta-close p{margin:0;color:rgba(255,255,255,.92);font-size:1.05rem;line-height:1.55;max-width:52ch}
.cta-close .btn{margin-top:6px}

/* 13 · CTA de producto (foto + texto) */
.cta-card{display:grid;grid-template-columns:1fr 1.15fr;margin:40px 0;background:var(--surface);color:var(--c-morado-osc);border:1px solid var(--line);border-radius:var(--radius-lg);overflow:hidden;box-shadow:0 2px 6px rgba(var(--c-sombra),.04),0 12px 32px rgba(var(--c-sombra),.08)}
.cta-card-foto{min-height:240px;overflow:hidden}
.cta-card-foto img{width:100%;height:100%;object-fit:cover}
.cta-card-copy{padding:36px;display:flex;flex-direction:column;gap:12px;justify-content:center;align-items:flex-start}
.cta-card-marca{display:flex;flex-direction:column;gap:8px;align-items:flex-start;font-size:.95rem;font-weight:600;color:var(--c-naranja-texto)}
.cta-card-title{font-size:1.5rem;font-weight:800;letter-spacing:-.02em;line-height:1.2;color:var(--c-morado-osc)}
.cta-card p{margin:0;color:var(--c-texto-2);font-size:1rem;line-height:1.55}
.cta-card .btn{margin-top:4px}

/* 14 y 15 · Banners promocionales */
.bnr{position:relative;margin:40px 0;border-radius:var(--radius-lg);overflow:hidden;background:var(--c-morado-osc);color:#fff}
.bnr-bg{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.bnr-panel{position:relative;display:flex;flex-direction:column;justify-content:center;gap:12px}
.bnr-title{font-weight:800;line-height:1.15;letter-spacing:-.02em;color:#fff}
.bnr-text{margin:0;color:rgba(255,255,255,.94);line-height:1.5}
.bnr .bnr-cta{align-self:flex-start}
.bnr-navy .bnr-panel{background:var(--c-morado-osc)}
.bnr-degradado .bnr-panel{background:linear-gradient(120deg,var(--c-morado-osc) 0%,var(--c-morado) 55%,var(--c-naranja-fin) 100%)}
.bnr-naranja .bnr-panel{background:linear-gradient(120deg,var(--c-naranja-fin) 0%,var(--c-oferta-texto) 100%)}
/* Horizontal: panel de texto a la izquierda, imagen a la derecha */
.bnr-h{aspect-ratio:1000/360}
.bnr-h .bnr-bg{left:auto;right:0;width:56%}
.bnr-h .bnr-panel{width:50%;height:100%;padding:36px 40px}
.bnr-h .bnr-title{font-size:clamp(1.25rem,2.4vw,1.7rem)}
.bnr-h .bnr-text{font-size:clamp(.95rem,1.6vw,1.05rem)}
/* Vertical: imagen completa con el panel abajo */
.bnr-v{width:100%;max-width:360px;aspect-ratio:360/440}
.bnr-v .bnr-panel{position:absolute;left:0;right:0;bottom:0;padding:22px 24px 24px;border-radius:var(--radius-lg) var(--radius-lg) 0 0}
.bnr-v.bnr-navy .bnr-panel{background:rgba(var(--c-sombra),.94)}
.bnr-v.bnr-degradado .bnr-panel{background:linear-gradient(160deg,rgba(var(--c-sombra),.94) 0%,rgba(58,45,140,.94) 55%,rgba(196,70,31,.96) 100%)}
.bnr-v.bnr-naranja .bnr-panel{background:rgba(154,52,18,.95)}
.bnr-v .bnr-title{font-size:1.3rem}
.bnr-v .bnr-text{font-size:.95rem}
.bnr-centro{margin-left:auto;margin-right:auto}
/* Widget de Elementor: sección con aire arriba y abajo */
.banner-sec{padding:48px 0}
.banner-sec .bnr,.banner-sec .cta-card{margin:0}
/* Dentro de una entrada, el vertical flota junto al texto */
.post-body > .bnr-derecha{float:right;width:300px;margin:6px 0 24px 32px}
.post-body > :where(h2,h3){clear:both}

@media (max-width:900px){
  .post-body > .bnr-derecha{float:none;width:100%;max-width:none;margin:32px 0}
  .bnr-v{max-width:none;aspect-ratio:4/5}
}
@media (max-width:720px){
  .cta-inline{flex-direction:column;align-items:flex-start;padding:24px 22px}
  .cta-close{padding:34px 22px}
  .cta-card{grid-template-columns:1fr}
  .cta-card-foto{min-height:180px;max-height:220px}
  .cta-card-copy{padding:26px 22px}
  .bnr-h{aspect-ratio:auto;display:flex;flex-direction:column}
  .bnr-h .bnr-bg{position:relative;width:100%;height:180px;right:auto}
  .bnr-h .bnr-panel{width:100%;padding:24px 22px}
}