/* =========================================================
   COFFEE BUSTERS · Roastery & Pastry
   Design system + Home styles  (v2)
   ========================================================= */

:root{
  /* Brand — Premium editorial (Turquesa Premium + Espresso + Crema + Oro suave) */
  --teal:        #1FA7A6;   /* turquesa premium */
  --teal-500:    #1C8F8E;
  --teal-700:    #16706F;
  --teal-900:    #1A4A48;   /* paneles oscuros (petróleo elegante) */
  --teal-950:    #123C3B;   /* orígenes (contraste del mapa) */
  --ink:         #3B2A20;   /* espresso — texto / footer */
  --ink-soft:    #5c4a3d;

  /* Paper / surfaces — crema + beige cálido */
  --cream:       #F5EFE6;
  --cream-2:     #EFE7D6;
  --beige:       #DCC7A3;   /* beige cálido */
  --cream-3:     #E4D6BC;
  --white:       #FFFFFF;

  /* Accent — Oro suave (líneas finas, sellos, detalles) */
  --gold:        #C8A15A;
  --gold-deep:   #A9843C;
  --accent-soft: #DFC28A;   /* oro claro para fondos oscuros */
  --cherry:      #9E3B34;
  --cyan:        #26ADB5;   /* vibrant cyan from mockup */

  /* Flavour categories (map) */
  --dulces:      #CE4E7F;
  --cuerpo:      #2E74B5;
  --citricas:    #A7BE33;

  /* Type — professional editorial pairing */
  --serif: "Fraunces", "Playfair Display", Georgia, serif;
  --sans:  "Manrope", "Helvetica Neue", Arial, sans-serif;

  /* Layout */
  --maxw: 1240px;
  --gutter: clamp(20px, 5vw, 64px);
  --radius: 16px;
  --shadow-sm: 0 6px 20px rgba(20,30,29,.08);
  --shadow-md: 0 18px 50px rgba(20,30,29,.16);
  --shadow-lg: 0 30px 80px rgba(20,30,29,.30);

  --header-h: 94px;
  --topbar-h: 46px;

  --tex-dark: url("../assets/img/texture-owl-gold.svg");
  --tex-light: url("../assets/img/texture-owl-gold.svg");
}

*{ box-sizing:border-box; }
html{ scroll-behavior:smooth; -webkit-text-size-adjust:100%; }
body{
  margin:0;
  font-family:var(--sans);
  font-weight:400;
  color:var(--ink);
  background:var(--cream);
  line-height:1.7;
  overflow-x:hidden;
}
img{ max-width:100%; display:block; }
a{ color:inherit; text-decoration:none; }
button{ font-family:inherit; cursor:pointer; border:none; background:none; }
ul{ margin:0; padding:0; list-style:none; }

/* ---------- Type ---------- */
h1,h2,h3,h4{
  font-family:var(--serif); font-weight:600; line-height:1.06; margin:0;
  letter-spacing:-.015em; font-optical-sizing:auto;
}
.display{ font-size:clamp(2.9rem, 7vw, 5.6rem); font-weight:600; letter-spacing:-.02em; }
h2.section-title{ font-size:clamp(2.1rem, 4.4vw, 3.4rem); }
h3{ font-size:clamp(1.35rem, 2.3vw, 1.85rem); }
p{ margin:0 0 1em; }

.eyebrow{
  font-family:var(--sans); font-weight:700;
  letter-spacing:.28em; text-transform:uppercase;
  font-size:.72rem; color:var(--gold-deep);
}
.eyebrow.on-dark{ color:var(--accent-soft); }

