/* ==========================================
   GOM.CSS (PRO EDITION) 2026
   Paleta premium: Royal Plum (#48234e)
   ========================================== */

/* ===========================
   TOKENS / VARIABLES
   =========================== */

:root {
    /* Base */
    --gom-primary: #48234e;
    /* Royal Plum */
    --gom-secondary: #6a3475;
    /* Soft Plum */
    --gom-accent: #9b6aa5;
    /* Accent Lavender */
    --gom-dark: #1e1422;
    /* Ink Plum (fondo oscuro) */
    --gom-white: #f6f2f8;
    /* Fondo limpio lavanda */
    --gom-light: #cbb8d0;
    /* Lavanda claro */

    /* Compat con tu CSS existente */
    --gom-purple: var(--gom-primary);
    --gom-soft: var(--gom-white);
    --gom-blue: var(--gom-dark);
    --gom-green: #05755a;
    --gom-red: #e14249;

    /* Neutros */
    --gom-text: #1e1422;
    --gom-text-soft: #5c4a60;

    /* Bordes */
    --gom-border: rgba(72, 35, 78, 0.18);
    --gom-border-strong: rgba(72, 35, 78, 0.28);

    /* Sombras (neutras, no azules) */
    --shadow-sm: 0 8px 18px rgba(30, 20, 34, 0.08);
    --shadow-md: 0 12px 28px rgba(30, 20, 34, 0.12);
    --shadow-lg: 0 18px 45px rgba(30, 20, 34, 0.16);

    /* Radios */
    --r-sm: 10px;
    --r-md: 14px;
    --r-lg: 18px;

    /* Motion */
    --ease: cubic-bezier(.2, .8, .2, 1);
}

/* ===========================
   BASE / RESET
   =========================== */

* {
    box-sizing: border-box;
}

html {
    scroll-behavior: smooth;
}

body {
    margin: 0;
    font-family: "Open Sans", system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif;
    color: var(--gom-text);
    background: var(--gom-white);
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

img {
    max-width: 100%;
    height: auto;
}

a {
    color: inherit;
}

::selection {
    background: rgba(72, 35, 78, 0.22);
}

.container {
    width: min(1100px, 90%);
    margin: 0 auto;
}

:focus-visible {
    outline: none;
    box-shadow: 0 0 0 4px rgba(72, 35, 78, 0.22);
    border-radius: 10px;
}

/* ===========================
   HERO / BANNER (BASE)
   =========================== */

.banner-inner-service-details-1 {
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;

    background-color: var(--gom-primary);

    padding: 90px 0 80px;
    position: relative;
    overflow: hidden;
}

/* Overlay editorial premium */
.banner-inner-service-details-1::after {
    content: "";
    position: absolute;
    inset: 0;
    background:
        radial-gradient(900px 420px at 20% 20%, rgba(246, 242, 248, 0.14), transparent 60%),
        radial-gradient(900px 420px at 80% 10%, rgba(72, 35, 78, 0.32), transparent 65%),
        linear-gradient(180deg, rgba(30, 20, 34, 0.38), rgba(30, 20, 34, 0.80));
    z-index: 0;
}

.banner-inner-service-details-1>* {
    position: relative;
    z-index: 1;
}

.banner-inner-service-details-1 .title {
    color: var(--gom-purple) !important;
    font-weight: 900;
    line-height: 1.08;
    letter-spacing: 0.2px;
    margin-bottom: 18px;
    text-shadow: 0 10px 28px rgba(0, 0, 0, 0.18);
}

.gom-editorial-text,
.banner-inner-service-details-1 .disc {
    color: rgba(246, 242, 248, 0.92);
    font-size: 16px;
    line-height: 1.75;
    max-width: 760px;
    margin-bottom: 16px;
    opacity: 1;
}

.gom-editor {
    font-size: 14px;
    font-weight: 700;
    color: rgba(246, 242, 248, 0.88);
    margin-bottom: 14px;
}

.gom-related-journal a {
    font-size: 14px;
    font-weight: 800;
    color: var(--gom-white);
    text-decoration: underline;
    text-decoration-thickness: 2px;
    text-underline-offset: 3px;
    opacity: .95;
}

.gom-related-journal a:hover {
    opacity: 1;
}

.gom-femecog-logo {
    max-height: 120px;
    width: auto;
    display: inline-block;
    filter: drop-shadow(0 14px 34px rgba(0, 0, 0, .18));
}

.banner-inner-service-details-1 .bg-title {
    color: rgba(246, 242, 248, 0.10) !important;
}

/* Caja dentro del hero */
.gom-hero-box {
    background: rgba(246, 242, 248, 0.10);
    border: 1px solid rgba(246, 242, 248, 0.18);
    border-radius: var(--r-md);
    padding: 16px 18px;
    line-height: 1.85;
    color: rgba(246, 242, 248, 0.92);
    backdrop-filter: blur(6px);
}

/* ===========================
   HERO POR PÁGINA
   =========================== */

body.home .banner-inner-service-details-1 {
    background-image: url("/static/img/hero/fondo.png");
}

/* velo extra en home, ahora morado neutro */
body.home .banner-inner-service-details-1::before {
    content: "";
    position: absolute;
    inset: 0;
    background: rgba(206, 81, 255, 0.5);
    z-index: 0;
}

body.issue .banner-inner-service-details-1 {
    background-image: url("/static/img/hero/revistaban.png");
}

/* ===========================
   BOTONES (PRO)
   =========================== */

.rts-btn.btn-primary {
    background: var(--gom-primary) !important;
    border-color: var(--gom-primary) !important;
    color: #fff !important;
    border-radius: 12px;
    font-weight: 800;
    letter-spacing: .2px;
    box-shadow: var(--shadow-sm);
    transition: transform .12s var(--ease), box-shadow .18s var(--ease), filter .18s var(--ease);
}

.rts-btn.btn-primary:hover {
    background: var(--gom-secondary) !important;
    border-color: var(--gom-secondary) !important;
    transform: translateY(-1px);
    box-shadow: var(--shadow-md);
}

.rts-btn.btn-primary:active {
    transform: translateY(0px);
    box-shadow: var(--shadow-sm);
}

a.rts-btn.btn-border {
    display: inline-block;
    margin-bottom: 24px;
    border-radius: 12px;
}

/* CTA chip */
.gom-cta {
    background: var(--gom-primary);
    color: #fff;
    font-weight: 800;
    border-radius: 12px;
    padding: 10px 14px;
    text-decoration: none;
    box-shadow: var(--shadow-sm);
    transition: transform .12s var(--ease), box-shadow .18s var(--ease), background .18s var(--ease);
}

.gom-cta:hover {
    background: var(--gom-secondary);
    transform: translateY(-1px);
    box-shadow: var(--shadow-md);
}

/* CTA ghost */
.gom-cta-ghost {
    background: transparent !important;
    border: 1px solid var(--gom-border-strong) !important;
    color: var(--gom-primary) !important;
    box-shadow: none !important;
}

.gom-cta-ghost:hover {
    background: rgba(72, 35, 78, 0.08) !important;
}

/* ===========================
   SELECT / INPUTS (PRO)
   =========================== */

.form-select {
    border-radius: 12px;
    border: 1px solid var(--gom-border);
    padding: 12px 14px;
    font-size: 14px;
    background: rgba(255, 255, 255, 0.96);
    color: var(--gom-text);
    box-shadow: 0 8px 18px rgba(30, 20, 34, .05);
}

.form-select:focus {
    border-color: rgba(72, 35, 78, 0.55);
    box-shadow: 0 0 0 4px rgba(72, 35, 78, 0.14);
}

/* ===========================
   HEADER (GOM PRO)
   =========================== */

.gom-topbar {
    background: linear-gradient(90deg, var(--gom-dark), var(--gom-primary));
    color: #fff;
    text-align: center;
    padding: 10px 12px;
    font-size: 14px;
    font-weight: 700;
    letter-spacing: .2px;
}

/* Header base */
.gom-header {
    background: rgba(246, 242, 248, 0.92);
    border-bottom: 1px solid var(--gom-border);
    backdrop-filter: blur(6px);
}

.gom-header-row {
    display: flex;
    align-items: center;
    gap: 18px;
    padding: 16px 0;
}

.gom-brand img {
    height: 54px;
    width: auto;
}

/* ===========================
   SEARCH + NAV (PRO)
   =========================== */

.gom-search {
    display: flex;
    align-items: center;
    gap: 10px;

    background: #fff;
    border: 1px solid var(--gom-border);
    border-radius: 14px;
    padding: 10px 12px;

    min-width: 340px;
    max-width: 460px;
    flex: 1;

    box-shadow: 0 10px 22px rgba(30, 20, 34, .06);
    transition: border-color .15s var(--ease), box-shadow .15s var(--ease);
}

.gom-search:focus-within {
    border-color: rgba(72, 35, 78, 0.55);
    box-shadow: 0 0 0 4px rgba(72, 35, 78, 0.12), 0 10px 22px rgba(30, 20, 34, .06);
}

.gom-search input {
    border: 0;
    outline: none;
    width: 100%;
    font-size: 14px;
    color: var(--gom-text);
}

.gom-search input::placeholder {
    color: rgba(30, 20, 34, 0.45);
}

.gom-nav {
    display: flex;
    align-items: center;
    gap: 18px;
    margin-left: auto;
}

.gom-nav a {
    color: var(--gom-text);
    text-decoration: none;
    font-weight: 700;
    font-size: 14px;
    transition: color .15s var(--ease), opacity .15s var(--ease);
    opacity: .92;
}

.gom-nav a:hover {
    color: var(--gom-primary);
    opacity: 1;
}

/* ===========================
   LAYOUT / CARDS
   =========================== */

main {
    padding-bottom: 56px;
}

.gom-content,
.gom-card {
    background: #fff;
    border: 1px solid var(--gom-border);
    border-radius: 16px;
    box-shadow: 0 12px 28px rgba(30, 20, 34, .08);
}

.gom-content {
    padding: 26px;
}

.gom-card {
    padding: 16px;
}

.gom-divider {
    margin: 26px 0;
    border: 0;
    height: 1px;
    background: rgba(72, 35, 78, 0.14);
}

.gom-page-header h1 {
    color: var(--gom-dark);
    font-weight: 900;
    margin-bottom: 10px;
}

.gom-page-subtitle {
    color: var(--gom-text-soft);
    opacity: .95;
    max-width: 70ch;
    margin-bottom: 26px;
}

.gom-role {
    color: var(--gom-primary);
}

.gom-subtitle {
    color: var(--gom-dark);
}

/* Bloque descarga */
.gom-download {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 18px;
    flex-wrap: wrap;
}

.gom-download-btn {
    margin-left: auto;
    background: var(--gom-primary);
    color: #fff;
    text-decoration: none;
    font-weight: 900;
    padding: 12px 16px;
    border-radius: 12px;
    white-space: nowrap;
    box-shadow: var(--shadow-sm);
    transition: transform .12s var(--ease), box-shadow .18s var(--ease), background .18s var(--ease);
}

.gom-download-btn:hover {
    background: var(--gom-secondary);
    transform: translateY(-1px);
    box-shadow: var(--shadow-md);
}

/* Nota */
.gom-note {
    margin: 16px 0;
    padding: 14px 16px;
    border-radius: 14px;
    background: rgba(72, 35, 78, 0.08);
    border: 1px solid rgba(72, 35, 78, 0.18);
    color: var(--gom-text);
}

/* ===========================
   COVER (mini portada)
   =========================== */

.gom-cover {
    display: inline-block;
    flex-shrink: 0;
}

.gom-cover img {
    width: 150px;
    height: auto;
    border-radius: 14px;
    border: 1px solid var(--gom-border);
    box-shadow: var(--shadow-md);
    transition: transform .15s var(--ease), box-shadow .15s var(--ease);
}

.gom-cover:hover img {
    transform: translateY(-2px);
    box-shadow: var(--shadow-lg);
}

/* ===========================
   ADS (Home)
   =========================== */

.gom-ads {
    padding: 28px 0 70px;
}

.gom-ads-title {
    margin: 0 0 14px;
    font-weight: 900;
    color: var(--gom-dark);
    letter-spacing: .2px;
}

.gom-ads-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 16px;
    align-items: stretch;
}

.gom-ad-card {
    display: flex;
    flex-direction: column;
    text-decoration: none;
    color: inherit;

    background: #fff;
    border: 1px solid var(--gom-border);
    border-radius: 18px;
    overflow: hidden;

    box-shadow: 0 10px 26px rgba(30, 20, 34, .08);
    transition: transform .15s var(--ease), box-shadow .15s var(--ease), border-color .15s var(--ease);
    height: 100%;
}

.gom-ad-card:hover {
    transform: translateY(-2px);
    box-shadow: 0 14px 34px rgba(30, 20, 34, .14);
    border-color: var(--gom-border-strong);
}

.gom-ad-img {
    width: 100%;
    aspect-ratio: 7 / 5;
    background: rgba(203, 184, 208, 0.35);
}

.gom-ad-img img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}

.gom-ad-caption {
    margin: 0;
    padding: 10px 12px 12px;
    font-size: 13px;
    line-height: 1.35;
    color: var(--gom-text);
}

.gom-ad-caption strong {
    display: block;
    color: var(--gom-primary);
    font-weight: 900;
    font-size: 13.5px;
    margin-bottom: 4px;
}

/* ===========================
   FOOTER (PRO)
   =========================== */

.gom-footer {
    background: #43004f;
    /* deep plum */
    color: #ffffff;
    padding: 32px 0 26px;
}

.gom-footer-links {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 18px;
}

.gom-footer-links h4 {
    font-size: 16px;
    font-weight: 900;
    color: #fff;
    margin-bottom: 10px;
}

.gom-footer-links a {
    color: #ffffff;
    font-size: 13px;
    text-decoration: none;
    margin: 6px 0;
    display: block;
    opacity: .95;
}

.gom-footer-links a:hover {
    text-decoration: underline;
    opacity: 1;
}

.gom-footer-sep {
    height: 1px;
    background: rgba(255, 255, 255, .28);
    margin: 20px 0 18px;
}

.gom-footer-legal {
    text-align: center;
    font-size: 13px;
    line-height: 1.8;
    color: #ffffff;
    opacity: .95;
}

.gom-footer-legal p {
    margin: 10px 0;
}

.gom-powered {
    margin-top: 14px;
    opacity: .92;
}

/* Force theme overrides */
.gom-footer,
.gom-footer * {
    color: #ffffff !important;
}

.gom-footer,
.gom-footer p,
.gom-footer a,
.gom-footer span {
    opacity: 1 !important;
}

/* ===========================
   PAGE FIXES: /num
   =========================== */

body.issue .gom-hero-box {
    background: rgba(255, 255, 255, 0.94) !important;
    border: 1px solid var(--gom-border) !important;
    color: var(--gom-text) !important;
    box-shadow: 0 18px 45px rgba(30, 20, 34, 0.16);
    backdrop-filter: blur(10px);
}

body.issue .gom-hero-box .title,
body.issue .gom-hero-box h1,
body.issue .gom-hero-box h2 {
    color: var(--gom-dark) !important;
    text-shadow: none !important;
}

body.issue .gom-hero-box p,
body.issue .gom-hero-box .disc {
    color: rgba(30, 20, 34, 0.78) !important;
}

body.issue .banner-inner-service-details-1 .bg-title {
    color: rgba(72, 35, 78, 0.16) !important;
    text-shadow: none !important;
}

/* ===========================
   PAGE FIXES: /comite_editorial
   =========================== */

body.comite_editorial .gom-page {
    padding: 80px 0 110px;
}

body.comite_editorial .gom-page-wrap {
    max-width: 1150px;
}

body.comite_editorial .gom-content h2 {
    margin-top: 70px !important;
    margin-bottom: 18px !important;
    padding-bottom: 10px;
    border-bottom: 2px solid rgba(72, 35, 78, 0.12);
    font-size: 24px;
    font-weight: 900;
    letter-spacing: 0.3px;
    color: var(--gom-dark);
}

