/* =========================================================
   TRES RAYAS COFFEE — Estilos del sitio
   Diseño y desarrollo: Creátius Agencia
   ========================================================= */

/* ---------- Fuentes (alojadas en el sitio) ---------- */
@font-face{font-family:"Lexend Exa";src:url(../fuentes/lexend-exa-latin-300-normal.woff2) format("woff2");font-weight:300;font-display:swap}
@font-face{font-family:"Lexend Exa";src:url(../fuentes/lexend-exa-latin-400-normal.woff2) format("woff2");font-weight:400;font-display:swap}
@font-face{font-family:"Lexend Exa";src:url(../fuentes/lexend-exa-latin-500-normal.woff2) format("woff2");font-weight:500;font-display:swap}
@font-face{font-family:"Lexend Exa";src:url(../fuentes/lexend-exa-latin-600-normal.woff2) format("woff2");font-weight:600;font-display:swap}
@font-face{font-family:"Jost";src:url(../fuentes/jost-latin-300-normal.woff2) format("woff2");font-weight:300;font-display:swap}
@font-face{font-family:"Jost";src:url(../fuentes/jost-latin-400-normal.woff2) format("woff2");font-weight:400;font-display:swap}
@font-face{font-family:"Jost";src:url(../fuentes/jost-latin-400-italic.woff2) format("woff2");font-weight:400;font-style:italic;font-display:swap}
@font-face{font-family:"Jost";src:url(../fuentes/jost-latin-500-normal.woff2) format("woff2");font-weight:500;font-display:swap}

/* ---------- Variables de marca (cambiar aquí afecta todo el sitio) ---------- */
:root{
  --verde:#005D3F;
  --verde-oscuro:#00412C;
  --verde-profundo:#00261A;
  --beige:#F3EFE7;
  --beige-2:#E8E1D3;
  --beige-3:#D9CFBC;
  --ocre:#987626;
  --morado:#472F66;
  --tinta:#1F2B25;
  --tinta-suave:#4A5650;
  --blanco:#FFFFFF;

  --f-titulo:"Lexend Exa", "Segoe UI", sans-serif;
  --f-texto:"Jost", "Segoe UI", sans-serif;

  --ancho:1240px;
  --ancho-texto:68ch;
  --gutter:clamp(20px, 5vw, 64px);
  --sec:clamp(80px, 11vw, 160px);
  --radio:4px;
  --sombra:0 24px 60px -24px rgba(0,38,26,.35);
  --t:cubic-bezier(.2,.7,.2,1);
  --header-h:92px;
}

