/* ===== CoffeeFly interactivo ===== */
body{font-family:"Plus Jakarta Sans",Inter,system-ui,sans-serif}
.btn-navy{background:var(--navy);color:var(--cream)}.btn-navy:hover{background:#24506a;transform:translateY(-1px)}
.btn-line{border-color:var(--navy);color:var(--navy);background:#ffffff80}.btn-line:hover{background:var(--navy);color:var(--cream)}

/* HERO con scroll */
.ihero{position:relative;height:250vh;background:#f3e6d8}
.ihero-stick{position:sticky;top:0;height:100vh;height:100svh;overflow:hidden;display:grid;grid-template-columns:1fr;align-items:center}
.ih-bg{position:absolute;inset:-2%;background:url(media/sky.webp) center 60%/cover;transform:scale(calc(1 + var(--hp)*.1)) translate3d(calc(var(--mx,0)*-8px),calc(var(--my,0)*-6px),0);will-change:transform}
.ih-bg::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(246,238,224,0) 40%,rgba(246,238,224,.35) 100%);opacity:calc(.4 + var(--hp)*.6)}
.ih-glow{position:absolute;right:6%;top:50%;width:min(62vh,48vw);aspect-ratio:1;transform:translateY(-50%);border-radius:50%;background:radial-gradient(circle,rgba(255,244,228,.95) 0,rgba(255,240,220,.6) 45%,transparent 70%)}
.ih-text{position:relative;z-index:4;padding:5.5rem max(1.3rem,calc((100vw - 1180px)/2)) 2rem;max-width:calc(36rem + max(1.3rem,(100vw - 1180px)/2));opacity:calc(1 - max(0,var(--hp) - .45)*2.5);transform:translateY(calc(max(0,var(--hp) - .45)*-140px))}
.ih-logo{width:84px;height:84px;border-radius:50%;object-fit:cover;object-position:50% 52%;margin-bottom:.8rem;box-shadow:0 6px 18px #1a354955}
.ih-text .eyebrow{color:var(--teal);font-size:clamp(1.7rem,4.5vw,2.3rem)}
.ih-text h1{font-family:"Abril Fatface","Playfair Display",serif;font-weight:400;color:var(--navy);font-size:clamp(2.3rem,6vw,4.4rem);line-height:1.02;margin:.3rem 0 1rem;letter-spacing:.005em}
.ih-text h1 em{font-family:"Playfair Display",serif;font-style:italic;font-weight:500;color:#9a6a3c;font-size:.62em;display:inline-block;margin-top:.35rem}
.ih-text .subtitle{color:var(--navy)}.ih-text .subtitle::before{background:var(--kraft)}
.ih-text .badges li{background:#ffffffa8;border-color:#1a354922;color:var(--navy)}
.ih-cup{position:absolute;z-index:3;right:max(1rem,calc((100vw - 1180px)/2 - 1rem));top:50%;width:min(76vh,50vw);aspect-ratio:1;
 transform:translate3d(calc(var(--mx,0)*18px),calc(-50% + var(--my,0)*12px + var(--cupy,0)*1vh),0) scale(var(--cups,1)) rotate(calc(var(--mx,0)*2deg));will-change:transform}
.ih-cup canvas{width:100%;height:100%;display:block;mix-blend-mode:multiply;
 -webkit-mask-image:radial-gradient(closest-side,#000 62%,transparent 100%);mask-image:radial-gradient(closest-side,#000 62%,transparent 100%)}
.ih-route{position:absolute;z-index:2;right:4%;top:14%;width:min(60vw,640px);opacity:.35;stroke-dashoffset:calc(600 - var(--hp)*600)}
.ih-route path{stroke-dasharray:7 9}
.ih-clouds{position:absolute;inset:0;pointer-events:none}
.ih-clouds.back{z-index:1;transform:translate3d(calc(var(--mx,0)*10px),calc(var(--hp)*-6vh),0)}
.ih-bank{position:absolute;z-index:5;left:-15%;right:-15%;bottom:-62vh;height:80vh;pointer-events:none;filter:blur(5px);
 transform:translate3d(calc(var(--mx,0)*-30px),calc(var(--bank,0)*-34vh + var(--my,0)*-8px),0);
 background:
 radial-gradient(closest-side,#fff 60%,transparent) 2% 0/26% 34% no-repeat,
 radial-gradient(closest-side,#fff 60%,transparent) 20% 3%/22% 26% no-repeat,
 radial-gradient(closest-side,#fffdf9 60%,transparent) 38% 0/30% 36% no-repeat,
 radial-gradient(closest-side,#fff 60%,transparent) 58% 4%/24% 28% no-repeat,
 radial-gradient(closest-side,#fffdf9 60%,transparent) 78% 0/30% 38% no-repeat,
 radial-gradient(closest-side,#fff 60%,transparent) 98% 3%/24% 30% no-repeat,
 linear-gradient(180deg,transparent 0,transparent 12%,#fff 20%,#fbf7f0 100%)}
.pc{position:absolute;filter:drop-shadow(0 10px 18px rgba(26,53,73,.10))}
.pa{width:220px;top:16%;left:42%;opacity:.7}.pb{width:150px;top:8%;right:6%;opacity:.8}
.ih-trail{position:absolute;inset:0;width:100%;height:100%;z-index:6;pointer-events:none}
.ih-hint{position:absolute;z-index:6;left:50%;bottom:22px;transform:translateX(-50%);display:flex;flex-direction:column;align-items:center;gap:.4rem;color:var(--navy);font-size:.78rem;letter-spacing:.16em;text-transform:uppercase;opacity:calc(1 - var(--hp)*6)}
.ih-hint i{width:22px;height:34px;border:2px solid var(--navy);border-radius:12px;position:relative}
.ih-hint i::after{content:"";position:absolute;left:50%;top:6px;width:4px;height:7px;margin-left:-2px;border-radius:2px;background:var(--navy);animation:hint 1.6s infinite}
@keyframes hint{0%{opacity:0;transform:translateY(0)}40%{opacity:1}100%{opacity:0;transform:translateY(12px)}}
@media(max-width:899px){
 .ihero{height:210vh}
 .ihero-stick{align-items:start}
 .ih-text{padding:4.6rem 1.2rem 0;text-align:left}
 .ih-text .badges{display:none}
 .ih-logo{width:64px;height:64px;position:absolute;right:1.2rem;top:4.6rem;margin:0}
 .ih-text h1{font-size:clamp(2rem,9vw,2.8rem);padding-right:70px}
 .ih-text .cta-row{margin-top:1.1rem;gap:.5rem}.ih-text .cta-row .btn{padding:.7rem 1.05rem;font-size:.88rem}
 .ih-cup{right:50%;top:auto;bottom:calc(96px + 2vh);width:min(46vh,80vw);transform:translate3d(calc(50% + var(--mx,0)*10px),calc(var(--cupy,0)*1vh),0) scale(var(--cups,1))}
 .ih-glow{right:50%;top:auto;bottom:calc(96px + 2vh);transform:translateX(50%);width:min(56vh,90vw)}
 .ih-hint{display:none}
 .pa{width:140px;top:30%;left:auto;right:-30px}.pb{width:100px}
 }
@media(max-width:899px) and (max-height:700px){.ih-text .subtitle{display:none}.ih-cup{width:min(40vh,72vw)}}

/* Reveal */
.rv{opacity:0;transform:translateY(34px);transition:opacity .8s ease,transform .8s cubic-bezier(.2,.7,.2,1)}
.rv.in{opacity:1;transform:none}
.grid .card.rv{transition-delay:calc(var(--i,0)*90ms)}
.steps li.rv{transition-delay:calc(var(--i,0)*110ms)}

/* nubes parallax */
.nubes .cl{translate:calc(var(--mx,0)*var(--d,10)*1px) calc(var(--py,0)*var(--d,10)*.6px)}

/* banners parallax */
.banner img{transform:translateY(calc(var(--by,0)*1px)) scale(1.12);will-change:transform}

/* Video pour */
.pour{position:relative;padding:5rem 1.2rem;background:
 radial-gradient(ellipse at 15% 20%,rgba(47,82,52,.10),transparent 45%),
 radial-gradient(ellipse at 85% 80%,rgba(47,82,52,.08),transparent 40%),
 linear-gradient(180deg,#fbf7f0,#f3e6d1);overflow:hidden}
.pour::before{content:"";position:absolute;inset:-10%;opacity:.16;pointer-events:none;
 background:repeating-radial-gradient(ellipse at 20% 30%,transparent 0 22px,#3d4a2f 23px 26px,transparent 27px 60px);filter:blur(14px);transform:rotate(-12deg)}
.pour-in{position:relative;max-width:1080px;margin:auto;display:grid;gap:2.4rem;align-items:center}
.pour-vid{justify-self:center;width:min(78vw,360px);aspect-ratio:9/16;border-radius:28px;overflow:hidden;box-shadow:0 30px 60px #1a35492e,0 0 0 8px #fff}
.pour-vid video{width:100%;height:100%;object-fit:cover;display:block;background:#d9c7ad}
.pour-txt h2{font-family:"Abril Fatface",serif;font-weight:400;font-size:clamp(2rem,5vw,3.2rem);margin:.3rem 0 .8rem;line-height:1.05}
.pour-txt p:not(.script){opacity:.8;max-width:30rem}
@media(min-width:860px){.pour-in{grid-template-columns:1fr 1.1fr}.pour{padding:6rem 2rem}}

/* Ubicación */
.ubica{padding:3.5rem 1.2rem;background:linear-gradient(180deg,#fbf7f0,#e4eef3)}
.ubica-card{max-width:900px;margin:auto;display:flex;gap:1.6rem;align-items:center;background:#fff;border-radius:24px;padding:2rem;box-shadow:0 14px 40px #1a35491a}
.ubica-plane{width:84px;flex:none;animation:vuela 4s ease-in-out infinite alternate}
@keyframes vuela{from{transform:translate(0,4px) rotate(-4deg)}to{transform:translate(8px,-6px) rotate(3deg)}}
.ubica h2{font-family:"Abril Fatface",serif;font-weight:400;font-size:clamp(1.6rem,4vw,2.3rem);margin:.2rem 0 .5rem}
.ubica p:not(.script){opacity:.8}
@media(max-width:640px){.ubica-card{flex-direction:column;text-align:center;padding:1.6rem 1.2rem}.ubica .cta-row{justify-content:center}}

.head h2,.nubes h2{font-family:"Abril Fatface","Playfair Display",serif;font-weight:400;letter-spacing:.01em}

@media(prefers-reduced-motion:reduce){.rv{opacity:1;transform:none;transition:none}.ihero{height:auto}.ihero-stick{position:relative;height:auto;min-height:100svh}.ih-trail{display:none}}

.nubes{background:linear-gradient(180deg,#fbf7f0 0%,#dce9f0 45%,#cfe0ea 70%,var(--cream) 100%)}