body.comite_editorial .gom-content h2:first-of-type {
    margin-top: 24px !important;
}

body.comite_editorial .gom-card {
    margin-top: 20px !important;
    margin-bottom: 50px !important;
    padding: 26px !important;

    border-radius: 20px !important;
    border: 1px solid var(--gom-border);

    background: linear-gradient(180deg, #ffffff, rgba(246, 242, 248, 0.65));
    box-shadow: 0 18px 45px rgba(30, 20, 34, 0.10) !important;
}

body.comite_editorial .gom-grid {
    gap: 26px !important;
    margin-top: 20px !important;
    margin-bottom: 36px !important;
}

body.comite_editorial .gom-content ul {
    padding-left: 24px !important;
    margin-top: 12px !important;
    margin-bottom: 36px !important;
}

body.comite_editorial .gom-content li {
    margin: 12px 0 !important;
    line-height: 1.9 !important;
    font-size: 15px;
    color: rgba(30, 20, 34, 0.82);
}

body.comite_editorial .gom-subtitle {
    margin-top: 36px !important;
    margin-bottom: 12px !important;
    font-size: 18px;
    font-weight: 800;
    color: var(--gom-primary);
}

/* ===========================
   AUTH / LOGIN / REGISTER (PRO UI)
   =========================== */

.gom-auth {
    min-height: calc(100vh - 220px);
    display: flex;
    align-items: center;
    padding: 80px 0 100px;
    background:
        radial-gradient(900px 400px at 15% 20%, rgba(72, 35, 78, 0.10), transparent 60%),
        radial-gradient(900px 400px at 85% 10%, rgba(203, 184, 208, 0.22), transparent 65%),
        linear-gradient(180deg, #ffffff, var(--gom-white));
}

.gom-auth-wrap {
    width: 100%;
    display: flex;
    justify-content: center;
}

.gom-auth-card {
    width: 100%;
    max-width: 440px;
    background: #ffffff;
    border: 1px solid var(--gom-border);
    border-radius: 22px;
    padding: 38px 36px 34px;
    box-shadow: 0 25px 55px rgba(30, 20, 34, 0.14), 0 4px 14px rgba(30, 20, 34, 0.08);
    transition: transform .18s var(--ease), box-shadow .18s var(--ease);
}

.gom-auth-card:hover {
    transform: translateY(-2px);
    box-shadow: 0 32px 70px rgba(30, 20, 34, 0.18), 0 6px 18px rgba(30, 20, 34, 0.10);
}

.gom-auth-head {
    text-align: center;
    margin-bottom: 26px;
}

.gom-auth-title {
    margin: 0 0 6px;
    font-size: 28px;
    font-weight: 900;
    letter-spacing: .3px;
    color: var(--gom-dark);
}

.gom-auth-subtitle {
    margin: 0;
    font-size: 14px;
    color: var(--gom-text-soft);
}

/* Alerts */
.gom-auth-alerts {
    margin-bottom: 18px;
}

.gom-alert {
    padding: 10px 12px;
    border-radius: 10px;
    font-size: 13px;
    margin-bottom: 8px;
}

.gom-alert-success {
    background: rgba(5, 117, 90, 0.10);
    color: #05755a;
    border: 1px solid rgba(5, 117, 90, 0.22);
}

.gom-alert-error {
    background: rgba(225, 66, 73, 0.10);
    color: #b83238;
    border: 1px solid rgba(225, 66, 73, 0.22);
}

/* Form */
.gom-auth-form {
    display: flex;
    flex-direction: column;
    gap: 18px;
}

.gom-field {
    display: flex;
    flex-direction: column;
    gap: 6px;
}

.gom-field span {
    font-size: 13px;
    font-weight: 700;
    color: var(--gom-text-soft);
}

.gom-field input,
.gom-auth-form--grid .gom-field select {
    width: 100%;
    padding: 12px 14px;
    border-radius: 12px;
    border: 1px solid var(--gom-border);
    font-size: 14px;
    color: var(--gom-text);
    background: rgba(255, 255, 255, 0.96);
    transition: border-color .15s var(--ease), box-shadow .15s var(--ease), background .15s var(--ease);
}

.gom-field input::placeholder {
    color: rgba(30, 20, 34, 0.45);
}

.gom-field input:focus,
.gom-auth-form--grid .gom-field select:focus {
    outline: none;
    border-color: rgba(72, 35, 78, 0.55);
    background: #fff;
    box-shadow: 0 0 0 4px rgba(72, 35, 78, 0.14);
}

.gom-auth-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    font-size: 13px;
}

.gom-check {
    display: flex;
    align-items: center;
    gap: 6px;
    cursor: pointer;
}

.gom-check input {
    accent-color: var(--gom-primary);
    cursor: pointer;
}

.gom-auth-link {
    color: var(--gom-primary);
    font-weight: 700;
    text-decoration: none;
    transition: color .15s var(--ease), opacity .15s var(--ease);
}

.gom-auth-link:hover {
    color: var(--gom-secondary);
    opacity: .95;
}

/* Botón submit premium */
.gom-auth-submit {
    width: 100% !important;
    min-height: 56px !important;
    padding: 16px 24px !important;
    font-size: 16px !important;
    font-weight: 900;
    line-height: 1.2 !important;
    border-radius: 16px !important;
    letter-spacing: .5px;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
}

.gom-auth-foot {
    margin: 16px 0 0;
    text-align: center;
    font-size: 13px;
    color: var(--gom-text-soft);
}

/* Register grid */
.gom-auth-card--wide {
    max-width: 860px;
}

.gom-auth-form--grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 18px 18px;
}

.gom-auth-wide {
    grid-column: 1 / -1;
}

.gom-check--big {
    padding: 12px 14px;
    border-radius: 14px;
    border: 1px solid var(--gom-border);
    background: rgba(72, 35, 78, 0.06);
}

.gom-field b {
    color: var(--gom-primary);
    font-weight: 900;
}

/* ===========================
   RESPONSIVE
   =========================== */

@media (max-width: 1100px) {
    .gom-search {
        min-width: 280px;
    }
}

