:root{
    --azul-oscuro:#102c52;
    --azul:#183a67;
    --azul-claro:#2f5b8f;
    --dorado:#e8ad35;
    --dorado-claro:#f6d58f;
    --blanco:#fffaf2;
    --gris:#7a6b61;
    --fondo:#f5ede2;
    --crema:#fff7ec;
    --crema-2:#f8e9d7;
    --cafe:#5b2f22;
    --rosa:#df8f9f;
}

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

html{
    scroll-behavior:smooth;
}

body{
    font-family:'Segoe UI',Tahoma,Geneva,Verdana,sans-serif;
    background:var(--fondo);
    color:#3d352f;
    line-height:1.65;
}

.hero-principal{
    min-height:760px;
    position:relative;
    overflow:hidden;
    color:var(--blanco);
    background:
        linear-gradient(90deg,rgba(255,247,236,.88) 0%,rgba(248,233,215,.78) 47%,rgba(255,250,242,.62) 100%),
        url('../img/fondo/1.jpg') center/cover no-repeat;
}

.hero-principal::before{
    content:"";
    position:absolute;
    inset:0;
    background:
        radial-gradient(circle at 88% 16%,rgba(232,173,53,.18),transparent 27%),
        linear-gradient(120deg,transparent 55%,rgba(223,143,159,.12));
    pointer-events:none;
}

.navbar-principal{
    width:min(1460px,calc(100% - 80px));
    min-height:112px;
    margin:auto;
    position:relative;
    z-index:5;
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:40px;
    border-bottom:1px solid rgba(255,255,255,.13);
}

.marca-principal{
    display:flex;
    align-items:center;
    gap:14px;
    color:var(--azul-oscuro);
    text-decoration:none;
}

.marca-principal img{
    width:82px;
    height:82px;
    object-fit:contain;
    filter:drop-shadow(0 10px 16px rgba(0,0,0,.25));
}

.marca-textos{
    display:flex;
    flex-direction:column;
    line-height:1.1;
}

.marca-textos strong{
    font-size:26px;
    letter-spacing:.5px;
}

.marca-textos small{
    margin-top:7px;
    color:var(--dorado-claro);
    font-size:10px;
    font-weight:700;
    letter-spacing:1.7px;
}

.nav-links{
    display:flex;
    align-items:center;
    gap:12px;
}

.nav-links a{
    position:relative;
    color:var(--azul-oscuro);
    text-decoration:none;
    padding:13px 22px;
    border-radius:30px;
    font-weight:700;
    transition:.25s ease;
}

.nav-links a:hover,
.nav-links a.active{
    color:var(--azul-oscuro);
    background:linear-gradient(135deg,var(--dorado-claro),var(--dorado));
    box-shadow:0 10px 24px rgba(247,183,24,.24);
}

.hero-contenido{
    width:min(1460px,calc(100% - 80px));
    margin:auto;
    min-height:505px;
    position:relative;
    z-index:3;
    display:grid;
    grid-template-columns:minmax(0,1.05fr) minmax(420px,.95fr);
    align-items:center;
    gap:54px;
    padding:60px 0 105px;
}

.hero-texto{
    max-width:800px;
}

.hero-etiqueta{
    display:inline-flex;
    align-items:center;
    gap:8px;
    padding:9px 17px;
    border:1px solid rgba(247,183,24,.72);
    border-radius:30px;
    color:var(--dorado-claro);
    background:rgba(255,250,242,.66);
    font-weight:800;
    letter-spacing:.4px;
}

.hero-texto h1{
    margin-top:24px;
    font-size:clamp(64px,7vw,112px);
    line-height:.93;
    letter-spacing:2px;
    text-shadow:0 10px 28px rgba(0,0,0,.28);
}

.hero-texto h2{
    max-width:780px;
    margin-top:22px;
    color:var(--dorado-claro);
    font-size:clamp(23px,2.5vw,38px);
    line-height:1.2;
    font-weight:700;
    letter-spacing:.3px;
}

.hero-linea{
    width:82px;
    height:4px;
    margin:25px 0;
    border-radius:20px;
    background:linear-gradient(90deg,var(--dorado),var(--dorado-claro));
}

.hero-texto p{
    max-width:720px;
    color:#4e4038;
    font-size:19px;
}

