/*
Theme Name: Shark Alliance
Theme URI: https://www.sharkaliance.com/
Author: JM Soluciones Grupales e Inmobiliarias
Author URI: https://www.sharkaliance.com/quienes-somos
Description: Tema WordPress personalizado para el programa empresarial Shark Alliance — Feria de Emprendedores, Capacitaciones y Programa Embajador. Integración WooCommerce + Pasarela Wompi + CTAs WhatsApp corporativo. Enfoque: seguridad nivel B/M/A implementado en functions.php, sin dependencias de frameworks pesados.
Version: 1.0.0
Requires at least: 6.4
Tested up to: 6.6
Requires PHP: 8.1
Tags: one-column, two-columns, right-sidebar, accessibility-ready, custom-colors, custom-menu, custom-logo, editor-style, featured-images, footer-widgets, threaded-comments, translation-ready, e-commerce, woocommerce, business
Text Domain: shark-alliance
Domain Path: /languages
License: GNU General Public License v3.0
License URI: http://www.gnu.org/licenses/gpl-3.0.txt
*/

/* ==========================================================================
   🚧 PROYECTO EN CONSTRUCCIÓN — ESTILOS BASE AÚN NO DISEÑADOS 🚧
   --------------------------------------------------------------------------
   Este archivo contiene ÚNICAMENTE la cabecera obligatoria que WordPress lee
   para reconocer al tema. Los estilos reales (colores corporativos azul marino,
   fuentes, layout, menú navegación, página feria, producto Savigel, CTAs WA)
   se implementan en la siguiente fase después del visto bueno del cliente.
   ========================================================================== */

/* ==========================================================================
   🎨 DISEÑO BASE — Tema Shark Alliance v1.0.0
   --------------------------------------------------------------------------
   Paleta colores corporativa extraída de la marca JM Soluciones:
     · Azul marino  #0f4c81 (principal)
     · Azul medio   #14548c (secundario)
     · Turquesa     #1fa4c5 (CTAs de oferta)
     · Verde WA     #25d366 (CTAs WhatsApp oficial)
     · Verde 700    #15803d (hover WA)
     · Texto base   #1f2937
     · Fondo gris   #f7fafc
     · Borde gris   #e5e7eb
   Tipografía: Inter (Google Fonts) · fallback system-ui (sin dependencias externas).
   Layout máximo: 1200 px (margen izq/derecho automático, centrado).
   ========================================================================== */

/* ============================================
   1. Variables CSS (paleta + layout + breakpoints)
   ============================================ */
:root {
    --shark-c-primary:      #0f4c81;
    --shark-c-primary-600:  #14548c;
    --shark-c-primary-700:  #0c3558;
    --shark-c-accent:       #1fa4c5;
    --shark-c-accent-700:   #38bdf8;
    --shark-c-whatsapp:     #25d366;
    --shark-c-whatsapp-700: #15803d;
    --shark-c-success:      #0f766e;
    --shark-c-text:         #e2e8f0;
    --shark-c-muted:        #94a3b8;
    --shark-c-subtle:       #64748b;
    --shark-c-bg:           #071a2e;
    --shark-c-bg-alt:       #0a2540;
    --shark-c-bg-muted:     #0e2e4d;
    --shark-c-border:       rgba(245, 197, 24, 0.12);
    --shark-c-white:        #ffffff;

    --shark-c-gold:         #f5c518;
    --shark-c-gold-600:     #d4a90b;
    --shark-c-gold-700:     #a88206;
    --shark-c-dark-bg:      #071a2e;
    --shark-c-dark-bg-2:    #0a2540;
    --shark-c-dark-border:  rgba(245, 197, 24, 0.18);
    --shark-c-nav-text:     #cbd5e1;
    --shark-c-nav-hover:    var(--shark-c-gold);

    --shark-rw: 1200px;    /* Layout máximo */
    --shark-px: 1.25rem;   /* Padding horizontal móvil */
    --shark-py: 4.5rem;    /* Padding vertical secciones */

    --shark-shadow-sm: 0 1px 2px rgba(3, 7, 18, .45), 0 1px 3px rgba(3, 7, 18, .55);
    --shark-shadow-md: 0 14px 40px -16px rgba(3, 7, 18, .85);
    --shark-shadow-dark: 0 12px 40px -12px rgba(7, 26, 46, .65), 0 2px 6px rgba(7, 26, 46, .4);
    --shark-radius-sm: 6px;
    --shark-radius-md: 12px;
    --shark-radius-lg: 18px;

    --shark-font: 'Inter', system-ui, -apple-system, BlinkMacSystemFont,
                  "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
}

/* ============================================
   2. Reset / base tipografía
   ============================================ */
html,
body {
    font-family: var(--shark-font);
    color: var(--shark-c-text);
    background-color: var(--shark-c-bg);
    line-height: 1.65;
    font-size: 16px;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    text-rendering: optimizeLegibility;
}

h1, h2, h3, h4, h5, h6 {
    font-family: var(--shark-font);
    font-weight: 800;
    line-height: 1.2;
    color: var(--shark-c-primary-700);
    margin: 0 0 1rem;
    letter-spacing: -0.02em;
    text-shadow: 0 2px 12px rgba(3, 7, 18, 0.55);
}

p { margin: 0 0 1.1rem; }

a {
    color: var(--shark-c-accent);
    font-weight: 600;
    text-decoration: none;
    transition: color .2s ease;
}

a:hover, a:focus {
    color: var(--shark-c-gold);
    text-decoration: underline;
}

/* Accesibilidad: lector pantalla solo textos */
.screen-reader-text {
    border: 0;
    clip: rect(1px, 1px, 1px, 1px);
    clip-path: inset(50%);
    height: 1px;
    margin: -1px;
    overflow: hidden;
    padding: 0;
    position: absolute;
    width: 1px;
    word-wrap: normal !important;
}

/* ============================================
   3. Layout estructural del sitio
   ============================================ */
.shark-site {
    width: 100%;
    min-height: 100vh;
    display: flex;
    flex-direction: column;
    background: var(--shark-c-bg);
}

.shark-site > main {
    flex: 1 1 auto;
    padding: 0;
}

.shark-home {
    display: block;
    width: 100%;
}

/* ============================================
   3b. HEADER — Menú principal (FIXED, COLOR SÓLIDO NAVY siempre)
   ============================================ */
.shark-site-header {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    z-index: 100;
    width: 100%;
    background: var(--shark-c-dark-bg);
    border-bottom: 1px solid var(--shark-c-dark-border);
    box-shadow: var(--shark-shadow-dark);
    transition: box-shadow .25s ease, padding .25s ease, background-color .25s ease, border-bottom-color .25s ease;
}

.shark-site-header.is-scrolled {
    background: var(--shark-c-dark-bg);
    border-bottom: 1px solid var(--shark-c-dark-border);
    box-shadow:
        0 16px 50px -14px rgba(7, 26, 46, .9),
        0 3px 10px rgba(7, 26, 46, .55);
    backdrop-filter: none;
    -webkit-backdrop-filter: none;
}

.shark-header__inner {
    max-width: var(--shark-rw);
    margin: 0 auto;
    padding: 0.95rem var(--shark-px);
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1.5rem;
}

.shark-site-header.is-scrolled .shark-header__inner {
    padding-top: 0.65rem;
    padding-bottom: 0.65rem;
}

/* ---------- Branding / Logo ---------- */
.shark-site-branding {
    display: flex;
    align-items: center;
    flex: 0 0 auto;
    min-width: 0;
}

.shark-site-branding a {
    display: inline-flex;
    align-items: center;
    text-decoration: none;
}

.shark-site-branding .custom-logo,
.shark-site-branding__logo-img {
    height: 52px;
    width: auto;
    max-width: 240px;
    object-fit: contain;
    transition: height .25s ease, transform .25s ease, filter .25s ease;
    display: block;
}

.shark-site-header.is-scrolled .shark-site-branding .custom-logo,
.shark-site-header.is-scrolled .shark-site-branding__logo-img {
    height: 44px;
}

.shark-site-branding__logo-link:hover .shark-site-branding__logo-img,
.shark-site-branding__logo-link:focus-visible .shark-site-branding__logo-img {
    transform: translateY(-1px);
    filter: drop-shadow(0 6px 12px rgba(245,197,24,.25));
}

@media (max-width: 768px) {
    .shark-site-branding .custom-logo,
    .shark-site-branding__logo-img {
        height: 44px;
        max-width: 190px;
    }
    .shark-site-header.is-scrolled .shark-site-branding .custom-logo,
    .shark-site-header.is-scrolled .shark-site-branding__logo-img {
        height: 40px;
    }
}

.shark-site-title {
    margin: 0;
    font-size: 1.35rem;
    font-weight: 900;
    line-height: 1.1;
    letter-spacing: -0.02em;
}

.shark-site-title a {
    color: var(--shark-c-white);
    text-decoration: none;
    background: linear-gradient(90deg, var(--shark-c-white) 0%, var(--shark-c-gold) 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
}

.shark-site-description {
    display: none;
}

/* ---------- Contenedor Navegación + CTA ---------- */
.shark-header__nav-wrap {
    display: flex;
    align-items: center;
    gap: 1.25rem;
    flex: 1 1 auto;
    justify-content: flex-end;
}

.shark-nav--primary {
    display: flex;
    align-items: center;
}

.shark-menu--primary {
    display: flex;
    align-items: center;
    gap: 0.25rem;
    list-style: none;
    margin: 0;
    padding: 0;
}

.shark-menu-item {
    position: relative;
}

.shark-menu-link {
    position: relative;
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
    padding: 0.6rem 0.95rem;
    font-weight: 600;
    font-size: 0.95rem;
    color: var(--shark-c-nav-text);
    text-decoration: none;
    border-radius: var(--shark-radius-sm);
    transition: color .2s ease, background-color .2s ease;
    white-space: nowrap;
}

.shark-menu-link:hover,
.shark-menu-link:focus {
    color: var(--shark-c-nav-hover);
    background: rgba(245, 197, 24, 0.06);
    text-decoration: none;
}

/* Item activo: subrayado dorado + color */
.shark-menu-item.is-active > .shark-menu-link {
    color: var(--shark-c-gold);
}

.shark-menu-item.is-active > .shark-menu-link::after {
    content: "";
    position: absolute;
    left: 0.95rem;
    right: 0.95rem;
    bottom: 0.35rem;
    height: 2px;
    background: linear-gradient(90deg, var(--shark-c-gold), var(--shark-c-gold-600));
    border-radius: 2px;
}

/* Caret / flecha submenú */
.shark-menu-caret {
    display: inline-block;
    width: 0;
    height: 0;
    border-left: 4px solid transparent;
    border-right: 4px solid transparent;
    border-top: 5px solid currentColor;
    opacity: 0.75;
    transform: translateY(1px);
    transition: transform .2s ease;
}

.shark-menu-item--has-children:hover > .shark-menu-link .shark-menu-caret,
.shark-menu-item--has-children:focus-within > .shark-menu-link .shark-menu-caret {
    transform: translateY(1px) rotate(180deg);
    opacity: 1;
}

/* ---------- Submenús (dropdown) ---------- */
.shark-submenu {
    position: absolute;
    top: 100%;
    left: 0;
    min-width: 240px;
    list-style: none;
    margin: 0.35rem 0 0;
    padding: 0.5rem;
    background: var(--shark-c-dark-bg-2);
    border: 1px solid var(--shark-c-dark-border);
    border-radius: var(--shark-radius-md);
    box-shadow: var(--shark-shadow-dark);
    opacity: 0;
    visibility: hidden;
    transform: translateY(8px);
    transition: opacity .2s ease, transform .2s ease, visibility .2s ease;
    z-index: 110;
}

.shark-menu-item--has-children:hover > .shark-submenu,
.shark-menu-item--has-children:focus-within > .shark-submenu {
    opacity: 1;
    visibility: visible;
    transform: translateY(0);
}

.shark-submenu .shark-menu-link {
    display: flex;
    width: 100%;
    padding: 0.55rem 0.75rem;
    font-size: 0.9rem;
    color: var(--shark-c-nav-text);
    border-radius: var(--shark-radius-sm);
}

.shark-submenu .shark-menu-link:hover,
.shark-submenu .shark-menu-link:focus {
    color: var(--shark-c-gold);
    background: rgba(245, 197, 24, 0.08);
}

.shark-submenu .shark-menu-item.is-active > .shark-menu-link {
    color: var(--shark-c-gold);
    background: rgba(245, 197, 24, 0.10);
}

.shark-submenu .shark-menu-item.is-active > .shark-menu-link::after {
    display: none;
}

/* Submenús anidados (2do, 3er, 4to nivel): ACORDEÓN VERTICAL EXPANDIDO */
.shark-submenu .shark-submenu {
    position: static;
    min-width: 0;
    width: auto;
    margin: 0;
    padding: 0;
    border-left: 0 solid transparent;
    border-top: none;
    border-right: none;
    border-bottom: none;
    border-radius: 0;
    background: transparent;
    box-shadow: none;
    opacity: 0;
    visibility: hidden;
    transform: translateY(-6px);
    max-height: 0;
    overflow: hidden;
    display: block;
    transition: opacity .2s ease, transform .2s ease, visibility .2s ease, max-height .25s ease, margin .25s ease, padding .25s ease, border-width .25s ease;
    z-index: 1;
}

.shark-submenu .shark-submenu .shark-submenu {
    /* Se hereda margin/padding solo cuando está ABIERTO */
}

.shark-submenu .shark-menu-item--has-children:hover > .shark-submenu,
.shark-submenu .shark-menu-item--has-children:focus-within > .shark-submenu,
.shark-menu-item--has-children.is-open > .shark-submenu {
    opacity: 1;
    visibility: visible;
    transform: translateY(0);
    max-height: 1200px;
    overflow: visible;
    margin: 0.35rem 0 0.5rem 0.75rem;
    padding: 0.35rem 0.35rem 0.35rem 0.75rem;
    border-left: 2px solid var(--shark-c-dark-border);
    background: rgba(255, 255, 255, 0.02);
}

.shark-submenu .shark-submenu .shark-menu-item--has-children:hover > .shark-submenu,
.shark-submenu .shark-submenu .shark-menu-item--has-children:focus-within > .shark-submenu,
.shark-submenu .shark-submenu .shark-menu-item--has-children.is-open > .shark-submenu {
    border-left-color: rgba(245, 197, 24, 0.35);
    margin-left: 0.75rem;
}

.shark-submenu .shark-menu-item--has-children > .shark-menu-link .shark-menu-caret {
    margin-left: auto;
    transform: translateY(1px);
    opacity: 0.75;
    transition: transform .2s ease, opacity .2s ease;
}

.shark-submenu .shark-menu-item--has-children:hover > .shark-menu-link .shark-menu-caret,
.shark-submenu .shark-menu-item--has-children:focus-within > .shark-menu-link .shark-menu-caret,
.shark-submenu .shark-menu-item--has-children.is-open > .shark-menu-link .shark-menu-caret {
    transform: translateY(1px) rotate(180deg);
    opacity: 1;
}

.shark-menu-item--depth-1.is-active > .shark-menu-link::after {
    display: none;
}

.shark-submenu {
    max-height: none;
    overflow: visible;
    overflow-x: clip;
    overflow-y: visible;
}

@media (min-width: 992px) {
    .shark-submenu {
        max-width: 320px;
    }
}


/* ---------- Botón CTA (dorado) ---------- */
.shark-header__cta {
    flex: 0 0 auto;
    display: inline-flex;
    align-items: center;
}

.shark-btn--gold {
    background: linear-gradient(135deg, var(--shark-c-gold) 0%, var(--shark-c-gold-600) 100%);
    color: #0a2540;
    border-color: var(--shark-c-gold);
    padding: 0.65rem 1.2rem;
    font-size: 0.9rem;
    font-weight: 800;
    border-radius: var(--shark-radius-md);
    box-shadow: 0 6px 16px -6px rgba(245, 197, 24, 0.55);
}

.shark-btn--gold:hover {
    background: linear-gradient(135deg, var(--shark-c-gold-600) 0%, var(--shark-c-gold-700) 100%);
    border-color: var(--shark-c-gold-600);
    color: #071a2e;
    transform: translateY(-1px);
    box-shadow: 0 10px 24px -8px rgba(245, 197, 24, 0.65);
}

/* ---------- Botón hamburguesa (oculto desktop) ---------- */
.shark-header__toggle {
    display: none;
    flex: 0 0 auto;
    align-items: center;
    justify-content: center;
    width: 44px;
    height: 44px;
    padding: 0;
    background: transparent;
    border: 1px solid var(--shark-c-dark-border);
    border-radius: var(--shark-radius-sm);
    color: var(--shark-c-white);
    cursor: pointer;
    transition: background-color .2s ease, color .2s ease;
}

.shark-header__toggle:hover,
.shark-header__toggle:focus {
    background: rgba(245, 197, 24, 0.08);
    color: var(--shark-c-gold);
    outline: none;
}

.shark-header__toggle[aria-expanded="true"] {
    background: rgba(245, 197, 24, 0.12);
    color: var(--shark-c-gold);
}

.shark-toggle-icon {
    position: relative;
    display: block;
    width: 20px;
    height: 2px;
    background: currentColor;
    border-radius: 2px;
    transition: background-color .2s ease;
}

.shark-toggle-icon::before,
.shark-toggle-icon::after {
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    height: 2px;
    background: currentColor;
    border-radius: 2px;
    transition: transform .25s ease, top .25s ease, opacity .2s ease;
}

.shark-toggle-icon::before { top: -6px; }
.shark-toggle-icon::after  { top: 6px; }

.shark-header__toggle[aria-expanded="true"] .shark-toggle-icon {
    background: transparent;
}

.shark-header__toggle[aria-expanded="true"] .shark-toggle-icon::before {
    top: 0;
    transform: rotate(45deg);
}

.shark-header__toggle[aria-expanded="true"] .shark-toggle-icon::after {
    top: 0;
    transform: rotate(-45deg);
}

/* ============================================
   4. Botones reutilizables (CTAs)
   ============================================ */
.shark-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: .6rem;
    padding: .85rem 1.4rem;
    font-weight: 700;
    font-size: 1rem;
    line-height: 1.1;
    border-radius: var(--shark-radius-md);
    border: 2px solid transparent;
    cursor: pointer;
    text-align: center;
    text-decoration: none !important;
    transition: transform .18s ease, box-shadow .18s ease,
                background-color .18s ease, color .18s ease, border-color .18s ease;
    white-space: normal;
}

