/* =========================================================
   GYALUX PORTAL + TIENDA
   TIENDA VISUAL V1
   Referencia: web corporativa + tienda Gyalux actual
   ========================================================= */

:root {
    --bg-page: #F3F5F8;
    --navy-dark: #001A3A;
    --gold: #CBA358;
    --gold-light: #DFB96E;
    --gold-dark: #B88E45;
    --gold-gradient: linear-gradient(
        135deg,
        #DFB96E 0%,
        #B88E45 100%
    );
    --white: #FFFFFF;
    --text: #4A5568;
    --muted: #64748B;
    --soft: #F8FAFC;
    --border: #E2E8F0;
    --font-heading: 'Plus Jakarta Sans', sans-serif;
    --font-body: 'Inter', sans-serif;
}

html {
    scroll-behavior: smooth;
    overflow-y: scroll;
    max-width: 100%;
}

*,
*::before,
*::after {
    box-sizing: border-box;
}

body {
    margin: 0;
    padding: 0;
    background: var(--bg-page);
    color: var(--navy-dark);
    font-family: var(--font-body);
    overflow-x: hidden;
}

a {
    color: inherit;
    text-decoration: none;
}

button,
input,
select,
textarea {
    font: inherit;
}

img,
svg,
video {
    max-width: 100%;
}

.bg-master-container {
    position: fixed;
    inset: 0;
    z-index: -1;
    width: 100vw;
    height: 100vh;
    overflow: hidden;
    background: var(--bg-page);
}

.bg-architectural {
    position: absolute;
    inset: 0;
    background:
        url('/img/fondo-circuito.jpg')
        no-repeat center center;
    background-size: cover;
    opacity: 0.10;

    mask-image:
        linear-gradient(
            to bottom,
            black 0%,
            transparent 95%
        ),
        linear-gradient(
            to left,
            black 50%,
            transparent 100%
        );

    -webkit-mask-image:
        linear-gradient(
            to bottom,
            black 0%,
            transparent 95%
        ),
        linear-gradient(
            to left,
            black 50%,
            transparent 100%
        );

    mask-composite: intersect;
    -webkit-mask-composite: source-in;

    pointer-events: none;
}

.main-wrapper {
    width: 100%;
    max-width: 1280px;
    margin: 0 auto;
    padding: 0 40px;
}


/* =========================================================
   BOTONES
   ========================================================= */

.btn-gold,
.gx-shop-btn-gold {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 9px !important;

    min-height: 44px !important;

    padding: 12px 28px !important;

    color: #FFFFFF !important;
    background: var(--gold-gradient) !important;

    border: 1px solid var(--gold) !important;
    border-radius: 8px !important;

    box-shadow:
        inset 0 0 0 1px var(--gold),
        0 8px 20px rgba(203, 163, 88, 0.30) !important;

    font-family: var(--font-body) !important;
    font-size: 0.85rem !important;
    font-weight: 600 !important;
    line-height: 1 !important;
    letter-spacing: 0.5px !important;

    text-transform: uppercase !important;
    text-shadow: 1px 1px 3px rgba(0, 26, 58, 0.60) !important;

    white-space: nowrap !important;

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

.btn-gold:hover,
.gx-shop-btn-gold:hover {
    transform: translateY(-2px) !important;
}


/* =========================================================
   HEADER DESKTOP
   ========================================================= */

header.gx-header-principal {
    width: 1200px !important;
    max-width: 1200px !important;

    margin: 0 auto !important;
    padding: 30px 0 0 0 !important;

    display: grid !important;
    grid-template-columns:
        245px
        minmax(0, 1fr)
        auto !important;

    column-gap: 34px !important;
    align-items: flex-start !important;

    position: relative !important;

    background: transparent !important;
    border: 0 !important;
    box-shadow: none !important;
}

header.gx-header-principal .logo {
    width: 245px !important;
    min-width: 245px !important;
    max-width: 245px !important;

    display: flex !important;
    justify-content: flex-start !important;
    align-items: flex-start !important;
}

header.gx-header-principal .logo a {
    display: block !important;
}

header.gx-header-principal .logo img {
    display: block !important;

    width: 245px !important;
    max-width: 245px !important;

    height: auto !important;
    object-fit: contain !important;
}


header.gx-header-principal #navbar {
    width: 100% !important;

    display: flex !important;
    align-items: center !important;
    justify-content: flex-end !important;
    flex-wrap: nowrap !important;

    gap: 40px !important;

    margin: 34px 0 0 0 !important;
    padding: 0 !important;
}

header.gx-header-principal #navbar > a,
header.gx-header-principal #navbar > .gx-nav-item > a {
    position: relative !important;

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

    padding: 5px 0 !important;

    color: #001A3A !important;

    font-family: "Inter", Arial, sans-serif !important;
    font-size: 0.85rem !important;
    font-weight: 600 !important;
    line-height: 1.2 !important;
    letter-spacing: 0.5px !important;

    white-space: nowrap !important;
}

header.gx-header-principal #navbar > a::after,
header.gx-header-principal #navbar > .gx-nav-item > a::after {
    content: "" !important;

    position: absolute !important;
    left: 0 !important;
    bottom: -4px !important;

    width: 0 !important;
    height: 2px !important;

    background: #CBA358 !important;

    transition: width .22s ease !important;
}

header.gx-header-principal #navbar > a:hover,
header.gx-header-principal #navbar > a.active,
header.gx-header-principal #navbar > .gx-nav-item > a:hover,
header.gx-header-principal #navbar > .gx-nav-item > a.active {
    color: #CBA358 !important;
}

header.gx-header-principal #navbar > a:hover::after,
header.gx-header-principal #navbar > a.active::after,
header.gx-header-principal #navbar > .gx-nav-item > a:hover::after,
header.gx-header-principal #navbar > .gx-nav-item > a.active::after,
header.gx-header-principal #navbar .gx-nav-parent-active > a::after {
    width: 100% !important;
}


/* ---------- SUBMENÚS ---------- */

header.gx-header-principal #navbar .gx-nav-item {
    position: relative !important;

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

    flex: 0 0 auto !important;
}

header.gx-header-principal #navbar .gx-nav-link {
    gap: 6px !important;
}

header.gx-header-principal #navbar .gx-nav-link i {
    margin-left: 2px !important;

    color: inherit !important;
    font-size: 12px !important;
}

header.gx-header-principal #navbar .gx-nav-dropdown {
    position: absolute !important;

    top: calc(100% + 12px) !important;
    left: 0 !important;

    min-width: 260px !important;
    width: max-content !important;
    max-width: 320px !important;

    padding: 8px !important;

    display: none !important;
    flex-direction: column !important;
    gap: 2px !important;

    background: #FFFFFF !important;

    border: 1px solid rgba(0, 26, 58, 0.10) !important;
    border-radius: 12px !important;

    box-shadow:
        0 18px 45px rgba(0, 26, 58, 0.14) !important;

    z-index: 9999 !important;
}

header.gx-header-principal #navbar .gx-nav-dropdown::before {
    content: "";

    position: absolute;

    left: 0;
    right: 0;
    top: -12px;

    height: 12px;
}

header.gx-header-principal
#navbar
.gx-nav-has-dropdown:hover
.gx-nav-dropdown,
header.gx-header-principal
#navbar
.gx-nav-has-dropdown:focus-within
.gx-nav-dropdown,
header.gx-header-principal
#navbar
.gx-nav-has-dropdown.gx-nav-dropdown-locked
.gx-nav-dropdown {
    display: flex !important;
}

header.gx-header-principal #navbar .gx-nav-dropdown a {
    width: 100% !important;

    padding: 10px 12px !important;

    display: flex !important;
    align-items: center !important;

    color: #001A3A !important;
    background: transparent !important;

    border-radius: 8px !important;

    font-size: 13px !important;
    font-weight: 500 !important;
    letter-spacing: 0 !important;

    white-space: nowrap !important;
}

header.gx-header-principal #navbar .gx-nav-dropdown a::after {
    display: none !important;
}

header.gx-header-principal #navbar .gx-nav-dropdown a:hover,
header.gx-header-principal #navbar .gx-nav-dropdown a.active {
    color: #CBA358 !important;
    background: #F3F5F8 !important;
}

header.gx-header-principal
#navbar
.gx-nav-dropdown
a.gx-nav-main-entry {
    font-weight: 700 !important;

    background:
        rgba(203, 163, 88, 0.10) !important;
}

.gx-nav-dropdown-separator {
    width: calc(100% - 16px) !important;
    height: 1px !important;

    margin: 5px 8px 6px !important;

    background: rgba(0, 26, 58, 0.10) !important;
}


/* ---------- ACCIONES ---------- */