@media (max-width: 900px) {
    .gom-header-row {
        flex-wrap: wrap;
    }

    .gom-nav {
        width: 100%;
        justify-content: center;
        order: 3;
    }

    .gom-search {
        width: 100%;
        max-width: none;
        order: 2;
    }

    .gom-footer-links {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .gom-femecog-logo {
        max-height: 90px;
        margin-top: 20px;
    }

    .gom-auth-form--grid {
        grid-template-columns: 1fr;
    }

    body.comite_editorial .gom-content h2 {
        font-size: 21px;
        margin-top: 48px !important;
    }

    body.comite_editorial .gom-card {
        padding: 20px !important;
        margin-bottom: 36px !important;
    }

    body.comite_editorial .gom-grid {
        gap: 18px !important;
    }
}

@media (max-width: 650px) {
    .gom-ads-grid {
        grid-template-columns: 1fr;
    }

    .gom-ad-img {
        aspect-ratio: 7 / 5;
    }

    .gom-download-btn {
        width: 100%;
        text-align: center;
    }
}

@media (max-width: 600px) {
    .gom-auth {
        padding: 50px 0 70px;
    }

    .gom-auth-card {
        padding: 28px 22px 26px;
        border-radius: 18px;
    }

    .gom-auth-title {
        font-size: 24px;
    }
}

/* ===========================
   THEME OVERRIDE (FORZADO)
   PÉGALO AL FINAL DEL ARCHIVO
   =========================== */

:root {
    --gom-dark: #622779 !important;
    --gom-primary: #4d1b55 !important;
    --gom-secondary: #6a3475 !important;
    --gom-light: #cbb8d0 !important;
    --gom-white: #f6f2f8 !important;

    /* Para reemplazar los rgba azules */
    --gom-primary-rgb: 72, 35, 78 !important;
    /* #48234e */
    --gom-dark-rgb: 30, 20, 34 !important;
    /* #1e1422 */
}

/* Topbar y CTA deben verse morados sí o sí */
.gom-topbar {
    background: linear-gradient(90deg, var(--gom-dark), var(--gom-primary)) !important;
}

.rts-btn.btn-primary,
.gom-cta {
    background: var(--gom-primary) !important;
    border-color: var(--gom-primary) !important;
}

.rts-btn.btn-primary:hover,
.gom-cta:hover {
    background: var(--gom-dark) !important;
    border-color: var(--gom-dark) !important;
}

/* ==========================================
   PATCH FIX: Blanco SOLO en HOME (hero)
   y títulos oscuros en /num (issue card)
   PÉGALO AL FINAL
   ========================================== */

/* 1) HOME: el título del hero va BLANCO */
body.home .banner-inner-service-details-1 .title,
body.home .banner-inner-service-details-1 h1 {
    color: #fff !important;
    text-shadow:
        0 2px 8px rgba(0, 0, 0, .25),
        0 10px 28px rgba(0, 0, 0, .18);
}

/* 2) ISSUE (/num): dentro del cuadro blanco, TODO el texto va OSCURO */
body.issue .banner-inner-service-details-1 .gom-hero-box,
body.issue .banner-inner-service-details-1 .gom-hero-box * {
    color: var(--gom-text) !important;
    text-shadow: none !important;
}

/* 3) ISSUE (/num): refuerzo por si el theme usa otro “card” en vez de .gom-hero-box */
body.issue .banner-inner-service-details-1 .service-details,
body.issue .banner-inner-service-details-1 .service-details *,
body.issue .banner-inner-service-details-1 .service-details-area,
body.issue .banner-inner-service-details-1 .service-details-area *,
body.issue .banner-inner-service-details-1 .service-details-wrapper,
body.issue .banner-inner-service-details-1 .service-details-wrapper * {
    color: var(--gom-text) !important;
    text-shadow: none !important;
}

/* 4) ISSUE (/num): títulos dentro del card blanco específicamente */
body.issue .banner-inner-service-details-1 .gom-hero-box h1,
body.issue .banner-inner-service-details-1 .gom-hero-box h2,
body.issue .banner-inner-service-details-1 .gom-hero-box .title {
    color: var(--gom-dark) !important;
}

/* ==========================================
   HEADER: FEMECOG badge (logo externo)
   ========================================== */

.gom-femecog-badge img {
    width: 40px;
    height: 40px;
    object-fit: contain;
    display: block;
}


.gom-femecog-badge:active {
    transform: translateY(0);
    box-shadow: var(--shadow-sm);
}

/* ==========================================
   HEADER CTA: Botón Login / Registro más ancho
   ========================================== */

.gom-cta {
    min-width: 160px;
    /* ancho mínimo */
    padding: 14px 22px;
    /* más aire lateral */
    line-height: 1.25;
    /* separa las líneas */
    text-align: center;

    display: inline-flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;

    white-space: normal;
    /* permite salto bonito */
}

/* En desktop grande: aún más presencia */
@media (min-width: 1100px) {
    .gom-cta {
        min-width: 180px;
    }
}

/* ==========================================
   HEADER NAV: compactar interlineado
   ========================================== */

.gom-nav a {
    line-height: 1.15;
    /* ← clave: reduce separación vertical */
    padding: 6px 0;
    /* quita aire innecesario arriba/abajo */
    text-align: center;
    max-width: 120px;
    /* controla el ancho para wraps más limpios */
}

/* Si se parte en dos líneas, que se vea compacto */
.gom-nav a br {
    display: none;
    /* evita saltos manuales si existieran */
}

/* ==========================================
   /num - Bloque editorial (intro antes de Casos clínicos)
   ========================================== */

.gom-issue-intro {
    background: linear-gradient(180deg, rgba(255, 255, 255, .92), rgba(255, 255, 255, .78));
    border: 1px solid var(--gom-border);
    border-radius: 18px;
    padding: 18px 18px;
    margin: 0 0 18px;
    box-shadow: var(--shadow-sm);
}

.gom-issue-intro-text {
    margin: 0 0 12px;
    color: rgba(255, 255, 255, .92);
    /* si tu fondo en /num es oscuro */
    line-height: 1.75;
    font-size: 14px;
    text-shadow: 0 10px 26px rgba(0, 0, 0, .18);
}

.gom-issue-intro-editor {
    margin: 0 0 0px;
    color: rgba(255, 255, 255, .90);
    font-size: 13.5px;
    text-shadow: 0 10px 26px rgba(0, 0, 0, .18);
}

.gom-issue-intro-link {
    display: inline-flex;
    align-items: center;
    gap: 8px;

    font-weight: 900;
    font-size: 13.5px;
    text-decoration: none;

    color: #fff;
    background: rgb(0, 82, 111);
    border: 1px solid rgba(255, 255, 255, .22);
    border-radius: 999px;
    padding: 10px 14px;

    box-shadow: 0 14px 34px rgba(0, 0, 0, .14);
    transition: transform .12s var(--ease), filter .18s var(--ease), background .18s var(--ease);
}

.gom-issue-intro-link:hover {
    transform: translateY(-1px);
    background: rgba(0, 92, 125, 0.78);
    filter: brightness(1.03);
}

/* Si el contenedor cae sobre fondo claro, esto lo ajusta automáticamente */
body.issue .rts-service-details-area-main-bottom .gom-issue-intro {
    background: #fff;
}

body.issue .rts-service-details-area-main-bottom .gom-issue-intro-text,
body.issue .rts-service-details-area-main-bottom .gom-issue-intro-editor {
    color: rgba(30, 20, 34, .84);
    text-shadow: none;
}

body.issue .rts-service-details-area-main-bottom .gom-issue-intro-link {
    color: #fff;
    background: var(--gom-primary);
    border-color: rgba(72, 35, 78, .18);
}

/* ==========================================
   /num - Badge Open Access
   ========================================== */

.gom-issue-badge {
    display: inline-block;

    margin-bottom: 14px;
    padding: 6px 14px;

    font-size: 12.5px;
    font-weight: 800;
    letter-spacing: .4px;
    text-transform: uppercase;
}

.gom-issue-badge:hover {
    filter: brightness(1.08);
    transform: translateY(-1px);
}

.gom-article-link {
    color: inherit;
    text-decoration: none;
    font-weight: 900;
}

.gom-article-link:hover {
    color: var(--gom-primary);
    text-decoration: underline;
    text-decoration-thickness: 2px;
    text-underline-offset: 4px;
}

/* ==========================================
   ARTICLE PAGE (PRO)
   Pegar al FINAL de gom.css
   ========================================== */

.gom-article {
    padding: 70px 0 100px;
    background:
        radial-gradient(900px 420px at 15% 15%, rgba(72, 35, 78, 0.10), transparent 60%),
        radial-gradient(900px 420px at 85% 10%, rgba(203, 184, 208, 0.22), transparent 65%),
        linear-gradient(180deg, #ffffff, var(--gom-white));
}

.gom-article-wrap {
    max-width: 980px;
    margin: 0 auto;
    background: #fff;
    border: 1px solid var(--gom-border);
    border-radius: 22px;
    padding: 34px;
    box-shadow: var(--shadow-lg);
}

.gom-article-actions {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin-bottom: 18px;
    flex-wrap: wrap;
}

.gom-article-title {
    margin: 0 0 8px;
    font-weight: 900;
    color: var(--gom-dark);
    letter-spacing: 0.2px;
}

.gom-article-subtitle {
    margin: 0 0 10px;
    color: var(--gom-text-soft);
    font-weight: 700;
}

.gom-article-authors {
    margin: 0 0 4px;
    color: rgba(30, 20, 34, 0.78);
    font-weight: 700;
}

.gom-article-body {
    line-height: 1.9;
    color: rgba(30, 20, 34, 0.86);
    font-size: 15px;
}

.gom-article-block {
    margin-top: 26px;
}

.gom-article-h2 {
    margin: 0 0 12px;
    padding-bottom: 10px;
    border-bottom: 1px solid rgba(72, 35, 78, 0.14);
    font-size: 20px;
    font-weight: 900;
    color: var(--gom-primary);
}

.gom-article-html p {
    margin: 10px 0;
}

.gom-article-html ul,
.gom-article-html ol {
    padding-left: 22px;
    margin: 10px 0 14px;
}

.gom-article-html li {
    margin: 8px 0;
}

.gom-fig-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 16px;
    margin-top: 14px;
}

.gom-fig {
    margin: 0;
    background: linear-gradient(180deg, #ffffff, rgba(246, 242, 248, 0.70));
    border: 1px solid rgba(72, 35, 78, 0.14);
    border-radius: 16px;
    overflow: hidden;
    box-shadow: var(--shadow-sm);
}

.gom-fig img {
    display: block;
    width: 100%;
    height: auto;
}

.gom-fig figcaption {
    padding: 10px 12px 12px;
    font-size: 13px;
    color: rgba(30, 20, 34, 0.74);
    line-height: 1.45;
}

.gom-refs ol {
    padding-left: 22px;
}

.gom-article-empty {
    padding: 18px 16px;
    border-radius: 14px;
    border: 1px solid rgba(72, 35, 78, 0.18);
    background: rgba(72, 35, 78, 0.06);
    color: rgba(30, 20, 34, 0.85);
}

.gom-ads--article {
    padding-top: 34px;
}

@media (max-width: 900px) {
    .gom-article-wrap {
        padding: 24px;
        border-radius: 18px;
    }

    .gom-fig-grid {
        grid-template-columns: 1fr;
    }
}

.gom-fig {
    margin: 18px 0;
    border-radius: 16px;
    overflow: hidden;
    border: 1px solid var(--gom-border);
    background: #fff;
    box-shadow: var(--shadow-sm);
}

.gom-fig img {
    display: block;
    width: 100%;
    max-width: 420px;
    /* 🔥 tamaño editorial */
    max-height: 320px;
    /* 🔥 límite vertical */
    object-fit: contain;
    margin: 0 auto;
}

.gom-fig {
    text-align: center;
}

.gom-fig figcaption {
    padding: 10px 12px;
    font-size: 13px;
    color: var(--gom-text-soft);
}

.gom-article-h3 {
    margin: 16px 0 8px;
    font-weight: 900;
    color: var(--gom-primary);
}

/* =========================
HEADER EDITORIAL
========================= */

.gom-article-meta {
    margin-top: 16px;
    font-size: 0.95rem;
    color: var(--gom-text-soft);
    line-height: 1.6;
}

.gom-meta-authors {
    font-weight: 700;
    color: var(--gom-dark);
    margin-bottom: 8px;
}

.gom-meta-affiliations p {
    margin: 2px 0;
    font-size: 1.3rem;
}

.gom-meta-correspondence,
.gom-meta-doi {
    margin-top: 30px;
}

.gom-meta-doi a {
    color: var(--gom-primary);
    text-decoration: none;
}

.gom-meta-doi a:hover {
    text-decoration: underline;
}

.gom-meta-dates {
    display: flex;
    flex-wrap: wrap;
    gap: 14px;
    margin-top: 8px;
    font-size: 1.4rem;
}

.gom-meta-cite {
    background: #f7f8fa;
    border-left: 4px solid var(--gom-primary);
    padding: 12px 16px;
    margin-top: 16px;
    border-radius: 6px;
}

.gom-meta-cite-text {
    margin: 6px 0 0;
    font-style: italic;
}

.gom-author-link {
    color: var(--gom-primary);
    text-decoration: none;
    font-weight: 700;
}

.gom-author-link:hover {
    text-decoration: underline;
}

.gom-meta-affiliations {
    margin-top: 12px;
    font-size: 0.95rem;
    color: #555;
    line-height: 1.5;
}

.gom-meta-affiliations p {
    margin: 4px 0;
}

.gom-orcid-icon {
    width: 14px;
    height: 14px;
    margin-left: 4px;
    vertical-align: middle;
    opacity: 0.9;
}

.gom-orcid-icon:hover {
    opacity: 1;
}

/* ============================
   Botón Enviar comentario
============================ */

.gom-article-comment {
    margin: 40px 0 10px;
    text-align: center;
}

.gom-btn-comment {
    display: inline-block;
    background: linear-gradient(135deg, #5a1c6f, #7a2c8f);
    color: #fff;
    padding: 12px 26px;
    border-radius: 999px;
    font-weight: 700;
    font-size: 14px;
    text-decoration: none;
    box-shadow: 0 6px 18px rgba(90, 28, 111, 0.25);
    transition: all 0.25s ease;
}

.gom-btn-comment:hover {
    transform: translateY(-2px);
    box-shadow: 0 10px 24px rgba(90, 28, 111, 0.35);
    background: linear-gradient(135deg, #6a2380, #8b3aa3);
}


sup {
    font-size: 0.7em;
    position: relative;
    top: -0.4em;
}

.gom-article sup {
    font-size: 0.7em;
    vertical-align: super;
    line-height: 0;
    color: #555;
}

.yt-card {
    max-width: 900px;
    margin: 16px 0;
}

.yt-thumb,
.yt-embed {
    position: relative;
    width: 100%;
    aspect-ratio: 16 / 9;
    border-radius: 12px;
    overflow: hidden;
    background-size: cover;
    background-position: center;
}

.yt-thumb {
    cursor: pointer;
}

.yt-play {
    position: absolute;
    inset: 0;
    border: 0;
    background: transparent;
    cursor: pointer;
}

.yt-play::before {
    content: "";
    position: absolute;
    left: 50%;
    top: 50%;
    width: 74px;
    height: 52px;
    transform: translate(-50%, -50%);
    border-radius: 14px;
    background: rgba(0, 0, 0, .55);
}

.yt-play::after {
    content: "";
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-35%, -50%);
    width: 0;
    height: 0;
    border-left: 18px solid white;
    border-top: 12px solid transparent;
    border-bottom: 12px solid transparent;
}

.yt-embed iframe {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
}

.yt-title {
    margin-top: 8px;
    font-weight: 600;
}

/* ==========================
   SEARCH (Resultados)
   ========================== */

.gom-search-page {
    padding: 48px 0 64px;
}

.gom-search-hero {
    display: flex;
    gap: 18px;
    align-items: flex-end;
    justify-content: space-between;
    padding: 22px 22px;
    border-radius: 18px;
    background: rgba(255, 255, 255, .75);
    backdrop-filter: blur(10px);
    border: 1px solid rgba(0, 0, 0, .06);
    box-shadow: 0 10px 30px rgba(0, 0, 0, .06);
    margin-bottom: 26px;
}

.gom-search-title {
    margin: 0;
    font-size: 36px;
    line-height: 1.05;
    letter-spacing: -0.02em;
}

.gom-search-subtitle {
    margin: 10px 0 0;
    color: rgba(0, 0, 0, .65);
    font-size: 15px;
    display: flex;
    gap: 10px;
    align-items: center;
    flex-wrap: wrap;
}

.gom-search-q {
    color: rgba(0, 0, 0, .9);
    font-weight: 700;
}

.gom-search-count {
    display: inline-flex;
    align-items: center;
    padding: 6px 10px;
    border-radius: 999px;
    background: rgba(86, 35, 117, .08);
    /* morado suave */
    color: rgba(86, 35, 117, .95);
    font-weight: 700;
    font-size: 12px;
}

.gom-search-inline {
    display: flex;
    gap: 10px;
    align-items: center;
    min-width: 360px;
    max-width: 520px;
    width: 100%;
    padding: 10px 12px;
    border-radius: 14px;
    border: 1px solid rgba(0, 0, 0, .08);
    background: #fff;
}

.gom-search-inline input {
    border: none;
    outline: none;
    width: 100%;
    font-size: 14px;
    background: transparent;
}

.gom-search-inline button {
    border: none;
    cursor: pointer;
    border-radius: 12px;
    padding: 10px 12px;
    background: rgba(86, 35, 117, .10);
}

.gom-search-inline button:hover {
    background: rgba(86, 35, 117, .16);
}

.gom-results-grid {
    display: grid;
    grid-template-columns: 1fr 320px;
    gap: 18px;
    align-items: start;
}

.gom-results-list {
    display: grid;
    gap: 14px;
}

.gom-result-card {
    background: rgba(255, 255, 255, .85);
    border: 1px solid rgba(0, 0, 0, .06);
    border-radius: 18px;
    padding: 18px 18px;
    box-shadow: 0 10px 30px rgba(0, 0, 0, .05);
}

.gom-result-top {
    display: flex;
    justify-content: flex-end;
    margin-bottom: 10px;
}

.gom-result-badge {
    font-size: 12px;
    font-weight: 800;
    padding: 7px 10px;
    border-radius: 999px;
    background: rgba(86, 35, 117, .10);
    color: rgba(86, 35, 117, .95);
}

.gom-result-title {
    margin: 0 0 8px;
    font-size: 20px;
    line-height: 1.2;
    letter-spacing: -0.01em;
}

.gom-result-title a {
    color: rgba(0, 0, 0, .92);
    text-decoration: none;
}

.gom-result-title a:hover {
    text-decoration: underline;
}

.gom-result-meta {
    margin: 0 0 12px;
    color: rgba(0, 0, 0, .62);
    font-size: 13px;
}

.gom-result-actions {
    display: flex;
    justify-content: flex-start;
}

.gom-result-link {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    font-weight: 800;
    font-size: 13px;
    color: rgba(86, 35, 117, .95);
    text-decoration: none;
}

.gom-result-link:hover {
    text-decoration: underline;
}

.gom-results-side {
    display: grid;
    gap: 14px;
    position: sticky;
    top: 120px;
}

.gom-side-card {
    background: rgba(255, 255, 255, .85);
    border: 1px solid rgba(0, 0, 0, .06);
    border-radius: 18px;
    padding: 16px 16px;
    box-shadow: 0 10px 30px rgba(0, 0, 0, .05);
}

.gom-side-card h3 {
    margin: 0 0 10px;
    font-size: 14px;
    font-weight: 900;
}

.gom-side-card ul {
    margin: 0;
    padding-left: 18px;
    color: rgba(0, 0, 0, .68);
    font-size: 13px;
    display: grid;
    gap: 8px;
}

.gom-side-card .muted {
    margin: 0;
    color: rgba(0, 0, 0, .6);
    font-size: 13px;
}

.gom-empty {
    padding: 26px;
    border-radius: 18px;
    background: rgba(255, 255, 255, .75);
    border: 1px solid rgba(0, 0, 0, .06);
}

/* Responsive */
@media (max-width: 992px) {
    .gom-results-grid {
        grid-template-columns: 1fr;
    }

    .gom-results-side {
        position: static;
    }

    .gom-search-hero {
        flex-direction: column;
        align-items: stretch;
    }

    .gom-search-inline {
        min-width: 0;
        max-width: none;
    }
}
.gom-ai-summary {
    margin-top: 18px;
    padding: 18px;
    border-radius: 18px;
    background: rgba(255, 255, 255, .88);
    border: 1px solid rgba(0, 0, 0, .06);
    box-shadow: 0 10px 28px rgba(30, 20, 34, .05);
}

.gom-ai-summary-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin-bottom: 10px;
}

.gom-ai-summary-head h3 {
    margin: 0;
    font-size: 16px;
    font-weight: 900;
}

.gom-ai-summary-btn {
    border: 0;
    cursor: pointer;
    border-radius: 12px;
    padding: 10px 12px;
    font-weight: 900;
    font-size: 13px;
    background: rgba(72, 35, 78, .10);
    color: rgba(72, 35, 78, .95);
}

.gom-ai-summary-btn:hover {
    background: rgba(72, 35, 78, .16);
}

.gom-ai-summary-body p {
    margin: 0 0 8px;
    color: rgba(30, 20, 34, .80);
    font-size: 14px;
}

.gom-ai-summary-body .muted {
    color: rgba(30, 20, 34, .60);
}

/* ===========================
   AI SUMMARY (PRO)
   =========================== */

.gom-ai-summary {
    position: relative;
    padding: 22px 24px 20px;
    border-radius: 18px;

    background: linear-gradient(145deg,
            rgba(72, 35, 78, 0.06),
            rgba(72, 35, 78, 0.02));

    border: 1px solid rgba(72, 35, 78, 0.18);

    box-shadow:
        0 10px 25px rgba(72, 35, 78, 0.08),
        0 0 0 1px rgba(255, 255, 255, 0.6) inset;

    transition: transform .25s ease, box-shadow .25s ease;
}

.gom-ai-summary:hover {
    transform: translateY(-2px);
    box-shadow:
        0 14px 30px rgba(72, 35, 78, 0.12),
        0 0 0 1px rgba(255, 255, 255, 0.6) inset;
}


/* Head */
.gom-ai-summary-head {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 16px;
}

.gom-ai-summary-btn {
    background: var(--gom-primary);
    color: #fff;
    border: 0;
    padding: 8px 16px;
    border-radius: 10px;
    font-weight: 600;
    font-size: 13px;
    cursor: pointer;
    transition: all .2s ease;
}

.gom-ai-summary-btn:hover {
    background: #3c1e44;
    transform: translateY(-1px);
}

.gom-ai-summary-btn:disabled {
    opacity: .6;
    cursor: not-allowed;
}

/* Body */
.gom-ai-summary-body p {
    margin: 8px 0;
    line-height: 1.6;
    font-size: 14px;
    color: var(--gom-text);
}

/* Idea central destacada */
.gom-ai-summary-body p:last-child {
    margin-top: 14px;
    padding-top: 12px;
    border-top: 1px solid rgba(72, 35, 78, .15);
    font-weight: 600;
    color: var(--gom-primary);
}
/* =========================
   Últimos números - Premium editorial
   ========================= */

.gom-latest {
    padding: 54px 0;
}

.gom-latest-head {
    margin-bottom: 22px;
}

.gom-latest-title {
    margin: 0;
    font-weight: 900;
    letter-spacing: -0.3px;
}

.gom-latest-subtitle {
    margin: 8px 0 0;
    opacity: .75;
}

.gom-latest-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 26px;
    margin-top: 24px;
}

@media (max-width: 992px) {
    .gom-latest-grid {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 640px) {
    .gom-latest-grid {
        grid-template-columns: 1fr;
    }
}

.gom-issue-card {
    display: flex;
    flex-direction: column;
    text-decoration: none;
    color: inherit;
    border-radius: 22px;
    overflow: hidden;

    background: rgba(255, 255, 255, 0.72);
    border: 1px solid rgba(20, 10, 30, 0.10);
    box-shadow: 0 18px 50px rgba(0, 0, 0, 0.16);

    transition: transform 220ms ease, box-shadow 220ms ease, border-color 220ms ease;
}

.gom-issue-card:hover {
    transform: translateY(-7px);
    border-color: rgba(120, 60, 200, 0.35);
    box-shadow: 0 28px 70px rgba(0, 0, 0, 0.22);
}

/* Thumb vertical tipo revista */
.gom-issue-thumb {
    position: relative;
    aspect-ratio: 3 / 4;
    background: linear-gradient(180deg, rgba(20, 12, 28, 0.92), rgba(15, 15, 20, 0.92));
    overflow: hidden;
}

/* Overlay sutil para que todo se vea “editorial” */
.gom-issue-thumb::after {
    content: "";
    position: absolute;
    inset: 0;
    background:
        linear-gradient(180deg, rgba(0, 0, 0, 0.08), rgba(0, 0, 0, 0.28) 70%, rgba(0, 0, 0, 0.35));
    pointer-events: none;
}

.gom-issue-thumb img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: top;
    display: block;
    transform: scale(1.01);
    transition: transform 320ms ease, filter 320ms ease;
    filter: saturate(1.05) contrast(1.03);
}

.gom-issue-card:hover .gom-issue-thumb img {
    transform: scale(1.05);
    filter: saturate(1.10) contrast(1.05);
}

/* Badge más legible y bonito */
.gom-issue-badge {
    position: absolute;
    top: 14px;
    left: 100px;
    padding: 7px 12px;
    font-size: 12px;
    font-weight: 900;
    letter-spacing: .6px;
    border-radius: 999px;

    color: rgba(136, 0, 148, 0.92);
    background: rgba(55, 18, 95, 0);
    border: 1px solid rgba(255, 255, 255, 0.22);
    backdrop-filter: blur(10px);
}

/* Cuerpo */
.gom-issue-body {
    padding: 16px 16px 18px;
    background: rgba(255, 255, 255, 0.86);
}

.gom-issue-title {
    margin: 0;
    font-size: 16px;
    font-weight: 900;
    line-height: 1.25;
    color: rgba(18, 10, 28, 0.92);
}

/* CTA tipo botón (se ve más pro que texto suelto) */
.gom-issue-cta {
    margin-top: 12px;
    display: inline-flex;
    align-items: center;
    gap: 10px;

    padding: 10px 12px;
    border-radius: 12px;
    font-size: 13px;
    font-weight: 800;

    background: rgba(80, 30, 140, 0.08);
    border: 1px solid rgba(80, 30, 140, 0.16);
    color: rgba(30, 16, 45, 0.92);

    transition: background 220ms ease, border-color 220ms ease;
}

.gom-issue-card:hover .gom-issue-cta {
    background: rgba(80, 30, 140, 0.12);
    border-color: rgba(80, 30, 140, 0.22);
}

.gom-result-tags {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-top: 8px;
}

.gom-tag {
    display: inline-block;
    padding: 6px 10px;
    border-radius: 999px;
    background: rgba(120, 82, 255, 0.10);
    color: #4b2cc4;
    font-size: 0.85rem;
    line-height: 1;
    border: 1px solid rgba(120, 82, 255, 0.18);
}
/* =========================================
   PATCH: HERO más horizontal + compacto + glass
   (usa tus clases reales del HTML)
   Pégalo al FINAL de tu CSS
========================================= */

/* 1) Quita altura excesiva del wrapper */
.breadcrumb-service-detals-one {
    padding-top: 18px !important;
    padding-bottom: 18px !important;
}

/* Si el tema mete mucho padding por default */
.breadcrumb-service-detals-one .container-full {
    padding-left: 0 !important;
    padding-right: 0 !important;
}

/* 2) El “cuadro blanco” (tu banner) más horizontal y menos alto */
.banner-inner-service-details-1.large-height {
    min-height: auto !important;
    padding: 26px 0 !important;
    /* antes suele ser enorme */
}

/* 3) Contenedor interno más ancho para que no crezca hacia abajo */
.banner-inner-service-details-1 .container {
    max-width: 1200px !important;
}

/* 4) La tarjeta/área de texto con efecto glass + menos padding */
.banner-inner-service-details-1 .title-area-left {
    max-width: 980px;
    padding: 22px 28px !important;

    background: rgba(255, 255, 255, 0.72) !important;
    /* más transparente */
    border: 1px solid rgba(255, 255, 255, 0.35);
    border-radius: 18px;

    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);

    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.10);
}