/* ---------- Base ---------- */
*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%;overflow-x:clip}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
body{margin:0;background:var(--beige);color:var(--tinta);font-family:var(--f-texto);font-weight:400;font-size:clamp(17px,1.05vw + 10px,19px);line-height:1.65;-webkit-font-smoothing:antialiased;overflow-x:hidden}
img,video,svg{display:block;max-width:100%}
img{height:auto}
a{color:inherit;text-decoration:none}
button{font:inherit;color:inherit;background:none;border:0;cursor:pointer;padding:0}
ul{margin:0;padding:0;list-style:none}
h1,h2,h3,h4{margin:0;font-family:var(--f-titulo);font-weight:400;line-height:1.15;text-wrap:balance;letter-spacing:.04em}
p{margin:0 0 1.1em;text-wrap:pretty;hyphens:manual}
p:last-child{margin-bottom:0}
::selection{background:var(--verde);color:var(--beige)}
:focus-visible{outline:2px solid var(--ocre);outline-offset:3px}
.sr-only{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.saltar{position:fixed;left:16px;top:-60px;z-index:999;background:var(--verde);color:var(--beige);padding:10px 18px;font-family:var(--f-titulo);font-size:.75rem;letter-spacing:.15em;text-transform:uppercase;transition:top .2s}
.saltar:focus{top:16px}

/* Barra de desplazamiento (computador) */
html{scrollbar-color:var(--verde) var(--beige-2);scrollbar-width:thin}
::-webkit-scrollbar{width:10px}
::-webkit-scrollbar-track{background:var(--beige-2)}
::-webkit-scrollbar-thumb{background:var(--verde);border-radius:10px;border:2px solid var(--beige-2)}
::-webkit-scrollbar-thumb:hover{background:var(--verde-oscuro)}

/* ---------- Utilidades de diseño ---------- */
.contenedor{width:100%;max-width:calc(var(--ancho) + var(--gutter)*2);margin-inline:auto;padding-inline:var(--gutter)}
.seccion{padding-block:var(--sec);position:relative}
.seccion--verde{background:var(--verde);color:var(--beige)}
.seccion--profunda{background:var(--verde-profundo);color:var(--beige)}
.seccion--beige2{background:var(--beige-2)}

.antetitulo{display:inline-flex;align-items:center;gap:14px;font-family:var(--f-titulo);font-size:.72rem;font-weight:500;letter-spacing:.32em;text-transform:uppercase;color:var(--verde);margin-bottom:26px}
.antetitulo::before{content:"";width:34px;height:1px;background:currentColor}
.seccion--verde .antetitulo,.seccion--profunda .antetitulo,.sobre-oscuro .antetitulo{color:var(--beige)}
.titulo{font-size:clamp(1.55rem,2.6vw + .5rem,3rem);text-transform:uppercase;color:var(--verde);letter-spacing:.05em;font-weight:300}
.titulo strong{font-weight:500}
.seccion--verde .titulo,.seccion--profunda .titulo,.sobre-oscuro .titulo{color:var(--beige)}
.titulo-sm{font-size:clamp(1.05rem,1vw + .7rem,1.4rem);text-transform:uppercase;letter-spacing:.1em;color:var(--verde);font-weight:500}
.entrada{font-size:clamp(1.15rem,.8vw + .9rem,1.45rem);line-height:1.55;font-weight:300}
.texto-largo{max-width:var(--ancho-texto)}
@media (min-width:1024px){
  .justificado p{text-align:justify;text-align-last:left;hyphens:auto;-webkit-hyphens:auto}
}
.linea-corta{width:56px;height:1px;background:currentColor;margin:28px 0;opacity:.6}

/* Lema con esquinas (tomado de la tarjeta de marca) */
.lema{position:relative;display:inline-block;padding:.85em 1.4em;font-family:var(--f-titulo);font-weight:500;letter-spacing:.28em;text-transform:uppercase;font-size:clamp(.7rem,.5vw + .55rem,.92rem);line-height:1.3}
.lema::before,.lema::after{content:"";position:absolute;width:14px;height:14px;border:solid currentColor}
.lema::before{left:0;top:0;border-width:2px 0 0 2px}
.lema::after{right:0;bottom:0;border-width:0 2px 2px 0}

/* Textura topográfica */
.topo{position:absolute;pointer-events:none;background:currentColor;-webkit-mask:url(../img/topografia.svg) center/contain no-repeat;mask:url(../img/topografia.svg) center/contain no-repeat;opacity:.08}

/* Borde de papel rasgado */
.rasgado-arriba,.rasgado-abajo{position:relative}
.rasgado-arriba::before,.rasgado-abajo::after{content:"";position:absolute;left:0;right:0;height:clamp(22px,3vw,44px);background:inherit;-webkit-mask:url(../img/rasgado.svg) center/100% 100% no-repeat;mask:url(../img/rasgado.svg) center/100% 100% no-repeat;z-index:2;pointer-events:none}
.rasgado-arriba::before{bottom:calc(100% - 1px)}
.rasgado-abajo::after{top:calc(100% - 1px);transform:scaleY(-1)}

/* ---------- Botones ---------- */
.boton{--bc:var(--verde);--bt:var(--beige);display:inline-flex;align-items:center;justify-content:center;gap:12px;min-height:52px;padding:14px 30px;border:1px solid var(--bc);background:var(--bc);color:var(--bt);font-family:var(--f-titulo);font-size:.74rem;font-weight:500;letter-spacing:.22em;text-transform:uppercase;line-height:1.2;text-align:center;border-radius:var(--radio);transition:background .35s var(--t),color .35s var(--t),border-color .35s var(--t),transform .35s var(--t)}
.boton svg{width:18px;height:18px;flex:none;transition:transform .35s var(--t)}
.boton:hover{background:transparent;color:var(--bc)}
.boton:hover svg{transform:translateX(4px)}
.boton--claro{--bc:var(--beige);--bt:var(--verde)}
.boton--contorno{background:transparent;color:var(--bc)}
.boton--contorno:hover{background:var(--bc);color:var(--bt)}
.boton--wa svg{width:20px;height:20px}
.boton--wa:hover svg{transform:none}
.enlace-flecha{display:inline-flex;align-items:center;gap:12px;font-family:var(--f-titulo);font-size:.72rem;font-weight:500;letter-spacing:.24em;text-transform:uppercase;color:var(--verde);padding-bottom:6px;border-bottom:1px solid currentColor;transition:gap .3s var(--t)}
.enlace-flecha svg{width:16px;height:16px}
.enlace-flecha:hover{gap:20px}
.botones{display:flex;flex-wrap:wrap;gap:14px}

/* ---------- Precarga ---------- */
.precarga{position:fixed;inset:0;z-index:1000;display:grid;place-items:center;background:var(--verde);transition:opacity .45s ease,visibility .45s}
.precarga.oculta{opacity:0;visibility:hidden}
.precarga-logo{display:flex;flex-direction:column;align-items:center;gap:22px}
.precarga img{width:92px;height:92px;animation:aparecer .8s var(--t) both}
.precarga-logo span{display:block;width:90px;height:1px;background:rgba(243,239,231,.25);position:relative;overflow:hidden}
.precarga-logo span::after{content:"";position:absolute;inset:0;background:var(--beige);transform:scaleX(0);transform-origin:left;animation:cargar .9s .1s var(--t) forwards}
@keyframes aparecer{from{opacity:0;transform:translateY(10px) scale(.94)}to{opacity:1;transform:none}}
@keyframes cargar{to{transform:scaleX(1)}}
html.visto .precarga{display:none}

/* ---------- Encabezado ---------- */
.encabezado{position:fixed;inset:0 0 auto;z-index:100;height:var(--header-h);display:flex;align-items:center;color:var(--beige);transition:height .4s var(--t),background-color .4s var(--t),color .4s var(--t),box-shadow .4s var(--t)}
.encabezado::before{content:"";position:absolute;inset:0 0 -40px;background:linear-gradient(rgba(0,20,13,.55),transparent);pointer-events:none;transition:opacity .4s}
.encabezado .contenedor{display:flex;align-items:center;justify-content:space-between;gap:24px;position:relative}
.marca{display:block;width:clamp(120px,11vw,150px);transition:width .4s var(--t)}
.marca img{width:100%}
.marca .logo-verde{display:none}
.nav{display:flex;align-items:center;gap:clamp(18px,2.2vw,38px)}
.nav a{position:relative;font-family:var(--f-titulo);font-size:.68rem;font-weight:500;letter-spacing:.2em;text-transform:uppercase;padding:8px 0;white-space:nowrap}
.nav a::after{content:"";position:absolute;left:0;bottom:2px;width:100%;height:1px;background:currentColor;transform:scaleX(0);transform-origin:right;transition:transform .35s var(--t)}
.nav a:hover::after,.nav a[aria-current="page"]::after{transform:scaleX(1);transform-origin:left}
.idioma{display:flex;align-items:center;gap:8px;font-family:var(--f-titulo);font-size:.66rem;letter-spacing:.16em;padding-left:clamp(14px,1.6vw,26px);border-left:1px solid currentColor}
.idioma .activo{font-weight:600}
.idioma .inactivo{opacity:.5;cursor:default}
.encabezado.compacto,.encabezado.solido{--header-h:72px;background:var(--beige);color:var(--verde);box-shadow:0 10px 30px -18px rgba(0,38,26,.35)}
.encabezado.compacto::before,.encabezado.solido::before{opacity:0}
.encabezado.compacto .marca,.encabezado.solido .marca{width:clamp(104px,9vw,124px)}
.encabezado.compacto .logo-beige,.encabezado.solido .logo-beige{display:none}
.encabezado.compacto .logo-verde,.encabezado.solido .logo-verde{display:block}
.boton-menu{display:none;position:relative;width:46px;height:46px;z-index:120}
.boton-menu span{position:absolute;left:11px;right:11px;height:1.5px;background:currentColor;transition:transform .4s var(--t),opacity .3s,top .4s var(--t)}
.boton-menu span:nth-child(1){top:16px}
.boton-menu span:nth-child(2){top:22.5px;right:17px}
.boton-menu span:nth-child(3){top:29px}

/* Menú móvil */
.menu-movil{position:fixed;inset:0;z-index:110;background:var(--verde);color:var(--beige);display:flex;flex-direction:column;justify-content:center;padding:110px var(--gutter) 40px;clip-path:circle(0 at calc(100% - 44px) 44px);transition:clip-path .7s var(--t);overflow:hidden;visibility:hidden}
.menu-movil .topo{width:140vw;height:140vw;right:-60vw;bottom:-50vw;color:var(--beige);opacity:.1}
.menu-movil nav a{display:block;font-family:var(--f-titulo);font-size:clamp(1.3rem,6vw,2rem);font-weight:300;letter-spacing:.12em;text-transform:uppercase;padding:12px 0;opacity:0;transform:translateY(20px);transition:opacity .5s,transform .5s var(--t)}
.menu-movil nav a[aria-current="page"]{font-weight:500}
.menu-movil .pie-menu{margin-top:40px;opacity:0;transition:opacity .5s .4s;font-size:.95rem}
.menu-movil .pie-menu .lema{margin-top:22px}
body.menu-abierto{overflow:hidden}
body.menu-abierto .menu-movil{clip-path:circle(150% at calc(100% - 44px) 44px);visibility:visible}
body.menu-abierto .menu-movil nav a{opacity:1;transform:none}
body.menu-abierto .menu-movil nav a:nth-child(2){transition-delay:.06s}
body.menu-abierto .menu-movil nav a:nth-child(3){transition-delay:.12s}
body.menu-abierto .menu-movil nav a:nth-child(4){transition-delay:.18s}
body.menu-abierto .menu-movil nav a:nth-child(5){transition-delay:.24s}
body.menu-abierto .menu-movil nav a:nth-child(6){transition-delay:.3s}
body.menu-abierto .menu-movil .pie-menu{opacity:1}
body.menu-abierto .encabezado{color:var(--beige);background:transparent;box-shadow:none}
body.menu-abierto .encabezado .logo-beige{display:block}
body.menu-abierto .encabezado .logo-verde{display:none}
body.menu-abierto .boton-menu span:nth-child(1){top:22.5px;transform:rotate(45deg)}
body.menu-abierto .boton-menu span:nth-child(2){opacity:0}
body.menu-abierto .boton-menu span:nth-child(3){top:22.5px;transform:rotate(-45deg)}
@media (max-width:1080px){
  .nav,.encabezado .idioma{display:none}
  .boton-menu{display:block}
}
.menu-movil .idioma{border:0;padding:0;margin-top:26px;font-size:.75rem}

/* ---------- Hero principal (video) ---------- */
.hero{position:relative;min-height:100vh;min-height:100svh;display:flex;align-items:flex-end;color:var(--beige);background:var(--verde-profundo);overflow:hidden;isolation:isolate}
.hero video,.hero .hero-poster{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:-2}
.hero::after{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(180deg,rgba(0,26,17,.35) 0%,rgba(0,26,17,.05) 35%,rgba(0,26,17,.25) 60%,rgba(0,26,17,.82) 100%)}
.hero-contenido{padding-block:calc(var(--header-h) + 60px) clamp(70px,10vh,120px);width:100%}
.hero-lugar{flex-wrap:wrap;hyphens:none;font-family:var(--f-titulo);font-size:.7rem;letter-spacing:.34em;text-transform:uppercase;margin-bottom:26px;display:flex;align-items:center;gap:14px;opacity:.9}
.hero-lugar::before{content:"";width:34px;height:1px;background:currentColor}
.hero h1{font-size:clamp(1.85rem,4.4vw + .3rem,4.6rem);font-weight:300;text-transform:uppercase;letter-spacing:.04em;line-height:1.08;max-width:15ch}
.hero h1 span{display:block}
.hero-pie{display:flex;flex-wrap:wrap;align-items:flex-end;justify-content:space-between;gap:30px;margin-top:clamp(30px,5vh,52px)}
.hero .lema{color:var(--beige)}
.indicador-scroll{position:absolute;left:50%;bottom:22px;transform:translateX(-50%);width:1px;height:46px;background:rgba(243,239,231,.3);overflow:hidden}
.indicador-scroll::after{content:"";position:absolute;left:0;top:-50%;width:1px;height:50%;background:var(--beige);animation:caer 2.2s var(--t) infinite}
@keyframes caer{to{top:110%}}
@media (max-width:720px){.indicador-scroll{display:none}}

/* Hero interno (páginas) */
.hero-interno{position:relative;min-height:clamp(440px,72vh,720px);display:flex;align-items:flex-end;color:var(--beige);background:var(--verde-profundo);overflow:hidden;isolation:isolate}
.hero-interno img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:-2}
.hero-interno::after{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(180deg,rgba(0,26,17,.45),rgba(0,26,17,.15) 40%,rgba(0,26,17,.78))}
.hero-interno .contenedor{padding-block:calc(var(--header-h) + 50px) clamp(60px,9vh,110px)}
.hero-interno h1{font-size:clamp(2rem,4.2vw + .4rem,4.4rem);font-weight:300;text-transform:uppercase;letter-spacing:.05em;line-height:1.08}
.hero-interno .bajada{margin-top:22px;font-size:clamp(1.05rem,.8vw + .8rem,1.35rem);font-weight:300;max-width:46ch;opacity:.95}
.migas{display:flex;gap:10px;font-family:var(--f-titulo);font-size:.64rem;letter-spacing:.24em;text-transform:uppercase;margin-bottom:24px;opacity:.85}
.migas a:hover{text-decoration:underline}

