.gh-single,
.gh-archivo,
.gh-desde-blog {
--gh-ink: #20242a;
--gh-text: #2a2f36;
--gh-text2: #444b54;
--gh-muted: #5f6772;
--gh-line: #e3e6ea;
--gh-soft: #f5f6f8;
--gh-panel: #0d0f13;
--gh-gold: #d5aa2f;
--gh-gold-dark: #b88f1c;
--gh-gold-ink: #7a5f0c;
--gh-gold-soft: #fbf5e3;
--gh-shadow: 0 22px 60px rgba(13, 15, 19, .12);
--gh-radius: 14px;
--gh-head: Montserrat, "Avenir Next", "Segoe UI", Arial, sans-serif;
--gh-body: "Open Sans", Arial, sans-serif;
}
.gh-single,
.gh-archivo {
background: #fff;
color: var(--gh-text);
font-family: var(--gh-body);
font-size: 16px;
line-height: 1.6;
padding-bottom: 96px; } main.gh-resources#main-content,
main.gh-resources.gh-single,
main.gh-resources.gh-archivo,
.gh-single,
.gh-archivo {
background: #fff !important;
background-color: #fff !important;
background-image: none !important;
color: var(--gh-text) !important;
color-scheme: light;
opacity: 1 !important;
filter: none !important;
}
.gh-single *,
.gh-archivo * {
box-sizing: border-box;
}
.gh-single [hidden],
.gh-archivo [hidden] {
display: none !important;
}
.gh-single h1, .gh-single h2, .gh-single h3, .gh-single h4,
.gh-archivo h1, .gh-archivo h2, .gh-archivo h3, .gh-archivo h4 {
font-family: var(--gh-head);
color: var(--gh-ink);
text-transform: none;
padding-bottom: 0;
} .gh-wrap {
width: min(100% - 40px, 1080px);
margin: 0 auto;
}
.gh-wrap--narrow {
width: min(100% - 40px, 820px);
}
.gh-hero {
background: var(--gh-panel);
box-shadow: 0 -16px 0 var(--gh-panel); color: #f5f7fa;
padding: 54px 0 46px;
}
.gh-hero h1 {
color: #f5f7fa;
font-size: clamp(30px, 5vw, 44px);
font-weight: 700;
line-height: 1.12;
letter-spacing: -.02em;
margin: 0 0 14px;
}
.gh-hero .gh-sub {
color: #c9ced6;
}
.gh-hero .gh-lead {
font-size: clamp(17px, 2.3vw, 19.5px);
line-height: 1.6;
color: #d4d9df;
margin: 0 0 18px;
max-width: 44em;
}
.gh-hero .gh-privacidad {
background: rgba(255, 255, 255, .07);
border-color: rgba(255, 255, 255, .16);
color: #c9ced6;
}
.gh-hero .gh-privacidad strong {
color: #f5f7fa;
}
.gh-breadcrumb {
font-size: 13.5px;
color: #aab1bb;
margin: 0 0 18px;
}
.gh-breadcrumb a {
color: #d4d9df;
text-decoration: none;
}
.gh-breadcrumb a:hover {
color: var(--gh-gold);
}
.gh-breadcrumb span {
margin: 0 7px;
opacity: .6;
}
.gh-eyebrow {
font-size: 11.5px;
font-weight: 800;
letter-spacing: .14em;
text-transform: uppercase;
color: var(--gh-gold);
margin: 0 0 12px;
}
.gh-button {
display: inline-block;
background: var(--gh-gold);
color: #101216;
font-family: var(--gh-body);
font-weight: 800;
font-size: 16px;
text-decoration: none;
padding: 15px 26px;
border-radius: 15px;
transition: background .15s, transform .15s;
}
.gh-button:hover,
.gh-button:focus-visible {
background: #e3ba3f;
color: #101216;
transform: translateY(-1px);
}
.gh-text-link {
display: inline-block;
margin-left: 18px;
color: #f5f7fa;
font-weight: 700;
text-decoration: underline;
text-decoration-color: var(--gh-gold);
text-underline-offset: 4px;
}
.gh-cta {
background: var(--gh-panel);
color: #d4d9df;
padding: 56px 0;
margin-top: 48px;
}
.gh-cta h2 {
color: #f5f7fa;
font-size: clamp(24px, 3.6vw, 33px);
font-weight: 700;
line-height: 1.2;
letter-spacing: -.02em;
margin: 0 0 14px;
}
.gh-cta p {
max-width: 40em;
margin: 0 0 22px;
font-size: 17px;
line-height: 1.6;
color: #c9ced6;
}
.gh-noscript {
font-size: 14px;
color: var(--gh-muted);
}
@media (max-width: 640px) {
.gh-hero { padding: 38px 0 34px; }
.gh-text-link { display: block; margin: 16px 0 0; }
} .gh-sub {
font-size: clamp(18px, 2.6vw, 23px);
font-weight: 700;
color: var(--gh-muted);
line-height: 1.25;
letter-spacing: -.01em;
margin: 4px 0 18px;
}
.gh-privacidad {
display: inline-block;
background: var(--gh-soft);
border: 1px solid var(--gh-line);
border-radius: 999px;
padding: 7px 16px;
font-size: 14px;
color: var(--gh-muted);
margin: 6px 0 0;
}
.gh-privacidad strong {
color: var(--gh-ink);
font-weight: 600;
} .gh-article {
padding-top: 44px;
font-size: 17.5px;
line-height: 1.74;
color: var(--gh-text);
}
.gh-article > p,
.gh-article > h2,
.gh-article > h3,
.gh-article > ul,
.gh-article > ol {
max-width: 42em;
}
.gh-article h2 {
font-size: clamp(24px, 3.4vw, 31px);
font-weight: 800;
letter-spacing: -.02em;
line-height: 1.18;
margin: 46px 0 14px;
color: var(--gh-ink);
}
.gh-article h3 {
font-size: clamp(19px, 2.4vw, 22px);
font-weight: 700;
line-height: 1.3;
margin: 34px 0 10px;
color: var(--gh-ink);
}
.gh-article p {
margin: 0 0 18px;
}
.gh-article ul,
.gh-article ol {
margin: 0 0 20px;
padding-left: 22px;
}
.gh-article li {
margin-bottom: 9px;
}
.gh-article a {
color: var(--gh-ink);
text-decoration: underline;
text-decoration-color: var(--gh-gold-dark);
text-decoration-thickness: 2px;
text-underline-offset: 3px;
}
.gh-article a:hover {
background: var(--gh-gold-soft);
}
.destacado {
background: var(--gh-soft);
border-left: 4px solid var(--gh-gold);
border-radius: 0 10px 10px 0;
padding: 18px 22px;
margin: 30px 0;
max-width: 42em;
}
.destacado p {
margin: 0;
} .inter {
border: 1px solid var(--gh-line);
border-radius: var(--gh-radius);
background: #fff;
box-shadow: var(--gh-shadow);
overflow: hidden;
margin: 40px 0 44px;
}
.inter__cab {
background: var(--gh-panel);
color: #fff;
padding: 18px 24px;
}
.inter__cab p {
margin: 0 0 4px;
font-size: 11.5px;
font-weight: 800;
letter-spacing: .12em;
text-transform: uppercase;
color: var(--gh-gold);
}
.inter__cab h3 {
margin: 0;
color: #fff;
font-size: clamp(19px, 2.4vw, 23px);
font-weight: 700;
line-height: 1.28;
}
.inter__cuerpo {
padding: 24px;
}
.inter__cuerpo > .nota {
font-size: 16px;
color: var(--gh-text2);
margin: 0 0 18px;
max-width: none;
} .opciones {
display: grid;
gap: 10px;
margin-bottom: 4px;
}
.opcion {
display: block;
width: 100%;
text-align: left;
cursor: pointer;
background: #fff;
border: 1.5px solid var(--gh-line);
border-radius: 10px;
padding: 15px 18px;
font: inherit;
font-size: 16.5px;
line-height: 1.45;
color: var(--gh-ink);
transition: border-color .15s, background .15s, box-shadow .15s;
}
.opcion:hover {
border-color: var(--gh-gold-dark);
background: var(--gh-gold-soft);
}
.opcion.is-on {
border-color: var(--gh-gold-dark);
background: var(--gh-gold-soft);
box-shadow: inset 0 0 0 1px var(--gh-gold-dark);
font-weight: 600;
}
.respuesta {
margin-top: 20px;
padding: 20px 22px;
background: var(--gh-soft);
border-radius: 10px;
border-top: 3px solid var(--gh-gold);
}
.respuesta h4 {
margin: 0 0 10px;
font-size: 19px;
font-weight: 800;
letter-spacing: -.01em;
color: var(--gh-ink);
}
.respuesta p {
margin: 0 0 12px;
font-size: 16.5px;
line-height: 1.68;
}
.respuesta p:last-child {
margin-bottom: 0;
} .frases {
display: grid;
gap: 2px;
margin-bottom: 20px;
border: 1px solid var(--gh-line);
border-radius: 10px;
overflow: hidden;
}
.frase {
display: flex;
gap: 12px;
align-items: flex-start;
padding: 13px 16px;
background: #fff;
cursor: pointer;
font-size: 16px;
line-height: 1.45;
border-bottom: 1px solid var(--gh-line);
}
.frase:last-child {
border-bottom: none;
}
.frase:hover {
background: var(--gh-soft);
}
.frase input {
width: 19px;
height: 19px;
margin: 2px 0 0;
accent-color: var(--gh-gold-dark);
flex: none;
}
.frase:has(input:checked) {
background: var(--gh-gold-soft);
}
.perfil {
padding: 20px 22px;
background: var(--gh-soft);
border-radius: 10px;
border-top: 3px solid var(--gh-gold);
}
.perfil h4 {
margin: 0 0 10px;
font-size: 19px;
font-weight: 800;
letter-spacing: -.01em;
color: var(--gh-ink);
}
.perfil > p {
margin: 0 0 4px;
font-size: 16.5px;
line-height: 1.68;
}
.perfil__item {
background: #fff;
border: 1px solid var(--gh-line);
border-radius: 9px;
padding: 14px 16px;
margin-top: 12px;
}
.perfil__item strong {
display: block;
font-size: 16px;
margin-bottom: 5px;
color: var(--gh-ink);
}
.perfil__item p {
margin: 0;
font-size: 15.5px;
line-height: 1.62;
color: var(--gh-text2);
} .campos {
display: grid;
gap: 16px;
margin-bottom: 20px;
}
.campo label {
display: block;
font-size: 11.5px;
font-weight: 800;
letter-spacing: .07em;
text-transform: uppercase;
color: var(--gh-muted);
margin-bottom: 6px;
}
.campo input[type=text] {
width: 100%;
padding: 13px 15px;
font: inherit;
font-size: 16.5px;
color: var(--gh-ink);
background: #fff;
border: 1.5px solid var(--gh-line);
border-radius: 9px;
}
.campo input[type=text]:focus {
outline: none;
border-color: var(--gh-gold-dark);
box-shadow: 0 0 0 3px rgba(213, 170, 47, .28);
}
.acciones {
display: flex;
flex-wrap: wrap;
gap: 10px;
}
.inter .btn {
cursor: pointer;
border: none;
border-radius: 14px;
padding: 13px 22px;
font: inherit;
font-size: 16px;
font-weight: 700;
background: var(--gh-gold);
color: var(--gh-ink);
transition: background .15s;
}
.inter .btn:hover {
background: var(--gh-gold-dark);
}
.inter .btn--ghost {
background: #fff;
border: 1.5px solid var(--gh-line);
color: var(--gh-ink);
}
.inter .btn--ghost:hover {
background: var(--gh-soft);
}
.guardado {
font-size: 14px;
color: var(--gh-muted);
margin: 12px 0 0;
min-height: 20px;
}
.carta {
margin-top: 18px;
padding: 22px 24px;
background: var(--gh-gold-soft);
border-radius: 10px;
border-top: 3px solid var(--gh-gold);
}
.carta h4 {
margin: 0 0 10px;
font-size: 19px;
font-weight: 800;
letter-spacing: -.01em;
color: var(--gh-ink);
}
.carta p {
margin: 0 0 12px;
font-size: 16.5px;
line-height: 1.7;
color: var(--gh-text);
}
.carta p:last-child {
margin-bottom: 0;
} .gh-article details {
border: 1px solid var(--gh-line);
border-radius: 10px;
padding: 0;
margin-bottom: 10px;
background: #fff;
max-width: 42em;
}
.gh-article summary {
cursor: pointer;
padding: 15px 18px;
font-weight: 700;
font-size: 16.5px;
color: var(--gh-ink);
list-style: none;
position: relative;
padding-right: 46px;
}
.gh-article summary::-webkit-details-marker {
display: none;
}
.gh-article summary::after {
content: "+";
position: absolute;
right: 18px;
top: 50%;
transform: translateY(-50%);
font-size: 22px;
font-weight: 400;
color: var(--gh-gold-dark);
line-height: 1;
}
.gh-article details[open] summary::after {
content: "−";
}
.gh-article details[open] summary {
border-bottom: 1px solid var(--gh-line);
}
.gh-article details p {
margin: 0;
padding: 15px 18px;
font-size: 16.5px;
line-height: 1.68;
color: var(--gh-text2);
} .fuentes {
max-width: 42em;
font-size: 15px;
line-height: 1.6;
color: var(--gh-muted);
padding-left: 22px;
}
.fuentes li {
margin-bottom: 9px;
}
.fuentes a {
text-decoration-color: var(--gh-line);
} .gh-seguir {
padding: 20px 0 8px;
}
.gh-seguir h2 {
font-size: clamp(23px, 3.2vw, 29px);
font-weight: 800;
letter-spacing: -.02em;
margin: 0 0 20px;
color: var(--gh-ink);
}
.gh-siguientes {
display: grid;
grid-template-columns: repeat(auto-fit, minmax(230px, 1fr));
gap: 14px;
}
.gh-siguientes a {
display: block;
text-decoration: none;
border: 1px solid var(--gh-line);
border-radius: 11px;
padding: 18px 20px;
background: #fff;
transition: border-color .15s, transform .15s, box-shadow .15s;
}
.gh-siguientes a:hover {
border-color: var(--gh-gold-dark);
transform: translateY(-2px);
box-shadow: 0 12px 30px rgba(11, 14, 17, .08);
}
.gh-siguientes strong {
display: block;
font-size: 12px;
font-weight: 800;
letter-spacing: .1em;
text-transform: uppercase;
color: var(--gh-gold-ink);
margin-bottom: 7px;
}
.gh-siguientes span {
display: block;
font-size: 16.5px;
font-weight: 700;
line-height: 1.32;
color: var(--gh-ink);
margin-bottom: 8px;
}
.gh-siguientes small {
font-size: 13px;
color: var(--gh-muted);
}
.gh-todos {
margin: 18px 0 0;
font-size: 15.5px;
} .gh-autor {
border-top: 1px solid var(--gh-line);
margin-top: 34px;
padding-top: 22px;
font-size: 15px;
line-height: 1.62;
color: var(--gh-muted);
max-width: 46em;
}
.gh-autor p {
margin: 0;
}
.gh-autor strong {
color: var(--gh-ink);
} .gh-bloque {
padding: 34px 0 6px;
}
.gh-bloque__cab {
margin-bottom: 20px;
max-width: 44em;
}
.gh-bloque__cab h2 {
font-size: clamp(25px, 3.6vw, 33px);
font-weight: 800;
letter-spacing: -.025em;
line-height: 1.14;
margin: 0 0 10px;
color: var(--gh-ink);
}
.gh-bloque__cab p {
margin: 0;
font-size: 17px;
line-height: 1.65;
color: var(--gh-muted);
}
.gh-tarjetas {
display: grid;
grid-template-columns: repeat(auto-fit, minmax(270px, 1fr));
gap: 16px;
}
.gh-tarjeta {
display: flex;
flex-direction: column;
text-decoration: none;
border: 1px solid var(--gh-line);
border-radius: 11px;
background: #fff;
padding: 20px 22px;
transition: border-color .15s, transform .15s, box-shadow .15s;
}
.gh-tarjeta:hover {
border-color: var(--gh-gold-dark);
transform: translateY(-2px);
box-shadow: 0 14px 34px rgba(11, 14, 17, .08);
}
.gh-tarjeta__nombre {
margin: 0 0 8px;
font-size: 11.5px;
font-weight: 800;
letter-spacing: .11em;
text-transform: uppercase;
color: var(--gh-gold-ink);
}
.gh-tarjeta h3 {
margin: 0 0 10px;
font-size: 19.5px;
font-weight: 700;
line-height: 1.26;
letter-spacing: -.01em;
color: var(--gh-ink);
}
.gh-tarjeta__lead {
margin: 0 0 16px;
font-size: 15.5px;
line-height: 1.6;
color: var(--gh-muted);
flex: 1 1 auto;
}
.gh-tarjeta__pie {
display: flex;
justify-content: space-between;
align-items: baseline;
gap: 10px;
margin: 0;
padding-top: 12px;
border-top: 1px solid var(--gh-line);
font-size: 13.5px;
color: var(--gh-muted);
}
.gh-tarjeta__pie em {
font-style: normal;
font-weight: 700;
color: var(--gh-gold-ink);
}
.gh-como {
margin-top: 42px;
padding: 28px 0 10px;
border-top: 1px solid var(--gh-line);
}
.gh-como h2 {
font-size: clamp(22px, 3vw, 27px);
font-weight: 800;
letter-spacing: -.02em;
margin: 0 0 14px;
color: var(--gh-ink);
}
.gh-como p {
max-width: 44em;
font-size: 16.5px;
line-height: 1.7;
color: var(--gh-text2);
margin: 0 0 14px;
} .gh-desde-blog {
margin: 36px 0 10px;
border: 1px solid var(--gh-line);
border-left: 4px solid var(--gh-gold);
border-radius: 0 11px 11px 0;
background: var(--gh-soft);
padding: 20px 22px;
}
.gh-desde-blog__eyebrow {
margin: 0 0 8px;
font-size: 11.5px;
font-weight: 800;
letter-spacing: .11em;
text-transform: uppercase;
color: var(--gh-gold-ink);
}
.gh-desde-blog a {
display: block;
text-decoration: none;
}
.gh-desde-blog strong {
display: block;
font-size: 19px;
font-weight: 700;
line-height: 1.28;
color: var(--gh-ink);
margin-bottom: 7px;
}
.gh-desde-blog a:hover strong {
text-decoration: underline;
text-decoration-color: var(--gh-gold-dark);
text-decoration-thickness: 2px;
text-underline-offset: 3px;
}
.gh-desde-blog span {
display: block;
font-size: 15.5px;
line-height: 1.6;
color: var(--gh-muted);
margin-bottom: 10px;
}
.gh-desde-blog em {
font-style: normal;
font-size: 14px;
font-weight: 700;
color: var(--gh-gold-ink);
} @media (max-width: 640px) {
.gh-article {
font-size: 17px;
}
.inter__cab,
.inter__cuerpo {
padding: 18px;
}
.opcion {
font-size: 16px;
padding: 14px 16px;
}
.acciones .btn {
width: 100%;
}
}
@media print {
.inter__cab,
.gh-cta,
.gh-seguir,
.gh-privacidad {
display: none;
}
}
.gh-noscript{background:#fff8e0;border:1px solid #ffe9a3;border-radius:9px;padding:14px 18px;font-size:15.5px;color:var(--gh-gold-ink);margin:24px 0} .gh-firma {
max-width: 42em;
margin: 46px 0 44px;
padding: 28px 0 0;
border-top: 1px solid var(--gh-line);
}
.gh-firma__quien {
margin: 0 0 12px;
font-family: Arial, Helvetica, "Helvetica Neue", sans-serif;
font-size: 11.5px;
font-weight: 800;
letter-spacing: .11em;
text-transform: uppercase;
color: var(--gh-gold-ink);
}
.gh-firma p {
margin: 0 0 16px;
font-size: 16.5px;
line-height: 1.72;
color: var(--gh-text2);
}
.gh-firma strong {
color: var(--gh-ink);
font-weight: 700;
}
.gh-firma a {
color: var(--gh-ink);
text-decoration: underline;
text-decoration-color: var(--gh-gold-dark);
text-decoration-thickness: 2px;
text-underline-offset: 3px;
}
.gh-firma a:hover {
background: var(--gh-gold-soft);
}
.gh-firma__enlace {
margin: 0;
padding-top: 4px;
}
.gh-firma__enlace a {
font-family: Arial, Helvetica, "Helvetica Neue", sans-serif;
font-weight: 700;
font-size: 16px;
color: var(--gh-gold-ink);
text-decoration-color: var(--gh-gold);
}
.gh-firma__enlace a:hover {
background: none;
text-decoration-color: var(--gh-gold-dark);
} .gh-archivo .gh-bloque { scroll-margin-top: var(--gh-offset, 84px); }
@media (prefers-reduced-motion: no-preference) {
html:has(.gh-archivo) { scroll-behavior: smooth; }
}
.gh-temas { padding: 26px 0 6px; }
.gh-temas__titulo {
margin: 0 0 12px;
font-size: 13px;
font-weight: 800;
letter-spacing: .08em;
text-transform: uppercase;
color: var(--gh-gold-ink);
}
.gh-temas__lista,
.gh-barra__lista {
list-style: none;
margin: 0;
padding: 0;
}
.gh-temas__lista { display: flex; flex-wrap: wrap; gap: 8px; }
.gh-temas__lista li { margin: 0; padding: 0; }
.gh-temas__lista a {
display: inline-flex;
align-items: center;
gap: 8px;
padding: 9px 14px;
min-height: 44px;
border: 1.5px solid var(--gh-line);
border-radius: 999px;
background: #fff;
color: var(--gh-ink);
font-size: 15px;
font-weight: 700;
line-height: 1.2;
text-decoration: none;
}
.gh-temas__lista a span {
font-size: 12px;
font-weight: 800;
color: var(--gh-gold-ink);
background: var(--gh-gold-soft);
border-radius: 999px;
padding: 2px 8px;
}
.gh-temas__lista a:hover,
.gh-temas__lista a:focus-visible {
border-color: var(--gh-gold-dark);
background: var(--gh-gold-soft);
}
.gh-barra {
position: sticky;
top: 0;
z-index: 50;
background: rgba(255, 255, 255, .96);
border-bottom: 1px solid var(--gh-line);
box-shadow: 0 6px 18px rgba(11, 14, 17, .06);
}
.gh-barra[hidden] { display: none; }
.gh-barra__fila {
overflow-x: auto;
-webkit-overflow-scrolling: touch;
scrollbar-width: none;
padding: 8px 16px;
}
.gh-barra__fila::-webkit-scrollbar { display: none; }
.gh-barra__lista { display: flex; gap: 8px; width: max-content; margin: 0 auto; }
.gh-barra__lista li { margin: 0; padding: 0; flex: none; }
.gh-barra__lista a {
display: block;
padding: 8px 14px;
border-radius: 999px;
border: 1.5px solid var(--gh-line);
background: #fff;
color: var(--gh-ink);
font-size: 14px;
font-weight: 700;
white-space: nowrap;
text-decoration: none;
}
.gh-barra__lista a.es-activo {
background: var(--gh-gold);
border-color: var(--gh-gold-dark);
}
@media (max-width: 560px) {
.gh-temas__lista { gap: 6px; }
.gh-temas__lista a { padding: 7px 11px; min-height: 40px; font-size: 14px; }
}
@media print { .gh-temas, .gh-barra { display: none; } }