/* 5) Badge más compacto */
.banner-inner-service-details-1 .gom-issue-badge {
    font-size: 12.5px !important;
    letter-spacing: 0.2px;
    margin-bottom: 10px !important;
    opacity: 0.9;
}

/* 6) Título (Vol. 3...) un poquito menor para que no “empuje” todo */
.banner-inner-service-details-1 h1.title {
    font-size: clamp(34px, 4vw, 56px) !important;
    line-height: 1.05 !important;
    margin-bottom: 12px !important;
}

/* 7) Texto descriptivo más pequeño y legible, sin pared */
.banner-inner-service-details-1 p.disc {
    font-size: 15px !important;
    line-height: 1.55 !important;
    max-width: 78ch;
    margin-bottom: 12px !important;
    opacity: 0.92;
}

/* 8) Editor y texto “Selecciona un número…” más compactos */
.banner-inner-service-details-1 .gom-issue-intro-editor {
    font-size: 13.5px !important;
    line-height: 1.35 !important;
    margin-top: 8px !important;
    margin-bottom: 8px !important;
    opacity: 0.95;
}

/* 9) Link del sitio más bonito y sin inflar el alto */
.banner-inner-service-details-1 .gom-issue-intro-link {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    margin-top: 6px;
    margin-bottom: 10px;
    font-size: 14px !important;
    text-decoration: none;
    border-radius: 999px;
    padding: 10px 14px;
    background: rgba(0, 0, 0, 0.06);
}

/* 10) Select: menos alto, más pro */
.banner-inner-service-details-1 .form-select {
    font-size: 14px !important;
    padding: 12px 14px !important;
    border-radius: 14px !important;
}

/* 11) Responsive: que siga viéndose elegante */
@media (max-width: 992px) {
    .banner-inner-service-details-1 .title-area-left {
        max-width: 100%;
        padding: 18px 16px !important;
        background: rgba(255, 255, 255, 0.84) !important;
        /* + legible en móvil */
    }

    .banner-inner-service-details-1 h1.title {
        font-size: clamp(30px, 8vw, 46px) !important;
    }
}
/* =========================================
   PATCH V2: Centrado + botón institucional + badge ordenado
========================================= */

/* 1) Centrar todo el bloque */
.banner-inner-service-details-1 .title-area-left {
  margin: 0 auto !important;
  text-align: center !important;
  max-width: 920px;
}

/* 2) Badge Open Access separado y limpio */
.banner-inner-service-details-1 .gom-issue-badge {
  display: inline-block;
  margin-bottom: 18px !important;
  font-size: 13px !important;
  font-weight: 500;
  padding: 6px 14px;
  border-radius: 999px;
  background: rgba(0, 76, 99, 0.08);
  color: #004c63;
}

/* Evita que se encime con el título */
.banner-inner-service-details-1 h1.title {
  margin-top: 8px !important;
}

/* 3) Título centrado elegante */
.banner-inner-service-details-1 h1.title {
  font-size: clamp(34px, 4vw, 52px) !important;
  line-height: 1.05;
  margin-bottom: 16px !important;
}

/* 4) Texto descriptivo centrado y contenido */
.banner-inner-service-details-1 p.disc {
  margin-left: auto;
  margin-right: auto;
  max-width: 70ch;
  font-size: 15px !important;
  line-height: 1.6;
}

/* 5) Editor centrado */
.banner-inner-service-details-1 .gom-issue-intro-editor {
  margin-top: 12px !important;
  margin-bottom: 8px !important;
}

/* 6) Botón institucional obligatorio */
.banner-inner-service-details-1 .gom-issue-intro-link {
  display: inline-block;
  margin: 14px auto 12px auto;
  padding: 12px 20px;
  border-radius: 999px;
  background: #004c63 !important;
  color: #ffffff !important;
  font-weight: 600;
  text-decoration: none;
  transition: all 0.25s ease;
}

/* Hover elegante */
.banner-inner-service-details-1 .gom-issue-intro-link:hover {
  background: #006b87 !important;
  transform: translateY(-2px);
  box-shadow: 0 8px 20px rgba(0, 76, 99, 0.25);
}

/* 7) Select centrado */
.banner-inner-service-details-1 .form-select {
  margin: 0 auto;
  font-size: 14px !important;
  border-radius: 14px !important;
  padding: 12px 14px !important;
}

/* 8) Responsive fino */
@media (max-width: 992px) {
  .banner-inner-service-details-1 .title-area-left {
    padding: 20px 16px !important;
  }

  .banner-inner-service-details-1 h1.title {
    font-size: clamp(28px, 8vw, 42px) !important;
  }
}
/* =========================================
   PATCH V3: centrar tarjeta + des-encimar badge + centrar select
========================================= */

/* 1) CENTRADO REAL del cuadro (tarjeta) */
.banner-inner-service-details-1 .container,
.banner-inner-service-details-1 .container>.row,
.banner-inner-service-details-1 .container>.row>.col-lg-12 {
    width: 100% !important;
}

.banner-inner-service-details-1 .container>.row {
    display: flex !important;
    justify-content: center !important;
}

.banner-inner-service-details-1 .container>.row>.col-lg-12 {
    display: flex !important;
    justify-content: center !important;
}

.banner-inner-service-details-1 .title-area-left {
    margin-left: auto !important;
    margin-right: auto !important;
    width: min(920px, 100%) !important;
    /* esto lo deja centrado y con límite */
    text-align: center !important;
}

/* 2) BADGE: que NO flote encima del título (mata absolute/transform del tema) */
.banner-inner-service-details-1 .gom-issue-badge {
    position: static !important;
    transform: none !important;
    top: auto !important;
    left: auto !important;
    right: auto !important;

    display: inline-block !important;
    margin: 0 auto 18px auto !important;
    /* separación real */
    padding: 6px 14px !important;
    border-radius: 999px;
    background: rgba(0, 76, 99, 0.10) !important;
    color: #004c63 !important;
    font-size: 13px !important;
    line-height: 1.2 !important;
    z-index: 1;
}

/* Extra: si el tema le mete margen raro al título, lo controlamos */
.banner-inner-service-details-1 h1.title {
    margin-top: 0 !important;
    padding-top: 0 !important;
}

/* 3) CENTRAR el select aunque tenga wrapper con estilos inline */
.banner-inner-service-details-1 .form-select {
    display: block !important;
    margin-left: auto !important;
    margin-right: auto !important;
    max-width: 520px !important;
    /* igual a tu inline */
}

/* Si el wrapper del select se queda raro por el inline, lo forzamos */
.banner-inner-service-details-1 .title-area-left>div {
    margin-left: auto !important;
    margin-right: auto !important;
}

/* 4) Botón institucional (por si algún estilo del tema lo pisa) */
.banner-inner-service-details-1 .gom-issue-intro-link {
    background: #004c63 !important;
    color: #ffffff !important;
}

/* =========================================
   CENTRADO ABSOLUTO REAL DEL HERO
========================================= */

/* Quitamos influencia del grid */
.banner-inner-service-details-1 .container,
.banner-inner-service-details-1 .row,
.banner-inner-service-details-1 .col-lg-12 {
    position: static !important;
}

/* Centramos la tarjeta usando margin auto real */
.banner-inner-service-details-1 .title-area-left {
    position: relative !important;
  
    transform: translateX(-50%) !important;

    width: min(920px, 92%) !important;
    margin: 0 !important;
}

/* Asegura que el fondo no empuje */
.banner-inner-service-details-1 {
    display: flex !important;
    justify-content: center !important;
}

/* Por si el theme mete padding lateral oculto */
.banner-inner-service-details-1 .container {
    padding-left: 0 !important;
    padding-right: 0 !important;
}
/* =========================================
   GLASS (Paleta GOM Plum) para Casos clínicos
   Usa tus variables:
   --gom-primary, --gom-secondary, --gom-accent,
   --gom-dark, --gom-white, --gom-light
========================================= */

/* Sección: menos espacio muerto */
.rts-service-details-area-main-bottom {
    padding-bottom: 34px !important;
}

/* Títulos centrados con tu identidad */
.rts-service-details-area-main-bottom h3.title {
    text-align: center;
    font-size: 22px;
    margin-bottom: 14px !important;
    color: var(--gom-dark);
}

.rts-service-details-area-main-bottom h4 {
    text-align: center;
    font-size: 18px;
    margin: 18px 0 12px !important;
    color: var(--gom-dark);
    opacity: 0.95;
}

/* Cards glass con tinte lavanda */
.gom-pdf-main,
.gom-pdf-supl {
    border-radius: 16px !important;
    border: 1px solid rgba(155, 106, 165, 0.28) !important;
    /* --gom-accent tint */
    background: rgba(246, 242, 248, 0.70) !important;
    /* --gom-white tint */
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
    box-shadow: 0 12px 26px rgba(30, 20, 34, 0.12);
    /* --gom-dark tint */
    overflow: hidden;
    transition: transform .2s ease, box-shadow .2s ease, border-color .2s ease;
}

.gom-pdf-main:hover,
.gom-pdf-supl:hover {
    transform: translateY(-2px);
    border-color: rgba(155, 106, 165, 0.42) !important;
    box-shadow: 0 16px 34px rgba(30, 20, 34, 0.14);
}

/* Body más compacto */
.gom-pdf-main .card-body,
.gom-pdf-supl .card-body {
    padding: 16px 18px !important;
    gap: 14px !important;
}

/* Cover estilo “portada” */
.gom-cover {
    display: inline-block;
    border-radius: 14px;
    overflow: hidden;
    box-shadow: 0 10px 18px rgba(30, 20, 34, 0.14);
    border: 1px solid rgba(203, 184, 208, 0.55);
    /* --gom-light tint */
}

.gom-cover img {
    width: 120px;
    height: 150px;
    object-fit: cover;
    display: block;
}

/* Chip */
.gom-chip {
    display: inline-block;
    font-size: 12px;
    padding: 6px 12px;
    border-radius: 999px;
    background: rgba(155, 106, 165, 0.14);
    /* --gom-accent tint */
    color: var(--gom-primary);
    font-weight: 700;
}

/* Links y títulos */
.gom-article-link {
    color: var(--gom-dark);
    text-decoration: none;
}

.gom-article-link:hover {
    color: var(--gom-secondary);
    text-decoration: underline;
}

/* Texto secundario */
.gom-pdf-main .card-text,
.gom-pdf-supl .card-text {
    font-size: 14px;
    line-height: 1.5;
    color: rgba(30, 20, 34, 0.82);
    /* --gom-dark tint */
}

/* Botones: respetan paleta plum */
.rts-btn.btn-primary {
    background: var(--gom-primary) !important;
    border-color: var(--gom-primary) !important;
    color: var(--gom-white) !important;
    border-radius: 999px !important;
    font-weight: 800;
}

.rts-btn.btn-primary:hover {
    background: var(--gom-secondary) !important;
    border-color: var(--gom-secondary) !important;
}

/* Outline / Border button */
.rts-btn.btn-border {
    border-radius: 999px !important;
    border: 1px solid rgba(106, 52, 117, 0.55) !important;
    /* --gom-secondary tint */
    color: var(--gom-secondary) !important;
    background: rgba(246, 242, 248, 0.55) !important;
    /* --gom-white tint */
    font-weight: 800;
}

.rts-btn.btn-border:hover {
    background: rgba(155, 106, 165, 0.12) !important;
    /* --gom-accent tint */
    border-color: rgba(106, 52, 117, 0.75) !important;
}

/* Alineación botón en cards */
.gom-pdf-main .flex-shrink-0,
.gom-pdf-supl .flex-shrink-0 {
    display: flex;
    align-items: center;
    justify-content: center;
}

/* Centrar el bloque general (incluye “Volver”) */
.rts-service-details-area-main-bottom>.container>.row>.col-lg-8 {
    text-align: center;
}

/* Responsive */
@media (max-width: 768px) {
    .gom-cover img {
        width: 96px;
        height: 120px;
    }

    .gom-pdf-main .card-body,
    .gom-pdf-supl .card-body {
        padding: 14px 14px !important;
    }
}
.banner-inner-service-details-1 .title-area-left {
    border: 1px solid rgba(155, 106, 165, 0.22) !important;
    box-shadow: 0 18px 44px rgba(30, 20, 34, 0.16) !important;
}

.banner-inner-service-details-1 .title-area-left p.disc {
    opacity: 0.88;
}
.banner-inner-service-details-1 {
    padding-bottom: 120px !important;
    /* más fondo visible */
}

.rts-service-details-area-main-bottom {
    margin-top: -130px;
}

/* =========================================
   HEADER GOM v2: TRUE GLASS + NO ENCIMES
   (sobre-escribe estilos previos)
========================================= */

/* TOPBAR */
.gom-topbar {
    background: linear-gradient(90deg, var(--gom-primary), var(--gom-secondary));
    color: var(--gom-white);
    text-align: center;
    font-weight: 700;
    font-size: 13px;
    padding: 10px 14px;
}