header.gx-header-principal .gx-header-actions {
    display: flex !important;
    align-items: center !important;

    gap: 14px !important;

    margin: 26px 0 0 0 !important;
}

header.gx-header-principal .gx-desktop-cta {
    min-width: 170px !important;
    height: 44px !important;
}

header.gx-header-principal .gx-odoo-cart-btn,
header.gx-header-principal .gx-odoo-user-btn,
header.gx-header-principal .gx-mobile-menu-toggle {
    position: relative !important;

    height: 42px !important;
    min-height: 42px !important;

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

    margin: 0 !important;

    background:
        rgba(255, 255, 255, 0.78) !important;

    color: #001A3A !important;

    border:
        1px solid rgba(0, 26, 58, 0.08) !important;

    border-radius: 11px !important;

    box-shadow: none !important;

    cursor: pointer !important;
}

header.gx-header-principal .gx-odoo-cart-btn {
    width: 44px !important;
    min-width: 44px !important;
}

header.gx-header-principal .gx-odoo-user-btn {
    min-width: 48px !important;

    padding: 5px 8px !important;
}

header.gx-header-principal .gx-odoo-user-btn::after {
    content: "";

    margin-left: 4px;

    border-top: .3em solid currentColor;
    border-right: .3em solid transparent;
    border-left: .3em solid transparent;

    transform: scale(.75);
}

header.gx-header-principal
.gx-odoo-cart-btn
i.fa-stack,
header.gx-header-principal
.gx-odoo-user-btn
i.fa-stack {
    width: 2em !important;
    height: 2em !important;

    line-height: 2em !important;
    text-align: center !important;

    font-size: 14px !important;
}

.gx-cart-badge {
    position: absolute !important;

    top: -7px !important;
    right: -7px !important;

    min-width: 18px !important;
    height: 18px !important;

    padding: 0 5px !important;

    display: none !important;
    align-items: center !important;
    justify-content: center !important;

    background: #CBA358 !important;
    color: #001A3A !important;

    border-radius: 999px !important;

    font-size: 11px !important;
    font-weight: 700 !important;
    line-height: 1 !important;
}

.gx-cart-badge:not(:empty) {
    display: inline-flex !important;
}


/* ---------- USUARIO ---------- */

.gx-user-menu {
    position: relative !important;

    display: inline-flex !important;
}

.gx-user-dropdown {
    position: absolute !important;

    top: calc(100% + 10px) !important;
    right: 0 !important;

    width: 220px !important;

    padding: 8px !important;

    display: none !important;

    background: #FFFFFF !important;

    border:
        1px solid rgba(0, 26, 58, 0.10) !important;

    border-radius: 10px !important;

    box-shadow:
        0 16px 40px rgba(0, 26, 58, 0.12) !important;

    z-index: 10000 !important;
}

.gx-user-menu:hover .gx-user-dropdown,
.gx-user-menu:focus-within .gx-user-dropdown,
.gx-user-menu.gx-user-menu-open .gx-user-dropdown {
    display: block !important;
}

.gx-user-dropdown a,
.gx-user-dropdown-action {
    width: 100% !important;

    min-height: 36px !important;

    padding: 9px 10px !important;

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

    gap: 9px !important;

    color: #001A3A !important;
    background: transparent !important;

    border: 0 !important;
    border-radius: 7px !important;

    font-size: 13px !important;
    font-weight: 500 !important;

    cursor: pointer !important;
    text-align: left !important;
    white-space: nowrap !important;
}

.gx-user-dropdown a:hover,
.gx-user-dropdown-action:hover {
    color: #CBA358 !important;
    background: #F3F5F8 !important;
}

.gx-user-dropdown a i,
.gx-user-dropdown-action i {
    width: 16px !important;

    color: inherit !important;

    text-align: center !important;
}

.dropdown-divider {
    height: 1px !important;

    margin: 6px 0 !important;

    background:
        rgba(0, 26, 58, 0.10) !important;
}


/* =========================================================
   BENEFICIOS
   ========================================================= */

.gx-benefits-bar {
    width: 1200px !important;
    max-width: 1200px !important;

    height: 50px !important;

    margin: 10px auto 50px auto !important;

    background:
        rgba(255, 255, 255, 0.35) !important;

    overflow: visible !important;
}

.gx-benefits-inner {
    width: 100% !important;
    height: 50px !important;

    padding: 11px 0 !important;

    display: flex !important;
    align-items: center !important;

    gap: 42px !important;
}

.gx-benefit {
    height: 28px !important;

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

    color: #001A3A !important;

    font-family: "Inter", Arial, sans-serif !important;
    font-size: 13px !important;
    font-weight: 500 !important;

    white-space: nowrap !important;
}

.gx-benefit i {
    width: 28px !important;
    height: 28px !important;

    margin-right: 7px !important;

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

    color: #CBA358 !important;

    font-size: 14px !important;
}


/* =========================================================
   CONTENIDO TIENDA
   ========================================================= */

.gx-store-main {
    width: 1200px;
    max-width: 1200px;

    margin: 0 auto;
    padding: 0 0 76px;
}

.gx-container {
    width: 100%;
}

.gx-alert {
    width: 100%;

    margin: 0 0 24px;
    padding: 14px 16px;

    border-radius: 10px;

    font-size: .88rem;
}

.gx-alert-success {
    color: #176C48;
    background: #EFFAF4;

    border: 1px solid rgba(23, 108, 72, .16);
}

.gx-eyebrow,
.gx-shop-eyebrow {
    display: inline-flex;

    margin: 0 0 18px;

    color: #CBA358;

    font-family: var(--font-body);
    font-size: .75em;
    font-weight: 400;
    line-height: 1.2;
    letter-spacing: 3px;

    text-transform: uppercase;
}


/* =========================================================
   HOME CLON VISUAL TIENDA ACTUAL
   ========================================================= */

.gx-shop-home-v1 {
    width: 1200px;
    max-width: 1200px;

    margin: 0 auto;

    color: #001A3A;

    font-family: var(--font-body);
}

.gx-shop-hero {
    display: grid;

    grid-template-columns:
        minmax(0, 1.02fr)
        minmax(360px, .98fr);

    gap: 58px;

    align-items: center;

    padding: 18px 0 52px;
}

.gx-shop-hero-content {
    max-width: 700px;
}

.gx-shop-hero h1 {
    max-width: 900px;

    margin: 0 0 24px;

    color: #001A3A;

    font-family: var(--font-heading);

    font-size: 3.2rem;
    font-weight: 800;

    line-height: 1.1;
    letter-spacing: -1px;
}

.gx-shop-gold-text {
    color: #CBA358;
}

.gx-shop-hero-lead {
    max-width: 690px;

    margin: 0 0 28px;

    color: #4A5568;

    font-size: 1.12rem;
    line-height: 1.72;
}

.gx-shop-btns {
    display: flex;
    flex-wrap: wrap;

    gap: 14px;

    align-items: center;

    margin-top: 14px;
}

.gx-shop-btn {
    height: 44px;
    min-height: 44px;

    padding: 12px 26px;

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

    gap: 9px;

    border-radius: 8px;

    font-size: .85rem;
    font-weight: 700;

    line-height: 1;
    letter-spacing: .5px;

    text-transform: uppercase;

    transition: transform .22s ease;
}

.gx-shop-btn:hover {
    transform: translateY(-2px);
}

.gx-shop-btn-dark {
    color: #FFFFFF;

    background: #001A3A;

    border: 1px solid #001A3A;

    box-shadow:
        0 12px 28px rgba(0, 26, 58, .16);
}

.gx-shop-btn-outline {
    color: #001A3A;

    background:
        rgba(255, 255, 255, .72);

    border:
        1px solid rgba(0, 26, 58, .16);
}

.gx-shop-btn-outline-dark {
    color: #FFFFFF;

    background: transparent;

    border:
        1px solid rgba(255, 255, 255, .28);
}


/* ---------- HERO CARD ---------- */

.gx-shop-hero-visual {
    display: flex;
    align-items: center;
    justify-content: center;
}

.gx-shop-main-card {
    position: relative;

    width: 100%;
    max-width: 500px;

    padding: 30px;

    overflow: hidden;

    background:
        rgba(255, 255, 255, .94);

    border:
        1px solid rgba(0, 26, 58, .08);

    border-radius: 30px;

    box-shadow:
        0 22px 55px rgba(0, 26, 58, .12);
}

.gx-shop-main-card::before {
    content: "";

    position: absolute;

    width: 190px;
    height: 190px;

    right: -82px;
    top: -88px;

    border-radius: 50%;

    background:
        rgba(203, 163, 88, .12);
}

.gx-shop-main-card > * {
    position: relative;
    z-index: 1;
}