/* ---------- Home: introducción ---------- */
.intro{display:grid;grid-template-columns:1.05fr .95fr;gap:clamp(40px,7vw,110px);align-items:center}
.intro-fotos{position:relative;aspect-ratio:4/5}
.intro-fotos figure{margin:0;position:absolute;overflow:hidden;box-shadow:var(--sombra)}
.intro-fotos img{width:100%;height:100%;object-fit:cover}
.intro-fotos .f1{inset:0 18% 14% 0}
.intro-fotos .f2{width:52%;aspect-ratio:4/5;right:0;bottom:0;border:8px solid var(--beige)}
.intro-fotos .sello{position:absolute;left:-26px;bottom:6%;width:112px;height:112px;border-radius:50%;background:var(--verde);display:grid;place-items:center;z-index:2;box-shadow:var(--sombra)}
.intro-fotos .sello img{width:58px;height:auto}
.intro-texto .entrada{color:var(--tinta)}
@media (max-width:900px){
  .intro{grid-template-columns:1fr}
  .intro-fotos{order:2;max-width:520px;width:100%;margin-inline:auto}
  .intro-fotos .sello{left:-6px;width:88px;height:88px}
  .intro-fotos .sello img{width:46px}
}

/* ---------- Cifras ---------- */
.cifras{overflow-x:clip;overflow-y:visible}
.cifras .topo{width:900px;height:900px;right:-260px;top:0;color:var(--beige);opacity:.09}
.cifras-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));border-top:1px solid rgba(243,239,231,.25);position:relative}
.cifra{padding:clamp(28px,3vw,44px) clamp(16px,2vw,28px) 0 0}
.cifra + .cifra{padding-left:clamp(16px,2vw,28px);border-left:1px solid rgba(243,239,231,.25)}
.cifra .numero{display:block;font-family:var(--f-titulo);font-weight:300;font-size:clamp(2.6rem,4.6vw,4.6rem);line-height:1;letter-spacing:0}
.cifra .etiqueta{display:block;margin-top:16px;font-family:var(--f-titulo);font-size:.7rem;letter-spacing:.22em;text-transform:uppercase;font-weight:500}
.cifra p{margin-top:10px;font-size:.98rem;opacity:.82;line-height:1.5}
.cifras-cabeza{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:flex-end;gap:30px;margin-bottom:clamp(40px,5vw,70px);position:relative}
@media (max-width:900px){
  .cifras-grid{grid-template-columns:1fr 1fr}
  .cifra:nth-child(3){padding-left:0;border-left:0}
  .cifra:nth-child(n+3){border-top:1px solid rgba(243,239,231,.25);margin-top:28px}
}
@media (max-width:480px){
  .cifras-grid{grid-template-columns:1fr}
  .cifra,.cifra + .cifra{padding-left:0;border-left:0}
  .cifra + .cifra{border-top:1px solid rgba(243,239,231,.25);margin-top:28px}
}

/* ---------- Recorrido: los tres pilares ---------- */
.pilares-cabeza{display:grid;grid-template-columns:1fr 1fr;gap:clamp(30px,6vw,90px);align-items:end;margin-bottom:clamp(50px,6vw,90px)}
.pilares{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(18px,2.4vw,34px)}
.pilar{position:relative}
.pilar figure{margin:0 0 28px;aspect-ratio:4/5;overflow:hidden;position:relative}
.pilar figure img{width:100%;height:100%;object-fit:cover;transition:transform 1.2s var(--t)}
.pilar:hover figure img{transform:scale(1.05)}
.pilar .num{position:absolute;left:18px;top:16px;font-family:var(--f-titulo);font-size:.7rem;letter-spacing:.24em;color:var(--beige);background:var(--verde);padding:8px 12px}
.pilar h3{font-size:clamp(1rem,.8vw + .6rem,1.25rem);text-transform:uppercase;letter-spacing:.1em;color:var(--verde);font-weight:500;margin-bottom:14px}
.pilar p{font-size:1rem;color:var(--tinta-suave)}
.pilar:nth-child(2){margin-top:clamp(0px,5vw,70px)}
.pilar:nth-child(3){margin-top:clamp(0px,10vw,140px)}
@media (max-width:900px){
  .pilares-cabeza{grid-template-columns:1fr}
  .pilares{grid-template-columns:1fr;gap:56px;max-width:560px;margin-inline:auto}
  .pilar:nth-child(n){margin-top:0}
  .pilar figure{aspect-ratio:3/2}
}

/* ---------- Líneas de café (tarjetas) ---------- */
.lineas{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(16px,2vw,28px)}
.linea-card{--c:var(--verde);position:relative;display:flex;flex-direction:column;background:var(--beige);color:var(--c);overflow:hidden;box-shadow:var(--sombra);transition:transform .5s var(--t)}
.linea-card:hover{transform:translateY(-8px)}
.linea-card .cabeza{flex:1;padding:clamp(28px,3vw,42px) clamp(22px,2.4vw,34px) 34px;text-align:center}
.linea-card .icono{width:62px;height:auto;margin:0 auto 22px}
.linea-card h3{font-size:clamp(.95rem,.7vw + .55rem,1.15rem);letter-spacing:.14em;text-transform:uppercase;font-weight:500}
.linea-card .sub{display:block;margin-top:14px;padding-top:14px;position:relative;font-family:var(--f-titulo);font-size:.62rem;letter-spacing:.2em;text-transform:uppercase;line-height:1.7}
.linea-card .sub::before{content:"";position:absolute;top:0;left:50%;width:28px;height:1px;background:currentColor;transform:translateX(-50%)}
.linea-card figure{margin:0;position:relative;aspect-ratio:5/4;overflow:hidden;flex:none}
.linea-card figure img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:transform 1.2s var(--t)}
.linea-card:hover figure img{transform:scale(1.06)}
.linea-card figure::before{content:"";position:absolute;left:0;right:0;top:-1px;height:30px;background:var(--beige);-webkit-mask:url(../img/rasgado.svg) center/100% 100% no-repeat;mask:url(../img/rasgado.svg) center/100% 100% no-repeat;transform:scaleY(-1);z-index:2}
.linea-card .pie{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:18px clamp(22px,2.4vw,30px);background:var(--c);color:var(--beige);font-family:var(--f-titulo);font-size:.66rem;letter-spacing:.22em;text-transform:uppercase}
.linea-card .pie svg{width:18px;height:18px;transition:transform .35s var(--t)}
.linea-card:hover .pie svg{transform:translateX(5px)}
.linea--origin{--c:var(--verde)}
.linea--unique{--c:var(--morado)}
.linea--experimental{--c:var(--ocre)}
@media (max-width:980px){.lineas{grid-template-columns:1fr;max-width:520px;margin-inline:auto}}

/* ---------- Símbolo de marca ---------- */
.simbolo{display:grid;grid-template-columns:.9fr 1.1fr;gap:clamp(40px,7vw,110px);align-items:center}
.simbolo-grafico{position:relative;aspect-ratio:1;display:grid;place-items:center}
.simbolo-grafico .topo{inset:0;width:100%;height:100%;color:var(--verde);opacity:.12}
.simbolo-grafico img{width:62%;position:relative}
.pilares-marca{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;margin-top:34px;padding-top:30px;border-top:1px solid var(--beige-3)}
.pilares-marca li{font-family:var(--f-titulo);font-size:.66rem;letter-spacing:.18em;text-transform:uppercase;color:var(--verde);font-weight:500;line-height:1.6}
.pilares-marca li b{display:block;font-size:1.6rem;font-weight:300;letter-spacing:0;margin-bottom:8px}
@media (max-width:900px){
  .simbolo{grid-template-columns:1fr}
  .simbolo-grafico{max-width:360px;width:80%;margin-inline:auto}
}
@media (max-width:480px){.pilares-marca{grid-template-columns:1fr}}

