/*
Theme Name: GECVAC Theme
Theme URI: https://gecvac.com
Author: Gecvac Automation & Engineering
Author URI: https://gecvac.com
Description: Tema personalizado creado desde cero para Geycva.
Version: 1.0
Text Domain: gecvac-theme
*/

@import url('https://fonts.googleapis.com/css2?family=Titillium+Web:wght@300;400;600;700&display=swap');

/* =========================================================
   ROOT
========================================================= */

:root{
  --gv-green:#118b28;
  --gv-green-two:#62bb2f;
  --gv-black:#0F141A;
  --gv-soft:#F3F8EF;
}

/* =========================================================
   RESET
========================================================= */

*{
  margin:0;
  padding:0;
  box-sizing:border-box;
}

html,
body{
  margin:0 !important;
  padding-top:0 !important;
  height:100%;
}

body{
  display:flex;
  flex-direction:column;
  font-family:"Titillium Web", system-ui, Arial, sans-serif;
  color:var(--gv-black);
}

#page,
.site{
  margin-top:0 !important;
  padding-top:0 !important;
}

/* =========================================================
   LAYOUT
========================================================= */

.gv-container{
  max-width:1400px;
  margin:0 auto;
  padding:0 24px;
}

.section-container{
  max-width:1200px;
  margin:0 auto;
  padding:0 20px;
}

.site-main{
  padding:0;
  flex:1 0 auto;
}

.site-footer{
  flex-shrink:0;
}

/* =========================================================
   HEADER
========================================================= */

.site-header{
  position:sticky;
  top:0 !important;
  z-index:1000;
  margin-top:0 !important;
  background:#f5f5f5;
  box-shadow:none;
  transition:box-shadow .3s ease;
}

.site-header.scrolled{
  box-shadow:0 6px 20px rgba(0,0,0,0.08);
}

.site-header .container{
  max-width:1400px;
  margin:0 auto;
  padding:20px 32px;
  display:flex;
  align-items:center;
}

.site-header .logo img{
  max-height:80px;
  margin-left:0;
  transition:transform .3s ease;
}

.site-header.scrolled .logo img{
  transform:scale(.9);
}

/* =========================================================
   NAVIGATION
========================================================= */

.main-nav{
  margin-left:auto;
}

.main-nav .menu{
  list-style:none;
  display:flex;
  gap:40px;
}

.main-nav .menu a{
  position:relative;
  padding:8px 0;
  font-size:14px;
  font-weight:600;
  letter-spacing:2px;
  text-transform:uppercase;
  text-decoration:none;
  color:#000;
}

.main-nav .menu a::after{
  content:'';
  position:absolute;
  left:0;
  bottom:-2px;
  width:0%;
  height:3px;
  background:#62bb2f;
  transition:width .3s ease;
}

.main-nav .menu a:hover::after,
.main-nav .current-menu-item > a::after{
  width:100%;
}

/* =========================================================
   MOBILE MENU
========================================================= */

.menu-toggle{
  display:none;
  flex-direction:column;
  gap:6px;
  margin-left:auto;
  background:none;
  border:none;
  cursor:pointer;
}

.menu-toggle span{
  width:24px;
  height:2px;
  background:#000;
  transition:transform .3s ease, opacity .3s ease;
}

.menu-toggle.open span:nth-child(1){
  transform:translateY(8px) rotate(45deg);
}

.menu-toggle.open span:nth-child(2){
  opacity:0;
}

.menu-toggle.open span:nth-child(3){
  transform:translateY(-8px) rotate(-45deg);
}

body.menu-open{
  overflow:hidden;
}

/* =========================================================
   ANIMATIONS
========================================================= */

.is-pre .fx-fade-up{
  opacity:0;
  transform:translateY(24px);
}

.is-pre .fx-scale-img{
  opacity:0;
  transform:scale(.96);
}

.fx-ease{
  transition:
    opacity .9s cubic-bezier(.22,.72,.16,1),
    transform .9s cubic-bezier(.22,.72,.16,1);
}

/* =========================================================
   SOLUTIONS
========================================================= */

