/*
 * UNDERNET V2-B R3
 * Tema grafito/gris/naranja con contraste mejorado del logo.
 * Mantiene la estructura y contenido de V2-A.
 */

:root{
    --b3-bg:#1b1b1b;
    --b3-bg-soft:#242424;
    --b3-surface:#303030;
    --b3-surface-light:#474747;
    --b3-line:#565656;
    --b3-text:#f4f4f4;
    --b3-muted:#d0d0d0;
    --b3-orange:#ef7d00;
    --b3-orange-hover:#ff981f;
}

html,
body{
    background:linear-gradient(180deg,#171717 0%,#222 50%,#191919 100%)!important;
    color:var(--b3-text)!important;
}

body{color-scheme:dark}

main,
#contenido{
    background:linear-gradient(180deg,#1e1e1e 0%,#282828 50%,#1d1d1d 100%)!important;
}

h1,h2,h3,h4,h5,h6,strong{color:#fff}

a{color:var(--b3-orange)}
a:hover,
a:focus-visible{color:var(--b3-orange-hover)}

/* Header: más claro a la izquierda para que el wordmark negro del logo se vea */
header,
.site-header,
.main-header,
.header-v2{
    background:
        linear-gradient(
            90deg,
            #7b7b7b 0%,
            #676767 15%,
            #4b4b4b 31%,
            #2f2f2f 49%,
            #1c1c1c 68%,
            #111 100%
        )!important;
    border-bottom:1px solid #666!important;
    box-shadow:
        inset 0 -1px 0 rgba(255,255,255,.035),
        0 8px 26px rgba(0,0,0,.22)!important;
}

header nav a,
.site-header nav a,
.main-header nav a,
.header-v2 nav a,
.site-nav a{
    color:#f4f4f4!important;
    text-shadow:0 1px 2px rgba(0,0,0,.35);
}

header nav a:hover,
header nav a.active,
.site-nav a:hover,
.site-nav a.active{
    color:#ff9b2c!important;
}

/* Fallback para el bloque que contiene el logo */
header .logo,
.site-header .logo,
.main-header .logo,
.header-v2 .logo,
.brand-area,
.site-branding{
    background:
        linear-gradient(90deg,rgba(200,200,200,.34),rgba(255,255,255,0))!important;
}

/* Hero */
.hero,
.home-hero,
.hero-section,
.page-hero{
    background:
        radial-gradient(circle at 88% 12%,rgba(239,125,0,.22),transparent 30%),
        linear-gradient(112deg,#1c1c1c 0%,#292929 43%,#3b3b3b 72%,#202020 100%)!important;
    border-bottom:1px solid #555!important;
    color:var(--b3-text)!important;
}

.hero h1,
.home-hero h1,
.hero-section h1,
.page-hero h1{
    color:#fff!important;
    text-shadow:0 3px 12px rgba(0,0,0,.28);
}

.hero p,
.home-hero p,
.hero-section p,
.page-hero p,
.page-lead{
    color:#eeeeee!important;
}

.eyebrow,
.kicker,
.overline{
    color:#ffa13c!important;
}

/* Botones */
.button,
.btn,
.btn-primary,
.button-primary,
.cta,
.hero a.button,
.hero a.btn,
a.button-link{
    background:linear-gradient(180deg,#ff9018 0%,#ef7d00 100%)!important;
    border:1px solid #ffa247!important;
    color:#111!important;
    box-shadow:0 5px 16px rgba(0,0,0,.22)!important;
}

.button:hover,
.btn:hover,
.btn-primary:hover,
.button-primary:hover,
.cta:hover,
.hero a.button:hover,
.hero a.btn:hover,
a.button-link:hover{
    background:linear-gradient(180deg,#ffa63d 0%,#f58a10 100%)!important;
}

/* Secciones */
section,
.section{border-color:var(--b3-line)!important}

.section:nth-of-type(odd),
.section-white,
.bg-white{
    background:linear-gradient(180deg,#252525 0%,#1e1e1e 100%)!important;
}

.section:nth-of-type(even),
.alt-section,
.section-alt,
.light-section,
.bg-light{
    background:linear-gradient(180deg,#3a3a3a 0%,#2d2d2d 100%)!important;
}

/* Tarjetas */
.card,
.service-card,
.services-card,
.feature-card,
.info-card,
.standard-card,
.value-card,
.highlight-card,
.home-card{
    background:linear-gradient(180deg,#373737 0%,#2d2d2d 100%)!important;
    border:1px solid #5d5d5d!important;
    color:var(--b3-text)!important;
    box-shadow:
        0 15px 34px rgba(0,0,0,.25),
        inset 0 1px 0 rgba(255,255,255,.04)!important;
}

.card p,
.service-card p,
.feature-card p,
.info-card p{
    color:var(--b3-muted)!important;
}

/* La tarjeta de experiencia debe leerse claramente como recuadro */
.experience-card{
    background:
        linear-gradient(180deg,#5a5a5a 0%,#454545 45%,#373737 100%)!important;
    border:1px solid #777!important;
    color:#fff!important;
    box-shadow:
        0 20px 42px rgba(0,0,0,.34),
        inset 0 1px 0 rgba(255,255,255,.10)!important;
}

.experience-card h2,
.experience-card h3,
.experience-card strong{
    color:#fff!important;
}

.experience-card p{
    color:#f0f0f0!important;
}

.experience-card hr,
.experience-card .divider{
    border-color:#777!important;
    background:#777!important;
}

/* Estándares */
.standards,
.standards-strip,
.iso-strip,
.certifications,
.home-standards{
    background:linear-gradient(180deg,#383838 0%,#292929 100%)!important;
    border-top:1px solid #606060!important;
    border-bottom:1px solid #4a4a4a!important;
}

/* Visuales */
.image-card,
.visual-card,
figure{
    border-color:#606060!important;
}

.image-card,
.visual-card{
    background:linear-gradient(180deg,#414141 0%,#303030 100%)!important;
}

/* Footer */
footer,
.site-footer,
.footer-v2{
    background:linear-gradient(180deg,#2e2e2e 0%,#191919 100%)!important;
    color:#c7c7c7!important;
    border-top:1px solid #4f4f4f!important;
}

footer a,
.site-footer a{
    color:#dedede!important;
}

footer a:hover,
.site-footer a:hover{
    color:var(--b3-orange)!important;
}

/* Elementos claros heredados */
[style*="background: white"],
[style*="background:#fff"],
[style*="background: #fff"],
[style*="background-color: white"],
[style*="background-color:#fff"],
[style*="background-color: #fff"]{
    background:linear-gradient(180deg,#424242 0%,#303030 100%)!important;
}

hr{border-color:#5b5b5b!important}
.divider,
.section-divider{background:#5b5b5b!important}

:focus-visible{
    outline:3px solid var(--b3-orange)!important;
    outline-offset:3px;
}

::selection{
    background:var(--b3-orange);
    color:#111;
}

@media(max-width:900px){
    header,
    .site-header,
    .main-header,
    .header-v2{
        background:
            linear-gradient(
                180deg,
                #555 0%,
                #343434 42%,
                #1c1c1c 100%
            )!important;
    }

    .site-nav,
    .nav-menu,
    .mobile-menu{
        background:#2a2a2a!important;
        border-color:#5c5c5c!important;
    }

    .experience-card{
        background:linear-gradient(180deg,#555 0%,#3a3a3a 100%)!important;
    }
}

@media(prefers-reduced-motion:reduce){
    *{
        scroll-behavior:auto!important;
        transition-duration:.01ms!important;
        animation-duration:.01ms!important;
        animation-iteration-count:1!important;
    }
}

/* ===== R4: bloque Fortalecimiento / Experiencia =====
 * Evita "islas blancas" dentro del tema oscuro y mejora contraste.
 */

/* Tarjetas 01 / 02 / 03 */
.process-card,
.step-card,
.gestion-step,
.management-step,
.home-process .card,
.management-diagram .card{
    background:
        linear-gradient(180deg,#4a4a4a 0%,#373737 100%) !important;
    border:1px solid #666 !important;
    color:#fff !important;
    box-shadow:
        0 14px 30px rgba(0,0,0,.28),
        inset 0 1px 0 rgba(255,255,255,.06) !important;
}

.process-card h3,
.step-card h3,
.gestion-step h3,
.management-step h3,
.process-card p,
.step-card p,
.gestion-step p,
.management-step p,
.home-process .card *,
.management-diagram .card *{
    color:#f3f3f3 !important;
}

.process-card .number,
.step-card .number,
.gestion-step .number,
.management-step .number,
.process-card .step-number,
.step-card .step-number{
    color:#ff9b2c !important;
}

/* El círculo central conserva el naranja como foco visual */
.process-center,
.gestion-center,
.management-center,
.process-core{
    background:
        linear-gradient(180deg,#ff9b22 0%,#ef7d00 100%) !important;
    border-color:#f7f7f7 !important;
    color:#fff !important;
    box-shadow:0 12px 28px rgba(0,0,0,.24) !important;
}

.process-center *,
.gestion-center *,
.management-center *,
.process-core *{
    color:#fff !important;
}

/* Línea/órbita naranja más visible pero discreta */
.process-orbit,
.gestion-orbit,
.management-orbit{
    border-color:rgba(239,125,0,.72) !important;
}

/* Bloque "Experiencia en" */
.experience-strip,
.experience-standards,
.standards-panel,
.home-experience,
.experience-section .panel{
    background:
        linear-gradient(180deg,#4a4a4a 0%,#383838 100%) !important;
    border:1px solid #686868 !important;
    color:#fff !important;
    box-shadow:
        0 16px 34px rgba(0,0,0,.25),
        inset 0 1px 0 rgba(255,255,255,.06) !important;
}

.experience-strip h2,
.experience-strip h3,
.experience-standards h2,
.experience-standards h3,
.standards-panel h2,
.standards-panel h3,
.home-experience h2,
.home-experience h3{
    color:#ff9b2c !important;
}

/* Pills ISO/MIPG/SGSST */
.experience-strip .badge,
.experience-strip .tag,
.experience-strip .pill,
.experience-standards .badge,
.experience-standards .tag,
.experience-standards .pill,
.standards-panel .badge,
.standards-panel .tag,
.standards-panel .pill,
.home-experience .badge,
.home-experience .tag,
.home-experience .pill{
    background:#2d2d2d !important;
    border:1px solid #ef7d00 !important;
    color:#f6f6f6 !important;
    box-shadow:inset 0 1px 0 rgba(255,255,255,.035) !important;
    text-decoration:none !important;
}

.standards-cards .standards-card-link:hover,
.standards-cards .standards-card-link:focus-visible{
    background:#3c3c3c !important;
    border-color:#ff9b2f !important;
    color:#fff !important;
    transform:translateY(-1px);
}

/* Fallback para el bloque concreto si V2-A usa tarjetas blancas genéricas */
.home-process [class*="card"],
.management-diagram [class*="card"],
.process-section [class*="card"]{
    background:linear-gradient(180deg,#484848 0%,#353535 100%) !important;
    border-color:#666 !important;
}

.home-process [class*="card"] *,
.management-diagram [class*="card"] *,
.process-section [class*="card"] *{
    color:#f3f3f3 !important;
}

@media(max-width:900px){
    .process-card,
    .step-card,
    .gestion-step,
    .management-step,
    .experience-strip,
    .experience-standards,
    .standards-panel,
    .home-experience{
        background:linear-gradient(180deg,#454545 0%,#323232 100%) !important;
    }
}

/* ==========================================================
   R5 - Selectores exactos de index-v2.php
   visual-story-section / service-orbit / standards-map
   ========================================================== */

.visual-story-section{
    background:
        radial-gradient(circle at 50% 26%, rgba(255,255,255,.035), transparent 34%),
        linear-gradient(180deg,#292929 0%,#202020 52%,#272727 100%) !important;
    border-top:1px solid #505050 !important;
    color:#f5f5f5 !important;
}

.visual-story-section .visual-heading h2{
    color:#fff !important;
}

.visual-story-section .visual-heading > p:not(.eyebrow){
    color:#d2d2d2 !important;
}

/* Órbita */
.visual-story-section .service-orbit{
    color:#fff !important;
}

.visual-story-section .service-orbit::before,
.visual-story-section .service-orbit::after{
    border-color:rgba(239,125,0,.58) !important;
}

/* Tarjetas exactas 01 / 02 / 03 */
.visual-story-section .orbit-card{
    background:
        linear-gradient(180deg,#555 0%,#454545 52%,#393939 100%) !important;
    border:1px solid #707070 !important;
    color:#fff !important;
    box-shadow:
        0 16px 34px rgba(0,0,0,.30),
        inset 0 1px 0 rgba(255,255,255,.09) !important;
    text-decoration:none !important;
}

.visual-story-section .orbit-card:hover,
.visual-story-section .orbit-card:focus-visible{
    background:
        linear-gradient(180deg,#606060 0%,#4b4b4b 52%,#3d3d3d 100%) !important;
    border-color:#ef7d00 !important;
    transform:translateY(-2px);
}

.visual-story-section .orbit-card .orbit-number{
    color:#ff9a28 !important;
}

.visual-story-section .orbit-card strong{
    color:#fff !important;
}

.visual-story-section .orbit-card small{
    color:#e1e1e1 !important;
}

/* Centro */
.visual-story-section .orbit-center{
    background:
        linear-gradient(180deg,#ff9b22 0%,#ef7d00 100%) !important;
    border-color:#f5f5f5 !important;
    color:#fff !important;
    box-shadow:0 15px 32px rgba(0,0,0,.30) !important;
}

.visual-story-section .orbit-center span,
.visual-story-section .orbit-center strong{
    color:#fff !important;
}

/* Panel de estándares */
.visual-story-section .standards-map{
    background:
        linear-gradient(180deg,#4b4b4b 0%,#393939 100%) !important;
    border:1px solid #686868 !important;
    color:#fff !important;
    box-shadow:
        0 18px 38px rgba(0,0,0,.27),
        inset 0 1px 0 rgba(255,255,255,.07) !important;
}

/* Texto central que estaba casi invisible */
.visual-story-section .standards-core{
    color:#fff !important;
}

.visual-story-section .standards-core span{
    color:#ff9a28 !important;
}

.visual-story-section .standards-core strong{
    color:#fff !important;
}

/* Pills exactos */
.visual-story-section .standard-pill{
    background:
        linear-gradient(180deg,#333 0%,#292929 100%) !important;
    border:1px solid #ef7d00 !important;
    color:#f4f4f4 !important;
    box-shadow:
        inset 0 1px 0 rgba(255,255,255,.04),
        0 5px 12px rgba(0,0,0,.14) !important;
}

.visual-story-section .standard-pill:hover{
    background:#3b3b3b !important;
    color:#fff !important;
}

/* R5 neutraliza específicamente el fallback blanco heredado de R3/R4 */
.visual-story-section .orbit-card,
.visual-story-section .standards-map{
    background-color:#414141 !important;
}

@media(max-width:900px){
    .visual-story-section .orbit-card{
        background:linear-gradient(180deg,#505050 0%,#3b3b3b 100%) !important;
    }

    .visual-story-section .standards-map{
        background:linear-gradient(180deg,#484848 0%,#353535 100%) !important;
    }
}

/* ==========================================================
   R8 - Sincronización con V2-A actual
   Home slider + propósito compartido
   ========================================================== */

/* ---- Slider principal ---- */
.home-slider{
    background:
        radial-gradient(circle at 88% 16%, rgba(239,125,0,.17), transparent 29%),
        linear-gradient(180deg,#1c1c1c 0%,#242424 100%) !important;
}

.home-slider-shell{
    background:#242424 !important;
    border-color:#5c5c5c !important;
    box-shadow:
        0 24px 62px rgba(0,0,0,.42),
        inset 0 1px 0 rgba(255,255,255,.035) !important;
}

.home-slide-copy{
    background:
        radial-gradient(circle at 18% 70%, rgba(239,125,0,.14), transparent 34%),
        linear-gradient(135deg,#343434 0%,#282828 54%,#222 100%) !important;
}

.home-slide-copy .eyebrow{
    color:#ff9a28 !important;
}

.home-slide-copy h1,
.home-slide-copy h2{
    color:#fff !important;
    text-shadow:0 3px 13px rgba(0,0,0,.30);
}

.home-slide-lead{
    color:#dfdfdf !important;
}

.home-slide-media{
    background:#202020 !important;
}

.home-slide-media::after{
    background:
        linear-gradient(
            90deg,
            rgba(40,40,40,.99) 0%,
            rgba(40,40,40,.88) 20%,
            rgba(40,40,40,.36) 62%,
            rgba(40,40,40,0) 100%
        ) !important;
}

.home-slide-media img{
    filter:saturate(.94) contrast(1.03) brightness(.91);
}

/* Botón secundario del slider */
.home-slider .button-secondary{
    background:rgba(255,255,255,.035) !important;
    border:1px solid #ef7d00 !important;
    color:#fff !important;
    box-shadow:none !important;
}

.home-slider .button-secondary:hover,
.home-slider .button-secondary:focus-visible{
    background:#3d3d3d !important;
    border-color:#ffa03a !important;
    color:#fff !important;
}

/* Flechas y controles */
.home-slider-arrow{
    background:rgba(46,46,46,.95) !important;
    border-color:#707070 !important;
    color:#fff !important;
    box-shadow:0 9px 26px rgba(0,0,0,.32) !important;
}

.home-slider-arrow:hover,
.home-slider-arrow:focus-visible{
    background:#3c3c3c !important;
    border-color:#ef7d00 !important;
    color:#ff9b2c !important;
}

.home-slider-dots button{
    background:#6c6c6c !important;
}

.home-slider-dots button.is-active{
    background:#ef7d00 !important;
}

.home-slider-pause{
    background:rgba(45,45,45,.95) !important;
    border:1px solid #676767 !important;
    color:#fff !important;
    box-shadow:0 5px 18px rgba(0,0,0,.26) !important;
}

/* ---- Strip de estándares debajo del slider ---- */
.standards-strip{
    background:linear-gradient(180deg,#393939 0%,#2b2b2b 100%) !important;
    border-top:1px solid #575757 !important;
    border-bottom:1px solid #4e4e4e !important;
}

.standards-strip .standards-inner span{
    color:#f4f4f4 !important;
}

/* ---- Servicios de la Home ---- */
#servicios{
    background:
        radial-gradient(circle at 90% 0%, rgba(239,125,0,.065), transparent 28%),
        linear-gradient(180deg,#242424 0%,#1f1f1f 100%) !important;
}

#servicios .section-heading h2{
    color:#fff !important;
}

#servicios .service-card{
    background:
        linear-gradient(180deg,#515151 0%,#414141 50%,#343434 100%) !important;
    border:1px solid #6c6c6c !important;
    box-shadow:
        0 17px 38px rgba(0,0,0,.30),
        inset 0 1px 0 rgba(255,255,255,.07) !important;
}

#servicios .service-card h3,
#servicios .service-card p{
    color:#fff !important;
}

#servicios .service-card p{
    color:#dedede !important;
}

#servicios .service-number,
#servicios .service-card a{
    color:#ff9a28 !important;
}

/* ---- Bloque de trayectoria ---- */
.section-orange-soft{
    background:
        radial-gradient(circle at 17% 22%, rgba(239,125,0,.15), transparent 24%),
        linear-gradient(120deg,#3f3f3f 0%,#303030 62%,#292929 100%) !important;
    border-color:#5a5a5a !important;
}

.section-orange-soft .experience-year{
    color:#ff9a28 !important;
}

.section-orange-soft p,
.section-orange-soft .section-copy{
    color:#e5e5e5 !important;
}

/* ---- Clientes ---- */
.clients-preview{
    background:linear-gradient(180deg,#242424 0%,#1d1d1d 100%) !important;
}

.clients-preview .section-heading h2{
    color:#fff !important;
}

.clients-preview .section-heading p{
    color:#d2d2d2 !important;
}

.client-card,
.client-logo-card,
.clients-preview [class*="client"]{
    border-color:#606060 !important;
}

/* ---- CTA ---- */
.cta-section{
    background:linear-gradient(180deg,#242424 0%,#1d1d1d 100%) !important;
}

.cta-box{
    background:
        linear-gradient(135deg,#ff9a23 0%,#ef7d00 72%,#d86e00 100%) !important;
    border-color:#ffae56 !important;
    box-shadow:0 18px 40px rgba(0,0,0,.28) !important;
}

.cta-box h2,
.cta-box .eyebrow{
    color:#171717 !important;
}

.cta-box .button-light{
    background:#232323 !important;
    border-color:#232323 !important;
    color:#fff !important;
}

.cta-box .button-light:hover{
    background:#393939 !important;
    border-color:#393939 !important;
}

/* ---- Nuevo bloque "Tres líneas..." sin órbita ---- */
.visual-story-section .service-purpose{
    margin-top:46px !important;
}

.visual-story-section .purpose-card{
    background:
        linear-gradient(180deg,#565656 0%,#464646 52%,#393939 100%) !important;
    border:1px solid #707070 !important;
    color:#fff !important;
    box-shadow:
        0 16px 34px rgba(0,0,0,.30),
        inset 0 1px 0 rgba(255,255,255,.09) !important;
}

.visual-story-section .purpose-card::before{
    background:#ef7d00 !important;
}

.visual-story-section .purpose-card:hover,
.visual-story-section .purpose-card:focus-visible{
    background:
        linear-gradient(180deg,#616161 0%,#4d4d4d 52%,#3d3d3d 100%) !important;
    border-color:#ef7d00 !important;
}

.visual-story-section .purpose-number{
    color:#ff9a28 !important;
}

.visual-story-section .purpose-card strong{
    color:#fff !important;
}

.visual-story-section .purpose-card small{
    color:#e1e1e1 !important;
}

.visual-story-section .purpose-connector::before,
.visual-story-section .purpose-connector::after,
.visual-story-section .purpose-connector span{
    background:rgba(239,125,0,.68) !important;
}

.visual-story-section .purpose-result{
    background:
        linear-gradient(180deg,#ff9b22 0%,#ef7d00 100%) !important;
    border-color:#ffad4f !important;
    box-shadow:0 18px 38px rgba(0,0,0,.30) !important;
}

.visual-story-section .purpose-result span{
    color:#512d00 !important;
}

.visual-story-section .purpose-result strong{
    color:#161616 !important;
}

.visual-story-section .purpose-result small{
    color:#33210b !important;
}

/* Standards-map ya no debe quedar visualmente pegado al resultado */
.visual-story-section .standards-map{
    margin-top:54px !important;
}

/* ---- Responsive ---- */
@media(max-width:980px){
    .home-slide-copy{
        background:
            radial-gradient(circle at 18% 70%,rgba(239,125,0,.13),transparent 35%),
            linear-gradient(180deg,#343434 0%,#292929 100%) !important;
    }

    .home-slide-media::after{
        background:
            linear-gradient(
                180deg,
                rgba(41,41,41,.98) 0%,
                rgba(41,41,41,.58) 45%,
                rgba(41,41,41,0) 100%
            ) !important;
    }
}

@media(max-width:640px){
    .home-slider-shell{
        border-color:#555 !important;
    }
}

/* ==========================================================
   R9 - V2-B formal: Nosotros + Asesoría + Auditoría + Capacitación
   ========================================================== */

/* General inner-page canvas */
.page-hero{
    background:
        radial-gradient(circle at 84% 20%, rgba(239,125,0,.13), transparent 28%),
        linear-gradient(180deg,#303030 0%,#242424 100%) !important;
    border-bottom:1px solid #505050 !important;
}

.page-hero .eyebrow{
    color:#ff9a28 !important;
}

.page-hero h1{
    color:#fff !important;
    text-shadow:0 3px 14px rgba(0,0,0,.28);
}

.page-hero .page-lead{
    color:#dedede !important;
}

/* Editorial photo + copy pattern shared by the four pages */
.service-editorial{
    background:
        radial-gradient(circle at 92% 10%, rgba(239,125,0,.055), transparent 26%),
        linear-gradient(180deg,#242424 0%,#202020 100%) !important;
}

.service-editorial-copy .eyebrow{
    color:#ff9a28 !important;
}

.service-editorial-copy h2{
    color:#fff !important;
}

.service-editorial-copy .prose-large,
.service-editorial-copy .prose-large p{
    color:#dedede !important;
}

.service-photo{
    background:#2c2c2c !important;
    border:1px solid #636363 !important;
    box-shadow:
        0 24px 56px rgba(0,0,0,.36),
        inset 0 1px 0 rgba(255,255,255,.05) !important;
}

.service-photo::after{
    background:linear-gradient(180deg,transparent 58%,rgba(15,15,15,.46) 100%) !important;
}

.service-photo img{
    filter:saturate(.94) contrast(1.04) brightness(.92);
}

.service-photo figcaption{
    background:rgba(38,38,38,.94) !important;
    color:#fff !important;
    border:1px solid rgba(255,255,255,.14) !important;
    box-shadow:0 7px 22px rgba(0,0,0,.28) !important;
}

.service-visual-tags span{
    background:#353535 !important;
    border-color:#ef7d00 !important;
    color:#f3f3f3 !important;
}

/* Soft/background sections */
.section-soft{
    background:
        linear-gradient(180deg,#333 0%,#2a2a2a 100%) !important;
    border-top:1px solid #4d4d4d !important;
    border-bottom:1px solid #4d4d4d !important;
}

.section-soft .section-heading h2,
.section-soft h2,
.section-soft h3{
    color:#fff !important;
}

.section-soft p{
    color:#d9d9d9 !important;
}

/* Topic cards used by Asesoría */
.topic-grid article{
    background:
        linear-gradient(180deg,#505050 0%,#414141 52%,#353535 100%) !important;
    border:1px solid #696969 !important;
    box-shadow:
        0 15px 34px rgba(0,0,0,.28),
        inset 0 1px 0 rgba(255,255,255,.07) !important;
}

.topic-grid article h3{
    color:#fff !important;
}

.topic-grid article p{
    color:#dedede !important;
}

/* Process / modality cards */
.process-grid article,
.two-cards .service-card{
    background:
        linear-gradient(180deg,#505050 0%,#414141 52%,#353535 100%) !important;
    border:1px solid #696969 !important;
    box-shadow:
        0 15px 34px rgba(0,0,0,.28),
        inset 0 1px 0 rgba(255,255,255,.07) !important;
}

.process-grid article span,
.two-cards .service-number{
    color:#ff9a28 !important;
}

.process-grid article h3,
.two-cards .service-card h3{
    color:#fff !important;
}

.process-grid article p,
.two-cards .service-card p{
    color:#dedede !important;
}

/* Standard pills */
.standards-cards span,
.standards-cards .standards-card-link{
    background:#333 !important;
    border:1px solid #ef7d00 !important;
    color:#fff !important;
    box-shadow:inset 0 1px 0 rgba(255,255,255,.035) !important;
}

.section-heading h2{
    color:#fff !important;
}

.section-heading > p:not(.eyebrow),
.section-copy,
.content-note{
    color:#d6d6d6 !important;
}

/* Nosotros trajectory band */
.section-orange-soft{
    background:
        radial-gradient(circle at 17% 22%, rgba(239,125,0,.16), transparent 25%),
        linear-gradient(120deg,#424242 0%,#323232 60%,#292929 100%) !important;
    border-top:1px solid #565656 !important;
    border-bottom:1px solid #565656 !important;
}

.section-orange-soft .eyebrow,
.section-orange-soft .experience-year{
    color:#ff9a28 !important;
}

.section-orange-soft h2{
    color:#fff !important;
}

.section-orange-soft p,
.section-orange-soft .section-copy{
    color:#e2e2e2 !important;
}

/* Process visual section at the end of the three service pages */
.process-visual-section{
    background:
        radial-gradient(circle at 85% 0%, rgba(239,125,0,.07), transparent 26%),
        linear-gradient(180deg,#232323 0%,#1c1c1c 100%) !important;
    border-top:1px solid #494949 !important;
}

.process-visual-section .visual-heading .eyebrow{
    color:#ff9a28 !important;
}

.process-visual-section .visual-heading h2{
    color:#fff !important;
}

.process-flow::before{
    background:#ef7d00 !important;
}

.process-flow li{
    background:
        linear-gradient(180deg,#4f4f4f 0%,#3f3f3f 100%) !important;
    border:1px solid #696969 !important;
    box-shadow:
        0 14px 31px rgba(0,0,0,.27),
        inset 0 1px 0 rgba(255,255,255,.06) !important;
}

.process-flow li span{
    color:#ff9a28 !important;
}

.process-flow li strong{
    color:#fff !important;
}

.process-flow li small{
    color:#d9d9d9 !important;
}

/* Inner-page CTA */
.cta-section{
    background:linear-gradient(180deg,#242424 0%,#1d1d1d 100%) !important;
}

.cta-box{
    background:linear-gradient(135deg,#ff9a23 0%,#ef7d00 72%,#d86e00 100%) !important;
    border-color:#ffae56 !important;
    box-shadow:0 18px 40px rgba(0,0,0,.28) !important;
}

.cta-box .eyebrow,
.cta-box h2{
    color:#171717 !important;
}

.cta-box .button-light{
    background:#232323 !important;
    border-color:#232323 !important;
    color:#fff !important;
}

.cta-box .button-light:hover,
.cta-box .button-light:focus-visible{
    background:#3a3a3a !important;
    border-color:#3a3a3a !important;
}

/* Small readability refinements */
.prose-large,
.prose-large p{
    color:#dedede;
}

@media(max-width:900px){
    .service-editorial{
        background:linear-gradient(180deg,#242424 0%,#202020 100%) !important;
    }

    .service-photo img{
        filter:saturate(.96) contrast(1.03) brightness(.94);
    }
}

/* ==========================================================
   R11 - Clientes + Trabaje + Artículos + Contacto
   ========================================================== */

/* Generic page sections */
.contact-section,
.jobs-section,
.articles-section,
.clients-section{
    background:
        radial-gradient(circle at 88% 8%, rgba(239,125,0,.055), transparent 26%),
        linear-gradient(180deg,#242424 0%,#202020 100%) !important;
}

/* Contact + Jobs side copy */
.contact-intro .eyebrow,
.jobs-intro .eyebrow{
    color:#ff9a28 !important;
}

.contact-intro h2,
.jobs-intro h2{
    color:#fff !important;
}

.contact-intro > p,
.jobs-intro > p{
    color:#d9d9d9 !important;
}

/* Information/security cards */
.contact-info-card,
.jobs-security-card{
    background:
        linear-gradient(180deg,#474747 0%,#383838 100%) !important;
    border:1px solid #666 !important;
    color:#fff !important;
    box-shadow:0 14px 32px rgba(0,0,0,.25) !important;
}

.contact-info-card span,
.contact-info-card small,
.jobs-security-card span{
    color:#d8d8d8 !important;
}

.contact-info-card a,
.jobs-security-card strong{
    color:#ff9a28 !important;
}

/* Form panels */
.contact-form-panel,
.jobs-form-panel{
    background:
        linear-gradient(180deg,#404040 0%,#323232 100%) !important;
    border:1px solid #666 !important;
    box-shadow:
        0 20px 46px rgba(0,0,0,.32),
        inset 0 1px 0 rgba(255,255,255,.055) !important;
}

.contact-form label,
.jobs-form label,
.contact-form .required-note,
.jobs-form .required-note{
    color:#f1f1f1 !important;
}

.contact-form .field-help,
.jobs-form .field-help,
.recaptcha-disclosure{
    color:#bfbfbf !important;
}

.contact-form input,
.contact-form select,
.contact-form textarea,
.jobs-form input,
.jobs-form select,
.jobs-form textarea{
    background:#282828 !important;
    border:1px solid #666 !important;
    color:#fff !important;
    box-shadow:none !important;
}

.contact-form input::placeholder,
.contact-form textarea::placeholder,
.jobs-form input::placeholder,
.jobs-form textarea::placeholder{
    color:#a9a9a9 !important;
}

.contact-form input:focus,
.contact-form select:focus,
.contact-form textarea:focus,
.jobs-form input:focus,
.jobs-form select:focus,
.jobs-form textarea:focus{
    border-color:#ef7d00 !important;
    box-shadow:0 0 0 3px rgba(239,125,0,.16) !important;
    outline:none !important;
}

/* Privacy notice */
.privacy-notice{
    background:#2b2b2b !important;
    border:1px solid #5f5f5f !important;
    color:#e5e5e5 !important;
}

.privacy-notice summary{
    color:#fff !important;
}

.privacy-content{
    color:#d1d1d1 !important;
}

.checkbox-row{
    color:#e1e1e1 !important;
}

/* File picker */
.file-picker-button{
    background:#ef7d00 !important;
    color:#171717 !important;
    border-color:#ef7d00 !important;
}

.file-picker-button:hover{
    background:#ff9820 !important;
}

.file-picker-name{
    color:#d6d6d6 !important;
}

/* Submit buttons */
.contact-submit,
.jobs-submit{
    background:linear-gradient(180deg,#ff9b22 0%,#ef7d00 100%) !important;
    border-color:#ffad4f !important;
    color:#171717 !important;
    box-shadow:0 10px 22px rgba(0,0,0,.22) !important;
}

.contact-submit:hover,
.jobs-submit:hover{
    background:linear-gradient(180deg,#ffa53b 0%,#f4880d 100%) !important;
}

/* Alerts */
.alert.success{
    background:#203a2a !important;
    border-color:#4e8b61 !important;
    color:#e8f6ed !important;
}

.alert.error{
    background:#432626 !important;
    border-color:#985656 !important;
    color:#ffeaea !important;
}

/* Clients: broad compatibility with static and later dynamic markup */
.client-name-grid span,
.clients-grid article,
.client-card,
.client-item{
    background:
        linear-gradient(180deg,#4d4d4d 0%,#3c3c3c 100%) !important;
    border:1px solid #686868 !important;
    color:#fff !important;
    box-shadow:
        0 13px 30px rgba(0,0,0,.25),
        inset 0 1px 0 rgba(255,255,255,.055) !important;
}

.clients-grid h2,
.clients-grid h3,
.clients-section h2,
.clients-section h3{
    color:#fff !important;
}

.clients-grid p,
.clients-section p{
    color:#d6d6d6 !important;
}

.clients-grid img,
.client-card img,
.client-item img{
    background:#fff;
    border-radius:10px;
}

/* Sector/filter controls if present */
.clients-filters button,
.client-filter,
.sector-filter{
    background:#333 !important;
    border:1px solid #666 !important;
    color:#eee !important;
}

.clients-filters button.is-active,
.client-filter.is-active,
.sector-filter.is-active{
    background:#ef7d00 !important;
    border-color:#ef7d00 !important;
    color:#171717 !important;
}

/* Articles: broad compatibility */
.article-card,
.articles-grid article,
.article-item{
    background:
        linear-gradient(180deg,#4d4d4d 0%,#3b3b3b 100%) !important;
    border:1px solid #686868 !important;
    box-shadow:0 14px 31px rgba(0,0,0,.26) !important;
}

.article-card h2,
.article-card h3,
.articles-grid h2,
.articles-grid h3,
.article-item h2,
.article-item h3{
    color:#fff !important;
}

.article-card p,
.articles-grid p,
.article-item p{
    color:#d6d6d6 !important;
}

.article-card a,
.articles-grid a,
.article-item a{
    color:#ff9a28 !important;
}

/* Any empty/deferred content note */
.empty-state,
.articles-empty,
.clients-empty{
    background:#333 !important;
    border:1px solid #606060 !important;
    color:#d8d8d8 !important;
}

/* Keep standard page body dark even when page-specific CSS sets white */
body{
    background:#1f1f1f !important;
}

/* V2-B - Artículos temporal */
.coming-soon-section{
    background:
        radial-gradient(circle at 85% 5%, rgba(239,125,0,.07), transparent 28%),
        linear-gradient(180deg,#242424 0%,#1f1f1f 100%) !important;
}

.coming-soon-card{
    background:
        radial-gradient(circle at 50% 0%, rgba(239,125,0,.14), transparent 31%),
        linear-gradient(180deg,#484848 0%,#373737 100%) !important;
    border-color:#686868 !important;
    box-shadow:
        0 20px 50px rgba(0,0,0,.32),
        inset 0 1px 0 rgba(255,255,255,.055) !important;
}

.coming-soon-icon{
    background:#2f2f2f !important;
    border:1px solid #ef7d00 !important;
    color:#ff9a28 !important;
}

.coming-soon-card h2{
    color:#fff !important;
}

.coming-soon-card > p:not(.eyebrow){
    color:#dedede !important;
}

/* ==========================================================
   R16 - Auditoría V2-B: separación de los círculos del borde
   ========================================================== */

/*
 * En la línea de proceso de Auditoría, baja visualmente los
 * indicadores 01-05 y reserva espacio superior dentro de la tarjeta.
 * Se limita a .process-visual-section para no afectar otros círculos.
 */
.process-visual-section .process-flow li{
    padding-top:58px !important;
}

.process-visual-section .process-flow li > span:first-child{
    top:18px !important;
    transform:translate(-50%, 0) !important;
}

@media(max-width:900px){
    .process-visual-section .process-flow li{
        padding-top:58px !important;
    }

    .process-visual-section .process-flow li > span:first-child{
        top:18px !important;
    }
}

/* ==========================================================
   R17 - Trabaje: selector de hoja de vida + Auditoría centrado
   ========================================================== */

/* Trabaje V2-B: elimina el fondo blanco del selector personalizado. */
body .file-picker,
body .file-upload,
body .custom-file,
body .file-select,
body .file-selector,
body .upload-control {
    background: #292929 !important;
    border-color: #626262 !important;
    color: #d8d8d8 !important;
}

/* Elementos internos habituales del selector personalizado. */
body .file-picker *,
body .file-upload *,
body .custom-file *,
body .file-select *,
body .file-selector *,
body .upload-control * {
    color: inherit;
}

/* Mantener el botón del selector con la identidad naranja. */
body .file-picker button,
body .file-upload button,
body .custom-file button,
body .file-select button,
body .file-selector button,
body .upload-control button,
body label[for="resume"] .file-button,
body label[for="cv"] .file-button {
    background: #f7941d !important;
    color: #171717 !important;
}

/* Auditoría V2-B:
   centra el indicador 01-05 respecto a cada tarjeta y a su texto. */
.process-visual-section .process-flow li {
    position: relative !important;
    text-align: center !important;
}

.process-visual-section .process-flow li > span:first-child {
    position: absolute !important;
    left: 50% !important;
    right: auto !important;
    top: 18px !important;
    margin: 0 !important;
    transform: translateX(-50%) !important;
}

/* ==========================================================
   R18 - Proceso visual de los 3 servicios
   Corrige definitivamente el solapamiento de los círculos 01-05
   ========================================================== */

/*
 * Las tres páginas (Asesoría, Auditoría y Capacitación) usan el mismo
 * markup .process-flow: span + strong + small.
 * En lugar de posicionar el círculo de forma absoluta, lo integramos
 * al flujo normal de la tarjeta para que nunca se monte sobre el título.
 */
.process-visual-section .process-flow li{
    position:relative !important;
    display:flex !important;
    flex-direction:column !important;
    align-items:center !important;
    justify-content:flex-start !important;
    text-align:center !important;
    min-height:170px !important;
    padding:20px 18px 18px !important;
    box-sizing:border-box !important;
}

.process-visual-section .process-flow li > span:first-child{
    position:static !important;
    left:auto !important;
    right:auto !important;
    top:auto !important;
    bottom:auto !important;
    transform:none !important;
    margin:0 auto 14px !important;
    flex:0 0 auto !important;
}

.process-visual-section .process-flow li > strong{
    display:block !important;
    margin:0 0 8px !important;
    line-height:1.25 !important;
    text-align:center !important;
}

.process-visual-section .process-flow li > small{
    display:block !important;
    margin:0 !important;
    line-height:1.45 !important;
    text-align:center !important;
}

/* La variante de Capacitación usa cuatro tarjetas, pero la geometría es la misma. */
.process-visual-section .process-flow-four li{
    min-height:170px !important;
}

@media(max-width:900px){
    .process-visual-section .process-flow li,
    .process-visual-section .process-flow-four li{
        min-height:auto !important;
        padding:20px 18px !important;
    }

    .process-visual-section .process-flow li > span:first-child{
        position:static !important;
        transform:none !important;
        margin:0 auto 14px !important;
    }
}

/* ==========================================================
   R19 - Línea de conexión + numeración visible en procesos
   Asesoría / Auditoría / Capacitación
   ========================================================== */

/*
 * En V2-A la línea pasa por el centro de los círculos.
 * En V2-B las tarjetas oscuras la estaban ocultando y el número
 * naranja tenía poco contraste sobre el círculo naranja.
 */

/* Línea horizontal sobre las tarjetas, pero debajo de los círculos. */
.process-visual-section .process-flow::before{
    top:52px !important;
    left:8% !important;
    right:8% !important;
    height:2px !important;
    width:auto !important;
    background:linear-gradient(
        90deg,
        #f7941d 0%,
        #f7941d 72%,
        rgba(247,148,29,.35) 100%
    ) !important;
    z-index:2 !important;
}

/* Evita que cada tarjeta cree una capa que tape la línea. */
.process-visual-section .process-flow li{
    z-index:auto !important;
}

/* Círculos por encima de la línea. */
.process-visual-section .process-flow li > span:first-child{
    position:relative !important;
    z-index:3 !important;
    color:#171717 !important;
    background:#f7941d !important;
    border-color:#fff !important;
    font-weight:900 !important;
}

/* Títulos y descripciones permanecen encima de cualquier línea. */
.process-visual-section .process-flow li > strong,
.process-visual-section .process-flow li > small{
    position:relative !important;
    z-index:3 !important;
}

/* Móvil conserva la línea vertical del diseño original. */
@media(max-width:800px){
    .process-visual-section .process-flow::before{
        top:32px !important;
        bottom:32px !important;
        left:31px !important;
        right:auto !important;
        width:2px !important;
        height:auto !important;
        background:linear-gradient(
            180deg,
            #f7941d 0%,
            rgba(247,148,29,.35) 100%
        ) !important;
    }
}



/* ==========================================================
   R3.3 - Pulido visual + menú móvil
   2026-09-08
   ========================================================== */

/* 1-2. Trayectoria: 2011 legible sin competir con el texto */
.section-orange-soft .experience-stat .experience-year{
    color:rgba(255,255,255,.28) !important;
    text-shadow:0 1px 0 rgba(255,255,255,.08) !important;
}

/* 3. Home: tarjetas de servicios más compactas */
#servicios .service-card{
    padding:24px 26px 25px !important;
}

#servicios .service-card .service-number{
    margin:3px 0 17px !important;
}

#servicios .service-card h3{
    margin-bottom:8px !important;
}

#servicios .service-card p{
    margin-top:0 !important;
    margin-bottom:14px !important;
}

/* 4. Procesos: la línea empieza/termina en el centro de los círculos extremos.
   Asesoría/Auditoría usan 5 pasos; Capacitación usa 4. */
@media(min-width:801px){
    .process-visual-section .process-flow:not(.process-flow-four)::before{
        left:10% !important;
        right:10% !important;
    }

    .process-visual-section .process-flow-four::before{
        left:12.5% !important;
        right:12.5% !important;
    }
}

/* 6. Logo: halo claro muy sutil para separar el wordmark negro del grafito */
.site-header .brand img,
header .brand img{
    filter:
        drop-shadow(0 0 1px rgba(255,255,255,.82))
        drop-shadow(0 0 2px rgba(255,255,255,.24)) !important;
}

/* 7. Nosotros: Comprender / Alinear / Fortalecer con altura natural */
.process-grid-compact article{
    min-height:0 !important;
    padding:25px 28px 27px !important;
}

.process-grid-compact article > span:first-child{
    display:block !important;
    margin-bottom:13px !important;
}

.process-grid-compact article h3{
    margin-top:0 !important;
    margin-bottom:9px !important;
}

.process-grid-compact article p{
    margin-top:0 !important;
    margin-bottom:0 !important;
}

/* 8-9. Menú móvil V2-B:
   fondo grafito, texto visible, overlay de viewport y bloqueo del fondo. */
@media(max-width:1020px){
    .nav-toggle span{
        background:#f4f4f4 !important;
    }

    .main-nav{
        background:
            linear-gradient(180deg,#292929 0%,#202020 100%) !important;
        border-bottom:1px solid #555 !important;
        box-shadow:0 16px 34px rgba(0,0,0,.38) !important;
    }

    .main-nav.is-open{
        position:fixed !important;
        top:86px !important;
        left:0 !important;
        right:0 !important;
        bottom:0 !important;
        z-index:49 !important;
        display:block !important;
        overflow-y:auto !important;
        overscroll-behavior:contain !important;
        -webkit-overflow-scrolling:touch;
    }

    .main-nav.is-open ul{
        width:min(var(--container), calc(100% - 40px)) !important;
        margin:0 auto !important;
        padding:18px 0 28px !important;
    }

    .main-nav.is-open a{
        display:block !important;
        padding:13px 4px !important;
        color:#f4f4f4 !important;
        border-bottom:1px solid rgba(255,255,255,.08) !important;
        text-shadow:none !important;
    }

    .main-nav.is-open a:hover,
    .main-nav.is-open a:focus-visible,
    .main-nav.is-open a[aria-current="page"]{
        color:#ff9a28 !important;
    }

    html:has(.main-nav.is-open),
    body:has(.main-nav.is-open){
        overflow:hidden !important;
    }
}

@media(max-width:620px){
    .main-nav.is-open{
        top:76px !important;
    }

    .process-grid-compact article{
        padding:22px 24px 24px !important;
    }

    .process-grid-compact article > span:first-child{
        margin-bottom:11px !important;
    }

    .process-grid-compact article h3{
        margin-bottom:8px !important;
    }
}


/* ==========================================================
   R3.3.1 - Hotfix menú móvil iOS / Safari
   Evita position:fixed dentro del header con backdrop-filter,
   que puede impedir que el panel desplegable se renderice.
   ========================================================== */
@media(max-width:1020px){
    .site-header{
        overflow:visible !important;
    }

    .main-nav.is-open{
        position:absolute !important;
        top:100% !important;
        left:0 !important;
        right:0 !important;
        bottom:auto !important;
        z-index:999 !important;
        display:block !important;
        height:calc(100dvh - 86px) !important;
        max-height:calc(100dvh - 86px) !important;
        overflow-y:auto !important;
        overscroll-behavior:contain !important;
        -webkit-overflow-scrolling:touch !important;
        background:linear-gradient(180deg,#292929 0%,#202020 100%) !important;
    }
}

@media(max-width:620px){
    .main-nav.is-open{
        top:100% !important;
        height:calc(100dvh - 76px) !important;
        max-height:calc(100dvh - 76px) !important;
    }
}


/* ==========================================================
   R3.4 - Compactación de page-hero en móvil
   Nosotros / Clientes / Asesoría / Auditoría / Capacitación
   ========================================================== */
@media(max-width:700px){
    .page-hero{
        min-height:0 !important;
        height:auto !important;
        padding-top:54px !important;
        padding-bottom:54px !important;
    }

    .page-hero .container,
    .page-hero .container.narrow{
        min-height:0 !important;
    }

    .page-hero .eyebrow{
        margin-top:0 !important;
        margin-bottom:14px !important;
    }

    .page-hero h1{
        margin-top:0 !important;
        margin-bottom:20px !important;
    }

    .page-hero .page-lead{
        margin-top:0 !important;
        margin-bottom:0 !important;
    }
}

@media(max-width:480px){
    .page-hero{
        padding-top:44px !important;
        padding-bottom:46px !important;
    }

    .page-hero .eyebrow{
        margin-bottom:12px !important;
    }

    .page-hero h1{
        margin-bottom:18px !important;
    }
}


/* R3.6 - Accesibilidad: skip link y foco de formularios */
.skip-link:focus,
.skip-link:focus-visible{
    left:16px !important;
    top:16px !important;
    z-index:2000 !important;
    padding:10px 14px !important;
    background:#242424 !important;
    color:#fff !important;
    border:3px solid var(--b3-orange) !important;
    border-radius:6px !important;
    outline:3px solid #fff !important;
    outline-offset:2px !important;
}

.contact-form input:focus-visible,
.contact-form select:focus-visible,
.contact-form textarea:focus-visible,
.jobs-form input:focus-visible,
.jobs-form select:focus-visible,
.jobs-form textarea:focus-visible{
    outline:3px solid var(--b3-orange) !important;
    outline-offset:2px !important;
}