/* =====================================================
   CHAMOY SPORT — AJUSTES FINALES CLIENTE/PÚBLICO
   Cargado al final para unificar colores, contraste, hover,
   anchos y cards sin reescribir la lógica de Codex.
===================================================== */

:root,
html[data-theme="dark"]{
    --client-bg:#07090e;
    --client-bg-soft:#0b1018;
    --client-card:#10151f;
    --client-card-soft:#151b27;
    --client-card-elevated:#181f2c;
    --client-text:#f8fafc;
    --client-text-soft:#b3bdcc;
    --client-text-muted:#8a96a8;
    --client-border:rgba(255,255,255,.10);
    --client-border-strong:rgba(167,139,250,.34);
    --client-accent:#6d28d9;
    --client-accent-hover:#7c3aed;
    --client-accent-soft:rgba(124,58,237,.15);
    --client-accent-text:#ddd6fe;
    --client-violet:#a78bfa;
    --client-cyan:#22d3ee;
    --client-green:#4ade80;
    --client-warning:#fbbf24;
    --client-danger:#f87171;
    --client-input:#0c1119;
    --client-shadow:0 18px 50px rgba(0,0,0,.28);
    --client-shadow-card:0 12px 28px rgba(0,0,0,.18);
    --client-hero:
        radial-gradient(circle at 82% 12%,rgba(124,58,237,.20),transparent 21rem),
        linear-gradient(135deg,#090c13 0%,#0c1018 57%,#100b1f 100%);
}

html[data-theme="light"]{
    --client-bg:#f7f7fb;
    --client-bg-soft:#f1f3f8;
    --client-card:#ffffff;
    --client-card-soft:#f8fafc;
    --client-card-elevated:#ffffff;
    --client-text:#111827;
    --client-text-soft:#5f6d82;
    --client-text-muted:#8491a4;
    --client-border:rgba(45,19,118,.11);
    --client-border-strong:rgba(109,40,217,.30);
    --client-accent:#4c1d95;
    --client-accent-hover:#5b21b6;
    --client-accent-soft:#f3f0ff;
    --client-accent-text:#4c1d95;
    --client-violet:#7c3aed;
    --client-cyan:#0891b2;
    --client-green:#15803d;
    --client-warning:#a16207;
    --client-danger:#b91c1c;
    --client-input:#f8fafc;
    --client-shadow:0 18px 50px rgba(30,41,59,.09);
    --client-shadow-card:0 10px 26px rgba(30,41,59,.06);
    --client-hero:
        radial-gradient(circle at 82% 12%,rgba(124,58,237,.13),transparent 21rem),
        linear-gradient(135deg,#ffffff 0%,#f8f6ff 58%,#ffffff 100%);
}

/* ---------- Base y accesibilidad ---------- */
body{
    color:var(--client-text);
    background:var(--client-bg);
}

body a,
body button,
body input,
body select,
body textarea{
    -webkit-tap-highlight-color:transparent;
}

body a:focus-visible,
body button:focus-visible,
body input:focus-visible,
body select:focus-visible,
body textarea:focus-visible,
body summary:focus-visible{
    outline:3px solid rgba(139,92,246,.34);
    outline-offset:2px;
}

.eyebrow{
    color:var(--client-cyan);
}

.price-pen-reference{
    color:var(--client-violet);
    opacity:1;
}

/* ---------- Ancho uniforme público ---------- */
body .home-page-modern,
body .catalog-page,
body .membership-page,
body .contact-page{
    width:min(1580px,calc(100% - 40px));
    margin-left:auto;
    margin-right:auto;
}

/* ---------- Navbar ---------- */
.site-navbar{
    border-bottom-color:var(--client-border);
    background:color-mix(in srgb,var(--client-bg) 94%,transparent);
    box-shadow:0 8px 22px rgba(0,0,0,.08);
}

.brand-mark strong,
.public-nav-links a,
.account-trigger strong{
    color:var(--client-text);
}

.public-nav-links a{
    transition:color .18s ease,background .18s ease,border-color .18s ease;
}

.public-nav-links a:hover{
    color:var(--client-violet);
}

.public-nav-links a.is-active{
    color:var(--client-violet);
}

.public-nav-links a.is-active::after{
    background:var(--client-accent);
}

.navbar-icon-button,
.account-trigger,
.public-menu-toggle{
    color:var(--client-text);
    border-color:var(--client-border);
    background:var(--client-card);
}

.navbar-icon-button:hover,
.account-trigger:hover,
.public-menu-toggle:hover{
    color:var(--client-text);
    border-color:var(--client-border-strong);
    background:var(--client-accent-soft);
}

.cart-link>span{
    color:#fff;
    background:var(--client-accent);
}

.account-dropdown{
    color:var(--client-text);
    border-color:var(--client-border);
    background:var(--client-card-elevated);
    box-shadow:var(--client-shadow);
}

.account-dropdown a{
    color:var(--client-text-soft);
}

.account-dropdown a:hover{
    color:var(--client-text);
    background:var(--client-accent-soft);
}

/* ---------- Botones: contraste garantizado en normal y hover ---------- */
.button{
    border-radius:9px;
    transition:transform .18s ease,border-color .18s ease,background .18s ease,color .18s ease,box-shadow .18s ease;
}

.button-primary{
    color:#fff;
    border-color:var(--client-accent);
    background:var(--client-accent);
    box-shadow:0 8px 18px rgba(76,29,149,.16);
}

.button-primary:hover,
.button-primary:focus-visible{
    color:#fff;
    border-color:var(--client-accent-hover);
    background:var(--client-accent-hover);
    box-shadow:0 10px 24px rgba(109,40,217,.22);
}

.button-outline{
    color:var(--client-accent-text);
    border-color:var(--client-border-strong);
    background:transparent;
}

.button-outline:hover,
.button-outline:focus-visible{
    color:#fff;
    border-color:var(--client-accent);
    background:var(--client-accent);
}

.button-soft{
    color:var(--client-text);
    border-color:var(--client-border);
    background:var(--client-card-soft);
}

.button-soft:hover,
.button-soft:focus-visible{
    color:var(--client-text);
    border-color:var(--client-border-strong);
    background:var(--client-accent-soft);
}

.button:disabled,
.button[aria-disabled="true"]{
    color:var(--client-text-muted);
    border-color:var(--client-border);
    background:var(--client-card-soft);
    box-shadow:none;
    opacity:.72;
}

/* ---------- Inicio ---------- */
.home-hero-modern,
.catalog-hero,
.membership-hero-v2,
.contact-hero{
    border-color:var(--client-border);
    background:var(--client-hero);
    box-shadow:var(--client-shadow);
}

.home-hero-copy-modern h1,
.catalog-hero h1,
.membership-hero-copy h1,
.contact-hero-copy h1{
    color:var(--client-text);
}

.home-hero-copy-modern>p:not(.eyebrow),
.catalog-hero>p:not(.eyebrow),
.membership-hero-copy>p:not(.eyebrow),
.contact-hero-copy>p:not(.eyebrow){
    color:var(--client-text-soft);
}

.home-search-box{
    color:var(--client-text);
    border-color:var(--client-border);
    background:var(--client-card);
    box-shadow:var(--client-shadow-card);
}

.home-search-box:focus-within{
    border-color:var(--client-border-strong);
    box-shadow:0 0 0 3px rgba(139,92,246,.10),var(--client-shadow-card);
}

.home-search-box input{
    color:var(--client-text);
}

.home-search-box input::placeholder{
    color:var(--client-text-muted);
}

.home-search-box button{
    color:var(--client-text-soft);
    background:var(--client-accent-soft);
}

.home-category-chip{
    color:var(--client-text-soft);
    border-color:var(--client-border);
    background:var(--client-card);
    box-shadow:0 4px 12px rgba(0,0,0,.025);
}

.home-category-chip small{
    color:var(--client-accent-text);
    background:var(--client-accent-soft);
}

.home-category-chip:hover{
    color:var(--client-text);
    border-color:var(--client-border-strong);
    background:var(--client-accent-soft);
}

.home-category-chip.is-active{
    color:#fff;
    border-color:var(--client-accent);
    background:linear-gradient(135deg,var(--client-accent),var(--client-accent-hover));
    box-shadow:0 7px 18px rgba(109,40,217,.18);
}

.home-category-chip.is-active small{
    color:#fff;
    background:rgba(255,255,255,.18);
}

.home-catalog-heading h2,
.home-results-count strong{
    color:var(--client-text);
}

.home-results-count{
    color:var(--client-text-soft);
}

/* 4 tarjetas por fila, exactamente igual en Inicio y Catálogo */
.home-catalog-grid,
.catalog-grid{
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:18px;
}

.home-product-card,
.catalog-card{
    display:flex;
    flex-direction:column;
    min-width:0;
    overflow:hidden;
    color:var(--client-text);
    border:1px solid var(--client-border);
    border-radius:12px;
    background:var(--client-card);
    box-shadow:var(--client-shadow-card);
    transition:transform .18s ease,border-color .18s ease,box-shadow .18s ease;
}

.home-product-card:hover,
.catalog-card:hover{
    transform:translateY(-3px);
    border-color:var(--client-border-strong);
    box-shadow:0 16px 36px rgba(0,0,0,.14);
}

.home-product-image,
.catalog-preview{
    position:relative;
    display:block;
    width:100%;
    aspect-ratio:1.34/1;
    min-height:0;
    overflow:hidden;
    background:var(--client-card-soft);
}

.home-product-image img,
.catalog-preview .catalog-image{
    display:block;
    width:100%;
    height:100%;
    padding:0;
    object-fit:contain;
    transition:transform .25s ease;
}

.home-product-card:hover .home-product-image img,
.catalog-card:hover .catalog-preview .catalog-image{
    transform:scale(1.025);
}

.home-product-body,
.catalog-card-body{
    display:flex;
    flex:1;
    flex-direction:column;
    padding:13px 14px 14px;
}

.home-product-body>small,
.catalog-card-body>small{
    color:var(--client-violet);
    font-weight:900;
}

.home-product-body h3,
.home-product-body h3 a,
.catalog-card-body h2{
    color:var(--client-text);
}

.home-product-foot,
.catalog-card-foot{
    margin-top:auto;
    border-top-color:var(--client-border);
}

.home-product-foot strong,
.catalog-card-foot strong{
    color:var(--client-text);
}

.home-product-link,
.catalog-page .design-link,
.catalog-page-products .design-link{
    color:var(--client-accent-text);
    border-color:var(--client-border-strong);
    background:transparent;
}

.home-product-link:hover,
.home-product-link:focus-visible,
.catalog-page .design-link:hover,
.catalog-page .design-link:focus-visible,
.catalog-page-products .design-link:hover,
.catalog-page-products .design-link:focus-visible{
    color:#fff;
    border-color:var(--client-accent);
    background:var(--client-accent);
}

/* ---------- Catálogo ---------- */
.catalog-controls,
.catalog-summary,
.catalog-pagination,
.catalog-empty{
    color:var(--client-text);
    border-color:var(--client-border);
    background:var(--client-card);
    box-shadow:var(--client-shadow-card);
}

.catalog-controls-head h2,
.catalog-summary strong,
.catalog-empty h2{
    color:var(--client-text);
}

.catalog-summary span:last-child,
.filter-group>span,
.filter-selects label>span{
    color:var(--client-text-soft);
}

.catalog-search{
    color:var(--client-text);
    border-color:var(--client-border);
    background:var(--client-input);
}

.catalog-search:focus-within{
    border-color:var(--client-border-strong);
    box-shadow:0 0 0 3px rgba(139,92,246,.10);
}

.catalog-search input{
    color:var(--client-text);
}

.catalog-search input::placeholder{
    color:var(--client-text-muted);
}

.filter-chips a,
.filter-chips button{
    color:var(--client-text-soft);
    border-color:var(--client-border);
    background:var(--client-card-soft);
}

.filter-chips a:hover,
.filter-chips button:hover{
    color:var(--client-text);
    border-color:var(--client-border-strong);
    background:var(--client-accent-soft);
}

.filter-chips a.is-active,
.filter-chips button.is-active{
    color:#fff;
    border-color:var(--client-accent);
    background:var(--client-accent);
}

.filter-selects select{
    color:var(--client-text);
    border-color:var(--client-border);
    background:var(--client-input);
}

.filter-selects select option{
    color:var(--client-text);
    background:var(--client-card);
}

.filter-selects select:disabled{
    color:var(--client-text-soft);
    opacity:1;
}

/* Paginación */
.modern-pagination .pagination-page,
.modern-pagination .pagination-nav,
.modern-pagination .pagination-jump{
    color:var(--client-text-soft);
    border-color:var(--client-border);
    background:var(--client-card);
}

.modern-pagination .pagination-page:hover,
.modern-pagination .pagination-nav:hover:not(.is-disabled):not(:disabled){
    color:var(--client-text);
    border-color:var(--client-border-strong);
    background:var(--client-accent-soft);
}

.modern-pagination .pagination-page.is-active{
    color:#fff;
    border-color:var(--client-accent);
    background:var(--client-accent);
}

.modern-pagination .pagination-nav.is-disabled,
.modern-pagination .pagination-nav:disabled{
    color:var(--client-text-muted);
    opacity:.55;
}

.modern-pagination input{
    color:var(--client-text);
    border-color:var(--client-border);
    background:var(--client-input);
}

/* ---------- Ficha de producto ---------- */
.product-detail-page{
    color:var(--client-text);
}

.product-detail{
    border-color:var(--client-border);
    background:var(--client-hero);
    box-shadow:var(--client-shadow);
}

.product-main-image,
.product-protection-card,
.product-detail-info{
    border-color:var(--client-border);
    background:var(--client-card);
}

.product-main-image{
    background:var(--client-card-soft);
}

.product-detail-info{
    color:var(--client-text);
    box-shadow:var(--client-shadow-card);
}

.product-detail-info h1,
.product-protection-head h2,
.product-protection-grid strong,
.product-price-line strong{
    color:var(--client-text);
}

.product-description,
.product-protection-grid span{
    color:var(--client-text-soft);
}

.product-protection-grid>div{
    color:var(--client-text);
    border-color:var(--client-border);
    background:var(--client-card-soft);
}

.product-protection-grid svg{
    color:var(--client-cyan);
    border-color:var(--client-border-strong);
    background:var(--client-accent-soft);
}

.product-favorite-top,
.share-button,
.product-share-row a,
.product-share-row button{
    color:var(--client-accent-text);
    border-color:var(--client-border-strong);
    background:var(--client-accent-soft);
}

.product-favorite-top:hover,
.product-favorite-top.is-active,
.share-button:hover,
.product-share-row a:hover,
.product-share-row button:hover{
    color:#fff;
    border-color:var(--client-accent);
    background:var(--client-accent);
}

.product-important-note{
    border-color:rgba(245,158,11,.38);
    background:rgba(245,158,11,.10);
}

.product-important-note strong{
    color:var(--client-warning);
}

.product-important-note p{
    color:var(--client-text-soft);
}

html[data-theme="light"] .product-important-note{
    border-color:#e7bd67;
    background:#fff8e8;
}

html[data-theme="light"] .product-important-note strong{
    color:#8a5608;
}

html[data-theme="light"] .product-important-note p{
    color:#6c5528;
}

.format-list span,
.product-badge-inline,
.membership-note{
    color:var(--client-accent-text);
    border-color:var(--client-border-strong);
    background:var(--client-accent-soft);
}

.product-share-title{
    color:var(--client-text-muted);
}

/* ---------- Membresías ---------- */
.membership-current,
.membership-plan-card,
.membership-comparison,
.membership-hero-mark{
    color:var(--client-text);
    border-color:var(--client-border);
    background:var(--client-card);
    box-shadow:var(--client-shadow-card);
}

.membership-current-head h2,
.membership-current-stats strong,
.membership-section-heading h2,
.membership-plan-title h3,
.membership-plan-limit strong,
.membership-table th:first-child,
.membership-table td:first-child{
    color:var(--client-text);
}

.membership-current-head>div>p:not(.eyebrow),
.membership-current-stats span,
.membership-section-heading>div>p:not(.eyebrow),
.membership-plan-limit span,
.membership-plan-benefits span,
.membership-table th,
.membership-table td{
    color:var(--client-text-soft);
}

.membership-pills-v2 span,
.membership-current-stats>div,
.membership-plan-limit,
.membership-table-wrap,
.membership-table thead th{
    border-color:var(--client-border);
    background:var(--client-card-soft);
}

.membership-plan-icon,
.membership-plan-tags span{
    color:var(--client-accent-text);
    border-color:var(--client-border-strong);
    background:var(--client-accent-soft);
}

.membership-plan-price strong,
.membership-plan-benefits svg,
.membership-pills-v2 svg{
    color:var(--client-violet);
}

.membership-plan-card:hover{
    border-color:var(--client-border-strong);
    box-shadow:0 18px 38px rgba(0,0,0,.13);
}

.membership-plan-card.is-featured{
    border-color:rgba(139,92,246,.60);
    box-shadow:0 18px 44px rgba(109,40,217,.15);
}

.membership-current-badge.is-active,
.membership-plan-tags .is-current-tag{
    color:var(--client-green);
}

/* ---------- Contacto ---------- */
.contact-form-card,
.contact-sidebar,
.contact-faq{
    color:var(--client-text);
    border-color:var(--client-border);
    background:var(--client-card);
    box-shadow:var(--client-shadow-card);
}

.contact-card-heading h2,
.contact-sidebar-head h2,
.contact-faq-heading h2,
.contact-channel strong,
.contact-support-note strong{
    color:var(--client-text);
}

.contact-card-heading>p:not(.eyebrow),
.contact-sidebar-head>p:not(.eyebrow),
.contact-channel small,
.contact-support-note span,
.contact-faq-list details p{
    color:var(--client-text-soft);
}

.contact-hero-info>div,
.contact-channel,
.contact-faq-list details{
    color:var(--client-text);
    border-color:var(--client-border);
    background:var(--client-card-soft);
}

.contact-hero-info svg,
.contact-channel-icon,
.contact-faq-list summary svg{
    color:var(--client-violet);
}

.contact-channel-icon{
    background:var(--client-accent-soft);
}

a.contact-channel:hover{
    color:var(--client-text);
    border-color:var(--client-border-strong);
    background:var(--client-accent-soft);
}

.contact-form label>span{
    color:var(--client-text);
}

.contact-form input,
.contact-form textarea{
    color:var(--client-text);
    border-color:var(--client-border);
    background:var(--client-input);
}

.contact-form input::placeholder,
.contact-form textarea::placeholder{
    color:var(--client-text-muted);
}

.contact-form input:focus,
.contact-form textarea:focus{
    border-color:var(--client-border-strong);
    box-shadow:0 0 0 3px rgba(139,92,246,.10);
}

/* ---------- Carrito / Checkout / Auth ---------- */
.cart-header h1,
.auth-card h1,
.checkout-panel h2,
.order-summary h2{
    color:var(--client-text);
}

.auth-card,
.checkout-panel,
.order-summary,
.cart-item,
.final-cta{
    color:var(--client-text);
    border-color:var(--client-border);
    background:var(--client-card);
}

.cart-item h2,
.cart-item strong,
.order-summary strong{
    color:var(--client-text);
}

.cart-item small,
.auth-note,
.checkout-panel p,
.order-summary span{
    color:var(--client-text-soft);
}

.form-stack label,
.form-grid label,
.coupon-form label{
    color:var(--client-text);
}

.form-stack input,
.form-stack textarea,
.form-stack select,
.form-grid input,
.coupon-form input{
    color:var(--client-text);
    border-color:var(--client-border);
    background:var(--client-input);
}

/* ---------- Área cliente ---------- */
.client-shell{
    color:var(--client-text);
}

.client-sidebar-modern,
.client-topbar-modern,
.client-orders-panel,
.client-quick-panel,
.favorites-panel,
.downloads-panel,
.security-card,
.security-session-card,
.security-tip-card,
.support-form-card,
.support-help-card,
.support-response-card,
.support-history,
.profile-card,
.profile-summary-card,
.profile-security-link,
.membership-client-panel,
.orders-client-panel,
.order-detail-card,
.order-summary-side,
.order-history-modern,
.order-detail-missing{
    color:var(--client-text);
    border-color:var(--client-border);
    background:var(--client-card);
}

.client-sidebar-modern nav a{
    color:var(--client-text-soft);
}

.client-sidebar-modern nav a:hover,
.client-sidebar-modern nav a.is-active{
    color:var(--client-accent-text);
    background:var(--client-accent-soft);
}

.client-topbar-copy h1,
.client-panel-heading h2,
.client-order-row,
.orders-client-row,
.order-detail-card h2,
.order-summary-side h2{
    color:var(--client-text);
}

.client-topbar-copy>p:not(.eyebrow),
.client-stat-card span,
.orders-client-row span,
.order-detail-card p,
.order-summary-side span{
    color:var(--client-text-soft);
}

.client-stat-card,
.client-order-row,
.orders-client-row,
.favorite-card,
.download-card{
    border-color:var(--client-border);
    background:var(--client-card-soft);
}

.client-order-row:hover,
.orders-client-row:hover,
.favorite-card:hover,
.download-card:hover{
    border-color:var(--client-border-strong);
    background:var(--client-accent-soft);
}

/* ---------- Footer ---------- */
.site-footer-full{
    border-top-color:rgba(255,255,255,.08);
    background:#05080d;
}

.site-footer-full .footer-column a:hover{
    color:#c4b5fd;
}

/* ---------- Responsive ---------- */
@media(max-width:1200px){
    .home-catalog-grid,
    .catalog-grid{
        grid-template-columns:repeat(3,minmax(0,1fr));
    }
}

@media(max-width:820px){
    body .home-page-modern,
    body .catalog-page,
    body .membership-page,
    body .contact-page{
        width:min(100% - 24px,1580px);
    }

    .home-catalog-grid,
    .catalog-grid{
        grid-template-columns:repeat(2,minmax(0,1fr));
        gap:12px;
    }
}

@media(max-width:520px){
    body .home-page-modern,
    body .catalog-page,
    body .membership-page,
    body .contact-page{
        width:min(100% - 20px,1580px);
    }

    .home-catalog-grid,
    .catalog-grid{
        grid-template-columns:1fr;
    }

    .home-product-body,
    .catalog-card-body{
        padding:12px;
    }
}

/* ---------- Controles secundarios que también deben conservar contraste ---------- */
.login-button,
.search-form button{
    color:#fff;
    border-color:var(--client-accent);
    background:var(--client-accent);
}

.login-button:hover,
.login-button:focus-visible,
.search-form button:hover,
.search-form button:focus-visible{
    color:#fff;
    border-color:var(--client-accent-hover);
    background:var(--client-accent-hover);
}

.filter-mobile-toggle{
    color:var(--client-accent-text);
    border-color:var(--client-border-strong);
    background:var(--client-card);
}

.filter-mobile-toggle:hover,
.filter-mobile-toggle:focus-visible{
    color:#fff;
    border-color:var(--client-accent);
    background:var(--client-accent);
}

.favorite-remove-button,
.cart-remove-button{
    color:var(--client-text-soft);
    border-color:var(--client-border);
    background:var(--client-card-soft);
}

.favorite-remove-button:hover,
.cart-remove-button:hover{
    color:#fff;
    border-color:rgba(239,68,68,.62);
    background:#b91c1c;
}

.download-card-button:hover,
.profile-submit:hover,
.security-submit:hover,
.support-submit:hover,
.checkout-submit:hover,
.manual-payment-submit:hover,
.login-submit:hover,
.register-submit:hover,
.recovery-submit:hover,
.reset-password-submit:hover,
.contact-submit:hover{
    color:#fff;
}

/* =====================================================
   FIX FINAL: botón VER DISEÑO del catálogo
   - Evita que el hover de toda la card pinte el botón.
   - Mantiene el texto siempre legible al pasar el cursor.
   ===================================================== */
.catalog-page .catalog-card:hover .design-link:not(:hover):not(:focus-visible),
.catalog-page-products .catalog-card:hover .design-link:not(:hover):not(:focus-visible){
    color:var(--client-accent-text) !important;
    -webkit-text-fill-color:var(--client-accent-text) !important;
    background:transparent !important;
    border-color:var(--client-border-strong) !important;
    opacity:1 !important;
}

.catalog-page .catalog-card .catalog-card-foot > a.design-link:hover,
.catalog-page .catalog-card .catalog-card-foot > a.design-link:focus-visible,
.catalog-page-products .catalog-card .catalog-card-foot > a.design-link:hover,
.catalog-page-products .catalog-card .catalog-card-foot > a.design-link:focus-visible{
    color:#ffffff !important;
    -webkit-text-fill-color:#ffffff !important;
    background:#4c1d95 !important;
    border-color:#4c1d95 !important;
    opacity:1 !important;
    text-decoration:none !important;
    box-shadow:0 5px 14px rgba(76,29,149,.22);
}

html[data-theme="dark"] .catalog-page .catalog-card .catalog-card-foot > a.design-link:hover,
html[data-theme="dark"] .catalog-page .catalog-card .catalog-card-foot > a.design-link:focus-visible,
html[data-theme="dark"] .catalog-page-products .catalog-card .catalog-card-foot > a.design-link:hover,
html[data-theme="dark"] .catalog-page-products .catalog-card .catalog-card-foot > a.design-link:focus-visible{
    color:#ffffff !important;
    -webkit-text-fill-color:#ffffff !important;
    background:#7c3aed !important;
    border-color:#8b5cf6 !important;
}

/* =====================================================
   CARDS VERTICALES COMPACTAS - INICIO + CATALOGO
   Referencia visual tipo poster 4:5.
   Mantiene 4 por fila sin hacerlas demasiado grandes.
   ===================================================== */

/* Escritorio: cuatro cards compactas y centradas */
.home-catalog-grid,
.catalog-grid{
    grid-template-columns:repeat(4,minmax(230px,280px)) !important;
    justify-content:center;
    align-items:start;
    gap:20px !important;
}

.home-product-card,
.catalog-card{
    width:100%;
    max-width:280px;
    margin-inline:auto;
}

/* Imagen vertical tipo afiche */
.home-product-image,
.catalog-preview{
    aspect-ratio:4 / 5 !important;
    min-height:0 !important;
    background:var(--client-card-soft);
}

.home-product-image img,
.catalog-preview .catalog-image{
    width:100% !important;
    height:100% !important;
    padding:0 !important;
    object-fit:cover !important;
    object-position:center center;
}

/* Información inferior más compacta */
.home-product-body,
.catalog-card-body{
    min-height:142px;
    padding:12px 13px 13px !important;
}

.home-product-body>small,
.catalog-card-body>small{
    font-size:.76rem;
    line-height:1.2;
}

.home-product-body h3,
.catalog-card-body h2{
    min-height:42px !important;
    margin:7px 0 11px !important;
    font-size:.95rem !important;
    line-height:1.3 !important;
}

.home-product-foot,
.catalog-card-foot{
    gap:8px;
    padding-top:10px;
}

.home-product-foot strong,
.catalog-card-foot strong{
    font-size:1rem;
}

.home-product-link,
.catalog-page .design-link,
.catalog-page-products .design-link{
    min-height:34px;
    padding:0 11px;
    font-size:.76rem;
}

/* Pantallas medianas: tres cards compactas */
@media(max-width:1200px){
    .home-catalog-grid,
    .catalog-grid{
        grid-template-columns:repeat(3,minmax(220px,280px)) !important;
        justify-content:center;
    }
}

/* Tablet: dos cards */
@media(max-width:820px){
    .home-catalog-grid,
    .catalog-grid{
        grid-template-columns:repeat(2,minmax(210px,280px)) !important;
        justify-content:center;
        gap:14px !important;
    }
}

/* Celular: una card centrada, sin ocupar toda la pantalla */
@media(max-width:520px){
    .home-catalog-grid,
    .catalog-grid{
        grid-template-columns:minmax(0,320px) !important;
        justify-content:center;
    }

    .home-product-card,
    .catalog-card{
        max-width:320px;
    }
}

/* =====================================================
   CARRUSEL VERTICAL COMPACTO - HOME
   Adaptado a artes promocionales 4:5 sin agrandarlos.
   ===================================================== */
.home-page-modern .hero-product-carousel{
    min-height:340px !important;
}

.home-page-modern .hero-product-slide{
    width:clamp(175px,13.5vw,220px) !important;
    aspect-ratio:4 / 5 !important;
    border-radius:16px !important;
    background:var(--client-card-soft) !important;
}

.home-page-modern .hero-product-slide img{
    width:100% !important;
    height:100% !important;
    object-fit:cover !important;
    object-position:center center !important;
}

.home-page-modern .hero-product-slide.is-center{
    box-shadow:0 20px 48px rgba(0,0,0,.34) !important;
}

.home-page-modern .hero-product-slide.is-left-1,
.home-page-modern .hero-product-slide.is-right-1{
    opacity:.66 !important;
}

.home-page-modern .hero-product-slide.is-left-2,
.home-page-modern .hero-product-slide.is-right-2{
    opacity:.26 !important;
}

.home-page-modern .hero-carousel-dots{
    bottom:6px !important;
}

@media(max-width:1120px){
    .home-page-modern .hero-product-carousel{min-height:320px !important;}
    .home-page-modern .hero-product-slide{width:clamp(165px,18vw,205px) !important;}
}

@media(max-width:860px){
    .home-page-modern .hero-product-carousel{min-height:300px !important;}
    .home-page-modern .hero-product-slide{width:min(42vw,190px) !important;}
}

@media(max-width:560px){
    .home-page-modern .hero-product-carousel{min-height:275px !important;}
    .home-page-modern .hero-product-slide{width:min(50vw,175px) !important;}
    .home-page-modern .hero-product-slide.is-left-2,
    .home-page-modern .hero-product-slide.is-right-2{display:none !important;}
}



/* =====================================================
   ENTREGA FINAL - MARCA, REDES Y MEMBRESIAS
   ===================================================== */
.brand-mark .brand-logo{
    width:62px !important;
    height:46px !important;
    min-width:62px;
    padding:3px;
    border-radius:11px;
    overflow:hidden;
    background:transparent !important;
}
.brand-mark .brand-logo .brand-logo-theme{
    width:100%;
    height:100%;
    object-fit:contain;
    object-position:center;
}
html[data-theme="light"] .brand-logo-theme-dark{display:none !important;}
html[data-theme="dark"] .brand-logo-theme-light{display:none !important;}
html[data-theme="light"] .brand-logo-theme-light,
html[data-theme="dark"] .brand-logo-theme-dark{display:block !important;}
.site-navbar .brand-mark{gap:10px;}
.site-navbar .brand-mark strong{font-size:1.02rem;}
.footer-brand-column .footer-brand .brand-logo{
    width:84px !important;
    height:58px !important;
    min-width:84px;
}
.footer-brand-column .footer-brand strong{font-size:1.08rem;}
.footer-socials{display:flex;align-items:center;gap:10px;flex-wrap:wrap;}
.footer-socials a,
.contact-social-link{
    display:inline-grid;
    place-items:center;
    width:40px;
    height:40px;
    border:1px solid var(--client-border);
    border-radius:11px;
    color:var(--client-text-soft);
    background:var(--client-card-soft);
    transition:transform .18s ease,border-color .18s ease,color .18s ease,background .18s ease;
}
.footer-socials a:hover,
.contact-social-link:hover{
    transform:translateY(-2px);
    color:#fff;
    border-color:var(--client-accent);
    background:var(--client-accent);
}
.footer-socials svg,.contact-social-link svg{width:19px;height:19px;}
.social-tiktok-icon{display:block;}

.button-whatsapp{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    gap:8px;
    color:#fff !important;
    border:1px solid #16a34a !important;
    background:#16a34a !important;
    box-shadow:0 10px 24px rgba(22,163,74,.18);
}
.button-whatsapp:hover,.button-whatsapp:focus-visible{
    color:#fff !important;
    border-color:#15803d !important;
    background:#15803d !important;
    transform:translateY(-1px);
}
.button-whatsapp svg{width:18px;height:18px;}
.hero-actions-modern{display:flex;align-items:center;flex-wrap:wrap;gap:12px;}

.contact-social-block{
    padding:14px;
    border:1px solid var(--client-border);
    border-radius:var(--radius-md);
    background:var(--client-card-soft);
}
.contact-social-label{
    display:flex;
    align-items:center;
    gap:7px;
    margin-bottom:11px;
    color:var(--client-text-soft);
    font-size:.78rem;
    font-weight:800;
    text-transform:uppercase;
}
.contact-social-label svg{width:16px;height:16px;}
.contact-social-links{display:flex;gap:9px;flex-wrap:wrap;}

.membership-disabled-notice{
    display:flex;
    align-items:center;
    gap:12px;
    margin-bottom:18px;
    padding:16px 18px;
    border:1px solid rgba(245,158,11,.34);
    border-radius:var(--radius-md);
    color:var(--client-text);
    background:rgba(245,158,11,.09);
}
.membership-disabled-notice>svg{width:24px;height:24px;color:#f59e0b;}
.membership-disabled-notice div{display:grid;gap:3px;}
.membership-disabled-notice span{color:var(--client-text-soft);font-size:.88rem;}
.membership-payment-panel{width:min(760px,calc(100vw - 28px)) !important;max-height:min(90vh,860px);overflow:auto;}
.membership-payment-summary{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:12px;
    margin:16px 0;
}
.membership-payment-summary>div{
    display:grid;
    gap:4px;
    padding:12px 14px;
    border:1px solid var(--client-border);
    border-radius:12px;
    background:var(--client-card-soft);
}
.membership-payment-summary small{color:var(--client-text-muted);text-transform:uppercase;font-size:.7rem;font-weight:800;}
.membership-payment-summary strong{color:var(--client-text);}
.membership-payment-summary span{color:var(--client-accent-text);font-size:.78rem;font-weight:800;}
.membership-payment-choices{margin:6px 0 16px;}
.membership-payment-choices .payment-choice-card.is-disabled{opacity:.48;cursor:not-allowed;}
.membership-manual-section[hidden]{display:none !important;}
.membership-payment-note{
    display:flex;
    align-items:center;
    gap:8px;
    margin:14px 0;
    color:var(--client-text-soft);
    font-size:.82rem;
}
.membership-payment-note svg{width:17px;height:17px;color:var(--client-accent-text);}
.membership-payment-submit{width:100%;display:flex;align-items:center;justify-content:center;gap:8px;}

@media(max-width:700px){
    .brand-mark .brand-logo{width:52px !important;height:40px !important;min-width:52px;}
    .site-navbar .brand-mark strong{font-size:.92rem;}
    .membership-payment-summary{grid-template-columns:1fr;}
    .membership-payment-panel{padding:20px 16px !important;}
}


/* =====================================================
   HOTFIX 2026-10-07 - LOGIN MEMBRESIAS + FOOTER REDES
   ===================================================== */
.site-footer-full .footer-brand-column .footer-brand strong{
    color:#f8fafc !important;
    opacity:1 !important;
    text-shadow:none !important;
}

.site-footer-full .footer-brand-column>p{
    color:#aab6c8 !important;
}

.site-footer-full .footer-socials a{
    color:#e5e7eb !important;
    border-color:rgba(255,255,255,.16) !important;
    background:#111827 !important;
    box-shadow:inset 0 0 0 1px rgba(255,255,255,.015);
}

.site-footer-full .footer-socials a:hover,
.site-footer-full .footer-socials a:focus-visible{
    color:#ffffff !important;
    border-color:#8b5cf6 !important;
    background:#5b21b6 !important;
}

.social-brand-icon{
    display:block;
    width:19px !important;
    height:19px !important;
    color:currentColor;
    overflow:visible;
}

.social-brand-icon.social-facebook,
.social-brand-icon.social-tiktok{
    fill:currentColor !important;
    stroke:none !important;
}

.social-brand-icon.social-instagram{
    fill:none !important;
    stroke:currentColor !important;
    stroke-width:1.8;
    stroke-linecap:round;
    stroke-linejoin:round;
}
.social-brand-icon.social-instagram .social-dot{
    fill:currentColor !important;
    stroke:none !important;
}

.social-brand-icon.social-whatsapp{
    fill:none !important;
    stroke:currentColor !important;
    stroke-width:1.55;
    stroke-linecap:round;
    stroke-linejoin:round;
}

.contact-social-link{
    color:var(--client-text) !important;
}

html[data-theme="dark"] .contact-social-link{
    background:#111827 !important;
    border-color:rgba(255,255,255,.14) !important;
}