.solutions-section{
  padding:80px 0 60px;
}

.solutions-grid{
  display:grid;
  grid-template-columns:1.2fr 1fr;
  gap:64px;
  align-items:center;
}

.solutions-image img{
  width:100%;
  height:auto;
  display:block;
  border-radius:6px;
}

.solutions-content{
  display:flex;
  flex-direction:column;
  justify-content:center;
}

.solutions-section .solutions-content h2.solutions-title{
  margin-bottom:28px;
  text-align:left;
  line-height:1.15;
}

.solutions-section .solutions-content h2.solutions-title .title-line-1,
.solutions-section .solutions-content h2.solutions-title .title-line-2{
  display:block;
  font-size:clamp(28px, 2.6vw, 38px);
  font-weight:700;
  color:var(--gv-green);
}

.solutions-section .solutions-content h2.solutions-title .title-line-2{
  margin-top:8px;
}

.solutions-section .solutions-content p{
  font-size:20px;
  line-height:1.85;
  text-align:justify;
}

.solutions-title{
  display:inline-flex;
  flex-direction:column;
  align-items:center;
  text-align:left;
}

.solutions-title .title-line-1{
  align-self:flex-start;
}

.solutions-title .title-line-2{
  margin-top:4px;
}

/* =========================================================
   CAPABILITIES
========================================================= */

.capabilities-section{
  padding:90px 0 50px;
}

.capabilities-section .capabilities-title{
  color:var(--gv-black);
  font-size:clamp(28px, 2.6vw, 38px);
  font-weight:700;
  text-align:center;
  margin-bottom:60px;
}

.capabilities-title,
.why-inner h3{
  position:relative;
  text-align:center;
}

.capabilities-title::after,
.why-inner h3::after{
  content:"";
  display:block;
  width:250px;
  height:6px;
  background:var(--gv-green);
  margin:12px auto 0;
}

.capabilities-grid{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:36px;
}

.capability-item img{
  width:100%;
  height:190px;
  object-fit:cover;
  border-radius:4px;
  margin-bottom:14px;
}

.capability-item h4{
  color:var(--gv-green);
  font-size:20px;
  font-weight:700;
  text-align:center;
  margin-bottom:6px;
}

.capability-item p{
  font-size:20px;
  line-height:1.6;
  text-align:justify;
}

/* =========================================================
   WHY SECTION
========================================================= */

.why-section{
  padding:60px 0 110px;
}

.why-inner{
  max-width:900px;
  margin:0 auto;
  text-align:center;
}

.why-inner h3{
  color:var(--gv-black);
  font-size:clamp(28px, 2.6vw, 38px);
  font-weight:700;
  margin-bottom:24px;
}

.why-inner p{
  font-size:20px;
  line-height:1.7;
  margin-bottom:30px;
}

.why-tags{
  margin-top:36px;
  font-size:20px;
  line-height:2;
  letter-spacing:.5px;
  font-weight:600;
  color:var(--gv-green);
}

/* =========================================================
   CLIENTS
========================================================= */

.clients-section{
  background:#f6f6f6;
  padding:60px 0 100px;
}

.clients-title{
  text-align:center;
  font-size:clamp(28px, 2.6vw, 38px);
  font-weight:700;
  color:#000;
  margin-bottom:50px;
}

.clients-grid{
  display:grid;
  grid-template-columns:repeat(5,1fr);
  gap:40px 32px;
  align-items:center;
}

.client-logo{
  display:flex;
  align-items:center;
  justify-content:center;
}

.client-logo img{
  max-width:150px;
  max-height:60px;
  width:auto;
  height:auto;
}

/* =========================================================
   PAGE HEADER
========================================================= */

.page-header{
  padding:80px 0 60px;
  background:#ffffff;
}

.page-title{
  position:relative;
  margin-bottom:16px;
  text-align:center;
  font-size:clamp(36px, 3.2vw, 52px);
  font-weight:700;
  color:var(--gv-green);
}

.page-title::after{
  content:"";
  display:block;
  width:120px;
  height:3px;
  background:var(--gv-green);
  margin:14px auto 0;
}

