/* Generales */
:root {
    --brand: #0b7fb3;
    /* Azul EthicsGlobal */
    --brand-dark: #095e83;
    --accent: #2bb673;
    /* Verde acentos */
    --ink: #1b1f23;
    --muted: #5b6673;
    --bg: #ffffff;
    --bg-alt: #f5f8fa;
    --ring: rgba(11, 127, 179, .25);
    --radius: 18px;
    --shadow: 0 10px 30px rgba(0, 0, 0, .06);
}
* {
    box-sizing: border-box;
}
html, body {
    margin: 0;
    padding: 0;
    background: #ffffff;
    color: #152235;
    font-family: Segoe UI, Tahoma, Geneva, Verdana, sans-serif !important;
}
img {
    max-width: 100%;
    height: auto;
    display: block
}
a {
    color: var(--brand);
    text-decoration: none
}
a:hover {
    color: var(--brand-dark)
}
h1, h2, h3, h4, h5, h6 {
  margin-top: 0;
  margin-bottom: 0.5rem;
  line-height: 1.2;
}
h1 {
  font-size: 2.5rem;
  font-weight: 700;
}
h2 {
  font-size: 2rem;
  font-weight: 700;
}
h3 {
  font-size: 1.75rem;
  font-weight: 700;
}
h4 {
  font-size: 1.5rem;
  font-weight: 500;
}
h5 {
  font-size: 1.25rem;
  font-weight: 500;
}
h6 {
  font-size: 1rem;
  font-weight: 500;
}
p {
  margin-top: 0;
  margin-bottom: 1rem;
  font-size: 1rem;
  font-weight: 400;
  line-height: 1.5;
}
small {
  margin-top: 0;
  margin-bottom: 1rem;
  font-size: 0.75rem;
  font-weight: 300;
  line-height: 1.5;
}
.container {
  width: 100%;
  padding-right: 15px;
  padding-left: 15px;
  margin-right: auto;
  margin-left: auto;
}
.row {
  display: flex;
  flex-wrap: wrap;
  margin-right: -15px;
  margin-left: -15px;
}
section {
  scroll-margin-top: 8rem;
}
.col-1 {
    width: 8.3333%;
    padding: 0 30px;
}
.col-2 {
    width: 16.6667%;
    padding: 0 30px;
}
.col-3 {
    width: 25%;
    padding: 0 30px;
}
.col-4 {
    width: 33.3333%;
    padding: 0 30px;
}
.col-5 {
    width: 41.6667%;
    padding: 0 30px;
}
.col-6 {
    width: 50%;
    padding: 0 30px;
}
.col-7 {
    width: 58.3333%;
    padding: 0 30px;
}
.col-8 {
    width: 66.6666%;
    padding: 0 30px;
}
.col-9 {
    width: 75%;
    padding: 0 30px;
}
.col-10 {
    width: 83.3333%;
    padding: 0 30px;
}
.col-11 {
    width: 91.6667%;
    padding: 0 30px;
}
.col-12 {
    width: 100%;
    padding: 0 30px;
}

