/* ═══════════════════════════════════════════════════════════════
   CONCIENCIA LAB — "EL CAMPO"
   La web es un organismo vivo: un campo de partículas (cada punto,
   una persona) que cambia de conducta según la sección.
   Paleta: navy #0F2C4D · cyan #3DBEDD · cream #F8F4EC · oro #E9B15C
   Sin JS o con prefers-reduced-motion → documento estático legible.
   ═══════════════════════════════════════════════════════════════ */

:root{
  --bg:        #060E1B;
  --bg-2:      #081A2E;
  --navy:      #0F2C4D;
  --cyan:      #3DBEDD;
  --cyan-soft: #D6F1F8;
  --cream:     #F8F4EC;
  --oro:       #E9B15C;
  --ink:       #1A2A3D;
  --muted-l:   #5A6B7B;
  --muted-d:   #93A7BC;
  --line-d:    rgba(214,241,248,.12);
  --line-l:    #C9D4DF;
  --ok:        #1E8A5B;
  --warn:      #B57E10;
  --ff-head:   'Space Grotesk', system-ui, sans-serif;
  --ff-body:   'Inter', system-ui, sans-serif;
  --ff-quote:  'Fraunces', Georgia, serif;
  --wrap:      1180px;
  --r:         8px;
}

*,*::before,*::after{ box-sizing:border-box; margin:0; padding:0; }
html{ scroll-behavior:smooth; }
html.lenis{ height:auto; scroll-behavior:auto; }
.lenis.lenis-smooth{ scroll-behavior:auto!important; }

body{
  background:var(--bg);
  color:var(--cream);
  font-family:var(--ff-body);
  font-size:clamp(1rem, .95rem + .25vw, 1.125rem);
  line-height:1.65;
  -webkit-font-smoothing:antialiased;
  overflow-x:hidden;
}

img{ max-width:100%; display:block; }
a{ color:inherit; }
::selection{ background:var(--cyan); color:var(--bg); }

.wrap{ max-width:var(--wrap); margin-inline:auto; padding-inline:clamp(1.25rem,4vw,2.5rem); }

.skip{ position:absolute; left:-999px; top:0; z-index:300; background:var(--cyan); color:var(--bg); padding:.6rem 1rem; font-weight:600; }
.skip:focus{ left:0; }
:focus-visible{ outline:2px solid var(--cyan); outline-offset:3px; border-radius:2px; }

/* ── CAPAS GLOBALES ────────────────────────────────────────── */
#field{ position:fixed; inset:0; z-index:0; pointer-events:none; }
.grain{ position:fixed; inset:-40px; z-index:2; pointer-events:none; opacity:0; mix-blend-mode:overlay; }
html.motion .grain{ opacity:.07; animation:grainShift 1.2s steps(2) infinite; }
@keyframes grainShift{ 0%{transform:translate(0,0)} 50%{transform:translate(14px,-9px)} 100%{transform:translate(-11px,7px)} }

header, main, footer{ position:relative; z-index:3; }

.progress{ position:fixed; top:0; left:0; right:0; height:2px; z-index:150; pointer-events:none; }
.progress span{ display:block; height:100%; width:100%; background:linear-gradient(90deg,var(--cyan),var(--oro)); transform:scaleX(0); transform-origin:left; }

/* cursor custom (solo desktop + motion) */
.cursor,.cursor-ring{ display:none; }
@media (hover:hover) and (pointer:fine){
  html.motion .cursor{ display:block; position:fixed; z-index:160; width:8px; height:8px; border-radius:50%; background:var(--cyan); pointer-events:none; transform:translate(-50%,-50%); }
  html.motion .cursor-ring{ display:block; position:fixed; z-index:159; width:38px; height:38px; border-radius:50%; border:1px solid rgba(61,190,221,.55); pointer-events:none; transform:translate(-50%,-50%); transition:width .25s ease, height .25s ease, border-color .25s ease; }
  html.motion .cursor-ring.on{ width:64px; height:64px; border-color:var(--oro); }
  html.motion{ cursor:none; }
  html.motion a, html.motion button{ cursor:none; }
}

