/* iXibio V2 — misma identidad que V1, optimizada (rendimiento, accesibilidad AA, conversión). */

@font-face { font-family: "Outfit"; font-style: normal; font-weight: 300; font-display: swap; src: url("../fonts/outfit-latin-300-normal.woff2") format("woff2"); }
@font-face { font-family: "Outfit"; font-style: normal; font-weight: 400; font-display: swap; src: url("../fonts/outfit-latin-400-normal.woff2") format("woff2"); }
@font-face { font-family: "Outfit"; font-style: normal; font-weight: 500; font-display: swap; src: url("../fonts/outfit-latin-500-normal.woff2") format("woff2"); }
@font-face { font-family: "Outfit"; font-style: normal; font-weight: 600; font-display: swap; src: url("../fonts/outfit-latin-600-normal.woff2") format("woff2"); }
@font-face { font-family: "Outfit"; font-style: normal; font-weight: 700; font-display: swap; src: url("../fonts/outfit-latin-700-normal.woff2") format("woff2"); }

:root {
  --verde: #5a7342;
  --verde-texto: #4f6339;
  --verde-oscuro: #2f3d22;
  --beige-texto: #776c3a;
  --verde-claro: #87c357;
  --verde-suave: #ecf2e5;
  --beige: #cfc79e;
  --blanco: #ffffff;
  --ancho: 1300px;
  --fuente: "Outfit", sans-serif;
}

*,
*::before,
*::after { box-sizing: border-box; }

html { scroll-behavior: smooth; }

body {
  margin: 0;
  background: var(--blanco);
  color: var(--verde-texto);
  font-family: var(--fuente);
  font-weight: 300;
  font-size: 17.6px;
  line-height: 1.73;
  letter-spacing: 0.04em;
}

img { max-width: 100%; height: auto; display: block; }
a { color: var(--verde); }
h1, h2, h3, h4 { color: var(--verde); font-weight: 400; line-height: 1.3; letter-spacing: 0.03em; }
strong { font-weight: 600; }

.saltar {
  position: absolute; left: -9999px; top: 0;
  background: var(--verde); color: #fff; padding: 8px 16px; z-index: 100;
}
.saltar:focus { left: 8px; }

.pagina { max-width: var(--ancho); margin: 0 auto; padding: 0 55px; }
@media (max-width: 749px) { .pagina { padding: 0 16px; } }

/* ---------- Header ---------- */
.cabecera {
  position: sticky; top: 0; z-index: 40;
  background: var(--blanco);
  border-bottom: 1px solid rgba(90, 115, 66, 0.08);
}
.cabecera__inner {
  display: flex; align-items: center; gap: 24px;
  height: 92px;
}
.cabecera__logo img { width: 180px; height: auto; }
.menu { display: flex; align-items: center; margin: 0; padding: 0; list-style: none; }
.menu > li { position: relative; }
.menu__enlace,
.menu summary {
  display: flex; align-items: center; gap: 6px;
  padding: 13px 14px;
  font-size: 24px; font-weight: 500; line-height: 1;
  color: var(--verde-texto); text-decoration: none; cursor: pointer;
  list-style: none;
}
.menu summary::-webkit-details-marker { display: none; }
.menu__enlace:hover, .menu summary:hover,
.menu__enlace[aria-current="page"] { color: var(--verde); }
.menu__enlace[aria-current="page"] { text-decoration: underline; text-underline-offset: 6px; }
.flecha { width: 10px; height: 6px; transition: transform .2s; }
details[open] > summary .flecha { transform: rotate(180deg); }
.submenu {
  position: absolute; top: 100%; left: 0; min-width: 280px;
  margin: 0; padding: 18px 0; list-style: none;
  background: var(--blanco);
  border: 1px solid rgba(90, 115, 66, 0.1);
  box-shadow: 0 8px 18px rgba(0, 0, 0, 0.06);
}
.submenu a {
  display: block; padding: 8px 24px;
  font-size: 17px; color: var(--verde-texto); text-decoration: none;
}
.submenu a:hover { color: var(--verde); text-decoration: underline; }

.boton-menu {
  display: none; margin-left: auto;
  background: none; border: 0; padding: 8px; cursor: pointer; color: var(--verde);
}
.boton-menu svg { width: 28px; height: 28px; }

@media (max-width: 1099px) {
  .cabecera__inner { height: 76px; }
  .cabecera__logo img { width: 140px; }
  .boton-menu { display: block; }
  .menu {
    display: none;
    position: absolute; top: 100%; left: 0; right: 0;
    flex-direction: column; align-items: stretch;
    background: #f3f3f3; padding: 12px 16px 24px;
    max-height: calc(100vh - 76px); overflow-y: auto;
  }
  .menu.abierto { display: flex; }
  .menu__enlace, .menu summary { font-size: 20px; padding: 14px 8px; }
  .submenu { position: static; border: 0; box-shadow: none; background: transparent; padding: 0 0 8px 16px; }
}

/* ---------- Botón flotante WhatsApp ---------- */
.whatsapp-flotante {
  position: fixed; right: 22px; bottom: 22px; z-index: 50;
  display: flex; align-items: center; justify-content: center;
  width: 56px; height: 56px; border-radius: 50%;
  background: #25d366; color: #fff;
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.18);
  transition: background .3s, transform .3s;
}
.whatsapp-flotante:hover { background: #387d4a; transform: scale(1.05); }
.whatsapp-flotante svg { width: 30px; height: 30px; }
.ir-arriba {
  position: fixed; right: 26px; bottom: 92px; z-index: 50;
  display: flex; align-items: center; justify-content: center;
  width: 48px; height: 48px; border: 0; border-radius: 50%; cursor: pointer;
  background: var(--verde); color: #fff;
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.18);
  opacity: 0; transform: translateY(12px); pointer-events: none;
  transition: opacity .35s, transform .35s, background .3s;
}
.ir-arriba.visible { opacity: 1; transform: none; pointer-events: auto; }
.ir-arriba:hover { background: var(--verde-oscuro); }
.ir-arriba svg { width: 24px; height: 24px; }
@media (prefers-reduced-motion: reduce) { .ir-arriba { transition: none; } }

/* ---------- Banner principal ---------- */
.banner-principal { position: relative; display: block; width: 100%; }
.banner-principal img {
  width: 100%; height: 350px; object-fit: cover; border-radius: 12px;
}
.banner-principal__boton {
  position: absolute; top: 77%; left: 4.5%; transform: translateY(-50%);
  background: var(--verde); color: #fff;
  padding: 10px 22px; border-radius: 20px;
  font-size: 21px; font-weight: 400; text-decoration: none;
  transition: background .3s;
}
.banner-principal__boton:hover { background: var(--verde); }
@media (max-width: 749px) {
  .banner-principal img { height: auto; border-radius: 4px; }
  .banner-principal__boton { font-size: 13px; padding: 5px 12px; top: 72%; }
}

/* ---------- Banners enlazados (Hogar / Empresa) ---------- */
.banners-enlazados {
  display: flex; flex-wrap: wrap; justify-content: center; gap: 20px;
  margin-top: 50px;
}
.banners-enlazados a { width: 635px; max-width: 90%; }
.banners-enlazados img {
  width: 100%; aspect-ratio: 635 / 350; object-fit: cover; border-radius: 8px;
  transition: transform .3s;
}
.banners-enlazados a:hover img { transform: scale(1.01); }

/* ---------- Título con líneas ---------- */
.titulo-lineas {
  display: flex; align-items: center; justify-content: center;
  margin: 2rem 0;
}
.titulo-lineas hr {
  flex: 1 1 0; max-width: 40%; margin: 0 .8rem;
  border: 0; border-top: 2px solid var(--beige);
}
.titulo-lineas h1, .titulo-lineas h2, .titulo-lineas span {
  flex: 0 1 auto; max-width: 70%;
  margin: 0; color: var(--beige-texto); font-size: 36px; font-weight: 300;
  text-align: center; white-space: normal;
}
@media (max-width: 749px) {
  .titulo-lineas hr { max-width: 22%; margin: 0 .3rem; }
  .titulo-lineas h1, .titulo-lineas h2, .titulo-lineas span { font-size: 22px; }
}

