/* ============================================================
   LA GACETA DEL HOBBY — estilos del blog.
   Reutiliza el lenguaje visual de la web: hero oscuro con el título
   en Impact y subrayado naranja, Lora para leer, Montserrat para la
   interfaz, gris #9e9a9a de la barra de paginación y naranja #d28712.
   SOLO EN LOCAL hasta el lanzamiento.
   ============================================================ */

.hs-gaceta-main {
    --g-naranja: #d28712;
    --g-naranja-osc: #b8730f;
    --g-tinta: #1c1c1c;
    --g-texto: #3c4147;
    --g-suave: #7a7f85;
    --g-gris: #9e9a9a;
    --g-linea: #ececec;
    --g-teal: #335e68;
}

/* ---------- Cabecera ---------- */
.hs-ghero { margin-bottom: 2.2rem; }

/* Portada de periódico: filetes, fecha de edición y secciones */
.hs-gmast { min-height: clamp(360px, 42vw, 540px); }
.hs-gmast .hs-page-hero__inner { width: 100%; max-width: 1000px; padding: clamp(2rem, 4vw, 3.4rem) 1.5rem; }
.hs-gmast__top {
    position: relative;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: center;
    gap: 12px;
    padding-bottom: 16px;
    margin-bottom: 6px;
    font-family: 'Montserrat', Arial, sans-serif;
    font-size: 0.66rem;
    font-weight: 600;
    letter-spacing: 0.26em;
    text-transform: uppercase;
    color: rgba(255, 255, 255, 0.7);
    border-bottom: 1px solid rgba(255, 255, 255, 0.28);
}
.hs-gmast__top::after {                 /* segundo filete: aire de cabecera impresa */
    content: "";
    position: absolute;
    left: 0; right: 0; bottom: -5px;
    height: 1px;
    background: rgba(255, 255, 255, 0.16);
}
.hs-gmast__sep { color: #f0a642; letter-spacing: 0; }
.hs-gmast__title {
    margin-top: 1.5rem;
    font-size: clamp(2.4rem, 6.6vw, 5.2rem);
    line-height: 0.95;
}
.hs-gmast__title::after { display: none; }
/* Cabecera con el logotipo de La Gaceta en vez del titulo tipografico */
.hs-gmast__title--logo { margin-top: 1.2rem; line-height: 0; }
.hs-gmast__logo {
    display: block;
    width: min(620px, 84%);
    height: auto;
    margin: 0 auto;
}
.hs-gmast__sections {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    margin-top: 1.1rem;
    font-family: 'Montserrat', Arial, sans-serif;
    font-size: 0.7rem;
    font-weight: 700;
    letter-spacing: 0.2em;
    text-transform: uppercase;
    color: #fff;
}
.hs-gmast__sections i { color: #f0a642; font-style: normal; }
.hs-gmast__sections::before,
.hs-gmast__sections::after {
    content: "";
    flex: 1 1 auto;
    max-width: 130px;
    height: 1px;
    background: rgba(255, 255, 255, 0.45);
}
.hs-gmast .hs-ghero__claim { margin-top: 1.3rem; }
.hs-ghero__claim {
    max-width: 720px;
    margin: 1.4rem auto 0;
    font-family: 'Lora', Georgia, serif;
    font-size: clamp(0.95rem, 1.5vw, 1.12rem);
    line-height: 1.65;
    color: rgba(255, 255, 255, 0.86);
}
.hs-ghero--post { text-align: left; min-height: clamp(280px, 34vw, 420px); }
.hs-ghero--post .hs-page-hero__inner { padding: 3rem 2rem; width: 100%; max-width: 1000px; }
.hs-ghero__title--post {
    font-size: clamp(1.9rem, 4.2vw, 3.4rem);
    text-align: left;
}
.hs-ghero__title--post::after { margin-left: 0; margin-right: 0; }

.hs-gcrumbs {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 8px;
    margin-bottom: 1rem;
    font-family: 'Montserrat', Arial, sans-serif;
    font-size: 0.72rem;
    letter-spacing: 0.18em;
    text-transform: uppercase;
    color: rgba(255, 255, 255, 0.62);
}
.hs-gcrumbs a { color: #f0a642; text-decoration: none; }
.hs-gcrumbs a:hover { text-decoration: underline; }

.hs-gmeta {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 10px;
    margin-top: 1.3rem;
    font-family: 'Montserrat', Arial, sans-serif;
    font-size: 0.82rem;
    color: rgba(255, 255, 255, 0.8);
}

/* ---------- Chips de sección ---------- */
.hs-gchips {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    margin: 0 0 2.4rem;
}
.hs-chip {
    display: inline-flex;
    align-items: center;
    padding: 7px 15px;
    border-radius: 999px;
    background: #f1f1f2;
    border: 1px solid #e3e3e5;
    font-family: 'Montserrat', Arial, sans-serif;
    font-size: 0.72rem;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: #4a4f55;
    text-decoration: none;
    transition: background .15s ease, color .15s ease, border-color .15s ease;
}
.hs-chip:hover { background: rgba(210, 135, 18, 0.12); border-color: rgba(210, 135, 18, 0.35); color: var(--g-naranja-osc); }
.hs-chip.is-active { background: var(--g-naranja); border-color: var(--g-naranja); color: #fff; }
.hs-chip--tag { text-transform: none; letter-spacing: 0.02em; font-weight: 600; }

/* ---------- Título de sección (subrayado naranja como la web) ---------- */
.hs-gsection-title {
    display: flex;
    align-items: center;
    gap: 20px;
    margin: 3.2rem 0 1.6rem;
    font-family: 'Impact', 'Montserrat', sans-serif;
    font-weight: 400;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    font-size: clamp(1.4rem, 2.6vw, 2rem);
    color: var(--g-tinta);
}
.hs-gsection-title span {
    display: inline-block;
    padding-bottom: 8px;
    border-bottom: 3px solid var(--g-naranja);
    flex: 0 0 auto;
}
.hs-gsection-title::after {          /* filete editorial que acompaña al título */
    content: "";
    flex: 1 1 auto;
    height: 1px;
    background: linear-gradient(90deg, rgba(0, 0, 0, 0.16) 0%, rgba(0, 0, 0, 0) 100%);
}

/* ---------- Tarjetas ---------- */
/* ---------- Rejilla de publicaciones ----------
   Estructura copiada de Warhammer Community: tarjetas pequeñas y todas iguales
   (foto 16/10, titular y, debajo, sección y fecha). Sin extracto: en la portada
   mandan el titular y la foto, y caben muchas más publicaciones a la vista. */
.hs-ggrid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 34px 30px;
}
.hs-gcard {
    position: relative;
    display: flex;
    flex-direction: column;
    background: #fff;
    border: 1px solid var(--g-linea);
    border-radius: 18px;
    overflow: hidden;
    box-shadow: 0 6px 16px rgba(0, 0, 0, 0.06);
    transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease;
}
.hs-gcard::before {                       /* filete naranja que entra al pasar por encima */
    content: "";
    position: absolute;
    top: 0; left: 0; right: 0;
    height: 3px;
    background: var(--g-naranja);
    transform: scaleX(0);
    transform-origin: left center;
    transition: transform .28s ease;
    z-index: 3;
}
.hs-gcard:hover { transform: translateY(-5px); box-shadow: 0 16px 32px rgba(0, 0, 0, 0.13); border-color: #e2e2e2; }
.hs-gcard:hover::before { transform: scaleX(1); }
.hs-gcard__media {
    position: relative;
    display: block;
    aspect-ratio: 16 / 10;
    overflow: hidden;
    background: #14181c;
}
.hs-gcard__media img { width: 100%; height: 100%; object-fit: cover; transition: transform .45s ease; }
.hs-gcard:hover .hs-gcard__media img { transform: scale(1.06); }
.hs-gcard__media::after {                 /* oscurecido inferior: la etiqueta siempre se lee */
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(180deg, rgba(12, 16, 20, 0) 45%, rgba(12, 16, 20, 0.72) 100%);
}
.hs-gcard__cat {
    position: absolute;
    left: 14px;
    bottom: 13px;
    z-index: 2;
    padding: 5px 12px;
    border-radius: 999px;
    background: rgba(12, 16, 20, 0.62);
    border: 1px solid rgba(240, 166, 66, 0.75);
    -webkit-backdrop-filter: blur(6px);
            backdrop-filter: blur(6px);
    color: #ffd79a;
    font-family: 'Montserrat', Arial, sans-serif;
    font-size: 0.64rem;
    font-weight: 700;
    letter-spacing: 0.14em;
    text-transform: uppercase;
}
.hs-gcard__body {
    display: flex;
    flex-direction: column;
    gap: 10px;
    padding: 18px 22px 20px;
    flex: 1 1 auto;
}
.hs-gcard__title {
    margin: 0;
    font-family: 'Lora', Georgia, serif;
    font-weight: 600;
    font-size: 1.16rem;
    line-height: 1.34;
    color: var(--g-tinta);
}
.hs-gcard__title a { color: inherit; text-decoration: none; }
.hs-gcard__title a:hover { color: var(--g-naranja-osc); }
.hs-gcard__excerpt {
    margin: 0;
    font-family: 'Montserrat', Arial, sans-serif;
    font-size: 0.9rem;
    line-height: 1.62;
    color: var(--g-texto);
}
.hs-gcard__meta {
    display: flex;
    align-items: center;
    gap: 9px;
    font-family: 'Montserrat', Arial, sans-serif;
    font-size: 0.66rem;
    font-weight: 700;
    letter-spacing: 0.14em;
    text-transform: uppercase;
    color: var(--g-gris);
}
.hs-gcard__dot { width: 4px; height: 4px; border-radius: 50%; background: currentColor; opacity: .6; }
.hs-gmore {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    margin-top: auto;
    padding-top: 14px;
    font-family: 'Montserrat', Arial, sans-serif;
    font-size: 0.7rem;
    font-weight: 700;
    letter-spacing: 0.14em;
    text-transform: uppercase;
    color: var(--g-naranja);
    text-decoration: none;
}
.hs-gmore svg { width: 15px; height: 10px; transition: transform .2s ease; }
.hs-gmore:hover { color: var(--g-naranja-osc); }
.hs-gmore:hover svg { transform: translateX(4px); }

/* ---------- Línea de edición (cabecera de la portada) ----------
   La cabecera ya lleva el logotipo: aquí solo la firma de la edición. */
.hs-gedicion {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 10px 16px;
    padding-bottom: 14px;
    border-bottom: 2px solid var(--g-tinta);
}
.hs-gedicion__title {
    margin: 0;
    font-family: 'Montserrat', Arial, sans-serif;
    font-size: 0.78rem;
    font-weight: 700;
    letter-spacing: 0.2em;
    text-transform: uppercase;
    color: var(--g-tinta);
}
.hs-gedicion__sep { color: var(--g-naranja); }
.hs-gedicion__fecha {
    font-family: 'Montserrat', Arial, sans-serif;
    font-size: 0.74rem;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    color: var(--g-suave);
}
.hs-gedicion__lupa { margin-left: auto; }

/* ---------- Pieza de portada: foto a un lado, texto al otro ---------- */
.hs-gfeatured { margin-bottom: 0.6rem; }
.hs-gfeat {
    display: grid;
    grid-template-columns: minmax(0, 8fr) minmax(0, 4fr);
    gap: 30px;
    align-items: center;
}
.hs-gfeat__media {
    display: block;
    aspect-ratio: 16 / 10;
    overflow: hidden;
    border: 1px solid var(--g-linea);
    border-radius: 10px;
    background: #14181c;
    transition: border-color .18s ease;
}
.hs-gfeat:hover .hs-gfeat__media { border-color: var(--g-naranja); }
.hs-gfeat__media img { width: 100%; height: 100%; object-fit: cover; transition: transform .5s ease; }
.hs-gfeat:hover .hs-gfeat__media img { transform: scale(1.03); }
.hs-gfeat__body { display: flex; flex-direction: column; gap: 14px; }
.hs-gfeat__title {
    margin: 0;
    font-family: 'Lora', Georgia, serif;
    font-weight: 600;
    font-size: clamp(1.45rem, 2.4vw, 2.1rem);
    line-height: 1.22;
    color: var(--g-tinta);
}
.hs-gfeat__title a { color: inherit; text-decoration: none; }
.hs-gfeat__title a:hover { color: var(--g-naranja-osc); }
.hs-gfeat__excerpt {
    margin: 0;
    font-family: 'Lora', Georgia, serif;
    font-size: 1rem;
    line-height: 1.7;
    color: var(--g-texto);
}
.hs-gfeat__meta {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 8px;
    font-family: 'Montserrat', Arial, sans-serif;
    font-size: 0.72rem;
    color: var(--g-suave);
}
.hs-gfeat__cat {
    display: inline-block;
    padding: 3px 11px;
    border: 1px solid #dcdcdc;
    border-radius: 999px;
    color: var(--g-tinta);
    font-size: 0.7rem;
    font-weight: 500;
    letter-spacing: 0.2px;
    text-decoration: none;
    white-space: nowrap;
    transition: border-color .15s ease, color .15s ease;
}
.hs-gfeat__cat:hover { border-color: var(--g-naranja); color: var(--g-naranja-osc); }
.hs-gfeat__rule { width: 1px; height: 16px; background: #dcdcdc; flex: 0 0 auto; }

/* ---------- Tres bloques de llamada (final de portada) ---------- */
/* Una SOLA franja, no tres cajas sueltas: fondo comun, columnas separadas por filetes
   finos y el mismo tratamiento en las tres. El unico elemento macizo es el boton del
   boletin, que es la accion principal. */
.hs-gctas {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    margin-top: 4rem;
    padding: 2.8rem 0.6rem;
    border-radius: 18px;
    background: linear-gradient(160deg, #23303a 0%, #101820 100%);
    color: #fff;
}
.hs-gctas__col {
    display: flex;
    flex-direction: column;
    gap: 10px;
    padding: 0 2.2rem;
}
.hs-gctas__col + .hs-gctas__col { border-left: 1px solid rgba(255, 255, 255, 0.13); }

.hs-gctas__eyebrow {
    font-family: 'Montserrat', Arial, sans-serif;
    font-size: 0.63rem;
    font-weight: 700;
    letter-spacing: 0.24em;
    text-transform: uppercase;
    color: var(--g-naranja);
}
.hs-gctas__title {
    margin: 0;
    font-family: 'Impact', 'Montserrat', sans-serif;
    font-weight: 400;
    font-size: 1.28rem;
    letter-spacing: 0.03em;
    text-transform: uppercase;
    color: #fff;
}
.hs-gctas__text {
    margin: 0 0 4px;
    font-size: 0.875rem;
    line-height: 1.62;
    color: rgba(255, 255, 255, 0.72);
}
.hs-gctas__link {
    margin-top: auto;
    align-self: flex-start;
    font-family: 'Montserrat', Arial, sans-serif;
    font-size: 0.72rem;
    font-weight: 700;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    color: var(--g-naranja);
    text-decoration: none;
}
.hs-gctas__link span { display: inline-block; transition: transform .18s ease; }
.hs-gctas__link:hover { color: #f0a642; }
.hs-gctas__link:hover span { transform: translateX(4px); }

.hs-gctas__col--news .hs-gnews__form { margin-top: auto; }

/* OJO: `.hs-gcta` YA EXISTE: es la cajita del lateral del articulo
   ("¿Te ayudamos a empezar?"). Por eso aqui todo cuelga de `.hs-gctas__`. */
.hs-gctas__col--news .hs-gnews__row { display: flex; flex-direction: column; gap: 10px; }
.hs-gctas__col--news .hs-newsletter { width: 100%; }
.hs-gctas__col--news .hs-news-consent { font-size: 0.72rem; }
/* ---------- Artículo ---------- */
.hs-glayout {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 320px;
    gap: 56px;
    align-items: start;
}
.hs-gcontent { min-width: 0; }
.hs-glead {
    margin: 0 0 1.8rem;
    padding-left: 18px;
    border-left: 4px solid var(--g-naranja);
    font-family: 'Lora', Georgia, serif;
    font-size: clamp(1.05rem, 1.9vw, 1.25rem);
    line-height: 1.65;
    color: var(--g-teal);
}
.hs-gsingle .hs-prose { max-width: none; margin: 0; }
/* Letra capital: el artículo arranca con aire de publicación, no de nota suelta */
.hs-gsingle .hs-prose > p:first-of-type::first-letter {
    float: left;
    margin: 6px 14px 0 0;
    font-family: 'Lora', Georgia, serif;
    font-weight: 700;
    font-size: 3.6em;
    line-height: 0.82;
    color: var(--g-naranja);
}
.hs-gsingle .hs-prose blockquote {
    margin: 2.2rem 0;
    padding: 4px 0 4px 24px;
    border-left: 4px solid var(--g-naranja);
    font-family: 'Lora', Georgia, serif;
    font-size: clamp(1.1rem, 2vw, 1.35rem);
    line-height: 1.6;
    color: var(--g-teal);
}
.hs-gsingle .hs-prose blockquote p:last-child { margin-bottom: 0; }

.hs-gtags { display: flex; flex-wrap: wrap; gap: 8px; margin: 2.2rem 0 0; }

.hs-gshare {
    display: flex;
    align-items: center;
    gap: 10px;
    margin: 2rem 0 0;
    padding: 16px 0;
    border-top: 1px solid var(--g-linea);
    border-bottom: 1px solid var(--g-linea);
}
.hs-gshare__label {
    font-family: 'Montserrat', Arial, sans-serif;
    font-size: 0.72rem;
    font-weight: 700;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    color: var(--g-suave);
    margin-right: 4px;
}
.hs-gshare__btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 36px;
    height: 36px;
    padding: 0;
    border: 0;
    border-radius: 50%;
    background: #f1f1f2;
    color: #4a4f55;
    font-size: 1rem;
    cursor: pointer;
    text-decoration: none;
    transition: background .15s ease, color .15s ease;
}
.hs-gshare__btn:hover { background: var(--g-naranja); color: #fff; }
.hs-gshare__btn.is-copied { background: #2e9e5b; color: #fff; }

.hs-gauthor {
    display: flex;
    gap: 18px;
    margin-top: 2.4rem;
    padding: 22px;
    border-radius: 18px;
    background: #f8f8f8;
    border: 1px solid var(--g-linea);
}
.hs-gauthor__img { border-radius: 50%; flex: 0 0 auto; }
.hs-gauthor__label {
    display: block;
    font-family: 'Montserrat', Arial, sans-serif;
    font-size: 0.68rem;
    font-weight: 700;
    letter-spacing: 0.14em;
    text-transform: uppercase;
    color: var(--g-naranja);
}
.hs-gauthor__name { display: block; font-family: 'Lora', Georgia, serif; font-size: 1.1rem; color: var(--g-tinta); margin: 2px 0 6px; }
.hs-gauthor__bio { margin: 0; font-size: 0.9rem; line-height: 1.6; color: var(--g-texto); }

/* ---------- Lateral: índice + llamada a la acción ---------- */
.hs-gside__sticky { position: sticky; top: 96px; display: flex; flex-direction: column; gap: 20px; }
.hs-toc {
    border: 1px solid var(--g-linea);
    border-radius: 18px;
    background: #fff;
    box-shadow: 0 6px 16px rgba(0, 0, 0, 0.05);
    overflow: hidden;
}
.hs-toc__head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 100%;
    padding: 14px 18px;
    border: 0;
    background: #f8f8f8;
    font-family: 'Montserrat', Arial, sans-serif;
    font-size: 0.74rem;
    font-weight: 700;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    color: var(--g-tinta);
    cursor: pointer;
}
.hs-toc__head svg { width: 12px; height: 8px; color: var(--g-gris); transition: transform .2s ease; }
.hs-toc__head[aria-expanded="false"] svg { transform: rotate(-90deg); }
.hs-toc__list { margin: 0; padding: 10px 8px; list-style: none; counter-reset: toc; }
.hs-toc__head[aria-expanded="false"] + .hs-toc__list { display: none; }
.hs-toc__item a {
    display: block;
    padding: 7px 12px;
    border-radius: 10px;
    font-family: 'Montserrat', Arial, sans-serif;
    font-size: 0.86rem;
    line-height: 1.45;
    color: var(--g-texto);
    text-decoration: none;
    border-left: 3px solid transparent;
    transition: background .15s ease, color .15s ease, border-color .15s ease;
}
.hs-toc__item a:hover { background: rgba(210, 135, 18, 0.08); color: var(--g-naranja-osc); }
.hs-toc__item--h3 a { padding-left: 26px; font-size: 0.82rem; color: var(--g-suave); }
.hs-toc__item.is-current > a { border-left-color: var(--g-naranja); background: rgba(210, 135, 18, 0.08); color: var(--g-naranja-osc); font-weight: 600; }

.hs-gcta {
    padding: 22px;
    border-radius: 18px;
    background: linear-gradient(160deg, #23303a 0%, #101820 100%);
    color: #fff;
}
.hs-gcta__title { margin: 0 0 8px; font-family: 'Lora', Georgia, serif; font-size: 1.15rem; }
.hs-gcta__text { margin: 0 0 16px; font-size: 0.88rem; line-height: 1.6; color: rgba(255, 255, 255, 0.78); }
.hs-gbtn {
    display: inline-block;
    padding: 10px 22px;
    border-radius: 999px;
    background: var(--g-naranja);
    color: #fff !important;
    font-family: 'Montserrat', Arial, sans-serif;
    font-size: 0.78rem;
    font-weight: 700;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    text-decoration: none;
    transition: background .15s ease;
}
.hs-gbtn:hover { background: var(--g-naranja-osc); }

/* ---------- Barra de progreso de lectura ---------- */
.hs-gprogress {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    height: 3px;
    z-index: 1100;
    pointer-events: none;
}
.hs-gprogress span {
    display: block;
    height: 100%;
    width: 0;
    background: var(--g-naranja, #d28712);
    transition: width .1s linear;
}

/* ---------- Productos relacionados ---------- */
.hs-grelated__grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 24px;
}

/* ---------- Anterior / siguiente ---------- */
.hs-gnav {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 20px;
    margin-top: 3rem;
}
.hs-gnav__item {
    padding: 18px 22px;
    border: 1px solid var(--g-linea);
    border-radius: 16px;
    background: #fff;
    text-decoration: none;
    transition: border-color .15s ease, transform .15s ease;
}
.hs-gnav__item:hover { border-color: var(--g-naranja); transform: translateY(-2px); }
.hs-gnav__item--next { text-align: right; grid-column: 2; }
.hs-gnav__label {
    display: block;
    font-family: 'Montserrat', Arial, sans-serif;
    font-size: 0.68rem;
    font-weight: 700;
    letter-spacing: 0.14em;
    text-transform: uppercase;
    color: var(--g-naranja);
    margin-bottom: 5px;
}
.hs-gnav__title { font-family: 'Lora', Georgia, serif; font-size: 1rem; color: var(--g-tinta); }

/* ---------- Boletín ---------- */
.hs-gnews {
    margin: 4rem 0 1rem;
    padding: clamp(2rem, 4vw, 3.2rem);
    border-radius: 26px;
    background: linear-gradient(160deg, #23303a 0%, #101820 100%);
    color: #fff;
    text-align: center;
}
.hs-gnews__inner { max-width: 640px; margin: 0 auto; }
.hs-gnews__eyebrow {
    margin: 0 0 8px;
    font-family: 'Montserrat', Arial, sans-serif;
    font-size: 0.72rem;
    font-weight: 700;
    letter-spacing: 0.24em;
    text-transform: uppercase;
    color: #f0a642;
}
.hs-gnews__title {
    margin: 0 0 10px;
    font-family: 'Impact', 'Montserrat', sans-serif;
    font-weight: 400;
    text-transform: uppercase;
    letter-spacing: 0.03em;
    font-size: clamp(1.6rem, 3.4vw, 2.4rem);
}
.hs-gnews__text { margin: 0 0 22px; font-family: 'Lora', Georgia, serif; color: rgba(255, 255, 255, 0.8); }
.hs-gnews__row { display: flex; gap: 10px; justify-content: center; align-items: center; flex-wrap: wrap; }
/* La caja .hs-newsletter viene con el estilo del PIE (styles.css): 427px de ancho, 40px de
   alto, overflow:hidden y una rayita inferior. Aqui dentro el campo mide 46px y va con marco
   redondeado, asi que la caja del pie lo recortaba por abajo y se le comia el borde y las
   esquinas. Se anula todo eso y manda el campo. */
.hs-gnews .hs-newsletter {
    flex: 1 1 300px;
    max-width: 380px;
    width: auto;
    height: auto;
    margin: 0;
    border: 0;
    background: transparent;
    overflow: visible;
    /* flex para que el campo llene la caja: si no, al ser en linea deja un hueco por debajo
       y la caja queda mas alta que el boton */
    display: flex;
}
.hs-gnews .hs-newsletter__input {
    width: 100%;
    height: 46px;
    padding: 0 16px;
    border: 1px solid rgba(255, 255, 255, 0.22);
    border-radius: 12px;
    background: rgba(255, 255, 255, 0.08);
    color: #fff;
    font-family: 'Montserrat', Arial, sans-serif;
    font-size: 0.9rem;
    /* el campo del PIE va en negrita y muy espaciado; aqui el texto va normal */
    font-weight: 400;
    letter-spacing: normal;
}
.hs-gnews .hs-newsletter__input::placeholder {
    color: rgba(255, 255, 255, 0.55);
    /* en el pie el marcador va en MAYUSCULAS a 10px: aqui se queda como esta escrito */
    text-transform: none;
    font-size: 0.85rem;
    font-weight: 400;
    letter-spacing: 0.02em;
}
.hs-gnews .hs-newsletter__input:focus { outline: none; border-color: var(--g-naranja, #d28712); background: rgba(255, 255, 255, 0.14); }
.hs-gnews .hs-news-submit {
    /* el boton del PIE trae margin-top: 1.1rem y aqui lo dejaba caido respecto al campo */
    margin: 0;
    height: 46px;
    padding: 0 26px;
    border: 0;
    border-radius: 12px;
    background: var(--g-naranja, #d28712);
    color: #fff;
    font-family: 'Montserrat', Arial, sans-serif;
    font-size: 0.8rem;
    font-weight: 700;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    cursor: pointer;
    transition: background .15s ease;
}
.hs-gnews .hs-news-submit:hover { background: var(--g-naranja-osc, #b8730f); }
.hs-gnews .hs-news-consent {
    display: flex;
    align-items: flex-start;
    justify-content: center;
    gap: 8px;
    margin-top: 14px;
    font-size: 0.78rem;
    color: rgba(255, 255, 255, 0.68);
    text-align: left;
}
.hs-gnews .hs-news-consent a { color: #f0a642; }

/* ---------- Paginación ---------- */
.hs-gpag {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 8px;
    margin-top: 3rem;
}
.hs-gpag .page-numbers {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 36px;
    height: 36px;
    padding: 0 10px;
    border-radius: 999px;
    background: #ebebeb;
    color: #4a4f55;
    font-family: 'Montserrat', Arial, sans-serif;
    font-size: 0.86rem;
    font-weight: 700;
    text-decoration: none;
    transition: background .15s ease, color .15s ease;
}
.hs-gpag a.page-numbers:hover { background: var(--g-gris); color: #fff; }
.hs-gpag .page-numbers.current { background: var(--g-naranja); color: #fff; }
.hs-gpag .page-numbers.dots { background: transparent; }

/* ---------- Vacío ---------- */
.hs-gempty {
    text-align: center;
    padding: clamp(2.6rem, 6vw, 4.4rem) 1.5rem;
    border-radius: 24px;
    background: linear-gradient(160deg, #23303a 0%, #101820 100%);
    color: #fff;
}
.hs-gempty h2 { font-family: 'Lora', Georgia, serif; font-size: clamp(1.3rem, 2.6vw, 1.7rem); color: #fff; margin-bottom: 10px; }
.hs-gempty p { color: rgba(255, 255, 255, 0.72); margin-bottom: 22px; }

/* ============================================================
   Adaptación a pantallas pequeñas
   ============================================================ */
@media (max-width: 1199.98px) {
    .hs-glayout { grid-template-columns: minmax(0, 1fr); gap: 34px; }
    .hs-gside__sticky { position: static; }
    .hs-toc__head { pointer-events: auto; }
    .hs-grelated__grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}
@media (max-width: 991.98px) {
    .hs-ggrid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 28px 24px; }
    .hs-gfeat { grid-template-columns: minmax(0, 1fr); gap: 20px; }
    /* movil: en columna y el filete pasa a ser horizontal */
    .hs-gctas { grid-template-columns: minmax(0, 1fr); padding: 2rem 0.4rem; }
    .hs-gctas__col { padding: 1.6rem 1.6rem; }
    .hs-gctas__col + .hs-gctas__col {
        border-left: 0;
        border-top: 1px solid rgba(255, 255, 255, 0.13);
    }
    .hs-grelated__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 575.98px) {
    .hs-ggrid { grid-template-columns: minmax(0, 1fr); gap: 24px; }
    .hs-ghero--post .hs-page-hero__inner { padding: 2rem 1.2rem; }
    .hs-gnav { grid-template-columns: minmax(0, 1fr); }
    .hs-gnav__item--next { grid-column: 1; text-align: left; }
    .hs-gauthor { flex-direction: column; }
    .hs-gnews .hs-news-consent { text-align: left; }
}

/* ---------- Bandas de sección: los dos mundos de la tienda ----------
   La portada se parte en WARGAMES y TCG. Cada una con su color de acento,
   su cabecera y un enlace a la sección entera, para que se note de un vistazo
   en qué parte del blog estás. */
.hs-gband {
    --band: var(--g-naranja, #d28712);
    position: relative;
    margin: 3.4rem 0 0;
    padding: 1.9rem clamp(1.1rem, 2.4vw, 2rem) 2.1rem;
    border: 1px solid var(--g-linea, #ececec);
    border-top: 4px solid var(--band);
    border-radius: 20px;
    background: #fff;
}
.hs-gband--wargames { --band: #d28712; background: linear-gradient(180deg, rgba(210, 135, 18, 0.055) 0%, rgba(255, 255, 255, 0) 260px); }
.hs-gband--tcg      { --band: #335e68; background: linear-gradient(180deg, rgba(51, 94, 104, 0.06) 0%, rgba(255, 255, 255, 0) 260px); }

.hs-gband__head {
    display: flex;
    flex-wrap: wrap;
    align-items: flex-end;
    justify-content: space-between;
    gap: 14px;
    margin-bottom: 1.6rem;
}
.hs-gband__kicker {
    display: block;
    margin-bottom: 4px;
    font-family: 'Montserrat', Arial, sans-serif;
    font-size: 0.66rem;
    font-weight: 700;
    letter-spacing: 0.24em;
    text-transform: uppercase;
    color: var(--band);
}
.hs-gband__title {
    margin: 0;
    font-family: 'Impact', 'Montserrat', sans-serif;
    font-weight: 400;
    text-transform: uppercase;
    letter-spacing: 0.03em;
    font-size: clamp(1.7rem, 3.4vw, 2.5rem);
    line-height: 1;
    color: var(--g-tinta, #1c1c1c);
}
.hs-gband__claim {
    margin: 6px 0 0;
    font-family: 'Lora', Georgia, serif;
    font-size: 0.95rem;
    color: var(--g-texto, #3c4147);
}
.hs-gband__all {
    flex: 0 0 auto;
    padding: 9px 18px;
    border: 1px solid var(--band);
    border-radius: 999px;
    font-family: 'Montserrat', Arial, sans-serif;
    font-size: 0.72rem;
    font-weight: 700;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    color: var(--band);
    text-decoration: none;
    white-space: nowrap;
    transition: background .15s ease, color .15s ease;
}
.hs-gband__all:hover { background: var(--band); color: #fff; }

@media (max-width: 767.98px) {
    .hs-gband { padding-left: 1rem; padding-right: 1rem; }
    .hs-gband__head { align-items: flex-start; }
    .hs-gband__all { align-self: flex-start; }
}

/* ============================================================
   LA GACETA COMO PUBLICACIÓN APARTE
   Cabecera propia (logotipo de la Gaceta, secciones y buscador de
   artículos), barra de vuelta a la tienda y pie propio. Nada de la
   cabecera de la tienda: ni menú de categorías, ni carrito, ni
   buscador de productos.
   ============================================================ */

/* Los colores viven en .hs-gaceta-main; la cabecera y el pie están FUERA de él,
   así que se repiten aquí colgando del <body> de la Gaceta. */
body.hs-gaceta {
    --g-naranja: #d28712;
    --g-naranja-osc: #b8730f;
    --g-tinta: #1c1c1c;
    --g-noche: #10141a;
    --g-noche-2: #161c23;
    --g-teal: #335e68;
}

/* ---------- Barra de vuelta a la tienda ---------- */
.hs-gback {
    background: #0c0f13;
    border-bottom: 1px solid rgba(255, 255, 255, 0.06);
}
.hs-gback__inner {
    max-width: 1240px;
    margin: 0 auto;
    padding: 0.5rem 1.25rem;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    font-family: 'Montserrat', Arial, sans-serif;
    font-size: 0.68rem;
    letter-spacing: 0.14em;
    text-transform: uppercase;
    color: #8d949c;
}
.hs-gback__claim strong { color: #c9ced4; font-weight: 700; }
.hs-gback__link {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 5px 14px;
    border: 1px solid rgba(210, 135, 18, 0.55);
    border-radius: 999px;
    color: var(--g-naranja);
    font-weight: 700;
    text-decoration: none;
    white-space: nowrap;
    transition: background .15s ease, color .15s ease;
}
.hs-gback__link:hover { background: var(--g-naranja); color: #fff; }
.hs-gback__link svg { flex: 0 0 auto; }

/* ---------- Cabecera de la Gaceta ---------- */
footer.hs-gfoot,
header.hs-ghead { margin: 0; }   /* la cabecera de la tienda lleva margin:4% y dejaba una franja blanca */

.hs-ghead {
    position: sticky;
    top: 0;
    z-index: 900;
    background:
        linear-gradient(180deg, rgba(255, 255, 255, 0.05) 0%, rgba(255, 255, 255, 0) 60%),
        linear-gradient(180deg, var(--g-noche-2) 0%, var(--g-noche) 100%);
    border-bottom: 1px solid rgba(255, 255, 255, 0.09);
    box-shadow: 0 10px 26px rgba(0, 0, 0, 0.18);
}
.hs-ghead::after {              /* filete naranja: el sello de la casa */
    content: "";
    display: block;
    height: 2px;
    background: linear-gradient(90deg, rgba(210, 135, 18, 0) 0%, var(--g-naranja) 25%, var(--g-naranja) 75%, rgba(210, 135, 18, 0) 100%);
}
.hs-ghead__bar {
    max-width: 1240px;
    margin: 0 auto;
    padding: 1.05rem 1.25rem 0.85rem;
    /* el relleno tambien se anima: si no, el logotipo se deslizaba suave pero la barra
       pegaba un salto seco y se notaba el corte */
    transition: padding .18s ease;
    display: grid;
    grid-template-columns: 44px 1fr 44px;
    align-items: center;
    gap: 0.75rem;
}
/* Cada pieza en su columna: al ocultar el boton de menu en escritorio, el
   logotipo se iba a la izquierda. */
.hs-ghead__burger { grid-column: 1; }
.hs-ghead__logo   { grid-column: 2; }
.hs-ghead__lupa   { grid-column: 3; }

.hs-ghead__logo {
    justify-self: center;
    display: block;
    line-height: 0;
}
.hs-ghead__logo img {
    height: clamp(58px, 7vw, 92px);
    width: auto;
    transition: height .18s ease;
}
/* Al bajar, la cabecera se encoge y deja sitio a la lectura */
body.hs-gscrolled .hs-ghead__logo img { height: clamp(34px, 4vw, 44px); }
body.hs-gscrolled .hs-ghead__bar { padding-top: 0.55rem; padding-bottom: 0.45rem; }

.hs-ghead__lupa,
.hs-ghead__burger {
    width: 42px;
    height: 42px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0;
    border: 1px solid rgba(255, 255, 255, 0.16);
    border-radius: 50%;
    background: transparent;
    color: #e7e9ec;
    cursor: pointer;
    transition: background .15s ease, color .15s ease, border-color .15s ease;
}
.hs-ghead__lupa { justify-self: end; }
.hs-ghead__burger { justify-self: start; flex-direction: column; gap: 4px; }
.hs-ghead__lupa:hover,
.hs-ghead__burger:hover,
.hs-ghead__lupa[aria-expanded="true"] {
    background: var(--g-naranja);
    border-color: var(--g-naranja);
    color: #fff;
}
.hs-ghead__burger span {
    display: block;
    width: 18px;
    height: 2px;
    background: currentColor;
    border-radius: 2px;
    transition: transform .18s ease, opacity .18s ease;
}
.hs-ghead__burger[aria-expanded="true"] span:nth-child(1) { transform: translateY(6px) rotate(45deg); }
.hs-ghead__burger[aria-expanded="true"] span:nth-child(2) { opacity: 0; }
.hs-ghead__burger[aria-expanded="true"] span:nth-child(3) { transform: translateY(-6px) rotate(-45deg); }

/* ---------- Secciones ---------- */
.hs-gnavbar {
    border-top: 1px solid rgba(255, 255, 255, 0.07);
}
.hs-gnavbar__list {
    max-width: 1240px;
    margin: 0 auto;
    padding: 0.55rem 1.25rem;
    list-style: none;
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    align-items: center;
    gap: 0.4rem 2.1rem;
}
.hs-gnavbar__link {
    display: inline-block;
    padding: 6px 2px;
    font-family: 'Montserrat', Arial, sans-serif;
    font-size: 0.74rem;
    font-weight: 600;
    letter-spacing: 0.16em;
    text-transform: uppercase;
    color: #c3c8ce;
    text-decoration: none;
    border-bottom: 2px solid transparent;
    transition: color .15s ease, border-color .15s ease;
}
.hs-gnavbar__link:hover,
.hs-gnavbar__link.is-active {
    color: #fff;
    border-bottom-color: var(--g-naranja);
}

/* ---------- Buscador propio ---------- */
.hs-gsearch {
    border-top: 1px solid rgba(255, 255, 255, 0.07);
    background: rgba(0, 0, 0, 0.28);
}
.hs-gsearch__inner {
    max-width: 720px;
    margin: 0 auto;
    padding: 1rem 1.25rem 1.15rem;
}
.hs-gsearch__form {
    position: relative;
    display: flex;
    align-items: center;
    gap: 8px;
    background: rgba(255, 255, 255, 0.06);
    border: 1px solid rgba(255, 255, 255, 0.18);
    border-radius: 999px;
    padding: 5px 6px 5px 16px;
}
.hs-gsearch__form:focus-within { border-color: var(--g-naranja); }
.hs-gsearch__ico { width: 19px; height: 19px; flex: 0 0 auto; color: #9aa1a9; }
.hs-gsearch__input {
    flex: 1 1 auto;
    min-width: 0;
    background: transparent;
    border: 0;
    outline: 0;
    color: #fff;
    font-family: 'Montserrat', Arial, sans-serif;
    font-size: 0.92rem;
    padding: 8px 0;
}
.hs-gsearch__input::placeholder { color: #868d95; }
.hs-gsearch__input::-webkit-search-cancel-button { filter: invert(1) opacity(0.45); }
.hs-gsearch__btn {
    flex: 0 0 auto;
    border: 0;
    border-radius: 999px;
    background: var(--g-naranja);
    color: #fff;
    font-family: 'Montserrat', Arial, sans-serif;
    font-size: 0.72rem;
    font-weight: 700;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    padding: 10px 20px;
    cursor: pointer;
    transition: background .15s ease;
}
.hs-gsearch__btn:hover { background: var(--g-naranja-osc); }

/* Buscando no hace falta la portada entera: cabecera corta y a los resultados */
.hs-gmast--slim { min-height: 0; }
.hs-gmast--slim .hs-page-hero__inner { padding-top: 1.6rem; padding-bottom: 1.6rem; }
.hs-gmast--slim .hs-gmast__logo { height: clamp(58px, 8vw, 96px); width: auto; }
.hs-gmast--slim .hs-gmast__sections,
.hs-gmast--slim .hs-ghero__claim { display: none; }

/* ---------- Resultados del buscador ---------- */
.hs-gresults { margin-top: 0.5rem; }
.hs-gresults__head {
    text-align: center;
    padding: 0 0 1.8rem;
    border-bottom: 1px solid var(--g-linea, #ececec);
    margin-bottom: 2.2rem;
}
.hs-gresults__kicker {
    display: block;
    font-family: 'Montserrat', Arial, sans-serif;
    font-size: 0.68rem;
    font-weight: 700;
    letter-spacing: 0.2em;
    text-transform: uppercase;
    color: var(--g-naranja);
    margin-bottom: 10px;
}
.hs-gresults__title {
    font-family: 'Lora', Georgia, serif;
    font-size: clamp(1.5rem, 3.4vw, 2.3rem);
    color: var(--g-tinta);
    margin: 0 0 6px;
}
.hs-gresults__count {
    font-family: 'Montserrat', Arial, sans-serif;
    font-size: 0.85rem;
    color: #7a7f85;
    margin: 0;
}

/* ---------- Pie de la Gaceta ---------- */
footer.hs-gfoot {
    margin-top: 4rem;
    border-radius: 0;
    background: var(--g-noche);
    background-image: none;
    border-top: 2px solid var(--g-naranja);
    color: #c3c8ce;
}
.hs-gfoot__inner {
    max-width: 1240px;
    margin: 0 auto;
    padding: 3rem 1.5rem 1.6rem;
}
.hs-gfoot__top {
    display: grid;
    grid-template-columns: 1.6fr 1fr 1.2fr;
    gap: 2.6rem;
    align-items: start;
}
.hs-gfoot__logo { display: inline-block; line-height: 0; margin-bottom: 1.1rem; }
.hs-gfoot__logo img { height: 62px; width: auto; }
.hs-gfoot__claim {
    font-family: 'Lora', Georgia, serif;
    font-size: 0.95rem;
    line-height: 1.75;
    color: #a8aeb5;
    margin: 0;
    max-width: 42ch;
}
.hs-gfoot__claim strong { color: #e7e9ec; font-weight: 600; }
.hs-gfoot__head {
    display: block;
    font-family: 'Montserrat', Arial, sans-serif;
    font-size: 0.7rem;
    font-weight: 700;
    letter-spacing: 0.18em;
    text-transform: uppercase;
    color: #fff;
    margin-bottom: 1rem;
}
.hs-gfoot__nav ul { list-style: none; margin: 0; padding: 0; }
.hs-gfoot__nav li { margin-bottom: 9px; }
.hs-gfoot__nav a,
.hs-gfoot__legal a {
    color: #a8aeb5;
    text-decoration: none;
    font-family: 'Montserrat', Arial, sans-serif;
    font-size: 0.85rem;
    transition: color .15s ease;
}
.hs-gfoot__nav a:hover,
.hs-gfoot__legal a:hover { color: var(--g-naranja); }
.hs-gfoot__cta p {
    font-size: 0.88rem;
    line-height: 1.7;
    color: #a8aeb5;
    margin: 0 0 1.1rem;
}
.hs-gfoot__bottom {
    margin-top: 2.6rem;
    padding-top: 1.3rem;
    border-top: 1px solid rgba(255, 255, 255, 0.09);
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: 0.8rem;
}
.hs-gfoot__copy {
    margin: 0;
    font-family: 'Montserrat', Arial, sans-serif;
    font-size: 0.75rem;
    letter-spacing: 0.06em;
    color: #7b8189;
}
.hs-gfoot__legal-list {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-wrap: wrap;
    gap: 0.4rem 1.4rem;
}
.hs-gfoot__legal-list a { font-size: 0.78rem; }

/* ---------- Móvil ---------- */
@media (max-width: 991.98px) {
    .hs-gback__claim { display: none; }
    .hs-gback__inner { justify-content: center; }
    .hs-gnavbar {
        display: none;
        border-top: 1px solid rgba(255, 255, 255, 0.09);
        background: rgba(0, 0, 0, 0.3);
    }
    .hs-gnavbar.is-open { display: block; }
    .hs-gnavbar__list {
        flex-direction: column;
        align-items: stretch;
        gap: 0;
        padding: 0.4rem 1.25rem 0.9rem;
    }
    .hs-gnavbar__list li { border-bottom: 1px solid rgba(255, 255, 255, 0.07); }
    .hs-gnavbar__list li:last-child { border-bottom: 0; }
    .hs-gnavbar__link {
        display: block;
        padding: 13px 2px;
        border-bottom: 0;
        font-size: 0.8rem;
    }
    .hs-gnavbar__link.is-active { color: var(--g-naranja); }
    .hs-gfoot__top { grid-template-columns: 1fr; gap: 2.2rem; }
    .hs-gfoot__claim { max-width: none; }
}

@media (min-width: 992px) {
    .hs-ghead__burger { display: none; }
}

@media (max-width: 575.98px) {
    .hs-gsearch__btn { padding: 10px 14px; font-size: 0.68rem; }
    .hs-gfoot__inner { padding-left: 1.15rem; padding-right: 1.15rem; }
    .hs-gfoot__bottom { justify-content: center; text-align: center; }
    .hs-gfoot__legal-list { justify-content: center; }
}

/* El formulario del boletín dentro del bloque de llamada. Le llega otra vez el estilo
   del pie de la tienda (campo de 40px con rayita y botón blanco con margen), así que
   hay que anularlo igual que en .hs-gnews. */
.hs-gctas__col--news .hs-newsletter {
    flex: 1 1 auto;
    width: auto;
    max-width: none;
    height: auto;
    margin: 0;
    border: 0;
    background: transparent;
    overflow: visible;
    display: flex;
}
.hs-gctas__col--news .hs-newsletter__input {
    width: 100%;
    height: 46px;
    padding: 0 16px;
    border: 1px solid rgba(255, 255, 255, 0.22);
    border-radius: 12px;
    background: rgba(255, 255, 255, 0.08);
    color: #fff;
    font-family: 'Montserrat', Arial, sans-serif;
    font-size: 0.9rem;
    font-weight: 400;
    letter-spacing: normal;
}
.hs-gctas__col--news .hs-newsletter__input::placeholder {
    color: rgba(255, 255, 255, 0.55);
    text-transform: none;
    font-size: 0.85rem;
    font-weight: 400;
    letter-spacing: 0.02em;
}
.hs-gctas__col--news .hs-newsletter__input:focus {
    outline: none;
    border-color: var(--g-naranja, #d28712);
    background: rgba(255, 255, 255, 0.14);
}
.hs-gctas__col--news .hs-news-submit {
    margin: 0;
    width: 100%;
    height: 46px;
    padding: 0 22px;
    border: 0;
    border-radius: 12px;
    background: var(--g-naranja, #d28712);
    color: #fff;
    font-family: 'Montserrat', Arial, sans-serif;
    font-size: 0.78rem;
    font-weight: 700;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    cursor: pointer;
    transition: background .15s ease;
}
.hs-gctas__col--news .hs-news-submit:hover { background: var(--g-naranja-osc, #b8730f); }
.hs-gctas__col--news .hs-news-consent {
    display: flex;
    align-items: flex-start;
    justify-content: flex-start;
    gap: 8px;
    margin-top: 12px;
    font-size: 0.74rem;
    line-height: 1.5;
    color: rgba(255, 255, 255, 0.68);
    text-align: left;
}
.hs-gctas__col--news .hs-news-consent a { color: #f0a642; }

/* En los archivos, el nombre de la Gaceta de la línea de edición vuelve a la portada */
a.hs-gedicion__title { text-decoration: none; transition: color .15s ease; }
a.hs-gedicion__title:hover { color: var(--g-naranja); }
.hs-garchive__claim {
    max-width: 70ch;
    margin: -0.6rem 0 2rem;
    font-family: 'Lora', Georgia, serif;
    font-size: 1rem;
    line-height: 1.7;
    color: var(--g-texto);
}

/* El menú de la Gaceta es un <header>, así que le cae la regla de la tienda
   (`header + main.my-5 { margin-top: 0 !important }`) y el contenido se pegaba
   al menú fijo. Se le devuelve el aire. */
.hs-ghead + .hs-gaceta-main.my-5,
body.hs-gaceta main.hs-gaceta-main.my-5 { margin-top: 2.8rem !important; }
.hs-gedicion { margin-top: 0; }

/* Fotos dentro del artículo: que no se salgan y con las mismas esquinas que las tarjetas */
.hs-gsingle .hs-prose figure img,
.hs-gsingle .hs-prose > img {
    display: block;
    width: auto;
    max-width: min(100%, 520px);   /* mas pequenas: no comen la columna de texto */
    height: auto;
    margin: 0 auto;
    border-radius: 10px;
    border: 0;                      /* sin marco gris */
}
.hs-gsingle .hs-prose figure figcaption {
    font-family: 'Montserrat', Arial, sans-serif;
    font-size: 0.82rem;
    line-height: 1.5;
    color: var(--g-suave);
}