/* ── PRELOADER ─────────────────────────────────────────────── */
.loader{
  position:fixed; inset:0; z-index:200; background:var(--bg);
  display:flex; flex-direction:column; align-items:center; justify-content:center; gap:1.6rem;
  opacity:0; pointer-events:none; visibility:hidden;
}
html.motion .loader{ opacity:1; pointer-events:all; visibility:visible; }
html.motion .loader{ animation:loaderKill .3s 3.2s forwards; } /* red de seguridad */
@keyframes loaderKill{ to{ opacity:0; visibility:hidden; pointer-events:none; } }
.loader-mark{ width:76px; height:76px; }
.ld-hex{ stroke-dasharray:160; stroke-dashoffset:160; }
.ld-eye{ stroke-dasharray:70; stroke-dashoffset:70; }
.ld-dot{ opacity:0; }
.loader-words{ position:relative; height:1.4em; overflow:hidden; font-family:var(--ff-head); letter-spacing:.34em; text-transform:uppercase; font-size:.76rem; color:var(--muted-d); text-align:center; width:16ch; }
.loader-words span{ position:absolute; inset:0; opacity:0; }

/* ── Tipografía ────────────────────────────────────────────── */
h1,h2,h3{ font-family:var(--ff-head); font-weight:600; line-height:1.05; letter-spacing:-.02em; }
h2{ font-size:clamp(2rem, 1.2rem + 3.8vw, 3.8rem); max-width:21ch; margin-bottom:clamp(1.2rem,3vw,1.8rem); }
h2 em, h1 em{ font-family:var(--ff-quote); font-style:italic; font-weight:400; color:var(--cyan); letter-spacing:0; }
h3{ font-size:clamp(1.15rem, 1rem + .6vw, 1.5rem); }

.lead{ font-size:clamp(1.05rem, 1rem + .4vw, 1.3rem); color:var(--cyan-soft); max-width:56ch; margin-bottom:1.1rem; }
.lead b{ color:var(--cream); }
.body{ color:var(--muted-d); max-width:56ch; }
.body b{ color:var(--cream); }
.lead-dark{ color:var(--muted-l); }
.lead-dark b{ color:var(--ink); }
.h-dark{ color:var(--ink); }