.page-subtitle{
  max-width:860px;
  margin:24px auto 0;
  font-size:18px;
  line-height:1.8;
  text-align:center;
  color:#333;
}

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

.site-footer{
  background:#0f0f0f;
  color:#ccc;
  padding:32px 0;
  font-size:14px;
}

.footer-inner{
  display:flex;
  align-items:center;
  justify-content:space-between;
  flex-wrap:wrap;
  gap:16px;
}

.footer-legal a{
  color:#ccc;
  margin:0 10px;
  text-decoration:none;
}

.footer-legal a:hover{
  color:#62bb2f;
}

.footer-social a{
  color:#fff;
  font-size:18px;
  margin-left:14px;
  text-decoration:none;
}

.footer-social a:hover{
  color:#62bb2f;
}

/* =========================================================
   LANGUAGE SWITCHER
========================================================= */

.footer-language-switcher{
  position:relative;
  display:inline-block;
  font-size:13px;
}

.language-current{
  display:flex;
  align-items:center;
  gap:6px;
  padding:6px 10px;
  background:none;
  border:1px solid #fff;
  color:#fff;
  cursor:pointer;
}

.language-current .arrow{
  font-size:10px;
}

.language-dropdown{
  position:absolute;
  bottom:110%;
  left:0;
  top:auto;
  display:none;
  min-width:60px;
  background:#000;
  border:1px solid #444;
  z-index:10;
}

.language-dropdown a{
  display:block;
  padding:6px 10px;
  color:#fff;
  text-decoration:none;
  text-align:left;
}

.language-dropdown a:hover{
  background:#222;
}

.footer-language-switcher.open .language-dropdown{
  display:block;
}

/* =========================================================
   QUIÉNES SOMOS
========================================================= */

/* HERO */

.hero-about{
  position:relative;
  display:flex;
  align-items:center;
  justify-content:center;
  text-align:center;
  min-height:420px;
  overflow:hidden;
}

.hero-about__bg{
  position:absolute;
  inset:0;
  opacity:.25;
  filter:brightness(.9);
}

.hero-about__inner{
  position:relative;
  z-index:1;
  max-width:1000px;
  padding:0 20px;
}

.gvc-title{
  font-weight:800;
  font-size:clamp(38px,6vw,72px);
  line-height:1.1;
  letter-spacing:.5px;
  text-shadow:0 2px 10px rgba(0,0,0,.08);
}

.gvc-inline{
  display:inline-flex;
  gap:6px;
  font-weight:700;
  color:var(--gv-green);
  font-size:clamp(30px,5vw,56px);
}

/* ABOUT */

.about-split{
  padding:70px 0 60px;
}

.about-split__grid{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:100px;
  align-items:center;
}

.about-text{
  font-size:18px;
  line-height:1.75;
  margin-bottom:14px;
  text-align:justify;
}

.about-split__media{
  border-radius:12px;
  overflow:hidden;
}

.about-split__img{
  width:100%;
  height:100%;
  object-fit:cover;
}

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

@media (max-width:1024px){

  .menu-toggle{
    display:flex;
  }

  .main-nav{
    position:fixed;
    top:var(--header-height);
    left:0;
    width:100vw;
    height:calc(100vh - var(--header-height));
    background:#fff;
    padding-top:24px;
    transform:translateX(-100%);
    transition:transform .35s ease;
    box-shadow:0 12px 30px rgba(0,0,0,.15);
    z-index:999;
  }

  .main-nav.open{
    transform:translateX(0);
  }

  .main-nav .menu{
    flex-direction:column;
    gap:24px;
    padding-left:32px;
  }

  .solutions-grid{
    grid-template-columns:1fr;
    gap:32px;
  }

  .solutions-content{
    margin:0 auto;
    align-items:center;
    text-align:center;
  }

  .solutions-title{
    align-items:center;
  }

  .solutions-title .title-line-1,
  .solutions-title .title-line-2,
  .solutions-section .solutions-content p,
  .solutions-section .solutions-content h2.solutions-title{
    text-align:center;
  }

  .capabilities-grid{
    grid-template-columns:repeat(2,1fr);
    gap:24px;
  }

  .clients-grid{
    grid-template-columns:repeat(3,1fr);
    gap:36px;
  }
}