/* Powered by EthicsGlobal */
.top_navbar {
    width: 100%;
    background-color: #009ed7;
    position: fixed;
    top: 0px;
    z-index: 100;
}
.top_navbar .top_navbar_container {
    max-width: 80%;
    margin: 0 auto;
    display: block;
    padding: 10px 0;
    position: relative;
}
.top_navbar .top_navbar_container .d-flex {
    display: flex !important;
}
.top_navbar .top_navbar_container a {
    color: #fff;
    font-size: 11px;
    font-weight: 600;
}
.top_navbar .top_navbar_container .langselector {
    position: absolute;
    right: 0px;
    top: 50%;
    margin-top: -12px;
}
.langselector {
    box-sizing: border-box;
    display: inline-flex;
    -webkit-box-align: center;
    align-items: center;
    border-radius: 5px;
}
.langselector .selectorlang-select {
    background: linear-gradient(180deg, #ffffff 0%, #f0f2f4 100%);
    border: 1px  solid #bdcad0;
    padding: 2px 10px 2px 10px;
    border-radius: 5px;
    height: auto;
    text-overflow: ellipsis;
    white-space: nowrap;
    overflow: hidden;
}
.langselector:hover .selectorlang-select, .langselector.active .selectorlang-select {
    background: linear-gradient(180deg, #009ed7 0%, #006f97 100%);
    border: none;
}
.langselector .selectLang {
    cursor: pointer;
    min-width: 0px;
    width: 85px;
}
.langselector .language {
    display: flex;
    -webkit-box-align: center;
    align-items: center;
}
.langselector .iconlang {
    width: 1em;
    height: 1em;
}
.langselector:hover .iconlang, .langselector.active .iconlang {
    display: none;
}
.langselector .iconlang-bold {
    display: none;
}
.langselector:hover .iconlang-bold, .langselector.active .iconlang-bold {
    display: block;
    width: 1em;
    height: 1em;
}
.langselector .textlanguage {
    margin: 0px 0px 0px 5px;
    font-size: 12px;
    color: #152235;
}
.langselector:hover .textlanguage, .langselector.active .textlanguage {
    color: #ffffff;
}
.modallang {
    position: fixed;
    z-index: 1300;
    inset: 0px;
    display: none;
}
.modallang.show {
  display: block;
}
.langcontainer {
    box-shadow: 0px 0px 4px rgba(21,34,53,0.5);
    top: 29px;
    right: 10%;
    background-color: #F3F7FA;
    border: 1px solid #D3DBE1;
    position: absolute;
    border-radius: 5px;
    width: 85px;
}
.langcontainer .langlist {
    padding: 0;
    margin: 0;
}
.langcontainer .langlistoption {
    cursor: pointer;
    display: flex;
    padding: 10px;
}
.langcontainer .langlistoption:hover {
    background: rgba(0,158,215,0.2);
}
.langcontainer .langlistoption.listoption-selected:hover {
    background: transparent !important;
    cursor: default;
}
.langcontainer .textlanguage {
    margin: 0;
    font-size: 12px;
    color: #B5C0C8;
}
.langcontainer .langlistoption:hover .textlanguage {
    color: #152235;
}
.langlistoption.listoption-selected .textlanguage {
    color: #D3DBE1;
}
.langlistoption:hover.listoption-selected .textlanguage {
    color: #D3DBE1;
}

/* Header */
header {
    position: fixed;
    top: 35px;
    z-index: 100;
    width: 100%;
    background-color: #ffffff;
    border-bottom: 1px solid #e9eef2;
}
header .header {
    display: flex;
    align-items: center;
    gap: 20px;
    justify-content: space-between;
    max-width: 80%;
    margin: 0 auto;
    padding: 1em 0;
}
.header .logo-eg {
    width: 280px;
}
.header .muted {
    color: #909CA4;
    font-weight: 700;
}
.header .button-header {
    display: flex;
    gap: 15px;
}
.header .menu-btn {
    color: #546F7A;
    font-weight: 700;
    background-color: transparent;
    border: none;
    cursor: pointer;
    display: flex;
    align-items: center;
}
.header .menu-btn:hover {
    color: #009ed7;
    font-weight: 700;
}
.header .menu-btn svg {
    margin-right: 5px;
}
.header .menu-btn svg.icon-bold, .header .menu-btn:hover svg.icon-outline {
    display: none;
}
.header .menu-btn:hover svg.icon-bold {
    display: block;
}
.nav-menu {
    display: none;
    background: #E6EBEF;
    padding: 1rem;
    position: fixed;
    width: 100%;
    box-shadow: 0 4px 8px rgba(21, 34, 53, 0.1);
    z-index: 101;
}
.nav-menu.show {
    display: block;
}
.nav-list {
    list-style: none;
    padding: 0;
    margin: 0;
    display: flex;
    justify-content: center;
    gap: 30px;
}
.nav-item {
    margin-bottom: 0.5rem;
}
.nav-item a {
    color: #009ed7;
    font-weight: 500;
}
.nav-item:hover a {
    color: #152235;
    border-bottom: 2px solid #009ed7;
    padding: 0 0 10px;
}


/* Contenido general */
main {
    background-color: #F3F7FA;
}
.btn-contact .btn-demo, .btn-contact .btn-proof {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    padding: 10px 15px;
    border-radius: 5px;
}
.btn-contact .btn-demo {
    border: 1px solid #009ed7;
    color: #009ed7;
}
.btn-contact .btn-proof {
    background-color: #009ed7;
    border: 1px solid #009ed7;
    color: #ffffff;
    margin-left: 10px;
}
.btn-contact .btn-demo:hover, .btn-contact .btn-proof:hover {
    box-shadow: 0px 0px 4px rgba(21,34,53,0.5);
    background-color: #152235;
    color: #ffffff;
    border: 1px solid #152235;
}

/* Hero */
#hero {
    display: flex;
    margin-top: 137px;
    background: linear-gradient(130deg, #ffffff 45%, #009ed7 100%);
}
#hero .hero {
    max-width: 85%;
    margin: 0 auto;
    padding: 50px 0;
}
.hero h1, .content .lead {
    color: #152235;
}
.hero .content .title span, .hero .content .lead strong {
    color: #009ed7;
}
.hero .content .lead {
    margin: 40px 0;
}
.hero .content .badges {
    display: flex;
    flex-wrap: wrap;
    gap: 20px;
    margin: 40px 0;
}
.hero .content .badges .badge {
    background: #D3DBE1;
    color: #152235;
    font-weight: 500;
    border-radius: 999px;
    padding: 5px 10px;
    font-size: 13px;
    box-shadow: 0px 0px 15px rgba(21,34,53,0.25);
}
.hero .content-panel .content-panel-track {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 18px;
}
.hero .content-panel .content-panel-item {
    background: #ffffff;
    border: 1px solid #D3DBE1;
    border-radius: 5px;
    padding: 15px;
}
.hero .content-panel-item .itemContent {
    display: flex;
    height: 75px;
}
.hero .content-panel-item .itemContent .icon {
    width: 42px;
    height: 42px;
    border-radius: 5px;
    border: 1px solid #D3DBE1;
    background: #F3F7FA;
    display: grid;
    place-items: center;
    margin: 0 15px 10px 0;
}
.hero .content-panel-item .itemContent h3 {
    color: #009ed7;
}

/* Por qué IA */
#por-que-ia .por-que-ia {
    max-width: 85%;
    margin: 0 auto;
    padding: 50px 0;
}
.por-que-ia .title-ia h2 {
    color: #009ed7;
}
.por-que-ia .title-ia {
    margin-bottom: 1rem;
}
.por-que-ia .card-ia {
    background: #ffffff;
    border: 1px solid #D3DBE1;
    border-radius: 5px;
    padding: 15px;
}
.por-que-ia .card-ia .icon {
    width: 42px;
    height: 42px;
    border-radius: 5px;
    border: 1px solid #D3DBE1;
    background: #F3F7FA;
    display: grid;
    place-items: center;
    margin: 0 15px 10px 0;
}
.por-que-ia .card-ia h3 {
    color: #546F7A;
}
.por-que-ia .card-ia .pill {
    background: #D3DBE1;
    font-weight: 500;
    border-radius: 999px;
    padding: 5px 10px;
    font-size: 13px;
    box-shadow: 0px 0px 15px rgba(21,34,53,0.25);
}

