/* ═══════════════════════════════════════════════════════════
   nobrainer. — sistema de diseño del sitio
   Tinta · Papel · Ultramar — el punto final como gesto de marca
   Sin itálicas en todo el sitio (regla editorial de la identidad)
   ═══════════════════════════════════════════════════════════ */

:root{
  --ink:#141518;
  --ink-2:#1B1D22;
  --ink-3:#22242B;
  --paper:#F5F3EE;
  --white:#FDFCF9;
  --ultra:#1F3BFF;
  --ultra-dim:#7d8dff;
  --gray:#8A8D93;
  --gray-2:#5f6268;
  --line:#E4E2DC;
  --line-dark:rgba(245,243,238,.1);
  --sans:'Instrument Sans',Helvetica,Arial,sans-serif;
  --serif:'Newsreader',Georgia,serif;
  --wm:'neue-montreal',var(--sans); /* al comprar Neue Montreal: @font-face y listo */
  --max:1280px;
  --pad:clamp(20px,4.5vw,56px);
  --r:18px;
  --ease:cubic-bezier(.16,1,.3,1);
}

*,*::before,*::after{box-sizing:border-box;margin:0;padding:0;}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%;}
body{
  font-family:var(--sans);font-weight:400;font-size:16px;line-height:1.75;
  background:var(--paper);color:var(--ink);
  -webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;
  overflow-x:hidden;
}
::selection{background:var(--ultra);color:var(--white);}
::-webkit-scrollbar{width:4px;}
::-webkit-scrollbar-track{background:var(--paper);}
::-webkit-scrollbar-thumb{background:#c9c7c0;border-radius:2px;}

/* Regla editorial: la identidad no usa itálicas */
em,i,cite,blockquote,q{font-style:normal;}

img{max-width:100%;height:auto;display:block;}
a{color:inherit;text-decoration:none;}
button{font-family:inherit;cursor:pointer;}
h1,h2,h3,h4{font-weight:600;letter-spacing:-.03em;line-height:1.05;text-wrap:balance;}
p{text-wrap:pretty;}

.wrap{max-width:var(--max);margin:0 auto;padding-left:var(--pad);padding-right:var(--pad);}

/* ─────────────── Wordmark ─────────────── */
.nb-wordmark{font-family:var(--wm);font-weight:600;letter-spacing:-.05em;line-height:1;color:var(--ink);white-space:nowrap;}
.nb-wordmark.on-dark{color:var(--paper);}
.nb-dot{color:var(--ultra);}
.nb-logo-img{max-height:30px;width:auto;}

/* ─────────────── Cursor (el punto) ─────────────── */
.nb-cursor{
  position:fixed;top:0;left:0;width:10px;height:10px;border-radius:50%;
  background:var(--ultra);pointer-events:none;z-index:9999;
  transform:translate(-50%,-50%);
  transition:width .35s var(--ease),height .35s var(--ease),opacity .3s;
  opacity:0;mix-blend-mode:normal;
}
.nb-cursor.is-on{opacity:1;}
.nb-cursor.is-hover{width:56px;height:56px;background:rgba(31,59,255,.12);border:1px solid var(--ultra);}
.nb-cursor .nb-cursor-label{
  position:absolute;inset:0;display:flex;align-items:center;justify-content:center;
  font-size:10px;font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:var(--ultra);
  opacity:0;transition:opacity .25s;white-space:nowrap;
}
.nb-cursor.is-label{width:78px;height:78px;background:var(--ultra);border:none;}
.nb-cursor.is-label .nb-cursor-label{opacity:1;color:var(--white);}
@media(hover:none),(pointer:coarse){.nb-cursor{display:none;}}

/* ─────────────── Preloader ─────────────── */
.nb-loader{
  position:fixed;inset:0;z-index:10000;background:var(--ink);
  display:flex;align-items:center;justify-content:center;
  transition:opacity .6s var(--ease),visibility .6s;
}
.nb-loader.is-done{opacity:0;visibility:hidden;}
.nb-loader .nb-wordmark{font-size:clamp(30px,5vw,52px);color:var(--paper);opacity:0;animation:nbFadeUp .8s var(--ease) .1s forwards;}
.nb-loader .nb-dot{display:inline-block;opacity:0;animation:nbDotLand .5s var(--ease) .7s forwards;}
@keyframes nbFadeUp{from{opacity:0;transform:translateY(18px);}to{opacity:1;transform:none;}}
@keyframes nbDotLand{0%{opacity:0;transform:translateY(-14px) scale(.4);}70%{opacity:1;transform:translateY(2px) scale(1.15);}100%{opacity:1;transform:none;}}
html.nb-loading{overflow:hidden;}

/* ─────────────── Reveal ─────────────── */
[data-reveal]{opacity:0;transform:translateY(34px);transition:opacity .9s var(--ease),transform .9s var(--ease);}
[data-reveal].on{opacity:1;transform:none;}
[data-reveal="clip"]{transform:none;clip-path:inset(0 0 100% 0);transition:clip-path 1s var(--ease),opacity .6s;}
[data-reveal="clip"].on{clip-path:inset(0 0 0% 0);}
[data-stagger]>*{opacity:0;transform:translateY(28px);transition:opacity .8s var(--ease),transform .8s var(--ease);}
[data-stagger].on>*{opacity:1;transform:none;}
[data-stagger].on>*:nth-child(1){transition-delay:.05s}
[data-stagger].on>*:nth-child(2){transition-delay:.13s}
[data-stagger].on>*:nth-child(3){transition-delay:.21s}
[data-stagger].on>*:nth-child(4){transition-delay:.29s}
[data-stagger].on>*:nth-child(5){transition-delay:.37s}
[data-stagger].on>*:nth-child(6){transition-delay:.45s}
[data-stagger].on>*:nth-child(7){transition-delay:.53s}
[data-stagger].on>*:nth-child(8){transition-delay:.61s}
[data-stagger].on>*:nth-child(9){transition-delay:.69s}
@media(prefers-reduced-motion:reduce){
  [data-reveal],[data-stagger]>*{opacity:1!important;transform:none!important;clip-path:none!important;transition:none!important;}
  .nb-loader{display:none;}
  html{scroll-behavior:auto;}
}

/* ─────────────── Header ─────────────── */
.nb-header{
  position:fixed;top:0;left:0;right:0;z-index:900;
  transition:transform .5s var(--ease),background .4s,border-color .4s;
  border-bottom:1px solid transparent;
}
.nb-header.is-scrolled{background:rgba(245,243,238,.82);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);border-color:var(--line);}
.nb-header.is-hidden{transform:translateY(-100%);}
.nb-header-inner{
  max-width:var(--max);margin:0 auto;padding:0 var(--pad);
  height:76px;display:flex;align-items:center;justify-content:space-between;gap:24px;
}
.nb-header .nb-wordmark{font-size:22px;}
.nb-nav ul{display:flex;gap:34px;list-style:none;}
.nb-nav a{font-size:13px;font-weight:500;letter-spacing:.01em;color:var(--ink);position:relative;padding:6px 0;}
.nb-nav a::after{content:'';position:absolute;left:0;bottom:0;width:4px;height:4px;border-radius:50%;background:var(--ultra);opacity:0;transform:translateY(4px);transition:opacity .3s,transform .3s var(--ease);}
.nb-nav a:hover::after,.nb-nav .current-menu-item a::after{opacity:1;transform:none;}
.nb-header-cta{
  display:inline-flex;align-items:center;gap:10px;
  font-size:12px;font-weight:600;letter-spacing:.06em;text-transform:uppercase;
  background:var(--ink);color:var(--paper);border-radius:100px;padding:11px 24px;
  transition:background .3s;
}
.nb-header-cta:hover{background:var(--ultra);}
/* Header sobre fondo oscuro (portada) */
.nb-header.on-dark:not(.is-scrolled) .nb-nav a{color:var(--paper);}
.nb-header.on-dark:not(.is-scrolled) .nb-wordmark{color:var(--paper);}
.nb-header.on-dark:not(.is-scrolled) .nb-header-cta{background:var(--paper);color:var(--ink);}
.nb-header.on-dark:not(.is-scrolled) .nb-header-cta:hover{background:var(--ultra);color:var(--white);}
.nb-header.on-dark:not(.is-scrolled) .nb-burger span{background:var(--paper);}

