:root {
  --rojo: #DC0B19;   --marino: #1F2C4F;  --verde: #2F6B4F;  --azul: #2E6E8E;
  --tinta: #1B1918;  --gris: #5A554B;    --linea: #E4E1DA;  --panel: #F7F5F1;
  --font-body: 'IBM Plex Sans', sans-serif;
  --font-display: 'Archivo', sans-serif;
}

@import url('https://fonts.googleapis.com/css2?family=Roboto:ital,wght@0,100;0,300;0,400;0,500;0,700;0,900;1,100;1,300;1,400;1,500;1,700;1,900&display=swap');

body *{font-family: 'Roboto', sans-serif;}
h1, h2, h3, h4, h5, h6{font-family: 'Roboto', sans-serif !important;}

.color-primary{color: #c00 !important;}
.color-secondary{color: #222220 !important;}
.color-light{color: #f9f7f4 !important;}
.color-text{color: #444 !important;}
.color-grey{color: #555 !important;}

.background-primary-transparent{background-color: rgba(204, 0, 0, 0.7) !important;}
.background-secondary-transparent{background-color: rgba(34, 34, 32, 0.7) !important;}
.background-secondary-transparent > *, .background-secondary-transparent > * > *{background-color: rgba(34, 34, 32, 0.7) !important;}
.background-primary-light-transparent{background-color: rgba(204, 0, 0, 0.1) !important;}
.background-light{background-color: #f0f0f0 !important;}
.background-grey{background-color: #1e1e1e !important;}

.background-primary > *, .background-primary > * > *{background-color: #c00 !important;}
.background-secondary, .background-secondary > *, .background-secondary > * > *{background-color: #222220 !important;}
.background-grey, .background-grey > *, .background-grey > * > *{background-color: #1e1e1e !important;}
.background-grey-light > *, .background-grey-light > * > *{background-color: #eaeaea !important;}

.heading-block h1 { font-weight: 600 !important;}

/*************************************************************************************
    BUTTONS
**************************************************************************************/
.btn-inacap{border: 3px solid #222220; border-radius: 30px; color: #1d1b3f; padding: 10px !important;}
.btn-inacap:hover{border: 3px solid #222220 !important; border-radius: 30px !important; color: #1d1b3f !important; padding: 10px !important; background-color: #fff !important; font-weight: 500; text-decoration: underline;}
.btn-inacap-secondary{border: 3px solid #c00; border-radius: 30px; color: #1d1b3f !important; padding: 10px !important; background-color: #fff !important;}
.btn-inacap-secondary:hover{border: 3px solid #c00 !important; border-radius: 30px !important; color: #1d1b3f !important; padding: 10px !important; background-color: #fff !important; font-weight: 500; text-decoration: underline;}

.btn{border-radius: 30px !important; box-shadow:0 4px 8px rgba(0,0,0,0.1); font-weight: 500;}
.btn-outline-primary, .btn-outline-primary:focus{background-color: #fff; color: #000; border-color: #c00; border-radius: 30px; box-shadow:0 4px 8px rgba(0,0,0,0.1); font-weight: 500;}
.btn-outline-primary:hover {background-color: #fff; color: #000; border-color: #c00; border-radius: 30px; box-shadow:0 4px 8px rgba(0,0,0,0.1); font-weight: 500; text-decoration: underline;}
.btn-outline-primary:disabled {color: #888 !important; background-color: #ccc; border-color: #ccc;}

.btn-primary, .btn-primary:focus{color: #fff; background-color: #c00; border-color: #c00; border-radius: 30px; box-shadow:0 4px 8px rgba(0,0,0,0.1); font-weight: 500;}
.btn-primary:hover, .btn-primary:focus, .btn-primary.focus, .btn-primary:active, .btn-primary.active, .show>.dropdown-toggle.btn-primary {color: #fff !important; background-color: #222220; border-color: #222220; }

.btn-secondary{background-color: #fff; border-color: #222220; color: #222220; border-radius: 30px; box-shadow:0 4px 8px rgba(0,0,0,0.1);}
.btn-secondary:hover{filter: none; background-color: #222220; border-color: #222220; color: #fff; border-radius: 30px; box-shadow:0 4px 8px rgba(0,0,0,0.1);}
.btn-secondary.disabled, .btn-secondary[disabled], fieldset[disabled] .btn-secondary, .btn-secondary.disabled:hover, .btn-secondary[disabled]:hover, fieldset[disabled] .btn-secondary:hover, .btn-secondary.disabled:focus, .btn-secondary[disabled]:focus, fieldset[disabled] .btn-secondary:focus, .btn-secondary.disabled.focus, .btn-secondary[disabled].focus, fieldset[disabled] .btn-secondary.focus, .btn-secondary.disabled:active, .btn-secondary[disabled]:active, fieldset[disabled] .btn-secondary:active, .btn-secondary.disabled.active, .btn-secondary[disabled].active, fieldset[disabled] .btn-secondary.active{filter: brightness(120%);}

.btn-transparent, .btn-transparent:focus{color: #fff; background-color: #0000004d; border-color: #fff; border-radius: 30px; box-shadow:0 4px 8px rgba(0,0,0,0.1); font-weight: 500;}
.btn-transparent:hover, .btn-transparent:focus, .btn-transparent.focus, .btn-transparent:active, .btn-transparent.active, .show>.dropdown-toggle.btn-transparent {color: #444 !important; background-color: #ffffffab; border-color: #ffffffab; }

.btn-alumni{color: #fff; background-color: #c00; border-color: #c00; border-width: 2px; padding: 5px 12px; border-radius: 30px; box-shadow:0 4px 8px rgba(0,0,0,0.1); font-weight: 500;}
.btn-alumni:hover, .btn-alumni:active{color: #fff !important; background-color: #222220; border-color: #222220; border-width: 2px;}
.btn-alumni:disabled{color: #888; background-color: #ccc; border-color: #ccc;}

.btn-alumni-secondary{color: #fff; background-color: #000; border-color: #000; border-width: 2px; padding: 5px 12px; border-radius: 30px; box-shadow:0 4px 8px rgba(0,0,0,0.1); font-weight: 500;}
.btn-alumni-secondary:hover, .btn-alumni-secondary:active{filter: brightness(120%); transition: border 0.3s ease, background 0.3s ease; color: #fff;}

.btn-success, .btn-success:focus{border-radius: 30px; box-shadow:0 4px 8px rgba(0,0,0,0.1); font-weight: 500;}
#filters .btn-success:hover,
#filters .btn-success:active{color: #fff !important; background-color: #000; border-color: #000; border-width: 2px; border-radius: 30px; box-shadow:0 4px 8px rgba(0,0,0,0.1); font-weight: 500;}

.btn-default{color: #222220 !important; background-color: #fff !important; border-color: #222220 !important;}
.btn-default:hover, .btn-default:focus, .btn-default.focus, .btn-default:active, .btn-default.active{color: #222220; background-color: #fff; border-radius: 30px; box-shadow:0 4px 8px rgba(0,0,0,0.1); font-weight: 500;}
.btn-primary.disabled, .btn-primary[disabled], fieldset[disabled] .btn-primary, .btn-primary.disabled:hover, .btn-primary[disabled]:hover, fieldset[disabled] .btn-primary:hover, .btn-primary.disabled:focus, .btn-primary[disabled]:focus, fieldset[disabled] .btn-primary:focus, .btn-primary.disabled.focus, .btn-primary[disabled].focus, fieldset[disabled] .btn-primary.focus, .btn-primary.disabled:active, .btn-primary[disabled]:active, fieldset[disabled] .btn-primary:active, .btn-primary.disabled.active, .btn-primary[disabled].active, fieldset[disabled] .btn-primary.active{color: #888 !important; background-color: #ccc; border-color: #ccc; font-weight: 500;}

#job_offer .btn-success{background-color: #c00; color: #000; border-color: #c00; border-radius: 30px; box-shadow:0 4px 8px rgba(0,0,0,0.1); font-weight: 500;}
#job_offer .btn-success:hover, #job_offer .btn-success:active{background-color: #222220; color: #000 !important; border-color: #222220;}

.btn-info{color: #fff; background-color: #c00; border-color: #c00; border-radius: 30px; box-shadow:0 4px 8px rgba(0,0,0,0.1); font-weight: 500;}
.btn-info:hover, .btn-info:focus, .btn-info.focus, .btn-info:active, .btn-info.active, .show>.dropdown-toggle.btn-info{background-color: #222220; border-color: #222220; color: #fff !important;}
.btn-info:disabled{color: #888; background-color: #ccc; border-color: #ccc;}

.btn-primary-especial{background-color: #222220; background-image: linear-gradient(to right, #222220 0%, #222220 36%, #c00 66%, #c00 100%); padding: 15px 15px!important; border-radius: 60px !important; color: #fff; min-width: 220px; transition: border 0.3s ease, background 0.3s ease;}
.btn-primary-especial:hover{background-color: #222220; background-image: linear-gradient(to right, #c00 0%, #c00 36%, #222220 66%, #222220 100%); color: #fff; text-decoration: none;}

.btn-secondary-especial{background-color: #222220; background-image: linear-gradient(to right, #222220 0%, #222220 36%, #c00 66%, #c00 100%); padding: 15px 15px!important; border-radius: 60px !important; color: #fff; min-width: 220px; transition: border 0.3s ease, background 0.3s ease;}
.btn-secondary-especial:hover{background-color: #222220; background-image: linear-gradient(to right, #c00 0%, #c00 36%, #222220 66%, #222220 100%); color: #fff; text-decoration: none;}

.job_offer_list .info .apply:hover, .job_offer_list .info .apply:active{color: #fff !important;}

/*************************************************************************************
    HEADER
**************************************************************************************/
.dropdown-toggle::after {content: ""; display: inline-block; margin-left: 6px; vertical-align: middle; width: 0; height: 0; border-top: 5px solid transparent; border-bottom: 5px solid transparent; border-left: 6px solid #222220;}
.dropdown-toggle.show::after {border-left: 5px solid transparent; border-right: 5px solid transparent; border-top: 6px solid #222220; border-bottom: 0; }
.dropdown-toggle:hover::after{transform: translateX(2px);}

#header{text-transform: none;}
#header{background-color: #fff; text-transform: none;}

#header .lower-logo{display: none!important;}
@media (min-width: 1200px) {
    #header .navbar-container {width: 70% !important;}
}
#header .navbar-top{padding-bottom: 7px; border-bottom: 1px solid #222220;}
#header .navbar-bottom{padding-top: 7px;}

.nav > li.simple > a{padding: 10px 0;}

.navbar-default .navbar-nav>li>a.login, a.login{border: none !important; border-radius: 30px; color: #222220 !important; padding: 5px 20px !important; background-color: #ffe6e0;}
.navbar-default .navbar-nav>li>a.login:hover, .navbar-default .navbar-nav>li>a.login:active, .navbar-default .navbar-nav>li>a.login:focus, a.login:hover{border: none !important; border-radius: 30px !important; color: #222220 !important; padding: 5px 20px !important;  background-color: #ffe6e0 !important; font-weight: 500; text-decoration: underline;}
.navbar-default .navbar-nav>li>a.loginExternal, a.loginExternal{border: none !important; border-radius: 30px; color: #222220 !important; padding: 5px 20px !important; background-color: #cff2fa; margin: 5px 5px;}
.navbar-default .navbar-nav>li>a.loginExternal:hover, .navbar-default .navbar-nav>li>a.loginExternal:active, .navbar-default .navbar-nav>li>a.loginExternal:focus, a.loginExternal:hover{border: none !important; border-radius: 30px !important; color: #222220 !important; padding: 5px 20px !important;  background-color: #cff2fa !important; font-weight: 500; text-decoration: underline;}
.navbar-default .navbar-nav>li>a.portalCompany, a.portalCompany{border: none !important; border-radius: 30px; color: #222220 !important; padding: 5px 20px !important; background-color: #e0f4df;}
.navbar-default .navbar-nav>li>a.portalCompany:hover, .navbar-default .navbar-nav>li>a.portalCompany:active, .navbar-default .navbar-nav>li>a.portalCompany:focus, a.portalCompany:hover{border: none !important; border-radius: 30px !important; color: #222220 !important; padding: 5px 20px !important;  background-color: #e0f4df !important; font-weight: 500; text-decoration: underline;}
.navbar-default .navbar-nav>li>a.btnArrowRight, a.btnArrowRight{ display: inline-flex; align-items: center; gap: 6px;}
.navbar-default .navbar-nav>li>a.btnArrowRight::after, a.btnArrowRight::after{content: ""; display: inline-block; width: 0; height: 0; border-top: 5px solid transparent; border-bottom: 5px solid transparent; border-left: 6px solid currentColor;}
.navbar-default .navbar-nav>li>a.btnArrowRight:hover::after, a.btnArrowRight:hover::after{transform: translateX(2px);}

/* Large versions of the buttons for Homepage */
a.login.btnArrowRight-lg{border: none !important; border-radius: 30px; color: #222220 !important; padding: 12px 30px !important; background-color: #ffe6e0; font-size: 18px; font-weight: 500; display: inline-flex; align-items: center; gap: 8px;}
a.login.btnArrowRight-lg:hover, a.login.btnArrowRight-lg:active, a.login.btnArrowRight-lg:focus{border: none !important; border-radius: 30px !important; color: #222220 !important; padding: 12px 30px !important; background-color: #ffe6e0 !important; font-weight: 600; text-decoration: underline;}
a.login.btnArrowRight-lg::after{content: ""; display: inline-block; width: 0; height: 0; border-top: 6px solid transparent; border-bottom: 6px solid transparent; border-left: 7px solid currentColor;}
a.login.btnArrowRight-lg:hover::after{transform: translateX(3px);}

a.loginExternal.btnArrowRight-lg{border: none !important; border-radius: 30px; color: #222220 !important; padding: 12px 30px !important; background-color: #cff2fa; font-size: 18px; font-weight: 500; display: inline-flex; align-items: center; gap: 8px;}
a.loginExternal.btnArrowRight-lg:hover, a.loginExternal.btnArrowRight-lg:active, a.loginExternal.btnArrowRight-lg:focus{border: none !important; border-radius: 30px !important; color: #222220 !important; padding: 12px 30px !important; background-color: #cff2fa !important; font-weight: 600; text-decoration: underline;}
a.loginExternal.btnArrowRight-lg::after{content: ""; display: inline-block; width: 0; height: 0; border-top: 6px solid transparent; border-bottom: 6px solid transparent; border-left: 7px solid currentColor;}
a.loginExternal.btnArrowRight-lg:hover::after{transform: translateX(3px);}

a.portalCompany.btnArrowRight-lg{border: none !important; border-radius: 30px; color: #222220 !important; padding: 12px 30px !important; background-color: #e0f4df; font-size: 18px; font-weight: 500; display: inline-flex; align-items: center; gap: 8px;}
a.portalCompany.btnArrowRight-lg:hover, a.portalCompany.btnArrowRight-lg:active, a.portalCompany.btnArrowRight-lg:focus{border: none !important; border-radius: 30px !important; color: #222220 !important; padding: 12px 30px !important; background-color: #e0f4df !important; font-weight: 600; text-decoration: underline;}
a.portalCompany.btnArrowRight-lg::after{content: ""; display: inline-block; width: 0; height: 0; border-top: 6px solid transparent; border-bottom: 6px solid transparent; border-left: 7px solid currentColor;}
a.portalCompany.btnArrowRight-lg:hover::after{transform: translateX(3px);}

/* Responsive styles for large homepage buttons */
@media (max-width: 575px) {
    a.login.btnArrowRight-lg,
    a.loginExternal.btnArrowRight-lg,
    a.portalCompany.btnArrowRight-lg {
        padding: 8px 16px !important;
        font-size: 13px;
        white-space: nowrap;
        gap: 6px;
    }
    a.login.btnArrowRight-lg::after,
    a.loginExternal.btnArrowRight-lg::after,
    a.portalCompany.btnArrowRight-lg::after {
        border-top: 4px solid transparent;
        border-bottom: 4px solid transparent;
        border-left: 5px solid currentColor;
    }
}
@media (min-width: 576px) and (max-width: 767px) {
    a.login.btnArrowRight-lg,
    a.loginExternal.btnArrowRight-lg,
    a.portalCompany.btnArrowRight-lg {
        padding: 10px 20px !important;
        font-size: 15px;
        white-space: nowrap;
    }
}

#header .dropdown-toggle .caret{color: #222220;}
.navbar-default .navbar-nav>li>a{color: #222220; font-size: 16px; font-weight: 400;}
.navbar-default .navbar-nav>li>a:hover, .navbar-default .navbar-nav>li>a:focus {color: #222220; font-weight: 500; background-color: transparent; }

.navbar-default .navbar-nav .show, .navbar-default .navbar-nav .show:hover, .navbar-default .navbar-nav .show:focus{background-color: transparent !important; color: #222220 !important;}
.navbar-default .navbar-nav>.show>a, .navbar-default .navbar-nav>.show>a:hover, .navbar-default .navbar-nav>.show>a:focus{color: #222220; font-weight: 500; background-color: #fff; }
.navbar-default .navbar-nav>.active>a, .navbar-default .navbar-nav>.active>a:hover, .navbar-default .navbar-nav>.active>a:focus{color: #222220; font-weight: 500;}
#header.navbar-default .navbar-nav .show.dropdown-menu > li > a{color: #222220; background-color: #fff; font-size: 16px; font-weight: 300;}
#header.navbar-default .navbar-nav .show.dropdown-menu > li > a:hover{ background-color: transparent; color: #222220; font-weight: 400; }
#header.navbar-default .navbar-nav .show.dropdown-menu{background-color: #fff !important; -webkit-animation: fadeIn 0.7s ease-in-out both; animation: fadeIn 0.7s ease-in-out both; border-color: transparent;}
.navbar-nav>li>a:hover, .navbar-nav>li>a:focus, .navbar-nav>li>a:active{background-color: transparent !important;}
#header .logo-inacap{height: 40px; width: auto; max-width: 300px; margin: 10px 20px;}

@media (min-width: 768px){
    .navbar-nav.header-centered{float: inherit; text-align: center;}
    .navbar-nav.header-centered>li{float: inherit; display: inline-block;}
    #header .header-top .right{padding-right: 0;}
    #header{padding: 0;}
}
@media (max-width: 767px){
    .navbar-default .navbar-collapse, .navbar-default .navbar-form{padding: 0;}
    #header{padding: 0;}
}

/* Mobile header styles */
@media (max-width: 1199px) {
    #header .container-fluid{
        position: relative;
        flex-wrap: wrap;
    }
    #header .navbar-toggler{
        position: absolute;
        top: 18px;
        right: 15px;
        z-index: 1000;
    }
    /* Toggler icon - hamburger to X animation using aria-expanded */
    #header .navbar-toggler[aria-expanded="false"] .navbar-toggler-icon,
    #header .navbar-toggler:not([aria-expanded]) .navbar-toggler-icon{
        background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'%3e%3cpath stroke='rgba(0, 0, 0, 0.55)' stroke-linecap='round' stroke-miterlimit='10' stroke-width='2' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e");
    }
    #header .navbar-toggler[aria-expanded="true"] .navbar-toggler-icon{
        background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'%3e%3cpath stroke='rgba(0, 0, 0, 0.55)' stroke-linecap='round' stroke-miterlimit='10' stroke-width='2' d='M7 7l16 16M7 23l16-16'/%3e%3c/svg%3e");
    }
    #header .navbar-container{
        flex: 0 0 100%;
        width: 100%;
    }
    #header .navbar-top{
        border-bottom: none;
    }
    #header .logo-inacap{
        max-width: 200px;
        margin: 10px 0;
    }
}
@media (max-width: 575px) {
    #header .logo-inacap{
        max-width: 160px;
    }
}

#header li.icon-menu a .fas, #header li.icon-menu a:visited .fas{color: #222220; font-size: 24px;}
.navbar-default .navbar-nav>li.icon-menu>a:hover, .navbar-default .navbar-nav>li.icon-menu>a:focus{color: #222220; border: none !important;}

/*************************************************************************************
    HEADER — Emplea X Chile reskin
    Applies the new brand identity using Task 1 tokens.
    All rules target existing markup classes only; no structural changes.
**************************************************************************************/

/* Font: switch header to IBM Plex Sans body + Archivo on brand */
#header,
#header .navbar-nav > li > a,
#header .navbar-brand,
#header .dropdown-menu .dropdown-item {
    font-family: var(--font-body);
}
#header .navbar-brand .logo-inacap {
    /* logo keeps image styling; Archivo applies to any fallback text */
    font-family: var(--font-display);
    font-weight: 800;
}

/* Background & sticky border */
#header {
    background-color: #FFFFFF !important;
    border-bottom: 1px solid var(--linea);
    position: sticky;
    top: 0;
    z-index: 1000;
}

/* Top bar separator: replace dark border with --linea */
#header .navbar-top {
    padding-bottom: 8px;
    border-bottom: 0 !important;
}

/* Separator lives on the bottom nav row (only rendered when logged in),
   so anonymous visitors don't get a stray line under the header. */
#header .navbar-bottom {
    padding-top: 8px;
    border-top: 1px solid var(--linea);
}

/* Bottom nav links: tinta default, rojo on hover/active */
#header .navbar-bottom .navbar-nav > li > a,
.navbar-default .navbar-nav > li > a {
    color: var(--gris);
    font-size: 15px;
    font-weight: 500;
    transition: color 0.18s ease;
}
#header .navbar-bottom .navbar-nav > li > a:hover,
#header .navbar-bottom .navbar-nav > li > a:focus,
.navbar-default .navbar-nav > li > a:hover,
.navbar-default .navbar-nav > li > a:focus {
    color: var(--rojo);
    font-weight: 600;
    background-color: transparent;
    text-decoration: none;
}

/* Active nav item */
#header .navbar-bottom .navbar-nav > li.active > a,
#header .navbar-bottom .navbar-nav > li.active > a:hover,
#header .navbar-bottom .navbar-nav > li.active > a:focus,
.navbar-default .navbar-nav > .active > a,
.navbar-default .navbar-nav > .active > a:hover,
.navbar-default .navbar-nav > .active > a:focus {
    color: var(--rojo);
    font-weight: 600;
}

/* Open/expanded dropdown toggle */
.navbar-default .navbar-nav .show > a,
.navbar-default .navbar-nav .show > a:hover,
.navbar-default .navbar-nav .show > a:focus {
    color: var(--rojo) !important;
    background-color: transparent !important;
}

/* Dropdown chevron: tinta default, rojo when active */
.dropdown-toggle::after {
    border-left-color: var(--gris);
}
.dropdown-toggle:hover::after,
.dropdown-toggle.show::after {
    border-top-color: var(--rojo);
    border-left-color: transparent;
}
.navbar-default .navbar-nav > li > a:hover .dropdown-toggle::after,
.show > .dropdown-toggle::after {
    border-left-color: var(--rojo);
}

/* Dropdown menu: white panel with --linea border and subtle shadow */
#header .dropdown-menu,
.navbar-default .navbar-nav .dropdown-menu {
    background-color: #FFFFFF !important;
    border: 1px solid var(--linea) !important;
    border-radius: 12px !important;
    box-shadow: 0 12px 28px rgba(27, 25, 24, 0.10) !important;
    animation: fadeIn 0.18s ease-in-out both;
}
#header .dropdown-menu .dropdown-item,
.navbar-default .navbar-nav .dropdown-menu li a,
.navbar-default .navbar-nav .dropdown-menu .dropdown-item {
    color: var(--gris);
    font-size: 14px;
    font-weight: 400;
    border-radius: 7px;
    padding: 10px 14px;
    transition: background-color 0.15s ease, color 0.15s ease;
}
#header .dropdown-menu .dropdown-item:hover,
#header .dropdown-menu .dropdown-item:focus,
.navbar-default .navbar-nav .dropdown-menu li a:hover,
.navbar-default .navbar-nav .dropdown-menu li a:focus,
.navbar-default .navbar-nav .dropdown-menu .dropdown-item:hover,
.navbar-default .navbar-nav .dropdown-menu .dropdown-item:focus {
    background-color: var(--panel) !important;
    color: var(--tinta) !important;
    font-weight: 500;
}

/* Anonymous state CTAs — top bar pills */
/* .login = Soy Inacapino → marino (primary) */
.navbar-default .navbar-nav > li > a.login,
a.login {
    background-color: var(--marino) !important;
    color: #FFFFFF !important;
    border-radius: 100px !important;
    border: none !important;
    padding: 6px 20px !important;
    font-family: var(--font-body);
    font-weight: 600;
    font-size: 13.5px;
    letter-spacing: 0.02em;
    transition: background-color 0.18s ease;
}
.navbar-default .navbar-nav > li > a.login:hover,
.navbar-default .navbar-nav > li > a.login:active,
.navbar-default .navbar-nav > li > a.login:focus,
a.login:hover {
    background-color: #16203A !important;
    color: #FFFFFF !important;
    border-radius: 100px !important;
    border: none !important;
    padding: 6px 20px !important;
    font-weight: 600;
    text-decoration: none;
}

/* .loginExternal = Soy Público General → azul-tint outline */
.navbar-default .navbar-nav > li > a.loginExternal,
a.loginExternal {
    background-color: #EDF3F6 !important;
    color: var(--azul) !important;
    border-radius: 100px !important;
    border: 1.5px solid var(--azul) !important;
    padding: 5px 20px !important;
    font-family: var(--font-body);
    font-weight: 600;
    font-size: 13.5px;
    letter-spacing: 0.02em;
    margin: 0 4px;
    transition: background-color 0.18s ease;
}
.navbar-default .navbar-nav > li > a.loginExternal:hover,
.navbar-default .navbar-nav > li > a.loginExternal:active,
.navbar-default .navbar-nav > li > a.loginExternal:focus,
a.loginExternal:hover {
    background-color: #D5E5ED !important;
    color: var(--azul) !important;
    border-radius: 100px !important;
    border: 1.5px solid var(--azul) !important;
    padding: 5px 20px !important;
    font-weight: 600;
    text-decoration: none;
}

/* .portalCompany = Soy Empresa → verde-tint outline */
.navbar-default .navbar-nav > li > a.portalCompany,
a.portalCompany {
    background-color: #EDF5F0 !important;
    color: var(--verde) !important;
    border-radius: 100px !important;
    border: 1.5px solid var(--verde) !important;
    padding: 5px 20px !important;
    font-family: var(--font-body);
    font-weight: 600;
    font-size: 13.5px;
    letter-spacing: 0.02em;
    transition: background-color 0.18s ease;
}
.navbar-default .navbar-nav > li > a.portalCompany:hover,
.navbar-default .navbar-nav > li > a.portalCompany:active,
.navbar-default .navbar-nav > li > a.portalCompany:focus,
a.portalCompany:hover {
    background-color: #D5E8DC !important;
    color: var(--verde) !important;
    border-radius: 100px !important;
    border: 1.5px solid var(--verde) !important;
    padding: 5px 20px !important;
    font-weight: 600;
    text-decoration: none;
}

/* Large homepage versions — update to new identity */
a.login.btnArrowRight-lg {
    background-color: var(--marino) !important;
    color: #FFFFFF !important;
    border-radius: 100px !important;
    border: none !important;
}
a.login.btnArrowRight-lg:hover,
a.login.btnArrowRight-lg:active,
a.login.btnArrowRight-lg:focus {
    background-color: #16203A !important;
    color: #FFFFFF !important;
    text-decoration: none;
}

a.loginExternal.btnArrowRight-lg {
    background-color: #EDF3F6 !important;
    color: var(--azul) !important;
    border-radius: 100px !important;
    border: 1.5px solid var(--azul) !important;
}
a.loginExternal.btnArrowRight-lg:hover,
a.loginExternal.btnArrowRight-lg:active,
a.loginExternal.btnArrowRight-lg:focus {
    background-color: #D5E5ED !important;
    color: var(--azul) !important;
    text-decoration: none;
}

a.portalCompany.btnArrowRight-lg {
    background-color: #EDF5F0 !important;
    color: var(--verde) !important;
    border-radius: 100px !important;
    border: 1.5px solid var(--verde) !important;
}
a.portalCompany.btnArrowRight-lg:hover,
a.portalCompany.btnArrowRight-lg:active,
a.portalCompany.btnArrowRight-lg:focus {
    background-color: #D5E8DC !important;
    color: var(--verde) !important;
    text-decoration: none;
}

/* Logged-in: welcome text and "Cerrar sesión" link */
#header .navbar-top .navbar-nav > li > span.nav-link {
    color: var(--gris);
    font-size: 14px;
    font-weight: 400;
}

/* Icon menu icons */
#header li.icon-menu a .fas,
#header li.icon-menu a:visited .fas {
    color: var(--tinta) !important;
}
.navbar-default .navbar-nav > li.icon-menu > a:hover,
.navbar-default .navbar-nav > li.icon-menu > a:focus {
    color: var(--rojo) !important;
}

/*************************************************************************************
    CAROUSEL
**************************************************************************************/
.hero { position: relative; width: 100%; margin-bottom: 50px;}

.hero__media {width: 100%; height: 100%; position: absolute; top: 0; left: 0; overflow: hidden; /*z-index: -2;*/}
.hero__media-image, .hero__media-image--mobile {position: absolute; display: block; min-width: 100%; height: auto; min-height: 100%; top: 50%; left: 50%; -webkit-transform: translate(-50%,-50%); transform: translate(-50%,-50%); z-index: -2;}
.hero__media-image--mobile {position: absolute; display: block; min-width: 100%; height: auto; min-height: 100%; top: 50%; left: 50%; -webkit-transform: translate(-50%, -50%); transform: translate(-50%, -50%);}
.hero__media--align-bottom .hero__media-image, .hero__media--align-bottom .hero__media-image--mobile {top: auto; bottom: 0; -webkit-transform: translateX(-50%); transform: translateX(-50%);}
.hero__media--align-top .hero__media-image, .hero__media--align-top .hero__media-image--mobile {top: 0; -webkit-transform: translateX(-50%); transform: translateX(-50%);}
@media (max-width:767px) {
    /*video.hero__media-image {display: none}*/
}
@media (min-width:768px) {
    .hero__media-image--mobile {display: none}
}
.hero__content {position: absolute; bottom: 0; left: 25px; right: 25px; padding-bottom: 1rem; color: #fff; /*z-index: 10;*/}

@media (min-width:992px) {
    .hero__content {padding-bottom: 2rem;}
}

.hero--fullwidth .hero__content {padding-bottom: 2.5rem;}

@media (min-width:992px) {
    .hero--fullwidth .hero__content {padding-bottom: 3.5rem;}
}

#featuredNewsCarousel .carousel-inner{}
@media (max-width:767px) {
    #featuredNewsCarousel .carousel-inner .cuadrotrans{padding: 20px; margin-top: 100px;}
    #featuredNewsCarousel .carousel-inner .cuadrotrans h1{font-size: 20px;}
    #featuredNewsCarousel .carousel-inner .cuadrotrans h2{color: #222220; font-size: 14px;}
    #featuredNewsCarousel .carousel-container{height: 400px;}
}
@media (min-width:768px) and (max-width: 991px){
    #featuredNewsCarousel .carousel-inner .cuadrotrans{padding: 40px; margin-top: 200px;}
    #featuredNewsCarousel .carousel-container{height: 600px;}
}
@media (min-width: 992px){
    #featuredNewsCarousel .carousel-inner .cuadrotrans{padding: 40px; margin-top: 200px;}
    #featuredNewsCarousel .carousel-container{height: 700px;}
}
#featuredNewsCarousel .carousel-inner .cuadrotrans{width: 100%;}
#featuredNewsCarousel .carousel-inner .carousel-item .item-image h1{margin-top:0;}
#featuredNewsCarousel .carousel-inner .cuadrotrans h1{margin-top: 0; color: #fff; text-transform: uppercase; margin-bottom: 10px; font-size: 22px;}
#featuredNewsCarousel .carousel-inner .cuadrotrans h2{color: #222220; font-size: 16px;}

@media (min-width: 992px){
    #featuredNewsCarousel .carousel-caption{bottom: 0; width: 100%; left: 0; height: 150px; background: linear-gradient(to top, rgba(0,0,0,0.85) 0%, rgba(0,0,0,0) 100%); font-size: 14px;}
}
@media (min-width: 768px) and (max-width: 991px){
    #featuredNewsCarousel .carousel-caption{bottom: 0; width: 100%; left: 0; height: 150px; background: linear-gradient(to top, rgba(0,0,0,0.85) 0%, rgba(0,0,0,0) 100%); font-size: 14px;}
}

@media (max-width: 767px) {
    #featuredNewsCarousel .carousel-item{
        flex-direction: column-reverse;
    }
    #featuredNewsCarousel .carousel-item.active,
    #featuredNewsCarousel .carousel-item-next,
    #featuredNewsCarousel .carousel-item-prev{
        display: flex;
    }
    #featuredNewsCarousel .carousel-caption{
        position: relative;
        top: auto;
        bottom: auto;
        left: auto;
        right: auto;
        width: 100%;
        background-color: #1e1e1e;
        padding: 15px 20px;
        text-align: left;
    }
    #featuredNewsCarousel .carousel-caption h3{
        font-size: 16px;
        margin: 0;
    }
    #featuredNewsCarousel .carousel-caption h3 a{
        color: #fff !important;
    }
    #featuredNewsCarousel .carousel-caption p{
        display: none;
    }
}

#featuredNewsCarousel .carousel-control-next-icon,
#featuredNewsCarousel .carousel-control-prev-icon {
    width: 2.5rem;
    height: 2.5rem;
    border-radius: 50%;
    background-color: #000;               /* círculo negro */
    background-position: center;
    background-repeat: no-repeat;
    background-size: 50% 50%;             /* flecha más chica con espacio */
}

/* Triángulo completo apuntando a la derecha */
#featuredNewsCarousel .carousel-control-next-icon {
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23fff'%3e%3cpolygon points='5,3 13,8 5,13'/%3e%3c/svg%3e");
}

/* Triángulo completo apuntando a la izquierda */
#featuredNewsCarousel .carousel-control-prev-icon {
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23fff'%3e%3cpolygon points='11,3 3,8 11,13'/%3e%3c/svg%3e");
}

/*************************************************************************************
    FOOTER
**************************************************************************************/
#footer {
    color: #fff;
    background: #1e1e1e;
    position: relative;
    border-top: none;
    padding: 60px 0 40px;
}

.copyright {
    background: #1e1e1e;
    filter: brightness(85%);
    padding: 20px 0;
    border-top: 1px solid rgba(255, 255, 255, 0.1);
}

/* Footer Top Section - Logo and Social Media */
.footer-top {
    padding-bottom: 30px;
    border-bottom: 1px solid rgba(255, 255, 255, 0.1);
}

.footer-logo {
    height: 55px;
    max-width: 100%;
    object-fit: contain;
}

.footer-social-media {
    display: flex;
    gap: 15px;
    align-items: center;
    justify-content: flex-end;
}

@media (max-width: 767px) {
    .footer-social-media {
        justify-content: center;
    }
}

.footer-social-media .social-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 40px;
    height: 40px;
    border-radius: 50%;
    background-color: rgba(255, 255, 255, 0.1);
    color: #fff;
    font-size: 18px;
    transition: all 0.3s ease;
    text-decoration: none;
}

.footer-social-media .social-icon:hover {
    background-color: #c00;
    color: #fff;
    transform: translateY(-3px);
}

/* Footer Columns */
.footer-columns {
    padding-top: 40px;
    padding-bottom: 20px;
}

.footer-column {
    color: #fff;
}

.footer-column-title {
    font-size: 18px;
    font-weight: 600;
    color: #fff;
    margin-bottom: 20px;
    text-transform: none;
}

.footer-links {
    list-style: none;
    padding: 0;
    margin: 0;
}

.footer-links li {
    margin-bottom: 12px;
    font-size: 14px;
    line-height: 1.6;
}

.footer-links li a {
    color: #fff;
    text-decoration: none;
    transition: color 0.3s ease;
    display: inline-flex;
    align-items: flex-start;
    gap: 8px;
}

.footer-links li a:hover {
    color: #ff5900;
    text-decoration: underline;
}

.footer-links li a i {
    font-size: 14px;
    margin-top: 2px;
    flex-shrink: 0;
}

.footer-links-subtitle {
    font-weight: 600;
    color: #fff;
    margin-top: 15px;
    margin-bottom: 10px;
}

.footer-address {
    display: flex;
    align-items: flex-start;
    gap: 8px;
}

.footer-address i {
    font-size: 14px;
    margin-top: 2px;
    flex-shrink: 0;
}

.footer-address span {
    flex: 1;
}

/* Footer Bottom - Accreditation */
.footer-bottom {
    border-top: 1px solid rgba(255, 255, 255, 0.1);
}

.footer-accreditation-logos {
    max-width: 600px;
    width: 100%;
    height: auto;
}

/* Legacy footer link styles (kept for compatibility) */
#footer h2 {
    font-size: 20px;
}

#footer p {
    font-size: 14px;
}

a.footer_link {
    color: #fff;
}

a.footer_link:hover {
    color: #ff5900;
}

a.footer_link_2 {
    color: #fff;
    text-decoration: underline !important;
}

a.footer_link_2:hover {
    color: #ff5900;
}

.footer_line_left {
    border-left: solid 1px #fff;
}

.footer_column a .fas,
.footer_column a .fab,
.footer_column a .far {
    font-size: inherit;
}

/* Responsive adjustments */
@media (max-width: 991px) {
    .footer-columns {
        padding-top: 30px;
    }

    .footer-column {
        margin-bottom: 30px;
    }

    /* On tablet/mobile, show title for second "Accesos Directos" column */
    .footer-column .footer-column-title.d-none.d-lg-block {
        display: block !important;
    }

    .footer-column .footer-column-title.d-none.d-lg-block::after {
        content: "Accesos Directos";
    }
}

@media (max-width: 767px) {
    #footer {
        padding: 40px 0 30px;
    }

    .footer-column-title {
        font-size: 16px;
    }

    .footer-links li {
        font-size: 13px;
    }
}

/* Ensure 5-column layout on large screens */
@media (min-width: 992px) {
    .footer-columns .col-lg-2 {
        flex: 0 0 auto;
        width: 16.66667%;
    }

    .footer-columns .col-lg-3 {
        flex: 0 0 auto;
        width: 25%;
    }
}

/*************************************************************************************
    FOOTER — Emplea X Chile reskin
    Applies the new brand identity to the global INACAP footer.
    All rules target existing markup classes only; no structural changes.
    Overrides the legacy FOOTER section above using the Task 1 design tokens.
**************************************************************************************/

/* Main footer container: swap #1e1e1e → --marino */
#footer {
    background-color: var(--marino) !important;
    font-family: var(--font-body);
}

/* Dividing lines: slightly visible on dark navy */
.footer-top {
    border-bottom-color: rgba(255, 255, 255, 0.12) !important;
}

.footer-bottom {
    border-top-color: rgba(255, 255, 255, 0.12) !important;
}

/* Column titles: Archivo display font, slightly off-white */
.footer-column-title {
    font-family: var(--font-display);
    font-weight: 700;
    letter-spacing: -0.01em;
    color: #FFFFFF;
}

/* Footer body text and links: IBM Plex Sans */
.footer-column,
.footer-links li,
.footer-links li a {
    font-family: var(--font-body);
}

/* Footer link hover: --rojo instead of #ff5900 */
.footer-links li a:hover {
    color: var(--rojo) !important;
}

/* Subtitle within links (e.g. "Portal de Pago") */
.footer-links-subtitle {
    font-family: var(--font-display);
    font-weight: 600;
    color: rgba(255, 255, 255, 0.7);
}

/* Social icons: rojo on hover instead of #c00 */
.footer-social-media .social-icon:hover {
    background-color: var(--rojo) !important;
}

/* Copyright bar: slightly darker marine for depth */
.copyright {
    background-color: #131C33 !important;
    filter: none !important;
    border-top-color: rgba(255, 255, 255, 0.08) !important;
    font-family: var(--font-body);
}

/* Legacy footer link colors */
a.footer_link:hover {
    color: var(--rojo) !important;
}

a.footer_link_2:hover {
    color: var(--rojo) !important;
}

/*************************************************************************************
    HERO
**************************************************************************************/
.hero{min-height: 350px;}
.box-container-split .box-split .box{padding: 20px;}
@media(max-width: 991px){
    .box-container-split .box-split h3{font-size: 30px;}
    .box-container-split{display: block;}
}
@media(min-width: 992px){
    .hero h2{font-size: 44px;}
    .box-container-split .box-split h3{font-size: 44px;}
}

/*************************************************************************************
    SLIDE COMPANIES
**************************************************************************************/
.slide-companies .slide img{filter:none;}
.slick-prev, .slick-next {top: 70%;}
.slick-track{display: flex !important; align-items: center !important; justify-content: center !important;}
.slide .slide-container{display: flex; flex-wrap: wrap; justify-content: center;}
.slide .slide-container .slide-content{display: flex; align-items: center; justify-content: center;}
@media (min-width: 1100px) {
    .slide img{margin-left: auto; margin-right: auto; max-width: 160px; max-height: 160px;}
}
@media (min-width: 601px) and (max-width: 1099px) {
    .slide img {margin-left: auto; margin-right: auto; max-width: 90px; max-height: 90px;}
}
@media (max-width: 600px) {
    .slide img {margin-left: auto; margin-right: auto; max-width: 70px; max-height: 70px; padding: 5px !important;}
    .slide-companies {padding: 0 10px;}
}
.slick-slider{margin-bottom: 0;}

/*************************************************************************************
    OTHER
**************************************************************************************/
.icon-block .item .title{font-size: 16px;}
.icon-block .item .title{text-transform: none;}
.icon-block .item .icon{font-size: 20px;}

/* Stats section - Mobile first approach */
.stats {
    padding: 20px !important;
    margin: 20px 0 !important;
}

.stats .icon-block {
    margin-bottom: 20px;
}

.stats .icon-block .item {
    padding: 20px 10px !important;
    min-height: 150px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
}

.stats .icon-block .item .title {
    width: 100%;
    text-align: center;
}

.stats .icon-block .item .title .counter {
    font-size: 32px !important;
    font-weight: 700;
    color: #fff;
    line-height: 1.2;
    display: block;
}

.stats .icon-block .item .text {
    font-size: 12px !important;
    font-weight: 500;
    color: #fff;
    line-height: 1.4;
    text-align: center;
    margin-top: 8px;
    padding: 0 5px;
    word-wrap: break-word;
    /* `auto` guionaba en español (lang="es-ES"): "ÚLTI-MOS", "ÚL-TIMO".
       Los labels los escribe el admin, así que nunca deben partirse. */
    hyphens: none;
}

/* Small mobile devices (portrait phones, less than 576px) */
@media (max-width: 575px) {
    .stats {
        border-radius: 15px !important;
    }

    .stats .row {
        margin: 0 !important;
    }

    .stats .icon-block {
        width: 100%;
        flex: 0 0 100%;
        max-width: 100%;
        margin-bottom: 0;
        border-bottom: 1px solid rgba(255, 255, 255, 0.2);
    }

    .stats .icon-block:last-child {
        border-bottom: none;
    }

    .stats .icon-block .item {
        padding: 25px 15px !important;
        min-height: auto;
    }

    .stats .icon-block .item .title .counter {
        font-size: 36px !important;
    }

    .stats .icon-block .item .text {
        font-size: 13px !important;
        max-width: 280px;
        margin-left: auto;
        margin-right: auto;
    }
}

/* Tablets (landscape phones, 576px and up) */
@media (min-width: 576px) and (max-width: 767px) {
    .stats .icon-block .item .title .counter {
        font-size: 40px !important;
    }

    .stats .icon-block .item .text {
        font-size: 13px !important;
    }
}

/* Medium devices (tablets, 768px and up) */
@media (min-width: 768px) and (max-width: 991px) {
    .stats .icon-block .item {
        padding: 30px 15px !important;
    }

    .stats .icon-block .item .title .counter {
        font-size: 50px !important;
    }

    .stats .icon-block .item .text {
        font-size: 15px !important;
    }
}

/* Large devices (desktops, 992px and up) */
@media (min-width: 992px) and (max-width: 1199px) {
    .stats .icon-block .item {
        padding: 50px 20px !important;
    }

    .stats .icon-block .item .title .counter {
        font-size: 60px !important;
    }

    .stats .icon-block .item .text {
        font-size: 18px !important;
    }
}

/* Extra large devices (large desktops, 1200px and up) */
@media (min-width: 1200px) {
    .stats {
        padding: 40px !important;
    }

    .stats .icon-block .item {
        padding: 80px 30px !important;
    }

    .stats .icon-block .item .title .counter {
        font-size: 80px !important;
    }

    .stats .icon-block .item .text {
        font-size: 22px !important;
        /* La columna mide ~526px: con 300px el texto se estrangulaba y saltaba
           de línea sin necesidad. 440px deja aire y evita wraps prematuros. */
        max-width: 440px;
        margin-left: auto;
        margin-right: auto;
    }
}

.home-block{padding: 40px;}
.home-block .home-block-title{font-weight: 600; font-size: 32px; margin-bottom: 40px;}
.home-block .block p{font-size: 16px; margin-bottom: 20px;}
.home-block .block p.home-block-link{border-bottom: 1px solid #222220; padding-top: 20px; padding-bottom: 20px;}
.home-block .block p.home-block-link a{color: #222220; font-size: 18px;}

.nice-list .nice-card, .nice-list .nice-card.background-alt, .nice-list .nice-box.background-alt{background-color: #fff !important; border-radius: 20px;}
.nice-list .nice-card.background-transparent{background-color: transparent !important;}
.background-alt .feature-grab h1 a,
.background-alt .feature-grab h2 a,
.background-alt .feature-grab h3 a,
.background-alt .feature-grab h4 a,
.background-alt .feature-grab h5 a,
.background-alt .feature-grab h6 a,
.background-alt .feature-grab h1 a.title-news,
.background-alt .feature-grab h2 a.title-news,
.background-alt .feature-grab h3 a.title-news,
.background-alt .feature-grab h4 a.title-news,
.background-alt .feature-grab h5 a.title-news,
.background-alt .feature-grab h6 a.title-news{color: #222220 !important; font-size: 18px !important;}
.feature-grab .date{color: #fff !important; font-size: 13px !important;}
.background-alt .feature-grab .highlight{font-size: 14px;}
.background-alt .feature-grab .highlight.color-black .fas, .background-alt .feature-grab .highlight.color-black .far, .background-alt .feature-grab .highlight.color-black .fab{color: #c00 !important;}
.background-alt .feature-grab .thumbnail{background-color: #222220 !important;}

.nice-list .nice-card.background-alt-white, .nice-list .nice-card.background-alt.background-alt-white, .nice-list .nice-box.background-alt.background-alt-white{background-color: #fff !important;}
.background-alt.background-alt-white .feature-grab h1 a,
.background-alt.background-alt-white .feature-grab h2 a,
.background-alt.background-alt-white .feature-grab h3 a,
.background-alt.background-alt-white .feature-grab h4 a,
.background-alt.background-alt-white .feature-grab h5 a,
.background-alt.background-alt-white .feature-grab h6 a,
.background-alt.background-alt-white .feature-grab h1 a.title-news,
.background-alt.background-alt-white .feature-grab h2 a.title-news,
.background-alt.background-alt-white .feature-grab h3 a.title-news,
.background-alt.background-alt-white .feature-grab h4 a.title-news,
.background-alt.background-alt-white .feature-grab h5 a.title-news,
.background-alt.background-alt-white .feature-grab h6 a.title-news{color: #222220 !important;}
.background-alt-white .feature-grab  .date{color: #222220 !important;}
.background-alt.background-alt-white .feature-grab .highlight.color-black{color: #222220 !important;}
.background-alt.background-alt-white .feature-grab .thumbnail{background-color: #fff !important;}


.lead{color:#222220;}

.icon-block.background-grey a:hover * {color: #c00 !important;}

#sub_menu .link{ color: #222220; }

/*************************************************************************************
    CARD
**************************************************************************************/
.card.card-alt{position: relative; overflow: hidden; padding-top: 20px; background-color: #fff !important; border-radius: 20px; --bs-card-border-color: none; border: 1px solid #222220;}
.card.card-alt .card-img-top{height: 180px !important; max-width: 300px !important;}
.card.card-alt .card-img-container{background-color: #fff; text-align: center; border-top-right-radius: 20px; border-top-left-radius: 20px;}
.card.card-alt .card-footer.bg-white:last-child{border-bottom-left-radius: 20px; border-bottom-right-radius: 20px; background-color: #fff !important;}

.card.card-alt h5.card-title{font-size: 18px; color: #222220;}
.card.card-alt .subtitle{font-size: 14px; color: #222220;}
.card.card-alt .card-title a, .card.card-alt .subtitle a{color: #222220 !important;}
.card.card-alt .card-body{padding: 20px;}

.card.card-alt .card-title a:hover, .card.card-alt .subtitle a:hover{color: #c00 !important;}
.card.card-alt .btn-transparent, .card.card-alt .btn-transparent:focus{color: #222220 !important; background-color: transparent !important; border-color: #222220 !important;}
.nice-list .nice-card.btn-border-bottom-second{background-color: #f4f3f3 !important;}

.card.card-alt::before{content: ""; position: absolute; inset: 0 auto auto 0; height: 30px; width: 100%; border-top-left-radius: inherit; border-top-right-radius: inherit; background: #d9d9ff; z-index: 0;}
.card.card-alt .card-body, .card.card-alt .card-footer{ position: relative; z-index: 1;}

.gradient1{background: linear-gradient(20deg, #95da1c, #0441db);}
.gradient2{background: linear-gradient(20deg, #fa7204, #153ccd);}

.card.card-button{border-radius: 20px; border: none;}
.card.card-button .card-title{color: #fff;}
.card.card-button a .icon{color: #fff;}
.card.card-button a .card-title{color: #fff; font-size: 18px !important;}
.card.card-button .card-body{padding: 30px;}

/*************************************************************************************
    HERO — Emplea X Chile: three-audience entry points (Task 4)
    Replaces the news carousel on the public landing.
    Uses Task 1 tokens: --marino, --tinta, --gris, --font-display, --font-body.
    Background image served from S3: inacap/home/hero.jpg (fallback: --marino).
**************************************************************************************/

/* ── Hero image band ─────────────────────────────────────────────────── */
.inacap-hero {
    position: relative;
    min-height: 400px;
    display: flex;
    align-items: center;
    background: var(--marino) url('https://reqlut2.s3.amazonaws.com/reqlut-images/inacap/home/home-exc.jpeg') center center / cover no-repeat;
}

@media (max-width: 820px) { .inacap-hero { min-height: 420px; } }
@media (max-width: 600px) { .inacap-hero { min-height: 380px; } }

/* Dark gradient overlay for legibility */
.inacap-hero::before {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(180deg, rgba(20, 18, 17, 0.15) 0%, rgba(20, 18, 17, 0.82) 100%);
    z-index: 1;
}

.inacap-hero__content {
    position: relative;
    z-index: 2;
    max-width: 1180px;
    margin: 0 auto;
    padding: 52px 32px 44px;
    width: 100%;
}

@media (max-width: 820px) { .inacap-hero__content { padding: 44px 24px 38px; } }
@media (max-width: 480px) { .inacap-hero__content { padding: 36px 20px 32px; } }

.inacap-hero__title {
    font-family: var(--font-display);
    font-size: clamp(28px, 4.2vw, 48px);
    font-weight: 700;
    line-height: 1.1;
    color: #ffffff;
    margin: 0 0 16px;
    max-width: 19ch;
}

.inacap-hero__sub {
    font-family: var(--font-body);
    font-size: 16px;
    line-height: 1.55;
    color: rgba(255, 255, 255, 0.86);
    margin: 0;
    max-width: 52ch;
}

/* ── CTA band: three audience pills on --marino background ───────────── */
.inacap-hero-cta {
    background: var(--marino);
}

.inacap-hero-cta__inner {
    max-width: 1180px;
    margin: 0 auto;
    padding: 26px 32px;
    display: flex;
    gap: 14px;
    flex-wrap: wrap;
    justify-content: center;
}

@media (max-width: 480px) { .inacap-hero-cta__inner { padding: 20px; gap: 10px; } }

/* ── Pill buttons ────────────────────────────────────────────────────── */
.inacap-pill {
    display: inline-block;
    padding: 14px 30px;
    font-family: var(--font-body);
    font-size: 13.5px;
    font-weight: 700;
    letter-spacing: 0.03em;
    text-transform: uppercase;
    text-decoration: none;
    border-radius: 100px;
    transition: background 0.18s ease, color 0.18s ease, border-color 0.18s ease;
}

@media (max-width: 600px) { .inacap-pill { padding: 12px 22px; font-size: 12.5px; } }

.inacap-pill--solid {
    background: #ffffff;
    color: var(--tinta);
    border: 1.5px solid #ffffff;
}

.inacap-pill--solid:hover,
.inacap-pill--solid:focus {
    background: #efefef;
    color: var(--tinta);
    text-decoration: none;
}

.inacap-pill--outline {
    background: transparent;
    color: #ffffff;
    border: 1.5px solid rgba(255, 255, 255, 0.75);
}

.inacap-pill--outline:hover,
.inacap-pill--outline:focus {
    background: rgba(255, 255, 255, 0.12);
    color: #ffffff;
    text-decoration: none;
}

/* ── END HERO ─────────────────────────────────────────────────────────── */

/* ═══════════════════════════════════════════════════════════════════════
   SERVICES — six-card grid (Empleos, Prácticas, Coach Laboral,
               Entrenamiento, Actividades, Headhunter)
   ═══════════════════════════════════════════════════════════════════════ */

.inacap-tile {
    display: block;
    position: relative;
    height: 100%;
    background: var(--panel);
    border-radius: 14px;
    padding: 24px 20px;
    text-decoration: none;
    color: inherit;
    transition: background 0.15s ease, transform 0.15s ease, box-shadow 0.15s ease;
}

.inacap-tile:hover,
.inacap-tile:focus {
    background: #efebe3;
    color: inherit;
    text-decoration: none;
    transform: translateY(-3px);
    box-shadow: 0 10px 22px rgba(27, 25, 24, 0.09);
}

.inacap-tile h3 {
    font-size: 16px;
    font-weight: 700;
    line-height: 1.25;
    margin: 0 0 6px;
    color: var(--tinta);
}

.inacap-tile p {
    font-size: 13.5px;
    color: var(--gris);
    line-height: 1.45;
    margin: 0;
}

/* IA badge icon (sparkle) — top-right corner */
.inacap-tile--ia {
    padding-right: 50px;
}

.inacap-tile__ia-icon {
    position: absolute;
    top: 16px;
    right: 16px;
    width: 30px;
    height: 30px;
    color: var(--azul);
}

@media (max-width: 560px) {
    .inacap-tile {
        padding: 20px 18px;
    }

    .inacap-tile--ia {
        padding-right: 46px;
    }

    .inacap-tile__ia-icon {
        width: 26px;
        height: 26px;
    }
}

/* ── END SERVICES ─────────────────────────────────────────────────────── */

/* ═══════════════════════════════════════════════════════════════════════
   TESTIMONIALS — carousel card (quote + person, sourced from misc type
                  "testimonios"). Renders nothing when array is empty.
   ═══════════════════════════════════════════════════════════════════════ */

.inacap-testimonials {
    padding: 0 0 64px;
    background: #ffffff;
}

.inacap-testimonials__wrap {
    max-width: 900px;
    margin: 0 auto;
    padding: 0 20px;
}

.inacap-testimonials__card {
    border-radius: 18px;
    overflow: hidden;
    border: 1px solid var(--linea);
}

/* Each slide is flex: optional photo column + content column */
.inacap-testimonials__slide {
    display: none;
    opacity: 0;
    transition: opacity 0.4s ease;
    margin: 0;
}

.inacap-testimonials__slide--active {
    display: flex;
    opacity: 1;
}

.inacap-testimonials__photo {
    flex: 0 0 40%;
    min-height: 300px;
    overflow: hidden;
}

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

.inacap-testimonials__content {
    flex: 1 1 0;
    background: var(--azul);
    color: #ffffff;
    display: flex;
    flex-direction: column;
    justify-content: center;
    padding: 40px;
    text-align: center;
}

.inacap-testimonials__content--nophoto {
    padding: 48px 60px;
}

.inacap-testimonials__quote {
    font-size: 17px;
    line-height: 1.5;
    color: #ffffff;
    font-weight: 500;
    margin: 0 0 20px;
    font-style: normal;
}

.inacap-testimonials__caption {
    font-size: 13px;
    color: rgba(255, 255, 255, 0.78);
    line-height: 1.4;
}

.inacap-testimonials__name {
    font-weight: 600;
    color: #ffffff;
}

.inacap-testimonials__role {
    font-weight: 400;
}

/* Navigation dots */
.inacap-testimonials__dots {
    display: flex;
    justify-content: center;
    gap: 8px;
    padding: 16px 0;
    background: #ffffff;
}

.inacap-testimonials__dot {
    width: 8px;
    height: 8px;
    border-radius: 50%;
    border: none;
    background: var(--linea);
    cursor: pointer;
    padding: 0;
    transition: background 0.2s ease;
}

.inacap-testimonials__dot--active {
    background: var(--azul);
}

/* Responsive */
@media (max-width: 700px) {
    .inacap-testimonials__slide--active {
        flex-direction: column;
    }

    .inacap-testimonials__photo {
        flex: none;
        min-height: 200px;
        max-height: 240px;
    }

    .inacap-testimonials__content {
        padding: 28px 24px;
    }

    .inacap-testimonials__content--nophoto {
        padding: 28px 24px;
    }

    .inacap-testimonials__quote {
        font-size: 15.5px;
    }
}

@media (max-width: 420px) {
    .inacap-testimonials__content {
        padding: 24px 18px;
    }

    .inacap-testimonials__quote {
        font-size: 14.5px;
    }

    .inacap-testimonials__caption {
        font-size: 12.5px;
    }
}

/* ── END TESTIMONIALS ─────────────────────────────────────────────────── */

/* ═══════════════════════════════════════════════════════════════════════
   CIFRAS (STATS) — Task 7 reskin
   Replaces the old background-image band with a clean light-panel layout.
   Big counter in --rojo (Archivo 900), label in --gris (IBM Plex Sans).
   Scoped to .inacap-cifras so it never bleeds to other portals.
   ═══════════════════════════════════════════════════════════════════════ */

.inacap-cifras {
    padding: 0 0 64px;
}

/* Banda "Cruzada X el Empleo INACAP-CPC" sobre las cifras (fiel al mockup:
   card de ancho completo, marino, texto todo blanco) */
.inacap-cifras__band {
    max-width: 1180px;
    margin: 0 auto 28px;
    padding: 0 20px;
}

.inacap-cifras__band-title {
    margin: 0;
    padding: 18px 28px;
    background: var(--marino);
    color: #ffffff;
    border-radius: 14px;
    text-align: center;
    font-family: var(--font-display);
    font-weight: 700;
    font-size: clamp(15px, 1.8vw, 20px);
    letter-spacing: 0.01em;
}

.inacap-cifras__band-title span {
    margin-left: 6px;
    font-weight: 500;
    color: rgba(255, 255, 255, 0.78);
}

/* Link "Cruzada X el Empleo" del header (estado anónimo) */
.inacap-cruzada-link {
    font-family: var(--font-display);
    font-weight: 700;
}

/* Trigger "Ingresar a la plataforma" (dropdown, estado anónimo) — marino, mockup .dd-trigger.ina */
.inacap-ingresar__trigger {
    font-family: var(--font-display);
    font-weight: 600;
    color: var(--marino);
}

.inacap-ingresar__trigger:hover,
.inacap-ingresar__trigger:focus {
    color: var(--rojo);
}

.inacap-cifras__wrap {
    max-width: 900px;
    margin: 0 auto;
    padding: 48px 32px 64px;
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 24px;
    text-align: center;
    background: var(--panel);
    border-radius: 20px;
}

@media (max-width: 700px) {
    .inacap-cifras__wrap {
        grid-template-columns: 1fr;
        gap: 32px;
        padding: 36px 20px 48px;
    }
}

@media (max-width: 480px) {
    .inacap-cifras__wrap {
        padding: 28px 16px 36px;
        border-radius: 14px;
    }
}

.inacap-cifras__stat {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 10px;
}

/* Counter value: big Archivo bold in --rojo */
.inacap-cifras__stat b,
.inacap-cifras__stat .counter {
    display: block;
    font-family: var(--font-display) !important;
    font-size: clamp(28px, 4.4vw, 52px) !important;
    font-weight: 900 !important;
    line-height: 1 !important;
    letter-spacing: -0.01em;
    color: var(--rojo) !important;
}

/* Label text below the counter */
.inacap-cifras__stat span {
    display: block;
    font-family: var(--font-body);
    font-size: 13.5px;
    color: var(--gris);
    line-height: 1.4;
    text-transform: none;
    hyphens: none;
}

/* ── END CIFRAS ────────────────────────────────────────────────────────── */

/* ═══════════════════════════════════════════════════════════════════════
   JOB OFFERS — Task 7 reskin
   Overrides card-alt cards inside .inacap-ofertas only.
   Shared partial (Reqlut/Home/jobOffers.html.twig) is NOT edited.
   Light panel background, compact border cards matching mockup .job style.
   ═══════════════════════════════════════════════════════════════════════ */

.inacap-ofertas {
    padding: 0 0 64px;
    background: #ffffff;
}

.inacap-ofertas__wrap {
    max-width: 1180px;
    margin: 0 auto;
    padding: 48px 32px 16px;
}

@media (max-width: 767px) {
    .inacap-ofertas__wrap {
        padding: 36px 20px 8px;
    }
}

@media (max-width: 480px) {
    .inacap-ofertas__wrap {
        padding: 24px 16px 8px;
    }
}

.inacap-ofertas__head {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    margin-bottom: 28px;
    flex-wrap: wrap;
    gap: 10px;
}

.inacap-ofertas__head h2 {
    font-family: var(--font-display) !important;
    font-size: clamp(20px, 2.4vw, 25px) !important;
    font-weight: 700 !important;
    letter-spacing: -0.01em;
    color: var(--tinta) !important;
    margin: 0 !important;
}

.inacap-ofertas__more {
    color: var(--marino);
    font-weight: 600;
    text-decoration: none;
    white-space: nowrap;
}

.inacap-ofertas__more:hover {
    color: var(--rojo);
}

/* ── Agenda de actividades (solo logueado) ── */
.inacap-actividades {
    padding: 0 0 64px;
    background: var(--panel);
}

.inacap-actividades__wrap {
    max-width: 1180px;
    margin: 0 auto;
    padding: 48px 32px 16px;
}

.inacap-actividades__head {
    margin-bottom: 28px;
}

.inacap-actividades__head h2 {
    font-family: var(--font-display) !important;
    font-size: clamp(20px, 2.4vw, 25px) !important;
    font-weight: 700 !important;
    letter-spacing: -0.01em;
    color: var(--tinta) !important;
    margin: 0 !important;
}

.inacap-actividades__more {
    text-align: center;
    margin-top: 20px;
}

.inacap-actividades__more a {
    color: var(--marino);
    font-weight: 600;
    text-decoration: none;
}

.inacap-actividades__more a:hover {
    color: var(--rojo);
}

/* Card reskin: clean border, no colored top-strip, no shadow */
.inacap-ofertas .card.card-alt {
    border: 1px solid var(--linea) !important;
    border-radius: 6px !important;
    background: #ffffff !important;
    box-shadow: none !important;
}

.inacap-ofertas .card.card-alt::before {
    display: none !important;
}

/* Card title link */
.inacap-ofertas .card.card-alt h5.card-title,
.inacap-ofertas .card.card-alt .card-title a {
    font-family: var(--font-body);
    font-size: 15px !important;
    font-weight: 700;
    line-height: 1.3;
    color: var(--tinta) !important;
}

.inacap-ofertas .card.card-alt .card-title a:hover {
    color: var(--rojo) !important;
}

/* Company name + location (subtitle) */
.inacap-ofertas .card.card-alt .subtitle,
.inacap-ofertas .card.card-alt .subtitle a {
    font-size: 13.5px !important;
    color: var(--gris) !important;
}

.inacap-ofertas .card.card-alt .subtitle a:hover {
    color: var(--tinta) !important;
}

/* Apply button in offers: outline dark style */
.inacap-ofertas .card.card-alt .btn-transparent,
.inacap-ofertas .card.card-alt .btn-transparent:focus {
    background-color: transparent !important;
    border-color: var(--tinta) !important;
    color: var(--tinta) !important;
    border-radius: 100px !important;
    font-size: 13px;
    font-weight: 600;
    padding: 6px 16px !important;
}

.inacap-ofertas .card.card-alt .btn-transparent:hover {
    background-color: var(--tinta) !important;
    border-color: var(--tinta) !important;
    color: #ffffff !important;
}

/* Hover on card itself */
.inacap-ofertas .card.card-alt:hover {
    border-color: var(--tinta) !important;
}

/* ── END JOB OFFERS ────────────────────────────────────────────────────── */

/* ═══════════════════════════════════════════════════════════════════════
   EMPRESAS (COMPANIES STRIP) — Task 7 reskin
   Wraps the existing slide.html.twig carousel inside a white border card.
   Logo images are desaturated by default; full color on hover.
   Scoped to .inacap-empresas.
   ═══════════════════════════════════════════════════════════════════════ */

.inacap-empresas {
    padding: 0 0 64px;
}

.inacap-empresas__wrap {
    max-width: 1180px;
    margin: 0 auto;
    padding: 0 32px;
}

@media (max-width: 767px) {
    .inacap-empresas__wrap {
        padding: 0 20px;
    }
}

@media (max-width: 480px) {
    .inacap-empresas__wrap {
        padding: 0 16px;
    }
}

.inacap-empresas__head {
    margin-bottom: 0;
}

.inacap-empresas__head h2 {
    font-family: var(--font-display) !important;
    font-size: clamp(20px, 2.4vw, 25px) !important;
    font-weight: 700 !important;
    letter-spacing: -0.01em;
    color: var(--tinta) !important;
    margin: 0 !important;
}

/* White border card wrapping the slider */
.inacap-empresas__card {
    background: #ffffff;
    border: none;
    border-radius: 14px;
    padding: 24px 16px;
    overflow: hidden;
}

/* Logos del carrusel: usan el tamaño general de .slide img (hasta 160px, a color),
   igual que en release. Sin override de tamaño/grayscale específico de INACAP. */

/* ═══════════════════════════════════════════════════════════════════════
   CTA FINAL — "Únete hoy a esta red…" closing section
   ═══════════════════════════════════════════════════════════════════════ */

.inacap-cta-final {
    padding: 0 0 64px;
    text-align: center;
}

.inacap-cta-final__inner {
    max-width: 1180px;
    margin: 0 auto;
    padding: 0 32px;
}

.inacap-cta-final__title {
    font-family: var(--font-display) !important;
    font-size: clamp(24px, 3.2vw, 34px) !important;
    font-weight: 700 !important;
    line-height: 1.22;
    color: var(--marino) !important;
    max-width: 32ch;
    margin: 0 auto 28px !important;
}

.inacap-cta-final__actions {
    display: flex;
    gap: 16px;
    justify-content: center;
    flex-wrap: wrap;
}

/* Pill variant for light (white) background: marino-coloured outlines */
.inacap-pill--dark.inacap-pill--outline {
    color: var(--marino);
    border-color: var(--marino);
}

.inacap-pill--dark.inacap-pill--outline:hover,
.inacap-pill--dark.inacap-pill--outline:focus {
    background: #eef2f7;
    color: var(--marino);
}

/* Solid pill on white background: marino fill */
.inacap-cta-final .inacap-pill--solid {
    background: var(--marino);
    color: #ffffff;
    border-color: var(--marino);
}

.inacap-cta-final .inacap-pill--solid:hover,
.inacap-cta-final .inacap-pill--solid:focus {
    background: #16203a;
    border-color: #16203a;
    color: #ffffff;
}

@media (max-width: 600px) {
    .inacap-cta-final {
        padding: 0 0 48px;
    }

    .inacap-cta-final__inner {
        padding: 0 20px;
    }
}

/* ── END CTA FINAL ────────────────────────────────────────────────────── */

/* ── END EMPRESAS ─────────────────────────────────────────────────────── */