/* Qué es */
#que-es {
    background-color: #ffffff;
}
#que-es .que-es {
    max-width: 85%;
    margin: 0 auto;
    padding: 50px 0;
}
.que-es .title-que-es h2 {
    color: #009ed7;
}
.que-es .title-que-es {
    margin-bottom: 1rem;
}
.que-es .card-que-es {
    background: #ffffff;
    border: 1px solid #D3DBE1;
    border-radius: 5px;
    padding: 15px 40px;
    text-align: center;
}
.que-es .card-que-es strong {
    color: #009ed7;
    margin-bottom: 20px;
}

/* Modelo 360 */
#modelo-360 .modelo-360 {
    max-width: 85%;
    margin: 0 auto;
    padding: 50px 0;
}
.modelo-360 .title-modelo-360 h2 {
    color: #009ed7;
}
.modelo-360 .title-modelo-360 {
    margin-bottom: 1rem;
}
.modelo-360 .card-modelo-360 {
    background: #ffffff;
    border: 1px solid #D3DBE1;
    border-radius: 5px;
    padding: 15px;
    margin-bottom: 1rem;
}
.modelo-360 .card-modelo-360 .card-content {
    display: flex;
}
.modelo-360 .card-modelo-360 .card-content .icon {
    width: 42px;
    height: 42px;
    border-radius: 5px;
    border: 1px solid #D3DBE1;
    background: #F3F7FA;
    display: grid;
    place-items: center;
    margin: 0 15px 10px 0;
}
.modelo-360 .card-modelo-360 .card-content h3 {
    color: #009ed7;
}

/* Plataforma */
#plataforma {
    background-color: #ffffff;
}
#plataforma .plataforma {
    max-width: 85%;
    margin: 0 auto;
    padding: 50px 0;
}
.plataforma .title-plataforma h2 {
    color: #009ed7;
}
.plataforma .title-plataforma {
    margin-bottom: 1rem;
}
.plataforma .card-plataforma {
    background: #ffffff;
    border: 1px solid #D3DBE1;
    border-radius: 5px;
    padding: 15px;
}
.plataforma .card-plataforma h3 {
    color: #546F7A;
    text-align: center;
}
.plataforma .kpis {
    background: #F3F7FA;
    box-shadow: 0px 0px 10px 2px rgba(21,34,53,0.2);
    border-radius: 5px;
    border: 2px solid #009ed7;
    padding: 15px;
    text-align: center;
}
.plataforma .kpis .kpi strong {
    display: block;
    font-size: 28px;
    color: #009ed7;
}

