/* ARUEDA Core · Bloques de guía práctica (Información previa + Pasos)
   Ámbito exclusivo: .arueda-guia-datos / .arueda-guia-pasos y sus elementos.
   No afecta a H2/H3 de Gutenberg, tarjetas generales ni Elementor.
   Tipografía Montserrat heredada del tema. */

/* ---------- Contenedores: dejan que Elementor controle ancho/centrado ---------- */
.arueda-guia-datos,
.arueda-guia-pasos{width:100%;max-width:none}

/* =========================== INFORMACIÓN PREVIA =========================== */
.arueda-guia-datos{
  background:#F7F4EE;
  border:1px solid #E5E1D8;
  border-radius:18px;
  padding:28px;
}
.arueda-guia-datos__titulo{
  margin:0 0 6px;
  color:#173527;
  font-weight:700;
  line-height:1.25;
}
.arueda-guia-datos__intro{
  margin:0 0 18px;
  color:#252925;
  line-height:1.6;
}
.arueda-guia-datos__lista{
  list-style:none;
  margin:0;
  padding:0;
  display:grid;
  grid-template-columns:repeat(var(--aru-datos-cols,2),minmax(0,1fr));
  gap:14px;
}
.arueda-guia-dato{
  display:flex;
  flex-direction:column;      /* etiqueta y contenido siempre en lineas separadas */
  align-items:flex-start;
  gap:2px;
  padding:14px 16px;
  background:#FFFFFF;
  border:1px solid #E5E1D8;
  border-radius:12px;
  min-width:0;
}
.arueda-guia-dato__icono{color:#B8663A;font-weight:700}
.arueda-guia-dato__etiqueta{display:block;color:#173527;font-weight:700}
.arueda-guia-dato__contenido{display:block;color:#252925;line-height:1.5;min-width:0;overflow-wrap:anywhere;word-break:break-word}

/* Fila enlazada: hover solo cuando hay enlace */
.arueda-guia-dato__enlace{
  display:flex;
  flex-direction:column;
  align-items:flex-start;
  gap:2px;
  width:100%;
  color:inherit;
  text-decoration:none;
}
.arueda-guia-dato--enlazado{
  cursor:pointer;
  transition:transform .2s ease,box-shadow .2s ease,border-color .2s ease;
}
.arueda-guia-dato--enlazado:hover{
  transform:translateY(-2px);
  box-shadow:0 8px 20px rgba(23,53,39,.08);
  border-color:#B8663A;
}
.arueda-guia-dato--enlazado:focus-within{
  outline:2px solid #B8663A;
  outline-offset:3px;
}

/* =============================== PASOS =============================== */
.arueda-guia-pasos__titulo{
  margin:0 0 6px;
  color:#173527;
  font-weight:700;
  line-height:1.25;
}
.arueda-guia-pasos__intro{
  margin:0 0 20px;
  color:#252925;
  line-height:1.6;
}
.arueda-guia-pasos__lista{
  list-style:none;
  margin:0;
  padding:0;
  counter-reset:aru-paso;
  display:grid;
  gap:26px;
}
.arueda-guia-paso{
  counter-increment:aru-paso;
  padding:0 0 26px;
  border-bottom:1px solid #E5E1D8;
}
.arueda-guia-paso:last-child{border-bottom:0;padding-bottom:0}
.arueda-guia-paso__cab{
  display:flex;
  align-items:center;
  gap:14px;
  margin:0 0 10px;
}
/* Círculo con la numeración real del <ol> */
.arueda-guia-paso__num{
  flex:0 0 auto;
  width:38px;height:38px;
  border-radius:999px;
  background:#B8663A;
  color:#FFFFFF;
  font-weight:700;
  display:flex;align-items:center;justify-content:center;
}
.arueda-guia-paso__num::before{content:counter(aru-paso)}
.arueda-guia-paso__titulo{
  margin:0;
  color:#173527;
  font-weight:700;
  line-height:1.3;
}
.arueda-guia-paso__texto{color:#252925;line-height:1.65}
.arueda-guia-paso__texto p{margin:0 0 10px}
.arueda-guia-paso__texto p:last-child{margin-bottom:0}
.arueda-guia-paso__imagen{margin:14px 0 0}
.arueda-guia-paso__imagen img{display:block;width:100%;height:auto;border-radius:14px}

/* Caja de consejo */
.arueda-guia-paso__consejo{
  margin:14px 0 0;
  padding:12px 16px;
  background:#EEF3EC;
  border-left:4px solid #173527;
  border-radius:0 10px 10px 0;
}
.arueda-guia-paso__consejo-titulo{
  display:block;
  color:#173527;
  font-weight:700;
  font-size:13px;
  letter-spacing:.02em;
  margin:0 0 4px;
}
.arueda-guia-paso__consejo-texto{color:#252925;line-height:1.55;margin:0}

/* Caja de aviso */
.arueda-guia-paso__aviso{
  margin:14px 0 0;
  padding:12px 16px;
  background:#FBEEE6;
  border-left:4px solid #B8663A;
  border-radius:0 10px 10px 0;
}
.arueda-guia-paso__aviso-titulo{
  display:block;
  color:#B8663A;
  font-weight:700;
  font-size:13px;
  letter-spacing:.02em;
  margin:0 0 4px;
}
.arueda-guia-paso__aviso-texto{color:#252925;line-height:1.55;margin:0}

/* =============================== RESPONSIVE =============================== */
@media(max-width:1024px){
  .arueda-guia-datos__lista{grid-template-columns:repeat(min(var(--aru-datos-cols,2),2),minmax(0,1fr))}
}
@media(max-width:640px){
  .arueda-guia-datos{padding:20px}
  .arueda-guia-datos__lista{grid-template-columns:1fr}
}

/* =============================== VÍDEO COMPACTO =============================== */
.arueda-guia-video-compacto{width:100%;max-width:none}
.arueda-guia-video-compacto__enlace{display:block;color:inherit;text-decoration:none}
.arueda-guia-video-compacto__miniatura{
  position:relative;display:block;width:100%;
  aspect-ratio:16/9;overflow:hidden;border-radius:14px;background:#0d1f17;
}
.arueda-guia-video-compacto__miniatura img{display:block;width:100%;height:100%;object-fit:cover}
.arueda-guia-video-compacto__play{
  position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);
  width:66px;height:66px;border-radius:999px;
  background:rgba(184,102,58,.92);
  transition:transform .2s ease,background .2s ease;
}
.arueda-guia-video-compacto__play::before{
  content:"";position:absolute;top:50%;left:54%;transform:translate(-50%,-50%);
  border-style:solid;border-width:12px 0 12px 20px;
  border-color:transparent transparent transparent #fff;
}
.arueda-guia-video-compacto__enlace:hover .arueda-guia-video-compacto__play{transform:translate(-50%,-50%) scale(1.06);background:#B8663A}
.arueda-guia-video-compacto__enlace:focus-visible .arueda-guia-video-compacto__miniatura{outline:3px solid #B8663A;outline-offset:3px}
.arueda-guia-video-compacto__titulo{display:block;margin:12px 0 0;color:#173527;font-weight:700;line-height:1.3}
.arueda-guia-video-compacto__boton{
  display:inline-block;margin:12px 0 0;
  color:#B8663A;font-weight:700;font-size:14px;
}
.arueda-guia-video-compacto--enlace{padding:0}
.arueda-guia-video-compacto--enlace .arueda-guia-video-compacto__boton{
  background:#173527;color:#fff;padding:12px 22px;border-radius:999px;text-decoration:none;
}

/* =========================== GUÍAS RELACIONADAS =========================== */
/* La rejilla y las tarjetas las aporta .arueda-cards (imagen, tema, titulo,
   resumen). Aqui solo: ancho completo + enlace visual "Ver guia" sin tocar
   el HTML compartido (se anade con ::after, acotado a este bloque). */
.arueda-guia-relacionadas{width:100%;max-width:none}
.arueda-guia-relacionadas .arueda-card{position:relative}
.arueda-guia-relacionadas .arueda-card__body{padding-bottom:44px}
.arueda-guia-relacionadas .arueda-card__body::after{
  content:"Ver guía →";
  position:absolute;left:20px;bottom:16px;
  color:#B8663A;font-weight:700;font-size:14px;line-height:1;
}
.arueda-guia-relacionadas .arueda-card:hover .arueda-card__body::after{text-decoration:underline}