/* Tipografía uniforme */
body {
    font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
    scroll-behavior: smooth;
    color: #212529;
}

/* Colores API */
:root {
    --api-yellow: #f5c400;
    --api-dark: #212529;
    --api-light: #f8f9fa;
    --api-gray: #495057;
}

h1, h2, h3 { font-weight: 700; }
p, li { font-size: 1rem; line-height: 1.6; color: var(--api-light); }


/* ESLOGAN FIJO */
.eslogan-fijo {
    background-color: #f5c400;   /* amarillo API */
    color: #212529;
    font-size: 0.85rem;          /* tamaño pequeño pero legible */
    font-weight: 200;            /* delgado */
    padding: 4px 0;              /* hace la franja más fina */
    text-align: center;

    position: sticky;
    top: 65px;                   /* debajo del navbar */
    z-index: 800;

    box-shadow: 0 1px 3px rgba(0,0,0,0.15);
}



/* HERO */
.nosotros-hero {
    padding: 100px 0 60px;
    background-color: var(--api-light);
    text-align: center;
}
.nosotros-hero h1 { font-size: 2.5rem; color: var(--api-dark); margin-bottom: 15px; }
.nosotros-hero p { font-size: 1.25rem; color: var(--api-gray); }


/* Fundadores */

.fundadores p,
.fundadores h3,
.fundadores h4 {
    color: var(--api-dark); /* negro API */
}

.fundadores .card {
    border: none;
    text-align: center;
    padding: 2rem;
    transition: transform 0.4s, box-shadow 0.4s;
    opacity: 0;
    transform: translateY(50px);
}

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

.fundadores img {
    width: 380px;         /* un poco más ancho para proporción vertical */
    height: 480px;        /* altura vertical */
    object-fit: cover;    /* mantiene la imagen recortada adecuadamente */
    border-radius: 15px;  /* bordes ligeramente redondeados */
    margin-bottom: 15px;
}

.fundadores .card:hover {
    transform: translateY(-10px);
    box-shadow: 0 8px 20px rgba(0,0,0,0.3);
}

/* CONTADOR  */
.valores,
.valores p,
.valores span {
    color: #212529 !important;
}
.valores {
    background-color: #FFF8E1; /* Amarillo claro de API */
    color: #212529;
 
}

.valor-card h2 {
    font-size: 3rem;
    font-weight: 700;
    margin-bottom: 10px;
    color: #FFC107; /* amarillo API */
}

.valor-card p {
    font-size: 1.2rem;
    font-weight: 500;
}


/* Pestañas */
.nav-tabs .nav-link { font-weight: 600; color: var(--api-dark); }
.nav-tabs .nav-link.active { color: var(--api-yellow); border-color: var(--api-yellow) var(--api-yellow) transparent; }
.tab-pane { padding-top: 5px; animation: fadeTab 0.5s; }
.tab-content {
    background-color: #fff; /* blanco */
    padding: 40px 20px;     /* separa el contenido del borde */
    border-radius: 10px;    /* opcional, bordes redondeados */
    box-shadow: 0 4px 15px rgba(0,0,0,0.1); /* opcional, da profundidad */
}
@keyframes fadeTab { from {opacity:0;} to {opacity:1;} }

/* Redes Sociales */
.redes { padding: 80px 0; background-color: #ffffff; text-align: center; }
.redes h2 { font-size: 2.5rem; font-weight: 700; margin-bottom: 40px; color: var(--api-dark); }
.redes a { font-size: 4rem; margin: 25px; display: inline-block; text-decoration: none; transition: transform 0.3s, color 0.3s; }
.redes a span { display: block; font-size: 1.1rem; font-weight: 600; margin-top: 10px; color: var(--api-dark); }
.redes a:hover { transform: scale(1.2); color: var(--api-yellow); }


/* Galería */
.galeria {  background-color: #ffffff;     padding: 60px 0;    }
.galeria img { width: 100%; height: 300px; object-fit: cover; border-radius: 10px; transition: transform 0.3s, box-shadow 0.3s; }
.galeria .galeria-item:hover img { transform: scale(1.05); box-shadow: 0 8px 20px rgba(0,0,0,0.3); }
.galeria .galeria-text { position: absolute; bottom: 0; background: rgba(0,0,0,0.5); color: #fff; width: 100%; padding: 5px; border-radius: 0 0 10px 10px; text-align: center; }
.galeria-item { position: relative; overflow: hidden; margin-bottom: 30px; }


/* Botones */
.btn-api { background-color: var(--api-yellow); color: var(--api-dark); font-weight: 600; transition: 0.3s; }
.btn-api:hover { background-color: #f5c400; color: #212529; }

/* Footer */
footer {     background-color: var(--azul-marino);    color: var(--blanco);     padding: 30px 0; text-align: center; }

/* REDES SOCIALES */
.social-links a {
    color: var(--blanco);
    font-size: 1.6rem;
    margin: 0 10px;
    transition: color 0.3s ease, transform 0.3s ease;
}



.whatsapp-float {
    position: fixed;
    bottom: 25px;
    right: 25px;

    width: 60px;
    height: 60px;

    background-color: #25d366;
    color: white;

    display: flex;
    align-items: center;
    justify-content: center;

    font-size: 2rem;
    border-radius: 50%;

    box-shadow: 0 8px 20px rgba(0,0,0,0.3);
    z-index: 999;

    transition: transform 0.3s ease;
}

.whatsapp-float:hover {
    transform: scale(1.1);
    color: white;
}

html {
    scroll-behavior: smooth;
}