/* =========================================================
   Blog - SE · bloques del cuerpo del artículo
   Se cargan en la web y en el editor, para que se vean igual.
   ========================================================= */
.se-esencial,.se-clave,.se-cita,.se-dato,.se-rel,.is-style-se-tarjetas,.is-style-se-tarjetas-num{
  --se-naranja:#f8a340; --se-naranja-osc:#b86a10; --se-crema:#fffaf2; --se-beige:#fceedb;
  --se-texto:#1f1d1b; --se-cuerpo:#34302c; --se-suave:#6b645c; --se-linea:#eadfce;
  --se-display:"Ovo",Georgia,serif; --se-body:"Poppins",system-ui,sans-serif;
  box-sizing:border-box;
}

/* ---------- Lo esencial ---------- */
.se-esencial{border:1px solid var(--se-linea);border-radius:20px;padding:26px 28px 24px;margin:8px 0 30px;background:#fff;box-shadow:0 12px 30px -24px rgba(80,50,10,.4)}
.se-esencial .se-esencial__tit{display:flex;align-items:center;gap:10px;font:500 .8125rem/1 var(--se-body);letter-spacing:.06em;text-transform:uppercase;margin:0 0 16px;color:var(--se-texto)}
.se-esencial__tit svg{width:18px;height:18px;color:var(--se-naranja-osc)}
.se-esencial ul{list-style:none;margin:0;padding:0;display:grid;gap:12px}
.se-esencial li,.se-esencial .se-esencial__texto{position:relative;margin:0;padding-left:30px;font:400 1rem/1.55 var(--se-body);color:var(--se-cuerpo)}
.se-esencial li::before,.se-esencial .se-esencial__texto::before{content:"";position:absolute;left:0;top:3px;width:18px;height:18px;border-radius:50%;background:var(--se-crema) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23b86a10' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 12 4 4 8-8'/%3E%3C/svg%3E") center/12px no-repeat;border:1px solid var(--se-linea)}
.se-esencial li::marker{content:none}
/* En el editor, el diseño «constrained» centraba el último punto de la lista. */
.se-esencial ul > li{max-width:none!important;margin-left:0!important;margin-right:0!important}

/* ---------- La idea clave ---------- */
.se-clave{background:var(--se-crema);border-radius:18px;padding:22px 26px;margin:28px 0;border-left:4px solid var(--se-naranja)}
.se-clave .se-clave__tit{font:500 .75rem/1 var(--se-body);letter-spacing:.07em;text-transform:uppercase;color:var(--se-naranja-osc);margin:0 0 10px}
.se-clave .se-clave__texto{margin:0;font:400 1.1875rem/1.55 var(--se-display);letter-spacing:-.01em;color:var(--se-texto)}

/* ---------- Cita destacada ---------- */
.se-cita{margin:40px 0;padding:0;border:0;background:none}
.se-cita p{font:400 1.875rem/1.25 var(--se-display);letter-spacing:-.03em;margin:0;color:var(--se-texto)}
.se-cita p::before{content:"\201C";display:block;font:400 4rem/.6 var(--se-display);color:var(--se-naranja);margin:0 0 6px}
.se-cita footer{font:400 .875rem/1.4 var(--se-body);color:var(--se-suave);margin-top:12px}

/* ---------- Lo que dice la investigación ---------- */
.se-dato{display:grid;grid-template-columns:auto 1fr;gap:18px;align-items:start;border:1px solid var(--se-linea);border-radius:18px;padding:20px 22px;margin:28px 0;background:#fff}
.se-dato__ico{width:44px;height:44px;border-radius:12px;background:var(--se-crema) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23b86a10' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M9 3h6M10 3v6L4.5 18.5A2 2 0 0 0 6.2 21h11.6a2 2 0 0 0 1.7-2.5L14 9V3'/%3E%3Cpath d='M7 15h10'/%3E%3C/svg%3E") center/22px no-repeat;display:block}
.se-dato .se-dato__tit{font:500 .75rem/1 var(--se-body);letter-spacing:.07em;text-transform:uppercase;color:var(--se-suave);margin:4px 0 8px}
.se-dato .se-dato__texto{margin:0;font:400 1rem/1.6 var(--se-body);color:var(--se-cuerpo)}
.se-dato .se-dato__texto strong{font-weight:500;color:var(--se-texto)}
.se-dato cite{display:block;font:400 .8125rem/1.4 var(--se-body);font-style:normal;color:var(--se-suave);margin-top:8px}
.se-dato__aviso{margin:10px 0 0;font:400 .8125rem/1.45 var(--se-body);color:#9a5b00}
.se-dato__fuente{margin-top:12px}

/* ---------- Te puede interesar ---------- */
a.se-rel{display:flex;align-items:center;gap:16px;text-decoration:none;color:var(--se-texto);border:1px solid var(--se-linea);border-radius:16px;padding:14px 18px 14px 14px;margin:6px 0 28px;background:#fff;transition:border-color .15s,transform .15s}
a.se-rel:hover{border-color:var(--se-naranja);transform:translateY(-1px);color:var(--se-texto)}
.se-rel__ico{width:46px;height:46px;border-radius:12px;background:var(--se-texto);color:#fff;display:grid;place-items:center;flex:none}
.se-rel__ico svg{width:20px;height:20px}
.se-rel__tipo{display:block;font:500 .7188rem/1 var(--se-body);letter-spacing:.07em;text-transform:uppercase;color:var(--se-suave);margin-bottom:6px}
.se-rel__tit{font:400 .9688rem/1.35 var(--se-body);color:var(--se-texto)}
.se-rel__flecha{margin-left:auto;width:20px;height:20px;flex:none;color:var(--se-suave)}

/* ---------- Tarjetas (estilos de la lista) ----------
   Dos selectores: el corto para el editor y el largo para ganar a las listas del artículo. */
:is(ul,ol):is(.is-style-se-tarjetas,.is-style-se-tarjetas-num),
body.se-blog .se-art__cuerpo > :is(ul,ol):is(.is-style-se-tarjetas,.is-style-se-tarjetas-num){list-style:none;margin:26px 0 32px;padding:0;display:grid;grid-template-columns:1fr 1fr;gap:14px;counter-reset:se-tarjeta}
:is(.is-style-se-tarjetas,.is-style-se-tarjetas-num) > li,
body.se-blog .se-art__cuerpo > :is(.is-style-se-tarjetas,.is-style-se-tarjetas-num) > li{counter-increment:se-tarjeta;position:relative;margin:0;max-width:none;background:var(--se-crema);border:1px solid var(--se-linea);border-radius:18px;padding:22px 22px 20px;font:300 1rem/1.65 var(--se-body);color:var(--se-cuerpo)}
:is(.is-style-se-tarjetas,.is-style-se-tarjetas-num) > li::marker{content:none}
/* Impares: la última ocupa todo el ancho para que no quede un hueco. */
:is(.is-style-se-tarjetas,.is-style-se-tarjetas-num) > li:last-child:nth-child(odd){grid-column:1/-1}
.is-style-se-tarjetas-num > li::before{content:counter(se-tarjeta);display:grid;place-items:center;width:32px;height:32px;border-radius:50%;background:#fff;border:1px solid var(--se-linea);font:500 .8125rem/1 var(--se-body);color:var(--se-naranja-osc);margin-bottom:14px}
.is-style-se-tarjetas > li::before{content:"";display:block;width:26px;height:3px;border-radius:3px;background:var(--se-naranja);margin:4px 0 16px}
/* El título lo marca el servidor; en el editor la negrita se queda en línea para escribir cómodo. */
:is(.is-style-se-tarjetas,.is-style-se-tarjetas-num) .se-tarjetas__tit{display:block;font:400 1.1875rem/1.3 var(--se-display);letter-spacing:-.02em;color:var(--se-texto);margin-bottom:8px}

@media (max-width:720px){
  .se-esencial{padding:20px 18px}
  .se-esencial li,.se-esencial .se-esencial__texto{font-size:.9375rem}
  .se-cita p{font-size:1.5rem}
  .se-dato{padding:18px;gap:14px}
  :is(ul,ol):is(.is-style-se-tarjetas,.is-style-se-tarjetas-num),
  body.se-blog .se-art__cuerpo > :is(ul,ol):is(.is-style-se-tarjetas,.is-style-se-tarjetas-num){grid-template-columns:1fr;gap:10px}
  :is(.is-style-se-tarjetas,.is-style-se-tarjetas-num) > li,
  body.se-blog .se-art__cuerpo > :is(.is-style-se-tarjetas,.is-style-se-tarjetas-num) > li{padding:18px;font-size:.9375rem}
  .is-style-se-tarjetas-num > li,
  body.se-blog .se-art__cuerpo > .is-style-se-tarjetas-num > li{padding-left:62px}
  .is-style-se-tarjetas-num > li::before{position:absolute;left:16px;top:18px;margin:0}
  .is-style-se-tarjetas > li::before{margin:2px 0 12px}
  :is(.is-style-se-tarjetas,.is-style-se-tarjetas-num) .se-tarjetas__tit{font-size:1.125rem}
}