/* ===========================================================
   HARDCORE FITNESS — Landing
   Aesthetic: athletic / urban / electronic — wine-red on near-black
   =========================================================== */

/* Moto Verse — fuente de marca (FontStruct, Jéson Garnica).
   NOTA DE LICENCIA: CC BY-NC-ND 3.0 (no comercial). Uso autorizado por el cliente.
   Ver public/fonts/license.txt y readme.txt */
@font-face{
  font-family:'Moto Verse';
  src:url('../fonts/moto-verse.ttf') format('truetype');
  font-weight:400; font-style:normal; font-display:swap;
}
@font-face{
  font-family:'Moto Verse';
  src:url('../fonts/moto-verse-italic.ttf') format('truetype');
  font-weight:400; font-style:italic; font-display:swap;
}

:root{
  /* Hex EXACTOS del manual de marca */
  --ink:      #000002;  /* negro de marca */
  --ink-2:    #000002;
  --ink-3:    #000002;
  --wine-d:   #74160F;
  --wine:     #9D0013;
  --red:      #C91517;
  --red-hot:  #C91517;  /* sin rojo brillante: rojo exacto del manual */
  --bone:     #FFFFFF;  /* blanco de marca */
  --gray:     #7C7979;  /* gris de marca */
  --pink:     #FCB1B6;

  --display: 'Moto Verse', 'Anton', 'Arial Narrow', sans-serif;
  --tech:    'Chakra Petch', monospace;
  --body:    'Fredoka', sans-serif;

  --maxw: 1240px;
  --ease: cubic-bezier(.2,.7,.2,1);
}

*{ box-sizing:border-box; margin:0; padding:0; }
html{ -webkit-text-size-adjust:100%; overflow-x:clip; overscroll-behavior-x:none; }

/* Lenis smooth scroll */
html.lenis, html.lenis body{ height:auto; }
.lenis.lenis-smooth{ scroll-behavior:auto !important; }
.lenis.lenis-smooth [data-lenis-prevent]{ overscroll-behavior:contain; }
.lenis.lenis-stopped{ overflow:hidden; }
.lenis.lenis-smooth iframe{ pointer-events:none; }
body{
  font-family:var(--body);
  background:var(--ink);
  color:var(--bone);
  line-height:1.6;
  overflow-x:clip;
  overscroll-behavior-x:none;
  width:100%;
  position:relative;
}

/* Scrollbar rojo de marca */
html{ scrollbar-color:var(--red) rgba(0,0,2,.5); scrollbar-width:thin; }
::-webkit-scrollbar{ width:10px; height:10px; }
::-webkit-scrollbar-track{ background:rgba(0,0,2,.5); }
::-webkit-scrollbar-thumb{ background:var(--red); border-radius:10px; border:2px solid rgba(0,0,2,.6); }
::-webkit-scrollbar-thumb:hover{ background:var(--wine); }

/* Atmospheric red glows */
body::before{
  content:"";
  position:fixed; inset:0; z-index:0; pointer-events:none;
  background:
    radial-gradient(60vw 60vw at 85% -10%, rgba(201,21,23,.16), transparent 60%),
    radial-gradient(50vw 50vw at -10% 30%, rgba(116,22,15,.18), transparent 60%),
    radial-gradient(70vw 60vw at 50% 120%, rgba(157,0,19,.14), transparent 60%);
}
/* Film grain overlay */
.grain{
  position:fixed; inset:0; z-index:1; pointer-events:none; opacity:.05;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
}

.wrap{ width:100%; max-width:var(--maxw); margin:0 auto; padding:0 24px; position:relative; z-index:2; }
section{ position:relative; z-index:2; }
img{ max-width:100%; display:block; }
a{ color:inherit; text-decoration:none; }

