/* ==========================================================
   ndemarketing — v2 MERGE LAYER
   Se carga DESPUÉS de style.css. Solo añade/sobrescribe lo
   necesario para traer lo mejor del nuevo diseño manteniendo
   los tokens actuales (--gold, --verde, Krona, Montserrat).
========================================================== */

:root{
  /* Nuevas fuentes */
  --font-serif: "Instrument Serif", Georgia, serif;
  --font-mono:  "JetBrains Mono", ui-monospace, monospace;

  /* Tokens del nuevo sistema (alias sobre los actuales) */
  --v2-verde-ink:    #0E1813;
  --v2-verde-deep:   #1C2A21;
  --v2-accent:       var(--gold);        /* #AA8B56 */
  --v2-accent-warm:  #C4A574;
  --v2-ivory:        #FBF8F1;

  --r-full: 999px;
  --t-fast: 220ms cubic-bezier(.2,.8,.2,1);
  --t-base: 440ms cubic-bezier(.2,.8,.2,1);
  --t-slow: 820ms cubic-bezier(.2,.8,.2,1);
}

/* ===== CUSTOM CURSOR (solo desktop / hover:fine)
   Nota: se usa isolation en un wrapper para evitar que el mix-blend-mode
   de los cursores afecte al render de todo el viewport al hacer scroll
   (bug conocido de position:fixed + mix-blend-mode en algunos motores).
============================================================ */
.cursor-dot,.cursor-ring{
  position:fixed;top:0;left:0;pointer-events:none;z-index:9999;
  border-radius:50%;transform:translate(-50%,-50%);
  will-change:transform;
}
.cursor-dot{width:6px;height:6px;background:var(--gold);box-shadow:0 0 0 1px rgba(255,255,255,.35);transition:transform var(--t-fast), width .25s, height .25s}
.cursor-ring{width:36px;height:36px;border:1px solid rgba(255,255,255,.55);transition:transform .15s ease-out, width .35s cubic-bezier(.2,.8,.2,1), height .35s cubic-bezier(.2,.8,.2,1), border-color .3s}
.cursor-ring.magnetic{width:64px;height:64px;border-color:var(--gold)}
.cursor-dot.magnetic{width:10px;height:10px}
body.no-cursor .cursor-dot,body.no-cursor .cursor-ring{display:none}
@media (hover:none){.cursor-dot,.cursor-ring{display:none}}