.gx-shop-main-card-top {
    margin-bottom: 22px;

    display: flex;
    align-items: center;
    justify-content: space-between;

    gap: 14px;
}

.gx-shop-main-card-title {
    color: #001A3A;

    font-family: var(--font-heading);
    font-size: 1.28rem;
    font-weight: 800;
}

.gx-shop-main-card-tag {
    padding: 7px 10px;

    background:
        rgba(203, 163, 88, .12);

    color: #B88E45;

    border-radius: 999px;

    font-size: .72rem;
    font-weight: 800;

    text-transform: uppercase;
}

.gx-shop-solution-list {
    display: grid;
    gap: 12px;
}

.gx-shop-solution-row {
    display: grid;

    grid-template-columns:
        44px
        minmax(0, 1fr)
        auto;

    gap: 12px;

    align-items: center;

    padding: 13px;

    background: #F8FAFC;

    border:
        1px solid rgba(0, 26, 58, .06);

    border-radius: 18px;
}

.gx-shop-solution-icon {
    width: 44px;
    height: 44px;

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

    color: #CBA358;

    background:
        rgba(203, 163, 88, .12);

    border-radius: 14px;
}

.gx-shop-solution-row strong {
    display: block;

    margin-bottom: 3px;

    color: #001A3A;

    font-size: .93rem;
    font-weight: 800;
}

.gx-shop-solution-row span span {
    color: #4A5568;

    font-size: .80rem;
    line-height: 1.32;
}

.gx-shop-solution-arrow {
    color: #CBA358;
}

.gx-shop-hero-note {
    margin-top: 18px;
    padding: 18px;

    background: #001A3A;

    color: #FFFFFF;

    border-radius: 20px;

    box-shadow:
        0 16px 34px rgba(0, 26, 58, .16);
}

.gx-shop-hero-note strong {
    display: block;

    margin-bottom: 6px;

    color: #FFFFFF;

    font-family: var(--font-heading);
}

.gx-shop-hero-note span {
    color:
        rgba(255, 255, 255, .78);

    font-size: .86rem;
    line-height: 1.45;
}


/* ---------- PUNTOS HERO ---------- */

.gx-shop-hero-points {
    grid-column: 1 / -1;

    display: grid;

    grid-template-columns:
        repeat(5, minmax(0, 1fr));

    gap: 12px;

    margin-top: 6px;
}

.gx-shop-hero-point {
    min-height: 92px;

    padding: 16px;

    background:
        rgba(255, 255, 255, .70);

    border:
        1px solid rgba(0, 26, 58, .08);

    border-radius: 18px;

    box-shadow:
        0 12px 34px rgba(0, 26, 58, .05);
}

.gx-shop-hero-point strong {
    display: block;

    margin-bottom: 5px;

    color: #001A3A;

    font-size: .95rem;
    font-weight: 800;
}

.gx-shop-hero-point span {
    color: #4A5568;

    font-size: .86rem;
    line-height: 1.45;
}


/* ---------- TRUST ---------- */

.gx-shop-trustbar {
    display: grid;

    grid-template-columns:
        repeat(4, minmax(0, 1fr));

    gap: 1px;

    margin: 0 0 62px;

    overflow: hidden;

    background:
        rgba(0, 26, 58, .10);

    border-radius: 24px;

    box-shadow:
        0 18px 45px rgba(0, 26, 58, .08);
}

.gx-shop-trust-item {
    min-height: 116px;

    padding: 22px;

    background:
        rgba(255, 255, 255, .78);
}

.gx-shop-trust-item i {
    display: block;

    margin-bottom: 10px;

    color: #CBA358;

    font-size: 1.2rem;
}

.gx-shop-trust-item strong {
    display: block;

    margin-bottom: 6px;

    color: #001A3A;

    font-size: .98rem;
    font-weight: 800;
}

.gx-shop-trust-item span {
    color: #4A5568;

    font-size: .86rem;
    line-height: 1.45;
}


/* ---------- SECCIONES ---------- */

.gx-shop-section {
    margin: 0 0 72px;
}

.gx-shop-section-head {
    max-width: 820px;

    margin: 0 0 28px;
}

.gx-shop-section h2,
.gx-shop-difference h2 {
    margin: 0 0 16px;

    color: #001A3A;

    font-family: var(--font-heading);

    font-size: clamp(
        2rem,
        3.2vw,
        3.25rem
    );

    font-weight: 800;

    line-height: 1.04;
    letter-spacing: -.045em;
}

.gx-shop-section-head p {
    max-width: 760px;

    margin: 0;

    color: #4A5568;

    font-size: 1.02rem;
    line-height: 1.72;
}


/* =========================================================
   PRODUCTOS
   ========================================================= */

.gx-store-grid {
    display: grid;

    grid-template-columns:
        repeat(3, minmax(0, 1fr));

    gap: 18px;
}

.gx-store-card {
    min-width: 0;

    overflow: hidden;

    background: #FFFFFF;

    border:
        1px solid rgba(0, 26, 58, .08);

    border-radius: 24px;

    box-shadow:
        0 14px 34px rgba(0, 26, 58, .05);

    transition:
        transform .22s ease,
        border-color .22s ease,
        box-shadow .22s ease;
}

.gx-store-card:hover {
    transform: translateY(-5px);

    border-color:
        rgba(203, 163, 88, .42);

    box-shadow:
        0 22px 54px rgba(0, 26, 58, .10);
}

.gx-store-card-media {
    height: 250px;

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

    overflow: hidden;

    background: #F8FAFC;
}

.gx-store-card-media img {
    width: 100%;
    height: 100%;

    padding: 20px;

    object-fit: contain;

    transition: transform .25s ease;
}

.gx-store-card:hover
.gx-store-card-media
img {
    transform: scale(1.025);
}

.gx-store-card-body {
    padding: 24px;
}

.gx-store-card-meta,
.gx-store-product-tags {
    display: flex;
    flex-wrap: wrap;

    gap: 8px;
}

.gx-store-card-meta span,
.gx-store-product-tags span,
.gx-store-state {
    padding: 6px 9px;

    color: #B88E45;

    background:
        rgba(203, 163, 88, .10);

    border:
        1px solid rgba(203, 163, 88, .25);

    border-radius: 999px;

    font-size: .70rem;
    font-weight: 700;
}

.gx-store-card h3,
.gx-store-card h2 {
    margin: 17px 0 10px;

    color: #001A3A;

    font-family: var(--font-heading);

    font-size: 1.18rem;
    line-height: 1.28;
}

.gx-store-card-body > p {
    min-height: 72px;

    margin: 0;

    color: #5B6677;

    font-size: .92rem;
    line-height: 1.62;
}

.gx-store-card-bottom {
    margin-top: 22px;
    padding-top: 18px;

    display: flex;
    align-items: flex-end;
    justify-content: space-between;

    gap: 14px;

    border-top:
        1px solid rgba(0, 26, 58, .06);
}

.gx-store-price {
    display: flex;
    flex-direction: column;
}

.gx-store-price small,
.gx-store-price span {
    color: #64748B;

    font-size: .72rem;
}

.gx-store-price strong {
    color: #001A3A;

    font-family: var(--font-heading);

    font-size: 1.55rem;
}

.gx-store-card-link {
    display: inline-flex;
    align-items: center;

    gap: 7px;

    color: #CBA358;

    font-size: .84rem;
    font-weight: 800;
}


/* ---------- DIFERENCIAL ---------- */

.gx-shop-difference {
    display: grid;

    grid-template-columns:
        minmax(0, .92fr)
        minmax(0, 1.08fr);

    gap: 32px;

    margin-bottom: 72px;
}

.gx-shop-difference-main {
    padding: 34px;

    color: #FFFFFF;

    background: #001A3A;

    border-radius: 28px;

    box-shadow:
        0 24px 70px rgba(0, 26, 58, .14);
}

.gx-shop-difference-main
.gx-shop-eyebrow {
    color: #DFB96E;
}

.gx-shop-difference-main h2 {
    color: #FFFFFF;
}

.gx-shop-difference-main p {
    margin: 0;

    color:
        rgba(255, 255, 255, .76);

    font-size: 1.02rem;
    line-height: 1.72;
}

.gx-shop-difference-main .gx-shop-btns {
    margin-top: 26px;
}

.gx-shop-difference-grid {
    display: grid;

    grid-template-columns:
        repeat(2, minmax(0, 1fr));

    gap: 16px;
}

.gx-shop-difference-card {
    padding: 24px;

    background:
        rgba(255, 255, 255, .84);

    border:
        1px solid rgba(0, 26, 58, .08);

    border-radius: 22px;
}

.gx-shop-difference-card i {
    width: 42px;
    height: 42px;

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

    margin-bottom: 18px;

    color: #CBA358;

    background:
        rgba(203, 163, 88, .10);

    border-radius: 13px;
}

