:root{
  --navy:#0d3266;
  --navy-dark:#082451;
  --orange:#f59a1b;
  --orange-dark:#e47f09;
  --white:#fff;
  --soft:#f4f7fb;
  --text:#14213d;
  --muted:#667085;
  --line:#dfe6f1;
  --shadow:0 20px 55px rgba(8,36,81,.18);
}

*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;font-family:Inter,"Segoe UI",Arial,sans-serif;color:var(--text);background:var(--white)}
img{max-width:100%}
a{color:inherit}
.section{padding:92px 6vw}
.section-kicker,.eyebrow{margin:0 0 14px;color:var(--orange);font-size:13px;font-weight:900;letter-spacing:.16em;text-transform:uppercase}
.section h2{margin:0 0 24px;color:var(--navy-dark);font-size:clamp(34px,4.3vw,62px);line-height:1.02}

.topbar{display:flex;justify-content:center;align-items:center;gap:28px;flex-wrap:wrap;padding:8px 20px;background:var(--navy-dark);color:#dbe7ff;font-size:13px}
.topbar>a{text-decoration:none}
.top-social{display:flex;align-items:center;gap:14px}
.top-social a{color:#fff;font-size:23px;text-decoration:none}

.site-header{position:sticky;top:0;z-index:50;display:flex;align-items:center;justify-content:space-between;min-height:76px;padding:12px 6vw;background:rgba(255,255,255,.95);box-shadow:0 8px 24px rgba(13,50,102,.08)}
.brand{
    display:flex;
    align-items:center;
}

.brand-logo{
    height:42px;      /* o la altura que ya tenga tu logo */
    width:auto;
}

.brand-name{

    height:42px;      /* misma altura que el logo */

    width:auto;

    margin-left:10px;

    object-fit:contain;

    display:block;
}
.nav{display:flex;align-items:center;gap:28px}
.nav a{color:var(--navy);font-size:14px;font-weight:800;text-decoration:none}
.menu-btn{display:none;border:0;border-radius:9px;padding:10px 13px;background:var(--navy);color:#fff;font-size:20px}

.hero{position:relative;min-height:calc(100vh - 118px);display:flex;align-items:center;overflow:hidden;padding:56px 6vw;isolation:isolate}
.hero-bg,.hero-overlay{position:absolute;inset:0}
.hero-bg{
    position:absolute;
    inset:0;
    z-index:-2;

    overflow:hidden;
}

.hero-bg::before{
    content:"";

    position:absolute;
    inset:0;

    background:url("../img/hero-portada.png") center center/cover no-repeat;

    z-index:-1;
}
.hero-video{

    position:absolute;

    top:50%;
    left:50%;

    min-width:100%;
    min-height:100%;

    width:auto;
    height:auto;

    transform:translate(-50%,-50%);

    object-fit:cover;

    z-index:1;
}
.hero-overlay{z-index:-1;background:linear-gradient(90deg,rgba(6,26,61,.72),rgba(8,36,81,.18) 65%,transparent)}
.hero-content{width:min(720px,53%);color:#fff}
.hero h1{margin:0;color:#fff;font-size:clamp(46px,5.6vw,82px);line-height:.98}
.hero h1 span{display:block;margin-top:8px}
.hero-description{max-width:650px;margin:28px 0 0;color:#eef4ff;font-size:19px;line-height:1.65}
.hero-actions{display:flex;flex-wrap:wrap;gap:14px;margin-top:36px}
.btn{display:inline-flex;align-items:center;justify-content:center;border:2px solid transparent;border-radius:999px;padding:14px 24px;font-weight:900;text-decoration:none}
.btn.primary{background:var(--orange);color:#fff}
.btn.ghost{border-color:#fff;color:#fff;background:rgba(255,255,255,.04)}

.company-overview{
  position:relative;
  display:grid;
  grid-template-columns:minmax(0,64%) minmax(320px,36%);
  min-height:calc(100vh - 76px);
  overflow:hidden;
  isolation:isolate;
  padding:34px 5.5vw 24px;
}

.overview-bg{
  position:absolute;
  inset:0;
  z-index:-2;
  background:url("../img/hero-portada.png") center center/cover no-repeat;
}

.company-overview::before{
  content:"";
  position:absolute;
  inset:0;
  z-index:-1;
  background:rgba(245,248,252,.84);
}

.overview-left{
  position:relative;
  z-index:3;
  display:flex;
  flex-direction:column;
  width:100%;
  min-width:0;
}

.overview-copy{
  width:100%;
  max-width:940px;
}

.overview-copy h2{
  max-width:850px;
  margin:0 0 14px;
  color:var(--navy-dark);
  font-size:clamp(34px,3.7vw,58px);
  line-height:1.01;
}

.overview-copy>p:not(.section-kicker){
  max-width:900px;
  margin:0 0 10px;
  color:#5e6f8c;
  font-size:15px;
  line-height:1.52;
}

.overview-mv{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:14px;
  width:100%;
  max-width:940px;
  margin-top:10px;
}

.overview-card{
  position:relative;
  min-height:165px;
  overflow:hidden;
  padding:20px 24px;
  border-radius:20px;
}

.mission-card{background:linear-gradient(145deg,var(--navy-dark),var(--navy));color:#fff}
.vision-card{background:rgba(255,255,255,.93);border:1px solid var(--line);color:var(--text)}

.overview-card .section-kicker{margin-bottom:8px;font-size:11px}
.overview-card h3{max-width:85%;margin:0 0 8px;font-size:20px;line-height:1.12}
.overview-card>p:last-child{margin:0;font-size:12.5px;line-height:1.42}
.mission-card>p:last-child{color:#dce8fb}
.vision-card>p:last-child{color:var(--muted)}

.overview-card-number{
  position:absolute;
  top:5px;
  right:12px;
  font-size:58px;
  font-weight:900;
  color:rgba(255,255,255,.11);
}

.vision-card .overview-card-number{color:rgba(13,50,102,.08)}

.overview-items{

    width:100%;
    margin-top:18px;

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

    height:90px;
    overflow:hidden;

}

.overview-items img{

    display:block;

    width:100%;
    height:100%;

    object-fit:contain;
    object-position:center center;

}

.overview-person-wrap{
  position:relative;
  z-index:2;
  min-height:100%;
  pointer-events:none;
}

.overview-person{
  position:absolute;
  right:0;
  bottom:-24px;
  display:block;
  width:auto;
  height:94%;
  max-width:100%;
  object-fit:contain;
  object-position:right bottom;
}

.services{position:relative;overflow:hidden;background:var(--soft);min-height:900px;isolation:isolate}
.section-heading{position:relative;z-index:3;max-width:820px;margin-bottom:44px}
.section-heading>p:last-child{margin:0;color:var(--muted);font-size:18px;line-height:1.7}
.service-grid{position:relative;z-index:3;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:22px;width:min(930px,68%)}
.service-card{display:grid;grid-template-columns:132px 1fr;gap:20px;align-items:center;min-height:210px;padding:18px;border:1px solid #e3e9f2;border-radius:22px;background:rgba(255,255,255,.94);box-shadow:0 12px 30px rgba(8,36,81,.08)}
.service-card img{width:132px;height:132px;border-radius:18px;object-fit:cover}
.service-card span{color:var(--orange);font-size:22px;font-weight:900}
.service-card h3{margin:6px 0 10px;color:var(--navy-dark);font-size:21px}
.service-card p{margin:0;color:var(--muted);font-size:14px;line-height:1.55}
.services-person{position:absolute;right:2%;bottom:0;z-index:1;width:auto;height:78%;max-width:32vw;object-fit:contain}

.clients{position:relative;min-height:900px;overflow:hidden;background:linear-gradient(145deg,#071d43,#0d3266);color:#fff}
.clients h2{color:#fff}
.clients-content{position:relative;z-index:3;width:min(930px,68%)}
.client-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:18px;margin-top:34px}
.client-grid article{padding:24px;border:1px solid rgba(255,255,255,.14);border-radius:20px;background:rgba(255,255,255,.07)}
.client-grid span{color:var(--orange);font-size:24px;font-weight:900}
.client-grid p{color:#d8e5f8}
.clients-visual{position:absolute;inset:0;z-index:1}
.clients-visual img{position:absolute;right:1%;bottom:0;width:auto;height:88%;max-width:38vw;object-fit:contain}

.values{position:relative;min-height:900px;overflow:hidden;color:#fff}
.values-bg{position:absolute;inset:0;z-index:-3;background:url("../img/valores-fondo.jpg") center/cover no-repeat}
.values:before{content:"";position:absolute;inset:0;z-index:-2;background:linear-gradient(90deg,rgba(5,24,55,.96),rgba(5,24,55,.46))}
.values-person{position:absolute;right:2%;bottom:0;z-index:-1;width:auto;height:88%;max-width:38vw;object-fit:contain}
.values-content{position:relative;z-index:3;width:min(760px,60%)}
.values h2{color:#fff}
.values-grid{display:grid;gap:14px;margin-top:34px}
.values-grid article{display:grid;grid-template-columns:64px 1fr;gap:18px;align-items:center;padding:16px 20px;border:1px solid rgba(255,255,255,.18);border-radius:18px;background:rgba(8,36,81,.62)}
.values-grid i{display:grid;place-items:center;width:54px;height:54px;border:2px solid var(--orange);border-radius:50%;font-size:24px}
.values-grid h3{margin:0 0 5px;color:var(--orange)}
.values-grid p{margin:0;color:#edf3ff}

.contact{display:grid;grid-template-columns:.85fr 1.15fr;gap:54px}
.contact-form{display:grid;gap:14px}
.contact-form input,.contact-form textarea{width:100%;border:1px solid #d5dbea;border-radius:16px;padding:16px 18px;font:inherit}

footer{display:flex;align-items:center;justify-content:space-between;gap:22px;padding:28px 6vw;background:#061a3d;color:#cfe1ff}
footer img{width:72px;height:52px;object-fit:contain}
.footer-logo{
    height:42px;
    width:auto;
    display:block;
}

.floating-whatsapp{position:fixed;right:24px;bottom:24px;z-index:999;display:grid;place-items:center;width:70px;height:70px;border-radius:50%;background:#25d366;color:#fff;font-size:36px;text-decoration:none}

@media(max-width:900px){
    .topbar{

        display:grid;

        grid-template-columns:1fr 1fr;

        grid-template-areas:
            "phone mail"
            "hours social";

        align-items:center;

        gap:8px 12px;
    }

    .topbar a:nth-of-type(1){
        grid-area:phone;
    }

    .topbar a:nth-of-type(2){
        grid-area:mail;
    }

    .top-hours{
        grid-area:hours;
    }

    .top-social{
        grid-area:social;
        justify-self:end;
    }
  .menu-btn{display:block}
  .nav{display:none;position:absolute;top:70px;right:20px;flex-direction:column;padding:12px;border-radius:16px;background:#fff;box-shadow:var(--shadow)}
  .nav.open{display:flex}
  .section{padding:68px 22px}

  .hero{min-height:600px;align-items:flex-start;padding:20px 16px 25px}
  .hero-content{width:100%}
  .hero .eyebrow{display:none}
  .hero h1{font-size:clamp(34px,10vw,42px)}
  .hero-description{margin-top:70px;font-size:17px}
  .hero-actions{flex-direction:column;align-items:flex-start;margin-top:8px}

  .company-overview{
    display:block;
    min-height:auto;
    padding:48px 20px 28px;
  }

  .overview-left{width:78%}
  .overview-copy h2{font-size:clamp(34px,9vw,44px)}
  .overview-mv{grid-template-columns:1fr}
  .overview-card{min-height:auto}
  .overview-person-wrap{position:absolute;inset:0;z-index:1;overflow:hidden}
  .overview-person{right:-34%;bottom:0;height:72%;max-width:none}

  .service-grid{grid-template-columns:1fr;width:78%}
  .services-person{right:-34%;height:72%;max-width:none}
  .clients-content,.values-content{width:78%}
  .client-grid{grid-template-columns:1fr}
  .clients-visual img,.values-person{right:-34%;height:72%;max-width:none}
  .contact{grid-template-columns:1fr}
  footer{flex-direction:column;text-align:center}
}

@media(max-width:560px){
  .overview-left,.service-grid,.clients-content,.values-content{width:82%}
  .overview-person,.services-person,.clients-visual img,.values-person{right:-44%;height:68%}
}



/* =========================================================
   QUIÉNES SOMOS — PC
   70% contenido / 30% personaje
   Tres filas reales:
   1. Título y texto
   2. Misión y Visión
   3. items.png
========================================================= */

@media (min-width:901px){

  .company-overview{
    position:relative;
    display:grid;
    grid-template-columns:minmax(0,70%) minmax(0,30%);
    min-height:calc(100vh - 76px);
    gap:0;
    padding:46px 5vw 18px;
    overflow:hidden;
    isolation:isolate;
  }

  .overview-left{
    position:relative;
    z-index:3;

    display:grid;
    grid-template-rows:auto auto auto;
    row-gap:18px;

    width:100%;
    min-width:0;
    align-content:start;
  }

  /* FILA 1: TÍTULO Y PÁRRAFOS */
  .overview-copy{
    grid-row:1;
    width:100%;
    max-width:none;
    padding-top:24px;
  }

  .overview-copy h2{
    width:100%;
    max-width:none;
    margin:0 0 14px;

    color:var(--navy-dark);
    font-size:clamp(38px,4vw,64px);
    line-height:1.02;
  }

  .overview-copy>p:not(.section-kicker){
    width:100%;
    max-width:none;
    margin:0 0 10px;

    color:#5e6f8c;
    font-size:16px;
    line-height:1.55;
  }

  /* FILA 2: MISIÓN Y VISIÓN */
  .overview-mv{
    grid-row:2;

    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:18px;

    width:100%;
    max-width:none;
    margin:0;
  }

  .overview-card{
    position:relative;
    min-height:220px;
    overflow:hidden;

    padding:24px 26px;
    border-radius:20px;
  }

  .overview-card .section-kicker{
    margin-bottom:8px;
    font-size:12px;
  }

.overview-card h3{
    max-width:100%;
    margin:0 0 14px;

    font-size:27px;
    line-height:1.18;
}

.overview-card>p:last-child{
    margin:0;

    font-size:17px;
    line-height:1.6;
}

  .overview-card-number{
    font-size:62px;
  }

  /* FILA 3: ITEMS, TOTALMENTE DEBAJO */
.overview-items{
    grid-row:3;

    position:relative;
    z-index:4;

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

    width:100%;
    max-width:none;

    margin-top:90px;      /* prueba entre 40 y 80 */
    margin-bottom:0;

    padding:0;

    overflow:visible;
}

  .overview-items img{
    display:block;

    width:100%;
    height:auto;
    max-width:none;
    max-height:none;

    object-fit:contain;
    object-position:center top;
  }

  /* COLUMNA DERECHA: PERSONAJE */
  .overview-person-wrap{
    position:relative;
    z-index:2;

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

    width:100%;
    height:100%;
    min-height:0;

    pointer-events:none;
  }

  .overview-person{
    position:absolute;
    right:0;
    bottom:0;

    display:block;

    width:auto;
    height:145%;
    max-width:100%;

    object-fit:contain;
    object-position:right bottom;
  }
}




/* =========================================================
   QUIÉNES SOMOS — MÓVIL EN DOS COLUMNAS
   Texto a la izquierda, personaje a la derecha.
   Misión, Visión e items.png siguen debajo a todo el ancho.
========================================================= */

@media (max-width:900px){

  .company-overview{
    position:relative;
    display:grid;
    grid-template-columns:minmax(0,68%) minmax(0,32%);
    grid-template-rows:auto auto auto;
    min-height:auto;
    padding:38px 14px 28px;
    overflow:hidden;
  }

  .overview-left{
    display:contents;
  }

  /* FILA 1: TEXTO */
  .overview-copy{
    grid-column:1;
    grid-row:1;

    position:relative;
    z-index:3;

    width:100%;
    min-height:0;
    padding:0 10px 0 0;
  }

  .overview-copy h2{
    width:100%;
    max-width:none;
    margin:0 0 16px;

    font-size:clamp(32px,9vw,42px);
    line-height:1.04;

    overflow-wrap:normal;
    word-break:normal;
  }

  .overview-copy>p:not(.section-kicker){
    width:100%;
    max-width:none;
    margin-bottom:14px;

    font-size:15px;
    line-height:1.52;

    overflow-wrap:normal;
    word-break:normal;
  }

  /* FILA 1: PERSONAJE EN COLUMNA DERECHA */
.overview-person-wrap{
    grid-column:2;
    grid-row:1;

    position:relative;
    inset:auto;
    z-index:2;

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

    width:100%;
    height:520px;
    min-height:520px;

    overflow:visible;
    pointer-events:none;
}

.overview-person-wrap{
    grid-column:2;
    grid-row:1;

    position:relative;
    z-index:2;

    width:100%;
    height:520px;
    min-height:520px;

    overflow:visible;
    pointer-events:none;
}

.overview-person{
    position:absolute;

    right:-35px;
    bottom:0;

    width:auto;
    height:520px;

    max-width:none;
    max-height:none;

    object-fit:contain;
    object-position:right bottom;

    transform:scale(1.9);
    transform-origin:right bottom;
}

  /* FILA 2: MISIÓN Y VISIÓN */
  .overview-mv{
    grid-column:1 / -1;
    grid-row:2;

    position:relative;
    z-index:4;

    display:grid;
    grid-template-columns:1fr;
    gap:14px;

    width:100%;
    max-width:none;
    margin-top:22px;
  }

  .overview-card{
    width:100%;
    min-height:auto;
  }

  /* FILA 3: ITEMS */
  .overview-items{
    grid-column:1 / -1;
    grid-row:3;

    position:relative;
    z-index:4;

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

    width:100%;
    max-width:none;

    margin-top:36px;
    margin-bottom:0;
    padding:0;
  }

  .overview-items img{
    display:block;
    width:100%;
    height:auto;

    max-width:none;
    max-height:none;

    object-fit:contain;
    object-position:center top;
  }
}

@media (max-width:560px){

  .company-overview{
    grid-template-columns:minmax(0,66%) minmax(0,34%);
    padding-left:14px;
    padding-right:14px;
    
  }

  .overview-copy{
  padding-top: 40px;      
    padding-right:6px;
  }

  .overview-person-wrap{
    min-height:420px;
  }

  .overview-person{
    right:-18px;
    max-width:155%;
    max-height:420px;
      right:-90px;
  }
}



/* =========================================================
   AJUSTE SEGURO SOLO PARA EL PERSONAJE DE "QUIÉNES SOMOS"
   EN CELULAR. No modifica menú, hero ni otras secciones.
========================================================= */

@media (max-width:900px){

  /* Más espacio para el texto y menos para el personaje */
  .company-overview{
    
    grid-template-columns:minmax(0,72%) minmax(0,28%);    
  }

  /* La primera columna conserva el texto completo */
  .overview-copy{
    grid-column:1;
    grid-row:1;
    min-height:0;
    padding-right:8px;
  }

  /* La columna del personaje toma exactamente la altura
     de la misma fila donde están título y párrafos */
  .overview-person-wrap{
    grid-column:2;
    grid-row:1;

    position:relative;
    inset:auto;

    align-self:stretch;

    width:100%;
    height:auto;
    min-height:0;

    overflow:visible;
    pointer-events:none;
    
    transform:translateX(65px);
  }

  /* El personaje comienza junto al título y termina
     junto al final del texto, manteniendo proporciones */
  .overview-person{
    position:absolute;

    top:40px;
    right:-130px;
    bottom:0;

    width:auto;
    height:calc(100% - 40px);

    max-width:none;
    max-height:none;

    object-fit:contain;
    object-position:right bottom;

    transform:none;
  }
}

@media (max-width:560px){

  .company-overview{
    
    grid-template-columns:minmax(0,72%) minmax(0,28%);    
  }

  .overview-copy{
    padding-right:5px;
  }

  .overview-person{
    top:40px;
    right:-94px;
    height:calc(100% - 40px);
  }

    .overview-person-wrap{
        transform:translateX(65px);
    }  
  
}



/* =========================================================
   ICONOS INDEPENDIENTES — AJUSTE FINAL
========================================================= */

.overview-items{
  display:grid !important;
  grid-template-columns:repeat(4,minmax(0,1fr)) !important;
  align-items:start !important;
  justify-content:stretch !important;
  width:100% !important;
  max-width:none !important;
  height:auto !important;
  overflow:visible !important;
  gap:24px !important;
  padding:0 !important;
}

.overview-item{
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:flex-start;
  min-width:0;
  text-align:center;
}

.overview-item img{
  display:block;
  width:88px !important;
  height:88px !important;
  max-width:100% !important;
  max-height:none !important;
  object-fit:contain !important;
}

.overview-item span{
  margin-top:12px;
  color:#17386c;
  font-size:18px;
  font-weight:800;
  line-height:1.15;
  letter-spacing:.4px;
  text-align:center;
  text-transform:uppercase;
}

@media (min-width:901px){
  .overview-items{
    grid-row:3;
    margin-top:90px !important;
    margin-bottom:0 !important;
  }
}

@media (max-width:900px){
  .overview-items{
    grid-column:1 / -1;
    grid-row:3;
    gap:12px !important;
    margin-top:36px !important;
    margin-bottom:0 !important;
  }

  .overview-item img{
    width:58px !important;
    height:58px !important;
  }

  .overview-item span{
    margin-top:8px;
    font-size:11px;
    line-height:1.1;
  }
}

@media (max-width:560px){
  .overview-items{
    gap:8px !important;
  }

  .overview-item img{
    width:50px !important;
    height:50px !important;
  }

  .overview-item span{
    font-size:9px;
  }
}

/* ==========================================
   OCULTAR PERSONAJES EN CELULAR
   (excepto Nosotros)
========================================== */

@media (max-width:900px){

    .services-person,
    .clients-visual img,
    .values-person{

        display:none;

    }

    .service-grid,
    .clients-content,
    .values-content{

        width:100%;

    }

}



/* =========================================================
   CORRECCIÓN FINAL DEL HEADER
   Solo controla el isotipo izquierdo y almafront.png centrado.
========================================================= */

.site-header{
  position:sticky;
  top:0;
  z-index:50;
  height:76px;
  min-height:76px;
  padding:12px 6vw;
  overflow:visible;
}

.site-header .brand{
  position:relative;
  z-index:3;
  display:flex;
  align-items:center;
  flex:0 0 auto;
  height:42px;
}

.site-header .brand > img{
  display:block;
  width:58px;
  height:48px;
  max-width:58px;
  max-height:58px;
  object-fit:contain;
}

.site-header .header-title{
  position:absolute;
  left:50%;
  top:50%;
  z-index:1;
  display:block;
  width:auto;
  height:58px;
  max-width:300px;
  max-height:58px;
  object-fit:contain;
  transform:translate(-50%,-50%);
  pointer-events:none;
}

.site-header .nav,
.site-header .menu-btn{
  position:relative;
  z-index:3;
}

@media (max-width:900px){

  .site-header{
    height:76px;
    min-height:76px;
    padding:12px 16px;
  }

  .site-header .brand,
  .site-header .brand > img{
    width:58px;
    height:58px;
    max-width:58px;
    max-height:58px;
  }

  .site-header .header-title{
    height:58px;
    max-width:150px;
    max-height:58px;
  }
}

.almafront-text{

    position:absolute;

    left:50%;
    top:50%;

    transform:translate(-50%,-50%);

    text-align:center;

    line-height:1;

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

    z-index:2;
}

.almafront-title{

    font-size:34px;
    font-weight:900;
    letter-spacing:-1px;
    line-height:1;

    white-space:nowrap;
}

.almafront-title .alma{

    color:#17386E !important;
}

.almafront-title .front{

    color:#F79A1F !important;
}

.almafront-subtitle{

    margin-top:2px;

    font-size:14px;
    font-weight:700;

    color:#17386E !important;

    white-space:nowrap;
}

@media (max-width:900px){

    .almafront-text{
        left:50%;
        transform:translate(-50%,-50%);
    }

    .almafront-title{
        font-size:26px;
        letter-spacing:-1px;
    }

    .almafront-subtitle{
        font-size:10px;
    }
}
/* ==========================================
   OCULTAR SECCIÓN VALORES
========================================== */

/* Oculta la opción del menú */
.nav a[href="#valores"]{
    display:none;
}

/* Oculta la sección completa */
#valores{
    display:none;
}
@media (max-width:900px){

    .overview-item{
        display:none;
    }

.service-card,
.client-grid article{

    grid-template-columns:90px 1fr;

    gap:14px;

    padding:14px;
}

.service-card img,
.client-grid article img{

    width:90px;

    height:90px;
}


.service-card h3,
.client-grid article h3{

    font-size:18px;
}


}

.client-grid article{

    display:grid;
    grid-template-columns:132px 1fr;
    gap:20px;
    align-items:center;

    padding:18px;

    border:1px solid rgba(255,255,255,.14);
    border-radius:20px;

    background:rgba(255,255,255,.07);
}

.client-grid article img{

    width:132px;
    height:132px;

    margin:0;

    object-fit:cover;
}

.client-grid article h3{

    margin:0 0 10px;

    color:var(--orange);

    font-size:21px;
}

.client-grid article p{

    margin:0;

    color:#d8e5f8;

    font-size:14px;

    line-height:1.55;
}

.contact-links{

    display:flex;
    flex-direction:column;

    gap:12px;

    margin-top:22px;
}

.contact-links a{

    display:flex;
    align-items:center;
    gap:10px;

    color:var(--navy);

    font-weight:700;

    text-decoration:none;

    transition:.2s;
}

.contact-links a:hover{

    color:var(--orange);

}

.contact-links i{

    width:22px;

    color:var(--orange);

    text-align:center;
}


@media (max-width:900px){

    .clients-content{
        width:100%;
        min-width:0;
    }

    .client-grid{
        width:100%;
        min-width:0;
    }

    .client-grid article{
        width:100%;
        min-width:0;

        grid-template-columns:82px minmax(0,1fr) !important;
        gap:12px !important;

        padding:12px !important;
    }

    .client-grid article img{
        width:82px !important;
        height:82px !important;

        margin:0 !important;
        object-fit:cover;
    }

    .client-grid article > div{
        min-width:0;
    }

    .client-grid article h3{
        font-size:17px !important;
        overflow-wrap:anywhere;
    }

    .client-grid article p{
        font-size:13px !important;
        overflow-wrap:anywhere;
    }



    .hero-video{

    display:none;

    .hero-video{
        display:none !important;
    }

    .hero-bg::before{
        display:block !important;
    }


}
}