/* HEADER glass REAL */
.gom-header {
    position: sticky;
    top: 0;
    z-index: 999;

    /* glass visible */
    background: rgba(246, 242, 248, 0.62) !important;
    /* más transparente para que se note */
    backdrop-filter: blur(14px);
    -webkit-backdrop-filter: blur(14px);

    border-bottom: 1px solid rgba(155, 106, 165, 0.22);
    box-shadow: 0 10px 26px rgba(30, 20, 34, 0.10);
}

/* Row: FLEX con WRAP para que NUNCA se encime */
.gom-header .gom-header-row {
    display: flex !important;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
    /* <- lo que evita encimes */
    gap: 12px;

    padding: 14px 0;
}

/* Bloques: cada uno puede “bajar” de línea */
.gom-femecog-badge {
    flex: 0 0 auto;
}

.gom-brand {
    flex: 0 0 auto;
}

.gom-search {
    flex: 1 1 42px;
    min-width: 26px;
}

.gom-nav {
    flex: 0 1 auto;
}

/* FEMECOG badge: glass pill */
.gom-femecog-badge {
    display: inline-flex;
    align-items: center;
    padding: 10px 12px;
    border-radius: 16px;
    background: rgba(246, 242, 248, 0.55);
    border: 1px solid rgba(155, 106, 165, 0);
    box-shadow: 0 8px 18px rgba(30, 20, 34, 0);
    text-decoration: none;
}

.gom-femecog-badge img {
    height: 40px;
    width: auto;
    display: block;
}

/* Logo */
.gom-brand img {
    height: 60px;
    width: auto;
    display: block;
}

/* SEARCH: glass pill PRO (ahora sí se nota) */
.gom-search {
    display: flex;
    align-items: center;
    gap: 10px;

    padding: 10px 12px;
    border-radius: 999px;

    background: rgba(246, 242, 248, 0.52);
    border: 1px solid rgba(155, 106, 165, 0.24);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.55), 0 10px 22px rgba(30, 20, 34, 0.08);
}

.gom-search input[type="search"] {
    flex: 1;
    border: 0 !important;
    outline: none !important;
    background: transparent !important;
    padding: 8px 10px !important;

    color: var(--gom-dark);
    font-size: 14px;
    min-width: 180px;
}

.gom-search input::placeholder {
    color: rgba(30, 20, 34, 0.45);
}

.gom-search:focus-within {
    border-color: rgba(106, 52, 117, 0.55);
    box-shadow: 0 0 0 4px rgba(155, 106, 165, 0.16),
        inset 0 1px 0 rgba(255, 255, 255, 0.55),
        0 12px 28px rgba(30, 20, 34, 0.10);
}

/* Botón buscar: plum sólido */
.gom-search-btn {
    border: 0;
    cursor: pointer;

    height: 40px;
    width: 46px;
    border-radius: 999px;

    background: var(--gom-primary);
    color: var(--gom-white);
    font-weight: 900;

    display: inline-flex;
    align-items: center;
    justify-content: center;

    box-shadow: 0 10px 20px rgba(72, 35, 78, 0.22);
    transition: transform .2s ease, background .2s ease, box-shadow .2s ease;
}

.gom-search-btn:hover {
    background: var(--gom-secondary);
    transform: translateY(-1px);
    box-shadow: 0 14px 26px rgba(72, 35, 78, 0.26);
}

/* NAV: contenedor glass para que no se vea “texto suelto” */
.gom-nav {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-wrap: wrap;
    /* <- si no cabe, baja sin encimarse */
    justify-content: flex-end;

    padding: 8px;
    border-radius: 999px;
    background: rgba(246, 242, 248, 0.50);
    border: 1px solid rgba(155, 106, 165, 0.20);
    box-shadow: 0 10px 22px rgba(30, 20, 34, 0.08);
}

.gom-nav a {
    text-decoration: none;
    color: rgba(30, 20, 34, 0.86);
    font-weight: 800;
    font-size: 13.5px;

    padding: 10px 12px;
    border-radius: 999px;

    transition: background .2s ease, color .2s ease, transform .2s ease;
}

.gom-nav a:hover {
    background: rgba(155, 106, 165, 0.14);
    color: var(--gom-secondary);
    transform: translateY(-1px);
}

/* Responsive: orden bonito */
@media (max-width: 1000px) {

    /* Logo + FEMECOG en una línea, nav abajo, search en medio */
    .gom-femecog-badge {
        order: 1;
    }

    .gom-brand {
        order: 2;
        margin-right: auto;
    }

    .gom-search {
        order: 3;
        flex-basis: 100%;
    }

    .gom-nav {
        order: 4;
        width: 100%;
        justify-content: center;
        border-radius: 18px;
    }
}

@media (max-width: 640px) {
    .gom-femecog-badge {
        display: none;
    }

    /* opcional: para que respire */
    .gom-brand {
        margin: 0 auto;
    }

    .gom-search {
        width: 100%;
    }

    .gom-nav {
        padding: 10px;
        gap: 6px;
    }

    .gom-nav a {
        padding: 10px 10px;
        font-size: 13px;
    }
}
body {
    background: linear-gradient(to bottom,
            rgb(72, 35, 78),
            var(--gom-white) 240px);
}

/* ===================================================== */
/* HERO GLASS CARD */
/* ===================================================== */

.gom-hero-card {
    position: relative;
}

.gom-hero-inner {
    backdrop-filter: blur(22px);
    -webkit-backdrop-filter: blur(22px);
    background: rgba(255, 255, 255, 0.06);
    border: 1px solid rgba(255, 255, 255, 0.18);
    border-radius: 28px;
    padding: 60px 70px;
    box-shadow:
        0 10px 40px rgba(0, 0, 0, 0.15),
        inset 0 0 40px rgba(255, 255, 255, 0.05);
    text-align: center;
    transition: all .4s ease;
}

.gom-hero-inner:hover {
    transform: translateY(-4px);
    box-shadow:
        0 20px 60px rgba(0, 0, 0, 0.25),
        inset 0 0 60px rgba(255, 255, 255, 0.08);
}

.gom-hero-title {
    font-size: 42px;
    font-weight: 700;
    line-height: 1.2;
    margin-bottom: 20px;
}

.gom-hero-text {
    font-size: 18px;
    opacity: .85;
    max-width: 780px;
    margin: 0 auto 20px;
}

.gom-hero-meta {
    font-size: 14px;
    opacity: .7;
    margin-bottom: 14px;
}



/* ===================================================== */
/* ARTÍCULOS MÁS RECIENTES */
/* ===================================================== */

.gom-recent-grid {
    display: grid;
    gap: 30px;
}

.gom-article-card {
    display: flex;
    gap: 30px;
    padding: 35px;
    border-radius: 24px;
    background: rgba(255, 255, 255, 0.05);
    backdrop-filter: blur(18px);
    -webkit-backdrop-filter: blur(18px);
    border: 1px solid rgba(255, 255, 255, 0.12);
    transition: all .35s ease;
    position: relative;
    overflow: hidden;
}

.gom-article-card::before {
    content: "";
    position: absolute;
    inset: 0;
    background: radial-gradient(circle at 20% 20%, rgba(255, 255, 255, 0.15), transparent 60%);
    opacity: 0;
    transition: opacity .4s ease;
}

.gom-article-card:hover {
    transform: translateY(-6px);
    box-shadow: 0 18px 60px rgba(0, 0, 0, .25);
}

.gom-article-card:hover::before {
    opacity: 1;
}


/* Número completo destacado */
.gom-article-card.principal {
    padding: 45px;
    background: linear-gradient(135deg,
            rgba(255, 255, 255, 0.10),
            rgba(255, 255, 255, 0.04));
    border: 1px solid rgba(255, 255, 255, 0.25);
}

.gom-article-card.principal h3 {
    font-size: 26px;
}


/* Cover */
.gom-article-cover img {
    width: 180px;
    border-radius: 16px;
    box-shadow: 0 12px 30px rgba(0, 0, 0, .35);
}


/* Texto */
.gom-article-body h3 {
    font-size: 20px;
    font-weight: 600;
    margin-bottom: 10px;
}

.gom-subtitle {
    font-size: 14px;
    opacity: .7;
    margin-bottom: 12px;
}

.gom-authors {
    font-size: 14px;
    opacity: .85;
    margin-bottom: 12px;
}

.gom-date {
    font-size: 13px;
    opacity: .6;
}


/* CTA */
.gom-article-cta {
    margin-top: 12px;
    font-weight: 600;
    transition: transform .3s ease;
}

.gom-article-card:hover .gom-article-cta {
    transform: translateX(6px);
}



/* ===================================================== */
/* RESPONSIVE */
/* ===================================================== */

@media (max-width: 992px) {

    .gom-hero-inner {
        padding: 40px 30px;
    }

    .gom-hero-title {
        font-size: 32px;
    }

    .gom-article-card {
        flex-direction: column;
    }

    .gom-article-cover img {
        width: 140px;
    }

}

/* ===================================================== */
/* HERO BACKGROUND IMAGE (fondo morado original) */
/* ===================================================== */

.gom-hero-card {
    position: relative;
    padding-top: 100px;
    padding-bottom: 80px;
    background: url("../img/hero/fondo.png") center center / cover no-repeat;
    overflow: hidden;
}



/* Aseguramos que la tarjeta quede encima */
.gom-hero-inner {
    position: relative;
    z-index: 2;
}

/* Glow atmosférico sutil */
.gom-hero-card::after {
    content: "";
    position: absolute;
    width: 600px;
    height: 600px;
    top: -200px;
    right: -150px;
    background: radial-gradient(circle, rgba(255, 255, 255, 0.15), transparent 70%);
    filter: blur(80px);
    opacity: .4;
    z-index: 1;
}

/* ===================================================== */
/* HERO CON FONDO MORADO + GLASS LIMPIO */
/* ===================================================== */

.gom-hero-card {
    position: relative;
    padding: 100px 0 80px;
    overflow: hidden;
    background: url("../img/hero/fondo.png") center center / cover no-repeat;
}



/* Glass */
.gom-hero-inner {
    position: relative;
    z-index: 2;
    backdrop-filter: blur(22px);
    -webkit-backdrop-filter: blur(22px);
    background: rgba(255, 255, 255, 0.677);
    border: 1px solid rgba(255, 255, 255, 0.18);
    border-radius: 28px;
    padding: 60px 70px;
    box-shadow:
        0 10px 40px rgba(0, 0, 0, 0.15),
        inset 0 0 40px rgba(255, 255, 255, 0.05);
    text-align: center;
    transition: all .4s ease;
}

/* ===================================================== */
/* HERO CARD AJUSTADO PROPORCIONAL */
/* ===================================================== */

.gom-hero-inner {
    max-width: 1000px;
    margin: 0 auto;
    padding: 50px 60px;
}

/* Título menos agresivo */
.gom-hero-title {
    font-size: 45px;
    font-weight: 900;
    line-height: 1.15;
    margin-bottom: 18px;
    letter-spacing: -0.5px;
}

/* Texto más compacto */
.gom-hero-text {
    font-size: 16px;
    line-height: 1.6;
    opacity: .85;
    max-width: 720px;
    margin: 0 auto 16px;
}

/* Editor */
.gom-hero-editor {
    font-size: 14px;
    margin-bottom: 22px;
}

/* ===================================================== */
/* BOTÓN PRINCIPAL HERO */
/* ===================================================== */

.gom-hero-button {
    display: inline-block;
    padding: 14px 34px;
    border-radius: 999px;
    font-size: 15px;
    font-weight: 600;
    background: linear-gradient(135deg, #0e5c6e, #0b7c8e);
    color: #fff;
    transition: all .35s ease;
    box-shadow: 0 8px 25px rgba(255, 255, 255, 0.25);
}

.gom-hero-button:hover {
    transform: translateY(-3px);
    box-shadow: 0 14px 40px rgba(0, 0, 0, .35);
}

/* ===================================================== */
/* HERO: prompt + select (integrado al glass) */
/* ===================================================== */

.gom-hero-prompt {
    margin-top: 22px;
    margin-bottom: 10px;
    font-size: 14px;
    opacity: .78;
}

.gom-hero-select {
    max-width: 560px;
    margin: 0 auto;
    padding: 10px;
    border-radius: 16px;
    background: rgba(255, 255, 255, 0.06);
    border: 1px solid rgba(66, 5, 112, 0.411);
    backdrop-filter: blur(14px);
    -webkit-backdrop-filter: blur(14px);
    box-shadow: inset 0 0 28px rgba(255, 255, 255, 0.05);
}

.gom-hero-select .form-select {
    border-radius: 14px;
    padding: 14px 16px;
    font-weight: 600;
    background: rgba(255, 255, 255, 0.06);
    border: 1px solid rgba(255, 255, 255, 0.22);
}

/* Hover/focus sexy pero limpio */
.gom-hero-select .form-select:focus {
    outline: none;
    box-shadow: 0 0 0 4px rgba(255, 255, 255, 0.12);
    border-color: rgba(255, 255, 255, 0.35);
}

/* ===================================================== */
/* HERO editorial layout (como la imagen) */
/* ===================================================== */

.gom-hero-inner {
    max-width: 900px;
    margin: 0 auto;
    padding: 52px 56px;
    text-align: left;
    /* clave */
}

/* Top row: title + logo */
.gom-hero-top {
    display: grid;
    grid-template-columns: 1fr auto;
    gap: 28px;
    align-items: start;
    margin-bottom: 12px;
}

.gom-hero-title {
    font-size: 44px;
    font-weight: 900;
    line-height: 1.05;
    margin: 0;
    letter-spacing: -0.6px;
}

/* Logo right */
.gom-hero-logo {
    width: 120px;
    height: auto;
    opacity: .95;
    filter: drop-shadow(0 10px 18px rgba(0, 0, 0, .25));
}

/* Body text */
.gom-hero-text {
    font-size: 16px;
    line-height: 1.65;
    opacity: .86;
    max-width: 820px;
    margin: 0 0 18px 0;
}

/* Purple divider line */
.gom-hero-divider {
    height: 3px;
    width: 100%;
    max-width: 980px;
    background: rgba(124, 45, 170, 0.17);
    border-radius: 999px;
    margin: 18px 0 18px 0;
}

/* Button aligned left now */
.gom-hero-button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    margin-top: 4px;
    margin-bottom: 14px;
}

/* Select aligned left but centered width */
.gom-hero-prompt {
    margin-top: 8px;
    margin-bottom: 10px;
    font-size: 14px;
    opacity: .78;
}

.gom-hero-select {
    max-width: 520px;
    margin: 0;
    /* ya no centrado */
}

/* Responsive */
@media (max-width: 768px) {
    .gom-hero-inner {
        padding: 38px 24px;
    }

    .gom-hero-top {
        grid-template-columns: 1fr;
    }

    .gom-hero-logo {
        width: 96px;
        margin-top: 8px;
    }

    .gom-hero-title {
        font-size: 39px;
    }

    .gom-hero-divider {
        max-width: 100%;
    }

    .gom-hero-select {
        max-width: 100%;
    }
}

/* ===================================================== */
/* CENTRAR BLOQUE INFERIOR DEL HERO */
/* ===================================================== */

.gom-hero-button,
.gom-hero-prompt,
.gom-hero-select {
    display: block;
    margin-left: auto;
    margin-right: auto;
    text-align: center;
}

/* El botón vuelve a comportarse como inline-flex */
.gom-hero-button {
    display: inline-flex;
}

/* Mantener ancho controlado del select */
.gom-hero-select {
    max-width: 1000px;
}

/* ===================================================== */
/* CENTRAR SOLO EL BOTÓN DEL HERO */
/* ===================================================== */

.gom-hero-button {
    display: flex;
    justify-content: center;
    align-items: center;
    margin: 18px auto 20px auto;
}