.gx-shop-difference-card h3 {
    margin: 0 0 9px;

    color: #001A3A;

    font-family: var(--font-heading);

    font-size: 1rem;
}

.gx-shop-difference-card p {
    margin: 0;

    color: #4A5568;

    font-size: .9rem;
    line-height: 1.55;
}


/* =========================================================
   FICHA DE PRODUCTO
   ========================================================= */

.gx-store-breadcrumb {
    margin: 0 0 18px;

    display: flex;
    align-items: center;

    gap: 8px;

    color: #64748B;

    font-size: .82rem;
}

.gx-store-breadcrumb a {
    color: #001A3A;

    font-weight: 600;
}

.gx-store-breadcrumb i {
    color: #CBA358;
}

.gx-store-product-shell {
    padding: 34px;

    display: grid;

    grid-template-columns:
        minmax(340px, .9fr)
        minmax(0, 1.1fr);

    gap: 44px;

    background:
        rgba(255, 255, 255, .97);

    border:
        1px solid rgba(0, 26, 58, .08);

    border-radius: 30px;

    box-shadow:
        0 22px 55px rgba(0, 26, 58, .08);
}

.gx-store-product-media {
    min-height: 500px;

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

    overflow: hidden;

    background: #F8FAFC;

    border-radius: 24px;
}

.gx-store-product-media img {
    width: 100%;
    max-height: 520px;

    padding: 28px;

    object-fit: contain;
}

.gx-store-product-content {
    padding: 8px 0;
}

.gx-store-reference {
    display: inline-block;

    margin-top: 16px;

    color: #64748B;

    font-size: .78rem;
    font-weight: 600;
}

.gx-store-product-content h1 {
    margin: 9px 0 16px;

    color: #001A3A;

    font-family: var(--font-heading);

    font-size: clamp(
        2rem,
        4vw,
        3.25rem
    );

    line-height: 1.08;
    letter-spacing: -1px;
}

.gx-store-lead {
    margin: 0;

    color: #4A5568;

    font-size: 1rem;
    line-height: 1.75;
}

.gx-store-price-large {
    margin: 24px 0;
    padding: 18px 0;

    border-top:
        1px solid rgba(0, 26, 58, .07);

    border-bottom:
        1px solid rgba(0, 26, 58, .07);
}

.gx-store-price-large strong {
    font-size: 2rem;
}


/* ---------- OPCIONES ---------- */

.gx-store-buy-form fieldset {
    margin: 0;
    padding: 0;

    border: 0;
}

.gx-store-buy-form legend {
    margin-bottom: 11px;

    color: #001A3A;

    font-weight: 600;
}

.gx-store-option-list {
    display: grid;

    gap: 10px;
}

.gx-store-option {
    padding: 14px 16px;

    display: flex;
    align-items: center;

    gap: 12px;

    background: #F8FAFC;

    border: 1px solid #E2E8F0;
    border-radius: 12px;

    cursor: pointer;
}

.gx-store-option:has(input:checked) {
    background:
        rgba(203, 163, 88, .08);

    border-color:
        rgba(203, 163, 88, .75);
}

.gx-store-option input {
    accent-color: #CBA358;
}

.gx-store-option span {
    display: flex;
    flex-direction: column;

    gap: 3px;
}

.gx-store-option strong {
    color: #001A3A;
}

.gx-store-option small {
    color: #64748B;
}

.gx-store-buy-row {
    margin-top: 18px;

    display: grid;

    grid-template-columns:
        110px
        minmax(0, 1fr);

    gap: 12px;

    align-items: flex-end;
}

.gx-store-buy-row label,
.gx-store-cart-line-actions label {
    display: flex;
    flex-direction: column;

    gap: 7px;
}

.gx-store-buy-row label > span,
.gx-store-cart-line-actions label > span {
    color: #001A3A;

    font-size: .78rem;
    font-weight: 600;
}

.gx-store-buy-row input,
.gx-store-cart-line-actions input {
    width: 100%;

    padding: 12px 13px;

    color: #001A3A;
    background: #F8FAFC;

    border: 1px solid #E2E8F0;
    border-radius: 12px;

    outline: none;
}

.gx-store-buy-row input:focus,
.gx-store-cart-line-actions input:focus {
    background: #FFFFFF;

    border-color: #CBA358;

    box-shadow:
        0 0 0 3px rgba(203, 163, 88, .10);
}

.gx-store-add-button {
    min-height: 46px !important;
}

.gx-store-commercial-note {
    margin-top: 18px;
    padding: 14px 16px;

    display: flex;

    gap: 10px;

    background: #F8FAFC;

    border:
        1px solid rgba(0, 26, 58, .06);

    border-radius: 12px;
}

.gx-store-commercial-note i {
    color: #CBA358;
}

.gx-store-commercial-note p {
    margin: 0;

    color: #64748B;

    font-size: .82rem;
    line-height: 1.55;
}

.gx-store-description-shell {
    margin-top: 24px;
    padding: 34px;

    display: grid;

    grid-template-columns:
        .42fr
        1fr;

    gap: 40px;

    background:
        rgba(255, 255, 255, .95);

    border:
        1px solid rgba(0, 26, 58, .07);

    border-radius: 28px;
}

.gx-store-description-shell h2 {
    margin: 7px 0 0;

    color: #001A3A;

    font-family: var(--font-heading);
}

.gx-store-description-text {
    color: #4A5568;

    line-height: 1.75;
}


/* =========================================================
   CARRITO
   ========================================================= */

.gx-store-section-heading {
    margin: 0 0 24px;

    display: flex;
    align-items: flex-end;
    justify-content: space-between;

    gap: 24px;
}

.gx-store-section-heading h1,
.gx-store-section-heading h2 {
    margin: 5px 0 0;

    color: #001A3A;

    font-family: var(--font-heading);
}

.gx-store-section-heading h1 {
    font-size: clamp(
        2rem,
        4vw,
        3rem
    );
}

.gx-store-section-heading p {
    max-width: 760px;

    margin: 10px 0 0;

    color: #64748B;

    line-height: 1.65;
}

.gx-store-cart-layout {
    display: grid;

    grid-template-columns:
        minmax(0, 1fr)
        360px;

    gap: 24px;

    align-items: flex-start;
}

.gx-store-cart-lines {
    display: grid;

    gap: 14px;
}

.gx-store-cart-line {
    padding: 18px;

    display: grid;

    grid-template-columns:
        125px
        minmax(0, 1fr)
        180px;

    gap: 18px;

    align-items: center;

    background:
        rgba(255, 255, 255, .96);

    border:
        1px solid rgba(0, 26, 58, .07);

    border-radius: 22px;
}

.gx-store-cart-line > img {
    width: 125px;
    height: 125px;

    padding: 8px;

    background: #F8FAFC;

    border-radius: 16px;

    object-fit: contain;
}

.gx-store-cart-line-main h2 {
    margin: 5px 0 6px;

    color: #001A3A;

    font-family: var(--font-heading);

    font-size: 1.05rem;
}

.gx-store-cart-line-main p,
.gx-store-cart-line-main small {
    color: #64748B;
}

.gx-store-cart-line-actions {
    display: flex;
    flex-direction: column;

    gap: 7px;
}

.gx-store-cart-line-actions > strong {
    color: #001A3A;

    font-family: var(--font-heading);

    font-size: 1.2rem;

    text-align: right;
}

.gx-store-cart-line-actions > span {
    color: #64748B;

    font-size: .70rem;

    text-align: right;
}

.gx-store-secondary-btn {
    min-height: 36px;

    padding: 8px 12px;

    color: #001A3A;
    background: #FFFFFF;

    border:
        1px solid rgba(0, 26, 58, .10);

    border-radius: 9px;

    font-size: .78rem;
    font-weight: 600;

    cursor: pointer;
}

.gx-store-remove-btn {
    min-height: 34px;

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

    gap: 6px;

    color: #9B3232;
    background: transparent;

    border: 0;

    cursor: pointer;
}

.gx-store-summary {
    position: sticky;
    top: 18px;

    padding: 28px;

    color: #FFFFFF;

    background: #001A3A;

    border:
        1px solid rgba(203, 163, 88, .28);

    border-radius: 24px;

    box-shadow:
        0 24px 55px rgba(0, 26, 58, .15);
}

.gx-store-summary h2 {
    margin: 7px 0 20px;

    font-family: var(--font-heading);
}

.gx-store-summary dl {
    margin: 0;
}

.gx-store-summary dl > div {
    padding: 11px 0;

    display: flex;
    justify-content: space-between;

    gap: 16px;

    border-bottom:
        1px solid rgba(255, 255, 255, .10);
}

