/* ============================================================
   YVY FOODS — Landing
   Identidad según "MANUAL DE MARCA NUEVO LOGO 2" (brand/identidad.md):
   verdes Amazonas y Vegetal sobre Blanco Liofilizado, Montserrat + Inter,
   colinas en capas como recurso gráfico.
   ============================================================ */
:root{
  /* Primarios (manual pág. 21) */
  --verde:#024A32;           /* Verde Amazonas Intenso — color corporativo */
  --verde-deep:#013A27;
  --verde-noche:#012E1F;     /* fondos profundos y texto sobre dorado */
  --vegetal:#558756;         /* Verde Vegetal — títulos y acentos */
  --vegetal-claro:#8BCBAC;   /* colina clara (portada del manual) */
  --blanco:#F9F9FB;          /* Blanco Liofilizado */
  --niebla:#EDF3EF;          /* superficie suave derivada del blanco y los verdes */
  /* Secundarios (pág. 22) */
  --dorado:#E3B673;          /* Amarillo Dorado */
  --fruto:#48273D;           /* Fruto Profundo */
  --terracota:#DB7B56;       /* Terracota */
  --acento:var(--vegetal);   /* palabra destacada en títulos claros */

  /* Roles */
  --paper:var(--blanco);
  --ink:#10261C;
  --ink-soft:#4C5F54;
  --on-dark:#F9F9FB;
  --on-dark-soft:#C6D9CD;
  --line-light:rgba(2,74,50,.14);
  --line-dark:rgba(249,249,251,.16);
  --line-gold:rgba(227,182,115,.5);

  --banda:url("assets/brand/banda.svg");
  --hills:url("assets/brand/hills.svg");

  --maxw:1240px;
  --r-sm:8px;--r-md:16px;--r-lg:24px;
  --title:'Montserrat',system-ui,-apple-system,'Segoe UI',sans-serif;
  --body:'Inter',system-ui,-apple-system,'Segoe UI',sans-serif;
  --ease-out:cubic-bezier(0.23,1,0.32,1);
  --ease-drawer:cubic-bezier(0.32,0.72,0,1);
}

*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:100px}
body{font-family:var(--body);background:var(--blanco);color:var(--ink);line-height:1.6;-webkit-font-smoothing:antialiased;overflow-x:hidden}
body.intro-lock{overflow:hidden}
a{color:inherit;text-decoration:none}
img{display:block;max-width:100%}
button{font:inherit}
::selection{background:var(--dorado);color:var(--verde-noche)}
.wrap{max-width:var(--maxw);margin:0 auto;padding:0 24px;width:100%}
section{position:relative}
h1,h2,h3,h4{font-family:var(--title);letter-spacing:-.01em}
.accent{color:var(--acento)}
.dark .accent,.markets .accent,.cta-card .accent{color:var(--dorado)}