.hero-acciones{
    display:flex;
    flex-wrap:wrap;
    gap:14px;
    margin-top:31px;
}

.btn-hero{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    min-height:54px;
    padding:12px 25px;
    border-radius:10px;
    text-decoration:none;
    font-weight:800;
    transition:.25s ease;
}

.btn-hero-principal{
    color:#06212c;
    background:linear-gradient(135deg,var(--dorado-claro),var(--dorado));
    box-shadow:0 13px 30px rgba(247,183,24,.22);
}

.btn-hero-secundario{
    color:var(--azul-oscuro);
    border:1px solid rgba(247,183,24,.78);
    background:rgba(3,32,43,.4);
}

.btn-hero:hover{
    transform:translateY(-3px);
}

.hero-logo-grande{
    min-height:480px;
    position:relative;
    display:flex;
    align-items:center;
    justify-content:center;
}

.hero-logo-grande img{
    width:min(620px,100%);
    position:relative;
    z-index:2;
    object-fit:contain;
    filter:drop-shadow(0 28px 34px rgba(0,0,0,.28));
    animation:flotar 5s ease-in-out infinite;
}

.halo-logo{
    width:430px;
    height:430px;
    position:absolute;
    border-radius:50%;
    background:radial-gradient(circle,rgba(247,183,24,.25),rgba(7,96,120,.11) 50%,transparent 70%);
    filter:blur(2px);
}

@keyframes flotar{
    0%,100%{transform:translateY(0) rotate(-1deg)}
    50%{transform:translateY(-14px) rotate(1deg)}
}

.hero-indicadores{
    width:min(1160px,calc(100% - 80px));
    position:absolute;
    z-index:4;
    left:50%;
    bottom:84px;
    transform:translateX(-50%);
    display:grid;
    grid-template-columns:repeat(3,1fr);
    overflow:hidden;
    border:1px solid rgba(255,255,255,.14);
    border-radius:16px;
    background:rgba(16,44,82,.94);
    backdrop-filter:blur(8px);
    box-shadow:0 20px 45px rgba(0,0,0,.18);
}

.hero-indicadores article{
    display:flex;
    align-items:center;
    gap:15px;
    padding:17px 25px;
}

.hero-indicadores article+article{
    border-left:1px solid rgba(255,255,255,.12);
}

.hero-indicadores span{
    color:var(--dorado);
    font-size:25px;
    font-weight:900;
}

.hero-indicadores div{
    display:flex;
    flex-direction:column;
}

.hero-indicadores strong{
    font-size:16px;
}

.hero-indicadores small{
    color:rgba(255,250,242,.74);
}

.wave{
    width:100%;
    height:120px;
    position:absolute;
    z-index:2;
    bottom:-1px;
    left:0;
    overflow:hidden;
}

.wave svg{
    width:100%;
    height:100%;
}

.wave path{
    fill:var(--fondo);
    stroke:none;
}

.contenido-principal{
    padding:34px 0 10px;
}

.row{
    width:min(1400px,92%);
    margin:auto;
    display:grid;
    grid-template-columns:minmax(0,2.25fr) minmax(285px,.85fr);
    gap:24px;
}

.leftcolumn,
.rightcolumn{
    min-width:0;
}

.card{
    position:relative;
    overflow:hidden;
    margin-bottom:25px;
    padding:27px;
    border:1px solid rgba(24,58,103,.10);
    border-radius:18px;
    background:var(--crema);
    box-shadow:0 12px 28px rgba(91,47,34,.08);
    transition:.3s ease;
}

.card::before{
    content:"";
    width:5px;
    height:48px;
    position:absolute;
    top:26px;
    left:0;
    border-radius:0 8px 8px 0;
    background:var(--dorado);
}

.card:hover{
    transform:translateY(-4px);
    box-shadow:0 18px 36px rgba(91,47,34,.12);
}

.seccion-etiqueta{
    color:#c97874;
    font-size:12px;
    font-weight:900;
    letter-spacing:1.2px;
    text-transform:uppercase;
}

.card h2,
.card h3{
    margin:3px 0 12px;
    color:var(--azul-oscuro);
}

.card h2{
    font-size:30px;
}

