/* ==========================================================================
   DISEÑO PREMIUM JRS - INDUSTRIAL 2026
   Reemplaza por completo tu archivo styles.css
   ========================================================================== */

:root {
    --color-primario: #E5B22D;
    --color-primario-2: #F6D26A;
    --color-azul-detalles: #243B6B;
    --color-oscuro: #0B0F19;
    --color-oscuro-2: #111827;
    --color-superficie: #FFFFFF;
    --color-fondo: #EEF2F8;
    --color-texto: #1E2533;
    --color-muted: #64748B;
    --borde: rgba(148, 163, 184, 0.22);
    --shadow-soft: 0 18px 45px rgba(15, 23, 42, 0.08);
    --shadow-hover: 0 30px 70px rgba(15, 23, 42, 0.18);
    --transition: 0.35s cubic-bezier(.2,.8,.2,1);
}

* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

html {
    scroll-behavior: smooth;
}

body {
    font-family: 'Poppins', sans-serif;
    background:
        radial-gradient(circle at top left, rgba(229, 178, 45, 0.13), transparent 35%),
        linear-gradient(180deg, #F8FAFC 0%, var(--color-fondo) 45%, #E8EDF5 100%);
    color: var(--color-texto);
    overflow-x: hidden;
    -webkit-font-smoothing: antialiased;
}

img {
    max-width: 100%;
    display: block;
}

section {
    scroll-margin-top: 100px;
}

.contenedor-global {
    width: min(90%, 1220px);
    margin: auto;
    padding: 100px 0 70px;
}

.seccion-bloque {
    margin-bottom: 110px;
}

.section-kicker {
    display: block;
    text-align: center;
    color: var(--color-primario);
    font-size: 13px;
    font-weight: 800;
    letter-spacing: 2px;
    text-transform: uppercase;
    margin-bottom: 12px;
}

.titulo-central {
    text-align: center;
    font-size: clamp(30px, 4vw, 46px);
    font-weight: 900;
    color: var(--color-oscuro);
    margin-bottom: 55px;
    text-transform: uppercase;
    letter-spacing: -1px;
    line-height: 1.05;
}

.titulo-central::after {
    content: "";
    width: 90px;
    height: 5px;
    background: linear-gradient(90deg, var(--color-primario), var(--color-primario-2));
    display: block;
    margin: 18px auto 0;
    border-radius: 99px;
}

/* NAVBAR */
.navbar {
    position: fixed;
    inset: 0 0 auto 0;
    width: 100%;
    z-index: 9999;
    padding: 16px 0;
    background: rgba(11, 15, 25, 0.70);
    backdrop-filter: blur(18px);
    -webkit-backdrop-filter: blur(18px);
    border-bottom: 1px solid rgba(229, 178, 45, 0.20);
    transition: var(--transition);
}

.navbar.scrolled {
    padding: 10px 0;
    background: rgba(11, 15, 25, 0.96);
    box-shadow: 0 15px 40px rgba(0,0,0,.22);
}

.nav-contenedor {
    width: min(92%, 1220px);
    margin: auto;
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.nav-logo {
    text-decoration: none;
    color: #fff;
    display: flex;
    flex-direction: column;
    line-height: 1;
}

.nav-logo span {
    color: var(--color-primario);
    font-size: 30px;
    font-weight: 900;
    letter-spacing: -1px;
}

.nav-logo small {
    color: rgba(255,255,255,.66);
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 2px;
    text-transform: uppercase;
}

.nav-menu {
    display: flex;
    align-items: center;
    gap: 24px;
}

.nav-menu a {
    color: rgba(255,255,255,.84);
    text-decoration: none;
    font-size: 12px;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: .8px;
    position: relative;
    transition: var(--transition);
}

.nav-menu a::after {
    content: "";
    position: absolute;
    width: 0;
    height: 2px;
    background: var(--color-primario);
    left: 0;
    bottom: -7px;
    transition: var(--transition);
}

.nav-menu a:hover {
    color: var(--color-primario);
}

.nav-menu a:hover::after {
    width: 100%;
}

.nav-menu .nav-cta {
    background: var(--color-primario);
    color: var(--color-oscuro);
    padding: 11px 18px;
    border-radius: 999px;
}

.nav-menu .nav-cta::after {
    display: none;
}

.menu-toggle {
    display: none;
    width: 44px;
    height: 44px;
    background: rgba(255,255,255,.08);
    border: 1px solid rgba(255,255,255,.15);
    border-radius: 12px;
    cursor: pointer;
}

.menu-toggle span {
    width: 20px;
    height: 2px;
    background: #fff;
    display: block;
    margin: 5px auto;
    transition: var(--transition);
}

/* HERO */
.hero-header {
    min-height: 100vh;
    background:
        linear-gradient(90deg, rgba(11,15,25,.96) 0%, rgba(11,15,25,.72) 45%, rgba(11,15,25,.82) 100%),
        url("https://images.unsplash.com/photo-1504307651254-35680f356dfd?q=80&w=1920");
    background-size: cover;
    background-position: center;
    display: grid;
    place-items: center;
    text-align: center;
    padding: 130px 20px 90px;
    position: relative;
    overflow: hidden;
}

.hero-header::before {
    content: "";
    position: absolute;
    inset: 0;
    background:
        linear-gradient(rgba(255,255,255,.03) 1px, transparent 1px),
        linear-gradient(90deg, rgba(255,255,255,.03) 1px, transparent 1px);
    background-size: 52px 52px;
    mask-image: linear-gradient(to bottom, black, transparent 85%);
}

.hero-header::after {
    content: "";
    position: absolute;
    width: 440px;
    height: 440px;
    right: -120px;
    bottom: -120px;
    border-radius: 50%;
    background: rgba(229, 178, 45, .18);
    filter: blur(18px);
}

.hero-overlay {
    position: relative;
    z-index: 2;
    width: min(100%, 1060px);
}

.hero-etiqueta {
    display: inline-flex;
    padding: 10px 18px;
    border-radius: 999px;
    background: rgba(229,178,45,.13);
    border: 1px solid rgba(229,178,45,.35);
    color: var(--color-primario-2);
    font-size: 13px;
    font-weight: 800;
    letter-spacing: 1.4px;
    text-transform: uppercase;
    margin-bottom: 24px;
}

.hero-content h1 {
    color: #fff;
    font-size: clamp(42px, 7vw, 82px);
    font-weight: 900;
    text-transform: uppercase;
    letter-spacing: -3px;
    line-height: .98;
    margin-bottom: 24px;
    text-shadow: 0 15px 45px rgba(0,0,0,.55);
}

.hero-content h1::first-line {
    color: var(--color-primario);
}

.subtitulo {
    color: #F8FAFC;
    font-size: clamp(18px, 2.2vw, 28px);
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: 2px;
    margin-bottom: 14px;
}

.slogan {
    color: rgba(226,232,240,.86);
    font-size: 18px;
    font-weight: 400;
    margin-bottom: 40px;
}

.hero-actions {
    display: flex;
    justify-content: center;
    gap: 16px;
    flex-wrap: wrap;
}

/* BOTONES */
.btn-cta,
.btn-principal,
.btn-secundario {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 9px;
    padding: 17px 34px;
    text-decoration: none;
    border-radius: 999px;
    font-weight: 900;
    text-transform: uppercase;
    letter-spacing: .8px;
    transition: var(--transition);
    border: 1px solid transparent;
    cursor: pointer;
}

.btn-cta,
.btn-principal {
    background: linear-gradient(135deg, var(--color-primario), var(--color-primario-2));
    color: var(--color-oscuro);
    box-shadow: 0 15px 35px rgba(229,178,45,.30);
}

.btn-secundario {
    color: #fff;
    background: rgba(255,255,255,.08);
    border-color: rgba(255,255,255,.20);
    backdrop-filter: blur(12px);
}

.btn-cta:hover,
.btn-principal:hover,
.btn-secundario:hover {
    transform: translateY(-4px);
    box-shadow: 0 22px 45px rgba(229,178,45,.35);
}

/* STATS */
.seccion-estadisticas {
    position: relative;
    z-index: 5;
}

.stat-contenedor {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 22px;
    width: min(90%, 1220px);
    margin: -70px auto 0;
}

.stat-card {
    background: rgba(255,255,255,.92);
    backdrop-filter: blur(16px);
    border: 1px solid rgba(255,255,255,.55);
    padding: 34px 20px;
    text-align: center;
    border-radius: 22px;
    box-shadow: var(--shadow-soft);
    transition: var(--transition);
    position: relative;
    overflow: hidden;
}

.stat-card::before {
    content: "";
    position: absolute;
    inset: 0 0 auto 0;
    height: 5px;
    background: linear-gradient(90deg, var(--color-primario), var(--color-azul-detalles));
}

.stat-card:hover {
    transform: translateY(-8px);
    box-shadow: var(--shadow-hover);
}

.stat-numero {
    display: block;
    font-size: clamp(38px, 5vw, 58px);
    color: var(--color-oscuro);
    font-weight: 900;
    line-height: 1;
}

.stat-concepto {
    margin-top: 10px;
    color: var(--color-muted);
    font-size: 12px;
    text-transform: uppercase;
    letter-spacing: 1px;
    font-weight: 800;
}

/* CARDS CORPORATIVAS */
.mision-vision-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 28px;
}

.corporativo-card,
.valor-card,
.metodo-item,
.quienes-somos-wrapper,
.detalle-dinamico-contenedor {
    background: rgba(255,255,255,.90);
    border: 1px solid var(--borde);
    box-shadow: var(--shadow-soft);
    border-radius: 24px;
}

.corporativo-card {
    padding: 42px;
    transition: var(--transition);
    position: relative;
    overflow: hidden;
}

.corporativo-card::after {
    content: "";
    position: absolute;
    width: 180px;
    height: 180px;
    right: -90px;
    top: -90px;
    background: rgba(229,178,45,.14);
    border-radius: 50%;
}

.corporativo-card:hover {
    transform: translateY(-8px);
    box-shadow: var(--shadow-hover);
    border-color: rgba(229,178,45,.50);
}

.card-num {
    display: inline-block;
    color: var(--color-primario);
    font-size: 14px;
    font-weight: 900;
    margin-bottom: 20px;
}

.titulo-marcado {
    font-size: 23px;
    font-weight: 900;
    color: var(--color-azul-detalles);
    text-transform: uppercase;
    margin-bottom: 15px;
    letter-spacing: -.4px;
}

.corporativo-card p,
.texto-bloque p,
.metodo-item p,
.valor-card p {
    color: #475569;
    font-size: 15.5px;
    line-height: 1.8;
}

/* TARJETAS */
.grid-tarjetas {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 26px;
    margin-bottom: 42px;
}

.tarjeta-item {
    position: relative;
    background: var(--color-superficie);
    border-radius: 26px;
    overflow: hidden;
    cursor: pointer;
    transition: var(--transition);
    box-shadow: var(--shadow-soft);
    border: 1px solid rgba(148,163,184,.20);
    outline: none;
    min-height: 360px;
}

.tarjeta-imagen-wrapper {
    width: 100%;
    height: 100%;
    min-height: 360px;
    background: #000;
    overflow: hidden;
}

.tarjeta-item img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform .7s cubic-bezier(.2,.8,.2,1), filter .35s ease;
    filter: brightness(.75) saturate(1.08);
}

.tarjeta-contenido {
    position: absolute;
    inset: auto 18px 18px 18px;
    z-index: 2;
    padding: 22px;
    border-radius: 20px;
    background: rgba(11,15,25,.72);
    border: 1px solid rgba(255,255,255,.12);
    backdrop-filter: blur(12px);
}

.tarjeta-contenido span {
    color: var(--color-primario);
    display: block;
    font-size: 11px;
    font-weight: 900;
    letter-spacing: 1.5px;
    text-transform: uppercase;
    margin-bottom: 8px;
}

.tarjeta-contenido h3,
.tarjeta-item h3 {
    color: #fff;
    font-size: 19px;
    font-weight: 900;
    text-transform: uppercase;
    line-height: 1.2;
}

.tarjeta-linea {
    display: none;
}

.tarjeta-item:hover {
    transform: translateY(-10px);
    box-shadow: var(--shadow-hover);
    border-color: rgba(229,178,45,.65);
}

.tarjeta-item:hover img {
    transform: scale(1.08);
    filter: brightness(.95) saturate(1.12);
}

/* MODELOS */
.modelos-visor-seccion {
    display: none;
    margin-top: 55px;
    animation: fadeIn .45s ease;
}

.modelos-visor-seccion h3 {
    text-align: center;
    font-size: 32px;
    font-weight: 900;
    color: var(--color-oscuro);
    margin-bottom: 35px;
    text-transform: uppercase;
}

.modelos-internos-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 18px;
}

.modelo-card {
    background: rgba(255,255,255,.92);
    border-radius: 18px;
    padding: 22px;
    cursor: pointer;
    transition: var(--transition);
    box-shadow: var(--shadow-soft);
    border: 1px solid var(--borde);
}

.modelo-card:hover,
.modelo-card.active {
    transform: translateY(-6px);
    border-color: var(--color-primario);
    box-shadow: var(--shadow-hover);
}

.modelo-card.active {
    background: #0B0F19;
}

.card-nombre {
    display: block;
    font-weight: 900;
    font-size: 16px;
    color: var(--color-oscuro);
    text-transform: uppercase;
    line-height: 1.25;
}

.modelo-card.active .card-nombre {
    color: var(--color-primario);
}

.card-sub {
    display: block;
    margin-top: 8px;
    color: var(--color-muted);
    font-size: 12px;
    font-weight: 700;
}

.modelo-card.active .card-sub {
    color: rgba(255,255,255,.70);
}

/* DETALLE DINAMICO */
.detalle-dinamico-contenedor {
    display: none;
    margin-top: 45px;
    padding: 42px;
    animation: fadeIn .35s ease-out;
}

.detalle-flex {
    display: flex;
    gap: 42px;
    flex-wrap: wrap;
    align-items: flex-start;
}

.galeria-contenedor {
    width: 530px;
    max-width: 100%;
}

.imagen-principal {
    width: 100%;
    height: 410px;
    object-fit: contain;
    background:
        linear-gradient(135deg, rgba(11,15,25,.96), rgba(36,59,107,.94));
    border-radius: 22px;
    box-shadow: 0 20px 45px rgba(11,15,25,.18);
}

.miniaturas-grid {
    display: flex;
    gap: 12px;
    margin-top: 16px;
    overflow-x: auto;
    padding-bottom: 8px;
}

.miniatura {
    width: 102px;
    aspect-ratio: 4/3;
    object-fit: cover;
    background: var(--color-oscuro);
    border-radius: 14px;
    cursor: pointer;
    border: 3px solid transparent;
    opacity: .68;
    transition: var(--transition);
}

.miniatura:hover,
.miniatura.active {
    opacity: 1;
    border-color: var(--color-primario);
    transform: translateY(-3px);
}

.detalle-info {
    flex: 1;
    min-width: 320px;
}

.detalle-info h3 {
    font-size: clamp(28px, 4vw, 42px);
    font-weight: 900;
    color: var(--color-oscuro);
    margin-bottom: 25px;
    text-transform: uppercase;
    line-height: 1.05;
}

.tabla-tecnica {
    width: 100%;
    border-collapse: collapse;
    margin-bottom: 28px;
    overflow: hidden;
    border-radius: 18px;
    border: 1px solid #E2E8F0;
}

.tabla-tecnica tr:nth-child(even) {
    background: #F8FAFC;
}

.tabla-tecnica td {
    padding: 15px 18px;
    font-size: 14px;
    border-bottom: 1px solid #E2E8F0;
    color: #334155;
}

.tabla-tecnica td:first-child {
    font-weight: 900;
    color: var(--color-azul-detalles);
    text-transform: uppercase;
    font-size: 12px;
    letter-spacing: .6px;
    width: 42%;
}

.descripcion-texto {
    color: #475569;
    line-height: 1.8;
    font-size: 15px;
    background: #F8FAFC;
    padding: 22px;
    border-radius: 18px;
    border-left: 5px solid var(--color-primario);
}

.badge {
    padding: 7px 14px;
    border-radius: 999px;
    color: #fff;
    font-size: 11px;
    font-weight: 900;
    text-transform: uppercase;
    display: inline-block;
}

.badge-disponible { background: #16A34A; }
.badge-rentado { background: #DC2626; }

/* QUIENES SOMOS */
.quienes-somos-wrapper {
    padding: 50px;
    position: relative;
    overflow: hidden;
    border-left: 7px solid var(--color-primario);
}

.quienes-badge {
    display: inline-block;
    background: var(--color-oscuro);
    color: var(--color-primario);
    padding: 9px 16px;
    border-radius: 999px;
    font-size: 12px;
    font-weight: 900;
    text-transform: uppercase;
    margin-bottom: 18px;
}

.titulo-lateral {
    font-size: clamp(30px, 4vw, 44px);
    font-weight: 900;
    color: var(--color-oscuro);
    text-transform: uppercase;
    margin-bottom: 22px;
    letter-spacing: -1px;
}

/* PROYECTOS */
/* METODOLOGÍA Y VALORES */
.metodologia-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 24px;
    margin-bottom: 38px;
}

.metodo-item,
.valor-card {
    padding: 34px;
    transition: var(--transition);
}

.metodo-item:hover,
.valor-card:hover {
    transform: translateY(-7px);
    border-color: rgba(229,178,45,.55);
    box-shadow: var(--shadow-hover);
}

.metodo-icono {
    width: 58px;
    height: 58px;
    border-radius: 18px;
    display: grid;
    place-items: center;
    background: rgba(229,178,45,.16);
    font-size: 26px;
    margin-bottom: 16px;
}

.metodo-item h4,
.valor-card h3 {
    font-size: 18px;
    color: var(--color-oscuro);
    text-transform: uppercase;
    margin-bottom: 10px;
    font-weight: 900;
}

.seccion-valores-interna {
    margin-top: 45px;
}

.valores-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
    gap: 18px;
}

.valor-index {
    display: inline-block;
    font-size: 12px;
    font-weight: 900;
    color: var(--color-oscuro);
    background: var(--color-primario);
    padding: 5px 12px;
    border-radius: 999px;
    margin-bottom: 14px;
}

/* POLÍTICAS */
.legal-botones-contenedor {
    display: flex;
    justify-content: center;
    gap: 14px;
    flex-wrap: wrap;
    margin-bottom: 24px;
}

.btn-legal {
    appearance: none;
    background: var(--color-oscuro);
    color: rgba(255,255,255,.78);
    border: 1px solid rgba(255,255,255,.14);
    padding: 13px 20px;
    font-family: 'Poppins', sans-serif;
    font-size: 12px;
    font-weight: 900;
    text-transform: uppercase;
    letter-spacing: .6px;
    border-radius: 999px;
    cursor: pointer;
    transition: var(--transition);
}

.btn-legal:hover {
    color: var(--color-oscuro);
    background: var(--color-primario);
    transform: translateY(-3px);
}

.legal-placeholder {
    text-align: center;
    padding: 22px;
    color: var(--color-muted);
}

.legal-texto-contenido ul {
    padding-left: 24px;
    margin: 12px 0 18px;
}

.legal-texto-contenido li {
    margin-bottom: 8px;
}

/* CTA Y FOOTER */
.cta-banner {
    background:
        linear-gradient(135deg, rgba(11,15,25,.95), rgba(36,59,107,.90)),
        url("https://images.unsplash.com/photo-1541888946425-d81bb19240f5?q=80&w=1920");
    background-size: cover;
    background-position: center;
    text-align: center;
    padding: 120px 20px;
    color: #fff;
    border-top: 6px solid var(--color-primario);
}

.cta-wrapper {
    max-width: 880px;
    margin: auto;
}

.cta-wrapper h2 {
    font-size: clamp(34px, 5vw, 56px);
    font-weight: 900;
    color: #fff;
    text-transform: uppercase;
    letter-spacing: -1.5px;
    line-height: 1.05;
    margin-bottom: 18px;
}

.cta-banner p {
    font-size: 18px;
    color: rgba(226,232,240,.82);
    margin-bottom: 38px;
}

.footer-principal {
    background: #070A12;
    color: #fff;
    padding: 78px 20px 40px;
}

.footer-columnas {
    display: flex;
    justify-content: space-between;
    max-width: 1220px;
    margin: 0 auto;
    text-align: left;
    gap: 40px;
    flex-wrap: wrap;
}

.footer-info-empresa {
    flex: 1.5;
    min-width: 280px;
}

.footer-info-empresa h3 {
    color: var(--color-primario);
    font-size: 24px;
    font-weight: 900;
    margin-bottom: 14px;
    text-transform: uppercase;
}

.footer-info-empresa p,
.footer-datos-contacto .atencion {
    color: rgba(148,163,184,.86);
    font-size: 15px;
    line-height: 1.7;
}

.footer-datos-contacto {
    flex: 1;
    min-width: 250px;
}

.footer-datos-contacto h4 {
    font-size: 18px;
    text-transform: uppercase;
    margin-bottom: 15px;
    color: #fff;
}

.footer-datos-contacto .dato {
    color: #F8FAFC;
    font-weight: 700;
    font-size: 16px;
    margin-bottom: 8px;
}

.footer-divisor {
    border: none;
    height: 1px;
    background: rgba(255,255,255,.08);
    margin: 44px auto;
    max-width: 1220px;
}

.footer-base {
    text-align: center;
}

.copyright {
    color: rgba(148,163,184,.75);
    font-size: 13px;
    font-weight: 600;
}

.whatsapp-flotante {
    position: fixed;
    right: 24px;
    bottom: 24px;
    width: 64px;
    height: 64px;
    border-radius: 50%;
    background: #25D366;
    color: #fff;
    text-decoration: none;
    display: grid;
    place-items: center;
    font-size: 34px;
    box-shadow: 0 16px 36px rgba(37,211,102,.40);
    z-index: 998;
    transition: var(--transition);
}

.whatsapp-flotante:hover {
    transform: scale(1.10) rotate(8deg);
}

/* ANIMACIONES */
.reveal {
    opacity: 0;
    transform: translateY(26px);
    transition: .75s cubic-bezier(.2,.8,.2,1);
}

.reveal.visible {
    opacity: 1;
    transform: translateY(0);
}

@keyframes fadeIn {
    from { opacity: 0; transform: translateY(12px) scale(.99); }
    to { opacity: 1; transform: translateY(0) scale(1); }
}

/* RESPONSIVE */
@media (max-width: 1200px) {
    .grid-tarjetas,
    .modelos-internos-grid,
    .stat-contenedor {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 850px) {
    .menu-toggle {
        display: block;
    }

    .nav-menu {
        position: absolute;
        top: 100%;
        left: 4%;
        right: 4%;
        display: none;
        flex-direction: column;
        align-items: stretch;
        gap: 0;
        padding: 18px;
        background: rgba(11,15,25,.98);
        border: 1px solid rgba(229,178,45,.25);
        border-radius: 0 0 22px 22px;
        box-shadow: 0 25px 50px rgba(0,0,0,.30);
    }

    .nav-menu.show {
        display: flex;
    }

    .nav-menu a {
        padding: 15px;
        text-align: center;
        border-bottom: 1px solid rgba(255,255,255,.07);
    }

    .nav-menu .nav-cta {
        margin-top: 12px;
    }

    .hero-content h1 {
        letter-spacing: -1.5px;
    }

    .mision-vision-grid,
    .metodologia-grid,
    .grid-tarjetas,
    .modelos-internos-grid,
    .stat-contenedor,
    .valores-grid {
        grid-template-columns: 1fr;
    }

    .stat-contenedor {
        margin-top: 35px;
    }

    .contenedor-global {
        padding-top: 70px;
    }

    .tarjeta-item,
    .tarjeta-imagen-wrapper {
        min-height: 310px;
    }

    .detalle-dinamico-contenedor,
    .quienes-somos-wrapper,
    .corporativo-card {
        padding: 26px 20px;
    }

    .detalle-flex {
        gap: 28px;
    }

    .imagen-principal {
        height: 290px;
    }

    .footer-columnas {
        text-align: center;
        flex-direction: column;
    }

    .legal-botones-contenedor {
        flex-direction: column;
        align-items: center;
    }

    .btn-legal {
        width: min(100%, 340px);
    }

    .whatsapp-flotante {
        width: 58px;
        height: 58px;
        right: 18px;
        bottom: 18px;
        font-size: 28px;
    }
}

@media (max-width: 520px) {
    .hero-actions {
        flex-direction: column;
    }

    .btn-principal,
    .btn-secundario,
    .btn-cta {
        width: 100%;
    }

    .hero-etiqueta {
        font-size: 11px;
    }

    .subtitulo {
        letter-spacing: 1px;
    }
}

/* ========================================================================== 
   MEJORA PREMIUM: FICHA DE MODELOS DE MAQUINARIA
   ========================================================================== */
#detalleModelo.detalle-dinamico-contenedor {
    padding: 0;
    background: transparent;
    box-shadow: none;
    border: none;
}

.equipo-premium-card {
    display: grid;
    grid-template-columns: minmax(360px, 1.08fr) minmax(340px, .92fr);
    gap: 34px;
    align-items: stretch;
    background:
        radial-gradient(circle at 8% 10%, rgba(229,178,45,.18), transparent 32%),
        linear-gradient(135deg, rgba(255,255,255,.98), rgba(248,250,252,.96));
    border: 1px solid rgba(36,59,107,.10);
    border-radius: 34px;
    padding: 28px;
    box-shadow: 0 34px 90px rgba(11,15,25,.14);
    position: relative;
    overflow: hidden;
}

.equipo-premium-card::before {
    content: "";
    position: absolute;
    inset: 0 0 auto 0;
    height: 8px;
    background: linear-gradient(90deg, var(--color-primario), #F7D87A, var(--color-azul-detalles));
}

.equipo-media {
    position: relative;
}

.equipo-foto-principal {
    position: relative;
    height: 520px;
    border-radius: 28px;
    overflow: hidden;
    background: #0B0F19;
    box-shadow: 0 28px 60px rgba(11,15,25,.20);
}

.equipo-foto-principal::after {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(180deg, transparent 58%, rgba(11,15,25,.42));
    pointer-events: none;
}

.equipo-foto-principal img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
    transition: transform .55s ease, opacity .18s ease;
}

.equipo-foto-principal:hover img {
    transform: scale(1.035);
}

#imgPrincipalMaquinaria.changing {
    opacity: .35;
}

.equipo-status {
    position: absolute;
    top: 22px;
    left: 22px;
    z-index: 5;
    padding: 10px 18px;
    border-radius: 999px;
    color: #fff;
    font-size: 12px;
    font-weight: 900;
    text-transform: uppercase;
    letter-spacing: .7px;
    box-shadow: 0 12px 28px rgba(0,0,0,.24);
}

.premium-thumbs {
    display: grid;
    grid-template-columns: repeat(4, minmax(86px, 1fr));
    gap: 14px;
    margin-top: 18px;
    overflow: visible;
    padding-bottom: 0;
}

.miniatura-btn {
    border: 0;
    padding: 0;
    height: 92px;
    border-radius: 18px;
    overflow: hidden;
    cursor: pointer;
    background: #0B0F19;
    box-shadow: 0 12px 26px rgba(11,15,25,.12);
    outline: 3px solid transparent;
    outline-offset: 3px;
    opacity: .72;
    transition: var(--transition);
}

.miniatura-btn img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}

.miniatura-btn:hover,
.miniatura-btn.active {
    opacity: 1;
    transform: translateY(-4px);
    outline-color: var(--color-primario);
}

.equipo-info-panel {
    background: rgba(255,255,255,.72);
    border: 1px solid rgba(36,59,107,.09);
    border-radius: 28px;
    padding: 38px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    box-shadow: inset 0 1px 0 rgba(255,255,255,.8);
}

.equipo-etiqueta {
    width: fit-content;
    color: var(--color-primario);
    background: rgba(229,178,45,.13);
    border: 1px solid rgba(229,178,45,.28);
    padding: 8px 14px;
    border-radius: 999px;
    font-size: 12px;
    font-weight: 900;
    letter-spacing: 1.4px;
    text-transform: uppercase;
    margin-bottom: 16px;
}

.equipo-info-panel h3 {
    font-size: clamp(34px, 4.6vw, 58px);
    line-height: .96;
    letter-spacing: -1.8px;
    margin-bottom: 18px;
}

.equipo-resumen {
    color: #475569;
    font-size: 17px;
    line-height: 1.8;
    background: #F8FAFC;
    border-left: 6px solid var(--color-primario);
    border-radius: 18px;
    padding: 22px 24px;
    margin-bottom: 24px;
}

.specs-premium-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 14px;
    margin-bottom: 24px;
}

.spec-premium {
    background: #FFFFFF;
    border: 1px solid #E2E8F0;
    border-radius: 18px;
    padding: 18px;
    min-height: 96px;
    box-shadow: 0 12px 28px rgba(36,59,107,.06);
}

.spec-premium span {
    display: block;
    color: var(--color-azul-detalles);
    font-size: 11px;
    font-weight: 900;
    text-transform: uppercase;
    letter-spacing: .8px;
    margin-bottom: 9px;
}

.spec-premium strong {
    display: block;
    color: var(--color-oscuro);
    font-size: 16px;
    font-weight: 900;
    word-break: break-word;
}

