/* Pro 2026 — acabado editorial compartido con Metodología y Nosotros. */
.pro26{
  --pro-blue:#004fa0;
  --pro-blue-b:#0a6fd6;
  --pro-ink:#0f172a;
  --pro-slate:#475569;
  --pro-muted:#64748b;
  --pro-line:#d8e3ef;
  --pro-paper:#f8f5ec;
  --pro-paper-2:#fffdf7;
  width:100%;overflow:hidden;background:var(--pro-paper);color:var(--pro-ink);
  font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
}
.pro26 *,.pro26 *::before,.pro26 *::after{box-sizing:border-box}
.pro26 .pro-wrap{width:min(100%,1280px);max-width:none;margin:0 auto;padding:0 clamp(20px,6vw,92px)}
.pro26 section{padding:clamp(88px,10vw,160px) 0}
.pro26 section.pro-alt{background:var(--pro-paper-2)}
.pro26 h1,.pro26 h2,.pro26 h3{font-family:inherit}
.pro26 h2{max-width:1100px;margin:0 0 24px;color:var(--pro-ink);font-size:clamp(3rem,6vw,7rem);font-weight:870;line-height:.9;letter-spacing:-.06em}
.pro26 h3{color:var(--pro-ink);font-weight:820;letter-spacing:-.025em}
.pro26 p{max-width:72ch;color:var(--pro-slate);font-size:clamp(16px,1.3vw,19px);line-height:1.6}
.pro26 .pro-lead{font-size:clamp(19px,1.8vw,24px);line-height:1.55}
.pro26 .pro-eyebrow{margin-bottom:22px;border-color:rgba(255,255,255,.35);background:rgba(0,37,79,.28);color:#fff;font-weight:850;letter-spacing:.16em}

/* Ningún texto informativo queda condicionado a haber hecho scroll. */
html.js .pro26 .pro-orgs li,html.js .pro26 .pro-flujo li,
.pro26 .pro-orgs li,.pro26 .pro-momento,.pro26 .pro-lado,.pro26 .pro-flujo li,.pro26 .pro-hitos li{opacity:1;transform:none}

.pro26 .pro-hero{position:relative;min-height:100svh;display:grid;align-items:center;padding:160px 0 96px;background:var(--pro-blue);color:#fff;isolation:isolate}
.pro26 .pro-hero::before{content:"";position:absolute;inset:0;z-index:-2;background:radial-gradient(circle at 86% 20%,rgba(255,255,255,.16),transparent 28%),radial-gradient(circle at 10% 95%,rgba(37,139,196,.42),transparent 30%)}
.pro26 .pro-hero::after{content:"PRO";position:absolute;right:-.06em;bottom:-.3em;z-index:-1;color:rgba(255,255,255,.06);font-size:min(39vw,34rem);font-weight:900;line-height:1;letter-spacing:-.1em}
.pro26 .pro-hero-grid{grid-template-columns:minmax(0,.92fr) minmax(420px,1.08fr);gap:clamp(42px,7vw,105px);align-items:center}
.pro26 .pro-hero-copy{order:1}
.pro26 .pro-hero-figura{order:2;margin:0}
.pro26 .pro-hero h1{max-width:780px;margin:0 0 28px;color:#fff;font-size:clamp(4rem,7.1vw,8.5rem);font-weight:880;line-height:.84;letter-spacing:-.07em}
.pro26 .pro-hero .pro-lead,.pro26 .pro-hero .pro-nota{color:#e2effd}
.pro26 .pro-hero-photo{display:block;width:100%;height:auto;border:1px solid rgba(255,255,255,.3);border-radius:30px;box-shadow:0 36px 90px rgba(0,27,61,.4);transform:rotate(1.4deg)}
.pro26 .pro-acciones{gap:12px;margin-top:30px}
.pro26 .pro-btn{min-height:54px;padding:13px 25px;border-radius:999px;font-weight:800}
.pro26 .pro-hero .pro-btn-1{border-color:#fff;background:#fff;color:var(--pro-blue)}
.pro26 .pro-hero .pro-btn-1:hover,.pro26 .pro-hero .pro-btn-1:focus{background:#edf6ff;color:var(--pro-blue)}
.pro26 .pro-hero .pro-btn-2{border-color:rgba(255,255,255,.52);background:transparent;color:#fff}
.pro26 .pro-hero .pro-btn-2:hover,.pro26 .pro-hero .pro-btn-2:focus{border-color:#fff;background:rgba(255,255,255,.12);color:#fff}

.pro26 .pro-franja{padding:clamp(86px,9vw,130px) 0;background:var(--pro-ink);color:#fff}
.pro26 .pro-franja h2{color:#fff}
.pro26 .pro-franja p{color:#cbd9e8}
.pro26 .pro-orgs{grid-template-columns:repeat(3,minmax(0,1fr));gap:0;margin-top:48px;border-top:1px solid rgba(255,255,255,.18);border-bottom:1px solid rgba(255,255,255,.18)}
.pro26 .pro-orgs li{min-height:150px;padding:26px;border:0;border-right:1px solid rgba(255,255,255,.18);border-bottom:1px solid rgba(255,255,255,.18);border-radius:0;background:transparent;color:#fff}
.pro26 .pro-orgs li:nth-child(3n){border-right:0}
.pro26 .pro-orgs li:nth-last-child(-n+3){border-bottom:0}
.pro26 .pro-orgs small{color:#adc1d6}

.pro26 .pro-mca,.pro26 .pro-dos,.pro26 .pro-demo,.pro26 .hpj,.pro26 .pro-priv{margin-top:52px}
.pro26 .pro-mca-fila{gap:18px}
.pro26 .pro-momento,.pro26 .pro-lado,.pro26 .pro-demo,.pro26 .pro-capa{border-color:var(--pro-line);border-radius:0;box-shadow:none}
.pro26 .pro-momento{min-height:360px;padding:30px;border-width:1px 0 0}
.pro26 .pro-momento h3,.pro26 .pro-lado h3{font-size:clamp(1.55rem,2.3vw,2.6rem);line-height:1.02}
.pro26 .pro-tesis,.pro26 .pro-dos-cierre{margin-top:34px;padding:24px 28px;border-left:6px solid var(--pro-blue);background:#eaf4ff;color:var(--pro-ink);font-weight:750}
.pro26 .pro-demo{overflow:hidden;border-radius:0;border-width:1px 0}
.pro26 .pro-demo-nav{gap:0;border-bottom:1px solid var(--pro-line);background:var(--pro-paper-2)}
.pro26 .pro-demo-nav button{min-height:74px;border-radius:0}
.pro26 .pro-demo-nav button[aria-selected="true"]{background:var(--pro-blue);color:#fff}
.pro26 .pro-demo-escena{padding:clamp(22px,4vw,50px)}

.pro26 .hpj{padding:clamp(24px,4vw,52px) 0;border:0;border-top:1px solid var(--pro-line);border-bottom:1px solid var(--pro-line);border-radius:0;background:transparent;box-shadow:none}
.pro26 .hpj-paso h3{font-size:clamp(1.5rem,2.2vw,2.35rem)}
.pro26 .hpj-marco{border-radius:26px;box-shadow:0 26px 70px rgba(15,23,42,.13)}
.pro26 .pro-flujo,.pro26 .pro-hitos{margin-top:46px}
.pro26 .pro-flujo,.pro26 .pro-hitos{gap:0;border-top:1px solid var(--pro-line);border-bottom:1px solid var(--pro-line)}
.pro26 .pro-flujo li,.pro26 .pro-hitos li{border:0;border-right:1px solid var(--pro-line);border-radius:0;background:transparent}
.pro26 .pro-flujo li:last-child,.pro26 .pro-hitos li:last-child{border-right:0}
.pro26 .pro-priv{padding:clamp(26px,5vw,56px);border-radius:0;background:var(--pro-ink);color:#fff}
.pro26 .pro-priv h3,.pro26 .pro-priv h2{color:#fff}
.pro26 .pro-priv p,.pro26 .pro-priv li{color:#cbd9e8}

.pro26 .pro-cierre{position:relative;min-height:76vh;display:grid;align-items:center;background:var(--pro-blue);color:#fff;overflow:hidden;text-align:center}
.pro26 .pro-cierre::before,.pro26 .pro-cierre::after{content:"";position:absolute;width:44vw;height:44vw;border:1px solid rgba(255,255,255,.18);border-radius:50%}
.pro26 .pro-cierre::before{left:-20vw;top:-23vw}.pro26 .pro-cierre::after{right:-18vw;bottom:-24vw}
.pro26 .pro-cierre .pro-wrap{position:relative;z-index:1;display:flex;flex-direction:column;align-items:center}
.pro26 .pro-cierre h2{color:#fff}
.pro26 .pro-cierre p{color:#dcecff}
.pro26 .pro-cierre .pro-acciones{justify-content:center}
.pro26 .pro-cierre .pro-btn-1{border-color:#fff;background:#fff;color:var(--pro-blue)}

@media (max-width:980px){
  .pro26 .pro-hero-grid{grid-template-columns:1fr}
  .pro26 .pro-hero-copy{order:1}.pro26 .pro-hero-figura{order:2}
  .pro26 .pro-hero h1{font-size:clamp(4rem,12vw,7.3rem)}
  .pro26 .pro-hero-figura{max-width:780px}
  .pro26 .pro-orgs{grid-template-columns:repeat(2,minmax(0,1fr))}
  .pro26 .pro-orgs li:nth-child(3n){border-right:1px solid rgba(255,255,255,.18)}
  .pro26 .pro-orgs li:nth-child(2n){border-right:0}
  .pro26 .pro-orgs li:nth-last-child(-n+3){border-bottom:1px solid rgba(255,255,255,.18)}
  .pro26 .pro-orgs li:nth-last-child(-n+2){border-bottom:0}
}
@media (max-width:640px){
  .pro26 section{padding:76px 0}
  .pro26 .pro-wrap{padding:0 20px}
  .pro26 h2{font-size:clamp(2.8rem,13vw,4.8rem)}
  .pro26 .pro-hero{min-height:auto;padding:140px 0 76px}
  .pro26 .pro-hero h1{font-size:clamp(3.5rem,15vw,5.2rem);line-height:.87}
  .pro26 .pro-hero-photo{border-radius:22px;transform:none}
  .pro26 .pro-acciones{display:block;gap:0}
  .pro26 .pro-acciones .pro-btn{width:100%;margin:0 0 12px}
  .pro26 .pro-orgs{grid-template-columns:1fr}
  .pro26 .pro-orgs li,.pro26 .pro-orgs li:nth-child(2n),.pro26 .pro-orgs li:nth-child(3n){min-height:0;border-right:0;border-bottom:1px solid rgba(255,255,255,.18)}
  .pro26 .pro-orgs li:last-child{border-bottom:0}
  .pro26 .pro-momento{min-height:0}
  .pro26 .hpj{padding:20px 14px}
  .pro26 .pro-demo-nav{display:grid;grid-template-columns:1fr}
  .pro26 .pro-demo-nav button{width:100%;text-align:left}
  .pro26 .pro-flujo,.pro26 .pro-hitos{display:block}
  .pro26 .pro-flujo li,.pro26 .pro-hitos li{border-right:0;border-bottom:1px solid var(--pro-line)}
  .pro26 .pro-flujo li:last-child,.pro26 .pro-hitos li:last-child{border-bottom:0}
  .pro26 .pro-cierre{min-height:70vh}
}
@media (prefers-reduced-motion:reduce){
  .pro26 *,.pro26 *::before,.pro26 *::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}
}

/* Hero editorial: la idea manda y la pantalla demuestra. Misma gramática
   tipográfica que la página de Metodología, sin marcos diagonales ni capas
   que compitan con el producto. */
.pro26 .pro-hero{overflow:hidden}
.pro26 .pro-hero-grid{grid-template-columns:minmax(0,1.16fr) minmax(360px,.84fr);gap:clamp(48px,7vw,118px)}
.pro26 .pro-hero-copy{position:relative;z-index:2}
.pro26 .pro-hero h1{max-width:980px;font-size:clamp(3.9rem,6.6vw,7.7rem);line-height:.8;letter-spacing:-.075em}
.pro26 .pro-title-solid,.pro26 .pro-title-outline{display:block}
.pro26 .pro-title-solid{white-space:nowrap;color:#fff}
.pro26 .pro-title-outline{margin-top:.08em;color:transparent;-webkit-text-stroke:1.5px rgba(255,255,255,.92);text-stroke:1.5px rgba(255,255,255,.92)}
.pro26 .pro-hero-figura{position:relative;justify-self:end;width:min(100%,610px);overflow:visible;isolation:isolate}
.pro26 .pro-hero-figura::before{content:"";position:absolute;inset:8% -7% -8% 9%;z-index:-1;border:1px solid rgba(255,255,255,.24);border-radius:42% 58% 51% 49%/48% 42% 58% 52%;animation:pro-orbita 12s ease-in-out infinite alternate}
.pro26 .pro-hero-figura::after{content:"";position:absolute;right:-12%;top:-13%;z-index:-1;width:38%;aspect-ratio:1;border-radius:50%;background:rgba(37,139,196,.28);filter:blur(1px);animation:pro-halo 8s ease-in-out infinite alternate}
.pro26 .pro-hero-photo{display:block;width:100%;height:auto;margin:0;border:0;border-radius:22px;clip-path:none;box-shadow:0 34px 80px rgba(0,24,58,.34);transform:rotate(-1.2deg);animation:pro-product-float 7s ease-in-out infinite alternate}
.pro26 .pro-hero-copy>*{animation:pro-copy-in .78s var(--pro-ease) both}
.pro26 .pro-hero-copy>h1{animation-delay:.08s}.pro26 .pro-hero-copy>.pro-lead{animation-delay:.16s}.pro26 .pro-hero-copy>.pro-acciones{animation-delay:.24s}.pro26 .pro-hero-copy>.pro-nota{animation-delay:.32s}
@keyframes pro-copy-in{from{opacity:0;transform:translateY(30px);clip-path:inset(0 0 100% 0)}to{opacity:1;transform:none;clip-path:inset(0)}}
@keyframes pro-product-float{from{transform:rotate(-1.2deg) translateY(6px)}to{transform:rotate(.2deg) translateY(-10px)}}
@keyframes pro-orbita{from{transform:rotate(-3deg) scale(.96)}to{transform:rotate(4deg) scale(1.04)}}
@keyframes pro-halo{from{transform:translate(-8px,8px) scale(.9);opacity:.5}to{transform:translate(10px,-7px) scale(1.08);opacity:1}}
@media(max-width:980px){.pro26 .pro-hero-grid{grid-template-columns:1fr}.pro26 .pro-hero-figura{justify-self:start;width:min(82vw,640px)}.pro26 .pro-title-solid{white-space:normal}}
@media(max-width:640px){.pro26 .pro-hero h1{font-size:clamp(3.2rem,15vw,5rem)}.pro26 .pro-hero-figura{width:100%}.pro26 .pro-hero-photo{border-radius:16px}}

/* El portátil es ahora el fondo real del hero, con la misma composición que
   la portada personal: producto a la izquierda y contenido a la derecha. */
.pro26 .pro-hero{min-height:min(calc(100svh - 76px),820px);display:grid;align-items:stretch;padding:0;border:0;background:var(--pro-paper-2);color:var(--pro-ink);isolation:isolate}
.pro26 .pro-hero::before{content:"";position:absolute;inset:0;z-index:1;pointer-events:none;background:linear-gradient(90deg,rgba(255,253,247,0) 0%,rgba(255,253,247,.08) 43%,rgba(255,253,247,.72) 54%,rgba(255,253,247,.97) 62%,var(--pro-paper-2) 70%,var(--pro-paper-2) 100%)}
.pro26 .pro-hero::after{display:none}
.pro26 .pro-hero-grid{display:flex;width:100%;min-height:min(calc(100svh - 76px),820px);align-items:center;justify-content:flex-end;padding:116px 0 64px}
.pro26 .pro-hero-figura{position:absolute;inset:0 auto 0 0;z-index:0;width:min(64vw,1280px);max-width:none;height:100%;margin:0;overflow:hidden;border:0;border-radius:0;pointer-events:none;isolation:auto}
.pro26 .pro-hero-figura::before,.pro26 .pro-hero-figura::after{display:none}
.pro26 .pro-hero-photo{display:block;width:100%;height:100%;margin:0;border:0;border-radius:0;object-fit:contain;object-position:left bottom;box-shadow:none;transform:none;animation:pro-fondo-in 1050ms cubic-bezier(.23,1,.32,1) both}
.pro26 .pro-hero-copy{position:relative;z-index:2;width:min(45%,600px);margin-left:auto;padding:24px 0 12px;color:var(--pro-ink)}
.pro26 .pro-hero .pro-eyebrow{border-color:var(--pro-line);background:rgba(255,255,255,.78);color:var(--pro-blue)}
.pro26 .pro-hero h1{max-width:690px;margin-bottom:24px;color:var(--pro-ink);font-size:clamp(3.35rem,4.7vw,5.75rem);line-height:.88;letter-spacing:-.062em}
.pro26 .pro-title-solid{color:var(--pro-ink)}
.pro26 .pro-title-outline{margin-top:.1em;color:transparent;font-size:.82em;line-height:.94;letter-spacing:-.055em;-webkit-text-stroke:1.35px var(--pro-blue);text-stroke:1.35px var(--pro-blue)}
.pro26 .pro-hero .pro-lead,.pro26 .pro-hero .pro-nota{color:var(--pro-slate)}
.pro26 .pro-hero .pro-lead{max-width:37ch;font-size:clamp(17px,1.22vw,20px);line-height:1.48}
.pro26 .pro-hero .pro-acciones{width:max-content;max-width:100%;margin-top:26px}
.pro26 .pro-hero .pro-btn{min-width:0;width:auto;padding-inline:24px}
.pro26 .pro-hero .pro-btn-1{border-color:var(--pro-blue);background:var(--pro-blue);color:#fff}
.pro26 .pro-hero .pro-btn-1:hover,.pro26 .pro-hero .pro-btn-1:focus{border-color:var(--pro-blue-b);background:var(--pro-blue-b);color:#fff}
.pro26 .pro-hero .pro-btn-2{border-color:var(--pro-line);background:rgba(255,255,255,.84);color:var(--pro-blue)}
.pro26 .pro-hero .pro-btn-2:hover,.pro26 .pro-hero .pro-btn-2:focus{border-color:var(--pro-blue);background:#fff;color:var(--pro-blue)}
@keyframes pro-fondo-in{from{opacity:.32;transform:translate3d(-1.2%,0,0) scale(1.025)}to{opacity:1;transform:translate3d(0,0,0) scale(1)}}

@media(max-width:820px){
  .pro26 .pro-hero{display:block;min-height:840px}
  .pro26 .pro-hero::before{background:linear-gradient(to bottom,rgba(255,253,247,0) 0%,rgba(255,253,247,.06) 35%,rgba(255,253,247,.92) 48%,var(--pro-paper-2) 58%,var(--pro-paper-2) 100%)}
  .pro26 .pro-hero-grid{display:block;min-height:840px;padding:370px 0 62px}
  .pro26 .pro-hero-figura{width:100%;height:430px;bottom:auto}
  .pro26 .pro-hero-photo{object-fit:contain;object-position:left top}
  .pro26 .pro-hero-copy{width:100%;max-width:620px;margin:0 auto;padding:0}
  .pro26 .pro-hero h1{font-size:clamp(3rem,11.3vw,5.25rem)}
}
@media(max-width:460px){
  .pro26 .pro-hero{min-height:760px}
  .pro26 .pro-hero::before{background:linear-gradient(to bottom,rgba(255,253,247,0) 0%,rgba(255,253,247,.08) 22%,rgba(255,253,247,.9) 34%,var(--pro-paper-2) 43%,var(--pro-paper-2) 100%)}
  .pro26 .pro-hero-grid{min-height:760px;padding-top:260px}
  .pro26 .pro-hero-figura{height:300px}
  .pro26 .pro-hero h1{font-size:clamp(2.85rem,13vw,4rem)}
  .pro26 .pro-title-outline{font-size:.86em}
  .pro26 .pro-hero .pro-acciones{display:grid;width:100%;max-width:390px}
  .pro26 .pro-hero .pro-btn{width:100%}
}
@media(prefers-reduced-motion:reduce){.pro26 .pro-hero-photo{animation:none!important;transform:none!important}}

/* ========================================================================
   Pasada editorial 20260825h
   El producto ocupa el escenario en vez de flotar dentro de una tarjeta. La
   segunda línea se dibuja carácter a carácter y la privacidad se explica como
   un único mapa, no como una pila de cajas de documentación.
   ======================================================================== */
.pro26{
  --pro-night:#061a30;
  --pro-night-2:#0b2948;
  --pro-accent:#ffd166;
  --pro-electric:#58aef2;
  --pro-ease:cubic-bezier(.16,1,.3,1);
}

/* HERO: portátil a escala real + panel editorial de alto contraste. */
.pro26 .pro-hero{
  position:relative;display:grid;align-items:stretch;min-height:clamp(720px,calc(100svh - 74px),900px);
  padding:0;overflow:hidden;border:0;background:#f9fbfe;color:#fff;isolation:isolate;
}
.pro26 .pro-hero::before{
  content:"";position:absolute;inset:0 0 0 44%;z-index:1;display:block;
  /* ARCO, NO PICO (2026-08-25). Antes: clip-path:polygon(12% 0,...), una
     diagonal recta que abajo terminaba en punta contra el borde del hero.
     Los dos radios de la izquierda valen 50% del alto, asi que se juntan
     en el centro y el borde es UN SOLO arco continuo, sin vertice. */
  border-radius:clamp(72px,12vw,210px) 0 0 clamp(72px,12vw,210px) / 50% 0 0 50%;
  background:radial-gradient(circle at 82% 18%,rgba(88,174,242,.2),transparent 29%),
             linear-gradient(145deg,var(--pro-night-2),var(--pro-night) 64%);
}
.pro26 .pro-hero::after{
  content:"";position:absolute;right:-12vw;bottom:-21vw;z-index:1;display:block;
  width:46vw;aspect-ratio:1;border:1px solid rgba(255,255,255,.13);border-radius:50%;pointer-events:none;
}
.pro26 .pro-hero .pro-wrap{position:static;width:min(100%,1440px);max-width:none;padding:0 clamp(24px,6vw,96px)}
.pro26 .pro-hero-grid{
  position:static;display:grid;grid-template-columns:minmax(0,1fr) minmax(440px,.9fr);
  width:100%;min-height:clamp(720px,calc(100svh - 74px),900px);gap:clamp(54px,8vw,132px);align-items:center;
  padding:128px 0 76px;
}
.pro26 .pro-hero-figura{
  position:absolute;inset:0 auto 0 0;z-index:0;display:block;width:64%;max-width:none;height:100%;
  margin:0;overflow:hidden;border:0;border-radius:0;background:#f9fbfe;pointer-events:none;isolation:auto;
}
.pro26 .pro-hero-figura::before,.pro26 .pro-hero-figura::after{display:none}
.pro26 .pro-hero-photo{
  display:block;width:100%;height:100%;margin:0;border:0;border-radius:0;object-fit:cover;object-position:left center;
  box-shadow:none;transform:none;animation:pro-stage-enter 900ms var(--pro-ease) both;
}
.pro26 .pro-hero-copy{
  position:relative;z-index:2;grid-column:2;width:100%;max-width:650px;margin:0 0 0 auto;padding:18px 0;color:#fff;
}
.pro26 .pro-hero-copy::before{
  content:"";position:absolute;left:-42px;top:18px;bottom:18px;width:1px;
  background:linear-gradient(180deg,transparent,rgba(255,255,255,.42) 15%,rgba(255,209,102,.9) 68%,transparent);
}
.pro26 .pro-hero-copy>*{animation:none}
.pro26 .pro-hero .pro-eyebrow{
  margin:0 0 24px;border-color:rgba(255,255,255,.25);background:rgba(255,255,255,.05);color:#fff;
}
.pro26 .pro-hero h1{
  max-width:710px;margin:0 0 28px;color:#fff;font-size:clamp(3.65rem,5.35vw,6.8rem);
  font-weight:900;line-height:.84;letter-spacing:-.068em;
}
.pro26 .pro-title-solid,.pro26 .pro-title-paint{display:block}
.pro26 .pro-title-solid{color:#fff;white-space:nowrap}
.pro26 .pro-title-paint{margin-top:.13em;font-size:.76em;line-height:.98;letter-spacing:-.055em;color:var(--pro-accent)}
.pro26 .pro-hero .pro-lead{max-width:39ch;margin:0;color:#dbe9f7;font-size:clamp(16px,1.18vw,20px);line-height:1.5}
.pro26 .pro-hero .pro-lead b{color:#fff}
.pro26 .pro-hero .pro-acciones{display:flex;width:auto;max-width:100%;gap:10px;margin:28px 0 17px}
.pro26 .pro-hero .pro-btn{width:auto;min-width:0;min-height:50px;padding:12px 23px;transition:transform 160ms var(--pro-ease),background 160ms,border-color 160ms,color 160ms}
.pro26 .pro-hero .pro-btn-1{border-color:#fff;background:#fff;color:var(--pro-blue)}
.pro26 .pro-hero .pro-btn-1:hover,.pro26 .pro-hero .pro-btn-1:focus{border-color:#eaf4ff;background:#eaf4ff;color:var(--pro-blue)}
.pro26 .pro-hero .pro-btn-2{border-color:rgba(255,255,255,.42);background:transparent;color:#fff}
.pro26 .pro-hero .pro-btn-2:hover,.pro26 .pro-hero .pro-btn-2:focus{border-color:#fff;background:rgba(255,255,255,.1);color:#fff}
.pro26 .pro-hero .pro-btn:active{transform:scale(.97)}
.pro26 .pro-hero .pro-nota{max-width:42ch;margin:0;color:#b9cde0;font-size:14px;line-height:1.45}
.pro26 .pro-hero .pro-nota::before{filter:brightness(0) invert(1);opacity:.84}
@keyframes pro-stage-enter{from{opacity:.35;transform:translate3d(-1.5%,0,0) scale(1.03)}to{opacity:1;transform:none}}

/* Pintado por glifos: el carácter de contorno siempre permanece legible; una
   capa absoluta revela el relleno con clip-path. */
.pro26 [data-letter-paint].pro-paint-ready{color:transparent}
.pro26 .pro-letter{position:relative;display:inline-block;color:transparent;vertical-align:baseline;-webkit-text-stroke:1.2px currentColor}
.pro26 [data-paint-surface="hero"] .pro-letter{color:transparent;-webkit-text-stroke:1.15px rgba(255,209,102,.72)}
.pro26 [data-paint-surface="dark"] .pro-letter{color:transparent;-webkit-text-stroke:1.15px rgba(255,255,255,.46)}
.pro26 .pro-letter-word{display:inline-block;white-space:nowrap}
.pro26 .pro-letter::after{
  content:attr(data-char);position:absolute;inset:0;display:block;color:var(--pro-accent);-webkit-text-stroke:0;clip-path:inset(0 100% 0 0);
  will-change:clip-path;
}
.pro26 [data-paint-surface="dark"] .pro-letter::after{color:#fff}
.pro26 .pro-letter-space{display:inline-block;width:.245em}
.pro26 .is-painted .pro-letter::after{animation:pro-letter-fill 410ms var(--pro-ease) both;animation-delay:var(--letter-delay)}
.pro26 .paint-done .pro-letter::after{clip-path:inset(0);will-change:auto}
@keyframes pro-letter-fill{from{clip-path:inset(0 100% 0 0)}to{clip-path:inset(0)}}

/* PRIVACIDAD: un mapa único y legible, con la frontera en el centro. */
.pro26 .pro-privacy-section{position:relative;padding:clamp(100px,10vw,158px) 0;background:var(--pro-night);color:#fff;overflow:hidden}
.pro26 .pro-privacy-section::before{
  content:"";position:absolute;right:-20vw;top:-24vw;width:58vw;aspect-ratio:1;border:1px solid rgba(88,174,242,.16);border-radius:50%;
}
.pro26 .pro-priv{position:relative;margin:0;padding:0;border:0;border-radius:0;background:transparent;color:#fff}
.pro26 .pro-privacy-head{display:grid;grid-template-columns:minmax(0,1.25fr) minmax(320px,.75fr);gap:clamp(40px,8vw,132px);align-items:end}
.pro26 .pro-privacy-head h2{max-width:10.8ch;margin:0;color:#fff;font-size:clamp(3.2rem,6.5vw,7.1rem);line-height:.87;letter-spacing:-.067em}
.pro26 .pro-privacy-head>p{max-width:46ch;margin:0 0 8px;color:#b9cde0;font-size:clamp(1.02rem,1.28vw,1.22rem);line-height:1.62}
.pro26 .pro-privacy-stage{
  position:relative;display:grid;grid-template-columns:minmax(0,1fr) minmax(220px,.64fr) minmax(0,1fr);
  margin-top:clamp(56px,7vw,94px);overflow:hidden;border:1px solid rgba(255,255,255,.14);border-radius:32px 32px 0 0;
  background:linear-gradient(135deg,rgba(255,255,255,.075),rgba(255,255,255,.025));
}
.pro26 .pro-privacy-zone{position:relative;display:flex;min-height:580px;flex-direction:column;padding:clamp(34px,4vw,60px);overflow:hidden}
.pro26 .pro-person-zone{background:radial-gradient(circle at 25% 22%,rgba(88,174,242,.17),transparent 37%)}
.pro26 .pro-group-zone{background:radial-gradient(circle at 72% 18%,rgba(255,209,102,.11),transparent 37%)}
.pro26 .pro-zone-index{display:inline-flex;flex:none;align-self:start;align-items:center;justify-content:center;min-width:46px;height:30px;padding:0 11px;border:1px solid rgba(255,255,255,.22);border-radius:999px;color:#8fc8f6;font-size:12px;font-weight:850;letter-spacing:.12em}
.pro26 .pro-privacy-zone h3{max-width:15ch;margin:26px 0 12px;color:#fff;font-size:clamp(1.8rem,2.5vw,3rem);line-height:1;letter-spacing:-.045em}
.pro26 .pro-zone-lead{max-width:31ch;margin:0;color:#fff;font-size:clamp(1rem,1.24vw,1.18rem);line-height:1.48}
.pro26 .pro-zone-rule{max-width:37ch;margin:28px 0 0;padding-top:22px;border-top:1px solid rgba(255,255,255,.13);color:#9fb6cc;font-size:15px;line-height:1.5}
.pro26 .pro-person-orbit{position:relative;order:5;width:144px;aspect-ratio:1;margin:auto 0 0 auto;border-radius:50%;display:grid;place-items:center}
.pro26 .pro-person-orbit svg{position:relative;z-index:2;width:62px;fill:none;stroke:#fff;stroke-width:2.2;stroke-linecap:round}
.pro26 .pro-orbit-ring{position:absolute;inset:0;border:1px solid rgba(88,174,242,.46);border-radius:50%}
.pro26 .pro-orbit-ring::before{content:"";position:absolute;inset:18px;border:1px solid rgba(255,255,255,.18);border-radius:50%}
.pro26 .pro-orbit-dot{position:absolute;width:12px;height:12px;border-radius:50%;background:var(--pro-electric);box-shadow:0 0 0 7px rgba(88,174,242,.12)}
.pro26 .pro-orbit-dot-a{left:3px;top:48%}.pro26 .pro-orbit-dot-b{right:12px;top:15%;background:var(--pro-accent);box-shadow:0 0 0 7px rgba(255,209,102,.1)}
.pro26 .pro-group-signal{position:relative;order:5;display:flex;align-items:end;gap:11px;width:144px;height:112px;margin:auto 0 0 auto;padding:0 12px 12px;border-left:1px solid rgba(255,255,255,.22);border-bottom:1px solid rgba(255,255,255,.22)}
.pro26 .pro-group-signal i{display:block;flex:1;height:calc(var(--bar) * 100%);border-radius:8px 8px 2px 2px;background:linear-gradient(180deg,var(--pro-accent),#f1a900)}
.pro26 .pro-privacy-boundary{position:relative;z-index:1;display:flex;min-height:520px;flex-direction:column;align-items:center;justify-content:center;padding:44px 30px;text-align:center;background:rgba(2,14,29,.4)}
.pro26 .pro-boundary-line{position:absolute;inset:0 auto;width:1px;background:repeating-linear-gradient(to bottom,rgba(255,255,255,.22) 0 9px,transparent 9px 18px)}
.pro26 .pro-boundary-line i{position:absolute;left:-4px;top:26%;width:9px;height:9px;border-radius:50%;background:var(--pro-accent);box-shadow:0 0 0 7px rgba(255,209,102,.09)}
.pro26 .pro-boundary-line i:nth-child(2){top:50%;background:var(--pro-electric);box-shadow:0 0 0 7px rgba(88,174,242,.09)}
.pro26 .pro-boundary-line i:nth-child(3){top:74%}
.pro26 .pro-boundary-shield{position:relative;z-index:2;display:grid;width:86px;aspect-ratio:1;place-items:center;border:1px solid rgba(255,255,255,.22);border-radius:50%;background:var(--pro-night);box-shadow:0 0 0 14px rgba(6,26,48,.78)}
.pro26 .pro-boundary-shield svg{width:37px;fill:none;stroke:var(--pro-accent);stroke-width:2.4;stroke-linecap:round;stroke-linejoin:round}
.pro26 .pro-privacy-boundary strong{position:relative;z-index:2;display:block;margin:28px 0 10px;color:#fff;font-size:.82rem;line-height:1.35;letter-spacing:.13em;text-transform:uppercase}
.pro26 .pro-privacy-boundary p{position:relative;z-index:2;max-width:25ch;margin:0;color:#9fb6cc;font-size:14px;line-height:1.5}
.pro26 .pro-organization-rail{display:grid;grid-template-columns:auto minmax(0,1fr) minmax(240px,.7fr);gap:24px;align-items:center;padding:28px clamp(34px,4vw,60px);border-radius:0 0 32px 32px;background:var(--pro-blue);color:#fff}
.pro26 .pro-organization-rail .pro-zone-index{font-size:12px;color:#fff;border-color:rgba(255,255,255,.35)}
.pro26 .pro-organization-rail div{display:grid;gap:3px}.pro26 .pro-organization-rail b{font-size:1.12rem;letter-spacing:.02em}.pro26 .pro-organization-rail span{font-size:14px;color:#e5f2ff;font-size:.92rem;line-height:1.45}
.pro26 .pro-organization-rail p{margin:0;color:#fff;font-size:.96rem;line-height:1.45}
.pro26 .pro-privacy-foot{display:grid;grid-template-columns:minmax(0,1.35fr) minmax(280px,.65fr);gap:clamp(30px,5vw,72px);align-items:start;margin-top:40px}
.pro26 .pro-privacy-foot>p:first-child{margin:0;color:#9fb6cc;font-size:15px;line-height:1.62}
.pro26 .pro-privacy-foot>p:first-child b{color:#fff}
.pro26 .pro-privacy-foot .pro-etica{margin:0;padding:20px 22px;border:0;border-left:3px solid var(--pro-accent);border-radius:0;background:rgba(255,255,255,.06);color:#fff;font-size:.98rem;line-height:1.5}

/* La secuencia entra una sola vez y nunca es un requisito de visibilidad. */
.pro26 .pro-privacy-stage.is-live .pro-person-zone{animation:pro-zone-enter 620ms var(--pro-ease) both}
.pro26 .pro-privacy-stage.is-live .pro-group-zone{animation:pro-zone-enter 620ms var(--pro-ease) 180ms both}
.pro26 .pro-privacy-stage.is-live .pro-boundary-shield{animation:pro-shield-enter 560ms var(--pro-ease) 100ms both}
.pro26 .pro-privacy-stage.is-live .pro-boundary-line i{animation:pro-dot-enter 520ms var(--pro-ease) both}
.pro26 .pro-privacy-stage.is-live .pro-boundary-line i:nth-child(2){animation-delay:120ms}.pro26 .pro-privacy-stage.is-live .pro-boundary-line i:nth-child(3){animation-delay:240ms}
@keyframes pro-zone-enter{from{opacity:.7;transform:translateY(26px)}to{opacity:1;transform:none}}
@keyframes pro-shield-enter{from{opacity:.5;transform:scale(.78) rotate(-8deg)}to{opacity:1;transform:none}}
@keyframes pro-dot-enter{from{opacity:0;transform:translateY(-34px)}to{opacity:1;transform:none}}

@media(max-width:1080px){
  .pro26 .pro-hero::before{inset:0 0 0 41%;border-radius:clamp(60px,11vw,170px) 0 0 clamp(60px,11vw,170px) / 50% 0 0 50%}
  .pro26 .pro-hero-grid{grid-template-columns:minmax(0,.88fr) minmax(390px,1.12fr);gap:58px}
  .pro26 .pro-hero-figura{width:61%}
  .pro26 .pro-hero h1{font-size:clamp(3.35rem,5.45vw,5.6rem)}
  .pro26 .pro-privacy-stage{grid-template-columns:minmax(0,1fr) 210px minmax(0,1fr)}
  .pro26 .pro-privacy-zone{padding:34px;min-height:500px}
  .pro26 .pro-person-orbit,.pro26 .pro-group-signal{transform:scale(.9);transform-origin:right bottom}
}

/* GRADIENTE EN LUGAR DE CORTE. La misma elipse que dibuja el arco se usa
   de mascara, con paradas intermedias: la banda de transicion es ancha y
   sigue al arco, en vez de ser una linea de un pixel contra la foto.
   Va detras del corte de 1080 para ganarle la cascada, y delante del de
   820, que apaga el panel entero y tiene que seguir mandando.
   Sin mask-image se ve el arco solido de arriba: la pagina no depende
   de esto, solo se ve menos fino. */
@supports ((-webkit-mask-image:radial-gradient(#000,#000)) or (mask-image:radial-gradient(#000,#000))){
  .pro26 .pro-hero::before{
    inset:0 0 0 33%;border-radius:0;
    /* Las paradas salen de la geometria, no del ojo. Con la caja al 30-33%,
       centro = izq + 1,22 x ancho y radio = 1,25 x ancho, la parada 87% deja
       el panel OPACO desde el 39-42% del hero. La columna de texto arranca
       en el 45,8% en el peor caso (859px) y en el 56,2% por encima de 1180,
       asi que siempre tiene fondo solido debajo. Con las paradas anteriores
       (54%) el opaco caia en el 69,5% y entre 860 y 1180 el titular se
       imprimia sobre la fotografia del portatil. (2026-08-25) */
    /* Elipse estrecha (88%, no 104%) y meseta al 91%: asi la curva se
       desplaza 3,07 veces lo que se difumina --antes 1,33-- y se lee como
       ARCO en vez de como velo. De paso crece el margen del texto.
       La ultima parada NO puede pasar de 97,5%: 122/125 = 97,6% es justo
       el canto izquierdo de la caja, y por encima sale un corte vertical
       duro a media altura. (2026-08-25) */
    --pro-arco:radial-gradient(125% 88% at 122% 50%,
                 #000 0 91%,
                 rgba(0,0,0,.92) 93%,
                 rgba(0,0,0,.55) 94.8%,
                 rgba(0,0,0,.18) 96.3%,
                 transparent 97.5%);
    -webkit-mask-image:var(--pro-arco);
            mask-image:var(--pro-arco);
  }
  @media(max-width:1080px){
    .pro26 .pro-hero::before{inset:0 0 0 30%}
  }
}

@media(max-width:820px){
  .pro26 .pro-hero{display:block;min-height:0;background:var(--pro-night)}
  .pro26 .pro-hero::before,.pro26 .pro-hero::after{display:none}
  .pro26 .pro-hero .pro-wrap{padding:0}
  .pro26 .pro-hero-grid{display:block;min-height:0;padding:0}
  .pro26 .pro-hero-figura{position:relative;inset:auto;width:100%;height:auto;aspect-ratio:1421/800;background:#f9fbfe}
  .pro26 .pro-hero-photo{width:100%;height:100%;object-fit:cover;object-position:left center}
  .pro26 .pro-hero-copy{width:100%;max-width:none;padding:48px 24px 68px;background:linear-gradient(145deg,var(--pro-night-2),var(--pro-night))}
  .pro26 .pro-hero-copy::before{display:none}
  .pro26 .pro-hero h1{max-width:10ch;font-size:clamp(3.25rem,12vw,5.6rem)}
  .pro26 .pro-title-solid{white-space:normal}
  .pro26 .pro-privacy-head{grid-template-columns:1fr;gap:28px}
  .pro26 .pro-privacy-head h2{max-width:11ch}
  .pro26 .pro-privacy-stage{display:block;border-radius:26px 26px 0 0}
  .pro26 .pro-privacy-zone{min-height:0;padding:38px 30px}
  .pro26 .pro-privacy-boundary{min-height:330px;padding:52px 30px;border-top:1px solid rgba(255,255,255,.12);border-bottom:1px solid rgba(255,255,255,.12)}
  .pro26 .pro-boundary-line{inset:50% 0 auto;width:auto;height:1px;background:repeating-linear-gradient(to right,rgba(255,255,255,.22) 0 9px,transparent 9px 18px)}
  .pro26 .pro-boundary-line i{left:24%;top:-4px}.pro26 .pro-boundary-line i:nth-child(2){left:50%;top:-4px}.pro26 .pro-boundary-line i:nth-child(3){left:76%;top:-4px}
  .pro26 .pro-organization-rail{grid-template-columns:auto 1fr;gap:18px;border-radius:0 0 26px 26px}
  .pro26 .pro-organization-rail p{grid-column:2}
  .pro26 .pro-privacy-foot{grid-template-columns:1fr}
}

@media(max-width:520px){
  .pro26 .pro-hero-copy{padding:42px 20px 58px}
  .pro26 .pro-hero h1{font-size:clamp(2.85rem,13.5vw,4.4rem);line-height:.86}
  .pro26 .pro-title-paint{font-size:.82em}
  .pro26 .pro-hero .pro-acciones{display:grid;width:100%;gap:0}
  .pro26 .pro-hero .pro-btn{width:100%;margin:0 0 10px}
  .pro26 .pro-privacy-section{padding:82px 0}
  .pro26 .pro-privacy-head h2{font-size:clamp(3rem,14vw,4.5rem)}
  .pro26 .pro-privacy-zone{min-height:0;padding:30px 24px}
  .pro26 .pro-person-orbit{width:132px}
  .pro26 .pro-group-signal{width:132px;height:104px}
  .pro26 .pro-privacy-boundary{padding:48px 24px}
  .pro26 .pro-organization-rail{display:block;padding:28px 24px}
  .pro26 .pro-organization-rail>div{margin:18px 0 16px}
  .pro26 .pro-organization-rail p{margin:0}
}

@media(prefers-reduced-motion:reduce){
  .pro26 .pro-hero-photo,.pro26 .pro-privacy-stage *{animation:none!important;transform:none!important}
  .pro26 .pro-letter::after{clip-path:inset(0)!important;will-change:auto!important}
}

/* Cierre visual del hero: el portatil se funde con el escenario, sin rectangulo
   blanco en la base, y la promesa de privacidad mantiene contraste medible. */
.pro26 .pro-hero{background:var(--pro-night)}
.pro26 .pro-hero-figura{background:var(--pro-night)}
.pro26 .pro-hero-figura::after{
  content:"";position:absolute;inset:auto 0 0;z-index:1;display:block;height:23%;pointer-events:none;
  background:linear-gradient(180deg,rgba(6,26,48,0),rgba(6,26,48,.72) 68%,var(--pro-night));
}
.pro26 .pro-hero .pro-nota{max-width:47ch;margin:3px 0 0;padding:12px 14px 12px 16px;border-left:3px solid var(--pro-accent);border-radius:0 10px 10px 0;background:rgba(0,12,28,.72);color:#f1f7fd;font-size:14px;font-weight:620;line-height:1.48;box-shadow:0 10px 32px rgba(0,0,0,.16);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px)}
.pro26 .pro-hero .pro-nota::before{filter:brightness(0) invert(1);opacity:1}

@media(max-width:820px){
  .pro26 .pro-hero-figura::after{display:block;height:30%;background:linear-gradient(180deg,rgba(6,26,48,0),var(--pro-night))}
  .pro26 .pro-hero .pro-nota{max-width:none;margin-top:4px;background:rgba(255,255,255,.07);box-shadow:none;-webkit-backdrop-filter:none;backdrop-filter:none}
}

/* La captura de producto es evidencia, no textura. La composicion replica el
   lenguaje de la home: producto limpio, fondo claro y un fundido horizontal
   largo en el aire derecho de la foto. No hay arcos, mascaras ni halos. */
.pro26 .pro-hero-figura::after{display:none!important}
@media(min-width:1081px){
  .pro26 .pro-hero{background:#f9fbfe;color:var(--pro-ink)}
  .pro26 .pro-hero::before{
    display:block;inset:0;border-radius:0;
    background:linear-gradient(90deg,
      rgba(249,251,254,0) 0%,rgba(249,251,254,0) 44%,
      rgba(249,251,254,.1) 47%,rgba(249,251,254,.34) 50%,
      rgba(249,251,254,.68) 53%,rgba(249,251,254,.9) 56%,
      #f9fbfe 61%,#f9fbfe 100%);
    -webkit-mask-image:none;mask-image:none;
  }
  .pro26 .pro-hero::after{display:none}
  .pro26 .pro-hero-figura{width:64%;background:#f9fbfe}
}
.pro26 .pro-hero-copy{color:var(--pro-ink)}
.pro26 .pro-hero h1,.pro26 .pro-title-solid{color:var(--pro-ink)}
.pro26 .pro-title-outline{color:transparent;-webkit-text-stroke-color:var(--pro-blue);text-stroke-color:var(--pro-blue)}
.pro26 .pro-hero .pro-eyebrow{border-color:var(--pro-line);background:rgba(255,255,255,.8);color:var(--pro-blue)}
.pro26 .pro-hero .pro-lead{color:var(--pro-slate)}
.pro26 .pro-hero .pro-btn-1{border-color:var(--pro-blue);background:var(--pro-blue);color:#fff}
.pro26 .pro-hero .pro-btn-2{border-color:var(--pro-line);background:rgba(255,255,255,.82);color:var(--pro-blue)}
.pro26 .pro-hero .pro-nota{
  border-left-color:var(--pro-blue);background:rgba(255,255,255,.76);color:var(--pro-ink);
  box-shadow:none;-webkit-backdrop-filter:none;backdrop-filter:none;
}
.pro26 .pro-hero .pro-nota::before{filter:none}
@media(max-width:1080px){
  .pro26 .pro-hero{display:block;min-height:0;background:#f9fbfe;color:var(--pro-ink)}
  .pro26 .pro-hero::before,.pro26 .pro-hero::after{display:none}
  .pro26 .pro-hero .pro-wrap{padding:0}
  .pro26 .pro-hero-grid{display:block;min-height:0;padding:0}
  .pro26 .pro-hero-figura{position:relative;inset:auto;width:100%;height:auto;aspect-ratio:1421/800;background:#f9fbfe}
  .pro26 .pro-hero-photo{width:100%;height:100%;object-fit:cover;object-position:left center}
  .pro26 .pro-hero-copy{width:100%;max-width:none;margin:0;padding:48px clamp(24px,6vw,64px) 68px;background:#f9fbfe}
  .pro26 .pro-hero-copy::before{display:none}
  .pro26 .pro-title-solid{white-space:normal}
}