.nb-burger{display:none;flex-direction:column;gap:6px;background:none;border:0;padding:6px;z-index:1001;}
.nb-burger span{display:block;width:24px;height:1.6px;background:var(--ink);transition:transform .4s var(--ease),opacity .3s;}
.nb-burger.is-open span:nth-child(1){transform:translateY(7.6px) rotate(45deg);background:var(--paper);}
.nb-burger.is-open span:nth-child(2){opacity:0;}
.nb-burger.is-open span:nth-child(3){transform:translateY(-7.6px) rotate(-45deg);background:var(--paper);}

.nb-menu-overlay{
  position:fixed;inset:0;z-index:950;background:var(--ink);
  display:flex;flex-direction:column;justify-content:center;padding:0 var(--pad);
  clip-path:inset(0 0 100% 0);transition:clip-path .7s var(--ease);
}
.nb-menu-overlay.is-open{clip-path:inset(0 0 0% 0);}
.nb-menu-overlay ul{list-style:none;}
.nb-menu-overlay a{
  display:block;font-size:clamp(34px,8vw,54px);font-weight:600;letter-spacing:-.03em;
  color:var(--paper);padding:10px 0;line-height:1.1;
  opacity:0;transform:translateY(24px);transition:opacity .5s var(--ease),transform .5s var(--ease);
}
.nb-menu-overlay.is-open a{opacity:1;transform:none;}
.nb-menu-overlay.is-open li:nth-child(1) a{transition-delay:.15s}
.nb-menu-overlay.is-open li:nth-child(2) a{transition-delay:.21s}
.nb-menu-overlay.is-open li:nth-child(3) a{transition-delay:.27s}
.nb-menu-overlay.is-open li:nth-child(4) a{transition-delay:.33s}
.nb-menu-overlay.is-open li:nth-child(5) a{transition-delay:.39s}
.nb-menu-overlay.is-open li:nth-child(6) a{transition-delay:.45s}
.nb-menu-overlay .nb-menu-meta{margin-top:40px;color:var(--gray);font-size:13px;opacity:0;transition:opacity .5s .5s;}
.nb-menu-overlay.is-open .nb-menu-meta{opacity:1;}
@media(max-width:960px){.nb-nav,.nb-header .nb-header-cta{display:none;}.nb-burger{display:flex;}}