.shark-btn:focus-visible {
    outline: 3px solid var(--shark-c-accent);
    outline-offset: 2px;
}

.shark-btn:hover { transform: translateY(-1px); box-shadow: var(--shark-shadow-md); }

.shark-btn--primary {
    background: var(--shark-c-primary);
    color: var(--shark-c-white);
    border-color: var(--shark-c-primary);
}
.shark-btn--primary:hover { background: var(--shark-c-primary-700); border-color: var(--shark-c-primary-700); color: var(--shark-c-white); }

.shark-btn--accent {
    background: var(--shark-c-accent);
    color: var(--shark-c-white);
    border-color: var(--shark-c-accent);
}
.shark-btn--accent:hover { background: var(--shark-c-accent-700); border-color: var(--shark-c-accent-700); color: var(--shark-c-white); }

.shark-btn--ghost {
    background: rgba(31, 164, 197, 0.08);
    color: var(--shark-c-accent);
    border-color: rgba(31, 164, 197, 0.55);
}
.shark-btn--ghost:hover {
    background: var(--shark-c-accent);
    color: var(--shark-c-white);
    border-color: var(--shark-c-accent);
    text-decoration: none;
}

.shark-btn--whatsapp {
    background: var(--shark-c-whatsapp);
    color: var(--shark-c-white);
    border-color: var(--shark-c-whatsapp);
    font-weight: 800;
}
.shark-btn--whatsapp:hover { background: var(--shark-c-whatsapp-700); border-color: var(--shark-c-whatsapp-700); color: var(--shark-c-white); }

.shark-btn--lg { padding: 1.2rem 2rem; font-size: 1.1rem; border-radius: var(--shark-radius-lg); }

/* ============================================
   5. Secciones (wrapper interno común)
   ============================================ */
.shark-section__inner {
    max-width: var(--shark-rw);
    margin: 0 auto;
    padding: var(--shark-py) var(--shark-px);
}

.shark-section__title {
    font-size: clamp(1.9rem, 2.4vw + 1rem, 2.7rem);
    text-align: center;
    margin-bottom: 1rem;
}

.shark-section__lede {
    text-align: center;
    font-size: 1.05rem;
    color: var(--shark-c-muted);
    max-width: 780px;
    margin: 0 auto 3rem;
}

/* ============================================
   6. SECCIÓN · HERO PRINCIPAL (SOLO IMAGEN DE FONDO · 100% PANTALLA + MENÚ FLOTANTE)
   ============================================ */
.shark-hero {
    position: relative;
    background-color: var(--shark-c-dark-bg-2);
    background-image: url('assets/images/hero-home-bg.png');
    background-repeat: no-repeat;
    background-position: center center;
    background-size: cover;
    background-attachment: scroll;
    color: var(--shark-c-white);
    overflow: hidden;
    isolation: isolate;
    width: 100%;
    min-height: 100vh;
    min-height: 100dvh;
}

.shark-hero::before {
    content: none;
    display: none;
    background: none;
    background-image: none;
}

.shark-hero__inner {
    position: relative;
    z-index: 1;
    max-width: var(--shark-rw);
    margin: 0 auto;
    padding: 0;
    text-align: center;
    width: 0;
    height: 0;
    overflow: hidden;
    visibility: hidden;
}

/* Responsive Hero: 100% pantalla (incluye menú fixed flotante) · Centrado móvil */
@media (max-width: 1199px) {
    .shark-hero {
        min-height: 100vh;
        min-height: 100dvh;
    }
}

@media (max-width: 991px) {
    .shark-hero {
        min-height: 100vh;
        min-height: 100dvh;
        background-position: center center;
    }
}

@media (max-width: 767px) {
    .shark-hero {
        min-height: 100vh;
        min-height: 100dvh;
        background-position: center center;
    }
}

@media (max-width: 480px) {
    .shark-hero {
        min-height: 100vh;
        min-height: 100dvh;
        background-position: center center;
    }
}

/* ============================================
   6b. SECCIÓN · SUB-CTA "SUBE TU EMPRENDIMIENTO"
       (Refuerzo visual debajo del Hero)
   ============================================ */
.shark-subcta {
    position: relative;
    background-color: #030c1a;
    background-image:
        radial-gradient(1200px 420px at 50% -10%, rgba(31, 164, 197, 0.14), transparent 60%),
        radial-gradient(900px 380px at 50% 120%, rgba(15, 76, 129, 0.45), transparent 65%);
    overflow: hidden;
}

.shark-subcta::before {
    content: "";
    position: absolute;
    inset: 0;
    pointer-events: none;
    background: linear-gradient(180deg, rgba(3, 12, 26, 0.45) 0%, rgba(3, 12, 26, 0.2) 18%, rgba(3, 12, 26, 0.7) 100%);
}

.shark-subcta__inner {
    position: relative;
    z-index: 1;
    max-width: var(--shark-rw);
    margin: 0 auto;
    padding: 2rem var(--shark-px);
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    text-align: center;
    gap: 1.15rem;
}

