/* =====================================================
COLORES DACROM
===================================================== */

:root {

    --navy: #031521;
    --navy2: #061f31;
    --navy3: #0a3048;

    --gold: #b59650;
    --gold2: #d6bd7a;
    --gold3: #8e7138;

    --cream: #f5f0e7;

    --white: #ffffff;

    --light: #c5d0d6;

}


/* =====================================================
RESET
===================================================== */

* {

    margin: 0;
    padding: 0;

    box-sizing: border-box;

}


html {

    scroll-behavior: smooth;

    scroll-padding-top: 90px;

}


body {

    min-height: 100vh;

    overflow-x: hidden;

    font-family:
        "Montserrat",
        sans-serif;

    background:
        var(--navy);

    color:
        white;

}


a {

    color: inherit;

    text-decoration: none;

}


img {

    display: block;

    max-width: 100%;

}


button,
input,
textarea,
select {

    font: inherit;

}


button {

    cursor: pointer;

}


.container {

    width:
        min(1220px, 91%);

    margin:
        0 auto;

}



/* =====================================================
HEADER
===================================================== */

.header {

    position: fixed;

    top: 0;
    left: 0;

    width: 100%;

    z-index: 1000;

    background:
        rgba(2, 17, 28, .94);

    backdrop-filter:
        blur(18px);

    -webkit-backdrop-filter:
        blur(18px);

    border-bottom:
        1px solid rgba(214,189,122,.15);

}


.header-container {

    min-height:
        82px;

    display:
        flex;

    align-items:
        center;

    justify-content:
        space-between;

    gap:
        25px;

}


.logo {

    width:
        150px;

    flex-shrink:
        0;

    animation:
        logoFloat
        4s
        ease-in-out
        infinite;

}


.logo img {

    width:
        100%;

    filter:
        drop-shadow(
            0 8px 18px
            rgba(0,0,0,.35)
        );

}


@keyframes logoFloat {

    0%,
    100% {

        transform:
            translateY(0);

    }

    50% {

        transform:
            translateY(-4px);

    }

}


.nav {

    display:
        flex;

    align-items:
        center;

    gap:
        24px;

}


.nav a {

    position:
        relative;

    padding:
        31px 0;

    color:
        #e4ebee;

    font-size:
        10px;

    font-weight:
        600;

    transition:
        .3s ease;

}


.nav a::after {

    content:
        "";

    position:
        absolute;

    left:
        0;

    bottom:
        22px;

    width:
        0;

    height:
        1px;

    background:
        var(--gold2);

    transition:
        .3s ease;

}


.nav a:hover {

    color:
        var(--gold2);

}


.nav a:hover::after {

    width:
        100%;

}


.header-actions {

    display:
        flex;

    align-items:
        center;

    gap:
        9px;

}


.language-box {

    height:
        38px;

    padding:
        0 9px;

    display:
        flex;

    align-items:
        center;

    gap:
        6px;

    border:
        1px solid rgba(214,189,122,.28);

    background:
        rgba(255,255,255,.015);

}


.language-box i {

    color:
        var(--gold2);

}


.language-box select {

    border:
        none;

    outline:
        none;

    background:
        transparent;

    color:
        white;

    font-size:
        9px;

    font-weight:
        700;

}


.language-box option {

    background:
        var(--navy);

}


.header-button {

    padding:
        14px 17px;

    display:
        flex;

    align-items:
        center;

    gap:
        8px;

    background:
        linear-gradient(
            135deg,
            var(--gold2),
            var(--gold)
        );

    color:
        var(--navy);

    font-size:
        8px;

    font-weight:
        800;

    text-transform:
        uppercase;

    transition:
        .3s ease;

}


.header-button:hover {

    transform:
        translateY(-2px);

    box-shadow:
        0 8px 25px
        rgba(181,150,80,.20);

}


.menu-toggle {

    display:
        none;

    width:
        40px;

    height:
        40px;

    align-items:
        center;

    justify-content:
        center;

    border:
        1px solid var(--gold);

    background:
        transparent;

    color:
        white;

}



/* =====================================================
PORTADA
IMAGEN: img/hero.jpg

ESTA ES LA PARTE ACTUALIZADA
PARA QUE LA NUEVA FOTO SE VEA MEJOR
===================================================== */

.hero {

    position:
        relative;

    width:
        100%;

    min-height:
        720px;

    overflow:
        hidden;

    background-image:

        linear-gradient(
            90deg,

            rgba(2,15,25,.99) 0%,

            rgba(2,17,28,.97) 18%,

            rgba(2,20,32,.92) 32%,

            rgba(3,24,38,.73) 45%,

            rgba(3,24,38,.34) 62%,

            rgba(3,24,38,.10) 82%,

            rgba(3,24,38,.02) 100%
        ),

        url("./img/hero.jpg");

    background-size:
        cover;

    /*
    MOVEMOS LA FOTO PARA QUE LOS ASESORES
    QUEDEN MEJOR DEL CENTRO HACIA LA DERECHA
    */

    background-position:
        58% center;

    background-repeat:
        no-repeat;

}


.hero::before {

    content:
        "";

    position:
        absolute;

    inset:
        0;

    z-index:
        1;

    pointer-events:
        none;

    background:

        radial-gradient(
            circle at 72% 38%,
            rgba(214,189,122,.07),
            transparent 31%
        );

}


.hero-overlay {

    position:
        absolute;

    inset:
        0;

    z-index:
        1;

    pointer-events:
        none;

    background:

        linear-gradient(
            180deg,

            rgba(2,15,25,.03) 0%,

            rgba(2,15,25,.03) 48%,

            rgba(2,17,28,.38) 72%,

            rgba(2,17,28,.97) 100%
        );

}


.hero-container {

    position:
        relative;

    z-index:
        3;

    min-height:
        720px;

    padding:
        125px 0 150px;

    display:
        flex;

    align-items:
        center;

}


.hero-content {

    width:
        46%;

    max-width:
        610px;

    position:
        relative;

    z-index:
        4;

}


.small-label {

    display:
        flex;

    align-items:
        center;

    gap:
        14px;

    margin-bottom:
        23px;

}


.small-label > span {

    width:
        48px;

    height:
        1px;

    background:
        var(--gold);

}


.small-label p {

    color:
        var(--gold2);

    font-size:
        9px;

    font-weight:
        800;

    letter-spacing:
        2.7px;

}


.hero h1 {

    font-family:
        "Playfair Display",
        serif;

    font-size:
        clamp(
            54px,
            5.8vw,
            86px
        );

    line-height:
        .98;

    font-weight:
        500;

    letter-spacing:
        -1.8px;

    text-shadow:
        0 7px 30px
        rgba(0,0,0,.25);

}


.hero h1 strong {

    display:
        block;

    margin-top:
        4px;

    color:
        var(--gold2);

    font-weight:
        600;

}


.hero-description {

    max-width:
        575px;

    margin-top:
        27px;

    color:
        #d2dce1;

    font-size:
        12px;

    line-height:
        1.9;

    text-shadow:
        0 3px 15px
        rgba(0,0,0,.35);

}


.hero-buttons {

    margin-top:
        36px;

    display:
        flex;

    flex-wrap:
        wrap;

    gap:
        14px;

}


.btn-primary,
.btn-secondary,
.btn-dark {

    min-height:
        53px;

    padding:
        0 26px;

    display:
        inline-flex;

    align-items:
        center;

    justify-content:
        center;

    gap:
        18px;

    font-size:
        9px;

    font-weight:
        800;

    text-transform:
        uppercase;

    letter-spacing:
        .6px;

    transition:
        .35s ease;

}


.btn-primary {

    background:
        linear-gradient(
            135deg,
            var(--gold2),
            var(--gold)
        );

    color:
        var(--navy);

    border:
        1px solid transparent;

}


.btn-secondary {

    border:
        1px solid rgba(255,255,255,.32);

    background:
        rgba(2,17,28,.43);

    color:
        white;

    backdrop-filter:
        blur(6px);

}


.btn-dark {

    margin-top:
        30px;

    background:
        var(--navy);

    color:
        white;

}


.btn-primary:hover {

    transform:
        translateY(-4px);

    box-shadow:
        0 13px 35px
        rgba(181,150,80,.25);

}


.btn-secondary:hover {

    transform:
        translateY(-4px);

    border-color:
        var(--gold2);

    color:
        var(--gold2);

}


.btn-dark:hover {

    transform:
        translateY(-4px);

}


.hero-signature {

    margin-top:
        40px;

    display:
        flex;

    align-items:
        center;

    gap:
        15px;

}


.hero-signature span {

    width:
        45px;

    height:
        1px;

    background:
        var(--gold);

}


.hero-signature p {

    color:
        #93a5ae;

    font-size:
        8px;

    font-weight:
        700;

    letter-spacing:
        2.4px;

}



/* =====================================================
BARRA INFERIOR PORTADA
===================================================== */

.hero-services {

    position:
        absolute;

    left:
        0;

    bottom:
        0;

    width:
        100%;

    z-index:
        5;

    background:
        rgba(2,17,28,.92);

    backdrop-filter:
        blur(18px);

    -webkit-backdrop-filter:
        blur(18px);

    border-top:
        1px solid rgba(214,189,122,.18);

}


.hero-services-grid {

    display:
        grid;

    grid-template-columns:
        repeat(4,1fr);

}


.hero-service {

    min-height:
        102px;

    padding:
        23px 24px;

    display:
        flex;

    align-items:
        center;

    gap:
        17px;

    border-right:
        1px solid rgba(214,189,122,.13);

    transition:
        .3s ease;

}


.hero-service:last-child {

    border-right:
        none;

}


.hero-service:hover {

    background:
        rgba(214,189,122,.035);

}


.hero-service i {

    color:
        var(--gold2);

    font-size:
        22px;

}


.hero-service div {

    display:
        flex;

    flex-direction:
        column;

    gap:
        5px;

}


.hero-service strong {

    font-family:
        "Playfair Display",
        serif;

    font-size:
        16px;

}


.hero-service span {

    color:
        #8497a1;

    font-size:
        8px;

}



/* =====================================================
TÍTULOS GENERALES
===================================================== */

.section-label {

    color:
        var(--gold2);

    font-size:
        9px;

    font-weight:
        800;

    letter-spacing:
        3px;

}


.section-heading {

    max-width:
        730px;

    margin-bottom:
        60px;

}


.section-heading.centered {

    margin-left:
        auto;

    margin-right:
        auto;

    text-align:
        center;

}


.section-heading h2 {

    margin-top:
        14px;

    font-family:
        "Playfair Display",
        serif;

    font-size:
        clamp(
            38px,
            5vw,
            61px
        );

    line-height:
        1.05;

    color:
        var(--navy);

}


.section-heading h2 strong {

    display:
        block;

    color:
        var(--gold3);

}


.section-heading p {

    margin-top:
        20px;

    color:
        #627681;

    line-height:
        1.9;

    font-size:
        12px;

}


.section-heading.light h2 {

    color:
        white;

}


.section-heading.light h2 strong {

    color:
        var(--gold2);

}


.section-heading.light p {

    color:
        #a9b9c1;

}



/* =====================================================
NOSOTROS
RUTA: img/nosotros-bg.png
===================================================== */

.about {

    position:
        relative;

    padding:
        125px 0;

    overflow:
        hidden;

    background-image:
        url("./img/nosotros-bg.png");

    background-size:
        cover;

    background-position:
        center;

    background-repeat:
        no-repeat;

}


.about-overlay {

    position:
        absolute;

    inset:
        0;

    background:

        linear-gradient(
            90deg,

            rgba(245,240,231,.98) 0%,

            rgba(245,240,231,.94) 48%,

            rgba(245,240,231,.62) 100%
        );

}


.about-container {

    position:
        relative;

    z-index:
        2;

    display:
        grid;

    grid-template-columns:
        .85fr 1.15fr;

    gap:
        80px;

    align-items:
        center;

}


.about-text h2 {

    margin-top:
        13px;

    font-family:
        "Playfair Display",
        serif;

    color:
        var(--navy);

    font-size:
        clamp(
            38px,
            5vw,
            60px
        );

    line-height:
        1.06;

}


.about-text h2 strong {

    display:
        block;

    color:
        var(--gold3);

}


.about-text > p {

    margin-top:
        20px;

    color:
        #596d78;

    font-size:
        12px;

    line-height:
        1.9;

}


.about-cards {

    display:
        grid;

    grid-template-columns:
        repeat(3,1fr);

    gap:
        17px;

}


.about-card {

    min-height:
        305px;

    padding:
        34px 25px;

    color:
        white;

    background:
        rgba(3,21,33,.92);

    border:
        1px solid rgba(214,189,122,.40);

    backdrop-filter:
        blur(10px);

    box-shadow:
        0 18px 50px
        rgba(0,0,0,.12);

    transition:
        .4s ease;

}


.about-card:hover {

    transform:
        translateY(-9px);

    border-color:
        var(--gold2);

}


.card-icon {

    width:
        55px;

    height:
        55px;

    display:
        flex;

    align-items:
        center;

    justify-content:
        center;

    border:
        1px solid var(--gold);

    color:
        var(--gold2);

    font-size:
        20px;

}


.about-card h3 {

    margin-top:
        27px;

    font-family:
        "Playfair Display",
        serif;

    font-size:
        20px;

}


.about-card p {

    margin-top:
        15px;

    color:
        #a8b8c0;

    font-size:
        10px;

    line-height:
        1.85;

}



/* =====================================================
SOLUCIONES
RUTA: img/soluciones-bg.png
===================================================== */

.solutions {

    position:
        relative;

    padding:
        125px 0;

    overflow:
        hidden;

    background-image:
        url("./img/soluciones-bg.png");

    background-size:
        cover;

    background-position:
        center;

    background-repeat:
        no-repeat;

}


.solutions-overlay {

    position:
        absolute;

    inset:
        0;

    background:
        rgba(2,18,29,.86);

}


.section-content {

    position:
        relative;

    z-index:
        2;

}


.solutions-grid {

    display:
        grid;

    grid-template-columns:
        repeat(4,1fr);

    gap:
        18px;

}


.solution-card {

    min-height:
        300px;

    padding:
        32px 25px;

    display:
        flex;

    flex-direction:
        column;

    background:
        rgba(3,23,36,.80);

    border:
        1px solid rgba(214,189,122,.31);

    backdrop-filter:
        blur(12px);

    transition:
        .4s ease;

}


.solution-card:hover {

    transform:
        translateY(-8px);

    border-color:
        var(--gold2);

    box-shadow:
        0 20px 50px
        rgba(0,0,0,.18);

}


.solution-card > i {

    width:
        52px;

    height:
        52px;

    display:
        flex;

    align-items:
        center;

    justify-content:
        center;

    border:
        1px solid var(--gold);

    color:
        var(--gold2);

    font-size:
        20px;

}


.solution-card h3 {

    margin-top:
        24px;

    font-family:
        "Playfair Display",
        serif;

    font-size:
        21px;

}


.solution-card p {

    margin-top:
        13px;

    color:
        #a7b6be;

    font-size:
        10px;

    line-height:
        1.8;

}


.solution-card a {

    margin-top:
        auto;

    padding-top:
        25px;

    display:
        flex;

    align-items:
        center;

    justify-content:
        space-between;

    border-top:
        1px solid rgba(255,255,255,.09);

    color:
        var(--gold2);

    font-size:
        8px;

    font-weight:
        800;

    text-transform:
        uppercase;

}



/* =====================================================
INDUSTRIAS
RUTA: img/industrias-bg.png
===================================================== */

.industries {

    position:
        relative;

    padding:
        125px 0;

    overflow:
        hidden;

    background-image:
        url("./img/industrias-bg.png");

    background-size:
        cover;

    background-position:
        center;

    background-repeat:
        no-repeat;

}


.industries-overlay {

    position:
        absolute;

    inset:
        0;

    background:

        linear-gradient(
            90deg,

            rgba(2,17,28,.95),

            rgba(3,25,39,.80)
        );

}


.industries-grid {

    display:
        grid;

    grid-template-columns:
        repeat(4,1fr);

    gap:
        18px;

}


.industry-card {

    position:
        relative;

    min-height:
        315px;

    padding:
        35px 27px;

    background:
        rgba(3,21,33,.74);

    border:
        1px solid rgba(214,189,122,.33);

    backdrop-filter:
        blur(10px);

    transition:
        .4s ease;

}


.industry-card:hover {

    transform:
        translateY(-8px);

    border-color:
        var(--gold2);

}


.industry-card > span {

    position:
        absolute;

    top:
        22px;

    right:
        24px;

    color:
        rgba(214,189,122,.45);

    font-family:
        "Playfair Display",
        serif;

    font-size:
        28px;

}


.industry-card > i {

    margin-top:
        35px;

    color:
        var(--gold2);

    font-size:
        29px;

}


.industry-card h3 {

    margin-top:
        30px;

    font-family:
        "Playfair Display",
        serif;

    font-size:
        21px;

}