.gx-store-summary dt {
    color:
        rgba(255, 255, 255, .65);
}

.gx-store-summary dd {
    margin: 0;

    font-weight: 600;
}

.gx-store-summary-total {
    margin-top: 8px;

    border-bottom: 0 !important;
}

.gx-store-summary-next {
    margin: 18px 0;
    padding: 12px;

    display: flex;

    gap: 9px;

    background:
        rgba(255, 255, 255, .07);

    border-radius: 12px;
}

.gx-store-summary-next i {
    color: #CBA358;
}

.gx-store-summary-next p {
    margin: 0;

    color:
        rgba(255, 255, 255, .67);

    font-size: .78rem;
    line-height: 1.5;
}

.gx-store-summary .gx-store-text-link {
    color: #FFFFFF;
}

.gx-store-text-link {
    display: inline-flex;
    align-items: center;

    gap: 8px;

    color: #001A3A;

    font-weight: 600;
}

.gx-store-text-link i {
    color: #CBA358;
}


/* =========================================================
   VACÍO / ERROR
   ========================================================= */

.gx-store-empty,
.gx-store-error {
    padding: 58px 36px;

    text-align: center;

    background:
        rgba(255, 255, 255, .95);

    border:
        1px solid rgba(0, 26, 58, .07);

    border-radius: 28px;

    box-shadow:
        0 14px 34px rgba(0, 0, 0, .03);
}

.gx-store-empty > i,
.gx-store-error > i {
    margin-bottom: 14px;

    color: #CBA358;

    font-size: 2.3rem;
}

.gx-store-empty h2,
.gx-store-error h1 {
    margin: 8px 0 10px;

    color: #001A3A;

    font-family: var(--font-heading);
}

.gx-store-empty p,
.gx-store-error p {
    max-width: 650px;

    margin: 0 auto 22px;

    color: #64748B;

    line-height: 1.65;
}


/* =========================================================
   FOOTER CORPORATIVO
   ========================================================= */

.gx-site-footer {
    width: 100% !important;

    margin: 0 !important;
    padding: 0 !important;

    color:
        rgba(255, 255, 255, .76) !important;

    font-family:
        'Inter',
        sans-serif !important;
}

.gx-footer-shell {
    width: 100% !important;
    max-width: 1280px !important;

    margin: 0 auto !important;

    overflow: hidden !important;

    background: #001A3A !important;

    border-top:
        4px solid #CBA358 !important;

    box-shadow:
        0 -18px 50px rgba(0, 26, 58, .08) !important;
}

.gx-footer-head {
    padding: 30px 40px !important;

    display: grid !important;

    grid-template-columns:
        minmax(0, 1fr)
        auto !important;

    gap: 34px !important;

    align-items: center !important;

    background:
        rgba(255, 255, 255, .96) !important;

    border-bottom:
        1px solid rgba(0, 26, 58, .08) !important;
}

.gx-footer-brand-block {
    display: grid !important;

    grid-template-columns:
        auto
        minmax(0, 520px) !important;

    gap: 24px !important;

    align-items: center !important;
}

.gx-footer-logo-link {
    display: inline-flex !important;
}

.gx-footer-logo {
    width: 164px !important;
    max-width: 164px !important;

    display: block !important;
}

.gx-footer-brand-block p {
    max-width: 520px !important;

    margin: 0 !important;

    color: #4A5568 !important;

    font-size: .95rem !important;
    line-height: 1.65 !important;
}

.gx-footer-partners-compact {
    display: flex !important;
    align-items: center !important;
    justify-content: flex-end !important;

    gap: 18px !important;
}

.gx-footer-partners-title,
.gx-footer-column h2 {
    color: #CBA358 !important;

    font-family:
        'Plus Jakarta Sans',
        sans-serif !important;

    font-size: .76rem !important;
    font-weight: 800 !important;

    letter-spacing: 1px !important;

    text-transform: uppercase !important;

    white-space: nowrap !important;
}

.gx-footer-partners-row {
    display: flex !important;
    flex-wrap: wrap !important;

    gap: 10px !important;
}

.gx-footer-partner-pill {
    min-width: 146px !important;
    height: 58px !important;

    padding: 8px 12px !important;

    display: grid !important;

    grid-template-columns:
        72px
        minmax(0, 1fr) !important;

    gap: 10px !important;

    align-items: center !important;

    color: #001A3A !important;
    background: #FFFFFF !important;

    border:
        1px solid rgba(0, 26, 58, .10) !important;

    border-radius: 14px !important;

    box-shadow:
        0 10px 22px rgba(0, 26, 58, .07) !important;
}

.gx-footer-partner-logo-box {
    width: 72px !important;
    height: 40px !important;

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

    overflow: hidden !important;

    background: #FFFFFF !important;

    border-radius: 8px !important;
}

.gx-footer-partner-logo-box img {
    width: auto !important;
    max-width: 70px !important;

    max-height: 34px !important;

    object-fit: contain !important;
}

.gx-footer-partner-pill > span:last-child {
    color: #001A3A !important;

    font-size: .74rem !important;
    font-weight: 800 !important;

    text-transform: uppercase !important;
}

.gx-footer-main {
    padding: 0 40px 24px !important;

    background: #001A3A !important;
}

.gx-footer-content {
    padding: 34px 0 32px !important;

    display: grid !important;

    grid-template-columns:
        1.12fr
        1.05fr
        1fr
        .82fr
        1.05fr !important;

    gap: 34px !important;

    border-bottom:
        1px solid rgba(255, 255, 255, .12) !important;
}

.gx-footer-column h2 {
    margin: 0 0 15px !important;
}

.gx-footer-column ul {
    margin: 0 !important;
    padding: 0 !important;

    display: grid !important;

    gap: 10px !important;

    list-style: none !important;
}

.gx-footer-column a,
.gx-footer-contact span {
    color:
        rgba(255, 255, 255, .70) !important;

    font-size: .92rem !important;
    line-height: 1.45 !important;
}

.gx-footer-column a:hover {
    color: #CBA358 !important;
}

.gx-footer-contact li {
    display: grid !important;

    grid-template-columns:
        22px
        minmax(0, 1fr) !important;

    gap: 10px !important;

    align-items: flex-start !important;
}

.gx-footer-contact i {
    color: #CBA358 !important;

    font-size: 1.08rem !important;
}

.gx-footer-bottomline {
    padding: 22px 0 0 !important;

    display: flex !important;
    justify-content: center !important;
}

.gx-footer-copy {
    width: 100% !important;

    margin: 2px 0 0 !important;

    color:
        rgba(255, 255, 255, .52) !important;

    font-size: .78rem !important;
    line-height: 1.55 !important;

    white-space: nowrap !important;

    text-align: center !important;
}

.gx-footer-copy span::before {
    content: "•";

    margin: 0 12px;

    color: #CBA358;

    font-weight: 800;
}


/* =========================================================
   MENÚ MÓVIL - OCULTO DESKTOP
   ========================================================= */

.gx-mobile-contact-actions,
.gx-mobile-contact-btn,
.gx-mobile-menu-toggle,
.gx-mobile-menu-overlay,
.gx-mobile-menu-panel {
    display: none !important;
}


/* =========================================================
   TABLET
   ========================================================= */

@media (max-width: 1260px) and (min-width: 992px) {

    .main-wrapper {
        max-width: 100%;

        padding-left: 24px;
        padding-right: 24px;
    }

    header.gx-header-principal,
    .gx-benefits-bar,
    .gx-store-main,
    .gx-shop-home-v1 {
        width: 100% !important;
        max-width: 1200px !important;
    }

    header.gx-header-principal {
        grid-template-columns:
            220px
            minmax(0, 1fr)
            auto !important;

        column-gap: 26px !important;
    }

    header.gx-header-principal .logo,
    header.gx-header-principal .logo img {
        width: 220px !important;
        min-width: 220px !important;
        max-width: 220px !important;
    }

    header.gx-header-principal #navbar {
        gap: 22px !important;
    }

    .gx-footer-shell {
        width: 100% !important;
    }
}


/* =========================================================
   MOBILE / TABLET VERTICAL
   ========================================================= */