/* ---------- Mundo (eventos) ---------- */
.mundo{overflow-x:clip}
.mundo-cabeza{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:flex-end;gap:30px;margin-bottom:clamp(40px,5vw,64px)}
.carrusel{display:flex;gap:clamp(14px,1.6vw,22px);overflow-x:auto;scroll-snap-type:x mandatory;padding-bottom:18px;scrollbar-width:thin;scrollbar-color:var(--beige) transparent;-webkit-overflow-scrolling:touch}
.carrusel figure{flex:0 0 clamp(240px,26vw,360px);margin:0;scroll-snap-align:start;position:relative}
.carrusel figure img{width:100%;aspect-ratio:4/5;object-fit:cover}
.carrusel figcaption{margin-top:14px;font-family:var(--f-titulo);font-size:.64rem;letter-spacing:.2em;text-transform:uppercase;line-height:1.6}
.carrusel figcaption b{display:block;font-weight:500;font-size:.78rem;letter-spacing:.16em}

/* ---------- Banda de llamado a la acción ---------- */
.banda{position:relative;color:var(--beige);text-align:center;overflow:hidden;isolation:isolate;background:var(--verde-profundo)}
.banda > img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:-2}
.banda::after{content:"";position:absolute;inset:0;background:rgba(0,30,20,.45);z-index:-1}
.banda .contenedor{max-width:900px}
.banda .icono{width:70px;margin:0 auto 30px}
.banda .titulo{color:var(--beige)}
.banda p{margin:24px auto 36px;max-width:52ch;font-size:1.1rem;opacity:.95}
.banda .botones{justify-content:center}

/* ---------- Nosotros ---------- */
.historia-bloque{display:grid;grid-template-columns:5fr 7fr;gap:clamp(36px,6vw,96px);align-items:center}
.historia-bloque + .historia-bloque{margin-top:clamp(80px,10vw,150px)}
.historia-bloque.invertido{grid-template-columns:7fr 5fr}
.historia-bloque.invertido .historia-foto{order:2}
.historia-foto{margin:0;position:relative}
.historia-foto img{width:100%;aspect-ratio:4/5;object-fit:cover;box-shadow:var(--sombra)}
.historia-foto.apaisada img{aspect-ratio:3/2}
.historia-foto figcaption{margin-top:14px;font-family:var(--f-titulo);font-size:.62rem;letter-spacing:.2em;text-transform:uppercase;color:var(--tinta-suave)}
.historia-texto .titulo{margin-bottom:28px}
@media (max-width:900px){
  .historia-bloque,.historia-bloque.invertido{grid-template-columns:1fr}
  .historia-bloque.invertido .historia-foto{order:0}
  .historia-foto{max-width:560px}
  .historia-foto img{aspect-ratio:3/2}
}
.cita-grande{text-align:center;max-width:980px;margin-inline:auto}
.cita-grande .titulo{font-size:clamp(1.5rem,2.8vw + .4rem,3.1rem);line-height:1.2}
.cita-grande .titulo span{display:block}
.cita-grande .icono{width:64px;margin:0 auto 36px}
.manifiesto{display:grid;grid-template-columns:repeat(3,1fr);margin-top:50px;border-top:1px solid rgba(243,239,231,.3)}
.manifiesto li{padding:28px 18px 0;font-family:var(--f-titulo);font-size:.74rem;letter-spacing:.2em;text-transform:uppercase;line-height:1.7}
.manifiesto li + li{border-left:1px solid rgba(243,239,231,.3)}
@media (max-width:720px){
  .manifiesto{grid-template-columns:1fr}
  .manifiesto li + li{border-left:0;border-top:1px solid rgba(243,239,231,.3);margin-top:20px}
}
.mosaico{display:grid;grid-template-columns:repeat(12,1fr);gap:14px;margin-top:clamp(50px,6vw,80px)}
.mosaico figure{margin:0;overflow:hidden}
.mosaico img{width:100%;height:100%;object-fit:cover}
.mosaico .m1{grid-column:span 5;aspect-ratio:4/5}
.mosaico .m2{grid-column:span 4;aspect-ratio:4/5;margin-top:60px}
.mosaico .m3{grid-column:span 3;aspect-ratio:3/4;margin-top:20px}
@media (max-width:720px){
  .mosaico .m1{grid-column:span 12;aspect-ratio:3/2}
  .mosaico .m2,.mosaico .m3{grid-column:span 6;margin-top:0;aspect-ratio:4/5}
}

/* ---------- Nuestros cafés (página) ---------- */
.linea-bloque{--c:var(--verde);display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);min-height:clamp(560px,80vh,820px);background:var(--beige)}
.linea-bloque:nth-of-type(even) .linea-media{order:2}
.linea-media{position:relative;overflow:hidden;background:var(--c)}
.linea-media img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.linea-media .marca-agua{position:absolute;right:28px;bottom:24px;font-family:var(--f-titulo);font-size:clamp(4rem,9vw,8rem);font-weight:300;color:var(--beige);line-height:.9;opacity:.9}
.linea-info{padding:clamp(50px,7vw,110px) clamp(24px,6vw,96px);display:flex;flex-direction:column;justify-content:center;color:var(--c);position:relative}
.linea-info .icono{width:58px;margin-bottom:28px}
.linea-info h2{font-size:clamp(1.35rem,2.4vw + .4rem,2.7rem);letter-spacing:.1em;overflow-wrap:anywhere;text-transform:uppercase;font-weight:400}
.linea-info .sub{display:block;margin-top:18px;font-family:var(--f-titulo);font-size:.7rem;letter-spacing:.24em;text-transform:uppercase;font-weight:500}
.variedades{margin:36px 0 40px;border-top:1px solid color-mix(in srgb,var(--c) 30%,transparent)}
.variedades li{display:flex;justify-content:space-between;align-items:baseline;gap:20px;padding:15px 0;border-bottom:1px solid color-mix(in srgb,var(--c) 30%,transparent);color:var(--tinta)}
.variedades li b{font-family:var(--f-titulo);font-weight:500;font-size:.86rem;letter-spacing:.1em;text-transform:uppercase;color:var(--c)}
.variedades li span{font-family:var(--f-titulo);font-size:.62rem;letter-spacing:.22em;text-transform:uppercase;color:var(--tinta-suave);white-space:nowrap}
.variedades li.nota{display:block;font-size:.98rem;color:var(--tinta-suave);font-style:italic}
.linea-info .boton{--bc:var(--c)}
.linea-info .acciones{display:flex;flex-wrap:wrap;align-items:center;gap:22px 28px}
.linea-info .enlace-flecha{color:var(--c)}
@media (max-width:900px){
  .linea-bloque{grid-template-columns:1fr;min-height:0}
  .linea-bloque:nth-of-type(even) .linea-media{order:0}
  .linea-media{aspect-ratio:4/3}
}