.industry-card p {

    margin-top:
        15px;

    color:
        #9eafb8;

    font-size:
        10px;

    line-height:
        1.85;

}



/* =====================================================
POR QUÉ DACROM
===================================================== */

.why {

    padding:
        125px 0;

    background:
        var(--cream);

}


.why-grid {

    display:
        grid;

    grid-template-columns:
        repeat(4,1fr);

    gap:
        18px;

}


.why-card {

    min-height:
        290px;

    padding:
        36px 28px;

    background:
        white;

    border:
        1px solid rgba(181,150,80,.25);

    color:
        var(--navy);

    transition:
        .4s ease;

}


.why-card:hover {

    transform:
        translateY(-8px);

    border-color:
        var(--gold);

    box-shadow:
        0 20px 50px
        rgba(3,21,33,.08);

}


.why-card i {

    color:
        var(--gold);

    font-size:
        28px;

}


.why-card h3 {

    margin-top:
        27px;

    font-family:
        "Playfair Display",
        serif;

    font-size:
        21px;

}


.why-card p {

    margin-top:
        15px;

    color:
        #667983;

    font-size:
        10px;

    line-height:
        1.85;

}



/* =====================================================
MÉTODO
RUTA: img/metodo-bg.png
===================================================== */

.method {

    position:
        relative;

    padding:
        125px 0;

    overflow:
        hidden;

    background-image:
        url("./img/metodo-bg.png");

    background-size:
        cover;

    background-position:
        center;

    background-repeat:
        no-repeat;

}


.method-overlay {

    position:
        absolute;

    inset:
        0;

    background:
        rgba(245,240,231,.85);

}


.method-content {

    position:
        relative;

    z-index:
        2;

}


.method-grid {

    display:
        grid;

    grid-template-columns:
        repeat(6,1fr);

    gap:
        13px;

}


.method-step {

    min-height:
        285px;

    padding:
        27px 17px;

    text-align:
        center;

    color:
        var(--navy);

    background:
        rgba(255,255,255,.82);

    border:
        1px solid rgba(181,150,80,.45);

    backdrop-filter:
        blur(8px);

    transition:
        .4s ease;

}


.method-step:hover {

    transform:
        translateY(-8px);

    box-shadow:
        0 20px 45px
        rgba(3,21,33,.09);

}


.method-step > span {

    width:
        44px;

    height:
        44px;

    margin:
        0 auto;

    display:
        flex;

    align-items:
        center;

    justify-content:
        center;

    border:
        1px solid var(--gold);

    border-radius:
        50%;

    color:
        var(--gold3);

    font-size:
        9px;

    font-weight:
        800;

}


.method-step > i {

    margin-top:
        28px;

    color:
        var(--gold);

    font-size:
        27px;

}


.method-step h3 {

    margin-top:
        23px;

    font-family:
        "Playfair Display",
        serif;

    font-size:
        18px;

}


.method-step p {

    margin-top:
        9px;

    color:
        #647781;

    font-size:
        9px;

    line-height:
        1.7;

}



/* =====================================================
INTELLIGENCE
RUTA: img/intelligence-bg.png
===================================================== */

.intelligence {

    position:
        relative;

    min-height:
        760px;

    padding:
        120px 0;

    overflow:
        hidden;

    display:
        flex;

    align-items:
        center;

    background-image:
        url("./img/intelligence-bg.png");

    background-size:
        cover;

    background-position:
        center;

    background-repeat:
        no-repeat;

}


.intelligence-overlay {

    position:
        absolute;

    inset:
        0;

    background:

        linear-gradient(
            90deg,

            rgba(2,16,27,.98) 0%,

            rgba(3,23,36,.93) 36%,

            rgba(3,25,39,.48) 65%,

            rgba(2,16,27,.08) 100%
        );

}


.intelligence-container {

    position:
        relative;

    z-index:
        2;

}


.intelligence-text {

    max-width:
        590px;

}


.intelligence-text h2 {

    font-family:
        "Playfair Display",
        serif;

    font-size:
        clamp(
            50px,
            6vw,
            80px
        );

    line-height:
        .96;

}


.intelligence-text h2 strong {

    display:
        block;

    color:
        var(--gold2);

}


.intelligence-text h3 {

    margin-top:
        24px;

    font-size:
        18px;

}


.intelligence-text > p {

    margin-top:
        20px;

    color:
        #bac8cf;

    font-size:
        12px;

    line-height:
        1.9;

}


.intelligence-features {

    margin:
        35px 0;

    display:
        grid;

    grid-template-columns:
        repeat(2,1fr);

    gap:
        12px;

}


.intelligence-features div {

    padding:
        15px 17px;

    display:
        flex;

    align-items:
        center;

    gap:
        12px;

    border:
        1px solid rgba(214,189,122,.20);

    background:
        rgba(255,255,255,.03);

    color:
        #c1ced4;

    font-size:
        10px;

}


.intelligence-features i {

    color:
        var(--gold2);

}



/* =====================================================
CTA
===================================================== */

.cta {

    padding:
        75px 0;

    background:

        linear-gradient(
            135deg,
            var(--gold2),
            var(--gold)
        );

    color:
        var(--navy);

}


.cta-container {

    display:
        flex;

    align-items:
        center;

    justify-content:
        space-between;

    gap:
        40px;

}


.cta span {

    font-size:
        9px;

    font-weight:
        800;

    letter-spacing:
        2px;

}


.cta h2 {

    margin-top:
        10px;

    font-family:
        "Playfair Display",
        serif;

    font-size:
        clamp(
            30px,
            4vw,
            46px
        );

}


.cta h2 strong {

    display:
        block;

}


.cta-button {

    min-height:
        55px;

    padding:
        0 27px;

    display:
        flex;

    align-items:
        center;

    justify-content:
        center;

    gap:
        18px;

    background:
        var(--navy);

    color:
        white;

    font-size:
        9px;

    font-weight:
        800;

    text-transform:
        uppercase;

    transition:
        .35s ease;

}


.cta-button:hover {

    transform:
        translateY(-4px);

}



/* =====================================================
CONTACTO
===================================================== */

.contact {

    padding:
        125px 0;

    background:
        var(--navy);

}


.contact-grid {

    display:
        grid;

    grid-template-columns:
        .75fr 1.25fr;

    gap:
        75px;

    align-items:
        center;

}


.contact-info h2 {

    margin-top:
        14px;

    font-family:
        "Playfair Display",
        serif;

    font-size:
        clamp(
            40px,
            5vw,
            60px
        );

}


.contact-info h2 strong {

    display:
        block;

    color:
        var(--gold2);

}


.contact-info > p {

    margin:
        25px 0 35px;

    color:
        #9cabb4;

    font-size:
        12px;

    line-height:
        1.9;

}


.contact-item {

    margin-top:
        18px;

    padding:
        16px;

    display:
        flex;

    align-items:
        center;

    gap:
        16px;

    border:
        1px solid rgba(214,189,122,.16);

    transition:
        .3s ease;

}


.contact-item:hover {

    border-color:
        var(--gold);

    transform:
        translateX(5px);

}


.contact-icon {

    width:
        48px;

    height:
        48px;

    flex-shrink:
        0;

    display:
        flex;

    align-items:
        center;

    justify-content:
        center;

    border:
        1px solid var(--gold);

    color:
        var(--gold2);

    font-size:
        19px;

}


.contact-item div:last-child {

    display:
        flex;

    flex-direction:
        column;

    gap:
        5px;

}


.contact-item span {

    color:
        #80939d;

    font-size:
        8px;

    text-transform:
        uppercase;

}


.contact-item strong {

    font-size:
        11px;

}



/* =====================================================
FORMULARIO COTIZACIÓN
===================================================== */

.quote-form {

    padding:
        48px;

    background:
        rgba(255,255,255,.035);

    border:
        1px solid rgba(214,189,122,.25);

    box-shadow:
        0 25px 70px
        rgba(0,0,0,.18);

}


.form-heading {

    margin-bottom:
        30px;

}


.form-heading > span {

    color:
        var(--gold2);

    font-size:
        8px;

    font-weight:
        800;

    letter-spacing:
        2px;

}


.form-heading h3 {

    margin-top:
        10px;

    font-family:
        "Playfair Display",
        serif;

    font-size:
        29px;

}


.form-heading p {

    margin-top:
        10px;

    color:
        #8799a3;

    font-size:
        10px;

    line-height:
        1.7;

}


.form-row {

    display:
        grid;

    grid-template-columns:
        repeat(2,1fr);

    gap:
        14px;

}


.input-group {

    margin-bottom:
        16px;

}


.input-group label {

    display:
        block;

    margin-bottom:
        8px;

    color:
        #b9c5cb;

    font-size:
        9px;

    font-weight:
        600;

}


.input-group input,
.input-group select,
.input-group textarea {

    width:
        100%;

    padding:
        16px 17px;

    outline:
        none;

    border:
        1px solid rgba(255,255,255,.12);

    background:
        rgba(255,255,255,.035);

    color:
        white;

    font-size:
        10px;

    transition:
        .3s ease;

}


.input-group input:focus,
.input-group select:focus,
.input-group textarea:focus {

    border-color:
        var(--gold);

    background:
        rgba(255,255,255,.055);

}


.input-group input::placeholder,
.input-group textarea::placeholder {

    color:
        #70848f;

}


.input-group select option {

    background:
        var(--navy);

}


.input-group textarea {

    resize:
        vertical;

}


.form-submit {

    width:
        100%;

    min-height:
        56px;

    margin-top:
        5px;

    display:
        flex;

    align-items:
        center;

    justify-content:
        center;

    gap:
        14px;

    border:
        none;

    background:

        linear-gradient(
            135deg,
            var(--gold2),
            var(--gold)
        );

    color:
        var(--navy);

    font-size:
        9px;

    font-weight:
        800;

    text-transform:
        uppercase;

    transition:
        .35s ease;

}


.form-submit:hover {

    transform:
        translateY(-3px);

    box-shadow:
        0 12px 35px
        rgba(181,150,80,.20);

}


.form-note {

    margin-top:
        16px;

    text-align:
        center;

    color:
        #6f838e;

    font-size:
        8px;

    line-height:
        1.6;

}



/* =====================================================
FOOTER
===================================================== */

.footer {

    padding:
        55px 0;

    background:
        #020f18;

    border-top:
        1px solid rgba(214,189,122,.13);

}


.footer-container {

    display:
        grid;

    grid-template-columns:
        1fr auto 1fr;

    gap:
        35px;

    align-items:
        center;

}


.footer-brand img {

    width:
        140px;

}


.footer-brand p {

    max-width:
        300px;

    margin-top:
        15px;

    color:
        #72858f;

    font-size:
        8px;

    line-height:
        1.7;

}


.footer-links {

    display:
        flex;

    flex-wrap:
        wrap;

    justify-content:
        center;

    gap:
        22px;

}


.footer-links a {

    color:
        #8ea0aa;

    font-size:
        8px;

    transition:
        .3s ease;

}


.footer-links a:hover {

    color:
        var(--gold2);

}


.footer-copy {

    text-align:
        right;

    color:
        #61747e;

    font-size:
        8px;

    line-height:
        1.8;

}



/* =====================================================
WHATSAPP FLOTANTE
===================================================== */

.whatsapp-floating {

    position:
        fixed;

    right:
        25px;

    bottom:
        25px;

    z-index:
        999;

    min-height:
        55px;

    padding:
        0 19px;

    display:
        flex;

    align-items:
        center;

    gap:
        10px;

    border-radius:
        50px;

    background:
        #25D366;

    color:
        white;

    box-shadow:
        0 10px 35px
        rgba(0,0,0,.30);

    font-size:
        10px;

    font-weight:
        800;

    transition:
        .35s ease;

}


.whatsapp-floating i {

    font-size:
        25px;

}


.whatsapp-floating:hover {

    transform:
        translateY(-5px)
        scale(1.03);

    box-shadow:
        0 16px 40px
        rgba(0,0,0,.38);

}



/* =====================================================
TABLET
===================================================== */

@media (max-width: 1100px) {


    .header-container {

        min-height:
            75px;

    }


    .logo {

        width:
            135px;

    }


    .nav {

        position:
            absolute;

        top:
            75px;

        left:
            4%;

        right:
            4%;

        display:
            none;

        flex-direction:
            column;

        align-items:
            stretch;

        gap:
            0;

        padding:
            15px;

        background:
            rgba(2,17,28,.98);

        border:
            1px solid rgba(214,189,122,.18);

        box-shadow:
            0 22px 45px
            rgba(0,0,0,.30);

    }


    .nav.active {

        display:
            flex;

    }


    .nav a {

        padding:
            16px 10px;

        border-bottom:
            1px solid rgba(255,255,255,.06);

    }


    .nav a::after {

        display:
            none;

    }


    .menu-toggle {

        display:
            flex;

    }


    /* PORTADA TABLET */

    .hero {

        min-height:
            760px;

        background-position:
            62% center;

    }


    .hero-container {

        min-height:
            760px;

        padding:
            120px 0 185px;

    }


    .hero-content {

        width:
            55%;

        max-width:
            550px;

    }


    .hero h1 {

        font-size:
            clamp(
                48px,
                7vw,
                68px
            );

    }


    .hero-services-grid {

        grid-template-columns:
            repeat(2,1fr);

    }


    .about-container {

        grid-template-columns:
            1fr;

        gap:
            60px;

    }


    .solutions-grid {

        grid-template-columns:
            repeat(2,1fr);

    }


    .industries-grid {

        grid-template-columns:
            repeat(2,1fr);

    }


    .why-grid {

        grid-template-columns:
            repeat(2,1fr);

    }


    .method-grid {

        grid-template-columns:
            repeat(3,1fr);

    }


    .contact-grid {

        grid-template-columns:
            1fr;

        gap:
            60px;

    }


    .footer-container {

        grid-template-columns:
            1fr;

        text-align:
            center;

    }


    .footer-brand img {

        margin:
            auto;

    }


    .footer-brand p {

        margin:
            15px auto 0;

    }


    .footer-copy {

        text-align:
            center;

    }


}



/* =====================================================
CELULAR
===================================================== */

@media (max-width: 700px) {


    .container {

        width:
            89%;

    }


    .header-container {

        min-height:
            70px;

    }


    .logo {

        width:
            112px;

    }


    .nav {

        top:
            70px;

    }


    .header-button {

        display:
            none;

    }


    /*
    PORTADA EN CELULAR

    OSCURECEMOS MÁS LA IMAGEN PORQUE
    EL TEXTO OCUPARÁ GRAN PARTE DEL ANCHO
    */

    .hero {

        min-height:
            auto;

        background-position:
            68% center;

    }


    .hero::before {

        background:
            rgba(2,16,27,.15);

    }


    .hero-overlay {

        background:

            linear-gradient(
                90deg,

                rgba(2,15,25,.96),

                rgba(2,15,25,.78)
            );

    }


    .hero-container {

        min-height:
            760px;

        padding:
            115px 0 150px;

    }


    .hero-content {

        width:
            100%;

        max-width:
            100%;

    }


    .small-label p {

        font-size:
            7px;

        letter-spacing:
            1.5px;

    }


    .small-label > span {

        width:
            28px;

    }


    .hero h1 {

        font-size:
            clamp(
                44px,
                13vw,
                58px
            );

        line-height:
            1;

    }


    .hero-description {

        max-width:
            100%;

        font-size:
            11px;

        line-height:
            1.8;

    }


    .hero-buttons {

        flex-direction:
            column;

    }


    .btn-primary,
    .btn-secondary,
    .btn-dark {

        width:
            100%;

    }


    .hero-signature {

        margin-top:
            30px;

    }


    .hero-signature p {

        font-size:
            7px;

        letter-spacing:
            1.4px;

    }


    .hero-services {

        position:
            relative;

    }


    .hero-services-grid {

        width:
            100%;

        grid-template-columns:
            1fr;

    }


    .hero-service {

        min-height:
            80px;

        border-right:
            none;

        border-bottom:
            1px solid rgba(214,189,122,.12);

    }


    .about,
    .solutions,
    .industries,
    .why,
    .method,
    .contact {

        padding:
            85px 0;

    }


    .about-overlay {

        background:
            rgba(245,240,231,.92);

    }


    .about-cards {

        grid-template-columns:
            1fr;

    }


    .about-card {

        min-height:
            240px;

    }


    .solutions-grid {

        grid-template-columns:
            1fr;

    }


    .industries-grid {

        grid-template-columns:
            1fr;

    }


    .industry-card {

        min-height:
            260px;

    }


    .why-grid {

        grid-template-columns:
            1fr;

    }


    .why-card {

        min-height:
            230px;

    }


    .method-grid {

        grid-template-columns:
            1fr;

    }


    .method-step {

        min-height:
            220px;

    }


    .intelligence {

        min-height:
            720px;

        padding:
            90px 0;

        background-position:
            68% center;

    }


    .intelligence-overlay {

        background:
            rgba(2,16,27,.87);

    }


    .intelligence-text h2 {

        font-size:
            46px;

    }


    .intelligence-features {

        grid-template-columns:
            1fr;

    }


    .cta-container {

        flex-direction:
            column;

        align-items:
            flex-start;

    }


    .cta-button {

        width:
            100%;

        justify-content:
            center;

    }


    .quote-form {

        padding:
            30px 21px;

    }


    .form-row {

        grid-template-columns:
            1fr;

        gap:
            0;

    }


    .contact-item {

        padding:
            14px 10px;

    }


    .contact-item strong {

        font-size:
            9px;

    }


    .whatsapp-floating {

        right:
            15px;

        bottom:
            15px;

        width:
            56px;

        height:
            56px;

        min-height:
            56px;

        padding:
            0;

        justify-content:
            center;

        border-radius:
            50%;

    }


    .whatsapp-floating span {

        display:
            none;

    }


}