@media (max-width:900px){

  .about-split{
    padding:50px 0;
  }

  .about-split__grid{
    grid-template-columns:1fr;
    gap:40px;
  }

  .about-split__media{
    order:1;
  }

  .about-card{
    order:2;
  }

  .about-text{
    text-align:left;
    font-size:17px;
  }

  .hero-about{
    min-height:360px;
  }

  .gvc-inline{
    flex-direction:column;
  }
}

@media (max-width:768px){

  .footer-inner{
    flex-direction:column;
    text-align:center;
  }
}

@media (max-width:600px){

  .main-nav{
    background:#ffffff;
    box-shadow:-8px 0 24px rgba(0,0,0,.15);
  }

  .main-nav .menu li a{
    display:block;
    font-size:18px;
    padding:14px 0;
  }

  .gv-container{
    padding-left:20px;
    padding-right:20px;
  }

  .site-header .container{
    padding:14px 20px;
  }

  .site-header .logo img{
    max-height:46px;
  }

  .solutions-section{
    padding:48px 0 36px;
  }

  .solutions-image img{
    width:100%;
    height:220px;
    object-fit:cover;
    border-radius:14px;
    margin-bottom:28px;
  }

  .solutions-title{
    margin-bottom:20px;
  }

  .solutions-title .title-line-1,
  .solutions-title .title-line-2{
    font-size:26px;
    line-height:1.25;
    text-align:center;
  }

  .solutions-section .solutions-content p{
    max-width:480px;
    margin:0 auto;
    text-align:left;
    font-size:16px;
    line-height:1.7;
  }

  .capabilities-section{
    padding:70px 0;
  }

  .capabilities-title{
    font-size:26px;
    margin-bottom:40px;
  }

  .capabilities-title::after{
    width:80px;
    height:3px;
    margin-top:10px;
  }

  .capabilities-grid{
    grid-template-columns:1fr;
    gap:48px;
  }

  .capability-item img{
    width:100%;
    height:220px;
    object-fit:cover;
    border-radius:14px;
    margin-bottom:20px;
  }

  .capability-item h4{
    font-size:18px;
    text-align:center;
    margin-bottom:10px;
  }

  .capability-item p{
    max-width:440px;
    margin:0 auto;
    text-align:left;
    font-size:15px;
    line-height:1.6;
  }

  .why-section{
    padding:50px 0 80px;
  }

  .why-inner{
    margin-top:0;
  }

  .why-inner h3{
    font-size:26px;
  }

  .why-inner h3::after{
    width:70px;
    height:3px;
  }

  .why-inner p{
    max-width:460px;
    margin:0 auto;
    text-align:left;
    font-size:16px;
    line-height:1.7;
  }

  .why-tags{
    font-size:15px;
    line-height:1.9;
    padding:0 10px;
  }

  .clients-section{
    padding:60px 0 20px;
  }

  .clients-title{
    font-size:24px;
    margin-bottom:40px;
  }

  .clients-grid{
    grid-template-columns:repeat(2,1fr);
    gap:32px 20px;
  }

  .client-logo img{
    max-width:120px;
    max-height:50px;
  }

  .site-footer{
    padding:40px 0 48px;
    padding-top:28px;
    text-align:center;
  }

  .site-footer p{
    font-size:14px;
    line-height:1.6;
    margin-bottom:16px;
  }

  .footer-legal{
    display:flex;
    flex-direction:column;
    gap:12px;
    margin-bottom:20px;
  }

  .footer-legal a{
    font-size:14px;
  }

  .footer-social{
    display:flex;
    justify-content:center;
    gap:20px;
  }

  .footer-social a{
    font-size:22px;
  }

  .footer-language-switcher{
    margin:12px auto 0;
  }
}

@media (max-width:560px){

  .capabilities-grid{
    grid-template-columns:1fr;
  }
}

/* =============================== */
/* MISION · VISION · VALORES */
/* =============================== */