/* Página de cada línea */
.ficha{--c:var(--verde)}
.ficha .hero-interno{background:var(--c)}
.ficha .hero-interno::after{background:linear-gradient(180deg,rgba(0,0,0,.35),rgba(0,0,0,.05) 40%,rgba(0,0,0,.55))}
.ficha-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:16px;margin-top:50px}
.ficha-item{border:1px solid color-mix(in srgb,var(--c) 30%,transparent);padding:30px 26px;background:var(--blanco);transition:border-color .3s,transform .4s var(--t)}
.ficha-item:hover{border-color:var(--c);transform:translateY(-4px)}
.ficha-item .n{font-family:var(--f-titulo);font-size:.62rem;letter-spacing:.24em;color:var(--c);opacity:.7}
.ficha-item h3{margin-top:16px;font-size:1rem;letter-spacing:.12em;text-transform:uppercase;color:var(--c);font-weight:500;line-height:1.4}
.ficha-item p{margin-top:10px;font-family:var(--f-titulo);font-size:.62rem;letter-spacing:.22em;text-transform:uppercase;color:var(--tinta-suave)}
.ficha-cta{background:var(--c);color:var(--beige)}
.ficha-cta .titulo{color:var(--beige)}
.ficha-cta .boton{--bc:var(--beige);--bt:var(--c)}
.otras-lineas{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.otras-lineas a{--c:var(--verde);display:flex;justify-content:space-between;align-items:center;gap:20px;padding:30px;border:1px solid var(--c);color:var(--c);font-family:var(--f-titulo);font-size:.8rem;letter-spacing:.2em;text-transform:uppercase;transition:background .35s,color .35s}
.otras-lineas a:hover{background:var(--c);color:var(--beige)}
.otras-lineas svg{width:20px;height:20px;flex:none}
@media (max-width:640px){.otras-lineas{grid-template-columns:1fr}}

/* ---------- Equipo ---------- */
.equipo{display:grid;grid-template-columns:repeat(6,1fr);gap:clamp(18px,2.4vw,34px)}
.persona{grid-column:span 2}
.persona:nth-child(4){grid-column:2/span 2}
.persona .foto{position:relative;aspect-ratio:4/5;background:var(--beige-2);overflow:hidden;margin-bottom:24px}
.persona .foto img{width:100%;height:100%;object-fit:cover;transition:transform 1s var(--t)}
.persona:hover .foto img{transform:scale(1.04)}
.persona .foto.pendiente{display:grid;place-items:center;background:var(--verde)}
.persona .foto.pendiente .topo{inset:-20%;width:140%;height:140%;color:var(--beige);opacity:.1}
.persona .foto.pendiente .iniciales{font-family:var(--f-titulo);font-weight:300;font-size:clamp(2.4rem,4vw,3.6rem);letter-spacing:.12em;color:var(--beige);position:relative}
.persona .foto.pendiente .aviso{position:absolute;bottom:16px;left:0;right:0;text-align:center;font-family:var(--f-titulo);font-size:.56rem;letter-spacing:.24em;text-transform:uppercase;color:var(--beige);opacity:.6}
.persona .cargo{font-family:var(--f-titulo);font-size:.64rem;letter-spacing:.26em;text-transform:uppercase;color:var(--ocre);font-weight:500}
.persona h3{margin:10px 0 14px;font-size:clamp(1rem,.8vw + .65rem,1.2rem);letter-spacing:.12em;text-transform:uppercase;color:var(--verde);font-weight:500}
.persona p{font-size:1rem;color:var(--tinta-suave)}
@media (max-width:900px){
  .equipo{grid-template-columns:1fr 1fr}
  .persona,.persona:nth-child(4){grid-column:auto}
}
@media (max-width:560px){.equipo{grid-template-columns:1fr;max-width:420px;margin-inline:auto}}

/* ---------- Galería ---------- */
.filtros{display:flex;flex-wrap:wrap;gap:10px;margin-bottom:40px}
.filtros button{padding:12px 22px;border:1px solid var(--verde);color:var(--verde);font-family:var(--f-titulo);font-size:.66rem;letter-spacing:.2em;text-transform:uppercase;border-radius:var(--radio);transition:background .3s,color .3s}
.filtros button[aria-pressed="true"],.filtros button:hover{background:var(--verde);color:var(--beige)}
.galeria{columns:3 300px;column-gap:16px}
.galeria figure{break-inside:avoid;margin:0 0 16px;position:relative;overflow:hidden;cursor:zoom-in;background:var(--beige-2)}
.galeria figure.oculto{display:none}
.galeria img{width:100%;transition:transform 1s var(--t),filter .5s}
.galeria figure:hover img{transform:scale(1.04)}
.galeria figcaption{position:absolute;left:0;right:0;bottom:0;padding:40px 18px 16px;background:linear-gradient(transparent,rgba(0,26,17,.85));color:var(--beige);font-family:var(--f-titulo);font-size:.6rem;letter-spacing:.2em;text-transform:uppercase;line-height:1.6;opacity:0;transform:translateY(10px);transition:opacity .4s,transform .4s var(--t)}
.galeria figure:hover figcaption,.galeria figure:focus-visible figcaption{opacity:1;transform:none}
@media (hover:none){.galeria figcaption{opacity:1;transform:none}}
.galeria-grupo{margin-bottom:clamp(60px,7vw,100px)}
.galeria-grupo .cabeza{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:flex-end;gap:20px;margin-bottom:36px}

/* Visor de fotos */
.visor{position:fixed;inset:0;z-index:300;background:rgba(0,20,13,.96);display:grid;grid-template-columns:70px 1fr 70px;align-items:center;opacity:0;visibility:hidden;transition:opacity .35s,visibility .35s}
.visor.abierto{opacity:1;visibility:visible}
.visor figure{margin:0;grid-column:2;display:flex;flex-direction:column;align-items:center;justify-content:center;height:100vh;height:100svh;padding:60px 0}
.visor img{max-height:calc(100svh - 150px);width:auto;max-width:100%;object-fit:contain;box-shadow:0 30px 80px rgba(0,0,0,.5)}
.visor figcaption{margin-top:18px;color:var(--beige);font-family:var(--f-titulo);font-size:.66rem;letter-spacing:.22em;text-transform:uppercase;text-align:center}
.visor button{color:var(--beige);width:54px;height:54px;display:grid;place-items:center;border:1px solid rgba(243,239,231,.3);border-radius:50%;margin:auto;transition:background .3s}
.visor button:hover{background:rgba(243,239,231,.12)}
.visor button svg{width:22px;height:22px}
.visor .cerrar{position:absolute;top:18px;right:18px;margin:0}
@media (max-width:640px){
  .visor{grid-template-columns:1fr}
  .visor figure{grid-column:1;padding:70px 12px 90px}
  .visor .anterior,.visor .siguiente{position:absolute;bottom:22px}
  .visor .anterior{left:calc(50% - 66px)}
  .visor .siguiente{right:calc(50% - 66px)}
}

/* ---------- Contacto ---------- */
.contacto-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}
.dato{background:var(--blanco);padding:clamp(28px,2.6vw,40px) clamp(22px,2vw,30px);border-top:3px solid var(--verde);display:flex;flex-direction:column;gap:10px}
.dato svg{width:30px;height:30px;color:var(--verde);margin-bottom:12px}
.dato h3{font-size:.74rem;letter-spacing:.24em;text-transform:uppercase;color:var(--verde);font-weight:500;margin-bottom:6px}
.dato a,.dato span{font-size:1.02rem;line-height:1.5;word-break:break-word}
.dato a:hover{color:var(--verde);text-decoration:underline}
.dato small{display:block;font-family:var(--f-titulo);font-size:.58rem;letter-spacing:.2em;text-transform:uppercase;color:var(--tinta-suave);margin-top:-4px}
@media (max-width:1024px){.contacto-grid{grid-template-columns:1fr 1fr}}
@media (max-width:560px){.contacto-grid{grid-template-columns:1fr}}
.mapa{position:relative;height:clamp(300px,38vh,420px);background:var(--beige-2)}
.mapa iframe{width:100%;height:100%;border:0;filter:saturate(.75) contrast(1.02)}
.mapa .etiqueta-mapa{position:absolute;left:var(--gutter);top:24px;background:var(--verde);color:var(--beige);padding:14px 20px;font-family:var(--f-titulo);font-size:.64rem;letter-spacing:.22em;text-transform:uppercase;box-shadow:var(--sombra);pointer-events:none}
.roma{display:grid;grid-template-columns:1fr 1fr;gap:clamp(36px,6vw,90px);align-items:center}
.roma figure{margin:0}
.roma img{width:100%;aspect-ratio:3/2;object-fit:cover;box-shadow:var(--sombra)}
@media (max-width:900px){.roma{grid-template-columns:1fr}}

/* ---------- Texto legal ---------- */
.legal{max-width:820px}
.legal h2{font-size:1.05rem;letter-spacing:.14em;text-transform:uppercase;color:var(--verde);font-weight:500;margin:46px 0 16px}
.legal ul{list-style:disc;padding-left:22px;margin-bottom:1.1em}
.legal li{margin-bottom:.5em}

/* ---------- 404 ---------- */
.error-404{min-height:100vh;min-height:100svh;display:grid;place-items:center;text-align:center;background:var(--verde);color:var(--beige);position:relative;overflow:hidden;padding:120px var(--gutter) 80px}
.error-404 .topo{width:min(110vw,1000px);height:min(110vw,1000px);left:50%;top:50%;transform:translate(-50%,-50%);color:var(--beige);opacity:.1}
.error-404 .codigo{font-family:var(--f-titulo);font-weight:300;font-size:clamp(5rem,16vw,11rem);line-height:1;letter-spacing:.06em}
.error-404 h1{font-size:clamp(1.1rem,1.6vw + .6rem,1.7rem);text-transform:uppercase;letter-spacing:.14em;margin:16px 0 22px}
.error-404 p{max-width:44ch;margin:0 auto 36px;opacity:.9}
.error-404 > div{position:relative}