/* Analiza */
#analiza .analiza {
    max-width: 85%;
    margin: 0 auto;
    padding: 50px 0;
}
.analiza .title-analiza h2 {
    color: #009ed7;
}
.analiza .title-analiza {
    margin-bottom: 1rem;
}
.analiza .card-analiza {
    background: #ffffff;
    border: 1px solid #D3DBE1;
    border-radius: 5px;
    padding: 15px;
}
.analiza .card-analiza h3 {
    color: #546F7A;
    text-align: center;
}

/* Chatbot y atención */
#atencion-ia-humanos {
    background-color: #ffffff;
}
#atencion-ia-humanos .atencion-ia-humanos {
    max-width: 85%;
    margin: 0 auto;
    padding: 50px 0;
}
.atencion-ia-humanos .title-atencion-ia-humanos h2 {
    color: #009ed7;
}
.atencion-ia-humanos .title-atencion-ia-humanos {
    margin-bottom: 1rem;
}
.atencion-ia-humanos .card-atencion-ia-humanos {
    background: #ffffff;
    border: 1px solid #D3DBE1;
    border-radius: 5px;
    padding: 15px;
}
.atencion-ia-humanos .card-atencion-ia-humanos h3 {
    color: #546F7A;
    text-align: center;
}

/* Sectores */
#sectores .sectores {
    max-width: 85%;
    margin: 0 auto;
    padding: 50px 0;
}
.sectores .title-sectores h2 {
    color: #009ed7;
}
.sectores .title-sectores {
    margin-bottom: 1rem;
}
.sectores .card-sectores {
    background: #ffffff;
    border: 1px solid #D3DBE1;
    border-radius: 5px;
    padding: 15px;
    margin-bottom: 1rem;
}
.sectores .card-sectores:hover {
    background: #009ed7;
    border: 1px solid #009ed7;
    box-shadow: 0px 0px 10px 2px rgba(21,34,53,0.2);
    transform: scale(1.2);
}
.sectores .card-sectores strong {
    color: #546F7A;
}
.sectores .card-sectores:hover strong {
    color: #ffffff;
}
.sectores .card-sectores span {
    display: none;
}
.sectores .card-sectores:hover span {
    display: block;
    color: #ffffff;
}

/* Testimonios */
#testimonios {
    background-color: #ffffff;
}
#testimonios .testimonios {
    max-width: 85%;
    margin: 0 auto;
    padding: 50px 0;
}
.testimonios .title-testimonios h2 {
    color: #009ed7;
}
.testimonios .title-testimonios {
    margin-bottom: 1rem;
}
.testimonios .card-testimonios {
    background: #ffffff;
    border: 1px solid #D3DBE1;
    border-radius: 5px;
    padding: 15px 15px 0 15px;
}
.testimonios .card-testimonios p {
    text-align: center;
}
.testimonios .card-testimonios p.muted {
    color: #009ed7;
    font-weight: 500;
    text-align: right;
    margin-top: 20px;
}

/* Seguridad */
#seguridad .seguridad {
    max-width: 85%;
    margin: 0 auto;
    padding: 50px 0;
}
.seguridad .title-seguridad h2 {
    color: #009ed7;
}
.seguridad .title-seguridad {
    margin-bottom: 1rem;
}
.seguridad .table-container {
    max-width: 640px;
    margin: 0 auto;
}
.seguridad .table-container .table-seguridad {
    background: #ffffff;
    border: 1px solid #D3DBE1;
    table-layout: fixed;
    border-collapse: collapse;
    border-radius: 5px;
}
.seguridad .table-container .table-seguridad .table-seguridad-title {
    background-color: #009ed7;
    font-size: 1.25rem;
    color: #ffffff;
}
.seguridad .table-container .table-seguridad .table-seguridad-title th {
    padding: 20px 15px;
    text-transform: uppercase;
}
.seguridad .table-container .table-seguridad td {
    padding: 15px;
    border-bottom: 1px solid #D3DBE1;
}
.seguridad .table-container .table-seguridad tr:not(:first-child):hover {
    background: #F3F7FA;
}
.seguridad .table-container .table-seguridad tr:hover {
    background: #009ed7;
}

/* FAQ */
#faq {
    background-color: #ffffff;
}
#faq .faq {
    max-width: 85%;
    margin: 0 auto;
    padding: 50px 0;
}
.faq .title-faq h2 {
    color: #009ed7;
}
.faq .title-faq {
    margin-bottom: 1rem;
}
.faq .card-faq {
    background: #ffffff;
    border: 1px solid #D3DBE1;
    border-radius: 5px;
    padding: 15px;
    margin-bottom: 1rem;
}
.faq .card-faq h3 {
    color: #546F7A;
}