/* ─────────────── Botones ─────────────── */
.nb-btn{
  display:inline-flex;align-items:center;gap:12px;
  font-size:13px;font-weight:600;letter-spacing:.05em;text-transform:uppercase;
  background:var(--ink);color:var(--paper);border:0;border-radius:100px;padding:16px 32px;
  transition:background .35s var(--ease),transform .35s var(--ease);
  position:relative;
}
.nb-btn::before{content:'';width:6px;height:6px;border-radius:50%;background:var(--ultra);transition:transform .35s var(--ease);}
.nb-btn:hover{background:var(--ultra);}
.nb-btn:hover::before{background:var(--white);transform:scale(1.3);}
.nb-btn.light{background:var(--paper);color:var(--ink);}
.nb-btn.light:hover{background:var(--ultra);color:var(--white);}
.nb-btn.ghost{background:transparent;border:1px solid var(--line);color:var(--ink);}
.nb-btn.ghost:hover{border-color:var(--ultra);background:var(--ultra);color:var(--white);}
.nb-link{
  display:inline-flex;align-items:baseline;gap:8px;font-size:14px;font-weight:600;color:var(--ink);
  border-bottom:1px solid var(--ink);padding-bottom:3px;transition:color .3s,border-color .3s;
}
.nb-link::after{content:'.';color:var(--ultra);}
.nb-link:hover{color:var(--ultra);border-color:var(--ultra);}

/* ─────────────── Etiquetas de sección ─────────────── */
.nb-kicker{
  display:flex;align-items:center;gap:12px;
  font-size:11px;font-weight:600;letter-spacing:.18em;text-transform:uppercase;color:var(--gray);
  margin-bottom:26px;
}
.nb-kicker::before{content:'';width:6px;height:6px;border-radius:50%;background:var(--ultra);flex-shrink:0;}
.on-ink .nb-kicker{color:var(--gray);}

/* ─────────────── Hero (portada) ─────────────── */
.nb-hero{
  position:relative;min-height:100svh;background:var(--ink);color:var(--paper);
  display:flex;flex-direction:column;justify-content:flex-end;overflow:hidden;
}
.nb-hero-bg{
  position:absolute;inset:-10%;pointer-events:none;
  background:
    radial-gradient(ellipse 42% 48% at 78% 30%, rgba(31,59,255,.16) 0%, transparent 68%),
    radial-gradient(ellipse 30% 34% at 12% 85%, rgba(31,59,255,.07) 0%, transparent 70%);
}
.nb-hero-grid{
  position:absolute;inset:0;opacity:.05;pointer-events:none;
  background-image:linear-gradient(var(--paper) 1px,transparent 1px),linear-gradient(90deg,var(--paper) 1px,transparent 1px);
  background-size:80px 80px;
  mask-image:radial-gradient(ellipse 70% 60% at 60% 40%,black,transparent);
  -webkit-mask-image:radial-gradient(ellipse 70% 60% at 60% 40%,black,transparent);
}
.nb-hero-inner{position:relative;width:100%;max-width:var(--max);margin:0 auto;padding:150px var(--pad) 0;}
.nb-hero h1{
  font-size:clamp(42px,7.2vw,104px);line-height:.96;letter-spacing:-.045em;color:var(--paper);
  max-width:14ch;
}
.nb-hero h1 .nb-dot{display:inline-block;}
.nb-hero-sub{
  margin-top:34px;font-size:clamp(15px,1.5vw,18px);line-height:1.8;color:rgba(245,243,238,.55);max-width:520px;
}
.nb-hero-actions{display:flex;align-items:center;gap:26px;margin-top:44px;flex-wrap:wrap;}
.nb-hero-foot{
  position:relative;margin-top:80px;border-top:1px solid var(--line-dark);
}
.nb-hero-foot-inner{
  max-width:var(--max);margin:0 auto;padding:22px var(--pad);
  display:flex;justify-content:space-between;align-items:center;gap:20px;
  font-size:11px;font-weight:500;letter-spacing:.14em;text-transform:uppercase;color:rgba(245,243,238,.35);
}
.nb-hero-foot .nb-scroll-hint{display:flex;align-items:center;gap:12px;}
.nb-scroll-line{width:44px;height:1px;background:rgba(245,243,238,.25);position:relative;overflow:hidden;}
.nb-scroll-line::after{content:'';position:absolute;inset:0;background:var(--ultra);transform:translateX(-100%);animation:nbScrollLine 2.4s var(--ease) infinite;}
@keyframes nbScrollLine{0%{transform:translateX(-100%)}55%{transform:translateX(0)}100%{transform:translateX(100%)}}