/* ---------- Pie de página ---------- */
.pie-pagina{background:var(--verde-profundo);color:var(--beige);padding-top:clamp(70px,8vw,110px);position:relative;overflow:hidden}
.pie-pagina .topo{width:760px;height:760px;left:-260px;bottom:-320px;color:var(--beige);opacity:.06}
.pie-grid{display:grid;grid-template-columns:1.3fr 1.2fr .8fr .8fr;gap:clamp(30px,4vw,60px);position:relative}
.pie-marca img{width:170px;margin-bottom:26px}
.pie-marca p{font-size:1rem;opacity:.85;max-width:30ch}
.pie-marca .lema{margin-top:26px;font-size:.66rem}
.pie-pagina h4{font-size:.68rem;letter-spacing:.26em;text-transform:uppercase;font-weight:500;margin-bottom:24px;color:var(--beige);opacity:.65}
.pie-pagina li{margin-bottom:12px;font-size:1rem;line-height:1.5}
.pie-pagina li small{display:block;font-family:var(--f-titulo);font-size:.56rem;letter-spacing:.2em;text-transform:uppercase;opacity:.6;margin-bottom:2px}
.pie-pagina a{transition:opacity .3s}
.pie-pagina a:hover{opacity:.7;text-decoration:underline;text-underline-offset:4px}
.redes{display:flex;gap:12px}
.redes a{width:44px;height:44px;border:1px solid rgba(243,239,231,.35);border-radius:50%;display:grid;place-items:center;transition:background .3s,color .3s,border-color .3s}
.redes a:hover{background:var(--beige);color:var(--verde-profundo);opacity:1;text-decoration:none;border-color:var(--beige)}
.redes svg{width:19px;height:19px}
.pie-final{margin-top:clamp(60px,7vw,90px);padding:26px 0;border-top:1px solid rgba(243,239,231,.18);display:flex;flex-wrap:wrap;justify-content:space-between;gap:12px 30px;font-size:.88rem;opacity:.85;position:relative}
.pie-final nav{display:flex;flex-wrap:wrap;gap:8px 24px}
@media (max-width:1024px){.pie-grid{grid-template-columns:1fr 1fr}}
@media (max-width:560px){
  .pie-grid{grid-template-columns:1fr}
  .pie-final{flex-direction:column}
}

/* ---------- Botones flotantes ---------- */
.flotante-wa{position:fixed;right:clamp(16px,2vw,28px);bottom:clamp(16px,2vw,28px);z-index:90;width:60px;height:60px;border-radius:50%;background:var(--verde);color:var(--beige);display:grid;place-items:center;box-shadow:0 14px 34px -10px rgba(0,38,26,.6);transition:transform .35s var(--t),background .3s}
.flotante-wa::before{content:"";position:absolute;inset:0;border-radius:50%;border:1px solid var(--verde);animation:pulso 2.6s ease-out infinite}
.flotante-wa svg{width:30px;height:30px}
.flotante-wa:hover{transform:scale(1.08);background:var(--verde-oscuro)}
@keyframes pulso{0%{transform:scale(1);opacity:.7}100%{transform:scale(1.6);opacity:0}}
.arriba{position:fixed;right:clamp(16px,2vw,28px);bottom:calc(clamp(16px,2vw,28px) + 74px);z-index:90;width:46px;height:46px;border-radius:50%;background:var(--beige);color:var(--verde);border:1px solid var(--verde);display:grid;place-items:center;opacity:0;visibility:hidden;transform:translateY(10px);transition:opacity .35s,visibility .35s,transform .35s var(--t),background .3s,color .3s;margin-right:7px}
.arriba.visible{opacity:1;visibility:visible;transform:none}
.arriba:hover{background:var(--verde);color:var(--beige)}
.arriba svg{width:18px;height:18px}

/* ---------- Animaciones al hacer scroll ---------- */
.revelar{opacity:0;transform:translateY(34px);transition:opacity 1s var(--t),transform 1s var(--t)}
.revelar.visto{opacity:1;transform:none}
.revelar[data-retraso="1"]{transition-delay:.12s}
.revelar[data-retraso="2"]{transition-delay:.24s}
.revelar[data-retraso="3"]{transition-delay:.36s}
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}
  .revelar{opacity:1;transform:none}
}
.sin-js .revelar{opacity:1;transform:none}

/* ---------- Ajustes generales de cabecera de sección ---------- */
.cabeza-seccion{max-width:760px;margin-bottom:clamp(44px,5vw,72px)}
.cabeza-seccion.centrada{margin-inline:auto;text-align:center}
.cabeza-seccion.centrada .antetitulo{justify-content:center}
.cabeza-seccion.centrada .antetitulo::after{content:"";width:34px;height:1px;background:currentColor}
.cabeza-seccion p{margin-top:24px;color:var(--tinta-suave)}
.seccion--verde .cabeza-seccion p,.seccion--profunda .cabeza-seccion p{color:inherit;opacity:.85}

@media (max-width:560px){.hero-lugar{letter-spacing:.2em;font-size:.62rem}.hero-lugar::before{width:22px}}

/* =========================================================
   AJUSTES RONDA 1
   ========================================================= */