/* Typography helpers */
.display{ font-family:var(--display); font-weight:400; line-height:.92; letter-spacing:.01em; text-transform:uppercase; }
.kicker{
  font-family:var(--tech); font-weight:600; text-transform:uppercase;
  letter-spacing:.34em; font-size:.74rem; color:var(--red-hot);
  display:inline-flex; align-items:center; gap:.6rem;
}
.kicker::before{ content:""; width:34px; height:2px; background:var(--red); display:inline-block; }
/* Mini ecualizador del kicker (#ModoJulian) */
.kicker--eq::before{ display:none; }
.eqmini{ display:inline-flex; align-items:center; gap:2px; height:18px; margin-right:9px; }
.eqmini i{ width:2px; height:100%; background:#fff; border-radius:1px; transform-origin:center; transform:scaleY(.22); animation:eqh 1.2s ease-in-out infinite; animation-delay:calc(var(--i) * -0.08s); }
@keyframes eqh{ 0%,100%{ transform:scaleY(.22); } 50%{ transform:scaleY(calc(var(--hv) * 0.01)); } }
@media (prefers-reduced-motion:reduce){ .eqmini i{ animation:none; transform:scaleY(.55); } }
.outline{ color:transparent; -webkit-text-stroke:1.5px var(--bone); text-stroke:1.5px var(--bone); }
.skew{ display:inline-block; transform:skewX(-7deg); }
.hl{ color:var(--red-hot); }

/* Buttons */
.btn{
  font-family:var(--tech); font-weight:700; text-transform:uppercase; letter-spacing:.12em;
  font-size:.82rem; padding:16px 30px; border:none; cursor:pointer;
  display:inline-flex; align-items:center; gap:.6rem; position:relative;
  transition:transform .25s var(--ease), box-shadow .25s var(--ease), background .25s;
  clip-path:polygon(0 0, 100% 0, 100% 72%, 94% 100%, 0 100%);
}
.btn-primary{ background:var(--red); color:#fff; box-shadow:0 10px 30px -8px rgba(201,21,23,.6); }
.btn-primary:hover{ background:var(--red-hot); transform:translateY(-3px); box-shadow:0 16px 40px -8px rgba(255,45,49,.7); }
.btn-ghost{ background:transparent; color:var(--bone); border:1.5px solid rgba(246,241,239,.35); clip-path:none; }
.btn-ghost:hover{ border-color:var(--red-hot); color:var(--red-hot); transform:translateY(-3px); }
.btn-wa{ background:#25D366; color:#06310f; clip-path:none; border-radius:4px; }
.btn-wa:hover{ transform:translateY(-3px); box-shadow:0 14px 34px -8px rgba(37,211,102,.5); }

/* ===================== NAV (cápsula flotante glass) ===================== */
.nav{
  position:fixed; top:0; left:0; right:0; z-index:50;
  display:flex; justify-content:center; padding:16px 16px 0; pointer-events:none;
}
.nav__cap{
  pointer-events:auto; position:relative;
  display:flex; align-items:center; gap:18px;
  width:auto; max-width:calc(100% - 32px); padding:6px 7px 6px 18px;
  background:rgba(0,0,2,.5);
  -webkit-backdrop-filter:blur(16px) saturate(1.3); backdrop-filter:blur(16px) saturate(1.3);
  border:1px solid rgba(201,21,23,.35); border-radius:100px;
  box-shadow:0 10px 40px -14px rgba(0,0,0,.7), inset 0 1px 0 rgba(255,255,255,.06), 0 0 28px -12px rgba(201,21,23,.45);
  transition:width .4s var(--ease), padding .4s var(--ease), background .4s, border-color .4s, box-shadow .4s;
}
.nav.scrolled .nav__cap{
  padding:5px 7px 5px 16px;
  background:rgba(0,0,2,.82); border-color:rgba(201,21,23,.6);
  box-shadow:0 14px 46px -12px rgba(0,0,0,.8), inset 0 1px 0 rgba(255,255,255,.06), 0 0 34px -10px rgba(201,21,23,.6);
}
.nav__logo{ display:flex; align-items:center; flex-shrink:0; }
.nav__logo .wm{
  display:flex; flex-direction:column;
  font-family:var(--display); font-style:italic; text-transform:uppercase; color:#fff;
  font-size:.82rem; letter-spacing:.04em; line-height:.84; white-space:nowrap;
  transition:font-size .4s var(--ease);
}
.nav.scrolled .nav__logo .wm{ font-size:.74rem; }
.nav__logo .ch{ display:inline-block; transition:color .35s var(--ease), transform .35s var(--ease); }
.nav__logo:hover .ch{ color:var(--red); transform:translateY(-2px); transition-delay:calc(var(--i) * 45ms); }
.nav__links{ display:flex; align-items:center; gap:20px; margin:0; }
.nav__links a.lnk{
  font-family:var(--tech); font-weight:600; text-transform:uppercase;
  letter-spacing:.14em; font-size:.68rem; color:var(--bone); opacity:.82;
  position:relative; padding:5px 0; transition:opacity .25s, color .25s;
}
.nav__links a.lnk::after{ content:""; position:absolute; left:0; bottom:0; height:2px; width:0; background:var(--red); transition:width .3s var(--ease); }
.nav__links a.lnk:hover{ opacity:1; color:#fff; }
.nav__links a.lnk:hover::after{ width:100%; }
/* "Julián IA": puntito verde "en línea" para destacar la sección de IA */
.nav__links a.lnk--ia{ display:inline-flex; align-items:center; gap:7px; color:#fff; opacity:1; }
.nav__links a.lnk--ia::before{ content:""; width:6px; height:6px; border-radius:50%; background:#3ad07a; box-shadow:0 0 7px #3ad07a; animation:onlinepulse 2s ease-in-out infinite; flex-shrink:0; }
.nav__cta{ display:flex; align-items:center; gap:12px; flex-shrink:0; }
.lnk--login{
  font-family:var(--tech); font-weight:600; text-transform:uppercase;
  letter-spacing:.14em; font-size:.68rem; color:var(--bone); opacity:.82; transition:opacity .25s, color .25s;
}
.lnk--login:hover{ opacity:1; color:var(--red); }
.btn-pill{
  font-family:var(--tech); font-weight:700; text-transform:uppercase; letter-spacing:.1em;
  font-size:.68rem; color:#fff; background:var(--red); padding:8px 17px; border-radius:100px;
  white-space:nowrap; transition:transform .25s var(--ease), box-shadow .25s, background .25s;
}
.btn-pill:hover{ background:var(--wine); transform:translateY(-2px); box-shadow:0 10px 26px -8px rgba(201,21,23,.7); }
.nav__burger{ display:none; flex-direction:column; gap:5px; background:none; border:none; cursor:pointer; padding:8px; }
.nav__burger span{ width:24px; height:2px; background:var(--bone); transition:.3s var(--ease); transform-origin:center; }
.nav__burger.open span:nth-child(1){ transform:translateY(7px) rotate(45deg); }
.nav__burger.open span:nth-child(2){ opacity:0; }
.nav__burger.open span:nth-child(3){ transform:translateY(-7px) rotate(-45deg); }

/* ===================== BOTTOM NAV (móvil, tipo app) ===================== */
.bnav{ display:none; }
.iasheet{ display:none; }

/* ===================== HERO ===================== */
.hero{ position:relative; min-height:100svh; display:flex; align-items:center; padding:120px 0 78px; overflow:hidden; }
.hero__bg{ position:absolute; inset:0; z-index:0; background:var(--ink); }
.hero__bg::after{
  content:""; position:absolute; inset:0;
  background:radial-gradient(58vw 52vw at 76% 45%, rgba(157,0,19,.24), transparent 62%);
  animation:hfglow 5s ease-in-out infinite;
}
@keyframes hfglow{ 0%,100%{ opacity:.65; } 50%{ opacity:1; } }
/* Campo de puntos rojos, compuesto en la parte derecha (estático) */
.hero__gridfx{
  position:absolute; inset:0; z-index:0; pointer-events:none;
  background-image:radial-gradient(var(--red) 1.8px, transparent 2px);
  background-size:24px 24px;
  -webkit-mask-image:radial-gradient(ellipse 64% 80% at 75% 50%, #000 4%, transparent 74%);
  mask-image:radial-gradient(ellipse 64% 80% at 75% 50%, #000 4%, transparent 74%);
  opacity:.6;
}
/* Brasas / chispas que suben */
.hero__embers{ position:absolute; inset:0; z-index:0; pointer-events:none; overflow:hidden; }
.ember{
  position:absolute; bottom:-12px; width:var(--s); height:var(--s); border-radius:50%;
  background:radial-gradient(circle, var(--red) 0%, rgba(157,0,19,.6) 55%, transparent 72%);
  box-shadow:0 0 7px rgba(201,21,23,.75);
  opacity:0; will-change:transform, opacity;
  animation:emberrise var(--dur) linear infinite; animation-delay:var(--delay);
}
@keyframes emberrise{
  0%{ transform:translate(0,0) scale(.7); opacity:0; }
  12%{ opacity:.95; }
  82%{ opacity:.6; }
  100%{ transform:translate(var(--drift), -100svh) scale(1.15); opacity:0; }
}
@media (prefers-reduced-motion:reduce){
  .hero__bg::after, .hero__gridfx{ animation:none !important; }
  .hero__embers, .plans__embers{ display:none; }
}
.hero .wrap{ width:100%; }
.hero__grid{ display:grid; grid-template-columns:1fr 1.1fr; gap:40px; align-items:center; }
.hero__copy{ position:relative; }
.hero__copy > *:not(.hero__eq){ position:relative; z-index:2; }
/* Ecualizador grande de marca de agua detrás del titular del hero */
.hero__eq{ position:absolute; left:-2%; right:-2%; top:50%; transform:translateY(-50%); height:118%; z-index:1; display:flex; align-items:center; gap:clamp(3px,.7vw,9px); pointer-events:none; opacity:.13;
  -webkit-mask-image:linear-gradient(90deg, #000 0%, #000 72%, transparent); mask-image:linear-gradient(90deg, #000 0%, #000 72%, transparent); }
.hero__eq i{ flex:1 1 0; max-width:30px; height:74%; border-radius:6px; transform-origin:center; will-change:transform;
  background:linear-gradient(180deg, var(--red) 0%, var(--wine-d) 100%);
  transform:scaleY(calc(var(--h) * .005)); animation:closingeq 1.9s ease-in-out infinite; animation-delay:calc(var(--i) * -.12s); }
@media (max-width:900px){ .hero__eq{ left:-4%; right:-4%; opacity:.14; -webkit-mask-image:linear-gradient(90deg, transparent, #000 12%, #000 88%, transparent); mask-image:linear-gradient(90deg, transparent, #000 12%, #000 88%, transparent); } }
@media (max-width:640px){ .hero__eq{ gap:4px; } .hero__eq i:nth-child(even){ display:none; } }
@media (prefers-reduced-motion:reduce){ .hero__eq i{ animation:none; transform:scaleY(calc(var(--h) * .008)); } }
.hero h1{ font-size:clamp(2.4rem, 4.6vw, 4.4rem); margin:16px 0 20px; }
.hero h1 .ln{ display:block; }
.hero p.lead{ font-size:clamp(1.05rem,1.6vw,1.3rem); color:#e9dedb; max-width:33ch; font-weight:300; }
.hero__actions{ display:flex; flex-wrap:wrap; gap:16px; margin-top:34px; }
.hero__stats{ display:flex; gap:30px; margin-top:46px; flex-wrap:wrap; }
.hero__stats .st b{ font-family:var(--display); font-size:2.6rem; color:#fff; display:block; line-height:1; }
.hero__stats .st span{ font-family:var(--tech); font-size:.72rem; letter-spacing:.18em; text-transform:uppercase; color:var(--gray); }
.hero__side{ justify-self:end; }
.hero__badge{
  font-family:var(--display); font-size:clamp(4rem,12vw,11rem); line-height:.8;
  color:transparent; -webkit-text-stroke:1.5px rgba(246,241,239,.16);
  transform:rotate(90deg); transform-origin:center; white-space:nowrap;
  letter-spacing:.05em;
}

/* ===================== HERO LOGO REVEAL (trazado) ===================== */
.hero__anim{ display:flex; align-items:center; justify-content:flex-end; }
.hf-logo{ width:100%; max-width:780px; height:auto; color:#fff; overflow:visible; --hfspeed:1.8; transform:translateX(42px); }
.hf-logo .piece path{ fill:#fff; }   /* visible por defecto (fallback si el JS no corre) */
.hf-logo.play .piece path{
  stroke:var(--red); stroke-width:6;
  animation:hfdraw calc(1.4s * var(--hfspeed)) ease forwards;
  animation-delay:calc(var(--d) * var(--hfspeed));
}
@keyframes hfdraw{
  0%{ stroke-dashoffset:var(--len); fill-opacity:0; }
  55%{ fill-opacity:0; }
  100%{ stroke-dashoffset:0; fill-opacity:1; stroke-width:0; }
}
.hf-logo.play .dog{
  transform-box:fill-box; transform-origin:center;
  animation:hfdogslam calc(1.25s * var(--hfspeed)) cubic-bezier(.2,.85,.25,1.15) both;
  animation-delay:calc(1.5s * var(--hfspeed));
}
@keyframes hfdogslam{
  0%{ opacity:0; transform:scale(1.4); filter:blur(8px); }
  55%{ opacity:1; }
  80%{ transform:scale(.97); }
  100%{ opacity:1; transform:scale(1); filter:blur(0); }
}
@media (prefers-reduced-motion:reduce){
  .hf-logo .piece path{ fill-opacity:1 !important; animation:none !important; stroke-width:0; }
  .hf-logo .dog{ opacity:1 !important; animation:none !important; }
}

/* ===================== DOTS (motivo de marca, titilante) ===================== */
.dots{ display:grid; gap:13px; width:max-content; }
.dots .dot{
  width:5px; height:5px; border-radius:50%; background:var(--bone);
  opacity:.16; animation:dottwinkle 2.8s ease-in-out infinite; animation-delay:var(--dd);
}
@keyframes dottwinkle{ 0%,100%{ opacity:.12; transform:scale(.7); } 50%{ opacity:.95; transform:scale(1); } }
.dots--abs{ position:absolute; z-index:1; pointer-events:none; }
.dots--tr{ top:46px; right:46px; }
.dots--bl{ bottom:46px; left:46px; }
.dots--tl{ top:46px; left:46px; }
.dots--red .dot{ background:var(--red); }
@media (prefers-reduced-motion:reduce){ .dots .dot{ animation:none; opacity:.4; } }
@media (max-width:640px){ .dots--abs{ display:none; } }

/* ===================== ECUALIZADOR VERTICAL (marca de agua) ===================== */
.wavewm{
  position:absolute; z-index:0; pointer-events:none;
  width:120px; top:50%; transform:translateY(-50%);
  display:flex; flex-direction:column; align-items:center; gap:7px;
  opacity:.09; color:var(--bone);
}
.wavewm span{
  display:block; height:3px; width:14%; min-width:6px; background:currentColor; border-radius:3px;
  animation:eqv 1.9s ease-in-out infinite; animation-delay:calc(var(--i) * -0.09s);
}
@keyframes eqv{ 0%,100%{ width:14%; } 50%{ width:calc(var(--hv) * 1%); } }
.wavewm--l{ left:24px; }
.wavewm--r{ right:24px; }
@media (prefers-reduced-motion:reduce){ .wavewm span{ animation:none; width:50%; } }
@media (max-width:980px){ .wavewm{ display:none; } }

/* ===================== MARQUEE ===================== */
.marquee{ border-top:1px solid rgba(201,21,23,.25); border-bottom:1px solid rgba(201,21,23,.25); background:var(--ink-2); padding:18px 0; overflow:hidden; }
.marquee--hero{ position:absolute; bottom:0; left:0; right:0; z-index:3; background:rgba(0,0,2,.4); -webkit-backdrop-filter:blur(4px); backdrop-filter:blur(4px); padding:8px 0; }
.marquee--hero .marquee__track span{ font-size:1rem; padding:0 16px; }
.marquee__track{ display:flex; gap:0; white-space:nowrap; width:max-content; animation:scroll 26s linear infinite; }
.marquee__track span{ font-family:var(--display); text-transform:uppercase; font-size:1.8rem; color:transparent; -webkit-text-stroke:1px rgba(246,241,239,.55); padding:0 26px; }
.marquee__track span.solid{ color:var(--bone); -webkit-text-stroke:0; }
.marquee__track span.fill{ color:var(--red); -webkit-text-stroke:0; }
@keyframes scroll{ to{ transform:translateX(-50%); } }

/* ===================== SECTION SHELL ===================== */
.sec{ padding:84px 0; }
.method--hstack{ padding-top:0; padding-bottom:0; }
.sec__head{ max-width:760px; margin-bottom:56px; }
.sec__head h2{ font-size:clamp(2.2rem,5.2vw,4.2rem); margin-top:18px; }
.sec__head p{ color:var(--gray); font-size:1.08rem; margin-top:18px; font-weight:300; max-width:54ch; }

/* ===================== JULIÁN (foto fundida en el fondo, estilo Federico) ===================== */
.about-jc{ position:relative; display:grid; grid-template-columns:1.05fr .95fr; min-height:100svh; overflow:hidden; align-items:center; background:var(--ink); }
.about-jc::before{ content:""; position:absolute; inset:0; z-index:0; pointer-events:none; background-image:radial-gradient(var(--red) 1.8px, transparent 2px); background-size:24px 24px; -webkit-mask-image:radial-gradient(ellipse 64% 80% at 26% 50%, #000 4%, transparent 74%); mask-image:radial-gradient(ellipse 64% 80% at 26% 50%, #000 4%, transparent 74%); opacity:.42; }
.about-jc__text{ position:relative; z-index:2; padding:110px 56px 110px max(80px, 6vw); max-width:700px; }
.about-jc__name{ font-size:clamp(3rem, 6vw, 6rem); line-height:.9; margin:14px 0 28px; color:#fff; }
.about-jc__quote{
  border-left:2px solid var(--red); padding-left:22px; margin:0 0 26px;
  color:#e2d8d5; font-family:var(--body); font-weight:300; font-style:italic;
  font-size:clamp(1.05rem,1.5vw,1.35rem); line-height:1.7;
}
.about-jc__quote .hl{ color:var(--red); font-style:normal; }
.about-jc__bio{ color:var(--gray); font-weight:300; font-size:1.02rem; line-height:1.8; margin-bottom:20px; }
.about-jc__sign{ font-family:var(--tech); letter-spacing:.18em; text-transform:uppercase; font-size:.72rem; color:var(--bone); }
.about-jc__media{ position:relative; height:100%; min-height:100svh; }
.about-jc__media::before{ content:""; position:absolute; z-index:0; right:5%; bottom:4%; width:76%; height:76%; background:radial-gradient(closest-side, rgba(157,0,19,.45), transparent 72%); pointer-events:none; }
.about-jc__photo{ position:absolute; right:0; bottom:0; z-index:1; width:100%; height:97%; object-fit:contain; object-position:bottom right; filter:contrast(1.04) saturate(1.06);
  -webkit-mask-image:linear-gradient(to right, transparent 0, #000 16%); mask-image:linear-gradient(to right, transparent 0, #000 16%); }
.about-jc__fade{ position:absolute; inset:0; z-index:2; pointer-events:none; background:linear-gradient(0deg, var(--ink) 0%, var(--ink) 7%, rgba(0,0,2,.55) 18%, transparent 34%); }
@media (max-width:900px){
  .about-jc{ display:block; min-height:0; padding-bottom:20px; }
  .about-jc__text{ position:relative; z-index:2; padding:0 24px 0; max-width:none; }
  .about-jc__media{ position:relative; height:auto; min-height:0; margin-top:4px; }
  .about-jc__media::before{ display:none; }
  .about-jc__photo{ position:relative; right:auto; bottom:auto; width:100%; height:auto; object-fit:contain; object-position:center; -webkit-mask-image:none; mask-image:none; }
  .about-jc__fade{ background:linear-gradient(0deg, var(--ink) 0%, transparent 22%); }
  .about-jc__name{ font-size:clamp(2.6rem,12vw,3.6rem); }
}

/* ===================== PROBLEM ===================== */
.problem{ background:linear-gradient(180deg, transparent 0%, rgba(157,0,19,.06) 16%, rgba(157,0,19,.06) 84%, transparent 100%); position:relative; overflow:hidden; }
.problem::before{ content:""; position:absolute; inset:0; z-index:0; pointer-events:none; background-image:radial-gradient(var(--red) 1.6px, transparent 1.8px); background-size:28px 28px; opacity:.3; -webkit-mask-image:radial-gradient(ellipse 58% 85% at 80% 50%, #000 4%, transparent 76%); mask-image:radial-gradient(ellipse 58% 85% at 80% 50%, #000 4%, transparent 76%); }
/* Ecualizador horizontal (marca de agua) a la derecha del título */
.eqwave{ display:flex; align-items:center; pointer-events:none; }
.eqwave i{ height:100%; background:var(--bone); border-radius:3px; transform-origin:center; transform:scaleY(.2); animation:eqh 1.9s ease-in-out infinite; animation-delay:calc(var(--i) * -0.07s); }
/* desktop: a la derecha del título */
.eqwave--d{ position:absolute; top:150px; right:7%; gap:6px; width:min(40%,440px); height:110px; opacity:.13; z-index:1; }
.eqwave--d i{ flex:1; max-width:6px; }
/* móvil: debajo de las cards (oculto en desktop) */
.eqwave--m{ display:none; }

.prob__list{ display:grid; grid-template-columns:repeat(4,1fr); gap:18px; position:relative; z-index:2; }
.prob__row{ position:relative; overflow:hidden; min-height:300px; display:flex; flex-direction:column; padding:34px 28px; border:1px solid rgba(255,255,255,.08); background:rgba(255,255,255,.015); transition:transform .35s var(--ease), border-color .35s; }
/* corner brackets editoriales (rojos) */
.prob__row::before{ content:""; position:absolute; top:14px; left:14px; width:20px; height:20px; border-top:2px solid var(--red); border-left:2px solid var(--red); opacity:.6; transition:width .35s var(--ease), height .35s var(--ease), opacity .35s; }
.prob__row::after{ content:""; position:absolute; bottom:14px; right:14px; width:20px; height:20px; border-bottom:2px solid var(--red); border-right:2px solid var(--red); opacity:.6; transition:width .35s var(--ease), height .35s var(--ease), opacity .35s; }
.prob__row:hover{ transform:translateY(-6px); border-color:rgba(201,21,23,.4); }
.prob__row:hover::before, .prob__row:hover::after{ width:32px; height:32px; opacity:1; }
.prob__num{ font-family:var(--display); font-size:4rem; line-height:1; color:transparent; -webkit-text-stroke:1.5px rgba(201,21,23,.2); margin-bottom:auto; transition:color .35s; }
.prob__row:hover .prob__num{ color:rgba(201,21,23,.85); }
/* estado "encendido" automático (desktop) */
.prob__row.is-active{ border-color:rgba(201,21,23,.4); }
.prob__row.is-active::before, .prob__row.is-active::after{ width:32px; height:32px; opacity:1; }
.prob__row.is-active .prob__num{ color:rgba(201,21,23,.85); }
.prob__body h4{ font-family:var(--tech); text-transform:uppercase; letter-spacing:.07em; font-size:1.05rem; margin:0 0 10px; }
.prob__body p{ color:var(--gray); font-weight:300; line-height:1.7; font-size:.93rem; }
@media (min-width:761px){ .prob__row--clone{ display:none; } }
@media (max-width:1040px){ .prob__list{ grid-template-columns:repeat(2,1fr); } }
@media (max-width:760px){
  .eqwave--d{ display:none; }
  .eqwave--m{ display:flex; justify-content:center; align-items:center; gap:5px; height:52px; margin-top:30px; opacity:.5; }
  .eqwave--m i{ width:4px; }
  .prob__list{ display:flex; grid-template-columns:none; flex-direction:row; gap:14px; overflow-x:auto; scroll-snap-type:x mandatory; -webkit-overflow-scrolling:touch; padding-bottom:14px; scrollbar-width:none; }
  .prob__list::-webkit-scrollbar{ display:none; }
  .prob__row{ flex:0 0 78%; scroll-snap-align:center; min-height:0; border-radius:16px; border-color:rgba(201,21,23,.25); }
  .prob__num{ margin-bottom:14px; font-size:3.4rem; color:rgba(201,21,23,.85); }
}

/* ===================== METHOD (apilado horizontal: cards entran desde la derecha) ===================== */
.method{ position:relative; }
.method__pin{ position:relative; }
.method__pin::before{ content:""; position:absolute; inset:0; z-index:0; pointer-events:none; background-image:radial-gradient(var(--red) 1.6px, transparent 1.8px); background-size:28px 28px; opacity:.22; -webkit-mask-image:radial-gradient(ellipse 130% 130% at 50% 50%, #000 72%, transparent 100%); mask-image:radial-gradient(ellipse 130% 130% at 50% 50%, #000 72%, transparent 100%); }
.method__head{ position:relative; z-index:2; max-width:760px; padding:0 24px; margin:0 0 28px; }
.method__counter{ display:none; }
.mcard.is-active .mcard__ghost{ color:rgba(201,21,23,.5); -webkit-text-stroke-color:rgba(201,21,23,.5); transition:color .4s var(--ease), -webkit-text-stroke-color .4s var(--ease); }
/* base: carrusel deslizable (móvil + fallback) */
.method__stage{ position:relative; z-index:2; display:flex; gap:14px; overflow-x:auto; scroll-snap-type:x mandatory; -webkit-overflow-scrolling:touch; padding:0 0 14px; scrollbar-width:none; }
.method__stage::-webkit-scrollbar{ display:none; }
.mcard{
  flex:0 0 84%; scroll-snap-align:center; min-height:50vh;
  display:flex; flex-direction:column; justify-content:center;
  padding:38px 30px; position:relative; overflow:hidden;
  border:1px solid rgba(201,21,23,.32); border-radius:20px;
  background:linear-gradient(150deg, #190709 0%, #000002 72%);
  box-shadow:0 26px 60px -34px rgba(201,21,23,.5);
}
.mcard__tag{ font-family:var(--tech); text-transform:uppercase; letter-spacing:.3em; font-size:.72rem; color:var(--red); margin-bottom:16px; position:relative; z-index:1; }
.mcard__title{ font-family:var(--display); text-transform:uppercase; font-size:clamp(1.8rem,2.8vw,2.6rem); line-height:.98; color:#fff; margin:0 0 16px; max-width:13ch; position:relative; z-index:1; }
.mcard__desc{ color:var(--gray); font-weight:300; line-height:1.7; font-size:clamp(1rem,1.3vw,1.18rem); max-width:42ch; position:relative; z-index:1; }
.mcard__ghost{ position:absolute; right:22px; bottom:-30px; font-family:var(--display); font-size:12rem; line-height:.8; color:transparent; -webkit-text-stroke:2px rgba(201,21,23,.13); pointer-events:none; }
/* sección fija + cards que entran desde la derecha y se apilan (JS, todos los anchos) */
.method--hstack .method__pin{ position:sticky; top:0; height:100svh; overflow:hidden; }
.method--hstack .method__head{ margin:0; padding:0; max-width:none; }
.method--hstack .method__stage{ position:relative; display:block; overflow:hidden; padding:0; scroll-snap-type:none; }
.method--hstack .mcard{ position:absolute; inset:0; flex:none; width:100%; height:100%; min-height:0; will-change:transform; }
@media (min-width:901px){
  .method--hstack .method__pin{ display:grid; grid-template-columns:.82fr 1.18fr; align-items:center; gap:50px; padding:0 7vw; }
  .method--hstack .method__pin::before{ -webkit-mask-image:radial-gradient(ellipse 130% 130% at 50% 50%, #000 72%, transparent 100%); mask-image:radial-gradient(ellipse 130% 130% at 50% 50%, #000 72%, transparent 100%); }
  .method--hstack .method__stage{ height:66vh; }
  .method--hstack .mcard__ghost{ font-size:14rem; right:30px; bottom:-34px; }
}
@media (max-width:900px){
  .method--hstack .method__pin{ display:flex; flex-direction:column; justify-content:center; gap:22px; padding:0 24px; }
  .method--hstack .method__counter{ display:none; }
  .method--hstack .method__stage{ height:52svh; }
  .mcard{ padding:34px 24px; }
  .mcard__title{ font-size:clamp(1.45rem,6.2vw,2.1rem); max-width:none; }
  .mcard__desc{ font-size:1rem; }
  .mcard__ghost{ font-size:8rem; right:8px; bottom:-16px; }
}

/* ===================== PLANS ===================== */
/* tinte vino que se DESVANECE arriba y abajo (sin corte/línea entre secciones) + brasas que suben */
.plans{ background:linear-gradient(180deg, transparent 0%, rgba(157,0,19,.06) 14%, rgba(157,0,19,.06) 86%, transparent 100%); position:relative; overflow:hidden; }
.plans__embers{ position:absolute; inset:0; z-index:0; pointer-events:none; overflow:hidden; }
/* Header centrado a ancho completo (evita que el título largo se desborde a la derecha) */
.sec__head--center{ max-width:920px; margin-left:auto; margin-right:auto; text-align:center; }
.sec__head--center .kicker{ justify-content:center; }
.sec__head--center p{ margin-left:auto; margin-right:auto; }
/* "TRANSFORMACIÓN" es una palabra larga en fuente display ancha: la achicamos un punto
   para que quepa y centre perfecto en desktop, y permitimos wrap para que NO se corte en móvil */
.plans .sec__head h2{ font-size:clamp(2rem,4.6vw,3.6rem); overflow-wrap:break-word; }
/* minmax(0,1fr) permite que las columnas se encojan por debajo del min-content del precio
   (fuente display muy ancha) — sin esto la grilla se desborda a la derecha. */
.plans__grid{ display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:24px; align-items:stretch; }
.plan{ min-width:0; background:var(--ink); border:1px solid rgba(246,241,239,.1); padding:38px 30px; display:flex; flex-direction:column; transition:transform .3s var(--ease), border-color .3s; position:relative; }
.plan:hover{ transform:translateY(-8px); border-color:rgba(201,21,23,.5); }
.plan__name{ font-family:var(--display); font-size:2rem; letter-spacing:.02em; }
.plan__tagline{ color:var(--gray); font-size:.92rem; font-weight:300; margin:6px 0 22px; min-height:2.6em; }
.plan__price{ font-family:var(--display); font-size:clamp(1.7rem,2.4vw,2.2rem); line-height:1; color:#fff; white-space:nowrap; }
.plan__price small{ font-family:var(--tech); font-size:.8rem; color:var(--gray); letter-spacing:.06em; display:block; margin-top:8px; text-transform:none; }
.plan__daily{ font-family:var(--tech); font-size:.78rem; color:var(--red-hot); letter-spacing:.06em; margin:14px 0 24px; }
.plan ul{ list-style:none; display:flex; flex-direction:column; gap:12px; margin-bottom:30px; flex:1; }
.plan ul li{ font-size:.92rem; color:#d9cfcc; font-weight:300; display:flex; gap:10px; align-items:flex-start; }
.plan ul li::before{ content:"›"; color:var(--red-hot); font-weight:700; }
.plan .btn{ width:100%; justify-content:center; }
.plan--featured{ border-color:var(--red); background:linear-gradient(180deg, rgba(157,0,19,.16), var(--ink) 40%); transform:scale(1.03); box-shadow:0 30px 80px -30px rgba(201,21,23,.5); }
.plan--featured:hover{ transform:scale(1.03) translateY(-8px); }
.plan__flag{ position:absolute; top:-1px; right:-1px; background:var(--red); color:#fff; font-family:var(--tech); font-weight:700; text-transform:uppercase; letter-spacing:.16em; font-size:.66rem; padding:8px 16px; }

/* ===================== JULIÁN VIRTUAL (chat IA, estilo abierto tipo Claude) ===================== */
.hl-w{ color:#fff; }
.coach{ position:relative; overflow:hidden; }
/* glow centrado (que NO toque el borde superior, para no marcar línea con Método) */
.coach::before{ content:""; position:absolute; inset:0; z-index:0; pointer-events:none; background:radial-gradient(72% 52% at 50% 46%, rgba(201,21,23,.14), transparent 72%); }
/* grilla de puntos rojos de fondo (como las demás secciones) */
.coach::after{ content:""; position:absolute; inset:0; z-index:0; pointer-events:none; background-image:radial-gradient(var(--red) 1.6px, transparent 1.8px); background-size:28px 28px; opacity:.16; -webkit-mask-image:radial-gradient(ellipse 120% 120% at 50% 50%, #000 48%, transparent 100%); mask-image:radial-gradient(ellipse 120% 120% at 50% 50%, #000 48%, transparent 100%); }
.chat{ position:relative; z-index:2; max-width:720px; margin:0 auto; }

/* canvas de conversación: scroll propio + altura fija -> la página NO crece (sin scroll infinito) */
.chat__thread{ display:none; }
.chat--active .chat__thread{
  display:flex; flex-direction:column; gap:18px;
  max-height:clamp(300px, 46vh, 520px); overflow-y:auto;
  padding:6px 4px 22px; margin-bottom:18px;
  -webkit-mask-image:linear-gradient(180deg, transparent 0, #000 16px); mask-image:linear-gradient(180deg, transparent 0, #000 16px);
  scrollbar-width:thin; scrollbar-color:var(--red) transparent; overscroll-behavior:contain;
}
.chat__thread::-webkit-scrollbar{ width:7px; }
.chat__thread::-webkit-scrollbar-thumb{ background:var(--red); border-radius:10px; }

.msg{ display:flex; max-width:90%; animation:msgin .35s var(--ease); }
@keyframes msgin{ from{ opacity:0; transform:translateY(8px); } to{ opacity:1; transform:none; } }
.msg--user{ align-self:flex-end; }
.msg--bot{ align-self:flex-start; gap:11px; align-items:flex-start; max-width:96%; }
.msg__ava{ width:46px; height:46px; border-radius:50%; overflow:hidden; flex-shrink:0; border:1.5px solid var(--red); background:var(--ink); margin-top:2px; box-shadow:0 0 0 3px rgba(201,21,23,.12); }
.msg__ava img, .msg__ava video{ width:100%; height:100%; object-fit:cover; object-position:top center; display:block; }
.msg__bubble{ font-family:var(--body); font-size:1rem; line-height:1.65; white-space:pre-wrap; overflow-wrap:anywhere; }
/* usuario = burbuja sutil; Julián = texto abierto (sin caja), tipo Claude */
.msg--user .msg__bubble{ background:linear-gradient(180deg, var(--red), var(--wine-d)); color:#fff; padding:12px 16px; border-radius:16px; border-bottom-right-radius:5px; }
.msg--bot .msg__bubble{ color:#ece6e5; padding-top:3px; }

/* blur reveal palabra por palabra (estilo Federico) */
.rwword{ display:inline-block; animation:rwword .6s var(--ease) both; }
@keyframes rwword{ from{ opacity:0; filter:blur(8px); transform:translateY(4px); } to{ opacity:1; filter:blur(0); transform:none; } }
@media (prefers-reduced-motion:reduce){ .rwword{ animation:none; } }

.typing{ display:inline-flex; gap:5px; align-items:center; padding:6px 0; }
.typing i{ width:7px; height:7px; border-radius:50%; background:var(--red-hot); animation:typingdot 1.2s ease-in-out infinite; }
.typing i:nth-child(2){ animation-delay:.15s; } .typing i:nth-child(3){ animation-delay:.3s; }
@keyframes typingdot{ 0%,60%,100%{ transform:translateY(0); opacity:.35; } 30%{ transform:translateY(-5px); opacity:1; } }

/* composer abierto tipo Claude */
.composer{
  display:flex; align-items:flex-end; gap:10px;
  background:rgba(255,255,255,.04); border:1px solid rgba(246,241,239,.16);
  border-radius:22px; padding:8px 8px 8px 20px; transition:border-color .25s, box-shadow .25s;
}
.composer:focus-within{ border-color:rgba(201,21,23,.6); box-shadow:0 0 0 4px rgba(201,21,23,.12); }
.composer textarea{
  flex:1; min-width:0; background:transparent; border:none; outline:none; resize:none;
  color:var(--bone); font-family:var(--body); font-size:1.05rem; line-height:1.5;
  max-height:160px; padding:11px 0; overflow-y:auto; scrollbar-width:none;
}
.composer textarea::-webkit-scrollbar{ display:none; }
.composer textarea::placeholder{ color:var(--gray); }
.composer__send{ flex-shrink:0; width:44px; height:44px; border:none; border-radius:50%; background:var(--red); color:#fff; cursor:pointer; display:flex; align-items:center; justify-content:center; transition:background .25s, transform .15s, opacity .2s; }
.composer__send:hover{ background:var(--wine); } .composer__send:active{ transform:scale(.9); }
.composer__send:disabled{ opacity:.4; cursor:not-allowed; }

.chat__chips{ display:flex; flex-wrap:wrap; justify-content:center; gap:9px; margin-top:18px; }
.chat--active .chat__chips{ display:none; }
.chip{ font-family:var(--tech); font-size:.78rem; letter-spacing:.02em; color:#e9dedb; background:rgba(201,21,23,.08); border:1px solid rgba(201,21,23,.32); border-radius:999px; padding:9px 16px; cursor:pointer; transition:background .25s, border-color .25s, transform .15s; }
.chip:hover{ background:rgba(201,21,23,.2); border-color:var(--red); }
.chip:active{ transform:scale(.96); }

.chat__legal{ text-align:center; font-size:.74rem; color:var(--gray); font-weight:300; margin-top:18px; }
.chat__legal a{ color:var(--red-hot); text-decoration:underline; }

@media (max-width:560px){
  .chat--active .chat__thread{ max-height:56vh; }
  .chat__chips{ flex-wrap:nowrap; overflow-x:auto; scrollbar-width:none; justify-content:flex-start; }
  .chat__chips::-webkit-scrollbar{ display:none; }
  .chip{ flex:0 0 auto; }
  .msg{ max-width:94%; }
  /* barra más alta para que el placeholder (que puede ser de 2 líneas) no se corte */
  .composer{ align-items:flex-end; padding:10px 10px 10px 18px; }
  .composer textarea{ font-size:1rem; min-height:58px; padding-top:8px; padding-bottom:8px; }
}

/* ===================== CIERRE (texto de despedida, reveal lento) ===================== */
.closing{ position:relative; overflow:hidden; padding:140px 0; text-align:center; }
.closing::before{ content:""; position:absolute; inset:0; z-index:0; pointer-events:none; background:radial-gradient(60% 60% at 50% 50%, rgba(201,21,23,.14), transparent 70%); }
.closing__text{ position:relative; z-index:2; font-family:var(--display); font-weight:400; line-height:1.04; letter-spacing:.01em; text-transform:uppercase; font-size:clamp(2.3rem,6vw,5rem); max-width:18ch; margin:0 auto; color:#fff; }
.closing__text .hl{ color:var(--red); }
/* Ecualizador grande de marca de agua detrás del texto */
.closing__eq{ position:absolute; inset:0; z-index:1; display:flex; align-items:center; justify-content:center; gap:clamp(3px,.8vw,11px); padding:0 4vw; pointer-events:none; opacity:.18;
  -webkit-mask-image:linear-gradient(90deg, transparent, #000 10%, #000 90%, transparent); mask-image:linear-gradient(90deg, transparent, #000 10%, #000 90%, transparent); }
.closing__eq i{ flex:1 1 0; max-width:38px; height:78%; border-radius:7px; transform-origin:center; will-change:transform;
  background:linear-gradient(180deg, var(--red) 0%, var(--wine-d) 100%);
  transform:scaleY(calc(var(--h) * .006)); animation:closingeq 1.9s ease-in-out infinite; animation-delay:calc(var(--i) * -.13s); }
@keyframes closingeq{ 0%,100%{ transform:scaleY(calc(var(--h) * .004)); } 50%{ transform:scaleY(calc(var(--h) * .011)); } }
@media (max-width:640px){ .closing__eq{ opacity:.15; gap:4px; } .closing__eq i:nth-child(even){ display:none; } }
@media (prefers-reduced-motion:reduce){ .closing__eq i{ animation:none; transform:scaleY(calc(var(--h) * .008)); } }
/* reveal MÁS lento y elegante para la despedida */
.closing__text.rw .w, .closing__text.rw .wb{ transition-duration:1.1s, 2.8s, 1.6s; transition-delay:calc(var(--wi) * 0.26s); }

/* ===================== MODAL "Déjanos tus datos" ===================== */
body.modal-open{ overflow:hidden; }
.modal{ position:fixed; inset:0; z-index:200; display:none; align-items:center; justify-content:center; padding:24px; }
.modal.open{ display:flex; }
.modal__backdrop{ position:absolute; inset:0; background:rgba(0,0,2,.72); -webkit-backdrop-filter:blur(6px); backdrop-filter:blur(6px); animation:modalfade .25s var(--ease); }
@keyframes modalfade{ from{ opacity:0 } to{ opacity:1 } }
.modal__panel{ position:relative; z-index:1; width:100%; max-width:480px; max-height:90vh; overflow-y:auto; background:linear-gradient(180deg, rgba(25,7,9,.98), rgba(0,0,2,.99)); border:1px solid rgba(201,21,23,.4); border-radius:20px; padding:34px 30px; box-shadow:0 50px 110px -40px rgba(201,21,23,.6); animation:modalpop .3s var(--ease); }
@keyframes modalpop{ from{ opacity:0; transform:translateY(18px) scale(.98) } to{ opacity:1; transform:none } }
.modal__close{ position:absolute; top:12px; right:16px; background:none; border:none; color:var(--gray); font-size:1.9rem; line-height:1; cursor:pointer; transition:color .2s; }
.modal__close:hover{ color:var(--red-hot); }
.modal__panel h3{ font-family:var(--display); font-size:1.7rem; color:#fff; }
.modal__sub{ color:var(--gray); font-size:.9rem; font-weight:300; margin:6px 0 22px; }
/* el form reusa .form pero SIN su caja (la caja es el panel) */
.modal__panel .form{ background:none; border:none; padding:0; -webkit-backdrop-filter:none; backdrop-filter:none; }

/* ===================== WhatsApp flotante (oculto en móvil) ===================== */
.wafloat{ position:fixed; right:24px; bottom:24px; z-index:150; width:60px; height:60px; border-radius:50%; background:#25d366; color:#fff; display:flex; align-items:center; justify-content:center; box-shadow:0 12px 30px -8px rgba(37,211,102,.6); transition:transform .2s var(--ease), box-shadow .2s; animation:wapulse 2.6s ease-in-out infinite; }
.wafloat:hover{ transform:scale(1.08); }
@keyframes wapulse{ 0%,100%{ box-shadow:0 12px 30px -8px rgba(37,211,102,.55) } 50%{ box-shadow:0 12px 42px -6px rgba(37,211,102,.9) } }
@media (max-width:900px){ .wafloat{ display:none; } }

/* ===================== CTA / LEAD FORM ===================== */
.cta{ position:relative; padding:120px 0; overflow:hidden; }
.cta__bg{ position:absolute; inset:0; z-index:0; background:url("../img/brand/cta.jpg") center/cover no-repeat; filter:grayscale(.4); }
.cta__bg::after{ content:""; position:absolute; inset:0; background:linear-gradient(90deg, var(--ink) 20%, rgba(116,22,15,.6) 100%); }
.cta__grid{ display:grid; grid-template-columns:1fr 1fr; gap:60px; align-items:center; }
.cta h2{ font-size:clamp(2.4rem,5.5vw,4.4rem); }
.cta p.sub{ color:#e9dedb; font-weight:300; margin-top:18px; font-size:1.1rem; max-width:42ch; }
.cta__wa{ margin-top:28px; display:flex; align-items:center; gap:14px; flex-wrap:wrap; }
.cta__wa span{ font-family:var(--tech); font-size:.8rem; color:var(--gray); letter-spacing:.08em; text-transform:uppercase; }

.form{ background:rgba(0,0,2,.7); backdrop-filter:blur(8px); border:1px solid rgba(201,21,23,.3); padding:38px 34px; }
.form h3{ font-family:var(--display); font-size:1.7rem; margin-bottom:6px; }
.form > p{ color:var(--gray); font-size:.9rem; font-weight:300; margin-bottom:24px; }
.field{ margin-bottom:18px; }
.field label{ font-family:var(--tech); text-transform:uppercase; letter-spacing:.12em; font-size:.7rem; color:var(--gray); display:block; margin-bottom:8px; }
.field input, .field select{
  width:100%; background:var(--ink-2); border:1px solid rgba(246,241,239,.14); color:var(--bone);
  padding:14px 16px; font-family:var(--body); font-size:1rem; transition:border-color .25s;
}
.field input:focus, .field select:focus{ outline:none; border-color:var(--red-hot); }
.field .err{ color:var(--red-hot); font-size:.8rem; margin-top:6px; }
.form .btn{ width:100%; justify-content:center; margin-top:8px; }
.form__legal{ font-size:.74rem; color:var(--gray); margin-top:16px; font-weight:300; }
.alert-ok{ background:rgba(37,211,102,.12); border:1px solid rgba(37,211,102,.4); color:#9af2bd; padding:16px 18px; margin-bottom:22px; font-size:.92rem; }

/* ===================== FOOTER ===================== */
.footer{ background:var(--ink); border-top:1px solid rgba(201,21,23,.2); padding:70px 0 36px; }
.footer__grid{ display:flex; justify-content:space-between; gap:40px; flex-wrap:wrap; align-items:flex-start; }
.footer img{ height:54px; margin-bottom:18px; }
.footer__logo{ height:auto; width:200px; max-width:70%; margin-bottom:20px; }
.footer p.tag{ color:var(--gray); font-weight:300; max-width:30ch; font-size:.95rem; }
.footer h5{ font-family:var(--tech); text-transform:uppercase; letter-spacing:.16em; font-size:.78rem; color:var(--bone); margin-bottom:16px; }
.footer a.fl{ display:block; color:var(--gray); font-weight:300; font-size:.95rem; margin-bottom:10px; transition:color .25s; }
.footer a.fl:hover{ color:var(--red-hot); }
.footer__bottom{ margin-top:50px; padding-top:24px; border-top:1px solid rgba(246,241,239,.08); display:flex; justify-content:space-between; gap:16px; flex-wrap:wrap; color:var(--gray); font-size:.8rem; font-family:var(--tech); letter-spacing:.06em; }

/* ===================== REVEAL ===================== */
/* Blur reveal de bloques (cards, imágenes, etc.) */
.reveal{ opacity:0; transform:translateY(20px); filter:blur(10px); transition:opacity .8s var(--ease), transform 1s var(--ease), filter 1.1s var(--ease); }
.reveal.in{ opacity:1; transform:none; filter:blur(0); }

/* Blur reveal palabra por palabra (estilo Linear) */
.rw .w, .rw .wb{
  opacity:0; filter:blur(12px); transform:translateY(10px);
  transition:opacity .6s var(--ease), filter 1.2s var(--ease), transform .9s var(--ease);
  transition-delay:calc(var(--wi) * 0.07s);
}
.rw .w{ display:inline-block; }
.rw.in .w, .rw.in .wb{ opacity:1; filter:blur(0); transform:none; }
/* Títulos un pelín más lentos (pocas palabras -> más tiempo y más separación) */
.hero h1.rw > .wb,
.sec__head h2.rw .w, .sec__head h2.rw .wb,
.about-jc__name.rw .w, .about-jc__name.rw .wb{
  transition-duration:.8s, 1.8s, 1s;
  transition-delay:calc(var(--wi) * 0.14s);
}
@media (prefers-reduced-motion:reduce){ .rw .w, .rw .wb{ opacity:1; filter:none; transform:none; } }
.reveal.d1{ transition-delay:.1s; } .reveal.d2{ transition-delay:.2s; } .reveal.d3{ transition-delay:.3s; } .reveal.d4{ transition-delay:.4s; }
@media (prefers-reduced-motion:reduce){ .reveal{ opacity:1; transform:none; filter:none; } .marquee__track{ animation:none; } }

/* ===================== RESPONSIVE ===================== */
@media (max-width:900px){
  .nav__cap{ gap:12px; padding:9px 10px 9px 18px; }
  .nav__links{
    position:absolute; top:calc(100% + 12px); left:0; right:0; margin:0;
    flex-direction:column; align-items:stretch; gap:2px;
    background:rgba(0,0,2,.94);
    -webkit-backdrop-filter:blur(16px); backdrop-filter:blur(16px);
    border:1px solid rgba(201,21,23,.4); border-radius:20px; padding:14px 18px;
    opacity:0; transform:translateY(-12px) scale(.98); pointer-events:none;
    transition:opacity .3s var(--ease), transform .3s var(--ease);
  }
  .nav__links.open{ opacity:1; transform:none; pointer-events:auto; }
  .nav__links a.lnk{ font-size:.9rem; padding:13px 6px; opacity:1; border-bottom:1px solid rgba(255,255,255,.06); }
  .nav__links a.lnk:last-child{ border-bottom:none; }
  .nav__links a.lnk::after{ display:none; }
  .nav__burger{ display:flex; }
  .lnk--login{ display:none; }
  /* Nav: ocultar cápsula superior, usar barra inferior tipo app */
  .nav{ display:none; }
  body{ padding-bottom:64px; }
  /* Hero a 100svh */
  .hero{ min-height:100svh; padding:84px 0 92px; align-items:flex-start; }
  .hero__grid{ grid-template-columns:1fr; gap:26px; }
  .hero__side{ display:none; }
  .hero__anim{ justify-content:center; }
  .hf-logo{ max-width:300px; transform:none; }
  .hero__copy{ text-align:center; }
  .hero__copy .kicker{ justify-content:center; }
  .hero .lead{ margin-left:auto; margin-right:auto; }
  /* móvil: ocultar #ModoJulian y dejar el ecualizador grande y centrado */
  .hero .kicker__txt{ display:none; }
  .hero__copy .eqmini{ height:40px; gap:4px; margin-right:0; }
  .hero__copy .eqmini i{ width:3px; }
  .marquee--hero{ display:block; bottom:calc(64px + env(safe-area-inset-bottom)); padding:7px 0; }
  .marquee--hero .marquee__track span{ font-size:.85rem; }
  /* Barra inferior */
  .bnav{
    display:flex; align-items:center; justify-content:space-around;
    position:fixed; bottom:0; left:0; right:0; z-index:800;
    height:calc(64px + env(safe-area-inset-bottom)); padding-bottom:env(safe-area-inset-bottom);
    background:rgba(0,0,2,.94); -webkit-backdrop-filter:blur(14px); backdrop-filter:blur(14px);
    border-top:1px solid rgba(201,21,23,.32);
  }
  .bnav__item{ display:flex; flex-direction:column; align-items:center; gap:4px; color:var(--gray); font-family:var(--tech); font-size:9px; letter-spacing:.08em; text-transform:uppercase; text-decoration:none; padding:8px 9px; -webkit-tap-highlight-color:transparent; transition:color .2s; }
  .bnav__item svg{ width:22px; height:22px; }
  .bnav__item.active, .bnav__item:active{ color:var(--red); }
  .bnav__cta{ display:flex; flex-direction:column; align-items:center; justify-content:center; gap:3px; flex-shrink:0; width:58px; height:58px; margin-bottom:22px; background:var(--red); color:#fff; border-radius:18px; font-family:var(--tech); font-size:8.5px; font-weight:700; letter-spacing:.06em; text-transform:uppercase; text-decoration:none; box-shadow:0 6px 20px -4px rgba(201,21,23,.6); -webkit-tap-highlight-color:transparent; }
  .bnav__cta svg{ width:24px; height:24px; }
  .bnav__cta .eqmini{ margin-right:0; height:18px; }
  .bnav__cta .eqmini i{ background:#fff; width:2px; }
  .bnav__cta:active{ transform:scale(.95); }
  .bnav__ia{ background:none; border:0; cursor:pointer; font-family:var(--tech); font-size:9px; letter-spacing:.08em; line-height:1.2; }
  .bnav__ia[aria-expanded="true"]{ color:var(--red); }
  /* Hoja desplegable de Julián IA */
  .iasheet{ display:block; position:fixed; inset:0; z-index:850; visibility:hidden; }
  .iasheet.open{ visibility:visible; }
  .iasheet__back{ position:absolute; inset:0; background:rgba(0,0,2,.55); opacity:0; transition:opacity .25s ease; -webkit-backdrop-filter:blur(3px); backdrop-filter:blur(3px); }
  .iasheet.open .iasheet__back{ opacity:1; }
  .iasheet__card{ position:absolute; left:12px; right:12px; bottom:calc(74px + env(safe-area-inset-bottom)); display:flex; flex-direction:column; gap:9px;
    transform:translateY(18px); opacity:0; transition:transform .3s cubic-bezier(.2,.85,.25,1), opacity .3s ease; }
  .iasheet.open .iasheet__card{ transform:translateY(0); opacity:1; }
  .iasheet__opt{ display:flex; align-items:center; gap:14px; padding:14px 16px; border-radius:16px; text-decoration:none; color:#fff;
    background:rgba(22,7,9,.96); border:1px solid rgba(201,21,23,.34); -webkit-backdrop-filter:blur(14px); backdrop-filter:blur(14px); box-shadow:0 12px 34px -10px rgba(0,0,0,.75); transition:transform .12s; }
  .iasheet__opt:active{ transform:scale(.98); }
  .iasheet__opt svg{ width:26px; height:26px; flex-shrink:0; color:var(--red); }
  .iasheet__opt--wa svg{ color:#25D366; }
  .iasheet__opt b{ display:block; font-family:var(--body); font-weight:600; font-size:15px; letter-spacing:0; text-transform:none; }
  .iasheet__opt small{ display:block; color:var(--gray); font-size:12px; margin-top:1px; }
  .julian{ grid-template-columns:1fr; gap:34px; }
  .plans__grid{ grid-template-columns:minmax(0,1fr); }
  .plan--featured{ transform:none; } .plan--featured:hover{ transform:translateY(-8px); }
  .cta__grid{ grid-template-columns:1fr; gap:40px; }
}
/* Planes en móvil: carrusel marquee continuo (igual que "El problema") */
@media (min-width:761px){ .plan--clone{ display:none; } }
@media (max-width:760px){
  .plans__grid{ display:flex; grid-template-columns:none; flex-direction:row; gap:16px; overflow-x:auto; scroll-snap-type:x mandatory; -webkit-overflow-scrolling:touch; padding-bottom:16px; scrollbar-width:none; }
  .plans__grid::-webkit-scrollbar{ display:none; }
  .plan{ flex:0 0 82%; scroll-snap-align:center; border-radius:16px; }
  /* en táctil NO subir la card al tocar (el :hover se queda "pegado" al tap) */
  .plan:hover, .plan:active, .plan--featured:hover{ transform:none; }
  .plan--featured{ transform:none; box-shadow:0 24px 60px -34px rgba(201,21,23,.5); }
}
@media (max-width:560px){
  .wrap{ padding:0 18px; }
  .sec{ padding:58px 0; }
  .hero__stats{ gap:22px; }
  /* En móvil la palabra "TRANSFORMACIÓN" debe partir y no salirse de pantalla */
  .plans .sec__head h2{ font-size:clamp(1.6rem,8.4vw,2.4rem); overflow-wrap:anywhere; }
  .sec__head--center{ padding:0; }
}

/* toast (mensajes flash, p.ej. "elige tu plan" tras intentar Google sin pagar) */
.toast{ position:fixed; top:84px; left:50%; z-index:300; background:var(--red); color:#fff; font-family:var(--tech); text-transform:uppercase; letter-spacing:.04em; font-size:.8rem; padding:13px 22px; border-radius:12px; box-shadow:0 16px 40px -12px rgba(201,21,23,.7); max-width:90vw; text-align:center;
  animation:toastin .4s var(--ease) forwards, toastout .5s var(--ease) 5.5s forwards; }
@keyframes toastin{ from{ opacity:0; transform:translate(-50%,-14px); } to{ opacity:1; transform:translate(-50%,0); } }
@keyframes toastout{ to{ opacity:0; transform:translate(-50%,-14px); visibility:hidden; } }
@media (max-width:560px){ .toast{ top:14px; font-size:.74rem; padding:11px 16px; } }