/* ----------------------------------------------------------------------------
   CCOO Asturias · Plantillas de texto (diseño marketing) para 16:9.
   Unidades de *container query* (cqmin) para escalar igual a pantalla completa
   (cliente) y en la previsualización (servidor). El contenedor declara
   `container-type: size` (.slide en el cliente, .tpl-frame en el servidor).
   El PNG del logo viene recortado a su contenido (sin márgenes).
---------------------------------------------------------------------------- */
.tpl {
  width: 100%; height: 100%;
  display: flex; overflow: hidden; position: relative;
  font-family: "Helvetica Neue", Arial, "Segoe UI", sans-serif;
}
.tpl h1 { line-height: 1.03; font-weight: 800; letter-spacing: -0.02em; margin: 0; }
.tpl p { margin: 0 0 0.55em; }
.tpl p:last-child { margin-bottom: 0; }

/* Tarjeta de logo reutilizable (para fondos de color) */
.tpl-logo {
  background: #fff; border-radius: 1.6cqmin; padding: 1.5cqmin 2.1cqmin;
  box-shadow: 0 1cqmin 3cqmin rgba(0,0,0,.12); display: inline-flex;
}
.tpl-logo img { height: 5cqmin; display: block; }

/* ===========================================================================
   AVISO — editorial limpio, blanco con sistema de acento rojo
=========================================================================== */
.tpl-aviso { flex-direction: column; background: #fff; color: #181818; }
.tpl-aviso__edge { position: absolute; top: 0; bottom: 0; left: 0; width: 2cqmin; background: #e2231a; }
.tpl-aviso__body {
  flex: 1; display: flex; flex-direction: column; justify-content: center;
  gap: 3.4cqmin; padding: 8cqmin 9cqmin 4cqmin 11cqmin;
}
.tpl-aviso__tag {
  align-self: flex-start; background: #e2231a; color: #fff;
  font-weight: 800; font-size: 2.3cqmin; letter-spacing: 0.26em; text-transform: uppercase;
  padding: 1.2cqmin 2.6cqmin; border-radius: 1cqmin;
}
.tpl-aviso h1 { font-size: 8.6cqmin; max-width: 94%; }
.tpl-aviso__text { font-size: 3.6cqmin; line-height: 1.45; color: #4a4a4a; max-width: 88%; }
.tpl-aviso__foot {
  display: flex; align-items: center; justify-content: space-between; gap: 4cqmin;
  border-top: 0.3cqmin solid #ededed; margin: 0 9cqmin 0 11cqmin; padding: 3.6cqmin 0;
}
.tpl-aviso__foot img { height: 5cqmin; display: block; }
.tpl-aviso__foot .tpl-foot-text { color: #e2231a; font-weight: 700; font-size: 2.8cqmin; text-align: right; }

/* ===========================================================================
   COMUNICADO — dos columnas, panel rojo con comilla decorativa
=========================================================================== */
.tpl-comunicado { background: #fff; color: #181818; }
.tpl-comunicado__side {
  width: 38%; background: linear-gradient(155deg, #ef3b32 0%, #e2231a 45%, #b51b14 100%);
  color: #fff; display: flex; flex-direction: column; justify-content: space-between;
  align-items: flex-start; padding: 6.5cqmin 5cqmin; position: relative; overflow: hidden;
}
.tpl-comunicado__side .tpl-logo img { height: 5.6cqmin; }
.tpl-comunicado__quote {
  position: absolute; right: 1cqmin; bottom: -10cqmin;
  font-family: Georgia, "Times New Roman", serif; font-size: 52cqmin; line-height: 1;
  color: rgba(255,255,255,.13);
}
.tpl-comunicado__label {
  position: relative; z-index: 1; font-weight: 800; font-size: 3.6cqmin;
  letter-spacing: 0.14em; text-transform: uppercase;
}
.tpl-comunicado__label::before {
  content: ""; display: block; width: 8cqmin; height: 0.7cqmin; background: #fff;
  border-radius: 1cqmin; margin-bottom: 2.4cqmin; opacity: .9;
}
.tpl-comunicado__main {
  flex: 1; display: flex; flex-direction: column; justify-content: center;
  padding: 7cqmin 7cqmin; gap: 3.6cqmin;
}
.tpl-comunicado__main h1 { font-size: 6.6cqmin; color: #181818; }
.tpl-comunicado__main h1::before {
  content: ""; display: block; width: 9cqmin; height: 0.8cqmin; background: #e2231a;
  border-radius: 1cqmin; margin-bottom: 3cqmin;
}
.tpl-comunicado__text { font-size: 3.2cqmin; line-height: 1.55; color: #3a3a3a; }
.tpl-comunicado__main footer { margin-top: auto; font-size: 2.7cqmin; color: #9b9b9b; font-style: italic; }

/* ===========================================================================
   EVENTO — póster/hero rojo con anillos concéntricos y CTA
=========================================================================== */
.tpl-evento {
  flex-direction: column; align-items: center; justify-content: center; text-align: center;
  background: radial-gradient(120% 120% at 50% 0%, #f23a30 0%, #e2231a 45%, #b51b14 100%);
  color: #fff; padding: 9cqmin; gap: 4cqmin;
}
.tpl-evento__rings {
  position: absolute; inset: 0; pointer-events: none;
  background: repeating-radial-gradient(circle at 50% 40%,
    rgba(255,255,255,0) 0 6.6cqmin, rgba(255,255,255,.055) 6.6cqmin 7cqmin);
}
.tpl-evento__logo { position: absolute; top: 5cqmin; left: 5cqmin; }
.tpl-evento__eyebrow {
  position: relative; z-index: 1; font-weight: 800; font-size: 2.6cqmin;
  letter-spacing: 0.34em; text-transform: uppercase; opacity: .92;
  padding-bottom: 1.6cqmin; border-bottom: 0.4cqmin solid rgba(255,255,255,.55);
}
.tpl-evento__hero { position: relative; z-index: 1; display: flex; flex-direction: column; align-items: center; gap: 3.4cqmin; max-width: 92%; }
.tpl-evento h1 { font-size: 11cqmin; text-shadow: 0 1cqmin 4cqmin rgba(0,0,0,.18); }
.tpl-evento__text { font-size: 4cqmin; line-height: 1.4; opacity: .96; }
.tpl-evento__cta {
  position: relative; z-index: 1; background: #fff; color: #e2231a;
  font-weight: 800; font-size: 3.8cqmin; padding: 2.2cqmin 5.5cqmin; border-radius: 99cqmin;
  box-shadow: 0 1.5cqmin 4cqmin rgba(0,0,0,.22);
}