/* ===== NAVBAR v2 (pill flotante) =====
   Reemplaza el sticky del .navbar actual cuando el body lleva .nde-navbar-v2.
========================================================== */
body.nde-navbar-v2 .navbar{
  position:fixed;top:18px;left:50%;transform:translateX(-50%);
  z-index:100;display:flex;align-items:center;gap:32px;
  height:auto;
  padding:10px 14px 10px 22px;border-radius:var(--r-full);
  background:rgba(14,24,19,.72);backdrop-filter:blur(22px) saturate(140%);
  -webkit-backdrop-filter:blur(22px) saturate(140%);
  border:1px solid rgba(255,255,255,.08);
  transition:transform var(--t-base);
  width:calc(100% - 36px);max-width:1020px;
}
body.nde-navbar-v2.admin-bar .navbar{top:50px}
body.nde-navbar-v2 .navbar .container{padding:0;max-width:none;gap:28px}
body.nde-navbar-v2 .navbar.hide{transform:translateX(-50%) translateY(-160%)}
body.nde-navbar-v2 .nav-links{gap:26px;margin-left:auto;margin-right:16px}
body.nde-navbar-v2 .nav-links a{
  font-size:13px;color:rgba(255,255,255,.75);font-weight:500;
  transition:color var(--t-fast);position:relative;padding:4px 2px;
}
body.nde-navbar-v2 .nav-links a:hover{color:#fff}
body.nde-navbar-v2 .nav-links a::after{
  content:"";position:absolute;left:2px;right:2px;bottom:-2px;height:1px;
  background:var(--gold);transform:scaleX(0);transform-origin:right;
  transition:transform var(--t-base);
}
body.nde-navbar-v2 .nav-links a:hover::after{transform:scaleX(1);transform-origin:left}
body.nde-navbar-v2 .btn-nav-cta{
  padding:10px 18px;border-radius:var(--r-full);background:var(--gold);
  border:1px solid var(--gold);font-size:13px;
}
body.nde-navbar-v2 .btn-nav-cta:hover{background:var(--v2-accent-warm);border-color:var(--v2-accent-warm);transform:translateY(-1px)}
body.nde-navbar-v2 .btn-nav-cta svg{width:13px;height:13px;stroke-width:2}
body.nde-navbar-v2 main#content{padding-top:0}

/* ===== HERO v2 con rotator ===== */
.hero-v2{
  min-height:100vh;min-height:100svh;padding:150px 0 var(--s7);
  background:var(--v2-verde-ink);color:#fff;
  position:relative;overflow:hidden;display:flex;align-items:center;
}
.hero-v2 .container{position:relative;z-index:2}
.hero-v2-bg{position:absolute;inset:0;pointer-events:none;overflow:hidden;z-index:1}
.hero-v2-bg__grid{
  position:absolute;inset:-50%;
  background-image:
    linear-gradient(rgba(170,139,86,.055) 1px, transparent 1px),
    linear-gradient(90deg, rgba(170,139,86,.055) 1px, transparent 1px);
  background-size:80px 80px;
  mask-image: radial-gradient(ellipse 80% 60% at 50% 50%, #000 30%, transparent 85%);
  -webkit-mask-image: radial-gradient(ellipse 80% 60% at 50% 50%, #000 30%, transparent 85%);
}
.hero-v2-bg__glow{position:absolute;border-radius:50%;filter:blur(100px);opacity:.5;animation:v2float 22s ease-in-out infinite}
.hero-v2-bg__glow--gold{width:520px;height:520px;background:radial-gradient(circle,rgba(170,139,86,.6),transparent 60%);top:-10%;right:-10%}
.hero-v2-bg__glow--green{width:620px;height:620px;background:radial-gradient(circle,rgba(57,81,68,.7),transparent 60%);bottom:-20%;left:-15%;animation-delay:-8s}
.hero-v2-bg__glow--cursor{
  width:380px;height:380px;background:radial-gradient(circle,rgba(170,139,86,.22),transparent 70%);
  filter:blur(50px);transform:translate(-50%,-50%);
  transition:transform .4s cubic-bezier(.2,.8,.2,1);animation:none;opacity:.6;
}
@keyframes v2float{0%,100%{transform:translate(0,0)}50%{transform:translate(30px,-40px)}}

.hero-v2-eyebrow{
  display:inline-flex;align-items:center;gap:10px;padding:8px 16px;border-radius:var(--r-full);
  background:rgba(170,139,86,.08);border:1px solid rgba(170,139,86,.22);
  font-family:var(--font-mono);font-size:11px;letter-spacing:.1em;color:var(--v2-accent-warm);
  margin-bottom:var(--s4);text-transform:uppercase;font-weight:500;
}
.hero-v2-eyebrow .dot{width:6px;height:6px;border-radius:50%;background:var(--ok);box-shadow:0 0 10px var(--ok);animation:v2pulse 2.2s ease-in-out infinite}
@keyframes v2pulse{0%,100%{opacity:1}50%{opacity:.3}}

.hero-v2-grid{display:grid;grid-template-columns:1.4fr 1fr;gap:var(--s5);align-items:center}

.hero-v2-title{
  font-family:var(--font-display);font-weight:400;
  font-size:clamp(40px,5.8vw,92px);line-height:.96;letter-spacing:-.03em;
  margin-bottom:var(--s4);color:#fff;
}
.hero-v2-title .line{display:block}
.hero-v2-title .word-accent{color:var(--gold);font-family:var(--font-serif);font-style:italic;font-weight:400}

.hero-v2-rotator{display:inline-block;overflow:hidden;vertical-align:baseline;position:relative;height:1em;line-height:1}
.hero-v2-rotator-track{display:flex;flex-direction:column;transition:transform .7s cubic-bezier(.7,0,.2,1)}
.hero-v2-rotator-item{display:block;height:1em;line-height:1;color:var(--gold);font-family:var(--font-serif);font-style:italic;font-weight:400}

.hero-v2-lead{font-size:clamp(14px,1.15vw,17px);line-height:1.55;color:rgba(255,255,255,.72);max-width:540px;margin-bottom:var(--s4)}
.hero-v2-lead strong{color:#fff;font-weight:600}
.hero-v2-ctas{display:flex;gap:14px;flex-wrap:wrap;margin-bottom:var(--s4)}
.hero-v2-meta{display:flex;gap:var(--s4);flex-wrap:wrap;padding-top:var(--s3);border-top:1px solid rgba(255,255,255,.08)}
.hero-v2-meta-item{display:flex;align-items:center;gap:8px;font-size:12px;color:rgba(255,255,255,.6);font-family:var(--font-mono);text-transform:uppercase;letter-spacing:.08em}
.hero-v2-meta-item svg{width:14px;height:14px;stroke:var(--gold);stroke-width:2;fill:none}

.hero-v2-stats{display:flex;flex-direction:column;gap:14px}
.hero-v2-stat-card{
  padding:var(--s3);border-radius:var(--r-lg);
  background:rgba(255,255,255,.035);border:1px solid rgba(255,255,255,.07);
  backdrop-filter:blur(10px);transition:all var(--t-base);
  position:relative;overflow:hidden;
}
.hero-v2-stat-card::before{content:"";position:absolute;left:0;top:0;bottom:0;width:2px;background:var(--gold);transform:scaleY(0);transform-origin:top;transition:transform var(--t-base)}
.hero-v2-stat-card:hover::before{transform:scaleY(1)}
.hero-v2-stat-card:hover{background:rgba(255,255,255,.055);transform:translateX(6px)}
.hero-v2-stat-num{font-family:var(--font-display);font-size:clamp(24px,2.5vw,34px);line-height:1;color:#fff;margin-bottom:8px;letter-spacing:-.02em}
.hero-v2-stat-label{font-size:12px;color:rgba(255,255,255,.55);line-height:1.4;font-family:var(--font-mono);text-transform:uppercase;letter-spacing:.06em}

.hero-v2-cue{position:absolute;bottom:32px;left:50%;transform:translateX(-50%);display:flex;flex-direction:column;align-items:center;gap:10px;font-family:var(--font-mono);font-size:10px;letter-spacing:.2em;color:rgba(255,255,255,.4);text-transform:uppercase;z-index:2}
.hero-v2-cue-line{width:1px;height:40px;background:linear-gradient(to bottom,var(--gold),transparent);position:relative;overflow:hidden}
.hero-v2-cue-line::after{content:"";position:absolute;top:0;left:0;right:0;height:20px;background:linear-gradient(to bottom,var(--gold),transparent);animation:v2slide 2s ease-in-out infinite}
@keyframes v2slide{0%{transform:translateY(-100%)}100%{transform:translateY(200%)}}

/* ===== SERVICE CARDS v2 (interactivas) ===== */
.services-v2{background:var(--v2-verde-ink);color:#fff;padding:var(--s8) 0}
.services-v2-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--s2)}
.service-v2-card{
  padding:var(--s4) var(--s3);border-radius:var(--r-lg);
  background:rgba(255,255,255,.03);border:1px solid rgba(255,255,255,.08);
  transition:all var(--t-base);cursor:pointer;position:relative;overflow:hidden;
  transform-style:preserve-3d;
}
.service-v2-card::before{
  content:"";position:absolute;inset:0;opacity:0;
  background:linear-gradient(135deg, rgba(170,139,86,.1), transparent 60%);
  transition:opacity var(--t-base);
}
.service-v2-card:hover{transform:translateY(-6px);border-color:rgba(170,139,86,.35);background:rgba(255,255,255,.05)}
.service-v2-card:hover::before{opacity:1}
.service-v2-card > *{position:relative;z-index:1}
.service-v2-card .card-num{font-family:var(--font-mono);font-size:11px;color:rgba(255,255,255,.45);text-transform:uppercase;letter-spacing:.1em;display:block;margin-bottom:var(--s3)}
.service-v2-card .card-icon{
  width:48px;height:48px;border-radius:14px;
  background:rgba(170,139,86,.1);border:1px solid rgba(170,139,86,.2);
  display:grid;place-items:center;margin-bottom:var(--s3);transition:all var(--t-base);
}
.service-v2-card:hover .card-icon{background:var(--gold);border-color:var(--gold);transform:rotate(-6deg) scale(1.05)}
.service-v2-card .card-icon svg{width:22px;height:22px;fill:none;stroke:var(--gold);stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round;transition:stroke var(--t-base)}
.service-v2-card:hover .card-icon svg{stroke:#fff}
.service-v2-card h3{font-family:var(--font-display);font-size:22px;color:#fff;margin-bottom:12px;line-height:1.15;letter-spacing:-.015em}
.service-v2-card p{font-size:14px;color:rgba(255,255,255,.55);line-height:1.65;margin-bottom:var(--s3)}
.service-v2-card .card-link{
  display:inline-flex;align-items:center;gap:6px;font-family:var(--font-mono);font-size:11px;font-weight:500;
  text-transform:uppercase;letter-spacing:.1em;color:var(--gold);
}
.service-v2-card .card-link svg{width:10px;height:10px;fill:none;stroke:currentColor;stroke-width:2.5;transition:transform var(--t-fast)}
.service-v2-card:hover .card-link svg{transform:translateX(4px)}

/* ===== HEADING dual-face (Krona + Instrument Serif italic) ===== */
.title-dual{
  font-family:var(--font-display);font-weight:400;
  font-size:clamp(32px,5vw,64px);line-height:1.02;letter-spacing:-.025em;
}
.title-dual em{font-family:var(--font-serif);font-style:italic;color:var(--gold);font-weight:400}
.title-dual .accent{color:var(--gold);font-family:var(--font-serif);font-style:italic;font-weight:400}

/* ===== CTA FINAL "Hablemos 30 minutos" ===== */
.cta-final-v2{
  background:var(--v2-verde-deep);color:#fff;padding:var(--s8) 0;position:relative;overflow:hidden;
}
.cta-final-v2::before{
  content:"";position:absolute;inset:-50%;pointer-events:none;
  background-image:
    linear-gradient(rgba(170,139,86,.055) 1px, transparent 1px),
    linear-gradient(90deg, rgba(170,139,86,.055) 1px, transparent 1px);
  background-size:80px 80px;
  mask-image: radial-gradient(ellipse 70% 55% at 50% 50%, #000 30%, transparent 85%);
  -webkit-mask-image: radial-gradient(ellipse 70% 55% at 50% 50%, #000 30%, transparent 85%);
}
.cta-final-v2-inner{position:relative;z-index:1;max-width:820px;margin:0 auto;text-align:center}
.cta-final-v2 .eyebrow{font-family:var(--font-mono);font-size:11px;text-transform:uppercase;letter-spacing:.14em;color:var(--v2-accent-warm);margin-bottom:var(--s3);display:inline-flex;align-items:center;gap:10px}
.cta-final-v2 .eyebrow::before{content:"";width:24px;height:1px;background:var(--gold)}
.cta-final-v2 h2{font-family:var(--font-display);font-size:clamp(40px,5.6vw,80px);line-height:.98;letter-spacing:-.03em;margin-bottom:var(--s3);font-weight:400}
.cta-final-v2 h2 em{font-family:var(--font-serif);font-style:italic;color:var(--gold);font-weight:400}
.cta-final-v2 p{font-size:clamp(15px,1.2vw,18px);color:rgba(255,255,255,.7);max-width:580px;margin:0 auto var(--s4);line-height:1.6}
.cta-final-v2 .btns{display:flex;gap:14px;justify-content:center;flex-wrap:wrap}
.cta-final-v2 .meta{display:flex;gap:var(--s4);justify-content:center;flex-wrap:wrap;margin-top:var(--s4);padding-top:var(--s3);border-top:1px solid rgba(255,255,255,.08)}
.cta-final-v2 .meta-item{display:flex;align-items:center;gap:8px;font-family:var(--font-mono);font-size:12px;color:rgba(255,255,255,.55);text-transform:uppercase;letter-spacing:.08em}
.cta-final-v2 .meta-item svg{width:14px;height:14px;stroke:var(--gold);stroke-width:2;fill:none}

/* ===== FOOTER v2 con ndemarketing gigante ===== */
.footer-v2{background:var(--v2-verde-ink);color:rgba(255,255,255,.55);padding:var(--s7) 0 var(--s3);position:relative;overflow:hidden}
.footer-v2-huge{
  font-family:var(--font-display);font-size:clamp(72px,12vw,200px);line-height:.85;letter-spacing:-.04em;
  background:linear-gradient(180deg,rgba(170,139,86,.22),rgba(170,139,86,0));
  background-clip:text;-webkit-background-clip:text;color:transparent;
  white-space:nowrap;margin:0 auto var(--s5);user-select:none;pointer-events:none;
  text-align:center;display:block;width:100%;max-width:100%;overflow:hidden;
}
.footer-v2-grid{display:grid;grid-template-columns:1.4fr 1fr 1fr 1.3fr 1.1fr;gap:var(--s4);padding-bottom:var(--s5);border-bottom:1px solid rgba(255,255,255,.06)}
.footer-v2-grid h4{font-family:var(--font-mono);font-size:11px;color:#fff;text-transform:uppercase;letter-spacing:.12em;margin-bottom:var(--s3);font-weight:500}
.footer-v2-grid ul{display:flex;flex-direction:column;gap:10px}
.footer-v2-grid a{font-size:13px;color:rgba(255,255,255,.6);transition:color var(--t-fast)}
.footer-v2-grid a:hover{color:var(--gold)}
.footer-v2-grid ul.footer-cities-list{display:grid;grid-template-columns:1fr 1fr;gap:8px 14px}
.footer-v2-grid ul.footer-cities-list .footer-cities-all{grid-column:1 / -1;margin-top:6px;padding-top:8px;border-top:1px solid rgba(255,255,255,.08)}
.footer-v2-grid ul.footer-cities-list .footer-cities-all a{color:var(--gold)}
.footer-v2-brand p{font-size:13px;color:rgba(255,255,255,.5);line-height:1.6;max-width:320px;margin-top:var(--s2)}
.footer-v2-bottom{display:flex;justify-content:space-between;align-items:center;padding-top:var(--s3);flex-wrap:wrap;gap:var(--s2);font-size:12px;color:rgba(255,255,255,.4);font-family:var(--font-mono);text-transform:uppercase;letter-spacing:.06em}
.footer-v2-legal{display:flex;gap:var(--s3)}
.footer-v2-legal a{color:rgba(255,255,255,.5);transition:color var(--t-fast)}
.footer-v2-legal a:hover{color:var(--gold)}

/* ===== Reveal animations (los que no tenías aún) ===== */
html.js-on .reveal-stagger > *{opacity:0;transform:translateY(28px);transition:opacity .8s cubic-bezier(.2,.8,.2,1), transform .8s cubic-bezier(.2,.8,.2,1)}
html.js-on .reveal-stagger.in > *{opacity:1;transform:translateY(0)}
.reveal-stagger.in > *:nth-child(1){transition-delay:0ms}
.reveal-stagger.in > *:nth-child(2){transition-delay:80ms}
.reveal-stagger.in > *:nth-child(3){transition-delay:160ms}
.reveal-stagger.in > *:nth-child(4){transition-delay:240ms}
.reveal-stagger.in > *:nth-child(5){transition-delay:320ms}
.reveal-stagger.in > *:nth-child(6){transition-delay:400ms}

/* ===== RESPONSIVE ===== */
/* Anti-desbordamiento global — evita scroll horizontal en mobile */
html,body{overflow-x:hidden;max-width:100vw}
img,video,iframe,svg{max-width:100%;height:auto}

@media (max-width:1024px){
  .hero-v2-grid{grid-template-columns:1fr;gap:var(--s5)}
  .services-v2-grid{grid-template-columns:repeat(2,1fr)}
  .footer-v2-grid{grid-template-columns:1fr 1fr;gap:var(--s4)}
  body.nde-navbar-v2 .nav-links{display:none}
}

@media (max-width:900px){
  /* Hero ajustes */
  .hero-v2{padding:120px 0 var(--s5)}
  .hero-v2-title{
    font-size:clamp(28px,7vw,44px);line-height:1.05;
    word-break:break-word;overflow-wrap:anywhere;hyphens:auto
  }
  .hero-v2-title .line{word-break:break-word;overflow-wrap:anywhere}
  .hero-v2-lead{font-size:15px;max-width:100%}
  .hero-v2-ctas{flex-direction:column;align-items:stretch}
  .hero-v2-ctas .btn-cta,.hero-v2-ctas .btn{width:100%;justify-content:center}
  .hero-v2-meta{flex-direction:column;gap:10px}

  /* Servicios y diferenciadores a 1 col */
  .services-v2-grid,.service-cards,.diff-cards,.pain-cards,.grid-3{
    grid-template-columns:1fr !important;gap:var(--s3)
  }

  /* Timeline / proceso a 1 col */
  .timeline,.timeline-grid,.proceso-grid,.entregables-grid{
    grid-template-columns:1fr !important
  }

  /* Tablas scroll horizontal */
  .ranking-table,.keywords-table,table.wp-block-table,.gsc-table,.data-table{
    display:block;overflow-x:auto;max-width:100%;-webkit-overflow-scrolling:touch
  }

  /* Marquee / pill rows no desbordan visualmente */
  .marquee-section,.marquee,.pill-marquee,.pill-row{
    overflow:hidden;max-width:100vw
  }

  /* Tilt 3D rompe en mobile → desactivar */
  .service-card-v2,.service-card,[data-tilt]{
    transform:none !important;transform-style:flat !important
  }

  /* CTA final compacto */
  .cta-final-v2 h2{font-size:clamp(24px,6.5vw,38px)}
  .cta-final-v2 .meta{flex-direction:column;gap:10px}

  /* Container más pegado a bordes */
  .container{padding-inline:20px}
}

@media (max-width:720px){
  /* Navbar pill compacto */
  body.nde-navbar-v2 .navbar{padding:8px 8px 8px 14px;gap:8px}
  body.nde-navbar-v2 .navbar .btn-cta{padding:8px 14px;font-size:12px}
  body.nde-navbar-v2 .logo{font-size:20px}

  /* Hero stats a 1 col en mobile pequeño */
  .hero-v2-stats{display:grid;grid-template-columns:1fr;gap:10px}
  .hero-v2-stat-card{padding:14px}
  .hero-v2-stat-num{font-size:22px}
  .hero-v2-title{font-size:clamp(24px,6.5vw,36px)}
  .hero-v2-cue{display:none}

  /* Footer: 1 col y centrado */
  .footer-v2{padding:var(--s5) 0 var(--s3)}
  .footer-v2-huge{font-size:clamp(64px,22vw,120px);margin-bottom:var(--s4)}
  .footer-v2-grid{
    grid-template-columns:1fr !important;
    text-align:center;gap:var(--s4);
    padding-bottom:var(--s4)
  }
  .footer-v2-brand{display:flex;flex-direction:column;align-items:center}
  .footer-v2-brand p,.footer-v2-brand > div{margin-inline:auto;max-width:320px}
  .footer-v2-brand ul,.footer-v2-grid ul{align-items:center;padding:0}
  .footer-v2-grid > div{display:flex;flex-direction:column;align-items:center}
  .footer-v2-bottom{
    flex-direction:column;align-items:center;
    text-align:center;gap:12px
  }
  .footer-v2-legal{justify-content:center;flex-wrap:wrap}

  /* Hero padding reducido */
  .hero-v2{padding:110px 0 var(--s5)}

  /* Sections padding reducido */
  .section,.section--lg{padding:var(--s5) 0}
}

@media (prefers-reduced-motion: reduce){
  .cursor-dot,.cursor-ring{display:none}
  .hero-v2-bg__glow,.hero-v2-rotator-track{animation:none!important;transition:none!important}
}