.shark-subcta__title {
    font-size: clamp(1.45rem, 2.6vw + 0.4rem, 2.6rem);
    font-weight: 900;
    line-height: 1.05;
    letter-spacing: -0.005em;
    text-transform: uppercase;
    color: #ffffff;
    margin: 0;
    text-shadow:
        0 8px 24px rgba(3, 7, 18, 0.85),
        0 2px 6px rgba(3, 7, 18, 0.75),
        0 0 1px rgba(255, 255, 255, 0.18);
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

.shark-btn--gold-2xl {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: min(620px, 100%);
    padding: 0.75rem 2rem;
    font-size: clamp(0.85rem, 0.5vw + 0.78rem, 0.98rem);
    font-weight: 900;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    color: #030712;
    background: linear-gradient(180deg, #d4a90c 0%, #b8890f 100%);
    border: 1px solid #a88206;
    border-radius: 6px;
    box-shadow:
        0 10px 24px -10px rgba(212, 169, 12, 0.48),
        inset 0 1px 0 rgba(255, 255, 255, 0.28);
    text-decoration: none;
    cursor: pointer;
    transition: transform .22s ease, box-shadow .22s ease, filter .22s ease, background .22s ease;
    font-family: var(--shark-font);
    line-height: 1;
}

.shark-btn--gold-2xl:hover,
.shark-btn--gold-2xl:focus {
    background: linear-gradient(180deg, #e2b711 0%, #c49a1c 100%);
    transform: translateY(-1px);
    filter: saturate(1.1);
    box-shadow:
        0 14px 28px -10px rgba(226, 183, 17, 0.6),
        inset 0 1px 0 rgba(255, 255, 255, 0.32);
    text-decoration: none;
    outline: none;
    color: #030712;
}

.shark-btn--gold-2xl:active {
    transform: translateY(0);
    box-shadow:
        0 5px 12px -4px rgba(184, 137, 15, 0.45),
        inset 0 1px 0 rgba(255, 255, 255, 0.2);
}

@media (max-width: 639px) {
    .shark-subcta__inner {
        padding: 1.5rem var(--shark-px);
        gap: 0.95rem;
    }

    .shark-subcta__title {
        font-size: clamp(1.3rem, 4.8vw + 0.1rem, 1.85rem);
    }

    .shark-btn--gold-2xl {
        padding: 0.68rem 1.5rem;
        font-size: 0.85rem;
        letter-spacing: 0.05em;
    }
}

/* ============================================
   6c. SECCIÓN · QUIENES SOMOS (Logo + Texto dorado)
   ============================================ */
.shark-quienes {
    background-color: #000000;
    position: relative;
    overflow: hidden;
}

.shark-quienes::before {
    content: "";
    position: absolute;
    inset: 0;
    pointer-events: none;
    background:
        radial-gradient(700px 400px at 12% 50%, rgba(15, 76, 129, 0.28), transparent 65%),
        radial-gradient(800px 500px at 88% 50%, rgba(31, 164, 197, 0.15), transparent 65%);
}

.shark-quienes__inner {
    position: relative;
    z-index: 1;
    max-width: 1040px;
    margin: 0 auto;
    padding: 5rem var(--shark-px);
    display: grid;
    grid-template-columns: 380px 1fr;
    gap: 3.5rem 4rem;
    align-items: center;
}

.shark-quienes__media {
    margin: 0;
    width: 100%;
    max-width: 380px;
    aspect-ratio: 1 / 1;
    justify-self: center;
    position: relative;
}

.shark-quienes__media::before {
    content: "";
    position: absolute;
    inset: 0;
    border-radius: 50%;
    padding: 3px;
    background:
        conic-gradient(from 180deg at 50% 50%,
            rgba(245, 197, 24, 0.95) 0deg,
            rgba(184, 137, 15, 0.6) 120deg,
            rgba(255, 255, 255, 0.25) 200deg,
            rgba(212, 169, 12, 0.95) 360deg);
    -webkit-mask:
        linear-gradient(#000 0 0) content-box,
        linear-gradient(#000 0 0);
    -webkit-mask-composite: xor;
            mask-composite: exclude;
    box-shadow:
        0 0 50px 0 rgba(245, 197, 24, 0.22),
        0 0 100px -10px rgba(245, 197, 24, 0.35),
        0 18px 50px -12px rgba(3, 7, 18, 0.9);
    pointer-events: none;
    z-index: 1;
}

.shark-quienes__img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
    border-radius: 50%;
    display: block;
    filter: drop-shadow(0 10px 30px rgba(3, 7, 18, 0.85));
    position: relative;
    z-index: 0;
}

.shark-quienes__content {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: center;
    gap: 1.75rem;
    max-width: 620px;
}

.shark-quienes__title-wrap {
    width: 100%;
    display: flex;
    justify-content: flex-start;
}

.shark-btn--gold-section {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: min(520px, 100%);
    padding: 0.7rem 2.2rem;
    font-size: 0.98rem;
    font-weight: 900;
    letter-spacing: 0.03em;
    text-transform: none;
    color: #030712;
    background: linear-gradient(180deg, #d4a90c 0%, #b8890f 100%);
    border: 1px solid #a88206;
    border-radius: 6px;
    box-shadow:
        0 10px 26px -10px rgba(212, 169, 12, 0.55),
        inset 0 1px 0 rgba(255, 255, 255, 0.3);
    text-decoration: none;
    cursor: default;
    pointer-events: none;
    transition: none;
    line-height: 1;
    margin: 0;
}

.shark-btn--gold-section:hover {
    text-decoration: none;
    color: #030712;
}

.shark-quienes__desc {
    margin: 0;
    padding: 0;
    color: #f5c518;
    font-size: clamp(1.15rem, 1.05vw + 0.95rem, 1.5rem);
    line-height: 1.85;
    font-weight: 500;
    letter-spacing: 0.01em;
    text-align: left;
    text-shadow: 0 4px 18px rgba(3, 7, 18, 0.78);
}

/* Responsive QUIENES SOMOS */
@media (max-width: 991px) {
    .shark-quienes__inner {
        grid-template-columns: 320px 1fr;
        max-width: 880px;
        padding: 4rem var(--shark-px);
        gap: 3rem 3rem;
    }

    .shark-quienes__media {
        max-width: 320px;
    }

    .shark-quienes__content {
        gap: 1.5rem;
    }

    .shark-btn--gold-section {
        width: min(460px, 100%);
        font-size: 0.92rem;
    }
}

@media (max-width: 767px) {
    .shark-quienes__inner {
        grid-template-columns: 1fr;
        max-width: 640px;
        padding: 3.25rem var(--shark-px);
        gap: 2rem;
        text-align: center;
    }

    .shark-quienes__media {
        max-width: 280px;
    }

    .shark-quienes__content {
        align-items: center;
        justify-content: center;
        gap: 1.5rem;
        max-width: 100%;
    }

    .shark-quienes__title-wrap {
        justify-content: center;
    }

    .shark-btn--gold-section {
        width: min(420px, 100%);
        padding: 0.65rem 1.75rem;
        font-size: 0.88rem;
    }

    .shark-quienes__desc {
        text-align: center;
        font-size: clamp(1.02rem, 1.5vw + 0.85rem, 1.2rem);
        line-height: 1.75;
    }
}

@media (max-width: 480px) {
    .shark-quienes__inner {
        padding: 2.5rem var(--shark-px);
        gap: 1.75rem;
    }

    .shark-quienes__media {
        max-width: 240px;
    }

    .shark-quienes__content {
        gap: 1.25rem;
    }

    .shark-btn--gold-section {
        width: 100%;
        font-size: 0.85rem;
        padding: 0.6rem 1.5rem;
    }

    .shark-quienes__desc {
        font-size: 1rem;
        line-height: 1.7;
    }
}

/* ============================================
   6d. SECCIÓN · PROMO POSTER Gran Empresa + Botón oferta
   ============================================ */
.shark-promo {
    background-color: #000000;
    position: relative;
    overflow: hidden;
}

.shark-promo::before {
    content: "";
    position: absolute;
    inset: 0;
    pointer-events: none;
    background:
        radial-gradient(900px 500px at 50% 0%, rgba(15, 76, 129, 0.22), transparent 65%),
        radial-gradient(900px 500px at 50% 100%, rgba(31, 164, 197, 0.12), transparent 65%);
}

.shark-promo__inner {
    position: relative;
    z-index: 1;
    max-width: 1040px;
    margin: 0 auto;
    padding: 4.5rem var(--shark-px) 5rem;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 2.25rem;
}

.shark-promo__poster {
    margin: 0;
    width: 100%;
    max-width: 546px;
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
}

.shark-promo__poster::before {
    content: "";
    position: absolute;
    inset: -4px;
    border-radius: 14px;
    padding: 2px;
    background: linear-gradient(135deg,
        rgba(245, 197, 24, 0.95) 0%,
        rgba(15, 76, 129, 0.8) 45%,
        rgba(31, 164, 197, 0.75) 100%);
    -webkit-mask:
        linear-gradient(#000 0 0) content-box,
        linear-gradient(#000 0 0);
    -webkit-mask-composite: xor;
            mask-composite: exclude;
    z-index: 1;
    pointer-events: none;
    opacity: 0.95;
}

.shark-promo__img {
    width: 100%;
    height: auto;
    display: block;
    border-radius: 12px;
    position: relative;
    z-index: 0;
    box-shadow:
        0 0 60px -10px rgba(245, 197, 24, 0.18),
        0 20px 60px -12px rgba(3, 7, 18, 0.95);
}

.shark-promo__cta-wrap {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
}

.shark-btn--gold-offer {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: min(820px, 100%);
    padding: 0.85rem 2.5rem;
    font-size: clamp(0.9rem, 0.6vw + 0.8rem, 1.08rem);
    font-weight: 900;
    letter-spacing: 0.025em;
    text-transform: none;
    color: #030712;
    background: linear-gradient(180deg, #d4a90c 0%, #b8890f 100%);
    border: 1px solid #a88206;
    border-radius: 6px;
    box-shadow:
        0 12px 28px -10px rgba(212, 169, 12, 0.55),
        inset 0 1px 0 rgba(255, 255, 255, 0.3);
    text-decoration: none;
    cursor: pointer;
    transition: transform .2s ease, box-shadow .2s ease, filter .2s ease, background .2s ease;
    line-height: 1.2;
    text-align: center;
    font-family: var(--shark-font);
}

.shark-btn--gold-offer:hover,
.shark-btn--gold-offer:focus {
    background: linear-gradient(180deg, #e2b711 0%, #c49a1c 100%);
    transform: translateY(-1.5px);
    filter: saturate(1.12);
    box-shadow:
        0 16px 36px -10px rgba(226, 183, 17, 0.7),
        inset 0 1px 0 rgba(255, 255, 255, 0.35);
    color: #030712;
    text-decoration: none;
    outline: none;
}

.shark-btn--gold-offer:active {
    transform: translateY(0);
    box-shadow:
        0 6px 16px -4px rgba(184, 137, 15, 0.5),
        inset 0 1px 0 rgba(255, 255, 255, 0.22);
}

/* Responsive PROMO POSTER */
@media (max-width: 991px) {
    .shark-promo__inner {
        max-width: 880px;
        padding: 3.75rem var(--shark-px) 4.25rem;
        gap: 2rem;
    }

    .shark-promo__poster {
        max-width: 448px;
    }
}

@media (max-width: 767px) {
    .shark-promo__inner {
        max-width: 640px;
        padding: 3rem var(--shark-px) 3.5rem;
        gap: 1.75rem;
    }

    .shark-promo__poster {
        max-width: 364px;
    }

    .shark-btn--gold-offer {
        padding: 0.78rem 2rem;
        font-size: 0.95rem;
    }
}

@media (max-width: 480px) {
    .shark-promo__inner {
        padding: 2.25rem var(--shark-px) 2.75rem;
        gap: 1.5rem;
    }

    .shark-promo__poster {
        max-width: 92%;
    }

    .shark-btn--gold-offer {
        width: 100%;
        padding: 0.72rem 1.5rem;
        font-size: 0.88rem;
        line-height: 1.3;
        letter-spacing: 0.015em;
    }
}

/* ============================================
   6e. SECCIÓN · GALERÍA 3 IMÁGENES (vertical)
   ============================================ */
.shark-gallery3 {
    background-color: #000000;
    position: relative;
    overflow: hidden;
}

.shark-gallery3::before {
    content: "";
    position: absolute;
    inset: 0;
    pointer-events: none;
    background:
        radial-gradient(1000px 600px at 50% 0%, rgba(15, 76, 129, 0.2), transparent 65%),
        radial-gradient(1000px 600px at 50% 100%, rgba(31, 164, 197, 0.1), transparent 65%);
}

.shark-gallery3__inner {
    position: relative;
    z-index: 1;
    max-width: 1000px;
    margin: 0 auto;
    padding: 4.5rem var(--shark-px) 5rem;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 2.75rem;
}

.shark-gallery3__item {
    margin: 0;
    width: 100%;
    max-width: 900px;
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
}

.shark-gallery3__item::before {
    content: "";
    position: absolute;
    inset: -3px;
    border-radius: 16px;
    padding: 2px;
    background: linear-gradient(135deg,
        rgba(245, 197, 24, 0.95) 0%,
        rgba(15, 76, 129, 0.75) 50%,
        rgba(31, 164, 197, 0.7) 100%);
    -webkit-mask:
        linear-gradient(#000 0 0) content-box,
        linear-gradient(#000 0 0);
    -webkit-mask-composite: xor;
            mask-composite: exclude;
    z-index: 1;
    pointer-events: none;
    opacity: 0.92;
}

.shark-gallery3__img {
    width: 100%;
    height: auto;
    display: block;
    border-radius: 14px;
    position: relative;
    z-index: 0;
    box-shadow:
        0 0 55px -10px rgba(245, 197, 24, 0.14),
        0 22px 60px -14px rgba(3, 7, 18, 0.95);
    transition: transform .28s ease, box-shadow .28s ease, filter .28s ease;
    will-change: transform;
}

.shark-gallery3__item:hover .shark-gallery3__img {
    transform: translateY(-4px);
    filter: saturate(1.08) brightness(1.02);
    box-shadow:
        0 0 70px -8px rgba(245, 197, 24, 0.26),
        0 28px 70px -16px rgba(3, 7, 18, 0.98);
}

/* Responsive GALERÍA 3 */
@media (max-width: 991px) {
    .shark-gallery3__inner {
        max-width: 860px;
        padding: 3.75rem var(--shark-px) 4.25rem;
        gap: 2.25rem;
    }

    .shark-gallery3__item {
        max-width: 780px;
    }
}

@media (max-width: 767px) {
    .shark-gallery3__inner {
        max-width: 640px;
        padding: 3rem var(--shark-px) 3.5rem;
        gap: 1.75rem;
    }

    .shark-gallery3__item {
        max-width: 100%;
    }

    .shark-gallery3__img {
        border-radius: 12px;
    }
}

@media (max-width: 480px) {
    .shark-gallery3__inner {
        padding: 2.25rem var(--shark-px) 2.75rem;
        gap: 1.25rem;
    }

    .shark-gallery3__item::before {
        inset: -2px;
        border-radius: 12px;
    }

    .shark-gallery3__img {
        border-radius: 10px;
    }
}

/* ============================================
   6f. SECCIÓN · FERIA DE EMPRENDEDORES
       (Botón superior + 2 imágenes + Botón dorado)
   ============================================ */
.shark-feria {
    background-color: #000000;
    position: relative;
    overflow: hidden;
}

.shark-feria::before {
    content: "";
    position: absolute;
    inset: 0;
    pointer-events: none;
    background:
        radial-gradient(1000px 600px at 50% 0%, rgba(15, 76, 129, 0.18), transparent 65%),
        radial-gradient(1000px 600px at 50% 100%, rgba(31, 164, 197, 0.1), transparent 65%);
}

.shark-feria__inner {
    position: relative;
    z-index: 1;
    max-width: 1040px;
    margin: 0 auto;
    padding: 4.5rem var(--shark-px) 5rem;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 2.5rem;
}

/* ---------- Botones placa superior / inferior ---------- */
.shark-feria__btn-wrap {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
}

/* Placa superior estática (no clickeable) */
.shark-btn--gold-plate {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: min(980px, 100%);
    padding: 0.75rem 2.5rem;
    font-size: clamp(0.9rem, 0.7vw + 0.8rem, 1.08rem);
    font-weight: 900;
    letter-spacing: 0.035em;
    text-transform: none;
    color: #030712;
    background: linear-gradient(180deg, #d4a90c 0%, #b8890f 100%);
    border: 1px solid #a88206;
    border-radius: 6px;
    box-shadow:
        0 10px 26px -10px rgba(212, 169, 12, 0.55),
        inset 0 1px 0 rgba(255, 255, 255, 0.3);
    text-decoration: none;
    cursor: default;
    pointer-events: none;
    line-height: 1.15;
    text-align: center;
    font-family: var(--shark-font);
    margin: 0;
}

.shark-btn--gold-plate:hover {
    text-decoration: none;
    color: #030712;
}

/* ---------- Botón inferior CLICK AQUI! (clickeable → WhatsApp) ---------- */
.shark-btn--gold-cta-click {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: min(980px, 100%);
    padding: 0.85rem 2.5rem;
    font-size: clamp(0.92rem, 0.75vw + 0.82rem, 1.1rem);
    font-weight: 900;
    letter-spacing: 0.07em;
    text-transform: uppercase;
    color: #030712;
    background: linear-gradient(180deg, #d4a90c 0%, #b8890f 100%);
    border: 1px solid #a88206;
    border-radius: 6px;
    box-shadow:
        0 12px 28px -10px rgba(212, 169, 12, 0.6),
        inset 0 1px 0 rgba(255, 255, 255, 0.3);
    text-decoration: none;
    cursor: pointer;
    transition: transform .2s ease, box-shadow .2s ease, filter .2s ease, background .2s ease;
    line-height: 1.15;
    text-align: center;
    font-family: var(--shark-font);
}

.shark-btn--gold-cta-click:hover,
.shark-btn--gold-cta-click:focus {
    background: linear-gradient(180deg, #e2b711 0%, #c49a1c 100%);
    transform: translateY(-1.5px);
    filter: saturate(1.12);
    box-shadow:
        0 16px 36px -10px rgba(226, 183, 17, 0.72),
        inset 0 1px 0 rgba(255, 255, 255, 0.35);
    color: #030712;
    text-decoration: none;
    outline: none;
}

.shark-btn--gold-cta-click:active {
    transform: translateY(0);
    box-shadow:
        0 6px 16px -4px rgba(184, 137, 15, 0.5),
        inset 0 1px 0 rgba(255, 255, 255, 0.22);
}

/* ---------- Imágenes ---------- */
.shark-feria__item {
    margin: 0;
    width: 100%;
    max-width: 980px;
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
}

.shark-feria__item::before {
    content: "";
    position: absolute;
    inset: -2px;
    border-radius: 8px;
    padding: 2px;
    background: linear-gradient(135deg,
        rgba(245, 197, 24, 0.95) 0%,
        rgba(15, 76, 129, 0.75) 50%,
        rgba(31, 164, 197, 0.7) 100%);
    -webkit-mask:
        linear-gradient(#000 0 0) content-box,
        linear-gradient(#000 0 0);
    -webkit-mask-composite: xor;
            mask-composite: exclude;
    z-index: 1;
    pointer-events: none;
    opacity: 0.95;
}

.shark-feria__img {
    width: 100%;
    height: auto;
    display: block;
    border-radius: 6px;
    position: relative;
    z-index: 0;
    box-shadow:
        0 0 55px -10px rgba(245, 197, 24, 0.12),
        0 22px 60px -14px rgba(3, 7, 18, 0.95);
    transition: transform .28s ease, box-shadow .28s ease, filter .28s ease;
    will-change: transform;
}

.shark-feria__item:hover .shark-feria__img {
    transform: translateY(-3px);
    filter: saturate(1.06) brightness(1.02);
    box-shadow:
        0 0 70px -8px rgba(245, 197, 24, 0.22),
        0 28px 70px -16px rgba(3, 7, 18, 0.98);
}

/* Responsive FERIA */
@media (max-width: 991px) {
    .shark-feria__inner {
        max-width: 880px;
        padding: 3.75rem var(--shark-px) 4.25rem;
        gap: 2rem;
    }

    .shark-btn--gold-plate,
    .shark-btn--gold-cta-click,
    .shark-feria__item {
        max-width: 860px;
    }
}

@media (max-width: 767px) {
    .shark-feria__inner {
        max-width: 640px;
        padding: 3rem var(--shark-px) 3.5rem;
        gap: 1.75rem;
    }

    .shark-btn--gold-plate,
    .shark-btn--gold-cta-click,
    .shark-feria__item {
        max-width: 100%;
    }

    .shark-btn--gold-plate {
        padding: 0.7rem 1.75rem;
        font-size: 0.92rem;
    }

    .shark-btn--gold-cta-click {
        padding: 0.8rem 1.75rem;
        font-size: 0.98rem;
    }
}

@media (max-width: 480px) {
    .shark-feria__inner {
        padding: 2.25rem var(--shark-px) 2.75rem;
        gap: 1.5rem;
    }

    .shark-btn--gold-plate {
        padding: 0.65rem 1.5rem;
        font-size: 0.85rem;
        letter-spacing: 0.025em;
    }

    .shark-btn--gold-cta-click {
        padding: 0.72rem 1.5rem;
        font-size: 0.92rem;
        letter-spacing: 0.05em;
    }

    .shark-feria__item::before {
        inset: -1.5px;
    }
}

/* ============================================
   6g. SECCIÓN · SISTEMA INSTITUCIONAL DE EVALUACIÓN ESTRATÉGICA
       (METODOLOGÍA SOL® y CREANDO EMPRESA SOL®)
   ============================================ */
.shark-soltext {
    background-color: #000000;
    position: relative;
    overflow: hidden;
}

.shark-soltext::before {
    content: "";
    position: absolute;
    inset: 0;
    pointer-events: none;
    background:
        radial-gradient(1000px 600px at 50% 0%, rgba(15, 76, 129, 0.2), transparent 65%),
        radial-gradient(1000px 600px at 50% 100%, rgba(31, 164, 197, 0.1), transparent 65%);
}

.shark-soltext__inner {
    position: relative;
    z-index: 1;
    max-width: 1040px;
    margin: 0 auto;
    padding: 5rem var(--shark-px) 5.5rem;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: flex-start;
    gap: 1.5rem;
    color: var(--shark-c-text);
    font-family: var(--shark-font);
}

/* Título principal */
.shark-soltext__title {
    margin: 0 0 0.5rem;
    width: 100%;
    font-size: clamp(1.75rem, 2.4vw + 0.6rem, 2.8rem);
    font-weight: 800;
    line-height: 1.15;
    letter-spacing: -0.005em;
    color: #ffffff;
    text-shadow:
        0 6px 20px rgba(3, 7, 18, 0.85),
        0 1px 3px rgba(3, 7, 18, 0.7);
    position: relative;
    padding-bottom: 1.15rem;
}

.shark-soltext__title::after {
    content: "";
    position: absolute;
    left: 0;
    bottom: 0;
    width: min(260px, 45%);
    height: 3px;
    background: linear-gradient(90deg,
        var(--shark-c-gold) 0%,
        rgba(245, 197, 24, 0) 100%);
    border-radius: 3px;
}

/* Texto intro / párrafos base */
.shark-soltext__intro,
.shark-soltext__paragraph {
    margin: 0;
    padding: 0;
    font-size: clamp(1rem, 0.7vw + 0.9rem, 1.18rem);
    line-height: 1.85;
    color: #cbd5e1;
    letter-spacing: 0.005em;
    text-align: left;
}

.shark-soltext__paragraph {
    margin-top: 0.15rem;
}

/* Bullet list (METODOLOGÍAS) */
.shark-soltext__bullets {
    list-style: none;
    padding: 0;
    margin: 0.75rem 0 0.35rem;
    display: flex;
    flex-direction: column;
    gap: 0.9rem;
    width: 100%;
}

.shark-soltext__bullet {
    position: relative;
    padding: 1.1rem 1.25rem 1.1rem 3rem;
    background: linear-gradient(90deg,
        rgba(10, 37, 64, 0.88) 0%,
        rgba(14, 46, 77, 0.7) 100%);
    border-left: 4px solid var(--shark-c-gold);
    border-radius: var(--shark-radius-md);
    box-shadow: var(--shark-shadow-sm);
    font-size: clamp(1rem, 0.75vw + 0.9rem, 1.2rem);
    line-height: 1.7;
    color: #e2e8f0;
    font-weight: 500;
}

.shark-soltext__bullet::before {
    content: "";
    position: absolute;
    left: 1.1rem;
    top: 50%;
    width: 0.8rem;
    height: 0.8rem;
    transform: translateY(-50%) rotate(45deg);
    background: var(--shark-c-gold);
    border-radius: 2px;
    box-shadow: 0 0 10px rgba(245, 197, 24, 0.6);
}

.shark-soltext__bullet strong,
.shark-soltext__intro strong,
.shark-soltext__paragraph strong {
    color: var(--shark-c-gold);
    font-weight: 700;
}

/* Firma + cita institucional */
.shark-soltext__sign {
    width: 100%;
    margin-top: 1rem;
    padding-top: 2rem;
    border-top: 1px solid rgba(245, 197, 24, 0.18);
    display: flex;
    flex-direction: column;
    gap: 1.15rem;
}

.shark-soltext__firm {
    margin: 0;
    padding: 0;
    font-size: clamp(1.05rem, 0.75vw + 0.95rem, 1.28rem);
    line-height: 1.35;
    font-weight: 800;
    letter-spacing: 0.01em;
    color: var(--shark-c-gold);
    text-shadow: 0 4px 14px rgba(3, 7, 18, 0.8);
}

.shark-soltext__quote {
    margin: 0;
    padding: 1.25rem 1.5rem 1.25rem 1.75rem;
    background: linear-gradient(135deg,
        rgba(10, 37, 64, 0.9) 0%,
        rgba(7, 26, 46, 0.88) 100%);
    border-left: 5px solid var(--shark-c-gold);
    border-radius: var(--shark-radius-md);
    box-shadow:
        0 0 40px -10px rgba(245, 197, 24, 0.16),
        0 12px 30px -12px rgba(3, 7, 18, 0.9);
}

.shark-soltext__quote p {
    margin: 0;
    padding: 0;
    font-size: clamp(1rem, 0.7vw + 0.9rem, 1.18rem);
    line-height: 1.85;
    color: #e2e8f0;
    font-style: italic;
    letter-spacing: 0.005em;
    text-shadow: 0 2px 8px rgba(3, 7, 18, 0.7);
}

/* Responsive SOLTEXT */
@media (max-width: 991px) {
    .shark-soltext__inner {
        max-width: 880px;
        padding: 4rem var(--shark-px) 4.5rem;
        gap: 1.35rem;
    }
}

@media (max-width: 767px) {
    .shark-soltext__inner {
        max-width: 640px;
        padding: 3.25rem var(--shark-px) 3.75rem;
        gap: 1.2rem;
    }

    .shark-soltext__title {
        padding-bottom: 1rem;
    }

    .shark-soltext__bullets {
        gap: 0.75rem;
    }

    .shark-soltext__bullet {
        padding: 1rem 1rem 1rem 2.5rem;
    }

    .shark-soltext__bullet::before {
        left: 0.9rem;
        width: 0.7rem;
        height: 0.7rem;
    }

    .shark-soltext__sign {
        margin-top: 0.85rem;
        padding-top: 1.75rem;
        gap: 1rem;
    }

    .shark-soltext__quote {
        padding: 1.05rem 1.1rem 1.05rem 1.25rem;
        border-left-width: 4px;
    }
}

@media (max-width: 480px) {
    .shark-soltext__inner {
        padding: 2.5rem var(--shark-px) 3rem;
        gap: 1.1rem;
    }

    .shark-soltext__title::after {
        width: 65%;
    }

    .shark-soltext__bullet {
        padding: 0.95rem 0.95rem 0.95rem 2.25rem;
        font-size: 0.98rem;
    }

    .shark-soltext__bullet::before {
        left: 0.8rem;
        width: 0.65rem;
        height: 0.65rem;
    }

    .shark-soltext__quote {
        padding: 0.95rem 0.9rem 0.95rem 1rem;
    }
}

/* ============================================
   7. SECCIÓN · ¿Qué es Shark Alliance? (about)
   ============================================ */
.shark-about { background: var(--shark-c-bg); }
.shark-about__body {
    max-width: 820px;
    margin: 0 auto;
    text-align: center;
    color: var(--shark-c-muted);
    font-size: 1.05rem;
}
.shark-link {
    font-weight: 700;
    color: var(--shark-c-accent);
    display: inline-block;
    padding: 0.3rem 0;
    border-bottom: 1px solid transparent;
    transition: color .2s ease, border-color .2s ease;
}
.shark-link:hover {
    color: var(--shark-c-gold);
    border-bottom-color: var(--shark-c-gold);
    text-decoration: none;
}

/* ============================================
   8. SECCIÓN · GALERÍA 9 BANNERS (grilla responsive)
   ============================================ */
.shark-banners { background: var(--shark-c-bg-alt); }
.shark-banners__grid {
    display: grid;
    gap: 1.5rem;
    grid-template-columns: repeat(12, 1fr);
    grid-auto-rows: minmax(180px, auto);
}

.shark-banner {
    margin: 0;
    border-radius: var(--shark-radius-md);
    overflow: hidden;
    box-shadow: var(--shark-shadow-sm);
    background: var(--shark-c-bg-muted);
    border: 1px solid var(--shark-c-border);
    transition: transform .25s ease, box-shadow .25s ease, border-color .25s ease;
    display: block;
    position: relative;
}

.shark-banner:hover {
    transform: translateY(-3px);
    box-shadow: var(--shark-shadow-md);
    border-color: var(--shark-c-dark-border);
}

.shark-banner__svg {
    width: 100%;
    height: 100%;
    display: block;
    filter: saturate(1.1) contrast(1.02);
}

/* Distribución asimétrica desktop (9 banners combinados tamaños como Google Sites real) */
.shark-banners__grid > .shark-banner:nth-child(1) { grid-column: span 12; grid-row: span 1; min-height: 280px; }  /* ancho 1280x602 */
.shark-banners__grid > .shark-banner:nth-child(2) { grid-column: span 7;  grid-row: span 2; }                        /* 1280x853 portrait */
.shark-banners__grid > .shark-banner:nth-child(3) { grid-column: span 5;  grid-row: span 2; }                        /* 853x1280 vertical */
.shark-banners__grid > .shark-banner:nth-child(4) { grid-column: span 6;  grid-row: span 2; aspect-ratio: 1 / 1; }   /* 1254x1254 cuadrado */
.shark-banners__grid > .shark-banner:nth-child(5) { grid-column: span 6;  grid-row: span 1; }                        /* ancho corto 1280x439 */
.shark-banners__grid > .shark-banner:nth-child(6) { grid-column: span 6;  grid-row: span 2; }                        /* 1280x853 */
.shark-banners__grid > .shark-banner:nth-child(7) { grid-column: span 12; grid-row: span 1; }                        /* ancho 1280x602 */
.shark-banners__grid > .shark-banner:nth-child(8) { grid-column: span 5;  grid-row: span 2; }                        /* 853x1280 vertical */
.shark-banners__grid > .shark-banner:nth-child(9) { grid-column: span 7;  grid-row: span 2; }                        /* ancho 1280x439 combinado */

/* Tablet: 2 columnas equitativas (1023 → 769) */
@media (max-width: 1023px) {
    .shark-banners__grid { grid-template-columns: repeat(2, 1fr); grid-auto-rows: auto; }
    .shark-banners__grid > .shark-banner { grid-column: span 2 !important; grid-row: span 1 !important; min-height: 240px; aspect-ratio: 16 / 10; }
    .shark-banners__grid > .shark-banner:nth-child(4) { aspect-ratio: 4 / 5; grid-column: span 2; }
}

/* Móvil: 1 sola columna */
@media (max-width: 639px) {
    .shark-banners__grid { grid-template-columns: 1fr; }
    .shark-banners__grid > .shark-banner { grid-column: span 1 !important; aspect-ratio: 16 / 9; min-height: 200px; }
    .shark-banners__grid > .shark-banner:nth-child(4) { aspect-ratio: 1 / 1; }
}

/* ============================================
   9. SECCIÓN · METODOLOGÍAS SOL® (8 cards)
   ============================================ */
.shark-sol {
    background:
        radial-gradient(1100px 520px at 0% -10%, rgba(31, 164, 197, .12), transparent 60%),
        linear-gradient(180deg, var(--shark-c-bg) 0%, var(--shark-c-bg-alt) 100%);
}

.shark-sol__eyebrow {
    display: block;
    text-align: center;
    text-transform: uppercase;
    letter-spacing: .10em;
    font-weight: 700;
    font-size: .85rem;
    color: var(--shark-c-gold);
    margin: 0 0 .75rem;
    text-shadow: 0 2px 12px rgba(245, 197, 24, 0.25);
}

.shark-sol__cards {
    display: grid;
    gap: 1.5rem;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    align-items: stretch;
}

.shark-sol-card {
    background: var(--shark-c-bg-alt);
    border: 1px solid var(--shark-c-border);
    border-top: 5px solid var(--shark-c-accent);
    border-radius: var(--shark-radius-lg);
    padding: 1.8rem 1.6rem;
    box-shadow: var(--shark-shadow-sm);
    transition: transform .25s ease, box-shadow .25s ease, border-top-color .25s ease, background-color .25s ease;
    height: 100%;
}

.shark-sol-card:hover {
    transform: translateY(-4px);
    box-shadow: var(--shark-shadow-md);
    border-top-color: var(--shark-c-gold);
    background: var(--shark-c-bg-muted);
}

.shark-sol-card__title {
    font-size: 1.2rem;
    color: var(--shark-c-white);
    margin: 0 0 .8rem;
}

.shark-sol-card__desc {
    color: var(--shark-c-muted);
    font-size: 1rem;
    margin: 0;
}

.shark-sol-card--quote {
    grid-column: span 3;
    border-top-color: var(--shark-c-gold);
    background:
        linear-gradient(135deg, rgba(31, 164, 197, .06), rgba(245, 197, 24, .08));
    text-align: center;
}

.shark-sol-card__quote {
    margin: 0;
    padding: 1.2rem 1.5rem;
    border-left: 6px solid var(--shark-c-gold);
    border-radius: var(--shark-radius-md);
    background: var(--shark-c-bg);
    color: var(--shark-c-text);
    font-size: 1.12rem;
    font-weight: 500;
    line-height: 1.75;
    text-align: left;
    max-width: 900px;
    margin: 0 auto;
    border: 1px solid var(--shark-c-border);
    border-left: 6px solid var(--shark-c-gold);
}

.shark-sol-card__quote p { margin-bottom: .6rem; }

.shark-sol-card__quote cite {
    display: block;
    font-style: normal;
    font-weight: 700;
    color: var(--shark-c-gold);
    text-align: right;
    margin-top: .8rem;
    font-size: .95rem;
}

/* Responsive cards SOL */
@media (max-width: 991px) {
    .shark-sol__cards { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .shark-sol-card--quote { grid-column: span 2; }
}
@media (max-width: 639px) {
    .shark-sol__cards { grid-template-columns: 1fr; }
    .shark-sol-card--quote { grid-column: span 1; }
}

/* ============================================
   10. SECCIÓN · CTA GENERAL WHATSAPP
   ============================================ */
.shark-cta {
    background: linear-gradient(135deg, var(--shark-c-whatsapp-700) 0%, var(--shark-c-success) 100%);
    color: var(--shark-c-white);
    border-radius: var(--shark-radius-lg);
    margin: 5rem var(--shark-px) 0;
    max-width: var(--shark-rw);
    margin-left: auto;
    margin-right: auto;
    box-shadow: var(--shark-shadow-md);
    overflow: hidden;
}

.shark-cta__inner {
    padding: 4rem var(--shark-px);
    text-align: center;
    max-width: 900px;
    margin: 0 auto;
}

.shark-cta__title {
    color: var(--shark-c-white);
    font-size: clamp(1.8rem, 3vw, 2.6rem);
    margin: 0 0 1rem;
}

.shark-cta__lede {
    color: #dcfce7;
    font-size: 1.05rem;
    margin: 0 auto 2rem;
    max-width: 720px;
}

.shark-cta .shark-btn--whatsapp {
    background: var(--shark-c-white);
    color: var(--shark-c-whatsapp-700);
    border-color: var(--shark-c-white);
    font-weight: 800;
}
.shark-cta .shark-btn--whatsapp:hover {
    background: #dcfce7;
    color: var(--shark-c-whatsapp-700);
    border-color: #dcfce7;
}

/* ============================================
   11. RESPONSIVE — HEADER / MENÚ
   ============================================ */

/* Tablet / Móvil grande: mostrar hamburguesa y colapsar nav */
@media (max-width: 991px) {
    .shark-header__toggle {
        display: inline-flex;
    }

    .shark-header__nav-wrap {
        position: fixed;
        top: 0;
        right: 0;
        height: 100vh;
        height: 100dvh;
        width: min(320px, 88vw);
        padding: 5.5rem 1.25rem 1.5rem;
        flex-direction: column;
        align-items: stretch;
        justify-content: flex-start;
        gap: 1rem;
        background:
            linear-gradient(180deg, var(--shark-c-dark-bg) 0%, var(--shark-c-dark-bg-2) 100%);
        border-left: 1px solid var(--shark-c-dark-border);
        box-shadow: -20px 0 60px -20px rgba(7, 26, 46, 0.9);
        transform: translateX(105%);
        transition: transform .3s cubic-bezier(.2,.8,.2,1);
        z-index: 99;
        overflow-y: auto;
    }

    .shark-header__nav-wrap.is-open {
        transform: translateX(0);
    }

    .shark-nav--primary {
        display: block;
        width: 100%;
    }

    .shark-menu--primary {
        flex-direction: column;
        align-items: stretch;
        gap: 0.25rem;
    }

    .shark-menu-link {
        width: 100%;
        padding: 0.8rem 1rem;
        font-size: 1rem;
        border-radius: var(--shark-radius-md);
    }

    .shark-menu-item.is-active > .shark-menu-link::after {
        left: 1rem;
        right: auto;
        bottom: 0.5rem;
        width: 32px;
    }

    .shark-menu-caret {
        margin-left: auto;
    }

    .shark-menu-item--has-children > .shark-menu-link {
        cursor: pointer;
    }

    /* Submenús móvil: acordeón inline */
    .shark-submenu {
        position: static;
        min-width: 0;
        margin: 0.25rem 0 0.5rem 0.75rem;
        padding: 0.25rem 0.25rem 0.25rem 0.5rem;
        border-left: 2px solid var(--shark-c-dark-border);
        border-top: none;
        border-right: none;
        border-bottom: none;
        border-radius: 0;
        background: rgba(255, 255, 255, 0.02);
        box-shadow: none;
        opacity: 1;
        visibility: visible;
        transform: none;
        display: none;
    }

    .shark-menu-item--has-children.is-open > .shark-submenu {
        display: block;
    }

    .shark-menu-item--has-children > .shark-menu-link .shark-menu-caret {
        transition: transform .2s ease;
    }

    .shark-menu-item--has-children.is-open > .shark-menu-link .shark-menu-caret {
        transform: translateY(1px) rotate(180deg);
        opacity: 1;
    }

    .shark-header__cta {
        width: 100%;
        margin-top: 0.5rem;
        padding-top: 1rem;
        border-top: 1px solid var(--shark-c-dark-border);
    }

    .shark-header__cta .shark-btn--gold {
        width: 100%;
        justify-content: center;
        padding: 0.9rem 1.25rem;
    }

    /* Backdrop móvil */
    .shark-header__backdrop {
        position: fixed;
        inset: 0;
        background: rgba(3, 7, 18, 0.6);
        opacity: 0;
        visibility: hidden;
        transition: opacity .25s ease, visibility .25s ease;
        z-index: 98;
    }

    .shark-header__backdrop.is-visible {
        opacity: 1;
        visibility: visible;
    }
}

/* Móvil pequeño */
@media (max-width: 480px) {
    .shark-site-branding .custom-logo {
        max-width: 170px;
        height: 40px;
    }

    .shark-site-header.is-scrolled .shark-site-branding .custom-logo {
        height: 36px;
    }

    .shark-header__inner {
        padding: 0.8rem var(--shark-px);
        gap: 0.75rem;
    }

    .shark-header__nav-wrap {
        padding-top: 4.75rem;
    }
}

/* ============================================
   12. RESPONSIVE — Breakpoints generales + reset
   ============================================ */
@media (max-width: 768px) {
    :root { --shark-py: 3rem; }
    .shark-hero__inner { padding: 4rem var(--shark-px) 3.5rem; }
    .shark-hero__cta-row .shark-btn { width: 100%; flex: 1 1 100%; }
    .shark-cta { margin-top: 3.5rem; }
    .shark-cta__inner { padding: 2.8rem 1rem; }
}

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

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

body {
    margin: 0;
    overflow-x: hidden;
}

.shark-mensaje-en-construccion {
    max-width: var(--shark-rw);
    margin: 3rem auto;
    padding: 2rem;
    border-left: 6px solid var(--shark-c-gold);
    background-color: var(--shark-c-bg-alt);
    border: 1px solid var(--shark-c-border);
    border-left: 6px solid var(--shark-c-gold);
    border-radius: var(--shark-radius-md);
    color: var(--shark-c-text);
    box-shadow: var(--shark-shadow-md);
}

.shark-mensaje-en-construccion h1 {
    margin-top: 0;
    color: var(--shark-c-gold);
}

/* ============================================
   8. SECCIÓN GLOBAL · CONTACTO (Mapa + Datos + CTA WhatsApp)
      Se carga desde footer.php → APARECE EN TODAS LAS PÁGINAS
   ============================================ */
.shark-contactglobal {
    background-color: #000000;
    position: relative;
    overflow: hidden;
}

.shark-contactglobal::before {
    content: "";
    position: absolute;
    inset: 0;
    pointer-events: none;
    background:
        radial-gradient(1000px 600px at 10% 50%, rgba(15, 76, 129, 0.22), transparent 65%),
        radial-gradient(1000px 600px at 90% 50%, rgba(31, 164, 197, 0.15), transparent 65%);
}

.shark-contactglobal__inner {
    position: relative;
    z-index: 1;
    max-width: 1320px;
    margin: 0 auto;
    padding: 5rem var(--shark-px) 5.5rem;
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1.08fr);
    gap: 4rem 4.5rem;
    align-items: stretch;
}

/* ----- Columna IZQUIERDA: Mapa ----- */
.shark-contactglobal__mapwrap {
    position: relative;
    width: 100%;
    max-width: 640px;
    aspect-ratio: 4 / 3;
    border-radius: var(--shark-radius-lg);
    overflow: hidden;
    background: var(--shark-c-bg-alt);
    padding: 3px;
    box-shadow:
        0 0 70px -15px rgba(245, 197, 24, 0.18),
        0 22px 60px -16px rgba(3, 7, 18, 0.95);
}

.shark-contactglobal__mapwrap::before {
    content: "";
    position: absolute;
    inset: 0;
    padding: 3px;
    background: linear-gradient(135deg,
        rgba(245, 197, 24, 0.95) 0%,
        rgba(15, 76, 129, 0.8) 50%,
        rgba(31, 164, 197, 0.75) 100%);
    -webkit-mask:
        linear-gradient(#000 0 0) content-box,
        linear-gradient(#000 0 0);
    -webkit-mask-composite: xor;
            mask-composite: exclude;
    z-index: 1;
    pointer-events: none;
    border-radius: var(--shark-radius-lg);
    opacity: 0.95;
}

.shark-contactglobal__iframe {
    width: 100% !important;
    height: 100% !important;
    display: block;
    border: 0;
    border-radius: calc(var(--shark-radius-lg) - 3px);
    background: #e9ecef;
    position: relative;
    z-index: 0;
}

/* ----- Columna DERECHA: Datos contacto ----- */
.shark-contactglobal__data {
    width: 100%;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: flex-start;
    gap: 1.75rem;
    padding-top: 0.5rem;
}

.shark-contactglobal__title.visually-hidden {
    position: absolute !important;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border: 0;
}

.shark-contactglobal__group {
    width: 100%;
    max-width: 760px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: flex-start;
    gap: 0.75rem;
}

.shark-contactglobal__label {
    margin: 0;
    padding: 0;
    width: 100%;
    text-align: center;
    font-size: clamp(0.98rem, 0.5vw + 0.9rem, 1.18rem);
    line-height: 1.5;
    font-weight: 700;
    letter-spacing: 0.04em;
    color: #f1f5f9;
    text-shadow: 0 3px 10px rgba(3, 7, 18, 0.8);
}

.shark-contactglobal__label--alt {
    margin-top: 0.75rem;
}

/* Email principal (resaltado) */
.shark-contactglobal__email {
    display: inline-block;
    margin: 0;
    padding: 0;
    font-size: clamp(1rem, 0.75vw + 0.9rem, 1.2rem);
    line-height: 1.55;
    color: #ffffff;                    /* ← correos alternos: BLANCO por defecto */
    text-decoration: underline;
    text-decoration-thickness: 1px;
    text-decoration-color: rgba(255, 255, 255, 0.35);
    text-underline-offset: 3px;
    font-weight: 500;
    transition: color .18s ease, filter .18s ease, transform .18s ease, text-decoration-color .18s ease;
}

.shark-contactglobal__email:hover,
.shark-contactglobal__email:focus {
    color: var(--shark-c-gold);       /* ← MANTENIDO: hover dorado */
    filter: saturate(1.1);
    text-decoration-color: var(--shark-c-gold);
}

.shark-contactglobal__email--primary {
    font-size: clamp(1.12rem, 0.8vw + 1rem, 1.45rem);
    font-weight: 700;
    line-height: 1.4;
    letter-spacing: 0.005em;
    padding: 0.85rem 1.75rem;
    border-radius: var(--shark-radius-md);
    background: linear-gradient(180deg,
        rgba(250, 215, 79, 0.20) 0%,
        rgba(245, 197, 24, 0.12) 45%,
        rgba(225, 176, 18, 0.18) 100%);
    border: 1px solid rgba(245, 197, 24, 0.60);
    text-decoration: none;
    box-shadow:
        0 0 44px -10px rgba(245, 197, 24, 0.38),
        0 1px 0 rgba(255, 255, 255, 0.22) inset,
        0 -1px 0 rgba(176, 123, 4, 0.45) inset,
        0 12px 30px -12px rgba(3, 7, 18, 0.9);
    color: #f9cd33;                      /* ← TEXTO DORADO por defecto para resaltar */
    text-shadow:
        0 0 10px rgba(245, 197, 24, 0.35),
        0 2px 6px rgba(0, 0, 0, 0.45);
    transition: color .18s ease, background .18s ease, border-color .18s ease,
                transform .18s ease, box-shadow .18s ease, text-shadow .18s ease;
}

.shark-contactglobal__email--primary:hover,
.shark-contactglobal__email--primary:focus {
    color: #ffe36b;                      /* ← HOVER: dorado MÁS CLARO (más brillo + halo) */
    background: linear-gradient(180deg,
        rgba(255, 226, 103, 0.32) 0%,
        rgba(249, 205, 51, 0.18) 50%,
        rgba(238, 189, 26, 0.26) 100%);
    border-color: rgba(253, 224, 71, 0.80);
    transform: translateY(-1.5px);
    text-shadow:
        0 0 18px rgba(255, 216, 88, 0.55),
        0 0 8px rgba(255, 231, 148, 0.45),
        0 2px 6px rgba(0, 0, 0, 0.35);
    box-shadow:
        0 0 68px -8px rgba(245, 197, 24, 0.55),
        0 0 24px -4px rgba(255, 226, 103, 0.45),
        0 1px 0 rgba(255, 255, 255, 0.32) inset,
        0 -1px 0 rgba(176, 123, 4, 0.45) inset,
        0 16px 36px -12px rgba(3, 7, 18, 0.95);
    text-decoration: none;
    outline: none;
}

/* Lista de correos alternos */
.shark-contactglobal__emaillist {
    list-style: none;
    margin: 0;
    padding: 0;
    width: 100%;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: flex-start;
    gap: 0.55rem;
}

.shark-contactglobal__emaillist li {
    margin: 0;
    padding: 0;
    width: 100%;
    text-align: center;
}

/* Grupo CTA (texto + botón ESCRIBENOS!) */
.shark-contactglobal__group--cta {
    gap: 1.35rem;
    margin-top: 0.25rem;
}

.shark-contactglobal__cta-text {
    margin: 0;
    padding: 0;
    width: 100%;
    max-width: 760px;
    text-align: center;
    font-size: clamp(1rem, 0.7vw + 0.9rem, 1.25rem);
    line-height: 1.75;
    font-weight: 700;
    letter-spacing: 0.025em;
    color: #e2e8f0;
    text-shadow: 0 4px 14px rgba(3, 7, 18, 0.85);
}

.shark-contactglobal__cta-text .shark-contactglobal__br {
    display: block;
}

/* Botón ESCRIBENOS! dorado */
.shark-btn--gold-contact {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: min(880px, 100%);
    padding: 0.95rem 2.75rem;
    font-size: clamp(0.98rem, 0.75vw + 0.85rem, 1.18rem);
    font-weight: 900;
    letter-spacing: 0.07em;
    text-transform: uppercase;
    color: #030712;
    background: linear-gradient(180deg, #d4a90c 0%, #b8890f 100%);
    border: 1px solid #a88206;
    border-radius: 8px;
    box-shadow:
        0 14px 36px -12px rgba(212, 169, 12, 0.65),
        inset 0 1px 0 rgba(255, 255, 255, 0.32);
    text-decoration: none;
    cursor: pointer;
    transition: transform .2s ease, box-shadow .2s ease, filter .2s ease, background .2s ease;
    line-height: 1.2;
    text-align: center;
    font-family: var(--shark-font);
}

.shark-btn--gold-contact:hover,
.shark-btn--gold-contact:focus {
    background: linear-gradient(180deg, #e2b711 0%, #c49a1c 100%);
    transform: translateY(-1.8px);
    filter: saturate(1.15);
    box-shadow:
        0 20px 46px -12px rgba(226, 183, 17, 0.78),
        inset 0 1px 0 rgba(255, 255, 255, 0.38);
    color: #030712;
    text-decoration: none;
    outline: none;
}

.shark-btn--gold-contact:active {
    transform: translateY(0);
    box-shadow:
        0 8px 20px -6px rgba(184, 137, 15, 0.55),
        inset 0 1px 0 rgba(255, 255, 255, 0.22);
}

/* Responsive CONTACTO GLOBAL */
@media (max-width: 1199px) {
    .shark-contactglobal__inner {
        max-width: 1120px;
        grid-template-columns: minmax(0, 1fr) minmax(0, 1.08fr);
        gap: 3rem 3.5rem;
        padding: 4.5rem var(--shark-px) 5rem;
    }

    .shark-contactglobal__mapwrap {
        max-width: 100%;
    }
}

@media (max-width: 991px) {
    .shark-contactglobal__inner {
        max-width: 880px;
        grid-template-columns: 1fr;
        gap: 3rem;
        padding: 4rem var(--shark-px) 4.5rem;
    }

    .shark-contactglobal__mapwrap {
        max-width: 720px;
        margin: 0 auto;
    }

    .shark-contactglobal__data {
        gap: 1.5rem;
        padding-top: 0;
    }
}

@media (max-width: 767px) {
    .shark-contactglobal__inner {
        max-width: 640px;
        padding: 3.25rem var(--shark-px) 3.75rem;
        gap: 2.5rem;
    }

    .shark-contactglobal__mapwrap {
        max-width: 100%;
        aspect-ratio: 16 / 10;
    }

    .shark-contactglobal__group {
        gap: 0.65rem;
    }

    .shark-contactglobal__group--cta {
        gap: 1.2rem;
    }

    .shark-contactglobal__email--primary {
        padding: 0.75rem 1.25rem;
        width: 100%;
        text-align: center;
        font-size: 1.08rem;
    }

    .shark-btn--gold-contact {
        width: 100%;
        padding: 0.88rem 1.75rem;
    }
}

@media (max-width: 480px) {
    .shark-contactglobal__inner {
        padding: 2.5rem var(--shark-px) 3rem;
        gap: 2rem;
    }

    .shark-contactglobal__mapwrap {
        aspect-ratio: 4 / 3;
        border-radius: var(--shark-radius-md);
    }

    .shark-contactglobal__data {
        gap: 1.25rem;
    }

    .shark-contactglobal__label {
        font-size: 0.95rem;
        letter-spacing: 0.03em;
    }

    .shark-contactglobal__email {
        font-size: 0.98rem;
        word-break: break-word;
    }

    .shark-contactglobal__email--primary {
        padding: 0.7rem 1rem;
        font-size: 1rem;
    }

    .shark-contactglobal__cta-text {
        font-size: 1rem;
        line-height: 1.6;
    }

    .shark-btn--gold-contact {
        padding: 0.82rem 1.25rem;
        font-size: 1rem;
        letter-spacing: 0.05em;
    }
}

/* ==========================================================
   15. PÁGINA INTERNA · FERIA DE EMPRENDEDORES
       [1] Hero 100vh parallax scroll + [2] Grid 6 cards
   ========================================================== */

.shark-internal {
    width: 100%;
    overflow: hidden;
    background: var(--shark-c-bg);
}

/* ---------- [1] Hero interno 100vh (Parallax) ---------- */
.shark-page-hero {
    position: relative;
    width: 100%;
    min-height: 100vh;
    min-height: 100dvh;
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
    isolation: isolate;
    color: var(--shark-c-white);
    text-align: center;
    background-color: var(--shark-c-dark-bg-2);
}

.shark-page-hero__bg {
    position: absolute;
    top: -8%;
    left: 0;
    right: 0;
    height: 116%;
    background-position: center center;
    background-repeat: no-repeat;
    background-size: cover;
    will-change: transform;
    z-index: -1;
}

.shark-page-hero[data-shark-parallax-image] .shark-page-hero__bg {
    background-image: attr(data-shark-parallax-image url);
}

/* ---------- Variante: HERO SOLO IMAGEN (sin overlay, sin textos, SIN parallax) ---------- */
.shark-page-hero--imageonly {
    position: relative;
    background-color: #04101f;
    min-height: 100vh;
    min-height: 100dvh;
    padding: 0 !important;
    width: 100%;
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center center;   /* ← Centrado EXACTO vertical y horizontal */
    background-position-x: 50%;
    background-position-y: 50%;
    background-attachment: scroll;
    overflow: hidden;
}

.shark-page-hero--imageonly .shark-page-hero__bg {
    display: none;
}

.shark-page-hero--imageonly + * {
    position: relative;
    z-index: 1;
    isolation: isolate;
    background: var(--shark-c-bg);
}

/* ---------- Variante ESPECIAL solo página CAPACITACIONES: Hero 75% alto pantalla ---------- */
.shark-page-hero--capacitaciones-75 {
    min-height: 75vh;
    min-height: 75dvh;
}

.shark-page-hero__overlay { display: none; }
.shark-page-hero__inner { display: none; }
.shark-page-hero__scrolldown { display: none; }

/* ---------- [2] Grid 6 Cards Feria ---------- */
.shark-feria-cards {
    position: relative;
    padding: clamp(4rem, 8vw, 6.5rem) 0;
    background:
        radial-gradient(900px 420px at 10% 10%, rgba(31, 164, 197, 0.10), transparent 60%),
        radial-gradient(800px 420px at 90% 80%, rgba(12, 53, 88, 0.45), transparent 60%),
        var(--shark-c-bg);
    overflow: hidden;
}

/* Variante Feria: Fondo NEGRO PURO y SIN título de sección */
.shark-feria-cards--nobg {
    background: #000000;
    padding-top: clamp(3.5rem, 7vw, 5.5rem);
    padding-bottom: clamp(3.5rem, 7vw, 5.5rem);
}

.shark-feria-cards--nobg .shark-feria-cards__header { display: none; }

/* Todo el main interno de feria también negro para quede uniforme de punta a punta */
.shark-internal--feria {
    background: #000000;
}

/* --------------- Variante Categorías internas (Salud y Belleza, Moda...) --------------- */
.shark-internal--categoria {
    background: #000000;
}

/* Grid con 1 SOLA columna centrada (no afecta a feria 3 cols) */
.shark-categoria-cards--1cols .shark-feria-cards__grid {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    max-width: 30rem;
    margin-left: auto;
    margin-right: auto;
    gap: 1.25rem;
}

/* Grid con 2 COLUMNAS (Inscríbete / Plan Embajador / Capacitaciones) */
.shark-categoria-cards--2cols .shark-feria-cards__grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    max-width: 62rem;
    margin-left: auto;
    margin-right: auto;
    gap: 1.75rem;
}

@media (max-width: 991px) {
    .shark-categoria-cards--2cols .shark-feria-cards__grid {
        gap: 1.25rem;
    }
}
@media (max-width: 560px) {
    .shark-categoria-cards--2cols .shark-feria-cards__grid {
        grid-template-columns: 1fr;
    }
}

/* ---------- Variante ESPECIAL solo página INSCRIBETE: Cards más ANCHAS y BAJAS (rectangulares) ---------- */
.shark-inscribete-cards .shark-feria-cards__grid {
    max-width: 86rem;
    margin-left: auto;
    margin-right: auto;
    gap: 2rem;
}

@media (max-width: 1199px) {
    .shark-inscribete-cards .shark-feria-cards__grid {
        max-width: 78rem;
        gap: 1.75rem;
    }
}

@media (max-width: 991px) {
    .shark-inscribete-cards .shark-feria-cards__grid {
        max-width: 62rem;
        gap: 1.5rem;
    }
}

@media (max-width: 560px) {
    .shark-inscribete-cards .shark-feria-cards__grid {
        max-width: 100%;
        gap: 1.25rem;
    }
}

/* ---------- Variante INSCRIBETE CTA ajustada: menos padding inferior + cards padding superior reducido ---------- */
.shark-cta-solo--inscribete-tight {
    padding-top: clamp(1.75rem, 3.5vw, 3rem);
    padding-bottom: clamp(0.5rem, 1.25vw, 1.25rem);
}

.shark-inscribete-cards {
    padding-top: clamp(1rem, 2vw, 2rem) !important;
}

/* ---------- Variante CAPACITACIONES CTA ajustada: MENOS SEPARACIÓN entre botón y footer (mismo fondo) ---------- */
.shark-cta-solo--capacitaciones-tight {
    padding-top: clamp(1.75rem, 3.5vw, 3rem);
    padding-bottom: clamp(0.25rem, 0.75vw, 0.75rem);
}

/* ---------- Variante PROGRAMA EMBAJADOR: SEPARACIÓN MÁXIMA 30px entre botones ↔ cards ---------- */
.shark-programaembajador-cta {
    padding-top: 0.9375rem;
    padding-bottom: 0.0625rem;
}

.shark-programaembajador-cards {
    padding-top: 0.9375rem !important;
    padding-bottom: 0.0625rem !important;
}

/* ---------- Página QUIENES SOMOS: texto institucional + galería + banner ---------- */
.shark-quienes-text {
    position: relative;
    width: 100%;
    background: #000000;
    padding: clamp(2.25rem, 6vw, 4rem) 0 clamp(1rem, 2vw, 1.75rem);
    isolation: isolate;
    z-index: 1;
}

.shark-quienes-text__inner {
    width: 100%;
    max-width: 66rem;
    margin: 0 auto;
    padding: 0 var(--shark-px);
    display: flex;
    flex-direction: column;
    gap: clamp(1.5rem, 3.5vw, 2.5rem);
}

.shark-quienes-text__lead {
    margin: 0;
    font-size: clamp(1rem, 1.35vw, 1.2rem);
    line-height: 1.8;
    color: rgba(230, 240, 252, 0.92);
    font-weight: 400;
    letter-spacing: 0.01em;
    text-align: justify;
    hyphens: auto;
}

.shark-quienes-text__quote {
    margin: 0;
    padding: 1.5rem 2rem;
    font-size: clamp(1.15rem, 1.9vw, 1.65rem);
    line-height: 1.5;
    font-weight: 800;
    text-align: center;
    color: var(--shark-c-gold, #f9cd33);
    text-shadow: 0 1px 0 rgba(0,0,0,.6), 0 0 18px rgba(245,197,24,.2);
    border-top: 1px solid rgba(245,197,24,.25);
    border-bottom: 1px solid rgba(245,197,24,.25);
    background:
        radial-gradient(400px 180px at 50% 50%, rgba(245,197,24,.08), transparent 70%);
    border-radius: var(--shark-radius-md);
    position: relative;
}

.shark-quienes-text__quote-mark {
    opacity: .55;
    font-size: 1.25em;
    padding: 0 0.25em;
    vertical-align: -0.08em;
}

/* 2 columnas imágenes */
.shark-quienes-gallery {
    position: relative;
    width: 100%;
    background: #000000;
    padding: clamp(1.75rem, 5vw, 3.25rem) 0 clamp(0.5rem, 1.25vw, 1rem);
}

.shark-quienes-gallery__inner {
    width: 100%;
    max-width: 86rem;
    margin: 0 auto;
    padding: 0 var(--shark-px);
}

.shark-quienes-gallery__grid {
    list-style: none;
    padding: 0;
    margin: 0;
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: clamp(1.25rem, 3vw, 2.25rem);
}

.shark-quienes-gallery__item {
    background-color: #04101f;
    border: 1px solid rgba(245,197,24,.18);
    border-radius: var(--shark-radius-lg);
    box-shadow: 0 18px 44px -22px rgba(3,7,18,.85), 0 0 0 1px rgba(255,255,255,.02) inset;
    overflow: hidden;
    display: flex;
    align-items: center;
    justify-content: center;
    aspect-ratio: 4 / 3;
    transition: transform .3s ease, border-color .3s ease, box-shadow .3s ease;
}

.shark-quienes-gallery__item:hover,
.shark-quienes-gallery__item:focus-within {
    transform: translateY(-4px);
    border-color: rgba(245,197,24,.45);
    box-shadow:
        0 28px 60px -26px rgba(3,7,18,.9),
        0 0 0 1px rgba(245,197,24,.35),
        0 0 30px -6px rgba(245,197,24,.25);
}

.shark-quienes-gallery__item img {
    width: 100%;
    height: 100%;
    object-fit: contain;
    object-position: center center;
    display: block;
    background-color: #04101f;
}

@media (max-width: 768px) {
    .shark-quienes-gallery__grid {
        grid-template-columns: 1fr;
        gap: 1.25rem;
    }
    .shark-quienes-text__lead {
        text-align: left;
    }
}

/* Imagen GRANDE banner */
.shark-quienes-bigimg {
    position: relative;
    width: 100%;
    background: #000000;
    padding: clamp(1.75rem, 5vw, 3.25rem) 0 clamp(0.5rem, 1.25vw, 1rem);
}

.shark-quienes-bigimg__inner {
    width: 100%;
    max-width: 92rem;
    margin: 0 auto;
    padding: 0 var(--shark-px);
}

.shark-quienes-bigimg__inner img {
    display: block;
    width: 100%;
    height: auto;
    max-height: 80vh;
    object-fit: contain;
    background: #04101f;
    border: 1px solid rgba(245,197,24,.2);
    border-radius: var(--shark-radius-lg);
    box-shadow: 0 28px 64px -26px rgba(3,7,18,.95);
}

/* ---------- Página SAVIGEL: 4 cards producto horizontal con fondo ---------- */
.shark-savigel-products {
    position: relative;
    width: 100%;
    background-color: #000000;
    background-repeat: no-repeat;
    background-position: center center;
    background-size: cover;
    background-attachment: fixed;
    padding: clamp(2.25rem, 6vw, 4.25rem) 0;
    isolation: isolate;
}

.shark-savigel-products__overlay {
    position: absolute;
    inset: 0;
    pointer-events: none;
    background:
        linear-gradient(
            180deg,
            rgba(9, 31, 64, 0.74) 0%,
            rgba(20, 66, 128, 0.58) 35%,
            rgba(17, 56, 110, 0.64) 65%,
            rgba(9, 31, 64, 0.78) 100%
        ),
        radial-gradient(
            1400px 800px at 50% 0%,
            rgba(90, 170, 248, 0.22) 0%,
            rgba(40, 110, 200, 0.10) 45%,
            transparent 78%
        );
    z-index: 1;
}

.shark-savigel-products__inner {
    position: relative;
    z-index: 2;
    width: 100%;
    max-width: 96rem;
    margin: 0 auto;
    padding: 0 var(--shark-px);
    display: flex;
    flex-direction: column;
    gap: clamp(1.75rem, 4vw, 3.5rem);
}

/* 1 card: 2 columnas horizontales (media | content) */
.shark-savigel-card {
    background: rgba(12, 40, 82, 0.88);
    border: 1px solid rgba(130, 196, 255, 0.26);
    border-radius: var(--shark-radius-2xl);
    box-shadow:
        0 36px 70px -40px rgba(0, 18, 55, 0.92),
        0 0 0 1px rgba(190, 226, 255, 0.045) inset,
        0 1px 0 rgba(220, 240, 255, 0.11) inset,
        0 -1px 0 rgba(5, 16, 38, 0.72) inset,
        0 0 70px -26px rgba(90, 170, 248, 0.22);
    padding: clamp(1rem, 2.5vw, 2rem);
    display: grid;
    grid-template-columns: minmax(0, 30rem) minmax(0, 1fr);
    gap: clamp(1.5rem, 3.5vw, 3rem);
    align-items: start;
    transition: transform .35s ease, border-color .35s ease, box-shadow .35s ease, background-color .35s ease;
}

.shark-savigel-card:hover {
    transform: translateY(-3px);
    background-color: rgba(20, 62, 122, 0.92);
    border-color: rgba(160, 215, 255, 0.52);
    box-shadow:
        0 48px 80px -40px rgba(0, 14, 46, 0.97),
        0 0 0 1px rgba(160, 215, 255, 0.44),
        0 0 90px -16px rgba(90, 180, 255, 0.32);
}

/* Columna IZQ: foto + botón debajo */
.shark-savigel-card__media {
    display: flex;
    flex-direction: column;
    gap: 1rem;
    align-items: center;
    justify-content: flex-start;
}

.shark-savigel-card__media img {
    width: 100%;
    aspect-ratio: 1 / 1;
    object-fit: contain;
    object-position: center center;
    background-color: rgba(8, 24, 52, 0.92);
    border: 1px solid rgba(130, 196, 255, 0.26);
    border-radius: var(--shark-radius-xl);
    box-shadow: 0 24px 50px -30px rgba(0, 14, 40, 0.94);
    display: block;
}

.shark-savigel-card__btn {
    width: 100%;
}

/* Columna DER: texto / títulos / bullets */
.shark-savigel-card__content {
    display: flex;
    flex-direction: column;
    gap: 1rem;
    color: rgba(236, 246, 255, 0.95);
}

.shark-savigel-card__title {
    margin: 0;
    font-size: clamp(1.1rem, 1.9vw, 1.6rem);
    line-height: 1.3;
    font-weight: 800;
    color: var(--shark-c-gold, #f9cd33);
    letter-spacing: -0.01em;
    text-shadow: 0 1px 0 rgba(0,0,0,.6);
}

.shark-savigel-card__lead {
    margin: 0;
    font-size: clamp(0.95rem, 1.1vw, 1.05rem);
    line-height: 1.75;
    color: rgba(240, 249, 255, 0.90);
    text-align: justify;
    hyphens: auto;
}

.shark-savigel-card__subblock {
    margin-top: 0.25rem;
    display: flex;
    flex-direction: column;
    gap: 0.6rem;
}

.shark-savigel-card__subtitle {
    margin: 0;
    font-size: clamp(0.95rem, 1.2vw, 1.1rem);
    font-weight: 700;
    color: rgba(255, 244, 200, 0.97);
    letter-spacing: 0.005em;
}

.shark-savigel-card__list {
    margin: 0;
    padding: 0;
    list-style: none;
    display: flex;
    flex-direction: column;
    gap: 0.4rem;
}

.shark-savigel-card__list li {
    font-size: clamp(0.9rem, 1.05vw, 1rem);
    line-height: 1.6;
    padding: 0.55rem 0.95rem;
    background: rgba(90, 170, 248, 0.11);
    border-left: 3px solid rgba(140, 200, 255, 0.70);
    border-radius: 0 var(--shark-radius-md) var(--shark-radius-md) 0;
    color: rgba(242, 250, 255, 0.94);
}

.shark-savigel-card__note {
    margin: 0;
    font-size: clamp(0.9rem, 1.05vw, 1rem);
    line-height: 1.6;
    color: rgba(228, 242, 255, 0.89);
    font-style: italic;
    padding-left: 0.25rem;
}

.shark-savigel-card__price {
    margin-top: 0.5rem;
    align-self: flex-start;
    padding: 1.1rem 1.75rem;
    font-size: clamp(1.15rem, 1.65vw, 1.5rem);
    font-weight: 900;
    letter-spacing: 0.01em;
    color: var(--shark-c-gold, #f9cd33);
    text-shadow:
        0 1px 0 rgba(0,0,0,.65),
        0 0 22px rgba(245,197,24,.35),
        0 0 4px rgba(255,230,120,.55);
    background-color: rgba(8, 26, 58, 0.78);
    background-image:
        radial-gradient(420px 140px at 50% 50%, rgba(90, 170, 248, 0.18), transparent 70%);
    border-top: 1px solid rgba(140, 200, 255, 0.34);
    border-bottom: 1px solid rgba(140, 200, 255, 0.34);
    border-left: 3px solid rgba(180, 222, 255, 0.62);
    border-right: 0;
    border-radius: 0 var(--shark-radius-lg) var(--shark-radius-lg) 0;
    box-shadow:
        0 12px 26px -14px rgba(0, 10, 30, 0.9),
        0 1px 0 rgba(206, 234, 255, 0.07) inset;
}

/* RESPONSIVE: móvil + tablet <991px → apilar verticalmente */
@media (max-width: 991px) {
    .shark-savigel-products {
        background-attachment: scroll;
    }
    .shark-savigel-card {
        grid-template-columns: 1fr;
        gap: 1.75rem;
        padding: 1.25rem;
    }
    .shark-savigel-card__media {
        max-width: 32rem;
        margin: 0 auto;
        width: 100%;
    }
    .shark-savigel-card__lead {
        text-align: left;
    }
}

@media (prefers-reduced-motion: reduce) {
    .shark-savigel-card,
    .shark-savigel-card:hover {
        transform: none;
        transition: none;
    }
    .shark-savigel-products {
        background-attachment: scroll;
    }
}

/* ---------- Variante ESPECIAL solo página PLAN EMBAJADOR: cards VERTICALES 3:4 + imagen COMPLETA sin recorte ---------- */
.shark-programaembajador-cards .shark-feria-card__media {
    aspect-ratio: 3 / 4;
    background-color: #04101f;
}

.shark-programaembajador-cards .shark-feria-card__media img {
    object-fit: contain;
    object-position: center center;
    background-color: #04101f;
}

.shark-programaembajador-cards .shark-feria-card__wrap:hover .shark-feria-card__media img,
.shark-programaembajador-cards .shark-feria-card__wrap:focus-within .shark-feria-card__media img {
    transform: scale(1.025);
}

.shark-feria-card__wrap--nocta {
    gap: 0 !important;
    padding-bottom: 1rem;
}

.shark-feria-card__wrap--nocta .shark-feria-card__cta {
    display: none;
}

.shark-inscribete-cards .shark-feria-card__media {
    aspect-ratio: 16 / 9;
}

@media (max-width: 991px) {
    .shark-inscribete-cards .shark-feria-card__media {
        aspect-ratio: 4 / 3;
    }
}

@media (max-width: 560px) {
    .shark-inscribete-cards .shark-feria-card__media {
        aspect-ratio: 16 / 9;
    }
}

/* --------------- Variante Landing simple (Gastronomia): HERO + SECCIÓN APARTE CTA --------------- */
.shark-internal--landing {
    background: #000000;
}

/* Hero SOLO IMAGEN de la variante Gastronomía usa ya .shark-page-hero--imageonly */

/* Sección aparte: botón solo, debajo del hero, antes del footer */
.shark-cta-solo {
    position: relative;
    width: 100%;
    background: #000000;
    padding: clamp(2.5rem, 6vw, 4.5rem) 0 clamp(3.5rem, 7vw, 6rem);
    isolation: isolate;
    z-index: 1;
}

.shark-cta-solo__inner {
    width: 100%;
    max-width: var(--shark-rw);
    margin: 0 auto;
    padding: 0 var(--shark-px);
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 1rem;
}

.shark-btn--hero-gold,
.shark-btn--hero-gold:link,
.shark-btn--hero-gold:visited,
.shark-btn--hero-gold:hover,
.shark-btn--hero-gold:focus,
.shark-btn--hero-gold:focus-visible,
.shark-btn--hero-gold:active,
.shark-btn--hero-gold .shark-btn__label {
    color: #041020 !important;
}

.shark-btn--hero-gold {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: min(40rem, 92%);
    max-width: 100%;
    min-height: 68px;
    padding: 1rem 2.5rem;
    font-size: clamp(0.95rem, 1.4vw, 1.1rem);
    font-weight: 900;
    letter-spacing: 0.22em;
    text-transform: uppercase;
    text-align: center;
    line-height: 1.15;
    white-space: normal;
    word-break: break-word;
    hyphens: auto;
    color: #041020;
    background: linear-gradient(180deg,
        #fad74f 0%,
        #f5c518 42%,
        #e1b012 100%);
    border: 1px solid rgba(176, 123, 4, 0.50);
    border-radius: 999px;
    box-shadow:
        0 22px 50px -22px rgba(245, 197, 24, 0.95),
        0 18px 44px -28px rgba(255, 199, 0, 0.85),
        0 1px 0 rgba(255, 255, 255, 0.65) inset,
        0 -2px 0 rgba(128, 85, 0, 0.32) inset;
    text-decoration: none;
    cursor: pointer;
    transition:
        transform .3s cubic-bezier(.2,.8,.2,1),
        box-shadow .3s ease,
        background .3s ease,
        filter .3s ease;
    font-family: inherit;
}

/* Hover: sube 4px, se vuelve más claro y con + halo (mismo sistema de contraste AAA) */
.shark-btn--hero-gold:hover,
.shark-btn--hero-gold:focus-visible {
    transform: translateY(-4px);
    background: linear-gradient(180deg,
        #ffe267 0%,
        #f9cd33 42%,
        #eebd1a 100%);
    box-shadow:
        0 32px 64px -24px rgba(245, 197, 24, 0.98),
        0 26px 58px -36px rgba(255, 216, 88, 0.92),
        0 1px 0 rgba(255, 255, 255, 0.70) inset,
        0 -2px 0 rgba(128, 85, 0, 0.32) inset;
    outline: none;
}

.shark-btn--hero-gold:focus-visible {
    outline: 2px solid #f5c518;
    outline-offset: 5px;
}

.shark-btn--hero-gold:active {
    transform: translateY(0) scale(0.995);
    background: linear-gradient(180deg,
        #e7bf19 0%,
        #d4a910 50%,
        #b9920a 100%);
    filter: saturate(0.98);
    box-shadow:
        0 12px 28px -18px rgba(245, 197, 24, 0.60),
        0 1px 0 rgba(255, 255, 255, 0.40) inset,
        0 -1px 0 rgba(128, 85, 0, 0.32) inset;
}

/* Estado botón placeholder disabled (sin URL) */
.shark-btn--hero-gold[disabled],
.shark-btn--hero-gold[aria-disabled="true"] {
    opacity: 1;
    cursor: not-allowed;
    background: linear-gradient(180deg,
        #fad74f 0%,
        #f5c518 42%,
        #e1b012 100%);
    box-shadow:
        0 20px 44px -22px rgba(245, 197, 24, 0.85),
        0 1px 0 rgba(255, 255, 255, 0.65) inset,
        0 -2px 0 rgba(128, 85, 0, 0.32) inset;
}

.shark-btn--hero-gold[disabled]:hover,
.shark-btn--hero-gold[aria-disabled="true"]:hover,
.shark-btn--hero-gold[disabled]:active,
.shark-btn--hero-gold[aria-disabled="true"]:active {
    transform: none;
    filter: none;
    background: linear-gradient(180deg,
        #fad74f 0%,
        #f5c518 42%,
        #e1b012 100%);
    box-shadow:
        0 20px 44px -22px rgba(245, 197, 24, 0.85),
        0 1px 0 rgba(255, 255, 255, 0.65) inset,
        0 -2px 0 rgba(128, 85, 0, 0.32) inset;
}

/* Responsive botón Gastronomía */
@media (max-width: 991px) {
    .shark-btn--hero-gold {
        font-size: 0.95rem;
        letter-spacing: 0.20em;
        min-height: 62px;
        padding: 0.9rem 2rem;
    }
}

@media (max-width: 560px) {
    .shark-btn--hero-gold {
        font-size: 0.9rem;
        letter-spacing: 0.18em;
        min-width: 94%;
        min-height: 64px;
        padding: 0.95rem 1.5rem;
    }
}

@media (prefers-reduced-motion: reduce) {
    .shark-btn--hero-gold { transition: none; }
    .shark-btn--hero-gold:hover { transform: none; }
}

/* Compensación admin-bar para hero imageonly es la que ya está definida arriba,
   no necesita ajuste extra para la sección .shark-cta-solo. */

/* Estado DISABLED del botón cuando no hay URL (placeholder) */
.shark-btn--feria-card[disabled],
.shark-btn--feria-card[aria-disabled="true"] {
    opacity: 1;
    cursor: not-allowed;
    background: linear-gradient(180deg,
        #f9cd33 0%,
        #f0be1b 50%,
        #dcae10 100%);
    box-shadow:
        0 12px 26px -14px rgba(245, 197, 24, 0.75),
        0 1px 0 rgba(255, 255, 255, 0.55) inset,
        0 -2px 0 rgba(128, 85, 0, 0.30) inset;
}

.shark-btn--feria-card[disabled]:hover,
.shark-btn--feria-card[aria-disabled="true"]:hover,
.shark-btn--feria-card[disabled]:active,
.shark-btn--feria-card[aria-disabled="true"]:active {
    transform: none;
    background: linear-gradient(180deg,
        #f9cd33 0%,
        #f0be1b 50%,
        #dcae10 100%);
    box-shadow:
        0 12px 26px -14px rgba(245, 197, 24, 0.75),
        0 1px 0 rgba(255, 255, 255, 0.55) inset,
        0 -2px 0 rgba(128, 85, 0, 0.30) inset;
    filter: none;
}

.shark-feria-cards__inner {
    width: min(var(--shark-rw), 100%);
    margin: 0 auto;
    padding: 0 var(--shark-px);
}

.shark-feria-cards__header {
    text-align: center;
    margin: 0 auto 3.5rem;
    max-width: 72ch;
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
    align-items: center;
}

.shark-feria-cards__kicker {
    margin: 0;
    font-size: 0.78rem;
    font-weight: 700;
    letter-spacing: 0.24em;
    text-transform: uppercase;
    color: var(--shark-c-gold);
}

.shark-feria-cards__title {
    margin: 0;
    font-size: clamp(2rem, 4.5vw, 3.2rem);
    font-weight: 900;
    letter-spacing: -0.01em;
    line-height: 1.1;
    color: var(--shark-c-white);
    background: linear-gradient(90deg, var(--shark-c-white) 0%, var(--shark-c-gold) 100%);
    -webkit-background-clip: text;
    background-clip: text;
    color: transparent;
}

.shark-feria-cards__intro {
    margin: 0.25rem 0 0;
    font-size: 1rem;
    line-height: 1.65;
    color: rgba(215, 230, 248, 0.85);
}

.shark-feria-cards__grid {
    list-style: none;
    padding: 0;
    margin: 0;
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 1.75rem;
}

.shark-feria-card {
    animation: shark-feria-card-in 0.65s cubic-bezier(.2,.8,.2,1) both;
    animation-delay: var(--shark-feria-card-delay, 0s);
}

@keyframes shark-feria-card-in {
    from { opacity: 0; transform: translateY(22px); }
    to   { opacity: 1; transform: translateY(0); }
}

@media (prefers-reduced-motion: reduce) {
    .shark-feria-card { animation: none; }
    .shark-page-hero__scrolldown-wheel { animation: none; }
    .shark-page-hero__bg { will-change: auto; }
}

.shark-feria-card__wrap {
    position: relative;
    background: var(--shark-c-dark-bg-2);
    border: 1px solid var(--shark-c-dark-border);
    border-radius: var(--shark-radius-lg);
    overflow: hidden;
    box-shadow: var(--shark-shadow-dark);
    transition: transform .35s cubic-bezier(.2,.8,.2,1), box-shadow .35s ease, border-color .35s ease;
    display: flex;
    flex-direction: column;
    height: 100%;
}

.shark-feria-card__wrap:hover,
.shark-feria-card__wrap:focus-within {
    transform: translateY(-6px);
    box-shadow:
        0 24px 56px -20px rgba(3, 7, 18, 0.70),
        0 0 0 1px rgba(245, 197, 24, 0.35),
        0 14px 34px -18px rgba(245, 197, 24, 0.35);
    border-color: rgba(245, 197, 24, 0.35);
}

.shark-feria-card__media {
    position: relative;
    width: 100%;
    aspect-ratio: 3 / 2;
    overflow: hidden;
    background: #04101f;
}

.shark-feria-card__media::after {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(180deg, transparent 55%, rgba(3, 12, 26, 0.45) 100%);
    pointer-events: none;
}

.shark-feria-card__media img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
    transition: transform .65s cubic-bezier(.2,.8,.2,1), filter .35s ease;
    filter: saturate(1.05);
}

.shark-feria-card__wrap:hover .shark-feria-card__media img,
.shark-feria-card__wrap:focus-within .shark-feria-card__media img {
    transform: scale(1.06);
    filter: saturate(1.15);
}

/* ---------- Variante Card: SOLO IMAGEN + BOTÓN (estilo referencia) ---------- */
.shark-feria-card__wrap--imagebtn {
    display: flex;
    flex-direction: column;
    gap: 1rem;
    padding: 1rem;
    background: linear-gradient(180deg,
        #071931 0%,
        #05142a 55%,
        #041020 100%);
    border: 1px solid rgba(245, 197, 24, 0.22);
    border-radius: 32px;
    box-shadow:
        0 28px 60px -28px rgba(0, 0, 0, 0.78),
        0 0 0 1px rgba(255, 255, 255, 0.02) inset;
    transition: transform .35s cubic-bezier(.2,.8,.2,1), box-shadow .35s ease, border-color .35s ease;
}

.shark-feria-card__wrap--imagebtn:hover,
.shark-feria-card__wrap--imagebtn:focus-within {
    transform: translateY(-6px);
    border-color: rgba(245, 197, 24, 0.55);
    box-shadow:
        0 34px 80px -26px rgba(2, 6, 16, 0.82),
        0 20px 44px -24px rgba(245, 197, 24, 0.35),
        0 0 0 1px rgba(245, 197, 24, 0.22) inset;
}

.shark-feria-card__media--full {
    aspect-ratio: 1 / 1.12;
    width: 100%;
    border-radius: 24px;
    overflow: hidden;
    position: relative;
    background: #030c1a;
    border: 1px solid rgba(245, 197, 24, 0.14);
    box-shadow: 0 10px 24px -14px rgba(0, 0, 0, 0.65);
}

.shark-feria-card__media--full::after { display: none; }

.shark-feria-card__cta {
    padding: 0.1rem 0 0.25rem;
    display: flex;
    align-items: stretch;
    justify-content: stretch;
}

/* Fuerza color de texto NEGRO (#041020) en TODOS los estados del botón feria-card
   para que no se herede el dorado del selector global a:hover,a:focus { color: gold; } */
.shark-btn--feria-card,
.shark-btn--feria-card:link,
.shark-btn--feria-card:visited,
.shark-btn--feria-card:hover,
.shark-btn--feria-card:focus,
.shark-btn--feria-card:focus-visible,
.shark-btn--feria-card:active,
.shark-btn--feria-card .shark-btn__label {
    color: #041020 !important;
}

.shark-btn--feria-card {
    display: flex;
    align-items: center;
    justify-content: center;
    flex: 1 1 auto;
    width: 100%;
    min-height: 56px;
    padding: 0.95rem 1.5rem;
    font-size: 0.95rem;
    font-weight: 900;
    letter-spacing: 0.20em;
    text-transform: uppercase;
    text-align: center;
    line-height: 1.15;
    white-space: normal;
    word-break: break-word;
    hyphens: auto;
    color: #041020;
    background: linear-gradient(180deg,
        #f9cd33 0%,
        #f0be1b 50%,
        #dcae10 100%);
    border: 1px solid rgba(176, 123, 4, 0.45);
    border-radius: 999px;
    box-shadow:
        0 14px 30px -16px rgba(245, 197, 24, 0.85),
        0 1px 0 rgba(255, 255, 255, 0.55) inset,
        0 -2px 0 rgba(128, 85, 0, 0.30) inset;
    text-decoration: none;
    cursor: pointer;
    transition:
        transform .3s cubic-bezier(.2,.8,.2,1),
        box-shadow .3s ease,
        background .3s ease,
        filter .3s ease;
    font-family: inherit;
}

/* --------------- CONSTRATE WCAG 2.1 AAA (ratio ~14.5:1 texto #041020 sobre #f9cd33) --------------- */
.shark-btn--feria-card:hover,
.shark-btn--feria-card:focus-visible {
    transform: translateY(-3px);
    background: linear-gradient(180deg,
        #ffd748 0%,
        #f5c518 50%,
        #e4b211 100%);
    box-shadow:
        0 22px 44px -18px rgba(245, 197, 24, 0.95),
        0 16px 38px -22px rgba(255, 199, 0, 0.70),
        0 1px 0 rgba(255, 255, 255, 0.65) inset,
        0 -2px 0 rgba(128, 85, 0, 0.30) inset;
    outline: none;
}

.shark-btn--feria-card:focus-visible {
    outline: 2px solid #f5c518;
    outline-offset: 4px;
}

.shark-btn--feria-card:active {
    transform: translateY(0) scale(0.99);
    background: linear-gradient(180deg,
        #e6bd19 0%,
        #d4a910 55%,
        #b9920a 100%);
    filter: saturate(0.98);
    box-shadow:
        0 8px 18px -12px rgba(245, 197, 24, 0.60),
        0 1px 0 rgba(255, 255, 255, 0.35) inset,
        0 -1px 0 rgba(128, 85, 0, 0.30) inset;
}

.shark-btn--feria-card .shark-btn__label {
    flex: 1 1 auto;
    min-width: 0;
    display: inline-block;
}

/* Responsive ratios & font size (armonía mobile) */
@media (max-width: 1199px) {
    .shark-feria-card__wrap--imagebtn { padding: 0.9rem; border-radius: 28px; }
    .shark-feria-card__media--full   { border-radius: 20px; }
    .shark-btn--feria-card { font-size: 0.9rem; letter-spacing: 0.18em; }
}

@media (max-width: 991px) {
    .shark-feria-card__wrap--imagebtn { padding: 0.85rem; border-radius: 26px; gap: 0.85rem; }
    .shark-feria-card__media--full   { aspect-ratio: 3 / 3.4; border-radius: 18px; }
    .shark-btn--feria-card {
        font-size: 0.86rem;
        letter-spacing: 0.16em;
        padding: 0.9rem 1.25rem;
        min-height: 52px;
    }
}

@media (max-width: 560px) {
    .shark-feria-card__wrap--imagebtn { padding: 1rem; border-radius: 28px; gap: 1rem; }
    .shark-feria-card__media--full   { aspect-ratio: 4 / 4.5; border-radius: 20px; }
    .shark-btn--feria-card {
        font-size: 0.95rem;
        letter-spacing: 0.18em;
        padding: 1rem 1.4rem;
        min-height: 58px;
    }
}

@media (prefers-reduced-motion: reduce) {
    .shark-btn--feria-card,
    .shark-feria-card__wrap--imagebtn { transition: none; }
    .shark-btn--feria-card:hover,
    .shark-feria-card__wrap--imagebtn:hover { transform: none; }
}

.shark-feria-card__body {
    padding: 1.25rem 1.25rem 1.5rem;
    display: flex;
    flex-direction: column;
    gap: 0.55rem;
    flex: 1 1 auto;
}

.shark-feria-card__title {
    margin: 0;
    font-size: 1.2rem;
    line-height: 1.25;
    font-weight: 800;
    color: var(--shark-c-gold);
    letter-spacing: -0.005em;
}

.shark-feria-card__text {
    margin: 0;
    font-size: 0.95rem;
    line-height: 1.6;
    color: rgba(220, 234, 252, 0.85);
}

/* ---------- Responsive: Feria ---------- */
@media (max-width: 1199px) {
    .shark-feria-cards__grid {
        gap: 1.5rem;
    }
}

@media (max-width: 991px) {
    .shark-feria-cards__grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 1.25rem;
    }

    .shark-page-hero__inner {
        padding-top: 7rem;
        padding-bottom: 5rem;
    }
}

@media (max-width: 768px) {
    .shark-feria-cards {
        padding-top: 4rem;
        padding-bottom: 4rem;
    }

    .shark-feria-cards__header { margin-bottom: 2.5rem; }
}

@media (max-width: 560px) {
    .shark-feria-cards__grid {
        grid-template-columns: 1fr;
        gap: 1.25rem;
    }
}

@media (max-width: 480px) {
    .shark-page-hero__inner {
        padding-top: 6rem;
        gap: 0.75rem;
    }

    .shark-page-hero__eyebrow { font-size: 0.7rem; padding: 0.3rem 0.8rem; }
    .shark-page-hero__lede { font-size: 1rem; }

    .shark-feria-card__body { padding: 1rem 1rem 1.25rem; }
    .shark-feria-card__title { font-size: 1.1rem; }
}

/* ---------- Admin Bar Compensation: Hero Feria ---------- */
@media (min-width: 783px) {
    body.admin-bar .shark-page-hero {
        min-height: calc(100vh - 32px);
        min-height: calc(100dvh - 32px);
        padding-top: 32px;
    }
    body.admin-bar .shark-page-hero--capacitaciones-75 {
        min-height: calc(75vh - 32px);
        min-height: calc(75dvh - 32px);
        padding-top: 32px;
    }
}
@media (max-width: 782px) and (min-width: 1px) {
    body.admin-bar .shark-page-hero {
        min-height: calc(100vh - 46px);
        min-height: calc(100dvh - 46px);
        padding-top: 46px;
    }
    body.admin-bar .shark-page-hero--capacitaciones-75 {
        min-height: calc(75vh - 46px);
        min-height: calc(75dvh - 46px);
        padding-top: 46px;
    }
}

/* ==========================================================
   ADMIN BAR COMPENSATION (USUARIOS LOGUEADOS)
   Evita que el header fixed tape el wpadminbar de WordPress
   ========================================================== */
body.admin-bar .shark-site-header {
    top: 32px;
}

body.admin-bar .shark-hero__content,
body.admin-bar .shark-about,
body.admin-bar .shark-content-wrap {
    padding-top: 112px; /* 80px header + 32px adminbar desktop */
}

body.admin-bar .shark-mobile-nav__panel {
    top: 112px;
}

@media screen and (max-width: 782px) {
    body.admin-bar .shark-site-header {
        top: 46px;
    }

    body.admin-bar .shark-hero__content,
    body.admin-bar .shark-about,
    body.admin-bar .shark-content-wrap {
        padding-top: 126px; /* 80px header + 46px adminbar móvil */
    }

    body.admin-bar .shark-mobile-nav__panel {
        top: 126px;
    }
}

@media screen and (max-width: 600px) {
    body.admin-bar #wpadminbar {
        position: fixed !important;
    }
}

/* ===== Footer ===== */
.shark-site-footer {
    background: var(--shark-c-bg);
    border-top: 1px solid var(--shark-c-border);
    padding: 2.5rem 0 2rem;
    font-size: 0.9rem;
    color: var(--shark-c-muted);
    text-align: center;
}

.shark-footer-info {
    max-width: var(--shark-rw);
    margin: 0 auto;
    padding: 0 var(--shark-px);
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}

.shark-footer-info a {
    color: #ffffff;                 /* ← Cambiado: color AZUL → BLANCO por defecto */
    text-decoration: none;
    font-weight: 600;
    transition: color .2s ease, text-decoration-color .2s ease;
}

.shark-footer-info a:hover,
.shark-footer-info a:focus {
    color: var(--shark-c-accent);   /* ← MANTENIDO: hover dorado igual que antes */
    text-decoration: underline;
    text-decoration-color: var(--shark-c-accent);
}

.shark-footer-whatsapp {
    color: var(--shark-c-text);
    font-weight: 500;
}

.shark-footer-whatsapp a {
    color: var(--shark-c-whatsapp);
}

.shark-footer-whatsapp a:hover,
.shark-footer-whatsapp a:focus {
    color: var(--shark-c-whatsapp-700);
}