@media (max-width: 991px) {

    html,
    body {
        overflow-x: hidden;
    }

    .main-wrapper {
        width: 100% !important;
        max-width: 100% !important;

        padding:
            0 18px 36px !important;
    }

    .bg-architectural {
        opacity: .075 !important;
        background-position: center top !important;
    }


    /* HEADER */

    header.gx-header-principal {
        width: 100% !important;
        max-width: 100% !important;
        min-height: 0 !important;
        margin: 0 auto !important;
        padding: 14px 0 0 !important;
        display: flex !important;
        flex-direction: column !important;
        align-items: stretch !important;
        justify-content: flex-start !important;
        gap: 12px !important;
        position: relative !important;
        z-index: 1000 !important;
        background: transparent !important;
        box-sizing: border-box !important;
    }

    header.gx-header-principal .logo {
        width: 100% !important;
        min-width: 0 !important;
        max-width: 100% !important;
        margin: 0 !important;
        padding: 0 !important;
        order: 1 !important;
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
    }

    header.gx-header-principal .logo a {
        display: block !important;
        margin: 0 !important;
        padding: 0 !important;
    }

    header.gx-header-principal .logo img {
        width: clamp(218px, 62vw, 242px) !important;
        min-width: 0 !important;
        max-width: 228px !important;
        height: auto !important;
        max-height: none !important;
        display: block !important;
        object-fit: contain !important;
        margin: 0 !important;
        padding: 0 !important;
    }

    header.gx-header-principal #navbar {
        display: none !important;
    }

    header.gx-header-principal .gx-header-actions {
        width: 100% !important;
        max-width: 100% !important;
        order: 2 !important;
        margin: 0 !important;
        padding: 0 !important;
        display: flex !important;
        flex-direction: row !important;
        flex-wrap: nowrap !important;
        align-items: center !important;
        justify-content: flex-start !important;
        gap: 8px !important;
        box-sizing: border-box !important;
    }

    header.gx-header-principal .gx-header-actions .gx-desktop-cta,
    header.gx-header-principal .gx-header-actions > .btn-gold {
        display: none !important;
    }

    header.gx-header-principal .gx-mobile-contact-actions {
        flex: 0 0 auto !important;
        display: inline-flex !important;
        align-items: center !important;
        justify-content: flex-start !important;
        gap: 8px !important;
        margin: 0 auto 0 0 !important;
        padding: 0 !important;
    }

    header.gx-header-principal .gx-mobile-contact-btn,
    header.gx-header-principal .gx-mobile-menu-toggle {
        width: 46px !important;
        min-width: 46px !important;
        max-width: 46px !important;
        height: 46px !important;
        min-height: 46px !important;
        max-height: 46px !important;
        margin: 0 !important;
        padding: 0 !important;
        display: inline-flex !important;
        align-items: center !important;
        justify-content: center !important;
        flex: 0 0 46px !important;
        background: linear-gradient(135deg, #DFB96E 0%, #B88E45 100%) !important;
        color: #FFFFFF !important;
        border: 1px solid #CBA358 !important;
        border-radius: 11px !important;
        box-shadow: inset 0 0 0 1px rgba(255,255,255,.12), 0 7px 18px rgba(203,163,88,.24) !important;
        text-shadow: 1px 1px 2px rgba(0,26,58,.36) !important;
        text-decoration: none !important;
        box-sizing: border-box !important;
        cursor: pointer !important;
        appearance: none !important;
        -webkit-appearance: none !important;
    }

    header.gx-header-principal .gx-mobile-contact-btn i,
    header.gx-header-principal .gx-mobile-menu-toggle i {
        margin: 0 !important;
        padding: 0 !important;
        color: inherit !important;
        font-size: 18px !important;
        line-height: 1 !important;
    }

    header.gx-header-principal .gx-odoo-cart-btn,
    header.gx-header-principal .gx-user-menu {
        display: none !important;
        visibility: hidden !important;
        pointer-events: none !important;
    }


    /* BENEFICIOS · MISMA GEOMETRIA QUE WEB VALIDADA */

    .gx-benefits-bar {
        width: 100% !important;
        max-width: 100% !important;
        height: auto !important;
        min-height: 0 !important;
        max-height: none !important;
        margin: 16px auto 44px auto !important;
        padding: 0 !important;
        display: block !important;
        background: rgba(255, 255, 255, 0.42) !important;
        border: 0 !important;
        border-radius: 16px !important;
        box-shadow: none !important;
        overflow: hidden !important;
        box-sizing: border-box !important;
    }

    .gx-benefits-inner {
        width: 100% !important;
        max-width: 100% !important;
        height: auto !important;
        min-height: 0 !important;
        max-height: none !important;
        margin: 0 !important;
        padding: 15px 18px !important;
        display: grid !important;
        grid-template-columns: 1fr !important;
        align-items: center !important;
        justify-content: stretch !important;
        gap: 9px !important;
        text-align: left !important;
        box-sizing: border-box !important;
    }

    .gx-benefit {
        width: 100% !important;
        min-width: 0 !important;
        height: auto !important;
        min-height: 26px !important;
        margin: 0 !important;
        padding: 0 !important;
        display: flex !important;
        align-items: center !important;
        justify-content: flex-start !important;
        color: #001A3A !important;
        font-family: "Inter", "Lato", Arial, sans-serif !important;
        font-size: 13px !important;
        font-weight: 500 !important;
        line-height: 1.35 !important;
        white-space: normal !important;
        text-align: left !important;
        box-sizing: border-box !important;
    }

    .gx-benefit span {
        min-width: 0 !important;
        margin: 0 !important;
        padding: 0 !important;
        display: block !important;
        color: inherit !important;
        font-family: inherit !important;
        font-size: inherit !important;
        font-weight: inherit !important;
        line-height: inherit !important;
        white-space: normal !important;
    }

    .gx-benefit i {
        width: 26px !important;
        min-width: 26px !important;
        height: 26px !important;
        min-height: 26px !important;
        margin: 0 9px 0 0 !important;
        padding: 0 !important;
        display: inline-flex !important;
        align-items: center !important;
        justify-content: center !important;
        color: #CBA358 !important;
        font-size: 14px !important;
        line-height: 26px !important;
        text-align: center !important;
        box-sizing: border-box !important;
    }


    /* DRAWER */

    .gx-mobile-menu-overlay {
        display: block !important;

        position: fixed !important;

        inset: 0 !important;

        z-index: 2147482000 !important;

        background:
            rgba(0, 26, 58, .42) !important;

        opacity: 0 !important;
        visibility: hidden !important;
        pointer-events: none !important;

        transition:
            opacity .22s ease,
            visibility .22s ease !important;
    }

    .gx-mobile-menu-panel {
        display: flex !important;

        position: fixed !important;

        top: 0 !important;
        right: 0 !important;
        bottom: 0 !important;

        z-index: 2147482001 !important;

        width:
            min(
                286px,
                calc(100vw - 62px)
            ) !important;

        height: 100dvh !important;

        padding: 18px 0 16px !important;

        flex-direction: column !important;

        background:
            rgba(243, 245, 248, .98) !important;

        color: #001A3A !important;

        border-left:
            1px solid rgba(0, 26, 58, .08) !important;

        box-shadow:
            -18px 0 45px rgba(0, 26, 58, .16) !important;

        transform: translateX(102%) !important;

        visibility: hidden !important;
        pointer-events: none !important;

        transition:
            transform .24s ease,
            visibility .24s ease !important;

        overflow-y: auto !important;
    }

    body.gx-mobile-menu-open
    .gx-mobile-menu-overlay {
        opacity: 1 !important;
        visibility: visible !important;
        pointer-events: auto !important;
    }

    body.gx-mobile-menu-open
    .gx-mobile-menu-panel {
        transform: translateX(0) !important;
        visibility: visible !important;
        pointer-events: auto !important;
    }

    html.gx-mobile-menu-open,
    body.gx-mobile-menu-open {
        overflow: hidden !important;
        height: 100% !important;
    }

    .gx-mobile-menu-top {
        min-height: 44px !important;

        padding:
            4px 18px 12px !important;

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

        gap: 10px !important;
    }

    .gx-mobile-cart-link,
    .gx-mobile-menu-close {
        position: relative !important;

        width: 42px !important;
        height: 42px !important;

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

        color: #001A3A !important;
        background:
            rgba(255, 255, 255, .78) !important;

        border:
            1px solid rgba(0, 26, 58, .08) !important;

        border-radius: 11px !important;
    }

    .gx-mobile-menu-close {
        cursor: pointer;
    }


    /* DRAWER NAV */

    .gx-mobile-drawer-nav {
        width: 100%;

        display: flex;
        flex-direction: column;
    }

    .gx-mobile-drawer-nav > a,
    .gx-mobile-accordion > summary {
        min-height: 46px;

        padding: 0 18px;

        display: flex;
        align-items: center;

        color: #001A3A;

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

        border-bottom:
            1px solid rgba(0, 26, 58, .07);

        cursor: pointer;

        list-style: none;
    }

    .gx-mobile-accordion > summary {
        justify-content: space-between;
    }

    .gx-mobile-accordion > summary::-webkit-details-marker,
    .gx-mobile-account-dropdown > summary::-webkit-details-marker {
        display: none;
    }

    .gx-mobile-accordion > summary::after {
        content: "\f107";

        font-family: FontAwesome;

        color: #CBA358;

        transition: transform .2s ease;
    }

    .gx-mobile-accordion[open] > summary::after {
        transform: rotate(180deg);
    }

    .gx-mobile-accordion-active > summary,
    .gx-mobile-drawer-nav > a.active {
        color: #CBA358;
    }

    .gx-mobile-accordion-panel {
        width: 100%;

        padding: 4px 0 8px;

        display: flex;
        flex-direction: column;

        background:
            rgba(255, 255, 255, .28);

        border-bottom:
            1px solid rgba(0, 26, 58, .07);
    }

    .gx-mobile-accordion-panel a {
        height: 44px;

        padding: 0 18px;

        display: flex;
        align-items: center;

        color: #001A3A;

        font-size: 12.5px;
    }

    .gx-mobile-accordion-panel
    .gx-mobile-main-entry {
        font-weight: 700;

        background:
            rgba(203, 163, 88, .10);
    }

    .gx-mobile-accordion-panel
    .gx-mobile-sub-link {
        padding-left: 30px;

        color: #4A5568;
    }

    .gx-mobile-sub-link::before {
        content: "—";

        margin-right: 8px;

        color: #CBA358;
    }

    .gx-mobile-sub-separator {
        height: 1px;

        margin: 4px 18px 6px;

        background:
            rgba(0, 26, 58, .10);
    }


    /* ACCOUNT MOBILE */

    .gx-mobile-menu-section-title {
        padding:
            18px 18px 6px;

        color: #001A3A;

        font-size: 11px;
        font-weight: 700;

        letter-spacing: .9px;

        text-transform: uppercase;
    }

    .gx-mobile-account-dropdown {
        margin: 6px 12px;
    }

    .gx-mobile-account-button {
        min-height: 42px;

        padding: 0 12px;

        display: flex;
        align-items: center;

        gap: 8px;

        color: #001A3A;

        background:
            rgba(255, 255, 255, .58);

        border:
            1px solid rgba(0, 26, 58, .08);

        border-radius: 10px;

        cursor: pointer;

        list-style: none;
    }

    .gx-mobile-account-button::after {
        content: "\f107";

        margin-left: auto;

        color: #CBA358;

        font-family: FontAwesome;
    }

    .gx-mobile-account-dropdown[open]
    .gx-mobile-account-button::after {
        transform: rotate(180deg);
    }

    .gx-mobile-account-panel {
        margin-top: 8px;
        padding: 7px;

        background:
            rgba(255, 255, 255, .45);

        border:
            1px solid rgba(0, 26, 58, .08);

        border-radius: 10px;
    }

    .gx-mobile-account-option {
        width: 100%;

        height: 36px;

        padding: 0 9px;

        display: flex;
        align-items: center;

        gap: 8px;

        color: #001A3A;
        background: transparent;

        border: 0;
        border-radius: 7px;

        font-size: 12.5px;

        cursor: pointer;
    }

    .gx-mobile-account-option:hover {
        color: #CBA358;

        background:
            rgba(255, 255, 255, .70);
    }

    .gx-mobile-account-divider {
        height: 1px;

        margin: 6px 0;

        background:
            rgba(0, 26, 58, .10);
    }

    .gx-mobile-main-cta {
        margin: 12px !important;

        justify-content: center !important;

        color: #FFFFFF !important;
        background: var(--gold-gradient) !important;

        border-radius: 9px !important;
    }


    /* HOME */

    .gx-store-main,
    .gx-shop-home-v1 {
        width: 100% !important;
        max-width: 100% !important;
    }

    .gx-shop-hero {
        grid-template-columns: 1fr !important;
        gap: 28px !important;
        padding: 0 0 42px !important;
    }

    .gx-shop-hero-content {
        width: 100% !important;
        max-width: 100% !important;
        margin: 0 !important;
        padding: 0 !important;
    }

    .gx-shop-eyebrow {
        display: block !important;
        max-width: 100% !important;
        margin: 0 0 11px 0 !important;
        color: #CBA358 !important;
        font-family: "Inter", "Lato", Arial, sans-serif !important;
        font-size: 0.66rem !important;
        font-weight: 600 !important;
        line-height: 1.25 !important;
        letter-spacing: 0.13em !important;
        text-transform: uppercase !important;
        white-space: nowrap !important;
        overflow: hidden !important;
        text-overflow: ellipsis !important;
    }

    .gx-shop-hero h1 {
        max-width: 760px !important;
        margin: 0 0 15px 0 !important;
        color: #001A3A !important;
        font-family: "Plus Jakarta Sans", sans-serif !important;
        font-size: clamp(2rem, 7.2vw, 2.35rem) !important;
        font-weight: 800 !important;
        line-height: 1.08 !important;
        letter-spacing: -0.7px !important;
        text-wrap: balance;
    }

    .gx-shop-hero-lead {
        max-width: 760px !important;
        margin: 0 0 24px 0 !important;
        color: #64748B !important;
        font-family: "Inter", "Lato", Arial, sans-serif !important;
        font-size: 1rem !important;
        font-weight: 400 !important;
        line-height: 1.65 !important;
    }

    .gx-shop-hero-points,
    .gx-shop-trustbar,
    .gx-shop-difference,
    .gx-shop-difference-grid {
        grid-template-columns: 1fr;
    }

    .gx-shop-main-card {
        max-width: 100%;

        padding: 22px;

        border-radius: 22px;
    }

    .gx-shop-trustbar {
        gap: 12px;

        background: transparent;

        box-shadow: none;

        overflow: visible;
    }

    .gx-shop-trust-item {
        border:
            1px solid rgba(0, 26, 58, .08);

        border-radius: 18px;
    }

    .gx-store-grid {
        grid-template-columns:
            repeat(2, minmax(0, 1fr));
    }


    /* PRODUCTO / CARRITO */

    .gx-store-product-shell,
    .gx-store-description-shell,
    .gx-store-cart-layout {
        grid-template-columns: 1fr;
    }

    .gx-store-product-media {
        min-height: 380px;
    }

    .gx-store-summary {
        position: static;
    }

    .gx-store-cart-line {
        grid-template-columns:
            110px
            minmax(0, 1fr);
    }

    .gx-store-cart-line-actions {
        grid-column: 1 / -1;
    }


    /* FOOTER */

    .gx-footer-head {
        grid-template-columns: 1fr !important;

        align-items: flex-start !important;
    }

    .gx-footer-partners-compact {
        width: 100% !important;

        justify-content: space-between !important;
    }

    .gx-footer-content {
        grid-template-columns:
            repeat(2, minmax(0, 1fr)) !important;
    }

    .gx-footer-copy {
        white-space: normal !important;
    }
}