/* ─────────────── Cinta de clientes ─────────────── */
.nb-marquee{background:var(--ink);padding:0 0 64px;overflow:hidden;}
.nb-marquee-label{text-align:center;font-size:11px;font-weight:600;letter-spacing:.18em;text-transform:uppercase;color:rgba(245,243,238,.3);margin-bottom:30px;}
.nb-marquee-track{display:flex;gap:90px;width:max-content;animation:nbMarquee 36s linear infinite;align-items:center;}
.nb-marquee:hover .nb-marquee-track{animation-play-state:paused;}
.nb-marquee-item{font-size:20px;font-weight:500;letter-spacing:-.01em;color:rgba(245,243,238,.35);white-space:nowrap;transition:color .3s;}
.nb-marquee-item:hover{color:var(--paper);}
.nb-marquee-item img{height:34px;width:auto;opacity:.5;filter:grayscale(1) brightness(3);transition:opacity .3s;}
.nb-marquee-item:hover img{opacity:1;}
@keyframes nbMarquee{to{transform:translateX(-50%);}}

/* ─────────────── Secciones ─────────────── */
.nb-sec{padding:clamp(90px,11vw,150px) 0;position:relative;}
.nb-sec.on-ink{background:var(--ink);color:var(--paper);}
.nb-sec.on-white{background:var(--white);}
.nb-sec-head{max-width:840px;margin-bottom:clamp(44px,6vw,72px);}
.nb-h2{font-size:clamp(32px,4.6vw,60px);letter-spacing:-.04em;}
.on-ink .nb-h2{color:var(--paper);}
.nb-h2 .hl{color:var(--ultra);}
.on-ink .nb-h2 .hl{color:var(--ultra-dim);}
.nb-lead{margin-top:22px;font-size:clamp(15px,1.4vw,17px);line-height:1.85;color:var(--gray-2);max-width:640px;}
.on-ink .nb-lead{color:rgba(245,243,238,.55);}

/* Voz humana: Newsreader vertical (sin itálicas), para verbatims y citas */
.nb-verbatim{font-family:var(--serif);font-weight:300;font-size:clamp(24px,3.4vw,40px);line-height:1.35;letter-spacing:-.01em;color:var(--ink);text-wrap:balance;}
.on-ink .nb-verbatim{color:var(--paper);}
.nb-verbatim .nb-dot{color:var(--ultra);}

/* ─────────────── Tarjetas de capacidades ─────────────── */
.nb-caps{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:var(--line);border:1px solid var(--line);border-radius:var(--r);overflow:hidden;}
.nb-cap{background:var(--paper);padding:44px 38px 48px;position:relative;transition:background .4s var(--ease);}
.nb-cap:hover{background:var(--white);}
.nb-cap-n{font-size:12px;font-weight:600;letter-spacing:.08em;color:var(--gray);display:flex;align-items:center;gap:10px;}
.nb-cap-n::after{content:'';flex:1;height:1px;background:var(--line);}
.nb-cap h3{font-size:22px;margin:26px 0 14px;letter-spacing:-.025em;}
.nb-cap p{font-size:14px;line-height:1.8;color:var(--gray-2);}
.nb-cap-dot{position:absolute;top:44px;right:38px;width:8px;height:8px;border-radius:50%;background:var(--line);transition:background .4s,transform .4s var(--ease);}
.nb-cap:hover .nb-cap-dot{background:var(--ultra);transform:scale(1.3);}
@media(max-width:960px){.nb-caps{grid-template-columns:1fr;}}

/* ─────────────── Casos ─────────────── */
.nb-cases{display:grid;grid-template-columns:1fr 1fr;gap:clamp(24px,3.5vw,48px);}
.nb-case{display:block;position:relative;}
.nb-cases .nb-case:nth-child(even){transform:translateY(clamp(30px,5vw,70px));}
.nb-case-media{
  position:relative;border-radius:var(--r);overflow:hidden;aspect-ratio:4/3;background:var(--ink-2);
}
.nb-case-media img{width:100%;height:100%;object-fit:cover;transition:transform 1s var(--ease);}
.nb-case:hover .nb-case-media img{transform:scale(1.05);}
.nb-case-media .nb-case-ph{
  position:absolute;inset:0;display:flex;align-items:center;justify-content:center;
  color:rgba(245,243,238,.16);font-size:80px;font-weight:600;letter-spacing:-.05em;
}
.nb-case-tags{display:flex;gap:8px;flex-wrap:wrap;margin-top:20px;}
.nb-case-tag{font-size:10px;font-weight:600;letter-spacing:.1em;text-transform:uppercase;color:var(--gray);border:1px solid var(--line);border-radius:100px;padding:5px 12px;}
.on-ink .nb-case-tag{border-color:var(--line-dark);color:rgba(245,243,238,.45);}
.nb-case h3{font-size:clamp(19px,1.9vw,24px);margin-top:12px;letter-spacing:-.025em;line-height:1.25;transition:color .3s;}
.nb-case:hover h3{color:var(--ultra);}
.on-ink .nb-case h3{color:var(--paper);}
.on-ink .nb-case:hover h3{color:var(--ultra-dim);}
.nb-case p{margin-top:8px;font-size:14px;line-height:1.75;color:var(--gray-2);max-width:46ch;}
.on-ink .nb-case p{color:rgba(245,243,238,.5);}
@media(max-width:760px){.nb-cases{grid-template-columns:1fr;}.nb-cases .nb-case:nth-child(even){transform:none;}}