#about-mvv{
  padding:80px 0;
}

#about-mvv .wrap{
  max-width:1200px;
  margin:0 auto;
  padding:0 20px;
}

/* ================= MISION / VISION ================= */
.mvv-top{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:60px;
  margin-bottom:70px;
}

.mvv-card{
  background:#fff;
  border-radius:22px;
  padding:80px 30px 35px; /* ✅ espacio para el icono */
  text-align:center;
  position:relative;
  box-shadow:0 12px 30px rgba(0,0,0,.10);
}

.mvv-icon{
  width:100px;
  height:100px;
  border-radius:50%;
  border:3px solid var(--gv-green);
  background:#fff;

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

  position:absolute;
  top:-50px;
  left:50%;
  transform:translateX(-50%);

  z-index:2; /* ✅ IMPORTANTE */
}


.mvv-icon svg{
  width:55px;
  height:55px;
}


/* TITULOS */
.mvv-title{
  margin-top:20px;
  margin-bottom:12px;
  font-size:clamp(26px,3vw,40px);
  font-weight:700;
  color:var(--gv-green);
}

.mvv-text{
  font-size:18px;
  line-height:1.7;
  text-align:justify;
}

/* ================= VALORES ================= */

.values-section{
  text-align:left;
}

.values-title{
  font-size:clamp(26px,3vw,40px);
  font-weight:700;
}

.values-line{
  width:120px;
  height:4px;
  background:var(--gv-green-two);
  margin:10px 0 40px;
}

/* GRID valores */
.values-row{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(140px,1fr));
  gap:30px;
  align-items:center;
}

/* ITEM */
.value-item{
  text-align:center;
}

/* ICONO */
.value-icon{
  width:80px;
  height:80px;
  border-radius:50%;
  background:var(--gv-green);
  display:flex;
  align-items:center;
  justify-content:center;
  margin:0 auto 10px;
}

.value-icon img{
  width:40px;
}

/* LABEL */
.value-label{
  font-size:18px;
  font-weight:700;
}

/* ================= RESPONSIVE ================= */
@media(max-width:900px){

  .mvv-top{
    grid-template-columns:1fr;
    gap:60px;
  }

  .mvv-text{
    text-align:left;
  }

  .values-section{
    text-align:center;
  }

  .values-line{
    margin:10px auto 30px;
  }
}

/* ===== FLECHAS ENTRE VALORES ===== */
.value-arrow{
  font-size:34px;
  color:#000;
  line-height:80px;
  display:flex;
  align-items:center;

  animation:arrowMove 1.6s ease-in-out infinite;
}

@keyframes arrowMove{
  0%{ transform:translateX(0); opacity:.4; }
  50%{ transform:translateX(6px); opacity:1; }
  100%{ transform:translateX(0); opacity:.4; }
}

.value-arrow{
  font-size:34px;
  color:#000;
  display:flex;
  align-items:center;
  justify-content:center;

  animation:arrowMove 1.6s ease-in-out infinite;
}

@keyframes arrowMove{
  0%{ transform:translateX(0); opacity:.4; }
  50%{ transform:translateX(6px); opacity:1; }
  100%{ transform:translateX(0); opacity:.4; }
}

.value-item{
  display:flex;
  flex-direction:column;
  align-items:center;
  text-align:center;
}

.value-icon img{
  width:40px;
  height:40px;
  object-fit:contain;
}

@media(max-width:900px){

  .values-row{
    display:grid;
    grid-template-columns:repeat(2,1fr);
    gap:30px;
  }

  .value-arrow{
    display:none;
  }
}

.mvv-card:hover .mvv-icon{
  transform:translateX(-50%) scale(1.1);
  box-shadow:0 10px 25px rgba(0,0,0,.12);
}

/* ===== INFO POPUP ===== */
.mvv-popup{
  position:absolute;
  top:-20px;
  left:50%;
  transform:translate(-50%, -100%);
  width:260px;

  background:#fff;
  border-radius:12px;
  padding:15px;
  box-shadow:0 12px 30px rgba(0,0,0,.15);

  font-size:14px;
  line-height:1.5;

  opacity:0;
  pointer-events:none;

  transition:all .3s ease;
}