.container{ max-width:var(--maxw); margin-inline:auto; padding-inline:var(--gutter); position:relative; z-index:2; }
.section{ padding-block:clamp(74px, 10vw, 132px); position:relative; isolation:isolate; overflow:hidden; }
.section.on-dark { background-color: var(--teal-900); }
.section.on-light { background-color: #ffffff; }

/* Obsolete texture classes removed */
.lead{ font-size:1.14rem; color:var(--ink-soft); max-width:58ch; }

/* ---------- Buttons ---------- */
.btn{
  display:inline-flex; align-items:center; gap:.55em;
  font-family:var(--sans); font-weight:600; font-size:.92rem; letter-spacing:.01em;
  padding:.95em 1.9em; border-radius:100px;
  transition:transform .25s ease, background .25s ease, color .25s ease, box-shadow .25s ease;
  will-change:transform;
}
.btn:hover{ transform:translateY(-2px); }
.btn-gold{ background:var(--teal); color:#fff; box-shadow:0 10px 26px rgba(31,167,166,.32); }
.btn-gold:hover{ background:var(--teal-500); }
.btn-teal{ background:var(--teal-700); color:#fff; }
.btn-teal:hover{ background:var(--teal-900); }
.btn-gold-line{ background:transparent; color:var(--gold-deep); border:1px solid var(--gold); }
.btn-gold-line:hover{ background:var(--gold); color:#fff; }
.btn-outline{ border:1.5px solid rgba(255,255,255,.7); color:#fff; }
.btn-outline:hover{ background:#fff; color:var(--ink); }
.btn-cyan{ background:var(--cyan); color:#fff; border:1.5px solid var(--cyan); letter-spacing:.05em; font-size:.85rem; padding:.8em 2em; }
.btn-cyan:hover{ background:transparent; color:var(--cyan); }
.btn-cyan-outline{ background:transparent; color:var(--cyan); border:1px solid var(--cyan); letter-spacing:.05em; font-size:.85rem; padding:.8em 2em; }
.btn-cyan-outline:hover{ border-color:#fff; color:#fff; }
.btn-ghost{ padding-inline:0; color:var(--gold-deep); font-weight:700; font-size:.85rem; letter-spacing:.04em; }
.btn-ghost .arrow{ transition:transform .25s ease; display:inline-block; }
.btn-ghost:hover .arrow{ transform:translateX(5px); }

.text-cyan{ color:var(--cyan) !important; }

/* =========================================================
   TOP BAR + HEADER
   ========================================================= */
.topbar{
  height:var(--topbar-h); display:flex; align-items:center; justify-content:center;
  gap:.7rem; background:#081c1c; color:#a1b3b3;
  font-size:.72rem; letter-spacing:.16em; text-transform:uppercase; font-weight:500;
  position:relative; z-index:80;
}
.topbar .tb-leaf{ width:15px; height:15px; color:var(--cyan); }
.topbar .tb-text{ letter-spacing:.08em; }
@media (max-width:560px){ .topbar{ font-size:.6rem; letter-spacing:.05em; } }

.site-header{
  position:absolute; top:var(--topbar-h); left:0; right:0; z-index:100;
  height:var(--header-h); display:flex; align-items:center;
  transition:background .35s ease, box-shadow .35s ease, height .35s ease;
}
.site-header .container{ display:flex; align-items:center; justify-content:space-between; width:100%; z-index:2; }
.brand{ display:flex; align-items:center; gap:.7rem; }
.brand img{ height:72px; width:auto; transition:height .35s ease; }
.nav{ display:flex; align-items:center; gap:2.5rem; }
.nav a{ font-size:.75rem; font-weight:500; letter-spacing:.12em; color:#fff; position:relative; padding:.3em 0; text-transform:uppercase; }
.nav a::after{ content:""; position:absolute; left:0; bottom:-4px; height:1px; width:0; background:var(--cyan); transition:width .28s ease; }
.nav a:hover::after, .nav a.active::after{ width:100%; }
/* Dropdown "Nuestros Servicios" */
.nav-drop{ position:relative; }
.nav-drop__trigger{
  display:inline-flex; align-items:center; gap:.4em; cursor:pointer;
  font-family:var(--sans); font-size:.75rem; font-weight:500; letter-spacing:.12em; text-transform:uppercase;
  color:#fff; background:none; border:0; padding:.3em 0;
}
.nav-drop__trigger svg{ width:13px; height:13px; transition:transform .3s ease; }
.nav-drop:hover .nav-drop__trigger svg{ transform:rotate(180deg); }
.nav-drop__menu{
  position:absolute; top:calc(100% + 18px); left:50%; transform:translateX(-50%) translateY(10px);
  width:320px; background:#fff; border-radius:18px; padding:.6rem;
  box-shadow:0 24px 50px rgba(0,0,0,.28); border:1px solid rgba(0,0,0,.05);
  opacity:0; visibility:hidden; transition:opacity .28s ease, transform .28s ease; z-index:120;
}
.nav-drop__menu::before{ content:""; position:absolute; top:-16px; left:0; right:0; height:16px; }
.nav-drop:hover .nav-drop__menu, .nav-drop:focus-within .nav-drop__menu{ opacity:1; visibility:visible; transform:translateX(-50%) translateY(0); }
.nav-drop__menu a{
  display:flex; align-items:center; gap:.85rem; padding:.75rem .8rem; border-radius:12px;
  color:var(--ink); text-transform:none; letter-spacing:0; transition:background .2s ease;
}
.nav-drop__menu a::after{ display:none; }
.nav-drop__menu a:hover{ background:rgba(38,173,181,.09); }
.nav-drop__menu a svg{ width:30px; height:30px; color:var(--cyan); flex:0 0 auto; }
.nav-drop__menu span{ display:flex; flex-direction:column; }
.nav-drop__menu b{ font-size:.92rem; font-weight:700; color:var(--ink); }
.nav-drop__menu i{ font-style:normal; font-size:.76rem; color:var(--ink-soft); }

.header-cta{ display:flex; align-items:center; gap:1.5rem; border-left:1px solid rgba(255,255,255,.2); padding-left:1.5rem; }
.header-cta .btn{ background:var(--cyan); color:#fff; font-size:.85rem; letter-spacing:.05em; border-radius:100px; padding:.7em 1.8em; font-weight:500; }
.header-cta .btn:hover{ background:#1c8f96; }

.site-header.scrolled{
  /* position:fixed; top:0; */
  background:rgba(35,66,64,.94); backdrop-filter:blur(12px);
  box-shadow:0 8px 30px rgba(0,0,0,.28); height:70px;
}
.site-header.scrolled .brand img{ height:52px; }

.menu-toggle{ display:none; width:44px; height:44px; color:#fff; }
.menu-toggle span{ display:block; width:24px; height:2px; background:currentColor; margin:5px auto; transition:.3s; }

/* =========================================================
   HERO V2 (Grid / Mask Layout)
   ========================================================= */
.hero-v2{
  position:relative; min-height:100vh; display:flex; align-items:center; 
  color:#fff; overflow:hidden; padding-top:var(--header-h); padding-bottom:60px;
}

.hero__v2-grid{
  position:relative; z-index:3;
  display:grid; grid-template-columns:1.2fr 1fr 240px; gap:2rem;
  width:100%; align-items:center;
  padding-inline: clamp(20px, 4vw, 60px);
}

/* Left Text Column */
.hero__col-text{ max-width:620px; padding-left:4vw; margin-left:0; position:relative; z-index:3; }
.hero__col-text .eyebrow{ letter-spacing:.15em; font-size:.7rem; margin-bottom:1rem; display:block; }
.hero__col-text h1{ font-size:clamp(4.2rem, 6.5vw, 5.8rem); margin-bottom:.5rem; line-height:1.05; text-transform:none; }
.hero__col-text h1 em{ font-style:italic; font-weight:400; font-family:var(--serif); }
.divider.v2{ display:flex; align-items:center; gap:1rem; margin:1.5rem 0; color:var(--cyan); }
.divider.v2 i{ flex:0 0 40px; height:1px; background:var(--cyan); }
.divider.v2 svg{ width:18px; height:18px; }
.hero__col-text .hero__sub{ font-size:1.05rem; color:#b0c4c4; line-height:1.6; margin-bottom:2.5rem; max-width:440px; font-weight:300; }
.hero__actions{ display:flex; gap:1rem; }

.hero-dark-vignette {
  position: absolute; inset: 0; z-index: 1; pointer-events: none;
  background: radial-gradient(ellipse at 65% 50%, transparent 15%, rgba(8,18,18,0.85) 55%);
}

.focal-frame {
  width:100%; max-width:440px; aspect-ratio:3/4;
  position:relative;
  z-index: 2;
  margin:0 auto;
  /* Marco fino cyan sobre el racimo (sin desenfocar la imagen) */
  border:1.5px solid rgba(109,166,163,.85);
  border-radius:40px 40px 120px 40px;
  background:transparent;
  box-shadow:
    inset 0 0 0 1px rgba(255,255,255,.10),
    0 24px 60px rgba(0,0,0,.30);
}
.focal-frame::before {
  display:none;
}
.hero__seal.v2{
  position:absolute; top:-52px; left:-52px;
  width:132px; height:132px;
  color:var(--cyan); z-index:3;
  filter:drop-shadow(0 6px 16px rgba(0,0,0,.45));
}
/* Disco frosted detrás del sello removido */
.hero__seal.v2 img{ position:relative; z-index:1; }

/* Right Awards Column */
.hero__col-awards{ display:flex; flex-direction:column; align-items:center; gap:1.5rem; text-align:center; padding-right:2rem; position:relative; z-index:3; }
.hero__col-awards .ha-label{ font-size:.65rem; letter-spacing:.15em; font-weight:500; text-transform:uppercase; margin-bottom:1rem; }
.ha-badge.v2{ width:120px; height:120px; color:var(--cyan); filter:drop-shadow(0 4px 12px rgba(0,0,0,0.4)); }
.ha-badge.v2 svg{ width:100%; height:100%; }
.ha-badge.v2 text{ fill:currentColor; font-family:var(--sans); }
.ha-badge.v2 .aw-xs{ font-size:8px; letter-spacing:1px; font-weight:500; text-anchor:middle; }
.ha-badge.v2 .aw-sm{ font-size:10px; letter-spacing:2px; font-weight:600; text-anchor:middle; }
.ha-badge.v2 .aw-100{ font-size:32px; font-weight:700; text-anchor:middle; font-family:var(--serif); }
.hero__col-awards .ha-script{ font-family:"Sacramento", cursive; font-size:2rem; line-height:1; margin-top:1rem; transform:rotate(-4deg); }

/* Botanica Corner */
.hero__botanica-corner{
  position:absolute; right:-140px; bottom:-120px;
  width:450px; height:470px;
  z-index:4; opacity:0.85; pointer-events:none;
}

/* Scroll indicator */
.hero__scroll.v2{
  position:absolute; left:50%; bottom:30px; transform:translateX(-50%); z-index:3;
  color:var(--cyan); font-size:.65rem; letter-spacing:.25em; font-weight:500;
  display:flex; flex-direction:column; align-items:center; gap:.8rem;
}
.hero__scroll.v2 .mouse{ width:20px; height:32px; border:1px solid var(--cyan); border-radius:12px; position:relative; }
.hero__scroll.v2 .mouse::after{ content:""; position:absolute; left:50%; top:6px; width:2px; height:6px; background:var(--cyan); border-radius:2px; transform:translateX(-50%); animation:scrollDot 1.5s infinite; }
@keyframes scrollDot{ 0%{ opacity:0; transform:translate(-50%,0);} 40%{opacity:1;} 80%{ opacity:0; transform:translate(-50%,8px);} }

@media (max-width:1024px){
  .hero__v2-grid{ grid-template-columns:1fr 1fr; }
  .hero__col-awards{ grid-column:1 / -1; flex-direction:row; justify-content:center; padding-right:0; margin-top:2rem; flex-wrap:wrap; }
}
@media (max-width:768px){
  .hero__v2-grid{ grid-template-columns:1fr; text-align:center; padding-top:40px; gap:3rem; }
  .hero__col-text{ padding-left:0; margin:0 auto; }
  .hero__col-text h1{ font-size:clamp(3rem, 10vw, 4.2rem); }
  .divider.v2{ justify-content:center; }
  .hero__col-frame{ display:block; margin:0 auto; width:85%; max-width:320px; }
  .hero__seal.v2{ width:90px; height:90px; top:-30px; left:-30px; }
}

/* =========================================================
   ESENCIA / CAFICULTOR
   ========================================================= */
.esencia{
  padding-block: clamp(48px, 7vw, 96px); position:relative;
  background:
    url("../assets/img/beans-scatter.svg") top center / 1200px auto no-repeat,
    url("../assets/img/mountains-bg.svg") bottom center / 100% 320px no-repeat,
    var(--cream);
}
.esencia > .container{ position:relative; z-index:1; }
.esencia__grid{ display:grid; grid-template-columns:1fr 1.06fr; gap:clamp(30px,5vw,72px); align-items:center; }

/* ----- Columna de texto ----- */
.eyebrow-orn{ display:inline-block; font-size:.74rem; letter-spacing:.22em; text-transform:uppercase; color:var(--teal); font-weight:800; margin-bottom:1.1rem; }
.esencia__body h2{ margin-bottom:1rem; color:var(--ink); font-size:clamp(2.6rem,4.6vw,3.6rem); line-height:1.02; }
.orn-divider{ display:flex; align-items:center; gap:.6rem; color:var(--gold); margin:0 0 1.4rem; }
.orn-divider span{ height:1px; width:46px; background:linear-gradient(90deg,var(--gold),transparent); }
.orn-divider span:first-child{ background:linear-gradient(270deg,var(--gold),transparent); width:70px; }
.orn-divider b{ font-size:.6rem; }
.esencia__body .lead{ margin-bottom:2rem; }

.origin-features{ display:flex; gap:clamp(1.2rem,3vw,2.6rem); margin-bottom:2.2rem; }
.ofeat{ display:flex; flex-direction:column; align-items:center; text-align:center; gap:.7rem; }
.ofeat__icon{ width:46px; height:46px; color:var(--teal); }
.ofeat__tick{ width:22px; height:2px; background:var(--gold); border-radius:2px; }
.ofeat span{ font-size:.78rem; font-weight:800; letter-spacing:.06em; color:var(--ink); line-height:1.35; }

.btn-origin{ background:var(--teal-950); color:#fff; letter-spacing:.08em; font-size:.82rem; font-weight:700; padding:1.05em 2.3em; box-shadow:0 14px 30px rgba(18,60,59,.32); }
.btn-origin:hover{ background:var(--teal-900); }
.btn-origin .arrow{ font-size:1.2em; line-height:0; }

/* ----- Columna media ----- */
.esencia__media{ position:relative; }
.esencia__media .img-main{
  border-radius:26px; overflow:hidden;
  aspect-ratio:4/3; box-shadow:0 30px 60px rgba(18,60,59,.24);
}
.esencia__media .img-main img{ width:100%; height:100%; object-fit:cover; }

/* Tarjeta de datos superpuesta */
.altura-card{
  position:absolute; top:50%; right:-64px; transform:translateY(-50%);
  width:min(60%,264px); padding:1.7rem 1.6rem;
  background:linear-gradient(165deg,var(--teal-900),var(--teal-950));
  border:1px solid rgba(223,194,138,.25);
  border-radius:22px; color:#f3ede0;
  box-shadow:0 24px 50px rgba(0,0,0,.4);
  z-index:2;
}
.altura-card__mtn{ width:40px; height:40px; color:var(--accent-soft); margin-bottom:.6rem; }
.oc-eyebrow{ display:block; font-size:.66rem; letter-spacing:.2em; color:var(--accent-soft); font-weight:800; margin-bottom:.35rem; }
.oc-title{ font-family:var(--serif); font-size:1.35rem; line-height:1.12; color:#fff; margin-bottom:.9rem; }
.oc-rule{ display:block; height:1px; background:linear-gradient(90deg,rgba(223,194,138,.5),transparent); margin:.2rem 0 1rem; }
.oc-text{ font-size:.86rem; color:#e8e0d0; line-height:1.5; margin-bottom:1.3rem; }
.oc-btn{
  display:inline-flex; align-items:center; gap:.5em;
  font-family:var(--sans); font-weight:700; font-size:.78rem; letter-spacing:.05em;
  padding:.75em 1.35em; border-radius:100px;
  background:var(--accent-soft); color:var(--teal-950);
  transition:transform .25s ease, background .25s ease, box-shadow .25s ease;
  box-shadow:0 8px 20px rgba(0,0,0,.28);
}
.oc-btn:hover{ background:#eed6a6; transform:translateY(-2px); }
.oc-btn .arrow{ transition:transform .25s ease; }
.oc-btn:hover .arrow{ transform:translateX(4px); }

/* Sello circular */
.origin-seal{
  position:absolute; left:38px; bottom:-40px; width:118px; height:118px; z-index:3;
  background:var(--cream); border-radius:50%; color:var(--teal-900);
  display:grid; place-items:center; padding:6px;
  box-shadow:0 14px 30px rgba(0,0,0,.28);
}
.origin-seal svg{ width:100%; height:100%; }
.origin-seal .seal-txt{ font-family:var(--sans); font-size:9.4px; font-weight:700; letter-spacing:1.4px; fill:var(--teal-900); text-anchor:middle; }

/* =========================================================
   UNIDADES DE NEGOCIO
   ========================================================= */
.unidades{ background:#231912; color:#E8E0D0; position:relative; padding-block:clamp(52px,6.5vw,84px); }
.unidades .section-head, .origenes .section-head{ text-align:center; max-width:720px; margin:0 auto clamp(30px,3.5vw,44px); }
.unidades .section-head h2{ color:#FDFBF7; }
.unidades .section-head p{ color:#DCC7A3; }
.unidades .eyebrow.on-dark { color: var(--gold); }
/* Textura de fondo mejorada: patrón sutil de granos de café y gradiente cálido */
.unidades::before{
  content:""; position:absolute; top:0; left:0; right:0; bottom:0; z-index:0;
  pointer-events:none;
  background: radial-gradient(circle at 85% 15%, rgba(200,161,90,0.12) 0%, transparent 45%),
              radial-gradient(circle at 15% 85%, rgba(200,161,90,0.08) 0%, transparent 40%);
}
.unidades::after{
  content:""; position:absolute; inset:0; z-index:0; pointer-events:none; opacity:.04;
  background: url("../assets/img/beans-scatter.svg") repeat;
  background-size: 350px;
}

.unit-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:1.8rem; align-items:stretch; position:relative; z-index:1; }

/* Wrapper (sostiene la cinta, no recorta) */
.unit{ position:relative; height:100%; transition:transform .35s cubic-bezier(.2,.7,.2,1); }
/* La card principal se eleva y queda por encima para destacar */
.unit.featured{ transform:translateY(-18px); z-index:3; }

/* Cuerpo con esquina redondeada en vez de cortada para un look más moderno y limpio */
.unit__body{
  position:relative; height:100%; overflow:hidden;
  background:#FFFFFF;
  border-radius:24px;
  padding:2rem 1.8rem 2rem; display:flex; flex-direction:column; gap:.7rem;
  border: 1px solid rgba(255,255,255,0.1);
  box-shadow: 0 20px 40px rgba(0,0,0,0.25);
  transition:transform .35s cubic-bezier(.2,.7,.2,1), box-shadow .35s ease;
}
.unit:hover .unit__body{
  transform:translateY(-10px);
  box-shadow: 0 30px 60px rgba(0,0,0,0.4);
}

.unit__top{ display:flex; align-items:center; justify-content:space-between; }
.unit__num{ font-family:var(--serif); font-size:1.7rem; font-weight:600; color:var(--ink-soft); letter-spacing:.06em; line-height:1; }
.unit__icon{ width:46px; height:46px; color:var(--gold-deep); flex-shrink:0; }
.unit h3{ font-family:var(--serif); color:var(--ink); font-size:clamp(1.45rem,2.2vw,1.8rem); line-height:1.06; }
.unit p{ color:var(--ink-soft); font-size:.93rem; line-height:1.5; }
.unit__rule{ height:1px; background:linear-gradient(90deg, rgba(59,42,32,.15), rgba(59,42,32,.0)); margin:.2rem 0 .1rem; }
.unit .tags{ display:flex; flex-wrap:wrap; gap:.5rem; }
.unit .tag{
  font-size:.72rem; letter-spacing:.02em; padding:.42em .95em; border-radius:100px;
  border:1px solid rgba(59,42,32,.15); background:#F9F6F0; color:var(--ink); font-weight:600;
}
/* Tag destacado en dorado */
.unit .tag.tag-gold{
  border-color:rgba(200,161,90,.4); background:rgba(200,161,90,.1);
  color:var(--gold-deep); font-weight:700;
}
.unit .btn-ghost{ color:var(--gold-deep); margin-top:.4rem; align-self:flex-start; }
/* Sello de reconocimiento dentro de una card */
.unit__award{ display:flex; align-items:center; gap:.5rem; }
.unit__award img{ width:44px; height:44px; flex:0 0 auto; filter:drop-shadow(0 4px 10px rgba(0,0,0,.15)); }
.unit__award img + img{ margin-left:-.35rem; }
.unit__award span{ margin-left:.25rem; font-size:.72rem; font-weight:700; color:var(--gold-deep); line-height:1.25; letter-spacing:.01em; }
/* Variante con logo horizontal */
.unit__award--logo{ gap:.7rem; }
.unit__award--logo img{ width:auto; height:40px; filter:none; }
.unit__award--logo span{ margin-left:0; padding-left:.7rem; border-left:1px solid rgba(59,42,32,.15); }
/* Todos los servicios comparten el mismo botón lleno (anclado abajo) */
.unit .btn-gold{ align-self:stretch; justify-content:center; margin-top:auto; padding-top:.9em; padding-bottom:.9em; background:var(--ink); color:#fff; box-shadow:none; }
.unit .btn-gold:hover{ background:var(--gold-deep); }
.unit__rule{ margin-top:.9rem; }

/* Botánica tenue en la card de cafetería */
.unit__botanica{
  position:absolute; right:-30px; bottom:-24px; width:210px; height:auto;
  opacity:.06; pointer-events:none; z-index:0; filter:grayscale(100%);
}
.unit__botanica ~ *{ position:relative; z-index:1; }

/* Featured unit — más presencia: fondo cálido, borde dorado, número grande */
.unit.featured .unit__body{
  padding:4.6rem 1.8rem 1.8rem;
  background:linear-gradient(180deg,#FDFBF7 0%, #F5EFE6 100%);
  border: 1.5px solid var(--gold);
  animation:cardGlow 4s ease-in-out infinite;
}
.unit.featured:hover .unit__body{ border-color:var(--gold-deep); }
@keyframes cardGlow{
  0%,100%{ box-shadow: 0 20px 40px rgba(0,0,0,0.3), 0 0 20px rgba(200,161,90,0.2); }
  50%{ box-shadow: 0 25px 50px rgba(0,0,0,0.4), 0 0 40px rgba(200,161,90,0.4); }
}
/* Número grande y destacado de la unidad principal (debajo de la cinta) */
.unit.featured .unit__num{
  font-size:2.4rem; font-weight:700; line-height:.9; color:var(--gold-deep);
  position:relative; padding-bottom:.28rem;
}
.unit.featured .unit__num::after{
  content:""; position:absolute; left:1px; bottom:0; width:30px; height:3px;
  background:var(--gold); border-radius:3px;
}
.unit.featured .unit__icon{ width:56px; height:56px; color:var(--gold); }
.unit.featured h3{ font-size:clamp(1.7rem,2.6vw,2.1rem); }
.unit.featured .btn-gold{ background:var(--gold-deep); color:#fff; }
.unit.featured .btn-gold:hover{ background:var(--ink); }

/* Cinta vertical "UNIDAD PRINCIPAL" colgando de la esquina */
.unit__ribbon{
  position:absolute; top:-16px; left:26px; z-index:4;
  width:82px; padding:12px 6px 18px;
  display:flex; flex-direction:column; align-items:center; gap:1px;
  background:linear-gradient(165deg, var(--gold) 0%, var(--gold-deep) 100%);
  color:#fff;
  clip-path:polygon(0 0, 100% 0, 100% 100%, 50% 80%, 0 100%);
  box-shadow:0 10px 20px rgba(0,0,0,.3);
}
.unit__ribbon b{ font-size:.62rem; font-weight:800; letter-spacing:.13em; line-height:1.3; }
.unit__ribbon .star{ font-style:normal; font-size:.85rem; margin-top:4px; color:#fff; }
.unit.featured:hover .unit__ribbon{ transform:translateY(-8px); transition:transform .3s ease; }

@media (max-width:900px){
  .unit-grid{ grid-template-columns:1fr; gap:2.2rem; }
}

/* ---------- Carousel ---------- */
.carousel{ position:relative; }
.carousel__viewport{
  overflow:hidden; border-radius:20px;
  box-shadow:0 40px 80px -28px rgba(0,0,0,.6), 0 6px 20px -10px rgba(0,0,0,.4), inset 0 0 0 1px rgba(255,255,255,.12);
}
.carousel__track{ display:flex; transition:transform .6s cubic-bezier(.5,.05,.2,1); }
.carousel__slide{ position:relative; min-width:100%; margin:0; aspect-ratio:4/5; }
.carousel__slide img{ width:100%; height:100%; object-fit:cover; }
.carousel__slide figcaption{
  position:absolute; left:0; right:0; bottom:0; padding:1.5rem 1.3rem .9rem;
  color:#fff; font-family:var(--serif); font-size:1.2rem; font-weight:600;
  background:linear-gradient(transparent, rgba(12,24,23,.85));
}
.carousel__btn{
  position:absolute; top:50%; transform:translateY(-50%); z-index:3;
  width:46px; height:46px; border-radius:50%; background:rgba(16,37,37,.72); color:#fff;
  font-size:1.6rem; line-height:1; display:grid; place-items:center; backdrop-filter:blur(6px);
  border:1px solid rgba(255,255,255,.25); transition:background .25s ease, transform .25s ease;
}
.carousel__btn:hover{ background:var(--gold); color:var(--ink); }
.carousel__btn.prev{ left:14px; } .carousel__btn.next{ right:14px; }
.carousel__btn:active{ transform:translateY(-50%) scale(.92); }
.carousel__dots{ display:flex; gap:.5rem; justify-content:center; margin-top:1.1rem; }
.carousel__dots button{ width:9px; height:9px; border-radius:50%; background:rgba(255,255,255,.28); transition:background .25s ease, width .25s ease; }
.carousel__dots button.active{ background:var(--gold); width:24px; border-radius:6px; }

/* =========================================================
   ORIGENES · MAPA INTERACTIVO
   ========================================================= */
.origenes{
  color:var(--ink); border-top:1px solid rgba(0,0,0,.06); padding-block:clamp(52px,6vw,88px);
  position:relative; overflow:hidden;
  background:linear-gradient(180deg,#FDFBF7 0%, #F7F1E5 100%);
}
/* textura topográfica muy tenue en las esquinas */
.origenes::before{
  content:""; position:absolute; inset:0; z-index:0; pointer-events:none; opacity:.35;
  background:
    url("../assets/img/waves-topo.svg") no-repeat top left / 560px auto,
    url("../assets/img/waves-topo.svg") no-repeat bottom right / 700px auto;
  -webkit-mask-image:linear-gradient(135deg,#000, transparent 42%, transparent 62%, #000);
  mask-image:linear-gradient(135deg,#000, transparent 42%, transparent 62%, #000);
}
.origenes > .container{ position:relative; z-index:1; }

/* 3 columnas: intro · mapa · tarjeta */
.origenes__grid{ display:grid; grid-template-columns:minmax(280px,1.18fr) minmax(0,1.32fr) 344px; gap:clamp(14px,2vw,34px); align-items:center; }

/* Intro (izquierda) */
.origenes__ey{ display:inline-flex; align-items:center; gap:.55em; font-size:.74rem; letter-spacing:.2em; text-transform:uppercase; color:var(--gold-deep); font-weight:800; margin-bottom:1.1rem; }
.origenes__ey svg{ width:18px; height:18px; }
.origenes__intro h2{ color:var(--ink); font-size:clamp(2.8rem,4vw,4rem); line-height:.98; letter-spacing:-.01em; margin-bottom:1.2rem; }
.origenes__intro h2 em{ font-style:italic; color:var(--cyan); font-weight:500; }
.origenes__intro p{ color:var(--ink-soft); font-size:1rem; line-height:1.65; max-width:40ch; }
.map-hint{ display:inline-flex; align-items:center; gap:.7em; margin-top:1.8rem; font-size:.82rem; color:var(--ink-soft); font-weight:600; }
.map-hint__ic{ width:38px; height:38px; border-radius:50%; border:1.5px solid rgba(38,173,181,.55); color:var(--cyan); display:grid; place-items:center; flex:0 0 auto; }
.map-hint__ic svg{ width:18px; height:18px; }

/* Mapa (centro) */
.map-stage{ position:relative; }
#peru-map{ width:100%; height:auto; max-height:58vh; overflow:visible; display:block; margin-inline:auto;
  filter:drop-shadow(0 26px 40px rgba(60,50,40,.18)) drop-shadow(0 8px 16px rgba(60,50,40,.08)); }
#peru-map .dep{
  fill:#E7E1D6; stroke:#ffffff; stroke-width:1;
  transition:fill .25s ease, filter .25s ease;
}
#peru-map .dep.coffee{ cursor:pointer; }
#peru-map .dep.cat-dulces{ fill:#DCB4BB; }
#peru-map .dep.cat-cuerpo{ fill:#AEBFD8; }
#peru-map .dep.cat-citricas{ fill:#C8CE9C; }
#peru-map .dep.coffee:hover{ filter:brightness(.96); }
/* activo: glow teal */
#peru-map .dep.is-active,
#peru-map .dep.cat-dulces.is-active,
#peru-map .dep.cat-cuerpo.is-active,
#peru-map .dep.cat-citricas.is-active{
  fill:#2FB9C0;
  filter:drop-shadow(0 0 6px rgba(43,182,190,.9)) drop-shadow(0 0 16px rgba(43,182,190,.55));
}
#peru-map .dot{ fill:#fff; opacity:.95; }
#peru-map .dot.pulse{ animation:dotPulse 2.4s ease-in-out infinite; }
@keyframes dotPulse{ 0%,100%{ r:4.5; opacity:.9; } 50%{ r:6; opacity:1; } }
#peru-map .dep-label{ opacity:0; } /* reemplazado por el tooltip */

/* Tooltip flotante del departamento */
.map-tooltip{
  position:absolute; left:0; top:0; z-index:5; pointer-events:none;
  transform:translate(-50%,-150%) scale(.9); transform-origin:bottom center;
  background:var(--ink); color:#fff; font-size:.78rem; font-weight:600;
  padding:.4em .85em; border-radius:9px; white-space:nowrap;
  box-shadow:0 10px 22px rgba(0,0,0,.28);
  opacity:0; transition:opacity .2s ease, transform .2s ease;
}
.map-tooltip::after{
  content:""; position:absolute; left:50%; bottom:-5px; transform:translateX(-50%);
  border:6px solid transparent; border-top-color:var(--ink); border-bottom:0;
}
.map-tooltip.show{ opacity:1; transform:translate(-50%,-135%) scale(1); }

/* Tarjeta (derecha) */
.origin-card{
  position:relative; overflow:hidden;
  background:linear-gradient(180deg,#ffffff 0%, #FBF6EC 100%);
  border:1px solid rgba(0,0,0,.05); border-radius:26px; padding:2.1rem 1.9rem;
  min-height:342px; box-shadow:0 30px 60px rgba(60,50,40,.16), 0 8px 20px rgba(60,50,40,.06);
}
.origin-card .cat-pill{ display:inline-flex; align-items:center; gap:.55em; font-size:.66rem; letter-spacing:.14em; text-transform:uppercase; font-weight:800; padding:.5em 1.05em; border-radius:100px; margin-bottom:1.2rem; }
.cat-pill .pill-ic{ width:13px; height:13px; }
.cat-pill.dulces{ background:rgba(206,120,140,.16); color:#bd5f78; }
.cat-pill.cuerpo{ background:rgba(120,150,190,.18); color:#5478a6; }
.cat-pill.citricas{ background:rgba(150,170,90,.20); color:#7c8f3f; }
.origin-card h3{ font-family:var(--serif); color:var(--ink); font-size:2.2rem; line-height:1; margin-bottom:.35rem; }
.origin-card .region{ color:var(--cyan); font-size:.72rem; letter-spacing:.18em; text-transform:uppercase; font-weight:700; }
.oc-orn{ display:flex; align-items:center; gap:.7rem; color:var(--gold); margin:1.1rem 0; }
.oc-orn span{ height:1px; flex:1; background:linear-gradient(90deg,transparent,rgba(0,0,0,.12),transparent); }
.oc-orn b{ font-size:.7rem; }
.origin-card dl{ margin:0; display:grid; gap:.85rem; }
.origin-card .row{ display:flex; gap:.9rem; align-items:center; }
.origin-card .row .ic{
  width:42px; height:42px; padding:10px; border-radius:50%; box-sizing:border-box;
  background:rgba(38,173,181,.10); color:var(--cyan); flex:0 0 auto; stroke-width:1.8;
}
.origin-card dt{ font-size:.62rem; letter-spacing:.14em; text-transform:uppercase; color:var(--ink-soft); font-weight:700; margin-bottom:.12rem; }
.origin-card dd{ margin:0; font-family:var(--serif); color:var(--ink); font-size:1.15rem; font-weight:600; }
.origin-card .hint{ color:var(--ink-soft); font-size:.92rem; line-height:1.5; }
.origin-card.empty .placeholder h3{ font-size:1.7rem; font-family:var(--serif); }
.origin-card.empty .content{ display:none; }
.origin-card:not(.empty) .placeholder{ display:none; }

/* Leyenda en píldoras */
.map-legend{ display:flex; flex-wrap:wrap; gap:.9rem; justify-content:center; margin-top:2rem; }
.map-legend .lg{ display:inline-flex; align-items:center; gap:.6em; font-size:.82rem; color:var(--ink); font-weight:600;
  background:#fff; padding:.55em 1.1em; border-radius:100px; box-shadow:0 8px 20px rgba(60,50,40,.08); border:1px solid rgba(0,0,0,.04); }
.map-legend .sw{ width:11px; height:11px; border-radius:50%; }
.sw.dulces{ background:#CE7A8C; } .sw.cuerpo{ background:#7A96C4; } .sw.citricas{ background:#9BAA57; }
.map-note{ display:flex; align-items:center; justify-content:center; gap:.5em; text-align:center; color:var(--ink-soft); font-size:.82rem; margin-top:1.1rem; }
.map-note svg{ width:16px; height:16px; color:var(--gold-deep); flex:0 0 auto; }

/* =========================================================
   MAQUILA (marca blanca)
   ========================================================= */
.maquila{ background:var(--teal-900); color:#e7e0d2; position:relative; overflow:hidden; padding-block:clamp(46px,5vw,74px); }
/* textura: rama de café en trazo dorado al fondo derecho */
.maquila__texture{
  position:absolute; top:50%; right:-40px; transform:translateY(-50%);
  width:min(42%,560px); height:118%; z-index:0; pointer-events:none;
  background:url("../assets/img/branch-gold.svg") no-repeat right center/contain;
  opacity:.14;
  -webkit-mask-image:linear-gradient(270deg,#000,transparent 92%);
  mask-image:linear-gradient(270deg,#000,transparent 92%);
}
.maquila > .container{ position:relative; z-index:1; }
.maquila__grid{ display:grid; grid-template-columns:1.05fr 1fr; gap:clamp(28px,3.5vw,56px); align-items:center; }

.maquila__media{ position:relative; }
.maquila__frame{
  position:relative; border-radius:22px; overflow:hidden;
  border:2px solid rgba(200,161,90,.55);
  box-shadow:0 44px 80px -26px rgba(0,0,0,.6), 0 10px 30px rgba(0,0,0,.35);
}
.maquila__frame img{ width:100%; height:auto; display:block; transition:transform 1s cubic-bezier(.2,.7,.2,1); }
.maquila__frame:hover img{ transform:scale(1.03); }

/* Cuerpo */
.maquila__body{ position:relative; z-index:1; }
.mq-eyebrow{ display:block; font-size:.73rem; letter-spacing:.2em; text-transform:uppercase; color:var(--accent-soft); font-weight:800; margin-bottom:.7rem; }
.mq-title{ font-family:var(--serif); color:#F6EFE0; font-size:clamp(2.1rem,3vw,3rem); line-height:1.02; margin-bottom:.8rem; }
.mq-orn{ display:flex; align-items:center; gap:.7rem; color:var(--gold); margin-bottom:1rem; max-width:340px; }
.mq-orn span{ height:1px; flex:1; background:linear-gradient(90deg,rgba(200,161,90,.55),transparent); }
.mq-orn span:first-child{ background:linear-gradient(270deg,rgba(200,161,90,.55),transparent); }
.mq-orn .bean{ width:18px; height:18px; flex:0 0 auto; }
.maquila__body p{ color:#cbd4ce; line-height:1.55; margin-bottom:.75rem; font-size:.94rem; max-width:54ch; }
.maquila__body .mq-lead{ color:#dde4dd; }
.maquila__body strong{ color:var(--accent-soft); font-weight:700; }
.maquila__body em{ color:#ece5d6; }

/* Pasos */
.mq-steps{ display:grid; grid-template-columns:repeat(3,1fr); margin:1.3rem 0; }
.mq-step{ padding:0 1.1rem; }
.mq-step:first-child{ padding-left:0; }
.mq-step + .mq-step{ border-left:1px solid rgba(255,255,255,.10); }
.mq-step__ring{ width:48px; height:48px; border-radius:50%; border:1.5px solid rgba(200,161,90,.6); display:grid; place-items:center; color:var(--accent-soft); margin-bottom:.6rem; }
.mq-step__ring svg{ width:23px; height:23px; }
.mq-step__txt{ display:flex; align-items:center; gap:.5rem; }
.mq-step__num{ width:20px; height:20px; border-radius:50%; background:var(--gold); color:var(--teal-950); font-size:.7rem; font-weight:800; display:grid; place-items:center; flex:0 0 auto; }
.mq-step__txt p{ margin:0; color:#eee7d8; font-size:.82rem; font-weight:600; line-height:1.2; max-width:none; }

/* Banner */
.mq-banner{ display:inline-flex; align-items:center; gap:.7em; border:1px solid rgba(200,161,90,.5); border-radius:100px; padding:.6em 1.25em; color:var(--accent-soft); font-size:.7rem; letter-spacing:.07em; text-transform:uppercase; font-weight:700; margin-bottom:1.3rem; }
.mq-banner svg{ width:17px; height:17px; flex:0 0 auto; }

/* Footer: badges + cotización */
.mq-foot{ display:flex; flex-wrap:wrap; align-items:center; gap:1.4rem 2rem; }
.mq-badges{ display:flex; align-items:center; gap:.85rem; }
.mq-badges img{ width:54px; height:54px; }
.mq-badges span{ font-size:.8rem; color:#c9d3ce; line-height:1.3; }
.mq-quote{ margin-left:auto; }
.mq-quote__label{ display:block; font-size:.66rem; letter-spacing:.14em; text-transform:uppercase; color:var(--accent-soft); font-weight:700; margin-bottom:.55rem; }
.mq-btn{ display:inline-flex; align-items:center; gap:.5em; background:var(--teal); color:#fff; font-family:var(--sans); font-weight:700; font-size:.9rem; padding:.9em 1.8em; border-radius:100px; box-shadow:0 14px 30px rgba(0,0,0,.35); transition:transform .25s ease, background .25s ease; }
.mq-btn:hover{ background:var(--teal-500); transform:translateY(-2px); }
.mq-btn .arrow{ transition:transform .25s ease; }
.mq-btn:hover .arrow{ transform:translateX(4px); }
.pill-tag{ display:inline-block; font-size:.72rem; letter-spacing:.18em; text-transform:uppercase; color:var(--gold-deep); font-weight:700; margin-bottom:1rem; }

/* =========================================================
   CLIENTES
   ========================================================= */
.clientes{
  text-align:center; position:relative; overflow:hidden;
  background:
    url("../assets/img/beans-scatter.svg") center top / 1100px auto no-repeat,
    linear-gradient(180deg, #FBF6EC 0%, #F2E9D8 100%);
}
.clientes > .container{ position:relative; z-index:1; }
.clientes h2{ margin-bottom:.6rem; }
.clientes .lead{ margin:0 auto 1.2rem; }
.orn-divider.center{ justify-content:center; max-width:260px; margin:0 auto; }

/* Marquee de logos */
.marquee{
  position:relative; margin-top:clamp(30px,4vw,52px); z-index:1;
  -webkit-mask-image:linear-gradient(90deg, transparent, #000 7%, #000 93%, transparent);
  mask-image:linear-gradient(90deg, transparent, #000 7%, #000 93%, transparent);
}
.marquee__track{ display:flex; width:max-content; animation:marquee 46s linear infinite; }
.marquee:hover .marquee__track{ animation-play-state:paused; }
@keyframes marquee{ from{ transform:translateX(0); } to{ transform:translateX(-50%); } }
.marquee__set{ display:flex; align-items:center; gap:clamp(16px,1.6vw,26px); padding-left:clamp(16px,1.6vw,26px); }
.m-logo{
  flex:0 0 auto; height:100px; width:180px; display:grid; place-items:center; padding:18px 24px; overflow:hidden;
  background:#fff; border:1px solid rgba(0,0,0,.05); border-radius:18px;
  box-shadow:0 12px 28px rgba(60,50,40,.09);
  transition:transform .3s ease, box-shadow .3s ease;
}
.m-logo:hover{ transform:translateY(-6px); box-shadow:0 18px 38px rgba(60,50,40,.16); }
.m-logo img{ max-height:56px; max-width:100%; width:auto; height:auto; object-fit:contain; filter:grayscale(1); opacity:.82; transition:filter .35s ease, opacity .35s ease; }
.m-logo:hover img{ filter:none; opacity:1; }
@media (prefers-reduced-motion:reduce){ .marquee__track{ animation:none; } }

/* =========================================================
   NOSOTROS + PREMIOS
   ========================================================= */
.nosotros{ background:var(--teal-900); color:#eee7d8; }
.nosotros__grid{ display:grid; grid-template-columns:1fr 1fr; gap:clamp(30px,5vw,72px); align-items:center; }
.nosotros h2{ color:#fff; margin-bottom:1.2rem; }
.nosotros h2 em{ font-style:italic; color:var(--accent-soft); font-weight:500; }
.nosotros p{ color:#cdd8d3; }
.awards{ display:flex; gap:1.4rem; align-items:center; margin-top:2rem; flex-wrap:wrap; }
.awards img{ width:118px; height:118px; filter:drop-shadow(0 14px 28px rgba(0,0,0,.4)); animation:floaty 5s ease-in-out infinite; }
.awards img:nth-child(2){ animation-delay:1s; }
.awards--roasters{ margin-top:1.1rem; }
.awards .aw-logo{ width:auto; height:50px; animation:none; filter:drop-shadow(0 8px 18px rgba(0,0,0,.3)); }
.awards .aw-txt b{ display:block; font-family:var(--serif); font-size:1.5rem; font-weight:600; color:#fff; }
.awards .aw-txt span{ font-size:.9rem; color:#c9d3ce; }
.nosotros__stats{ display:grid; grid-template-columns:repeat(4,1fr); gap:1.2rem; margin-top:clamp(30px,4vw,54px); }
@media (max-width:760px){ .nosotros__stats{ grid-template-columns:repeat(2,1fr); } }
.nosotros__stats .box{ background:rgba(255,255,255,.05); border:1px solid rgba(255,255,255,.12); border-radius:var(--radius); padding:1.8rem 1.6rem; transition:transform .3s ease, background .3s ease; }
.nosotros__stats .box:hover{ transform:translateY(-5px); background:rgba(255,255,255,.08); }
.nosotros__stats b{ font-family:var(--serif); font-size:2.9rem; font-weight:600; color:var(--gold); line-height:1; display:block; }
.nosotros__stats span{ font-size:.86rem; color:#cdd8d3; }

/* =========================================================
   CTA FINAL + FOOTER
   ========================================================= */
.cta-band{ position:relative; text-align:center; color:#fff; }
.cta-band .cta-bg{ position:absolute; inset:0; z-index:0; }
.cta-band .cta-bg img{ width:100%; height:100%; object-fit:cover; }
.cta-band .cta-overlay{ position:absolute; inset:0; z-index:0; background:linear-gradient(rgba(44,94,92,.82),rgba(39,79,78,.9)); }
.cta-band .container{ z-index:3; }
.cta-band h2{ color:#fff; margin-bottom:1rem; }
.cta-band p{ color:#e4ded0; max-width:54ch; margin-inline:auto; margin-bottom:2rem; }
.cta-band .hero__actions{ justify-content:center; }

.footer{ background:var(--teal-900); color:#c3ccc8; padding-block:clamp(56px,7vw,86px) 0; font-size:.92rem; position:relative; overflow:hidden; }
.footer__grid{ display:grid; grid-template-columns:1.4fr 1fr 1fr 1fr; gap:2.4rem; position:relative; z-index:2; }
.footer .brand img{ height:82px; margin-bottom:1.2rem; }
.footer h4{ font-family:var(--sans); font-size:.76rem; letter-spacing:.16em; text-transform:uppercase; color:var(--gold); margin-bottom:1.1rem; font-weight:700; }
.footer a{ display:block; margin-bottom:.55rem; color:#c3ccc8; transition:color .2s; }
.footer a:hover{ color:#fff; }
.footer .soon{ opacity:.55; }
.footer__bottom{ border-top:1px solid rgba(255,255,255,.1); margin-top:3rem; padding-block:1.6rem; display:flex; justify-content:space-between; flex-wrap:wrap; gap:1rem; font-size:.8rem; color:#8b9691; position:relative; z-index:2; }

/* Floating WhatsApp */
.wa-float{ position:fixed; right:22px; bottom:22px; z-index:90; width:60px; height:60px; border-radius:50%; background:#25D366; color:#fff; display:grid; place-items:center; box-shadow:0 12px 30px rgba(37,211,102,.45); transition:transform .25s ease; animation:floaty 4s ease-in-out infinite; }
.wa-float:hover{ transform:scale(1.08); }
.wa-float svg{ width:32px; height:32px; }

/* ---------- Reveal ---------- */
.reveal{ opacity:0; transform:translateY(34px); transition:opacity .8s cubic-bezier(.2,.7,.2,1), transform .8s cubic-bezier(.2,.7,.2,1); }
.reveal.in{ opacity:1; transform:none; }
.reveal.d1{ transition-delay:.1s; } .reveal.d2{ transition-delay:.2s; } .reveal.d3{ transition-delay:.3s; }

/* =========================================================
   LANDINGS DE SERVICIO
   ========================================================= */
.lp-hero{
  position:relative; min-height:74vh; display:flex; align-items:center; color:#fff; overflow:hidden;
  padding-top:calc(var(--topbar-h) + var(--header-h) + 24px); padding-bottom:70px;
}
.lp-hero__bg{ position:absolute; inset:0; z-index:0; }
.lp-hero__bg img{ width:100%; height:100%; object-fit:cover; }
.lp-hero{ text-align:center; }
.lp-hero__bg::after{ content:""; position:absolute; inset:0; background:radial-gradient(125% 105% at 50% 42%, rgba(8,20,19,.5), rgba(8,20,19,.88)); }
.lp-hero__inner{ position:relative; z-index:1; max-width:800px; margin:0 auto; }
.lp-hero .eyebrow-orn{ color:var(--accent-soft); margin-bottom:1rem; }
.lp-hero h1{ font-family:var(--serif); font-size:clamp(2.7rem,5.4vw,4.4rem); line-height:1.01; margin-bottom:.6rem; }
.lp-hero h1 em{ font-style:italic; color:var(--cyan); }
.lp-hero .orn-divider{ justify-content:center; max-width:230px; margin:1.2rem auto 1.4rem; color:var(--accent-soft); }
.lp-hero .orn-divider span{ background:linear-gradient(90deg,rgba(223,194,138,.6),transparent); }
.lp-hero .orn-divider span:first-child{ background:linear-gradient(270deg,rgba(223,194,138,.6),transparent); }
.lp-hero .orn-divider svg{ width:20px; height:20px; flex:0 0 auto; }
.lp-hero p{ font-size:1.12rem; color:#dbe2df; line-height:1.65; max-width:580px; margin:0 auto 2rem; }
.lp-hero__actions{ display:flex; gap:1rem; flex-wrap:wrap; justify-content:center; }
/* fundido del hero hacia la primera sección clara */
.lp-hero::after{ content:""; position:absolute; left:0; right:0; bottom:0; height:120px; z-index:1; pointer-events:none; background:linear-gradient(0deg, #FFFDF9 0%, rgba(255,253,249,0) 100%); }

.lp-section{
  padding-block:clamp(56px,7vw,96px); position:relative; overflow:hidden;
  background:
    url("../assets/img/beans-scatter.svg") center top / 1050px auto no-repeat,
    linear-gradient(180deg,#FFFDF9 0%, #FAF3E8 100%);
}
.lp-section > .container{ position:relative; z-index:1; }
.lp-section.alt{
  background:
    url("../assets/img/beans-scatter.svg") center bottom / 1050px auto no-repeat,
    linear-gradient(180deg,#F4ECDB 0%, #EBE0CC 100%);
}
/* We keep the class name .lp-section.teal but style it as espresso dark so we don't have to touch all HTML files */
.lp-section.teal{ background:#231912; color:#E8E0D0; position:relative; overflow:hidden; }
.lp-section.teal::before{
  content:""; position:absolute; top:0; left:0; right:0; bottom:0; z-index:0; pointer-events:none;
  background: radial-gradient(circle at 85% 15%, rgba(200,161,90,0.12) 0%, transparent 45%),
              radial-gradient(circle at 15% 85%, rgba(200,161,90,0.08) 0%, transparent 40%);
}
.lp-section.teal::after{
  content:""; position:absolute; inset:0; z-index:0; pointer-events:none; opacity:.04;
  background: url("../assets/img/beans-scatter.svg") repeat; background-size: 350px;
}
.lp-section.teal > .container{ position:relative; z-index:1; }
.lp-head{ max-width:720px; margin:0 auto clamp(34px,4vw,52px); text-align:center; }
.lp-head .eyebrow-orn{ display:inline-block; color:var(--gold-deep); margin-bottom:.7rem; }
.lp-head h2{ font-family:var(--serif); font-size:clamp(1.9rem,3vw,2.7rem); color:var(--ink); margin-bottom:.8rem; }
.lp-section.teal .lp-head h2{ color:#FDFBF7; }
.lp-head p{ color:var(--ink-soft); font-size:1.02rem; line-height:1.6; }
.lp-section.teal .lp-head p{ color:#DCC7A3; }

.lp-features{ display:flex; flex-wrap:wrap; justify-content:center; gap:1.4rem; }
.lp-feature{ flex:1 1 260px; max-width:350px; position:relative; border:1px solid rgba(0,0,0,.06); border-radius:20px; padding:1.9rem 1.7rem; box-shadow:0 14px 34px rgba(60,50,40,.08); transition:transform .3s ease, box-shadow .3s ease, border-color .3s ease; overflow:hidden;
  background:url("../assets/img/beans-scatter.svg") right -34px bottom -34px / 220px auto no-repeat, #fff; }
.lp-feature::before{ content:""; position:absolute; top:0; left:0; right:0; height:3px; background:linear-gradient(90deg,var(--cyan),var(--teal-500)); transform:scaleX(0); transform-origin:left; transition:transform .35s ease; }
.lp-feature:hover{ transform:translateY(-6px); box-shadow:0 24px 46px rgba(60,50,40,.15); border-color:rgba(38,173,181,.35); }
.lp-feature:hover::before{ transform:scaleX(1); }
.lp-feature__ic{ width:54px; height:54px; border-radius:15px; background:linear-gradient(135deg, rgba(38,173,181,.18), rgba(38,173,181,.05)); color:var(--cyan); display:grid; place-items:center; margin-bottom:1.1rem; }
.lp-feature__ic svg{ width:26px; height:26px; }
.lp-feature h3{ font-family:var(--serif); font-size:1.25rem; color:var(--ink); margin-bottom:.5rem; }
.lp-feature p{ color:var(--ink-soft); font-size:.94rem; line-height:1.55; }

/* Tarjetas de tipo de evento (Catering) */
.lp-events{ display:flex; flex-wrap:wrap; justify-content:center; gap:1.4rem; }
.lp-event{
  flex:1 1 230px; max-width:300px;
  position:relative; text-align:center; border:1px solid rgba(0,0,0,.06);
  border-radius:22px; padding:2.2rem 1.6rem; box-shadow:0 16px 36px rgba(60,50,40,.09);
  transition:transform .3s ease, box-shadow .3s ease;
  background:url("../assets/img/beans-scatter.svg") right -30px bottom -30px / 210px auto no-repeat, #fff;
}
.lp-event:hover{ transform:translateY(-8px); box-shadow:0 26px 50px rgba(60,50,40,.16); }
.lp-event__ic{
  width:74px; height:74px; margin:0 auto 1.2rem; border-radius:50%;
  background:linear-gradient(135deg, var(--teal) 0%, var(--teal-900) 100%);
  color:#fff; display:grid; place-items:center; box-shadow:0 14px 28px rgba(26,74,72,.32);
}
.lp-event__ic svg{ width:34px; height:34px; }
.lp-event h3{ font-family:var(--serif); font-size:1.2rem; color:var(--ink); margin-bottom:.5rem; line-height:1.15; }
.lp-event p{ color:var(--ink-soft); font-size:.92rem; line-height:1.55; }

.lp-split{ display:grid; grid-template-columns:1fr 1fr; gap:clamp(30px,5vw,64px); align-items:center; }
.lp-split__media img{ width:100%; border-radius:22px; box-shadow:0 30px 60px rgba(60,50,40,.22); display:block; }
.lp-split h2{ font-family:var(--serif); font-size:clamp(1.8rem,2.8vw,2.5rem); color:var(--ink); margin-bottom:1rem; }
.lp-split .eyebrow-orn{ display:inline-block; color:var(--gold-deep); margin-bottom:.7rem; }
.lp-split p{ color:var(--ink-soft); line-height:1.65; margin-bottom:1rem; }
.lp-list{ list-style:none; margin:1.2rem 0 0; display:grid; gap:.7rem; }
.lp-list li{ display:flex; gap:.7rem; align-items:flex-start; color:var(--ink); font-size:.98rem; }
.lp-list svg{ width:22px; height:22px; color:var(--cyan); flex:0 0 auto; margin-top:1px; }

.lp-steps{ display:flex; flex-wrap:wrap; justify-content:center; gap:1.4rem; }
.lp-step{
  flex:1 1 210px; max-width:270px; text-align:center; padding:2.3rem 1.5rem 1.9rem;
  border-radius:22px; border:1px solid rgba(0,0,0,.05); overflow:hidden;
  background:url("../assets/img/beans-scatter.svg") right -30px bottom -30px / 200px auto no-repeat, #fffdf9;
  box-shadow:0 26px 50px rgba(0,0,0,.32);
  transition:transform .35s ease, box-shadow .3s ease;
}
.lp-step:hover{ transform:translateY(-8px); box-shadow:0 34px 62px rgba(0,0,0,.42); }
.lp-step__n{
  width:64px; height:64px; margin:0 auto 1.1rem; border-radius:50%;
  background:linear-gradient(165deg, var(--gold) 0%, var(--gold-deep) 100%);
  color:#fff; font-family:var(--serif); font-size:1.55rem; display:grid; place-items:center;
  box-shadow:0 14px 28px rgba(169,132,60,.42), inset 0 0 0 1px rgba(255,255,255,.28);
}
.lp-step h3{ font-size:1.1rem; color:var(--ink); margin-bottom:.45rem; font-weight:700; }
.lp-step p{ color:var(--ink-soft); font-size:.9rem; line-height:1.5; }

/* CTA + Formulario */
.lp-cta{ position:relative; background:linear-gradient(160deg,var(--teal-900),var(--teal-950)); color:#fff; overflow:hidden; }
.lp-cta::before{
  content:""; position:absolute; top:50%; left:-40px; transform:translateY(-50%); width:min(38%,480px); height:120%; z-index:0; pointer-events:none;
  background:url("../assets/img/branch-gold.svg") no-repeat left center/contain; opacity:.10;
  -webkit-mask-image:linear-gradient(90deg,#000,transparent 92%); mask-image:linear-gradient(90deg,#000,transparent 92%);
}
.lp-cta__grid{ display:grid; grid-template-columns:1fr 1fr; gap:clamp(30px,5vw,60px); align-items:center; position:relative; z-index:1; }
.lp-cta .eyebrow-orn{ display:inline-block; color:var(--accent-soft); margin-bottom:.8rem; }
.lp-cta h2{ font-family:var(--serif); font-size:clamp(2rem,3.2vw,2.9rem); color:#fff; margin-bottom:1rem; line-height:1.05; }
.lp-cta h2 em{ font-style:italic; color:var(--accent-soft); }
.lp-cta > .container > .lp-cta__grid > div > p{ color:#cdd8d3; line-height:1.6; margin-bottom:1.4rem; }
.lp-cta__perks{ list-style:none; display:grid; gap:.7rem; }
.lp-cta__perks li{ display:flex; gap:.6rem; align-items:center; color:#e7e0d2; }
.lp-cta__perks svg{ width:20px; height:20px; color:var(--accent-soft); flex:0 0 auto; }

.contact-form{ background:#fff; border-radius:24px; padding:clamp(1.6rem,3vw,2.4rem); box-shadow:0 34px 66px rgba(0,0,0,.4); }
/* Honeypot anti-spam: oculto para personas, visible para bots */
.cf-hp{ position:absolute !important; left:-9999px !important; top:auto; width:1px; height:1px; overflow:hidden; opacity:0; pointer-events:none; }
.contact-form h3{ font-family:var(--serif); color:var(--ink); font-size:1.5rem; margin-bottom:.25rem; }
.contact-form .cf-sub{ color:var(--ink-soft); font-size:.9rem; margin-bottom:1.3rem; }
.cf-field{ margin-bottom:.9rem; }
.cf-field label{ display:block; font-size:.7rem; letter-spacing:.06em; text-transform:uppercase; color:var(--ink-soft); font-weight:700; margin-bottom:.35rem; }
.cf-field input, .cf-field textarea, .cf-field select{ width:100%; padding:.8em 1em; border:1.5px solid rgba(0,0,0,.12); border-radius:12px; font-family:var(--sans); font-size:.95rem; color:var(--ink); background:#fff; outline:none; transition:border-color .2s ease, box-shadow .2s ease; }
.cf-field input:focus, .cf-field textarea:focus, .cf-field select:focus{ border-color:var(--cyan); box-shadow:0 0 0 3px rgba(38,173,181,.15); }
.cf-field textarea{ resize:vertical; min-height:92px; }
.cf-row{ display:grid; grid-template-columns:1fr 1fr; gap:.9rem; }
.contact-form .btn{ width:100%; justify-content:center; margin-top:.5rem; }
.cf-success{ display:none; text-align:center; padding:1.5rem .5rem; }
.cf-success svg{ width:58px; height:58px; color:var(--cyan); margin-bottom:1rem; }
.cf-success h3{ font-size:1.5rem; margin-bottom:.4rem; }
.cf-success p{ color:var(--ink-soft); }
.contact-form.sent .cf-body{ display:none; }
.contact-form.sent .cf-success{ display:block; }

@media (max-width:900px){
  .lp-split, .lp-cta__grid{ grid-template-columns:1fr; }
  .lp-hero__inner{ text-align:center; margin-inline:auto; }
  .lp-hero__actions{ justify-content:center; }
}
@media (max-width:560px){ .cf-row{ grid-template-columns:1fr; } }

/* ---------- Responsive ---------- */
@media (max-width:1080px){
  .origenes__grid{ grid-template-columns:1fr; justify-items:center; text-align:left; }
  .origenes__intro{ text-align:center; }
  .origenes__intro p{ margin-inline:auto; }
  .map-stage{ width:100%; max-width:520px; }
  .origin-card{ min-height:auto; width:100%; max-width:520px; }
  .nosotros__grid, .maquila__grid, .esencia__grid{ grid-template-columns:1fr; }
  .esencia__media{ max-width:460px; margin-inline:auto; }
}
@media (max-width:900px){
  .nav, .header-cta .btn-gold{ display:none; }
  .menu-toggle{ display:block; }
  .unit-grid{ grid-template-columns:1fr; }
  .unit__content{ padding:4rem 2rem; text-align:center; }
  .footer__grid{ grid-template-columns:1fr 1fr; }
  .nav.open{ display:flex; position:fixed; inset:calc(var(--topbar-h) + var(--header-h)) 0 auto 0; flex-direction:column; background:var(--teal-900); padding:1.6rem var(--gutter) 2rem; gap:1.1rem; border-top:1px solid rgba(255,255,255,.1); }
  .site-header.scrolled .nav.open{ inset:70px 0 auto 0; }
  .hero__badges{ flex-direction:row; right:auto; left:50%; top:auto; bottom:92px; transform:translateX(-50%); }
  .hero__badges img{ width:74px; }
  .section{ padding:60px 0; }
}
@media (max-width:560px){
  .container { max-width: 380px !important; margin-inline: auto; padding-inline: 15px; }
  .footer__grid{ grid-template-columns:1fr; }
  .esencia__stats{ gap:1.4rem; }
  .stamp{ width:110px; height:110px; left:-14px; bottom:-22px; }
  .hero__scroll{ display:none; }
  .section{ padding:40px 0; overflow-x: hidden; }
  .hero__v2-grid{ padding-inline:15px; max-width: 380px; margin-inline: auto; overflow-x: hidden; }
  .lp-head h2, .section-title { font-size: 2.4rem; }
  
  /* Fix card and seal on mobile */
  .esencia__media { margin-top: 2rem; padding-bottom: 2rem; }
  .altura-card {
    position: relative;
    top: auto; right: auto; transform: none;
    width: 100%; max-width: 100%;
    margin-top: -40px; margin-inline: auto;
  }
  .origin-seal {
    left: 50%; bottom: auto; top: -60px;
    transform: translateX(-50%);
  }
  .origin-features { flex-wrap: wrap; justify-content: center; }
  .btn-origin { width: 100%; justify-content: center; padding: 1em 1.5em; text-align: center; }
  
  /* =========================================
     FIX HERO V2 MOBILE (La sección 1)
     ========================================= */
  .hero-v2 { padding-bottom: 30px; }
  .hero__v2-grid { gap: 2rem; padding-top: 20px; }
  
  /* Botones 100% ancho y apilados */
  .hero__actions { 
    flex-direction: column !important; 
    width: 100%; 
    gap: 1rem !important; 
  }
  .hero__actions .btn { 
    width: 100% !important; 
    justify-content: center; 
    text-align: center; 
  }
  
  /* Ocultar el marco vacío feo */
  .hero__col-frame { display: none !important; }
  
  /* Reconocimientos: Texto centrado en su propia línea, insignias abajo */
  .hero__col-awards { 
    padding-top: 1rem; 
    flex-direction: row !important; 
    flex-wrap: wrap !important;
    justify-content: center !important;
    gap: 1rem !important;
  }
  .hero__col-awards > div:first-child { 
    flex: 1 1 100%; 
    justify-content: center; 
    margin-bottom: 0.5rem !important; 
  }
  /* Achicar las insignias para que no saturen la pantalla */
  .ha-badge.v2 { 
    width: 90px !important; 
    height: 90px !important; 
    margin-bottom: 0 !important;
  }
}
@media (prefers-reduced-motion:reduce){
  *{ animation:none !important; }
  .reveal{ opacity:1; transform:none; }
}

/* ============================================================
   GALERÍA GASTRONÓMICA
   ============================================================ */
.galeria-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 1.5rem;
  margin-top: 3rem;
  padding-inline: 1rem;
}
.gal-item {
  position: relative;
  border-radius: 16px;
  overflow: hidden;
  box-shadow: 0 10px 30px rgba(0,0,0,0.08);
  aspect-ratio: 4 / 5;
  transition: transform 0.4s ease, box-shadow 0.4s ease;
  background-color: #f1ede5;
}
.gal-item img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform 0.6s ease;
}
.gal-item:hover {
  transform: translateY(-5px);
  box-shadow: 0 16px 40px rgba(0,0,0,0.15);
}
.gal-item:hover img {
  transform: scale(1.05);
}
@media (max-width: 992px) {
  .galeria-grid {
    grid-template-columns: repeat(2, 1fr);
  }
}
@media (max-width: 576px) {
  .galeria-grid {
    grid-template-columns: 1fr;
    gap: 1rem;
  }
  .gal-item {
    aspect-ratio: 16 / 12;
  }
}

/* ============================================================
   PROMO POP-UP
   ============================================================ */
.promo-popup {
  position: fixed;
  inset: 0;
  z-index: 9999;
  display: flex;
  align-items: center;
  justify-content: center;
  pointer-events: none;
  opacity: 0;
  visibility: hidden;
  transition: opacity 0.4s ease, visibility 0.4s ease;
}
.promo-popup.show {
  pointer-events: auto;
  opacity: 1;
  visibility: visible;
}
.promo-popup__overlay {
  position: absolute;
  inset: 0;
  background: rgba(0,0,0,0.75);
  backdrop-filter: blur(4px);
}
.promo-popup__content {
  position: relative;
  z-index: 1;
  background: var(--cream);
  width: 90%;
  max-width: 460px;
  border-radius: 20px;
  overflow: hidden;
  box-shadow: 0 24px 60px rgba(0,0,0,0.4);
  transform: translateY(30px);
  transition: transform 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275);
}
.promo-popup.show .promo-popup__content {
  transform: translateY(0);
}
.promo-popup__close {
  position: absolute;
  top: 15px;
  right: 15px;
  width: 36px;
  height: 36px;
  background: rgba(0,0,0,0.6);
  color: #fff;
  border: none;
  border-radius: 50%;
  font-size: 1.5rem;
  line-height: 1;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: background 0.3s ease;
  z-index: 2;
}
.promo-popup__close:hover {
  background: rgba(0,0,0,0.9);
}
.promo-popup__media {
  width: 100%;
  aspect-ratio: 4/5;
  background: var(--red); /* The image background is red */
}
.promo-popup__media img {
  width: 100%;
  height: 100%;
  object-fit: contain;
}
.promo-popup__body {
  padding: 1.5rem 2rem;
  text-align: center;
}
.promo-popup__body h3 {
  font-size: 1.6rem;
  margin-bottom: 0.5rem;
  color: var(--ink);
}
.promo-popup__body p {
  font-size: 0.95rem;
  color: var(--ink-soft);
  margin: 0;
}