/* ─────────────── Cifras ─────────────── */
.nb-stats{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:var(--line-dark);border-radius:var(--r);overflow:hidden;}
.nb-stat{background:var(--ink-2);padding:44px 40px;}
.nb-stat-n{font-size:clamp(44px,5vw,68px);font-weight:600;letter-spacing:-.045em;line-height:1;color:var(--paper);}
.nb-stat-n .nb-dot{color:var(--ultra);}
.nb-stat-l{margin-top:12px;font-size:13px;letter-spacing:.02em;color:rgba(245,243,238,.5);}
@media(max-width:760px){.nb-stats{grid-template-columns:1fr;}}

/* ─────────────── Proceso / metodología ─────────────── */
.nb-steps{border-top:1px solid var(--line);}
.on-ink .nb-steps{border-color:var(--line-dark);}
.nb-step{
  display:grid;grid-template-columns:110px 1fr 1.2fr;gap:clamp(20px,3vw,48px);
  padding:clamp(30px,4vw,48px) 0;border-bottom:1px solid var(--line);align-items:start;
  transition:padding-left .4s var(--ease);
}
.on-ink .nb-step{border-color:var(--line-dark);}
.nb-step:hover{padding-left:14px;}
.nb-step-n{font-size:13px;font-weight:600;color:var(--gray);letter-spacing:.06em;padding-top:6px;}
.nb-step-n span{color:var(--ultra);}
.nb-step h3{font-size:clamp(20px,2.2vw,28px);letter-spacing:-.03em;}
.on-ink .nb-step h3{color:var(--paper);}
.nb-step p{font-size:14.5px;line-height:1.8;color:var(--gray-2);}
.on-ink .nb-step p{color:rgba(245,243,238,.55);}
@media(max-width:760px){.nb-step{grid-template-columns:1fr;gap:10px;}}

/* ─────────────── Testimonios ─────────────── */
.nb-testimonials{position:relative;}
.nb-testimonial{display:none;}
.nb-testimonial.is-active{display:block;animation:nbFadeUp .7s var(--ease);}
.nb-testimonial footer{margin-top:34px;display:flex;align-items:center;gap:16px;}
.nb-testimonial footer::before{content:'';width:34px;height:1px;background:var(--ultra);}
.nb-testimonial .who{font-size:14px;font-weight:600;}
.nb-testimonial .role{font-size:12.5px;color:var(--gray);margin-top:2px;}
.nb-t-nav{display:flex;gap:10px;margin-top:44px;}
.nb-t-dot{width:34px;height:4px;border-radius:2px;background:var(--line);border:0;padding:0;transition:background .3s;}
.on-ink .nb-t-dot{background:var(--line-dark);}
.nb-t-dot.is-active{background:var(--ultra);}

/* ─────────────── Equipo ─────────────── */
.nb-team{display:grid;grid-template-columns:repeat(4,1fr);gap:clamp(16px,2.5vw,28px);}
.nb-member-media{border-radius:var(--r);overflow:hidden;aspect-ratio:4/5;background:var(--ink-2);position:relative;}
.nb-member-media img{width:100%;height:100%;object-fit:cover;filter:grayscale(1);transition:filter .5s,transform .8s var(--ease);}
.nb-member:hover .nb-member-media img{filter:grayscale(0);transform:scale(1.04);}
.nb-member-ph{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;color:rgba(245,243,238,.14);font-size:52px;font-weight:600;}
.nb-member h3{font-size:16px;margin-top:16px;letter-spacing:-.02em;}
.nb-member .role{font-size:12.5px;color:var(--gray);margin-top:3px;line-height:1.5;}
@media(max-width:960px){.nb-team{grid-template-columns:repeat(2,1fr);}}
@media(max-width:520px){.nb-team{grid-template-columns:1fr;}}

/* ─────────────── Split de contenido ─────────────── */
.nb-split{display:grid;grid-template-columns:1fr 1fr;gap:clamp(36px,6vw,90px);align-items:center;}
.nb-split-media{border-radius:var(--r);overflow:hidden;aspect-ratio:4/5;background:var(--ink-2);position:relative;}
.nb-split-media.wide{aspect-ratio:4/3;}
.nb-split-media img{width:100%;height:100%;object-fit:cover;}
.nb-split-ph{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;background:linear-gradient(160deg,var(--ink-2),var(--ink));}
.nb-split-ph::after{content:'';width:14px;height:14px;border-radius:50%;background:var(--ultra);}
@media(max-width:860px){.nb-split{grid-template-columns:1fr;}}