/* flechita */
.mvv-popup::after{
  content:"";
  position:absolute;
  bottom:-8px;
  left:50%;
  transform:translateX(-50%);
  border-width:8px;
  border-style:solid;
  border-color:#fff transparent transparent transparent;
}

/* click activo */
.mvv-card.active .mvv-popup{
  opacity:1;
  transform:translate(-50%, -120%);
  pointer-events:auto;
}

.mvv-card.active .mvv-title,
.mvv-card.active .mvv-text{
  opacity:0;
  visibility:hidden;
}

.mvv-title,
.mvv-text{
  transition:.3s ease;
}

/* ===== ESTADO ACTIVO (SOLO ICONO) ===== */
.mvv-card.active{
  overflow:visible;
  background:#fff; /* se mantiene */
  box-shadow:none;
}

.mvv-card.active .mvv-icon{
  position:relative;
  top:0;
}

.mvv-top{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:60px;
  margin-bottom:70px;

  align-items:stretch; /* ✅ CLAVE */
}

.mvv-card{
  display:flex;
  flex-direction:column;
  justify-content:flex-start;

  height:100%; /* ✅ CLAVE */
  min-height:280px; /* ✅ base uniforme */
}

/* ================= CONTENEDOR ================= */
.gv-timeline-wrap{
  font-family:var(--gv-body-font);
  color:var(--gv-text);
  padding:clamp(60px,6vw,90px) 0;
}

.gv-timeline{
  max-width:1200px;
  margin:0 auto;
  padding-inline:clamp(16px,3vw,32px);
}

/* ================= TÍTULO ================= */
.gv-title{
  margin-bottom:10px;
  text-align:left;
}

.titulo--estilo-1 h2{
  margin:0;
  font-weight:700;
  font-size:clamp(25px,2.7vw,45px);
}

.titulo--estilo-1::after{
  content:"";
  display:block;
  width:300px;
  height:5px;
  background:var(--gv-green-two);
  margin-top:8px;
  margin-bottom:40px;
}

/* ================= TRACK (FIX REAL) ================= */
.gv-track{
  position:relative;
  height:50px; /* ✅ más alto para centrar mejor */
}

/* LINEA BASE */
.gv-line{
  position:absolute;
  left:0;
  right:0;
  top:50%;
  transform:translateY(-50%);
  height:4px;
  border-radius:999px;
  background:var(--gv-muted);
  overflow:hidden;
  z-index:1;
}

/* PROGRESO */
.gv-line::before{
  content:"";
  position:absolute;
  top:0;
  left:0;
  height:100%;
  width:var(--fill,0%);
  background:var(--gv-green);
  transition:width .6s ease;
}

/* ONDA */
.gv-line::after{
  content:"";
  position:absolute;
  top:0;
  left:-30%;
  height:100%;
  width:30%;

  background:linear-gradient(
    90deg,
    transparent,
    rgba(255,255,255,0.9),
    transparent
  );

  filter:blur(2px);
  animation:waveMove 1.8s linear infinite;
}

@keyframes waveMove{
  0%{ transform:translateX(0); }
  100%{ transform:translateX(400%); }
}

/* DOTS */
.gv-dots{
  display:flex;
  justify-content:space-between;
  align-items:center; /* ✅ centra con línea */
  height:100%;
  list-style:none;
  margin:0;
  padding:0;
}

.gv-dot{
  display:flex;
  flex-direction:column;
  align-items:center;
  font-size:12px;
  font-weight:700;
  color:#6b7a87;
  border:none;
  background:none;
  cursor:pointer;
}

.gv-dot .gv-bullet{
  width:16px;
  height:16px;
  background:#d7dde4;
  border:3px solid #e9eef3;
  border-radius:50%;
  position:relative;
  z-index:2; /* ✅ encima de línea */
}

/* ACTIVO */
.gv-dot[aria-selected="true"] .gv-bullet{
  background:var(--gv-green);
  border-color:#c1e5a0;
  transform:scale(1.15);
  box-shadow:0 0 0 6px rgba(119,188,62,.14);
}

