/* ==========================================================================
   ENTRETENIMIENTO TOLIMA · Publicidad pública v12.12
   Replica el estilo aprobado: blanco premium + azul/magenta/naranja.
   Este archivo se carga DESPUÉS de los estilos históricos.
   ========================================================================== */

:root{
  --etad12-blue:#062B8F;
  --etad12-blue-dark:#03185F;
  --etad12-blue-light:#1684F8;
  --etad12-magenta:#F0147A;
  --etad12-orange:#F6A30A;
  --etad12-yellow:#FFC126;
  --etad12-ink:#071B49;
  --etad12-muted:#61708B;
}

.et-ad-slot--placeholder{
  position:relative !important;
  isolation:isolate;
  width:100% !important;
  min-height:0 !important;
  padding:0 !important;
  margin:18px auto !important;
  border:0 !important;
  border-radius:24px !important;
  overflow:hidden !important;
  background:#fff !important;
  box-shadow:0 18px 46px rgba(3,24,95,.10) !important;
}

.et-ad-slot--placeholder::before{
  content:"";
  position:absolute;
  inset:0;
  z-index:-2;
  background:
    radial-gradient(420px 250px at 6% 100%,rgba(255,193,38,.24),transparent 62%),
    radial-gradient(380px 250px at 16% 85%,rgba(240,20,122,.18),transparent 60%),
    radial-gradient(430px 260px at 93% 4%,rgba(22,132,248,.18),transparent 62%),
    linear-gradient(135deg,#FFF9FE 0%,#F8FBFF 50%,#FFF9EA 100%);
}

.et-ad-slot--placeholder::after{
  content:"";
  position:absolute;
  right:-90px;
  bottom:-110px;
  width:410px;
  height:220px;
  z-index:-1;
  border-radius:50%;
  background:
    radial-gradient(ellipse at 50% 52%,transparent 0 48%,#F6A30A 49% 57%,transparent 58%),
    radial-gradient(ellipse at 50% 44%,transparent 0 60%,#F0147A 61% 69%,transparent 70%),
    radial-gradient(ellipse at 50% 36%,transparent 0 72%,#0B63DC 73% 82%,transparent 83%);
  transform:rotate(-10deg);
  opacity:.95;
}

.et-ad-placeholder-card{
  position:relative;
  min-height:240px;
  display:grid;
  grid-template-columns:minmax(0,1.15fr) minmax(260px,.55fr);
  grid-template-areas:
    "eyebrow visual"
    "copy visual"
    "specs visual"
    "code visual";
  align-items:center;
  gap:12px 30px;
  padding:30px 44px !important;
  text-align:left !important;
  background:transparent !important;
}

.et-ad-placeholder-eyebrow{
  grid-area:eyebrow;
  justify-self:start;
  display:inline-flex;
  align-items:center;
  min-height:30px;
  padding:0 16px;
  border-radius:999px;
  color:var(--etad12-magenta);
  background:#FFF0F8;
  font:850 .70rem/1 Arial,sans-serif;
  letter-spacing:.10em;
}

.et-ad-placeholder-copy{grid-area:copy}
.et-ad-placeholder-copy strong{
  display:block;
  color:var(--etad12-blue-dark) !important;
  font-family:Georgia,"Times New Roman",serif;
  font-size:clamp(1.55rem,2.25vw,2.45rem) !important;
  line-height:1.03 !important;
  letter-spacing:-.025em;
}
.et-ad-placeholder-copy strong em{
  color:var(--etad12-magenta);
  font-style:normal;
}
.et-ad-placeholder-copy p{
  max-width:720px !important;
  margin:10px 0 0 !important;
  color:var(--etad12-muted) !important;
  font-size:.92rem !important;
  line-height:1.5 !important;
}

.et-ad-placeholder-visual{
  grid-area:visual;
  align-self:stretch;
  display:grid;
  place-items:center;
  min-height:200px;
}
.et-ad-placeholder-visual::before{
  content:"";
  position:absolute;
  width:210px;
  height:210px;
  border-radius:50%;
  background:linear-gradient(145deg,#EAF3FF,#FFF4F9 58%,#FFF2C9);
  box-shadow:0 20px 44px rgba(6,43,143,.10);
}
.et-ad-placeholder-hero-svg{
  position:relative;
  z-index:2;
  width:180px;
  height:180px;
  fill:none;
  stroke:var(--etad12-magenta);
  stroke-width:7;
  stroke-linecap:round;
  stroke-linejoin:round;
  filter:drop-shadow(0 12px 16px rgba(6,43,143,.12));
}
.et-ad-slot--home-duo-right .et-ad-placeholder-hero-svg{
  stroke:var(--etad12-blue-light);
}

.et-ad-placeholder-specs{
  grid-area:specs;
  display:grid !important;
  grid-template-columns:repeat(3,minmax(0,1fr)) !important;
  gap:10px !important;
  width:100% !important;
}
.et-ad-placeholder-specs span{
  min-width:0;
  display:grid !important;
  grid-template-columns:34px minmax(0,1fr);
  grid-template-areas:"icon title" "icon value";
  align-items:center;
  gap:2px 10px !important;
  padding:12px 14px !important;
  border:1px solid rgba(6,43,143,.10) !important;
  border-radius:14px !important;
  background:rgba(255,255,255,.92) !important;
  box-shadow:0 8px 20px rgba(3,24,95,.055) !important;
}
.et-ad-placeholder-specs i{
  grid-area:icon;
  width:34px;height:34px;display:grid;place-items:center;border-radius:50%;
  color:#fff;font-style:normal;font-size:1.15rem;font-weight:900
}
.et-ad-placeholder-specs .is-desktop i{background:linear-gradient(135deg,#1684F8,#0B56D1)}
.et-ad-placeholder-specs .is-mobile i{background:linear-gradient(135deg,#FF3D96,#F0147A)}
.et-ad-placeholder-specs .is-format i{background:linear-gradient(135deg,#FFC126,#F6A30A)}
.et-ad-placeholder-specs b{
  grid-area:title;
  color:var(--etad12-blue-dark) !important;
  font:850 .67rem/1.1 Arial,sans-serif !important;
  letter-spacing:.04em !important;
  text-transform:none !important;
}
.et-ad-placeholder-specs small{
  grid-area:value;
  color:#51617B;
  font-size:.78rem;
  line-height:1.25
}

.et-ad-placeholder-code{
  grid-area:code;
  display:flex;
  align-items:center;
  gap:8px;
  color:#79879B;
  font:500 .70rem/1.2 Arial,sans-serif
}
.et-ad-placeholder-code strong{color:var(--etad12-blue-dark);font-size:.74rem}

/* single horizontal placements */
.et-ad-slot--home-top.et-ad-slot--placeholder,
.et-ad-slot--home-middle.et-ad-slot--placeholder,
.et-ad-slot--home-before-footer.et-ad-slot--placeholder,
.et-ad-slot--category-top.et-ad-slot--placeholder,
.et-ad-slot--category-middle.et-ad-slot--placeholder,
.et-ad-slot--article-top.et-ad-slot--placeholder,
.et-ad-slot--article-bottom.et-ad-slot--placeholder{
  max-width:1180px !important;
}

/* ==============================================================
   BLOQUE DOBLE — replica el render azul con dos tarjetas claras.
   ============================================================== */
.et-home-ad-duo{
  position:relative !important;
  overflow:hidden !important;
  width:min(100%,1500px) !important;
  margin:48px auto !important;
  padding:32px !important;
  border:0 !important;
  border-radius:28px !important;
  background:
    radial-gradient(600px 300px at 95% 0,rgba(22,132,248,.28),transparent 62%),
    linear-gradient(135deg,#062B8F,#0B50C2 58%,#03185F) !important;
  box-shadow:0 24px 60px rgba(3,24,95,.20) !important;
}

.et-home-ad-duo::before{
  content:"";
  position:absolute;
  right:-130px;
  top:-125px;
  width:450px;
  height:260px;
  border-radius:50%;
  background:
    radial-gradient(ellipse at 50% 50%,transparent 0 48%,#FFC126 49% 58%,transparent 59%),
    radial-gradient(ellipse at 50% 42%,transparent 0 61%,#F0147A 62% 70%,transparent 71%),
    radial-gradient(ellipse at 50% 34%,transparent 0 74%,#1684F8 75% 84%,transparent 85%);
  transform:rotate(8deg);
  opacity:.95;
}

.et-home-ad-duo-head{
  position:relative;
  z-index:2;
  align-items:flex-end !important;
  margin-bottom:24px !important;
}
.et-home-ad-duo-kicker{
  color:#fff !important;
  background:var(--etad12-magenta);
  min-height:29px;
  padding:0 14px;
  border-radius:999px;
  display:inline-flex !important;
  width:max-content;
}
.et-home-ad-duo-kicker::before{display:none !important}
.et-home-ad-duo h2{
  color:#fff !important;
  font-family:Arial,sans-serif !important;
  font-size:clamp(2rem,3vw,3.6rem) !important;
  font-weight:900 !important;
  letter-spacing:-.04em !important;
}
.et-home-ad-duo-note{
  max-width:430px !important;
  color:#E7EEFF !important;
  font-size:.84rem !important;
}

.et-home-ad-duo-grid{
  position:relative;
  z-index:2;
  gap:20px !important;
}

.et-home-ad-duo-card{
  overflow:visible !important;
  border:0 !important;
  border-radius:24px !important;
  background:transparent !important;
}

.et-home-ad-duo-card .et-home-ad-mount{
  margin:0 !important;
}

.et-home-ad-duo-card .et-ad-slot--placeholder{
  height:100%;
  margin:0 !important;
  border-radius:24px !important;
  box-shadow:0 20px 46px rgba(0,0,0,.16) !important;
}

.et-home-ad-duo-card .et-ad-placeholder-card{
  min-height:540px;
  grid-template-columns:minmax(0,1fr) 210px;
  grid-template-areas:
    "eyebrow visual"
    "copy visual"
    "specs specs"
    "code code";
  align-content:center;
  padding:30px !important;
}

.et-home-ad-duo-card .et-ad-placeholder-visual{
  min-height:190px;
}
.et-home-ad-duo-card .et-ad-placeholder-visual::before{
  width:190px;height:190px
}
.et-home-ad-duo-card .et-ad-placeholder-hero-svg{
  width:162px;height:162px
}
.et-home-ad-duo-card .et-ad-placeholder-copy strong{
  font-family:Arial,sans-serif !important;
  font-size:clamp(1.7rem,2.4vw,2.5rem) !important;
  font-weight:900 !important;
}
.et-home-ad-duo-card .et-ad-placeholder-copy p{
  font-size:.88rem !important
}
.et-home-ad-duo-card .et-ad-placeholder-code{
  margin-top:6px;
  padding:12px 14px;
  border-radius:14px;
  background:rgba(255,255,255,.72)
}

/* real creatives inside duo keep proportions */
.et-home-ad-duo-card .et-ad-link{
  min-height:0 !important;
  aspect-ratio:auto !important;
  background:#fff !important;
}
.et-home-ad-duo-card .et-ad-link img{
  height:auto !important;
  max-height:520px !important;
  object-fit:contain !important;
}

/* sidebar placeholders stay tall but compact */
.et-ad-slot--home-sidebar-top.et-ad-slot--placeholder .et-ad-placeholder-card,
.et-ad-slot--category-sidebar.et-ad-slot--placeholder .et-ad-placeholder-card,
.et-ad-slot--article-sidebar.et-ad-slot--placeholder .et-ad-placeholder-card{
  grid-template-columns:1fr;
  grid-template-areas:"eyebrow" "visual" "copy" "specs" "code";
  text-align:center !important;
}
.et-ad-slot--home-sidebar-top.et-ad-slot--placeholder .et-ad-placeholder-eyebrow,
.et-ad-slot--category-sidebar.et-ad-slot--placeholder .et-ad-placeholder-eyebrow,
.et-ad-slot--article-sidebar.et-ad-slot--placeholder .et-ad-placeholder-eyebrow{
  justify-self:center
}
.et-ad-slot--home-sidebar-top.et-ad-slot--placeholder .et-ad-placeholder-specs,
.et-ad-slot--category-sidebar.et-ad-slot--placeholder .et-ad-placeholder-specs,
.et-ad-slot--article-sidebar.et-ad-slot--placeholder .et-ad-placeholder-specs{
  grid-template-columns:1fr !important
}

@media(max-width:980px){
  .et-ad-placeholder-card{
    grid-template-columns:1fr;
    grid-template-areas:"eyebrow" "visual" "copy" "specs" "code";
    text-align:center !important;
    padding:28px !important;
  }
  .et-ad-placeholder-eyebrow{justify-self:center}
  .et-ad-placeholder-copy p{margin-inline:auto !important}
  .et-ad-placeholder-code{justify-content:center}
  .et-home-ad-duo{padding:24px !important}
  .et-home-ad-duo-grid{grid-template-columns:1fr !important}
  .et-home-ad-duo-card .et-ad-placeholder-card{min-height:440px}
}

@media(max-width:650px){
  .et-ad-slot--placeholder{border-radius:18px !important}
  .et-ad-placeholder-card{padding:22px 16px !important;gap:10px}
  .et-ad-placeholder-visual{min-height:150px}
  .et-ad-placeholder-visual::before{width:150px;height:150px}
  .et-ad-placeholder-hero-svg{width:128px;height:128px}
  .et-ad-placeholder-copy strong{font-size:1.45rem !important}
  .et-ad-placeholder-copy p{font-size:.82rem !important}
  .et-ad-placeholder-specs{grid-template-columns:1fr !important}
  .et-home-ad-duo{margin:32px auto !important;padding:16px !important;border-radius:20px !important}
  .et-home-ad-duo-card .et-ad-placeholder-card{min-height:0;grid-template-columns:1fr;grid-template-areas:"eyebrow" "visual" "copy" "specs" "code"}
}