/* =========================================================
   MÓVIL
   ========================================================= */

@media (max-width: 640px) {

    .main-wrapper {
        padding:
            0 16px 28px !important;
    }

    .gx-shop-hero h1 {
        font-size: 2rem !important;
    }

    .gx-shop-btns {
        display: grid;

        grid-template-columns: 1fr;
    }

    .gx-shop-btn {
        width: 100%;
    }

    .gx-store-grid {
        grid-template-columns: 1fr;
    }

    .gx-store-card-media {
        height: 235px;
    }

    .gx-store-product-shell,
    .gx-store-description-shell {
        padding: 20px;

        border-radius: 24px;
    }

    .gx-store-product-media {
        min-height: 280px;
    }

    .gx-store-buy-row {
        grid-template-columns: 1fr;
    }

    .gx-store-cart-line {
        grid-template-columns:
            82px
            minmax(0, 1fr);

        padding: 14px;
    }

    .gx-store-cart-line > img {
        width: 82px;
        height: 82px;
    }

    .gx-footer-head {
        padding:
            28px 24px !important;
    }

    .gx-footer-main {
        padding:
            0 24px 22px !important;
    }

    .gx-footer-brand-block {
        grid-template-columns: 1fr !important;

        gap: 16px !important;
    }

    .gx-footer-logo {
        width: 150px !important;
    }

    .gx-footer-partners-compact {
        display: grid !important;

        gap: 14px !important;
    }

    .gx-footer-partners-row {
        display: grid !important;

        grid-template-columns:
            1fr 1fr !important;
    }

    .gx-footer-partner-pill {
        min-width: 0 !important;
        height: auto !important;
        min-height: 78px !important;

        grid-template-columns: 1fr !important;

        justify-items: center !important;
        text-align: center !important;
    }

    .gx-footer-content {
        grid-template-columns: 1fr !important;

        gap: 28px !important;
    }

    .gx-footer-copy span {
        display: block;
    }

    .gx-footer-copy span::before {
        display: none;
    }
}