/* =====================================================
CELULARES MUY PEQUEÑOS
===================================================== */

@media (max-width: 420px) {


    .logo {

        width:
            100px;

    }


    .language-box {

        padding:
            0 7px;

    }


    .hero h1 {

        font-size:
            42px;

    }


    .hero-container {

        min-height:
            700px;

        padding:
            110px 0 120px;

    }


    .contact-item strong {

        font-size:
            8px;

    }


}

/* =====================================================
ACTUALIZACIONES FINALES DACROM 2026
Fondos más visibles + tarjetas premium + noticias
Estas reglas reemplazan visualmente solo los estilos nuevos.
===================================================== */

/* =====================================================
PORTADA - MAYOR VISIBILIDAD DE hero.jpg
===================================================== */

.hero {
    position: relative;
    width: 100%;
    min-height: 720px;
    overflow: hidden;
    background-color: var(--navy);
    background-image: url("./img/hero.jpg");
    background-size: cover;
    background-position: center center;
    background-repeat: no-repeat;
}

.hero::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    bottom: 0;
    width: 58%;
    z-index: 1;
    pointer-events: none;
    background: linear-gradient(
        90deg,
        rgba(2,15,25,.82) 0%,
        rgba(2,17,28,.68) 28%,
        rgba(2,18,30,.42) 55%,
        rgba(2,18,30,.16) 78%,
        transparent 100%
    );
}

.hero-overlay {
    position: absolute;
    inset: 0;
    z-index: 1;
    pointer-events: none;
    background: linear-gradient(
        180deg,
        rgba(2,15,25,0) 0%,
        rgba(2,15,25,.02) 60%,
        rgba(2,17,28,.35) 82%,
        rgba(2,17,28,.68) 100%
    );
}

/* =====================================================
FONDOS MÁS VISIBLES
===================================================== */

.about,
.solutions,
.industries,
.method,
.intelligence {
    position: relative;
    overflow: hidden;
    background-repeat: no-repeat;
    background-size: cover;
}

.about-container,
.section-content,
.method-content,
.intelligence-container {
    position: relative;
    z-index: 2;
}

.about-overlay,
.solutions-overlay,
.industries-overlay,
.method-overlay,
.intelligence-overlay {
    position: absolute;
    inset: 0;
    z-index: 1;
    pointer-events: none;
}

/* NOSOTROS */
.about {
    background-image: url("./img/nosotros-bg.png");
    background-position: right center;
}

.about-overlay {
    background: linear-gradient(
        90deg,
        rgba(247,243,236,.84) 0%,
        rgba(247,243,236,.72) 28%,
        rgba(247,243,236,.48) 52%,
        rgba(247,243,236,.24) 76%,
        rgba(247,243,236,.10) 100%
    );
}

/* SOLUCIONES */
.solutions {
    background-image: url("./img/soluciones-bg.png");
    background-position: center center;
}

.solutions-overlay {
    background:
        linear-gradient(
            90deg,
            rgba(2,17,28,.69) 0%,
            rgba(2,17,28,.50) 28%,
            rgba(2,17,28,.28) 56%,
            rgba(2,17,28,.38) 78%,
            rgba(2,17,28,.58) 100%
        ),
        radial-gradient(
            circle at 78% 40%,
            rgba(214,189,122,.11),
            transparent 34%
        );
}

/* INDUSTRIAS */
.industries {
    background-image: url("./img/industrias-bg.png");
    background-position: center center;
}

.industries-overlay {
    background:
        linear-gradient(
            90deg,
            rgba(2,17,28,.72) 0%,
            rgba(2,17,28,.53) 30%,
            rgba(2,17,28,.27) 58%,
            rgba(2,17,28,.45) 82%,
            rgba(2,17,28,.63) 100%
        ),
        radial-gradient(
            circle at 82% 40%,
            rgba(214,189,122,.09),
            transparent 32%
        );
}

/* MÉTODO */
.method {
    background-image: url("./img/metodo-bg.png");
    background-position: right center;
}

.method-overlay {
    background: linear-gradient(
        90deg,
        rgba(248,244,236,.82) 0%,
        rgba(248,244,236,.69) 25%,
        rgba(248,244,236,.45) 50%,
        rgba(248,244,236,.23) 76%,
        rgba(248,244,236,.10) 100%
    );
}

/* INTELLIGENCE */
.intelligence {
    background-image: url("./img/intelligence-bg.png");
    background-position: center center;
}

.intelligence-overlay {
    background:
        linear-gradient(
            90deg,
            rgba(2,17,28,.74) 0%,
            rgba(2,17,28,.53) 30%,
            rgba(2,17,28,.26) 55%,
            rgba(2,17,28,.31) 77%,
            rgba(2,17,28,.58) 100%
        ),
        radial-gradient(
            circle at 66% 42%,
            rgba(214,189,122,.12),
            transparent 30%
        );
}

/* =====================================================
TARJETAS PREMIUM - MISMO LENGUAJE VISUAL
===================================================== */

.solutions-grid,
.industries-grid {
    gap: 22px;
}

.solution-card,
.about-card,
.industry-card,
.why-card {
    position: relative;
    overflow: hidden;
    border-radius: 18px;
    transition: transform .35s ease, border-color .35s ease, box-shadow .35s ease;
}

.solution-card,
.about-card,
.industry-card {
    background: linear-gradient(
        180deg,
        rgba(4,28,43,.84) 0%,
        rgba(2,20,31,.90) 100%
    );
    border: 1px solid rgba(214,189,122,.84);
    backdrop-filter: blur(4px);
    -webkit-backdrop-filter: blur(4px);
    box-shadow:
        0 18px 42px rgba(0,0,0,.25),
        inset 0 0 0 1px rgba(255,255,255,.025);
}

.solution-card::before,
.about-card::before,
.industry-card::before,
.why-card::before {
    content: "";
    position: absolute;
    inset: 0;
    pointer-events: none;
    background:
        radial-gradient(circle at top left, rgba(214,189,122,.08), transparent 29%),
        radial-gradient(circle at bottom right, rgba(255,255,255,.03), transparent 34%);
}

.solution-card:hover,
.about-card:hover,
.industry-card:hover,
.why-card:hover {
    transform: translateY(-8px);
    border-color: #e1c987;
    box-shadow:
        0 25px 55px rgba(0,0,0,.34),
        0 0 20px rgba(214,189,122,.10);
}

/* SOLUCIONES */
.solution-card {
    min-height: 390px;
    padding: 32px 30px 26px;
}

.solution-card > i {
    width: 68px;
    height: 68px;
    display: flex;
    align-items: center;
    justify-content: center;
    border: 2px solid rgba(214,189,122,.90);
    border-radius: 50%;
    color: var(--gold2);
    font-size: 25px;
    background: rgba(255,255,255,.015);
    box-shadow:
        0 0 0 6px rgba(214,189,122,.035),
        0 8px 20px rgba(0,0,0,.20);
}

.solution-card h3 {
    margin-top: 24px;
    color: white;
    font-family: "Montserrat", sans-serif;
    font-size: 20px;
    font-weight: 800;
    line-height: 1.2;
}

.solution-card p {
    margin-top: 16px;
    max-width: 95%;
    color: #c7d3d9;
    font-size: 13px;
    line-height: 1.7;
}

.solution-card a {
    margin-top: auto;
    padding-top: 26px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    border-top: none;
    color: var(--gold2);
    font-size: 10px;
    font-weight: 800;
    letter-spacing: .6px;
    text-transform: uppercase;
}

.solution-card a > i {
    width: 52px;
    height: 52px;
    flex-shrink: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    border: 2px solid rgba(214,189,122,.85);
    border-radius: 50%;
    color: white;
    font-size: 19px;
    background: rgba(255,255,255,.02);
    transition: .3s ease;
}

.solution-card:hover a > i {
    transform: translateX(3px);
    background: rgba(214,189,122,.14);
    border-color: #e7cf8f;
}

/* NOSOTROS */
.about-card {
    min-height: 300px;
    padding: 30px 26px;
}

.about-card .card-icon,
.why-card > i,
.industry-card > i {
    width: 62px;
    height: 62px;
    display: flex;
    align-items: center;
    justify-content: center;
    border: 2px solid rgba(214,189,122,.90);
    border-radius: 50%;
    color: var(--gold2);
    background: rgba(255,255,255,.02);
    font-size: 22px;
}

.about-card h3,
.industry-card h3,
.why-card h3 {
    margin-top: 22px;
    color: white;
    font-family: "Montserrat", sans-serif;
    font-size: 20px;
    font-weight: 800;
}

.about-card p,
.industry-card p,
.why-card p {
    margin-top: 14px;
    color: #c7d3d9;
    font-size: 13px;
    line-height: 1.7;
}

/* INDUSTRIAS */
.industry-card {
    min-height: 320px;
    padding: 28px 26px;
}

.industry-card > span {
    top: 20px;
    right: 22px;
    color: rgba(214,189,122,.58);
    font-family: "Montserrat", sans-serif;
    font-size: 18px;
    font-weight: 800;
}

.industry-card > i {
    margin-top: 24px;
}

/* POR QUÉ DACROM */
.why-card {
    min-height: 280px;
    padding: 30px 25px;
    background: linear-gradient(
        180deg,
        rgba(4,28,43,.96),
        rgba(2,20,31,.99)
    );
    border: 1px solid rgba(214,189,122,.78);
    color: white;
    box-shadow: 0 16px 38px rgba(0,0,0,.14);
}

/* MÉTODO */
.method-grid {
    gap: 18px;
}

.method-step {
    position: relative;
    min-height: 265px;
    padding: 24px 18px;
    overflow: hidden;
    border-radius: 18px;
    background: linear-gradient(
        180deg,
        rgba(255,255,255,.90),
        rgba(247,243,235,.93)
    );
    border: 1px solid rgba(181,150,80,.58);
    backdrop-filter: blur(3px);
    -webkit-backdrop-filter: blur(3px);
    box-shadow: 0 14px 30px rgba(0,0,0,.10);
    transition: .35s ease;
}

.method-step:hover {
    transform: translateY(-8px);
    box-shadow: 0 21px 42px rgba(0,0,0,.14);
}

.method-step > span {
    width: 48px;
    height: 48px;
    margin: 0 auto;
    display: flex;
    align-items: center;
    justify-content: center;
    border: 2px solid rgba(181,150,80,.82);
    border-radius: 50%;
    color: var(--gold3);
    background: rgba(255,255,255,.88);
    font-size: 12px;
    font-weight: 800;
}

.method-step > i {
    width: 62px;
    height: 62px;
    margin: 18px auto 0;
    display: flex;
    align-items: center;
    justify-content: center;
    border: 2px solid rgba(181,150,80,.82);
    border-radius: 50%;
    color: var(--gold);
    background: rgba(255,255,255,.90);
    font-size: 23px;
    box-shadow: 0 8px 20px rgba(0,0,0,.07);
}

.method-step h3 {
    margin-top: 20px;
    color: var(--navy);
    font-family: "Montserrat", sans-serif;
    font-size: 18px;
    font-weight: 800;
}

.method-step p {
    margin-top: 11px;
    color: #5f6f79;
    font-size: 12px;
    line-height: 1.6;
}

.intelligence-features div {
    background: rgba(4,28,43,.50);
    border: 1px solid rgba(214,189,122,.28);
    backdrop-filter: blur(3px);
    -webkit-backdrop-filter: blur(3px);
}

/* =====================================================
NOTICIAS Y ACTUALIZACIONES
===================================================== */