/* ===================================================== */
/* MARCO DISCRETO PARA ARTÍCULOS */
/* ===================================================== */

.gom-article-card {
    border: 1px solid rgba(125, 45, 170, 0.18);
    box-shadow:
        0 10px 30px rgba(0, 0, 0, 0.05),
        inset 0 0 0 1px rgba(255, 255, 255, 0.04);
    transition: all .35s ease;
}

/* Hover más definido */
.gom-article-card:hover {
    border-color: rgba(125, 45, 170, 0.35);
    box-shadow:
        0 18px 50px rgba(0, 0, 0, 0.12),
        inset 0 0 0 1px rgba(255, 255, 255, 0.08);
}

.gom-hero-logo-link {
    display: inline-block;
    transition: transform .3s ease, opacity .3s ease;
}

.gom-hero-logo-link:hover {
    transform: scale(1.05);
    opacity: .9;
}
.gom-topbar {
    outline: 6px solid rgba(126, 0, 210, 0.503) !important;
}
/* ==========================
   GOM FOOTER - LIQUID GLASS
   ========================== */

.gom-footer {
    position: relative;
    margin-top: 64px;
    padding: 56px 0 34px;
    color: rgba(255, 255, 255, 0.92);

    /* glass */
    background: rgba(45, 0, 77, 0.726);
    backdrop-filter: blur(18px) saturate(150%);
    -webkit-backdrop-filter: blur(18px) saturate(150%);

    /* premium edge */
    border-top: 1px solid rgba(255, 255, 255, 0.14);
    border-top-left-radius: 1px;
    border-top-right-radius: 1px;
    overflow: hidden;

    box-shadow:
        0 -18px 60px rgba(0, 0, 0, 0.28),
        0 -1px 0 rgba(255, 255, 255, 0.08) inset;
}

/* glow + “liquid” highlights */
.gom-footer::before {
    content: "";
    position: absolute;
    inset: -2px;
    pointer-events: none;

    background:
        radial-gradient(900px 260px at 18% 0%, rgba(125, 65, 255, 0.30), transparent 60%),
        radial-gradient(700px 240px at 82% 0%, rgba(0, 200, 255, 0.20), transparent 60%),
        radial-gradient(520px 260px at 50% 40%, rgba(255, 255, 255, 0.10), transparent 70%);
    opacity: 0.95;
}

/* micro-grain */
.gom-footer::after {
    content: "";
    position: absolute;
    inset: 0;
    pointer-events: none;
    background-image: radial-gradient(rgba(255, 255, 255, 0.045) 1px, transparent 1px);
    background-size: 12px 12px;
    opacity: 0.35;
    mix-blend-mode: overlay;
}

.gom-footer .container {
    position: relative;
    z-index: 1;
}

/* ==========================
   Links grid
   ========================== */

.gom-footer-links {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 22px;
    align-items: start;
    margin-bottom: 26px;
}

/* each column as subtle glass card */
.gom-footer-links>div {
    padding: 16px 16px 14px;
    border-radius: 16px;

    background: rgba(255, 255, 255, 0.06);
    border: 1px solid rgba(255, 255, 255, 0.10);
    box-shadow: 0 10px 24px rgba(0, 0, 0, 0.18);

    transition: transform 160ms ease, background 160ms ease, border-color 160ms ease;
}

.gom-footer-links>div:hover {
    transform: translateY(-2px);
    background: rgba(255, 255, 255, 0.08);
    border-color: rgba(255, 255, 255, 0.16);
}

/* headings */
.gom-footer-links h4 {
    margin: 0 0 10px;
    font-size: 15px;
    letter-spacing: 0.35px;
    color: rgba(255, 255, 255, 0.96);
}

/* links */
.gom-footer-links a {
    display: inline-flex;
    align-items: center;
    gap: 8px;

    padding: 7px 10px;
    margin: 2px 0;

    border-radius: 10px;
    text-decoration: none;

    color: rgba(255, 255, 255, 0.78);
    background: transparent;

    transition: background 140ms ease, color 140ms ease, transform 140ms ease;
}

.gom-footer-links a:hover {
    color: rgba(255, 255, 255, 0.98);
    background: rgba(255, 255, 255, 0.10);
    transform: translateX(1px);
}

.gom-footer-links a:focus-visible {
    outline: 2px solid rgba(255, 255, 255, 0.28);
    outline-offset: 2px;
}

/* optional: tiny arrow indicator on hover */
.gom-footer-links a::after {
    content: "→";
    opacity: 0;
    transform: translateX(-4px);
    transition: opacity 140ms ease, transform 140ms ease;
}

.gom-footer-links a:hover::after {
    opacity: 0.9;
    transform: translateX(0);
}

/* ==========================
   Separator
   ========================== */

.gom-footer-sep {
    border: none;
    height: 1px;
    margin: 18px 0 22px;
    background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.18), transparent);
    opacity: 0.9;
}

/* ==========================
   Legal text
   ========================== */

.gom-footer-legal {
    max-width: 980px;
    margin: 0 auto;
    text-align: center;

    font-size: 13px;
    line-height: 1.75;
    color: rgba(255, 255, 255, 0.72);
}

.gom-footer-legal p {
    margin: 0 0 12px;
}

.gom-footer-legal p:last-child {
    margin-bottom: 0;
}

.gom-footer-legal strong {
    color: rgba(255, 255, 255, 0.92);
}

/* Make the “prohibida la reproducción…” look like a soft badge */
.gom-footer-legal p:has(strong) {
    margin-top: 14px;
}

.gom-footer-legal p:has(strong) strong {
    display: inline-block;
    padding: 10px 14px;
    border-radius: 999px;

    background: rgba(255, 255, 255, 0.08);
    border: 1px solid rgba(255, 255, 255, 0.12);
    box-shadow: 0 14px 30px rgba(0, 0, 0, 0.20);
}

/* powered line */
.gom-powered {
    margin-top: 14px;
    opacity: 0.8;
    font-size: 12px;
    color: rgba(255, 255, 255, 0.62);
}

/* ==========================
   Responsive
   ========================== */