/* Fondos de la marca */
.bg-blanco{background:var(--blanco)}
.bg-niebla{background:var(--niebla)}
.bg-verde{background:linear-gradient(165deg,var(--verde) 0%,var(--verde-noche) 100%);color:var(--on-dark)}
.bg-vegetal{background:linear-gradient(160deg,#2F6B48 0%,#0D5137 100%);color:var(--on-dark)}

/* Banda de colinas (reemplaza al aguayo): se repite sin costuras y puede moverse */
.banda{height:28px;background:var(--banda) 0 0/120px 28px repeat-x}
.banda.thin{height:14px;background-size:60px 14px}
.banda.move{animation:bandaMove 30s linear infinite}
.banda.move.rev{animation-direction:reverse}
@keyframes bandaMove{to{background-position:1200px 0}}

/* ---------- INTRO: portada del manual (colinas en capas + imagotipo) ---------- */
#intro{position:fixed;inset:0;z-index:300;display:flex;align-items:center;justify-content:center;overflow:hidden;cursor:pointer;background:var(--verde)}
#intro.leave{animation:introUp .95s var(--ease-drawer) forwards}
.intro-hills{position:absolute;left:0;right:0;bottom:0;width:100%;height:64%}
.intro-hills path{opacity:0;transform:translateY(70px);animation:hillUp 1.1s var(--ease-out) forwards;animation-delay:calc(.1s + var(--i) * 70ms)}
.intro-scene{position:relative;z-index:2;display:flex;flex-direction:column;align-items:center;gap:34px;text-align:center;padding:20px;margin-top:-6vh}
.intro-logo{width:clamp(170px,22vw,280px)}
.intro-mark{display:block;width:100%;height:auto;overflow:visible}
.intro-mark path{opacity:0;animation:.85s cubic-bezier(.2,.8,.2,1) forwards}
.intro-mark .m1{animation-name:strokeDown;animation-delay:.9s}
.intro-mark .m2{animation-name:strokeUp;animation-delay:1.05s}
.intro-mark .m3{animation-name:strokeDown;animation-delay:1.2s}
.intro-mark [class^="f"]{animation-name:letterIn;animation-duration:.6s}
.intro-mark .f1{animation-delay:1.55s}.intro-mark .f2{animation-delay:1.62s}.intro-mark .f3{animation-delay:1.69s}.intro-mark .f4{animation-delay:1.76s}.intro-mark .f5{animation-delay:1.83s}
.intro-tag{display:flex;flex-direction:column;gap:8px;opacity:0;transform:translateY(10px);animation:introIn .9s var(--ease-out) 2.15s forwards}
.intro-tag b{font-family:var(--title);font-weight:600;font-size:clamp(18px,2.3vw,27px);color:#fff;letter-spacing:.01em}
.intro-tag span{font-size:clamp(12px,1.2vw,14px);font-weight:500;letter-spacing:.18em;text-transform:uppercase;color:var(--vegetal-claro)}
.intro-skip{position:absolute;right:24px;bottom:28px;z-index:2;font-size:11px;font-weight:600;letter-spacing:.2em;text-transform:uppercase;color:rgba(255,255,255,.75);opacity:0;animation:introFade .6s ease 1s forwards}
@keyframes hillUp{to{opacity:1;transform:none}}
@keyframes strokeDown{from{opacity:0;transform:translateY(-34px)}to{opacity:1;transform:none}}
@keyframes strokeUp{from{opacity:0;transform:translateY(34px)}to{opacity:1;transform:none}}
@keyframes wordIn{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:none}}
@keyframes letterIn{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:none}}
@keyframes introIn{to{opacity:1;transform:none}}
@keyframes introFade{to{opacity:1}}
@keyframes introUp{to{transform:translateY(-100%);visibility:hidden}}

/* ---------- BOTONES ---------- */
.btn{display:inline-flex;align-items:center;gap:8px;font-family:var(--body);font-weight:600;font-size:15px;padding:14px 24px;border-radius:var(--r-sm);cursor:pointer;border:1px solid transparent;transition:transform 160ms var(--ease-out),background-color 220ms var(--ease-out),box-shadow 220ms var(--ease-out),border-color 220ms var(--ease-out),color 220ms var(--ease-out);white-space:nowrap}
.btn-primary{background:var(--verde);color:var(--blanco)}
.btn-primary:hover{background:var(--verde-deep);box-shadow:0 8px 24px rgba(1,52,35,.3)}
.btn-gold{background:var(--dorado);color:var(--verde-noche)}
.btn-gold:hover{background:#D9A65E;box-shadow:0 8px 26px rgba(227,182,115,.35)}
.btn-ghost{background:transparent;color:var(--ink);border-color:rgba(2,74,50,.4)}
.btn-ghost:hover{background:rgba(2,74,50,.08);border-color:var(--vegetal)}
@media(hover:hover)and(pointer:fine){.btn:hover{transform:translateY(-1px)}}
.btn:active{transform:scale(.97);transition-duration:80ms}

/* ---------- NAV ---------- */
header.nav{position:fixed;top:0;left:50%;transform:translate(-50%,-140%);z-index:100;width:max-content;max-width:calc(100% - 24px);margin-top:14px;border:1px solid var(--line-light);border-radius:999px;background:rgba(249,249,251,.82);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);box-shadow:0 10px 30px rgba(1,46,31,.14);transition:transform .9s var(--ease-out),background-color .3s var(--ease-out),box-shadow .3s var(--ease-out)}
body.ready header.nav{transform:translate(-50%,0)}
header.nav.scrolled{background:rgba(249,249,251,.96);box-shadow:0 10px 40px rgba(1,46,31,.2)}
.nav-inner{padding:6px 10px 6px 22px;display:flex;align-items:center;gap:28px}
.brand{display:flex;align-items:center}
.brand img{height:50px;width:auto}
body.ready .brand img{animation:wordIn .8s var(--ease-out) .15s both}
nav.links{display:flex;align-items:center;gap:24px}
nav.links a{font-size:14px;color:var(--ink-soft);font-weight:500;transition:color 200ms var(--ease-out);white-space:nowrap}
nav.links a:hover,nav.links a.active{color:var(--acento)}
.nav-cta{display:flex;align-items:center;gap:12px}
.nav-cta .btn{padding:11px 20px;font-size:14px}
.lang-toggle{display:inline-flex;align-items:center;gap:6px;font-size:12px;font-weight:600;color:var(--ink-soft);background:transparent;border:1px solid var(--line-light);border-radius:999px;padding:8px 13px;cursor:pointer;transition:.2s;letter-spacing:.06em}
.lang-toggle:hover{color:var(--ink);border-color:var(--dorado)}
.burger{display:none;background:none;border:0;cursor:pointer;flex-direction:column;gap:5px;padding:8px}
.burger span{width:22px;height:2px;background:var(--ink);border-radius:2px;transition:.25s}
.burger.open span:nth-child(1){transform:translateY(7px) rotate(45deg)}
.burger.open span:nth-child(2){opacity:0}
.burger.open span:nth-child(3){transform:translateY(-7px) rotate(-45deg)}

/* ---------- HERO ---------- */
.hero{min-height:100vh;display:flex;align-items:center;padding:130px 0 90px;overflow:hidden}
.hero::before{content:"";position:absolute;width:640px;height:640px;border-radius:50%;right:-160px;top:-120px;background:radial-gradient(circle,rgba(227,182,115,.22),transparent 65%);pointer-events:none}
.hero::after{content:"";position:absolute;left:0;right:0;bottom:0;height:38%;background:var(--hills) center bottom/cover no-repeat;opacity:.07;pointer-events:none}
.hero-inner{position:relative;z-index:2}
.hero-grid{display:grid;grid-template-columns:1.15fr .85fr;gap:60px;align-items:center}
.hero-eyebrow{display:flex;align-items:center;gap:14px;margin-bottom:24px}
.hero-eyebrow .ln{height:2px;width:44px;background:var(--acento)}
.hero-eyebrow span{font-weight:600;text-transform:uppercase;letter-spacing:.16em;font-size:12px;color:var(--vegetal)}
.hero h1{font-size:clamp(40px,5.4vw,74px);font-weight:700;line-height:1.05;letter-spacing:-.015em;text-wrap:balance;color:var(--verde)}
.hero .lead{font-size:clamp(16px,1.4vw,19px);max-width:52ch;line-height:1.65;color:var(--ink-soft);margin-top:24px}
.hero-actions{display:flex;gap:16px;flex-wrap:wrap;margin-top:38px}
.hero-visual{position:relative}
.hero-frame{position:relative;aspect-ratio:4/5;border-radius:220px 220px 26px 26px;overflow:hidden;box-shadow:0 30px 70px rgba(1,46,31,.28);border:6px solid var(--blanco);outline:1px solid var(--line-light)}
.hero-slide{position:absolute;inset:0;opacity:0;animation:heroFade 28s linear infinite}
.hero-slide img{width:100%;height:100%;object-fit:cover;animation:kenburns 16s ease-in-out infinite alternate}
.hero-slide:nth-child(2){animation-delay:7s}
.hero-slide:nth-child(3){animation-delay:14s}
.hero-slide:nth-child(4){animation-delay:21s}
@keyframes heroFade{0%{opacity:0}4%{opacity:1}25%{opacity:1}29%{opacity:0}100%{opacity:0}}
@keyframes kenburns{from{transform:scale(1.04)}to{transform:scale(1.14)}}
.hero-frame .banda{position:absolute;left:0;right:0;bottom:0;z-index:2}
.metric-card{position:absolute;left:-60px;bottom:48px;z-index:3;width:260px;background:rgba(249,249,251,.96);border:1px solid var(--line-light);border-radius:var(--r-md);padding:18px 20px;box-shadow:0 24px 50px rgba(1,46,31,.25);color:var(--ink)}
.metric-card .mc-h{font-weight:600;font-size:10.5px;text-transform:uppercase;letter-spacing:.16em;color:var(--acento);margin-bottom:6px}
.metric-row{display:flex;align-items:baseline;gap:12px;padding:8px 0;border-bottom:1px dashed var(--line-light)}
.metric-row:last-child{border-bottom:0;padding-bottom:0}
.metric-row .num{font-family:var(--title);font-size:22px;font-weight:700;min-width:60px;color:var(--verde)}
.metric-row .lbl{font-size:12.5px;color:var(--ink-soft);line-height:1.35}
.scroll-cue{position:absolute;left:50%;bottom:26px;transform:translateX(-50%);z-index:2;width:22px;height:36px;border:1.5px solid rgba(2,74,50,.4);border-radius:12px}
.scroll-cue::after{content:"";position:absolute;left:50%;top:7px;width:3px;height:7px;margin-left:-1.5px;border-radius:2px;background:var(--acento);animation:cue 1.8s ease-in-out infinite}
@keyframes cue{0%{opacity:0;transform:translateY(0)}40%{opacity:1}100%{opacity:0;transform:translateY(12px)}}

/* ---------- HERO: zoom al hacer scroll ----------
   Solo activo en pantallas anchas (main.js añade .zoom-on). El arco original queda
   como referencia de posición y la capa .hz-window lo reemplaza y crece hasta
   cubrir toda la pantalla. */
.hero-zoom{display:none}
.hero-pin.zoom-on{position:relative;height:420vh}
.hero-pin.zoom-on .hero{position:sticky;top:0;height:100vh;min-height:0}
.zoom-on .hero-frame{visibility:hidden}
.zoom-on .hero-zoom{display:block;position:absolute;inset:0;z-index:1;pointer-events:none;opacity:0;transition:opacity .7s var(--ease-out) .16s}
body.ready .zoom-on .hero-zoom{opacity:1}
.hz-window{position:absolute;overflow:hidden;will-change:transform;background:var(--niebla);border:6px solid var(--blanco);outline:1px solid var(--line-light);box-shadow:0 30px 70px rgba(1,46,31,.28);border-radius:220px 220px 26px 26px}
.hz-canvas{position:absolute;inset:0;width:100%;height:100%;opacity:0;background:#02040a}
.hz-pin{position:absolute;transform:translate(-6px,-50%);opacity:0;display:flex;align-items:center;gap:10px;pointer-events:none;z-index:1}
.hz-pin i{width:12px;height:12px;border-radius:50%;background:var(--dorado);box-shadow:0 0 0 4px rgba(227,182,115,.3),0 0 18px var(--dorado);position:relative}
.hz-pin i::after{content:"";position:absolute;inset:-4px;border-radius:50%;border:1.5px solid var(--dorado);animation:ping 2s ease-out infinite}
@keyframes ping{0%{transform:scale(.6);opacity:.9}100%{transform:scale(3);opacity:0}}
.hz-pin b{font-family:var(--title);font-weight:700;font-size:15px;color:var(--blanco);background:rgba(1,40,27,.72);border:1px solid var(--line-gold);padding:4px 11px;border-radius:999px;letter-spacing:.02em}
.hz-shade{position:absolute;inset:0;opacity:0;background:linear-gradient(180deg,rgba(0,32,21,.35) 0%,rgba(0,32,21,.15) 40%,rgba(0,32,21,.55) 100%)}
.hz-window .banda{position:absolute;left:0;right:0;bottom:0;z-index:2}
.hz-caption{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;text-align:center;color:var(--blanco);opacity:0;text-shadow:0 4px 30px rgba(0,0,0,.35)}
.hz-caption span{font-weight:600;font-size:13px;text-transform:uppercase;letter-spacing:.3em;color:var(--dorado)}
.hz-caption b{font-family:var(--title);font-weight:700;font-size:clamp(40px,6vw,86px);line-height:1.05}
.zoom-on .hero-copy,.zoom-on .metric-card,.zoom-on .scroll-cue{will-change:opacity,transform}

/* Móvil / tablet: el hero cabe en una pantalla para poder fijarlo durante el viaje */
@media (max-width:980px){
  .hero-pin.zoom-on{height:420svh}
  .hero-pin.zoom-on .hero{height:100svh;padding:92px 0 20px;align-items:stretch}
  .zoom-on .hero-inner{height:100%}
  .zoom-on .hero-grid{height:100%;display:flex;flex-direction:column;gap:20px}
  .zoom-on .hero-copy{flex:0 0 auto}
  .zoom-on .hero-eyebrow{margin-bottom:12px;gap:10px}
  .zoom-on .hero-eyebrow .ln{width:28px}
  .zoom-on .hero-eyebrow span{font-size:10.5px;letter-spacing:.12em}
  .zoom-on .hero h1{font-size:clamp(30px,8.2vw,46px)}
  .zoom-on .hero .lead{font-size:clamp(14px,3.7vw,16px);line-height:1.5;margin-top:12px}
  .zoom-on .hero-actions{margin-top:18px;gap:10px;flex-wrap:nowrap}
  .zoom-on .hero-actions .btn{flex:1;justify-content:center;padding:12px 14px;font-size:14px}
  .zoom-on .hero-visual{flex:1 1 auto;min-height:0;max-width:none;width:auto;margin:0 auto;align-self:center;height:100%}
  .zoom-on .hero-frame{height:100%;width:auto;max-width:calc(100vw - 48px);aspect-ratio:4/5;margin:0 auto;border-width:5px;border-radius:150px 150px 22px 22px}
  .zoom-on .hz-window{border-width:5px}
  .zoom-on .metric-card{left:-14px;bottom:16px;width:min(190px,56vw);padding:12px 14px;border-radius:14px}
  .zoom-on .metric-card .mc-h{font-size:9.5px;margin-bottom:2px}
  .zoom-on .metric-row{padding:5px 0;gap:8px}
  .zoom-on .metric-row .num{font-size:16px;min-width:42px}
  .zoom-on .metric-row .lbl{font-size:10.5px}
  .zoom-on .hz-caption b{font-size:clamp(34px,10vw,56px);padding:0 20px}
  .zoom-on .hz-pin b{font-size:13px}
}
@media (max-width:980px) and (max-height:700px){
  .zoom-on .hero .lead{display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
  .zoom-on .metric-row:nth-child(n+4){display:none}
}

/* ---------- Escena final del viaje: carteles clicables ---------- */
.hz-spots{position:absolute;inset:0;z-index:3;opacity:0;pointer-events:none}
.hz-spots.live{pointer-events:auto}
.hz-spot{position:absolute;background:transparent;border:2px solid transparent;border-radius:12px;cursor:pointer;padding:0;transition:border-color .25s,box-shadow .25s,background-color .25s}
.hz-spot i{position:absolute;top:-9px;right:-9px;width:18px;height:18px;border-radius:50%;background:var(--dorado);box-shadow:0 0 0 4px rgba(227,182,115,.35),0 4px 12px rgba(0,0,0,.4)}
.hz-spot i::after{content:"";position:absolute;inset:-5px;border-radius:50%;border:2px solid var(--dorado);animation:ping 2s ease-out infinite}
.hz-spot span{position:absolute;left:50%;bottom:-14px;transform:translate(-50%,0);opacity:.92;font-family:var(--body);font-weight:600;font-size:12px;letter-spacing:.06em;color:var(--verde-noche);background:var(--dorado);padding:4px 12px;border-radius:999px;white-space:nowrap;transition:opacity .25s,transform .25s;box-shadow:0 6px 16px rgba(0,0,0,.35)}
.hz-spot:hover,.hz-spot:focus-visible{border-color:var(--dorado);background:rgba(227,182,115,.12);box-shadow:0 0 0 4px rgba(227,182,115,.25),0 0 40px rgba(227,182,115,.35);outline:none}
.hz-spot:hover span,.hz-spot:focus-visible span{opacity:1;transform:translate(-50%,0)}
.hz-spot.soft,.hz-spot.soft:hover,.hz-spot.soft:focus-visible{border-color:transparent;background:none;box-shadow:none}
/* Etiqueta dorada: centrada en su punto de la imagen, con ancho según el texto */
.hz-spot.chip span{left:0;top:0;bottom:auto;transform:translate(-50%,-50%);opacity:1;padding:.32em .95em;line-height:1.3;letter-spacing:.02em;background:linear-gradient(180deg,#EAC98E,#DDB26E);box-shadow:0 3px 10px rgba(0,0,0,.4),inset 0 1px 0 rgba(255,255,255,.4);transition:transform .25s var(--ease-out),box-shadow .25s}
.hz-spot.chip:hover span,.hz-spot.chip:focus-visible span{transform:translate(-50%,-50%) scale(1.08);box-shadow:0 0 0 3px rgba(227,182,115,.5),0 6px 16px rgba(0,0,0,.45)}
.hz-hint{position:absolute;left:50%;bottom:22px;z-index:4;transform:translateX(-50%);opacity:0;display:flex;align-items:center;gap:10px;pointer-events:none;flex-wrap:wrap;justify-content:center;max-width:calc(100% - 32px)}
.hz-hint span{display:inline-flex;align-items:center;gap:8px;font-size:13.5px;font-weight:600;color:var(--blanco);background:rgba(1,46,31,.86);border:1px solid var(--line-gold);padding:9px 16px;border-radius:999px;backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px);box-shadow:0 10px 30px rgba(0,0,0,.35)}
.hz-hint .hh-tap svg{color:var(--dorado)}
.hz-hint .hh-scroll{background:var(--dorado);color:var(--verde-noche);border-color:transparent}
.hh-arrow{display:inline-block;animation:hhBounce 1.4s ease-in-out infinite}
@keyframes hhBounce{0%,100%{transform:translateY(-2px)}50%{transform:translateY(4px)}}

/* Texto traducible pintado sobre los carteles de la escena */
/* Texto de los letreros: tinta oscura directamente sobre la madera de la imagen */
.hz-plate{position:absolute;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;gap:calc(var(--k)*3px);padding:calc(var(--k)*2px) calc(var(--k)*4px);transform:rotate(var(--rot));color:#2C1A0B;font-family:var(--title);font-weight:600;font-size:calc(var(--k)*var(--fs)*var(--fit,1)*1px);line-height:1.2;text-shadow:0 1px 0 rgba(255,236,205,.35);pointer-events:none;overflow:hidden}
.hz-plate b{font-weight:700;text-transform:uppercase;letter-spacing:.02em;font-size:1.08em;line-height:1.15}
.hz-plate b+span{font-family:var(--body);font-weight:600;font-size:.95em;line-height:1.25}

/* Pop-up de sector: diseño propio, cabe en una pantalla sin scroll */
body.modal-open{overflow:hidden}
.sign-modal{position:fixed;inset:0;z-index:400;display:flex;align-items:center;justify-content:center;padding:24px;background:rgba(0,22,14,.55);opacity:0;transition:opacity .35s var(--ease-out)}
.sign-modal.open{opacity:1}
.sign-modal[hidden]{display:none}
.pp-wrap{position:relative;width:min(1120px,100%);height:min(640px,calc(100vh - 48px))}
.sm-close{position:absolute;top:16px;right:16px;z-index:5;width:42px;height:42px;border-radius:50%;border:1px solid var(--line-light);background:rgba(249,249,251,.92);color:var(--verde-noche);font-size:16px;cursor:pointer;box-shadow:0 6px 18px rgba(0,0,0,.18);transition:transform .25s var(--ease-out),background-color .2s}
.sm-close:hover{transform:rotate(90deg);background:#fff}
.sm-close:focus{outline:none}
.sm-close:focus-visible{box-shadow:0 0 0 3px var(--dorado),0 6px 18px rgba(0,0,0,.18)}
.pp-card{height:100%;display:grid;grid-template-columns:.92fr 1.08fr;border-radius:26px;overflow:hidden;background:var(--blanco);box-shadow:0 50px 120px rgba(0,0,0,.55),0 0 0 1px rgba(227,182,115,.35)}
/* columna de imagen */
.pp-hero{position:relative;overflow:hidden;color:var(--blanco);display:flex;align-items:flex-end}
.pp-hero img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transform:scale(1.06);transition:transform 1.4s var(--ease-out)}
.sign-modal.open .pp-hero img{transform:none}
.pp-hero img.alt{opacity:0;transition:opacity .9s var(--ease-out),transform 7s linear}
.sign-modal.open .pp-hero img.alt:not(.on){transform:scale(1.07)}
.pp-hero img.alt.on{opacity:1}
.pp-hero::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(0,26,17,.08) 0%,rgba(0,26,17,.22) 32%,rgba(0,26,17,.76) 60%,rgba(0,26,17,.95) 100%)}
.pp-card:has(.pp-form) .pp-hero::after{background:linear-gradient(180deg,rgba(0,26,17,.1) 0%,rgba(0,26,17,.66) 34%,rgba(0,26,17,.95) 72%)}
.pp-hero-txt{position:relative;z-index:2;padding:36px 36px 52px}
.pp-kicker{display:inline-flex;align-items:center;gap:10px;font-weight:600;font-size:12px;letter-spacing:.2em;text-transform:uppercase;color:var(--dorado);text-shadow:0 1px 8px rgba(0,26,17,.5)}
.pp-kicker::before{content:"";width:28px;height:2px;background:currentColor;flex:0 0 auto}
.pp-bhead .pp-kicker{color:var(--vegetal);text-shadow:none}
.pp-hero h3{font-size:clamp(26px,2.7vw,36px);line-height:1.12;margin:16px 0 12px;color:#fff;text-wrap:balance}
.pp-hero p{font-size:15px;line-height:1.55;color:#E3EEE7;max-width:40ch}
.pp-stats{display:flex;margin-top:22px;flex-wrap:wrap}
.pp-stat{display:flex;align-items:baseline;gap:8px;padding:0 18px;border-left:1px solid rgba(249,249,251,.32)}
.pp-stat:first-child{padding-left:0;border-left:0}
.pp-stat b{font-family:var(--title);font-size:26px;color:var(--dorado);line-height:1}
.pp-stat span{font-size:12.5px;color:#E3EEE7}
.pp-hero .banda{position:absolute;left:0;right:0;bottom:0;z-index:3}
/* columna de contenido */
.pp-main{display:flex;flex-direction:column;justify-content:center;gap:22px;padding:56px 44px 36px;min-height:0}
.pp-quote{font-family:var(--title);font-weight:500;font-size:18px;color:var(--acento);padding-left:14px;border-left:3px solid var(--dorado)}
.pp-market,.pp-brand{display:flex;gap:16px;align-items:flex-start;padding:16px 18px;border-radius:16px;background:rgba(255,255,255,.62);border:1px solid var(--line-light);box-shadow:0 6px 18px rgba(1,46,31,.06);opacity:0;transform:translateY(12px);transition:opacity .5s var(--ease-out) var(--d,0ms),transform .5s var(--ease-out) var(--d,0ms),border-color .25s}
.sign-modal.open :is(.pp-market,.pp-brand,.pp-tile){opacity:1;transform:none}
.pp-market:hover,.pp-brand:hover{border-color:var(--line-gold)}
.pp-ico{flex:0 0 auto;width:46px;height:46px;border-radius:13px;display:flex;align-items:center;justify-content:center;background:var(--verde);color:var(--blanco)}
.pp-market h4,.pp-brand h4{font-size:17px;color:var(--verde);line-height:1.25;margin-bottom:3px}
/* mosaico de categorías */
.pp-tiles{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}
.pp-tile{position:relative;aspect-ratio:4/3.1;border:0;padding:0;border-radius:16px;overflow:hidden;cursor:pointer;background:var(--niebla);text-align:left;opacity:0;transform:translateY(12px);transition:opacity .5s var(--ease-out) var(--d,0ms),transform .5s var(--ease-out) var(--d,0ms),box-shadow .25s}
.pp-tile img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:transform .6s var(--ease-out)}
.pp-tile::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,transparent 35%,rgba(0,26,17,.85))}
.pp-tile span{position:absolute;left:12px;right:12px;bottom:10px;z-index:2;color:#fff;display:flex;flex-direction:column}
.pp-tile b{font-family:var(--title);font-size:15px;line-height:1.2}
.pp-tile small{font-size:11.5px;color:var(--dorado);font-weight:600;margin-top:2px}
.pp-tile:hover{box-shadow:0 0 0 3px var(--dorado),0 14px 30px rgba(1,46,31,.25)}
.pp-tile:hover img{transform:scale(1.08)}
/* marcas */
.pp-brands{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.pp-brand{flex-direction:column;align-items:stretch;padding:0;overflow:hidden}
.pp-logo{height:120px;background:#fff;display:flex;align-items:center;justify-content:center;overflow:hidden}
.pp-logo img{width:100%;height:100%;object-fit:cover}
.pp-logo.contain img{object-fit:contain;padding:12px 20px}

.pp-brand span{font-size:12.5px;color:var(--acento);font-weight:600}
/* mercados */
.pp-markets{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.pp-market{align-items:center}
.pp-flag{font-size:30px;line-height:1}
.pp-market span{font-size:13px;color:var(--acento);font-weight:600}
.pp-origin{grid-column:1/-1;display:flex;align-items:center;gap:10px;padding:13px 18px;border-radius:14px;background:var(--vegetal);color:var(--blanco);font-size:14px;font-weight:500}
.pp-origin svg{color:var(--dorado);flex:0 0 auto}
/* contacto */
.pp-contact{display:flex;flex-direction:column;gap:12px}
/* Pop-ups de puntos: panel verde del manual, números grandes y filas separadas por líneas finas */
.pp-story{position:relative;overflow:hidden;justify-content:stretch;gap:0;padding:68px 48px 34px;color:var(--on-dark);background:linear-gradient(165deg,var(--verde) 0%,var(--verde-noche) 100%)}
.pp-story::before{content:"";position:absolute;left:0;right:0;bottom:0;height:46%;background:var(--hills) center bottom/cover no-repeat;opacity:.24;pointer-events:none}
.pp-story>*{position:relative}
.pp-story .pp-quote{padding:0 0 18px;border:0;font-weight:600;font-size:12px;letter-spacing:.2em;text-transform:uppercase;color:var(--vegetal-claro)}
.pp-index{flex:1;min-height:0;display:flex;flex-direction:column;border-bottom:1px solid rgba(249,249,251,.18)}
.pp-row{position:relative;flex:1;min-height:0;width:100%;display:grid;grid-template-columns:auto minmax(0,1fr);align-items:center;gap:26px;padding:12px 0;font:inherit;color:inherit;text-align:left;background:none;border:0;cursor:pointer;opacity:0;transform:translateY(14px);transition:opacity .6s var(--ease-out) var(--d,0ms),transform .6s var(--ease-out) var(--d,0ms)}
.sign-modal.open .pp-row{opacity:1;transform:none}
.pp-row:focus{outline:none}
.pp-row:focus-visible .pp-row-txt b{text-decoration:underline;text-underline-offset:4px;text-decoration-color:var(--dorado)}
.pp-row-bar{position:absolute;left:0;right:0;top:0;height:1px;background:rgba(249,249,251,.18)}
.pp-row-bar i{display:block;height:2px;margin-top:-.5px;background:var(--dorado);transform:scaleX(0);transform-origin:left}
.sign-modal.open .pp-row.on .pp-row-bar i{animation:ppBar 7s linear forwards}
.pp-index:hover .pp-row.on .pp-row-bar i,.pp-index:focus-within .pp-row.on .pp-row-bar i{animation:none!important;transform:scaleX(1)}
@keyframes ppBar{to{transform:scaleX(1)}}
.pp-row-n{min-width:1.32em;font-family:var(--title);font-weight:700;font-size:clamp(50px,5.4vw,74px);line-height:1;letter-spacing:-.03em;color:rgba(249,249,251,.17);transition:color .5s var(--ease-out)}
.pp-row.on .pp-row-n{color:var(--dorado)}
.pp-row-txt{transition:opacity .5s var(--ease-out),transform .5s var(--ease-out)}
.pp-row:not(.on) .pp-row-txt{opacity:.74}
.pp-row.on .pp-row-txt{transform:translateX(4px)}
.pp-row-txt b{display:block;margin-bottom:6px;font-family:var(--title);font-weight:600;font-size:clamp(18px,1.65vw,22px);line-height:1.2;letter-spacing:-.01em;color:#fff}
.pp-row-txt span{display:block;max-width:44ch;font-size:14.5px;line-height:1.5;color:var(--on-dark-soft)}
.pp-story .pp-actions{padding-top:22px}
.pp-actions{display:flex;gap:12px;flex-wrap:wrap}
.pp-actions .btn{padding:13px 22px}
section[hidden]{display:none!important}
/* Con un cartel abierto el menú queda encima: se puede saltar de un cartel a otro */
@media (min-width:861px){
  body.modal-open header.nav{z-index:450}
  .sign-modal{padding:100px 24px 24px}
  .pp-wrap{height:min(640px,calc(100vh - 124px))}
}
/* Contacto: datos sobre la foto + formulario */
.pp-cinfo{display:flex;flex-direction:column;gap:10px;margin-top:20px}
.pp-cinfo>*{display:flex;align-items:center;gap:12px;color:#fff;font-size:14.5px;font-weight:600;text-decoration:none}
.pp-cinfo svg{flex:0 0 auto;width:36px;height:36px;padding:9px;border-radius:50%;background:rgba(249,249,251,.14);border:1px solid rgba(249,249,251,.25);color:var(--dorado)}
.pp-cinfo small{display:block;font-size:11.5px;font-weight:500;color:#C6D9CD;letter-spacing:.02em}
.pp-cinfo a:hover svg{background:var(--dorado);color:#fff}
.pp-formwrap{justify-content:stretch;padding:40px 40px 32px;position:relative}
.pp-form{display:flex;flex-direction:column;height:100%;min-height:0}
.pp-form .form-row{gap:14px}
.pp-form .field{margin-bottom:14px}
.pp-form .field label{color:var(--ink-soft);margin-bottom:6px;font-size:12.5px}
.pp-form .field input,.pp-form .field select,.pp-form .field textarea{background:rgba(255,255,255,.8);border:1px solid var(--line-light);color:var(--ink);padding:11px 13px}
.pp-form .field select{padding-right:38px}
.pp-form .field input:focus,.pp-form .field select:focus,.pp-form .field textarea:focus{background:#fff}
.pp-form .field.grow{flex:1;display:flex;flex-direction:column;min-height:90px}
.pp-form .field.grow textarea{flex:1;min-height:0;resize:none}
.pp-form .err{color:#B4432F}
.pp-form .btn{width:100%;justify-content:center;padding:14px 22px;font-size:15.5px}
.pp-sent{position:absolute;inset:0;display:none;flex-direction:column;align-items:center;justify-content:center;text-align:center;gap:12px;padding:40px}
.pp-sent>svg{width:64px;height:64px;padding:16px;border-radius:50%;background:var(--verde);color:#fff}
.pp-sent h4{font-family:var(--title);font-size:24px;color:var(--verde-noche);max-width:20ch}
.pp-sent p{color:var(--ink-soft);max-width:38ch}
.pp-formwrap.sent .pp-form{visibility:hidden}
.pp-formwrap.sent .pp-sent{display:flex;animation:ppFade .4s var(--ease-out)}
@keyframes ppFade{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}
@media (max-width:860px){
  .sign-modal{padding:10px}
  .pp-wrap{height:auto;max-height:calc(100svh - 20px);display:flex}
  .pp-card{width:100%;height:auto;grid-template-columns:1fr;grid-template-rows:auto auto;border-radius:22px}
  .pp-hero{min-height:200px}
  .pp-hero-txt{padding:22px 22px 34px}
  .pp-hero h3{font-size:clamp(21px,6vw,28px);margin:10px 0 6px}
  .pp-hero p{font-size:13.5px}
  .pp-stats{margin-top:12px}
  .pp-stat{padding:0 12px}.pp-stat b{font-size:20px}
  .pp-main{justify-content:flex-start;gap:12px;padding:16px 16px 16px;overflow:auto}
  .pp-contact{gap:8px}
  .pp-market{padding:11px 13px;gap:12px}
  .pp-ico{width:38px;height:38px}
  .pp-market h4,.pp-brand h4{font-size:15px}
  .pp-tiles{grid-template-columns:repeat(3,1fr);gap:8px}
  .pp-tile{aspect-ratio:1/1}.pp-tile b{font-size:12.5px}.pp-tile small{font-size:10.5px}
  .pp-logo{height:72px}
  .pp-markets{gap:8px}
  .pp-actions .btn{flex:1;justify-content:center;padding:12px 14px;font-size:14px}
  .pp-actions .btn-ghost{display:none}
  .sm-close{top:10px;right:10px;width:38px;height:38px}
  .pp-hero::after{background:linear-gradient(180deg,rgba(0,26,17,.58),rgba(0,26,17,.92))}
  .pp-story{padding:8px 18px 18px;overflow:auto}
  .pp-story .pp-quote{padding:12px 0}
  .pp-row{gap:16px;padding:14px 0;align-items:start}
  .pp-row-n{font-size:38px}
  .pp-row:not(.on) .pp-row-txt{opacity:1}
  .pp-row.on .pp-row-txt{transform:none}
  .pp-row-bar i{display:none}
  .pp-row-txt b{font-size:16px;margin-bottom:3px}
  .pp-row-txt span{font-size:13px;line-height:1.42}
  .pp-story .pp-actions{padding-top:14px}
  .pp-cinfo{gap:6px;margin-top:12px}.pp-cinfo>*{font-size:13px}.pp-cinfo svg{width:30px;height:30px;padding:7px}
  .pp-formwrap{padding:16px}
  .pp-form .form-row{grid-template-columns:1fr 1fr;gap:10px}
  .pp-form .field{margin-bottom:10px}
  .pp-form .field.grow textarea{min-height:80px}
}
@media (max-width:760px){
  .hz-hint{bottom:16px}
  .hz-hint span{font-size:12.5px;padding:8px 13px}
  .hz-spot i{width:16px;height:16px}
}
@media (max-width:860px) and (max-height:760px){
  .pp-hero p{display:none}
  .pp-row-txt span{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
}



/* ---------- FRANJA DE ATRIBUTOS ---------- */
.cert-strip{padding:24px 0;border-bottom:1px solid var(--line-light)}
.cert-inner{display:flex;align-items:center;justify-content:space-between;gap:28px;flex-wrap:wrap}
.cert-lead{font-family:var(--title);font-weight:500;font-size:18px;color:var(--vegetal)}
.cert-marks{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.cert-mark{display:inline-flex;align-items:center;gap:8px;padding:8px 15px;border:1px solid var(--line-light);border-radius:999px;background:rgba(255,255,255,.45);font-weight:600;font-size:13px;color:var(--verde);transition:border-color .25s var(--ease-out),transform .25s var(--ease-out)}
.cert-mark svg{color:var(--acento)}
@media(hover:hover)and(pointer:fine){.cert-mark:hover{border-color:var(--dorado);transform:translateY(-2px)}}

/* ---------- TICKER ---------- */
.ticker{overflow:hidden;padding:14px 0}
.ticker-track{display:flex;white-space:nowrap;width:max-content;animation:scroll 52s linear infinite}
.ticker:hover .ticker-track{animation-play-state:paused}
.ticker-track span{font-family:var(--title);font-weight:600;font-size:15px;color:var(--blanco);padding:0 4px}
.ticker-track .sep{color:var(--dorado);padding:0 16px}
@keyframes scroll{to{transform:translateX(-50%)}}

/* ---------- SECCIONES ---------- */
.sec{padding:clamp(70px,9vw,118px) 0}
.sec-head{margin-bottom:52px}
.label{font-weight:600;text-transform:uppercase;letter-spacing:.16em;font-size:12.5px;color:var(--acento);display:inline-flex;align-items:center;gap:10px;margin-bottom:18px}
.label::before{content:"";width:18px;height:10px;background:var(--banda) 0 50%/32px 14px;border-radius:2px}
h2.title{font-size:clamp(32px,4.2vw,52px);font-weight:700;line-height:1.1;letter-spacing:-.01em;max-width:19ch;text-wrap:balance;color:var(--verde)}
.lead{color:var(--ink-soft);font-size:clamp(16px,1.35vw,18.5px);max-width:62ch;margin-top:22px}
.dark{color:var(--on-dark)}
.dark .label,.markets .label{color:var(--dorado)}
.dark h2.title,.markets h2.title{color:var(--blanco)}
.dark .lead,.markets .lead{color:var(--on-dark-soft)}

/* ADN */
.cards-4{display:grid;grid-template-columns:repeat(4,1fr);gap:20px}
.card{background:rgba(255,255,255,.55);border:1px solid var(--line-light);border-radius:var(--r-lg);overflow:hidden;display:flex;flex-direction:column;box-shadow:0 6px 20px rgba(1,46,31,.07);transition:transform .35s var(--ease-out),box-shadow .35s var(--ease-out),border-color .35s var(--ease-out)}
.card:hover{transform:translateY(-5px);box-shadow:0 18px 44px rgba(1,46,31,.15);border-color:var(--line-gold)}
.card-img{aspect-ratio:16/10;overflow:hidden;position:relative}
.card-img img{width:100%;height:100%;object-fit:cover;transition:transform .6s var(--ease-out)}
.card:hover .card-img img{transform:scale(1.06)}
.card-img::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,transparent 45%,rgba(1,46,31,.7))}
.card-img .cn{position:absolute;left:18px;bottom:14px;font-family:var(--title);font-weight:700;color:var(--dorado);font-size:15px;z-index:2}
.card-body{padding:24px 24px 28px}
.card-body h3{font-size:19px;font-weight:700;margin-bottom:10px;color:var(--verde)}
.card-body p{color:var(--ink-soft);font-size:14.5px}

/* Productos */
.pills{display:flex;flex-wrap:wrap;gap:10px;margin-bottom:36px}
.pill{font-weight:600;font-size:13px;padding:9px 18px;border-radius:999px;border:1px solid rgba(2,74,50,.25);background:rgba(255,255,255,.35);color:var(--ink-soft);cursor:pointer;transition:.22s}
.pill:hover{color:var(--ink);border-color:var(--acento)}
.pill.active{background:var(--verde);color:var(--blanco);border-color:var(--verde)}
.prod-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:24px}
.prod{background:rgba(255,255,255,.6);border:1px solid var(--line-light);border-radius:var(--r-md);overflow:hidden;display:flex;flex-direction:column;box-shadow:0 6px 20px rgba(1,46,31,.07);transition:transform .18s ease,box-shadow .4s var(--ease-out),border-color .4s var(--ease-out)}
.prod:hover{box-shadow:0 18px 44px rgba(1,46,31,.16);border-color:var(--line-gold)}
.prod.hide{display:none}
.prod.pop{animation:popIn .45s var(--ease-out) both}
@keyframes popIn{from{opacity:0;transform:translateY(14px) scale(.98)}to{opacity:1;transform:none}}
.prod-img{aspect-ratio:4/3;overflow:hidden;position:relative;background:var(--niebla)}
.prod-img img{width:100%;height:100%;object-fit:cover;transition:transform .6s var(--ease-out)}
.prod:hover .prod-img img{transform:scale(1.07)}
.prod-img .badge{position:absolute;top:12px;left:12px;font-weight:600;font-size:10.5px;text-transform:uppercase;letter-spacing:.08em;padding:5px 10px;border-radius:6px}
.prod-img .badge.superfoods{background:var(--vegetal);color:var(--blanco)}
.prod-img .badge.liofilizados{background:var(--dorado);color:var(--verde-noche)}
.prod-img .badge.iqf{background:var(--verde);color:var(--blanco)}
.prod-img .badge.pulpas{background:var(--acento);color:var(--blanco)}
.prod-body{padding:18px;display:flex;flex-direction:column;flex:1}
.prod-body h3{font-size:17px;font-weight:700;margin-bottom:7px;color:var(--verde)}
.prod-body p{color:var(--ink-soft);font-size:13px;flex:1}
.prod-body .ask{margin-top:14px;color:var(--acento);font-weight:600;font-size:13.5px;display:inline-flex;gap:6px;align-items:center;transition:gap .2s,color .2s;align-self:flex-start}
.prod-body .ask:hover{gap:10px;color:var(--vegetal)}

/* Servicios */
.innov-intro{font-family:var(--title);font-weight:500;font-size:clamp(19px,2.2vw,27px);max-width:30ch;line-height:1.35;margin-top:18px;color:var(--blanco)}
.innov-intro em{color:var(--dorado)}
.innov-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}
.innov{position:relative;border-radius:var(--r-lg);overflow:hidden;border:1px solid var(--line-gold);min-height:460px;display:flex;align-items:flex-end;background:var(--verde-noche);box-shadow:0 12px 36px rgba(0,0,0,.28);transition:transform .3s var(--ease-out),box-shadow .3s var(--ease-out);color:var(--blanco)}
@media(hover:hover)and(pointer:fine){.innov:hover{transform:translateY(-4px);box-shadow:0 18px 50px rgba(0,0,0,.4)}}
.innov-bg{position:absolute;inset:0;z-index:0}
.innov-bg img{width:100%;height:100%;object-fit:cover;transition:transform .9s var(--ease-out)}
.innov:hover .innov-bg img{transform:scale(1.06)}
.innov-bg::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(1,46,31,.05) 0%,rgba(1,46,31,.5) 48%,rgba(1,40,27,.96) 100%)}
.innov.fruto .innov-bg::after{background:linear-gradient(180deg,rgba(85,135,86,.05) 0%,rgba(120,70,30,.5) 48%,rgba(1,40,27,.96) 100%)}
.innov::before{content:"";position:absolute;inset:0;z-index:3;background:linear-gradient(115deg,transparent 38%,rgba(255,240,210,.16) 50%,transparent 60%);transform:translateX(-120%);pointer-events:none}
.innov:hover::before{animation:shine 1.25s ease}
@keyframes shine{to{transform:translateX(130%)}}
.innov-body{position:relative;z-index:2;padding:32px;width:100%}
.innov-tag{display:inline-block;font-weight:600;font-size:11px;text-transform:uppercase;letter-spacing:.1em;color:var(--dorado);border:1px solid var(--line-gold);border-radius:999px;padding:5px 12px;margin-bottom:16px}
.innov-body h3{font-size:25px;font-weight:700;margin-bottom:10px;line-height:1.2}
.innov-body p{color:#E3EEE7;font-size:15px;max-width:46ch}
.innov-chips{display:flex;flex-wrap:wrap;gap:8px;margin-top:18px}
.innov-chips span{font-size:12px;font-weight:500;color:#F4ECD9;background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.18);border-radius:999px;padding:5px 11px}
.spark{position:absolute;inset:0;z-index:1;pointer-events:none}
.spark i{position:absolute;width:6px;height:6px;border-radius:50%;background:var(--dorado);box-shadow:0 0 10px var(--dorado);opacity:0;animation:twinkle 3.4s ease-in-out infinite}
.spark i:nth-child(1){top:18%;left:22%}
.spark i:nth-child(2){top:30%;left:74%;animation-delay:.7s;background:var(--acento);box-shadow:0 0 10px var(--acento)}
.spark i:nth-child(3){top:52%;left:40%;animation-delay:1.4s}
.spark i:nth-child(4){top:24%;left:54%;animation-delay:2.1s;background:#fff;box-shadow:0 0 10px #fff}
.spark i:nth-child(5){top:44%;left:84%;animation-delay:2.7s}
@keyframes twinkle{0%,100%{opacity:0;transform:scale(.5)}50%{opacity:1;transform:scale(1)}}

/* Marcas */
.brands-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:20px}
.brand-card{background:rgba(255,255,255,.55);border:1px solid var(--line-light);border-radius:var(--r-lg);overflow:hidden;box-shadow:0 6px 20px rgba(1,46,31,.07);transition:transform .35s var(--ease-out),box-shadow .35s var(--ease-out)}
.brand-card:hover{transform:translateY(-5px);box-shadow:0 18px 44px rgba(1,46,31,.15)}
.brand-logo{aspect-ratio:4/3;display:flex;align-items:center;justify-content:center;overflow:hidden}
.brand-logo img{width:100%;height:100%;object-fit:cover;transition:transform .6s var(--ease-out)}
.brand-logo.contain{background:#fff;padding:10% 14%}
.brand-logo.contain img{object-fit:contain}
.brand-card:hover .brand-logo img{transform:scale(1.05)}
.brand-body{padding:20px 22px 24px}
.brand-body .bt{font-weight:600;font-size:11px;text-transform:uppercase;letter-spacing:.12em;color:var(--acento);margin-bottom:6px}
.brand-body h3{font-size:19px;font-weight:700;color:var(--verde);margin-bottom:6px}
.brand-body p{font-size:13.5px;color:var(--ink-soft)}

/* Del campo al mundo */
.story-track{display:grid;grid-template-columns:repeat(4,1fr)}
.story-step{position:relative;padding:0 22px 0 0}
.story-step:not(:last-child)::after{content:"";position:absolute;top:27px;left:58px;right:-2px;height:2px;background:linear-gradient(90deg,var(--dorado),rgba(227,182,115,.1));transform:scaleX(0);transform-origin:left;transition:transform 1s var(--ease-out) .3s}
.story-step.in::after{transform:scaleX(1)}
.ss-ico{width:54px;height:54px;border-radius:15px;background:rgba(227,182,115,.15);border:1px solid var(--line-gold);display:flex;align-items:center;justify-content:center;color:var(--dorado);margin-bottom:18px;position:relative;z-index:2}
.story-step h4{font-size:18px;font-weight:700;margin-bottom:7px;padding-right:14px}
.story-step p{color:var(--on-dark-soft);font-size:13.5px;padding-right:18px}
.story-marquee{margin-top:56px;overflow:hidden;-webkit-mask-image:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent);mask-image:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent)}
.marquee-track{display:flex;gap:18px;width:max-content;animation:scroll 42s linear infinite}
.story-marquee:hover .marquee-track{animation-play-state:paused}
.mq-item{flex:0 0 auto;width:132px;height:132px;border-radius:18px;overflow:hidden;border:1px solid var(--line-dark);position:relative;background:var(--vegetal);box-shadow:0 10px 26px rgba(0,0,0,.3)}
.mq-item img{width:100%;height:100%;object-fit:cover}
.mq-item span{position:absolute;left:0;right:0;bottom:0;padding:14px 8px 7px;font-family:var(--title);font-weight:600;font-size:12px;color:#fff;background:linear-gradient(transparent,rgba(1,40,27,.88));text-align:center}

/* Mercados */
.markets{overflow:hidden;color:var(--on-dark)}
.markets-bg{position:absolute;inset:0;z-index:0}
.markets-bg img{width:100%;height:100%;object-fit:cover;animation:kenburns 30s ease-in-out infinite alternate}
.markets-bg::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(1,52,35,.94),rgba(1,46,31,.93))}
.markets .wrap{position:relative;z-index:2}
.markets-top{display:grid;grid-template-columns:1fr 1fr;gap:48px;align-items:end;margin-bottom:42px}
.markets-top .lead{margin-top:0}
.origin-strip{display:flex;flex-wrap:wrap;gap:10px;margin-bottom:30px}
.origin-chip{display:inline-flex;align-items:center;gap:8px;background:rgba(249,249,251,.08);border:1px solid var(--line-dark);border-radius:999px;padding:9px 16px;font-size:14px;font-weight:500;transition:background-color .2s,transform .2s}
.origin-chip:hover{background:rgba(249,249,251,.15);transform:translateY(-1px)}
.origin-chip .fl{font-size:17px}
.origin-chip .rl{font-weight:600;font-size:10.5px;text-transform:uppercase;letter-spacing:.08em;color:var(--dorado)}
.map-wrap{position:relative;height:440px;border:1px solid var(--line-dark);border-radius:24px;background:radial-gradient(120% 90% at 50% 0%,rgba(227,182,115,.14),transparent 60%),linear-gradient(160deg,#4A5036,#012E1F);overflow:hidden;margin-bottom:40px}
.map-svg{position:absolute;inset:0;width:100%;height:100%}
.map-land{fill:rgba(249,249,251,.22)}
.map-line{fill:none;stroke:rgba(227,182,115,.85);stroke-width:1.3;stroke-dasharray:4 8;animation:dash 7s linear infinite}
@keyframes dash{to{stroke-dashoffset:-220}}
.map-cap{position:absolute;left:20px;bottom:16px;z-index:3;font-weight:500;font-size:11.5px;color:var(--on-dark-soft);display:flex;gap:16px;flex-wrap:wrap}
.map-cap .sw{width:9px;height:9px;border-radius:50%;display:inline-block;margin-right:6px}
.market-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:18px}
.mkt{background:rgba(249,249,251,.07);border:1px solid var(--line-dark);border-radius:var(--r-md);padding:24px;transition:.3s}
.mkt:hover{border-color:var(--line-gold);background:rgba(249,249,251,.12);transform:translateY(-3px)}
.mkt .flag{font-size:26px;margin-bottom:12px;display:block}
.mkt h3{font-size:19px;font-weight:700;margin-bottom:4px}
.mkt .role{color:var(--dorado);font-weight:600;font-size:11.5px;text-transform:uppercase;letter-spacing:.08em;margin-bottom:10px}
.mkt p{color:var(--on-dark-soft);font-size:13.5px}

/* Método */
.sec-photo{overflow:hidden}
/* Cómo trabajamos: la sección se fija mientras se desbloquean los hitos */
.method-pin.on{height:calc(100vh + var(--n,5) * 55vh)}
.method-pin.on>#method{position:sticky;top:0;height:100vh;display:flex;align-items:center;padding-top:80px;padding-bottom:40px}
.steps.done .step:last-child .dot{animation:stepDone 1.2s var(--ease-out)}
@keyframes stepDone{0%{box-shadow:0 0 0 0 rgba(85,135,86,.55)}100%{box-shadow:0 0 0 22px rgba(85,135,86,0)}}
.sec-photo>.wrap{position:relative;z-index:2}
.sec-bg{position:absolute;inset:0;z-index:0}
.sec-bg img{width:100%;height:100%;object-fit:cover}
.sec-bg::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(1,46,31,.9),rgba(1,40,27,.93))}
.sec-photo.light .sec-bg::after{background:linear-gradient(180deg,rgba(249,249,251,.92),rgba(249,249,251,.96))}
.steps{display:grid;grid-template-columns:repeat(5,1fr)}
.step{padding:0 22px 0 0;position:relative}
/* Línea entre pasos: pista tenue + relleno que avanza con el scroll (--line 0→1) */
.st-line{position:absolute;top:23px;left:54px;right:6px;height:3px;border-radius:3px;background:rgba(85,135,86,.16);overflow:hidden}
.st-line b{display:block;height:100%;background:var(--acento);transform-origin:left;transform:scaleX(var(--line,0))}
/* Número: se rellena desde abajo (--dot 0→1) y el número pasa a crema */
.step .dot{width:50px;height:50px;border-radius:50%;background:var(--blanco);border:2px solid var(--acento);display:flex;align-items:center;justify-content:center;font-family:var(--title);font-weight:700;font-size:17px;color:var(--acento);margin-bottom:20px;position:relative;z-index:2;overflow:hidden;transition:transform .4s var(--ease-out),box-shadow .4s var(--ease-out)}
.step .dot em{position:absolute;inset:0;background:var(--acento);transform-origin:bottom;transform:scaleY(var(--dot,0))}
.step .dot span{position:relative;transition:color .3s}
.step.on .dot{transform:scale(1.08);box-shadow:0 0 0 6px rgba(85,135,86,.14)}
.step.on .dot span{color:var(--blanco)}
.step h3,.step p{transition:opacity .5s var(--ease-out),transform .5s var(--ease-out)}
.steps:not(.filled) .step:not(.on) h3,.steps:not(.filled) .step:not(.on) p{opacity:.45}
.steps.filled .step{--dot:1;--line:1}
.steps.filled .step .dot span{color:var(--blanco)}
.step h3{font-size:17px;font-weight:700;margin-bottom:9px;padding-right:14px;color:var(--verde)}
.step p{color:var(--ink-soft);font-size:13.5px;padding-right:14px}

/* Números */
.numbers{display:grid;grid-template-columns:repeat(4,1fr);gap:24px}
.stat{border-left:3px solid var(--dorado);padding-left:22px}
.stat .big{font-family:var(--title);font-size:clamp(42px,5.4vw,64px);font-weight:700;line-height:1;color:var(--verde);font-variant-numeric:tabular-nums}
.stat .cap{color:var(--ink-soft);font-size:15px;margin-top:12px}
/* ---------- VIDA EN SECCIONES ESTÁTICAS ---------- */
/* En cifras: odómetro, barra dorada que crece y texto que rota */
.stat{position:relative;border-left:0}
.stat::before{content:"";position:absolute;left:0;top:0;bottom:0;width:3px;border-radius:3px;background:var(--dorado);transform:scaleY(0);transform-origin:top;transition:transform 1s var(--ease-out)}
.numbers.live .stat::before{transform:scaleY(1)}
.numbers.live .stat:nth-child(2)::before{transition-delay:.12s}.numbers.live .stat:nth-child(3)::before{transition-delay:.24s}.numbers.live .stat:nth-child(4)::before{transition-delay:.36s}
.stat .big{display:flex;align-items:flex-end;height:1em;overflow:hidden}
.odo{display:inline-block;height:1em;overflow:hidden;line-height:1}
.odo>span{display:flex;flex-direction:column;will-change:transform}
.odo i{font-style:normal;height:1em;line-height:1;display:block}
.odo-s{line-height:1}
.stat .cap{transition:opacity .6s var(--ease-out) .5s,transform .6s var(--ease-out) .5s}
.numbers:not(.live) .stat .cap{opacity:0;transform:translateX(-10px)}
.rot{position:relative;height:24px;margin-top:10px;overflow:hidden;font-size:13.5px;font-weight:600;color:var(--acento)}
.rot span{position:absolute;left:0;top:0;white-space:nowrap;display:inline-flex;align-items:center;gap:7px;opacity:0;transform:translateY(100%);transition:transform .55s var(--ease-out),opacity .55s var(--ease-out)}
.rot span::before{content:"";width:6px;height:6px;border-radius:50%;background:var(--dorado);box-shadow:0 0 0 3px rgba(227,182,115,.2)}
.rot span.on{opacity:1;transform:none}
.rot span.out{opacity:0;transform:translateY(-100%)}
/* Atributos: entran en cascada y un foco los recorre */
.cert-mark{transition:transform .5s var(--ease-out),opacity .5s var(--ease-out),border-color .3s,background-color .3s,box-shadow .3s}
.cert-marks:not(.live) .cert-mark{opacity:0;transform:translateY(10px) scale(.92)}
.cert-marks.live .cert-mark{transition-delay:calc(var(--i) * 90ms)}
.cert-mark.spot{border-color:var(--dorado);background:#fff;box-shadow:0 6px 18px rgba(227,182,115,.25);transform:translateY(-2px)}
.cert-mark.spot svg{animation:checkPop .6s var(--ease-out)}
@keyframes checkPop{0%{transform:scale(.4) rotate(-20deg)}60%{transform:scale(1.25)}100%{transform:none}}
/* Pilares: ícono que gira al entrar y foco con anillo */
.pillar span{position:relative;transition:transform .6s var(--ease-out),box-shadow .4s}
.pillars-grid:not(.live) .pillar span{transform:scale(.6) rotate(-30deg)}
.pillars-grid.live .pillar span{transition-delay:calc(var(--i) * 110ms)}
.pillar span::after{content:"";position:absolute;inset:-6px;border-radius:50%;border:2px solid currentColor;opacity:0}
.pillar.spot span{transform:translateY(-3px) scale(1.06)}
.pillar.spot span::after{animation:ring 1.4s var(--ease-out)}
@keyframes ring{0%{opacity:.6;transform:scale(.8)}100%{opacity:0;transform:scale(1.5)}}
/* Del campo al mundo: íconos con pulso secuencial */
.ss-ico{transition:transform .5s var(--ease-out),background-color .4s,box-shadow .4s}
.story-step.spot .ss-ico{transform:translateY(-4px);background:var(--dorado);color:var(--verde-noche);box-shadow:0 10px 26px rgba(227,182,115,.35)}
/* Títulos: subrayado que se dibuja bajo la palabra destacada */
.sec:not([hidden]) .title .accent,.cta-card h2 .accent{background:linear-gradient(currentColor,currentColor) 0 92%/0 3px no-repeat;transition:background-size 1s var(--ease-out) .35s}
.title.in .accent,.cta-card.in h2 .accent{background-size:100% 3px}
/* CTA: bandas en movimiento, luz que sigue al mouse y brillo en el botón */
.banda.move.rev{animation-direction:reverse}
.cta-glow{position:absolute;inset:0;pointer-events:none;background:radial-gradient(420px circle at var(--mx,50%) var(--my,40%),rgba(227,182,115,.22),transparent 65%);transition:background .2s}
.cta-card .btn{overflow:hidden}
.cta-card .btn::after{content:"";position:absolute;top:0;bottom:0;left:-60%;width:40%;background:linear-gradient(100deg,transparent,rgba(255,255,255,.55),transparent);transform:skewX(-20deg)}
.cta-card.live .btn::after{animation:shine 3.2s ease-in-out 1s infinite}
@keyframes shine{0%{left:-60%}35%,100%{left:130%}}

/* Por qué YVY */
.why-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
/* Por qué YVY: mazo con el scroll (sección fija, una tarjeta por tramo) */
.why-deck{position:relative;height:calc(var(--n,6) * 85vh + 100vh);color:var(--blanco)}
.wd-sticky{position:sticky;top:0;height:100vh;height:100svh;overflow:hidden;display:flex;flex-direction:column}
.wd-sticky>.sec-bg img{transform:scale(1.05)}
.wd-head{position:relative;z-index:30;display:flex;align-items:flex-end;justify-content:space-between;gap:24px;padding-top:max(108px,13vh)}
.wd-head .sec-head{margin:0}
.wd-head .title{font-size:clamp(28px,3.4vw,46px)}
.wd-count{display:flex;align-items:baseline;gap:8px;font-family:var(--title);flex-wrap:wrap;justify-content:flex-end;min-width:220px}
.wd-count b{font-size:46px;line-height:1;height:1em;overflow:hidden;color:var(--dorado);display:inline-block}
.wd-roll{display:flex;flex-direction:column;will-change:transform}
.wd-roll em{font-style:normal;height:1em;line-height:1}
.wd-segs{flex-basis:100%;display:flex;gap:5px;margin-top:10px}
.wd-segs i{flex:1;height:4px;border-radius:4px;background:rgba(249,249,251,.16);overflow:hidden;transition:box-shadow .3s}
.wd-segs b{display:block;height:100%;background:var(--dorado);transform-origin:left;transform:scaleX(0)}
.wd-segs i.done{box-shadow:0 0 10px rgba(227,182,115,.55)}
.wd-count>span:not(.wd-segs){font-size:18px;color:var(--on-dark-soft)}
.wd-count i{font-style:normal}
.wd-stage{position:relative;flex:1;min-height:0;z-index:20}
.wd-card{position:absolute;left:50%;top:50%;width:min(1080px,86vw);height:min(500px,calc(100% - 48px));margin:0;translate:-50% -50%;
  display:grid;grid-template-columns:1.05fr 1fr;border-radius:28px;overflow:hidden;background:#01301F;border:1px solid var(--line-gold);
  box-shadow:0 40px 90px rgba(0,0,0,.5);will-change:transform,opacity;transform-origin:center;opacity:0}
.wd-img{position:relative;overflow:hidden}
.wd-img img{width:100%;height:100%;object-fit:cover;transform:scale(1.15);transition:transform 1.2s var(--ease-out)}
.wd-card.on .wd-img img{transform:none}
.wd-img::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(1,40,27,0) 60%,#01301F)}
.wd-body{position:relative;display:flex;flex-direction:column;justify-content:center;padding:48px 52px;background:#01301F}
.wd-num{position:absolute;top:22px;right:34px;font-family:var(--title);font-weight:700;font-size:clamp(70px,9vw,128px);line-height:1;color:rgba(227,182,115,.16)}
.wd-body .wi{width:60px;height:60px;border-radius:16px;background:rgba(227,182,115,.15);border:1px solid var(--line-gold);display:flex;align-items:center;justify-content:center;color:var(--dorado);margin-bottom:26px}
.wd-body h3{font-size:clamp(28px,3.2vw,46px);line-height:1.08;margin-bottom:16px;color:#fff;text-wrap:balance}
.wd-body p{font-size:clamp(16px,1.35vw,20px);line-height:1.55;color:var(--on-dark-soft);max-width:34ch}
.wd-body>*{transition:opacity .6s var(--ease-out),transform .6s var(--ease-out)}
.wd-card:not(.on) .wd-body>:not(.wd-num){opacity:.0;transform:translateY(14px)}
.wd-card .wd-body h3{transition-delay:.08s}.wd-card .wd-body p{transition-delay:.16s}
/* Sin animación (reducir movimiento): tarjetas en columna */
.why-deck.static{height:auto;padding:100px 0}
.why-deck.static .wd-sticky{position:relative;height:auto;overflow:visible}
.why-deck.static .wd-count{display:none}
.why-deck.static .wd-stage{display:grid;gap:20px;width:min(1080px,86vw);margin:40px auto 0}
.why-deck.static .wd-card{position:relative;left:auto;top:auto;translate:none;width:100%;height:340px;opacity:1}
.why-deck.static .wd-card .wd-body>*{opacity:1;transform:none}
@media (max-width:760px){
  .why-deck{height:calc(var(--n,6) * 75vh + 100vh)}
  .wd-head{padding-top:86px;align-items:flex-start;flex-direction:column;gap:10px}
  .wd-count{justify-content:flex-start}
  .wd-count b{font-size:32px}
  .wd-count{min-width:0;width:100%}
  .wd-card{grid-template-columns:1fr;grid-template-rows:52% 1fr;width:88vw;height:calc(100% - 28px);border-radius:22px}
  .wd-img::after{background:linear-gradient(180deg,rgba(1,40,27,0) 55%,#01301F)}
  .wd-body{padding:22px 24px 26px;justify-content:flex-start}
  .wd-num{top:14px;right:18px;font-size:64px}
  .wd-body .wi{width:46px;height:46px;margin-bottom:14px}
  .wd-body h3{font-size:26px}
  .wd-body p{font-size:15.5px}
  .why-deck.static .wd-card{height:auto}
}

.why-card{background:rgba(249,249,251,.06);border:1px solid var(--line-dark);border-radius:var(--r-lg);padding:28px;transition:.3s}
.why-card:hover{transform:translateY(-3px);border-color:var(--line-gold);background:rgba(249,249,251,.1)}
.why-card .wi{width:50px;height:50px;border-radius:13px;background:rgba(227,182,115,.15);border:1px solid var(--line-gold);display:flex;align-items:center;justify-content:center;color:var(--dorado);margin-bottom:18px}
.why-card h3{font-size:19px;font-weight:700;margin-bottom:9px}
.why-card p{color:var(--on-dark-soft);font-size:14.5px}

/* Quiénes somos */
.team-wrap{display:grid;grid-template-columns:.9fr 1.1fr;gap:40px;align-items:stretch}
.team-photo{border-radius:var(--r-lg);overflow:hidden;position:relative;min-height:380px}
.team-photo img{width:100%;height:100%;object-fit:cover}
.team-photo .cap{position:absolute;left:0;right:0;bottom:0;padding:30px 24px 22px;background:linear-gradient(transparent,rgba(1,40,27,.9));font-family:var(--title);font-weight:500;font-size:17px;color:#fff}
.team-cards{display:flex;flex-direction:column;gap:18px;justify-content:center}
.member{display:flex;gap:20px;background:rgba(255,255,255,.55);border:1px solid var(--line-light);border-radius:var(--r-lg);padding:26px;align-items:flex-start;box-shadow:0 6px 20px rgba(1,46,31,.07);transition:border-color .25s}
.member:hover{border-color:var(--line-gold)}
.avatar{flex:0 0 auto;width:56px;height:56px;border-radius:16px;background:var(--verde);display:flex;align-items:center;justify-content:center;color:var(--blanco);transition:transform .35s var(--ease-out)}
.member:nth-child(2) .avatar{background:var(--acento)}
.member:nth-child(3) .avatar{background:var(--vegetal);color:var(--dorado)}
.member:hover .avatar{transform:scale(1.05)}
.member h3{font-size:19px;font-weight:700;color:var(--verde)}
.member .role{color:var(--acento);font-weight:600;font-size:11.5px;text-transform:uppercase;letter-spacing:.08em;margin:3px 0 10px}
.member p{color:var(--ink-soft);font-size:14.5px}

/* CTA */
.cta-sec{padding:clamp(60px,8vw,100px) 0}
.cta-card{border-radius:var(--r-lg);padding:clamp(48px,6vw,80px) clamp(24px,6vw,72px);text-align:center;box-shadow:0 30px 80px rgba(1,46,31,.3);position:relative;overflow:hidden}
.cta-card .banda{position:absolute;left:0;right:0}
.cta-card .banda.top{top:0}
.cta-card .banda.bottom{bottom:0}
.cta-card h2{font-size:clamp(28px,4vw,48px);font-weight:700;line-height:1.1;max-width:20ch;margin:0 auto;text-wrap:balance;position:relative;color:var(--blanco)}
.cta-card p{color:var(--on-dark-soft);max-width:60ch;margin:22px auto 0;font-size:17px;position:relative}
.cta-card .btn{margin-top:34px;font-size:16px;padding:16px 30px;position:relative}

/* Contacto */
.contact-grid{display:grid;grid-template-columns:.85fr 1.15fr;gap:54px;align-items:start}
.contact-aside .lead{margin-bottom:30px}
.ci{display:flex;gap:14px;align-items:flex-start;padding:16px 0;border-top:1px solid var(--line-light)}
.ci .ci-ico{color:var(--acento);flex:0 0 auto;margin-top:2px}
.ci b{display:block;font-size:14px;font-weight:600;margin-bottom:2px;color:var(--verde)}
.ci span,.ci a{color:var(--ink-soft);font-size:14px}
.ci a:hover{color:var(--acento)}
.form{border-radius:var(--r-lg);padding:34px;box-shadow:0 24px 60px rgba(1,46,31,.25);overflow:hidden;position:relative}
.form-row{display:grid;grid-template-columns:1fr 1fr;gap:18px}
.field{margin-bottom:18px}
.field label{display:block;font-size:13px;font-weight:600;margin-bottom:8px;color:var(--on-dark-soft)}
.field label .req{color:var(--dorado)}
.field input,.field select,.field textarea{width:100%;background:rgba(0,0,0,.18);border:1px solid rgba(249,249,251,.2);border-radius:var(--r-sm);padding:13px 14px;color:var(--blanco);font-family:inherit;font-size:14.5px;transition:.2s}
.field select option{color:var(--ink)}
.field textarea{resize:vertical;min-height:104px}
.field input::placeholder,.field textarea::placeholder{color:#8FA99A}
.field input:focus,.field select:focus,.field textarea:focus{outline:none;border-color:var(--dorado);box-shadow:0 0 0 3px rgba(227,182,115,.25)}
.field select{appearance:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%23C3913B' stroke-width='2.5'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 14px center;padding-right:38px}
.field.invalid input,.field.invalid select,.field.invalid textarea{border-color:#E0835F;box-shadow:0 0 0 3px rgba(224,131,95,.25)}
.err{display:none;color:#F0B08E;font-size:12px;margin-top:6px}
.field.invalid .err{display:block}
.form .btn{width:100%;justify-content:center;margin-top:8px;font-size:16px}
.form-success{display:none;background:rgba(227,182,115,.16);border:1px solid var(--dorado);border-radius:var(--r-md);padding:18px 20px;color:var(--blanco);font-weight:600;margin-bottom:22px;align-items:center;gap:10px}
.form-success svg{color:var(--dorado)}
.form-success.show{display:flex}

/* Footer */
footer{padding:0 0 32px}
footer>.banda{margin-bottom:60px}
.foot-grid{display:grid;grid-template-columns:1.4fr 1fr 1fr;gap:40px;margin-bottom:42px}
.foot-logo{display:inline-flex}
.foot-logo img{height:96px;width:auto}
.foot-brand .tag{color:var(--dorado);font-weight:600;font-size:11.5px;text-transform:uppercase;letter-spacing:.12em;margin:22px 0 6px}
.foot-brand .slogan{color:var(--on-dark-soft);font-family:var(--title);font-weight:500;font-size:16px}
.foot-col h4{font-family:var(--body);font-size:12px;font-weight:600;text-transform:uppercase;letter-spacing:.12em;color:var(--dorado);margin-bottom:18px}
.foot-col p,.foot-col a{display:flex;gap:8px;color:var(--on-dark-soft);font-size:14px;margin-bottom:12px;transition:.2s}
.foot-col a:hover{color:var(--blanco)}
.foot-bottom{border-top:1px solid var(--line-dark);padding-top:24px;display:flex;justify-content:space-between;align-items:center;gap:18px;flex-wrap:wrap}
.foot-bottom small{color:var(--on-dark-soft);font-size:13px}
.back-top{font-weight:600;font-size:12px;color:var(--dorado);cursor:pointer;display:inline-flex;gap:6px;align-items:center;text-transform:uppercase;letter-spacing:.08em;background:none;border:1px solid var(--line-gold);padding:9px 16px;border-radius:var(--r-sm);transition:.2s}
.back-top:hover{border-color:var(--dorado);background:rgba(227,182,115,.1)}

/* ============================================================
   FICHA DE PRODUCTO (producto.html)
   ============================================================ */
a.prod{color:inherit;cursor:pointer}
a.prod:focus-visible{outline:3px solid var(--dorado);outline-offset:3px}
.pd-page header.nav{transform:translate(-50%,0)}
.pd-hero{padding:130px 0 80px}
.crumbs{display:flex;flex-wrap:wrap;align-items:center;gap:8px;font-size:13px;color:var(--ink-soft);margin-bottom:28px}
.crumbs a{color:var(--acento);font-weight:500}
.crumbs a:hover{text-decoration:underline}
.crumbs b{color:var(--ink);font-weight:600}
.crumbs span{opacity:.5}
.pd-grid{display:grid;grid-template-columns:1fr 1fr;gap:56px;align-items:start}
.pd-gallery{position:sticky;top:100px}
.pd-main{position:relative;aspect-ratio:1/1;border-radius:28px;overflow:hidden;border:6px solid var(--blanco);outline:1px solid var(--line-light);box-shadow:0 30px 70px rgba(1,46,31,.25);background:var(--niebla)}
.pd-main img{width:100%;height:100%;object-fit:cover;transition:opacity .18s ease,transform .6s var(--ease-out)}
.pd-main img.swap{opacity:0;transform:scale(1.03)}
.pd-main .badge{position:absolute;top:16px;left:16px;font-weight:600;font-size:11px;text-transform:uppercase;letter-spacing:.08em;padding:6px 12px;border-radius:6px}
.pd-main .badge.superfoods{background:var(--vegetal);color:var(--blanco)}
.pd-main .badge.liofilizados{background:var(--dorado);color:var(--verde-noche)}
.pd-main .badge.iqf{background:var(--verde);color:var(--blanco)}
.pd-main .badge.pulpas{background:var(--acento);color:var(--blanco)}
.pd-main .banda{position:absolute;left:0;right:0;bottom:0}
.pd-thumbs{display:flex;gap:12px;margin-top:16px;flex-wrap:wrap}
.pd-thumb{width:84px;height:84px;border-radius:14px;overflow:hidden;border:2px solid transparent;padding:0;cursor:pointer;background:var(--niebla);opacity:.7;transition:opacity .2s,border-color .2s,transform .2s}
.pd-thumb img{width:100%;height:100%;object-fit:cover}
.pd-thumb:hover{opacity:1;transform:translateY(-2px)}
.pd-thumb.active{opacity:1;border-color:var(--acento)}
.pd-meta{display:flex;align-items:center;gap:14px;flex-wrap:wrap;margin-bottom:16px}
.pd-cat{font-weight:600;font-size:12px;text-transform:uppercase;letter-spacing:.14em;color:var(--acento)}
.pd-brand{font-size:13px;color:var(--ink-soft);padding-left:14px;border-left:1px solid var(--line-light)}
.pd-brand b{color:var(--verde)}
.pd-info h1{font-size:clamp(36px,4.4vw,58px);font-weight:700;line-height:1.05;color:var(--verde);letter-spacing:-.01em}
.pd-tagline{font-family:var(--title);font-weight:500;font-size:clamp(18px,1.7vw,22px);color:var(--vegetal);margin-top:14px;line-height:1.4}
.pd-desc{color:var(--ink-soft);font-size:16px;margin-top:18px;max-width:58ch}
.pd-attrs{display:flex;flex-wrap:wrap;gap:8px;margin-top:22px}
.pd-block{margin-top:30px}
.pd-block h4{font-family:var(--body);font-size:12px;font-weight:600;text-transform:uppercase;letter-spacing:.14em;color:var(--vegetal);margin-bottom:12px;display:flex;align-items:center;gap:10px}
.pd-block h4::after{content:"";flex:1;height:1px;background:var(--line-light)}
.pd-formats{display:grid;grid-template-columns:repeat(auto-fill,minmax(180px,1fr));gap:10px}
.pd-format{background:rgba(255,255,255,.55);border:1px solid var(--line-light);border-radius:14px;padding:14px 16px}
.pd-format b{display:block;font-family:var(--title);color:var(--verde);font-size:16px;margin-bottom:4px}
.pd-format span{font-size:13px;color:var(--ink-soft);line-height:1.45;display:block}
.pd-uses{display:flex;flex-wrap:wrap;gap:8px}
.pd-uses span{font-size:13.5px;font-weight:500;padding:7px 14px;border-radius:999px;background:var(--verde);color:var(--blanco)}
.pd-uses span:nth-child(3n+2){background:var(--acento)}
.pd-uses span:nth-child(3n){background:var(--vegetal)}
.pd-actions{display:flex;gap:14px;flex-wrap:wrap;margin-top:36px}
.pd-benefits{display:grid;grid-template-columns:repeat(4,1fr);gap:20px}
.pd-spec-grid{display:grid;grid-template-columns:1.3fr .9fr;gap:30px;align-items:stretch}
.pd-spec{background:rgba(255,255,255,.6);border:1px solid var(--line-light);border-radius:var(--r-lg);padding:10px 28px 24px;box-shadow:0 6px 20px rgba(1,46,31,.07)}
.pd-spec table{width:100%;border-collapse:collapse}
.pd-spec th,.pd-spec td{text-align:left;padding:15px 0;border-bottom:1px dashed var(--line-light);font-size:14.5px;vertical-align:top}
.pd-spec th{width:38%;font-weight:600;color:var(--vegetal)}
.pd-spec td{color:var(--ink)}
.pd-note{font-size:13px;color:var(--ink-soft);margin-top:16px;font-style:italic}
.pd-process{position:relative;border-radius:var(--r-lg);padding:34px 32px 56px;overflow:hidden;box-shadow:0 24px 60px rgba(1,46,31,.25)}
.pd-process .label{color:var(--dorado)}
.pd-process .pp-ico{width:58px;height:58px;border-radius:16px;background:rgba(227,182,115,.16);border:1px solid var(--line-gold);display:flex;align-items:center;justify-content:center;color:var(--dorado);margin:6px 0 18px}
.pd-process h3{font-size:26px;margin-bottom:10px}
.pd-process p{color:var(--on-dark-soft);font-size:15px}
.pd-process .banda{position:absolute;left:0;right:0;bottom:0}
.pd-nf{min-height:70vh;display:flex;align-items:center}
.pd-nf h1{font-size:clamp(34px,4vw,52px);color:var(--verde)}
.pd-nf .btn{margin-top:28px}
@media (max-width:1200px){.pd-benefits{grid-template-columns:repeat(2,1fr)}}
@media (max-width:980px){
  .pd-grid,.pd-spec-grid{grid-template-columns:1fr;gap:34px}
  .pd-gallery{position:static}
}
@media (max-width:560px){
  .pd-benefits{grid-template-columns:1fr}
  .pd-thumb{width:64px;height:64px}
  .pd-spec{padding:6px 18px 18px}
  .pd-actions .btn{flex:1;justify-content:center}
}

/* ---------- PILARES (bajo el ticker) ---------- */
.pillars{padding:34px 0;border-bottom:1px solid var(--line-light)}
.pillars-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:18px}
.pillar{display:flex;align-items:center;gap:14px;justify-content:center;padding:6px 10px;border-right:1px dashed var(--line-light)}
.pillar:last-child{border-right:0}
.pillar span{width:52px;height:52px;border-radius:50%;display:flex;align-items:center;justify-content:center;flex:0 0 auto;background:rgba(2,74,50,.1);color:var(--verde);border:1px solid var(--line-light)}
.pillar:nth-child(2) span{color:var(--acento);background:rgba(85,135,86,.1)}
.pillar:nth-child(3) span{color:var(--vegetal);background:rgba(2,74,50,.1)}
.pillar:nth-child(4) span{color:var(--dorado);background:rgba(227,182,115,.12)}
.pillar b{font-family:var(--title);font-size:17px;color:var(--verde);line-height:1.2}

/* ---------- MARCA BOLIVIA ---------- */
.bo-grid{display:grid;grid-template-columns:.95fr 1.05fr;gap:24px;align-items:stretch}
.bo-feature{position:relative;border-radius:var(--r-lg);overflow:hidden;min-height:560px;box-shadow:0 24px 60px rgba(0,0,0,.3)}
.bo-feature img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:transform 1.2s var(--ease-out)}
.bo-feature:hover img{transform:scale(1.04)}
.bo-feature::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(1,40,27,.45) 0%,rgba(1,40,27,.05) 38%,rgba(1,40,27,.85) 100%)}
.bo-words{position:absolute;top:30px;left:0;right:0;z-index:2;display:flex;justify-content:center;gap:18px;flex-wrap:wrap}
.bo-words span{font-weight:600;font-size:12px;text-transform:uppercase;letter-spacing:.24em;color:var(--blanco)}
.bo-words span+span::before{content:"·";margin-right:18px;color:var(--dorado)}
.bo-feat-text{position:absolute;left:32px;right:32px;bottom:56px;z-index:2}
.bo-feat-text b{display:block;font-family:var(--title);font-size:clamp(26px,2.8vw,38px);line-height:1.12;color:var(--blanco)}
.bo-feat-text span{display:block;margin-top:12px;font-weight:600;font-size:12.5px;text-transform:uppercase;letter-spacing:.2em;color:var(--dorado)}
.bo-feature .banda{position:absolute;left:0;right:0;bottom:0;z-index:2}
.bo-cards{display:flex;flex-direction:column;gap:18px}
.bo-card{flex:1;display:grid;grid-template-columns:190px 1fr;background:rgba(249,249,251,.07);border:1px solid var(--line-dark);border-radius:var(--r-lg);overflow:hidden;transition:border-color .3s,background-color .3s,transform .3s var(--ease-out)}
.bo-card:hover{border-color:var(--line-gold);background:rgba(249,249,251,.11);transform:translateX(4px)}
.bo-card-img{position:relative;min-height:160px}
.bo-card-img img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.bo-card-body{padding:22px 24px}
.bo-card-body h3{font-size:21px;margin-bottom:8px;color:var(--blanco)}
.bo-card-body p{font-size:14.5px;color:var(--on-dark-soft)}
.impact-row{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin-top:26px}
.impact-item{display:flex;gap:16px;align-items:flex-start;padding:22px;border-radius:var(--r-md);border:1px dashed var(--line-gold)}
.impact-item .wi{width:48px;height:48px;border-radius:13px;flex:0 0 auto;background:rgba(227,182,115,.15);border:1px solid var(--line-gold);display:flex;align-items:center;justify-content:center;color:var(--dorado)}
.impact-item h4{font-size:17px;color:var(--blanco);margin-bottom:4px}
.impact-item p{font-size:13.5px;color:var(--on-dark-soft)}
.prod-img .badge.granos,.pd-main .badge.granos{background:#8C6A2E;color:var(--blanco)}
.prod-img .badge.harinas,.pd-main .badge.harinas{background:var(--blanco);color:var(--vegetal);border:1px solid var(--line-light)}
@media (max-width:980px){
  .pillars-grid{grid-template-columns:repeat(2,1fr);gap:14px}
  .pillar{justify-content:flex-start;border-right:0}
  .bo-grid{grid-template-columns:1fr}
  .bo-feature{min-height:440px}
  .impact-row{grid-template-columns:1fr}
}
@media (max-width:560px){
  .pillar b{font-size:14.5px}
  .pillar span{width:42px;height:42px}
  .bo-card{grid-template-columns:1fr}
  .bo-card-img{min-height:170px}
  .bo-words{gap:10px}
  .bo-words span{font-size:10.5px;letter-spacing:.16em}
  .bo-words span+span::before{margin-right:10px}
}

/* ---------- Ficha: variedades del catálogo Punto Verde ---------- */
.pd-steps{list-style:none;display:flex;flex-wrap:wrap;gap:8px}
.pd-steps li{display:inline-flex;align-items:center;gap:7px;font-size:13.5px;font-weight:500;padding:7px 13px;border-radius:999px;background:rgba(2,74,50,.1);color:var(--verde);border:1px solid var(--line-light)}
.pd-steps li svg{color:var(--acento)}
.pd-variants{padding-top:clamp(50px,6vw,80px)}
.pd-var-head{display:flex;align-items:flex-end;justify-content:space-between;gap:24px}
.pv-logo{height:64px;width:auto;flex:0 0 auto}
.var-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:20px}
.var-card{background:#fff;border:1px solid var(--line-light);border-radius:var(--r-md);overflow:hidden;box-shadow:0 6px 20px rgba(1,46,31,.07);transition:transform .3s var(--ease-out),box-shadow .3s var(--ease-out)}
.var-card:hover{transform:translateY(-4px);box-shadow:0 16px 40px rgba(1,46,31,.14)}
.var-img{aspect-ratio:1/1;background:#f2f2f2;display:flex;align-items:center;justify-content:center;overflow:hidden}
.var-img img{width:100%;height:100%;object-fit:contain;transition:transform .5s var(--ease-out)}
.var-card:hover .var-img img{transform:scale(1.05)}
.var-body{padding:14px 16px 16px;border-top:3px solid #7DC242}
.var-body h3{font-size:16.5px;color:var(--verde);line-height:1.25}
.var-note{display:block;font-size:12px;color:var(--ink-soft);margin-top:4px;line-height:1.4}
.var-pres{display:block;margin-top:8px;font-size:13px;color:var(--ink)}
.var-pres b{color:#2E9B3A;font-weight:700;text-transform:uppercase;font-size:11.5px;letter-spacing:.04em}
.var-foot{margin-top:22px}
.pv-strip{position:relative;overflow:hidden;padding:clamp(56px,7vw,90px) 0;color:#fff}
.pv-strip-bg{position:absolute;inset:0}
.pv-strip-bg img{width:100%;height:100%;object-fit:cover}
.pv-strip-bg::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(30,90,30,.92),rgba(60,130,40,.82))}
.pv-strip-inner{position:relative;z-index:2;display:grid;grid-template-columns:.9fr 1.1fr;gap:40px;align-items:center}
.pv-brand img{height:96px;width:auto;margin-bottom:16px;background:#fff;padding:10px 18px;border-radius:18px;box-shadow:0 10px 26px rgba(0,0,0,.2)}
.pv-brand b{display:block;font-family:var(--title);font-weight:500;font-size:clamp(24px,2.6vw,34px)}
.pv-brand span{display:block;margin-top:8px;font-size:13.5px;opacity:.85}
.pv-facts{display:grid;grid-template-columns:repeat(2,1fr);gap:14px}
.pv-fact{display:flex;align-items:center;gap:14px;background:rgba(255,255,255,.12);border:1px solid rgba(255,255,255,.25);border-radius:var(--r-md);padding:16px 18px}
.pv-fact span{width:50px;height:50px;border-radius:50%;background:#7DC242;display:flex;align-items:center;justify-content:center;flex:0 0 auto;color:#fff}
.pv-fact b{font-family:var(--title);font-size:16px;line-height:1.25}
@media (max-width:980px){.pv-strip-inner{grid-template-columns:1fr}}
@media (max-width:560px){
  .var-grid{grid-template-columns:repeat(2,1fr);gap:12px}
  .var-body{padding:12px}
  .var-body h3{font-size:14.5px}
  .pv-facts{grid-template-columns:1fr}
  .pd-var-head{flex-direction:column;align-items:flex-start}
  .pv-logo{height:50px}
}

/* Pop-up de productos: categorías → productos → detalle */
.pp-main,.pp-hero-txt{animation:ppIn .4s var(--ease-out)}
@keyframes ppIn{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}
.pp-back{align-self:flex-start;border:1px solid var(--line-light);background:rgba(255,255,255,.6);color:var(--vegetal);font-family:var(--body);font-weight:600;font-size:13px;padding:7px 14px;border-radius:999px;cursor:pointer;transition:border-color .2s,color .2s}
.pp-back:hover{border-color:var(--dorado);color:var(--acento)}
.pp-plist{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.pp-pcard{display:flex;flex-direction:column;text-align:left;border:1px solid var(--line-light);background:rgba(255,255,255,.7);border-radius:16px;overflow:hidden;padding:0;cursor:pointer;font:inherit;color:inherit;opacity:0;transform:translateY(12px);transition:opacity .5s var(--ease-out) var(--d,0ms),transform .5s var(--ease-out) var(--d,0ms),box-shadow .25s,border-color .25s}
.sign-modal.open .pp-pcard{opacity:1;transform:none}
.pp-pcard:hover{border-color:var(--dorado);box-shadow:0 14px 30px rgba(1,46,31,.16)}
.pp-pimg{position:relative;display:block;height:118px;overflow:hidden;background:var(--niebla)}
.pp-pimg img{width:100%;height:100%;object-fit:cover;transition:transform .6s var(--ease-out)}
.pp-pcard:hover .pp-pimg img{transform:scale(1.06)}
.pp-pimg .badge{position:absolute;top:8px;left:8px;font-style:normal;font-weight:600;font-size:10px;text-transform:uppercase;letter-spacing:.08em;padding:4px 8px;border-radius:6px}
.pp-pimg .badge.superfoods{background:var(--vegetal);color:var(--blanco)}
.pp-pimg .badge.liofilizados{background:var(--dorado);color:var(--verde-noche)}
.pp-pimg .badge.iqf{background:var(--verde);color:var(--blanco)}
.pp-pimg .badge.pulpas{background:var(--acento);color:var(--blanco)}
.pp-pimg .badge.granos{background:#8C6A2E;color:var(--blanco)}
.pp-pimg .badge.harinas{background:var(--blanco);color:var(--vegetal)}
.pp-ptxt{display:flex;flex-direction:column;gap:3px;padding:11px 14px 13px}
.pp-ptxt b{font-family:var(--title);font-size:15.5px;color:var(--verde);line-height:1.2}
.pp-ptxt small{font-size:12.5px;color:var(--ink-soft);line-height:1.4;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.pp-ptxt i{font-style:normal;font-size:12.5px;font-weight:600;color:var(--acento);margin-top:3px}
.pp-plist.few .pp-pimg{height:190px}
.pp-detail{gap:16px}
.pp-desc{font-size:14.5px;line-height:1.6;color:var(--ink-soft);display:-webkit-box;-webkit-line-clamp:5;-webkit-box-orient:vertical;overflow:hidden}
.pp-chips{display:flex;flex-wrap:wrap;gap:7px}
.pp-chips span{display:inline-flex;align-items:center;gap:6px;font-size:12.5px;font-weight:600;padding:6px 11px;border-radius:999px;background:rgba(2,74,50,.1);color:var(--verde);border:1px solid var(--line-light)}
.pp-chips svg{color:var(--acento)}
.pp-specs{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin:0}
.pp-specs div{background:rgba(255,255,255,.62);border:1px solid var(--line-light);border-radius:12px;padding:10px 13px}
.pp-specs dt{font-size:11px;font-weight:600;text-transform:uppercase;letter-spacing:.1em;color:var(--acento);margin-bottom:3px}
.pp-specs dd{margin:0;font-size:13px;color:var(--ink);line-height:1.4}
.pp-detail .pp-hero-txt p{max-width:46ch}
@media (max-width:860px){
  .pp-plist{gap:8px}
  .pp-pimg{height:84px}.pp-plist.few .pp-pimg{height:130px}
  .pp-ptxt{padding:8px 10px 10px}.pp-ptxt b{font-size:13.5px}.pp-ptxt small{display:none}
  .pp-desc{font-size:13px;-webkit-line-clamp:3}
  .pp-specs{gap:6px}.pp-specs div{padding:7px 10px}.pp-specs dd{font-size:12px}
  .pp-detail{gap:10px}
  .pp-detail .pp-actions .btn-ghost{display:inline-flex}
}

/* Pop-up: transiciones entre vistas */
.pp-card.nav-fwd .pp-main{animation:ppSlideL .5s var(--ease-out)}
.pp-card.nav-back .pp-main{animation:ppSlideR .5s var(--ease-out)}
.pp-card.nav-fwd .pp-hero-txt,.pp-card.nav-back .pp-hero-txt{animation:ppIn .55s var(--ease-out) .1s both}
.pp-card.nav-back .pp-hero > img{animation:ppZoom .7s var(--ease-out)}
@keyframes ppSlideL{from{opacity:0;transform:translateX(34px)}to{opacity:1;transform:none}}
@keyframes ppSlideR{from{opacity:0;transform:translateX(-34px)}to{opacity:1;transform:none}}
@keyframes ppZoom{from{opacity:.4;transform:scale(1.08)}to{opacity:1;transform:none}}
.pp-card .pp-pcard,.pp-card .pp-tile,.pp-card .pp-brand,.pp-card .pp-mini,.pp-card .pp-market{animation:ppIn .45s var(--ease-out) var(--d,0ms) both}

/* Pop-up de Mercados: mapa */
.pp-map.map-wrap{flex:1 1 auto;height:auto;min-height:0;margin:0;border-radius:18px}
/* Mercados: título en una franja superior y el mapa a todo el ancho */
.pp-card:has(.pp-map){grid-template-columns:1fr;grid-template-rows:auto 1fr}
.pp-card:has(.pp-map) .pp-hero{min-height:0}
.pp-card:has(.pp-map) .pp-hero::after{background:linear-gradient(90deg,rgba(0,26,17,.92) 0%,rgba(0,26,17,.7) 55%,rgba(0,26,17,.35) 100%)}
.pp-card:has(.pp-map) .pp-hero img{object-position:50% 70%}
.pp-card:has(.pp-map) .pp-hero-txt{width:100%;display:grid;grid-template-columns:1fr auto;column-gap:28px;align-items:end;padding:24px 84px 32px 28px}
.pp-card:has(.pp-map) .pp-hero-txt > *{grid-column:1}
.pp-card:has(.pp-map) .pp-kicker{justify-self:start}
.pp-card:has(.pp-map) .pp-hero h3{font-size:clamp(22px,2.2vw,30px);margin:10px 0 6px}
.pp-card:has(.pp-map) .pp-hero p{max-width:60ch}
.pp-card:has(.pp-map) .pp-stats{grid-column:2;grid-row:1/4;margin:0;align-self:end}
.pp-card:has(.pp-map) .pp-main{justify-content:stretch;gap:16px;padding:20px 24px 22px}
.pp-card:has(.pp-map) .pp-actions{justify-content:center}
.pp-map .map-cap{left:14px;bottom:10px;font-size:11px}
.pp-markets{grid-template-columns:repeat(4,1fr);gap:8px}
.pp-markets .pp-market{flex-direction:column;align-items:flex-start;gap:6px;padding:11px 12px}
.pp-markets .pp-market h4{font-size:14.5px}
.pp-markets .pp-market span{font-size:11.5px}
.pp-flag{font-size:22px}

/* Pop-up de Marcas: tarjetas clicables y detalle */
.pp-brand{font:inherit;color:inherit;text-align:left;cursor:pointer;width:100%}
.pp-brand .pp-logo{display:flex}
.pp-btxt{display:flex;flex-direction:column;gap:2px;padding:12px 16px 14px}
.pp-btxt span{font-size:12.5px;color:var(--acento);font-weight:600}
.pp-btxt i{font-style:normal;font-size:12px;font-weight:600;color:var(--vegetal);margin-top:4px;opacity:.75}
.pp-brand:hover{border-color:var(--dorado);box-shadow:0 14px 30px rgba(1,46,31,.16)}
.pp-brand:hover .pp-logo img{transform:scale(1.05)}
.pp-logo img{transition:transform .5s var(--ease-out)}
.pp-blogo{align-items:center;justify-content:center}
.pp-blogo::after{display:none}
.pp-blogo .pp-logo-big{position:relative;inset:auto;width:74%;height:auto;max-width:400px;aspect-ratio:1/1;object-fit:contain;transform:none;border-radius:0;box-shadow:none}
.pp-blogo .pp-logo-big.contain{width:70%}
.pp-blogo .banda{position:absolute;left:0;right:0;bottom:0}
.pp-bhead h3{font-size:clamp(28px,3vw,40px);color:var(--verde);line-height:1.05;margin:12px 0 4px}
.pp-tagline{font-family:var(--title);font-weight:500;font-size:18px;color:var(--acento)}
.pp-minis{display:flex;gap:10px;flex-wrap:wrap}
.pp-mini{display:flex;align-items:center;gap:10px;padding:6px 14px 6px 6px;border-radius:999px;border:1px solid var(--line-light);background:rgba(255,255,255,.7);font:inherit;font-size:13px;font-weight:600;color:var(--verde);cursor:pointer;transition:border-color .2s,box-shadow .2s}
.pp-mini img{width:36px;height:36px;border-radius:50%;object-fit:cover}
.pp-mini:hover{border-color:var(--dorado);box-shadow:0 8px 20px rgba(1,46,31,.14)}
.pp-mini.static{cursor:default}
@media (max-width:860px){
  .pp-map.map-wrap{flex:0 0 auto;height:230px}
  .pp-card:has(.pp-map) .pp-hero-txt{display:block;padding:22px 22px 34px}
  .pp-card:has(.pp-map) .pp-stats{margin-top:12px}
  .pp-card:has(.pp-map) .pp-main{padding:14px 14px 16px}
  .pp-markets{grid-template-columns:1fr 1fr;gap:6px}
  .pp-markets .pp-market{flex-direction:row;align-items:center;padding:8px 10px}
  .pp-blogo{min-height:170px}
  .pp-blogo .pp-logo-big{width:150px;height:150px;max-width:none}
  .pp-bhead h3{font-size:26px;margin:8px 0 2px}
  .pp-tagline{font-size:15px}
  .pp-btxt{padding:8px 10px 10px}.pp-btxt i{display:none}
}

/* Reveal on scroll */
.reveal{opacity:0;transform:translateY(22px);transition:opacity 700ms var(--ease-out),transform 700ms var(--ease-out)}
.reveal.in{opacity:1;transform:none}
.d1{transition-delay:80ms}.d2{transition-delay:160ms}.d3{transition-delay:240ms}.d4{transition-delay:320ms}

/* ---------- RESPONSIVE ---------- */
@media (max-width:1200px){
  .cards-4,.brands-grid,.market-grid{grid-template-columns:repeat(2,1fr)}
  .innov-grid{grid-template-columns:repeat(2,1fr)}
  .prod-grid{grid-template-columns:repeat(3,1fr)}
  .steps{grid-template-columns:repeat(3,1fr);gap:30px 0}
  .step:nth-child(3) .st-line{display:none}
}
@media (max-width:980px){
  .hero-grid{grid-template-columns:1fr;gap:44px}
  .hero-visual{max-width:460px;margin:0 auto;width:100%}
  .metric-card{left:-12px;bottom:36px}
  .team-wrap,.markets-top,.contact-grid{grid-template-columns:1fr;gap:30px}
  .why-grid,.innov-grid{grid-template-columns:1fr}
  .foot-grid{grid-template-columns:1fr;gap:30px}
  nav.links,.nav-cta .btn{display:none}
  .burger{display:flex}
  .nav-inner{gap:18px}
  nav.links.open{display:flex;flex-direction:column;align-items:flex-start;position:fixed;top:78px;left:12px;right:12px;background:rgba(249,249,251,.98);padding:22px;gap:16px;border:1px solid var(--line-light);border-radius:var(--r-lg);box-shadow:0 20px 50px rgba(1,46,31,.25)}
  nav.links.open a{font-size:16px}
  .scroll-cue{display:none}
}
@media (max-width:760px){
  .map-wrap{height:320px}
  .story-track{grid-template-columns:1fr;gap:26px}
  .story-step:not(:last-child)::after{display:none}
  .mq-item{width:100px;height:100px}
  .prod-grid{grid-template-columns:repeat(2,1fr);gap:16px}
  .steps{grid-template-columns:1fr;gap:26px}
  .step{padding:0 0 0 70px;min-height:50px}
  .step .dot{position:absolute;left:0;top:0;margin:0}
  .step:nth-child(3) .st-line,.st-line{display:block;top:56px;bottom:-22px;left:23px;right:auto;width:3px;height:auto}
  .st-line b{transform-origin:top;transform:scaleY(var(--line,0))}
  .numbers{grid-template-columns:repeat(2,1fr);gap:30px}
  .form-row{grid-template-columns:1fr;gap:0}
  .cert-inner{justify-content:center;text-align:center}
  .cert-marks{justify-content:center}
  .form{padding:24px}
  .market-grid{grid-template-columns:1fr}
  .metric-card{width:220px}
}
@media (max-width:480px){
  .cards-4,.brands-grid{grid-template-columns:1fr}
  .prod-body{padding:14px}
  .prod-body h3{font-size:15px}
  .hero-actions .btn{flex:1;justify-content:center}
  .brand img{height:34px}
}

@media (prefers-reduced-motion:reduce){
  #intro{display:none}
  .reveal,.reveal.in{opacity:1!important;transform:none!important;transition:none!important}
  .cert-mark,.pillar span,.stat .cap{opacity:1!important;transform:none!important}
  .cta-card .btn::after{animation:none!important}
  .hero-slide img,.markets-bg img,.marquee-track,.ticker-track,.banda.move{animation:none!important}
  .hero-slide:first-child{opacity:1;animation:none}
  header.nav{transform:translate(-50%,0)}
}