/* ---------- Texto enriquecido ---------- */
.texto-centrado {
  max-width: 900px; margin: 0 auto; padding: 0 16px 40px;
  text-align: center; font-size: 20px; line-height: 1.6;
}
.texto-centrado--fuerte { color: var(--verde); }

/* ---------- Aviso "próximamente" (Productos) ---------- */
.proximamente {
  max-width: 900px; margin: 0 auto 60px; padding: 48px 32px;
  background: var(--verde-suave); border-radius: 12px;
  text-align: center;
}
.proximamente__etiqueta {
  display: inline-block; margin-bottom: 14px; padding: 4px 14px;
  border-radius: 20px; background: var(--verde); color: #fff;
  font-size: 14px; letter-spacing: .12em; text-transform: uppercase;
}
.proximamente h2 { margin: 0 0 12px; font-size: 32px; font-weight: 600; }
.proximamente p { margin: 0 auto 24px; max-width: 640px; }
.proximamente--pagina { margin-top: 20px; }

/* ---------- Botones ---------- */
.botones { display: flex; flex-wrap: wrap; gap: 14px; justify-content: center; }
.boton {
  display: inline-flex; align-items: center; justify-content: center; gap: 8px;
  min-height: 51px; padding: 0 33px; border-radius: 23px;
  background: var(--verde); color: #fff; border: 1px solid var(--verde);
  font-family: inherit; font-size: 16.5px; font-weight: 400; letter-spacing: .07em;
  text-decoration: none; cursor: pointer; transition: background .3s, color .3s;
}
.boton:hover { background: #4a5f36; }
.boton--secundario { background: transparent; color: var(--verde); }
.boton--secundario:hover { background: var(--verde); color: #fff; }

/* ---------- Tarjetas con overlay (Impacto / Registros / Operamos) ---------- */
.tarjetas-overlay {
  display: grid; grid-template-columns: repeat(3, 1fr); gap: 10px;
  max-width: 1280px; margin: 0 auto; padding: 0 24px 40px;
}
.tarjeta-overlay {
  position: relative; overflow: hidden; border-radius: 10px;
  background: var(--verde-suave); aspect-ratio: 4 / 3;
}
.tarjeta-overlay > img { width: 100%; height: 100%; object-fit: contain; }
.tarjeta-overlay__capa {
  position: absolute; inset: 0;
  display: flex; flex-direction: column; justify-content: center; align-items: center;
  padding: 15px; text-align: center;
  background: var(--verde); color: #fff; border-radius: 10px;
  opacity: 0; transition: opacity .3s;
}
.tarjeta-overlay:hover .tarjeta-overlay__capa,
.tarjeta-overlay:focus-within .tarjeta-overlay__capa { opacity: 1; }
.tarjeta-overlay__capa h3 { margin: 0 0 8px; color: inherit; font-size: 24px; font-weight: 600; }
.tarjeta-overlay__capa p { margin: 0; color: #fff; }
.tarjeta-overlay__capa img { max-width: 70%; max-height: 80%; }
@media (max-width: 749px) {
  .tarjetas-overlay { grid-template-columns: 1fr; }
}

/* ---------- Blog ---------- */
.blog-destacado { max-width: 1280px; margin: 0 auto; padding: 20px 24px 60px; }
.blog-destacado__cabecera {
  display: flex; justify-content: space-between; align-items: baseline; gap: 16px;
}
.blog-destacado__cabecera h2 { font-size: 28px; margin: 0 0 24px; }
.rejilla-3 { display: grid; grid-template-columns: repeat(3, 1fr); gap: 24px; }
@media (max-width: 989px) { .rejilla-3 { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 649px) { .rejilla-3 { grid-template-columns: 1fr; } }

.tarjeta-articulo { display: flex; flex-direction: column; text-decoration: none; color: inherit; }
.tarjeta-articulo img {
  width: 100%; aspect-ratio: 533 / 320; object-fit: cover; border-radius: 6px;
  transition: transform .3s;
}
.tarjeta-articulo:hover img { transform: scale(1.02); }
.tarjeta-articulo h3 { margin: 16px 0 4px; font-size: 20px; }
.tarjeta-articulo:hover h3 { text-decoration: underline; text-underline-offset: 4px; }
.tarjeta-articulo time { font-size: 14px; }
.tarjeta-articulo p { margin: 8px 0 0; font-size: 15.5px; line-height: 1.6; }
.centrado { text-align: center; margin-top: 32px; }

/* ---------- Artículos y textos legales ---------- */
.articulo { max-width: 820px; margin: 0 auto; padding-bottom: 60px; }
.articulo__portada { width: 100%; border-radius: 10px; margin: 8px 0 28px; }
.articulo h1 { font-size: 36px; font-weight: 600; margin: 24px 0 4px; }
.articulo h2 { font-size: 24px; font-weight: 600; margin: 1.8em 0 .5em; }
.articulo h3 { font-size: 20px; font-weight: 600; margin: 1.4em 0 .4em; }
.articulo p { margin: 0 0 1.1em; }
.articulo ul { margin: 0 0 1.1em; padding-left: 1.3em; }
.articulo li { margin-bottom: .4em; }
.articulo .subtitulo { font-size: 21px; color: var(--verde); }
.volver { display: inline-block; margin-top: 24px; }

/* ---------- Footer ---------- */
.pie { margin-top: 40px; background: var(--beige); color: var(--verde-oscuro); padding: 60px 10px; }
.pie__columnas {
  display: grid; grid-template-columns: .6fr 1fr 1fr .6fr; gap: 28px;
  max-width: var(--ancho); margin: 0 auto;
}
.pie__menu ul { list-style: none; padding: 0; margin: 0 0 24px; display: flex; flex-direction: column; gap: 10px; }
.pie__menu a { color: var(--verde-oscuro); font-size: 20px; text-decoration: none; transition: .3s; }
.pie__menu a:hover { color: var(--verde); padding-left: 5px; }
.pie h2 { margin: 0 0 12px; color: var(--verde); font-size: 24px; font-weight: 400; }
.redes { display: flex; gap: 10px; }
.redes img { width: 24px; height: 24px; transition: transform .2s; }
.redes a:hover img { transform: scale(1.1); }
.pie__contacto p { margin: 0 0 10px; color: var(--verde-oscuro); font-weight: 600; font-size: 17px; line-height: 1.4; }
.pie__contacto a { color: var(--verde-oscuro); text-decoration: none; }
.pie__newsletter h3 { margin: 26px 0 12px; color: var(--verde-oscuro); font-size: 19px; font-weight: 700; }
.newsletter { display: flex; gap: 15px; }
.newsletter input {
  flex: 1; min-width: 0; padding: 10px 12px; border: 1px solid var(--verde); border-radius: 4px;
  background: #fff; font: inherit; font-size: 15px; color: var(--verde-oscuro);
}
.newsletter input::placeholder { color: var(--verde); }
.newsletter button {
  padding: 10px 15px; border: 0; border-radius: 4px;
  background: var(--verde); color: #fff; font: inherit; font-size: 16px; cursor: pointer;
}
.pie__legal { max-width: var(--ancho); margin: 40px auto 0; font-size: 13px; color: var(--verde-oscuro); text-align: center; }
@media (max-width: 989px) {
  .pie__columnas { grid-template-columns: 1fr; text-align: center; }
  .pie__vacio { display: none; }
  .redes { justify-content: center; }
  .newsletter { flex-direction: column; align-items: center; }
  .newsletter input { width: 90%; }
}

/* ---------- 404 ---------- */
.error { text-align: center; padding: 60px 16px 80px; }
.error h1 { font-size: 48px; margin: 0 0 8px; }

/* ---------- Accesibilidad ---------- */
:focus-visible { outline: 2px solid var(--verde); outline-offset: 3px; }
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { transition: none !important; animation: none !important; scroll-behavior: auto !important; }
}
@media (max-width: 749px) {
  .proximamente { padding: 32px 18px; }
  .proximamente h2 { font-size: 24px; }
  .servicio__texto h1, .articulo h1 { font-size: 28px; }
}

/* ---------- Páginas de consultoría ---------- */
.cabecera-servicio { max-width: 1000px; text-align: center; padding-top: 32px; padding-bottom: 8px; }
.cabecera-servicio h1 { margin: 0 0 12px; font-size: 34px; font-weight: 400; }
.cabecera-servicio p { margin: 0 0 1em; text-align: justify; text-align-last: center; }
.cabecera-servicio .lema { color: var(--verde); font-size: 19px; }
.prosa-centrada { max-width: 1000px; }
.prosa-centrada p { text-align: justify; margin: 0 0 1em; }
.lista-limpia { list-style: none; padding: 0; margin: 0; }
.lista-limpia li { margin: 0 0 .7em; font-size: 15.5px; line-height: 1.6; }

.filas { display: flex; flex-direction: column; padding-bottom: 32px; }
.fila { display: grid; grid-template-columns: 1fr 1fr; align-items: center; }
.fila > img { width: 100%; aspect-ratio: 1; object-fit: cover; }
.fila__texto { padding: 32px 48px; }
.fila__texto h2 { margin: 0 0 16px; font-size: 28px; font-weight: 400; }
.fila__texto p { margin: 0; text-align: justify; color: var(--verde); font-weight: 400; }
.fila--invertida > img { order: 2; }
.fila--invertida .fila__texto { order: 1; }
@media (max-width: 749px) {
  .fila { grid-template-columns: 1fr; }
  .fila--invertida > img { order: 0; }
  .fila__texto { padding: 20px 4px 32px; }
  .fila__texto h2 { font-size: 23px; }
}

.beneficios { display: grid; grid-template-columns: repeat(4, 1fr); gap: 16px; padding-bottom: 48px; }
@media (max-width: 989px) { .beneficios { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 549px) { .beneficios { grid-template-columns: 1fr; } }
.beneficio { padding: 28px 22px; background: #f3f3f3; border-radius: 6px; text-align: center; }
.beneficio img { width: 72px; height: 72px; margin: 0 auto 12px; }
.beneficio h3 { margin: 0 0 10px; font-size: 17px; font-weight: 600; }
.beneficio p { margin: 0; font-size: 14.5px; line-height: 1.6; text-align: justify; }

.tarjeta-overlay--foto { aspect-ratio: 1; }
.tarjeta-overlay--foto > img { object-fit: cover; }
.tarjeta-overlay__capa .lista-limpia { text-align: left; }
.tarjeta-overlay__capa .lista-limpia li { color: #fff; font-size: 14px; margin-bottom: .4em; }
.tarjetas-overlay--una { grid-template-columns: minmax(0, 400px); justify-content: center; }
.tarjetas-overlay--una .tarjeta-overlay { aspect-ratio: 441 / 578; }
@media (hover: none) {
  .tarjeta-overlay--foto .tarjeta-overlay__capa { opacity: 1; background: rgba(90, 115, 66, .82); }
}


.enfoque { background: var(--verde); margin-top: 32px; }
.enfoque h2 { margin: 0; padding: 18px 16px; color: #fff; text-align: center; font-size: 22px; font-weight: 600; }
.enfoque__fotos { display: grid; grid-template-columns: repeat(4, 1fr); }
.enfoque__fotos .tarjeta-overlay { border-radius: 0; aspect-ratio: 487 / 540; }
.enfoque__fotos .tarjeta-overlay__capa { border-radius: 0; }
@media (max-width: 749px) { .enfoque__fotos { grid-template-columns: repeat(2, 1fr); } }

.sectores { background: var(--verde); overflow: hidden; padding: 28px 0; }
.sectores__pista {
  display: flex; gap: 24px; width: max-content; margin: 0; padding: 0; list-style: none;
  animation: desplazar 40s linear infinite;
}
.sectores:hover .sectores__pista { animation-play-state: paused; }
.sectores li { width: 220px; text-align: center; color: #fff; }
.sectores li img { width: 45px; height: 45px; margin: 0 auto 8px; }
.sectores h3 { margin: 0 0 4px; color: #fff; font-size: 16px; font-weight: 400; }
.sectores p { margin: 0; color: #fff; font-size: 13.5px; line-height: 1.45; }
@keyframes desplazar { to { transform: translateX(-50%); } }
@media (prefers-reduced-motion: reduce) {
  .sectores__pista { width: auto; flex-wrap: wrap; justify-content: center; animation: none; }
  .sectores li[aria-hidden="true"] { display: none; }
}

.rejilla-consultorias { display: grid; grid-template-columns: repeat(4, 1fr); gap: 16px; padding-bottom: 32px; }
@media (max-width: 989px) { .rejilla-consultorias { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 549px) { .rejilla-consultorias { grid-template-columns: 1fr; } }
.tarjeta-consultoria {
  display: flex; flex-direction: column; align-items: center; padding: 28px 20px;
  background: #f3f3f3; border-radius: 6px; text-align: center;
}
.tarjeta-consultoria img { width: 96px; height: 96px; margin-bottom: 16px; }
.tarjeta-consultoria h3 { margin: 0 0 10px; font-size: 19px; font-weight: 600; }
.tarjeta-consultoria p { flex: 1; margin: 0 0 18px; font-size: 14.5px; line-height: 1.6; }
.tarjeta-consultoria .boton { min-height: 42px; padding: 0 24px; border-radius: 4px; font-size: 15px; }

/* ---------- Formularios de solicitud ---------- */
.bloque-formulario {
  display: grid; grid-template-columns: 1.6fr 1fr; gap: 32px; align-items: start;
  margin-bottom: 60px; padding: 24px; border: 1px solid rgba(90, 115, 66, .12); border-radius: 8px;
}
.bloque-formulario__imagen { width: 100%; height: 100%; object-fit: cover; border-radius: 6px; }
@media (max-width: 849px) {
  .bloque-formulario { grid-template-columns: 1fr; padding: 16px; }
  .bloque-formulario__imagen { display: none; }
}
.formulario { display: grid; gap: 16px; }
.formulario .doble { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }
@media (max-width: 599px) { .formulario .doble { grid-template-columns: 1fr; } }
.formulario label, .formulario legend { display: block; font-size: 15px; margin-bottom: 4px; color: var(--verde); }
.formulario input, .formulario select, .formulario textarea {
  width: 100%; padding: 11px 13px; border: 1px solid rgba(90, 115, 66, .45); border-radius: 4px;
  font: inherit; font-size: 16px; color: var(--verde); background: #fff;
}
.formulario textarea { min-height: 110px; resize: vertical; }
.formulario input:focus, .formulario select:focus, .formulario textarea:focus { outline: 2px solid rgba(90, 115, 66, .5); outline-offset: 2px; }
.formulario fieldset { margin: 0; padding: 0; border: 0; }
.formulario .opcion { display: flex; align-items: center; gap: 10px; margin: 6px 0; color: var(--verde-texto); }
.formulario .opcion input { width: 18px; height: 18px; padding: 0; accent-color: var(--verde); }
.telefono { display: grid; grid-template-columns: minmax(0, 150px) 1fr; gap: 8px; }
.formulario .boton { justify-self: start; border-radius: 4px; }
.nota { margin: 0; font-size: 14px; }

/* ---------- Nosotros ---------- */
.banner-ancho img { width: 100%; height: auto; }
.valores { display: grid; grid-template-columns: repeat(4, 1fr); gap: 24px; padding: 8px 0 40px; }
@media (max-width: 749px) { .valores { grid-template-columns: repeat(2, 1fr); } }
.valor { text-align: center; }
.valor img { width: 64px; height: 64px; margin: 0 auto 8px; }
.valor h3 { margin: 0; font-size: 16px; font-weight: 400; }
.etiqueta-verde {
  width: fit-content; max-width: calc(100% - 32px); margin: 0 auto 32px; padding: 10px 28px;
  background: #dbe8cf; color: var(--verde-oscuro); text-align: center; border-radius: 4px;
}
.tecnologias-circulos { display: flex; flex-wrap: wrap; justify-content: center; gap: 24px; padding-bottom: 40px; }
.tecnologias-circulos img { width: 240px; height: auto; }

/* ---------- Listado del blog ---------- */
.blog-listado { padding-bottom: 60px; }
.blog-listado h1 { margin: 32px 0 0; font-size: 30px; font-weight: 400; }
.blog-listado__sub { margin: 0 0 24px; font-size: 15px; }
.rejilla-2 { display: grid; grid-template-columns: repeat(2, 1fr); gap: 4px; }
@media (max-width: 649px) { .rejilla-2 { grid-template-columns: 1fr; } }
.rejilla-2 .tarjeta-articulo { background: #f3f3f3; padding-bottom: 24px; }
.rejilla-2 .tarjeta-articulo img { border-radius: 0; aspect-ratio: 533 / 194; }
.rejilla-2 .tarjeta-articulo h3, .rejilla-2 .tarjeta-articulo time, .rejilla-2 .tarjeta-articulo p { padding: 0 20px; }
.rejilla-2 .tarjeta-articulo h3 { font-weight: 600; }
.tarjeta-articulo time { text-transform: uppercase; letter-spacing: .08em; font-size: 12.5px; }
@media (max-width: 749px) {
  .cabecera-servicio p, .prosa-centrada p, .fila__texto p, .beneficio p { text-align: left; text-align-last: auto; }
  .cabecera-servicio h1 { font-size: 28px; }
}

/* ======================= V2 ======================= */

/* Cabecera con llamada a la acción */
.boton--cabecera { margin-left: auto; min-height: 44px; padding: 0 22px; font-size: 15px; white-space: nowrap; }
.menu__cta-movil { display: none; }
@media (max-width: 1099px) {
  .boton--cabecera { display: none; }
  .menu__cta-movil { display: block; padding: 12px 8px 0; }
  .menu__cta-movil .boton { width: 100%; }
}
@media (min-width: 1100px) and (max-width: 1299px) {
  .menu__enlace, .menu summary { font-size: 19px; padding: 12px 10px; }
}

/* Botones adicionales */
.boton--whatsapp { background: #177a40; border-color: #177a40; }
.boton--whatsapp:hover { background: #115c30; }
.boton--whatsapp svg { width: 20px; height: 20px; }
.boton--claro { background: #fff; color: var(--verde-oscuro); border-color: #fff; }
.boton--claro:hover { background: var(--verde-suave); }
.boton--borde-claro { background: transparent; color: #fff; border-color: #fff; }
.boton--borde-claro:hover { background: rgba(255, 255, 255, .12); }
.botones--izquierda { justify-content: flex-start; }
.enlace-flecha { color: var(--verde); font-weight: 500; text-decoration: none; }
.enlace-flecha:hover { text-decoration: underline; text-underline-offset: 4px; }

/* Hero */
.hero { background: linear-gradient(135deg, var(--verde-suave) 0%, #fff 70%); }
.hero__inner { display: grid; grid-template-columns: 1.2fr .8fr; gap: 48px; align-items: center; padding-top: 48px; padding-bottom: 48px; }
.hero__antetitulo { margin: 0 0 12px; color: var(--verde); font-size: 14px; font-weight: 500; letter-spacing: .12em; text-transform: uppercase; }
.hero h1 { margin: 0 0 16px; font-size: clamp(30px, 4.2vw, 50px); font-weight: 600; line-height: 1.12; color: var(--verde-oscuro); }
.hero__lema { margin: 0 0 28px; font-size: 20px; line-height: 1.55; max-width: 34em; }
.hero__imagen { width: 100%; max-width: 440px; justify-self: end; aspect-ratio: 487 / 540; object-fit: cover; border-radius: 16px; box-shadow: 0 18px 40px rgba(47, 61, 34, .18); }
@media (max-width: 849px) {
  .hero__inner { grid-template-columns: 1fr; gap: 28px; padding-top: 32px; padding-bottom: 32px; }
  .hero__imagen { justify-self: center; max-width: 360px; aspect-ratio: 4 / 3; }
  .hero__lema { font-size: 18px; }
}

/* Barra de confianza */
.confianza { border-top: 1px solid rgba(90, 115, 66, .12); border-bottom: 1px solid rgba(90, 115, 66, .12); background: #fff; }
.confianza__lista { display: grid; grid-template-columns: repeat(4, 1fr); gap: 16px; list-style: none; margin: 0 auto; padding-top: 22px; padding-bottom: 22px; }
.confianza li { display: flex; flex-direction: column; gap: 2px; text-align: center; }
.confianza strong { color: var(--verde-oscuro); font-size: 17px; }
.confianza span { font-size: 14px; line-height: 1.45; }
@media (max-width: 849px) { .confianza__lista { grid-template-columns: repeat(2, 1fr); } }

/* Tarjetas de servicio enlazadas */
.tarjeta-consultoria--enlace { text-decoration: none; color: inherit; transition: transform .25s, box-shadow .25s; }
.tarjeta-consultoria--enlace:hover { transform: translateY(-4px); box-shadow: 0 12px 26px rgba(47, 61, 34, .14); }

/* Pasos del enfoque */
.pasos { display: grid; grid-template-columns: repeat(4, 1fr); gap: 16px; list-style: none; margin: 0; padding: 0 0 48px; counter-reset: paso; }
.paso { position: relative; padding: 28px 22px 22px; border: 1px solid rgba(90, 115, 66, .18); border-radius: 10px; background: #fff; }
.paso__numero { display: inline-flex; align-items: center; justify-content: center; width: 40px; height: 40px; margin-bottom: 12px; border-radius: 50%; background: var(--verde); color: #fff; font-weight: 600; }
.paso h3 { margin: 0 0 10px; font-size: 18px; font-weight: 600; }
.paso .lista-limpia li { font-size: 14.5px; }
@media (max-width: 989px) { .pasos { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 549px) { .pasos { grid-template-columns: 1fr; } }

/* Enfoque en Consultorías: texto siempre visible */
.enfoque__fotos { gap: 0; }
.enfoque__paso { margin: 0; background: var(--verde); color: #fff; }
.enfoque__paso img { width: 100%; aspect-ratio: 487 / 360; object-fit: cover; }
.enfoque__paso figcaption { padding: 18px 20px 24px; }
.enfoque__paso h3 { margin: 0 0 10px; color: #fff; font-size: 18px; font-weight: 600; }
.enfoque__paso .lista-limpia li { color: #fff; font-size: 14.5px; }

/* Sectores en rejilla fija */
.sectores--fijo { padding: 40px 0 44px; }
.sectores--fijo h2 { margin: 0 0 24px; color: #fff; text-align: center; font-size: 26px; font-weight: 500; }
.sectores__rejilla { display: grid; grid-template-columns: repeat(3, 1fr); gap: 28px 32px; list-style: none; margin: 0 auto; }
.sectores__rejilla li { width: auto; text-align: center; color: #fff; }
.sectores__rejilla h3 { font-size: 17px; font-weight: 500; }
.sectores__rejilla p { font-size: 14.5px; }
@media (max-width: 849px) { .sectores__rejilla { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 499px) { .sectores__rejilla { grid-template-columns: 1fr; } }

/* Productos (próximamente) */
.productos-v2 { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; margin-bottom: 20px; }
.productos-v2 img { width: 100%; aspect-ratio: 635 / 350; object-fit: cover; border-radius: 8px; }
@media (max-width: 599px) { .productos-v2 { grid-template-columns: 1fr; } }

.titulo-sencillo { margin: 0 0 12px; font-size: 28px; font-weight: 500; }

/* Banda final de llamada a la acción */
.banda-cta { margin-top: 24px; background: var(--verde-oscuro); color: #fff; text-align: center; padding: 56px 0; }
.banda-cta h2 { margin: 0 0 10px; color: #fff; font-size: clamp(24px, 3vw, 32px); font-weight: 500; }
.banda-cta p { margin: 0 auto 24px; max-width: 40em; color: #e6eddc; }

/* Formularios: envío por WhatsApp o correo */
.formulario__envio { display: flex; flex-wrap: wrap; gap: 12px; }
.formulario__envio .boton { justify-self: auto; }
.formulario__estado:empty { display: none; }
.formulario__estado { margin: 0; padding: 12px 14px; border-radius: 6px; background: var(--verde-suave); color: var(--verde-oscuro); font-size: 15px; }
.solicitud { scroll-margin-top: 100px; }

/* Blog */
.articulo__meta { margin: 0; font-size: 14px; }
.caja-cta { margin: 40px 0 8px; padding: 28px; border-radius: 10px; background: var(--verde-suave); }
.caja-cta h2 { margin: 0 0 8px; font-size: 22px; }
.caja-cta p { margin: 0 0 18px; }
.relacionados { padding-bottom: 60px; }
.relacionados h2 { font-size: 24px; font-weight: 500; margin: 0 0 20px; }

/* Redes del pie: contraste sobre beige */
.redes a { display: inline-flex; padding: 7px; border-radius: 50%; background: rgba(135, 195, 87, .22); }
.redes img { width: 20px; height: 20px; }

.oculto { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }

/* ---------- Portada V2: dos caminos ---------- */
.caminos { display: grid; grid-template-columns: 1fr 1fr; gap: 24px; padding-top: 48px; }
@media (max-width: 799px) { .caminos { grid-template-columns: 1fr; } }
.camino {
  display: flex; flex-direction: column; overflow: hidden; border: 1px solid rgba(90, 115, 66, .16); border-radius: 14px;
  background: #fff; color: inherit; text-decoration: none; transition: box-shadow .25s, transform .25s;
}
.camino:hover { box-shadow: 0 14px 30px rgba(47, 61, 34, .14); transform: translateY(-3px); }
.camino > img { width: 100%; aspect-ratio: 16 / 9; object-fit: cover; }
.camino__texto { display: flex; flex-direction: column; align-items: flex-start; gap: 10px; flex: 1; padding: 24px 26px 28px; }
.camino__etiqueta { margin: 0; color: var(--verde); font-size: 13px; font-weight: 600; letter-spacing: .1em; text-transform: uppercase; }
.camino h2 { margin: 0; font-size: 26px; font-weight: 600; color: var(--verde-oscuro); }
.camino p { margin: 0; }
.camino .boton { margin-top: auto; }
.tarjetas-overlay--portada { margin-top: 40px; padding-bottom: 0; }
.tarjetas-overlay--portada { max-width: var(--ancho); gap: 24px; padding: 0 55px; margin-top: 24px; }
@media (max-width: 749px) { .tarjetas-overlay--portada { padding: 0 16px; gap: 12px; } }

/* ---------- Buscador (como el de Shopify) ---------- */
.boton-buscar {
  display: inline-flex; align-items: center; justify-content: center; width: 44px; height: 44px; margin-left: auto;
  border: 0; border-radius: 50%; background: none; color: var(--verde-oscuro); cursor: pointer;
}
.boton-buscar:hover { background: var(--verde-suave); }
.boton-buscar svg { width: 22px; height: 22px; }
.boton--cabecera { margin-left: 8px; }
@media (max-width: 1099px) { .boton-buscar { margin-left: auto; } .boton-menu { margin-left: 0; } }

.buscador { position: absolute; inset: 0 0 auto 0; z-index: 60; background: #fff; border-bottom: 1px solid rgba(90, 115, 66, .12); box-shadow: 0 10px 30px rgba(47, 61, 34, .12); }
.buscador__inner { display: flex; align-items: flex-start; gap: 12px; padding-top: 18px; padding-bottom: 18px; }
.buscador__form { position: relative; flex: 1; max-width: 760px; margin: 0 auto; }
.buscador__fondo { position: fixed; inset: 0; z-index: 39; background: rgba(47, 61, 34, .35); }
body.buscador-abierto { overflow: hidden; }
.buscador__campo { position: relative; }
.buscador__input {
  width: 100%; height: 54px; padding: 20px 96px 6px 16px; border: 1px solid rgba(47, 61, 34, .55); border-radius: 6px;
  font: inherit; font-size: 17px; color: var(--verde-oscuro); background: #fff; -webkit-appearance: none; appearance: none;
}
.buscador__input::-webkit-search-cancel-button { display: none; }
.buscador__input:focus { outline: 2px solid rgba(90, 115, 66, .45); outline-offset: 1px; }
.buscador__campo label {
  position: absolute; left: 16px; top: 16px; color: var(--verde-texto); font-size: 17px; pointer-events: none; transition: .15s;
}
.buscador__input:focus + label, .buscador__input:not(:placeholder-shown) + label { top: 6px; font-size: 12px; }
.buscador__borrar, .buscador__enviar, .buscador__cerrar {
  display: inline-flex; align-items: center; justify-content: center; width: 44px; height: 44px; border: 0; border-radius: 50%;
  background: none; color: var(--verde-oscuro); cursor: pointer;
}
.buscador__borrar svg { width: 14px; height: 14px; }
.buscador__enviar svg, .buscador__cerrar svg { width: 20px; height: 20px; }
.buscador__borrar { position: absolute; right: 48px; top: 5px; }
.buscador__enviar { position: absolute; right: 4px; top: 5px; }
.buscador__cerrar:hover, .buscador__borrar:hover, .buscador__enviar:hover { background: var(--verde-suave); }
.buscador__cerrar { flex: none; margin-top: 5px; }

.buscador__resultados {
  position: absolute; left: 0; right: 0; top: calc(100% + 6px); max-height: min(70vh, 560px); overflow-y: auto;
  padding: 8px 0; border: 1px solid rgba(90, 115, 66, .16); border-radius: 6px; background: #fff; box-shadow: 0 12px 28px rgba(47, 61, 34, .14);
}
.buscador__grupo { margin: 10px 18px 4px; padding-bottom: 6px; border-bottom: 1px solid rgba(90, 115, 66, .12); font-size: 12px; font-weight: 600; letter-spacing: .12em; text-transform: uppercase; color: var(--verde); }
.buscador__resultados ul { list-style: none; margin: 0; padding: 0; }
.buscador__resultados li a { display: block; padding: 10px 18px; color: inherit; text-decoration: none; }
.buscador__resultados li a:hover, .buscador__resultados li a:focus { background: var(--verde-suave); }
.buscador__resultados strong { display: block; color: var(--verde-oscuro); font-weight: 600; font-size: 16px; }
.buscador__resultados span { display: block; font-size: 14px; line-height: 1.5; }
.buscador__vacio { margin: 10px 18px; }
.buscador__todo { display: block; margin-top: 6px; padding: 12px 18px; border-top: 1px solid rgba(90, 115, 66, .12); font-weight: 500; text-decoration: none; }
.buscador__todo:hover { background: var(--verde-suave); }
mark { background: #f3e9a8; color: inherit; border-radius: 2px; padding: 0 1px; }

/* Página de resultados */
.busqueda { max-width: 860px; padding-bottom: 60px; }
.busqueda h1 { margin: 32px 0 16px; font-size: 32px; font-weight: 500; }
.busqueda__form { display: flex; gap: 12px; }
.busqueda__form input { flex: 1; min-width: 0; height: 51px; padding: 0 16px; border: 1px solid rgba(47, 61, 34, .55); border-radius: 6px; font: inherit; font-size: 17px; color: var(--verde-oscuro); }
.busqueda__resumen { margin: 18px 0; }
.busqueda__lista { list-style: none; margin: 0; padding: 0; }
.busqueda__lista li { padding: 18px 0; border-top: 1px solid rgba(90, 115, 66, .14); }
.busqueda__lista h2 { margin: 2px 0 6px; font-size: 21px; font-weight: 600; }
.busqueda__lista h2 a { text-decoration: none; }
.busqueda__lista h2 a:hover { text-decoration: underline; }
.busqueda__lista p { margin: 0; }
.busqueda__tipo { font-size: 12px; font-weight: 600; letter-spacing: .12em; text-transform: uppercase; color: var(--verde); }
/* Botones de la banda final: mismo ancho */
.banda-cta .botones { display: grid; grid-template-columns: repeat(2, minmax(0, 300px)); justify-content: center; gap: 14px; }
.banda-cta .botones .boton { width: 100%; padding: 0 20px; font-weight: 500; white-space: nowrap; }
@media (max-width: 599px) { .banda-cta .botones { grid-template-columns: minmax(0, 320px); } }
/* Pie: desplazamiento suave al pasar el ratón (sin saltos de maquetación) */
.pie__menu a { display: inline-block; transition: color .35s ease, transform .35s cubic-bezier(.22, .61, .36, 1); }
.pie__menu a:hover, .pie__menu a:focus-visible { padding-left: 0; transform: translateX(4px); }
@media (prefers-reduced-motion: reduce) { .pie__menu a:hover, .pie__menu a:focus-visible { transform: none; } }

/* ---------- Enfoque: animación original de Shopify (zoom + capa al pasar el ratón) ---------- */
.enfoque__fotos { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0; }
.triple-slide { position: relative; overflow: hidden; aspect-ratio: 487 / 540; outline-offset: -3px; }
.triple-slide__imagen { width: 100%; height: 100%; object-fit: cover; transition: transform .3s ease; }
.triple-slide__capa {
  position: absolute; inset: 0; display: flex; flex-direction: column; justify-content: center; align-items: center;
  padding: 22px; text-align: center; background: rgba(214, 229, 199, .69); color: var(--verde-oscuro);
  opacity: 0; transition: opacity .3s ease;
}
.triple-slide__capa h3 { margin: 0 0 10px; color: var(--verde-oscuro); font-size: 18px; font-weight: 700; }
.triple-slide__capa p { margin: 0; font-size: 16px; line-height: 1.55; text-align: left; font-weight: 500; }
.triple-slide:hover .triple-slide__imagen, .triple-slide:focus-within .triple-slide__imagen { transform: scale(1.05); }
.triple-slide:hover .triple-slide__capa, .triple-slide:focus-within .triple-slide__capa { opacity: 1; }
@media (max-width: 989px) { .enfoque__fotos { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 549px) { .enfoque__fotos { grid-template-columns: 1fr; } .triple-slide { aspect-ratio: 4 / 3; } }
/* Pantallas táctiles: sin "pasar el ratón", la capa se muestra siempre */
@media (hover: none) {
  .triple-slide__capa { opacity: 1; background: rgba(214, 229, 199, .82); }
}
@media (prefers-reduced-motion: reduce) { .triple-slide__imagen { transition: none; } }
/* Enfoque: transición más suave (zoom lento, capa con fundido y texto que sube ligeramente) */
.triple-slide__imagen { transition: transform .9s cubic-bezier(.22, .61, .36, 1); will-change: transform; }
.triple-slide__capa { transition: opacity .55s ease; }
.triple-slide__capa h3, .triple-slide__capa p { transform: translateY(10px); transition: transform .6s cubic-bezier(.22, .61, .36, 1); }
.triple-slide__capa p { transition-delay: .06s; }
.triple-slide:hover .triple-slide__imagen, .triple-slide:focus-within .triple-slide__imagen { transform: scale(1.04); }
.triple-slide:hover .triple-slide__capa h3, .triple-slide:hover .triple-slide__capa p,
.triple-slide:focus-within .triple-slide__capa h3, .triple-slide:focus-within .triple-slide__capa p { transform: none; }
@media (hover: none) { .triple-slide__capa h3, .triple-slide__capa p { transform: none; } }
@media (prefers-reduced-motion: reduce) {
  .triple-slide__imagen, .triple-slide__capa, .triple-slide__capa h3, .triple-slide__capa p { transition: none; transform: none; }
}

/* ---------- Iconos propios (sustituyen a los emojis) ---------- */
.icono-circulo { display: inline-flex; align-items: center; justify-content: center; margin: 0 auto 14px; border-radius: 50%; background: rgba(135, 195, 87, .22); }
.icono-circulo svg { width: 52%; height: 52%; fill: none; stroke: var(--verde-texto); stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round; }
.num-paso {
  display: inline-flex; align-items: center; justify-content: center; width: 36px; height: 36px; margin-right: 6px;
  border-radius: 50%; background: var(--verde); color: #fff; font-size: 18px; font-weight: 600; vertical-align: 3px;
}
.lista-limpia li.check { position: relative; padding-left: 28px; }
.lista-limpia li.check::before {
  content: ""; position: absolute; left: 2px; top: .38em; width: 16px; height: 16px; border-radius: 50%; background: var(--verde);
  -webkit-mask: none;
}
.lista-limpia li.check::after {
  content: ""; position: absolute; left: 7px; top: calc(.38em + 3px); width: 4px; height: 8px;
  border: solid #fff; border-width: 0 2px 2px 0; transform: rotate(45deg);
}
.triple-slide__capa .lista-limpia { text-align: left; margin: 0; }
.triple-slide__capa .lista-limpia li { color: var(--verde-oscuro); font-size: 15.5px; font-weight: 500; margin-bottom: .45em; }
.beneficio .icono-circulo { display: flex; }
.beneficio p { text-align: left; }

/* ---------- Formulario de Contáctenos: clon del de Shopify (V0) ---------- */
.formulario--v0 { gap: 18px; }
.formulario--v0 label, .formulario--v0 legend { font-size: 20px; font-weight: 500; color: var(--verde); margin-bottom: 6px; }
.formulario--v0 .req { color: #c0392b; }
.formulario--v0 input:not([type=radio]), .formulario--v0 select {
  height: 44px; padding: 0 15px; border: 1px solid #d8d8d8; border-radius: 4px; background: #fff;
  font-size: 17px; color: var(--verde);
}
.formulario--v0 input::placeholder { color: #9aa58f; }
.formulario--v0 .opcion { font-size: 17px; font-weight: 400; color: var(--verde); margin: 8px 0; }
.formulario--v0 .opcion input { width: 18px; height: 18px; }
.boton--v0 { min-height: 46px; padding: 0 60px; border-radius: 4px; font-size: 15px; justify-self: start; }

/* Tarjetas de portada: caras en HTML con iconos y títulos alineados */
.tarjeta-overlay__cara {
  position: absolute; inset: 0; display: flex; flex-direction: column;
  padding: 0 20px 28px;
}
.cara__visual { flex: 1; display: flex; align-items: flex-end; justify-content: center; padding-bottom: 22px; min-height: 0; }
.cara__visual img { width: auto; height: 84px; }
.cara__visual--mapa { margin: 0; padding: 30px 4px 18px; align-items: center; }
.cara__visual--mapa img { width: 100%; height: 100%; object-fit: contain; }
.cara__titulo {
  height: 2.5em; margin: 0; display: flex; align-items: flex-start; justify-content: center;
  text-align: center; text-transform: uppercase; font-size: 22px; font-weight: 700;
  line-height: 1.2; letter-spacing: .5px; color: var(--verde-texto);
}
@media (max-width: 749px) { .cara__titulo { font-size: 20px; } }


/* Cómo trabajamos: la capa verde recorre las tarjetas sola, con transición lenta */
.tarjetas-overlay--auto .tarjeta-overlay__capa { transition: opacity 1.6s ease-in-out; }
.tarjetas-overlay--auto .tarjeta-overlay.activa .tarjeta-overlay__capa { opacity: 1; }
@media (hover: none) {
  .tarjetas-overlay--auto .tarjeta-overlay--foto .tarjeta-overlay__capa { opacity: 0; }
  .tarjetas-overlay--auto .tarjeta-overlay--foto.activa .tarjeta-overlay__capa { opacity: 1; }
}
.tarjeta-overlay--foto .tarjeta-overlay__capa { background: rgba(90, 115, 66, .78); }
.tarjeta-overlay--foto .tarjeta-overlay__capa h3,
.tarjeta-overlay--foto .tarjeta-overlay__capa p { text-shadow: 0 1px 3px rgba(0, 0, 0, .35); }

/* Nosotros: banner por capas que entran al verse */
.banner-animado { position: relative; aspect-ratio: 1440 / 416; background: #597243; overflow: hidden; }
.banner-animado img { position: absolute; inset: 0; width: 100%; height: 100%; }
.banner-animado.animar img { opacity: 0; }
.banner-animado.animar.visible img { transition: opacity 1s ease-out, transform 1.2s cubic-bezier(.22, .8, .3, 1); }
.banner-animado.animar .ba-x { transform: scale(.35); transform-origin: 26% 50%; }
.banner-animado.animar.visible .ba-x { transition: opacity 2.4s ease-out, transform 3s cubic-bezier(.25, .7, .3, 1); }
.banner-animado.animar .ba-titulo { transform: translateX(14%); }
.banner-animado.animar .ba-logo { transform: translateX(14%); }
.banner-animado.animar.visible img { opacity: 1; transform: none; }
.banner-animado.animar.visible .ba-logo { transition: opacity 2.4s ease-out, transform 3s cubic-bezier(.25, .7, .3, 1); }
.banner-animado.animar.visible .ba-titulo { transition-delay: 3.2s; }
.banner-animado { container-type: inline-size; }
.ba-desde {
  position: absolute; left: 61.2%; width: 25.5%; top: 71.4%; text-align: center;
  font-size: 2.1cqw; font-weight: 300; letter-spacing: .3em; text-indent: .3em; line-height: 1; color: #fff; opacity: .9;
}
.banner-animado.animar .ba-desde { opacity: 0; transform: translateX(35%); }
.banner-animado.animar.visible .ba-desde { opacity: .9; transform: none; transition: opacity 1s ease-out 4.4s, transform 1.2s cubic-bezier(.22, .8, .3, 1) 4.4s; }

/* Nosotros: tecnologías resaltadas una a una */
.tecnologias-circulos img { border-radius: 50%; transition: transform .9s cubic-bezier(.22, .8, .3, 1), filter .9s ease, opacity .9s ease; }
.tecnologias-circulos.rotando img { opacity: .7; }
.tecnologias-circulos.rotando img.activa { opacity: 1; transform: scale(1.1); filter: drop-shadow(0 8px 18px rgba(90, 115, 66, .35)) saturate(1.25); }

/* Blog: botón "Leer más" en las tarjetas */
.tarjeta-articulo__leer {
  align-self: flex-start; display: inline-flex; align-items: center; gap: 8px;
  margin-top: 16px; padding: 9px 20px; border-radius: 20px;
  background: var(--verde); color: #fff; font-size: 15px; font-weight: 500;
  transition: background .3s;
}
.tarjeta-articulo__leer svg { width: 16px; height: 16px; fill: none; stroke: currentColor; stroke-width: 2.2; stroke-linecap: round; stroke-linejoin: round; transition: transform .3s; }
.tarjeta-articulo:hover .tarjeta-articulo__leer, .tarjeta-articulo:focus-visible .tarjeta-articulo__leer { background: var(--verde-oscuro); }
.tarjeta-articulo:hover .tarjeta-articulo__leer svg { transform: translateX(3px); }
.rejilla-2 .tarjeta-articulo .tarjeta-articulo__leer { margin-left: 20px; margin-top: auto; }
.rejilla-2 .tarjeta-articulo p { margin-bottom: 18px; }

/* Tarjeta de registros: título y logos en tamaño legible */
.capa-registros { gap: 5%; }
.capa-registros h3 { margin: 0; font-size: 24px; }
.tarjeta-overlay__capa.capa-registros img { width: auto; height: 33%; max-width: 86%; max-height: 150px; object-fit: contain; }
.tarjeta-overlay__capa.capa-registros img + img { height: 27%; max-height: 120px; }
.capa-impacto p { font-size: 15px; line-height: 1.45; margin: 0 0 8px; max-width: 32ch; }
.capa-impacto p:last-child { margin-bottom: 0; }

/* Con "reducir movimiento": solo fundidos, sin desplazamientos ni escalas */
@media (prefers-reduced-motion: reduce) {
  .banner-animado.animar img, .banner-animado.animar .ba-desde { transform: none !important; }
  .tecnologias-circulos.rotando img.activa { transform: none; }
  .banner-animado.animar.visible img { transition: opacity 1.4s ease-out !important; }
  .banner-animado.animar.visible .ba-titulo { transition-delay: 3.2s !important; }
  .banner-animado.animar.visible .ba-x { transition-duration: 3s !important; }
  .banner-animado.animar.visible .ba-logo { transition-delay: 0s !important; transition-duration: 3s !important; }
  .banner-animado.animar.visible .ba-desde { transition: opacity 1s ease-out 4.4s !important; }
  .tecnologias-circulos.rotando img { transition: opacity .9s ease, filter .9s ease !important; }
  .tarjetas-overlay--auto .tarjeta-overlay__capa { transition: opacity 1.6s ease-in-out !important; }
}
.menu summary.es-actual { color: var(--verde); text-decoration: underline; text-underline-offset: 6px; }
.submenu a[aria-current="page"] { font-weight: 600; text-decoration: underline; text-underline-offset: 4px; }

/* ---------- Nosotros: versión digerible ---------- */
.nos-etiqueta { margin: 0 0 8px; color: var(--verde); font-size: 13px; font-weight: 600; letter-spacing: .12em; text-transform: uppercase; }
.nos-intro { display: grid; grid-template-columns: 1.1fr .9fr; gap: 48px; align-items: center; padding-top: 8px; padding-bottom: 40px; }
.nos-intro h2 { margin: 0 0 12px; font-size: 24px; font-weight: 600; line-height: 1.3; color: var(--verde-oscuro); }
.nos-lead { margin: 0; line-height: 1.6; color: var(--verde-texto); }
.nos-intro > img { width: 100%; aspect-ratio: 1; object-fit: cover; border-radius: 16px; }

.leer-mas { margin-top: 14px; }
.leer-mas summary { display: inline-flex; align-items: center; gap: 6px; cursor: pointer; color: var(--verde); font-weight: 600; list-style: none; }
.leer-mas summary::-webkit-details-marker { display: none; }
.leer-mas summary::after { content: "+"; font-size: 18px; line-height: 1; transition: transform .3s; }
.leer-mas[open] summary::after { transform: rotate(45deg); }
.leer-mas p { margin: 10px 0 0; line-height: 1.7; }
.leer-mas--centro { text-align: center; max-width: 760px; margin: 8px auto 32px; }
.leer-mas--claro summary, .leer-mas--claro p { color: #fff; }

.linea-tiempo { list-style: none; margin: 8px 0 0; padding: 0; display: grid; grid-template-columns: repeat(3, 1fr); gap: 28px; position: relative; }
.linea-tiempo::before { content: ""; position: absolute; top: 22px; left: 16%; right: 16%; height: 2px; background: var(--beige); }
.linea-tiempo li { position: relative; text-align: center; padding: 0 8px; }
.linea-tiempo__punto { display: inline-flex; align-items: center; justify-content: center; width: 44px; height: 44px; border-radius: 50%; background: var(--verde); color: #fff; font-weight: 600; font-size: 18px; position: relative; }
.linea-tiempo h3 { margin: 14px 0 6px; font-size: 20px; font-weight: 600; color: var(--verde-oscuro); }
.linea-tiempo p { margin: 0; font-size: 15.5px; line-height: 1.55; }

.que-hacemos { display: grid; grid-template-columns: 1fr 1fr; gap: 24px; padding-bottom: 40px; }
.que-hacemos__tarjeta { display: flex; flex-direction: column; align-items: flex-start; gap: 10px; padding: 32px 30px; border-radius: 16px; background: var(--verde-suave); }
.que-hacemos__tarjeta .icono-circulo { margin: 0 0 4px; background: #fff; }
.que-hacemos__tarjeta h3 { margin: 0; font-size: 24px; font-weight: 600; color: var(--verde-oscuro); }
.que-hacemos__tarjeta p { margin: 0; line-height: 1.6; }
.que-hacemos__tarjeta .boton { margin-top: auto; }
.que-hacemos__tarjeta .leer-mas { margin: 0 0 6px; }

.cita-mision { margin: 0 0 48px; padding: 40px 48px; border-radius: 16px; background: var(--verde); color: #fff; text-align: center; }
.cita-mision .nos-etiqueta { color: var(--beige); }
.cita-mision__frase { margin: 0 auto; max-width: 820px; font-size: clamp(21px, 2.4vw, 27px); line-height: 1.45; font-weight: 500; color: #fff; }
.cita-mision .leer-mas { max-width: 820px; margin: 16px auto 0; }

.nos-cierre { display: grid; grid-template-columns: .8fr 1.2fr; gap: 48px; align-items: center; padding-top: 8px; padding-bottom: 56px; }
.nos-cierre > img { width: 100%; aspect-ratio: 1; object-fit: cover; border-radius: 16px; }
.nos-cierre__frase { margin: 0; line-height: 1.6; color: var(--verde-texto); }

@media (max-width: 799px) {
  .nos-intro, .nos-cierre, .que-hacemos { grid-template-columns: 1fr; gap: 24px; }
  .linea-tiempo { grid-template-columns: 1fr; gap: 22px; }
  .linea-tiempo::before { top: 0; bottom: 0; left: 22px; right: auto; width: 2px; height: auto; }
  .linea-tiempo li { display: grid; grid-template-columns: 44px 1fr; column-gap: 16px; text-align: left; padding: 0; }
  .linea-tiempo__punto { grid-row: span 2; }
  .linea-tiempo h3 { margin: 8px 0 4px; }
  .cita-mision { padding: 28px 22px; }
}

/* Molécula del banner: círculos y enlaces se dibujan en secuencia lenta */
.banner-animado svg.ba-molecula { position: absolute; inset: 0; width: 100%; height: 100%; fill: none; stroke: #fff; stroke-width: 6; stroke-linecap: butt; opacity: .14; }
.banner-animado.animar svg.ba-molecula { opacity: .14; transform: none; }
.banner-animado.animar svg.ba-molecula > * { stroke-dasharray: 1; stroke-dashoffset: 1; }
.banner-animado.animar.visible svg.ba-molecula > * { stroke-dashoffset: 0; transition: stroke-dashoffset .9s ease-in-out calc(1s + var(--i) * .75s) !important; }
.banner-animado.animar.visible svg.ba-molecula > circle { transition-duration: 1.1s !important; }

/* Inicio: pista de clic, punto pequeño que emite pulsos (alternando entre las tres tarjetas) */
.tarjeta-overlay--pista { cursor: pointer; }
.pista-punto { position: absolute; top: 24px; right: 24px; z-index: 2; width: 14px; height: 14px; transition: opacity .3s; }
.pista-punto::before, .pista-punto::after { content: ""; position: absolute; inset: 0; border-radius: 50%; border: 2px solid var(--verde); opacity: 0; animation: pista-pulso 7.5s ease-out infinite; }
.pista-punto::after { animation-delay: .6s; }
.tarjeta-overlay--pista:nth-child(2) .pista-punto::before { animation-delay: 2.5s; }
.tarjeta-overlay--pista:nth-child(2) .pista-punto::after { animation-delay: 3.1s; }
.tarjeta-overlay--pista:nth-child(3) .pista-punto::before { animation-delay: 5s; }
.tarjeta-overlay--pista:nth-child(3) .pista-punto::after { animation-delay: 5.6s; }
@keyframes pista-pulso { 0% { transform: scale(.2); opacity: 0; } 3% { opacity: .9; } 20% { transform: scale(3.6); opacity: 0; } 100% { transform: scale(3.6); opacity: 0; } }
.tarjeta-overlay--pista:hover .pista-punto, .tarjeta-overlay--pista:focus-within .pista-punto { opacity: 0; }
@media (prefers-reduced-motion: reduce) {
  .pista-punto::before, .pista-punto::after { animation: pista-pulso 7.5s ease-out infinite !important; }
  .pista-punto::after { animation-delay: .6s !important; }
  .tarjeta-overlay--pista:nth-child(2) .pista-punto::before { animation-delay: 2.5s !important; }
  .tarjeta-overlay--pista:nth-child(2) .pista-punto::after { animation-delay: 3.1s !important; }
  .tarjeta-overlay--pista:nth-child(3) .pista-punto::before { animation-delay: 5s !important; }
  .tarjeta-overlay--pista:nth-child(3) .pista-punto::after { animation-delay: 5.6s !important; }
}

/* ---------- Nosotros: partners y clientes ---------- */
.partners { display: flex; flex-wrap: wrap; justify-content: center; gap: 24px; padding-bottom: 40px; }
.partners .partner { flex: 0 1 calc((100% - 48px) / 3); min-width: 280px; }
.partner { display: flex; flex-direction: column; align-items: center; text-align: center; gap: 8px; padding: 28px 24px; border-radius: 16px; background: var(--verde-suave); }
.partner__logo { display: flex; align-items: center; justify-content: center; width: 120px; height: 120px; margin-bottom: 6px; border-radius: 50%; background: #fff; overflow: hidden; }
.partner__logo img { max-width: 78%; max-height: 78%; object-fit: contain; }
.partner__logo span { color: #9aa58f; font-size: 14px; }
.partner h3 { margin: 0; font-size: 20px; font-weight: 600; color: var(--verde-oscuro); }
.partner__sector { margin: 0; color: var(--beige-texto); font-size: 13px; font-weight: 600; letter-spacing: .08em; text-transform: uppercase; }
.partner p:not(.partner__sector) { margin: 4px 0 0; line-height: 1.6; }
.partner__web { margin-top: auto; padding-top: 10px; color: var(--verde); font-weight: 600; }
.clientes { overflow: hidden; padding-bottom: 48px; -webkit-mask-image: linear-gradient(90deg, transparent, #000 8%, #000 92%, transparent); mask-image: linear-gradient(90deg, transparent, #000 8%, #000 92%, transparent); }
.clientes__pista { display: flex; gap: 24px; width: max-content; margin: 0; padding: 0; list-style: none; animation: desplazar 35s linear infinite; }
.clientes:hover .clientes__pista { animation-play-state: paused; }
.clientes__pista li { display: flex; flex-direction: column; align-items: center; justify-content: flex-start; width: 230px; border-radius: 12px; background: var(--verde-suave); overflow: hidden; }
.cliente__logo { display: flex; align-items: center; justify-content: center; width: 100%; height: 110px; }
.cliente__caso { margin: 0; padding: 0 18px 18px; font-size: 14.5px; line-height: 1.5; text-align: center; }
.clientes--fijo .clientes__pista { align-items: stretch; }
.clientes--fijo .clientes__pista li { width: 300px; }
.cliente__logo img { max-width: 84%; max-height: 74%; object-fit: contain; }
.clientes__pista span { color: #9aa58f; font-size: 14px; }
@media (max-width: 799px) { .partners .partner { flex-basis: 100%; } .clientes__pista li { width: 160px; } .cliente__logo { height: 84px; } .clientes--fijo .clientes__pista li { width: 100%; max-width: 340px; } }
@media (prefers-reduced-motion: reduce) { .clientes__pista { animation: desplazar 60s linear infinite !important; } }
.partner__logo .partner__iniciales { color: var(--verde); font-size: 38px; font-weight: 600; letter-spacing: .04em; }
.clientes--fijo { -webkit-mask-image: none; mask-image: none; }
.clientes--fijo .clientes__pista { width: auto; flex-wrap: wrap; justify-content: center; animation: none !important; }
.partners--pares .partner { flex-basis: calc((100% - 24px) / 2); max-width: 560px; }
.partner__logo img.partner__foto { width: 100%; height: 100%; max-width: none; max-height: none; object-fit: cover; }
.partner__media { position: relative; margin-bottom: 6px; }
.partner__media .partner__logo { margin-bottom: 0; }
.partner__sello { position: absolute; right: -18px; bottom: -8px; width: 64px; height: 64px; border-radius: 50%; background: #fff; box-shadow: 0 2px 8px rgba(47, 61, 34, .2); }
.cliente__pais { margin: 0 0 6px; color: var(--beige-texto); font-size: 12.5px; font-weight: 600; letter-spacing: .1em; text-transform: uppercase; }
.cliente__pais { display: inline-flex; align-items: center; gap: 8px; }
.bandera { width: 20px; height: 20px; border-radius: 50%; flex: none; box-shadow: 0 0 0 1px rgba(47, 61, 34, .15); }

/* Nosotros: logos de registros y certificaciones a la vista */
.certificaciones { display: flex; flex-wrap: wrap; justify-content: center; align-items: center; gap: 24px 72px; margin-bottom: 48px; padding: 36px 32px; border-radius: 16px; background: var(--verde); }
.certificaciones figure { margin: 0; display: flex; flex-direction: column; align-items: center; gap: 12px; }
.certificaciones img { width: auto; height: 96px; }
.certificaciones figcaption { color: #fff; font-size: 13px; font-weight: 600; letter-spacing: .1em; text-transform: uppercase; opacity: .9; }
@media (max-width: 599px) { .certificaciones img { height: 72px; } }

/* Pie compacto, ajustado al contenido */
.pie { padding: 32px 16px 20px; }
.pie__columnas { display: flex; flex-wrap: wrap; justify-content: center; align-items: flex-start; gap: 24px 80px; }
.pie__menu ul { margin: 0 0 16px; gap: 6px; }
.pie__menu a { font-size: 16px; }
.pie h2 { margin: 0 0 8px; font-size: 18px; }
.pie__contacto p { margin: 0 0 6px; font-size: 16px; }
.pie__newsletter h3 { margin: 14px 0 8px; font-size: 16px; }
.newsletter { gap: 10px; }
.newsletter input, .newsletter button { padding: 8px 12px; font-size: 15px; }
.pie__legal { margin: 20px auto 0; }
@media (max-width: 989px) { .pie__columnas { flex-direction: column; align-items: center; text-align: center; } }
.pie__menu li { line-height: 1.35; }
.partners__intro { max-width: 760px; margin: 0 auto 28px; padding: 0 16px; text-align: center; font-size: 17px; line-height: 1.6; }