@media (max-width: 992px) {
    .gom-footer-links {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 560px) {
    .gom-footer {
        padding: 44px 0 28px;
        border-top-left-radius: 22px;
        border-top-right-radius: 22px;
    }

    .gom-footer-links {
        grid-template-columns: 1fr;
    }

    .gom-footer-links>div {
        padding: 14px 14px 12px;
    }
}

/* ==========================
   FOOTER TEXT SIZE REFINEMENT
   ========================== */

/* Títulos de columnas */
.gom-footer-links h4 {
    font-size: 15px;
    font-weight: 900;
    letter-spacing: 0.3px;
}

/* Links */
.gom-footer-links a {
    font-size: 13px;
    font-weight: 400;
}

/* Texto legal general */
footer.gom-footer .gom-footer-legal,
footer.gom-footer .gom-footer-legal p {
    font-size: 12px;
    line-height: 1.65;
}

/* Última línea tipo badge */
.gom-footer-legal p:has(strong) strong {
    font-size: 12px;
    font-weight: 5000;
}

/* Powered line */
.gom-powered {
    font-size: 11px;
    opacity: 0.7;
}

/* =========================================
   FIX: centrar gom-issue-badge SIEMPRE
========================================= */

/* Asegura un contexto normal */
.title-area-left {
    position: relative;
}

/* Badge centrado y con ancho “natural” */
.gom-issue-badge {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;

    /* el truco */
    margin: 0 auto 14px auto !important;
    width: fit-content !important;
    max-width: 100% !important;

    text-align: center !important;

    /* por si algún estilo lo movía */
    float: none !important;
    left: auto !important;
    right: auto !important;
    transform: none !important;
    position: relative !important;

    /* opcional: look bonito */
    padding: 8px 14px !important;
    border-radius: 999px !important;
    background: rgba(246, 242, 248, 0.55) !important;
    border: 1px solid rgba(155, 106, 165, 0.24) !important;
}

/* Si el contenedor principal no está centrado, lo forzamos sin tocar el resto */
.banner-inner-service-details-1 .title-area-left {
    text-align: center;
}

/* Pero el párrafo largo que NO quieres centrado, lo regresamos a su estilo */
.banner-inner-service-details-1 .title-area-left .disc {
    text-align: center;
    /* si lo quieres centrado, deja esto */
    /* si lo prefieres alineado a la izquierda, cambia a left */
    /* text-align: left; */
    max-width: 780px;
    margin-left: auto;
    margin-right: auto;
}

/* =========================================
   PATCH FINAL: hero centrado estable + badge centrado real
========================================= */

/* Hero centrado sin trucos raros */
.banner-inner-service-details-1{
  display: flex !important;
  justify-content: center !important;
}

.banner-inner-service-details-1 .container{
  padding-left: 0 !important;
  padding-right: 0 !important;
}

/* La tarjeta */
.banner-inner-service-details-1 .title-area-left{
  width: min(920px, 92%) !important;
  margin: 0 auto !important;
  text-align: center !important;

  /* mata cualquier “envicio” de parches viejos */
  transform: none !important;
  left: auto !important;
  right: auto !important;
  position: relative !important;
}

/* Badge: autocentrado real */
.banner-inner-service-details-1 .gom-issue-badge{
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;

  width: fit-content !important;
  max-width: 100% !important;
  margin: 0 auto 16px auto !important;

  position: relative !important;
  transform: none !important;
  float: none !important;

  padding: 6px 14px !important;
  border-radius: 999px !important;
  background: rgba(0, 76, 99, 0.10) !important;
  color: #004c63 !important;
  font-size: 13px !important;
  line-height: 1.2 !important;
}

/* =========================
PATCH: compactar párrafos del artículo
========================= */

.gom-article-body p {
    margin: 8px 0;
    line-height: 1.65;
}

/* listas también más compactas */
.gom-article-body ul,
.gom-article-body ol {
    margin: 8px 0 12px;
}

/* subtítulos más pegados al texto */
.gom-article-h3 {
    margin: 14px 0 6px;
}
/* =========================
PATCH: referencias más compactas
========================= */

.gom-refs {
    padding-left: 20px;
    font-size: 12.5px;
    line-height: 1.4;
}

.gom-refs li {
    margin: 3px 0;
}

/* =========================
PATCH: DOI más visible
========================= */

.gom-meta-doi {
    margin-top: 14px;
    font-size: 1.3rem;
    font-weight: 600;
    color: var(--gom-dark);
}

.gom-meta-doi a {
    font-size: 1.3rem;
    font-weight: 700;
    color: var(--gom-primary);
    text-decoration: none;
}

.gom-meta-doi a:hover {
    text-decoration: underline;
}

/* PATCH: subtítulo de tarjeta con prioridad alta */
.card .card-text.gom-card-subtitle {
    font-size: 2.1rem !important;
    line-height: 1.35 !important;
    margin-bottom: 9px !important;
    opacity: .95 !important;
}
/* =========================================================
   GOM ARTICLE – LIQUID GLASS (LIGHT) FIX PATCH
   Pegar al FINAL de tu CSS
   Objetivo: glass claro + texto oscuro legible + layout pro
========================================================= */

body.article {
    /* Paleta “glass claro” */
    --a-bg: #f6f7fb;
    --a-card: rgba(255, 255, 255, .72);
    --a-card-2: rgba(255, 255, 255, .60);
    --a-border: rgba(17, 24, 39, .10);
    --a-border-2: rgba(17, 24, 39, .14);
    --a-shadow: 0 18px 40px rgba(17, 24, 39, .14);

    /* Texto */
    --a-text: #111827;
    --a-muted: #4b5563;
    --a-muted2: #6b7280;

    /* Radios y spacing */
    --a-r1: 18px;
    --a-r2: 26px;
    --a-p1: 16px;
    --a-p2: 22px;
    --a-p3: 28px;

    /* Ancho “editorial” */
    --a-max: 1100px;
}

/* 0) Base del artículo */
body.article .gom-article {
    padding: 22px 0 44px !important;
    background: linear-gradient(180deg, rgba(246, 247, 251, .9), rgba(246, 247, 251, 0));
}

body.article .gom-article .container {
    max-width: var(--a-max) !important;
}

body.article .gom-article-wrap {
    display: grid;
    gap: 16px;
}

/* 1) Acciones superiores: pill claro */
body.article .gom-article-actions {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    flex-wrap: wrap;

    padding: 10px 12px;
    border-radius: var(--a-r2);
    border: 1px solid var(--a-border);
    background: var(--a-card);
    box-shadow: var(--a-shadow);
    backdrop-filter: blur(14px);
    -webkit-backdrop-filter: blur(14px);
}

body.article .gom-article-actions .rts-btn {
    border-radius: 999px !important;
}

@media (max-width: 520px) {
    body.article .gom-article-actions {
        justify-content: center;
    }

    body.article .gom-article-actions a {
        width: 100%;
        text-align: center;
    }
}

/* 2) Header del artículo (título/subtítulo/autores) */
body.article .gom-article-head {
    padding: var(--a-p3);
    border-radius: var(--a-r2);
    border: 1px solid var(--a-border);
    background:
        radial-gradient(900px 320px at 12% 0%, rgba(186, 125, 255, 0.294), transparent 60%),
        linear-gradient(180deg, var(--a-card), var(--a-card-2));
    box-shadow: var(--a-shadow);
    backdrop-filter: blur(16px);
    -webkit-backdrop-filter: blur(16px);
}

/* 2.1) TÍTULO y SUBTÍTULO SIEMPRE MISMO TAMAÑO */
body.article .gom-article-title,
body.article .gom-article-subtitle {
    font-size: clamp(26px, 2.35vw, 44px) !important;
    line-height: 1.08 !important;
    letter-spacing: -0.35px;
    margin: 0 !important;
    color: var(--a-text) !important;
    text-wrap: balance;
}

/* subtítulo se distingue por estilo, NO por tamaño */
body.article .gom-article-subtitle {
    margin-top: 10px !important;
    opacity: .78;
    font-weight: 650;
}

/* OJO: tu <h2.5> no existe, pero si no lo cambias, lo cubro igual */
body.article .gom-article-authors {
    margin-top: 14px !important;
    font-size: 14px !important;
    line-height: 1.65 !important;
    color: var(--a-muted) !important;
}

/* 3) Divisor premium */
body.article .gom-divider {
    border: 0 !important;
    height: 1px !important;
    background: linear-gradient(90deg, transparent, rgba(17, 24, 39, .18), transparent) !important;
    margin: 18px 0 !important;
    opacity: 1 !important;
}

/* 4) IA box (glass claro + borde gradient OpenAI) */
body.article .gom-ai-summary {
    padding: var(--a-p2);
    border-radius: var(--a-r2);
    border: 4px solid transparent;

    /* doble background: interior + borde */
    background:
        linear-gradient(180deg, var(--a-card), var(--a-card-2)) padding-box,
        linear-gradient(135deg,
            #ff880070,
            #ff3d7770,
            #b65cff70,
            #00aaff70) border-box;

    box-shadow: var(--a-shadow);
    backdrop-filter: blur(14px);
    -webkit-backdrop-filter: blur(14px);
}

body.article .gom-ai-summary-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin-bottom: 10px;
}

body.article .gom-ai-summary .gom-article-h2 {
    margin: 0 !important;
    font-size: 16px !important;
    color: var(--a-text) !important;
}

body.article .gom-ai-summary-body p,
body.article .gom-ai-summary-body .muted {
    color: var(--a-muted) !important;
    line-height: 1.75 !important;
}

/* Botón IA */
body.article .gom-ai-summary-btn {
    border-radius: 999px;
    border: 1px solid var(--a-border-2);
    background: rgba(0, 81, 255, 0.06);
    color: var(--a-text);
    padding: 10px 14px;
    font-weight: 700;
    cursor: pointer;
    transition: transform .12s ease, background .12s ease, opacity .12s ease;
}

body.article .gom-ai-summary-btn:hover {
    transform: translateY(-1px);
    background: rgba(17, 24, 39, .08);
}

body.article .gom-ai-summary-btn:disabled {
    opacity: .55;
    cursor: not-allowed;
    transform: none;
}

/* 5) Meta: grid bonito, legible */
body.article .gom-article-meta {
    display: grid;
    grid-template-columns: 1.35fr .95fr;
    gap: 14px;

    padding: var(--a-p2);
    border-radius: var(--a-r2);
    border: 1px solid var(--a-border);
    background: linear-gradient(180deg, var(--a-card), var(--a-card-2));
    box-shadow: var(--a-shadow);
    backdrop-filter: blur(14px);
    -webkit-backdrop-filter: blur(14px);
}

@media (max-width: 920px) {
    body.article .gom-article-meta {
        grid-template-columns: 1fr;
    }
}

/* “tarjetitas” internas */
body.article .gom-meta-authors,
body.article .gom-meta-affiliations,
body.article .gom-meta-correspondence,
body.article .gom-meta-doi,
body.article .gom-meta-dates,
body.article .gom-meta-cite {
    margin: 0 !important;
    padding: 14px 14px;

    border-radius: var(--a-r1);
    border: 1px solid rgba(17, 24, 39, .10);
    background: rgba(231, 209, 255, 0.274);
}

body.article .gom-meta-authors {
    color: var(--a-text) !important;
    line-height: 1.75 !important;
}

body.article .gom-meta-affiliations p {
    margin: 8px 0 !important;
    color: var(--a-muted) !important;
}

body.article .gom-meta-doi,
body.article .gom-meta-correspondence,
body.article .gom-meta-cite {
    color: var(--a-muted) !important;
}

body.article .gom-meta-doi a,
body.article .gom-meta-correspondence a {
    color: var(--a-text) !important;
    text-decoration: none !important;
    border-bottom: 1px solid rgba(17, 24, 39, .22);
}

body.article .gom-meta-doi a:hover,
body.article .gom-meta-correspondence a:hover {
    border-bottom-color: rgba(17, 24, 39, .42);
}

/* Fechas en chips */
body.article .gom-meta-dates {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
}

body.article .gom-meta-dates span {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 8px 10px;
    border-radius: 999px;
    border: 1px solid rgba(17, 24, 39, .10);
    background: rgba(255, 255, 255, .65);
    color: var(--a-muted);
}

body.article .gom-meta-dates strong {
    color: var(--a-text);
}

/* 6) Body: bloques glass claro + texto oscuro */
body.article .gom-article-body {
    display: grid;
    gap: 14px;
}

body.article .gom-article-block {
    padding: var(--a-p3);
    border-radius: var(--a-r2);
    border: 1px solid var(--a-border);
    background:
        radial-gradient(700px 260px at 10% 0%, rgba(255, 255, 255, .90), transparent 55%),
        linear-gradient(180deg, var(--a-card), var(--a-card-2));
    box-shadow: var(--a-shadow);
    backdrop-filter: blur(14px);
    -webkit-backdrop-filter: blur(14px);
}

/* Headings internos */
body.article .gom-article-h2 {
    margin: 0 0 12px !important;
    font-size: 18px !important;
    color: var(--a-text) !important;
    letter-spacing: .2px;
}

body.article .gom-article-h3 {
    margin: 18px 0 10px !important;
    font-size: 16px !important;
    color: var(--a-text) !important;
    opacity: .95;
}

/* Texto del artículo */
body.article .gom-article-body p {
    margin: 10px 0 !important;
    color: var(--a-muted) !important;
    line-height: 1.85 !important;
}

/* Listas */
body.article .gom-article-list {
    margin: 10px 0 0 !important;
    padding-left: 18px !important;
}

body.article .gom-article-list li {
    margin: 8px 0 !important;
    color: var(--a-muted) !important;
    line-height: 1.75 !important;
}

/* Figuras */
body.article figure.gom-fig {
    margin: 16px 0 0 !important;
    padding: 14px;
    border-radius: var(--a-r2);
    border: 1px solid rgba(17, 24, 39, .10);
    background: rgba(255, 255, 255, .55);
}

body.article figure.gom-fig img {
    width: 100%;
    height: auto;
    display: block;
    border-radius: 16px;
}

body.article figure.gom-fig figcaption {
    margin-top: 10px !important;
    color: var(--a-muted2) !important;
    font-size: 13px !important;
    line-height: 1.65 !important;
}

/* YouTube card */
body.article .yt-card {
    border-radius: var(--a-r2);
    border: 1px solid rgba(17, 24, 39, .10);
    background: rgba(255, 255, 255, .55);
    overflow: hidden;
    box-shadow: var(--a-shadow);
}

body.article .yt-thumb {
    aspect-ratio: 16 / 9;
    background-size: cover;
    background-position: center;
    position: relative;
}

body.article .yt-play {
    width: 64px;
    height: 64px;
    border-radius: 999px;
    border: 1px solid rgba(17, 24, 39, .18);
    background: rgba(255, 255, 255, .55);
    backdrop-filter: blur(8px);
    -webkit-backdrop-filter: blur(8px);
    position: absolute;
    inset: 0;
    margin: auto;
    cursor: pointer;
    transition: transform .12s ease, background .12s ease;
}

body.article .yt-play:hover {
    transform: scale(1.04);
    background: rgba(255, 255, 255, .70);
}

body.article .yt-title {
    padding: 12px 14px;
    color: var(--a-text);
    font-weight: 750;
    font-size: 14px;
}

/* Referencias */
body.article .gom-refs li {
    color: var(--a-muted) !important;
    line-height: 1.3 !important;
}

/* 7) Botón comentario: flotante suave */
body.article .gom-article-comment {
    position: sticky;
    bottom: 14px;
    z-index: 8;
    display: flex;
    justify-content: flex-end;
    pointer-events: none;
}

body.article .gom-btn-comment {
    pointer-events: auto;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 12px 16px;
    border-radius: 999px;
    border: 1px solid rgba(17, 24, 39, .14);
    background: rgba(206, 173, 255, 0.72);
    color: var(--a-text) !important;
    text-decoration: none !important;
    box-shadow: var(--a-shadow);
    backdrop-filter: blur(14px);
    -webkit-backdrop-filter: blur(14px);
    transition: transform .12s ease, background .12s ease;
}

body.article .gom-btn-comment:hover {
    transform: translateY(-1px);
    background: rgba(255, 255, 255, .84);
}

@media (max-width: 620px) {
    body.article .gom-article-comment {
        justify-content: center;
    }

    body.article .gom-btn-comment {
        width: min(520px, calc(100% - 24px));
    }
}

/* =========================================================
   META RE-LAYOUT (CORREGIDO)
   - Fix: cite/dates deben estirar a 2 columnas
   - Fix: corr/doi no deben romper el layout con flex
========================================================= */

/* 1) Grid editorial */
body.article .gom-article-meta {
    display: grid !important;
    grid-template-columns: 1.35fr .95fr !important;
    grid-template-areas:
        "auth  aff"
        "corr  doi"
        "cite  cite"
        "dates dates" !important;
    gap: 14px !important;
    align-items: start !important;
    /* evita estiramientos raros */
}

/* 2) Áreas */
body.article .gom-meta-authors {
    grid-area: auth;
}

body.article .gom-meta-affiliations {
    grid-area: aff;
}

body.article .gom-meta-correspondence {
    grid-area: corr;
}

body.article .gom-meta-doi {
    grid-area: doi;
}

body.article .gom-meta-cite {
    grid-area: cite;
}

body.article .gom-meta-dates {
    grid-area: dates;
}

/* 3) MUY IMPORTANTE: forzar que los bloques “full width” sí estiren */
body.article .gom-meta-cite,
body.article .gom-meta-dates {
    width: 100% !important;
    justify-self: stretch !important;
    align-self: stretch !important;
}

/* (opcional pero recomendado) también corr/doi que llenen su celda */
body.article .gom-meta-correspondence,
body.article .gom-meta-doi {
    width: 100% !important;
    justify-self: stretch !important;
}

/* 4) Tipografía / legibilidad */
body.article .gom-meta-authors {
    line-height: 2.5 !important;
}

body.article .gom-meta-affiliations p {
    margin: 10px 0 !important;
    line-height: 1.75 !important;
}

/* 5) Cómo citar: ancho completo + texto que no se aplaste */
body.article .gom-meta-cite {
    padding: 18px 18px !important;
}

body.article .gom-meta-cite p:first-child {
    margin: 0 0 10px !important;
}

body.article .gom-meta-cite-text {
    width: 100% !important;
    display: block !important;
    background: rgba(255, 255, 255, .60) !important;
    border: 1px solid rgba(17, 24, 39, .10) !important;
    border-radius: 14px !important;
    padding: 12px 12px !important;
    line-height: 1.75 !important;
}

/* 6) Fechas: al final + chips */
body.article .gom-meta-dates {
    padding: 16px 16px !important;
    display: flex !important;
    flex-wrap: wrap !important;
    gap: 12px !important;
    justify-content: flex-start !important;
}

body.article .gom-meta-dates span {
    padding: 9px 12px !important;
}

/* 7) CORR / DOI: quitar flex duro que rompe el texto
      y mejorar wrapping de email/doi */
body.article .gom-meta-correspondence,
body.article .gom-meta-doi {
    min-height: 74px;
    padding: 16px 16px !important;
    display: block !important;
    /* <-- clave */
}

body.article .gom-meta-correspondence a,
body.article .gom-meta-doi a {
    word-break: break-word !important;
    overflow-wrap: anywhere !important;
}

/* 8) Responsive */
@media (max-width: 920px) {
    body.article .gom-article-meta {
        grid-template-columns: 1fr !important;
        grid-template-areas:
            "auth"
            "aff"
            "corr"
            "doi"
            "cite"
            "dates" !important;
    }
}

/* =========================================================
   ARTICLE MOBILE FIX (<= 640px)
   - evita overflow
   - acomoda metadatos
   - arregla chips/DOI/correo/cita
========================================================= */

@media (max-width: 640px) {

    /* 0) Evita scroll horizontal fantasmal */
    body.article,
    body.article .gom-article,
    body.article .gom-article-wrap {
        overflow-x: hidden;
    }

    /* 1) Menos padding en todas las tarjetas del artículo */
    body.article .gom-article-head,
    body.article .gom-ai-summary,
    body.article .gom-article-meta,
    body.article .gom-article-block {
        padding: 16px !important;
        border-radius: 18px !important;
    }

    /* 2) Título/subtítulo siguen iguales pero con mejor “fit” */
    body.article .gom-article-title,
    body.article .gom-article-subtitle {
        font-size: clamp(22px, 6.2vw, 30px) !important;
        line-height: 1.12 !important;
    }

    /* 3) Metadatos: una sola columna (sin inventos) */
    body.article .gom-article-meta {
        grid-template-columns: 1fr !important;
        grid-template-areas:
            "auth"
            "aff"
            "corr"
            "cite"
            "doi"
            "dates" !important;
        gap: 12px !important;
    }

    /* 4) Autores + afiliaciones: que no se vean “cortados” */
    body.article .gom-meta-authors,
    body.article .gom-meta-affiliations,
    body.article .gom-meta-correspondence,
    body.article .gom-meta-doi,
    body.article .gom-meta-cite,
    body.article .gom-meta-dates {
        width: 100% !important;
        justify-self: stretch !important;
    }

    /* 5) CORREO / DOI / links largos: romper bonito */
    body.article .gom-meta-correspondence a,
    body.article .gom-meta-doi a,
    body.article .gom-meta-cite-text {
        overflow-wrap: anywhere !important;
        word-break: break-word !important;
    }

    /* 6) "Cómo citar" cajita interna full width sin overflow */
    body.article .gom-meta-cite-text {
        width: 100% !important;
        display: block !important;
        padding: 12px !important;
        border-radius: 14px !important;
    }

    /* 7) Fechas: chips fluidos, que no se salgan */
    body.article .gom-meta-dates {
        display: flex !important;
        flex-wrap: wrap !important;
        gap: 10px !important;
    }

    body.article .gom-meta-dates span {
        width: 100% !important;
        /* <- si quieres 2 por fila, te lo ajusto abajo */
        justify-content: space-between;
        padding: 10px 12px !important;
        border-radius: 999px !important;
    }

    /* 8) Botones arriba: full width en móvil */
    body.article .gom-article-actions a {
        width: 100%;
        text-align: center;
    }
}

/* OPCIONAL: si quieres fechas en 2 columnas (en vez de 1 por fila) */
@media (max-width: 640px) {
    body.article .gom-meta-dates span {
        width: calc(50% - 6px) !important;
        justify-content: flex-start;
    }
}

@media (max-width: 420px) {
    body.article .gom-meta-dates span {
        width: 100% !important;
    }
}

/* =========================================================
   iPHONE / MOBILE CUT FIX
   Evita que las tarjetas se "corten" en móvil
========================================================= */

@media (max-width: 640px) {

    /* 1) Quitar recortes por overflow en wrappers */
    body.article .gom-article,
    body.article .gom-article .container,
    body.article .gom-article-wrap,
    body.article .gom-article-meta,
    body.article .gom-article-body {
        overflow: visible !important;
    }

    /* 2) Las tarjetas NO deben recortar sombras */
    body.article .gom-article-head,
    body.article .gom-ai-summary,
    body.article .gom-article-meta,
    body.article .gom-article-block {
        overflow: visible !important;
        border-radius: 18px !important;
        box-shadow: 0 10px 22px rgba(17, 24, 39, .10) !important;
    }

    /* 3) Asegura ancho correcto y margen lateral decente */
    body.article .gom-article .container {
        padding-left: 14px !important;
        padding-right: 14px !important;
    }

    /* 4) Metadatos: una sola columna, sin chips raros */
    body.article .gom-article-meta {
        grid-template-columns: 1fr !important;
        grid-template-areas:
            "auth"
            "aff"
            "corr"
            "doi"
            "cite"
            "dates" !important;
        gap: 12px !important;
    }

    /* 5) Evitar que el DOI/correo empujen y "corten" */
    body.article .gom-meta-doi a,
    body.article .gom-meta-correspondence a {
        display: inline-block !important;
        max-width: 100% !important;
        overflow-wrap: anywhere !important;
        word-break: break-word !important;
    }

    /* 6) Fechas: en móvil SIEMPRE 1 por fila (cero corte) */
    body.article .gom-meta-dates {
        display: flex !important;
        flex-wrap: wrap !important;
        gap: 10px !important;
        padding: 14px !important;
    }

    body.article .gom-meta-dates span {
        width: 100% !important;
        box-sizing: border-box !important;
        padding: 10px 12px !important;
    }
}

/* =========================================================
   Si tu tema trae overflow hidden en el layout general,
   este override extra ayuda muchísimo en iOS
========================================================= */
body.article main,
body.article section,
body.article .container,
body.article .row {
    overflow: visible !important;
}

/* =========================================================
   MOBILE FIX DEFINITIVO (iOS/Android)
   Evita overflow y "se sale del cuadro"
========================================================= */

@media (max-width: 700px) {

    /* 0) Nunca scroll horizontal */
    html,
    body {
        max-width: 100% !important;
        overflow-x: hidden !important;
    }

    /* 1) El contenedor NO debe usar 100vw (iOS bug), mejor 100% */
    body.article .gom-article,
    body.article .gom-article .container,
    body.article .gom-article-wrap {
        width: 100% !important;
        max-width: 100% !important;
    }

    /* 2) Padding lateral seguro (incluye safe-area iPhone) */
    body.article .gom-article .container {
        padding-left: calc(14px + env(safe-area-inset-left)) !important;
        padding-right: calc(14px + env(safe-area-inset-right)) !important;
    }

    /* 3) TODAS las tarjetas del artículo: que nunca excedan el ancho */
    body.article .gom-article-head,
    body.article .gom-ai-summary,
    body.article .gom-article-meta,
    body.article .gom-article-block {
        box-sizing: border-box !important;
        max-width: 100% !important;
        width: 100% !important;
        margin-left: 0 !important;
        margin-right: 0 !important;
        overflow: hidden !important;
        /* <- evita que sombras/bordes “asomen” raro */
        border-radius: 18px !important;
    }

    /* 4) Grid meta: 1 columna, y permite encoger (min-width:0 es CLAVE) */
    body.article .gom-article-meta {
        grid-template-columns: 1fr !important;
    }

    body.article .gom-meta-authors,
    body.article .gom-meta-affiliations,
    body.article .gom-meta-correspondence,
    body.article .gom-meta-doi,
    body.article .gom-meta-cite,
    body.article .gom-meta-dates {
        min-width: 0 !important;
        /* <- clave para que el grid no se desborde */
        max-width: 100% !important;
        box-sizing: border-box !important;
    }

    /* 5) Links largos (DOI/correo): romper bonito, no empujar */
    body.article .gom-meta-doi a,
    body.article .gom-meta-correspondence a {
        display: inline-block !important;
        max-width: 100% !important;
        overflow-wrap: anywhere !important;
        word-break: break-word !important;
    }

    /* 6) “Cómo citar” interno: full width real */
    body.article .gom-meta-cite-text {
        display: block !important;
        width: 100% !important;
        max-width: 100% !important;
        box-sizing: border-box !important;
        overflow-wrap: anywhere !important;
        word-break: break-word !important;
    }

    /* 7) Fechas: una por fila para cero cortes */
    body.article .gom-meta-dates {
        display: flex !important;
        flex-wrap: wrap !important;
        gap: 10px !important;
    }

    body.article .gom-meta-dates span {
        width: 100% !important;
        box-sizing: border-box !important;
    }

    /* 8) Si alguna tarjeta trae transform, eso puede crear overflow en iOS */
    body.article .gom-article-head,
    body.article .gom-ai-summary,
    body.article .gom-article-meta,
    body.article .gom-article-block {
        transform: none !important;
    }
}
/* =========================================================
   HEADER ACTIONS – alignment fix + no purple shadow
========================================================= */

/* Si NO añadiste la clase --inhead, igual aplica al bloque */
body.article .gom-article-head .gom-article-actions {
    /* que se sienta parte del header, no otra tarjeta */
    background: transparent !important;
    border: 0 !important;
    box-shadow: none !important;
    padding: 0 !important;
    margin: 0 0 16px 0 !important;

    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    gap: 12px !important;
}

/* Alineación exacta de botones */
body.article .gom-article-head .gom-article-actions .gom-article-back,
body.article .gom-article-head .gom-article-actions .gom-article-pdf {
    height: 44px !important;
    min-height: 44px !important;

    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;

    padding: 0 16px !important;
    border-radius: 999px !important;

    line-height: 1 !important;
    /* <- evita “brinco” vertical */
    white-space: nowrap !important;
}

/* El de la derecha debe pegarse a la derecha real */
body.article .gom-article-head .gom-article-actions .gom-article-pdf {
    margin-left: auto !important;
}

/* Opcional: que el “Volver” se vea más suave */
body.article .gom-article-head .gom-article-actions .gom-article-back {
    background: rgba(17, 24, 39, .04) !important;
    border: 1px solid rgba(17, 24, 39, .14) !important;
}

/* Opcional: que el “Ver PDF” se vea premium pero sin sombras feas */
body.article .gom-article-head .gom-article-actions .gom-article-pdf {
    box-shadow: none !important;
}

/* Línea divisoria sutil bajo botones */
body.article .gom-article-head .gom-article-actions::after {
    content: "";
    display: block;
    height: 1px;
    background: linear-gradient(90deg, transparent, rgba(17, 24, 39, .14), transparent);
    flex: 0 0 100%;
    margin-top: 14px;
}

/* Móvil: apilar bonito y full width */
@media (max-width: 640px) {
    body.article .gom-article-head .gom-article-actions {
        flex-direction: column !important;
        align-items: stretch !important;
    }

    body.article .gom-article-head .gom-article-actions .gom-article-back,
    body.article .gom-article-head .gom-article-actions .gom-article-pdf {
        width: 100% !important;
        margin-left: 0 !important;
    }

    body.article .gom-article-head .gom-article-actions::after {
        margin-top: 10px;
    }
}

/* =========================================================
   BONUS: apagar el glow morado del header (si viene de tu gradiente)
   Esto solo afecta al header del artículo, no a todo el sitio.
========================================================= */
body.article .gom-article-head {
    background:
        radial-gradient(900px 320px at 12% 0%, rgba(255, 255, 255, .92), transparent 60%),
        linear-gradient(180deg, rgba(255, 255, 255, .78), rgba(255, 255, 255, .62)) !important;
}

body.article .gom-article-head .gom-article-actions .rts-btn {
    height: 50px !important;
    padding: 0 19px !important;
    line-height: 44px !important;
}

/* Botón HOME elegante */
.gom-nav-home {
    display: inline-flex;
    align-items: center;
    gap: 6px;

    padding: 8px 14px;
    border-radius: 999px;

    font-size: 19px;
    font-weight: 600;

    color: #5a2a6e;
    text-decoration: none;

    background: rgba(90, 42, 110, 0.06);
    transition: all .2s ease;
}


/* hover elegante */
.gom-nav-home:hover {
    background: rgba(90, 42, 110, 0.12);
    color: #5a2a6e;
    transform: translateY(-1px);
}

/* =========================================================
   ONE-SLUG OVERFLOW FIX (global para artículos)
   Evita que un texto no-rompible rompa el layout
========================================================= */

body.article .gom-article-wrap,
body.article .gom-article-head,
body.article .gom-article-meta,
body.article .gom-article-body,
body.article .gom-article-block {
    min-width: 0 !important;
}

/* Rompe strings largos dentro del contenido */
body.article .gom-article-body p,
body.article .gom-article-body li,
body.article .gom-meta-cite-text,
body.article .gom-meta-affiliations p,
body.article .gom-meta-doi a,
body.article .gom-meta-correspondence a,
body.article .gom-refs li,
body.article figcaption {
    overflow-wrap: anywhere !important;
    word-break: break-word !important;
}

/* Si hay tablas/código/iframes inesperados */
body.article table,
body.article pre,
body.article code,
body.article iframe,
body.article img {
    max-width: 100% !important;
}

/* Por si el slug trae una URL larguísima como texto plano */
body.article a {
    overflow-wrap: anywhere;
}
/* ============================
   PATCH: Reading Progress Bar
   ============================ */

#reading-progress {
    position: fixed;
    top: 0;
    left: 0;
    height: 10px;
    width: 0%;
    z-index: 99999;
    background: linear-gradient(90deg, #7d3bf6, #8c60fa);
    box-shadow: 0 0 10px rgba(44, 1, 104, 0.35);
    transition: width 120ms linear, opacity 180ms ease;
}

/* En pantallas con notch */
@supports (padding: max(0px)) {
    #reading-progress {
        top: env(safe-area-inset-top);
    }
}