.gv-dot[aria-selected="true"] .gv-year{
  color:var(--gv-green);
}

/* ================= PANEL ================= */
.gv-panel{
  display:grid;
  grid-template-columns:1fr 1.2fr;
  gap:28px;
  background:var(--gv-card);
  min-height:320px; /* ✅ AJUSTA SEGÚN TU DISEÑO */
  border-radius:16px;
  padding:18px;
  box-shadow:0 6px 22px rgba(0,0,0,.06);
}

.gv-panel > div{
  max-width:420px;
}

.gv-panel.is-animating{
  animation:fadeSlide .35s ease-out;
}

@keyframes fadeSlide{
  from{opacity:0; transform:translateY(10px);}
  to{opacity:1; transform:translateY(0);}
}

.gv-panel h3{
  font-size:clamp(22px,3vw,28px);
  color:var(--gv-green-two);
}

/* ================= CONTROLES ================= */
.gv-controls{
  display:flex;
  justify-content:space-between;
  margin-top:20px;
  margin-bottom:50px;
}

.gv-btn{
  border:1px solid #d7e6de;
  background:#fff;
  padding:10px 14px;
  border-radius:12px;
  font-weight:700;
  cursor:pointer;
}

.gv-figure{
  display:flex;
  align-items:center;
  justify-content:center;

  height:300px; /* ✅ altura consistente */
  padding:20px; /* ✅ espacio interno */
  background:#fff;
}

.gv-figure img{
  max-width:100%;
  max-height:100%;
  object-fit:cover; /* ✅ MUY IMPORTANTE */
}

.gv-body{
  max-height:140px;
  overflow:hidden;
}

/* ================= MOBILE OPTIMIZATION ================= */
@media (max-width:600px){

  /* ===== TÍTULOS CENTRADOS ===== */
  .gv-title,
  .values-title{
    text-align:center;
  }

  .titulo--estilo-1::after,
  .values-line{
    margin-left:auto;
    margin-right:auto;
  }

  /* ===== MISIÓN / VISIÓN ===== */
  .mvv-top{
    display:flex;
    flex-direction:column;
    gap:40px;
  }

  .mvv-card{
    width:100%;
    text-align:center;
  }

  .mvv-text{
    text-align:left;
  }

  /* ===== VALORES (FIX PRINCIPAL DEL DESORDEN) ===== */
  .values-row{
    display:grid;
    grid-template-columns:1fr 1fr; /* ✅ 2 columnas */
    gap:25px;
    justify-items:center;
  }

  .value-item{
    width:100%;
    text-align:center;
  }

  .value-arrow{
    display:none; /* ✅ elimina flechas */
  }

  /* ===== TIMELINE TRACK ===== */
  .gv-track{
    height:45px;
  }

  .gv-line{
    height:6px;
  }

  /* ===== DOTS ===== */
  .gv-dots{
    justify-content:space-between;
    gap:5px;
  }

  .gv-dot{
    font-size:10px;
  }

  .gv-dot .gv-year{
    font-size:11px;
    margin-top:6px;
  }

  /* ===== PANEL ===== */
  .gv-panel{
    display:grid;
    grid-template-columns:1fr;
    padding:16px;
    gap:16px;
  }

  .gv-body{
    font-size:16px;
    line-height:1.6;
  }

  /* ===== IMÁGENES ===== */
  .gv-figure{
    height:220px;
    display:flex;
    align-items:center;
    justify-content:center;
    overflow:hidden;
  }

  .gv-figure img{
    width:100%;
    height:100%;
    object-fit:cover;
  }

  /* logos como CRP */
  .gv-figure img.is-contain{
    object-fit:contain;
  }

  /* ===== BOTONES ===== */
  .gv-controls{
    display:flex;
    flex-direction:column;
    gap:12px;
    margin-top:20px;
    margin-bottom:40px;
  }

  .gv-btn{
    width:100%;
    padding:12px;
    font-size:16px;
    text-align:center;
  }

}