/* =======================================================
   FACEP UI FRAMEWORK
   Universidad Nacional del Comahue
   Facultad de Ciencias de la Educación y Psicología
======================================================= */

/* =======================================================
   VARIABLES
======================================================= */

:root{

    --facep-primary:#005b96;
    --facep-primary-light:#0097d7;

    --facep-secondary:#00b4d8;

    --facep-dark:#16324d;
    --facep-dark-2:#0e2236;

    --facep-light:#f4f7fb;
    --facep-light-2:#f8fbfe;

    --facep-white:#ffffff;

    --facep-radius-sm:12px;
    --facep-radius-md:18px;
    --facep-radius-lg:24px;

    --facep-shadow-sm:
        0 .35rem 1rem rgba(0,0,0,.08);

    --facep-shadow-md:
        0 .75rem 2rem rgba(0,0,0,.08);

    --facep-shadow-lg:
        0 1rem 3rem rgba(0,0,0,.10);

    --facep-transition:.25s ease;
}

/* =======================================================
   BASE
======================================================= */

body{

    font-family:'Inter',sans-serif;

    background:var(--facep-light);

    color:#212529;

    overflow-x:hidden;
}

a{

    text-decoration:none;

    transition:var(--facep-transition);
}

img{

    max-width:100%;

    height:auto;
}

/* =======================================================
   HERO GENERICO
======================================================= */

.hero-section{

    position:relative;

    min-height:650px;

    display:flex;

    align-items:center;

    background-position:center;

    background-size:cover;

    background-repeat:no-repeat;
}

.hero-section::before{

    content:"";

    position:absolute;

    inset:0;

    background:
    linear-gradient(
        135deg,
        rgba(15,35,60,.90),
        rgba(0,91,150,.75)
    );
}

.hero-content{

    position:relative;

    z-index:2;

    color:#fff;
}

.hero-card{

    background:
    rgba(255,255,255,.08);

    backdrop-filter:blur(12px);

    border:1px solid rgba(255,255,255,.15);

    border-radius:var(--facep-radius-lg);

    padding:3rem;
}

/* Compatibilidad */

.hero-investigacion{
    composes: hero-section;
}

/* =======================================================
   TARJETAS
======================================================= */

.section-card{

    background:#fff;

    border:none;

    border-radius:var(--facep-radius-lg);

    box-shadow:var(--facep-shadow-md);

    overflow:hidden;
}

.quick-card{

    background:#fff;

    border:none;

    border-radius:var(--facep-radius-lg);

    box-shadow:var(--facep-shadow-sm);

    transition:var(--facep-transition);
}

.quick-card:hover{

    transform:translateY(-6px);

    box-shadow:var(--facep-shadow-lg);
}

/* =======================================================
   TITULOS
======================================================= */

.section-title{

    color:var(--facep-dark);

    font-weight:700;

    letter-spacing:-.5px;
}

.section-subtitle{

    color:#6c757d;
}

/* =======================================================
   BOTONES
======================================================= */

.btn-facep{

    border:none;

    color:#fff;

    border-radius:12px;

    font-weight:600;

    padding:.75rem 1.5rem;

    background:
    linear-gradient(
        135deg,
        var(--facep-primary),
        var(--facep-primary-light)
    );

    transition:var(--facep-transition);
}

.btn-facep:hover{

    color:#fff;

    transform:translateY(-2px);

    box-shadow:0 .5rem 1rem rgba(0,91,150,.25);
}

/* =======================================================
   ACORDEONES
======================================================= */

.accordion-item{

    border:none;
}

.accordion-button{

    font-weight:600;
}

.accordion-button:not(.collapsed){

    background:#e8f4fb;

    color:var(--facep-primary);
}

/* =======================================================
   TABLAS
======================================================= */

.table-modern{

    background:#fff;

    border-radius:var(--facep-radius-md);

    overflow:hidden;

    box-shadow:var(--facep-shadow-sm);
}

.table-modern table{

    margin-bottom:0;
}

.table-modern thead{

    background:var(--facep-dark);

    color:#fff;
}

/* =======================================================
   BLOQUES DE CONTACTO
======================================================= */

.contact-card{

    background:
    linear-gradient(
        135deg,
        #ffffff,
        #f8fbfe
    );
}

.contact-card a{

    color:var(--facep-primary);

    font-weight:500;
}

.contact-card a:hover{

    text-decoration:underline;
}

/* =======================================================
   TOPBAR
======================================================= */

.topbar-facep{

    background:
    linear-gradient(
        90deg,
        var(--facep-dark-2),
        var(--facep-dark)
    );

    color:#fff;

    font-size:.90rem;
}

.topbar-facep a{

    color:#fff;
}

.topbar-facep a:hover{

    opacity:.85;
}

/* =======================================================
   NAVBAR
======================================================= */

.navbar-facep{

    background:#fff;

    box-shadow:
    0 2px 15px rgba(0,0,0,.08);
}

.navbar-facep .nav-link{

    color:var(--facep-dark);

    font-weight:500;
}

.navbar-facep .nav-link:hover{

    color:var(--facep-primary);
}

.navbar-facep .dropdown-menu{

    border:none;

    border-radius:16px;

    box-shadow:
    0 10px 30px rgba(0,0,0,.12);
}

.navbar-facep .dropdown-item{

    padding:.65rem 1rem;
}

.navbar-facep .dropdown-item i{

    width:22px;

    text-align:center;
}

.navbar-facep .dropdown-item img{

    width:22px;

    object-fit:contain;
}

.logo-facep{

    max-height:75px;
}

/* =======================================================
   FOOTER
======================================================= */

.footer-facep{

    background:
    linear-gradient(
        135deg,
        var(--facep-dark),
        var(--facep-dark-2)
    );

    color:#fff;
}

.footer-facep a{

    color:#fff;

    transition:var(--facep-transition);
}

.footer-facep a:hover{

    color:#8ed4ff;

    padding-left:4px;
}

.footer-facep .social-icon{

    transition:var(--facep-transition);
}

.footer-facep .social-icon:hover{

    transform:scale(1.15);
}

/* =======================================================
   UTILIDADES
======================================================= */

.facep-shadow{
    box-shadow:var(--facep-shadow-md);
}

.facep-rounded{
    border-radius:var(--facep-radius-lg);
}

.facep-bg-light{
    background:var(--facep-light);
}

.facep-bg-white{
    background:#fff;
}

/* =======================================================
   RESPONSIVE
======================================================= */

@media (max-width:991px){

    .hero-section{
        min-height:500px;
    }

    .hero-card{
        padding:2rem;
    }

    .logo-facep{
        max-height:60px;
    }

}