.news-section {
    position: relative;
    padding: 120px 0;
    overflow: hidden;
    background:
        radial-gradient(circle at 85% 15%, rgba(181,150,80,.10), transparent 28%),
        linear-gradient(180deg, #041b2a 0%, #02131f 100%);
}

.news-section::before {
    content: "";
    position: absolute;
    top: 0;
    left: 50%;
    width: 90%;
    max-width: 1220px;
    height: 1px;
    transform: translateX(-50%);
    background: linear-gradient(90deg, transparent, rgba(214,189,122,.55), transparent);
}

.news-header {
    display: grid;
    grid-template-columns: 1fr .75fr;
    gap: 70px;
    align-items: end;
    margin-bottom: 55px;
}

.news-header h2 {
    margin-top: 12px;
    color: white;
    font-family: "Playfair Display", serif;
    font-size: clamp(40px,5vw,62px);
    line-height: 1;
}

.news-header h2 strong {
    display: block;
    color: var(--gold2);
}

.news-header > p {
    max-width: 520px;
    color: #9eafb8;
    font-size: 12px;
    line-height: 1.9;
}

.news-grid {
    display: grid;
    grid-template-columns: repeat(3,1fr);
    gap: 22px;
}

.news-card {
    position: relative;
    overflow: hidden;
    border: 1px solid rgba(214,189,122,.34);
    border-radius: 18px;
    background: rgba(5,29,43,.82);
    box-shadow: 0 18px 45px rgba(0,0,0,.22);
    transition: transform .4s ease, border-color .4s ease, box-shadow .4s ease;
}

.news-card:hover {
    transform: translateY(-9px);
    border-color: rgba(214,189,122,.82);
    box-shadow: 0 25px 60px rgba(0,0,0,.35);
}

.news-card-image {
    position: relative;
    height: 220px;
    overflow: hidden;
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
}

.news-card-image::after {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(180deg, rgba(2,17,28,.03), rgba(2,17,28,.64));
}

.news-image-1 { background-image: url("./img/soluciones-bg.png"); }
.news-image-2 { background-image: url("./img/industrias-bg.png"); }
.news-image-3 { background-image: url("./img/intelligence-bg.png"); }

.news-category {
    position: absolute;
    top: 18px;
    left: 18px;
    z-index: 2;
    padding: 9px 13px;
    border: 1px solid rgba(214,189,122,.58);
    background: rgba(2,17,28,.82);
    color: var(--gold2);
    font-size: 8px;
    font-weight: 800;
    letter-spacing: 1px;
    text-transform: uppercase;
    backdrop-filter: blur(8px);
}

.news-card-content {
    padding: 28px 27px 30px;
}

.news-meta {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 15px;
    margin-bottom: 18px;
}

.news-meta span {
    color: #778c97;
    font-size: 8px;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: .6px;
}

.news-meta i {
    margin-right: 5px;
    color: var(--gold);
}

.news-card h3 {
    color: white;
    font-family: "Playfair Display", serif;
    font-size: 23px;
    line-height: 1.2;
}

.news-card-content > p {
    margin-top: 16px;
    color: #a8b8c0;
    font-size: 11px;
    line-height: 1.8;
}

.news-link {
    margin-top: 28px;
    padding-top: 20px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    border-top: 1px solid rgba(255,255,255,.08);
    color: var(--gold2);
    font-size: 9px;
    font-weight: 800;
    letter-spacing: 1px;
    text-transform: uppercase;
}

.news-link i {
    width: 42px;
    height: 42px;
    display: flex;
    align-items: center;
    justify-content: center;
    border: 1px solid var(--gold);
    border-radius: 50%;
    color: white;
    transition: .3s ease;
}

.news-card:hover .news-link i {
    background: var(--gold);
    color: var(--navy);
    transform: translateX(3px);
}

.news-bottom {
    margin-top: 55px;
    padding-top: 35px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 40px;
    border-top: 1px solid rgba(214,189,122,.18);
}

.news-bottom span {
    color: var(--gold2);
    font-size: 8px;
    font-weight: 800;
    letter-spacing: 2px;
}

.news-bottom p {
    margin-top: 8px;
    color: #82959f;
    font-size: 10px;
}

.news-main-button {
    min-height: 52px;
    padding: 0 24px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 18px;
    background: linear-gradient(135deg, var(--gold2), var(--gold));
    color: var(--navy);
    font-size: 8px;
    font-weight: 800;
    text-transform: uppercase;
    transition: .3s ease;
}

.news-main-button:hover {
    transform: translateY(-4px);
    box-shadow: 0 12px 30px rgba(181,150,80,.20);
}

/* =====================================================
RESPONSIVE DE LAS ACTUALIZACIONES NUEVAS
===================================================== */

@media (max-width: 1100px) {

    .about,
    .solutions,
    .industries,
    .method,
    .intelligence {
        background-position: center center;
    }

    .news-header {
        grid-template-columns: 1fr;
        gap: 20px;
    }

    .news-grid {
        grid-template-columns: repeat(2,1fr);
    }

    .solutions-grid,
    .industries-grid {
        grid-template-columns: repeat(2,1fr);
    }

    .method-grid {
        grid-template-columns: repeat(3,1fr);
    }
}

@media (max-width: 700px) {

    .hero {
        min-height: auto;
        background-position: 66% center;
    }

    .hero::before {
        width: 100%;
        background: linear-gradient(
            90deg,
            rgba(2,15,25,.78) 0%,
            rgba(2,15,25,.58) 48%,
            rgba(2,15,25,.20) 100%
        );
    }

    .hero-overlay {
        background: linear-gradient(
            180deg,
            rgba(2,15,25,.03) 0%,
            rgba(2,15,25,.10) 65%,
            rgba(2,15,25,.65) 100%
        );
    }

    .about-overlay {
        background: linear-gradient(
            180deg,
            rgba(247,243,236,.84),
            rgba(247,243,236,.66),
            rgba(247,243,236,.32)
        );
    }

    .method-overlay {
        background: linear-gradient(
            180deg,
            rgba(248,244,236,.84),
            rgba(248,244,236,.65),
            rgba(248,244,236,.30)
        );
    }

    .solutions-overlay,
    .industries-overlay,
    .intelligence-overlay {
        background: linear-gradient(
            180deg,
            rgba(2,17,28,.72) 0%,
            rgba(2,17,28,.52) 50%,
            rgba(2,17,28,.72) 100%
        );
    }

    .solutions-grid,
    .industries-grid,
    .why-grid,
    .about-cards,
    .method-grid,
    .news-grid {
        grid-template-columns: 1fr;
    }

    .solution-card,
    .industry-card,
    .about-card,
    .why-card {
        min-height: auto;
    }

    .solution-card {
        padding: 28px 24px 22px;
    }

    .news-section {
        padding: 85px 0;
    }

    .news-card-image {
        height: 210px;
    }

    .news-bottom {
        flex-direction: column;
        align-items: flex-start;
    }

    .news-main-button {
        width: 100%;
    }
}

/* =========================================================
   DACROM - AJUSTES FINALES INTEGRADOS
   Mantiene todas las secciones anteriores y actualiza
   únicamente los elementos visuales solicitados.
========================================================= */

/* =========================================================
   PORTADA - MOSTRAR BARRA INFERIOR Y FOTO PROFESIONAL
========================================================= */
.hero {
    min-height: 620px;
    background-image: url("./img/hero.jpg");
    background-size: cover;
    background-position: center center;
    background-repeat: no-repeat;
}

.hero-container {
    min-height: 620px;
    padding: 105px 0 135px;
}

.hero::before {
    width: 58%;
    background: linear-gradient(
        90deg,
        rgba(2,15,25,.82) 0%,
        rgba(2,17,28,.68) 28%,
        rgba(2,18,30,.42) 55%,
        rgba(2,18,30,.16) 78%,
        transparent 100%
    );
}

.hero-overlay {
    background: linear-gradient(
        180deg,
        rgba(2,15,25,0) 0%,
        rgba(2,15,25,.02) 58%,
        rgba(2,17,28,.30) 78%,
        rgba(2,17,28,.72) 100%
    );
}

.hero-services {
    z-index: 10;
    background: rgba(2,17,28,.94);
    border-top: 1px solid rgba(214,189,122,.25);
    box-shadow: 0 -10px 30px rgba(0,0,0,.15);
}

.hero-service {
    min-height: 90px;
    padding: 20px 24px;
}

/* =========================================================
   FONDOS DE SECCIONES MÁS VISIBLES
========================================================= */
.about,
.solutions,
.industries,
.method,
.intelligence {
    position: relative;
    overflow: hidden;
    background-repeat: no-repeat;
    background-size: cover;
}

.about-container,
.section-content,
.method-content,
.intelligence-container {
    position: relative;
    z-index: 2;
}

.about-overlay,
.solutions-overlay,
.industries-overlay,
.method-overlay,
.intelligence-overlay {
    position: absolute;
    inset: 0;
    z-index: 1;
    pointer-events: none;
}

.about {
    background-image: url("./img/nosotros-bg.png");
    background-position: right center;
}
.about-overlay {
    background: linear-gradient(
        90deg,
        rgba(247,243,236,.84) 0%,
        rgba(247,243,236,.72) 28%,
        rgba(247,243,236,.48) 52%,
        rgba(247,243,236,.24) 76%,
        rgba(247,243,236,.10) 100%
    );
}

.solutions {
    background-image: url("./img/soluciones-bg.png");
    background-position: center center;
}
.solutions-overlay {
    background:
        linear-gradient(
            90deg,
            rgba(2,17,28,.66) 0%,
            rgba(2,17,28,.46) 28%,
            rgba(2,17,28,.24) 56%,
            rgba(2,17,28,.34) 78%,
            rgba(2,17,28,.55) 100%
        ),
        radial-gradient(circle at 78% 40%, rgba(214,189,122,.11), transparent 34%);
}

.industries {
    background-image: url("./img/industrias-bg.png");
    background-position: center center;
}
.industries-overlay {
    background:
        linear-gradient(
            90deg,
            rgba(2,17,28,.69) 0%,
            rgba(2,17,28,.49) 30%,
            rgba(2,17,28,.24) 58%,
            rgba(2,17,28,.41) 82%,
            rgba(2,17,28,.60) 100%
        ),
        radial-gradient(circle at 82% 40%, rgba(214,189,122,.09), transparent 32%);
}

.method {
    background-image: url("./img/metodo-bg.png");
    background-position: right center;
}
.method-overlay {
    background: linear-gradient(
        90deg,
        rgba(248,244,236,.80) 0%,
        rgba(248,244,236,.66) 25%,
        rgba(248,244,236,.42) 50%,
        rgba(248,244,236,.20) 76%,
        rgba(248,244,236,.08) 100%
    );
}

.intelligence {
    background-image: url("./img/intelligence-bg.png");
    background-position: center center;
}
.intelligence-overlay {
    background:
        linear-gradient(
            90deg,
            rgba(2,17,28,.72) 0%,
            rgba(2,17,28,.50) 30%,
            rgba(2,17,28,.23) 55%,
            rgba(2,17,28,.29) 77%,
            rgba(2,17,28,.55) 100%
        ),
        radial-gradient(circle at 66% 42%, rgba(214,189,122,.12), transparent 30%);
}

/* =========================================================
   OCHO IMÁGENES INDIVIDUALES DE SOLUCIONES
========================================================= */
.card-immex {
    background-image:
        linear-gradient(180deg, rgba(2,20,31,.28) 0%, rgba(2,20,31,.68) 48%, rgba(2,20,31,.98) 100%),
        url("./img/solucion-immex.png");
}
.card-compliance {
    background-image:
        linear-gradient(180deg, rgba(2,20,31,.28) 0%, rgba(2,20,31,.68) 48%, rgba(2,20,31,.98) 100%),
        url("./img/solucion-compliance.png");
}
.card-clasificacion {
    background-image:
        linear-gradient(180deg, rgba(2,20,31,.28) 0%, rgba(2,20,31,.68) 48%, rgba(2,20,31,.98) 100%),
        url("./img/solucion-clasificacion.png");
}
.card-origen {
    background-image:
        linear-gradient(180deg, rgba(2,20,31,.28) 0%, rgba(2,20,31,.68) 48%, rgba(2,20,31,.98) 100%),
        url("./img/solucion-origen.png");
}
.card-anexo24 {
    background-image:
        linear-gradient(180deg, rgba(2,20,31,.28) 0%, rgba(2,20,31,.68) 48%, rgba(2,20,31,.98) 100%),
        url("./img/solucion-anexo24.png");
}
.card-auditoria {
    background-image:
        linear-gradient(180deg, rgba(2,20,31,.28) 0%, rgba(2,20,31,.68) 48%, rgba(2,20,31,.98) 100%),
        url("./img/solucion-auditoria.png");
}
.card-regulaciones {
    background-image:
        linear-gradient(180deg, rgba(2,20,31,.28) 0%, rgba(2,20,31,.68) 48%, rgba(2,20,31,.98) 100%),
        url("./img/solucion-regulaciones.png");
}
.card-valoracion {
    background-image:
        linear-gradient(180deg, rgba(2,20,31,.28) 0%, rgba(2,20,31,.68) 48%, rgba(2,20,31,.98) 100%),
        url("./img/solucion-valoracion.png");
}

.card-immex,
.card-compliance,
.card-clasificacion,
.card-origen,
.card-anexo24,
.card-auditoria,
.card-regulaciones,
.card-valoracion {
    background-size: cover;
    background-position: center center;
    background-repeat: no-repeat;
}

/* =========================================================
   SISTEMA PREMIUM PARA TODOS LOS RECUADROS
========================================================= */
.about-card,
.solution-card,
.industry-card,
.why-card,
.method-step,
.news-card {
    position: relative;
    overflow: hidden;
    border-radius: 18px;
    border: 1px solid rgba(214,189,122,.78);
    box-shadow:
        0 15px 35px rgba(0,0,0,.24),
        inset 0 0 0 1px rgba(255,255,255,.025);
    transition:
        transform .38s ease,
        border-color .38s ease,
        box-shadow .38s ease;
}

.about-card:hover,
.solution-card:hover,
.industry-card:hover,
.why-card:hover,
.method-step:hover,
.news-card:hover {
    transform: translateY(-9px);
    border-color: rgba(230,205,137,1);
    box-shadow:
        0 24px 55px rgba(0,0,0,.38),
        0 0 24px rgba(181,150,80,.12),
        inset 0 0 0 1px rgba(255,255,255,.035);
}

/* SOLUCIONES */
.solutions-grid {
    display: grid;
    grid-template-columns: repeat(4,1fr);
    gap: 18px;
}

.solution-card {
    min-height: 390px;
    padding: 28px 27px 25px;
    display: flex;
    flex-direction: column;
    border-color: rgba(214,189,122,.88);
    backdrop-filter: blur(3px);
    -webkit-backdrop-filter: blur(3px);
}

.solution-card > i {
    width: 62px;
    height: 62px;
    flex-shrink: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    border: 1.5px solid var(--gold2);
    background: rgba(3,21,33,.78);
    color: var(--gold2);
    font-size: 22px;
    box-shadow: 0 0 18px rgba(214,189,122,.09);
}

.solution-card h3 {
    margin-top: 20px;
    color: #fff;
    font-family: "Montserrat", sans-serif;
    font-size: 19px;
    font-weight: 800;
    line-height: 1.2;
}

.solution-card p {
    margin-top: 12px;
    color: #c5d0d6;
    font-size: 11px;
    line-height: 1.72;
}

.solution-card a {
    position: relative;
    margin-top: auto;
    padding-top: 26px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 15px;
    border-top: none;
    color: var(--gold2);
    font-size: 9px;
    font-weight: 800;
    letter-spacing: 1px;
    text-transform: uppercase;
}

.solution-card a::before {
    content: "";
    position: absolute;
    left: 0;
    bottom: 46px;
    width: 45px;
    height: 1px;
    background: var(--gold2);
    opacity: .85;
}

.solution-card a > i {
    width: 46px;
    height: 46px;
    flex-shrink: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    border: 1.5px solid var(--gold2);
    border-radius: 50%;
    color: #fff;
    font-size: 17px;
    background: rgba(2,17,28,.62);
    transition: .3s ease;
}

.solution-card:hover a > i {
    background: var(--gold2);
    color: var(--navy);
    transform: translateX(3px);
}

/* NOSOTROS */
.about-card {
    min-height: 300px;
    padding: 30px 26px;
    color: #fff;
    background: linear-gradient(180deg, rgba(4,29,44,.92), rgba(2,20,31,.97));
}
.about-card .card-icon {
    width: 62px;
    height: 62px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    border: 1.5px solid var(--gold2);
    background: rgba(3,21,33,.75);
    color: var(--gold2);
    font-size: 21px;
}
.about-card h3 {
    margin-top: 23px;
    color: #fff;
    font-family: "Montserrat", sans-serif;
    font-weight: 800;
    font-size: 19px;
}
.about-card p {
    margin-top: 13px;
    color: #bdc9cf;
    font-size: 11px;
    line-height: 1.75;
}

/* INDUSTRIAS */
.industries-grid {
    display: grid;
    grid-template-columns: repeat(4,1fr);
    gap: 18px;
}
.industry-card {
    min-height: 340px;
    padding: 30px 27px;
    color: #fff;
    background: linear-gradient(180deg, rgba(4,29,44,.92), rgba(2,20,31,.97));
}
.industry-card > span {
    position: absolute;
    top: 20px;
    right: 22px;
    color: var(--gold2);
    font-family: "Montserrat", sans-serif;
    font-size: 17px;
    font-weight: 600;
    opacity: .86;
}
.industry-card > i {
    width: 62px;
    height: 62px;
    margin-top: 5px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    border: 1.5px solid var(--gold2);
    background: rgba(3,21,33,.76);
    color: var(--gold2);
    font-size: 21px;
}
.industry-card h3 {
    margin-top: 26px;
    color: #fff;
    font-family: "Montserrat", sans-serif;
    font-weight: 800;
    font-size: 19px;
}
.industry-card p {
    margin-top: 14px;
    color: #bdc9cf;
    font-size: 11px;
    line-height: 1.75;
}

/* POR QUÉ DACROM */
.why-card {
    min-height: 285px;
    padding: 30px 26px;
    color: #fff;
    background: linear-gradient(180deg, rgba(4,29,44,.95), rgba(2,20,31,.99));
}
.why-card > i {
    width: 62px;
    height: 62px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    border: 1.5px solid var(--gold2);
    background: rgba(3,21,33,.76);
    color: var(--gold2);
    font-size: 22px;
}
.why-card h3 {
    margin-top: 23px;
    color: #fff;
    font-family: "Montserrat", sans-serif;
    font-size: 19px;
    font-weight: 800;
}
.why-card p {
    margin-top: 13px;
    color: #bdc9cf;
    font-size: 11px;
    line-height: 1.75;
}

/* MÉTODO DACROM */
.method-grid {
    gap: 16px;
}
.method-step {
    min-height: 290px;
    padding: 25px 18px;
    color: #fff;
    text-align: left;
    background: linear-gradient(180deg, rgba(3,26,40,.94), rgba(2,18,29,.98));
}
.method-step > span {
    width: 45px;
    height: 45px;
    margin: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    border: 1.5px solid var(--gold2);
    border-radius: 50%;
    background: rgba(3,21,33,.75);
    color: var(--gold2);
    font-size: 11px;
    font-weight: 800;
}
.method-step > i {
    width: 56px;
    height: 56px;
    margin: 18px 0 0;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    border: 1.5px solid var(--gold2);
    background: rgba(3,21,33,.75);
    color: var(--gold2);
    font-size: 20px;
}
.method-step h3 {
    margin-top: 19px;
    color: #fff;
    font-family: "Montserrat", sans-serif;
    font-size: 17px;
    font-weight: 800;
}
.method-step p {
    margin-top: 9px;
    color: #bac7cd;
    font-size: 10px;
    line-height: 1.7;
}

/* INTELLIGENCE - MINI RECUADROS */
.intelligence-features div {
    min-height: 56px;
    padding: 16px 18px;
    border: 1px solid rgba(214,189,122,.58);
    border-radius: 12px;
    background: rgba(3,23,36,.74);
    backdrop-filter: blur(7px);
    -webkit-backdrop-filter: blur(7px);
    color: #d6dfe3;
    box-shadow: 0 10px 25px rgba(0,0,0,.18);
    transition: .3s ease;
}
.intelligence-features div:hover {
    transform: translateY(-4px);
    border-color: var(--gold2);
    background: rgba(3,23,36,.90);
}
.intelligence-features i {
    color: var(--gold2);
    font-size: 17px;
}

/* NOTICIAS */
.news-card {
    background: linear-gradient(180deg, rgba(4,29,44,.92), rgba(2,20,31,.98));
}
.news-card-image::after {
    background: linear-gradient(180deg, rgba(2,17,28,.08), rgba(2,17,28,.82));
}
.news-card-content h3 { color: #fff; }
.news-card-content > p { color: #bbc8ce; }
.news-link { color: var(--gold2); }

/* CONTACTO */
.contact-item {
    border: 1px solid rgba(214,189,122,.45);
    border-radius: 14px;
    background: linear-gradient(180deg, rgba(4,29,44,.75), rgba(2,20,31,.88));
    box-shadow: 0 10px 28px rgba(0,0,0,.14);
}
.contact-item:hover {
    border-color: var(--gold2);
    transform: translateX(6px);
    box-shadow: 0 15px 35px rgba(0,0,0,.23);
}
.contact-icon {
    border-radius: 50%;
    border: 1.5px solid var(--gold2);
    background: rgba(3,21,33,.76);
}

/* FORMULARIO */
.quote-form {
    border: 1px solid rgba(214,189,122,.48);
    border-radius: 20px;
    background: linear-gradient(180deg, rgba(4,29,44,.72), rgba(2,20,31,.91));
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
    box-shadow: 0 25px 60px rgba(0,0,0,.22);
}
.input-group input,
.input-group select,
.input-group textarea {
    border-radius: 10px;
    border: 1px solid rgba(214,189,122,.20);
}
.input-group input:focus,
.input-group select:focus,
.input-group textarea:focus {
    border-color: var(--gold2);
    box-shadow: 0 0 0 3px rgba(214,189,122,.06);
}

/* =========================================================
   RESPONSIVE FINAL
========================================================= */
@media (max-width: 1100px) {
    .hero {
        min-height: 650px;
        background-position: 60% center;
    }
    .hero-container {
        min-height: 650px;
        padding: 105px 0 170px;
    }
    .solutions-grid,
    .industries-grid {
        grid-template-columns: repeat(2,1fr);
    }
    .method-grid {
        grid-template-columns: repeat(3,1fr);
    }
    .about,
    .solutions,
    .industries,
    .method,
    .intelligence {
        background-position: center center;
    }
}

@media (max-width: 700px) {
    .hero {
        min-height: auto;
        background-position: 66% center;
    }
    .hero::before {
        width: 100%;
        background: linear-gradient(
            90deg,
            rgba(2,15,25,.78) 0%,
            rgba(2,15,25,.58) 48%,
            rgba(2,15,25,.20) 100%
        );
    }
    .hero-overlay {
        background: linear-gradient(
            180deg,
            rgba(2,15,25,.03) 0%,
            rgba(2,15,25,.10) 65%,
            rgba(2,15,25,.65) 100%
        );
    }
    .hero-services {
        position: relative;
    }
    .hero-services-grid,
    .solutions-grid,
    .industries-grid,
    .why-grid,
    .about-cards,
    .method-grid,
    .news-grid {
        grid-template-columns: 1fr;
    }
    .solution-card {
        min-height: 350px;
        padding: 26px 23px;
    }
    .about-card,
    .industry-card,
    .why-card,
    .method-step {
        min-height: auto;
    }
    .about-overlay {
        background: linear-gradient(
            180deg,
            rgba(247,243,236,.84),
            rgba(247,243,236,.66),
            rgba(247,243,236,.32)
        );
    }
    .method-overlay {
        background: linear-gradient(
            180deg,
            rgba(248,244,236,.84),
            rgba(248,244,236,.65),
            rgba(248,244,236,.30)
        );
    }
    .solutions-overlay,
    .industries-overlay,
    .intelligence-overlay {
        background: linear-gradient(
            180deg,
            rgba(2,17,28,.72) 0%,
            rgba(2,17,28,.52) 50%,
            rgba(2,17,28,.72) 100%
        );
    }
}


/* =========================================================
   IMÁGENES INDIVIDUALES - INDUSTRIAS
   ACTUALIZACIÓN FINAL
========================================================= */

.industry-card.industry-automotriz {
    background-image:
        linear-gradient(
            180deg,
            rgba(2,17,28,.16) 0%,
            rgba(2,17,28,.42) 38%,
            rgba(2,17,28,.82) 70%,
            rgba(2,17,28,.97) 100%
        ),
        url("./img/industria-automotriz.png");
}

.industry-card.industry-acero {
    background-image:
        linear-gradient(
            180deg,
            rgba(2,17,28,.16) 0%,
            rgba(2,17,28,.42) 38%,
            rgba(2,17,28,.82) 70%,
            rgba(2,17,28,.97) 100%
        ),
        url("./img/industria-acero-aluminio.png");
}

.industry-card.industry-manufactura {
    background-image:
        linear-gradient(
            180deg,
            rgba(2,17,28,.16) 0%,
            rgba(2,17,28,.42) 38%,
            rgba(2,17,28,.82) 70%,
            rgba(2,17,28,.97) 100%
        ),
        url("./img/industria-manufactura.png");
}

.industry-card.industry-operaciones {
    background-image:
        linear-gradient(
            180deg,
            rgba(2,17,28,.16) 0%,
            rgba(2,17,28,.42) 38%,
            rgba(2,17,28,.82) 70%,
            rgba(2,17,28,.97) 100%
        ),
        url("./img/industria-operaciones-especiales.png");
}

.industry-card.industry-automotriz,
.industry-card.industry-acero,
.industry-card.industry-manufactura,
.industry-card.industry-operaciones {
    background-size: cover;
    background-position: center center;
    background-repeat: no-repeat;
    background-color: #031521;
}

/* Oscurecimiento suave para mantener el texto legible */
.industry-card.industry-automotriz::before,
.industry-card.industry-acero::before,
.industry-card.industry-manufactura::before,
.industry-card.industry-operaciones::before {
    content: "";
    position: absolute;
    inset: 0;
    z-index: 1;
    pointer-events: none;
    background: linear-gradient(
        180deg,
        rgba(2,17,28,.03) 0%,
        rgba(2,17,28,.20) 34%,
        rgba(2,17,28,.60) 68%,
        rgba(2,17,28,.90) 100%
    );
}

.industry-card.industry-automotriz > *,
.industry-card.industry-acero > *,
.industry-card.industry-manufactura > *,
.industry-card.industry-operaciones > * {
    position: relative;
    z-index: 2;
}

/* =========================================================
   ACTUALIZACIONES FINALES DACROM
   - PORTADA: MOSTRAR MÁS DE LA IMAGEN
   - LOGO EN EL CENTRO DEL MUNDO DE INTELLIGENCE
   - MODALES PROFESIONALES PARA LAS 8 SOLUCIONES
========================================================= */

/* =========================================================
   PORTADA - ENCUADRE COMPLETO Y RESPONSIVE
========================================================= */

.hero {
    background-size: 100% auto;
    background-position: center top;
    background-repeat: no-repeat;
    background-color: var(--navy);
}

@media (min-width: 1200px) {
    .hero {
        min-height: 620px;
    }

    .hero-container {
        min-height: 620px;
        padding: 105px 0 135px;
    }
}

@media (max-width: 1199px) {
    .hero {
        background-size: cover;
        background-position: center center;
    }
}

/* =========================================================
   INTELLIGENCE - LOGO SOBRE EL CENTRO DEL MUNDO
========================================================= */

.intelligence-world-logo {
    position: absolute;
    z-index: 4;

    /* Ajustado para el globo actual de intelligence-bg.png */
    left: 60.5%;
    top: 48%;

    transform: translate(-50%, -50%);

    width: clamp(64px, 6vw, 104px);
    aspect-ratio: 1;

    display: flex;
    align-items: center;
    justify-content: center;

    border-radius: 50%;

    background: rgba(2, 17, 28, .52);
    border: 1px solid rgba(214, 189, 122, .48);

    box-shadow:
        0 0 0 10px rgba(214, 189, 122, .025),
        0 0 32px rgba(214, 189, 122, .24),
        inset 0 0 24px rgba(214, 189, 122, .08);

    backdrop-filter: blur(3px);
    -webkit-backdrop-filter: blur(3px);

    pointer-events: none;
}

.intelligence-world-logo img {
    width: 68%;
    height: 68%;
    object-fit: contain;

    filter:
        drop-shadow(0 0 8px rgba(214,189,122,.32))
        drop-shadow(0 4px 12px rgba(0,0,0,.22));
}

@media (max-width: 1100px) {
    .intelligence-world-logo {
        left: 66%;
        top: 45%;
        width: 72px;
    }
}

@media (max-width: 700px) {
    .intelligence-world-logo {
        left: 74%;
        top: 36%;
        width: 58px;
        opacity: .92;
    }
}

/* =========================================================
   MODAL PROFESIONAL DE SOLUCIONES
========================================================= */

body.modal-open {
    overflow: hidden;
}

.solution-modal {
    position: fixed;
    inset: 0;
    z-index: 5000;

    display: flex;
    align-items: center;
    justify-content: center;

    padding: 28px;

    opacity: 0;
    visibility: hidden;
    pointer-events: none;

    transition:
        opacity .28s ease,
        visibility .28s ease;
}

.solution-modal.active {
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
}

.solution-modal-backdrop {
    position: absolute;
    inset: 0;

    background:
        radial-gradient(
            circle at 50% 40%,
            rgba(181,150,80,.08),
            transparent 34%
        ),
        rgba(0, 10, 17, .82);

    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
}

.solution-modal-dialog {
    position: relative;
    z-index: 2;

    width: min(720px, 94vw);
    max-height: min(760px, 88vh);
    overflow-y: auto;

    padding: 42px 42px 36px;

    border-radius: 22px;

    border: 1px solid rgba(214,189,122,.60);

    background:
        radial-gradient(
            circle at 85% 0%,
            rgba(214,189,122,.10),
            transparent 30%
        ),
        linear-gradient(
            155deg,
            rgba(5,32,48,.985),
            rgba(2,17,28,.995)
        );

    box-shadow:
        0 35px 90px rgba(0,0,0,.58),
        0 0 0 1px rgba(255,255,255,.025) inset,
        0 0 40px rgba(181,150,80,.10);

    transform: translateY(18px) scale(.985);

    transition: transform .30s ease;

    scrollbar-width: thin;
    scrollbar-color: rgba(214,189,122,.55) transparent;
}

.solution-modal.active .solution-modal-dialog {
    transform: translateY(0) scale(1);
}

.solution-modal-dialog::-webkit-scrollbar {
    width: 7px;
}

.solution-modal-dialog::-webkit-scrollbar-track {
    background: transparent;
}

.solution-modal-dialog::-webkit-scrollbar-thumb {
    background: rgba(214,189,122,.48);
    border-radius: 20px;
}

.solution-modal-topline {
    position: absolute;
    top: 0;
    left: 42px;
    right: 42px;

    height: 2px;

    background:
        linear-gradient(
            90deg,
            transparent,
            var(--gold2),
            transparent
        );
}

.solution-modal-close {
    position: absolute;
    top: 20px;
    right: 20px;

    width: 42px;
    height: 42px;

    display: flex;
    align-items: center;
    justify-content: center;

    border-radius: 50%;
    border: 1px solid rgba(214,189,122,.42);

    background: rgba(255,255,255,.025);
    color: #ffffff;

    font-size: 16px;

    transition: .25s ease;
}

.solution-modal-close:hover {
    background: var(--gold2);
    color: var(--navy);
    border-color: var(--gold2);
    transform: rotate(90deg);
}

.solution-modal-icon {
    width: 70px;
    height: 70px;

    margin-bottom: 24px;

    display: flex;
    align-items: center;
    justify-content: center;

    border-radius: 50%;

    border: 1.5px solid var(--gold2);

    background: rgba(2,17,28,.72);
    color: var(--gold2);

    font-size: 25px;

    box-shadow:
        0 0 24px rgba(214,189,122,.12);
}

.solution-modal-eyebrow {
    display: block;

    margin-bottom: 10px;

    color: var(--gold2);

    font-size: 8px;
    font-weight: 800;
    letter-spacing: 2px;
}

.solution-modal-dialog h3 {
    padding-right: 48px;

    color: #ffffff;

    font-family: "Playfair Display", serif;
    font-size: clamp(34px, 5vw, 52px);
    line-height: 1.05;
}

.solution-modal-intro {
    max-width: 610px;

    margin-top: 18px;

    color: #b7c5cc;

    font-size: 12px;
    line-height: 1.85;
}

.solution-modal-divider {
    width: 100%;
    height: 1px;

    margin: 28px 0;

    background:
        linear-gradient(
            90deg,
            rgba(214,189,122,.62),
            rgba(214,189,122,.08),
            transparent
        );
}

.solution-modal-dialog h4 {
    color: #ffffff;

    font-family: "Montserrat", sans-serif;
    font-size: 15px;
    font-weight: 800;
}

.solution-modal-list {
    margin-top: 18px;

    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px;

    list-style: none;
}

.solution-modal-list li {
    min-height: 74px;

    padding: 15px 16px;

    display: flex;
    align-items: flex-start;
    gap: 12px;

    border: 1px solid rgba(214,189,122,.16);
    border-radius: 12px;

    background: rgba(255,255,255,.025);

    color: #c3cfd5;

    font-size: 10px;
    line-height: 1.65;
}

.solution-modal-list li > i {
    width: 25px;
    height: 25px;
    flex: 0 0 25px;

    margin-top: 1px;

    display: flex;
    align-items: center;
    justify-content: center;

    border-radius: 50%;

    background: rgba(214,189,122,.10);
    color: var(--gold2);

    font-size: 9px;
}

.solution-modal-contact {
    margin-top: 30px;
    padding: 22px;

    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 24px;

    border-radius: 16px;

    border: 1px solid rgba(214,189,122,.32);

    background:
        linear-gradient(
            135deg,
            rgba(181,150,80,.09),
            rgba(255,255,255,.018)
        );
}

.solution-modal-contact strong {
    color: #ffffff;
    font-size: 13px;
}

.solution-modal-contact p {
    max-width: 330px;
    margin-top: 5px;

    color: #91a4ae;
    font-size: 9px;
    line-height: 1.6;
}

.solution-modal-actions {
    display: flex;
    gap: 9px;
    flex-shrink: 0;
}

.solution-modal-btn {
    min-height: 44px;
    padding: 0 15px;

    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;

    border-radius: 9px;

    font-size: 9px;
    font-weight: 800;

    transition: .25s ease;
}

.solution-modal-btn-whatsapp {
    background: #25D366;
    color: #ffffff;
}

.solution-modal-btn-email {
    background: linear-gradient(135deg, var(--gold2), var(--gold));
    color: var(--navy);
}

.solution-modal-btn:hover {
    transform: translateY(-3px);
    box-shadow: 0 10px 25px rgba(0,0,0,.22);
}

/* El enlace CONOCE MÁS sigue teniendo el estilo de la tarjeta */
.solution-more {
    cursor: pointer;
}

/* =========================================================
   MODAL - TABLET Y CELULAR
========================================================= */

@media (max-width: 700px) {

    .solution-modal {
        padding: 14px;
        align-items: flex-end;
    }

    .solution-modal-dialog {
        width: 100%;
        max-height: 90vh;

        padding: 34px 20px 22px;

        border-radius: 20px 20px 10px 10px;
    }

    .solution-modal-topline {
        left: 20px;
        right: 20px;
    }

    .solution-modal-close {
        top: 15px;
        right: 15px;

        width: 38px;
        height: 38px;
    }

    .solution-modal-icon {
        width: 58px;
        height: 58px;

        margin-bottom: 18px;

        font-size: 21px;
    }

    .solution-modal-dialog h3 {
        font-size: 34px;
    }

    .solution-modal-intro {
        font-size: 11px;
    }

    .solution-modal-list {
        grid-template-columns: 1fr;
    }

    .solution-modal-list li {
        min-height: auto;
    }

    .solution-modal-contact {
        flex-direction: column;
        align-items: stretch;
    }

    .solution-modal-actions {
        width: 100%;
    }

    .solution-modal-btn {
        flex: 1;
    }

}

/* =========================================================
   AJUSTE FINAL SOLICITADO - 18 SEP 2026
   1) PC: SOLO MEJORA DE LEGIBILIDAD EN RECUADROS
   2) CELULAR: DISTRIBUCIÓN MÁS COMPACTA, ALINEADA Y LEGIBLE
   NO MODIFICA LA ESTRUCTURA HTML NI EL DISEÑO DE ESCRITORIO
========================================================= */

/* ---------- PC / TABLET GRANDE: SOLO LEGIBILIDAD ---------- */
@media (min-width: 769px) {

    .solution-card::after {
        content: "";
        position: absolute;
        inset: 0;
        z-index: 0;
        pointer-events: none;
        background: linear-gradient(
            180deg,
            rgba(1,13,21,.06) 0%,
            rgba(1,13,21,.20) 38%,
            rgba(1,13,21,.74) 72%,
            rgba(1,13,21,.93) 100%
        );
    }

    .solution-card > * {
        position: relative;
        z-index: 1;
    }

    .solution-card h3,
    .about-card h3,
    .industry-card h3,
    .why-card h3 {
        font-size: 21px;
        line-height: 1.25;
        font-weight: 800;
        color: #ffffff;
        text-shadow: 0 2px 10px rgba(0,0,0,.55);
    }

    .solution-card p,
    .about-card p,
    .industry-card p,
    .why-card p {
        font-size: 13px;
        line-height: 1.72;
        font-weight: 500;
        color: #edf2f4;
        text-shadow: 0 2px 9px rgba(0,0,0,.58);
    }

    .solution-card a,
    .news-link {
        font-size: 10px;
        font-weight: 800;
    }

    .method-step h3 {
        font-size: 19px;
        font-weight: 800;
    }

    .method-step p {
        font-size: 13px;
        line-height: 1.65;
        color: #425661;
        font-weight: 500;
    }

    .news-card h3 {
        font-size: 25px;
        line-height: 1.22;
    }

    .news-card-content > p {
        font-size: 13px;
        line-height: 1.72;
        color: #d7e0e4;
    }

    .news-meta span,
    .news-category {
        font-size: 9px;
    }

    .hero-service strong {
        font-size: 14px;
    }

    .hero-service span {
        font-size: 11px;
        line-height: 1.55;
    }
}

/* ---------- CELULAR: MÁS COMPACTO, CUADRADO Y LEGIBLE ---------- */
@media (max-width: 768px) {

    html,
    body {
        width: 100%;
        max-width: 100%;
        overflow-x: hidden;
    }

    .container {
        width: 92%;
        max-width: 100%;
        margin-left: auto;
        margin-right: auto;
    }

    img {
        max-width: 100%;
        height: auto;
    }

    .about,
    .solutions,
    .industries,
    .why,
    .method,
    .news-section,
    .contact {
        padding-top: 72px;
        padding-bottom: 72px;
    }

    /* PORTADA */
    .hero {
        min-height: auto;
        background-position: center center;
    }

    .hero-container {
        min-height: 620px;
        padding: 105px 0 68px;
        align-items: center;
    }

    .hero-content {
        width: 100%;
        max-width: 100%;
    }

    .hero h1 {
        font-size: clamp(42px, 11.5vw, 56px);
        line-height: 1.02;
        letter-spacing: -.8px;
    }

    .hero-description {
        max-width: 100%;
        font-size: 14px;
        line-height: 1.72;
    }

    .hero-buttons {
        gap: 11px;
    }

    .hero-services {
        position: relative !important;
        bottom: auto !important;
    }

    .hero-services-grid {
        width: 100%;
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .hero-service {
        min-height: 96px;
        padding: 16px 13px;
        border-right: 1px solid rgba(214,189,122,.12);
        border-bottom: 1px solid rgba(214,189,122,.12);
    }

    .hero-service strong {
        font-size: 13px;
        line-height: 1.25;
    }

    .hero-service span {
        font-size: 10.5px;
        line-height: 1.5;
    }

    /* ENCABEZADOS DE SECCIÓN */
    .section-heading h2,
    .about-text h2,
    .news-header h2 {
        font-size: clamp(34px, 9vw, 44px);
        line-height: 1.07;
    }

    .section-heading > p,
    .about-text > p,
    .news-header > p {
        font-size: 13px;
        line-height: 1.72;
    }

    /* SOLUCIONES: 2 COLUMNAS */
    .solutions-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 12px;
        align-items: stretch;
    }

    .solution-card {
        min-height: 350px;
        height: 100%;
        padding: 19px 15px 17px;
        border-radius: 15px;
        box-shadow: 0 12px 28px rgba(0,0,0,.27);
    }

    .solution-card::after {
        content: "";
        position: absolute;
        inset: 0;
        z-index: 0;
        pointer-events: none;
        background: linear-gradient(
            180deg,
            rgba(1,13,21,.12) 0%,
            rgba(1,13,21,.34) 38%,
            rgba(1,13,21,.84) 72%,
            rgba(1,13,21,.97) 100%
        );
    }

    .solution-card > * {
        position: relative;
        z-index: 1;
    }

    .solution-card > i {
        width: 52px;
        height: 52px;
        font-size: 19px;
    }

    .solution-card h3 {
        margin-top: 16px;
        font-size: 16.5px;
        line-height: 1.25;
        font-weight: 800;
        color: #fff;
        text-shadow: 0 2px 8px rgba(0,0,0,.70);
    }

    .solution-card p {
        margin-top: 10px;
        max-width: 100%;
        font-size: 12.5px;
        line-height: 1.58;
        font-weight: 500;
        color: #f0f4f5;
        text-shadow: 0 2px 8px rgba(0,0,0,.72);
    }

    .solution-card a {
        padding-top: 18px;
        font-size: 10px;
        letter-spacing: .5px;
    }

    .solution-card a::before {
        bottom: 39px;
        width: 34px;
    }

    .solution-card a > i {
        width: 40px;
        height: 40px;
        font-size: 14px;
    }

    /* INDUSTRIAS, POR QUÉ DACROM Y MÉTODO: 2 COLUMNAS */
    .industries-grid,
    .why-grid,
    .method-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 12px;
        align-items: stretch;
    }

    .industry-card,
    .why-card {
        min-height: 265px;
        height: 100%;
        padding: 20px 16px;
        border-radius: 15px;
    }

    .industry-card > i,
    .why-card > i {
        width: 52px;
        height: 52px;
        font-size: 18px;
    }

    .industry-card h3,
    .why-card h3 {
        margin-top: 18px;
        font-size: 16.5px;
        line-height: 1.28;
        color: #fff;
        font-weight: 800;
        text-shadow: 0 2px 8px rgba(0,0,0,.60);
    }

    .industry-card p,
    .why-card p {
        margin-top: 10px;
        font-size: 12.5px;
        line-height: 1.58;
        color: #eef3f5;
        font-weight: 500;
    }

    .method-step {
        min-height: 235px;
        height: 100%;
        padding: 18px 14px;
        border-radius: 15px;
    }

    .method-step > span {
        width: 42px;
        height: 42px;
    }

    .method-step > i {
        width: 52px;
        height: 52px;
        margin-top: 14px;
        font-size: 19px;
    }

    .method-step h3 {
        margin-top: 15px;
        font-size: 16px;
        line-height: 1.25;
    }

    .method-step p {
        margin-top: 9px;
        font-size: 12.5px;
        line-height: 1.55;
        color: #425661;
        font-weight: 500;
    }

    /* NOSOTROS: UNA COLUMNA PARA NO COMPRIMIR TEXTO */
    .about-container {
        gap: 38px;
    }

    .about-cards {
        grid-template-columns: 1fr;
        gap: 14px;
    }

    .about-card {
        min-height: 225px;
        padding: 22px 19px;
        border-radius: 15px;
    }

    .about-card h3 {
        font-size: 18px;
        line-height: 1.28;
        color: #fff;
        text-shadow: 0 2px 8px rgba(0,0,0,.55);
    }

    .about-card p {
        font-size: 13px;
        line-height: 1.62;
        color: #eef3f5;
        font-weight: 500;
    }

    /* INTELLIGENCE */
    .intelligence {
        min-height: 650px;
        padding: 76px 0;
        background-position: center center;
    }

    .intelligence-text h2 {
        font-size: clamp(40px, 11vw, 52px);
    }

    .intelligence-description,
    .intelligence-text > p {
        font-size: 13px;
        line-height: 1.7;
    }

    .intelligence-features {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 10px;
    }

    .intelligence-features div {
        min-height: 74px;
        padding: 13px 11px;
        font-size: 11px;
    }

    /* NOTICIAS: 1 COLUMNA PARA QUE EL TEXTO RESPIRE */
    .news-header {
        grid-template-columns: 1fr;
        gap: 18px;
        margin-bottom: 34px;
    }

    .news-grid {
        grid-template-columns: 1fr;
        gap: 16px;
    }

    .news-card {
        border-radius: 15px;
    }

    .news-card-image {
        height: 190px;
    }

    .news-card-content {
        padding: 22px 20px 24px;
    }

    .news-card h3 {
        font-size: 22px;
        line-height: 1.24;
    }

    .news-card-content > p {
        font-size: 13px;
        line-height: 1.65;
        color: #dce4e7;
    }

    .news-meta span,
    .news-category,
    .news-link {
        font-size: 9.5px;
    }

    /* CONTACTO Y FORMULARIO */
    .contact-grid {
        grid-template-columns: 1fr;
        gap: 38px;
    }

    .quote-form {
        width: 100%;
        padding: 26px 18px;
        border-radius: 16px;
    }

    .form-row {
        grid-template-columns: 1fr;
        gap: 0;
    }

    .contact-item {
        width: 100%;
    }

    .contact-item strong {
        font-size: 11px;
        line-height: 1.45;
        overflow-wrap: anywhere;
    }
}

/* CELULARES MUY ANGOSTOS: EVITA QUE LOS RECUADROS SE APLASTEN */
@media (max-width: 360px) {
    .solutions-grid,
    .industries-grid,
    .why-grid,
    .method-grid,
    .hero-services-grid,
    .intelligence-features {
        grid-template-columns: 1fr;
    }

    .solution-card {
        min-height: 320px;
    }
}


/* =========================================================
   ACTUALIZACIÓN DACROM - 18 SEP 2026
   SOLICITUDES NUEVAS:
   - REEMPLAZAR VISUALMENTE EL MUNDO DE INTELLIGENCE POR EL LOGO DACROM
   - CONSERVAR LAS FIGURAS Y EL FONDO EXISTENTE
   - MANTENER LEGIBILIDAD Y RESPONSIVE YA CONFIGURADOS
   - CONTACTO TELEFÓNICO DIRECTO
========================================================= */

/* INTELLIGENCE: EL LOGO PRINCIPAL CUBRE EL MUNDO SIN CAMBIAR EL RESTO DEL FONDO */
.intelligence .intelligence-world-logo.intelligence-brand-logo {
    left: auto;
    right: clamp(2%, 5vw, 7%);
    top: 50%;
    transform: translateY(-50%);

    width: clamp(380px, 40vw, 610px);
    height: clamp(270px, 32vw, 450px);
    aspect-ratio: auto;

    border: 0;
    border-radius: 50%;

    background: radial-gradient(
        ellipse at center,
        rgba(3,21,33,.99) 0%,
        rgba(3,21,33,.98) 44%,
        rgba(3,21,33,.94) 57%,
        rgba(3,21,33,.78) 68%,
        rgba(3,21,33,.34) 77%,
        rgba(3,21,33,0) 88%
    );

    box-shadow: none;
    backdrop-filter: blur(1.5px);
    -webkit-backdrop-filter: blur(1.5px);
}

.intelligence .intelligence-world-logo.intelligence-brand-logo img {
    width: min(78%, 430px);
    height: auto;
    max-height: 72%;
    object-fit: contain;
    filter:
        drop-shadow(0 10px 25px rgba(0,0,0,.58))
        drop-shadow(0 0 18px rgba(214,189,122,.18));
}

/* EL TELÉFONO USA EL MISMO ESTILO PREMIUM DEL RESTO DE CONTACTO */
.contact-phone {
    cursor: pointer;
}

.contact-phone .contact-icon {
    flex: 0 0 auto;
}

.contact-phone:hover .contact-icon {
    transform: scale(1.04);
}

/* EL SELECTOR ADMITE ESPAÑOL, INGLÉS, FRANCÉS, JAPONÉS Y CHINO SIN DESBORDARSE */
.language-box select {
    min-width: 58px;
    max-width: 92px;
}

@media (max-width: 1100px) {
    .intelligence .intelligence-world-logo.intelligence-brand-logo {
        right: 0;
        width: min(48vw, 480px);
        height: min(38vw, 360px);
    }
}

@media (max-width: 768px) {
    .intelligence {
        position: relative;
    }

    .intelligence .intelligence-world-logo.intelligence-brand-logo {
        left: 50%;
        right: auto;
        top: 29%;
        transform: translate(-50%, -50%);

        width: min(92vw, 390px);
        height: 250px;
        z-index: 1;
        opacity: .62;
    }

    .intelligence .intelligence-world-logo.intelligence-brand-logo img {
        width: min(82%, 300px);
        max-height: 68%;
    }

    .intelligence-container {
        position: relative;
        z-index: 3;
    }

    .language-box select {
        min-width: 56px;
        max-width: 82px;
        font-size: 11px;
    }
}


/* =====================================================
DACROM · ACTUALIZACIÓN FUNCIONAL 2026-09
Trust strip · Privacy links · Article pages
===================================================== */

.trust-strip {
    margin-top: 34px;
    padding: 18px 20px;
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 12px;
    border: 1px solid rgba(181,150,80,.42);
    border-radius: 12px;
    background: rgba(3,21,33,.82);
    backdrop-filter: blur(6px);
    -webkit-backdrop-filter: blur(6px);
    box-shadow: 0 18px 45px rgba(0,0,0,.12);
}

.trust-strip > div {
    min-height: 58px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    padding: 10px 12px;
    text-align: center;
    color: #fff;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: .25px;
}

.trust-strip i {
    flex: 0 0 auto;
    color: var(--gold2);
    font-size: 18px;
}

.privacy-inline-link {
    color: var(--gold2);
    font-weight: 700;
    text-decoration: underline;
    text-underline-offset: 3px;
}

.privacy-inline-link:hover { color: #fff; }

/* ARTICLE / LEGAL PAGES */
.article-page,
.legal-page {
    min-height: 100vh;
    background: #f5f0e7;
    color: #132733;
}

.article-topbar,
.legal-topbar {
    position: sticky;
    top: 0;
    z-index: 20;
    min-height: 82px;
    display: flex;
    align-items: center;
    background: rgba(3,21,33,.97);
    border-bottom: 1px solid rgba(181,150,80,.28);
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
}

.article-topbar-inner,
.legal-topbar-inner {
    width: min(1180px, calc(100% - 40px));
    margin: 0 auto;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
}

.article-topbar img,
.legal-topbar img {
    width: 180px;
    max-height: 58px;
    object-fit: contain;
}

.article-back,
.legal-back {
    display: inline-flex;
    align-items: center;
    gap: 9px;
    color: var(--gold2);
    font-size: 12px;
    font-weight: 800;
    letter-spacing: .5px;
}

.article-hero,
.legal-hero {
    padding: 86px 0 62px;
    background:
        linear-gradient(110deg, rgba(3,21,33,.96), rgba(4,34,52,.84)),
        url("./img/soluciones-bg.png") center/cover no-repeat;
    color: #fff;
}

.article-page .article-hero {
    background:
        linear-gradient(110deg, rgba(3,21,33,.97), rgba(4,34,52,.78)),
        url("./img/soluciones-bg.png") center/cover no-repeat;
}

.article-shell,
.legal-shell {
    width: min(900px, calc(100% - 40px));
    margin: 0 auto;
}

.article-kicker,
.legal-kicker {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    margin-bottom: 16px;
    color: var(--gold2);
    font-size: 10px;
    font-weight: 800;
    letter-spacing: 2px;
    text-transform: uppercase;
}

.article-kicker::before,
.legal-kicker::before {
    content: "";
    width: 38px;
    height: 1px;
    background: var(--gold);
}

.article-hero h1,
.legal-hero h1 {
    max-width: 850px;
    font-family: 'Playfair Display', serif;
    font-size: clamp(38px, 6vw, 68px);
    line-height: 1.02;
}

.article-hero p,
.legal-hero p {
    max-width: 720px;
    margin-top: 20px;
    color: #d7e0e4;
    font-size: 15px;
    line-height: 1.8;
}

.article-content,
.legal-content {
    padding: 64px 0 90px;
}

.article-prose,
.legal-prose {
    background: rgba(255,255,255,.94);
    border: 1px solid rgba(181,150,80,.28);
    border-radius: 16px;
    padding: clamp(28px, 5vw, 58px);
    box-shadow: 0 22px 70px rgba(2,16,27,.10);
}

.article-prose h2,
.legal-prose h2 {
    margin: 34px 0 12px;
    color: var(--navy);
    font-family: 'Playfair Display', serif;
    font-size: 28px;
}

.article-prose h2:first-child,
.legal-prose h2:first-child { margin-top: 0; }

.article-prose p,
.legal-prose p,
.article-prose li,
.legal-prose li {
    color: #435963;
    font-size: 14px;
    line-height: 1.9;
}

.article-prose ul,
.legal-prose ul {
    margin: 14px 0 0 20px;
}

.article-prose li + li,
.legal-prose li + li { margin-top: 8px; }

.article-note {
    margin-top: 28px;
    padding: 18px 20px;
    border-left: 3px solid var(--gold);
    background: #f6f1e8;
    color: #50636c;
    font-size: 12px;
    line-height: 1.8;
}

.article-cta,
.legal-cta {
    margin-top: 36px;
    padding: 24px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
    border-radius: 12px;
    background: var(--navy);
    color: #fff;
}

.article-cta strong,
.legal-cta strong {
    display: block;
    font-family: 'Playfair Display', serif;
    font-size: 22px;
}

.article-cta p,
.legal-cta p {
    margin-top: 6px;
    color: #cbd6db;
    font-size: 12px;
}

.article-cta a,
.legal-cta a {
    flex: 0 0 auto;
    padding: 13px 18px;
    border-radius: 7px;
    background: var(--gold);
    color: #071722;
    font-size: 11px;
    font-weight: 900;
    letter-spacing: .4px;
}

.article-footer,
.legal-footer {
    padding: 28px 20px;
    text-align: center;
    background: #02101b;
    color: #8fa2ac;
    font-size: 11px;
}

@media (max-width: 800px) {
    .trust-strip { grid-template-columns: repeat(2, minmax(0,1fr)); }
    .article-topbar img,
    .legal-topbar img { width: 145px; }
    .article-hero,
    .legal-hero { padding: 58px 0 44px; }
    .article-content,
    .legal-content { padding: 38px 0 64px; }
    .article-cta,
    .legal-cta { align-items: flex-start; flex-direction: column; }
}

@media (max-width: 480px) {
    .trust-strip { grid-template-columns: 1fr; gap: 4px; padding: 12px; }
    .trust-strip > div { min-height: 48px; justify-content: flex-start; }
    .article-shell,
    .legal-shell,
    .article-topbar-inner,
    .legal-topbar-inner { width: min(100% - 26px, 900px); }
    .article-back span,
    .legal-back span { display: none; }
    .article-prose,
    .legal-prose { border-radius: 12px; padding: 24px 20px; }
}


/* =========================================================
   DACROM · QUÉ HACE LA EMPRESA
   Actualización: claridad de giro y servicios desde la portada
========================================================= */

.hero-capabilities {
    max-width: 720px;
    margin-top: 22px;
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.hero-capabilities span {
    min-height: 32px;
    padding: 7px 11px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border: 1px solid rgba(214,189,122,.38);
    border-radius: 999px;
    background: rgba(2,17,28,.55);
    color: #f3e7c6;
    font-size: 9px;
    font-weight: 800;
    letter-spacing: .45px;
    line-height: 1.2;
    text-transform: uppercase;
    backdrop-filter: blur(7px);
    -webkit-backdrop-filter: blur(7px);
    box-shadow: inset 0 0 0 1px rgba(255,255,255,.02);
}

.what-dacrom {
    position: relative;
    padding: 96px 0;
    overflow: hidden;
    background:
        radial-gradient(circle at 84% 14%, rgba(181,150,80,.13), transparent 28%),
        linear-gradient(180deg, #f7f3ec 0%, #efe8dd 100%);
    color: #102632;
}

.what-dacrom::before {
    content: "";
    position: absolute;
    inset: 0;
    pointer-events: none;
    background: linear-gradient(90deg, rgba(181,150,80,.05) 1px, transparent 1px);
    background-size: 86px 100%;
    opacity: .32;
}

.what-dacrom-container {
    position: relative;
    z-index: 1;
}

.what-dacrom-heading {
    max-width: 810px;
}

.what-dacrom-heading h2 {
    margin-top: 15px;
    color: var(--navy);
    font-family: 'Playfair Display', serif;
    font-size: clamp(42px, 5vw, 68px);
    font-weight: 600;
    line-height: 1.02;
    letter-spacing: -1.6px;
}

.what-dacrom-heading h2 strong {
    display: block;
    color: var(--gold3);
    font-weight: 600;
}

.what-dacrom-heading > p {
    max-width: 690px;
    margin-top: 22px;
    color: #526771;
    font-size: 15px;
    font-weight: 500;
    line-height: 1.8;
}

.what-dacrom-grid {
    margin-top: 48px;
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 18px;
}

.what-dacrom-card {
    position: relative;
    min-height: 305px;
    padding: 30px 28px;
    overflow: hidden;
    border: 1px solid rgba(181,150,80,.50);
    border-radius: 16px;
    background:
        linear-gradient(145deg, rgba(3,21,33,.99), rgba(6,37,55,.94));
    box-shadow: 0 20px 48px rgba(3,21,33,.15);
    transition: transform .35s ease, box-shadow .35s ease, border-color .35s ease;
}

.what-dacrom-card::after {
    content: "";
    position: absolute;
    width: 150px;
    height: 150px;
    right: -58px;
    bottom: -68px;
    border: 1px solid rgba(214,189,122,.14);
    border-radius: 50%;
}

.what-dacrom-card:hover {
    transform: translateY(-8px);
    border-color: rgba(214,189,122,.90);
    box-shadow: 0 28px 62px rgba(3,21,33,.22);
}

.what-dacrom-icon {
    width: 62px;
    height: 62px;
    display: flex;
    align-items: center;
    justify-content: center;
    border: 1px solid rgba(214,189,122,.72);
    border-radius: 50%;
    color: var(--gold2);
    font-size: 23px;
    background: rgba(181,150,80,.08);
}

.what-dacrom-number {
    position: absolute;
    top: 26px;
    right: 26px;
    color: rgba(214,189,122,.48);
    font-family: 'Playfair Display', serif;
    font-size: 30px;
    font-weight: 700;
}

.what-dacrom-card h3 {
    margin-top: 28px;
    color: #fff;
    font-family: 'Playfair Display', serif;
    font-size: 27px;
    line-height: 1.15;
}

.what-dacrom-card p {
    margin-top: 14px;
    max-width: 310px;
    color: #cfdae0;
    font-size: 13px;
    font-weight: 500;
    line-height: 1.75;
}

.what-dacrom-bottom {
    margin-top: 24px;
    padding: 19px 22px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 24px;
    border-top: 1px solid rgba(181,150,80,.36);
    border-bottom: 1px solid rgba(181,150,80,.36);
}

.what-dacrom-bottom > span {
    color: #455b65;
    font-size: 12px;
    font-weight: 700;
    letter-spacing: .2px;
}

.what-dacrom-bottom a {
    flex: 0 0 auto;
    display: inline-flex;
    align-items: center;
    gap: 14px;
    color: var(--navy);
    font-size: 10px;
    font-weight: 900;
    letter-spacing: .6px;
    text-transform: uppercase;
}

.what-dacrom-bottom a i {
    width: 38px;
    height: 38px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border: 1px solid var(--gold);
    border-radius: 50%;
    color: var(--gold3);
    transition: .3s ease;
}

.what-dacrom-bottom a:hover i {
    transform: translateX(4px);
    background: var(--navy);
    border-color: var(--navy);
    color: #fff;
}

@media (max-width: 900px) {
    .what-dacrom {
        padding: 78px 0;
    }

    .what-dacrom-grid {
        grid-template-columns: 1fr;
        gap: 14px;
    }

    .what-dacrom-card {
        min-height: 245px;
    }
}

@media (max-width: 768px) {
    .hero-capabilities {
        display: grid;
        grid-template-columns: repeat(2, minmax(0,1fr));
        gap: 7px;
        margin-top: 20px;
    }

    .hero-capabilities span {
        min-height: 34px;
        padding: 7px 8px;
        font-size: 8.5px;
        text-align: center;
    }

    .what-dacrom {
        padding: 68px 0;
    }

    .what-dacrom-heading h2 {
        font-size: clamp(34px, 9vw, 45px);
        line-height: 1.06;
        letter-spacing: -.8px;
    }

    .what-dacrom-heading > p {
        font-size: 13.5px;
        line-height: 1.72;
    }

    .what-dacrom-grid {
        margin-top: 32px;
    }

    .what-dacrom-card {
        min-height: 230px;
        padding: 24px 21px;
        border-radius: 15px;
    }

    .what-dacrom-icon {
        width: 54px;
        height: 54px;
        font-size: 20px;
    }

    .what-dacrom-number {
        top: 22px;
        right: 22px;
        font-size: 25px;
    }

    .what-dacrom-card h3 {
        margin-top: 22px;
        font-size: 23px;
    }

    .what-dacrom-card p {
        font-size: 13px;
        line-height: 1.65;
    }

    .what-dacrom-bottom {
        align-items: flex-start;
        flex-direction: column;
        gap: 16px;
        padding: 18px 0;
    }
}


/* =========================================================
   AJUSTE FINAL DE LEGIBILIDAD DACROM
   - Letras secundarias más grandes
   - Mayor contraste en fondos oscuros
   - Mayor contraste en fondos claros
   - Conserva estructura, imágenes y diseño existente
========================================================= */

/* ETIQUETAS PEQUEÑAS */
.section-label {
    font-size: 11px;
    letter-spacing: 2.6px;
    font-weight: 800;
}

/* PORTADA */
.hero-description {
    max-width: 680px;
    color: #f4f7f8;
    font-size: 16px;
    line-height: 1.72;
    font-weight: 500;
    text-shadow: 0 3px 14px rgba(0,0,0,.85);
}

.hero-capabilities span {
    min-height: 36px;
    padding: 8px 13px;
    color: #fff4d8;
    font-size: 10.5px;
    font-weight: 800;
    background: rgba(2,17,28,.72);
    border-color: rgba(214,189,122,.58);
    text-shadow: 0 2px 8px rgba(0,0,0,.75);
}

/* PÁRRAFOS GENERALES DE SECCIÓN */
.section-heading p {
    font-size: 16px;
    line-height: 1.78;
    font-weight: 500;
    color: #344e5a;
}

/* TEXTO SOBRE FONDOS OSCUROS */
.section-heading.light p,
.solutions .section-heading p,
.industries .section-heading p {
    color: #f2f6f7;
    font-size: 16px;
    line-height: 1.78;
    font-weight: 500;
    text-shadow: 0 2px 10px rgba(0,0,0,.82);
}

/* NOSOTROS */
.about-text > p {
    color: #334d59;
    font-size: 16px;
    line-height: 1.82;
    font-weight: 500;
}

/* QUÉ HACE DACROM */
.what-dacrom-heading > p {
    color: #314a56;
    font-size: 17px;
    line-height: 1.78;
    font-weight: 500;
}

.what-dacrom-card p {
    color: #f1f5f6;
    font-size: 15px;
    line-height: 1.68;
    font-weight: 500;
    text-shadow: 0 2px 8px rgba(0,0,0,.68);
}

/* NOTICIAS */
.news-header > p {
    color: #eef3f5;
    font-size: 15px;
    line-height: 1.78;
    font-weight: 500;
    text-shadow: 0 2px 8px rgba(0,0,0,.62);
}

/* DESCRIPCIONES DENTRO DE TARJETAS */
.solution-card p,
.about-card p,
.industry-card p,
.why-card p {
    font-size: 14px;
    line-height: 1.68;
    font-weight: 500;
}

/* MÉTODO */
.method-step p {
    font-size: 14px;
    line-height: 1.65;
    font-weight: 500;
}

/* INTELLIGENCE */
.intelligence-description,
.intelligence-text > p {
    font-size: 15px;
    line-height: 1.75;
    color: #f0f4f6;
    font-weight: 500;
    text-shadow: 0 2px 10px rgba(0,0,0,.7);
}

/* MÓVIL */
@media (max-width: 768px) {

    .section-label {
        font-size: 10px;
        letter-spacing: 2.2px;
    }

    .hero-description {
        font-size: 15px;
        line-height: 1.68;
        color: #ffffff;
    }

    .hero-capabilities span {
        min-height: 38px;
        padding: 8px 9px;
        font-size: 10px;
    }

    .section-heading > p,
    .about-text > p,
    .news-header > p {
        font-size: 14.5px;
        line-height: 1.68;
    }

    .section-heading.light p,
    .solutions .section-heading p,
    .industries .section-heading p {
        color: #ffffff;
        font-size: 14.5px;
        text-shadow: 0 2px 9px rgba(0,0,0,.85);
    }

    .what-dacrom-heading > p {
        font-size: 15px;
        line-height: 1.68;
        color: #314a56;
    }

    .what-dacrom-card p {
        font-size: 14px;
        line-height: 1.62;
    }

    .solution-card p,
    .about-card p,
    .industry-card p,
    .why-card p,
    .method-step p,
    .intelligence-description,
    .intelligence-text > p {
        font-size: 13.5px;
    }
}



/* =========================================================
   DACROM · EXPERIENCIA PREMIUM
   Diagnóstico interactivo · Método vivo · Intelligence motion
   Aplicaciones · Cierre de marca
========================================================= */

html { scroll-behavior: smooth; }

/* REVEAL */
.reveal-on-scroll {
    opacity: 0;
    transform: translateY(34px);
    transition: opacity .75s ease, transform .75s cubic-bezier(.2,.72,.2,1);
}
.reveal-on-scroll.is-visible {
    opacity: 1;
    transform: translateY(0);
}

/* MÉTODO DACROM 360° */
.method-progress {
    position: relative;
    width: 100%;
    height: 2px;
    margin: -24px 0 44px;
    overflow: hidden;
    background: rgba(181,150,80,.18);
}
.method-progress-fill {
    display: block;
    width: 0;
    height: 100%;
    background: linear-gradient(90deg, var(--gold), var(--gold2));
    box-shadow: 0 0 18px rgba(214,189,122,.45);
    transition: width .18s linear;
}
.method-step {
    transition:
        transform .45s ease,
        border-color .45s ease,
        box-shadow .45s ease,
        background .45s ease,
        opacity .45s ease;
}
.method-step.method-active {
    transform: translateY(-8px);
    border-color: rgba(181,150,80,.62);
    box-shadow: 0 18px 45px rgba(2,17,28,.13), 0 0 0 1px rgba(181,150,80,.08) inset;
}
.method-step.method-active > span,
.method-step.method-active > i {
    box-shadow: 0 0 0 8px rgba(181,150,80,.07), 0 0 26px rgba(181,150,80,.18);
}

/* INTELLIGENCE · MOVIMIENTO SUTIL */
.intelligence {
    isolation: isolate;
}
.intelligence::after {
    content: "";
    position: absolute;
    inset: -15%;
    z-index: 1;
    pointer-events: none;
    opacity: 0;
    background:
        radial-gradient(circle at 72% 42%, rgba(214,189,122,.13) 0 1px, transparent 2px),
        radial-gradient(circle at 80% 28%, rgba(214,189,122,.14) 0 1px, transparent 2px),
        radial-gradient(circle at 66% 65%, rgba(214,189,122,.11) 0 1px, transparent 2px);
    background-size: 95px 95px, 125px 125px, 150px 150px;
    transform: scale(.96);
    transition: opacity 1.2s ease, transform 1.6s ease;
}
.intelligence.intelligence-awake::after {
    opacity: 1;
    transform: scale(1);
    animation: intelligenceDrift 14s linear infinite;
}
.intelligence .intelligence-text {
    transition: transform .85s cubic-bezier(.2,.72,.2,1), opacity .85s ease;
}
.intelligence:not(.intelligence-awake) .intelligence-text {
    opacity: .72;
    transform: translateY(18px);
}
.intelligence.intelligence-awake .intelligence-features > div {
    animation: intelligenceFeatureIn .65s ease both;
}
.intelligence.intelligence-awake .intelligence-features > div:nth-child(2) { animation-delay: .08s; }
.intelligence.intelligence-awake .intelligence-features > div:nth-child(3) { animation-delay: .16s; }
.intelligence.intelligence-awake .intelligence-features > div:nth-child(4) { animation-delay: .24s; }

@keyframes intelligenceDrift {
    from { background-position: 0 0, 0 0, 0 0; }
    to { background-position: 95px -95px, -125px 125px, 150px -150px; }
}
@keyframes intelligenceFeatureIn {
    from { opacity: 0; transform: translateY(12px); }
    to { opacity: 1; transform: translateY(0); }
}

/* DIAGNÓSTICO */
.diagnostic-experience {
    position: relative;
    overflow: hidden;
    padding: 118px 0;
    background:
        radial-gradient(circle at 80% 20%, rgba(181,150,80,.11), transparent 27%),
        linear-gradient(145deg, #031521 0%, #061f30 52%, #02101b 100%);
    color: #fff;
}
.diagnostic-experience::before {
    content: "";
    position: absolute;
    inset: 0;
    pointer-events: none;
    background-image:
        linear-gradient(rgba(214,189,122,.028) 1px, transparent 1px),
        linear-gradient(90deg, rgba(214,189,122,.028) 1px, transparent 1px);
    background-size: 58px 58px;
    mask-image: linear-gradient(to bottom, transparent, #000 20%, #000 80%, transparent);
}
.diagnostic-glow {
    position: absolute;
    border-radius: 50%;
    filter: blur(80px);
    pointer-events: none;
}
.diagnostic-glow-one {
    width: 360px;
    height: 360px;
    right: -100px;
    top: 30px;
    background: rgba(181,150,80,.13);
}
.diagnostic-glow-two {
    width: 280px;
    height: 280px;
    left: -120px;
    bottom: 0;
    background: rgba(32,91,121,.22);
}
.diagnostic-shell {
    position: relative;
    z-index: 2;
    display: grid;
    grid-template-columns: .82fr 1.18fr;
    gap: 58px;
    align-items: center;
}
.diagnostic-intro h2 {
    margin-top: 14px;
    max-width: 610px;
    font-family: "Playfair Display", serif;
    font-size: clamp(42px, 5vw, 68px);
    line-height: 1.02;
    font-weight: 600;
}
.diagnostic-intro h2 strong {
    display: block;
    color: var(--gold2);
}
.diagnostic-intro > p {
    max-width: 590px;
    margin-top: 23px;
    color: #d9e2e6;
    font-size: 16px;
    line-height: 1.82;
}
.diagnostic-badges {
    margin-top: 30px;
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
}
.diagnostic-badges > span {
    display: inline-flex;
    align-items: center;
    gap: 9px;
    padding: 10px 13px;
    border: 1px solid rgba(214,189,122,.26);
    border-radius: 999px;
    background: rgba(255,255,255,.035);
    color: #f0f3f4;
    font-size: 11px;
    font-weight: 700;
}
.diagnostic-badges i { color: var(--gold2); }

.diagnostic-card {
    position: relative;
    min-height: 570px;
    padding: 34px;
    border: 1px solid rgba(214,189,122,.45);
    border-radius: 24px;
    background:
        radial-gradient(circle at 100% 0%, rgba(214,189,122,.09), transparent 33%),
        rgba(3,22,34,.88);
    box-shadow: 0 35px 90px rgba(0,0,0,.33), inset 0 0 0 1px rgba(255,255,255,.025);
    backdrop-filter: blur(14px);
    -webkit-backdrop-filter: blur(14px);
}
.diagnostic-card-top {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 22px;
    padding-bottom: 24px;
    border-bottom: 1px solid rgba(214,189,122,.16);
}
.diagnostic-card-top > div:first-child {
    display: flex;
    flex-direction: column;
    gap: 7px;
}
.diagnostic-kicker {
    color: var(--gold2);
    font-size: 9px;
    font-weight: 800;
    letter-spacing: 1.9px;
}
#diagnosticStepLabel {
    color: #fff;
    font-size: 14px;
}
.diagnostic-meter {
    width: min(220px, 42%);
    height: 4px;
    overflow: hidden;
    border-radius: 10px;
    background: rgba(255,255,255,.08);
}
.diagnostic-meter span {
    display: block;
    width: 25%;
    height: 100%;
    border-radius: inherit;
    background: linear-gradient(90deg, var(--gold), var(--gold2));
    transition: width .35s ease;
}
.diagnostic-step {
    display: none;
    margin: 0;
    padding: 34px 0 0;
    border: 0;
}
.diagnostic-step.active {
    display: block;
    animation: diagnosticStepIn .35s ease;
}
@keyframes diagnosticStepIn {
    from { opacity: 0; transform: translateX(14px); }
    to { opacity: 1; transform: translateX(0); }
}
.diagnostic-step legend {
    max-width: 670px;
    margin-bottom: 25px;
    color: #fff;
    font-family: "Playfair Display", serif;
    font-size: clamp(26px, 3vw, 34px);
    line-height: 1.15;
    font-weight: 600;
}
.diagnostic-options {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 12px;
}
.diagnostic-options-wide {
    grid-template-columns: repeat(2, minmax(0, 1fr));
}
.diagnostic-options label {
    position: relative;
    cursor: pointer;
}
.diagnostic-options input {
    position: absolute;
    opacity: 0;
    pointer-events: none;
}
.diagnostic-options label > span {
    min-height: 112px;
    padding: 18px;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    gap: 16px;
    border: 1px solid rgba(214,189,122,.22);
    border-radius: 14px;
    background: rgba(255,255,255,.032);
    transition: .26s ease;
}
.diagnostic-options label:hover > span {
    transform: translateY(-3px);
    border-color: rgba(214,189,122,.56);
    background: rgba(181,150,80,.07);
}
.diagnostic-options input:checked + span {
    border-color: var(--gold2);
    background: linear-gradient(145deg, rgba(181,150,80,.18), rgba(255,255,255,.045));
    box-shadow: 0 0 0 1px rgba(214,189,122,.18) inset, 0 12px 28px rgba(0,0,0,.18);
}
.diagnostic-options i {
    color: var(--gold2);
    font-size: 19px;
}
.diagnostic-options b {
    color: #fff;
    font-size: 13px;
    line-height: 1.45;
}
.diagnostic-warning {
    min-height: 22px;
    margin-top: 16px;
    color: #f4c986;
    font-size: 11px;
}
.diagnostic-actions {
    margin-top: 10px;
    display: flex;
    justify-content: space-between;
    gap: 14px;
}
.diagnostic-back,
.diagnostic-next,
.diagnostic-restart {
    border: 0;
    font: inherit;
    cursor: pointer;
}
.diagnostic-back,
.diagnostic-next {
    min-height: 48px;
    padding: 0 19px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    border-radius: 8px;
    font-size: 11px;
    font-weight: 800;
}
.diagnostic-back {
    color: #d8e1e4;
    background: rgba(255,255,255,.06);
    border: 1px solid rgba(255,255,255,.10);
}
.diagnostic-back:disabled {
    opacity: .34;
    cursor: not-allowed;
}
.diagnostic-next {
    margin-left: auto;
    color: #071722;
    background: linear-gradient(135deg, #b59650, #e0c57c);
    box-shadow: 0 12px 28px rgba(181,150,80,.16);
}
.diagnostic-result {
    padding-top: 22px;
}
.diagnostic-result[hidden] { display: none !important; }
.diagnostic-result-label {
    color: var(--gold2);
    font-size: 9px;
    font-weight: 800;
    letter-spacing: 1.8px;
}
.diagnostic-result h3 {
    margin-top: 10px;
    color: #fff;
    font-family: "Playfair Display", serif;
    font-size: clamp(30px, 4vw, 44px);
    line-height: 1.08;
}
.diagnostic-result-summary {
    margin-top: 16px;
    color: #c8d4d9;
    font-size: 12px;
    line-height: 1.7;
}
.diagnostic-result-grid {
    margin-top: 26px;
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px;
}
.diagnostic-recommendation {
    min-height: 72px;
    padding: 15px 16px;
    display: flex;
    align-items: center;
    gap: 13px;
    border: 1px solid rgba(214,189,122,.28);
    border-radius: 12px;
    background: rgba(255,255,255,.035);
    color: #fff;
    font-size: 12px;
    font-weight: 700;
}
.diagnostic-recommendation i {
    width: 34px;
    height: 34px;
    display: grid;
    place-items: center;
    flex: 0 0 auto;
    border-radius: 50%;
    background: rgba(181,150,80,.12);
    color: var(--gold2);
}
.diagnostic-disclaimer {
    margin-top: 22px;
    color: #9fb0b9;
    font-size: 10.5px;
    line-height: 1.7;
}
.diagnostic-result-actions {
    margin-top: 24px;
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
}
.diagnostic-whatsapp {
    min-height: 48px;
    padding: 0 17px;
    display: inline-flex;
    align-items: center;
    gap: 9px;
    border: 1px solid rgba(255,255,255,.13);
    border-radius: 7px;
    color: #fff;
    font-size: 11px;
    font-weight: 800;
    background: rgba(255,255,255,.05);
}
.diagnostic-whatsapp i { color: #86d79a; }
.diagnostic-restart {
    margin-top: 18px;
    padding: 0;
    color: #aebdc4;
    background: none;
    font-size: 10px;
    text-decoration: underline;
    text-underline-offset: 4px;
}

/* APLICACIONES */
.applications-section {
    position: relative;
    overflow: hidden;
    padding: 110px 0;
    background:
        linear-gradient(180deg, #f7f3ec 0%, #f1ece3 100%);
}
.applications-section::after {
    content: "";
    position: absolute;
    width: 520px;
    height: 520px;
    right: -220px;
    top: -160px;
    border: 1px solid rgba(181,150,80,.17);
    border-radius: 50%;
    box-shadow:
        0 0 0 55px rgba(181,150,80,.035),
        0 0 0 110px rgba(181,150,80,.025);
    pointer-events: none;
}
.applications-heading {
    position: relative;
    z-index: 2;
    display: grid;
    grid-template-columns: 1.1fr .9fr;
    gap: 48px;
    align-items: end;
    margin-bottom: 42px;
}
.applications-heading h2 {
    margin-top: 14px;
    color: var(--navy);
    font-family: "Playfair Display", serif;
    font-size: clamp(42px, 5vw, 66px);
    line-height: 1.02;
}
.applications-heading h2 strong {
    display: block;
    color: var(--gold3);
}
.applications-heading > p {
    color: #435b67;
    font-size: 15px;
    line-height: 1.82;
}
.applications-grid {
    position: relative;
    z-index: 2;
    display: grid;
    grid-template-columns: repeat(3, minmax(0,1fr));
    gap: 16px;
}
.application-card {
    position: relative;
    overflow: hidden;
    min-height: 410px;
    padding: 28px;
    border: 1px solid rgba(181,150,80,.27);
    border-radius: 18px;
    background:
        radial-gradient(circle at 100% 0%, rgba(181,150,80,.08), transparent 32%),
        #fff;
    box-shadow: 0 20px 50px rgba(2,17,28,.065);
    transition: transform .35s ease, box-shadow .35s ease, border-color .35s ease;
}
.application-card:hover {
    transform: translateY(-7px);
    border-color: rgba(181,150,80,.56);
    box-shadow: 0 26px 60px rgba(2,17,28,.10);
}
.application-number {
    position: absolute;
    right: 22px;
    top: 20px;
    color: rgba(3,21,33,.08);
    font-family: "Playfair Display", serif;
    font-size: 70px;
    font-weight: 700;
}
.application-icon {
    width: 54px;
    height: 54px;
    display: grid;
    place-items: center;
    border-radius: 50%;
    background: var(--navy);
    color: var(--gold2);
    font-size: 18px;
    box-shadow: 0 12px 26px rgba(2,17,28,.15);
}
.application-tag {
    display: block;
    margin-top: 24px;
    color: var(--gold3);
    font-size: 9px;
    font-weight: 800;
    letter-spacing: 1.5px;
}
.application-card h3 {
    margin-top: 11px;
    color: var(--navy);
    font-family: "Playfair Display", serif;
    font-size: 25px;
    line-height: 1.18;
}
.application-flow {
    margin-top: 28px;
    display: grid;
    grid-template-columns: 1fr auto 1fr;
    gap: 12px;
    align-items: start;
}
.application-flow > i {
    margin-top: 21px;
    color: var(--gold3);
    font-size: 10px;
}
.application-flow small {
    color: #8b7550;
    font-size: 8px;
    font-weight: 800;
    letter-spacing: 1.3px;
    text-transform: uppercase;
}
.application-flow p {
    margin-top: 7px;
    color: #526873;
    font-size: 12px;
    line-height: 1.62;
}
.applications-note {
    position: relative;
    z-index: 2;
    margin-top: 18px;
    padding: 19px 22px;
    display: grid;
    grid-template-columns: auto 1fr auto;
    gap: 16px;
    align-items: center;
    border: 1px solid rgba(181,150,80,.26);
    border-radius: 12px;
    background: rgba(255,255,255,.72);
}
.applications-note > i {
    color: var(--gold3);
    font-size: 19px;
}
.applications-note p {
    color: #415964;
    font-size: 12px;
    line-height: 1.65;
}
.applications-note a {
    display: inline-flex;
    align-items: center;
    gap: 9px;
    color: var(--navy);
    font-size: 10px;
    font-weight: 900;
    white-space: nowrap;
}

/* CIERRE DE MARCA */
.cta-premium {
    position: relative;
    overflow: hidden;
    min-height: 520px;
    padding: 96px 0;
    display: flex;
    align-items: center;
    background:
        radial-gradient(circle at 78% 35%, rgba(181,150,80,.15), transparent 24%),
        linear-gradient(135deg, #020f19 0%, #052235 58%, #020f19 100%);
    color: #fff;
}
.cta-premium-grid {
    position: absolute;
    inset: 0;
    opacity: .45;
    background-image:
        linear-gradient(rgba(214,189,122,.035) 1px, transparent 1px),
        linear-gradient(90deg, rgba(214,189,122,.035) 1px, transparent 1px);
    background-size: 62px 62px;
    mask-image: radial-gradient(circle at 65% 50%, #000 0%, transparent 70%);
}
.cta-premium-orbit {
    position: absolute;
    right: 7%;
    top: 50%;
    border: 1px solid rgba(214,189,122,.20);
    border-radius: 50%;
    transform: translateY(-50%);
    pointer-events: none;
}
.cta-orbit-one {
    width: 360px;
    height: 360px;
}
.cta-orbit-two {
    width: 470px;
    height: 470px;
    opacity: .55;
}
.cta-premium .cta-container {
    position: relative;
    z-index: 2;
    display: grid;
    grid-template-columns: 1fr auto;
    gap: 60px;
    align-items: center;
}
.cta-premium-copy > span {
    color: var(--gold2);
    font-size: 9px;
    font-weight: 800;
    letter-spacing: 2.1px;
}
.cta-premium h2 {
    max-width: 860px;
    margin-top: 16px;
    color: #fff;
    font-family: "Playfair Display", serif;
    font-size: clamp(44px, 5.5vw, 76px);
    line-height: 1.01;
}
.cta-premium h2 strong {
    display: block;
    color: var(--gold2);
}
.cta-premium-copy > p {
    max-width: 650px;
    margin-top: 22px;
    color: #cad6dc;
    font-size: 15px;
    line-height: 1.78;
}
.cta-premium-signature {
    margin-top: 30px;
    display: flex;
    flex-direction: column;
    gap: 5px;
}
.cta-premium-signature span {
    color: #fff;
    font-family: "Playfair Display", serif;
    font-size: 19px;
    letter-spacing: .5px;
}
.cta-premium-signature small {
    color: #9fb0b8;
    font-size: 8px;
    font-weight: 800;
    letter-spacing: 1.9px;
}
.cta-premium-actions {
    min-width: 255px;
    display: flex;
    flex-direction: column;
    align-items: stretch;
    gap: 14px;
}
.cta-premium-actions .cta-button {
    min-height: 56px;
    justify-content: center;
    text-align: center;
}
.cta-secondary-link {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    color: #d7e1e5;
    font-size: 10px;
    font-weight: 700;
}
.cta-secondary-link:hover { color: var(--gold2); }

/* RESPONSIVE */
@media (max-width: 980px) {
    .diagnostic-shell {
        grid-template-columns: 1fr;
        gap: 38px;
    }
    .applications-grid {
        grid-template-columns: 1fr;
    }
    .application-card {
        min-height: auto;
    }
    .cta-premium .cta-container {
        grid-template-columns: 1fr;
        gap: 38px;
    }
    .cta-premium-actions {
        min-width: 0;
        max-width: 330px;
    }
}

@media (max-width: 768px) {
    .diagnostic-experience,
    .applications-section {
        padding: 76px 0;
    }

    .method-progress {
        margin: -10px 0 30px;
    }

    .diagnostic-card {
        min-height: auto;
        padding: 24px 18px;
        border-radius: 17px;
    }

    .diagnostic-card-top {
        align-items: flex-start;
        flex-direction: column;
        gap: 14px;
    }

    .diagnostic-meter {
        width: 100%;
    }

    .diagnostic-step {
        padding-top: 26px;
    }

    .diagnostic-options,
    .diagnostic-options-wide {
        grid-template-columns: 1fr;
    }

    .diagnostic-options label > span {
        min-height: 82px;
        padding: 15px;
        flex-direction: row;
        align-items: center;
        justify-content: flex-start;
    }

    .diagnostic-result-grid {
        grid-template-columns: 1fr;
    }

    .diagnostic-result-actions {
        flex-direction: column;
        align-items: stretch;
    }

    .diagnostic-result-actions .btn-primary,
    .diagnostic-whatsapp {
        width: 100%;
        justify-content: center;
        text-align: center;
    }

    .applications-heading {
        grid-template-columns: 1fr;
        gap: 18px;
    }

    .application-flow {
        grid-template-columns: 1fr;
    }

    .application-flow > i {
        transform: rotate(90deg);
        margin: 0;
    }

    .applications-note {
        grid-template-columns: auto 1fr;
    }

    .applications-note a {
        grid-column: 1 / -1;
        justify-content: flex-end;
    }

    .cta-premium {
        min-height: 560px;
        padding: 78px 0;
    }

    .cta-orbit-one {
        width: 260px;
        height: 260px;
        right: -70px;
    }

    .cta-orbit-two {
        width: 350px;
        height: 350px;
        right: -115px;
    }

    .cta-premium h2 {
        font-size: clamp(40px, 11vw, 56px);
    }
}

@media (prefers-reduced-motion: reduce) {
    html { scroll-behavior: auto; }
    .reveal-on-scroll,
    .method-step,
    .intelligence .intelligence-text,
    .intelligence::after {
        transition: none !important;
        animation: none !important;
        transform: none !important;
        opacity: 1 !important;
    }
}



/* =========================================================
   DACROM · CORRECCIÓN CAMPO ANTISPAM
   El honeypot debe existir para protección, pero nunca mostrarse.
========================================================= */
.form-honeypot,
.quote-form input[name="_honey"],
input[name="_honey"][aria-hidden="true"] {
    display: none !important;
    position: absolute !important;
    left: -999999px !important;
    top: -999999px !important;
    width: 0 !important;
    height: 0 !important;
    min-width: 0 !important;
    min-height: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    border: 0 !important;
    opacity: 0 !important;
    visibility: hidden !important;
    pointer-events: none !important;
    appearance: none !important;
    -webkit-appearance: none !important;
}