.card h5{
    margin-bottom:18px;
    color:#7a6b61;
    font-size:16px;
}

.card p{
    color:#5a4b43;
}

.galeria-doble{
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:13px;
    margin-bottom:16px;
}

.galeria-vertical{
    grid-template-columns:1fr;
}

.img_1,
.img_2{
    width:100%;
    height:230px;
    display:block;
    border-radius:13px;
    object-fit:cover;
    transition:.35s ease;
}

.rightcolumn .img_2{
    height:150px;
    margin-bottom:12px;
}

.img_1:hover,
.img_2:hover{
    transform:scale(1.018);
}

.lista-servicios{
    padding:15px 17px;
    border-radius:11px;
    background:#f8eadf;
}

.button{
    display:block;
    margin-top:10px;
    padding:12px;
    border-radius:10px;
    background:var(--azul-oscuro);
    color:var(--azul-oscuro);
    text-align:center;
    text-decoration:none;
    font-weight:800;
    transition:.25s ease;
}

.button:hover{
    color:var(--azul-oscuro);
    background:var(--dorado);
}

.footer{
    margin-top:36px;
    padding:25px;
    background:var(--azul-oscuro);
    color:var(--azul-oscuro);
    text-align:center;
}

.footer h6{
    font-size:14px;
    font-weight:500;
    letter-spacing:.4px;
}

@media(max-width:1000px){
    .navbar-principal{
        width:calc(100% - 34px);
    }

    .hero-contenido{
        width:calc(100% - 42px);
        grid-template-columns:1fr minmax(300px,.72fr);
        gap:20px;
    }

    .hero-texto h1{
        font-size:64px;
    }

    .hero-logo-grande{
        min-height:370px;
    }

    .hero-indicadores{
        width:calc(100% - 42px);
    }

    .row{
        grid-template-columns:1fr;
    }
}

@media(max-width:760px){
    .hero-principal{
        min-height:900px;
    }

    .navbar-principal{
        min-height:auto;
        padding:17px 0;
        align-items:flex-start;
        flex-direction:column;
        gap:13px;
    }

    .marca-principal img{
        width:64px;
        height:64px;
    }

    .marca-textos strong{
        font-size:22px;
    }

    .nav-links{
        width:100%;
        display:grid;
        grid-template-columns:repeat(3,1fr);
        gap:7px;
    }

    .nav-links a{
        padding:10px 5px;
        font-size:12px;
        text-align:center;
    }

    .hero-contenido{
        display:flex;
        flex-direction:column;
        padding:34px 0 190px;
    }

    .hero-texto{
        text-align:left;
    }

    .hero-texto h1{
        font-size:52px;
    }

    .hero-texto h2{
        font-size:23px;
    }

    .hero-texto p{
        font-size:16px;
    }

    .hero-logo-grande{
        width:100%;
        min-height:260px;
    }

    .hero-logo-grande img{
        width:330px;
    }

    .halo-logo{
        width:280px;
        height:280px;
    }

    .hero-indicadores{
        bottom:91px;
        grid-template-columns:repeat(3,1fr);
    }

    .hero-indicadores article{
        min-width:0;
        flex-direction:column;
        align-items:flex-start;
        gap:3px;
        padding:12px 8px;
    }

    .hero-indicadores span{
        font-size:19px;
    }

    .hero-indicadores strong{
        font-size:11px;
    }

    .hero-indicadores small{
        font-size:9px;
        line-height:1.2;
    }

    .wave{
        height:94px;
    }

    .row{
        width:calc(100% - 24px);
    }

    .card{
        padding:22px;
    }

    .galeria-doble{
        grid-template-columns:1fr;
    }

    .img_1,
    .img_2{
        height:205px;
    }
}

@media(max-width:430px){
    .marca-textos small{
        font-size:8px;
        letter-spacing:1px;
    }

    .hero-principal{
        min-height:875px;
    }

    .hero-contenido{
        width:calc(100% - 28px);
    }

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

    .hero-texto h1{
        font-size:44px;
    }

    .hero-texto h2{
        font-size:20px;
    }

    .btn-hero{
        flex:1 1 100%;
    }

    .hero-logo-grande img{
        width:280px;
    }
}

