/* Home: "Cómo trabajamos" stacked cards and the closing section where the tiles open around the title. */

/* ---------- Stacked approach cards ---------- */
.bw-stack { position:relative; background:#070d1a; color:var(--ice); padding:120px 0 150px; isolation:isolate; }
.bw-stack:before { content:''; position:absolute; inset:0; z-index:-1; pointer-events:none; background:radial-gradient(ellipse at 85% 10%,rgba(157,157,255,.14),transparent 45%),radial-gradient(ellipse at 10% 70%,rgba(113,220,255,.10),transparent 45%); }
.bw-stack-eyebrow { display:flex; align-items:center; gap:16px; margin:0 0 46px; font-size:11px; font-weight:700; letter-spacing:.27em; text-transform:uppercase; color:#fff251; }
.bw-stack-eyebrow i { display:block; width:55px; height:1px; background:currentColor; }
.bw-stack-list { --stack-top:108px; --stack-peek:34px; --stack-count:5; position:relative; }
.bw-stack-list:after { content:''; display:block; height:22vh; }
.bw-stack-card { position:sticky; top:calc(var(--stack-top) + var(--i) * var(--stack-peek)); height:min(640px, calc(100vh - var(--stack-top) - (var(--stack-count) - 1) * var(--stack-peek) - 26px)); min-height:460px; }
.bw-stack-inner { --cover:0; position:relative; height:100%; display:grid; grid-template-columns:minmax(0,1fr) minmax(0,.92fr); gap:30px; padding:46px 54px 50px; border-radius:48px; overflow:hidden; transform-origin:50% 0; transform:scale(calc(1 - var(--cover) * .05)); box-shadow:0 -18px 60px rgba(0,0,0,.32); }
.bw-stack-inner:after { content:''; position:absolute; inset:0; border-radius:inherit; background:#02060f; opacity:calc(var(--cover) * .5); pointer-events:none; }
.bw-stack-card--1 .bw-stack-inner { background:#f2efe9; color:#0a1122; }
.bw-stack-card--2 .bw-stack-inner { background:#cfc9ff; color:#0a1122; }
.bw-stack-card--3 .bw-stack-inner { background:#fff251; color:#0a1122; }
.bw-stack-card--4 .bw-stack-inner { background:#c3f2e3; color:#0a1122; }
.bw-stack-card--5 .bw-stack-inner { background:radial-gradient(ellipse at 78% 40%,rgba(113,220,255,.16),transparent 55%),#0f1a36; color:#eaf4fb; box-shadow:0 -18px 60px rgba(0,0,0,.32),inset 0 0 0 1px rgba(157,157,255,.22); }
.bw-stack-copy { position:relative; z-index:1; display:flex; flex-direction:column; justify-content:space-between; min-width:0; }
.bw-stack-index { display:flex; align-items:center; gap:14px; font-size:11px; font-weight:700; letter-spacing:.27em; opacity:.7; }
.bw-stack-index i { display:block; width:42px; height:1px; background:currentColor; }
.bw-stack-card h2 { max-width:560px; margin:22px 0 0; font:700 clamp(50px,min(5.6vw,9.4vh),92px)/.9 'Barlow Condensed',sans-serif; text-transform:uppercase; letter-spacing:-.005em; }
.bw-stack-info { margin-top:24px; }
.bw-stack-tags { display:flex; flex-wrap:wrap; gap:8px; margin:0; padding:0; list-style:none; }
.bw-stack-tags li { padding:7px 15px; border:1px solid currentColor; border-radius:999px; font-size:12px; font-weight:600; letter-spacing:.03em; line-height:1.2; opacity:.85; }
.bw-stack-info p { max-width:470px; margin:20px 0 0; font-size:17px; line-height:1.6; opacity:.78; }
.bw-stack-art { position:relative; min-width:0; min-height:0; margin:-26px -34px -36px 0; }
.bw-stack-art svg { display:block; width:100%; height:100%; overflow:visible; }
.bw-stack-btn { position:absolute; z-index:2; top:34px; right:34px; display:grid; place-items:center; width:72px; height:72px; border-radius:50%; font-size:26px; line-height:1; transition:transform .45s cubic-bezier(.2,.8,.2,1),box-shadow .45s; }
body.bw-body .bw-stack-card--1 .bw-stack-btn { background:#9d9dff; color:#0a1122; }
body.bw-body .bw-stack-card--2 .bw-stack-btn { background:#fff; color:#0a1122; }
body.bw-body .bw-stack-card--3 .bw-stack-btn { background:#0a1122; color:#fff251; }
body.bw-body .bw-stack-card--4 .bw-stack-btn { background:#0a1122; color:#c3f2e3; }
body.bw-body .bw-stack-card--5 .bw-stack-btn { background:#fff; color:#0a1122; }
.bw-stack-btn:hover { transform:rotate(45deg) scale(1.06); box-shadow:0 14px 34px rgba(0,0,0,.25); }
.bw-stack-btn:focus-visible { outline:3px solid currentColor; outline-offset:4px; }

/* Illustration motion */
.bwa-lens { animation:bwa-float 5.5s ease-in-out infinite alternate; }
.bwa-lens-shadow { transform-box:fill-box; transform-origin:center; animation:bwa-shadow 5.5s ease-in-out infinite alternate; }
.bwa-flow,.bwa-pipes { animation:bwa-dash 2.8s linear infinite; }
.bwa-nodes circle,.bwa-nodes ellipse,.bwa-dot,.bwa-core,.bwa-target { animation:bwa-blink 2.4s ease-in-out infinite; }
.bwa-nodes :nth-child(n+3),.bwa-dot-2,.bwa-dot-3 { animation-delay:.6s; }
.bwa-nodes :nth-child(n+5),.bwa-dot-4 { animation-delay:1.2s; }
.bwa-sparkles > * { transform-box:fill-box; transform-origin:center; animation:bwa-twinkle 3.2s ease-in-out infinite; }
.bwa-sparkles > *:nth-child(2) { animation-delay:.8s; } .bwa-sparkles > *:nth-child(3) { animation-delay:1.6s; } .bwa-sparkles > *:nth-child(4) { animation-delay:2.4s; }
.bwa-layer-3 { animation:bwa-float 6s ease-in-out infinite alternate; }
.bwa-chip { animation:bwa-float 4.5s ease-in-out infinite alternate; }
.bwa-chip-2 { animation-delay:-2s; animation-duration:5.2s; }
.bwa-badge { animation:bwa-float 5s ease-in-out infinite alternate; }
.bwa-trend { stroke-dasharray:760; stroke-dashoffset:760; animation:bwa-draw 4.5s ease-in-out infinite alternate; }
.bwa-orbits { transform-box:fill-box; transform-origin:center; animation:bwa-breathe 7s ease-in-out infinite alternate; }
.bwa-cursor { animation:bwa-cursor 6s ease-in-out infinite; }
.bwa-phone { animation:bwa-float 5s ease-in-out infinite alternate; }
.bwa-traces { animation:bwa-dash 2.2s linear infinite; }
.bwa-pulse { transform-box:fill-box; transform-origin:center; animation:bwa-pulse 3.6s ease-out infinite; }
.bwa-pulse-2 { animation-delay:1.8s; }
.bwa-gear { transform-box:fill-box; transform-origin:center; animation:bwa-spin 9s linear infinite; }
@keyframes bwa-cursor { 0%,100% { transform:translate(0,0); } 35% { transform:translate(-70px,26px); } 65% { transform:translate(-20px,70px); } }
@keyframes bwa-pulse { 0% { transform:scale(.35); opacity:.9; } 100% { transform:scale(1.05); opacity:0; } }
@keyframes bwa-float { to { transform:translateY(-12px); } }
@keyframes bwa-shadow { to { transform:scale(.82); opacity:.08; } }
@keyframes bwa-dash { to { stroke-dashoffset:-48; } }
@keyframes bwa-blink { 50% { opacity:.35; } }
@keyframes bwa-twinkle { 50% { transform:scale(.55); opacity:.4; } }
@keyframes bwa-draw { to { stroke-dashoffset:0; } }
@keyframes bwa-breathe { to { transform:scale(1.05); opacity:.6; } }

/* ---------- Closing section: tiles open around the title ---------- */
.bw-converge { --p:1; --reveal:1; position:relative; background:#eef2f5; color:#0a1122; }
.bw-converge-track { height:280vh; }
.bw-converge-sticky { position:sticky; top:0; height:100vh; overflow:hidden; padding-top:40px; }
.bw-converge-stage { position:relative; height:100%; display:grid; place-items:center; }
.bw-converge-waves { position:absolute; inset:0; width:100%; height:100%; color:#0a1122; opacity:.11; pointer-events:none; }
.bw-converge-tiles { position:absolute; inset:0; pointer-events:none; }
.bw-tile { --tw:clamp(110px,11.5vw,180px); --x:0px; --y:0px; --r:0deg; position:absolute; left:50%; top:50%; width:var(--tw); height:var(--tw); margin:calc(var(--tw) / -2) 0 0 calc(var(--tw) / -2); border-radius:22%; overflow:hidden; box-shadow:0 30px 60px -22px rgba(10,17,34,.4); transform:translate(calc(var(--x) * (.2 + .8 * var(--p))),calc(var(--y) * (.2 + .8 * var(--p)))) rotate(calc(var(--r) * (1 - var(--p)))) scale(calc(.84 + .16 * var(--p))); will-change:transform; }
.bw-tile svg { display:block; width:100%; height:100%; }
.bw-tile--top-left { --x:-31vw; --y:-21vh; --r:-9deg; z-index:2; }
.bw-tile--top-center { --x:-1vw; --y:-31vh; --r:5deg; z-index:3; }
.bw-tile--top-right { --x:30vw; --y:-26vh; --r:10deg; z-index:2; }
.bw-tile--bottom-left { --x:-28vw; --y:25vh; --r:7deg; z-index:2; }
.bw-tile--bottom-center { --x:1vw; --y:32vh; --r:-6deg; z-index:4; }
.bw-tile--bottom-right { --x:31vw; --y:20vh; --r:-10deg; z-index:2; }
.bw-converge-content { position:relative; z-index:5; max-width:680px; padding:0 20px; text-align:center; opacity:var(--reveal); transform:translateY(calc((1 - var(--reveal)) * 40px)) scale(calc(.94 + .06 * var(--reveal))); }
.bw-converge-eyebrow { margin:0 0 20px; font-size:11px; font-weight:700; letter-spacing:.27em; text-transform:uppercase; color:#5a49d6; }
.bw-converge h2 { margin:0; font:700 clamp(52px,min(5.8vw,10.5vh),96px)/.9 'Barlow Condensed',sans-serif; text-transform:uppercase; color:#0a1122; }
.bw-converge-body { max-width:440px; margin:24px auto 0; font-size:17px; line-height:1.6; color:#44566b; }
.bw-converge-button { display:inline-flex; align-items:center; gap:12px; margin-top:32px; padding:16px 28px; border-radius:999px; font-size:13px; font-weight:700; letter-spacing:.12em; text-transform:uppercase; transition:background .3s,transform .3s; }
body.bw-body .bw-converge-button { background:#0a1122; color:#fff; }
body.bw-body .bw-converge-button:hover { background:#5a49d6; color:#fff; transform:translateY(-2px); }
.bw-converge-button:focus-visible { outline:3px solid #5a49d6; outline-offset:4px; }
.bw-tile-line,.bw-tile-flow { stroke-dasharray:8 0; }
.bw-tile-flow { stroke-dasharray:6 7; animation:bwa-dash 2.4s linear infinite; }
.bw-tile-dot { animation:bwa-blink 1.6s ease-in-out infinite; } .bw-tile-dot:nth-of-type(2) { animation-delay:.25s; } .bw-tile-dot:nth-of-type(3) { animation-delay:.5s; }
.bw-tile-cursor { animation:bwa-blink 1s steps(1,end) infinite; }
.bw-tile-spark { transform-box:fill-box; transform-origin:center; animation:bwa-twinkle 3s ease-in-out infinite; }
.bw-tile-gear { transform-box:fill-box; transform-origin:center; animation:bwa-spin 8s linear infinite; }
@keyframes bwa-spin { to { transform:rotate(360deg); } }

/* ---------- Responsive ---------- */
@media (max-width:1100px) {
  .bw-stack-inner { padding:40px 40px 44px; }
  .bw-stack-card h2 { font-size:clamp(46px,6vw,74px); }
}
@media (max-width:800px) {
  .bw-stack { padding:90px 0 110px; }
  .bw-stack-eyebrow { margin-bottom:34px; }
  .bw-stack-list { --stack-top:84px; --stack-peek:12px; }
  .bw-stack-card { height:calc(100svh - var(--stack-top) - (var(--stack-count) - 1) * var(--stack-peek) - 18px); min-height:540px; max-height:760px; }
  .bw-stack-inner { grid-template-columns:1fr; grid-template-rows:auto minmax(0,1fr); gap:6px; padding:28px 24px 0; border-radius:30px; }
  .bw-stack-copy { justify-content:flex-start; }
  .bw-stack-card h2 { max-width:none; padding-right:56px; margin-top:18px; font-size:clamp(40px,10.4vw,64px); }
  .bw-stack-info { margin-top:16px; }
  .bw-stack-tags li { padding:6px 12px; font-size:11px; }
  .bw-stack-info p { margin-top:14px; font-size:15px; line-height:1.55; }
  .bw-stack-art { margin:0 -24px; }
  .bw-stack-btn { top:22px; right:22px; width:54px; height:54px; font-size:21px; }
  .bw-converge-track { height:240vh; }
  .bw-tile { --tw:clamp(92px,25vw,150px); }
  .bw-tile--top-left { --x:-31vw; --y:-27vh; }
  .bw-tile--top-center { --x:0vw; --y:-32vh; }
  .bw-tile--top-right { --x:31vw; --y:-29vh; }
  .bw-tile--bottom-left { --x:-31vw; --y:29vh; }
  .bw-tile--bottom-center { --x:0vw; --y:36vh; }
  .bw-tile--bottom-right { --x:31vw; --y:27vh; }
  .bw-converge h2 { font-size:clamp(46px,12vw,80px); }
  .bw-converge-body { font-size:15px; margin-top:16px; }
  .bw-converge-button { margin-top:24px; padding:14px 22px; font-size:12px; }
}
@media (max-width:560px) {
  .bw-stack-info p { max-width:none; }
  .bw-converge-content { max-width:330px; }
  .bw-converge-eyebrow { margin-bottom:14px; }
}
@media (prefers-reduced-motion:reduce) {
  .bw-stack-art *, .bw-tile * { animation:none!important; }
  .bwa-trend { stroke-dashoffset:0; }
  .bw-converge { --p:1!important; --reveal:1!important; }
  .bw-converge-track { height:auto; }
  .bw-converge-sticky { position:relative; height:100vh; min-height:640px; }
}