@media (max-width: 430px) {

    .gx-footer-partners-row {
        grid-template-columns:
            1fr !important;
    }

}


/* =========================================================
   TIENDA RESPONSIVE V0.1.0 · PATRON WEB VALIDADO
   Ajuste estrecho para moviles pequenos.
   ========================================================= */

@media (max-width: 370px) {
    header.gx-header-principal .logo img {
        width: 202px !important;
        max-width: 202px !important;
    }

    header.gx-header-principal .gx-header-actions {
        gap: 6px !important;
    }

    header.gx-header-principal .gx-mobile-contact-actions {
        gap: 6px !important;
    }

    header.gx-header-principal .gx-mobile-contact-btn,
    header.gx-header-principal .gx-mobile-menu-toggle {
        width: 40px !important;
        min-width: 40px !important;
        max-width: 40px !important;
        height: 40px !important;
        min-height: 40px !important;
        max-height: 40px !important;
        flex-basis: 40px !important;
    }

    .gx-shop-eyebrow {
        font-size: .62rem !important;
        letter-spacing: .12em !important;
    }
}

/* =========================================================
   AJUSTE HEADER TIENDA · MENU RESPONSIVE + BADGE CARRITO
   ========================================================= */

.gx-cart-badge:not(.gx-cart-badge-visible) {
    display: none !important;
}

.gx-cart-badge.gx-cart-badge-visible {
    display: inline-flex !important;
}

@media (min-width: 992px) {
    header.gx-header-principal .gx-mobile-menu-toggle,
    .gx-mobile-menu-overlay,
    .gx-mobile-menu-panel {
        display: none !important;
    }
}

/* =========================================================
   HEADER DESKTOP · BOTONES EXACTOS WEB PRINCIPAL
   ========================================================= */

@media (min-width: 992px) {

    header.gx-header-principal .gx-odoo-cart-btn,
    header.gx-header-principal .gx-odoo-user-btn {
        position: relative !important;

        width: auto !important;
        max-width: none !important;

        height: 38px !important;
        min-height: 38px !important;
        max-height: 38px !important;

        padding: 5px 11px !important;
        margin: 0 !important;

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

        background: rgba(255, 255, 255, 0.75) !important;
        color: #001A3A !important;

        border: 1px solid rgba(0, 26, 58, 0.08) !important;
        border-radius: 10px !important;

        box-shadow: none !important;
        box-sizing: border-box !important;
    }

    header.gx-header-principal .gx-odoo-cart-btn {
        min-width: 52px !important;
    }

    header.gx-header-principal .gx-odoo-user-btn {
        min-width: 62px !important;
    }

    header.gx-header-principal .gx-odoo-cart-btn > div,
    header.gx-header-principal .gx-odoo-user-btn > div {
        display: block !important;
        width: auto !important;
        height: auto !important;
        margin: 0 !important;
        padding: 0 !important;
        line-height: 1 !important;
    }

    header.gx-header-principal .gx-odoo-cart-btn i.fa-stack,
    header.gx-header-principal .gx-odoo-user-btn i.fa-stack {
        width: 2em !important;
        min-width: 2em !important;

        height: 2em !important;
        min-height: 2em !important;

        line-height: 2em !important;

        font-size: 14px !important;

        margin: 0 !important;
        padding: 0 !important;
    }
}

/* =========================================================
   HEADER DESKTOP · ALINEACION EXACTA WEB PRINCIPAL
   Flechas menu + icono/texto barra de beneficios
   ========================================================= */

@media (min-width: 992px) {

    /* Flechas de Servicios / Tienda exactamente como web principal */
    header.gx-header-principal #navbar .gx-nav-link {
        gap: 6px !important;
    }

    header.gx-header-principal #navbar .gx-nav-link i {
        margin: 1px 0 0 2px !important;
        padding: 0 !important;

        font-size: 12px !important;
        line-height: 1 !important;

        color: inherit !important;
    }


    /* Barra de beneficios exactamente como web principal */
    .gx-benefits-bar {
        width: 1200px !important;
        max-width: 1200px !important;

        height: 50px !important;
        min-height: 50px !important;
        max-height: 50px !important;

        margin: 10px auto 50px auto !important;
        padding: 0 !important;

        background: rgba(255, 255, 255, 0.35) !important;

        border: none !important;
        box-shadow: none !important;

        box-sizing: border-box !important;
        overflow: visible !important;
    }

    .gx-benefits-inner {
        width: 100% !important;
        max-width: 100% !important;

        height: 50px !important;
        min-height: 50px !important;
        max-height: 50px !important;

        margin: 0 !important;
        padding: 11px 0 !important;

        display: flex !important;
        flex-direction: row !important;
        align-items: center !important;
        justify-content: flex-start !important;
        flex-wrap: nowrap !important;

        gap: 42px !important;

        text-align: left !important;
        box-sizing: border-box !important;
    }

    .gx-benefit {
        height: 28px !important;
        min-height: 28px !important;

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

        margin: 0 !important;
        padding: 0 !important;

        color: #001A3A !important;

        font-family: "Inter", "Lato", Arial, sans-serif !important;
        font-size: 13px !important;
        font-weight: 500 !important;
        line-height: 1.3 !important;

        white-space: nowrap !important;
        text-align: left !important;

        box-sizing: border-box !important;
    }

    .gx-benefit span {
        margin: 0 !important;
        padding: 0 !important;

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

        color: #001A3A !important;

        font-family: "Inter", "Lato", Arial, sans-serif !important;
        font-size: 13px !important;
        font-weight: 500 !important;
        line-height: 1.3 !important;

        white-space: nowrap !important;
        text-align: left !important;
    }

    .gx-benefit i {
        width: 28px !important;
        min-width: 28px !important;
        max-width: 28px !important;

        height: 28px !important;
        min-height: 28px !important;
        max-height: 28px !important;

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

        margin: 0 7px 0 0 !important;
        padding: 0 !important;

        color: #CBA358 !important;

        font-size: 14px !important;
        line-height: 28px !important;

        text-align: center !important;

        box-sizing: border-box !important;
    }
}

/* =========================================================
   F6-UI / TITULO DIGITAL CANONICO
   Misma geometria que .gx-shop-section h2
   ========================================================= */

.gx-shop-section .gx-digital-section-title {
    margin: 0 0 16px;

    color: #001A3A;

    font-family: var(--font-heading);

    font-size: clamp(
        2rem,
        3.2vw,
        3.25rem
    );

    font-weight: 800;

    line-height: 1.04;
    letter-spacing: -.045em;
}

/* GYALUX_DIAGNOSTICO_FUENTES_V010_INICIO
   Diagnostico temporal: fuerza fuente de sistema en cabecera y primer bloque visual.
   Objetivo: comprobar si el salto visible viene del cambio de metricas al cargar Inter / Plus Jakarta Sans.
   No es solucion final. Revertir con ROLLBACK_GYALUX_DIAGNOSTICO_FUENTES_V010.sh.
*/
html body .gx-header-principal,
html body .gx-header-principal a,
html body .gx-header-principal button,
html body .gx-header-principal span,
html body .gx-header-principal strong,
html body .gx-header-principal small,
html body .gx-header-principal p,
html body .gx-benefits-bar,
html body .gx-benefits-bar a,
html body .gx-benefits-bar span,
html body .gx-benefits-bar strong,
html body .gx-benefits-bar small,
html body .gx-benefits-inner,
html body .gx-benefits-inner a,
html body .gx-benefits-inner span,
html body .gx-benefits-inner strong,
html body .hero,
html body .hero h1,
html body .hero h2,
html body .hero h3,
html body .hero p,
html body .hero a,
html body .hero span,
html body .hero strong,
html body .hero small,
html body .home-hero,
html body .home-hero h1,
html body .home-hero h2,
html body .home-hero h3,
html body .home-hero p,
html body .home-hero a,
html body .home-hero span,
html body .home-hero strong,
html body .home-hero small,
html body .gx-store-hero,
html body .gx-store-hero h1,
html body .gx-store-hero h2,
html body .gx-store-hero h3,
html body .gx-store-hero p,
html body .gx-store-hero a,
html body .gx-store-hero span,
html body .gx-store-hero strong,
html body .gx-store-hero small,
html body .gx-store-hero-main,
html body .gx-store-hero-main h1,
html body .gx-store-hero-main h2,
html body .gx-store-hero-main h3,
html body .gx-store-hero-main p,
html body .gx-store-hero-main a,
html body .gx-store-hero-main span,
html body .gx-store-hero-main strong,
html body .gx-store-hero-main small {
    font-family: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Arial, sans-serif !important;
}
/* GYALUX_DIAGNOSTICO_FUENTES_V010_FIN */