/* =====================================================================
   Desarrollo web · v2 (15-09-2026) · componentes propios
   Base: styles.css (mismo sistema que la v4 de captación). Se reutilizan tal cual:
   hero-txt, «Tu imagen» (akka), Antes/Después y «Lo que te aseguramos». Lo demás es diseño nuevo.
   ===================================================================== */
@keyframes recorre{0%,10%{background-position:50% 0}100%{background-position:50% 100%}}
.p-barra{display:flex;align-items:center;gap:6px;height:32px;padding:0 12px;background:#16242e;box-shadow:inset 0 -1px 0 rgba(255,255,255,.07)}
.p-barra i{width:9px;height:9px;border-radius:50%;background:rgba(255,255,255,.2)}
.p-barra span{margin-left:10px;padding:3px 12px;border-radius:6px;background:rgba(255,255,255,.07);font-size:11.5px;color:rgba(245,245,247,.7);white-space:nowrap}

/* =====================================================================
   1 · HERO (como Aeline) — titular centrado + carrusel curvo de landings (el JS coloca cada tarjeta en el arco)
   ===================================================================== */
.hero-c{padding:104px 0 60px;text-align:center;overflow:hidden;background:var(--negro)}
.hc-cielo{position:absolute;inset:-10%;pointer-events:none;background:radial-gradient(38% 30% at 18% 72%,rgba(60,193,160,.24),transparent 70%),radial-gradient(34% 26% at 82% 66%,rgba(60,193,160,.2),transparent 70%),radial-gradient(60% 38% at 50% 0%,rgba(143,240,207,.12),transparent 70%);filter:blur(12px);animation:deriva 18s ease-in-out infinite alternate}
.hc-txt{position:relative;max-width:920px}
.hero-c h1{max-width:860px;margin:0 auto;font-size:clamp(32px,4.1vw,56px)}
.hc-suave{color:#8ff0cf}
.hero-c .lead{margin:18px auto 0;max-width:620px}
.hc-cta{display:flex;flex-direction:column;align-items:center;gap:10px;margin-top:26px}
.hc-nota{font-size:14px;color:rgba(245,245,247,.6)}
.hc-escena{position:relative;height:330px;margin-top:14px;perspective:1500px;perspective-origin:50% 20%}
.hc-anillo{position:absolute;left:50%;top:34px;width:0;height:0;transform-style:preserve-3d}
.hc-card{position:absolute;left:-100px;top:0;width:200px;height:260px;border-radius:16px;overflow:hidden;background-color:#0e1c26;background-repeat:no-repeat;background-size:100% auto;background-position:50% 18px;box-shadow:inset 0 0 0 1px rgba(255,255,255,.16),0 30px 60px -24px rgba(0,0,0,.85);backface-visibility:hidden;will-change:transform,opacity}
.hc-bar{position:absolute;left:0;right:0;top:0;display:flex;align-items:center;gap:4px;height:18px;padding:0 8px;background:#16242e}
.hc-bar b{width:6px;height:6px;border-radius:50%;background:rgba(255,255,255,.25)}
.hc-bene{position:relative;list-style:none;display:flex;flex-wrap:wrap;justify-content:center;gap:10px;padding:0 var(--gutter)}
.hc-bene li{display:inline-flex;align-items:center;gap:8px;padding:9px 14px;border-radius:99px;font-size:14px;color:rgba(245,245,247,.85);background:rgba(255,255,255,.06);box-shadow:inset 0 0 0 1px rgba(255,255,255,.1)}
.hc-bene svg{width:16px;height:16px;color:var(--verde)}
@media (max-width:900px){
  .hc-escena{height:250px;perspective:800px}
  .hc-card{left:-62px;width:124px;height:170px}
}

/* =====================================================================
   2 · DÓNDE TE BUSCAN — 3 tarjetas (base .ex de styles.css) + preguntas
   ===================================================================== */
.ex-preg{list-style:none;display:grid;gap:8px;width:100%;margin-top:14px;padding:0 16px;text-align:left}
.ex-preg li{position:relative;padding:11px 12px 11px 40px;border-radius:12px;font-size:14.5px;line-height:1.45;color:var(--tinta-2);background:var(--nieve)}
.ex-preg li::before{content:"?";position:absolute;left:10px;top:10px;display:grid;place-items:center;width:21px;height:21px;border-radius:50%;font-size:12px;font-weight:700;color:var(--verde);background:var(--negro)}
.vg-busca{position:absolute;left:50%;top:22%;display:flex;align-items:center;gap:8px;width:80%;height:40px;padding:0 14px;border-radius:99px;transform:translateX(-50%);font-size:12.5px;color:var(--tinta);background:#fff}
.vg-busca svg{width:14px;height:14px;color:var(--gris)}
.vg-res{position:absolute;left:50%;top:50%;width:80%;padding:11px 13px;border-radius:12px;text-align:left;transform:translateX(-50%);background:rgba(255,255,255,.08);box-shadow:inset 0 0 0 1px rgba(255,255,255,.14)}
.vg-res::after{content:"";position:absolute;inset:-4px;border-radius:15px;box-shadow:0 0 0 2px rgba(143,240,207,.5);animation:parpadeo 2.2s ease-in-out infinite}
.vg-res small{display:block;font-size:10.5px;color:#8ff0cf}
.vg-res b{display:block;margin:2px 0 6px;font-size:13px;font-weight:600;color:#9ec1ff}
.vg-res i{display:block;height:5px;margin-top:4px;border-radius:3px;background:rgba(255,255,255,.14)}
.vg-res i.corto{width:60%}
.vr-perfil{position:absolute;left:50%;top:50%;width:76%;padding:14px;border-radius:14px;text-align:left;transform:translate(-50%,-50%);background:rgba(255,255,255,.08);box-shadow:inset 0 0 0 1px rgba(255,255,255,.14)}
.vr-top{display:flex;align-items:center;gap:10px}
.vr-av{flex:none;width:44px;height:44px;border-radius:50%;background:linear-gradient(135deg,var(--verde),#1d6f5c);box-shadow:0 0 0 2px #10302c,0 0 0 4px #dd2a7b}
.vr-top b{display:block;font-size:13px;color:#fff}
.vr-top small{font-size:11px;color:rgba(255,255,255,.55)}
.vr-cifras{display:flex;gap:14px;margin:10px 0;font-size:11px;color:rgba(255,255,255,.65)}
.vr-cifras b{color:#fff}
.vr-link{display:inline-flex;align-items:center;gap:6px;padding:5px 11px;border-radius:99px;font-size:11.5px;font-weight:600;color:#8ff0cf;background:rgba(60,193,160,.2);animation:latido 2s ease-out infinite}
.vr-link svg{width:13px;height:13px}
.vw-chat{position:absolute;left:50%;top:50%;display:grid;gap:8px;width:80%;transform:translate(-50%,-50%)}
.vw-chat p{max-width:88%;padding:9px 12px;border-radius:12px;font-size:12px;line-height:1.35;text-align:left}
.vw-chat .rec{color:var(--tinta);background:#fff;border-bottom-left-radius:3px}
.vw-chat .link{margin-left:auto;color:#fff;background:#1f7a5c;border-bottom-right-radius:3px}
.vw-chat .link b{display:block;margin-top:4px;color:#b9ffe6}

/* =====================================================================
   6b · SECTORES (BrainwaveBoard) — fotos de profesionales dispersas + etiquetas
   ===================================================================== */
.sectores{position:relative;padding:100px 0;overflow:hidden;background:#fff}
.sc-tablero{position:relative;height:820px;max-width:1280px;margin:0 auto}
.sc-centro{position:absolute;left:50%;top:50%;z-index:4;width:min(600px,90%);transform:translate(-50%,-50%);text-align:center}
.sc-centro h2{font-size:clamp(32px,3.6vw,52px)}
.sc-centro p{max-width:500px;margin:18px auto 0;font-size:17px;color:var(--tinta-2)}
.sc-centro .cta{align-items:center}
.sc-foto{position:absolute;z-index:2;margin:0;border-radius:22px;overflow:hidden;background:#f3f4f6;box-shadow:0 30px 60px -34px rgba(10,20,28,.45),inset 0 0 0 1px var(--linea);rotate:var(--r,0deg);animation:flota 7s ease-in-out infinite;animation-delay:var(--d,0s)}
.sc-foto img{display:block;width:100%;aspect-ratio:1;object-fit:cover}
.s1{left:3%;top:3%;width:175px}
.s2{left:25%;top:0;width:150px}
.s3{right:24%;top:1%;width:150px}
.s4{right:2%;top:11%;width:205px}
.s5{left:1%;bottom:7%;width:210px}
.s6{left:24%;bottom:0;width:160px}
.s7{right:4%;bottom:3%;width:195px}
.sc-pill{position:absolute;z-index:3;padding:9px 16px;border-radius:99px;font-size:14px;font-weight:500;white-space:nowrap;box-shadow:0 14px 30px -18px rgba(10,20,28,.45);animation:flota 7s ease-in-out infinite;animation-delay:var(--d,0s)}
.sc-pill.rosa{color:#7a2e22;background:#fbd9d3}
.sc-pill.verde{color:var(--verde-os);background:var(--verde-agua)}
.sc-pill.negra{color:#fff;background:var(--negro)}
.p1{left:6%;top:27%}.p2{left:27%;top:21%}.p3{right:22%;top:22%}.p4{right:4%;top:44%}.p5{left:3%;top:59%}.p6{left:25%;bottom:23%}.p7{right:23%;bottom:22%}.p8{right:3%;bottom:31%}
@media (max-width:900px){
  .sectores{padding:80px 0}
  .sc-tablero{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;height:auto;padding:0 var(--gutter)}
  .sc-centro{position:relative;left:auto;top:auto;grid-column:1/-1;order:-1;width:100%;margin-bottom:26px;transform:none}
  .sc-foto{position:relative;left:auto;right:auto;top:auto;bottom:auto;width:auto;border-radius:16px;animation:none}
  .sc-foto.s7{display:none}
  .sc-pill{display:none}
}

/* =====================================================================
   6c · LO TUYO — baraja de tarjetas (Naver): la de delante se inclina y sale por la izquierda,
   la de detrás avanza; dos asoman por la derecha; miniaturas debajo
   ===================================================================== */
.baraja{position:relative;padding:120px 0 100px;overflow:hidden;color:#fff;background:#0d1a20}
.baraja .cab{margin-bottom:46px}
.baraja .cab p{color:rgba(245,245,247,.66)}
.bj-mesa{position:relative;display:flex;justify-content:center}
.bj-pila{position:relative;width:min(400px,78vw);height:540px}
.bj-card{position:absolute;inset:0;display:flex;flex-direction:column;padding:30px 30px 32px;border-radius:26px;color:var(--tinta);background:#fff;box-shadow:0 40px 70px -40px rgba(0,0,0,.9);transform-origin:50% 90%;transition:transform .75s cubic-bezier(.3,.7,.2,1),opacity .6s ease,box-shadow .6s;will-change:transform,opacity}
.bj-card[data-k="0"]{z-index:10;transform:none;opacity:1}
.bj-card[data-k="1"]{z-index:9;transform:translateX(26px) scale(.955) rotate(2.2deg);opacity:1}
.bj-card[data-k="2"]{z-index:8;transform:translateX(48px) scale(.91) rotate(4.4deg);opacity:1}
.bj-card[data-k="3"]{z-index:7;transform:translateX(60px) scale(.87) rotate(5.5deg);opacity:0}
.bj-card[data-k="atras"]{z-index:1;transform:translateX(60px) scale(.85) rotate(6deg);opacity:0;transition:none}
.bj-card[data-k="fuera"]{z-index:11;transform:translateX(-118%) translateY(20px) rotate(-12deg) scale(.92);opacity:0;pointer-events:none}
.bj-card:not([data-k="0"]) *{pointer-events:none}
.bj-card.verde{background:var(--verde)}
.bj-card.oscura{color:#fff;background:#16303a;box-shadow:inset 0 0 0 1px rgba(255,255,255,.12),0 40px 70px -40px rgba(0,0,0,.9)}
.bj-top{display:flex;justify-content:space-between;align-items:center;gap:12px;font-size:13.5px;font-weight:600}
.bj-ir{display:grid;place-items:center;width:34px;height:34px;border-radius:50%;background:var(--negro);color:#fff;transform:rotate(-45deg)}
.bj-card.oscura .bj-ir{background:#fff;color:var(--negro)}
.bj-ir svg{width:15px;height:15px}
.bj-card h3{margin-top:30px;font-size:clamp(26px,2.4vw,32px);line-height:1.15}
.bj-card p{margin-top:14px;font-size:15px;line-height:1.5;opacity:.78}
.bj-foto{width:118px;height:118px;margin-top:auto;border-radius:24px;background-size:cover;background-position:center 20%;box-shadow:0 14px 30px -14px rgba(10,20,28,.5)}
.bj-minis{display:flex;justify-content:center;gap:12px;margin-top:40px;flex-wrap:wrap}
.bj-mini{width:64px;height:64px;border-radius:18px;background-size:cover;background-position:center 20%;opacity:.45;box-shadow:inset 0 0 0 1px rgba(255,255,255,.12);transition:opacity .4s,transform .4s var(--ease),box-shadow .4s}
.bj-mini:hover{opacity:.8}
.bj-mini.act{opacity:1;transform:scale(1.08);box-shadow:0 0 0 3px #0d1a20,0 0 0 5px #fff}
.bj-flechas{display:flex;justify-content:center;gap:48px;margin-top:28px}
.bj-flechas button{display:grid;place-items:center;width:48px;height:48px;color:#fff;transition:transform .3s var(--ease)}
.bj-flechas button:hover{transform:scale(1.15)}
.bj-flechas svg{width:30px;height:30px}
#bjPrev svg{transform:rotate(180deg)}
html.estatico .bj-card{transition:none}
/* la baraja dentro del hero: texto a la izquierda, baraja a la derecha */
.hero-bj{text-align:left;padding:120px 0 70px}
.hero-bj .hero-grid{grid-template-columns:minmax(0,1fr) minmax(0,.95fr);gap:clamp(40px,5vw,80px)}
.hero-bj .hero-txt h1{max-width:620px;margin:0;font-size:clamp(34px,4vw,56px)}
.hero-bj .lead{margin:20px 0 0;max-width:540px}
.hero-bj .cta{align-items:flex-start}
.bj-hero{position:relative;display:flex;flex-direction:column;align-items:center;padding-right:50px}
.bj-hero .bj-pila{height:520px;width:380px;max-width:100%}
.bj-hero .bj-minis{flex-wrap:nowrap;gap:8px;margin-top:30px}
.bj-hero .bj-mini{flex:none;width:50px;height:50px;border-radius:14px}
.bj-hero .bj-mini.act{box-shadow:0 0 0 3px var(--negro),0 0 0 5px #fff}
/* tarjetas = webs: ventana de navegador con la captura que se recorre sola */
.bj-card.bj-web{padding:0;overflow:hidden;background:#0e1c26;box-shadow:inset 0 0 0 1px rgba(255,255,255,.16),0 40px 80px -40px rgba(0,0,0,.95)}
.bj-bar{position:relative;z-index:2;display:flex;align-items:center;gap:6px;height:38px;padding:0 14px;background:#16242e;box-shadow:inset 0 -1px 0 rgba(255,255,255,.07)}
.bj-bar i{width:9px;height:9px;border-radius:50%;background:rgba(255,255,255,.22)}
.bj-bar span{margin-left:10px;padding:4px 12px;border-radius:7px;background:rgba(255,255,255,.08);font-size:12px;color:rgba(245,245,247,.8);white-space:nowrap}
.bj-bar b{margin-left:auto;font-size:11.5px;font-weight:600;color:var(--verde);font-variant-numeric:tabular-nums}
/* solo la web, sin barra de navegador y sin recorrido: se ve la parte de arriba fija */
.bj-pant{position:absolute;inset:0;background-color:#fff;background-repeat:no-repeat;background-size:100% auto;background-position:50% 0}
html.estatico .bj-pant{animation:none}
.bj-hero .bj-mini{background-size:100% auto;background-position:50% 0}
/* flechas con el estilo de los botones de la landing: círculo claro, la de avanzar en verde con giro de 45° al pasar */
.bj-hero .bj-flechas{gap:14px;margin-top:22px}
.bj-hero .bj-flechas button{width:52px;height:52px;border-radius:50%;color:#fff;background:rgba(255,255,255,.06);box-shadow:inset 0 0 0 1px rgba(255,255,255,.16);transition:background .3s,color .3s,transform .45s var(--ease),box-shadow .3s}
.bj-hero .bj-flechas svg{width:20px;height:20px;transition:transform .45s var(--ease)}
.bj-hero .bj-flechas button:hover{transform:translateY(-2px);background:rgba(255,255,255,.12)}
.bj-hero #bjNext{color:var(--negro);background:var(--verde);box-shadow:0 14px 30px -12px rgba(60,193,160,.7)}
.bj-hero #bjNext:hover svg{transform:rotate(-45deg)}
.bj-hero #bjPrev:hover svg{transform:rotate(180deg) translateX(3px)}
@media (max-width:1100px){
  .hero-bj .hero-grid{grid-template-columns:1fr}
  .bj-hero{padding-right:40px}
}
@media (max-width:900px){
  .baraja{padding:90px 0 80px}
  .bj-pila{height:560px;width:min(320px,76vw)}
  .bj-card{padding:24px}
  .bj-card h3{margin-top:22px;font-size:25px}
  .bj-card p{font-size:14px}
  .bj-foto{width:96px;height:96px;border-radius:20px}
  .bj-minis{flex-wrap:nowrap;gap:6px;margin-top:30px}
  .bj-mini{flex:none;width:40px;height:40px;border-radius:12px}
  .bj-hero .bj-pila{height:560px;width:min(320px,76vw)}
  .bj-hero .bj-mini{width:40px;height:40px;border-radius:12px}
  .bj-hero{padding-right:34px}
}

/* =====================================================================
   6b · SECTORES — igual que el contador de captación (secciones-v5.css): mapa de España en puntos,
   titular en el centro, profesionales en círculos unidos por hilos de puntos
   ===================================================================== */
.n-gente{position:relative;overflow:hidden;background:#fff;padding:90px 0 100px;text-align:center}
.n-red{position:relative;width:min(1240px,100% - var(--gutter)*2);height:clamp(620px,60vw,760px);margin:0 auto}
#nMapaCont,#nHilos{position:absolute;inset:0;width:100%;height:100%}
.n-centro{position:absolute;left:50%;top:50%;z-index:4;width:min(700px,100%);padding:0 12px;transform:translate(-50%,-50%)}
.n-tit{font-size:clamp(40px,5.4vw,70px);line-height:1.02;letter-spacing:-.045em;color:var(--tinta)}
.n-sub{max-width:540px;margin:20px auto 0;font-size:clamp(16px,1.35vw,18px);line-height:1.55;color:var(--tinta-2)}
.n-tags{list-style:none;display:flex;flex-wrap:wrap;justify-content:center;gap:8px;max-width:600px;margin:24px auto 0}
.n-tags li{padding:7px 14px;border-radius:99px;font-size:13.5px;font-weight:500;color:var(--verde-os);background:var(--verde-agua);box-shadow:inset 0 0 0 1px rgba(47,163,135,.18)}
.n-tags li:nth-child(3n+2){color:var(--tinta);background:#f0f1f3;box-shadow:inset 0 0 0 1px var(--linea)}
.n-tags li:nth-child(5n){color:#fff;background:var(--negro)}
.n-hilo{fill:none;stroke:var(--c);stroke-width:3.2;stroke-linecap:round;stroke-dasharray:1 8;opacity:0;transition:opacity 1s,stroke-width .4s;animation:n-fluye 1.4s linear infinite}
.n-gente.ver .n-hilo{opacity:.85}
.n-gente.ver .n-hilo.vivo{opacity:1;stroke-width:4}
@keyframes n-fluye{to{stroke-dashoffset:-9}}
.n-punto{fill:#fff;stroke:var(--c);stroke-width:3}
.n-nodo{position:absolute;z-index:2;width:84px;height:84px;margin:-42px 0 0 -42px;padding:3px;border-radius:50%;background:var(--c);box-shadow:0 12px 26px -12px rgba(10,20,28,.45);transform:scale(0)}
.n-gente.ver .n-nodo{animation:n-pop .8s var(--ease) forwards;animation-delay:var(--d)}
@keyframes n-pop{60%{transform:scale(1.08)}to{transform:scale(1)}}
.n-nodo img{display:block;width:100%;height:100%;border-radius:50%;object-fit:cover;border:2px solid #fff;background:#eef1f3}
.n-nodo.ping::after{content:"";position:absolute;inset:-3px;border-radius:50%;border:2px solid var(--c);animation:n-ping 1.3s ease-out forwards}
@keyframes n-ping{to{inset:-18px;opacity:0}}
.n-chip{position:absolute;z-index:3;display:flex;align-items:center;gap:10px;padding:9px 16px 9px 9px;border-radius:14px;background:#fff;box-shadow:0 0 0 1px var(--linea),0 18px 36px -16px rgba(10,20,28,.32);font-size:15px;font-weight:500;color:var(--tinta);white-space:nowrap;opacity:0;transform:translate(-50%,-50%) scale(.7);transition:opacity .45s,transform .6s var(--ease)}
.n-chip.on{opacity:1;transform:translate(-50%,-50%) scale(1)}
.n-chip .n-ico{flex:none;display:grid;place-items:center;width:28px;height:28px;border-radius:8px;background:var(--verde-agua);color:var(--verde-os)}
.n-chip .n-ico svg{width:15px;height:15px}
.n-chip em{font-style:normal;font-weight:400;color:var(--gris)}
.n-gente .cta{position:relative;z-index:4;margin-top:20px;align-items:center;padding:0 var(--gutter)}
.n-gente .btn{background:var(--negro);color:#fff}
.n-gente .btn .arr{background:var(--verde);color:var(--negro)}
html.estatico .n-nodo{animation:none!important;transform:none}
html.estatico .n-hilo{opacity:.85}
@media (max-width:760px){
  .n-gente{padding:70px 0 80px}
  .n-red{height:860px}
  .n-nodo{width:62px;height:62px;margin:-31px 0 0 -31px}
  .n-tit{font-size:38px}
  .n-chip{font-size:13px}
}

/* =====================================================================
   PIE — el de captación (secciones-v5.css) adaptado: tarjeta oscura con esquinas redondas
   ===================================================================== */
.n-pie{background:#fff;padding:0 10px 10px}
.n-pie-caja{position:relative;overflow:hidden;border-radius:36px;background:#060d12;color:rgba(245,245,247,.7);padding-top:90px;isolation:isolate;text-align:left}
.n-pie-rejilla{position:absolute;inset:0;z-index:-1;background-image:radial-gradient(rgba(255,255,255,.07) 1px,transparent 1.2px);background-size:22px 22px;-webkit-mask-image:radial-gradient(80% 60% at 50% 100%,#000,transparent 75%);mask-image:radial-gradient(80% 60% at 50% 100%,#000,transparent 75%)}
.n-pie-aura{position:absolute;left:50%;top:-340px;z-index:-1;width:1100px;height:600px;transform:translateX(-50%);border-radius:50%;background:radial-gradient(closest-side,rgba(60,193,160,.24),transparent);filter:blur(20px);animation:n-aura 9s ease-in-out infinite alternate}
@keyframes n-aura{to{transform:translateX(-50%) scale(1.15);opacity:.7}}
.n-pie-cta{display:flex;align-items:flex-end;justify-content:space-between;gap:40px;padding-bottom:70px}
.n-pie-estado{display:inline-flex;align-items:center;gap:10px;height:34px;padding:0 14px 0 10px;border-radius:99px;background:rgba(60,193,160,.1);box-shadow:inset 0 0 0 1px rgba(60,193,160,.25);font-size:13.5px;font-weight:500;color:var(--verde)}
.n-pie-estado i{width:8px;height:8px;border-radius:50%;background:var(--verde);animation:n-late 1.8s ease-out infinite}
@keyframes n-late{0%{box-shadow:0 0 0 0 rgba(60,193,160,.7)}70%,100%{box-shadow:0 0 0 9px rgba(60,193,160,0)}}
.n-pie-cta h2{margin-top:22px;max-width:760px;font-size:clamp(34px,4.6vw,64px);letter-spacing:-.045em;color:#fff}
.n-pie-cta h2 span{display:block;color:rgba(245,245,247,.42)}
.n-pie-cta p{margin-top:18px;max-width:520px;font-size:17px;color:rgba(245,245,247,.6)}
.n-pie-cta .btn{flex:none}
.n-pie-cinta{position:relative;overflow:hidden;padding:18px 0;border-block:1px solid rgba(255,255,255,.07);-webkit-mask-image:linear-gradient(90deg,transparent,#000 10%,#000 90%,transparent);mask-image:linear-gradient(90deg,transparent,#000 10%,#000 90%,transparent)}
.n-pie-cinta-pista{display:flex;gap:14px;width:max-content;animation:n-cinta 60s linear infinite}
.n-pie-cinta:hover .n-pie-cinta-pista{animation-play-state:paused}
@keyframes n-cinta{to{transform:translateX(-50%)}}
.n-pie-item{display:inline-flex;align-items:center;gap:10px;height:44px;padding:0 16px 0 7px;border-radius:99px;background:rgba(255,255,255,.04);box-shadow:inset 0 0 0 1px rgba(255,255,255,.08);font-size:14px;white-space:nowrap;color:rgba(245,245,247,.62)}
.n-pie-item b{font-weight:600;color:#fff}
.n-pie-item i{display:grid;place-items:center;width:30px;height:30px;border-radius:50%;background:rgba(60,193,160,.16);color:var(--verde)}
.n-pie-item i svg{width:15px;height:15px}
.n-pie-item em{font-style:normal;font-size:12.5px;color:var(--verde)}
.n-pie-grid{display:grid;grid-template-columns:1.7fr 1fr 1fr .8fr;gap:48px;padding:70px 0 20px}
.n-pie-marca .logo{margin-bottom:18px}
.n-pie-marca p{max-width:400px;font-size:15px;line-height:1.6}
.n-pie-garantia{display:inline-flex;align-items:center;gap:9px;margin-top:20px;font-size:14px;font-weight:500;color:var(--verde)}
.n-pie-garantia svg{width:20px;height:20px}
.n-pie-col h6{margin-bottom:16px;font-size:12.5px;font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:#fff}
.n-pie-col a{position:relative;display:table;margin-bottom:10px;font-size:15px;color:rgba(245,245,247,.62);transition:color .3s,transform .35s var(--ease)}
.n-pie-col a::after{content:"";position:absolute;left:0;right:0;bottom:-2px;height:1px;background:var(--verde);transform:scaleX(0);transform-origin:0 50%;transition:transform .45s var(--ease)}
.n-pie-col a:hover{color:#fff;transform:translateX(4px)}
.n-pie-col a:hover::after{transform:scaleX(1)}
.n-pie-gigante{position:relative;width:min(var(--wrap),100% - var(--gutter)*2);margin:10px auto 0;font-weight:700;letter-spacing:-.065em;line-height:.78;white-space:nowrap;user-select:none;--mx:50%;--my:50%}
.n-pie-base,.n-pie-luz{display:block;padding-bottom:.08em}
.n-pie-base{color:transparent;-webkit-text-stroke:1px rgba(255,255,255,.13)}
.n-pie-luz{position:absolute;inset:0;background:linear-gradient(180deg,#e9fff7 0%,var(--verde) 55%,rgba(60,193,160,.2) 100%);-webkit-background-clip:text;background-clip:text;color:transparent;-webkit-mask-image:radial-gradient(circle 260px at var(--mx) var(--my),#000 0%,rgba(0,0,0,.35) 45%,transparent 75%);mask-image:radial-gradient(circle 260px at var(--mx) var(--my),#000 0%,rgba(0,0,0,.35) 45%,transparent 75%)}
.n-pie-baja{display:flex;align-items:center;justify-content:space-between;gap:20px;padding:26px 0 30px;border-top:1px solid rgba(255,255,255,.07);font-size:13.5px;color:rgba(245,245,247,.45)}
.n-pie-arriba{display:inline-flex;align-items:center;gap:10px;color:rgba(245,245,247,.75);transition:color .3s}
.n-pie-arriba i{display:grid;place-items:center;width:34px;height:34px;border-radius:50%;box-shadow:inset 0 0 0 1px rgba(255,255,255,.15);transition:background .3s,transform .45s var(--ease)}
.n-pie-arriba svg{width:15px;height:15px;transform:rotate(-90deg)}
.n-pie-arriba:hover{color:#fff}
.n-pie-arriba:hover i{background:var(--verde);color:var(--negro);transform:translateY(-3px)}
html.estatico .n-pie-cinta-pista,html.estatico .n-pie-aura{animation:none}
.faq2+.n-pie{padding-top:0}
@media (max-width:900px){
  .n-pie-cta{flex-direction:column;align-items:flex-start;gap:30px}
  .n-pie-grid{grid-template-columns:1fr 1fr;gap:36px}
  .n-pie-marca{grid-column:1/-1}
}
@media (max-width:560px){
  .n-pie{padding:0 6px 6px}
  .n-pie-caja{border-radius:26px;padding-top:64px;padding-bottom:70px}
  .n-pie-cta{padding-bottom:50px}
  .n-pie-cta .btn{width:100%;justify-content:space-between}
  .n-pie-grid{padding-top:50px}
  .n-pie-baja{flex-direction:column-reverse;align-items:flex-start}
}

/* =====================================================================
   HERO · efectos de «estudio-verde-lima-motion» con los colores de la marca:
   interruptor que pulsa un cursor, puntos que salen y se desvanecen, chispas que cruzan
   ===================================================================== */
.tg{position:relative;display:inline-flex;align-items:center;vertical-align:middle;width:3.3em;height:1.22em;margin-left:.15em;border-radius:99px;font-size:.9em;white-space:nowrap;background:linear-gradient(90deg,#0f2a2b,#123838);box-shadow:inset 0 0 0 1px rgba(60,193,160,.2);animation:tgBg 6s infinite}
/* el texto usa su propio tamaño (.4em): 3em aquí = a la derecha del logo; 1.1em = a su izquierda cuando se enciende */
.tg-lbl{position:absolute;left:3em;font-size:.4em;font-weight:500;letter-spacing:0;color:rgba(245,245,247,.35);animation:tgLbl 6s infinite}
.tg-knob{position:absolute;left:.12em;display:grid;place-items:center;width:1em;height:1em;border-radius:50%;background:rgba(255,255,255,.1);animation:tgKnob 6s infinite}
.tg-knob .iso{width:.6em;height:.5em;fill:#eafff7;filter:drop-shadow(0 0 6px var(--verde))}
.tg-burst{position:absolute;right:-.5em;top:50%;width:1.6em;height:1.6em;translate:0 -50%;pointer-events:none}
.tg-burst i{position:absolute;left:50%;top:50%;width:4px;height:4px;border-radius:50%;background:#8ff0cf;box-shadow:0 0 6px var(--verde);opacity:0;animation:tgPop 6s infinite}
.tg-burst i:nth-child(1){--x:18px;--y:-14px}.tg-burst i:nth-child(2){--x:24px;--y:2px}.tg-burst i:nth-child(3){--x:16px;--y:16px}.tg-burst i:nth-child(4){--x:6px;--y:-20px}.tg-burst i:nth-child(5){--x:30px;--y:-8px}
.tg-cursor{position:absolute;right:-1.4em;top:1.3em;width:.6em;height:.6em;color:#b9ffe6;filter:drop-shadow(0 0 6px rgba(60,193,160,.8));animation:tgCur 6s infinite;pointer-events:none}
@keyframes tgBg{0%,40%{background:linear-gradient(90deg,#0f2a2b,#123838);box-shadow:inset 0 0 0 1px rgba(60,193,160,.2)}50%,90%{background:linear-gradient(90deg,#1d6f5c 0%,#3cc1a0 55%,#8ff0cf 100%);box-shadow:0 0 24px rgba(60,193,160,.5)}100%{background:linear-gradient(90deg,#0f2a2b,#123838)}}
@keyframes tgKnob{0%,40%{left:.12em}50%,90%{left:2.18em}100%{left:.12em}}
@keyframes tgLbl{0%,40%{left:3em;color:rgba(245,245,247,.35)}50%,90%{left:1.1em;color:#06231c}100%{left:3em;color:rgba(245,245,247,.35)}}
@keyframes tgPop{0%,44%{opacity:0;transform:translate(0,0)}48%{opacity:1}62%{opacity:0;transform:translate(var(--x),var(--y))}100%{opacity:0}}
@keyframes tgCur{0%{transform:translate(2.2em,1.8em)}32%{transform:translate(0,0)}38%{transform:translate(0,0) scale(.8)}42%{transform:translate(0,0) scale(1)}70%{transform:translate(.8em,1.2em)}100%{transform:translate(2.2em,1.8em)}}
.spk{position:absolute;z-index:1;width:14px;height:6px;border-radius:9px;background:#d9fff0;box-shadow:0 0 8px var(--verde),0 0 18px rgba(60,193,160,.7);opacity:0;pointer-events:none;transform:rotate(var(--r,20deg));animation:spkFly 3.2s cubic-bezier(.3,.6,.4,1) infinite;animation-delay:var(--d,0s)}
@keyframes spkFly{0%{opacity:0;translate:0 0}15%{opacity:1}100%{opacity:0;translate:var(--dx,120px) var(--dy,60px)}}
/* en capturas fijas: sin animación, interruptor encendido */
html.estatico .tg,html.estatico .tg-knob,html.estatico .tg-lbl,html.estatico .tg-cursor,html.estatico .tg-burst i,html.estatico .spk{animation:none}
html.estatico .tg{background:linear-gradient(90deg,#1d6f5c 0%,#3cc1a0 55%,#8ff0cf 100%);box-shadow:0 0 24px rgba(60,193,160,.5)}
html.estatico .tg-knob{left:2.18em}
html.estatico .tg-lbl{left:1.1em;color:#06231c}
html.estatico .tg-cursor{transform:translate(.3em,.4em)}
html.estatico .spk{opacity:1}

/* =====================================================================
   13 · QUIÉN LA HACE — la sección «No somos una agencia más» de captación (secciones-v5.css) en blanco:
   manifiesto que se enciende · foto pegada con 2 citas · línea de tiempo de 8 pasos con barritas que crecen
   ===================================================================== */
.n-socio{position:relative;overflow:hidden;overflow:clip;background:#fff;color:var(--tinta);padding:130px 0 120px}
.n-socio-malla{position:absolute;inset:0;background-image:radial-gradient(rgba(10,20,28,.09) 1px,transparent 1.2px);background-size:24px 24px;-webkit-mask-image:radial-gradient(55% 55% at 26% 62%,#000,transparent 75%);mask-image:radial-gradient(55% 55% at 26% 62%,#000,transparent 75%);pointer-events:none}
.n-socio .wrap{position:relative}
.n-socio-cab{max-width:1060px}
.n-socio-eti{display:inline-flex;align-items:center;gap:8px;height:32px;padding:0 14px;border-radius:99px;background:var(--verde-agua);color:var(--verde-os);font-size:13.5px;font-weight:600}
.n-socio-eti::before{content:"";width:6px;height:6px;border-radius:50%;background:var(--verde)}
.n-socio h2{margin-top:20px;font-size:clamp(34px,4.8vw,68px);line-height:1.03;letter-spacing:-.045em;color:var(--tinta)}
.n-socio-verde{position:relative;display:inline-block;color:var(--verde-os)}
.n-subraya{position:absolute;left:-1%;bottom:-.16em;width:102%;height:.32em;overflow:visible}
.n-subraya path{fill:none;stroke:var(--verde);stroke-width:5;stroke-linecap:round;vector-effect:non-scaling-stroke;stroke-dasharray:100;stroke-dashoffset:100;transition:stroke-dashoffset 1.4s var(--ease) .7s}
.n-socio h2.vis .n-subraya path,html.estatico .n-subraya path{stroke-dashoffset:0}
.n-manif{margin-top:36px;max-width:1020px;font-size:clamp(21px,2.3vw,33px);font-weight:500;line-height:1.35;letter-spacing:-.02em;color:#c3c9ce}
.n-manif span{transition:color .35s ease}
.n-manif span.on{color:var(--tinta)}
.n-manif span.clave.on{color:var(--verde-os)}
html.estatico .n-manif span{color:var(--tinta)}
.n-socio-grid{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:clamp(40px,5vw,84px);align-items:start;margin-top:90px}
.n-socio-lado{position:sticky;top:90px}
.n-foto{position:relative}
.n-foto-img{display:block;width:100%;height:min(80vh,760px);object-fit:cover;object-position:50% 20%;border-radius:24px}
.n-cita{position:absolute;z-index:7;margin:0;max-width:250px;padding:14px 16px 12px;border-radius:18px 18px 18px 6px;background:#fff;box-shadow:0 0 0 1px var(--linea),0 24px 44px -22px rgba(10,20,28,.4);animation:n-flota 6s ease-in-out infinite}
@keyframes n-flota{50%{transform:translateY(-8px)}}
.n-cita blockquote{font-size:14px;font-weight:500;line-height:1.4;color:var(--tinta)}
.n-cita figcaption{display:flex;align-items:center;gap:8px;margin-top:10px;font-size:12.5px;font-weight:600;color:var(--verde-os)}
.n-cita figcaption i{display:grid;place-items:center;width:22px;height:22px;border-radius:50%;background:var(--verde-agua);font-style:normal;font-size:11px}
.n-foto .n-cita.q1{left:-4%;top:12%}
.n-foto .n-cita.q2{right:-4%;top:58%;border-radius:18px 18px 6px 18px;animation-delay:-3s}
.n-hist-eti{font-size:13px;font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:var(--gris)}
.n-hist{--p:0;position:relative;list-style:none;margin-top:26px;padding-left:58px}
.n-hist::before,.n-hist::after{content:"";position:absolute;left:17px;top:10px;bottom:10px;width:2px;border-radius:2px;background:var(--linea)}
.n-hist::after{background:linear-gradient(180deg,var(--verde),var(--verde-os));transform-origin:50% 0;transform:scaleY(var(--p));box-shadow:0 0 12px rgba(60,193,160,.5)}
.n-cap{position:relative;padding:4px 0 50px;opacity:.38;transition:opacity .6s ease}
.n-cap:last-child{padding-bottom:4px}
.n-cap::before{content:"";position:absolute;left:-49px;top:6px;z-index:1;width:18px;height:18px;border-radius:50%;background:#fff;box-shadow:inset 0 0 0 2px #cfd5da;transition:box-shadow .5s,background .5s}
.n-cap.on{opacity:1}
.n-cap.on::before{background:var(--verde);box-shadow:inset 0 0 0 4px #fff,0 0 0 2px var(--verde),0 0 0 9px rgba(60,193,160,.18)}
.n-cap-top{display:flex;align-items:center;justify-content:space-between;gap:16px;max-width:560px}
.n-cap-eti{display:block;font-size:12.5px;font-weight:600;letter-spacing:.06em;text-transform:uppercase;color:var(--verde-os)}
.n-cap-sube{display:flex;align-items:flex-end;gap:3px;height:24px}
.n-cap-sube i{width:6px;border-radius:2px;background:rgba(10,20,28,.1);transition:background .4s}
.n-cap-sube i:nth-child(1){height:4px}.n-cap-sube i:nth-child(2){height:7px}.n-cap-sube i:nth-child(3){height:10px}.n-cap-sube i:nth-child(4){height:13px}.n-cap-sube i:nth-child(5){height:16px}.n-cap-sube i:nth-child(6){height:19px}.n-cap-sube i:nth-child(7){height:22px}.n-cap-sube i:nth-child(8){height:24px}
.n-cap.on .n-cap-sube i.l{background:var(--verde)}
.n-cap h3{margin-top:8px;max-width:560px;font-size:clamp(22px,2vw,28px);line-height:1.15;letter-spacing:-.03em;color:var(--tinta)}
.n-cap p{margin-top:12px;max-width:560px;font-size:16px;line-height:1.6;color:var(--tinta-2)}
.n-prueba{display:inline-flex;align-items:center;gap:12px;margin-top:18px;padding:8px 18px 8px 8px;border-radius:99px;background:var(--nieve);box-shadow:inset 0 0 0 1px var(--linea);font-size:14px;font-weight:500;color:var(--tinta-2);transform:translateY(8px);transition:transform .6s var(--ease),background .5s}
.n-prueba b{flex:none;display:grid;place-items:center;min-width:44px;height:36px;padding:0 12px;border-radius:99px;background:var(--negro);color:var(--verde);font-size:15px;font-weight:700;letter-spacing:-.02em;white-space:nowrap}
.n-cap.on .n-prueba{transform:none}
.n-prueba-verde{background:var(--verde-agua)}
.n-socio-txt>.cta{margin-top:40px;padding-left:58px}
.n-socio .btn{background:var(--negro);color:#fff}
.n-socio .btn .arr{background:var(--verde);color:var(--negro)}
html.estatico .n-cap{opacity:1}
html.estatico .n-prueba{transform:none}
html.estatico .n-cita{animation:none}
@media (max-width:900px){
  .n-socio{padding:100px 0 90px}
  .n-socio-grid{grid-template-columns:1fr;gap:40px;margin-top:50px}
  .n-socio-lado{position:relative;top:0}
  .n-foto-img{height:520px}
}
@media (max-width:560px){
  .n-socio{padding:80px 0 70px}
  .n-foto-img{height:440px}
  .n-foto .n-cita.q1{left:0;top:4%}.n-foto .n-cita.q2{right:0;top:70%}
  .n-cita{max-width:200px;padding:10px 12px}
  .n-cita blockquote{font-size:12.5px}
  .n-socio-txt>.cta{padding-left:0}
  .n-hist{padding-left:44px}
  .n-hist::before,.n-hist::after{left:11px}
  .n-cap::before{left:-41px}
  .n-prueba{align-items:flex-start;padding-right:14px;font-size:13px}
}

/* ANTES / DESPUÉS en móvil: las dos listas y los dos títulos siempre visibles, sin estados del efecto de escritorio */
@media (max-width:900px){
  .cambio .pegado .t-antes,.cambio .pegado.despues .t-antes{opacity:1;transform:none;color:#fff}
  .cambio .pegado .l-antes,.cambio .pegado.despues .l-antes{opacity:1;transform:none;pointer-events:auto}
  .cambio .pegado .l-despues,.cambio .pegado.despues .l-despues{opacity:1;transform:none}
  /* sin la palabra gigante (en móvil confundía: ponía «Después» encima de la lista de «Antes») y sin transiciones a medias */
  .cambio .palabras{display:none}
  .cambio .pegado *{transition:none!important}
  .cambio .pegado .t-despues,.cambio .pegado.despues .t-despues{opacity:1;transform:none;color:#fff}
  .cambio .listas .suave{color:rgba(245,245,247,.55)}
  .cambio .t-antes{color:#fff}
}

/* 1 · (anterior) HERO derecha — imagen del dueño (Claudio con las webs); sin uso desde que el hero es centrado */
.hero-foto{position:relative;margin:0 -20px 0 0}
.hero-foto::before{content:"";position:absolute;left:50%;top:48%;width:80%;height:70%;transform:translate(-50%,-50%);background:radial-gradient(closest-side,rgba(60,193,160,.28),transparent 75%);filter:blur(30px);pointer-events:none}
.hero-foto img{position:relative;display:block;width:100%;height:auto;-webkit-mask-image:radial-gradient(75% 80% at 50% 45%,#000 70%,transparent 100%);mask-image:radial-gradient(75% 80% at 50% 45%,#000 70%,transparent 100%)}
@media (max-width:1100px){.hero-foto{max-width:620px;margin:0 auto}}

/* =====================================================================
   (sin uso desde 15-09: abanico 3D del hero, se deja por si se recupera)
   ===================================================================== */
.abanico-web{position:relative;height:600px;perspective:1400px}
.aw-glow{position:absolute;left:50%;bottom:-20px;width:600px;height:400px;transform:translateX(-50%);background:radial-gradient(closest-side,rgba(60,193,160,.42),rgba(60,193,160,.12) 50%,transparent 75%);filter:blur(22px);pointer-events:none}
.aw-escena{position:absolute;inset:0;transform-style:preserve-3d}
.aw-frame{position:absolute;left:50%;border-radius:16px;overflow:hidden;background:#0e1c26;box-shadow:inset 0 0 0 1px rgba(255,255,255,.14),0 40px 80px -30px rgba(0,0,0,.9);opacity:0;transition:transform 1.2s var(--ease),opacity 1s var(--ease)}
.aw-bar{display:flex;align-items:center;gap:5px;height:22px;padding:0 10px;background:#16242e}
.aw-bar i{width:7px;height:7px;border-radius:50%;background:rgba(255,255,255,.22)}
.aw-img{position:absolute;left:0;right:0;top:22px;bottom:0;background-size:100% auto;background-repeat:no-repeat;background-position:50% 0;animation:recorre 24s ease-in-out infinite alternate}
/* el abanico se queda dentro de su columna: no pisa el texto del hero */
.aw-escena{transform:scale(.88);transform-origin:50% 100%}
.f3{width:280px;height:450px;margin-left:-140px;bottom:40px;z-index:5;transform:translateY(80px)}
.f2,.f4{width:210px;height:350px;margin-left:-105px;bottom:70px;z-index:4}
.f1,.f5{width:165px;height:275px;margin-left:-82px;bottom:104px;z-index:3}
.f2{transform:translateX(-150px) translateY(80px) rotateY(16deg) rotate(-2deg)}
.f4{transform:translateX(150px) translateY(80px) rotateY(-16deg) rotate(2deg)}
.f1{transform:translateX(-250px) translateY(80px) rotateY(24deg) rotate(-4deg)}
.f5{transform:translateX(250px) translateY(80px) rotateY(-24deg) rotate(4deg)}
.abanico-web.vis .aw-frame{opacity:1}
.abanico-web.vis .f3{transform:none}
.abanico-web.vis .f2{transform:translateX(-150px) rotateY(16deg) rotate(-2deg);transition-delay:.12s}
.abanico-web.vis .f4{transform:translateX(150px) rotateY(-16deg) rotate(2deg);transition-delay:.12s}
.abanico-web.vis .f1{transform:translateX(-250px) rotateY(24deg) rotate(-4deg);transition-delay:.24s}
.abanico-web.vis .f5{transform:translateX(250px) rotateY(-24deg) rotate(4deg);transition-delay:.24s}
.aw-chip{position:absolute;z-index:8;display:flex;align-items:center;gap:10px;padding:10px 16px 10px 10px;border-radius:16px;color:#fff;background:rgba(14,28,38,.8);box-shadow:inset 0 0 0 1px rgba(255,255,255,.14),0 24px 44px -18px rgba(0,0,0,.85);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);animation:flota 6s ease-in-out infinite}
.aw-chip b{display:block;font-size:13.5px;font-weight:600}
.aw-chip small{display:block;font-size:11.5px;color:rgba(245,245,247,.6)}
.aw-ico{display:grid;place-items:center;width:38px;height:38px;border-radius:11px;background:var(--verde);color:var(--negro)}
.aw-ico svg{width:18px;height:18px}
.aw-gauge{position:relative;display:grid;place-items:center;width:42px;height:42px;border-radius:50%;background:conic-gradient(var(--verde) 0 91%,rgba(255,255,255,.12) 91% 100%)}
.aw-gauge::before{content:"";position:absolute;inset:4px;border-radius:50%;background:#0e1c26}
.aw-gauge b{position:relative;font-size:12.5px}
.c1{left:-10px;top:70px}
.c2{right:-20px;top:200px;animation-delay:1.6s}
.c3{left:10px;bottom:30px;animation-delay:3.2s}

/* =====================================================================
   2 · DÓNDE TE BUSCAN — móvil en el centro + tarjetas flotantes (Euphoria)
   ===================================================================== */
.origen2{position:relative;padding:130px 0 110px;background:var(--nieve);overflow:hidden}
.or2-rejilla{position:absolute;inset:0;background-image:linear-gradient(rgba(10,20,28,.06) 1px,transparent 1px),linear-gradient(90deg,rgba(10,20,28,.06) 1px,transparent 1px);background-size:64px 64px;-webkit-mask-image:radial-gradient(60% 55% at 50% 62%,#000,transparent);mask-image:radial-gradient(60% 55% at 50% 62%,#000,transparent)}
.origen2 .wrap{position:relative}
.origen2 .cab{max-width:900px}
.or2{position:relative;height:640px;max-width:1100px;margin:0 auto}
.or2-lineas{position:absolute;inset:0;width:100%;height:100%;overflow:visible;pointer-events:none;z-index:1}
.or2-lineas .ruta{fill:none;stroke:rgba(10,20,28,.25);stroke-width:1.6;stroke-dasharray:2 7;stroke-linecap:round}
.or2-lineas .punto{fill:var(--verde);filter:drop-shadow(0 0 6px rgba(60,193,160,.9))}
.or2-movil{position:absolute;left:50%;top:50%;z-index:2;width:290px;height:590px;padding:12px;border-radius:48px;background:#0a0a0a;transform:translate(-50%,-50%);box-shadow:0 60px 100px -40px rgba(10,20,28,.6),inset 0 0 0 2px #2a2a2a,0 0 0 12px rgba(60,193,160,.08)}
.or2-isla{position:absolute;left:50%;top:22px;z-index:2;width:90px;height:24px;border-radius:99px;background:#0a0a0a;transform:translateX(-50%)}
.or2-pant{width:100%;height:100%;border-radius:38px;background-color:#fff;background-repeat:no-repeat;background-size:100% auto;background-position:50% 0;animation:recorre 22s ease-in-out infinite alternate}
.or2-c{position:absolute;z-index:3;width:300px;padding:16px;border-radius:22px;background:#fff;box-shadow:0 30px 60px -36px rgba(10,20,28,.4),inset 0 0 0 1px var(--linea);opacity:0;transform:translateY(24px) scale(.96);transition:opacity .7s var(--ease),transform .8s var(--ease)}
.or2.vis .or2-c{opacity:1;transform:none}
.k1{left:0;top:30px}
.k2{right:0;top:80px;transition-delay:.15s}
.k3{left:30px;bottom:50px;transition-delay:.3s}
.k4{right:10px;bottom:30px;transition-delay:.45s}
.or2-cab{display:flex;align-items:center;gap:10px;margin-bottom:12px;font-size:14.5px;font-weight:600}
.or2-ico{display:grid;place-items:center;width:36px;height:36px;border-radius:50%;color:#fff}
.or2-ico svg{width:18px;height:18px}
.i-google{background:#1a4fd6}.i-insta{background:linear-gradient(135deg,#f58529,#dd2a7b,#8134af)}.i-wa{background:#25d366}.i-ok{background:var(--verde);color:var(--negro)}
.or-google,.or-insta,.or-wa{padding:12px;border-radius:12px;background:var(--nieve);font-size:12px}
.or-google small{display:block;color:var(--verde-os)}
.or-google em{display:block;margin:2px 0 8px;font-style:normal;font-weight:600;font-size:14px;color:#1a4fd6}
.or-google i{display:block;height:6px;margin-top:5px;border-radius:3px;background:#e1e5e9}
.or-google i+i{width:70%}
.or-insta{display:flex;flex-wrap:wrap;align-items:center;gap:10px}
.or-av{width:34px;height:34px;border-radius:50%;background:linear-gradient(135deg,var(--verde),#1d6f5c);box-shadow:0 0 0 2px #fff,0 0 0 4px #e8a3c3}
.or-insta em{display:block;font-style:normal;font-weight:600}
.or-insta small{color:var(--gris)}
.or-wa p{padding:8px 10px;border-radius:10px 10px 10px 3px;background:#fff;box-shadow:inset 0 0 0 1px var(--linea);line-height:1.35}
.or-link{display:inline-block;margin-top:8px;padding:3px 10px;border-radius:99px;background:rgba(60,193,160,.16);color:var(--verde-os);font-weight:600}
.or-insta .or-link{margin-top:0}
.or2-chips{display:flex;flex-wrap:wrap;gap:6px}
.or2-chips span{display:inline-flex;align-items:center;gap:6px;padding:6px 10px;border-radius:99px;background:var(--nieve);font-size:12px;font-weight:500}
.or2-chips svg{width:14px;height:14px;color:var(--verde-os)}
.or2-fin{margin-top:10px;font-size:13px;color:var(--gris)}

/* =====================================================================
   6 · WEBS QUE HEMOS HECHO — carrusel con scroll interior
   ===================================================================== */
.obras{position:relative;padding:130px 0 110px;background:#fff;overflow:hidden}
.obras .cab{margin-bottom:44px}
.car-pista{display:flex;gap:22px;overflow-x:auto;scroll-snap-type:x mandatory;padding:10px max(var(--gutter),calc((100vw - var(--wrap))/2)) 34px;scrollbar-width:none;cursor:grab}
.car-pista::-webkit-scrollbar{display:none}
.car-pista.arrastra{cursor:grabbing;scroll-snap-type:none}
.cw{flex:0 0 clamp(270px,26vw,340px);scroll-snap-align:start}
.cw-marco{display:flex;flex-direction:column;aspect-ratio:3/4;border-radius:18px;overflow:hidden;background:#fff;box-shadow:0 30px 60px -40px rgba(10,20,28,.45),inset 0 0 0 1px var(--linea);transition:transform .5s var(--ease),box-shadow .5s var(--ease)}
.cw:hover .cw-marco{transform:translateY(-6px);box-shadow:0 44px 70px -40px rgba(10,20,28,.55),0 0 0 2px var(--verde)}
.cw-bar{flex:none;display:flex;align-items:center;gap:6px;height:32px;padding:0 12px;background:var(--nieve);box-shadow:inset 0 -1px 0 var(--linea)}
.cw-bar i{width:9px;height:9px;border-radius:50%;background:#cfd4d8}
.cw-bar span{flex:1;max-width:170px;height:14px;margin-left:8px;border-radius:6px;background:#fff;box-shadow:inset 0 0 0 1px var(--linea)}
.cw-scroll{flex:1;overflow-x:hidden;overflow-y:auto;overscroll-behavior:contain;scrollbar-width:thin;scrollbar-color:#cfd4d8 transparent}
.cw-scroll img{display:block;width:100%}
.car-ui{display:flex;align-items:center;gap:24px}
.car-cont{font-size:14px;font-weight:600;letter-spacing:.04em;color:var(--tinta-2);font-variant-numeric:tabular-nums;white-space:nowrap}
.car-barra{flex:1;height:3px;border-radius:3px;background:var(--linea);overflow:hidden}
.car-barra i{display:block;height:100%;width:30%;border-radius:3px;background:var(--verde)}
.car-flechas{display:flex;gap:10px}
.car-flechas button{display:grid;place-items:center;width:50px;height:50px;border-radius:50%;background:var(--negro);color:var(--verde);transition:transform .3s var(--ease)}
.car-flechas button:hover{transform:scale(1.07)}
.car-flechas svg{width:18px;height:18px}
#carPrev svg{transform:rotate(180deg)}
.car-nota{margin-top:16px;font-size:13.5px;color:var(--gris)}

/* =====================================================================
   7 · TE LA HACEMOS TODA NOSOTROS — bento (Aeline)
   ===================================================================== */
.trabajo2{padding:120px 0;background:#f0f1f3}
.trabajo2 .cab{max-width:920px;margin-bottom:52px}
.bento{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px;max-width:1160px;margin:0 auto}
.bt{position:relative;display:flex;flex-direction:column;min-height:300px;padding:30px;border-radius:28px;overflow:hidden;background:#fff}
.bt .pildora{align-self:flex-start;height:30px;margin-bottom:14px;font-size:12.5px}
.bt h3{max-width:440px;font-size:clamp(19px,1.6vw,23px);font-weight:600;line-height:1.3;letter-spacing:-.015em}
.bt-a{grid-column:1/3;flex-direction:row;align-items:center;gap:30px;color:#fff;background:radial-gradient(70% 90% at 100% 0%,rgba(60,193,160,.25),transparent 60%),var(--negro)}
.bt-a .bt-txt{flex:1}
.bt-b{grid-column:3;grid-row:1/3;background:var(--verde);color:var(--negro)}
.bt-b .pildora{background:rgba(10,20,28,.1);box-shadow:none}
.bt-c,.bt-d{justify-content:flex-end}
/* textos que se escriben */
.vt-hoja{flex:none;width:46%;padding:20px;border-radius:16px;text-align:left;background:rgba(255,255,255,.06);box-shadow:inset 0 0 0 1px rgba(255,255,255,.12)}
.vt-hoja small{display:block;font-size:10.5px;letter-spacing:.06em;text-transform:uppercase;color:rgba(255,255,255,.5)}
.vt-escribe{display:block;min-height:56px;margin:8px 0 12px;font-size:20px;font-weight:600;line-height:1.3;color:#fff}
.vt-escribe::after{content:"";display:inline-block;width:2px;height:19px;margin-left:3px;vertical-align:-3px;background:var(--verde);animation:parpadeo 1s steps(1) infinite}
.vt-hoja i{display:block;height:6px;margin-top:6px;border-radius:3px;background:rgba(255,255,255,.14)}
.vt-hoja i.corto{width:60%}
.vt-btn{display:inline-block;margin-top:14px;padding:6px 12px;border-radius:99px;background:var(--verde);color:var(--negro);font-size:11px;font-weight:600}
/* la web por bloques */
.vb-web{display:grid;grid-template-columns:1fr 1fr;grid-template-rows:1.3fr 1fr 1fr 1fr;gap:8px;height:320px;margin-top:auto;padding-top:26px}
.vb{display:flex;align-items:flex-end;padding:10px 12px;border-radius:12px;font-size:12px;font-weight:600;background:rgba(10,20,28,.08);box-shadow:inset 0 0 0 1px rgba(10,20,28,.12);opacity:0;transform:translateY(-18px) scale(.95);transition:opacity .6s var(--ease),transform .7s var(--ease)}
.vb.b1{grid-column:1/3;background:var(--negro);color:var(--verde)}
.vb.b6{grid-column:1/3}
.bt-b.vis .vb{opacity:1;transform:none}
.bt-b.vis .b2{transition-delay:.12s}.bt-b.vis .b3{transition-delay:.24s}.bt-b.vis .b4{transition-delay:.36s}.bt-b.vis .b5{transition-delay:.48s}.bt-b.vis .b6{transition-delay:.6s}
/* es tuya */
.vl-cert{display:flex;align-items:center;flex-wrap:wrap;gap:12px;margin-bottom:auto;padding:16px;border-radius:16px;background:var(--nieve)}
.vl-ico{display:grid;place-items:center;flex:none;width:42px;height:42px;border-radius:50%;background:var(--negro);color:var(--verde)}
.vl-ico svg{width:20px;height:20px}
.vl-cert small{display:block;font-size:11px;color:var(--gris)}
.vl-cert b{display:block;font-size:16px}
.vl-dom{margin-left:auto;padding:4px 10px;border-radius:6px;background:rgba(60,193,160,.18);color:var(--verde-os);font-size:12px;font-weight:600}
.bt-c .pildora,.bt-d .pildora{margin-top:26px}
/* empezamos por ti */
.bt-chat{display:grid;gap:8px;margin-bottom:auto}
.bt-chat p{max-width:86%;padding:10px 13px;border-radius:14px;font-size:13px;line-height:1.35}
.bt-chat .tu{background:var(--nieve);border-bottom-left-radius:4px}
.bt-chat .nos{margin-left:auto;background:var(--negro);color:#fff;border-bottom-right-radius:4px}

/* =====================================================================
   8 · BONITA SE QUEDA CORTA — categorías en pestañas + tarjetas con imagen
   ===================================================================== */
.funciones{position:relative;padding:130px 0 120px;background:var(--negro);color:#fff;overflow:hidden}
.funciones::before{content:"";position:absolute;left:50%;top:-10%;width:1100px;height:700px;transform:translateX(-50%);background:radial-gradient(closest-side,rgba(60,193,160,.16),transparent);filter:blur(20px);pointer-events:none}
.funciones .wrap{position:relative}
.funciones .cab{max-width:900px;margin-bottom:46px}
.funciones .cab p{color:rgba(245,245,247,.66)}
.fn-tabs{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;margin-bottom:22px}
.fn-tab{position:relative;display:flex;align-items:flex-start;gap:12px;padding:18px;border-radius:18px;overflow:hidden;text-align:left;color:rgba(245,245,247,.55);background:rgba(255,255,255,.04);box-shadow:inset 0 0 0 1px rgba(255,255,255,.08);transition:background .4s,box-shadow .4s,color .4s}
.fn-tab:hover{background:rgba(255,255,255,.07)}
.fn-ico{flex:none;display:grid;place-items:center;width:40px;height:40px;border-radius:12px;background:rgba(60,193,160,.12);color:var(--verde);transition:background .4s,color .4s}
.fn-ico svg{width:20px;height:20px}
.fn-tab b{display:block;font-size:15.5px;font-weight:600;line-height:1.25;color:#fff}
.fn-tab small{display:block;margin-top:5px;font-size:13px;line-height:1.4}
.fn-tab.act{color:rgba(245,245,247,.78);background:rgba(60,193,160,.1);box-shadow:inset 0 0 0 1px rgba(60,193,160,.45)}
.fn-tab.act .fn-ico{background:var(--verde);color:var(--negro)}
.fn-tab::after{content:"";position:absolute;left:0;bottom:0;width:100%;height:2px;background:var(--verde);transform:scaleX(0);transform-origin:0 50%}
.fn-tab.act::after{animation:fnbarra 8s linear forwards}
@keyframes fnbarra{to{transform:scaleX(1)}}
.fn-panel{display:none;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:16px}
.fn-panel.act{display:grid;animation:fnEntra .6s var(--ease)}
@keyframes fnEntra{from{opacity:0;transform:translateY(16px)}to{opacity:1;transform:none}}
.fn-card{border-radius:20px;overflow:hidden;background:#12212b;box-shadow:inset 0 0 0 1px rgba(255,255,255,.08);transition:transform .4s var(--ease),box-shadow .4s}
.fn-card:hover{transform:translateY(-4px);box-shadow:inset 0 0 0 1px rgba(60,193,160,.45)}
/* las imágenes vienen con el lima de la marca antigua: se llevan al verde nuevo */
.fn-img{aspect-ratio:1/1;background-size:cover;background-position:center;filter:hue-rotate(78deg) saturate(.8)}
.fn-body{padding:18px 18px 22px}
.fn-body h4{display:flex;align-items:flex-start;gap:10px;margin-bottom:8px;font-size:16.5px;font-weight:600;line-height:1.3;color:#fff}
.fn-body h4 svg{flex:none;width:18px;height:18px;margin-top:2px;color:var(--verde)}
.fn-body p{font-size:14px;line-height:1.45;color:rgba(245,245,247,.66)}

/* =====================================================================
   9 · LO QUE NO TE VA A PASAR — queja tachada → respuesta
   ===================================================================== */
.nopasa{padding:130px 0 110px;background:#f0f1f3}
.nopasa .cab{margin-bottom:48px}
.np-lista{display:grid;gap:14px;max-width:1060px;margin:0 auto}
.np{display:grid;grid-template-columns:minmax(0,1fr) 56px minmax(0,1fr);align-items:stretch}
.np-q,.np-a{position:relative;display:flex;align-items:flex-start;gap:14px;padding:20px 22px;border-radius:18px}
.np-q{background:#fff;box-shadow:inset 0 0 0 1px var(--linea)}
.np-q p{font-size:16px;line-height:1.5;font-style:italic;color:var(--tinta-2)}
.np-q small{display:block;margin-top:6px;font-size:12px;font-style:normal;color:var(--gris-2)}
.tacha{background-image:linear-gradient(var(--rojo),var(--rojo));background-repeat:no-repeat;background-size:0 1.5px;background-position:0 58%;-webkit-box-decoration-break:clone;box-decoration-break:clone;transition:background-size 1.1s var(--ease) .3s}
.np.vis .tacha{background-size:100% 1.5px}
.np-x,.np-ok{flex:none;display:grid;place-items:center;width:30px;height:30px;border-radius:50%}
.np-x{background:rgba(228,87,74,.12);color:var(--rojo)}
.np-ok{background:var(--verde);color:var(--negro)}
.np-x svg,.np-ok svg{width:15px;height:15px}
.np-flecha{display:grid;place-items:center;color:var(--gris-2)}
.np-flecha svg{width:22px;height:22px;transition:transform .6s var(--ease),color .6s}
.np.vis .np-flecha svg{color:var(--verde-os);transform:translateX(4px)}
.np-a{color:#fff;background:var(--negro);opacity:0;transform:translateX(-20px);transition:opacity .7s var(--ease) .45s,transform .8s var(--ease) .45s}
.np.vis .np-a{opacity:1;transform:none}
.np-a p{font-size:16px;font-weight:500;line-height:1.45}
.np-chips{display:flex;flex-wrap:wrap;justify-content:center;gap:10px;margin-top:44px}
.np-chips span{display:inline-flex;align-items:center;gap:8px;padding:10px 16px;border-radius:99px;background:#fff;box-shadow:inset 0 0 0 1px var(--linea);font-size:14px;font-weight:500}
.np-chips svg{width:16px;height:16px;color:var(--verde-os)}

/* =====================================================================
   10 · PRECIOS — la de 1.250 € destacada en el centro
   ===================================================================== */
.precios2{padding:130px 0 120px;background:#fff}
.precios2 .cab{margin-bottom:60px}
.pr-grid{display:grid;grid-template-columns:1fr 1.12fr 1fr;gap:18px;align-items:center;max-width:1160px;margin:0 auto}
.pr{position:relative;display:flex;flex-direction:column;padding:30px 28px 32px;border-radius:26px;background:var(--nieve);box-shadow:inset 0 0 0 1px var(--linea)}
.pr>*{position:relative}
.pr h3{font-size:20px;font-weight:600}
.pr-desc{min-height:42px;margin-top:8px;font-size:14px;line-height:1.45;color:var(--tinta-2)}
.pr-precio{display:flex;align-items:baseline;gap:8px;margin:22px 0 4px}
.pr-precio b{font-size:clamp(44px,4vw,58px);font-weight:600;letter-spacing:-.05em;line-height:1}
.pr-precio small{font-size:14px;color:var(--gris)}
.pr-pago{font-size:13px;color:var(--gris)}
.pr .btn{align-self:stretch;justify-content:space-between;margin:24px 0 8px;background:var(--negro);color:#fff}
.pr .btn .arr{background:var(--verde);color:var(--negro)}
.pr h5{margin:18px 0 8px;font-size:11.5px;font-weight:600;letter-spacing:.07em;text-transform:uppercase;color:var(--gris)}
.pr ul{list-style:none;display:grid;gap:9px;font-size:14px;line-height:1.4}
.pr li{position:relative;padding-left:26px}
.pr li svg{position:absolute;left:0;top:.15em;width:17px;height:17px;padding:3px;border-radius:50%;background:rgba(60,193,160,.18);color:var(--verde-os)}
.pr-top{padding:44px 32px 42px;color:#fff;background:var(--negro);box-shadow:0 50px 90px -40px rgba(10,20,28,.6),0 0 0 1px rgba(60,193,160,.4),0 0 90px -20px rgba(60,193,160,.45);transform:scale(1.03)}
.pr-top::before{content:"";position:absolute;inset:0;border-radius:inherit;background:radial-gradient(70% 40% at 50% 0%,rgba(60,193,160,.3),transparent 70%);pointer-events:none}
.pr-top .pr-desc,.pr-top .pr-pago,.pr-top h5,.pr-top .pr-precio small{color:rgba(245,245,247,.62)}
.pr-top .btn{background:var(--verde);color:var(--negro)}
.pr-top .btn .arr{background:var(--negro);color:var(--verde)}
.pr-top li svg{background:var(--verde);color:var(--negro)}
.pr-top .pr-rec{position:absolute}
.pr-rec{top:-15px;left:50%;padding:7px 16px;border-radius:99px;background:var(--verde);color:var(--negro);font-size:12.5px;font-weight:600;white-space:nowrap;transform:translateX(-50%);box-shadow:0 10px 26px -10px rgba(60,193,160,.9)}
.precio-pie{margin:28px auto 0;text-align:center;font-size:14.5px;color:var(--gris)}

/* =====================================================================
   11 · LO FIRMAMOS — bloque verde con 3 compromisos + presupuesto firmado
   ===================================================================== */
.firmas2{padding:120px 0;background:var(--negro)}
.fb{position:relative;display:grid;grid-template-columns:1.1fr .9fr;gap:40px;align-items:center;padding:clamp(28px,4vw,58px);border-radius:34px;overflow:hidden;color:var(--negro);background:var(--verde)}
.fb::before{content:"";position:absolute;right:-10%;top:-35%;width:680px;height:680px;border-radius:50%;background:radial-gradient(closest-side,rgba(255,255,255,.35),transparent);pointer-events:none}
.fb-txt{position:relative}
.fb h2{max-width:560px;color:var(--negro)}
.fb-lista{list-style:none;display:grid;gap:10px;margin-top:30px}
.fb-lista li{display:grid;grid-template-columns:48px minmax(0,1fr) 22px;gap:14px;align-items:center;padding:16px 18px;border-radius:18px;background:rgba(255,255,255,.24);transition:background .3s,transform .4s var(--ease)}
.fb-lista li:hover{background:rgba(255,255,255,.42);transform:translateX(4px)}
.fb-n{display:grid;place-items:center;width:48px;height:48px;border-radius:14px;background:var(--negro);color:var(--verde);font-size:15px;font-weight:600}
.fb-lista b{display:block;font-size:17px;font-weight:600}
.fb-lista p{margin-top:3px;font-size:14px;line-height:1.45;color:rgba(10,20,28,.72)}
.fb-f{width:20px;height:20px}
.fb .btn{background:var(--negro);color:#fff}
.fb .btn .arr{background:var(--verde);color:var(--negro)}
.fb .nota{color:rgba(10,20,28,.7)}
.fb-doc{position:relative;display:grid;place-items:center;min-height:500px}
.doc{position:relative;width:min(380px,100%);padding:26px 26px 22px;border-radius:18px;background:#fff;color:var(--tinta);box-shadow:0 50px 80px -30px rgba(10,20,28,.55);transform:rotate(-4deg) translateY(20px);transition:transform 1s var(--ease)}
.fb-doc.vis .doc{transform:rotate(-2deg)}
.doc-top{display:flex;justify-content:space-between;align-items:center;font-size:12px;color:var(--gris)}
.logo-doc{display:inline-flex;align-items:center;gap:6px;font-size:14px;font-weight:600;color:var(--tinta)}
.logo-doc .iso{width:18px;height:15px}
.doc h4{margin:18px 0 12px;font-size:20px}
.doc-fila{display:flex;justify-content:space-between;gap:12px;padding:10px 0;border-top:1px solid var(--linea);font-size:13px}
.doc-fila span{color:var(--gris)}
.doc-fila b{font-weight:600;text-align:right}
.doc-fila .ok{color:var(--verde-os)}
.doc-firma{display:flex;justify-content:space-between;align-items:flex-end;margin-top:16px}
.doc-firma svg{width:150px;height:50px}
.doc-firma path{fill:none;stroke:var(--negro);stroke-width:2;stroke-linecap:round;stroke-dasharray:420;stroke-dashoffset:420;transition:stroke-dashoffset 1.8s var(--ease) .6s}
.fb-doc.vis .doc-firma path{stroke-dashoffset:0}
.doc-sello{display:grid;place-items:center;width:80px;height:80px;border-radius:50%;border:2px solid var(--verde-os);color:var(--verde-os);font-size:11px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;opacity:0;transform:rotate(-14deg) scale(1.7);transition:transform .5s cubic-bezier(.3,1.6,.5,1) 1.9s,opacity .3s 1.9s}
.fb-doc.vis .doc-sello{opacity:1;transform:rotate(-14deg)}
.doc-chip{position:absolute;right:-6px;top:30px;display:flex;align-items:center;gap:10px;padding:12px 16px;border-radius:14px;background:var(--negro);color:#fff;font-size:13px;font-weight:500;box-shadow:0 20px 40px -16px rgba(0,0,0,.6);animation:flota 5s ease-in-out infinite}
.doc-chip svg{width:18px;height:18px;color:var(--verde)}

/* =====================================================================
   12 · CIERRE — la web sube desde la cúpula (fintech 1.12)
   ===================================================================== */
.cierre2{position:relative;overflow:hidden;padding:130px var(--gutter) 140px;text-align:center;color:#fff;background:var(--negro)}
.cz-lineas{position:absolute;inset:0;background:repeating-linear-gradient(90deg,rgba(255,255,255,.035) 0 1px,transparent 1px 72px);-webkit-mask-image:linear-gradient(180deg,transparent 25%,#000 75%);mask-image:linear-gradient(180deg,transparent 25%,#000 75%)}
.cz-cupula{position:absolute;left:50%;bottom:-580px;width:1100px;height:1100px;border-radius:50%;transform:translateX(-50%);background:radial-gradient(closest-side,#1e6b57 0%,#2a9478 55%,#3cc1a0 86%,rgba(10,20,28,0) 100%);filter:blur(20px);opacity:.85}
.cierre2 .cierre-in{position:relative;z-index:3;max-width:780px;margin:0 auto}
.cierre2 h2{font-size:clamp(32px,4vw,54px)}
.cierre2 p{max-width:560px;margin:18px auto 0;font-size:17px;color:rgba(245,245,247,.72)}
.cierre2 .cta{align-items:center}
.cz-web{position:absolute;left:50%;bottom:-110px;z-index:2;width:min(780px,88vw);height:440px;border-radius:18px 18px 0 0;overflow:hidden;background:#0e1c26;box-shadow:0 -30px 90px -30px rgba(60,193,160,.6),inset 0 0 0 1px rgba(255,255,255,.14);transform:translateX(-50%) translateY(var(--sube,160px));will-change:transform}
.cz-img{position:absolute;left:0;right:0;top:32px;bottom:0;background-repeat:no-repeat;background-size:100% auto;background-position:50% 0;animation:recorre 26s ease-in-out infinite alternate}

/* =====================================================================
   13 · QUIÉN LA HACE — collage (SoFi) con la foto real
   ===================================================================== */
.qh{position:relative;padding:130px 0 120px;overflow:hidden;color:#fff;background:var(--carbon)}
.qh::before{content:"";position:absolute;left:-10%;top:0;width:900px;height:640px;background:radial-gradient(closest-side,rgba(60,193,160,.16),transparent);filter:blur(30px);pointer-events:none}
.qh-grid{position:relative;display:grid;grid-template-columns:1fr 1.05fr;gap:64px;align-items:center}
.qh-collage{position:relative;height:640px}
.qh-foto{position:absolute;left:0;top:0;width:76%;height:100%;margin:0;border-radius:28px;overflow:hidden;box-shadow:0 50px 90px -40px rgba(0,0,0,.85)}
.qh-foto img{width:100%;height:100%;object-fit:cover;object-position:32% 40%}
.qh-dato{position:absolute;padding:18px 20px;border-radius:20px;box-shadow:0 30px 60px -24px rgba(0,0,0,.7)}
.qh-dato b{display:block;font-size:42px;font-weight:600;letter-spacing:-.05em;line-height:1}
.qh-dato small{display:block;max-width:160px;margin-top:6px;font-size:13px;line-height:1.35}
.d-a{right:0;top:60px;color:var(--negro);background:var(--verde);animation:flota 6s ease-in-out infinite}
.d-b{right:6%;top:250px;color:var(--tinta);background:#fff;animation:flota 6s ease-in-out 1.6s infinite}
.qh-cita{position:absolute;right:0;bottom:30px;width:64%;padding:20px 22px;border-radius:20px;font-size:16px;font-weight:500;line-height:1.4;background:rgba(14,28,38,.88);box-shadow:inset 0 0 0 1px rgba(255,255,255,.12),0 30px 60px -24px rgba(0,0,0,.7);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px)}
.qh-cita .est{display:block;margin-bottom:6px;font-size:13px;letter-spacing:2px;color:#f2b01e}
.qh-cita cite{display:block;margin-top:8px;font-size:13px;font-style:normal;color:var(--verde)}
.qh-txt>p{max-width:540px;margin-top:18px;font-size:17px;color:rgba(245,245,247,.68)}
.qh .nota{color:rgba(245,245,247,.6)}

/* =====================================================================
   14 · PREGUNTAS — caja de marca con el logo girando + acordeón (fintech 1.11)
   ===================================================================== */
.faq2{padding:120px 0;background:#fff}
.fq-grid{display:grid;grid-template-columns:.85fr 1fr;gap:56px;align-items:start}
.fq-caja{position:sticky;top:40px;display:flex;flex-direction:column;min-height:520px;padding:36px;border-radius:30px;overflow:hidden;color:var(--negro);background:var(--verde)}
.fq-marca{position:absolute;right:-90px;top:30px;width:340px;height:283px;fill:rgba(255,255,255,.35);animation:gira 40s linear infinite}
.fq-caja>*:not(.fq-marca){position:relative}
.fq-caja small{font-size:14px;font-weight:600}
.fq-caja h3{margin-top:auto;font-size:clamp(28px,2.6vw,38px);line-height:1.1}
.fq-caja p{margin-top:14px;font-size:15.5px;line-height:1.5;color:rgba(10,20,28,.75)}
.fq-caja .btn{align-self:flex-start;margin-top:24px;background:var(--negro);color:#fff}
.fq-caja .btn .arr{background:var(--verde);color:var(--negro)}
.faq2 h2 .suave{display:block}
.fq{margin-top:26px}
.fq-item{border-bottom:1px solid var(--linea)}
.fq-item button{display:flex;justify-content:space-between;align-items:center;gap:20px;width:100%;padding:20px 0;text-align:left;font-size:17px;font-weight:500;color:var(--tinta-2);transition:color .3s}
.fq-item.on button{font-weight:600;color:var(--tinta)}
.fq-item i{position:relative;flex:none;width:16px;height:16px}
.fq-item i::before,.fq-item i::after{content:"";position:absolute;left:0;top:7px;width:16px;height:2px;border-radius:2px;background:var(--tinta);transition:transform .35s var(--ease)}
.fq-item i::after{transform:rotate(90deg)}
.fq-item.on i::before{transform:rotate(45deg)}
.fq-item.on i::after{transform:rotate(-45deg)}
.fq-ans{display:grid;grid-template-rows:0fr;transition:grid-template-rows .45s var(--ease)}
.fq-ans>div{overflow:hidden}
.fq-item.on .fq-ans{grid-template-rows:1fr}
.fq-ans p{padding:0 40px 22px 0;font-size:15.5px;line-height:1.55;color:var(--tinta-2)}

/* ---------- estático (capturas) ---------- */
html.estatico .aw-frame,html.estatico .or2-c,html.estatico .np-a,html.estatico .vb{opacity:1}
html.estatico .abanico-web .f3,html.estatico .or2-c,html.estatico .np-a,html.estatico .vb{transform:none}
html.estatico .abanico-web .f2{transform:translateX(-150px) rotateY(16deg) rotate(-2deg)}
html.estatico .abanico-web .f4{transform:translateX(150px) rotateY(-16deg) rotate(2deg)}
html.estatico .abanico-web .f1{transform:translateX(-250px) rotateY(24deg) rotate(-4deg)}
html.estatico .abanico-web .f5{transform:translateX(250px) rotateY(-24deg) rotate(4deg)}
html.estatico .tacha{background-size:100% 1.5px}
html.estatico .doc-firma path{stroke-dashoffset:0}
html.estatico .doc-sello{opacity:1;transform:rotate(-14deg)}
html.estatico .aw-img,html.estatico .or2-pant,html.estatico .cz-img{animation:none}

/* ---------- responsive ---------- */
@media (max-width:1100px){
  .abanico-web{max-width:640px;margin:0 auto;width:100%}
  .pr-grid{grid-template-columns:1fr;max-width:520px;gap:30px}
  .pr-top{transform:none}
  .fn-tabs{grid-template-columns:repeat(2,minmax(0,1fr))}
  .fb{grid-template-columns:1fr}
  .qh-grid{grid-template-columns:1fr}
  .fq-grid{grid-template-columns:1fr;gap:40px}
  .fq-caja{position:relative;top:auto;min-height:380px}
  .or2{transform:scale(.86);transform-origin:50% 0;height:560px}
}
@media (max-width:900px){
  .abanico-web{height:430px}
  .aw-escena{transform:scale(.6);transform-origin:50% 100%}
  .aw-glow{width:360px;height:260px}
  .aw-chip{padding:8px 12px 8px 8px}
  .aw-chip b{font-size:12px}.aw-chip small{font-size:10.5px}
  .aw-ico,.aw-gauge{width:32px;height:32px}
  .c1{left:0;top:0}.c2{right:0;top:96px}.c3{display:none}
  .or2{height:auto;transform:none;display:grid;gap:12px}
  .or2-lineas{display:none}
  .or2-movil{position:relative;left:auto;top:auto;transform:none;width:240px;height:480px;margin:0 auto 16px}
  .or2-c{position:relative;left:auto;right:auto;top:auto;bottom:auto;width:100%}
  .bento{grid-template-columns:1fr}
  .bt-a,.bt-b{grid-column:auto;grid-row:auto}
  .bt-a{flex-direction:column;align-items:stretch}
  .vt-hoja{width:100%}
  .vb-web{height:260px}
  .fn-tabs{display:flex;overflow-x:auto;scrollbar-width:none;margin-left:calc(var(--gutter)*-1);margin-right:calc(var(--gutter)*-1);padding:0 var(--gutter)}
  .fn-tabs::-webkit-scrollbar{display:none}
  .fn-tab{flex:0 0 80%}
  .fn-panel{grid-template-columns:1fr 1fr}
  .np{grid-template-columns:1fr}
  .np-flecha{height:34px}
  .np-flecha svg,.np.vis .np-flecha svg{transform:rotate(90deg)}
  .np-a{transform:translateY(-10px)}
  .cierre2{padding:90px var(--gutter) 100px}
  .qh-collage{height:500px}
  .qh-foto{width:86%}
  .d-b{top:200px}
  .qh-cita{width:84%}
  .fb-doc{min-height:420px}
  .doc-chip{right:0;top:auto;bottom:-10px}
}
@media (max-width:560px){
  .fn-panel{grid-template-columns:1fr}
  .qh-dato b{font-size:32px}
}