.equipo-cta-box {
    background: linear-gradient(135deg, #0B0F19, #17213A);
    border-radius: 22px;
    padding: 22px;
    display: flex;
    gap: 18px;
    justify-content: space-between;
    align-items: center;
    color: #fff;
    box-shadow: 0 22px 48px rgba(11,15,25,.20);
}

.equipo-cta-box .cta-mini {
    display: block;
    color: var(--color-primario);
    font-size: 12px;
    font-weight: 900;
    text-transform: uppercase;
    letter-spacing: 1px;
    margin-bottom: 6px;
}

.equipo-cta-box strong {
    font-size: 16px;
}

.btn-equipo {
    white-space: nowrap;
    padding: 15px 26px;
    border-radius: 999px;
}

@media (max-width: 1050px) {
    .equipo-premium-card {
        grid-template-columns: 1fr;
    }

    .equipo-foto-principal {
        height: 460px;
    }
}

@media (max-width: 768px) {
    .equipo-premium-card {
        padding: 18px;
        border-radius: 26px;
    }

    .equipo-foto-principal {
        height: 320px;
        border-radius: 22px;
    }

    .equipo-info-panel {
        padding: 24px 18px;
        border-radius: 22px;
    }

    .specs-premium-grid {
        grid-template-columns: 1fr;
    }

    .premium-thumbs {
        grid-template-columns: repeat(4, 1fr);
        gap: 9px;
    }

    .miniatura-btn {
        height: 70px;
        border-radius: 14px;
    }

    .equipo-cta-box {
        flex-direction: column;
        align-items: stretch;
        text-align: center;
    }

    .btn-equipo {
        width: 100%;
        text-align: center;
    }
}


/* Fix títulos maquinaria */
.equipo-info-panel h3{
word-break: normal !important;
overflow-wrap: normal !important;
hyphens: none !important;
font-size: clamp(2.4rem,3vw,4.2rem) !important;
line-height: 1 !important;
}

/* ========================================================================== 
   FIX FINAL: TARJETAS DEL CATÁLOGO SIN TEXTO CORTADO
   Evita que MOTOCONFORMADORA / VIBROCOMPACTADOR se salgan del recuadro.
   ========================================================================== */
.catalogo-grid .tarjeta-contenido {
    left: 18px !important;
    right: 18px !important;
    bottom: 18px !important;
    width: auto !important;
    max-width: none !important;
    padding: 22px 24px !important;
    border-radius: 24px !important;
}

.catalogo-grid .tarjeta-contenido h3,
.catalogo-grid .tarjeta-item h3 {
    font-size: clamp(18px, 1.15vw, 22px) !important;
    line-height: 1.08 !important;
    letter-spacing: -0.3px !important;
    white-space: nowrap !important;
    word-break: normal !important;
    overflow-wrap: normal !important;
    hyphens: none !important;
    max-width: 100% !important;
    overflow: visible !important;
}

.catalogo-grid .tarjeta-contenido span {
    font-size: 10.5px !important;
    letter-spacing: 1.8px !important;
}

@media (max-width: 1200px) {
    .catalogo-grid .tarjeta-contenido h3,
    .catalogo-grid .tarjeta-item h3 {
        font-size: 24px !important;
    }
}

@media (max-width: 520px) {
    .catalogo-grid .tarjeta-contenido {
        left: 14px !important;
        right: 14px !important;
        bottom: 14px !important;
        padding: 20px 18px !important;
    }

    .catalogo-grid .tarjeta-contenido h3,
    .catalogo-grid .tarjeta-item h3 {
        font-size: 20px !important;
        letter-spacing: -0.5px !important;
    }
}


/* ========================================================================== 
   REDISEÑO VISUAL FINAL JRS - MÁS ATRACTIVO Y SIN TEXTOS CORTADOS
   ========================================================================== */
body {
    background:
        radial-gradient(circle at 8% 8%, rgba(229,178,45,.18), transparent 28%),
        radial-gradient(circle at 95% 20%, rgba(36,59,107,.14), transparent 32%),
        linear-gradient(180deg, #F8FAFC 0%, #EEF3FA 52%, #E6ECF6 100%) !important;
}

.navbar {
    background: rgba(7,10,18,.88) !important;
    border-bottom: 1px solid rgba(229,178,45,.35) !important;
}

.nav-logo span {
    font-size: 34px !important;
    text-shadow: 0 8px 22px rgba(229,178,45,.22);
}

.hero-header {
    background:
        linear-gradient(115deg, rgba(7,10,18,.97) 0%, rgba(7,10,18,.82) 45%, rgba(36,59,107,.62) 100%),
        url("https://images.unsplash.com/photo-1504307651254-35680f356dfd?q=80&w=1920") !important;
    background-size: cover !important;
    background-position: center !important;
}

.hero-content h1 {
    color: #fff !important;
    text-shadow: 0 22px 55px rgba(0,0,0,.62) !important;
}

.hero-content h1::first-line {
    color: var(--color-primario) !important;
}

.grid-tarjetas {
    gap: 30px !important;
}

.tarjeta-item {
    border-radius: 30px !important;
    min-height: 390px !important;
    box-shadow: 0 28px 70px rgba(15,23,42,.13) !important;
    border: 1px solid rgba(255,255,255,.65) !important;
    background: #0B0F19 !important;
}

.tarjeta-imagen-wrapper {
    min-height: 390px !important;
}

.tarjeta-item::before {
    content: "";
    position: absolute;
    inset: 0;
    z-index: 1;
    background: linear-gradient(180deg, rgba(11,15,25,.04) 0%, rgba(11,15,25,.28) 42%, rgba(11,15,25,.72) 100%);
    pointer-events: none;
}

.tarjeta-contenido {
    z-index: 2 !important;
    left: 22px !important;
    right: 22px !important;
    bottom: 22px !important;
    width: auto !important;
    max-width: none !important;
    padding: 24px 26px !important;
    border-radius: 26px !important;
    background: linear-gradient(135deg, rgba(7,10,18,.90), rgba(22,30,48,.90)) !important;
    border: 1px solid rgba(255,255,255,.18) !important;
    box-shadow: 0 18px 42px rgba(0,0,0,.28) !important;
    backdrop-filter: blur(16px) !important;
    overflow: hidden !important;
}

.tarjeta-contenido::after {
    content: "";
    position: absolute;
    inset: 0 auto 0 0;
    width: 6px;
    background: linear-gradient(180deg, var(--color-primario), var(--color-primario-2));
}

.tarjeta-contenido span {
    color: var(--color-primario) !important;
    font-size: 12px !important;
    letter-spacing: 2px !important;
    margin-bottom: 10px !important;
}

.tarjeta-contenido h3,
.tarjeta-item h3,
.catalogo-grid .tarjeta-contenido h3,
.catalogo-grid .tarjeta-item h3 {
    color: #fff !important;
    font-size: clamp(18px, 1.35vw, 24px) !important;
    line-height: 1.08 !important;
    letter-spacing: -.4px !important;
    white-space: normal !important;
    overflow-wrap: normal !important;
    word-break: normal !important;
    hyphens: none !important;
    overflow: visible !important;
    max-width: 100% !important;
}

.tarjeta-item:hover {
    transform: translateY(-12px) scale(1.01) !important;
    box-shadow: 0 42px 90px rgba(15,23,42,.24) !important;
}

.tarjeta-item:hover img {
    transform: scale(1.08) !important;
    filter: brightness(1.02) saturate(1.18) contrast(1.03) !important;
}

.modelos-internos-grid {
    display: grid !important;
    grid-template-columns: repeat(auto-fit, minmax(230px, 1fr)) !important;
    gap: 18px !important;
}

.modelo-card {
    border-radius: 22px !important;
    padding: 24px !important;
    background: rgba(255,255,255,.96) !important;
    border: 1px solid rgba(36,59,107,.12) !important;
}

.modelo-card.active,
.modelo-card:hover {
    background: linear-gradient(135deg, #0B0F19, #17213A) !important;
    border-color: var(--color-primario) !important;
}

.modelo-card:hover .card-nombre,
.modelo-card.active .card-nombre {
    color: var(--color-primario) !important;
}

.equipo-premium-card {
    grid-template-columns: minmax(420px, 1fr) minmax(470px, .95fr) !important;
    gap: 38px !important;
    border-radius: 38px !important;
    padding: 30px !important;
    background:
        radial-gradient(circle at 8% 8%, rgba(229,178,45,.20), transparent 30%),
        linear-gradient(135deg, #FFFFFF, #F8FAFC) !important;
    box-shadow: 0 42px 100px rgba(11,15,25,.16) !important;
}

.equipo-foto-principal {
    height: 560px !important;
    border-radius: 30px !important;
}

.equipo-info-panel {
    padding: 40px !important;
    background: rgba(255,255,255,.86) !important;
    border-radius: 30px !important;
    min-width: 0 !important;
    overflow: visible !important;
}

.titulo-equipo-premium,
.equipo-info-panel h3 {
    display: block !important;
    color: #08101F !important;
    text-transform: uppercase !important;
    font-weight: 900 !important;
    line-height: .95 !important;
    letter-spacing: -1.2px !important;
    margin: 0 0 22px 0 !important;
    font-size: clamp(42px, 4.1vw, 72px) !important;
    word-break: normal !important;
    overflow-wrap: normal !important;
    hyphens: none !important;
}

.titulo-linea-principal,
.titulo-linea-marca {
    display: block !important;
    white-space: normal !important;
    word-break: normal !important;
    overflow-wrap: normal !important;
    hyphens: none !important;
}

.titulo-linea-marca {
    color: var(--color-azul-detalles) !important;
    margin-top: 8px !important;
}

.equipo-resumen {
    background: linear-gradient(135deg, #F8FAFC, #FFFFFF) !important;
    box-shadow: 0 14px 35px rgba(36,59,107,.07) !important;
}

.spec-premium {
    border-radius: 20px !important;
    box-shadow: 0 16px 36px rgba(36,59,107,.08) !important;
}

.equipo-cta-box {
    background: linear-gradient(135deg, #07101f, #17213A 55%, #243B6B) !important;
}

@media (max-width: 1180px) {
    .equipo-premium-card {
        grid-template-columns: 1fr !important;
    }
    .titulo-equipo-premium,
    .equipo-info-panel h3 {
        font-size: clamp(38px, 6vw, 66px) !important;
    }
}

@media (max-width: 768px) {
    .tarjeta-item,
    .tarjeta-imagen-wrapper {
        min-height: 330px !important;
    }
    .tarjeta-contenido {
        left: 16px !important;
        right: 16px !important;
        bottom: 16px !important;
        padding: 22px 20px !important;
    }
    .tarjeta-contenido h3,
    .tarjeta-item h3,
    .catalogo-grid .tarjeta-contenido h3,
    .catalogo-grid .tarjeta-item h3 {
        font-size: clamp(20px, 7vw, 30px) !important;
        white-space: normal !important;
    }
    .equipo-foto-principal {
        height: 340px !important;
    }
    .titulo-equipo-premium,
    .equipo-info-panel h3 {
        font-size: clamp(34px, 10vw, 48px) !important;
        line-height: 1 !important;
    }
}


/* ========================================================================== 
   CHATBOT FLOTANTE JRS
   ========================================================================== */
.jrs-chatbot {
    position: fixed;
    right: 24px;
    bottom: 102px;
    z-index: 1200;
    font-family: 'Poppins', sans-serif;
}

.jrs-chat-toggle {
    position: relative;
    width: 66px;
    height: 66px;
    border-radius: 50%;
    border: none;
    cursor: pointer;
    display: grid;
    place-items: center;
    background: linear-gradient(135deg, var(--color-primario), var(--color-primario-2));
    color: var(--color-oscuro);
    font-size: 30px;
    box-shadow: 0 18px 44px rgba(229, 178, 45, .45);
    transition: var(--transition);
}

.jrs-chat-toggle:hover {
    transform: translateY(-4px) scale(1.04);
}

.jrs-chat-pulse {
    position: absolute;
    inset: -7px;
    border-radius: 50%;
    border: 2px solid rgba(229, 178, 45, .55);
    animation: jrsPulse 1.8s infinite;
}

.jrs-chat-window {
    position: absolute;
    right: 0;
    bottom: 84px;
    width: min(370px, calc(100vw - 34px));
    background: rgba(255,255,255,.98);
    border: 1px solid rgba(36, 59, 107, .14);
    border-radius: 26px;
    overflow: hidden;
    box-shadow: 0 30px 90px rgba(11, 15, 25, .28);
    transform: translateY(18px) scale(.96);
    opacity: 0;
    pointer-events: none;
    transition: .28s ease;
}

.jrs-chatbot.active .jrs-chat-window {
    transform: translateY(0) scale(1);
    opacity: 1;
    pointer-events: auto;
}

.jrs-chatbot.active .jrs-chat-pulse {
    display: none;
}

.jrs-chat-header {
    background: linear-gradient(135deg, #0B0F19, #17213A);
    color: #fff;
    padding: 20px;
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    border-bottom: 4px solid var(--color-primario);
}

.jrs-chat-header strong {
    display: block;
    font-size: 17px;
    font-weight: 900;
    text-transform: uppercase;
    letter-spacing: .4px;
}

.jrs-chat-header small {
    color: rgba(255,255,255,.68);
    font-weight: 600;
}

.jrs-chat-status {
    display: inline-block;
    width: 9px;
    height: 9px;
    background: #22C55E;
    border-radius: 50%;
    margin-right: 8px;
    box-shadow: 0 0 0 5px rgba(34,197,94,.15);
}

.jrs-chat-close {
    width: 34px;
    height: 34px;
    border-radius: 50%;
    border: 1px solid rgba(255,255,255,.14);
    background: rgba(255,255,255,.08);
    color: #fff;
    font-size: 24px;
    cursor: pointer;
    line-height: 1;
}

.jrs-chat-body {
    max-height: 360px;
    overflow-y: auto;
    padding: 18px;
    background:
        radial-gradient(circle at top left, rgba(229,178,45,.12), transparent 32%),
        #F8FAFC;
}

.jrs-message {
    width: fit-content;
    max-width: 88%;
    padding: 13px 15px;
    border-radius: 18px;
    font-size: 14px;
    line-height: 1.55;
    margin-bottom: 12px;
    box-shadow: 0 10px 24px rgba(15,23,42,.06);
}

.jrs-message.bot {
    background: #fff;
    color: #334155;
    border: 1px solid #E2E8F0;
    border-bottom-left-radius: 6px;
}

.jrs-message.user {
    margin-left: auto;
    background: linear-gradient(135deg, var(--color-primario), var(--color-primario-2));
    color: var(--color-oscuro);
    font-weight: 700;
    border-bottom-right-radius: 6px;
}

.jrs-chat-options {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 9px;
    margin-top: 12px;
}

.jrs-chat-options button {
    border: 1px solid rgba(36, 59, 107, .15);
    background: #fff;
    color: var(--color-azul-detalles);
    padding: 10px;
    border-radius: 14px;
    cursor: pointer;
    font-size: 12px;
    font-weight: 900;
    text-transform: uppercase;
    transition: var(--transition);
}

.jrs-chat-options button:hover {
    background: var(--color-oscuro);
    color: var(--color-primario);
    transform: translateY(-2px);
}

.jrs-chat-form {
    display: flex;
    gap: 10px;
    padding: 14px;
    background: #fff;
    border-top: 1px solid #E2E8F0;
}

.jrs-chat-form input {
    flex: 1;
    min-width: 0;
    border: 1px solid #CBD5E1;
    border-radius: 999px;
    padding: 12px 14px;
    font-family: 'Poppins', sans-serif;
    outline: none;
}

.jrs-chat-form input:focus {
    border-color: var(--color-primario);
    box-shadow: 0 0 0 4px rgba(229,178,45,.14);
}

.jrs-chat-form button {
    border: none;
    border-radius: 999px;
    padding: 0 16px;
    background: var(--color-oscuro);
    color: #fff;
    font-weight: 900;
    cursor: pointer;
}

@keyframes jrsPulse {
    0% { transform: scale(.9); opacity: .85; }
    100% { transform: scale(1.35); opacity: 0; }
}

@media (max-width: 768px) {
    .jrs-chatbot {
        right: 18px;
        bottom: 88px;
    }

    .jrs-chat-toggle {
        width: 58px;
        height: 58px;
        font-size: 26px;
    }

    .jrs-chat-window {
        bottom: 74px;
    }
}

/* ========================================================================== 
   CHATBOT MÁS INTELIGENTE - AJUSTES VISUALES
   ========================================================================== */
.jrs-chat-link {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    margin-top: 4px;
    padding: 10px 14px;
    border-radius: 999px;
    background: linear-gradient(135deg, var(--color-primario), var(--color-primario-2));
    color: var(--color-oscuro) !important;
    font-weight: 900;
    text-decoration: none;
    box-shadow: 0 10px 25px rgba(229,178,45,.28);
}

.jrs-message.bot strong {
    color: var(--color-oscuro);
    font-weight: 900;
}

.jrs-message.bot em {
    color: var(--color-azul-detalles);
    font-style: normal;
    font-weight: 800;
}

.jrs-typing {
    display: inline-flex;
    gap: 5px;
    align-items: center;
    min-width: 58px;
}

.jrs-typing span {
    width: 7px;
    height: 7px;
    background: var(--color-primario);
    border-radius: 50%;
    display: block;
    animation: jrsTypingDots 1s infinite ease-in-out;
}

.jrs-typing span:nth-child(2) { animation-delay: .14s; }
.jrs-typing span:nth-child(3) { animation-delay: .28s; }

@keyframes jrsTypingDots {
    0%, 80%, 100% { transform: translateY(0); opacity: .45; }
    40% { transform: translateY(-5px); opacity: 1; }
}


/* ========================================================================== 
   UPGRADE VISUAL JRS - GRÁFICOS, TARJETAS Y CHATBOT MÁS PREMIUM
   ========================================================================== */
.visual-dashboard {
    width: min(90%, 1220px);
    margin: 80px auto 0;
    position: relative;
    z-index: 3;
}

.dashboard-shell {
    display: grid;
    grid-template-columns: 1fr 1.15fr;
    gap: 34px;
    align-items: center;
    padding: 36px;
    border-radius: 34px;
    background:
        radial-gradient(circle at 8% 10%, rgba(229,178,45,.24), transparent 30%),
        radial-gradient(circle at 92% 70%, rgba(36,59,107,.18), transparent 32%),
        linear-gradient(135deg, rgba(11,15,25,.98), rgba(19,31,54,.96));
    box-shadow: 0 36px 90px rgba(11,15,25,.28);
    border: 1px solid rgba(255,255,255,.10);
    overflow: hidden;
    position: relative;
}

.dashboard-shell::before {
    content: "";
    position: absolute;
    inset: 0;
    background:
        linear-gradient(rgba(255,255,255,.045) 1px, transparent 1px),
        linear-gradient(90deg, rgba(255,255,255,.045) 1px, transparent 1px);
    background-size: 44px 44px;
    opacity: .4;
    pointer-events: none;
}

.dashboard-copy,
.dashboard-graphics { position: relative; z-index: 2; }
.dashboard-kicker { text-align: left; margin-bottom: 10px; }

.dashboard-copy h2 {
    color: #fff;
    font-size: clamp(30px, 4vw, 52px);
    line-height: 1.02;
    text-transform: uppercase;
    font-weight: 900;
    letter-spacing: -1.4px;
    margin-bottom: 16px;
}

.dashboard-copy p {
    color: rgba(226,232,240,.80);
    font-size: 16px;
    line-height: 1.75;
    margin-bottom: 22px;
}

.dashboard-badges {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
}

.dashboard-badges span {
    color: #fff;
    font-size: 12px;
    font-weight: 900;
    letter-spacing: .8px;
    text-transform: uppercase;
    padding: 10px 14px;
    border-radius: 999px;
    background: rgba(255,255,255,.09);
    border: 1px solid rgba(255,255,255,.14);
}

.dashboard-graphics {
    display: grid;
    grid-template-columns: .85fr 1.15fr;
    gap: 18px;
}

.donut-card,
.bar-card {
    background: rgba(255,255,255,.10);
    border: 1px solid rgba(255,255,255,.14);
    border-radius: 28px;
    padding: 24px;
    backdrop-filter: blur(14px);
    box-shadow: inset 0 1px 0 rgba(255,255,255,.10);
}

.donut-card {
    text-align: center;
    display: grid;
    place-items: center;
}

.donut-chart {
    width: 158px;
    height: 158px;
    border-radius: 50%;
    display: grid;
    place-items: center;
    background: conic-gradient(var(--color-primario) 0 72%, rgba(255,255,255,.18) 72% 100%);
    position: relative;
    margin-bottom: 18px;
    box-shadow: 0 20px 45px rgba(229,178,45,.18);
}

.donut-chart::after {
    content: "";
    position: absolute;
    width: 108px;
    height: 108px;
    border-radius: 50%;
    background: #101827;
    box-shadow: inset 0 0 0 1px rgba(255,255,255,.10);
}

.donut-chart span {
    position: relative;
    z-index: 2;
    color: #fff;
    font-size: 42px;
    font-weight: 900;
}

.donut-card strong {
    color: #fff;
    font-size: 17px;
    text-transform: uppercase;
    font-weight: 900;
}

.donut-card small {
    color: rgba(226,232,240,.68);
    margin-top: 8px;
    line-height: 1.5;
}

.bar-card {
    display: grid;
    gap: 16px;
}

.bar-row {
    display: grid;
    grid-template-columns: 110px 1fr 34px;
    align-items: center;
    gap: 12px;
    color: #fff;
}

.bar-row span,
.bar-row b {
    font-size: 12px;
    font-weight: 900;
    text-transform: uppercase;
}

.bar-row i {
    height: 13px;
    border-radius: 999px;
    background: rgba(255,255,255,.14);
    overflow: hidden;
    position: relative;
}

.bar-row i::before {
    content: "";
    position: absolute;
    inset: 0 auto 0 0;
    width: var(--w);
    border-radius: inherit;
    background: linear-gradient(90deg, var(--color-primario), #F7D87A);
    box-shadow: 0 0 22px rgba(229,178,45,.45);
}

/* Tarjetas más impactantes */
.tarjeta-item {
    isolation: isolate;
}

.tarjeta-item::before {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(180deg, transparent 35%, rgba(11,15,25,.86) 100%);
    z-index: 1;
    pointer-events: none;
}

.tarjeta-contenido {
    box-shadow: 0 18px 42px rgba(0,0,0,.22);
}

.catalogo-grid .tarjeta-contenido h3,
.tarjeta-contenido h3 {
    overflow-wrap: normal !important;
    word-break: normal !important;
    hyphens: none !important;
    text-wrap: balance;
}

/* Modelos con look de inventario premium */
.modelo-card {
    position: relative;
    overflow: hidden;
}

.modelo-card::before {
    content: "";
    position: absolute;
    inset: 0 0 auto 0;
    height: 5px;
    background: linear-gradient(90deg, var(--color-primario), var(--color-azul-detalles));
    transform: scaleX(0);
    transform-origin: left;
    transition: var(--transition);
}

.modelo-card:hover::before,
.modelo-card.active::before { transform: scaleX(1); }

.modelo-card .card-nombre {
    font-size: clamp(14px, 1.3vw, 18px);
}

/* Chatbot flotante rediseñado */
.jrs-chat-toggle {
    width: 72px !important;
    height: 72px !important;
    background:
        radial-gradient(circle at 35% 25%, #fff7d6, transparent 26%),
        linear-gradient(135deg, #E5B22D, #F6D26A 55%, #B98712) !important;
    box-shadow: 0 22px 54px rgba(229,178,45,.50), 0 0 0 10px rgba(229,178,45,.10) !important;
}

.jrs-chat-icon {
    font-size: 34px;
    filter: drop-shadow(0 6px 8px rgba(0,0,0,.15));
}

.jrs-chat-window {
    width: min(420px, calc(100vw - 32px)) !important;
    border-radius: 32px !important;
    border: 1px solid rgba(229,178,45,.28) !important;
    box-shadow: 0 40px 110px rgba(11,15,25,.34) !important;
}

.jrs-chat-header {
    padding: 22px 22px 20px !important;
    background:
        radial-gradient(circle at 15% 20%, rgba(229,178,45,.25), transparent 32%),
        linear-gradient(135deg, #070A12, #17213A 62%, #243B6B) !important;
}

.jrs-chat-header strong::before {
    content: "🚜 ";
}

.jrs-chat-body {
    background:
        radial-gradient(circle at 0% 0%, rgba(229,178,45,.16), transparent 30%),
        linear-gradient(180deg, #F8FAFC, #EEF2F8) !important;
}

.jrs-message {
    border-radius: 20px !important;
}

.jrs-message.bot {
    border-left: 5px solid var(--color-primario) !important;
}

.jrs-message.user {
    box-shadow: 0 12px 28px rgba(229,178,45,.22) !important;
}

.jrs-chat-options button {
    border-radius: 18px !important;
    min-height: 48px;
    box-shadow: 0 10px 22px rgba(36,59,107,.06);
}

.jrs-chat-form {
    padding: 16px !important;
    background: linear-gradient(180deg, #fff, #F8FAFC) !important;
}

.jrs-chat-form button {
    background: linear-gradient(135deg, #0B0F19, #243B6B) !important;
    padding: 0 20px !important;
}

@media (max-width: 900px) {
    .dashboard-shell,
    .dashboard-graphics {
        grid-template-columns: 1fr;
    }
    .dashboard-copy { text-align: center; }
    .dashboard-kicker { text-align: center; }
    .dashboard-badges { justify-content: center; }
}

@media (max-width: 520px) {
    .visual-dashboard { margin-top: 45px; }
    .dashboard-shell { padding: 22px; border-radius: 26px; }
    .bar-row { grid-template-columns: 92px 1fr 28px; gap: 8px; }
    .donut-chart { width: 138px; height: 138px; }
    .donut-chart::after { width: 94px; height: 94px; }
    .jrs-chat-window { bottom: 82px !important; }
}

/* ========================================================================== 
   CORRECCIÓN VISUAL: CHATBOT MÁS LEGIBLE Y SIN TAPAR EL HERO
   ========================================================================== */
.jrs-chatbot {
    right: 26px !important;
    bottom: 98px !important;
    z-index: 20000 !important;
}

.jrs-chat-toggle {
    width: 62px !important;
    height: 62px !important;
    border: 3px solid rgba(255,255,255,.85) !important;
    box-shadow: 0 18px 42px rgba(229,178,45,.45), 0 0 0 10px rgba(229,178,45,.10) !important;
}

.jrs-chat-window {
    position: fixed !important;
    right: 26px !important;
    bottom: 172px !important;
    width: min(405px, calc(100vw - 36px)) !important;
    max-height: min(430px, calc(100vh - 205px)) !important;
    display: flex !important;
    flex-direction: column !important;
    overflow: hidden !important;
    border-radius: 24px !important;
    background: #FFFFFF !important;
    border: 1px solid rgba(36,59,107,.16) !important;
    box-shadow: 0 26px 70px rgba(11,15,25,.30) !important;
}

.jrs-chat-header {
    flex: 0 0 auto !important;
    padding: 16px 18px !important;
    background: linear-gradient(135deg, #0B0F19, #1B2842) !important;
}

.jrs-chat-header strong {
    font-size: 15px !important;
}

.jrs-chat-header small {
    display: block !important;
    margin-top: 2px !important;
    font-size: 11px !important;
}

.jrs-chat-body {
    flex: 1 1 auto !important;
    max-height: none !important;
    min-height: 170px !important;
    overflow-y: auto !important;
    padding: 14px !important;
    background: linear-gradient(180deg, #F8FAFC, #EEF2F8) !important;
}

.jrs-message {
    max-width: 94% !important;
    padding: 11px 13px !important;
    font-size: 13px !important;
    line-height: 1.45 !important;
    margin-bottom: 10px !important;
}

.jrs-chat-options {
    gap: 8px !important;
    margin-top: 8px !important;
}

.jrs-chat-options button {
    padding: 9px 8px !important;
    font-size: 11px !important;
    border-radius: 13px !important;
}

.jrs-chat-form {
    flex: 0 0 auto !important;
    padding: 12px !important;
    background: #fff !important;
}

.jrs-chat-form input {
    height: 46px !important;
    font-size: 13px !important;
}

.jrs-chat-form button {
    min-width: 84px !important;
    height: 46px !important;
    padding: 0 16px !important;
}

.whatsapp-flotante {
    right: 26px !important;
    bottom: 22px !important;
    z-index: 19999 !important;
}

@media (max-width: 768px) {
    .jrs-chatbot {
        right: 14px !important;
        bottom: 88px !important;
    }

    .jrs-chat-window {
        right: 12px !important;
        left: 12px !important;
        bottom: 154px !important;
        width: auto !important;
        max-height: calc(100vh - 190px) !important;
        border-radius: 22px !important;
    }

    .jrs-chat-body {
        min-height: 190px !important;
    }

    .jrs-chat-options {
        grid-template-columns: 1fr 1fr !important;
    }

    .jrs-chat-toggle {
        width: 56px !important;
        height: 56px !important;
    }

    .whatsapp-flotante {
        right: 14px !important;
        bottom: 18px !important;
    }
}

.footer-principal{
    background: radial-gradient(circle at top right, rgba(229,178,45,.12), transparent 35%),
                linear-gradient(135deg, #070A12, #0B1220);
    padding: 80px 6% 35px;
}

.footer-columnas{
    display: grid;
    grid-template-columns: 1.2fr .9fr;
    gap: 70px;
    align-items: start;
}

.footer-info-empresa h3{
    color: #E5B22D;
    font-size: clamp(24px, 3vw, 38px);
    line-height: 1.1;
    margin-bottom: 22px;
}

.footer-info-empresa p{
    color: #A8B8D8;
    font-size: 18px;
    line-height: 1.8;
    max-width: 760px;
}

.footer-datos-contacto{
    background: rgba(255,255,255,.04);
    border: 1px solid rgba(229,178,45,.22);
    border-radius: 26px;
    padding: 34px;
    box-shadow: 0 20px 50px rgba(0,0,0,.25);
}

.footer-datos-contacto h4{
    color: #FFFFFF;
    font-size: 24px;
    margin-bottom: 24px;
}

.footer-datos-contacto .dato{
    color: #FFFFFF;
    font-size: 18px;
    line-height: 1.55;
    margin-bottom: 14px;
}

.footer-datos-contacto .atencion{
    color: #A8B8D8;
    font-size: 15px;
    line-height: 1.7;
    margin-top: 18px;
}

.footer-divisor{
    margin: 45px auto 25px;
    opacity: .12;
}

.copyright{
    color: #7F8DA8;
}

@media(max-width: 850px){
    .footer-columnas{
        grid-template-columns: 1fr;
        gap: 35px;
        text-align: center;
    }

    .footer-info-empresa p{
        margin: auto;
    }

    .footer-datos-contacto{
        text-align: left;
    }
}
/* ========================================================================== 
   ADMIN LOCAL + ESTATUS MANTENIMIENTO
   ========================================================================== */
.badge-mantenimiento,
.equipo-status.badge-mantenimiento {
    background: #F59E0B;
    color: #111827;
}

.footer-admin-link {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    margin-top: 18px;
    color: #E5B22D;
    text-decoration: none;
    font-weight: 900;
    font-size: 13px;
    text-transform: uppercase;
    letter-spacing: .8px;
}

.footer-admin-link:hover {
    color: #fff;
}


/* ==========================================================================
   REDISEÑO PREMIUM PUBLICO: HERO + GRAFICA VISUAL DE FLOTA
   ========================================================================== */
.hero-header{background:
    radial-gradient(circle at 75% 18%, rgba(229,178,45,.22), transparent 28%),
    linear-gradient(90deg,rgba(5,7,13,.98) 0%,rgba(11,15,25,.84) 48%,rgba(36,59,107,.70) 100%),
    url("Imagenes Excavadoras/Excavadora CAT 349F L (2).jpeg");
    background-size:cover;background-position:center;}
.hero-header:before{background:
    linear-gradient(rgba(255,255,255,.035) 1px,transparent 1px),
    linear-gradient(90deg,rgba(255,255,255,.035) 1px,transparent 1px);background-size:52px 52px}.hero-content h1{font-size:clamp(44px,7vw,96px);line-height:.92}.hero-etiqueta{box-shadow:0 18px 38px rgba(229,178,45,.13)}.btn-principal,.btn-cta{box-shadow:0 20px 42px rgba(229,178,45,.28)}
.flota-visual-premium{width:min(90%,1220px);margin:72px auto 0;position:relative;z-index:4}.flota-visual-card{display:grid;grid-template-columns:1fr 1.08fr;gap:34px;align-items:center;background:
    radial-gradient(circle at 12% 10%,rgba(229,178,45,.18),transparent 30%),
    linear-gradient(135deg,#070A12 0%,#101827 48%,#243B6B 100%);border:1px solid rgba(229,178,45,.18);border-radius:36px;padding:38px;box-shadow:0 32px 90px rgba(15,23,42,.22);overflow:hidden;position:relative}.flota-visual-card:after{content:"";position:absolute;width:420px;height:420px;right:-180px;bottom:-190px;background:rgba(229,178,45,.13);border-radius:50%;filter:blur(10px)}.flota-copy,.flota-grafica-box{position:relative;z-index:2}.flota-copy .section-kicker{text-align:left}.flota-copy h2{color:#fff;font-size:clamp(30px,4vw,54px);font-weight:900;line-height:1;letter-spacing:-1.4px;text-transform:uppercase;margin:10px 0 18px}.flota-copy p{color:rgba(226,232,240,.82);line-height:1.8;font-size:16px}.flota-mini-kpis{display:flex;gap:12px;flex-wrap:wrap;margin-top:24px}.flota-mini-kpis span{display:grid;gap:4px;background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.13);border-radius:18px;padding:14px 18px;color:rgba(226,232,240,.85);font-weight:800;font-size:12px;text-transform:uppercase}.flota-mini-kpis strong{color:var(--color-primario);font-size:28px;line-height:1}.flota-grafica-box{display:grid;grid-template-columns:190px 1fr;gap:26px;align-items:center;background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.12);border-radius:28px;padding:24px;backdrop-filter:blur(14px)}.web-donut{width:180px;height:180px;border-radius:50%;display:grid;place-items:center;position:relative;box-shadow:0 20px 45px rgba(0,0,0,.25)}.web-donut:before{content:"";position:absolute;inset:23px;background:#0B0F19;border-radius:50%;box-shadow:inset 0 0 0 1px rgba(255,255,255,.10)}.web-donut div{position:relative;text-align:center}.web-donut strong{display:block;color:#fff;font-size:42px;line-height:1}.web-donut span{font-size:11px;letter-spacing:1px;text-transform:uppercase;color:#94A3B8;font-weight:900}.web-bars{display:grid;gap:12px}.web-bar-row{display:grid;grid-template-columns:145px 1fr 44px;gap:10px;align-items:center;color:#E2E8F0;font-size:12px;font-weight:900}.web-bar-row div{height:12px;border-radius:999px;background:rgba(255,255,255,.13);overflow:hidden}.web-bar-row i{height:100%;display:block;border-radius:999px;background:linear-gradient(90deg,var(--color-primario),#fff)}.web-bar-row strong{color:var(--color-primario)}.catalogo-grid .tarjeta-item{box-shadow:0 24px 60px rgba(15,23,42,.15)}.tarjeta-contenido{background:linear-gradient(135deg,rgba(11,15,25,.88),rgba(36,59,107,.72));border-color:rgba(229,178,45,.26)}.tarjeta-contenido h3{font-size:clamp(17px,1.35vw,22px)}.equipo-premium-card{box-shadow:0 40px 100px rgba(15,23,42,.18)}
@media(max-width:950px){.flota-visual-card,.flota-grafica-box{grid-template-columns:1fr}.web-donut{margin:auto}.flota-copy .section-kicker{text-align:center}.flota-copy{text-align:center}.flota-mini-kpis{justify-content:center}}@media(max-width:560px){.flota-visual-card{padding:26px 18px;border-radius:28px}.web-bar-row{grid-template-columns:1fr}.flota-grafica-box{padding:18px}.web-donut{width:160px;height:160px}.web-donut strong{font-size:34px}}


/* ==========================================================================
   AJUSTES JRS: LOGO REAL + VISOR DE IMAGEN COMPLETA
   ========================================================================== */
.nav-logo-imagen{
    width: 250px;
    height: 74px;
    padding: 8px 10px;
    border-radius: 18px;
    background: rgba(255,255,255,.96);
    display: flex;
    align-items: center;
    justify-content: center;
    box-shadow: 0 10px 28px rgba(0,0,0,.18);
    overflow: hidden;
}

.nav-logo-imagen img{
    width: 100%;
    height: 100%;
    object-fit: contain;
    display: block;
}

.nav-logo-imagen span,
.nav-logo-imagen small{
    display: none !important;
}

/* Fotos completas en ficha técnica */
.equipo-foto-principal{
    background: linear-gradient(135deg, #f8fafc, #eef2f7);
    display: flex;
    align-items: center;
    justify-content: center;
}

.equipo-foto-principal img{
    width: 100%;
    height: 100%;
    object-fit: contain !important;
    background: linear-gradient(135deg, #f8fafc, #eef2f7);
    cursor: zoom-in;
}

.miniatura-btn{
    background: #f8fafc;
}

.miniatura-btn img{
    object-fit: contain !important;
    background: #f8fafc;
}

/* Modal de visualización completa */
.jrs-image-viewer{
    position: fixed;
    inset: 0;
    z-index: 99999;
    display: none;
    align-items: center;
    justify-content: center;
    padding: 28px;
    background: rgba(5, 9, 18, .88);
    backdrop-filter: blur(12px);
}

.jrs-image-viewer.show{
    display: flex;
}

.jrs-image-box{
    position: relative;
    width: min(96vw, 1280px);
    height: min(88vh, 820px);
    border-radius: 28px;
    background: linear-gradient(135deg, #ffffff, #f1f5f9);
    box-shadow: 0 34px 90px rgba(0,0,0,.45);
    border: 1px solid rgba(255,255,255,.35);
    overflow: hidden;
    display: flex;
    align-items: center;
    justify-content: center;
}

.jrs-image-box img{
    width: 100%;
    height: 100%;
    object-fit: contain;
    padding: 18px;
}

.jrs-image-close{
    position: absolute;
    top: 18px;
    right: 18px;
    width: 48px;
    height: 48px;
    border: none;
    border-radius: 50%;
    cursor: pointer;
    background: #111622;
    color: #ffffff;
    font-size: 26px;
    font-weight: 900;
    box-shadow: 0 14px 34px rgba(0,0,0,.35);
    z-index: 3;
    transition: transform .2s ease, background .2s ease;
}

.jrs-image-close:hover{
    transform: scale(1.06);
    background: #E5B22D;
    color: #111622;
}

.jrs-image-caption{
    position: absolute;
    left: 22px;
    bottom: 22px;
    right: 22px;
    padding: 14px 18px;
    border-radius: 18px;
    background: rgba(17,22,34,.88);
    color: #fff;
    font-weight: 800;
    letter-spacing: .3px;
    text-align: center;
}

@media(max-width: 768px){
    .nav-logo-imagen{
        width: 175px;
        height: 56px;
        border-radius: 14px;
        padding: 6px;
    }

    .jrs-image-viewer{
        padding: 12px;
    }

    .jrs-image-box{
        width: 96vw;
        height: 82vh;
        border-radius: 20px;
    }

    .jrs-image-box img{
        padding: 10px;
    }

    .jrs-image-caption{
        font-size: 13px;
        padding: 10px 12px;
    }
}

/* ========================================================================== 
   JRS REDISEÑO ULTRA PREMIUM - INDUSTRIAL / CATÁLOGO 2026
   ========================================================================== */
:root{
    --jrs-gold:#E5B22D;
    --jrs-gold-soft:#F7D36B;
    --jrs-navy:#111827;
    --jrs-blue:#243B6B;
    --jrs-ink:#070A12;
    --jrs-card:#ffffff;
}

body{
    background:
        radial-gradient(circle at 8% 4%, rgba(229,178,45,.20), transparent 26%),
        radial-gradient(circle at 92% 16%, rgba(36,59,107,.18), transparent 30%),
        linear-gradient(180deg,#F8FAFC 0%,#EEF3F9 42%,#E6ECF5 100%);
}

.navbar{
    padding:14px 0;
    background:linear-gradient(90deg, rgba(5,7,13,.98), rgba(10,15,26,.96), rgba(17,24,39,.98));
    border-bottom:1px solid rgba(229,178,45,.35);
    box-shadow:0 18px 48px rgba(0,0,0,.22);
}

.navbar::after{
    content:"";
    position:absolute;
    left:0;
    right:0;
    bottom:-1px;
    height:2px;
    background:linear-gradient(90deg, transparent, var(--jrs-gold), transparent);
    opacity:.85;
}

.nav-contenedor{
    width:min(94%,1320px);
}

.nav-logo-imagen{
    width:245px !important;
    height:78px !important;
    padding:0 !important;
    border-radius:0 !important;
    background:transparent !important;
    box-shadow:none !important;
    overflow:visible !important;
    justify-content:flex-start !important;
}

.nav-logo-imagen img{
    width:230px !important;
    height:72px !important;
    object-fit:contain !important;
    filter:drop-shadow(0 10px 18px rgba(0,0,0,.40)) drop-shadow(0 0 10px rgba(229,178,45,.10));
}

.nav-menu{
    gap:20px;
}

.nav-menu a{
    font-size:12px;
    color:rgba(255,255,255,.86);
}

.nav-menu .nav-cta{
    padding:14px 24px;
    border-radius:18px;
    background:linear-gradient(135deg,var(--jrs-gold),var(--jrs-gold-soft));
    box-shadow:0 12px 28px rgba(229,178,45,.25);
}

.hero-header{
    min-height:100vh;
    padding:160px 20px 120px;
    background:
        radial-gradient(circle at 78% 22%, rgba(229,178,45,.28), transparent 22%),
        linear-gradient(90deg,rgba(3,7,18,.96) 0%, rgba(8,13,25,.86) 47%, rgba(36,59,107,.70) 100%),
        url("Imagenes Excavadoras/Excavadora CAT 349F L (2).jpeg") !important;
    background-size:cover !important;
    background-position:center !important;
}

.hero-header::before{
    background:
      linear-gradient(rgba(255,255,255,.045) 1px,transparent 1px),
      linear-gradient(90deg,rgba(255,255,255,.045) 1px,transparent 1px),
      linear-gradient(135deg, transparent 0 48%, rgba(229,178,45,.10) 49%, transparent 50%);
    background-size:54px 54px,54px 54px,180px 180px;
    opacity:.7;
}

.hero-overlay{
    width:min(100%,1250px);
}

.hero-etiqueta{
    color:#111827;
    background:linear-gradient(135deg,var(--jrs-gold),var(--jrs-gold-soft));
    border:none;
    box-shadow:0 18px 42px rgba(229,178,45,.28);
}

.hero-content h1{
    font-size:clamp(48px,8vw,112px) !important;
    line-height:.88 !important;
    letter-spacing:-4px;
    max-width:1180px;
    margin-left:auto;
    margin-right:auto;
}

.hero-content h1::first-line{
    color:var(--jrs-gold);
}

.subtitulo{
    font-size:clamp(19px,2.4vw,34px);
    letter-spacing:3px;
    text-shadow:0 10px 30px rgba(0,0,0,.45);
}

.slogan{
    font-size:clamp(16px,1.35vw,22px);
}

.btn-principal,.btn-cta{
    border-radius:18px;
    padding:19px 42px;
    background:linear-gradient(135deg,#E5B22D,#F8D76D);
    box-shadow:0 18px 44px rgba(229,178,45,.30), inset 0 1px 0 rgba(255,255,255,.38);
}

.btn-secundario{
    border-radius:18px;
    padding:19px 42px;
    background:rgba(15,23,42,.58);
    border:1px solid rgba(255,255,255,.22);
}

.stat-contenedor{
    width:min(92%,1280px);
    gap:24px;
}

.stat-card{
    border-radius:28px;
    background:rgba(255,255,255,.90);
    backdrop-filter:blur(18px);
    border:1px solid rgba(255,255,255,.70);
    box-shadow:0 24px 65px rgba(15,23,42,.13);
}

.stat-card::before{
    content:"";
    display:block;
    width:48px;
    height:5px;
    border-radius:99px;
    background:linear-gradient(90deg,var(--jrs-gold),var(--jrs-blue));
    margin:0 auto 20px;
}

.stat-numero{
    color:var(--jrs-ink);
}

.visual-dashboard,
.flota-visual-premium{
    width:min(92%,1280px) !important;
}

.dashboard-shell,
.flota-visual-card{
    border-radius:42px !important;
    background:
        radial-gradient(circle at 12% 8%, rgba(229,178,45,.22), transparent 28%),
        linear-gradient(135deg,#05070D 0%, #0F172A 48%, #243B6B 100%) !important;
    border:1px solid rgba(229,178,45,.26) !important;
    box-shadow:0 38px 100px rgba(15,23,42,.25) !important;
}

.grid-tarjetas{
    gap:30px;
}

.tarjeta-item{
    border-radius:32px;
    min-height:390px;
    background:#0B0F19;
    border:1px solid rgba(229,178,45,.18);
    box-shadow:0 26px 70px rgba(15,23,42,.16);
}

.tarjeta-item::after{
    content:"";
    position:absolute;
    inset:0;
    background:linear-gradient(180deg, transparent 25%, rgba(5,7,13,.22) 56%, rgba(5,7,13,.72) 100%);
    pointer-events:none;
}

.tarjeta-imagen-wrapper{
    min-height:390px !important;
    background:linear-gradient(135deg,#101827,#1f2937) !important;
    display:flex;
    align-items:center;
    justify-content:center;
}

.tarjeta-item img{
    width:100%;
    height:100%;
    object-fit:cover;
    filter:brightness(.82) saturate(1.12) contrast(1.04);
}

.catalogo-grid .tarjeta-item img{
    object-fit:cover;
}

.tarjeta-contenido{
    inset:auto 20px 20px 20px;
    border-radius:26px;
    padding:26px;
    background:linear-gradient(135deg,rgba(6,9,17,.92),rgba(17,24,39,.78));
    border:1px solid rgba(229,178,45,.28);
    box-shadow:0 18px 40px rgba(0,0,0,.20);
}

.tarjeta-contenido h3,
.tarjeta-item h3{
    font-size:clamp(20px,1.65vw,28px);
    line-height:1.04;
}

.tarjeta-contenido span{
    font-size:12px;
    color:var(--jrs-gold-soft);
}

.modelo-card{
    border-radius:24px;
    padding:24px;
    background:linear-gradient(180deg,#ffffff,#f8fafc);
    border:1px solid rgba(36,59,107,.12);
}

.modelo-card.active,
.modelo-card:hover{
    background:linear-gradient(135deg,#0B0F19,#14213D);
    border-color:rgba(229,178,45,.70);
}

.equipo-premium-card{
    border-radius:42px !important;
    padding:34px !important;
    background:linear-gradient(135deg,rgba(255,255,255,.96),rgba(248,250,252,.90)) !important;
    border:1px solid rgba(36,59,107,.12) !important;
    box-shadow:0 44px 110px rgba(15,23,42,.18) !important;
}

.equipo-foto-principal{
    border-radius:32px !important;
    background:linear-gradient(135deg,#eef2f7,#ffffff) !important;
    box-shadow:inset 0 0 0 1px rgba(36,59,107,.10), 0 24px 55px rgba(15,23,42,.13);
}

.equipo-foto-principal img{
    object-fit:contain !important;
    padding:8px;
}

.equipo-info-panel{
    border-radius:32px !important;
    background:rgba(255,255,255,.76) !important;
    border:1px solid rgba(36,59,107,.12) !important;
    box-shadow:inset 0 1px 0 rgba(255,255,255,.85);
}

.titulo-equipo-premium,
.equipo-info-panel h3{
    font-size:clamp(36px,4vw,72px) !important;
    line-height:.95 !important;
}

.spec-premium{
    border-radius:22px !important;
    background:linear-gradient(180deg,#ffffff,#f8fafc) !important;
    border:1px solid rgba(36,59,107,.10) !important;
}

.cta-banner{
    background:
        radial-gradient(circle at 70% 35%, rgba(229,178,45,.22), transparent 28%),
        linear-gradient(135deg,#05070D,#111827 48%,#243B6B) !important;
}

.footer-principal{
    background:
        radial-gradient(circle at 78% 10%, rgba(229,178,45,.14), transparent 25%),
        linear-gradient(135deg,#05070D,#0B0F19 55%,#111827) !important;
}

.footer-datos-contacto{
    background:rgba(255,255,255,.05) !important;
    border:1px solid rgba(229,178,45,.24) !important;
    border-radius:30px !important;
}

.jrs-chat-toggle,
.whatsapp-flotante{
    box-shadow:0 22px 55px rgba(0,0,0,.22), 0 0 0 8px rgba(229,178,45,.10) !important;
}

/* Imagen completa en modal más elegante */
.jrs-image-viewer{
    background:rgba(3,7,18,.92) !important;
}
.jrs-image-box{
    background:linear-gradient(135deg,#0B0F19,#111827) !important;
    border:1px solid rgba(229,178,45,.35) !important;
}
.jrs-image-box img{
    background:#f8fafc;
    border-radius:20px;
}

@media(max-width:900px){
    .nav-logo-imagen{width:190px !important;height:64px !important;}
    .nav-logo-imagen img{width:180px !important;height:58px !important;}
    .hero-content h1{letter-spacing:-2px;}
    .tarjeta-item,.tarjeta-imagen-wrapper{min-height:330px !important;}
}


/* SECCIÓN NUESTROS PROYECTOS */
.proyectos-jrs-section{
    position:relative;
}

.proyectos-jrs-wrapper{
    display:grid;
    grid-template-columns:.9fr 1.35fr;
    gap:34px;
    align-items:stretch;
    background:
        radial-gradient(circle at 14% 18%, rgba(229,178,45,.20), transparent 28%),
        linear-gradient(135deg,#070A12 0%,#101827 48%,#243B6B 100%);
    border:1px solid rgba(229,178,45,.22);
    border-radius:36px;
    padding:34px;
    box-shadow:0 32px 90px rgba(15,23,42,.22);
    overflow:hidden;
}

.proyectos-jrs-wrapper::after{
    content:"";
    position:absolute;
    width:260px;
    height:260px;
    right:8%;
    top:50%;
    transform:translateY(-50%);
    border-radius:50%;
    background:rgba(229,178,45,.10);
    filter:blur(12px);
    pointer-events:none;
}

.proyectos-jrs-copy, .proyectos-jrs-grid{
    position:relative;
    z-index:2;
}

.proyectos-jrs-copy{
    background:rgba(255,255,255,.07);
    border:1px solid rgba(255,255,255,.12);
    border-radius:28px;
    padding:30px;
    display:flex;
    flex-direction:column;
    justify-content:center;
}

.proyectos-jrs-label{
    color:var(--color-primario);
    font-size:12px;
    font-weight:900;
    text-transform:uppercase;
    letter-spacing:2px;
    margin-bottom:14px;
}

.proyectos-jrs-copy h3{
    color:#fff;
    font-size:clamp(24px,3vw,38px);
    line-height:1.04;
    text-transform:uppercase;
    margin-bottom:18px;
}

.proyectos-jrs-copy p{
    color:rgba(226,232,240,.78);
    line-height:1.75;
}

.proyectos-jrs-grid{
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:16px;
}

.proyecto-cliente-card{
    min-height:170px;
    padding:24px;
    border-radius:26px;
    background:rgba(255,255,255,.08);
    border:1px solid rgba(255,255,255,.12);
    box-shadow:0 16px 34px rgba(0,0,0,.18);
    transition:var(--transition);
}

.proyecto-cliente-card:hover{
    transform:translateY(-6px);
    border-color:rgba(229,178,45,.45);
    background:rgba(255,255,255,.11);
}

.proyecto-cliente-card span{
    color:var(--color-primario);
    font-size:11px;
    font-weight:900;
    text-transform:uppercase;
    letter-spacing:1.8px;
}

.proyecto-cliente-card h4{
    color:#fff;
    font-size:clamp(22px,2vw,30px);
    line-height:1;
    margin:16px 0 12px;
    text-transform:uppercase;
}

.proyecto-cliente-card p{
    color:rgba(226,232,240,.76);
    line-height:1.55;
    font-size:14px;
}

.proyecto-cliente-card.destacado{
    background:linear-gradient(135deg,rgba(229,178,45,.22),rgba(255,255,255,.08));
}

@media(max-width:980px){
    .proyectos-jrs-wrapper{grid-template-columns:1fr;padding:26px;}
}

@media(max-width:620px){
    .proyectos-jrs-grid{grid-template-columns:1fr;}
    .proyectos-jrs-wrapper{border-radius:28px;padding:18px;}
    .proyectos-jrs-copy{padding:22px;}
}

/* REDISEÑO PREMIUM - NUESTROS PROYECTOS */
.proyectos-jrs-section{
    padding-top:90px;
}
.clientes-premium-wall{
    position:relative;
    overflow:hidden;
    border-radius:38px;
    padding:34px;
    background:
        radial-gradient(circle at 12% 10%, rgba(229,178,45,.28), transparent 24%),
        radial-gradient(circle at 88% 12%, rgba(255,255,255,.10), transparent 22%),
        linear-gradient(135deg,#070A12 0%,#111827 42%,#243B6B 100%);
    border:1px solid rgba(229,178,45,.26);
    box-shadow:0 34px 95px rgba(15,23,42,.24);
}
.clientes-premium-wall::before{
    content:"";
    position:absolute;
    inset:0;
    background-image:linear-gradient(rgba(255,255,255,.045) 1px, transparent 1px),linear-gradient(90deg,rgba(255,255,255,.045) 1px, transparent 1px);
    background-size:42px 42px;
    opacity:.28;
    pointer-events:none;
}
.clientes-wall-header{
    position:relative;
    z-index:1;
    display:flex;
    justify-content:space-between;
    align-items:center;
    gap:22px;
    margin-bottom:28px;
    padding-bottom:24px;
    border-bottom:1px solid rgba(255,255,255,.13);
}
.clientes-eyebrow{
    display:inline-flex;
    align-items:center;
    gap:10px;
    color:var(--color-primario);
    font-size:12px;
    font-weight:900;
    text-transform:uppercase;
    letter-spacing:2px;
}
.clientes-eyebrow::before{
    content:"";
    width:34px;
    height:3px;
    border-radius:99px;
    background:var(--color-primario);
}
.clientes-wall-header h3{
    margin-top:10px;
    color:#fff;
    font-size:clamp(26px,3.4vw,48px);
    line-height:1;
    text-transform:uppercase;
    letter-spacing:-1px;
}
.clientes-count{
    min-width:128px;
    height:128px;
    border-radius:50%;
    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center;
    background:linear-gradient(135deg,rgba(229,178,45,.95),rgba(255,242,179,.92));
    color:#07101d;
    box-shadow:0 18px 50px rgba(229,178,45,.24);
}
.clientes-count strong{
    font-size:44px;
    line-height:.9;
    font-weight:1000;
}
.clientes-count span{
    font-size:13px;
    font-weight:900;
    text-transform:uppercase;
}
.clientes-logo-grid{
    position:relative;
    z-index:1;
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:14px;
}
.cliente-logo-card{
    min-height:104px;
    display:flex;
    align-items:center;
    gap:14px;
    padding:18px 20px;
    border-radius:22px;
    background:rgba(255,255,255,.075);
    border:1px solid rgba(255,255,255,.14);
    box-shadow:inset 0 1px 0 rgba(255,255,255,.12),0 14px 34px rgba(0,0,0,.18);
    transition:transform .25s ease, border-color .25s ease, background .25s ease;
}
.cliente-logo-card:hover{
    transform:translateY(-5px) scale(1.01);
    background:rgba(255,255,255,.11);
    border-color:rgba(229,178,45,.55);
}
.cliente-inicial{
    flex:0 0 46px;
    width:46px;
    height:46px;
    border-radius:16px;
    display:flex;
    align-items:center;
    justify-content:center;
    background:rgba(229,178,45,.96);
    color:#08111f;
    font-weight:1000;
    font-size:22px;
    box-shadow:0 10px 28px rgba(229,178,45,.25);
}
.cliente-logo-card h4{
    margin:0;
    color:#fff;
    font-size:clamp(14px,1vw,18px);
    line-height:1.12;
    letter-spacing:.2px;
    text-transform:uppercase;
}
@media(max-width:1100px){
    .clientes-logo-grid{grid-template-columns:repeat(3,minmax(0,1fr));}
}
@media(max-width:760px){
    .clientes-wall-header{align-items:flex-start;flex-direction:column;}
    .clientes-count{width:104px;height:104px;min-width:104px;}
    .clientes-logo-grid{grid-template-columns:repeat(2,minmax(0,1fr));}
    .clientes-premium-wall{padding:22px;border-radius:28px;}
}
@media(max-width:520px){
    .clientes-logo-grid{grid-template-columns:1fr;}
}

/* ========================================================================== 
   JRS V3 - REDISEÑO INDUSTRIAL PREMIUM (sin eliminar información)
   ========================================================================== */
:root{
    --jrs-gold:#E5B22D;
    --jrs-gold-light:#FFD66B;
    --jrs-navy:#172A54;
    --jrs-black:#070A12;
    --jrs-panel:#FFFFFF;
}
body{
    background:
        radial-gradient(circle at 18% 0%, rgba(229,178,45,.18), transparent 28%),
        radial-gradient(circle at 90% 18%, rgba(36,59,107,.16), transparent 28%),
        linear-gradient(180deg,#F7F9FC 0%,#EEF3FA 42%,#E7EDF7 100%) !important;
}
.navbar{
    background:rgba(7,10,18,.82) !important;
    border-bottom:1px solid rgba(229,178,45,.26) !important;
}
.nav-contenedor{width:min(94%,1320px)!important}
.nav-logo-imagen img{max-height:58px!important;filter:drop-shadow(0 12px 28px rgba(0,0,0,.35))}
.nav-menu{gap:18px!important}
.nav-menu a{font-size:11px!important;letter-spacing:1px!important}
.nav-cta{
    background:linear-gradient(135deg,var(--jrs-gold),var(--jrs-gold-light))!important;
    color:#111827!important;
    padding:13px 20px!important;
    border-radius:999px!important;
    box-shadow:0 16px 35px rgba(229,178,45,.22)!important;
}
.hero-header{
    min-height:92vh!important;
    background:
      linear-gradient(90deg,rgba(5,7,13,.92) 0%,rgba(11,15,25,.76) 46%,rgba(11,15,25,.22) 100%),
      linear-gradient(180deg,rgba(0,0,0,.12),rgba(0,0,0,.32)),
      url('Imagenes Excavadoras/Excavadora 320E EX07 (2).png') center/cover no-repeat!important;
    position:relative;
}
.hero-header::after{
    content:"";position:absolute;left:0;right:0;bottom:-1px;height:120px;
    background:linear-gradient(180deg,transparent,#F7F9FC 88%);pointer-events:none;
}
.hero-content{max-width:850px!important;text-align:left!important;margin-left:min(6vw,80px)!important;position:relative;z-index:2}
.hero-etiqueta{background:rgba(229,178,45,.13)!important;border:1px solid rgba(229,178,45,.35)!important;color:#FFD66B!important}
.hero-content h1{font-size:clamp(44px,6vw,86px)!important;line-height:.92!important;letter-spacing:-3px!important;text-shadow:0 22px 60px rgba(0,0,0,.45)}
.subtitulo{font-size:clamp(19px,2.2vw,29px)!important;color:#fff!important;max-width:760px!important}
.slogan{font-size:16px!important;color:#CBD5E1!important;max-width:680px!important}
.hero-actions{justify-content:flex-start!important}
.btn-principal,.btn-cta,.btn-equipo{background:linear-gradient(135deg,var(--jrs-gold),var(--jrs-gold-light))!important;color:#101827!important;box-shadow:0 18px 45px rgba(229,178,45,.25)!important;border:0!important}
.btn-secundario{background:rgba(255,255,255,.10)!important;border:1px solid rgba(255,255,255,.22)!important;color:#fff!important;backdrop-filter:blur(10px)}
.stat-contenedor{margin-top:-58px!important;position:relative;z-index:5;width:min(92%,1240px)!important}
.stat-card{
    background:rgba(255,255,255,.92)!important;border:1px solid rgba(255,255,255,.78)!important;
    box-shadow:0 25px 70px rgba(15,23,42,.16)!important;border-radius:28px!important;
}
.stat-numero{font-size:clamp(34px,4vw,54px)!important;color:var(--jrs-black)!important}
.stat-concepto{text-transform:uppercase;letter-spacing:1px;font-weight:900!important;color:#64748B!important}
.contenedor-global{width:min(92%,1320px)!important;padding-top:86px!important}
.seccion-bloque{
    background:rgba(255,255,255,.56);
    border:1px solid rgba(255,255,255,.70);
    border-radius:36px;
    padding:58px 42px;
    box-shadow:0 22px 65px rgba(15,23,42,.08);
    backdrop-filter:blur(14px);
}
.titulo-central{font-size:clamp(30px,3.8vw,52px)!important;letter-spacing:-1.7px!important;margin-bottom:42px!important}
.grid-tarjetas,.catalogo-grid{grid-template-columns:repeat(auto-fit,minmax(245px,1fr))!important;gap:22px!important}
.tarjeta-item{
    border-radius:30px!important;overflow:hidden!important;background:#fff!important;border:1px solid rgba(148,163,184,.20)!important;
    box-shadow:0 18px 45px rgba(15,23,42,.10)!important;transform:translateZ(0);
}
.tarjeta-item:hover{transform:translateY(-8px)!important;box-shadow:0 30px 75px rgba(15,23,42,.20)!important;border-color:rgba(229,178,45,.55)!important}
.tarjeta-imagen-wrapper{height:230px!important;background:#0B0F19!important}
.tarjeta-imagen-wrapper img{width:100%!important;height:100%!important;object-fit:cover!important;transition:.45s ease!important}
.tarjeta-item:hover img{transform:scale(1.08)!important}
.tarjeta-contenido{padding:24px!important;background:linear-gradient(180deg,#fff,#F8FAFC)!important}
.tarjeta-contenido span{color:var(--jrs-gold)!important;font-weight:900!important;text-transform:uppercase!important;letter-spacing:1px!important}
.tarjeta-contenido h3{font-size:22px!important;color:#0B0F19!important}
.modelos-visor-seccion{border-radius:34px!important;background:linear-gradient(145deg,#0B0F19,#172A54)!important;padding:34px!important;margin-top:34px!important;box-shadow:0 26px 70px rgba(7,10,18,.23)!important}
.modelos-visor-seccion h3{color:#fff!important;text-align:left!important;font-size:28px!important}
.modelos-internos-grid{grid-template-columns:repeat(auto-fit,minmax(230px,1fr))!important;gap:14px!important}
.modelo-card{background:rgba(255,255,255,.08)!important;border:1px solid rgba(255,255,255,.12)!important;color:#fff!important;border-radius:20px!important;padding:18px!important;min-height:96px!important;overflow:hidden!important}
.modelo-card:hover,.modelo-card.active{background:linear-gradient(135deg,rgba(229,178,45,.22),rgba(255,255,255,.08))!important;border-color:rgba(229,178,45,.55)!important}
.modelo-card .card-nombre{color:#fff!important;font-weight:900!important;display:block!important;white-space:normal!important;line-height:1.25!important}
.modelo-card .card-sub{display:block!important;color:#CBD5E1!important;white-space:normal!important;overflow-wrap:anywhere!important;font-size:12px!important;margin-top:6px!important}
.equipo-premium-card{display:grid!important;grid-template-columns:minmax(0,1.1fr) minmax(380px,.9fr)!important;gap:28px!important;background:#fff!important;border-radius:36px!important;padding:24px!important;box-shadow:0 28px 80px rgba(15,23,42,.16)!important}
.equipo-foto-principal{border-radius:28px!important;overflow:hidden!important;background:#080B12!important;min-height:440px!important}
.equipo-foto-principal img{width:100%!important;height:100%!important;object-fit:contain!important;background:#0B0F19!important}
.equipo-info-panel{padding:18px!important;align-self:center!important}
.titulo-equipo-premium{font-size:clamp(28px,3vw,42px)!important;line-height:1!important;color:#0B0F19!important;letter-spacing:-1px!important}
.equipo-resumen-lista{
    list-style:none!important;margin:18px 0!important;padding:0!important;display:grid!important;gap:10px!important;
    max-width:100%!important;overflow-wrap:anywhere!important;
}
.equipo-resumen-lista li{
    position:relative;padding:12px 14px 12px 40px!important;background:#F8FAFC!important;border:1px solid #E2E8F0!important;border-radius:16px!important;
    color:#334155!important;line-height:1.55!important;font-size:14px!important;
}
.equipo-resumen-lista li::before{content:"✓";position:absolute;left:14px;top:12px;width:18px;height:18px;border-radius:50%;display:grid;place-items:center;background:var(--jrs-gold);color:#111827;font-size:12px;font-weight:900}
.specs-premium-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:12px!important}
.spec-premium{border-radius:18px!important;background:#F8FAFC!important;border:1px solid #E2E8F0!important;min-width:0!important;overflow-wrap:anywhere!important}
.clientes-premium-wall{background:linear-gradient(135deg,#070A12,#101827 52%,#172A54)!important;border-radius:36px!important;padding:34px!important;box-shadow:0 28px 80px rgba(7,10,18,.22)!important;position:relative;overflow:hidden}
.clientes-premium-wall::before{content:"";position:absolute;width:360px;height:360px;right:-160px;top:-120px;background:rgba(229,178,45,.20);border-radius:50%;filter:blur(20px)}
.clientes-wall-header{position:relative;z-index:1;color:#fff!important;align-items:center!important}
.clientes-wall-header h3{color:#fff!important;font-size:clamp(24px,3vw,40px)!important}
.clientes-count{background:linear-gradient(135deg,var(--jrs-gold),var(--jrs-gold-light))!important;color:#111827!important;border-radius:24px!important;padding:16px 22px!important}
.clientes-logo-grid{position:relative;z-index:1;display:grid!important;grid-template-columns:repeat(auto-fit,minmax(220px,1fr))!important;gap:16px!important;margin-top:26px!important}
.cliente-logo-card{display:flex!important;align-items:center!important;gap:14px!important;text-align:left!important;min-height:104px!important;background:rgba(255,255,255,.08)!important;border:1px solid rgba(255,255,255,.14)!important;border-radius:24px!important;padding:18px!important}
.cliente-logo-card:hover{background:rgba(255,255,255,.14)!important;border-color:rgba(229,178,45,.48)!important;transform:translateY(-4px)!important}
.cliente-inicial{flex:0 0 48px!important;width:48px!important;height:48px!important;border-radius:16px!important;background:linear-gradient(135deg,var(--jrs-gold),var(--jrs-gold-light))!important;color:#111827!important;display:grid!important;place-items:center!important;font-weight:900!important}
.cliente-logo-card h4{color:#fff!important;font-size:14px!important;line-height:1.35!important;overflow-wrap:anywhere!important}
.metodologia-grid,.valores-grid{grid-template-columns:repeat(auto-fit,minmax(240px,1fr))!important;gap:18px!important}
.metodo-item,.valor-card,.corporativo-card{border-radius:26px!important;background:#fff!important;border:1px solid rgba(148,163,184,.18)!important;box-shadow:0 16px 42px rgba(15,23,42,.08)!important}
.legal-botones-contenedor{display:flex!important;flex-wrap:wrap!important;justify-content:center!important;gap:12px!important}
.btn-legal{border-radius:999px!important;background:#0B0F19!important;color:#fff!important;border:1px solid rgba(229,178,45,.20)!important;padding:13px 18px!important}
.btn-legal:hover{background:linear-gradient(135deg,var(--jrs-gold),var(--jrs-gold-light))!important;color:#111827!important}
.cta-banner{background:linear-gradient(135deg,#070A12,#172A54)!important;position:relative;overflow:hidden}
.footer-principal{background:#05070D!important;border-top:1px solid rgba(229,178,45,.25)!important}
.jrs-chat-window{border-radius:28px!important;box-shadow:0 28px 80px rgba(0,0,0,.28)!important;overflow:hidden!important;border:1px solid rgba(229,178,45,.28)!important}
.jrs-chat-header{background:linear-gradient(135deg,#070A12,#172A54)!important}
.jrs-chat-toggle{background:linear-gradient(135deg,var(--jrs-gold),var(--jrs-gold-light))!important;color:#111827!important;box-shadow:0 18px 45px rgba(229,178,45,.35)!important}
@media(max-width:900px){
    .hero-content{text-align:center!important;margin:0 auto!important;padding:0 22px!important}.hero-actions{justify-content:center!important}
    .seccion-bloque{padding:38px 20px!important;border-radius:28px!important}
    .equipo-premium-card{grid-template-columns:1fr!important;padding:16px!important}.equipo-foto-principal{min-height:320px!important}.specs-premium-grid{grid-template-columns:1fr!important}
}

/* ===============================
   JRS REDISEÑO PREMIUM V2
   Solo mejora visual, no elimina información
================================= */
:root{
  --jrs-gold:#f0b429;
  --jrs-gold-2:#ffd166;
  --jrs-blue:#14213d;
  --jrs-deep:#070a12;
  --jrs-card:#101827;
  --jrs-line:rgba(255,255,255,.12);
}
html{scroll-behavior:smooth;}
body{
  background:
    radial-gradient(circle at 15% 0%, rgba(240,180,41,.18), transparent 28%),
    radial-gradient(circle at 90% 8%, rgba(36,59,107,.35), transparent 32%),
    linear-gradient(180deg,#05070d 0%,#0b1020 38%,#07101c 100%) !important;
  color:#eef2f8;
}
.navbar{
  background:rgba(5,8,15,.72)!important;
  backdrop-filter:blur(18px);
  border-bottom:1px solid rgba(240,180,41,.18);
  box-shadow:0 14px 40px rgba(0,0,0,.35);
}
.nav-logo-imagen img{filter:drop-shadow(0 8px 18px rgba(240,180,41,.25));}
.nav-menu a{position:relative;font-weight:700;letter-spacing:.2px;}
.nav-menu a:not(.nav-cta)::after{
  content:"";position:absolute;left:50%;bottom:-8px;width:0;height:2px;
  background:linear-gradient(90deg,var(--jrs-gold),var(--jrs-gold-2));
  transition:.25s;transform:translateX(-50%);border-radius:99px;
}
.nav-menu a:hover::after{width:80%;}
.nav-cta,.btn-principal{
  background:linear-gradient(135deg,var(--jrs-gold),#b87912)!important;
  color:#111!important;border:0!important;box-shadow:0 16px 34px rgba(240,180,41,.28);
}
.hero-header{
  min-height:88vh!important;
  position:relative;overflow:hidden;
  background-blend-mode:multiply;
}
.hero-header::before{
  content:"";position:absolute;inset:0;
  background:
    linear-gradient(90deg,rgba(3,5,11,.92) 0%,rgba(3,5,11,.72) 48%,rgba(3,5,11,.25) 100%),
    radial-gradient(circle at 72% 44%,rgba(240,180,41,.28),transparent 27%);
  pointer-events:none;
}
.hero-header::after{
  content:"JRS";position:absolute;right:-25px;bottom:-80px;
  font-size:clamp(130px,22vw,360px);font-weight:900;letter-spacing:-18px;
  color:rgba(255,255,255,.035);line-height:.8;pointer-events:none;
}
.hero-content{max-width:980px!important;padding-top:40px;position:relative;z-index:2;}
.hero-etiqueta,.section-kicker{
  display:inline-flex!important;align-items:center;gap:10px;
  padding:10px 16px;border:1px solid rgba(240,180,41,.35);
  border-radius:999px;background:rgba(240,180,41,.09);color:var(--jrs-gold-2)!important;
  font-weight:800;letter-spacing:.8px;text-transform:uppercase;font-size:.78rem;
}
.hero-content h1{
  font-size:clamp(2.6rem,6.8vw,6.5rem)!important;line-height:.88!important;
  letter-spacing:-3px;margin:22px 0!important;
  text-shadow:0 12px 45px rgba(0,0,0,.75);
}
.subtitulo{font-size:clamp(1.2rem,2.4vw,2rem)!important;font-weight:800;color:#fff!important;}
.slogan{max-width:760px;color:#cfd7e6!important;font-size:1.06rem!important;}
.hero-actions{gap:16px!important;flex-wrap:wrap;}
.btn-principal,.btn-secundario{border-radius:18px!important;padding:15px 24px!important;font-weight:900!important;}
.btn-secundario{background:rgba(255,255,255,.08)!important;border:1px solid rgba(255,255,255,.22)!important;color:#fff!important;backdrop-filter:blur(10px);}
.seccion-estadisticas{margin-top:-55px;position:relative;z-index:4;background:transparent!important;}
.stat-contenedor{max-width:1180px;margin:auto;display:grid;grid-template-columns:repeat(4,1fr);gap:18px;padding:0 18px;}
.stat-card,.corporativo-card,.tarjeta-item,.cliente-card,.detail-modelo-card,.detalle-dinamico-contenedor,.quienes-somos-wrapper,.contacto-card{
  background:linear-gradient(145deg,rgba(18,27,43,.92),rgba(9,14,25,.94))!important;
  border:1px solid rgba(255,255,255,.11)!important;
  box-shadow:0 22px 55px rgba(0,0,0,.38)!important;
  backdrop-filter:blur(14px);
}
.stat-card{border-radius:24px!important;padding:26px 20px!important;text-align:center;}
.stat-numero{background:linear-gradient(135deg,#fff,var(--jrs-gold-2));-webkit-background-clip:text; background-clip: text;
color:transparent!important;font-size:2.6rem!important;font-weight:900!important;}
.contenedor-global{max-width:1240px!important;}
.seccion-bloque{padding:92px 0!important;position:relative;}
.titulo-central{font-size:clamp(2rem,4vw,3.9rem)!important;letter-spacing:-1.5px!important;color:#fff!important;margin:16px 0 34px!important;}
.titulo-central::after{content:"";display:block;width:90px;height:5px;border-radius:99px;background:linear-gradient(90deg,var(--jrs-gold),transparent);margin:14px auto 0;}
.mision-vision-grid,.grid-tarjetas,.catalogo-grid{gap:24px!important;}
.corporativo-card,.tarjeta-item{border-radius:28px!important;overflow:hidden;transition:transform .28s ease, box-shadow .28s ease, border-color .28s ease;}
.corporativo-card:hover,.tarjeta-item:hover,.cliente-card:hover{transform:translateY(-8px);border-color:rgba(240,180,41,.45)!important;box-shadow:0 28px 70px rgba(240,180,41,.12)!important;}
.card-num{color:var(--jrs-gold)!important;font-size:2.2rem!important;font-weight:900!important;opacity:.9;}
.titulo-marcado{color:#fff!important;font-size:1.45rem!important;}
.corporativo-card p{color:#d7dfeb!important;line-height:1.85!important;}
.tarjeta-imagen-wrapper{height:255px!important;position:relative;background:#06080d;}
.tarjeta-imagen-wrapper::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,transparent 38%,rgba(0,0,0,.82));}
.tarjeta-imagen-wrapper img{width:100%!important;height:100%!important;object-fit:cover!important;transform:scale(1.02);transition:.35s;}
.tarjeta-item:hover img{transform:scale(1.08);}
.tarjeta-contenido{padding:22px!important;position:relative;}
.tarjeta-contenido span{color:var(--jrs-gold)!important;font-weight:900!important;letter-spacing:.8px;text-transform:uppercase;}
.tarjeta-contenido h3{color:#fff!important;font-size:1.35rem!important;margin-top:8px!important;}
.modelos-internos-grid{display:grid!important;grid-template-columns:repeat(auto-fit,minmax(280px,1fr))!important;gap:24px!important;align-items:stretch;}
.modelo-card,.equipo-card,.maquina-card{
  border-radius:24px!important;border:1px solid rgba(255,255,255,.1)!important;background:linear-gradient(145deg,#111a2a,#080c14)!important;overflow:hidden!important;box-shadow:0 18px 44px rgba(0,0,0,.35)!important;
}
.modelo-card p,.equipo-card p,.maquina-card p{white-space:normal!important;overflow-wrap:anywhere!important;line-height:1.75!important;}
ul,li{overflow-wrap:anywhere;}
#nuestros-proyectos{padding:100px 0!important;}
.clientes-grid,.proyectos-grid{display:grid!important;grid-template-columns:repeat(auto-fit,minmax(230px,1fr))!important;gap:18px!important;}
.cliente-card,.proyecto-card{min-height:128px!important;border-radius:24px!important;display:flex!important;align-items:center!important;justify-content:center!important;text-align:center!important;padding:24px!important;}
.cliente-card h3,.proyecto-card h3{font-size:1rem!important;line-height:1.35!important;color:#fff!important;}
.contacto-card{border-radius:30px!important;padding:34px!important;}
footer,.footer{background:#05070d!important;border-top:1px solid rgba(240,180,41,.18)!important;}
.chatbot-container,.chat-window{border:1px solid rgba(240,180,41,.25)!important;box-shadow:0 20px 70px rgba(0,0,0,.45)!important;}
@media(max-width:900px){.stat-contenedor{grid-template-columns:repeat(2,1fr)}.hero-header{min-height:78vh!important}.hero-content h1{letter-spacing:-1px}.nav-menu{background:rgba(7,10,18,.98)!important}.tarjeta-imagen-wrapper{height:220px!important}}
@media(max-width:560px){.stat-contenedor{grid-template-columns:1fr}.seccion-bloque{padding:64px 0!important}.hero-actions a{width:100%;text-align:center}.cliente-card,.proyecto-card{min-height:95px}.tarjeta-imagen-wrapper{height:200px!important}}

/* ==========================================================
   CORRECCIÓN JRS: contraste en tarjetas de categorías
   Ajuste solicitado: las letras blancas no se veían sobre fondo claro.
   No elimina información, solo mejora legibilidad.
========================================================== */
.catalogo-grid .tarjeta-item,
.grid-tarjetas .tarjeta-item{
  background:#ffffff !important;
}

.catalogo-grid .tarjeta-contenido,
.grid-tarjetas .tarjeta-contenido,
.tarjeta-contenido{
  background:linear-gradient(180deg,#ffffff 0%,#f7f9fc 100%) !important;
  border-left:5px solid var(--jrs-gold,#f0b429) !important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.85) !important;
}

.catalogo-grid .tarjeta-contenido span,
.grid-tarjetas .tarjeta-contenido span,
.tarjeta-contenido span{
  color:var(--jrs-gold,#f0b429) !important;
  font-weight:900 !important;
  letter-spacing:2.4px !important;
  text-transform:uppercase !important;
  text-shadow:none !important;
}

.catalogo-grid .tarjeta-contenido h3,
.grid-tarjetas .tarjeta-contenido h3,
.tarjeta-contenido h3,
.tarjeta-item h3{
  color:#07101f !important;
  opacity:1 !important;
  visibility:visible !important;
  text-shadow:none !important;
  font-weight:950 !important;
  line-height:1.05 !important;
}

.tarjeta-item:hover .tarjeta-contenido h3{
  color:#14213d !important;
}

/* =========================================================
   JRS PRO DESIGN V4 — ESTILO AGENCIA / MAQUINARIA PREMIUM
   Conserva toda la información. Solo rediseño visual.
========================================================= */
:root{
  --jrs-yellow:#f6bd24;
  --jrs-yellow-soft:#ffe08a;
  --jrs-ink:#05070d;
  --jrs-ink-2:#0b111f;
  --jrs-slate:#111827;
  --jrs-blue-deep:#101b33;
  --jrs-blue:#1d3565;
  --jrs-white:#ffffff;
  --jrs-muted:#c7d0df;
  --jrs-border:rgba(255,255,255,.14);
}
body{
  background:
    radial-gradient(circle at 16% 6%, rgba(246,189,36,.18), transparent 28%),
    radial-gradient(circle at 88% 14%, rgba(29,53,101,.55), transparent 32%),
    linear-gradient(180deg,#05070d 0%,#08111f 43%,#eef3f8 43%,#f7f9fc 100%) !important;
  overflow-x:hidden;
}
.navbar{
  min-height:88px!important;
  background:linear-gradient(90deg,rgba(3,5,10,.95),rgba(11,17,31,.92))!important;
  border-bottom:1px solid rgba(246,189,36,.30)!important;
  box-shadow:0 18px 60px rgba(0,0,0,.45)!important;
}
.nav-contenedor{max-width:1360px!important;width:92%!important;}
.nav-logo-imagen{width:178px!important;height:70px!important;background:transparent!important;}
.nav-logo-imagen img{width:168px!important;height:64px!important;object-fit:contain!important;filter:drop-shadow(0 12px 22px rgba(246,189,36,.20));}
.nav-menu{gap:10px!important;align-items:center!important;}
.nav-menu a:not(.nav-cta){
  color:#edf2f7!important;
  padding:12px 12px!important;
  border-radius:12px!important;
  font-size:12px!important;
  letter-spacing:.7px!important;
  text-transform:uppercase!important;
  opacity:.92;
}
.nav-menu a:not(.nav-cta):hover{
  background:rgba(246,189,36,.11)!important;
  color:var(--jrs-yellow-soft)!important;
}
.nav-cta{
  margin-left:12px!important;
  padding:16px 30px!important;
  border-radius:18px!important;
  background:linear-gradient(135deg,#f6bd24,#ffdc73)!important;
  color:#06101f!important;
  font-size:13px!important;
  font-weight:950!important;
  box-shadow:0 24px 55px rgba(246,189,36,.28)!important;
}
.hero-header{
  min-height:92vh!important;
  display:flex!important;
  align-items:center!important;
  background:
    linear-gradient(90deg,rgba(2,4,9,.96) 0%,rgba(4,7,14,.82) 42%,rgba(3,5,10,.28) 75%,rgba(3,5,10,.72) 100%),
    radial-gradient(circle at 68% 54%,rgba(246,189,36,.28),transparent 28%),
    url('Imagenes Excavadoras/Excavadora CAT 349F L (4).jpeg') center right/cover no-repeat!important;
}
.hero-header::after{
  content:""!important;
  position:absolute!important;inset:auto 0 0 0!important;height:160px!important;
  background:linear-gradient(180deg,transparent,#05070d 72%,#eef3f8 100%)!important;
  pointer-events:none!important;
}
.hero-overlay{width:100%!important;background:transparent!important;}
.hero-content{
  max-width:760px!important;
  margin-left:max(5vw,46px)!important;
  padding-top:70px!important;
}
.hero-etiqueta{
  border-radius:999px!important;
  border:1px solid rgba(246,189,36,.42)!important;
  background:rgba(246,189,36,.12)!important;
  color:#ffe08a!important;
  box-shadow:0 12px 36px rgba(246,189,36,.08)!important;
}
.hero-content h1{
  max-width:760px!important;
  color:#fff!important;
  font-size:clamp(48px,6.6vw,106px)!important;
  line-height:.86!important;
  letter-spacing:-4px!important;
  text-transform:uppercase!important;
  margin:24px 0 20px!important;
}
.hero-content h1::first-line{color:#fff!important;}
.subtitulo{
  color:var(--jrs-yellow)!important;
  font-size:clamp(22px,2.5vw,38px)!important;
  font-weight:950!important;
  text-transform:uppercase!important;
  line-height:1.05!important;
  max-width:760px!important;
}
.slogan{color:#d9e2f0!important;font-size:17px!important;line-height:1.75!important;max-width:620px!important;}
.hero-actions{justify-content:flex-start!important;margin-top:30px!important;}
.btn-principal,.btn-secundario{
  border-radius:16px!important;
  padding:16px 28px!important;
  text-transform:uppercase!important;
  letter-spacing:.7px!important;
  font-size:13px!important;
  transition:.25s ease!important;
}
.btn-principal::after{content:"  ›";font-size:18px;}
.btn-principal:hover,.btn-secundario:hover{transform:translateY(-3px)!important;}
.btn-secundario{border:1px solid rgba(246,189,36,.45)!important;background:rgba(0,0,0,.28)!important;color:#fff!important;}
.seccion-estadisticas{
  background:#05070d!important;
  padding:0 0 34px!important;
  margin-top:0!important;
}
.stat-contenedor{
  margin:-70px auto 0!important;
  max-width:1180px!important;
  grid-template-columns:repeat(4,minmax(0,1fr))!important;
  gap:16px!important;
}
.stat-card{
  text-align:left!important;
  border-radius:22px!important;
  background:linear-gradient(145deg,rgba(255,255,255,.09),rgba(255,255,255,.035))!important;
  border:1px solid rgba(246,189,36,.18)!important;
  box-shadow:0 24px 70px rgba(0,0,0,.38)!important;
  padding:22px!important;
  position:relative;overflow:hidden;
}
.stat-card::before{content:"";position:absolute;left:0;top:22px;width:5px;height:48px;background:var(--jrs-yellow);border-radius:0 99px 99px 0;}
.stat-numero{color:#fff!important;background:none!important;-webkit-text-fill-color:initial!important;font-size:42px!important;}
.stat-concepto{color:#b8c4d6!important;text-transform:uppercase!important;letter-spacing:.9px!important;}
.contenedor-global{width:100%!important;max-width:none!important;padding:0!important;}
.seccion-bloque{
  max-width:1320px!important;
  margin:0 auto!important;
  padding:96px 26px!important;
  background:transparent!important;
  border:none!important;
  box-shadow:none!important;
}
.section-kicker{
  border:0!important;background:transparent!important;padding:0!important;border-radius:0!important;
  color:var(--jrs-yellow)!important;letter-spacing:4px!important;font-size:13px!important;
}
.titulo-central{
  color:#06101f!important;
  text-transform:uppercase!important;
  font-size:clamp(36px,4.2vw,64px)!important;
  line-height:.98!important;
  text-align:left!important;
  margin-bottom:38px!important;
}
body .seccion-bloque:nth-of-type(1),
body #catalogo,
body #nuestros-proyectos,
body #metodologia{
  color:#fff;
}
body .seccion-bloque:nth-of-type(1) .titulo-central,
body #catalogo .titulo-central,
body #nuestros-proyectos .titulo-central,
body #metodologia .titulo-central{color:#fff!important;}
#identidad{
  max-width:none!important;
  padding:92px max(6vw,28px)!important;
  background:linear-gradient(135deg,#05070d,#0e1a2f 62%,#172a54)!important;
  position:relative;overflow:hidden;
}
#identidad::before{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(246,189,36,.12) 1px,transparent 1px),linear-gradient(180deg,rgba(255,255,255,.035) 1px,transparent 1px);background-size:62px 62px;opacity:.38;}
#identidad > *{position:relative;z-index:1;max-width:1320px;margin-left:auto;margin-right:auto;}
.mision-vision-grid{
  display:grid!important;grid-template-columns:repeat(4,minmax(0,1fr))!important;gap:18px!important;
}
.corporativo-card{
  min-height:310px!important;
  border-radius:28px!important;
  background:linear-gradient(145deg,rgba(255,255,255,.11),rgba(255,255,255,.04))!important;
  border:1px solid rgba(255,255,255,.14)!important;
  color:#fff!important;
  padding:28px!important;
  position:relative;overflow:hidden;
}
.corporativo-card::after{content:"";position:absolute;right:-46px;bottom:-46px;width:130px;height:130px;border-radius:50%;background:rgba(246,189,36,.12);}
.corporativo-card p{color:#dce5f3!important;font-size:14px!important;}
.card-num{color:var(--jrs-yellow)!important;}
.grid-tarjetas,.catalogo-grid{display:grid!important;grid-template-columns:repeat(4,minmax(0,1fr))!important;gap:22px!important;}
.tarjeta-item{
  min-height:360px!important;
  border-radius:28px!important;
  overflow:hidden!important;
  position:relative!important;
  background:#fff!important;
  border:1px solid rgba(15,23,42,.12)!important;
  box-shadow:0 24px 70px rgba(15,23,42,.14)!important;
}
.tarjeta-item::before{content:"";position:absolute;left:0;top:0;width:8px;height:100%;background:linear-gradient(180deg,var(--jrs-yellow),#fff2b7);z-index:3;}
.tarjeta-imagen-wrapper{height:250px!important;background:#0b111f!important;}
.tarjeta-imagen-wrapper::after{background:linear-gradient(180deg,rgba(0,0,0,.08) 0%,rgba(0,0,0,.62) 100%)!important;}
.catalogo-grid .tarjeta-imagen-wrapper img{object-fit:contain!important;padding:12px!important;background:linear-gradient(180deg,#f8fafc,#e7edf4)!important;}
.tarjeta-contenido{
  min-height:110px!important;
  background:#fff!important;
  padding:24px 28px!important;
  border-left:0!important;
}
.tarjeta-contenido span{color:var(--jrs-yellow)!important;letter-spacing:3px!important;font-size:12px!important;}
.tarjeta-contenido h3{color:#07101f!important;font-size:24px!important;line-height:1.03!important;text-transform:uppercase!important;}
.tarjeta-item:hover{transform:translateY(-10px)!important;}
#catalogo{
  max-width:none!important;
  padding:104px max(6vw,28px)!important;
  background:linear-gradient(135deg,#05070d 0%,#0d1627 52%,#172a54 100%)!important;
}
#catalogo > *{max-width:1320px;margin-left:auto;margin-right:auto;}
.modelos-visor-seccion{
  max-width:1320px!important;
  margin:42px auto 0!important;
  background:rgba(255,255,255,.06)!important;
  border:1px solid rgba(255,255,255,.12)!important;
  border-radius:32px!important;
}
.equipo-premium-card{
  border-radius:34px!important;
  background:#fff!important;
  border:1px solid rgba(15,23,42,.10)!important;
}
.titulo-equipo-premium{color:#06101f!important;}
.equipo-resumen-lista li{font-size:15px!important;}
#nuestros-proyectos{
  max-width:none!important;
  padding:100px max(6vw,28px)!important;
  background:#05070d!important;
}
#nuestros-proyectos > *{max-width:1320px;margin-left:auto;margin-right:auto;}
.clientes-premium-wall{
  padding:44px!important;border-radius:34px!important;
  background:linear-gradient(135deg,#0a0f1a,#13213b 55%,#213d72)!important;
  border:1px solid rgba(246,189,36,.20)!important;
}
.clientes-logo-grid{grid-template-columns:repeat(4,minmax(0,1fr))!important;}
.cliente-logo-card{
  min-height:118px!important;
  border-radius:22px!important;
  background:rgba(255,255,255,.08)!important;
  border:1px solid rgba(255,255,255,.15)!important;
  transition:.25s!important;
}
.cliente-logo-card:hover{background:rgba(246,189,36,.14)!important;}
#metodologia{
  max-width:none!important;
  padding:100px max(6vw,28px)!important;
  background:linear-gradient(135deg,#07101f,#101b33)!important;
}
#metodologia > *{max-width:1320px;margin-left:auto;margin-right:auto;}
.metodo-item,.valor-card{
  background:rgba(255,255,255,.08)!important;border:1px solid rgba(255,255,255,.14)!important;color:#fff!important;border-radius:26px!important;
}
.cta-banner{border-radius:34px!important;margin:30px auto!important;max-width:1320px!important;}
.contacto-card{border-radius:30px!important;background:#fff!important;color:#07101f!important;}
.jrs-chat-toggle{width:76px!important;height:76px!important;}
.jrs-chat-window{border-radius:30px!important;}
@media(max-width:1180px){.grid-tarjetas,.catalogo-grid,.mision-vision-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important}.clientes-logo-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important}.stat-contenedor{grid-template-columns:repeat(2,minmax(0,1fr))!important}}
@media(max-width:720px){.hero-content{margin:0 auto!important;text-align:center!important;padding:120px 18px 60px!important}.hero-actions{justify-content:center!important}.grid-tarjetas,.catalogo-grid,.mision-vision-grid,.clientes-logo-grid,.stat-contenedor{grid-template-columns:1fr!important}.titulo-central{text-align:center!important;font-size:34px!important}.tarjeta-item{min-height:auto!important}.nav-logo-imagen{width:146px!important}.nav-logo-imagen img{width:140px!important}}


/* ==========================================================================
   PROYECTOS INTERACTIVOS JRS - MODAL PREMIUM
   ========================================================================== */
.proyectos-botones-grid{align-items:stretch!important;}
.proyecto-card-btn{appearance:none;border:none;cursor:pointer;font-family:inherit;position:relative;overflow:hidden;}
.proyecto-card-btn::after{content:"";position:absolute;inset:auto 18px 14px auto;width:42px;height:2px;background:linear-gradient(90deg,#f6bd24,transparent);opacity:.75;transition:.25s ease;}
.proyecto-card-btn small{display:block;margin-top:6px;color:rgba(255,255,255,.55);font-size:11px;text-transform:uppercase;letter-spacing:.12em;font-weight:800;}
.proyecto-card-btn:hover small{color:#f6bd24;}
.proyecto-card-btn:hover::after{width:82px;}
.proyecto-modal{position:fixed;inset:0;z-index:99999;display:none;align-items:center;justify-content:center;padding:26px;}
.proyecto-modal.active{display:flex;}
.proyecto-modal-backdrop{position:absolute;inset:0;background:rgba(2,6,23,.82);backdrop-filter:blur(10px);}
.proyecto-modal-panel{position:relative;width:min(1180px,96vw);max-height:90vh;overflow:auto;border-radius:32px;background:linear-gradient(135deg,#07111f 0%,#12203a 58%,#1e3763 100%);border:1px solid rgba(246,189,36,.32);box-shadow:0 34px 90px rgba(0,0,0,.55);color:#fff;}
.proyecto-modal-panel::-webkit-scrollbar{width:10px}.proyecto-modal-panel::-webkit-scrollbar-thumb{background:#f6bd24;border-radius:20px}
.proyecto-modal-close{position:sticky;top:18px;float:right;z-index:2;margin:18px 18px 0 0;width:48px;height:48px;border-radius:50%;border:1px solid rgba(255,255,255,.18);background:rgba(255,255,255,.1);color:#fff;font-size:30px;line-height:1;cursor:pointer;transition:.2s ease;}
.proyecto-modal-close:hover{background:#f6bd24;color:#07111f;transform:rotate(90deg);}
.proyecto-modal-hero{padding:54px 58px 30px;background:radial-gradient(circle at 82% 0%,rgba(246,189,36,.26),transparent 34%),linear-gradient(90deg,rgba(0,0,0,.3),transparent);border-bottom:1px solid rgba(255,255,255,.1);}
.proyecto-modal-kicker{display:inline-flex;align-items:center;gap:10px;color:#f6bd24;text-transform:uppercase;letter-spacing:.18em;font-size:12px;font-weight:900;margin-bottom:12px;}
.proyecto-modal-kicker::before{content:"";width:44px;height:3px;background:#f6bd24;border-radius:50px;}
.proyecto-modal-hero h2{font-size:clamp(28px,4vw,54px);line-height:.95;margin:0 0 14px;text-transform:uppercase;color:#fff;letter-spacing:-.03em;}
.proyecto-modal-hero p{margin:0;max-width:850px;color:rgba(255,255,255,.78);font-size:17px;line-height:1.65;}
.proyecto-modal-content{display:grid;grid-template-columns:minmax(330px,.9fr) 1.3fr;gap:28px;padding:34px 42px 48px;}
.proyecto-modal-info{display:grid;gap:14px;align-content:start;}
.proyecto-info-card{background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.13);border-radius:22px;padding:18px 20px;box-shadow:inset 0 1px 0 rgba(255,255,255,.08);}
.proyecto-info-card strong{display:block;color:#f6bd24;text-transform:uppercase;letter-spacing:.12em;font-size:12px;margin-bottom:8px;}
.proyecto-info-card p,.proyecto-info-card li{color:rgba(255,255,255,.85);line-height:1.55;font-size:15px;margin:0;}
.proyecto-info-card ul{margin:0;padding-left:18px;}
.proyecto-modal-gallery{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;align-content:start;}
.proyecto-modal-gallery img{width:100%;height:170px;object-fit:cover;border-radius:20px;border:2px solid rgba(246,189,36,.45);box-shadow:0 14px 28px rgba(0,0,0,.28);transition:.25s ease;background:#0f172a;}
.proyecto-modal-gallery img:hover{transform:translateY(-5px) scale(1.02);border-color:#f6bd24;}
@media(max-width:900px){.proyecto-modal{padding:12px}.proyecto-modal-hero{padding:38px 24px 24px}.proyecto-modal-content{grid-template-columns:1fr;padding:24px}.proyecto-modal-gallery{grid-template-columns:repeat(2,1fr)}.proyecto-modal-gallery img{height:150px}}
@media(max-width:560px){.proyecto-modal-gallery{grid-template-columns:1fr}.proyecto-modal-gallery img{height:190px}.proyecto-modal-panel{border-radius:22px}.proyecto-modal-hero h2{font-size:30px}.proyecto-card-btn small{display:none}}

/* =========================================================
   JRS - SERVICIOS / VALORES LOOK PREMIUM TIPO MOCKUP
   Ajuste solicitado: mejores imágenes y textos visibles.
========================================================= */
#servicios{
    position:relative!important;
    overflow:hidden!important;
    padding-top:86px!important;
    padding-bottom:78px!important;
    background:
      linear-gradient(180deg,rgba(2,6,15,.92),rgba(5,12,25,.96)),
      radial-gradient(circle at 12% 0%,rgba(240,180,41,.18),transparent 34%),
      url('Imagenes Servicios/Obra Civil.jpg') center/cover no-repeat!important;
    border-top:1px solid rgba(240,180,41,.38)!important;
    border-bottom:1px solid rgba(240,180,41,.20)!important;
}
#servicios::before{
    content:"";position:absolute;inset:0;
    background:linear-gradient(90deg,rgba(0,0,0,.55),transparent 45%,rgba(36,59,107,.25));
    pointer-events:none;
}
#servicios > *{position:relative;z-index:1;}
#servicios .section-kicker{color:#F0B429!important;text-align:center!important;display:block!important;letter-spacing:4px!important;}
#servicios .titulo-central{color:#fff!important;text-shadow:0 12px 35px rgba(0,0,0,.45)!important;}
#servicios .titulo-central::after{background:#F0B429!important;}
.servicios-subtitulo-premium{
    color:rgba(255,255,255,.86)!important;
    text-align:center!important;
    font-size:clamp(16px,1.5vw,21px)!important;
    margin:-10px auto 34px!important;
    max-width:760px!important;
    line-height:1.6!important;
}
#servicios .grid-tarjetas{
    grid-template-columns:repeat(4,minmax(220px,1fr))!important;
    gap:24px!important;
    align-items:stretch!important;
}
#servicios .tarjeta-item{
    min-height:520px!important;
    border-radius:28px!important;
    overflow:hidden!important;
    background:#fff!important;
    border:1px solid rgba(240,180,41,.72)!important;
    box-shadow:0 28px 65px rgba(0,0,0,.35)!important;
    position:relative!important;
    transform:translateZ(0);
}
#servicios .tarjeta-item::before{
    content:""!important;
    position:absolute!important;
    left:0;top:0;bottom:0;width:12px!important;
    background:linear-gradient(180deg,#f8d567,#e5a915)!important;
    z-index:4!important;
}
#servicios .tarjeta-item::after{
    content:""!important;
    position:absolute!important;
    left:28px;bottom:156px;width:76px;height:76px;
    border-radius:18px!important;
    background:#07101c!important;
    border:2px solid #F0B429!important;
    box-shadow:0 16px 30px rgba(0,0,0,.28)!important;
    z-index:5!important;
    display:grid!important;
    place-items:center!important;
    color:#F0B429!important;
    font-size:32px!important;
    font-weight:900!important;
}
#servicios .tarjeta-item:nth-child(1)::after{content:"⚙"!important;}
#servicios .tarjeta-item:nth-child(2)::after{content:"🏗"!important;}
#servicios .tarjeta-item:nth-child(3)::after{content:"▣"!important;}
#servicios .tarjeta-item:nth-child(4)::after{content:"▰"!important;}
#servicios .tarjeta-imagen-wrapper{
    height:345px!important;
    min-height:345px!important;
    background:#070A12!important;
}
#servicios .tarjeta-imagen-wrapper::after{
    content:""!important;
    position:absolute!important;inset:0!important;
    background:linear-gradient(180deg,rgba(0,0,0,.05) 0%,rgba(0,0,0,.10) 55%,rgba(0,0,0,.28) 100%)!important;
    z-index:2!important;
}
#servicios .tarjeta-item img{
    width:100%!important;height:100%!important;object-fit:cover!important;
    filter:saturate(1.1) contrast(1.04)!important;
}
#servicios .tarjeta-contenido{
    min-height:176px!important;
    padding:48px 30px 28px!important;
    background:linear-gradient(180deg,#ffffff 0%,#f7f8fb 100%)!important;
    border:0!important;
    border-top:1px solid rgba(15,23,42,.08)!important;
    border-radius:0 0 26px 26px!important;
}
#servicios .tarjeta-contenido::after{
    content:""!important;
    width:48px;height:3px;background:#F0B429!important;
    position:absolute;left:30px;bottom:20px;border-radius:999px;
}
#servicios .tarjeta-contenido span{
    color:#E5A915!important;
    font-weight:1000!important;
    letter-spacing:3px!important;
    font-size:13px!important;
    text-transform:uppercase!important;
    display:block!important;
    margin-bottom:10px!important;
}
#servicios .tarjeta-contenido h3,
#servicios .tarjeta-item h3{
    color:#070D1B!important;
    font-weight:1000!important;
    font-size:clamp(25px,2vw,35px)!important;
    line-height:.98!important;
    letter-spacing:-1px!important;
    text-shadow:none!important;
}
#servicios .tarjeta-item:hover{
    transform:translateY(-12px)!important;
    box-shadow:0 38px 90px rgba(240,180,41,.20),0 24px 70px rgba(0,0,0,.48)!important;
}
#servicios .tarjeta-item:hover img{transform:scale(1.07)!important;}

/* METODOLOGÍA Y VALORES - texto claro y layout parecido al mockup */
#metodologia{
    background:
      linear-gradient(180deg,rgba(3,9,20,.96),rgba(8,19,38,.98)),
      radial-gradient(circle at 80% 20%,rgba(240,180,41,.15),transparent 36%)!important;
    color:#fff!important;
    border-top:1px solid rgba(240,180,41,.22)!important;
}
#metodologia .section-kicker{color:#F0B429!important;text-align:center!important;display:block!important;letter-spacing:4px!important;}
#metodologia .titulo-central{color:#fff!important;}
#metodologia .metodo-item,
#metodologia .valor-card{
    background:linear-gradient(135deg,rgba(10,22,40,.92),rgba(36,59,107,.55))!important;
    border:1px solid rgba(255,255,255,.14)!important;
    box-shadow:0 24px 60px rgba(0,0,0,.28)!important;
}
#metodologia .metodo-item h4,
#metodologia .valor-card h3{
    color:#ffffff!important;
    text-shadow:none!important;
}
#metodologia .metodo-item p,
#metodologia .valor-card p{
    color:rgba(226,232,240,.88)!important;
    font-weight:500!important;
}
#metodologia .valor-index,
#metodologia .metodo-icono{
    color:#07101c!important;
    background:linear-gradient(135deg,#F8D567,#E5A915)!important;
    box-shadow:0 16px 32px rgba(240,180,41,.18)!important;
}
@media(max-width:1180px){#servicios .grid-tarjetas{grid-template-columns:repeat(2,1fr)!important}}
@media(max-width:720px){#servicios .grid-tarjetas{grid-template-columns:1fr!important}#servicios .tarjeta-item{min-height:460px!important}#servicios .tarjeta-imagen-wrapper{height:285px!important;min-height:285px!important}}

/* =========================================================
   JRS PREMIUM FINAL - CORRECCIÓN LOGO, SERVICIOS Y CONTRASTE
   Conserva información, mejora diseño visual.
========================================================= */
:root{
  --jrs-gold:#f5b820;
  --jrs-gold-2:#ffd76a;
  --jrs-navy:#06111f;
  --jrs-blue:#13284b;
  --jrs-white:#ffffff;
}

.nav-logo-imagen{
  width:clamp(150px,15vw,220px)!important;
  height:auto!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  padding:6px 10px!important;
  border-radius:16px!important;
  background:rgba(255,255,255,.96)!important;
  box-shadow:0 12px 32px rgba(0,0,0,.24)!important;
}
.nav-logo-imagen img{
  width:100%!important;
  max-height:74px!important;
  object-fit:contain!important;
  display:block!important;
  filter:none!important;
}

#servicios{
  position:relative!important;
  isolation:isolate!important;
  padding:92px 4vw 88px!important;
  background:
    radial-gradient(circle at 50% -10%,rgba(245,184,32,.18),transparent 30%),
    linear-gradient(180deg,rgba(2,7,18,.94),rgba(5,15,30,.98)),
    url('Imagenes Servicios/servicio_obra_civil_premium.jpg') center/cover no-repeat!important;
  border-top:1px solid rgba(245,184,32,.52)!important;
  border-bottom:1px solid rgba(245,184,32,.32)!important;
}
#servicios::before{
  content:""!important;
  position:absolute!important;
  inset:0!important;
  background:
    linear-gradient(90deg,rgba(0,0,0,.72),rgba(3,13,28,.48),rgba(0,0,0,.74)),
    repeating-linear-gradient(90deg,rgba(255,255,255,.025) 0 1px,transparent 1px 120px)!important;
  z-index:0!important;
}
#servicios > *{position:relative!important;z-index:1!important;}
#servicios .section-kicker{
  color:var(--jrs-gold)!important;
  text-align:center!important;
  display:block!important;
  font-weight:1000!important;
  letter-spacing:5px!important;
  text-transform:uppercase!important;
}
#servicios .titulo-central{
  color:#fff!important;
  font-size:clamp(42px,5vw,76px)!important;
  letter-spacing:4px!important;
  text-shadow:0 14px 40px rgba(0,0,0,.75)!important;
}
#servicios .titulo-central::first-letter{color:#fff!important;}
#servicios .titulo-central::after{background:linear-gradient(90deg,transparent,var(--jrs-gold),transparent)!important;}
#servicios .titulo-central span,
#servicios .titulo-central strong{color:var(--jrs-gold)!important;}
.servicios-subtitulo-premium{
  color:rgba(255,255,255,.92)!important;
  text-shadow:0 8px 20px rgba(0,0,0,.5)!important;
  font-weight:500!important;
}
#servicios .grid-tarjetas{
  display:grid!important;
  grid-template-columns:repeat(4,minmax(235px,1fr))!important;
  gap:26px!important;
  max-width:1500px!important;
  margin:36px auto 0!important;
}
#servicios .tarjeta-item{
  min-height:500px!important;
  border-radius:26px!important;
  overflow:hidden!important;
  background:linear-gradient(180deg,#071322,#0b1b30)!important;
  border:1px solid rgba(245,184,32,.72)!important;
  box-shadow:0 28px 80px rgba(0,0,0,.48)!important;
  position:relative!important;
}
#servicios .tarjeta-item::before{
  content:""!important;
  position:absolute!important;
  inset:0!important;
  width:auto!important;
  background:linear-gradient(180deg,transparent 45%,rgba(3,9,20,.98) 72%)!important;
  z-index:3!important;
  pointer-events:none!important;
}
#servicios .tarjeta-item::after{
  content:""!important;
  position:absolute!important;
  left:26px!important;
  top:260px!important;
  bottom:auto!important;
  width:78px!important;
  height:78px!important;
  border-radius:20px!important;
  background:rgba(3,10,20,.94)!important;
  border:2px solid var(--jrs-gold)!important;
  box-shadow:0 0 0 8px rgba(245,184,32,.10),0 20px 34px rgba(0,0,0,.46)!important;
  z-index:6!important;
  display:grid!important;
  place-items:center!important;
  color:var(--jrs-gold)!important;
  font-size:34px!important;
}
#servicios .tarjeta-item:nth-child(1)::after{content:"⚙"!important;}
#servicios .tarjeta-item:nth-child(2)::after{content:"🏗"!important;}
#servicios .tarjeta-item:nth-child(3)::after{content:"▣"!important;}
#servicios .tarjeta-item:nth-child(4)::after{content:"▰"!important;}
#servicios .tarjeta-imagen-wrapper{
  height:330px!important;
  min-height:330px!important;
  background:#06111f!important;
  overflow:hidden!important;
}
#servicios .tarjeta-imagen-wrapper::after{
  content:""!important;
  position:absolute!important;
  inset:0!important;
  background:linear-gradient(180deg,rgba(0,0,0,.06),rgba(0,0,0,.10) 55%,rgba(0,0,0,.62))!important;
  z-index:2!important;
}
#servicios .tarjeta-item img{
  width:100%!important;
  height:100%!important;
  object-fit:cover!important;
  transform:scale(1.01)!important;
  filter:saturate(1.18) contrast(1.08)!important;
  transition:.45s ease!important;
}
#servicios .tarjeta-contenido{
  position:absolute!important;
  left:0!important;
  right:0!important;
  bottom:0!important;
  z-index:5!important;
  min-height:168px!important;
  padding:58px 28px 28px!important;
  background:linear-gradient(180deg,rgba(7,19,34,.10),rgba(7,19,34,.96) 22%,rgba(7,19,34,1))!important;
  border-radius:0!important;
  border:0!important;
}
#servicios .tarjeta-contenido::after{
  content:""!important;
  position:absolute!important;
  left:28px!important;
  bottom:20px!important;
  width:54px!important;
  height:3px!important;
  background:var(--jrs-gold)!important;
  border-radius:999px!important;
}
#servicios .tarjeta-contenido span{
  color:var(--jrs-gold)!important;
  font-size:13px!important;
  font-weight:1000!important;
  letter-spacing:3px!important;
  text-transform:uppercase!important;
  text-shadow:0 8px 18px rgba(0,0,0,.55)!important;
}
#servicios .tarjeta-contenido h3,
#servicios .tarjeta-item h3{
  color:#ffffff!important;
  font-weight:1000!important;
  font-size:clamp(24px,2vw,34px)!important;
  line-height:1.03!important;
  letter-spacing:-.8px!important;
  text-shadow:0 10px 26px rgba(0,0,0,.75)!important;
}
#servicios .tarjeta-item:hover{
  transform:translateY(-12px)!important;
  border-color:var(--jrs-gold-2)!important;
  box-shadow:0 0 0 1px rgba(245,184,32,.30),0 38px 90px rgba(0,0,0,.58),0 24px 55px rgba(245,184,32,.15)!important;
}
#servicios .tarjeta-item:hover img{transform:scale(1.08)!important;}

/* Detalle de servicio: todo el texto legible, sin negro sobre fondo oscuro */
#detalleServicio.detalle-dinamico-contenedor,
#servicios .detalle-dinamico-contenedor{
  background:linear-gradient(135deg,rgba(7,19,34,.96),rgba(16,39,70,.94))!important;
  border:1px solid rgba(245,184,32,.35)!important;
  box-shadow:0 28px 80px rgba(0,0,0,.50)!important;
  color:#fff!important;
}
#detalleServicio .detalle-info h3{color:#ffffff!important;text-shadow:0 12px 28px rgba(0,0,0,.55)!important;}
#detalleServicio .tabla-tecnica{
  border:1px solid rgba(255,255,255,.12)!important;
  background:rgba(255,255,255,.04)!important;
}
#detalleServicio .tabla-tecnica tr,
#detalleServicio .tabla-tecnica tr:nth-child(even){background:rgba(255,255,255,.03)!important;}
#detalleServicio .tabla-tecnica tr:hover{background:rgba(245,184,32,.12)!important;}
#detalleServicio .tabla-tecnica td{
  color:#eaf1fb!important;
  border-bottom:1px solid rgba(255,255,255,.10)!important;
  font-size:15px!important;
}
#detalleServicio .tabla-tecnica td:first-child{
  color:var(--jrs-gold)!important;
}
#detalleServicio .descripcion-texto{
  background:rgba(255,255,255,.06)!important;
  color:#f3f7ff!important;
  border-left:5px solid var(--jrs-gold)!important;
}
#detalleServicio strong{color:#fff!important;}
#detalleServicio .imagen-principal{
  object-fit:cover!important;
  background:#06111f!important;
  border:1px solid rgba(245,184,32,.35)!important;
}

/* Mejor legibilidad en valores/metodología */
#metodologia .metodo-item h4,
#metodologia .valor-card h3,
#metodologia .corporativo-card h3,
#metodologia .titulo-marcado{
  color:#ffffff!important;
  text-shadow:0 8px 22px rgba(0,0,0,.55)!important;
}
#metodologia .metodo-item p,
#metodologia .valor-card p,
#metodologia .corporativo-card p{
  color:#dfe8f5!important;
}

@media(max-width:1180px){#servicios .grid-tarjetas{grid-template-columns:repeat(2,minmax(240px,1fr))!important;}}
@media(max-width:720px){
  .nav-logo-imagen{width:150px!important;}
  #servicios .grid-tarjetas{grid-template-columns:1fr!important;}
  #servicios .tarjeta-item{min-height:470px!important;}
  #servicios .tarjeta-imagen-wrapper{height:300px!important;min-height:300px!important;}
  #servicios .tarjeta-item::after{top:236px!important;}
}



/* ========================================================================== 
   JRS FINAL PRO - DISEÑO CORPORATIVO / AGENCIA
   ========================================================================== */
:root{--jrs-black:#030812;--jrs-navy:#071426;--jrs-navy-2:#0b1d35;--jrs-card:#0e2038;--jrs-gold:#f4b321;--jrs-gold-2:#ffd767;--jrs-white:#f8fafc;--jrs-text:#dbe7f6;--jrs-muted:#9fb0c7;--jrs-line:rgba(244,179,33,.34);--jrs-glass:rgba(9,22,39,.72)}
html{scroll-padding-top:100px}body{background:radial-gradient(circle at 12% 8%,rgba(244,179,33,.16),transparent 28%),radial-gradient(circle at 88% 18%,rgba(36,59,107,.35),transparent 30%),linear-gradient(180deg,#030812 0%,#071426 42%,#ecf1f7 42%,#eef3f8 100%)!important;color:#0b1220}.navbar{background:rgba(3,8,18,.88)!important;border-bottom:1px solid rgba(244,179,33,.55)!important;box-shadow:0 18px 44px rgba(0,0,0,.32)!important}.nav-contenedor{width:min(94%,1360px)!important}.nav-logo-imagen{width:210px!important;height:86px!important;padding:0!important;border-radius:20px!important;background:linear-gradient(145deg,#030812,#071426)!important;border:1px solid rgba(244,179,33,.25)!important;box-shadow:0 20px 44px rgba(0,0,0,.35),inset 0 0 0 1px rgba(255,255,255,.05)!important;overflow:hidden!important}.nav-logo-imagen img{width:100%!important;height:100%!important;object-fit:contain!important;padding:10px!important;filter:drop-shadow(0 8px 18px rgba(0,0,0,.55))!important}.nav-menu a{color:#f7fbff!important;font-size:14px!important;letter-spacing:.9px!important;font-weight:900!important;padding:12px 14px!important;border-radius:14px!important;position:relative!important}.nav-menu a:hover{color:#111827!important;background:linear-gradient(135deg,var(--jrs-gold),var(--jrs-gold-2))!important;box-shadow:0 16px 32px rgba(244,179,33,.28)!important}.nav-menu .nav-cta{background:linear-gradient(135deg,var(--jrs-gold),var(--jrs-gold-2))!important;color:#071426!important;padding:16px 28px!important;border-radius:18px!important;box-shadow:0 18px 40px rgba(244,179,33,.28)!important}.hero-header{min-height:94vh!important;background:linear-gradient(90deg,rgba(3,8,18,.96) 0%,rgba(3,8,18,.82) 38%,rgba(3,8,18,.34) 72%,rgba(3,8,18,.85) 100%),url('Imagenes Excavadoras/Excavadora 320E RR EX06 (2).jpeg') center/cover no-repeat!important;position:relative!important;overflow:hidden!important}.hero-header::before{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(3,8,18,.1),rgba(3,8,18,.92)),radial-gradient(circle at 70% 35%,rgba(244,179,33,.24),transparent 30%);pointer-events:none}.hero-header::after{content:"";position:absolute;left:0;right:0;bottom:0;height:10px;background:linear-gradient(90deg,transparent,var(--jrs-gold),transparent)}.hero-overlay{background:transparent!important;align-items:center!important;justify-content:flex-start!important}.hero-content{width:min(94%,1360px)!important;margin:0 auto!important;text-align:left!important;max-width:760px!important;padding-top:90px!important}.hero-etiqueta{display:inline-flex!important;gap:8px!important;align-items:center!important;background:rgba(244,179,33,.12)!important;border:1px solid rgba(244,179,33,.45)!important;color:#ffd767!important;padding:10px 16px!important;border-radius:999px!important;font-size:12px!important;letter-spacing:2.6px!important;text-transform:uppercase!important;font-weight:900!important}.hero-content h1{color:#fff!important;text-align:left!important;font-size:clamp(48px,7vw,92px)!important;line-height:.9!important;max-width:880px!important;margin:24px 0 20px!important;letter-spacing:-4px!important;text-transform:uppercase!important;text-shadow:0 24px 70px rgba(0,0,0,.7)!important}.hero-content .subtitulo{color:var(--jrs-gold)!important;font-weight:900!important;text-transform:uppercase!important;letter-spacing:1px!important;font-size:clamp(22px,3vw,36px)!important;line-height:1.05!important}.hero-content .slogan{color:#e8f0fa!important;max-width:620px!important;font-size:18px!important;line-height:1.75!important}.hero-actions{justify-content:flex-start!important;margin-top:32px!important;gap:18px!important}.btn-principal,.btn-secundario,.nav-cta{border-radius:14px!important;font-weight:900!important;text-transform:uppercase!important;letter-spacing:.8px!important}.btn-principal{background:linear-gradient(135deg,var(--jrs-gold),var(--jrs-gold-2))!important;color:#08111f!important;border:0!important;box-shadow:0 20px 42px rgba(244,179,33,.28)!important}.btn-secundario{background:rgba(255,255,255,.06)!important;color:#fff!important;border:1px solid rgba(244,179,33,.65)!important;backdrop-filter:blur(12px)!important}.seccion-estadisticas{margin-top:-86px!important;position:relative!important;z-index:5!important;background:transparent!important;padding:0!important}.stat-contenedor{width:min(94%,1160px)!important;display:grid!important;grid-template-columns:repeat(4,1fr)!important;gap:18px!important}.stat-card{background:linear-gradient(145deg,rgba(9,22,39,.92),rgba(14,32,56,.9))!important;border:1px solid rgba(244,179,33,.35)!important;border-radius:24px!important;padding:28px 22px!important;box-shadow:0 26px 70px rgba(0,0,0,.38)!important;backdrop-filter:blur(18px)!important}.stat-numero{color:var(--jrs-gold)!important;font-size:42px!important;text-shadow:0 0 28px rgba(244,179,33,.24)!important}.stat-concepto{color:#e6eef9!important;font-weight:800!important}.contenedor-global{width:min(94%,1360px)!important;padding-top:92px!important}.seccion-bloque{margin-bottom:120px!important}.section-kicker{color:var(--jrs-gold)!important;letter-spacing:4px!important;font-weight:900!important}.titulo-central{font-size:clamp(34px,5vw,64px)!important;letter-spacing:-2px!important;color:#071426!important}.corporativo-card,.quienes-somos-wrapper,.metodo-item,.valor-card{background:linear-gradient(145deg,#081525,#132844)!important;color:#fff!important;border:1px solid rgba(244,179,33,.26)!important;box-shadow:0 26px 70px rgba(5,12,24,.18)!important;border-radius:28px!important}.corporativo-card p,.quienes-somos-wrapper p,.metodo-item p,.valor-card p{color:#dbe7f6!important}.corporativo-card h3,.quienes-somos-wrapper h2,.metodo-item h4,.valor-card h3{color:#fff!important}.card-num,.valor-index,.metodo-icono{background:linear-gradient(135deg,var(--jrs-gold),var(--jrs-gold-2))!important;color:#071426!important}
#servicios{width:100vw!important;margin-left:calc(50% - 50vw)!important;padding:95px min(6vw,80px)!important;border-radius:0!important;background:linear-gradient(180deg,rgba(3,8,18,.86),rgba(3,8,18,.95)),url('Imagenes Servicios/servicio_obra_civil_premium.jpg') center/cover fixed no-repeat!important;border-top:1px solid var(--jrs-line)!important;border-bottom:1px solid var(--jrs-line)!important;box-shadow:inset 0 0 120px rgba(0,0,0,.65)!important}#servicios .titulo-central{color:#fff!important;margin-bottom:14px!important}#servicios .titulo-central::after{background:linear-gradient(90deg,transparent,var(--jrs-gold),transparent)!important}#servicios .servicios-subtitulo-premium{color:#eff6ff!important;text-align:center!important;font-size:20px!important;margin-bottom:42px!important}#servicios .grid-tarjetas{width:min(100%,1360px)!important;margin:0 auto!important;display:grid!important;grid-template-columns:repeat(4,minmax(230px,1fr))!important;gap:22px!important}#servicios .tarjeta-item{min-height:530px!important;border-radius:28px!important;overflow:hidden!important;background:linear-gradient(180deg,#0a182b,#06101f)!important;border:1px solid rgba(244,179,33,.72)!important;box-shadow:0 28px 74px rgba(0,0,0,.42)!important;position:relative!important}#servicios .tarjeta-item::before{content:""!important;position:absolute!important;inset:0!important;z-index:2!important;pointer-events:none!important;background:linear-gradient(180deg,transparent 0 48%,rgba(3,8,18,.18) 52%,#06101f 70%)!important}#servicios .tarjeta-item::after{top:300px!important;left:30px!important;width:76px!important;height:76px!important;border-radius:22px!important;background:linear-gradient(145deg,#05101e,#0d2038)!important;border:2px solid var(--jrs-gold)!important;color:var(--jrs-gold)!important;font-size:32px!important;box-shadow:0 14px 40px rgba(0,0,0,.45),0 0 0 8px rgba(244,179,33,.08)!important}#servicios .tarjeta-imagen-wrapper{height:335px!important;min-height:335px!important;border-radius:0!important;background:#06101f!important}#servicios .tarjeta-imagen-wrapper::after{background:linear-gradient(180deg,rgba(0,0,0,.04),rgba(3,8,18,.20))!important}#servicios .tarjeta-item img{width:100%!important;height:100%!important;object-fit:cover!important;filter:saturate(1.08) contrast(1.06)!important}#servicios .tarjeta-contenido{position:relative!important;z-index:3!important;inset:auto!important;height:195px!important;padding:58px 28px 28px!important;background:linear-gradient(180deg,#071426 0%,#08182c 100%)!important;border-top:1px solid rgba(244,179,33,.45)!important}#servicios .tarjeta-contenido::before{content:""!important;position:absolute!important;left:28px!important;top:28px!important;width:48px!important;height:6px!important;background:var(--jrs-gold)!important;border-radius:50px!important}#servicios .tarjeta-contenido span{color:var(--jrs-gold)!important;font-size:13px!important;letter-spacing:3px!important;font-weight:900!important}#servicios .tarjeta-contenido h3{color:#fff!important;font-size:clamp(24px,2vw,34px)!important;line-height:1.05!important;text-shadow:0 12px 24px rgba(0,0,0,.55)!important}#servicios .tarjeta-item:hover{transform:translateY(-12px) scale(1.01)!important;box-shadow:0 38px 90px rgba(0,0,0,.58),0 0 0 1px var(--jrs-gold)!important}#servicios .tarjeta-item:hover img{transform:scale(1.08)!important}
#detalleServicio.detalle-dinamico-contenedor{width:min(100%,1240px)!important;margin:46px auto 0!important;border-radius:30px!important;padding:30px!important;background:linear-gradient(135deg,rgba(6,16,31,.98),rgba(12,35,62,.96))!important;border:1px solid rgba(244,179,33,.55)!important;color:#fff!important;box-shadow:0 35px 95px rgba(0,0,0,.55)!important}#detalleServicio .detalle-flex{display:grid!important;grid-template-columns:minmax(320px,.9fr) 1.1fr!important;gap:28px!important;align-items:stretch!important}#detalleServicio .imagen-principal{height:100%!important;min-height:420px!important;object-fit:cover!important;border-radius:24px!important}#detalleServicio .detalle-info{padding:8px 10px!important}#detalleServicio .detalle-info h3{color:#fff!important;font-size:clamp(32px,4vw,58px)!important;line-height:.95!important;text-transform:uppercase!important}#detalleServicio .tabla-tecnica{width:100%!important;margin:24px 0!important;border-collapse:separate!important;border-spacing:0 12px!important;background:transparent!important;border:0!important}#detalleServicio .tabla-tecnica tr{background:rgba(255,255,255,.075)!important;border-radius:16px!important;overflow:hidden!important;box-shadow:inset 0 0 0 1px rgba(255,255,255,.08)!important}#detalleServicio .tabla-tecnica td{color:#eef6ff!important;padding:15px 18px!important;font-weight:700!important;border:0!important;font-size:16px!important}#detalleServicio .tabla-tecnica td:first-child{color:var(--jrs-gold)!important;font-size:20px!important}#detalleServicio .descripcion-texto{color:#dbe7f6!important;background:rgba(255,255,255,.06)!important;border-left:5px solid var(--jrs-gold)!important;border-radius:16px!important;padding:18px!important;line-height:1.8!important}#detalleServicio strong{color:var(--jrs-gold-2)!important}
#catalogo .grid-tarjetas,#catalogo .catalogo-grid{display:grid!important;grid-template-columns:repeat(4,minmax(220px,1fr))!important;gap:22px!important}#catalogo .tarjeta-item{border-radius:26px!important;background:#071426!important;border:1px solid rgba(8,20,38,.12)!important;box-shadow:0 24px 60px rgba(8,20,38,.14)!important;overflow:hidden!important;min-height:390px!important}#catalogo .tarjeta-imagen-wrapper{height:260px!important}#catalogo .tarjeta-contenido{background:#fff!important;border-left:7px solid var(--jrs-gold)!important;color:#071426!important}#catalogo .tarjeta-contenido h3{color:#071426!important;font-size:24px!important}#catalogo .tarjeta-contenido span{color:#d89b07!important}.modelo-card{background:linear-gradient(145deg,#fff,#f7fafc)!important;border:1px solid rgba(36,59,107,.16)!important;border-radius:18px!important;box-shadow:0 18px 42px rgba(7,20,38,.10)!important}.modelo-card:hover{border-color:var(--jrs-gold)!important;transform:translateY(-6px)!important;box-shadow:0 24px 58px rgba(244,179,33,.18)!important}.clientes-premium-wall{background:linear-gradient(135deg,#071426,#132844)!important;border:1px solid rgba(244,179,33,.35)!important;border-radius:34px!important;padding:34px!important;box-shadow:0 32px 90px rgba(7,20,38,.22)!important;color:#fff!important}.clientes-wall-header h3{color:#fff!important;font-size:clamp(28px,4vw,50px)!important;text-transform:uppercase!important}.clientes-eyebrow{color:var(--jrs-gold)!important;letter-spacing:3px!important;font-weight:900!important}.clientes-count{background:linear-gradient(135deg,var(--jrs-gold),var(--jrs-gold-2))!important;color:#071426!important;border-radius:28px!important}.cliente-logo-card{background:rgba(255,255,255,.055)!important;border:1px solid rgba(255,255,255,.14)!important;border-radius:24px!important;color:#fff!important;box-shadow:inset 0 0 0 1px rgba(255,255,255,.035)!important}.cliente-logo-card:hover{background:rgba(244,179,33,.13)!important;border-color:rgba(244,179,33,.75)!important;transform:translateY(-7px)!important}.cliente-logo-card h4{color:#fff!important}.cliente-logo-card small{color:#c9d7e8!important}.cliente-inicial{background:linear-gradient(135deg,var(--jrs-gold),var(--jrs-gold-2))!important;color:#071426!important}.contacto-card,.footer{background:linear-gradient(145deg,#071426,#0f2747)!important;border:1px solid rgba(244,179,33,.35)!important;color:#fff!important}.contacto-card h3,.footer h3{color:#fff!important}.contacto-card p,.footer p,.footer a{color:#dbe7f6!important}.jrs-chat-toggle{background:linear-gradient(135deg,var(--jrs-gold),var(--jrs-gold-2))!important;color:#071426!important;box-shadow:0 20px 50px rgba(244,179,33,.36)!important}.jrs-chat-window{border:1px solid rgba(244,179,33,.42)!important;box-shadow:0 34px 90px rgba(0,0,0,.40)!important}.jrs-chat-header{background:linear-gradient(135deg,#071426,#102847)!important;color:#fff!important}@media(max-width:1180px){#servicios .grid-tarjetas,#catalogo .grid-tarjetas,#catalogo .catalogo-grid{grid-template-columns:repeat(2,minmax(240px,1fr))!important}.stat-contenedor{grid-template-columns:repeat(2,1fr)!important}#detalleServicio .detalle-flex{grid-template-columns:1fr!important}}@media(max-width:760px){.nav-logo-imagen{width:165px!important;height:68px!important}.hero-content h1{font-size:44px!important;letter-spacing:-2px!important}.stat-contenedor,#servicios .grid-tarjetas,#catalogo .grid-tarjetas,#catalogo .catalogo-grid{grid-template-columns:1fr!important}#servicios{padding:80px 22px!important}#servicios .tarjeta-item{min-height:500px!important}#servicios .tarjeta-imagen-wrapper{height:310px!important}#servicios .tarjeta-item::after{top:276px!important}.clientes-premium-wall{padding:22px!important}}

/* ==========================================================
   JRS AJUSTE FINAL: REGRESO A AZUL MARINO + MEJOR LEGIBILIDAD
   Corrige: hero demasiado grande, tarjetas blancas con letras perdidas,
   imágenes de servicios y acomodo de texto.
========================================================== */
:root{
  --jrs-final-navy:#081426;
  --jrs-final-navy-2:#102444;
  --jrs-final-navy-3:#18325e;
  --jrs-final-gold:#f4b321;
  --jrs-final-gold-2:#ffd767;
  --jrs-final-text:#eef6ff;
  --jrs-final-muted:#b9c8dc;
}

body{
  background:linear-gradient(180deg,#06101f 0%,#0b1a32 34%,#edf2f7 34%,#f8fafc 100%) !important;
}

/* Header más limpio */
.navbar{
  min-height:86px !important;
  background:linear-gradient(90deg,#050a14,#0b1629 48%,#07101f) !important;
  border-bottom:1px solid rgba(244,179,33,.45) !important;
}
.nav-logo-imagen{
  width:230px !important;
  height:78px !important;
  border-radius:18px !important;
  background:#07101f !important;
  border:1px solid rgba(244,179,33,.25) !important;
  box-shadow:0 18px 40px rgba(0,0,0,.32) !important;
}
.nav-logo-imagen img{
  padding:8px !important;
  object-fit:contain !important;
}

/* HERO: menos gigante, mejor acomodo y azul marino */
.hero-header{
  min-height:82vh !important;
  padding:150px 20px 90px !important;
  display:flex !important;
  align-items:center !important;
  background:
    linear-gradient(90deg,rgba(6,16,31,.96) 0%,rgba(8,20,38,.82) 48%,rgba(8,20,38,.35) 100%),
    radial-gradient(circle at 72% 45%,rgba(244,179,33,.24),transparent 30%),
    url('Imagenes Excavadoras/Excavadora 320E RR EX06 (2).jpeg') center right/cover no-repeat !important;
}
.hero-header::after{
  height:95px !important;
  background:linear-gradient(180deg,transparent,#06101f 70%,#edf2f7 100%) !important;
}
.hero-overlay{
  width:min(92%,1240px) !important;
  margin:auto !important;
}
.hero-content{
  max-width:760px !important;
  margin-left:0 !important;
  padding-top:20px !important;
  text-align:left !important;
}
.hero-content h1{
  font-size:clamp(42px,5.5vw,82px) !important;
  line-height:.94 !important;
  letter-spacing:-2.8px !important;
  max-width:780px !important;
  margin:20px 0 18px !important;
  color:#fff !important;
}
.hero-content h1::first-line{color:#fff !important;}
.subtitulo{
  font-size:clamp(20px,2.1vw,31px) !important;
  line-height:1.12 !important;
  color:var(--jrs-final-gold) !important;
  max-width:760px !important;
  letter-spacing:1px !important;
}
.slogan{
  max-width:650px !important;
  color:#dbe7f6 !important;
  font-size:16px !important;
}

/* Servicios tipo mockup, con imágenes que no se ven raras */
#servicios{
  background:
    linear-gradient(180deg,rgba(6,16,31,.93),rgba(8,20,38,.98)),
    url('Imagenes Servicios/mockup_servicio_3.jpg') center/cover no-repeat !important;
  padding:92px min(5vw,70px) 92px !important;
  box-shadow:inset 0 0 120px rgba(0,0,0,.55) !important;
}
#servicios .titulo-central{
  color:#fff !important;
  font-size:clamp(38px,4.5vw,68px) !important;
  margin-bottom:12px !important;
}
#servicios .servicios-subtitulo-premium{
  color:#eaf2ff !important;
  margin-bottom:42px !important;
}
#servicios .grid-tarjetas{
  grid-template-columns:repeat(4,minmax(230px,1fr)) !important;
  gap:22px !important;
  max-width:1400px !important;
}
#servicios .tarjeta-item{
  min-height:510px !important;
  border-radius:24px !important;
  background:linear-gradient(180deg,#071426,#0d213d) !important;
  border:1px solid rgba(244,179,33,.72) !important;
  box-shadow:0 24px 70px rgba(0,0,0,.42) !important;
}
#servicios .tarjeta-imagen-wrapper{
  height:300px !important;
  min-height:300px !important;
  background:#071426 !important;
}
#servicios .tarjeta-item img{
  object-fit:cover !important;
  object-position:center !important;
  filter:saturate(1.08) contrast(1.05) brightness(.92) !important;
}
#servicios .tarjeta-contenido{
  height:210px !important;
  padding:60px 28px 28px !important;
  background:linear-gradient(180deg,#071426 0%,#0c213d 100%) !important;
  border-top:1px solid rgba(244,179,33,.38) !important;
}
#servicios .tarjeta-contenido h3,
#servicios .tarjeta-item h3{
  color:#ffffff !important;
  font-size:clamp(23px,1.8vw,31px) !important;
  text-shadow:0 10px 24px rgba(0,0,0,.55) !important;
}
#servicios .tarjeta-contenido span{
  color:var(--jrs-final-gold) !important;
}
#servicios .tarjeta-item::after{
  top:266px !important;
  background:#071426 !important;
}

/* Detalle de servicios: que no salga texto negro sobre azul */
#detalleServicio.detalle-dinamico-contenedor,
#servicios .detalle-dinamico-contenedor{
  background:linear-gradient(135deg,#071426,#102444 55%,#18325e) !important;
  color:#ffffff !important;
  border:1px solid rgba(244,179,33,.48) !important;
}
#detalleServicio .detalle-info h3,
#detalleServicio h1,#detalleServicio h2,#detalleServicio h3,
#detalleServicio p,#detalleServicio li,#detalleServicio td,
#detalleServicio .descripcion-texto{
  color:#eef6ff !important;
}
#detalleServicio .tabla-tecnica tr{
  background:rgba(255,255,255,.07) !important;
}
#detalleServicio .tabla-tecnica td:first-child,
#detalleServicio strong{
  color:var(--jrs-final-gold-2) !important;
}
#detalleServicio .descripcion-texto{
  background:rgba(255,255,255,.075) !important;
}
#detalleServicio .imagen-principal{
  object-fit:cover !important;
  border-radius:22px !important;
}

/* Catálogo: regresar azul marino y texto visible */
#catalogo{
  background:linear-gradient(135deg,#071426,#102444) !important;
  border:1px solid rgba(244,179,33,.24) !important;
  box-shadow:0 28px 80px rgba(7,20,38,.18) !important;
}
#catalogo .section-kicker,
#catalogo .titulo-central{color:#fff !important;}
#catalogo .titulo-central::after{background:linear-gradient(90deg,transparent,var(--jrs-final-gold),transparent) !important;}
#catalogo .grid-tarjetas,#catalogo .catalogo-grid{
  grid-template-columns:repeat(auto-fit,minmax(250px,1fr)) !important;
  gap:24px !important;
}
#catalogo .tarjeta-item{
  min-height:360px !important;
  background:#0b1a32 !important;
  border:1px solid rgba(244,179,33,.35) !important;
  border-radius:26px !important;
  overflow:hidden !important;
  box-shadow:0 22px 55px rgba(0,0,0,.24) !important;
}
#catalogo .tarjeta-imagen-wrapper{
  height:230px !important;
  background:#071426 !important;
}
#catalogo .tarjeta-item img{
  object-fit:cover !important;
  filter:brightness(.88) saturate(1.08) contrast(1.04) !important;
}
#catalogo .tarjeta-contenido{
  position:absolute !important;
  left:18px !important;
  right:18px !important;
  bottom:18px !important;
  min-height:auto !important;
  height:auto !important;
  padding:22px !important;
  border-radius:22px !important;
  background:linear-gradient(135deg,rgba(7,20,38,.96),rgba(16,36,68,.92)) !important;
  border:1px solid rgba(244,179,33,.36) !important;
  border-left:6px solid var(--jrs-final-gold) !important;
}
#catalogo .tarjeta-contenido span{
  color:var(--jrs-final-gold) !important;
  letter-spacing:2px !important;
}
#catalogo .tarjeta-contenido h3,
#catalogo .tarjeta-item h3{
  color:#ffffff !important;
  opacity:1 !important;
  font-size:clamp(21px,1.55vw,29px) !important;
  text-shadow:0 10px 24px rgba(0,0,0,.55) !important;
}

/* Botones de modelos: evitar blanco con texto invisible */
.modelos-visor-seccion{
  background:linear-gradient(145deg,#071426,#102444) !important;
  border:1px solid rgba(244,179,33,.32) !important;
}
.modelos-visor-seccion h3{color:#fff !important;}
.modelo-card{
  background:linear-gradient(145deg,#0d213d,#071426) !important;
  border:1px solid rgba(255,255,255,.12) !important;
  color:#fff !important;
  box-shadow:none !important;
}
.modelo-card .card-nombre,
.modelo-card h4,
.modelo-card strong{
  color:#ffffff !important;
  opacity:1 !important;
}
.modelo-card .card-sub,
.modelo-card p,
.modelo-card span{
  color:#cbd8ea !important;
  opacity:1 !important;
}
.modelo-card:hover,
.modelo-card.active{
  background:linear-gradient(135deg,rgba(244,179,33,.24),rgba(16,36,68,.96)) !important;
  border-color:var(--jrs-final-gold) !important;
}

/* Ficha técnica: mantener elegante pero legible */
.equipo-premium-card{
  background:linear-gradient(135deg,#ffffff,#f8fafc) !important;
  border:1px solid rgba(36,59,107,.16) !important;
}
.equipo-info-panel h3,
.titulo-equipo-premium{
  color:#071426 !important;
  opacity:1 !important;
}
.equipo-resumen-lista li,
.spec-premium{
  color:#334155 !important;
  background:#f8fafc !important;
  border:1px solid #e2e8f0 !important;
}
.equipo-foto-principal{
  background:#071426 !important;
}
.equipo-foto-principal img{
  object-fit:contain !important;
  background:#071426 !important;
}

@media(max-width:1180px){
  #servicios .grid-tarjetas{grid-template-columns:repeat(2,minmax(250px,1fr)) !important;}
}
@media(max-width:760px){
  .hero-header{min-height:78vh !important;padding-top:130px !important;}
  .hero-content h1{font-size:42px !important;letter-spacing:-1.6px !important;}
  #servicios .grid-tarjetas{grid-template-columns:1fr !important;}
  #servicios .tarjeta-imagen-wrapper{height:280px !important;min-height:280px !important;}
  #servicios .tarjeta-item::after{top:246px !important;}
  #catalogo .tarjeta-contenido{left:14px !important;right:14px !important;bottom:14px !important;}
}

/* =========================================================
   CORRECCIÓN FINAL: PROYECTOS Y POLÍTICAS CON TEXTO LEGIBLE
   ========================================================= */
#nuestros-proyectos .clientes-premium-wall,
#nuestros-proyectos .clientes-premium-wall *{
  color:#ffffff !important;
}

#nuestros-proyectos .clientes-logo-grid{
  display:grid !important;
  grid-template-columns:repeat(4,minmax(250px,1fr)) !important;
  gap:22px !important;
  align-items:stretch !important;
}

#nuestros-proyectos .cliente-logo-card,
#nuestros-proyectos .proyecto-card-btn{
  width:100% !important;
  min-height:128px !important;
  padding:22px 24px !important;
  display:grid !important;
  grid-template-columns:58px 1fr !important;
  grid-template-rows:auto auto !important;
  column-gap:18px !important;
  row-gap:4px !important;
  align-items:center !important;
  justify-content:start !important;
  text-align:left !important;
  background:linear-gradient(145deg,rgba(255,255,255,.10),rgba(255,255,255,.045)) !important;
  border:1px solid rgba(255,255,255,.18) !important;
  border-radius:24px !important;
  overflow:hidden !important;
}

#nuestros-proyectos .cliente-logo-card:hover,
#nuestros-proyectos .proyecto-card-btn:hover{
  background:linear-gradient(145deg,rgba(246,189,36,.18),rgba(255,255,255,.07)) !important;
  border-color:rgba(246,189,36,.70) !important;
  transform:translateY(-5px) !important;
}

#nuestros-proyectos .cliente-inicial{
  grid-row:1 / 3 !important;
  width:56px !important;
  height:56px !important;
  min-width:56px !important;
  border-radius:18px !important;
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  font-size:24px !important;
  font-weight:900 !important;
  color:#071426 !important;
  background:linear-gradient(135deg,#f6bd24,#ffd45a) !important;
}

#nuestros-proyectos .cliente-logo-card h4,
#nuestros-proyectos .proyecto-card-btn h4{
  margin:0 !important;
  color:#ffffff !important;
  font-size:17px !important;
  line-height:1.18 !important;
  letter-spacing:.2px !important;
  word-break:normal !important;
  overflow-wrap:normal !important;
  white-space:normal !important;
  max-width:100% !important;
}

#nuestros-proyectos .cliente-logo-card small,
#nuestros-proyectos .proyecto-card-btn small{
  display:block !important;
  margin-top:6px !important;
  color:#d7e4f5 !important;
  font-size:11px !important;
  line-height:1.2 !important;
  letter-spacing:1.4px !important;
  text-transform:uppercase !important;
  font-weight:800 !important;
}

#nuestros-proyectos .clientes-wall-header h3,
#nuestros-proyectos .clientes-eyebrow,
#nuestros-proyectos .clientes-count strong,
#nuestros-proyectos .clientes-count span{
  color:inherit !important;
}

#nuestros-proyectos .clientes-count,
#nuestros-proyectos .clientes-count *{
  color:#071426 !important;
}

/* Políticas corporativas / detalle legal */
#detalleLegal,
#detalleLegal *{
  color:#ffffff !important;
}

#detalleLegal{
  background:linear-gradient(145deg,#111b2c,#1b2c46) !important;
  border:1px solid rgba(246,189,36,.30) !important;
  box-shadow:0 28px 70px rgba(7,20,38,.24) !important;
}

#detalleLegal h1,
#detalleLegal h2,
#detalleLegal h3,
#detalleLegal h4,
#detalleLegal strong,
#detalleLegal b{
  color:#ffffff !important;
}

#detalleLegal p,
#detalleLegal li,
#detalleLegal span{
  color:#dbe7f6 !important;
}

#detalleLegal .legal-placeholder p{
  color:#dbe7f6 !important;
}

#detalleLegal a{
  color:#f6bd24 !important;
}

@media(max-width:1180px){
  #nuestros-proyectos .clientes-logo-grid{grid-template-columns:repeat(2,minmax(240px,1fr)) !important;}
}
@media(max-width:720px){
  #nuestros-proyectos .clientes-logo-grid{grid-template-columns:1fr !important;}
  #nuestros-proyectos .cliente-logo-card,
  #nuestros-proyectos .proyecto-card-btn{grid-template-columns:52px 1fr !important;min-height:112px !important;}
  #nuestros-proyectos .cliente-inicial{width:50px!important;height:50px!important;min-width:50px!important;}
}

/* =========================================================
   CORRECCIÓN FINAL: TARJETAS DE PROYECTOS SIN TEXTO CORTADO
   ========================================================= */
#nuestros-proyectos .clientes-premium-wall{
  max-width:1360px!important;
  overflow:hidden!important;
}
#nuestros-proyectos .clientes-logo-grid,
#nuestros-proyectos .proyectos-botones-grid{
  display:grid!important;
  grid-template-columns:repeat(3,minmax(300px,1fr))!important;
  gap:22px!important;
  align-items:stretch!important;
}
#nuestros-proyectos .cliente-logo-card,
#nuestros-proyectos .proyecto-card-btn{
  width:100%!important;
  min-width:0!important;
  min-height:150px!important;
  padding:28px 26px!important;
  display:grid!important;
  grid-template-columns:64px minmax(0,1fr)!important;
  grid-template-rows:auto auto!important;
  column-gap:22px!important;
  row-gap:8px!important;
  align-items:center!important;
  justify-content:initial!important;
  text-align:left!important;
  overflow:hidden!important;
}
#nuestros-proyectos .cliente-inicial{
  grid-row:1 / span 2!important;
  grid-column:1!important;
  width:62px!important;
  height:62px!important;
  min-width:62px!important;
  border-radius:18px!important;
  font-size:24px!important;
}
#nuestros-proyectos .cliente-logo-card h4,
#nuestros-proyectos .proyecto-card-btn h4{
  grid-column:2!important;
  grid-row:1!important;
  width:100%!important;
  max-width:100%!important;
  margin:0!important;
  color:#ffffff!important;
  font-size:clamp(15px,1.05vw,19px)!important;
  line-height:1.22!important;
  letter-spacing:.02em!important;
  white-space:normal!important;
  overflow-wrap:normal!important;
  word-break:normal!important;
  hyphens:none!important;
  overflow:visible!important;
}
#nuestros-proyectos .proyecto-card-btn small,
#nuestros-proyectos .cliente-logo-card small{
  grid-column:2!important;
  grid-row:2!important;
  width:100%!important;
  max-width:100%!important;
  display:block!important;
  margin:0!important;
  color:#f6bd24!important;
  font-size:12px!important;
  line-height:1.25!important;
  letter-spacing:.13em!important;
  white-space:normal!important;
  word-break:normal!important;
}
#nuestros-proyectos .proyecto-card-btn::after{
  right:26px!important;
  bottom:20px!important;
}
@media(max-width:1180px){
  #nuestros-proyectos .clientes-logo-grid,
  #nuestros-proyectos .proyectos-botones-grid{
    grid-template-columns:repeat(2,minmax(280px,1fr))!important;
  }
}
@media(max-width:720px){
  #nuestros-proyectos .clientes-logo-grid,
  #nuestros-proyectos .proyectos-botones-grid{
    grid-template-columns:1fr!important;
  }
  #nuestros-proyectos .cliente-logo-card,
  #nuestros-proyectos .proyecto-card-btn{
    min-height:126px!important;
    padding:22px!important;
    grid-template-columns:56px minmax(0,1fr)!important;
  }
  #nuestros-proyectos .cliente-inicial{
    width:54px!important;
    height:54px!important;
    min-width:54px!important;
  }
}

/* ========================================================================== 
   JRS RESPONSIVE FINAL - ADAPTACIÓN A PC, LAPTOP, TABLET Y CELULAR
   ========================================================================== */
:root{
  --jrs-mobile-gap: clamp(14px, 3vw, 28px);
}
html, body{ width:100%; max-width:100%; overflow-x:hidden !important; }
*, *::before, *::after{ min-width:0; }
img, video, canvas, svg{ max-width:100%; height:auto; }
body{ font-size: clamp(14px, 1.05vw, 16px); }
section{ scroll-margin-top: clamp(76px, 9vw, 120px); }
.contenedor-global,
.nav-contenedor,
.stat-contenedor,
.footer-contenedor,
.contenedor,
.container{
  width:min(94%, 1280px) !important;
  max-width:1280px !important;
  margin-inline:auto !important;
}
.contenedor-global{ padding-block: clamp(54px, 8vw, 110px) clamp(42px, 7vw, 80px) !important; }
.seccion-bloque{ margin-bottom: clamp(58px, 9vw, 120px) !important; }
.titulo-central{ font-size: clamp(28px, 5.2vw, 56px) !important; line-height:1.02 !important; overflow-wrap:balance; }
p, li, small, span{ max-width:100%; }

/* Navbar adaptable */
.navbar{ padding: clamp(9px, 1.4vw, 16px) 0 !important; }
.nav-contenedor{ gap:16px !important; }
.nav-logo-imagen,
.nav-logo{
  flex:0 0 auto !important;
  max-width: clamp(150px, 18vw, 260px) !important;
}
.nav-logo-imagen img,
.nav-logo img{
  width: clamp(128px, 15vw, 220px) !important;
  height:auto !important;
  object-fit:contain !important;
}
.nav-menu{ gap: clamp(12px, 2vw, 26px) !important; min-width:0 !important; }
.nav-menu a{ white-space:nowrap !important; }

/* Hero adaptable */
.hero-header{
  min-height: min(860px, 100svh) !important;
  padding: clamp(110px, 14vw, 170px) 0 clamp(54px, 9vw, 100px) !important;
  background-position:center !important;
}
.hero-content{
  width:min(94%, 1180px) !important;
  margin-inline:auto !important;
  text-align:left !important;
}
.hero-content h1{
  font-size: clamp(42px, 8vw, 112px) !important;
  line-height:.92 !important;
  letter-spacing: clamp(-4px, -0.4vw, -1px) !important;
  max-width: 1050px !important;
  overflow-wrap:balance !important;
}
.hero-content .subtitulo,
.hero-content .slogan{
  font-size: clamp(16px, 2.3vw, 28px) !important;
  max-width: 900px !important;
}
.hero-actions{ display:flex !important; flex-wrap:wrap !important; gap:14px !important; }
.hero-actions a{ width:auto; max-width:100%; }

/* Grids fluidos */
.stat-contenedor,
.mision-vision-grid,
.grid-tarjetas,
.modelos-internos-grid,
.metodologia-grid,
.valores-grid,
.clientes-logo-grid,
.proyectos-botones-grid,
.catalogo-grid,
.servicios-grid,
.footer-columnas{
  display:grid !important;
  gap: var(--jrs-mobile-gap) !important;
}
.stat-contenedor{ grid-template-columns: repeat(auto-fit, minmax(min(220px, 100%), 1fr)) !important; }
.mision-vision-grid,
.metodologia-grid{ grid-template-columns: repeat(auto-fit, minmax(min(320px, 100%), 1fr)) !important; }
.grid-tarjetas,
.catalogo-grid,
.servicios-grid{ grid-template-columns: repeat(auto-fit, minmax(min(260px, 100%), 1fr)) !important; }
.modelos-internos-grid{ grid-template-columns: repeat(auto-fit, minmax(min(240px, 100%), 1fr)) !important; }
.valores-grid{ grid-template-columns: repeat(auto-fit, minmax(min(220px, 100%), 1fr)) !important; }

/* Tarjetas y textos que nunca se cortan */
.corporativo-card,
.tarjeta-item,
.modelo-card,
.proyecto-card-btn,
.cliente-logo-card,
.valor-card,
.metodologia-card,
.detalle-dinamico-contenedor,
.legal-content,
.legal-card,
.servicio-card,
.service-card{
  width:100% !important;
  max-width:100% !important;
  overflow:hidden !important;
  overflow-wrap:anywhere !important;
  word-break:normal !important;
}
.tarjeta-item h3,
.tarjeta-contenido h3,
.modelo-card h3,
.proyecto-card-btn h4,
.cliente-logo-card h4,
.legal-content h3,
.legal-card h3{
  white-space:normal !important;
  overflow:visible !important;
  text-overflow:clip !important;
  overflow-wrap:balance !important;
  word-break:normal !important;
  line-height:1.15 !important;
}
.tarjeta-item p,
.modelo-card p,
.proyecto-card-btn small,
.cliente-logo-card small,
.legal-content p,
.legal-content li,
.legal-card p,
.legal-card li{
  white-space:normal !important;
  overflow:visible !important;
  text-overflow:clip !important;
  overflow-wrap:anywhere !important;
  line-height:1.65 !important;
}

/* Imágenes consistentes */
.tarjeta-item img,
.tarjeta-imagen-wrapper img,
.modelo-card img,
.imagen-principal img,
.service-card img,
.servicio-card img,
.proyecto-modal img,
.modal img{
  width:100% !important;
  height:100% !important;
  object-fit:cover !important;
}
.tarjeta-imagen-wrapper,
.tarjeta-item .img-wrap,
.service-card .img-wrap,
.servicio-card .img-wrap{
  aspect-ratio: 16/10 !important;
  min-height: clamp(220px, 24vw, 360px) !important;
}
.imagen-principal{ height: clamp(260px, 42vw, 540px) !important; }

/* Detalles de modelos y modales */
.detalle-flex,
.detalle-premium-layout,
.modal-layout,
.proyecto-modal-layout{
  display:grid !important;
  grid-template-columns: minmax(0,1fr) minmax(0,1fr) !important;
  gap: clamp(18px, 3vw, 38px) !important;
  align-items:start !important;
}
.detalle-dinamico-contenedor,
.modal-content,
.proyecto-modal-content{
  width:min(94vw, 1180px) !important;
  max-height:92svh !important;
  overflow:auto !important;
}

/* Proyectos: botones fluidos y sin mordidas */
#nuestros-proyectos .clientes-logo-grid,
#nuestros-proyectos .proyectos-botones-grid{
  grid-template-columns: repeat(auto-fit, minmax(min(300px, 100%), 1fr)) !important;
  align-items:stretch !important;
}
#nuestros-proyectos .cliente-logo-card,
#nuestros-proyectos .proyecto-card-btn{
  min-height: clamp(126px, 14vw, 170px) !important;
  padding: clamp(18px, 2.4vw, 30px) !important;
  display:grid !important;
  grid-template-columns: clamp(52px, 6vw, 72px) minmax(0, 1fr) !important;
  column-gap: clamp(14px, 2vw, 24px) !important;
  align-items:center !important;
}
#nuestros-proyectos .cliente-inicial{
  width: clamp(50px, 5.8vw, 68px) !important;
  height: clamp(50px, 5.8vw, 68px) !important;
  min-width: clamp(50px, 5.8vw, 68px) !important;
}
#nuestros-proyectos h4{ font-size: clamp(15px, 1.55vw, 21px) !important; }
#nuestros-proyectos small{ font-size: clamp(10px, 1vw, 13px) !important; }

/* Chat y WhatsApp en pantallas pequeñas */
.whatsapp-flotante,
.jrs-chat-toggle{
  right: clamp(14px, 2.5vw, 28px) !important;
}
.whatsapp-flotante{ width: clamp(54px, 7vw, 72px) !important; height: clamp(54px, 7vw, 72px) !important; font-size: clamp(24px, 3vw, 34px) !important; }
.jrs-chat-window{
  width: min(420px, calc(100vw - 26px)) !important;
  right: 0 !important;
  max-height: min(680px, 78svh) !important;
}
.jrs-chat-options{ grid-template-columns: repeat(auto-fit, minmax(130px,1fr)) !important; }

/* Tablets */
@media (max-width: 1024px){
  .nav-menu{ gap:14px !important; }
  .nav-menu a{ font-size:11px !important; }
  .hero-content{text-align:left !important;}
  .detalle-flex,
  .detalle-premium-layout,
  .modal-layout,
  .proyecto-modal-layout{ grid-template-columns:1fr !important; }
  .footer-columnas{ grid-template-columns: repeat(2, minmax(0,1fr)) !important; }
}

/* Celular */
@media (max-width: 850px){
  .navbar{ position:sticky !important; top:0 !important; }
  .nav-contenedor{ width:92% !important; }
  .menu-toggle{ display:block !important; flex:0 0 46px !important; }
  .nav-menu{
    position:absolute !important;
    top:calc(100% + 10px) !important;
    left:4% !important; right:4% !important;
    display:none !important;
    flex-direction:column !important;
    align-items:stretch !important;
    background:rgba(7,12,24,.98) !important;
    border:1px solid rgba(229,178,45,.28) !important;
    border-radius:22px !important;
    padding:12px !important;
    box-shadow:0 26px 70px rgba(0,0,0,.42) !important;
  }
  .nav-menu.show{ display:flex !important; }
  .nav-menu a{ padding:14px 12px !important; text-align:center !important; font-size:12px !important; }
  .nav-menu .nav-cta{ margin-top:8px !important; }
  .hero-header{ min-height:auto !important; padding-top:70px !important; }
  .hero-content{ text-align:center !important; }
  .hero-actions{ justify-content:center !important; }
  .btn-principal,.btn-secundario,.nav-cta{ min-height:46px !important; }
  .titulo-central{ margin-bottom:32px !important; }
  .footer-columnas{ grid-template-columns:1fr !important; text-align:center !important; }
  .legal-botones-contenedor{ flex-direction:column !important; align-items:stretch !important; }
  .legal-botones-contenedor a,
  .legal-botones-contenedor button{ width:100% !important; }
}

/* Celular pequeño */
@media (max-width: 520px){
  .contenedor-global{ width:92% !important; }
  .hero-content h1{ font-size: clamp(34px, 13vw, 54px) !important; }
  .hero-content .subtitulo{ font-size:20px !important; }
  .hero-actions a{ width:100% !important; justify-content:center !important; }
  .stat-card,.corporativo-card,.tarjeta-item,.modelo-card,.metodologia-card,.valor-card{ border-radius:22px !important; padding:22px !important; }
  .tarjeta-imagen-wrapper,
  .tarjeta-item .img-wrap,
  .service-card .img-wrap,
  .servicio-card .img-wrap{ min-height:220px !important; aspect-ratio:4/3 !important; }
  #nuestros-proyectos .cliente-logo-card,
  #nuestros-proyectos .proyecto-card-btn{
    grid-template-columns:48px minmax(0,1fr) !important;
    gap:14px !important;
    min-height:118px !important;
  }
  #nuestros-proyectos .cliente-inicial{ width:48px !important; height:48px !important; min-width:48px !important; font-size:20px !important; }
  .jrs-chatbot{ right:12px !important; left:12px !important; }
  .jrs-chat-window{ width:100% !important; right:0 !important; left:0 !important; }
  .whatsapp-flotante{ bottom:18px !important; }
}


/* =========================================================
   FIX CHATBOT RESPONSIVE + CIERRE VISIBLE + RESULTADOS
   ========================================================= */
.jrs-chatbot{
  position: fixed !important;
  right: 18px !important;
  bottom: 18px !important;
  left: auto !important;
  top: auto !important;
  z-index: 999999 !important;
}
.jrs-chat-window{
  position: fixed !important;
  right: 18px !important;
  bottom: 105px !important;
  left: auto !important;
  top: auto !important;
  width: min(430px, calc(100vw - 36px)) !important;
  height: auto !important;
  max-height: calc(100vh - 128px) !important;
  display: flex !important;
  flex-direction: column !important;
  overflow: hidden !important;
  border-radius: 28px !important;
}
.jrs-chat-header{
  position: relative !important;
  flex: 0 0 auto !important;
  min-height: 74px !important;
  padding: 18px 62px 18px 22px !important;
}
.jrs-chat-close{
  position: absolute !important;
  top: 14px !important;
  right: 14px !important;
  width: 38px !important;
  height: 38px !important;
  min-width: 38px !important;
  min-height: 38px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  border-radius: 50% !important;
  background: rgba(255,255,255,.10) !important;
  color: #fff !important;
  font-size: 26px !important;
  line-height: 1 !important;
  z-index: 5 !important;
}
.jrs-chat-body{
  flex: 1 1 auto !important;
  min-height: 220px !important;
  max-height: none !important;
  overflow-y: auto !important;
  padding: 18px !important;
}
.jrs-chat-form{
  flex: 0 0 auto !important;
}
.jrs-chat-equipo-card{
  background: rgba(7,20,38,.06) !important;
  border-left: 4px solid #f4b321 !important;
  border-radius: 14px !important;
  padding: 10px 12px !important;
  margin: 8px 0 !important;
  color: #14233a !important;
}
.jrs-chat-equipo-card strong{ color:#071426 !important; }
.jrs-chat-equipo-card small{ color:#43546b !important; display:block; margin-top:3px; line-height:1.45; }
@media (max-width: 640px){
  .jrs-chatbot{
    right: 12px !important;
    bottom: 12px !important;
    left: 12px !important;
  }
  .jrs-chat-window{
    width: calc(100vw - 24px) !important;
    right: 12px !important;
    left: 12px !important;
    bottom: 92px !important;
    max-height: calc(100vh - 108px) !important;
  }
  .jrs-chat-header{ padding-right: 58px !important; }
}
@media (max-height: 620px){
  .jrs-chat-window{
    bottom: 84px !important;
    max-height: calc(100vh - 94px) !important;
  }
  .jrs-chat-header{ min-height: 60px !important; padding-top: 12px !important; padding-bottom: 12px !important; }
  .jrs-chat-body{ min-height: 150px !important; }
}

/* =========================================================
   CORRECCIÓN FINAL CHATBOT: botón flotante sin encimarse
   ========================================================= */
.jrs-chatbot{
  position: fixed !important;
  right: 26px !important;
  bottom: 112px !important;
  left: auto !important;
  z-index: 999999 !important;
}
.jrs-chat-toggle{
  width: 72px !important;
  height: 72px !important;
  border-radius: 50% !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
}
.jrs-chatbot.active .jrs-chat-toggle{
  display: none !important;
}
.whatsapp-flotante{
  position: fixed !important;
  right: 26px !important;
  bottom: 24px !important;
  width: 72px !important;
  height: 72px !important;
  border-radius: 50% !important;
  z-index: 999990 !important;
}
.jrs-chat-window{
  position: fixed !important;
  right: 26px !important;
  bottom: 24px !important;
  width: min(470px, calc(100vw - 52px)) !important;
  max-height: calc(100vh - 62px) !important;
  z-index: 1000000 !important;
}
.jrs-chat-close{
  opacity: 1 !important;
  visibility: visible !important;
  pointer-events: auto !important;
}
@media (max-width: 640px){
  .jrs-chatbot{
    right: 16px !important;
    bottom: 96px !important;
    left: auto !important;
  }
  .jrs-chat-toggle,
  .whatsapp-flotante{
    width: 64px !important;
    height: 64px !important;
  }
  .whatsapp-flotante{
    right: 16px !important;
    bottom: 18px !important;
  }
  .jrs-chat-window{
    right: 10px !important;
    left: 10px !important;
    bottom: 10px !important;
    width: auto !important;
    max-height: calc(100vh - 20px) !important;
  }
}


/* ==========================================================
   AJUSTE FINAL JRS - SERVICIOS CON IMÁGENES BIEN ACOMODADAS
   ========================================================== */
#servicios{
  background:linear-gradient(180deg,rgba(3,10,22,.96),rgba(7,20,38,.98)) !important;
}

#servicios .tarjeta-item{
  background:linear-gradient(180deg,#08172a 0%,#071426 100%) !important;
  border:1px solid rgba(245,184,32,.78) !important;
  overflow:hidden !important;
}

#servicios .tarjeta-imagen-wrapper{
  height:300px !important;
  min-height:300px !important;
  background:#071426 !important;
  overflow:hidden !important;
}

#servicios .tarjeta-imagen-wrapper img,
#servicios .tarjeta-item img{
  width:100% !important;
  height:100% !important;
  object-fit:cover !important;
  object-position:center center !important;
  transform:none !important;
  filter:saturate(1.08) contrast(1.04) brightness(.98) !important;
}

#servicios .tarjeta-contenido{
  background:linear-gradient(180deg,#071426,#0c213a) !important;
  color:#ffffff !important;
}

#servicios .tarjeta-contenido h3,
#servicios .tarjeta-item h3{
  color:#ffffff !important;
  opacity:1 !important;
  text-shadow:0 8px 24px rgba(0,0,0,.65) !important;
}

#servicios .tarjeta-contenido span{
  color:#f5b820 !important;
  opacity:1 !important;
}

#detalleServicio.detalle-dinamico-contenedor{
  background:linear-gradient(135deg,#071426 0%,#102846 100%) !important;
  border:1px solid rgba(245,184,32,.55) !important;
  overflow:hidden !important;
}

#detalleServicio .detalle-flex{
  display:grid !important;
  grid-template-columns:minmax(360px,.95fr) 1.05fr !important;
  gap:30px !important;
  align-items:center !important;
}

#detalleServicio .galeria-contenedor{
  background:linear-gradient(180deg,#050d18,#091a30) !important;
  border:1px solid rgba(245,184,32,.35) !important;
  border-radius:24px !important;
  overflow:hidden !important;
  min-height:360px !important;
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
}

#detalleServicio .imagen-principal{
  width:100% !important;
  height:auto !important;
  max-height:430px !important;
  min-height:0 !important;
  object-fit:contain !important;
  object-position:center center !important;
  border-radius:0 !important;
  display:block !important;
  background:#071426 !important;
}

#detalleServicio .detalle-info h3{
  color:#ffffff !important;
  opacity:1 !important;
  line-height:1.05 !important;
  margin-bottom:22px !important;
  text-shadow:0 12px 30px rgba(0,0,0,.65) !important;
}

#detalleServicio .tabla-tecnica td,
#detalleServicio .descripcion-texto,
#detalleServicio p,
#detalleServicio li{
  color:#eef6ff !important;
  opacity:1 !important;
}

@media(max-width:900px){
  #detalleServicio .detalle-flex{grid-template-columns:1fr !important;}
  #detalleServicio .galeria-contenedor{min-height:240px !important;}
  #detalleServicio .imagen-principal{max-height:320px !important;}
}

@media(max-width:720px){
  #servicios .tarjeta-imagen-wrapper{height:235px !important;min-height:235px !important;}
  #servicios .tarjeta-item{min-height:430px !important;}
}

/* ==========================================================
   CORRECCIÓN DEFINITIVA - IMÁGENES DE SERVICIOS SIN ZOOM
   Solo afecta la sección Servicios y el detalle dinámico.
   ========================================================== */
#servicios .tarjeta-imagen-wrapper{
  height: 300px !important;
  min-height: 300px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  background: #071426 !important;
  overflow: hidden !important;
}

#servicios .tarjeta-imagen-wrapper > img,
#servicios .tarjeta-item > img{
  width: 100% !important;
  height: 100% !important;
  object-fit: contain !important;
  object-position: center center !important;
  transform: none !important;
  background: #071426 !important;
}

#servicios .tarjeta-item:hover .tarjeta-imagen-wrapper > img,
#servicios .tarjeta-item:hover > img{
  transform: none !important;
}

#detalleServicio.detalle-dinamico-contenedor{
  overflow: visible !important;
}

#detalleServicio .detalle-flex{
  display: grid !important;
  grid-template-columns: minmax(320px, 520px) minmax(320px, 1fr) !important;
  gap: 32px !important;
  align-items: center !important;
}

#detalleServicio .galeria-contenedor{
  width: 100% !important;
  height: auto !important;
  min-height: 0 !important;
  aspect-ratio: 4 / 3 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  padding: 14px !important;
  background: #071426 !important;
  overflow: hidden !important;
  border-radius: 24px !important;
}

#detalleServicio img.imagen-principal,
#detalleServicio .imagen-principal{
  width: 100% !important;
  height: 100% !important;
  max-height: none !important;
  min-height: 0 !important;
  object-fit: contain !important;
  object-position: center center !important;
  display: block !important;
  border-radius: 18px !important;
  background: #071426 !important;
  transform: none !important;
}

@media (max-width: 900px){
  #detalleServicio .detalle-flex{
    grid-template-columns: 1fr !important;
  }
  #detalleServicio .galeria-contenedor{
    aspect-ratio: 16 / 10 !important;
  }
}

@media (max-width: 720px){
  #servicios .tarjeta-imagen-wrapper{
    height: 235px !important;
    min-height: 235px !important;
  }
}

/* ==========================================================
   JRS FIX FINAL - Servicios siempre visibles + modal premium
   ========================================================== */
#servicios{
  background: linear-gradient(180deg,#071426 0%,#0b1d35 45%,#081526 100%) !important;
  overflow: visible !important;
}
#servicios .grid-tarjetas{
  display:grid !important;
  grid-template-columns:repeat(4,minmax(230px,1fr)) !important;
  gap:24px !important;
  align-items:stretch !important;
  margin-bottom:0 !important;
}
#servicios .tarjeta-item{
  min-height:430px !important;
  height:auto !important;
  overflow:hidden !important;
  border-radius:26px !important;
  background:linear-gradient(180deg,#0a1b31,#071426) !important;
  border:1px solid rgba(244,179,33,.72) !important;
  cursor:pointer !important;
}
#servicios .tarjeta-imagen-wrapper{
  height:245px !important;
  min-height:245px !important;
  background:#06101f !important;
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  overflow:hidden !important;
}
#servicios .tarjeta-imagen-wrapper img,
#servicios .tarjeta-item img{
  width:100% !important;
  height:100% !important;
  object-fit:cover !important;
  object-position:center !important;
  transform:none !important;
  filter:saturate(1.05) contrast(1.04) brightness(.96) !important;
}
#servicios .tarjeta-contenido{
  position:relative !important;
  inset:auto !important;
  height:auto !important;
  min-height:170px !important;
  padding:46px 26px 28px !important;
  background:linear-gradient(180deg,#071426,#0c213b) !important;
  color:#fff !important;
}
#servicios .tarjeta-contenido h3,
#servicios .tarjeta-item h3{
  color:#fff !important;
  font-size:clamp(22px,2vw,31px) !important;
  line-height:1.08 !important;
  word-break:normal !important;
  overflow-wrap:normal !important;
  hyphens:none !important;
}
#servicios .tarjeta-contenido span{color:#f4b321 !important;}
#detalleServicio{display:none !important;}

.servicio-modal-jrs{
  position:fixed !important;
  inset:0 !important;
  z-index:99999 !important;
  display:none !important;
  align-items:center !important;
  justify-content:center !important;
  padding:24px !important;
}
.servicio-modal-jrs.activo{display:flex !important;}
.servicio-modal-backdrop{
  position:absolute !important;
  inset:0 !important;
  background:rgba(2,8,18,.78) !important;
  backdrop-filter:blur(10px) !important;
}
.servicio-modal-card{
  position:relative !important;
  z-index:1 !important;
  width:min(1120px,96vw) !important;
  max-height:90vh !important;
  display:grid !important;
  grid-template-columns:minmax(320px,.95fr) 1.05fr !important;
  overflow:hidden !important;
  border-radius:32px !important;
  background:linear-gradient(135deg,#071426,#102847) !important;
  border:1px solid rgba(244,179,33,.55) !important;
  box-shadow:0 40px 120px rgba(0,0,0,.58) !important;
}
.servicio-modal-close{
  position:absolute !important;
  top:18px !important;
  right:18px !important;
  z-index:5 !important;
  width:48px !important;
  height:48px !important;
  border-radius:50% !important;
  border:1px solid rgba(255,255,255,.22) !important;
  background:rgba(255,255,255,.12) !important;
  color:#fff !important;
  font-size:32px !important;
  cursor:pointer !important;
}
.servicio-modal-media{
  background:#06101f !important;
  min-height:520px !important;
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  border-right:1px solid rgba(244,179,33,.30) !important;
}
.servicio-modal-media img{
  width:100% !important;
  height:100% !important;
  object-fit:cover !important;
  object-position:center !important;
}
.servicio-modal-info{
  padding:54px 48px 44px !important;
  overflow:auto !important;
  color:#fff !important;
}
.servicio-modal-kicker{
  display:inline-block !important;
  color:#f4b321 !important;
  font-weight:900 !important;
  letter-spacing:3px !important;
  text-transform:uppercase !important;
  margin-bottom:14px !important;
}
.servicio-modal-info h3{
  color:#fff !important;
  font-size:clamp(34px,4vw,58px) !important;
  line-height:.95 !important;
  text-transform:uppercase !important;
  margin:0 0 26px !important;
}
.servicio-modal-lista{
  display:grid !important;
  gap:12px !important;
  margin:0 0 28px !important;
}
.servicio-modal-item{
  display:grid !important;
  grid-template-columns:42px 1fr !important;
  align-items:center !important;
  padding:16px 18px !important;
  border-radius:16px !important;
  background:rgba(255,255,255,.07) !important;
  border:1px solid rgba(255,255,255,.10) !important;
}
.servicio-modal-item span{color:#f4b321 !important;font-weight:900 !important;font-size:22px !important;}
.servicio-modal-item p{color:#eef6ff !important;margin:0 !important;font-weight:700 !important;line-height:1.35 !important;}
.servicio-modal-descripcion{
  color:#dce9f7 !important;
  line-height:1.75 !important;
  font-size:17px !important;
  padding:22px !important;
  border-left:5px solid #f4b321 !important;
  border-radius:18px !important;
  background:rgba(255,255,255,.07) !important;
}
.servicio-modal-actions{display:flex !important;gap:14px !important;flex-wrap:wrap !important;margin-top:22px !important;}
.btn-secundario-modal{
  border:1px solid rgba(244,179,33,.55) !important;
  color:#fff !important;
  background:rgba(255,255,255,.08) !important;
  border-radius:999px !important;
  padding:14px 22px !important;
  font-weight:900 !important;
  cursor:pointer !important;
}
body.modal-servicio-abierto{overflow:hidden !important;}
@media(max-width:1180px){
  #servicios .grid-tarjetas{grid-template-columns:repeat(2,minmax(240px,1fr)) !important;}
  .servicio-modal-card{grid-template-columns:1fr !important;overflow:auto !important;}
  .servicio-modal-media{min-height:320px !important;height:320px !important;border-right:0 !important;border-bottom:1px solid rgba(244,179,33,.30) !important;}
}
@media(max-width:720px){
  #servicios .grid-tarjetas{grid-template-columns:1fr !important;}
  #servicios .tarjeta-item{min-height:390px !important;}
  #servicios .tarjeta-imagen-wrapper{height:220px !important;min-height:220px !important;}
  .servicio-modal-jrs{padding:12px !important;align-items:flex-end !important;}
  .servicio-modal-card{width:100% !important;max-height:92vh !important;border-radius:24px 24px 0 0 !important;}
  .servicio-modal-info{padding:34px 24px 28px !important;}
  .servicio-modal-info h3{font-size:34px !important;}
}

/* ==========================================================
   JRS FIX: Servicios en modal compacto con scroll interno
   - No oculta las tarjetas de servicios
   - Muestra la información completa sin dejar espacios grandes
   - Imágenes sin zoom exagerado
   ========================================================== */
#servicios .grid-tarjetas,
#servicios .tarjeta-item{
  opacity:1 !important;
  visibility:visible !important;
  display:grid !important;
}

#detalleServicio.detalle-dinamico-contenedor{
  display:none !important;
  min-height:0 !important;
  height:0 !important;
  margin:0 !important;
  padding:0 !important;
  overflow:hidden !important;
}

body.modal-servicio-abierto{
  overflow:hidden !important;
}

.servicio-modal-jrs{
  position:fixed !important;
  inset:0 !important;
  z-index:999999 !important;
  display:none !important;
  align-items:center !important;
  justify-content:center !important;
  padding:22px !important;
}

.servicio-modal-jrs.activo{
  display:flex !important;
}

.servicio-modal-backdrop{
  position:absolute !important;
  inset:0 !important;
  background:rgba(2,8,20,.84) !important;
  backdrop-filter:blur(12px) !important;
}

.servicio-modal-card{
  position:relative !important;
  width:min(1180px,96vw) !important;
  max-height:88vh !important;
  min-height:0 !important;
  display:grid !important;
  grid-template-columns:minmax(320px,.88fr) minmax(420px,1.12fr) !important;
  overflow:hidden !important;
  border-radius:30px !important;
  background:linear-gradient(135deg,#07111f 0%,#0b1f3b 52%,#16315b 100%) !important;
  border:1px solid rgba(244,179,33,.45) !important;
  box-shadow:0 35px 90px rgba(0,0,0,.62) !important;
  color:#fff !important;
}

.servicio-modal-close{
  position:absolute !important;
  top:16px !important;
  right:16px !important;
  z-index:5 !important;
  width:46px !important;
  height:46px !important;
  border-radius:50% !important;
  border:1px solid rgba(255,255,255,.24) !important;
  background:rgba(255,255,255,.13) !important;
  color:#fff !important;
  font-size:30px !important;
  line-height:1 !important;
  cursor:pointer !important;
}

.servicio-modal-close:hover{
  background:#f4b321 !important;
  color:#07111f !important;
}

.servicio-modal-media{
  height:100% !important;
  min-height:0 !important;
  max-height:88vh !important;
  padding:18px !important;
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  background:radial-gradient(circle at 50% 12%,rgba(244,179,33,.14),transparent 38%),#06101f !important;
  border-right:1px solid rgba(244,179,33,.28) !important;
}

.servicio-modal-media img{
  width:100% !important;
  height:auto !important;
  max-height:calc(88vh - 36px) !important;
  object-fit:contain !important;
  object-position:center !important;
  border-radius:22px !important;
  border:1px solid rgba(244,179,33,.35) !important;
  background:#07111f !important;
  box-shadow:0 22px 55px rgba(0,0,0,.38) !important;
}

.servicio-modal-info{
  min-height:0 !important;
  max-height:88vh !important;
  overflow-y:auto !important;
  padding:42px 46px 34px !important;
  scrollbar-width:thin !important;
  scrollbar-color:#f4b321 rgba(255,255,255,.10) !important;
}

.servicio-modal-info::-webkit-scrollbar{
  width:10px !important;
}
.servicio-modal-info::-webkit-scrollbar-track{
  background:rgba(255,255,255,.08) !important;
  border-radius:20px !important;
}
.servicio-modal-info::-webkit-scrollbar-thumb{
  background:#f4b321 !important;
  border-radius:20px !important;
}

.servicio-modal-kicker{
  display:inline-flex !important;
  align-items:center !important;
  gap:10px !important;
  color:#f4b321 !important;
  font-size:12px !important;
  font-weight:900 !important;
  letter-spacing:.18em !important;
  text-transform:uppercase !important;
  margin:0 0 12px !important;
}

.servicio-modal-info h3{
  margin:0 56px 20px 0 !important;
  color:#fff !important;
  font-size:clamp(30px,4vw,56px) !important;
  line-height:.95 !important;
  letter-spacing:-.03em !important;
  text-transform:uppercase !important;
}

.servicio-modal-lista{
  display:grid !important;
  grid-template-columns:1fr !important;
  gap:10px !important;
  margin:0 0 18px !important;
  max-height:36vh !important;
  overflow-y:auto !important;
  padding-right:6px !important;
}

.servicio-modal-lista::-webkit-scrollbar{
  width:8px !important;
}
.servicio-modal-lista::-webkit-scrollbar-thumb{
  background:#f4b321 !important;
  border-radius:20px !important;
}

.servicio-modal-item{
  display:grid !important;
  grid-template-columns:32px 1fr !important;
  align-items:flex-start !important;
  gap:12px !important;
  padding:12px 14px !important;
  border-radius:16px !important;
  background:rgba(255,255,255,.075) !important;
  border:1px solid rgba(255,255,255,.10) !important;
}

.servicio-modal-item span{
  color:#f4b321 !important;
  font-weight:900 !important;
  font-size:20px !important;
  line-height:1.2 !important;
}

.servicio-modal-item p{
  color:#eef6ff !important;
  margin:0 !important;
  font-weight:750 !important;
  font-size:15.5px !important;
  line-height:1.38 !important;
}

.servicio-modal-descripcion{
  margin:16px 0 0 !important;
  color:#dce8f7 !important;
  font-size:16px !important;
  line-height:1.65 !important;
  background:rgba(255,255,255,.07) !important;
  border-left:5px solid #f4b321 !important;
  border-radius:18px !important;
  padding:18px 20px !important;
}

.servicio-modal-actions{
  display:flex !important;
  gap:14px !important;
  flex-wrap:wrap !important;
  margin-top:20px !important;
}

.btn-secundario-modal{
  border:1px solid rgba(244,179,33,.55) !important;
  background:transparent !important;
  color:#fff !important;
  padding:14px 20px !important;
  border-radius:16px !important;
  font-weight:900 !important;
  cursor:pointer !important;
}

@media(max-width:920px){
  .servicio-modal-jrs{padding:12px !important;align-items:flex-end !important;}
  .servicio-modal-card{
    width:100% !important;
    max-height:92vh !important;
    grid-template-columns:1fr !important;
    border-radius:24px 24px 0 0 !important;
  }
  .servicio-modal-media{
    height:240px !important;
    max-height:240px !important;
    border-right:0 !important;
    border-bottom:1px solid rgba(244,179,33,.28) !important;
  }
  .servicio-modal-media img{
    max-height:204px !important;
  }
  .servicio-modal-info{
    max-height:calc(92vh - 240px) !important;
    padding:28px 22px 26px !important;
  }
  .servicio-modal-lista{
    max-height:28vh !important;
  }
  .servicio-modal-info h3{font-size:32px !important;margin-right:54px !important;}
}

/* ========================================================================== 
   FORMULARIO DE COTIZACIÓN EN FOOTER
   ========================================================================== */
.footer-columnas{
    grid-template-columns:minmax(0,1.35fr) minmax(330px,.75fr) !important;
    gap:42px !important;
}
.footer-formulario-area{
    max-width:none !important;
}
.footer-form-kicker{
    display:inline-flex;
    margin-bottom:10px;
    color:#F4B321;
    font-size:12px;
    font-weight:900;
    letter-spacing:2.2px;
    text-transform:uppercase;
}
.footer-formulario-area > p{
    max-width:780px;
    margin-bottom:26px;
}
.formulario-cotizacion{
    padding:28px;
    background:rgba(255,255,255,.045);
    border:1px solid rgba(244,179,33,.28);
    border-radius:26px;
    box-shadow:0 22px 60px rgba(0,0,0,.28);
}
.form-grid-doble{
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:17px;
}
.campo-formulario{
    display:flex;
    flex-direction:column;
    gap:8px;
}
.campo-formulario-completo{
    margin-top:17px;
}
.campo-formulario label{
    color:#F8FAFC;
    font-size:13px;
    font-weight:800;
}
.campo-formulario input,
.campo-formulario select,
.campo-formulario textarea{
    width:100%;
    min-height:50px;
    padding:13px 15px;
    color:#F8FAFC;
    background:#09111F;
    border:1px solid rgba(168,184,216,.26);
    border-radius:13px;
    outline:none;
    font:inherit;
    transition:border-color .2s ease, box-shadow .2s ease, background .2s ease;
}
.campo-formulario textarea{
    min-height:125px;
    resize:vertical;
}
.campo-formulario select{
    cursor:pointer;
}
.campo-formulario select option{
    color:#071426;
    background:#FFFFFF;
}
.campo-formulario input::placeholder,
.campo-formulario textarea::placeholder{
    color:#7F8DA8;
}
.campo-formulario input:focus,
.campo-formulario select:focus,
.campo-formulario textarea:focus{
    border-color:#F4B321;
    box-shadow:0 0 0 4px rgba(244,179,33,.12);
    background:#0C1728;
}
.aceptacion-privacidad{
    display:flex;
    align-items:flex-start;
    gap:10px;
    margin:18px 0;
    color:#B9C7DD;
    font-size:12px;
    line-height:1.55;
    cursor:pointer;
}
.aceptacion-privacidad input{
    width:17px;
    height:17px;
    margin-top:1px;
    accent-color:#F4B321;
    flex:0 0 auto;
}
.btn-enviar-cotizacion{
    width:100%;
    min-height:54px;
    display:flex;
    align-items:center;
    justify-content:center;
    gap:12px;
    padding:14px 22px;
    color:#071426;
    background:linear-gradient(135deg,#F4B321,#FFD567);
    border:0;
    border-radius:14px;
    font-weight:950;
    font-size:15px;
    letter-spacing:.5px;
    text-transform:uppercase;
    cursor:pointer;
    box-shadow:0 14px 32px rgba(244,179,33,.22);
    transition:transform .2s ease, box-shadow .2s ease;
}
.btn-enviar-cotizacion:hover{
    transform:translateY(-2px);
    box-shadow:0 18px 38px rgba(244,179,33,.32);
}
.form-nota{
    margin:12px 0 0 !important;
    color:#7F8DA8 !important;
    font-size:11px !important;
    line-height:1.4 !important;
}
.campo-trampa{
    position:absolute !important;
    left:-9999px !important;
    width:1px !important;
    height:1px !important;
    opacity:0 !important;
    pointer-events:none !important;
}
@media(max-width:1050px){
    .footer-columnas{
        grid-template-columns:1fr !important;
    }
}
@media(max-width:650px){
    .footer-principal{
        padding-left:18px !important;
        padding-right:18px !important;
    }
    .form-grid-doble{
        grid-template-columns:1fr;
    }
    .formulario-cotizacion{
        padding:20px;
        border-radius:20px;
    }
    .footer-formulario-area,
    .footer-formulario-area > p{
        text-align:left !important;
    }
}


/* ========================================================================== 
   AJUSTES FINALES: RESPONSIVE, FOOTER SIN FORMULARIO Y CHAT ALINEADO
   ========================================================================== */
.footer-formulario-area {
    display: flex;
    flex-direction: column;
    justify-content: center;
    min-width: 0;
}
.footer-acciones-directas {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
    margin-top: 24px;
}
.footer-btn-whatsapp,
.footer-btn-correo {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 48px;
    padding: 12px 20px;
    border-radius: 999px;
    text-decoration: none;
    font-weight: 800;
    text-align: center;
}
.footer-btn-whatsapp { background: #25D366; color: #07130b; }
.footer-btn-correo { border: 1px solid rgba(229,178,45,.55); color: #fff; }

.jrs-chat-toggle {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    padding: 0 !important;
    line-height: 1 !important;
}
.jrs-chat-icon {
    position: relative;
    display: block;
    width: 29px;
    height: 22px;
    border: 3px solid #fff;
    border-radius: 50%;
    transform: none !important;
}
.jrs-chat-icon::after {
    content: "";
    position: absolute;
    left: 2px;
    bottom: -7px;
    width: 10px;
    height: 10px;
    background: linear-gradient(135deg, transparent 50%, #fff 51%);
    transform: rotate(12deg);
}
.jrs-chat-pulse { pointer-events: none; }

/* Protección general contra desbordamientos en cualquier pantalla */
html, body { width: 100%; max-width: 100%; overflow-x: clip; }
main, section, footer, header, nav, .contenedor-global, .nav-contenedor { min-width: 0; }
h1, h2, h3, h4, p, a, span, small { overflow-wrap: anywhere; }
iframe, video, canvas, svg { max-width: 100%; }

@media (max-width: 1200px) {
    .nav-contenedor, .contenedor-global, .footer-contenido { width: min(94%, 1100px); }
    .nav-menu { gap: 14px; }
    .nav-menu a { font-size: 11px; }
}

@media (max-width: 900px) {
    .navbar { padding: 10px 0; }
    .nav-contenedor { flex-wrap: wrap; gap: 10px; }
    .nav-logo-imagen { max-width: 145px; }
    .menu-toggle { display: block; margin-left: auto; }
    .nav-menu {
        position: fixed;
        inset: 76px 12px auto 12px;
        display: none;
        flex-direction: column;
        align-items: stretch;
        gap: 4px;
        padding: 16px;
        max-height: calc(100dvh - 92px);
        overflow-y: auto;
        background: rgba(11,15,25,.98);
        border: 1px solid rgba(229,178,45,.25);
        border-radius: 18px;
        box-shadow: 0 24px 60px rgba(0,0,0,.35);
    }
    .nav-menu.active, .nav-menu.open { display: flex; }
    .nav-menu a { padding: 13px 14px; font-size: 13px; }
    .nav-menu .nav-cta { text-align: center; }
    .hero-header { min-height: 720px; min-height: 100svh; }
    .hero-content { width: min(92%, 720px); }
    .hero-content h1 { font-size: clamp(42px, 11vw, 78px) !important; line-height: .95 !important; }
    .footer-columnas { grid-template-columns: 1fr !important; }
}

@media (max-width: 640px) {
    .contenedor-global { width: 92%; padding: 70px 0 40px; }
    .seccion-bloque { margin-bottom: 72px; }
    .titulo-central { font-size: clamp(27px, 9vw, 38px); margin-bottom: 34px; }
    .hero-header { background-position: 60% center; }
    .hero-overlay { padding-top: 110px; }
    .hero-etiqueta { font-size: 10px; letter-spacing: 1.3px; padding: 9px 12px; }
    .hero-content h1 { font-size: clamp(38px, 13vw, 58px) !important; }
    .hero-content .subtitulo { font-size: 16px; }
    .hero-actions { width: 100%; flex-direction: column; }
    .hero-actions a { width: 100%; }
    .stat-contenedor { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; }
    .mision-vision-grid, .servicios-grid, .catalogo-grid, .proyectos-grid { grid-template-columns: 1fr !important; }
    .footer-principal { padding-left: 0; padding-right: 0; }
    .footer-contenido { width: 92%; }
    .footer-acciones-directas { flex-direction: column; }
    .footer-btn-whatsapp, .footer-btn-correo { width: 100%; }
    .whatsapp-flotante { right: 14px !important; bottom: 18px !important; width: 58px !important; height: 58px !important; }
    .jrs-chatbot { right: 14px !important; bottom: 88px !important; }
    .jrs-chat-window {
        position: fixed;
        left: 10px;
        right: 10px;
        bottom: 158px;
        width: auto;
        max-height: calc(100dvh - 180px);
        border-radius: 20px;
    }
    .jrs-chat-body { max-height: calc(100dvh - 330px); }
    .jrs-chat-form { gap: 7px; }
    .jrs-chat-form button { padding: 0 12px; }
}

@media (max-width: 390px) {
    .stat-contenedor { grid-template-columns: 1fr !important; }
    .nav-logo-imagen { max-width: 118px; }
    .jrs-chat-form { flex-direction: column; }
    .jrs-chat-form button { min-height: 42px; }
    .jrs-chat-body { max-height: calc(100dvh - 365px); }
}

/* PROYECTOS: galería ampliable y presentación de mayor calidad */
.proyecto-modal-gallery .proyecto-gallery-item{
    position:relative;
    display:block;
    width:100%;
    padding:0;
    border:0;
    border-radius:20px;
    overflow:hidden;
    background:#0f172a;
    cursor:zoom-in;
    box-shadow:0 14px 28px rgba(0,0,0,.28);
    transition:transform .25s ease, box-shadow .25s ease;
}
.proyecto-modal-gallery .proyecto-gallery-item:hover,
.proyecto-modal-gallery .proyecto-gallery-item:focus-visible{
    transform:translateY(-5px) scale(1.02);
    box-shadow:0 22px 42px rgba(0,0,0,.4);
    outline:3px solid rgba(246,189,36,.55);
    outline-offset:2px;
}
.proyecto-modal-gallery .proyecto-gallery-item img{
    display:block;
    width:100%;
    height:190px;
    object-fit:cover;
    border:2px solid rgba(246,189,36,.58);
    border-radius:20px;
    filter:contrast(1.04) saturate(1.04);
    transition:transform .35s ease, filter .35s ease;
}
.proyecto-modal-gallery .proyecto-gallery-item:hover img{
    transform:scale(1.045);
    filter:contrast(1.08) saturate(1.07);
}
.proyecto-gallery-zoom{
    position:absolute;
    right:12px;
    bottom:12px;
    width:38px;
    height:38px;
    display:grid;
    place-items:center;
    border-radius:50%;
    background:rgba(7,17,31,.82);
    border:1px solid rgba(246,189,36,.8);
    color:#f6bd24;
    font-size:24px;
    font-weight:900;
    box-shadow:0 8px 20px rgba(0,0,0,.35);
    pointer-events:none;
}
.jrs-image-viewer{z-index:100005!important;}
.jrs-image-box{background:#07111f!important;border:1px solid rgba(246,189,36,.55)!important;}
.jrs-image-box img{padding:10px!important;image-rendering:auto;}
.jrs-image-caption{background:linear-gradient(180deg,transparent,rgba(0,0,0,.82))!important;color:#fff!important;}
@media(max-width:900px){.proyecto-modal-gallery .proyecto-gallery-item img{height:175px;}}
@media(max-width:560px){.proyecto-modal-gallery .proyecto-gallery-item img{height:220px;}.jrs-image-viewer{padding:10px!important}.jrs-image-box{height:min(84vh,760px)!important;border-radius:18px!important}}


/* ISO 9001: sello y leyenda corporativa */
.nav-iso-wrap{display:flex;align-items:center;gap:10px;min-width:0;}
.nav-iso-wrap .nav-logo{flex:0 0 auto;}
.nav-iso-text{max-width:190px;color:#cbd5e1;font-size:10px;line-height:1.25;font-weight:600;letter-spacing:.01em;}

/* Enlaces de equipos dentro del Asistente JRS */
.jrs-chat-equipo-link,.jrs-chat-inline-equipo{appearance:none;border:0;background:none;padding:0;color:#071426;font:inherit;font-weight:800;text-align:left;cursor:pointer;text-decoration:underline;text-decoration-color:#f2b91f;text-decoration-thickness:2px;text-underline-offset:3px;}
.jrs-chat-equipo-link{display:block;width:100%;font-size:1rem;line-height:1.35;}
.jrs-chat-equipo-link:hover,.jrs-chat-inline-equipo:hover{color:#a66d00;}
.jrs-chat-equipo-link:focus-visible,.jrs-chat-inline-equipo:focus-visible{outline:3px solid rgba(242,185,31,.45);outline-offset:3px;border-radius:4px;}
.jrs-chat-open-hint{display:block;margin-top:7px;color:#8a6100;font-size:.76rem;font-weight:700;}
.jrs-chat-inline-equipo{display:inline;font-size:inherit;}

@media (max-width: 1050px){
  .nav-iso-text{display:none;}
}

/* =========================================================
   JRS PROFESSIONAL RESPONSIVE SYSTEM — 2026
   Mobile-first refinements, accessibility and visual polish
   ========================================================= */
:root{
  --jrs-navy:#071426;
  --jrs-navy-2:#0b1f38;
  --jrs-card:#10243e;
  --jrs-gold:#f6bd24;
  --jrs-gold-2:#ffd660;
  --jrs-text:#f8fafc;
  --jrs-muted:#b9c5d6;
  --jrs-line:rgba(246,189,36,.28);
  --jrs-shadow:0 18px 50px rgba(0,0,0,.28);
  --jrs-radius:24px;
  --jrs-container:min(1440px, calc(100% - 40px));
}
html{scroll-behavior:smooth;scroll-padding-top:112px;overflow-x:hidden}
body{overflow-x:hidden;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;background:#050b13}
*,*::before,*::after{box-sizing:border-box}
img,svg,video,canvas{max-width:100%;height:auto}
button,input,textarea,select{font:inherit}
a,button{-webkit-tap-highlight-color:transparent}
:focus-visible{outline:3px solid rgba(246,189,36,.72);outline-offset:4px}
.skip-link{position:fixed;left:16px;top:12px;z-index:200000;transform:translateY(-160%);background:var(--jrs-gold);color:#071426;padding:12px 18px;border-radius:12px;font-weight:800;text-decoration:none;transition:transform .2s ease}
.skip-link:focus{transform:translateY(0)}

.navbar{backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px);background:rgba(5,15,29,.94);border-bottom:1px solid rgba(246,189,36,.24)}
.nav-contenedor{width:var(--jrs-container);margin-inline:auto;gap:20px}
.nav-logo-imagen img{object-fit:contain}
.nav-menu a{position:relative;white-space:nowrap}
.nav-menu a:not(.nav-cta)::after{content:"";position:absolute;left:50%;right:50%;bottom:-8px;height:2px;background:var(--jrs-gold);transition:left .2s ease,right .2s ease}
.nav-menu a:not(.nav-cta):hover::after,.nav-menu a:not(.nav-cta):focus-visible::after{left:0;right:0}
.nav-cta{box-shadow:0 10px 30px rgba(246,189,36,.2)}
.nav-backdrop{display:none;position:fixed;inset:0;z-index:998;border:0;background:rgba(0,0,0,.58);backdrop-filter:blur(4px)}
.nav-backdrop.active{display:block}

.hero-header{min-height:clamp(650px,88svh,980px);background-position:center;background-size:cover}
.hero-overlay{min-height:inherit;display:flex;align-items:center}
.hero-content{width:var(--jrs-container);margin-inline:auto;padding:clamp(130px,14vw,190px) 0 80px}
.hero-content h1{font-size:clamp(2.65rem,7.3vw,7.25rem);line-height:.9;max-width:1200px;letter-spacing:-.055em;text-wrap:balance}
.hero-content .subtitulo{font-size:clamp(1.08rem,2.2vw,1.7rem);max-width:800px;line-height:1.5}
.hero-content .slogan{font-size:clamp(.98rem,1.6vw,1.35rem);max-width:760px}
.hero-actions{display:flex;flex-wrap:wrap;gap:16px;margin-top:34px}
.btn-principal,.btn-secundario{min-height:54px;display:inline-flex;align-items:center;justify-content:center;padding:14px 28px;border-radius:16px;font-size:.98rem;transition:transform .22s ease,box-shadow .22s ease,background .22s ease}
.btn-principal:hover,.btn-secundario:hover{transform:translateY(-3px)}

.contenedor-global,.stat-contenedor{width:var(--jrs-container);margin-inline:auto}
.seccion-bloque{padding-block:clamp(76px,9vw,140px)}
.titulo-central{font-size:clamp(2.25rem,5.5vw,5rem);line-height:.96;letter-spacing:-.045em;text-wrap:balance}
.section-kicker{font-size:clamp(.72rem,1vw,.92rem);letter-spacing:.22em}
.grid-tarjetas{gap:clamp(18px,2vw,30px)}
.tarjeta-item,.corporativo-card,.stat-card{transform:translateZ(0)}
.tarjeta-item{border-radius:var(--jrs-radius);overflow:hidden;box-shadow:0 12px 35px rgba(0,0,0,.2);transition:transform .28s ease,box-shadow .28s ease,border-color .28s ease}
.tarjeta-item:hover{transform:translateY(-8px);box-shadow:var(--jrs-shadow)}
.tarjeta-imagen-wrapper{aspect-ratio:16/10;overflow:hidden}
.tarjeta-imagen-wrapper img{width:100%;height:100%;object-fit:cover;transition:transform .45s ease,filter .45s ease}
.tarjeta-item:hover img{transform:scale(1.055);filter:saturate(1.06) contrast(1.04)}

.seccion-estadisticas{position:relative;z-index:2}
.stat-contenedor{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:18px}
.stat-card{min-width:0}
.stat-numero{font-size:clamp(2.4rem,4vw,4.7rem)}

/* Professional modal sizing */
.modal-contenido,.proyecto-modal-card{width:min(1500px,calc(100vw - 48px));max-height:calc(100dvh - 48px);border-radius:28px}
.proyecto-modal-gallery{grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}

/* Chat remains usable on every screen */
.jrs-chat-panel{width:min(560px,calc(100vw - 32px));max-height:min(760px,calc(100dvh - 32px));right:16px;bottom:16px;border-radius:28px;overflow:hidden;box-shadow:0 28px 75px rgba(0,0,0,.42)}
.jrs-chat-body{overscroll-behavior:contain}
.jrs-chat-launcher{display:grid;place-items:center;line-height:1;transform:none!important}
.jrs-chat-launcher>*{transform:none!important;margin:0!important}

@media (max-width:1180px){
  :root{--jrs-container:min(100% - 32px,1100px)}
  .nav-iso-wrap{margin-right:auto}
  .menu-toggle{display:flex;z-index:1001}
  .nav-menu{position:fixed;top:0;right:0;z-index:1000;width:min(390px,88vw);height:100dvh;padding:110px 28px 32px;display:flex;flex-direction:column;align-items:stretch;gap:8px;background:linear-gradient(160deg,#071426,#0d2745);box-shadow:-25px 0 65px rgba(0,0,0,.42);transform:translateX(105%);visibility:hidden;transition:transform .28s ease,visibility .28s}
  .nav-menu.active{transform:translateX(0);visibility:visible}
  .nav-menu a{font-size:1.05rem;padding:15px 14px;border-bottom:1px solid rgba(255,255,255,.08)}
  .nav-menu .nav-cta{margin-top:14px;border-bottom:0;text-align:center}
  .nav-menu a::after{display:none}
  .stat-contenedor{grid-template-columns:repeat(2,minmax(0,1fr))}
  .proyecto-modal-gallery{grid-template-columns:repeat(2,minmax(0,1fr))}
}

@media (max-width:760px){
  :root{--jrs-container:calc(100% - 24px);--jrs-radius:19px}
  html{scroll-padding-top:86px}
  .navbar{min-height:76px}
  .nav-contenedor{min-height:76px;gap:10px}
  .nav-logo-imagen{max-width:132px;padding:8px 10px;border-radius:14px}
  .nav-logo-iso{max-width:76px}
  .nav-iso-text{display:none}
  .hero-header{min-height:760px;background-position:60% center}
  .hero-overlay{background:linear-gradient(90deg,rgba(3,10,20,.96) 0%,rgba(3,10,20,.75) 68%,rgba(3,10,20,.42) 100%)}
  .hero-content{padding-top:135px;padding-bottom:64px}
  .hero-content h1{font-size:clamp(3rem,14vw,5.2rem);line-height:.9;overflow-wrap:anywhere}
  .hero-etiqueta{font-size:.7rem;line-height:1.4;padding:10px 14px;max-width:100%}
  .hero-actions{display:grid;grid-template-columns:1fr;max-width:520px}
  .btn-principal,.btn-secundario{width:100%}
  .seccion-bloque{padding-block:72px}
  .titulo-central{font-size:clamp(2.4rem,12vw,4.2rem)}
  .stat-contenedor{grid-template-columns:1fr 1fr;gap:12px}
  .stat-card{padding:22px 14px;min-height:150px}
  .grid-tarjetas,.catalogo-grid,.mision-vision-grid{grid-template-columns:1fr!important}
  .tarjeta-imagen-wrapper{aspect-ratio:16/9}
  .modal-contenido,.proyecto-modal-card{width:calc(100vw - 16px);max-height:calc(100dvh - 16px);border-radius:20px}
  .proyecto-modal-gallery{grid-template-columns:1fr}
  .proyecto-modal-gallery .proyecto-gallery-item img{height:auto;aspect-ratio:4/3}
  .jrs-chat-panel{inset:8px;width:auto;height:calc(100dvh - 16px);max-height:none;border-radius:22px}
  .jrs-chat-body{max-height:none;flex:1}
  .jrs-chat-form{padding:10px;gap:8px}
  .jrs-chat-form input{min-width:0}
}

@media (max-width:430px){
  .nav-logo-imagen{max-width:112px}
  .nav-logo-iso{max-width:60px}
  .menu-toggle{width:44px;height:44px}
  .hero-content h1{font-size:clamp(2.65rem,14vw,4rem)}
  .stat-contenedor{grid-template-columns:1fr}
  .stat-card{min-height:130px}
  .jrs-chat-form{flex-direction:row}
  .jrs-chat-form button{min-width:86px;padding-inline:12px}
}

@media (min-width:1800px){
  :root{--jrs-container:min(1600px,calc(100% - 96px))}
  .nav-contenedor{min-height:118px}
  .hero-content h1{max-width:1420px}
}

@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{scroll-behavior:auto!important;animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}
}
@media (max-width:1180px){
  .nav-menu.show{transform:translateX(0);visibility:visible}
}

/* Nombre corporativo: evita cortes dentro de palabras */
.hero-company-name{display:flex!important;flex-direction:column!important;align-items:flex-start!important;max-width:1000px!important;overflow-wrap:normal!important;word-break:keep-all!important;hyphens:none!important}
.hero-company-name span{display:block!important;white-space:nowrap!important;overflow-wrap:normal!important;word-break:keep-all!important}
@media(max-width:760px){
  .hero-company-name{font-size:clamp(2.5rem,12vw,4.2rem)!important;letter-spacing:-.045em!important}
  .hero-company-name span{white-space:normal!important;word-break:normal!important}
}

/* =========================================================
   FORMULARIO DE REGISTRO / COTIZACIÓN JRS
   ========================================================= */

.form-registro-jrs {
    width: 100%;
    max-width: 1050px;
    margin: 35px auto 0;
    padding: 35px;
    background: rgba(7, 20, 38, 0.92);
    border: 1px solid rgba(247, 188, 47, 0.4);
    border-radius: 24px;
    box-shadow: 0 24px 60px rgba(0, 0, 0, 0.25);
}

.form-registro-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 20px;
}

.form-registro-campo {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.form-registro-campo label {
    color: #ffffff;
    font-size: 0.92rem;
    font-weight: 600;
}

.form-registro-campo input,
.form-registro-campo select,
.form-registro-campo textarea {
    width: 100%;
    min-height: 52px;
    padding: 14px 16px;
    border: 1px solid rgba(255, 255, 255, 0.16);
    border-radius: 12px;
    outline: none;
    background: #ffffff;
    color: #0b1628;
    font-family: "Poppins", sans-serif;
    font-size: 0.95rem;
    transition:
        border-color 0.2s ease,
        box-shadow 0.2s ease,
        transform 0.2s ease;
}

.form-registro-campo textarea {
    min-height: 130px;
    resize: vertical;
}

.form-registro-campo input:focus,
.form-registro-campo select:focus,
.form-registro-campo textarea:focus {
    border-color: #f7bc2f;
    box-shadow: 0 0 0 4px rgba(247, 188, 47, 0.14);
}

.form-registro-completo {
    grid-column: 1 / -1;
}

.btn-registro-enviar {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 220px;
    margin-top: 25px;
    cursor: pointer;
    border: none;
}

.btn-registro-enviar:disabled {
    opacity: 0.55;
    cursor: not-allowed;
}

.mensaje-registro {
    min-height: 28px;
    margin-top: 16px;
    font-size: 0.95rem;
    font-weight: 600;
    color: #ffffff;
}

.mensaje-registro.correcto {
    color: #54d887;
}

.mensaje-registro.error {
    color: #ff7777;
}

/* TABLETS */
@media (max-width: 900px) {
    .form-registro-jrs {
        padding: 28px;
    }
}

/* CELULARES */
@media (max-width: 680px) {
    .form-registro-jrs {
        padding: 22px 18px;
        border-radius: 18px;
    }

    .form-registro-grid {
        grid-template-columns: 1fr;
        gap: 16px;
    }

    .form-registro-completo {
        grid-column: auto;
    }

    .btn-registro-enviar {
        width: 100%;
    }
}

/* =========================================================
   FIX RESPONSIVE GENERAL JRS
   ========================================================= */

html,
body {
    width: 100%;
    max-width: 100%;
    overflow-x: hidden;
}

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

/* HEADER / NAVBAR */
.navbar,
header {
    max-width: 100%;
}

.nav-container,
.navbar .container,
.header-container {
    width: min(1200px, calc(100% - 32px));
    margin: 0 auto;
}

.nav-menu {
    flex-wrap: wrap;
}

/* HERO */
.hero,
.hero-section,
.inicio {
    width: 100%;
    max-width: 100%;
    overflow: hidden;
}

.hero-content,
.hero .container,
.hero-text,
.hero-info {
    width: min(1200px, calc(100% - 40px));
    max-width: 100%;
    margin-left: auto;
    margin-right: auto;
}

/* Evita que los títulos gigantes rompan la pantalla */
.hero h1,
.hero-title,
.inicio h1 {
    font-size: clamp(2.4rem, 7vw, 6.5rem);
    line-height: 0.95;
    max-width: 100%;
    overflow-wrap: break-word;
    word-break: normal;
}

.hero h2,
.hero-subtitle {
    font-size: clamp(1.2rem, 3vw, 2.1rem);
}

/* =========================================================
   TABLETS
   ========================================================= */

@media (max-width: 1024px) {

    .navbar,
    header {
        padding-left: 16px;
        padding-right: 16px;
    }

    .nav-menu {
        gap: 14px;
    }

    .nav-menu a {
        font-size: 0.85rem;
    }

    .hero-content,
    .hero-text,
    .hero-info {
        width: calc(100% - 32px);
    }

    .hero h1,
    .hero-title,
    .inicio h1 {
        font-size: clamp(3rem, 8vw, 5.5rem);
    }
}

/* =========================================================
   CELULAR
   ========================================================= */

@media (max-width: 768px) {

    .navbar,
    header {
        min-height: auto;
    }

    .nav-container,
    .navbar .container,
    .header-container {
        width: calc(100% - 20px);
    }

    .hero-content,
    .hero-text,
    .hero-info {
        width: calc(100% - 24px);
        text-align: left;
    }

    .hero h1,
    .hero-title,
    .inicio h1 {
        font-size: clamp(2.4rem, 12vw, 4.4rem);
        line-height: 0.95;
    }

    .hero h2,
    .hero-subtitle {
        font-size: clamp(1.1rem, 5vw, 1.6rem);
    }

    section {
        max-width: 100%;
        overflow-x: hidden;
    }
}

/* =========================================================
   CELULARES PEQUEÑOS
   ========================================================= */

@media (max-width: 480px) {

    .hero h1,
    .hero-title,
    .inicio h1 {
        font-size: clamp(2.1rem, 13vw, 3.5rem);
    }

    .hero-content,
    .hero-text,
    .hero-info {
        width: calc(100% - 18px);
    }

    .btn-principal,
    .btn-secundario,
    .hero a,
    .hero button {
        max-width: 100%;
    }
}

/* =========================================================
   HEADER COMPACTO JRS
   ========================================================= */

.navbar {
    padding: 6px 0 !important;
}

.nav-contenedor {
    min-height: 86px !important;
    gap: 18px !important;
    align-items: center !important;
}

.nav-logo-imagen,
.nav-logo {
    max-width: 190px !important;
}

.nav-logo-imagen img,
.nav-logo img {
    max-width: 180px !important;
    max-height: 58px !important;
}

.nav-iso-wrap {
    display: flex !important;
    align-items: center !important;
    gap: 12px !important;
}

.nav-logo-iso {
    max-width: 62px !important;
    max-height: 52px !important;
}

.nav-iso-text {
    max-width: 145px !important;
    font-size: 9px !important;
    line-height: 1.15 !important;
}

.nav-menu {
    gap: 18px !important;
    flex-wrap: nowrap !important;
}

.nav-menu a {
    font-size: 11px !important;
}

.nav-menu .nav-cta {
    padding: 13px 26px !important;
}

/* Laptop */
@media (max-width: 1180px) {

    .nav-contenedor {
        min-height: 76px !important;
        gap: 12px !important;
    }

    .nav-logo-imagen img,
    .nav-logo img {
        max-width: 150px !important;
        max-height: 50px !important;
    }

    .nav-logo-iso {
        max-width: 50px !important;
    }

    .nav-iso-text {
        max-width: 120px !important;
        font-size: 8px !important;
    }

    .nav-menu {
        gap: 12px !important;
    }

    .nav-menu a {
        font-size: 10px !important;
    }
}