.kicker{
  display:flex; align-items:center; gap:.85rem;
  font-family:var(--ff-head); font-size:.8rem; font-weight:600;
  letter-spacing:.22em; text-transform:uppercase; color:var(--cyan);
  margin-bottom:clamp(1.4rem,3vw,2.2rem);
}
.kicker::after{ content:""; flex:0 0 clamp(3rem,8vw,6rem); height:2px; background:var(--cyan); opacity:.65; }
.knum{ border:1px solid var(--cyan); border-radius:var(--r); padding:.2rem .5rem; font-size:.75rem; }
.kicker-d{ color:#177E9C; }
.kicker-d .knum{ border-color:#177E9C; }
.kicker-d::after{ background:#177E9C; }

/* ── Botones ───────────────────────────────────────────────── */
.btn{
  display:inline-flex; align-items:center; gap:.6rem;
  font-family:var(--ff-head); font-weight:600; font-size:1rem;
  color:var(--bg); background:var(--cyan);
  padding:.95rem 1.6rem; border-radius:var(--r); text-decoration:none;
  transition:transform .25s ease, box-shadow .25s ease, background .25s ease;
}
.btn:hover{ transform:translateY(-2px); background:#5FD0EA; box-shadow:0 12px 34px rgba(61,190,221,.28); }
.btn-sm{ padding:.55rem 1.05rem; font-size:.9rem; }
.btn-lg{ padding:1.15rem 2.1rem; font-size:1.1rem; }

/* ── NAV ───────────────────────────────────────────────────── */
.nav{ position:fixed; inset-inline:0; top:0; z-index:110; transition:background .35s, border-color .35s; border-bottom:1px solid transparent; }
.nav.scrolled{ background:rgba(6,14,27,.8); backdrop-filter:blur(14px); border-bottom-color:var(--line-d); }
.nav-in{ display:flex; align-items:center; justify-content:space-between; gap:1rem; padding-block:.9rem; }
.brand{ display:inline-flex; align-items:center; gap:.6rem; text-decoration:none; color:var(--cream); }
.brand-mark{ width:30px; height:30px; color:var(--cyan); flex:none; }
.brand-word{ font-family:var(--ff-head); font-weight:700; font-size:1.02rem; letter-spacing:.06em; }
.brand-word b{ color:var(--cyan); }
.nav-links{ display:flex; gap:clamp(1rem,2.5vw,2rem); }
.nav-links a{ font-size:.92rem; color:var(--muted-d); text-decoration:none; transition:color .2s; }
.nav-links a:hover{ color:var(--cyan-soft); }
@media (max-width:820px){ .nav-links{ display:none; } }

/* ── HERO ──────────────────────────────────────────────────── */
.hero{ position:relative; min-height:100svh; display:flex; align-items:center; }
.hero-in{ width:100%; padding-block:9rem 7rem; }
.eyebrow{ font-family:var(--ff-head); font-size:.82rem; font-weight:600; letter-spacing:.26em; text-transform:uppercase; color:var(--cyan); margin-bottom:1.6rem; }
.hero-title{ font-size:clamp(2.7rem, 1.3rem + 7vw, 6.6rem); max-width:14ch; margin-bottom:1.7rem; }
.line{ display:block; overflow:hidden; padding-bottom:.06em; margin-bottom:-.06em; }
.line-in, .line-in-dot{ display:inline-block; }
.slot{ display:inline-block; overflow:hidden; vertical-align:bottom; }
.slot-in{ display:inline-block; font-family:var(--ff-quote); font-style:italic; font-weight:400; color:var(--cyan); }
.hero-lead{ font-size:clamp(1.05rem, 1rem + .5vw, 1.35rem); color:var(--cyan-soft); max-width:52ch; margin-bottom:2.2rem; }
.hero-cta{ display:flex; gap:1rem; flex-wrap:wrap; }
.hero-foot{ position:absolute; inset-inline:0; bottom:0; border-top:1px solid var(--line-d); }
.hero-foot-in{ display:flex; justify-content:space-between; gap:1rem; padding-block:1rem; flex-wrap:wrap; }
.chrome{ font-family:var(--ff-head); font-size:.72rem; font-weight:600; letter-spacing:.3em; text-transform:uppercase; color:var(--muted-d); }

/* ── MARQUEE ───────────────────────────────────────────────── */
.marquee{ overflow:hidden; border-block:1px solid var(--line-d); padding-block:.9rem; background:rgba(6,14,27,.4); }
.mq-track{ display:flex; white-space:nowrap; width:max-content; }
.mq-track span{
  font-family:var(--ff-head); font-size:.85rem; font-weight:500;
  letter-spacing:.24em; text-transform:uppercase; color:var(--muted-d); padding-right:2rem;
}
html.motion .mq-track{ animation:mq 46s linear infinite; }
html.motion .mq-rev .mq-track{ animation-direction:reverse; }
@keyframes mq{ to{ transform:translateX(-50%); } }

/* ── AXIOMA ────────────────────────────────────────────────── */
.axioma{ padding-block:clamp(6rem,16vh,10rem); }
.q-hero{ max-width:900px; margin-inline:auto; text-align:center; }
.q-hero p{ font-family:var(--ff-quote); font-style:italic; font-weight:300; font-size:clamp(1.7rem, 1.1rem + 3.2vw, 3.4rem); line-height:1.28; color:var(--cream); }
.q-hero em{ color:var(--cyan); }
.q-hero cite{ display:block; margin-top:1.4rem; font-style:normal; font-family:var(--ff-head); font-size:.78rem; letter-spacing:.24em; text-transform:uppercase; color:var(--muted-d); }
.q-left{ text-align:left; margin-inline:0; }
html.motion .axw{ opacity:.13; }   /* palabras: el scroll las enciende */

/* ── FACES (puente humano) ─────────────────────────────────── */
.faces{ position:relative; padding-bottom:clamp(3rem,8vh,5rem); }
.faces-fig{ position:relative; height:min(80vh,780px); overflow:hidden; }
.faces-fig img{ width:100%; height:100%; object-fit:cover; object-position:center 30%; }
.faces-veil{ position:absolute; inset:0; background:linear-gradient(180deg, var(--bg) 0%, transparent 28%, transparent 55%, var(--bg) 100%); }
.faces-cap{ margin-top:-.5rem; position:relative; }
.faces-n{ color:var(--muted-d); font-size:clamp(1rem,.95rem+.4vw,1.2rem); }
.faces-n b{ display:block; font-family:var(--ff-head); font-weight:700; color:var(--cream); font-size:clamp(3rem, 2rem + 6vw, 6rem); line-height:1; letter-spacing:-.03em; }
.faces-q{ font-family:var(--ff-quote); font-style:italic; font-size:clamp(1.4rem, 1.1rem + 1.8vw, 2.4rem); color:var(--cream); margin-top:.6rem; }
.faces-q em{ color:var(--cyan); }

/* ── SECCIONES ─────────────────────────────────────────────── */
.sec{ padding-block:clamp(5rem,12vh,8.5rem); position:relative; }
.sec-deep{ background:linear-gradient(180deg, transparent, rgba(8,26,46,.85) 12%, rgba(8,26,46,.85) 88%, transparent); }

.cols{ display:grid; grid-template-columns:7fr 5fr; gap:clamp(2rem,5vw,4.5rem); align-items:center; }
@media (max-width:880px){ .cols{ grid-template-columns:1fr; } }

.frame{ border-radius:var(--r); overflow:hidden; border:1px solid var(--line-d); background:var(--bg-2); }
.frame img{ width:100%; height:100%; object-fit:cover; }
.ratio-34{ aspect-ratio:3/4; }
.ratio-11{ aspect-ratio:1/1; }
.ratio-32{ aspect-ratio:3/2; }
.ratio-169{ aspect-ratio:16/9; }
figcaption{ margin-top:.9rem; font-family:var(--ff-quote); font-style:italic; color:var(--muted-d); font-size:1rem; }
figcaption em{ color:var(--cyan); }

/* reveal de imagen por máscara */
html.motion .reveal-img .frame img, html.motion .faces-fig img, html.motion .met-fig img{ transform:scale(1.18); }
html.motion .reveal-img, html.motion .faces-fig{ }
html.motion .reveal-img .frame, html.motion .faces-fig{ clip-path:inset(12% 6% 12% 6% round 8px); }

/* ── GESTOS (scrollytelling) ───────────────────────────────── */
.gestos-act{ position:relative; }
.gestos-pin{ padding-block:clamp(4rem,10vh,7rem); }
.gestos-h{ margin-bottom:clamp(2rem,5vh,3rem); }
.gesto-stages{ position:relative; }
.gesto-stage{ padding-block:1.6rem; border-top:1px solid var(--line-d); }
.g-name{
  font-family:var(--ff-head); font-weight:700; letter-spacing:.06em;
  font-size:clamp(2.4rem, 1.4rem + 5.5vw, 5.4rem); line-height:1;
  color:var(--cream); display:block; margin-bottom:.6rem;
}
.g-say{ font-family:var(--ff-quote); font-style:italic; color:var(--cyan); font-size:clamp(1.15rem, 1rem + 1vw, 1.7rem); margin-bottom:.5rem; }
.g-mean{ color:var(--muted-d); max-width:52ch; }
.g-mean b{ color:var(--cream); }
.g-dots{ display:flex; gap:.45rem; margin-top:1rem; }
.g-dots i{ width:10px; height:10px; border-radius:50%; background:var(--cyan); opacity:.9; box-shadow:0 0 14px rgba(61,190,221,.5); }

/* modo cine (con motion): estados superpuestos, el pin los crossfadea */
html.motion .gestos-pin{ min-height:100svh; display:flex; align-items:center; }
html.motion .gestos-in{ width:100%; }
html.motion .gesto-stages{ min-height:46vh; }
html.motion .gesto-stage{ position:absolute; inset:0; border-top:0; opacity:0; visibility:hidden; }

/* ── DIVISORIA ─────────────────────────────────────────────── */
.divisoria .versus{ margin-top:clamp(2rem,4vw,3rem); border-top:1px solid var(--line-d); position:relative; }
.vs-scan{ position:absolute; left:50%; top:0; bottom:0; width:1px; background:linear-gradient(180deg, transparent, var(--cyan) 18%, var(--cyan) 82%, transparent); transform:scaleY(0); transform-origin:top; }
@media (max-width:640px){ .vs-scan{ display:none; } }
.vs-head,.vs-row{ display:grid; grid-template-columns:1fr 1fr; gap:clamp(1rem,3vw,3rem); padding-block:1.05rem; border-bottom:1px solid var(--line-d); }
.vs-head{ font-family:var(--ff-head); font-size:.78rem; font-weight:600; letter-spacing:.22em; text-transform:uppercase; color:var(--muted-d); }
.vs-head .vs-clab{ color:var(--cyan); }
.vs-old{ color:var(--muted-d); position:relative; align-self:center; }
.vs-old::after{ content:""; position:absolute; left:0; top:.78em; height:1.5px; width:0; background:var(--muted-d); opacity:.85; }
.vs-new{ color:var(--cream); }
.vs-new b{ color:var(--cyan); font-weight:600; position:relative; }
html.motion .vs-row.on .vs-old::after{ width:100%; transition:width .7s cubic-bezier(.7,0,.2,1) .1s; }
html.motion .vs-row{ opacity:.25; transform:translateX(-14px); transition:opacity .6s ease, transform .6s ease; }
html.motion .vs-row.on{ opacity:1; transform:none; }
@media (max-width:640px){
  .vs-head{ display:none; }
  .vs-row{ grid-template-columns:1fr; gap:.35rem; }
  .vs-old{ font-size:.9rem; }
}
.q-close{ margin-top:clamp(2.2rem,5vw,3.2rem); font-family:var(--ff-quote); font-style:italic; font-size:clamp(1.5rem, 1rem + 2.6vw, 2.8rem); color:var(--cream); }
.q-close em{ color:var(--cyan); }

/* ── UNIVERSOS (travelling) ────────────────────────────────── */
.uni-act{ padding-top:clamp(5rem,12vh,8.5rem); }
.uni-head{ margin-bottom:clamp(2rem,5vh,3rem); }
.uni-hint{ font-family:var(--ff-head); font-size:.78rem; letter-spacing:.26em; text-transform:uppercase; color:var(--cyan); opacity:.8; }
.uni-track{ display:block; }
.uni-panel{ position:relative; min-height:72vh; display:flex; align-items:center; padding:clamp(2rem,6vw,5rem); border-top:1px solid var(--line-d); overflow:hidden; }
.u-ghost{
  position:absolute; right:-2vw; top:50%; transform:translateY(-50%);
  font-family:var(--ff-head); font-weight:700; line-height:1;
  font-size:clamp(11rem, 34vw, 30rem); color:rgba(61,190,221,.05);
  pointer-events:none; user-select:none;
}
.u-body{ position:relative; max-width:560px; margin-inline:auto; }
.u-body h3{ font-size:clamp(1.9rem, 1.3rem + 3vw, 3.4rem); margin-bottom:.5rem; }
.u-tag{ font-family:var(--ff-quote); font-style:italic; color:var(--cyan); font-size:clamp(1.1rem, 1rem + .8vw, 1.5rem); margin-bottom:1rem; }
.u-txt{ color:var(--muted-d); margin-bottom:1.4rem; }
.u-txt em{ color:var(--cyan-soft); }
.u-txt b{ color:var(--cream); }
.badge{
  display:inline-block; font-family:var(--ff-head); font-size:.72rem; font-weight:600;
  letter-spacing:.14em; text-transform:uppercase; color:var(--cyan);
  border:1px solid rgba(61,190,221,.4); border-radius:999px; padding:.35rem .8rem;
}

/* modo travelling (desktop + motion): lo activa el JS con estilos inline;
   estas reglas solo dan el esqueleto flex */
html.motion.uni-h .uni-wrap{ overflow:hidden; }
html.motion.uni-h .uni-track{ display:flex; width:max-content; }
html.motion.uni-h .uni-panel{ width:100vw; min-height:100vh; border-top:0; flex:none; }

/* ── ESCALERA ──────────────────────────────────────────────── */
.escalera-act{ padding-block:clamp(4rem,10vh,7rem); text-align:center; }
.esc-title{ margin-bottom:1.6rem; }
.escalera{ list-style:none; display:flex; flex-wrap:wrap; justify-content:center; gap:.5rem .4rem; margin-bottom:1rem; }
.escalera li{ font-family:var(--ff-head); font-size:clamp(.85rem,.8rem+.4vw,1.05rem); font-weight:500; color:var(--cyan-soft); display:flex; align-items:center; gap:.4rem; }
.escalera li:not(:last-child)::after{ content:"→"; color:var(--muted-d); opacity:.7; }
html.motion .escalera li{ opacity:.25; }
.esc-voto{
  font-family:var(--ff-head); font-weight:700; line-height:.95; letter-spacing:-.02em;
  font-size:clamp(4.5rem, 2rem + 16vw, 13rem);
  color:transparent; -webkit-text-stroke:1.5px rgba(61,190,221,.85);
  transition:color .9s ease;
}
.esc-voto.filled{ color:var(--cyan); }
.esc-note{ margin-top:1.2rem; color:var(--muted-d); max-width:64ch; margin-inline:auto; }
.esc-note b{ color:var(--cream); }

/* ── MÉTODO (sticky stack) ─────────────────────────────────── */
.met-layout{ display:block; }
.met-visual{ display:none; }
.met-step{ padding-block:clamp(2rem,5vh,3rem); border-top:1px solid var(--line-d); max-width:640px; }
.met-step h3{ display:flex; align-items:baseline; gap:.8rem; margin-bottom:.8rem; font-size:clamp(1.4rem, 1.1rem + 1.4vw, 2.1rem); }
.mnum{ font-family:var(--ff-head); color:var(--cyan); font-size:.95rem; font-weight:700; letter-spacing:.1em; }
.met-step p{ color:var(--muted-d); }
.met-step b{ color:var(--cream); }
.met-fig{ margin-bottom:1.2rem; border-radius:var(--r); overflow:hidden; border:1px solid var(--line-d); aspect-ratio:16/10; }
.met-fig img{ width:100%; height:100%; object-fit:cover; }
.met-loop{ margin-top:clamp(2rem,4vw,3rem); font-family:var(--ff-quote); font-style:italic; color:var(--cyan); font-size:clamp(1.2rem, 1rem + 1vw, 1.7rem); }

@media (min-width:960px){
  html.motion .met-layout{ display:grid; grid-template-columns:5fr 6fr; gap:clamp(2rem,5vw,4rem); align-items:start; }
  html.motion .met-visual{ display:block; position:sticky; top:14vh; }
  html.motion .met-stack{ position:relative; aspect-ratio:4/5; border-radius:var(--r); overflow:hidden; border:1px solid var(--line-d); box-shadow:0 30px 80px rgba(0,0,0,.45); }
  html.motion .met-stack .mimg{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; opacity:0; transform:scale(1.06); transition:opacity .7s ease, transform 1.2s ease; }
  html.motion .met-stack .mimg.active{ opacity:1; transform:scale(1); }
  html.motion .met-steps .met-fig{ display:none; }
  html.motion .met-step{ opacity:.3; transition:opacity .5s ease; min-height:38vh; display:flex; flex-direction:column; justify-content:center; }
  html.motion .met-step.on{ opacity:1; }
}

/* ── LA PRUEBA (papel) ─────────────────────────────────────── */
.paper{ background:var(--cream); color:var(--ink); }
.paper h2{ color:var(--ink); }
.paper h2 em{ color:#177E9C; }

.report{
  background:#fff; border:1px solid var(--line-l); border-radius:var(--r);
  box-shadow:0 30px 90px rgba(15,44,77,.18);
  padding:clamp(1.4rem,3.5vw,2.4rem);
  margin-block:clamp(2rem,4vw,3rem) 2rem;
}
html.motion .report{ opacity:0; transform:perspective(1400px) rotateX(8deg) translateY(60px); }
.rep-head{
  display:flex; justify-content:space-between; gap:1rem; flex-wrap:wrap;
  font-family:var(--ff-head); font-size:.75rem; font-weight:600;
  letter-spacing:.18em; text-transform:uppercase; color:var(--muted-l);
  border-bottom:2px solid var(--navy); padding-bottom:.9rem; margin-bottom:1.4rem;
}
.kpis{ display:grid; grid-template-columns:repeat(4,1fr); gap:1rem; margin-bottom:1.8rem; }
@media (max-width:960px){ .kpis{ grid-template-columns:repeat(2,1fr); } }
@media (max-width:560px){ .kpis{ grid-template-columns:1fr; } }
.kpi{ border:1px solid var(--line-l); border-left:4px solid var(--ok); border-radius:var(--r); padding:1rem 1.1rem; display:flex; flex-direction:column; gap:.3rem; background:#fff; }
.kpi.warn{ border-left-color:var(--warn); }
.kpi-label{ display:flex; justify-content:space-between; align-items:center; font-family:var(--ff-head); font-size:.72rem; font-weight:600; letter-spacing:.16em; text-transform:uppercase; color:var(--muted-l); }
.kpi-label i{ font-style:normal; font-weight:700; color:var(--ok); }
.kpi.warn .kpi-label i{ color:var(--warn); }
.kpi-val{ font-family:var(--ff-head); font-weight:700; font-size:clamp(1.2rem, 1.05rem + .8vw, 1.6rem); color:var(--ink); letter-spacing:-.01em; }
.kpi-val b{ font-weight:700; }
.kpi-note{ font-size:.85rem; color:var(--muted-l); line-height:1.45; }

.vec{ margin-bottom:1.8rem; }
.vec-row{ display:grid; grid-template-columns:minmax(96px,140px) 1fr 3ch; gap:1rem; align-items:center; padding-block:.42rem; }
.vec-name{ font-family:var(--ff-head); font-size:.85rem; font-weight:600; color:var(--ink); }
.bar{ height:8px; background:#EAE4D6; border-radius:99px; overflow:hidden; position:relative; }
.bar-fill{
  display:block; height:100%; width:var(--v); position:relative;
  background:linear-gradient(90deg, var(--navy), #177E9C 70%, var(--cyan));
  border-radius:99px; transform-origin:left center; overflow:hidden;
}
html.motion .bar-fill::after{
  content:""; position:absolute; inset:0;
  background:linear-gradient(90deg, transparent 30%, rgba(255,255,255,.35) 50%, transparent 70%);
  transform:translateX(-100%); animation:shimmer 3.2s ease-in-out infinite;
}
@keyframes shimmer{ 55%,100%{ transform:translateX(100%); } }
.vec-val{ font-family:var(--ff-head); font-size:.85rem; font-weight:700; color:var(--muted-l); text-align:right; }
.vec-cap{ margin-top:.7rem; font-size:.8rem; color:var(--muted-l); letter-spacing:.06em; }
.vivo{ color:var(--ok); font-weight:600; }
html.motion .vivo{ animation:vivoPulse 1.8s ease-in-out infinite; }
@keyframes vivoPulse{ 50%{ opacity:.35; } }

.veredicto{ border-left:4px solid var(--cyan); background:var(--cyan-soft); border-radius:0 var(--r) var(--r) 0; padding:1.3rem 1.5rem; }
.veredicto p{ font-family:var(--ff-quote); font-style:italic; font-size:clamp(1.05rem, 1rem + .5vw, 1.3rem); line-height:1.5; color:var(--ink); }
.veredicto cite{ display:block; margin-top:.8rem; font-style:normal; font-family:var(--ff-head); font-size:.72rem; font-weight:600; letter-spacing:.2em; text-transform:uppercase; color:#177E9C; }

.proof-list{ list-style:none; display:grid; gap:.9rem; max-width:760px; }
.proof-list li{ padding-left:1.4rem; position:relative; color:var(--muted-l); }
.proof-list li::before{ content:"—"; position:absolute; left:0; color:#177E9C; font-weight:700; }
.proof-list b{ color:var(--ink); }
.proof-list em{ font-family:var(--ff-quote); }
.smallprint{ margin-top:1.6rem; font-size:.8rem; color:var(--muted-l); opacity:.8; }

/* ── INTERLUDIO ────────────────────────────────────────────── */
.inter{ padding-block:clamp(6rem,14vh,9.5rem); }
.inter-cols{ grid-template-columns:5fr 7fr; }
@media (max-width:880px){ .inter-cols{ grid-template-columns:1fr; } }
.inter-fig{ position:relative; max-width:440px; }
.inter-t .q-hero p{ font-size:clamp(2.2rem, 1.4rem + 4vw, 4.2rem); }
.inter-t .body{ margin-top:1.4rem; }

.chat{ display:flex; flex-direction:column; gap:.6rem; margin-top:1rem; }
.bubble{
  font-size:.92rem; color:var(--cream); background:rgba(8,26,46,.92);
  border:1px solid rgba(61,190,221,.35); border-radius:14px 14px 14px 4px;
  padding:.7rem 1rem; width:max-content; max-width:100%;
  box-shadow:0 14px 40px rgba(0,0,0,.4);
}
@media (min-width:700px){
  html.motion .chat{ position:absolute; inset:0; margin:0; pointer-events:none; }
  html.motion .bubble{ position:absolute; max-width:34ch; }
  html.motion .b1{ top:6%; right:-18%; }
  html.motion .b2{ top:48%; left:-22%; border-radius:14px 14px 4px 14px; }
  html.motion .b3{ bottom:5%; right:-12%; }
  html.motion .bubble{ opacity:0; transform:scale(.85) translateY(10px); }
}

/* ── ÚNICOS ────────────────────────────────────────────────── */
.ugrid{ display:grid; grid-template-columns:repeat(4,1fr); gap:1rem; margin-top:clamp(2rem,4vw,3rem); }
@media (max-width:1020px){ .ugrid{ grid-template-columns:repeat(2,1fr); } }
@media (max-width:560px){ .ugrid{ grid-template-columns:1fr; } }
.ucard{
  border:1px solid var(--line-d); border-radius:var(--r);
  padding:1.4rem 1.3rem; background:rgba(8,26,46,.55);
  transition:border-color .3s ease, transform .25s ease, box-shadow .3s ease;
  transform-style:preserve-3d; will-change:transform;
}
.ucard:hover{ border-color:rgba(61,190,221,.55); box-shadow:0 18px 50px rgba(0,0,0,.35); }
.ucard h3{ font-size:1.02rem; margin-bottom:.55rem; color:var(--cyan-soft); }
.ucard p{ font-size:.9rem; color:var(--muted-d); line-height:1.55; }

.formula{
  margin-top:clamp(2.5rem,6vw,4rem); text-align:center;
  border:1px solid var(--line-d); border-radius:var(--r);
  padding:clamp(2.4rem,7vw,5rem) 1.5rem;
  background:radial-gradient(60% 130% at 50% 0%, rgba(61,190,221,.09) 0%, transparent 70%), rgba(8,26,46,.5);
  overflow:hidden;
}
.f-nums{
  display:flex; justify-content:center; align-items:baseline; gap:clamp(.6rem,2vw,1.4rem);
  font-family:var(--ff-head); font-weight:700; color:var(--cream);
  font-size:clamp(4.5rem, 2rem + 13vw, 12rem); line-height:1; letter-spacing:-.045em;
  margin-bottom:1.4rem;
}
.f-slash{ color:var(--muted-d); font-weight:400; font-size:.55em; }
.f-n-c{ color:var(--cyan); }
.f-unit{ display:inline-flex; align-items:baseline; }
.pct{ font-style:normal; font-weight:600; font-size:.4em; color:var(--muted-d); margin-left:.05em; letter-spacing:0; }
.pct-c{ color:var(--cyan); }
.f-txt{ font-size:clamp(1.05rem, 1rem + .5vw, 1.4rem); color:var(--cyan-soft); max-width:46ch; margin-inline:auto; }
.f-txt b{ color:var(--cyan); }
.f-txt em{ font-family:var(--ff-quote); }
.f-cap{ margin-top:1.1rem; font-family:var(--ff-head); font-size:.74rem; font-weight:600; letter-spacing:.24em; text-transform:uppercase; color:var(--muted-d); }

/* ── NOSOTROS ──────────────────────────────────────────────── */
.founders{ display:grid; grid-template-columns:6fr 6fr; gap:clamp(2rem,5vw,4rem); align-items:start; margin-top:clamp(2rem,4vw,3rem); }
@media (max-width:880px){ .founders{ grid-template-columns:1fr; } }
.f-bios{ display:flex; flex-direction:column; gap:1.8rem; }
.bio h3{ color:var(--cream); }
.bio-role{ font-family:var(--ff-head); font-size:.74rem; font-weight:600; letter-spacing:.22em; text-transform:uppercase; color:var(--cyan); margin:.3rem 0 .7rem; }
.bio p:last-child{ color:var(--muted-d); }
.f-note{ border-top:1px solid var(--line-d); padding-top:1.4rem; font-family:var(--ff-quote); font-style:italic; color:var(--cyan-soft); }

/* ── EL EQUIPO ─────────────────────────────────────────────── */
.team-fig{ margin-top:clamp(2rem,4vw,3rem); }
.team-fig figcaption{ text-align:center; font-style:normal; font-family:var(--ff-head); font-size:.76rem; font-weight:600; letter-spacing:.14em; text-transform:uppercase; color:var(--muted-d); line-height:1.9; }
.team-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:clamp(1.6rem,3vw,2.6rem); margin-top:clamp(2.4rem,5vw,3.6rem); }
@media (max-width:900px){ .team-grid{ grid-template-columns:repeat(2,1fr); } }
@media (max-width:560px){ .team-grid{ grid-template-columns:1fr; } }
.member{ border-top:1px solid var(--line-d); padding-top:1.1rem; }
.member h3{ font-size:1.06rem; line-height:1.3; }
.member .bio-role{ letter-spacing:.16em; }
.member p:last-child{ font-size:.94rem; line-height:1.6; }

/* ── CIERRE ────────────────────────────────────────────────── */
.cierre{ position:relative; min-height:92svh; display:flex; align-items:center; text-align:center; }
.cierre-in{ display:flex; flex-direction:column; align-items:center; gap:1.4rem; width:100%; }
.cierre h2{ max-width:22ch; }
.cierre .lead{ margin-bottom:.6rem; }

/* ── FOOTER ────────────────────────────────────────────────── */
.foot{ border-top:1px solid var(--line-d); padding-block:2.5rem; background:rgba(6,14,27,.85); }
.foot-in{ display:flex; flex-wrap:wrap; align-items:center; gap:1.2rem 2.5rem; }
.foot p{ font-size:.85rem; color:var(--muted-d); }
.foot-c{ margin-left:auto; }
@media (max-width:640px){ .foot-c{ margin-left:0; } }

/* ── ESTADOS DE MOTION (reveals genéricos) ─────────────────── */
html.motion [data-reveal]{ opacity:0; transform:translateY(30px); will-change:transform,opacity; }
html.motion [data-hero]{ opacity:0; transform:translateY(24px); }
html.motion .line-in, html.motion .line-in-dot{ transform:translateY(115%); }
html.motion .hero-title .ch{ display:inline-block; }

@media (prefers-reduced-motion: reduce){
  html{ scroll-behavior:auto; }
  *,*::before,*::after{ animation-duration:.01ms!important; animation-iteration-count:1!important; transition-duration:.01ms!important; }
}