/* Si quieres ocultarla fuera de artículos, puedes activar esto después:
body:not(.article) #reading-progress { display:none; }
*/
/* PATCH: Zoom en figuras */
.gom-fig .gom-zoom img {
    cursor: zoom-in;
}

.gom-fig .gom-zoom {
    display: inline-block;
}
.mfp-img {
    transition: transform .15s ease;
}

.gom-case-date {
    margin: 6px 0 0;
    font-size: 13px;
    opacity: .75;
}



.gom-envio-page {
    padding: 42px 0;
}

.gom-envio-card {
    max-width: 860px;
    margin: 0 auto;
    padding: 26px 22px;
    border-radius: 16px;
    border: 1px solid rgba(0, 0, 0, .08);
    background: #fff;
    box-shadow: 0 10px 26px rgba(0, 0, 0, .06);
}

.gom-envio-title {
    margin: 0 0 10px;
}

.gom-envio-text {
    margin: 0 0 18px;
    opacity: .9;
    line-height: 1.7;
}

.gom-envio-actions {
    margin-top: 12px;
}

.gom-envio-note {
    margin: 18px 0 0;
    font-size: 14px;
    opacity: .75;
    line-height: 1.6;
}

/* =========================================
     GOM - Liquid Glass (local, seguro)
     Puedes moverlo al final de tu CSS global
  ========================================= */

.gom-envio {
    padding: 46px 0 64px;
}

.gom-envio-top {
    max-width: 980px;
    margin: 0 auto 14px;
}

.gom-envio-back {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 10px 12px;
    border-radius: 999px;
    font-weight: 600;
    font-size: 14px;
    text-decoration: none;
    color: inherit;
    border: 1px solid rgba(0, 0, 0, .10);
    background: rgba(255, 255, 255, .55);
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
    transition: transform .15s ease, box-shadow .15s ease, background .15s ease;
}

.gom-envio-back:hover {
    transform: translateY(-1px);
    box-shadow: 0 10px 22px rgba(0, 0, 0, .08);
    background: rgba(255, 255, 255, .72);
}

/* Glass base */
.gom-glass-card {
    position: relative;
    overflow: hidden;
    border-radius: 22px;
    border: 1px solid rgba(255, 255, 255, .35);
    background:
        radial-gradient(1200px 600px at 12% 8%, rgba(120, 160, 255, .18), transparent 55%),
        radial-gradient(900px 420px at 88% 18%, rgba(180, 120, 255, .14), transparent 55%),
        rgba(255, 255, 255, .55);
    backdrop-filter: blur(16px);
    -webkit-backdrop-filter: blur(16px);
    box-shadow:
        0 18px 46px rgba(0, 0, 0, .10),
        inset 0 1px 0 rgba(255, 255, 255, .55);
}

/* glossy highlights */
.gom-glass-card::before {
    content: "";
    position: absolute;
    inset: -2px;
    background:
        linear-gradient(135deg, rgba(255, 255, 255, .55), rgba(255, 255, 255, 0) 55%),
        radial-gradient(700px 220px at 22% 0%, rgba(255, 255, 255, .55), transparent 60%);
    pointer-events: none;
    opacity: .55;
}

/* soft border glow */
.gom-glass-card::after {
    content: "";
    position: absolute;
    inset: 0;
    border-radius: 22px;
    pointer-events: none;
    box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .40);
    opacity: .8;
}

.gom-envio-card {
    max-width: 980px;
    margin: 0 auto;
    padding: 26px 22px 22px;
}

.gom-envio-head {
    position: relative;
    z-index: 1;
    padding: 6px 6px 10px;
}

.gom-envio-chip {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    padding: 10px 14px;
    border-radius: 999px;
    font-weight: 700;
    font-size: 13px;
    border: 1px solid rgba(0, 0, 0, .08);
    background: rgba(255, 255, 255, .55);
    box-shadow: 0 10px 18px rgba(0, 0, 0, .06);
}

.gom-envio-title {
    margin: 14px 0 8px;
    font-size: clamp(26px, 3vw, 36px);
    letter-spacing: -0.02em;
}

.gom-envio-subtitle {
    margin: 0;
    opacity: .88;
    line-height: 1.75;
    font-size: 16px;
    max-width: 860px;
}

.gom-envio-actions {
    position: relative;
    z-index: 1;
    padding: 10px 6px 6px;
}

.gom-envio-btn {
    width: fit-content;
    display: inline-flex !important;
    align-items: center;
    gap: 10px;
    border-radius: 14px !important;
    padding: 14px 18px !important;
    box-shadow: 0 14px 28px rgba(0, 0, 0, .12);
    transition: transform .15s ease, box-shadow .15s ease, filter .15s ease;
}

.gom-envio-btn:hover {
    transform: translateY(-1px);
    box-shadow: 0 20px 36px rgba(0, 0, 0, .16);
    filter: saturate(1.05);
}

.gom-envio-note {
    margin: 12px 0 0;
    font-size: 14px;
    opacity: .78;
    line-height: 1.65;
}

.gom-envio-tips {
    position: relative;
    z-index: 1;
    margin-top: 18px;
    padding: 12px 6px 6px;
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 12px;
}

.gom-tip {
    display: flex;
    gap: 12px;
    padding: 14px 14px;
    border-radius: 18px;
    border: 1px solid rgba(0, 0, 0, .08);
    background: rgba(255, 255, 255, .50);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, .55);
}

.gom-tip-ico {
    width: 38px;
    height: 38px;
    border-radius: 12px;
    display: grid;
    place-items: center;
    border: 1px solid rgba(0, 0, 0, .08);
    background: rgba(255, 255, 255, .65);
    flex: 0 0 auto;
}

.gom-tip-title {
    font-weight: 800;
    font-size: 14px;
    margin-bottom: 2px;
}

.gom-tip-text {
    font-size: 13px;
    opacity: .82;
    line-height: 1.55;
}

/* Responsive */
@media (max-width: 992px) {
    .gom-envio-card {
        padding: 22px 16px 16px;
    }

    .gom-envio-tips {
        grid-template-columns: 1fr;
    }

    .gom-envio-btn {
        width: 100%;
        justify-content: center;
    }
}

/* Reduce motion */
@media (prefers-reduced-motion: reduce) {

    .gom-envio-back,
    .gom-envio-btn {
        transition: none !important;
    }

    .gom-envio-back:hover,
    .gom-envio-btn:hover {
        transform: none !important;
    }
}
/* =================================
   FIX BOTONES HOVER (no texto blanco)
================================= */

.rts-btn.btn-primary:hover,
.rts-btn.btn-primary:focus {
    background: linear-gradient(135deg, #bbb0ff, #1d006c) !important;
    color: #000000 !important;
    border-color: transparent !important;
}

.rts-btn.btn-primary:hover {
    background: rgba(209, 198, 255, 0.9) !important;
    color: #270056 !important;
}

/* =================================
   CENTRAR BOTÓN ENVÍO
================================= */

.gom-envio-actions {
    text-align: center;
}

.gom-envio-btn {
    margin: 20px auto 0;
    display: inline-flex !important;
}

/* =================================
   HOVER MÁS SUAVE
================================= */

.rts-btn {
    transition:
        transform .18s ease,
        box-shadow .18s ease,
        background .18s ease;
}

.rts-btn:hover {
    transform: translateY(-2px);
    box-shadow: 0 12px 24px rgba(0, 0, 0, .15);
}

.text-center {
    text-align: center;
}

.gom-article i,
.gom-article em {
    font-style: italic;
}

.gom-article em,
.gom-hero-text em {
    font-style: italic !important;
}

em {
    font-style: italic !important;
    font-family: Georgia, "Times New Roman", serif !important;
}

.gom-article em,
.gom-article i {
    font-style: italic !important;
}

.gom-article-title em,
.gom-article-subtitle em,
.gom-article-h2 em,
.gom-article-h3 em {
    font-style: italic !important;
    font-family: inherit !important;
    font-synthesis: style;
}
.gom-meta-authors {
    margin: 0;
    line-height: 1.8;
}

.gom-author-item {
    display: inline-flex;
    align-items: baseline;
    white-space: nowrap;
}

.gom-author-link {
    display: inline-flex;
    align-items: center;
    gap: 0.32rem;
    text-decoration: none;
}

.gom-author-name {
    display: inline;
}

.gom-orcid-icon {
    width: 14px;
    height: 14px;
    object-fit: contain;
    vertical-align: middle;
}

.gom-meta-authors sup {
    font-size: 0.72em;
    line-height: 1;
    vertical-align: super;
    margin-left: 2px;
}

/* ===============================
   COMO CITAR - REDONDA
   =============================== */

.gom-meta-cite-text {
    font-style: normal;
    font-style: unset;
    font-style: initial;
}
.gom-meta-cite-text {
    font-style: normal !important;
}
.gom-meta-cite-text {
    font-style: normal;
    line-height: 1.7;
    color: var(--text);
    opacity: .95;
}

.gom-references a {
    color: #6a3475;
    text-decoration: none;
    font-weight: 500;
}

.gom-references a:hover {
    text-decoration: underline;
}