:root{--verde-claro:#7FB59A;--linea-clara:rgba(127,181,154,.35)}
body{line-height:1.75}
p{margin-bottom:1.25em}

/* Logo horizontal en el menú */
.marca{width:clamp(168px,14vw,212px)}
.encabezado.compacto .marca,.encabezado.solido .marca{width:clamp(150px,11vw,176px)}
@media (max-width:560px){.marca{width:158px}.encabezado.compacto .marca,.encabezado.solido .marca{width:142px}}

/* Menú móvil: la X siempre visible por encima del menú */
body.menu-abierto .encabezado{z-index:130}
body.menu-abierto .encabezado::before{opacity:0}

/* Palabras resaltadas en los títulos del hero */
.hero h1,.hero-interno h1{font-weight:400}
mark.resalte{color:inherit;padding:0 .16em;margin:0 -.02em;border-radius:2px;-webkit-box-decoration-break:clone;box-decoration-break:clone;
  background:linear-gradient(rgba(0,93,63,.66),rgba(0,93,63,.66)) no-repeat 0 0/0% 100%;animation:resaltar .9s 1.15s var(--t) forwards}
@keyframes resaltar{to{background-size:100% 100%}}

/* Entrada animada de los elementos del hero */
.a-hero{opacity:0;transform:translateY(30px);animation:entrar 1.05s var(--t) forwards}
.hero .hero-lugar.a-hero{animation-delay:.2s}
.hero h1 .a-hero:nth-child(1){display:block;animation-delay:.4s}
.hero h1 .a-hero:nth-child(2){display:block;animation-delay:.6s}
.hero .hero-pie.a-hero{animation-delay:.9s}
.hero-interno .migas.a-hero{animation-delay:.2s}
.hero-interno h1.a-hero{animation-delay:.4s}
.hero-interno .bajada.a-hero{animation-delay:.7s}
@keyframes entrar{to{opacity:1;transform:none}}
.hero-zoom{animation:acercar 9s ease-out both}
@keyframes acercar{from{transform:scale(1.12)}to{transform:scale(1)}}
.hero .indicador-scroll{opacity:0;animation:entrar 1s 1.4s forwards}

/* Tres barras animadas en el borde inferior de cada hero */
.barras-hero{position:absolute;left:0;right:0;bottom:0;z-index:3;display:grid;gap:5px;pointer-events:none}
.barras-hero span{display:block;height:5px;background:var(--verde);transform:scaleX(0)}
.barras-hero span:nth-child(1){width:30%;transform-origin:left;animation:barra 1s 1.2s var(--t) forwards,vaiven 6s 2.4s ease-in-out infinite alternate}
.barras-hero span:nth-child(2){width:58%;margin-left:auto;transform-origin:right;animation:barra 1.1s 1.5s var(--t) forwards,vaiven 7s 2.8s ease-in-out infinite alternate}
.barras-hero span:nth-child(3){width:93%;transform-origin:left;animation:barra 1.2s 1.8s var(--t) forwards,vaiven 8s 3.2s ease-in-out infinite alternate}
@keyframes barra{to{transform:scaleX(1)}}
@keyframes vaiven{0%{transform:scaleX(1)}100%{transform:scaleX(.82)}}
.hero .barras-hero span:nth-child(1),.hero-interno .barras-hero span:nth-child(1){background:#1F7A55}
.hero .barras-hero span:nth-child(2),.hero-interno .barras-hero span:nth-child(2){background:#11694A}

/* Títulos con renglones definidos */
.titulo .linea{display:block}

/* Cifras con tres renglones */
.puntos{margin-top:14px}
.puntos li{position:relative;padding-left:16px;font-size:.98rem;line-height:1.75;opacity:.88}
.puntos li::before{content:"";position:absolute;left:0;top:.72em;width:6px;height:6px;border-radius:50%;background:var(--verde-claro)}

/* Tarjetas de líneas: títulos y subtítulos en dos renglones */
.linea-card h3{line-height:1.45}
.linea-card .sub{line-height:1.8}

/* Logo que se construye */
.simbolo-grafico .logo-anim{width:84%;position:relative;overflow:visible}
.logo-anim path,.logo-anim polygon{transform-box:fill-box;transition:transform 1s var(--t),opacity .9s var(--t)}
.logo-anim .la-barra{transform-origin:bottom;transform:translateY(55%) scaleY(0);opacity:0}
.logo-anim .la-ovalo{transform-origin:center;transform:scale(.55) rotate(-14deg);opacity:0}
.logo-anim .la-nombre,.logo-anim .la-coffee{transform:translateY(60%);opacity:0}
.simbolo-grafico.animar .la-barra,.simbolo-grafico.animar .la-ovalo,.simbolo-grafico.animar .la-nombre,.simbolo-grafico.animar .la-coffee{transform:none;opacity:1}
.simbolo-grafico.animar .la-b1{transition-delay:.1s}
.simbolo-grafico.animar .la-b2{transition-delay:.4s}
.simbolo-grafico.animar .la-b3{transition-delay:.7s}
.simbolo-grafico.animar .la-ovalo{transition-delay:1.05s;transition-duration:1.2s}
.simbolo-grafico.animar .la-nombre{transition-delay:1.6s}
.simbolo-grafico.animar .la-coffee{transition-delay:1.9s}
.sin-js .logo-anim *{transform:none!important;opacity:1!important}
.pilares-marca li{line-height:1.7}

/* Carrusel: barra de desplazamiento visible y táctil */
.carrusel{cursor:grab;scrollbar-width:auto;scrollbar-color:var(--verde-claro) rgba(127,181,154,.18);padding-bottom:22px;overscroll-behavior-x:contain;touch-action:pan-x pan-y}
.carrusel.arrastrando{cursor:grabbing;scroll-snap-type:none;user-select:none}
.carrusel.arrastrando img{pointer-events:none}
.carrusel::-webkit-scrollbar{height:10px}
.carrusel::-webkit-scrollbar-track{background:rgba(127,181,154,.18);border-radius:10px}
.carrusel::-webkit-scrollbar-thumb{background:var(--verde-claro);border-radius:10px}
.carrusel img{-webkit-user-drag:none}
.carrusel-ayuda{display:flex;align-items:center;gap:10px;margin-top:14px;font-family:var(--f-titulo);font-size:.62rem;letter-spacing:.22em;text-transform:uppercase;color:var(--verde-claro)}
.carrusel-ayuda svg{width:16px;height:16px}

/* Imágenes con efecto paralax */
.banda > img[data-paralax],.fondo-paralax{height:130%;top:-15%;will-change:transform}
.manifiesto-foto{isolation:isolate}
.fondo-wrap{position:absolute;inset:0;overflow:hidden;z-index:-2}
.manifiesto-foto .fondo-paralax{position:absolute;left:0;width:100%;object-fit:cover}
.manifiesto-foto::after{content:"";position:absolute;inset:0;background:rgba(0,30,20,.55);z-index:-1}
.manifiesto-foto.rasgado-arriba::before{background:var(--verde-profundo)}

/* Manifiesto con más aire */
.cita-grande{max-width:1180px}
.cita-grande .titulo{font-size:clamp(1.35rem,2.3vw + .4rem,2.7rem);line-height:1.35;letter-spacing:.06em}
.manifiesto li{line-height:1.8}

/* Mosaico con fotos a la misma altura */
.mosaico--parejo figure{grid-column:span 4!important;margin-top:0!important;aspect-ratio:4/5!important}
@media (max-width:720px){.mosaico--parejo figure{grid-column:span 12!important;aspect-ratio:4/3!important}}

/* Nuestros cafés: compensar el menú al llegar a cada línea */
.linea-bloque{scroll-margin-top:72px}
.linea-bloque:focus{outline:none}

/* Galería en bloques completos */
.galeria{columns:auto;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;grid-auto-flow:dense}
.galeria figure{margin:0;aspect-ratio:1}
.galeria figure.destacada{grid-column:span 2;grid-row:span 2}
.galeria img{width:100%;height:100%;object-fit:cover}
@media (max-width:900px){.galeria{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}}

/* Contacto */
.dato-icono{width:74px;height:74px;border:1.5px solid var(--verde);border-radius:50%;display:grid;place-items:center;margin-bottom:16px;color:var(--verde)}
.dato .dato-icono svg{width:32px;height:32px;margin:0}
.dato h3{font-size:.92rem;letter-spacing:.2em;margin-bottom:8px}
.contacto-nombre{margin-top:10px;padding-top:12px;border-top:1px solid var(--beige-3);font-size:.98rem}
.mapa .etiqueta-mapa{left:50%;top:0;transform:translateX(-50%);white-space:nowrap}
.dos-fotos{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.dos-fotos figure{margin:0}
.dos-fotos figure:nth-child(2){margin-top:60px}
.dos-fotos img{width:100%;aspect-ratio:4/5;object-fit:cover;box-shadow:var(--sombra)}

/* Equipo con fotos */
.persona .foto{aspect-ratio:3/4}

/* Pie de página: líneas entre bloques, más interlineado y nuevos iconos */
.pie-grid > div + div{border-left:1px solid var(--linea-clara);padding-left:clamp(20px,2.4vw,36px)}
.pie-pagina li{line-height:1.7;margin-bottom:16px}
.pie-marca p{line-height:1.85}
.redes{gap:14px}
.redes a{width:42px;height:42px;border:0;border-radius:0}
.redes a:hover{background:none;color:var(--verde-claro)}
.redes svg{width:36px;height:36px}
.pie-final{align-items:center;gap:10px 28px}
.pie-final a:nth-of-type(1){margin-left:auto}
@media (max-width:1024px){.pie-grid > div:nth-child(3){border-left:0;padding-left:0}}
@media (max-width:560px){
  .pie-grid > div + div{border-left:0;padding-left:0;border-top:1px solid var(--linea-clara);padding-top:30px}
  .pie-final{flex-direction:column;align-items:stretch;gap:0;padding:10px 0 30px}
  .pie-final > *{padding:14px 0;border-top:1px solid var(--linea-clara);margin:0!important}
  .pie-final > *:first-child{border-top:0}
}
.hero h1,.hero-interno h1{line-height:1.2}
mark.resalte{background-image:linear-gradient(rgba(0,93,63,.6),rgba(0,93,63,.6))}

/* =========================================================
   AJUSTES RONDA 2
   ========================================================= */
/* Pie: un poco más de espacio entre letras y frase en tres renglones */
.pie-pagina p,.pie-pagina li,.pie-final{letter-spacing:.025em}
.pie-marca .tres-renglones{max-width:none}

/* Barras del hero: mismo grosor, más gruesas */
.barras-hero{gap:6px}
.barras-hero span,.hero .barras-hero span:nth-child(n),.hero-interno .barras-hero span:nth-child(n){height:7px;background:var(--verde)}

/* Círculos de íconos en contacto con línea más gruesa */
.dato-icono{border-width:2.5px}

/* Mapa de Colombia junto al título de contacto */
.titulo-mapa{display:flex;align-items:center;gap:clamp(14px,2vw,26px)}
.mapa-colombia{flex:none;width:clamp(48px,6vw,74px);aspect-ratio:212/274;background:var(--verde);-webkit-mask:url(../img/colombia.svg) center/contain no-repeat;mask:url(../img/colombia.svg) center/contain no-repeat}

/* Etiqueta del mapa sobre el borde superior */
.mapa .etiqueta-mapa{top:0;transform:translate(-50%,-50%);z-index:2}
.mapa{overflow:visible}

/* Fotos de contacto con la misma composición del inicio */
.roma .intro-fotos{max-width:520px;width:100%}

/* Hero: posición de la foto por dispositivo */
.hero-interno img{object-position:var(--pos,center)}
@media (max-width:720px){.hero-interno img{object-position:var(--pos-m,var(--pos,center))}}

/* Líneas de tierra decorativas */
.seccion{overflow-x:clip}
.seccion > .contenedor{position:relative;z-index:1}
.deco{position:absolute;width:var(--t);aspect-ratio:757/804;pointer-events:none;z-index:0;
  -webkit-mask:url(../img/topografia.svg) center/contain no-repeat;mask:url(../img/topografia.svg) center/contain no-repeat}
.deco-izq{left:calc(var(--t) * -.45)}
.deco-der{right:calc(var(--t) * -.45)}
.deco-beige{background:#DDD3C1;opacity:.75}
.seccion--beige2 .deco-beige{background:#D2C6B0}
.deco-verde{background:#2C7A5A;opacity:.45}
.seccion--profunda .deco-verde{background:#1F5A42;opacity:.6}
@media (max-width:720px){.deco{width:calc(var(--t) * .65)}.deco-izq{left:calc(var(--t) * -.38)}.deco-der{right:calc(var(--t) * -.38)}}

/* Menú móvil: flecha y letra más gruesa en la página actual */
.menu-movil nav a[aria-current="page"]{font-weight:600;display:flex;align-items:center;gap:14px}
.menu-movil nav a[aria-current="page"]::before{content:"";width:22px;height:22px;flex:none;background:currentColor;
  -webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2'%3E%3Cpath d='M4 12h15M13 6l6 6-6 6'/%3E%3C/svg%3E") center/contain no-repeat;
  mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2'%3E%3Cpath d='M4 12h15M13 6l6 6-6 6'/%3E%3C/svg%3E") center/contain no-repeat}

/* Sin palabras solas: títulos, antetítulos y textos cortos equilibrados */
.antetitulo,.etiqueta,.sub,.cargo,.bajada,figcaption,.pilares-marca li,.manifiesto li,.dato h3,.hero-lugar{text-wrap:balance}
h1,h2,h3,.titulo,.titulo-sm{text-wrap:balance}
@media (max-width:560px){
  .antetitulo{letter-spacing:.22em;font-size:.64rem;gap:10px}
  .antetitulo::before{width:22px}
  .cabeza-seccion.centrada .antetitulo::after{width:22px}
  .titulo{letter-spacing:.035em}
}

/* Galería: pies de foto pequeños que no invaden la imagen */
.galeria figcaption{padding:22px 10px 8px;font-size:.5rem;letter-spacing:.18em;background:linear-gradient(transparent,rgba(0,26,17,.7))}
@media (hover:none){.galeria figcaption{opacity:.95}}
@media (max-width:560px){.galeria figcaption{font-size:.46rem;padding:18px 8px 6px}}

/* Botones del mismo largo en celular */
@media (max-width:560px){
  .botones{flex-direction:column;align-items:stretch}
  .botones .boton{width:100%}
  .banda .botones{max-width:340px;margin-inline:auto}
}

/* Equipo en celular: línea verde entre integrantes y más espacio */
@media (max-width:560px){
  .equipo{gap:0}
  .persona{padding:34px 0}
  .persona + .persona{border-top:2px solid var(--verde)}
  .persona:first-child{padding-top:0}
}

/* Pilar 01 en celular: encuadre que muestra bien a las personas */
@media (max-width:900px){.pilar figure{aspect-ratio:1}.pilar figure img{object-position:50% 22%}}

/* =========================================================
   AJUSTES RONDA 2B
   ========================================================= */
/* Líneas de tierra más visibles */
.deco{opacity:1!important}
.deco-izq{left:calc(var(--t) * -.28)}
.deco-der{right:calc(var(--t) * -.28)}
.deco-beige{background:#D6C9B1}
.seccion--beige2 .deco-beige{background:#C9BA9F}
.deco-verde{background:#1E7351}
.seccion--profunda .deco-verde{background:#14513A}
@media (max-width:720px){.deco{width:calc(var(--t) * .8)}.deco-izq{left:calc(var(--t) * -.42)}.deco-der{right:calc(var(--t) * -.42)}}

/* Títulos en dos renglones en celular */
@media (max-width:720px){.linea-m{display:block}}

/* Etiqueta del mapa: sobre el borde superior, no encima del mapa */
.mapa{overflow:visible;margin-top:30px}
.mapa .etiqueta-mapa{top:0;left:50%;transform:translate(-50%,-50%);z-index:3}
@media (max-width:560px){.mapa .etiqueta-mapa{font-size:.56rem;padding:12px 16px}}
/* Etiqueta del mapa completamente por encima del mapa, apoyada en su borde */
.mapa{margin-top:0}
.mapa .etiqueta-mapa{transform:translate(-50%,-100%)}
/* Botones de filtro de la galería del mismo largo en celular */
@media (max-width:560px){
  .filtros{flex-direction:column;align-items:stretch}
  .filtros button{width:100%;text-align:center}
}

/* =========================================================
   AJUSTES RONDA 2C — archivo "líneas de tierra" y "mapa de Colombia"
   ========================================================= */
.topo,.deco{-webkit-mask:url(../img/lineas-tierra.svg) center/contain no-repeat;mask:url(../img/lineas-tierra.svg) center/contain no-repeat}
.deco{aspect-ratio:1149/1206}
.deco-izq{left:calc(var(--t) * -.32)}
.deco-der{right:calc(var(--t) * -.32)}
.deco-beige{background:#DCD1BE}
.seccion--beige2 .deco-beige{background:#D1C4AC}
.deco-verde{background:#14684A}
.seccion--profunda .deco-verde{background:#0F4A35}
@media (max-width:720px){.deco{width:calc(var(--t) * .75)}.deco-izq{left:calc(var(--t) * -.4)}.deco-der{right:calc(var(--t) * -.4)}}
.mapa-colombia{aspect-ratio:15.2/19.59;-webkit-mask:url(../img/mapa-colombia.svg) center/contain no-repeat;mask:url(../img/mapa-colombia.svg) center/contain no-repeat}
.deco{will-change:transform}

/* =========================================================
   TEXTURAS, BORDES E ÍCONOS CON ARCHIVOS YA COLOREADOS
   (las máscaras CSS no funcionan al abrir el sitio con doble clic)
   ========================================================= */
.topo,.deco,.mapa-colombia,.rasgado-arriba::before,.rasgado-abajo::after,.linea-card figure::before{-webkit-mask:none!important;mask:none!important}
.deco{background:none;background-position:center;background-size:contain;background-repeat:no-repeat}
.deco-beige{background-image:url(../img/lt-beige.svg)!important;background-color:transparent!important}
.seccion--beige2 .deco-beige{background-image:url(../img/lt-beige2.svg)!important}
.deco-verde{background-image:url(../img/lt-verde.svg)!important;background-color:transparent!important}
.seccion--profunda .deco-verde{background-image:url(../img/lt-profunda.svg)!important}
.deco-beige,.deco-verde,.seccion--beige2 .deco-beige,.seccion--profunda .deco-verde{background-color:transparent!important;background-position:center;background-size:contain;background-repeat:no-repeat}
.topo{background:url(../img/lt-claro.svg) center/contain no-repeat!important}
.simbolo-grafico .topo{background-image:url(../img/lt-marca.svg)!important}
.mapa-colombia{background:url(../img/mapa-colombia-verde.svg) center/contain no-repeat!important}
.rasgado-arriba::before,.rasgado-abajo::after{background:url(../img/rasgado-beige.svg) center/100% 100% no-repeat!important}
.seccion--verde.rasgado-arriba::before{background-image:url(../img/rasgado-verde.svg)!important}
.seccion--beige2.rasgado-arriba::before{background-image:url(../img/rasgado-beige2.svg)!important}
.seccion--profunda.rasgado-arriba::before,.manifiesto-foto.rasgado-arriba::before{background-image:url(../img/rasgado-profunda.svg)!important}
.linea-card figure::before{background:url(../img/rasgado-beige.svg) center/100% 100% no-repeat!important}
/* Sin bordes de papel rasgado en todo el sitio */
.rasgado-arriba::before,.rasgado-abajo::after,.linea-card figure::before{display:none!important;content:none!important}
/* Cada textura queda recortada dentro de su propia sección */
.seccion{overflow:clip}