/* ─────────────── Blog ─────────────── */
.nb-posts{border-top:1px solid var(--line);}
.nb-post-row{
  display:grid;grid-template-columns:120px 1fr auto;gap:clamp(18px,3vw,44px);align-items:baseline;
  padding:clamp(26px,3.5vw,40px) 0;border-bottom:1px solid var(--line);transition:padding-left .35s var(--ease);
}
.nb-post-row:hover{padding-left:14px;}
.nb-post-row time{font-size:12px;font-weight:600;letter-spacing:.06em;text-transform:uppercase;color:var(--gray);}
.nb-post-row h2,.nb-post-row h3{font-size:clamp(19px,2.2vw,27px);letter-spacing:-.03em;line-height:1.25;transition:color .3s;}
.nb-post-row:hover h2,.nb-post-row:hover h3{color:var(--ultra);}
.nb-post-row .cat{font-size:11px;font-weight:600;letter-spacing:.1em;text-transform:uppercase;color:var(--gray);}
@media(max-width:680px){.nb-post-row{grid-template-columns:1fr;gap:8px;}}

/* ─────────────── Artículo / página ─────────────── */
.nb-article-head{padding:clamp(140px,16vw,200px) 0 clamp(50px,6vw,80px);}
.nb-article-head h1{font-size:clamp(34px,5vw,64px);letter-spacing:-.04em;max-width:20ch;}
.nb-article-meta{display:flex;gap:18px;margin-top:26px;font-size:12px;font-weight:600;letter-spacing:.1em;text-transform:uppercase;color:var(--gray);}
.nb-prose{max-width:720px;}
.nb-prose>*+*{margin-top:1.4em;}
.nb-prose p{font-size:16.5px;line-height:1.9;color:#33363c;}
.nb-prose h2{font-size:clamp(24px,2.6vw,32px);margin-top:2em;}
.nb-prose h3{font-size:clamp(19px,2vw,24px);margin-top:1.8em;}
.nb-prose a{color:var(--ultra);border-bottom:1px solid rgba(31,59,255,.3);}
.nb-prose blockquote{font-family:var(--serif);font-weight:300;font-size:clamp(21px,2.4vw,27px);line-height:1.5;padding-left:28px;border-left:2px solid var(--ultra);color:var(--ink);}
.nb-prose ul,.nb-prose ol{padding-left:1.3em;}
.nb-prose li{margin-top:.5em;font-size:16px;line-height:1.8;color:#33363c;}
.nb-prose li::marker{color:var(--ultra);}
.nb-prose img{border-radius:var(--r);}
.nb-prose strong{font-weight:600;}

/* ─────────────── Formularios ─────────────── */
.nb-form{max-width:680px;}
.nb-form-row{display:grid;grid-template-columns:1fr 1fr;gap:22px;}
@media(max-width:640px){.nb-form-row{grid-template-columns:1fr;}}
.nb-field{margin-bottom:24px;}
.nb-field label{display:block;font-size:11px;font-weight:600;letter-spacing:.12em;text-transform:uppercase;color:var(--gray);margin-bottom:9px;}
.nb-field input,.nb-field textarea{
  width:100%;background:transparent;border:0;border-bottom:1px solid var(--line);
  padding:10px 0 14px;font-family:var(--sans);font-size:16px;color:var(--ink);
  transition:border-color .3s;border-radius:0;
}
.on-ink .nb-field input,.on-ink .nb-field textarea{color:var(--paper);border-color:var(--line-dark);}
.nb-field input:focus,.nb-field textarea:focus{outline:none;border-color:var(--ultra);}
.nb-field textarea{resize:vertical;min-height:120px;}
.nb-form-ok{
  background:var(--white);border:1px solid var(--line);border-left:3px solid var(--ultra);
  border-radius:12px;padding:20px 24px;font-size:14.5px;margin-bottom:32px;
}
.on-ink .nb-form-ok{background:var(--ink-2);border-color:var(--line-dark);border-left-color:var(--ultra);color:var(--paper);}
.nb-hp{position:absolute;left:-9999px;opacity:0;height:0;overflow:hidden;}

/* ─────────────── CTA global ─────────────── */
.nb-cta{background:var(--ink);color:var(--paper);padding:clamp(100px,13vw,170px) 0;text-align:center;position:relative;overflow:hidden;}
.nb-cta::before{
  content:'';position:absolute;inset:-20%;
  background:radial-gradient(ellipse 40% 44% at 50% 60%, rgba(31,59,255,.14) 0%, transparent 70%);
}
.nb-cta-inner{position:relative;}
.nb-cta h2{font-size:clamp(30px,4.5vw,56px);letter-spacing:-.04em;color:var(--paper);max-width:22ch;margin:0 auto;}
.nb-cta .nb-btn{margin-top:44px;}

/* ─────────────── Footer ─────────────── */
.nb-footer{background:var(--ink);color:var(--paper);border-top:1px solid var(--line-dark);padding:clamp(60px,8vw,100px) 0 40px;}
.nb-footer-top{display:grid;grid-template-columns:1.6fr 1fr 1fr 1fr;gap:clamp(30px,4vw,60px);padding-bottom:clamp(50px,6vw,80px);}
.nb-footer .nb-wordmark{font-size:clamp(38px,5vw,58px);}
.nb-footer-tag{margin-top:16px;font-size:11px;font-weight:600;letter-spacing:.16em;text-transform:uppercase;color:rgba(245,243,238,.35);}
.nb-footer h4{font-size:11px;font-weight:600;letter-spacing:.16em;text-transform:uppercase;color:rgba(245,243,238,.35);margin-bottom:20px;}
.nb-footer ul{list-style:none;}
.nb-footer li{margin-bottom:10px;}
.nb-footer a{font-size:14px;color:rgba(245,243,238,.72);transition:color .25s;}
.nb-footer a:hover{color:var(--paper);}
.nb-footer address{font-size:13.5px;line-height:1.8;color:rgba(245,243,238,.5);font-style:normal;margin-bottom:18px;}
.nb-footer address strong{display:block;color:rgba(245,243,238,.85);font-weight:600;font-size:12px;letter-spacing:.06em;text-transform:uppercase;margin-bottom:4px;}
.nb-footer-bottom{
  border-top:1px solid var(--line-dark);padding-top:28px;
  display:flex;justify-content:space-between;align-items:center;gap:18px;flex-wrap:wrap;
  font-size:12px;color:rgba(245,243,238,.35);
}
@media(max-width:960px){.nb-footer-top{grid-template-columns:1fr 1fr;}}
@media(max-width:560px){.nb-footer-top{grid-template-columns:1fr;}}

/* ─────────────── 404 ─────────────── */
.nb-404{min-height:100svh;background:var(--ink);color:var(--paper);display:flex;align-items:center;text-align:left;}
.nb-404 .code{font-size:clamp(90px,18vw,220px);font-weight:600;letter-spacing:-.06em;line-height:1;color:var(--paper);}
.nb-404 .code .nb-dot{color:var(--ultra);}
.nb-404 p{margin-top:20px;color:rgba(245,243,238,.55);max-width:440px;font-size:16px;line-height:1.8;}

/* ─────────────── Paginación / misc ─────────────── */
.nb-pagination{display:flex;gap:8px;margin-top:56px;}
.nb-pagination .page-numbers{
  min-width:42px;height:42px;display:inline-flex;align-items:center;justify-content:center;
  border:1px solid var(--line);border-radius:50%;font-size:13px;font-weight:600;transition:all .3s;
}
.nb-pagination .page-numbers.current,.nb-pagination .page-numbers:hover{background:var(--ink);color:var(--paper);border-color:var(--ink);}
.nb-back{margin-bottom:30px;display:inline-flex;}
.nb-enter{animation:nbPageIn .7s var(--ease);}
@keyframes nbPageIn{from{opacity:0;}to{opacity:1;}}
.screen-reader-text{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);}

/* ═══════════════════════════════════════════════════════════
   v2 — componentes nuevos
   ═══════════════════════════════════════════════════════════ */

/* ── Titulares con revelado por palabra ── */
.nb-words .w{display:inline-block;overflow:hidden;vertical-align:top;}
.nb-words .w>span{display:inline-block;transform:translateY(112%);transition:transform 1s var(--ease);}
.nb-words.on .w>span{transform:none;}
@media(prefers-reduced-motion:reduce){.nb-words .w>span{transform:none!important;}}

/* ── Marquee vertical de clientes: 4 columnas, bordes difuminados ── */
.nb-vmarquee{
  display:grid;grid-template-columns:repeat(4,1fr);gap:clamp(14px,1.8vw,24px);
  height:clamp(440px,58vh,620px);overflow:hidden;
  mask-image:linear-gradient(to bottom,transparent,black 16%,black 84%,transparent);
  -webkit-mask-image:linear-gradient(to bottom,transparent,black 16%,black 84%,transparent);
}
.nb-vcol{display:flex;flex-direction:column;gap:clamp(14px,1.8vw,24px);animation:nbVUp var(--vdur,26s) linear infinite;will-change:transform;}
.nb-vcol.rev{animation-name:nbVDown;}
.nb-vmarquee:hover .nb-vcol{animation-play-state:paused;}
@keyframes nbVUp{to{transform:translateY(-50%);}}
@keyframes nbVDown{from{transform:translateY(-50%);}to{transform:translateY(0);}}
.nb-vitem{
  background:var(--white);border:1px solid var(--line);border-radius:14px;
  min-height:110px;display:flex;align-items:center;justify-content:center;padding:24px;
  font-size:15px;font-weight:500;letter-spacing:-.01em;color:var(--gray);text-align:center;
  transition:border-color .3s,color .3s;
}
.nb-vitem:hover{border-color:var(--ultra);color:var(--ink);}
.nb-vitem img{max-height:44px;width:auto;filter:grayscale(1);opacity:.65;transition:filter .3s,opacity .3s;}
.nb-vitem:hover img{filter:none;opacity:1;}
@media(max-width:760px){.nb-vmarquee{grid-template-columns:repeat(2,1fr);height:420px;}.nb-vcol:nth-child(n+3){display:none;}}
@media(prefers-reduced-motion:reduce){.nb-vcol{animation:none;}}

/* ── Scroll horizontal (vertical → horizontal → vertical) ── */
.nb-hscroll{position:relative;}
.nb-hscroll-sticky{position:sticky;top:0;height:100svh;overflow:hidden;display:flex;align-items:center;}
.nb-hscroll-track{display:flex;gap:clamp(20px,3vw,44px);padding:0 var(--pad);will-change:transform;}
.nb-hpanel{flex:0 0 auto;width:min(520px,78vw);}
.nb-hpanel.intro{width:min(440px,74vw);display:flex;flex-direction:column;justify-content:center;}
.nb-hpanel.last{display:flex;align-items:center;justify-content:center;width:min(420px,70vw);}
.nb-hscroll-progress{
  position:absolute;left:var(--pad);right:var(--pad);bottom:34px;height:1px;background:var(--line-dark);
}
.nb-hscroll-progress i{position:absolute;left:0;top:-1.5px;width:0;height:4px;border-radius:2px;background:var(--ultra);transition:width .1s linear;}
@media(max-width:1023px),(prefers-reduced-motion:reduce){
  .nb-hscroll{height:auto!important;}
  .nb-hscroll-sticky{position:static;height:auto;overflow-x:auto;padding:20px 0;scroll-snap-type:x mandatory;}
  .nb-hscroll-track{transform:none!important;}
  .nb-hpanel{scroll-snap-align:center;}
  .nb-hscroll-progress{display:none;}
}

/* ── Tarjetas apiladas (stack pegajoso) ── */
.nb-stack{display:flex;flex-direction:column;gap:clamp(18px,3vw,30px);}
.nb-stack-card{
  position:sticky;background:var(--white);border:1px solid var(--line);border-radius:var(--r);
  padding:clamp(34px,4.5vw,60px);display:grid;grid-template-columns:1fr 1.4fr;gap:clamp(20px,4vw,60px);
  align-items:start;will-change:transform;transform-origin:top center;
}
.nb-stack-card.dark{background:var(--ink);border-color:var(--ink);color:var(--paper);}
.nb-stack-card.dark h3{color:var(--paper);}
.nb-stack-card.dark p{color:rgba(245,243,238,.6);}
.nb-stack-card .nb-cap-n{margin-bottom:18px;}
.nb-stack-card h3{font-size:clamp(24px,2.8vw,36px);letter-spacing:-.03em;}
.nb-stack-card p{font-size:15px;line-height:1.85;color:var(--gray-2);}
.nb-stack-card p+p{margin-top:14px;}
.nb-stack-card .tagline{margin-top:20px;font-size:11px;font-weight:600;letter-spacing:.14em;text-transform:uppercase;color:var(--ultra);}
@media(max-width:760px){.nb-stack-card{grid-template-columns:1fr;gap:14px;}}

/* ── Cinta de texto gigante ── */
.nb-strip{overflow:hidden;border-top:1px solid var(--line);border-bottom:1px solid var(--line);padding:clamp(20px,3vw,34px) 0;background:var(--paper);}
.on-ink .nb-strip,.nb-strip.dark{border-color:var(--line-dark);background:var(--ink);}
.nb-strip-track{display:flex;gap:70px;width:max-content;animation:nbMarquee 30s linear infinite;align-items:baseline;}
.nb-strip span{
  font-size:clamp(44px,7vw,96px);font-weight:600;letter-spacing:-.045em;line-height:1;white-space:nowrap;
  color:transparent;-webkit-text-stroke:1px rgba(20,21,24,.6);
}
.nb-strip.dark span{-webkit-text-stroke:1px rgba(245,243,238,.4);}
.nb-strip span.solid{color:var(--ink);-webkit-text-stroke:0;}
.nb-strip.dark span.solid{color:var(--paper);}
.nb-strip span .nb-dot{color:var(--ultra);-webkit-text-stroke:0;}

/* ── Progreso de lectura: la línea y el punto ── */
.nb-progress{position:fixed;top:0;left:0;right:0;height:2px;z-index:990;pointer-events:none;}
.nb-progress i{display:block;height:100%;width:0;background:var(--ultra);}

/* ── Panel de caso dentro del scroll horizontal ── */
.nb-hpanel .nb-case-media{aspect-ratio:4/3;}
.nb-hpanel h3{font-size:clamp(18px,1.8vw,22px);}

/* ── Grid de disciplinas / herramientas ── */
.nb-mini-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:1px;background:var(--line);border:1px solid var(--line);border-radius:var(--r);overflow:hidden;}
.nb-mini{background:var(--paper);padding:32px 28px;transition:background .35s;}
.nb-mini:hover{background:var(--white);}
.nb-mini h4{font-size:16px;letter-spacing:-.02em;margin-bottom:10px;display:flex;align-items:center;gap:9px;}
.nb-mini h4::before{content:'';width:5px;height:5px;border-radius:50%;background:var(--ultra);flex-shrink:0;}
.nb-mini p{font-size:13px;line-height:1.75;color:var(--gray-2);}
@media(max-width:960px){.nb-mini-grid{grid-template-columns:repeat(2,1fr);}}
@media(max-width:540px){.nb-mini-grid{grid-template-columns:1fr;}}

/* ── Botón magnético ── */
.nb-btn{will-change:transform;}