/* Contacto */
#contacto .contacto {
    max-width: 85%;
    margin: 0 auto;
    padding: 50px 0;
}
.contacto .title-contacto h2 {
    color: #009ed7;
}
.contacto .title-contacto {
    margin-bottom: 1rem;
}
.contacto .btn-contact {
    margin: 4rem 0;
}
.contacto p.muted span {
    color: #546F7A;
    display: block;
}
.contacto p a {
    color: #009ed7;
    font-weight: 700;
}
.contacto p a:hover {
    color: #152235;
}
.contacto form {
    background: #ffffff;
    border: 1px solid #D3DBE1;
    border-radius: 5px;
    padding: 15px;
}
.contacto form input, .contacto form textarea {
    width: 100%;
    padding: 12px;
    border: 1px solid #D3DBE1;
    border-radius: 5px;
}

/* Footer */
.footer {
    max-width: 85%;
    margin: 0 auto;
    padding: 50px 0;
}

/* Responsive */
@media(max-width: 1449px) {
    .col-lg-5 {
        width: 41.6667%;
    }
    .col-lg-6 {
        width: 50%;
    }
    .col-lg-7 {
        width: 58.3333%;
    }
}
@media(max-width: 1200px) {
    .col-md-6 {
        width: 50%;
    }
    .col-md-12 {
        width: 100%;
    }
    .por-que-ia .card-ia, .que-es .card-que-es {
        margin-bottom: 1rem;
    }
}
@media(max-width: 991px) {
    .header .logo-eg {
        width: 220px;
    }
    .button-header .menu-btn {
        display: none;
    }
    .nav-menu {
        display: block !important;
        margin-top: -62px;
    }
    section {
        scroll-margin-top: 12rem;
    }
    #hero {
        margin-top: 190px;
    }
}
@media(max-width: 762px) {
    .col-sm-12 {
        width: 100%;
    }
    .hero .content-panel .content-panel-track {
        grid-template-columns: none;
    }
}

/*
.grid-3 {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 18px
}
.grid-2 {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 18px
}
.grid-4 {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 18px
}
.section {
    padding: 48px 0
}
.section h2 {
    font-size: clamp(22px, 2.4vw, 34px);
    margin: 0 0 10px
}
.lead {
    color: var(--muted);
    margin: 0 0 22px
}
.card {
    background: #fff;
    border: 1px solid #e7edf3;
    border-radius: 16px;
    padding: 20px;
    box-shadow: var(--shadow)
}
.icon {
    width: 42px;
    height: 42px;
    border-radius: 12px;
    background: var(--bg-alt);
    display: grid;
    place-items: center;
    margin-bottom: 10px
}
.icon svg {
    width: 22px;
    height: 22px
}
.pill {
    display: inline-block;
    background: var(--bg-alt);
    padding: 8px 12px;
    border-radius: 999px;
    font-size: 13px;
    color: #2b3a46;
    border: 1px solid #e5edf2
}
.cta-row {
    display: flex;
    flex-wrap: wrap;
    gap: 10px
}
.muted {
    color: var(--muted)
}
.list {
    margin: 0;
    padding: 0 0 0 18px
}
.kpis {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 18px
}
.kpi {
    background: #fff;
    border: 1px solid #e7edf3;
    border-radius: 14px;
    padding: 18px;
    text-align: center
}
.kpi strong {
    display: block;
    font-size: 28px
}
.table {
    width: 100%;
    border-collapse: collapse;
    font-size: 15px
}
.table td,
.table th {
    border-bottom: 1px solid #ecf1f5;
    padding: 10px 8px;
    text-align: left
}
.strip {
    background: var(--bg-alt);
    border-top: 1px solid #e9eef2;
    border-bottom: 1px solid #e9eef2;
    padding: 14px 0
}
.footer {
    padding: 36px 0;
    color: #6b7684;
    font-size: 14px
} */
/* Responsive */
/* @media (max-width:980px) {
    .hero {
        grid-template-columns: 1fr
    }
    .grid-4 {
        grid-template-columns: repeat(2, 1fr)
    }
}
@media (max-width:620px) {
    nav {
        display: none
    }
    .grid-3,
    .grid-2,
    .grid-4,
    .kpis {
        grid-template-columns: 1fr
    }
    .bar {
        gap: 10px
    }
} */
/* Accesibilidad foco */
/* :focus {
    outline: 3px solid var(--ring);
    outline-offset: 2px
} */