/* =========================================================
   VISTA DE ESCRITORIO AL 80% — ESCALA PROPORCIONAL
   Replica visualmente el zoom del navegador al 80% sin
   alterar la composición interna del diseño.
   En tablet y celular se conserva el responsive normal.
   ========================================================= */
@media (min-width: 901px){
    html{
        zoom: .80;
    }
}


/* =========================================================
   PALETA CREMA · REFERENCIA VISUAL
   Solo cambia colores; conserva estructura, tamaños y posiciones.
   ========================================================= */

.hero-principal{
    color:var(--azul-oscuro);
}

.navbar-principal{
    border-bottom-color:rgba(24,58,103,.14);
}

.marca-principal{
    color:var(--azul-oscuro);
}

.marca-textos strong{
    color:var(--azul-oscuro);
}

.marca-textos small{
    color:var(--cafe);
}

.nav-links a{
    color:var(--azul-oscuro);
}

.nav-links a:hover,
.nav-links a.active{
    color:var(--azul-oscuro);
    background:linear-gradient(135deg,var(--dorado-claro),#f0c56c);
    box-shadow:0 10px 24px rgba(232,173,53,.20);
}

.hero-etiqueta{
    color:var(--cafe);
    border-color:rgba(91,47,34,.42);
    background:rgba(255,250,242,.72);
}

.hero-texto h1{
    color:var(--azul-oscuro);
    text-shadow:0 10px 28px rgba(91,47,34,.10);
}

.hero-texto h2{
    color:var(--cafe);
}

.hero-linea{
    background:linear-gradient(90deg,var(--dorado),#f4c96f);
}

.btn-hero-principal{
    color:var(--azul-oscuro);
    background:linear-gradient(135deg,#f4cf7f,var(--dorado));
    box-shadow:0 13px 30px rgba(232,173,53,.20);
}

.btn-hero-secundario{
    color:var(--azul-oscuro);
    border-color:rgba(24,58,103,.48);
    background:rgba(255,250,242,.72);
}

.halo-logo{
    background:radial-gradient(circle,rgba(232,173,53,.18),rgba(223,143,159,.08) 50%,transparent 70%);
}

.hero-indicadores{
    background:rgba(16,44,82,.95);
    border-color:rgba(255,250,242,.18);
    box-shadow:0 20px 45px rgba(91,47,34,.16);
}

.hero-indicadores article+article{
    border-left-color:rgba(255,250,242,.16);
}

.hero-indicadores span{
    color:#efb94d;
}

.hero-indicadores strong{
    color:#fffaf2;
}

.wave path{
    fill:var(--fondo);
}

.card{
    background:var(--crema);
    border-color:rgba(24,58,103,.10);
    box-shadow:0 12px 28px rgba(91,47,34,.08);
}

.card::before{
    background:var(--rosa);
}

.card h2,
.card h3{
    color:var(--azul-oscuro);
}

.lista-servicios{
    background:var(--crema-2);
}

.button{
    background:var(--azul-oscuro);
    color:#fffaf2;
}

.button:hover{
    color:var(--azul-oscuro);
    background:var(--dorado-claro);
}

.footer{
    background:var(--azul-oscuro);
    color:#fffaf2;
}


/* =========================================================
   AJUSTE SOLICITADO
   - Recupera el botón "Conocer al equipo".
   - Aumenta el colibrí principal sin alterar la estructura.
   ========================================================= */
@media (min-width:901px){
    .hero-texto,
    .hero-acciones{
        position:relative;
        z-index:8;
    }

    .hero-acciones .btn-hero-secundario{
        display:inline-flex !important;
        visibility:visible !important;
        opacity:1 !important;
        position:relative;
        z-index:10;
        color:var(--azul-oscuro);
        background:rgba(255,250,242,.90);
        border-color:rgba(24,58,103,.55);
        box-shadow:0 10px 24px rgba(91,47,34,.10);
    }

    .hero-logo-grande{
        overflow:visible;
    }

    .hero-logo-grande img{
        width:min(980px,165%);
        max-width:none;
    }

    .halo-logo{
        width:520px;
        height:520px;
    }
}

@media (max-width:900px){
    .hero-acciones .btn-hero-secundario{
        display:inline-flex !important;
        visibility:visible !important;
        opacity:1 !important;
    }

    .hero-logo-grande img{
        width:420px;
        max-width:115%;
    }
}

@media (max-width:430px){
    .hero-logo-grande img{
        width:340px;
        max-width:120%;
    }
}


/* =========================================================
   COLIBRÍ DEL ENCABEZADO PROPORCIONAL AL TEXTO
   Ruta correcta: img/logo/colibri_logo.png?v=20260727
   ========================================================= */
.marca-principal{
    gap:16px;
}

.marca-principal img{
    width:112px;
    height:112px;
    flex:none;
    object-fit:contain;
}

@media(max-width:760px){
    .marca-principal img{
        width:82px;
        height:82px;
    }
}


/* =========================================================
   ENCABEZADO DE PERSONAL.PHP APLICADO A PRINCIPAL2.PHP
   Solo cambia el encabezado; el resto de principal2 queda intacto.
   ========================================================= */

.principal2-equipo-nav{
    position:relative;
    z-index:5;
    width:min(1480px,94%);
    margin:0 auto;
    min-height:112px;
    padding:20px 0;
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:30px;
    border-bottom:1px solid rgba(24,58,103,.15);
}

.principal2-equipo-nav .equipo-brand{
    display:flex;
    align-items:center;
    gap:15px;
    color:var(--azul-oscuro);
    text-decoration:none;
    min-width:0;
}

.principal2-equipo-nav .equipo-brand img{
    width:62px;
    height:72px;
    object-fit:contain;
    flex:none;
    filter:drop-shadow(0 10px 18px rgba(0,0,0,.18));
}

.principal2-equipo-nav .equipo-brand span,
.principal2-equipo-nav .equipo-brand strong,
.principal2-equipo-nav .equipo-brand small{
    display:block;
}

.principal2-equipo-nav .equipo-brand strong{
    color:var(--azul-oscuro);
    font-size:22px;
    line-height:1;
    font-weight:900;
    letter-spacing:.5px;
}

.principal2-equipo-nav .equipo-brand small{
    margin-top:8px;
    color:var(--cafe);
    font-size:8.5px;
    line-height:1.25;
    font-weight:900;
    letter-spacing:1.1px;
    white-space:nowrap;
}

.principal2-equipo-nav .equipo-nav-links{
    display:flex;
    align-items:center;
    justify-content:flex-end;
    gap:18px;
}

.principal2-equipo-nav .equipo-nav-links a{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    min-height:46px;
    padding:11px 22px;
    border-radius:999px;
    color:var(--azul-oscuro);
    font-size:14px;
    font-weight:800;
    text-decoration:none;
    transition:.25s ease;
}

.principal2-equipo-nav .equipo-nav-links a:hover,
.principal2-equipo-nav .equipo-nav-links a.active{
    color:var(--azul-oscuro);
    background:linear-gradient(135deg,var(--dorado-claro),var(--dorado));
    box-shadow:0 10px 26px rgba(232,173,53,.24);
}

@media(max-width:800px){
    .principal2-equipo-nav{
        min-height:auto;
        padding:17px 0;
        flex-direction:column;
        gap:15px;
    }

    .principal2-equipo-nav .equipo-brand img{
        width:50px;
        height:58px;
    }

    .principal2-equipo-nav .equipo-brand strong{
        font-size:19px;
    }

    .principal2-equipo-nav .equipo-brand small{
        font-size:7.2px;
    }

    .principal2-equipo-nav .equipo-nav-links{
        width:100%;
        justify-content:center;
        gap:7px;
    }

    .principal2-equipo-nav .equipo-nav-links a{
        min-height:40px;
        padding:9px 14px;
        font-size:12px;
    }
}

@media(max-width:480px){
    .principal2-equipo-nav .equipo-brand{
        gap:10px;
    }

    .principal2-equipo-nav .equipo-brand img{
        width:42px;
        height:50px;
    }

    .principal2-equipo-nav .equipo-brand strong{
        font-size:17px;
    }

    .principal2-equipo-nav .equipo-brand small{
        max-width:245px;
        font-size:6.5px;
        white-space:normal;
    }

    .principal2-equipo-nav .equipo-nav-links a{
        padding:8px 11px;
        font-size:11px;
    }
}