/* Portfolio: nuevos casos integrados con el sistema visual Webinando. */
.wb-case-nav{display:flex;flex-wrap:wrap;gap:0 30px;padding:0 max(24px,6vw) 64px;background:#070707}.wb-case-nav a{padding:17px 0;color:#ddd;text-decoration:none;font:600 12px/1.5 var(--body);border-bottom:1px solid #333}.wb-case-nav span{color:var(--gold);margin-right:9px}.wb-case-nav a:hover{color:var(--gold)}
.wb-barber-case{--case-accent:#d91d2b;background:#090909;color:#f4f0e8}.wb-case-study--urban{--case-accent:#d4b36e;background:#11110e}.wb-barber-case:before{content:"";position:absolute;inset:0;background:radial-gradient(ellipse at 100% 20%,color-mix(in srgb,var(--case-accent) 9%,transparent),transparent 48%);pointer-events:none}.wb-barber-case .wb-case-status,.wb-barber-case .wb-case-heading h3 em{color:var(--case-accent)}.wb-barber-case .wb-case-heading h3{font-size:clamp(50px,7.2vw,118px);overflow-wrap:normal}.wb-barber-overview{padding:0;background:none;width:100%;aspect-ratio:3/2;cursor:zoom-in;color:inherit;font:inherit;text-align:left}.wb-barber-overview img{object-fit:contain}.wb-barber-story{grid-template-columns:1fr 1fr;margin:clamp(55px,7vw,110px) auto}.wb-barber-story p{font-size:clamp(16px,1.5vw,21px);max-width:650px}.wb-capture-gallery{position:relative;z-index:2;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(18px,3vw,44px);max-width:1500px;margin:0 auto clamp(60px,8vw,120px)}.wb-capture-gallery figure{min-width:0;margin:0}.wb-capture-gallery figure:nth-child(2){margin-top:58px}.wb-capture{position:relative;display:block;width:100%;aspect-ratio:1/1.85;overflow:hidden;padding:0;background:#080808;border:1px solid #333;cursor:zoom-in;box-shadow:0 24px 50px #0005}.wb-capture img{display:block;width:100%;height:auto;max-width:none;margin-top:-11%;transition:transform .5s ease}.wb-capture:hover img{transform:scale(1.015)}.wb-capture>span{position:absolute;right:10px;bottom:10px;background:#090909dd;color:#f5f3eb;padding:9px;font:700 9px/1 var(--body);letter-spacing:.1em}.wb-capture-gallery figcaption{padding-top:20px;font:700 10px/1.5 var(--body);letter-spacing:.14em}.wb-capture-gallery figcaption b{color:var(--case-accent)}.wb-capture-gallery figcaption p{font-size:13px;font-weight:400;letter-spacing:0;color:#aaa;line-height:1.7;margin:8px 0 0}.wb-case-nav a:focus-visible,.wb-barber-case button:focus-visible,.wb-portfolio-close:focus-visible{outline:2px solid var(--gold);outline-offset:5px}
.wb-portfolio-viewer{width:min(96vw,1440px);max-height:94dvh;overflow:auto;background:#090909;color:#eee;border:1px solid #555;padding:16px;box-shadow:0 20px 100px #0009}.wb-portfolio-viewer::backdrop{background:#000e;backdrop-filter:blur(7px)}.wb-portfolio-viewer img{display:block;max-width:100%;width:auto;height:auto;max-height:78dvh;object-fit:contain;margin:16px auto}.wb-portfolio-close{display:block;margin-left:auto;background:var(--gold);color:#090909;border:0;padding:14px 20px;font:700 11px var(--body);cursor:pointer}.wb-portfolio-viewer p{text-align:center;color:#aaa;font:400 12px/1.6 var(--body);margin:10px}.wb-portfolio-locked{overflow:hidden!important}
@media(max-width:900px){.wb-barber-story{grid-template-columns:1fr;gap:25px}.wb-capture-gallery{gap:18px}.wb-capture-gallery figure:nth-child(2){margin-top:30px}}
@media(max-width:620px){.wb-case-nav{display:grid;grid-template-columns:1fr 1fr;gap:0 18px;padding:0 18px 48px}.wb-case-nav a{font-size:10px}.wb-barber-case .wb-case-heading h3{font-size:clamp(43px,13vw,76px);line-height:.92}.wb-barber-case .wb-barber-overview{aspect-ratio:3/2}.wb-barber-overview .wb-screen-tag{font-size:7px;padding:8px}.wb-capture-gallery{grid-template-columns:1fr;gap:38px;max-width:420px}.wb-capture-gallery figure:nth-child(2){margin-top:0}.wb-capture{aspect-ratio:1/1.85}.wb-barber-story{margin:50px auto}.wb-barber-case .wb-case-meta-real{line-height:1.4}.wb-portfolio-viewer{padding:10px}.wb-portfolio-viewer img{max-height:75dvh}}
@media(prefers-reduced-motion:reduce){.wb-capture img{transition:none}}
/* Dirección de arte: casos editoriales con pantallas originales y recorrido progresivo. */
.wb-case-nav a[href="#proyecto-silencio"]{display:none}
.wb-case-nav{padding-top:8px;padding-bottom:44px}
.wb-barber-case{isolation:isolate;padding-top:clamp(74px,9vw,134px);padding-bottom:clamp(80px,11vw,160px)}
.wb-barber-case:after{content:"";position:absolute;inset:0;z-index:-1;opacity:.3;pointer-events:none;background-image:linear-gradient(#fff08 1px,transparent 1px),linear-gradient(90deg,#fff08 1px,transparent 1px);background-size:74px 74px;mask-image:linear-gradient(90deg,transparent,#000 30%,#000 80%,transparent)}
.wb-case-study--urban:after{opacity:.22;background-image:linear-gradient(#d6b56712 1px,transparent 1px),linear-gradient(90deg,#d6b56712 1px,transparent 1px)}
.wb-brand-stage{--accent:#e51e2a;position:relative;z-index:2;isolation:isolate;max-width:1500px;min-height:clamp(490px,48vw,740px);margin:8px auto clamp(72px,9vw,140px);padding:clamp(34px,5vw,76px) clamp(26px,4.3vw,66px);display:grid;grid-template-columns:1.05fr repeat(3,minmax(0,.7fr));align-items:center;gap:clamp(13px,2vw,30px);overflow:hidden;border:1px solid #ffffff18;background:radial-gradient(ellipse at 67% 45%,color-mix(in srgb,var(--accent) 15%,transparent),transparent 50%),linear-gradient(130deg,#151513e8,#080808 68%);box-shadow:0 45px 110px #0009}
.wb-brand-stage--urban{--accent:#d6b567;background:radial-gradient(ellipse at 70% 44%,#d6b5671b,transparent 52%),linear-gradient(130deg,#191710,#080807 70%)}
.wb-stage-copy{position:relative;z-index:5;align-self:center}.wb-stage-copy>span{display:block;color:var(--accent);font:700 9px/1.5 var(--body);letter-spacing:.2em}.wb-stage-copy strong{display:block;margin:27px 0;font:600 clamp(37px,5vw,78px)/.86 var(--display);letter-spacing:-.075em}.wb-stage-copy strong i{color:var(--accent);font-style:normal}.wb-stage-copy small{font:700 8px/1.5 var(--body);letter-spacing:.15em;opacity:.58}.wb-brand-stage figure{position:relative;z-index:1;width:100%;aspect-ratio:.53/1;margin:0;overflow:hidden;border:1px solid #ffffff40;background:#111;box-shadow:0 22px 55px #000a;transform:rotate(-4deg) translateY(35px)}.wb-brand-stage figure:nth-of-type(2){z-index:3;transform:translateY(-10px) scale(1.06);border-color:color-mix(in srgb,var(--accent) 75%,white);box-shadow:0 35px 85px #000b,0 0 40px color-mix(in srgb,var(--accent) 20%,transparent)}.wb-brand-stage figure:nth-of-type(3){transform:rotate(4deg) translateY(36px)}.wb-brand-stage figure img{display:block;width:100%;height:100%;object-fit:cover;object-position:center 45%;image-rendering:auto}.wb-stage-index{position:absolute;bottom:20px;left:clamp(26px,4.3vw,66px);right:clamp(26px,4.3vw,66px);display:flex;justify-content:space-between;color:#aaa;font:700 8px/1 var(--body);letter-spacing:.2em}.wb-stage-index b{color:var(--accent);font-weight:700}
.wb-feature-tour{--accent:#e51e2a;position:relative;z-index:2;max-width:1500px;margin:clamp(70px,9vw,140px) auto clamp(95px,12vw,185px);padding:clamp(24px,4vw,62px) 0;display:grid;grid-template-columns:minmax(240px,.72fr) minmax(0,1.28fr);gap:clamp(45px,9vw,140px);border-top:1px solid #ffffff28;border-bottom:1px solid #ffffff28}.wb-feature-tour--urban{--accent:#d6b567}.wb-tour-aside{position:sticky;top:13vh;align-self:start;padding:8px 0}.wb-tour-kicker{font:700 9px/1.5 var(--body);letter-spacing:.19em;color:var(--accent)}.wb-tour-aside h4{max-width:430px;margin:30px 0 20px;font:600 clamp(35px,4vw,62px)/.95 var(--display);letter-spacing:-.055em}.wb-tour-aside>p{max-width:360px;color:#aaa;font:400 14px/1.8 var(--body)}.wb-tour-progress{width:100%;max-width:250px;height:2px;margin-top:44px;background:#ffffff28}.wb-tour-progress span{display:block;width:25%;height:100%;background:var(--accent);transition:width .55s cubic-bezier(.2,.8,.2,1)}.wb-tour-current{display:block;margin-top:16px;color:var(--accent);font:700 12px/1 var(--body);letter-spacing:.12em}.wb-tour-current i{color:#777;font-style:normal}.wb-tour-steps{position:relative}.wb-tour-steps:before{content:"";position:absolute;top:27px;bottom:27px;left:2px;width:1px;background:linear-gradient(transparent,#ffffff26 8%,#ffffff26 92%,transparent)}.wb-tour-step{position:relative;min-height:220px;padding:22px 20px 35px 38px;border-bottom:1px solid #ffffff20;opacity:.48;transition:opacity .5s ease,transform .5s ease,border-color .5s ease}.wb-tour-step:last-child{border-bottom:0}.wb-tour-step:before{content:"";position:absolute;top:27px;left:-3px;width:9px;height:9px;border:1px solid #777;border-radius:50%;background:#0a0a09;transition:background .4s ease,box-shadow .4s ease,border-color .4s ease}.wb-tour-step.is-active{opacity:1;transform:translateX(7px);border-color:color-mix(in srgb,var(--accent) 45%,transparent)}.wb-tour-step.is-active:before{border-color:var(--accent);background:var(--accent);box-shadow:0 0 20px color-mix(in srgb,var(--accent) 65%,transparent)}.wb-tour-step>span{color:var(--accent);font:700 9px/1.4 var(--body);letter-spacing:.18em}.wb-tour-step h5{margin:15px 0 10px;font:600 clamp(26px,3vw,44px)/1.05 var(--display);letter-spacing:-.045em}.wb-tour-step p{max-width:590px;margin:0;color:#aaa;font:400 14px/1.8 var(--body)}.wb-capture-gallery{margin-top:clamp(80px,10vw,150px)}.wb-capture{border-color:#ffffff35;box-shadow:0 25px 70px #0009}.wb-capture img{filter:saturate(1.035) contrast(1.025)}.wb-capture-gallery figure:nth-child(2){margin-top:80px}.wb-capture-gallery figure:nth-child(3){margin-top:24px}.wb-capture-gallery figcaption{font-size:10px}.wb-capture-gallery figcaption p{max-width:320px}.wb-case-study--urban .wb-case-meta-real span{border-color:#d6b5675c}.wb-portfolio-viewer{z-index:999999}
@media(max-width:950px){.wb-brand-stage{min-height:570px;grid-template-columns:.9fr repeat(3,.65fr);padding:36px 28px;gap:14px}.wb-stage-copy strong{font-size:clamp(38px,6vw,65px)}.wb-feature-tour{grid-template-columns:.72fr 1.28fr;gap:40px}.wb-tour-step{min-height:195px}}
@media(max-width:650px){.wb-case-nav{padding-top:6px;padding-bottom:32px}.wb-barber-case{padding-top:66px;padding-bottom:80px}.wb-barber-case .wb-case-kicker{font-size:8px}.wb-brand-stage{display:flex;flex-direction:column;align-items:stretch;gap:26px;min-height:0;margin:0 -2px 72px;padding:28px 18px 48px}.wb-stage-copy strong{font-size:clamp(42px,13vw,66px);margin:18px 0}.wb-stage-copy small{font-size:7px}.wb-brand-stage figure{flex:0 0 70%;width:70%;height:auto;aspect-ratio:.57/1;transform:rotate(-3deg) translateX(8%);scroll-snap-align:center}.wb-brand-stage figure:nth-of-type(2){position:absolute;right:7%;top:47%;width:54%;transform:rotate(2deg);}.wb-brand-stage figure:nth-of-type(3){align-self:flex-end;transform:rotate(3deg) translateY(-5%)}.wb-stage-index{position:static;margin-top:4px}.wb-feature-tour{display:block;margin:76px 0 105px;padding:24px 0}.wb-tour-aside{position:relative;top:auto;margin-bottom:25px}.wb-tour-aside h4{margin:17px 0 12px;font-size:39px}.wb-tour-aside>p{margin-bottom:0}.wb-tour-progress{margin-top:20px}.wb-tour-step{min-height:180px;padding:25px 14px 28px 28px}.wb-tour-step h5{font-size:29px}.wb-tour-step p{font-size:13px}.wb-tour-step.is-active{transform:translateX(3px)}.wb-capture-gallery{grid-template-columns:1fr;max-width:440px;gap:28px}.wb-capture-gallery figure:nth-child(2),.wb-capture-gallery figure:nth-child(3){margin-top:0}.wb-capture{aspect-ratio:1/1.75}.wb-case-nav a{padding:13px 0;font-size:9px}}
@media(prefers-reduced-motion:reduce){.wb-tour-step,.wb-tour-progress span,.wb-brand-stage figure,.wb-capture img{transition:none!important;scroll-behavior:auto}}

/* Card Swap adaptado al sistema visual de Webinando */
.wb-card-swap{--accent:#d91d2b;position:relative;z-index:2;isolation:isolate;display:grid;grid-template-columns:minmax(220px,.68fr) minmax(0,1.32fr);align-items:center;gap:clamp(26px,5vw,78px);max-width:1500px;min-height:650px;margin:8px auto clamp(72px,9vw,140px);padding:clamp(32px,5vw,76px) clamp(26px,4.3vw,66px);overflow:hidden;border:1px solid #ffffff20;background:radial-gradient(ellipse at 75% 45%,color-mix(in srgb,var(--accent) 15%,transparent),transparent 50%),linear-gradient(130deg,#151513e8,#080808 68%);box-shadow:0 45px 110px #0009}
.wb-card-swap--urban{--accent:#d6b567;background:radial-gradient(ellipse at 73% 44%,#d6b56720,transparent 52%),linear-gradient(130deg,#191710,#080807 70%)}
.wb-swap-intro{position:relative;z-index:10;align-self:center}.wb-swap-kicker{display:block;color:var(--accent);font:700 9px/1.5 var(--body);letter-spacing:.19em}.wb-swap-intro h4{max-width:440px;margin:27px 0 20px;font:600 clamp(36px,4.4vw,66px)/.94 var(--display);letter-spacing:-.065em}.wb-swap-intro>p{max-width:360px;margin:0;color:#aaa;font:400 13px/1.8 var(--body)}.wb-swap-counter{display:flex;align-items:baseline;gap:8px;margin-top:36px;color:#777;font:700 12px/1 var(--body);letter-spacing:.12em}.wb-swap-counter b{color:var(--accent);font-size:22px}
.wb-swap-view{position:relative;z-index:2;min-width:0}.wb-swap-deck{position:relative;width:100%;height:clamp(390px,40vw,510px);perspective:1700px;transform-style:preserve-3d;touch-action:pan-y;cursor:grab;outline:none}.wb-swap-deck:focus-visible{outline:1px solid color-mix(in srgb,var(--accent) 60%,transparent);outline-offset:12px;border-radius:14px}.wb-swap-deck.is-dragging{cursor:grabbing}
.wb-swap-card{position:absolute;top:48%;left:50%;width:min(760px,calc(100% - 58px));aspect-ratio:2.19/1;overflow:hidden;border:1px solid #ffffff30;border-radius:14px;background:#111;box-shadow:0 30px 80px #000b;transform-style:preserve-3d;transition:transform .78s cubic-bezier(.2,.8,.2,1),opacity .7s ease,filter .7s ease,border-color .7s ease;user-select:none}
.wb-swap-card img{display:block;width:100%;height:100%;object-fit:contain;background:#101010;pointer-events:none}.wb-swap-card.is-front{z-index:8;opacity:1;border-color:color-mix(in srgb,var(--accent) 75%,#ffffff);transform:translate3d(-50%,-50%,0) rotateZ(0) scale(1);box-shadow:0 35px 95px #000c,0 0 32px color-mix(in srgb,var(--accent) 18%,transparent)}.wb-swap-card.is-stack-1{z-index:7;opacity:.76;filter:brightness(.78);transform:translate3d(calc(-50% + 38px),calc(-50% + 35px),-75px) rotateZ(2.6deg) scale(.965)}.wb-swap-card.is-stack-2{z-index:6;opacity:.49;filter:brightness(.64);transform:translate3d(calc(-50% + 75px),calc(-50% + 70px),-150px) rotateZ(4.8deg) scale(.93)}.wb-swap-card.is-stack-3{z-index:5;opacity:.3;filter:brightness(.52);transform:translate3d(calc(-50% + 110px),calc(-50% + 104px),-225px) rotateZ(6.8deg) scale(.89)}.wb-swap-card.is-hidden{z-index:0;opacity:0;pointer-events:none;transform:translate3d(55%,-50%,-300px) rotateZ(10deg) scale(.78)}.wb-swap-card.is-leaving{z-index:12!important;animation:wb-card-throw .36s cubic-bezier(.3,.75,.4,1) forwards}
@keyframes wb-card-throw{to{transform:translate3d(125%,-72%,-30px) rotateZ(15deg) scale(.94);opacity:0}}
.wb-swap-card-caption{position:absolute;inset:auto 0 0;padding:38px 17px 14px;display:grid;gap:5px;background:linear-gradient(transparent,#050505dc);opacity:0;transition:opacity .25s ease}.wb-swap-card.is-front .wb-swap-card-caption{opacity:1}.wb-swap-card-caption span{color:var(--accent);font:700 8px/1.4 var(--body);letter-spacing:.16em}.wb-swap-card-caption strong{color:#f3f0e9;font:600 12px/1.35 var(--body);letter-spacing:.015em}.wb-swap-zoom{position:absolute;right:12px;top:12px;padding:9px 11px;border:1px solid #ffffff55;background:#090909ce;color:#fff;font:700 8px/1 var(--body);letter-spacing:.12em;cursor:zoom-in;opacity:0;transition:opacity .2s ease,background .2s ease}.wb-swap-card.is-front .wb-swap-zoom,.wb-swap-card:focus-within .wb-swap-zoom{opacity:1}.wb-swap-zoom:hover{background:var(--accent)}.wb-swap-controls{position:relative;z-index:15;display:flex;align-items:center;gap:9px;margin:0 0 0 auto;width:max-content}.wb-swap-controls button{width:42px;height:42px;border:1px solid #ffffff43;border-radius:50%;background:#0b0b0bd9;color:#f5f2eb;font-size:18px;cursor:pointer;transition:background .2s,border-color .2s,transform .2s}.wb-swap-controls button:hover{background:var(--accent);border-color:var(--accent);transform:translateY(-2px)}.wb-swap-controls span{margin-left:10px;color:#8f8b84;font:700 8px/1 var(--body);letter-spacing:.13em}
.wb-card-swap--urban .wb-swap-card.is-front{border-color:#d6b567;box-shadow:0 35px 95px #000c,0 0 32px #d6b56730}.wb-card-swap--urban .wb-swap-card-caption span{color:#d6b567}.wb-card-swap--urban .wb-swap-controls button:hover{background:#d6b567;border-color:#d6b567;color:#17130c}
@media(max-width:1000px){.wb-card-swap{grid-template-columns:.66fr 1.34fr;gap:24px;min-height:570px;padding:34px 26px}.wb-swap-deck{height:410px}.wb-swap-card{width:min(650px,calc(100% - 45px))}.wb-swap-intro h4{font-size:clamp(34px,5vw,54px)}.wb-swap-controls span{display:none}}
@media(max-width:700px){.wb-card-swap{display:block;min-height:0;margin:0 -2px 72px;padding:27px 17px 25px}.wb-swap-intro h4{max-width:500px;margin:17px 0 12px;font-size:clamp(36px,10vw,53px)}.wb-swap-intro>p{max-width:430px;font-size:12px}.wb-swap-counter{position:absolute;top:0;right:0;margin:0}.wb-swap-view{margin-top:24px}.wb-swap-deck{height:clamp(285px,76vw,390px);margin:0 -9px}.wb-swap-card{width:min(650px,calc(100% - 34px));border-radius:10px}.wb-swap-card.is-stack-1{transform:translate3d(calc(-50% + 22px),calc(-50% + 24px),-75px) rotateZ(2deg) scale(.965)}.wb-swap-card.is-stack-2{transform:translate3d(calc(-50% + 43px),calc(-50% + 47px),-150px) rotateZ(4deg) scale(.93)}.wb-swap-card.is-stack-3{transform:translate3d(calc(-50% + 62px),calc(-50% + 68px),-225px) rotateZ(6deg) scale(.89)}.wb-swap-controls{margin-top:-2px}.wb-swap-controls button{width:38px;height:38px}.wb-swap-card-caption{padding:28px 10px 9px}.wb-swap-card-caption strong{font-size:9px}.wb-swap-card-caption span{font-size:7px}.wb-swap-zoom{right:7px;top:7px;padding:8px;font-size:7px}}
@media(max-width:390px){.wb-swap-deck{height:275px}.wb-swap-card.is-stack-1{transform:translate3d(calc(-50% + 15px),calc(-50% + 18px),-75px) rotateZ(2deg) scale(.965)}.wb-swap-card.is-stack-2{transform:translate3d(calc(-50% + 29px),calc(-50% + 35px),-150px) rotateZ(4deg) scale(.93)}.wb-swap-card.is-stack-3{transform:translate3d(calc(-50% + 42px),calc(-50% + 50px),-225px) rotateZ(6deg) scale(.89)}}
@media(prefers-reduced-motion:reduce){.wb-swap-card,.wb-swap-card-caption,.wb-swap-zoom,.wb-swap-controls button{transition:none!important}.wb-swap-card.is-leaving{animation:none!important}}
/* Ajustes finales de la pila de capturas */
.wb-card-swap.wb-brand-stage--urban{--accent:#d6b567;background:radial-gradient(ellipse at 73% 44%,#d6b56720,transparent 52%),linear-gradient(130deg,#191710,#080807 70%)}
.wb-card-swap.wb-brand-stage--urban .wb-swap-card.is-front{border-color:#d6b567;box-shadow:0 35px 95px #000c,0 0 32px #d6b56730}
.wb-card-swap.wb-brand-stage--urban .wb-swap-card-caption span{color:#d6b567}
.wb-card-swap.wb-brand-stage--urban .wb-swap-controls button:hover{background:#d6b567;border-color:#d6b567;color:#17130c}
.wb-swap-zoom{pointer-events:none}.wb-swap-card.is-front .wb-swap-zoom,.wb-swap-card:focus-within .wb-swap-zoom{pointer-events:auto}.wb-swap-deck.is-dragging .wb-swap-card.is-front{transform:translate3d(calc(-50% + var(--drag-x,0px)),-52%,0) rotateZ(var(--drag-tilt,0deg)) scale(.985);transition:none}

/* Card Swap mobile: mismo sistema de escritorio, con marco realista de teléfono */
.wb-mobile-card-swap{--accent:#d91d2b;grid-template-columns:minmax(220px,.72fr) minmax(0,1.28fr);gap:clamp(28px,5vw,78px);min-height:810px;overflow:hidden;background:radial-gradient(ellipse at 75% 44%,color-mix(in srgb,var(--accent) 14%,transparent),transparent 49%),linear-gradient(130deg,#151513e8,#080808 68%)}
.wb-mobile-card-swap.wb-brand-stage--urban{--accent:#d6b567;background:radial-gradient(ellipse at 73% 44%,#d6b56720,transparent 52%),linear-gradient(130deg,#191710,#080807 70%)}
.wb-mobile-card-swap .wb-swap-intro{max-width:440px}
.wb-mobile-card-swap .wb-swap-intro h4{font-size:clamp(38px,4.3vw,64px)}
.wb-mobile-swap-deck{height:670px;overflow:visible;perspective:1900px}
.wb-mobile-swap-card{top:49%;width:min(295px,calc(100% - 100px));aspect-ratio:.48/1;border:1px solid #646464;border-radius:43px;background:linear-gradient(145deg,#343434,#080808 20%,#171717 58%,#050505 91%,#565656);box-shadow:0 32px 90px #000c,inset 0 0 0 2px #ffffff16,inset 0 0 0 6px #000;overflow:visible}
.wb-mobile-swap-card.is-front{border-color:#858585;box-shadow:0 38px 100px #000d,0 0 26px color-mix(in srgb,var(--accent) 17%,transparent),inset 0 0 0 2px #ffffff19,inset 0 0 0 6px #000}
.wb-mobile-swap-card.is-stack-1{transform:translate3d(calc(-50% + 27px),calc(-50% + 27px),-75px) rotateZ(2.4deg) scale(.965)}
.wb-mobile-swap-card.is-stack-2{transform:translate3d(calc(-50% + 53px),calc(-50% + 53px),-150px) rotateZ(4.5deg) scale(.93)}
.wb-mobile-swap-card .wb-phone-device{position:absolute;inset:0;border-radius:inherit;background:linear-gradient(115deg,#111,#050505 16%,#111 72%,#333 100%);pointer-events:none}
.wb-mobile-swap-card .wb-phone-screen{position:absolute;inset:22px 8px 36px;overflow:hidden;border:1px solid #ffffff20;border-radius:31px;background:#0c0c0c;box-shadow:inset 0 0 0 1px #000,0 2px 12px #000b}
.wb-mobile-swap-card .wb-phone-screen img{display:block;width:100%;height:100%;margin:0;object-fit:contain;object-position:center;image-rendering:auto;background:#101010;pointer-events:none}
.wb-phone-camera{position:absolute;top:8px;left:50%;width:50px;height:8px;border:1px solid #343434;border-radius:99px;background:#020202;transform:translateX(-50%);box-shadow:inset 0 1px 2px #000}
.wb-phone-camera i{position:absolute;top:1px;right:5px;width:4px;height:4px;border-radius:50%;background:#16212a;box-shadow:0 0 4px #182d45}
.wb-phone-side-key{position:absolute;top:94px;right:-3px;width:3px;height:54px;border-radius:0 4px 4px 0;background:linear-gradient(#888,#242424 25%,#111 80%,#777)}
.wb-mobile-swap-card .wb-swap-card-caption{inset:auto 64px 8px 17px;display:flex;align-items:center;gap:0;min-height:19px;padding:0;background:none;opacity:1;white-space:nowrap}
.wb-mobile-swap-card .wb-swap-card-caption span{overflow:hidden;color:#c8c6c1;font:700 6px/1 var(--body);letter-spacing:.09em;text-overflow:ellipsis}
.wb-mobile-swap-card .wb-swap-card-caption strong{display:none}
.wb-mobile-swap-card .wb-swap-zoom{top:auto;right:11px;bottom:7px;padding:5px 6px;border:0;background:transparent;color:var(--accent);font-size:6px;letter-spacing:.08em;opacity:0}
.wb-mobile-swap-card.is-front .wb-swap-zoom,.wb-mobile-swap-card:focus-within .wb-swap-zoom{opacity:1;pointer-events:auto}
.wb-mobile-card-swap .wb-swap-controls{margin-top:-2px}
.wb-mobile-card-swap .wb-swap-controls button{width:42px;height:42px}
.wb-mobile-card-swap .wb-swap-controls span{color:#97938b}
@media(max-width:1000px){.wb-mobile-card-swap{grid-template-columns:.66fr 1.34fr;min-height:740px;padding:38px 28px;gap:25px}.wb-mobile-swap-deck{height:620px}.wb-mobile-swap-card{width:min(275px,calc(100% - 86px))}.wb-mobile-card-swap .wb-swap-intro h4{font-size:clamp(34px,5vw,54px)}}
@media(max-width:700px){.wb-mobile-card-swap{display:block;min-height:0;margin:0 -2px 72px;padding:27px 17px 25px}.wb-mobile-card-swap .wb-swap-intro h4{max-width:500px;margin:17px 0 12px;font-size:clamp(36px,10vw,53px)}.wb-mobile-card-swap .wb-swap-intro>p{max-width:430px;font-size:12px}.wb-mobile-card-swap .wb-swap-counter{position:absolute;top:0;right:0;margin:0}.wb-mobile-card-swap .wb-swap-view{margin-top:24px}.wb-mobile-swap-deck{height:620px;margin:0 -8px}.wb-mobile-swap-card{top:48%;width:min(280px,calc(100% - 60px));aspect-ratio:.48/1;border-radius:42px}.wb-mobile-swap-card.is-stack-1{transform:translate3d(calc(-50% + 18px),calc(-50% + 23px),-75px) rotateZ(2deg) scale(.965)}.wb-mobile-swap-card.is-stack-2{transform:translate3d(calc(-50% + 36px),calc(-50% + 45px),-150px) rotateZ(4deg) scale(.93)}.wb-mobile-swap-card .wb-swap-card-caption{inset:auto 64px 8px 16px}.wb-mobile-card-swap .wb-swap-controls{margin-top:0}.wb-mobile-card-swap .wb-swap-controls span{display:inline}}
@media(max-width:380px){.wb-mobile-swap-deck{height:570px}.wb-mobile-swap-card{width:min(250px,calc(100% - 68px));border-radius:38px}.wb-mobile-swap-card .wb-phone-screen{inset:21px 7px 34px;border-radius:27px}}
@media(prefers-reduced-motion:reduce){.wb-mobile-swap-card,.wb-mobile-swap-card .wb-phone-screen img{transition:none!important}}

/* Oculta los controles del teléfono original; deja visible el sitio */
.wb-mobile-swap-card .wb-phone-screen{inset:21px 8px 13px}
.wb-mobile-swap-card .wb-phone-screen img{object-fit:cover;object-position:center center}
.wb-mobile-swap-card .wb-swap-zoom{top:3px;right:9px;bottom:auto}
.wb-portfolio-viewer img[src*="-full-"]{clip-path:inset(3.5% 0 3.5%)}
/* Encuadre fino de las capturas mobile: barra de Chrome y sistema */
.wb-mobile-swap-card .wb-phone-screen img{object-fit:cover;object-position:center 35%;transform:scale(1.04);transform-origin:center}
.wb-mobile-swap-card .wb-phone-screen img[src*="urban-full-25"]{object-position:center 90%;transform:scale(1.08)}
.wb-portfolio-viewer img[src*="-full-"]{clip-path:inset(4.3% 0 6.3%)}
.wb-portfolio-viewer img[src*="urban-full-25"]{clip-path:inset(10.5% 0 5.1%)}
/* Urban · capturas mobile nuevas sin interfaces del navegador ni del sistema */
.wb-mobile-swap-card .wb-phone-screen img[src*="urban-mobile-new-01-hero"]{object-fit:contain;object-position:center;transform:none}
.wb-mobile-swap-card .wb-phone-screen img[src*="urban-mobile-new-02-studio"]{object-position:center 35%;transform:scale(1.04)}
.wb-mobile-swap-card .wb-phone-screen img[src*="urban-mobile-new-03-team"]{object-position:center 35%;transform:scale(1.04)}
.wb-mobile-swap-card .wb-phone-screen img[src*="urban-mobile-new-04-services"]{object-position:center 35%;transform:scale(1.04)}
.wb-mobile-swap-card .wb-phone-screen img[src*="urban-mobile-new-05-shop"]{object-position:center 90%;transform:scale(1.08)}
.wb-phone-screen--urban-team{isolation:isolate}
.wb-phone-screen--urban-team::after{content:"";position:absolute;z-index:3;left:0;bottom:10%;width:25%;height:23%;pointer-events:none;background:linear-gradient(145deg,#10110f 0%,#080908 78%);border-radius:0 12px 0 0}
.wb-portfolio-viewer img[src*="urban-mobile-new-01-hero"]{clip-path:none}
.wb-portfolio-viewer img[src*="urban-mobile-new-02-studio"]{clip-path:inset(4.5% 0 6.3%)}
.wb-portfolio-viewer img[src*="urban-mobile-new-03-team"]{clip-path:inset(4.5% 0 6.3%)}
.wb-portfolio-viewer img[src*="urban-mobile-new-04-services"]{clip-path:inset(4.5% 0 6.3%)}
.wb-portfolio-viewer img[src*="urban-mobile-new-05-shop"]{clip-path:inset(10.5% 0 5.1%)}
/* Indicadores informativos vinculados a la tarjeta mobile activa */
.wb-phone-screen--urban-team::after{content:none}
.wb-mobile-swap-card .wb-phone-callout{position:absolute;z-index:18;top:var(--callout-y,36%);left:calc(100% + 5px);width:158px;min-height:50px;padding:10px 30px 10px 13px;border:1px solid #d6b5675e;background:linear-gradient(120deg,#15130fF2,#090908F5);color:#f1ead9;box-shadow:0 12px 32px #0009;display:grid;align-content:center;gap:4px;opacity:0;pointer-events:none;transform:translate3d(-10px,0,30px);transition:opacity .28s ease,transform .38s cubic-bezier(.2,.8,.2,1)}
.wb-mobile-swap-card .wb-phone-callout span{color:#d6b567;font:700 6px/1.2 var(--body);letter-spacing:.16em}
.wb-mobile-swap-card .wb-phone-callout strong{font:600 10px/1.25 var(--body);letter-spacing:.01em}
.wb-mobile-swap-card .wb-phone-callout i{position:absolute;right:10px;top:50%;color:#d6b567;font:normal 14px/1 var(--body);transform:translateY(-50%)}
.wb-mobile-swap-card .wb-phone-callout::before{content:"";position:absolute;right:100%;top:50%;width:36px;height:1px;background:linear-gradient(90deg,transparent,#d6b567);transform:rotate(-9deg);transform-origin:right center}
.wb-mobile-swap-card .wb-phone-callout::after{content:"↖";position:absolute;right:calc(100% + 31px);top:calc(50% - 8px);color:#d6b567;font:12px/1 var(--body)}
.wb-mobile-swap-card.is-front .wb-phone-callout{opacity:1;transform:translate3d(0,0,30px)}
.wb-mobile-swap-card[data-index="0"]{--callout-y:27%}
.wb-mobile-swap-card[data-index="1"]{--callout-y:43%}
.wb-mobile-swap-card[data-index="2"]{--callout-y:56%}
.wb-mobile-swap-card[data-index="3"]{--callout-y:39%}
.wb-mobile-swap-card[data-index="4"]{--callout-y:58%}
.wb-mobile-swap-card .wb-phone-screen img[src*="urban-mobile-new-03-team"]{object-fit:contain;object-position:center;transform:none}
@media(max-width:700px){
  .wb-mobile-swap-deck{height:680px}
  .wb-mobile-swap-card .wb-phone-callout{top:auto;left:50%;bottom:-42px;width:max-content;max-width:calc(100vw - 70px);min-height:35px;padding:8px 30px 8px 12px;grid-template-columns:auto auto;align-items:center;gap:8px;white-space:nowrap;transform:translate3d(-50%,10px,30px)}
  .wb-mobile-swap-card .wb-phone-callout span{font-size:6px}
  .wb-mobile-swap-card .wb-phone-callout strong{font-size:9px}
  .wb-mobile-swap-card .wb-phone-callout i{right:9px}
  .wb-mobile-swap-card .wb-phone-callout::before{right:auto;left:50%;top:auto;bottom:100%;width:1px;height:15px;background:linear-gradient(0deg,transparent,#d6b567);transform:none}
  .wb-mobile-swap-card .wb-phone-callout::after{content:"↑";right:auto;left:calc(50% - 4px);top:auto;bottom:calc(100% + 11px);font-size:10px}
  .wb-mobile-swap-card.is-front .wb-phone-callout{transform:translate3d(-50%,0,30px)}
}
@media(max-width:380px){.wb-mobile-swap-deck{height:660px}}
/* Ajuste responsive para que los indicadores no salgan del área visible */
.wb-mobile-swap-card .wb-phone-screen img[src*="urban-mobile-new-03-team"]{object-fit:cover;object-position:center;transform:none}
@media(max-width:1000px){
  .wb-mobile-swap-deck{height:680px}
  .wb-mobile-swap-card .wb-phone-callout{top:auto;left:50%;bottom:-42px;width:max-content;max-width:calc(100vw - 70px);min-height:35px;padding:8px 30px 8px 12px;grid-template-columns:auto auto;align-items:center;gap:8px;white-space:nowrap;transform:translate3d(-50%,10px,30px)}
  .wb-mobile-swap-card .wb-phone-callout span{font-size:6px}
  .wb-mobile-swap-card .wb-phone-callout strong{font-size:9px}
  .wb-mobile-swap-card .wb-phone-callout i{right:9px}
  .wb-mobile-swap-card .wb-phone-callout::before{right:auto;left:50%;top:auto;bottom:100%;width:1px;height:15px;background:linear-gradient(0deg,transparent,#d6b567);transform:none}
  .wb-mobile-swap-card .wb-phone-callout::after{content:"↑";right:auto;left:calc(50% - 4px);top:auto;bottom:calc(100% + 11px);font-size:10px}
  .wb-mobile-swap-card.is-front .wb-phone-callout{transform:translate3d(-50%,0,30px)}
}
@media(max-width:380px){.wb-mobile-swap-deck{height:660px}}
/* Refinamiento de los indicadores: tipografía y luz integradas en la escena */
.wb-mobile-swap-card .wb-phone-callout{
  min-height:46px;
  padding:9px 30px 9px 12px;
  border:0;
  border-radius:999px;
  background:radial-gradient(ellipse at 4% 50%,rgba(214,181,103,.13),rgba(13,12,10,.10) 47%,transparent 80%);
  box-shadow:none;
  text-shadow:0 1px 12px #000d;
  backdrop-filter:blur(3px);
  -webkit-backdrop-filter:blur(3px);
}
.wb-mobile-swap-card .wb-phone-callout span{color:#d9bd83;font-size:6px;letter-spacing:.19em;text-shadow:0 0 12px #d6b56750}
.wb-mobile-swap-card .wb-phone-callout strong{font-size:11px;font-weight:600;letter-spacing:-.01em}
.wb-mobile-swap-card .wb-phone-callout i{color:#e2c67f;text-shadow:0 0 12px #d6b56765}
.wb-mobile-swap-card .wb-phone-callout::before{height:1.5px;border-radius:999px;background:linear-gradient(90deg,rgba(214,181,103,.08),rgba(214,181,103,.78));box-shadow:0 0 8px #d6b56755}
.wb-mobile-swap-card .wb-phone-callout::after{font-size:13px;text-shadow:0 0 10px #d6b56785}
.wb-mobile-swap-card.is-front .wb-phone-callout::after{animation:wb-callout-arrow-out 2.6s ease-in-out infinite}
.wb-mobile-swap-card.is-front .wb-phone-callout::before{animation:wb-callout-line-glow 2.6s ease-in-out infinite}
@keyframes wb-callout-arrow-out{
  0%,100%{transform:translate3d(0,0,0)}
  50%{transform:translate3d(3px,-3px,0)}
}
@keyframes wb-callout-arrow-up{
  0%,100%{transform:translate3d(0,0,0)}
  50%{transform:translate3d(0,-3px,0)}
}
@keyframes wb-callout-line-glow{
  0%,100%{opacity:.55}
  50%{opacity:1}
}
@media(max-width:1000px){
  .wb-mobile-swap-card .wb-phone-callout{
    min-height:35px;
    padding:7px 27px 7px 11px;
    border-radius:999px;
    background:radial-gradient(ellipse at center,rgba(214,181,103,.14),rgba(10,10,9,.12) 60%,transparent 90%);
  }
  .wb-mobile-swap-card .wb-phone-callout strong{font-size:9px}
  .wb-mobile-swap-card .wb-phone-callout::before{
    width:1.5px;
    border-radius:999px;
    background:linear-gradient(0deg,rgba(214,181,103,.08),rgba(214,181,103,.78));
    box-shadow:0 0 8px #d6b56755;
  }
  .wb-mobile-swap-card.is-front .wb-phone-callout::after{animation:wb-callout-arrow-up 2.6s ease-in-out infinite}
}
@media(prefers-reduced-motion:reduce){
  .wb-mobile-swap-card.is-front .wb-phone-callout::after,
  .wb-mobile-swap-card.is-front .wb-phone-callout::before{animation:none}
}
/* Más escala y contraste para que los indicadores se descubran rápido */
.wb-mobile-swap-card .wb-phone-callout{
  width:196px;
  min-height:62px;
  padding:13px 40px 13px 17px;
  background:radial-gradient(ellipse at 4% 50%,rgba(214,181,103,.24),rgba(13,12,10,.14) 52%,transparent 84%);
}
.wb-mobile-swap-card .wb-phone-callout span{font-size:7px;letter-spacing:.2em}
.wb-mobile-swap-card .wb-phone-callout strong{font-size:14px;line-height:1.2}
.wb-mobile-swap-card .wb-phone-callout i{right:14px;font-size:17px}
.wb-mobile-swap-card .wb-phone-callout::before{width:54px;height:2px;box-shadow:0 0 12px #d6b56790}
.wb-mobile-swap-card .wb-phone-callout::after{right:calc(100% + 48px);top:calc(50% - 11px);font-size:20px}
@keyframes wb-callout-arrow-out{
  0%,100%{transform:translate3d(0,0,0)}
  50%{transform:translate3d(5px,-4px,0)}
}
@media(max-width:1000px){
  .wb-mobile-swap-card .wb-phone-callout{
    width:max-content;
    max-width:calc(100vw - 50px);
    min-height:46px;
    padding:10px 38px 10px 15px;
    background:radial-gradient(ellipse at center,rgba(214,181,103,.24),rgba(10,10,9,.16) 62%,transparent 92%);
  }
  .wb-mobile-swap-card .wb-phone-callout span{font-size:7px}
  .wb-mobile-swap-card .wb-phone-callout strong{font-size:12px}
  .wb-mobile-swap-card .wb-phone-callout i{right:12px;font-size:15px}
  .wb-mobile-swap-card .wb-phone-callout::before{width:2px;height:20px;box-shadow:0 0 12px #d6b56790}
  .wb-mobile-swap-card .wb-phone-callout::after{left:calc(50% - 7px);bottom:calc(100% + 14px);font-size:16px}
}
@media(max-width:380px){
  .wb-mobile-swap-card .wb-phone-callout{max-width:calc(100vw - 38px);padding-right:34px}
  .wb-mobile-swap-card .wb-phone-callout strong{font-size:11px}
}
/* Indicadores sobre la captura y el marco: llamada visible, tipo vidrio cálido */
.wb-mobile-swap-card .wb-phone-callout{
  z-index:24;
  top:var(--callout-y,50%);
  left:35%;
  right:auto;
  bottom:auto;
  width:clamp(164px,62vw,205px);
  min-height:64px;
  padding:12px 39px 12px 16px;
  border:1px solid rgba(224,193,124,.42);
  border-radius:999px;
  background:linear-gradient(115deg,rgba(16,15,12,.92),rgba(38,31,19,.82) 62%,rgba(12,12,11,.76));
  box-shadow:0 12px 34px rgba(0,0,0,.46),0 0 26px rgba(214,181,103,.16),inset 0 1px rgba(255,255,255,.10);
  backdrop-filter:blur(11px) saturate(115%);
  -webkit-backdrop-filter:blur(11px) saturate(115%);
  text-shadow:0 2px 12px #000;
  transform:translate3d(10px,-50%,30px);
}
.wb-mobile-swap-card.is-front .wb-phone-callout{transform:translate3d(0,-50%,30px)}
.wb-mobile-swap-card .wb-phone-callout span{font-size:7px;letter-spacing:.2em}
.wb-mobile-swap-card .wb-phone-callout strong{font-size:13px;line-height:1.2}
.wb-mobile-swap-card .wb-phone-callout i{right:13px;font-size:18px}
.wb-mobile-swap-card .wb-phone-callout::before{
  right:100%;left:auto;top:50%;bottom:auto;
  width:47px;height:2px;border-radius:999px;
  background:linear-gradient(90deg,rgba(224,193,124,.04),rgba(224,193,124,.95));
  box-shadow:0 0 12px rgba(214,181,103,.72);
  transform:rotate(-9deg);transform-origin:right center;
}
.wb-mobile-swap-card .wb-phone-callout::after{
  content:"↖";right:calc(100% + 39px);left:auto;top:calc(50% - 12px);bottom:auto;
  color:#f0d99d;font:700 22px/1 var(--body);
  text-shadow:0 0 13px rgba(214,181,103,.9);
}
.wb-mobile-swap-card.is-front .wb-phone-callout::after{animation:wb-callout-arrow-out 2.35s ease-in-out infinite}
.wb-mobile-swap-card.is-front .wb-phone-callout::before{animation:wb-callout-line-glow 2.35s ease-in-out infinite}
.wb-mobile-swap-card[data-index="0"]{--callout-y:36%}
.wb-mobile-swap-card[data-index="1"]{--callout-y:50%}
.wb-mobile-swap-card[data-index="2"]{--callout-y:58%}
.wb-mobile-swap-card[data-index="3"]{--callout-y:43%}
.wb-mobile-swap-card[data-index="4"]{--callout-y:59%}
@media(max-width:380px){
  .wb-mobile-swap-card .wb-phone-callout{left:32%;width:clamp(158px,64vw,190px);min-height:60px;padding-left:13px}
  .wb-mobile-swap-card .wb-phone-callout strong{font-size:11px}
  .wb-mobile-swap-card .wb-phone-callout span{font-size:6px}
}
@media(prefers-reduced-motion:reduce){
  .wb-mobile-swap-card.is-front .wb-phone-callout::after,
  .wb-mobile-swap-card.is-front .wb-phone-callout::before{animation:none}
}
/* La llamada se mueve y se desvanece junto a su tarjeta; queda solo el trazo */
.wb-mobile-swap-card .wb-phone-callout{
  grid-template-columns:minmax(0,1fr);
  white-space:normal;
  overflow-wrap:anywhere;
  transform:translate3d(13px,-50%,30px) scale(.96);
  transition:opacity .34s ease,transform .62s cubic-bezier(.2,.75,.25,1),filter .34s ease;
  transition-delay:0s;
  filter:blur(1.5px);
}
.wb-mobile-swap-card.is-front .wb-phone-callout{
  transform:translate3d(0,-50%,30px) scale(1);
  transition-delay:.08s;
  filter:blur(0);
}
.wb-mobile-swap-card .wb-phone-callout span,
.wb-mobile-swap-card .wb-phone-callout strong{display:block;min-width:0;white-space:normal}
.wb-mobile-swap-card .wb-phone-callout i{display:none}
.wb-mobile-swap-card .wb-phone-callout::after{content:none!important;display:none!important}
.wb-mobile-swap-card .wb-phone-callout::before{
  opacity:0;
  transform:rotate(-9deg) scaleX(.78);
  transition:opacity .3s ease,transform .48s cubic-bezier(.2,.75,.25,1);
}
.wb-mobile-swap-card.is-front .wb-phone-callout::before{
  opacity:1;
  transform:rotate(-9deg) scaleX(1);
  transition-delay:.1s;
}
@media(max-width:1000px){
  .wb-mobile-swap-card .wb-phone-callout{transform:translate3d(13px,-50%,30px) scale(.96)}
  .wb-mobile-swap-card.is-front .wb-phone-callout{transform:translate3d(0,-50%,30px) scale(1)}
}
@media(prefers-reduced-motion:reduce){
  .wb-mobile-swap-card .wb-phone-callout,
  .wb-mobile-swap-card .wb-phone-callout::before{transition:none!important;filter:none!important}
}
/* Profundidad y menor solapamiento: el indicador flota en el borde del móvil */
.wb-mobile-swap-card .wb-phone-callout{
  left:50%;
  right:auto;
  bottom:auto;
  width:clamp(158px,calc(52vw - 8px),190px);
  min-height:64px;
  transform:translate3d(13px,-50%,30px) scale(.96);
  transform-style:preserve-3d;
  will-change:transform,opacity;
  transition:opacity .36s ease,transform .68s cubic-bezier(.2,.75,.25,1),filter .36s ease;
}
.wb-mobile-swap-card.is-front .wb-phone-callout{
  transform:translate3d(0,-50%,80px) scale(1);
  animation:wb-callout-depth 3.2s ease-in-out .38s infinite,wb-callout-depth-glow 3.2s ease-in-out .38s infinite;
}
@keyframes wb-callout-depth{
  0%,100%{transform:translate3d(0,-50%,80px) scale(1)}
  50%{transform:translate3d(0,calc(-50% - 3px),86px) scale(1.015)}
}
@keyframes wb-callout-depth-glow{
  0%,100%{box-shadow:0 12px 34px rgba(0,0,0,.46),0 0 26px rgba(214,181,103,.16),inset 0 1px rgba(255,255,255,.10)}
  50%{box-shadow:0 18px 42px rgba(0,0,0,.52),0 0 32px rgba(214,181,103,.24),inset 0 1px rgba(255,255,255,.14)}
}
@media(prefers-reduced-motion:reduce){
  .wb-mobile-swap-card.is-front .wb-phone-callout{animation:none;transform:translate3d(0,-50%,80px) scale(1)}
}
/* Pulido de movimiento: el indicador completa su entrada al mismo ritmo que el mazo */
.wb-mobile-swap-card .wb-phone-callout{
  transition:opacity .48s ease,transform .78s cubic-bezier(.22,.72,.24,1),filter .48s ease;
  transition-delay:0s;
}
.wb-mobile-swap-card.is-front .wb-phone-callout{transition-delay:.04s}
.wb-mobile-swap-card .wb-phone-callout::before{
  transition:opacity .48s ease,transform .64s cubic-bezier(.22,.72,.24,1);
}
.wb-mobile-swap-card.is-front .wb-phone-callout::before{transition-delay:.08s}

/* BlackBull · indicadores en rojo, integrados con su identidad */
.wb-brand-stage--blackbull .wb-phone-callout{
  border-color:rgba(211,20,37,.5);
  background:linear-gradient(115deg,rgba(12,10,10,.94),rgba(42,12,15,.88) 62%,rgba(12,10,10,.80));
  box-shadow:0 12px 34px rgba(0,0,0,.48),0 0 24px rgba(211,20,37,.16),inset 0 1px rgba(255,255,255,.09);
}
.wb-brand-stage--blackbull .wb-phone-callout span{color:#f05a63;text-shadow:0 0 12px rgba(211,20,37,.4)}
.wb-brand-stage--blackbull .wb-phone-callout strong{color:#fff3ef}
.wb-brand-stage--blackbull .wb-phone-callout::before{
  background:linear-gradient(90deg,rgba(211,20,37,.04),rgba(240,70,82,.96));
  box-shadow:0 0 13px rgba(211,20,37,.62);
}
.wb-brand-stage--blackbull .wb-phone-callout::after{color:#ff7c84;text-shadow:0 0 13px rgba(211,20,37,.8)}
.wb-brand-stage--blackbull .wb-mobile-swap-card[data-index="0"]{--callout-y:35%}
.wb-brand-stage--blackbull .wb-mobile-swap-card[data-index="1"]{--callout-y:55%}
.wb-brand-stage--blackbull .wb-mobile-swap-card[data-index="2"]{--callout-y:48%}
.wb-brand-stage--blackbull .wb-mobile-swap-card.is-front .wb-phone-callout{
  animation:wb-callout-depth 3.2s ease-in-out .38s infinite,wb-blackbull-callout-glow 3.2s ease-in-out .38s infinite;
}
@keyframes wb-blackbull-callout-glow{
  0%,100%{box-shadow:0 12px 34px rgba(0,0,0,.48),0 0 24px rgba(211,20,37,.16),inset 0 1px rgba(255,255,255,.09)}
  50%{box-shadow:0 18px 42px rgba(0,0,0,.54),0 0 33px rgba(211,20,37,.28),inset 0 1px rgba(255,255,255,.13)}
}
@media(prefers-reduced-motion:reduce){
  .wb-brand-stage--blackbull .wb-mobile-swap-card.is-front .wb-phone-callout{animation:none}
}
/* El indicador se independiza durante el desplazamiento y regresa al asentarse */
.wb-card-swap.is-swapping .wb-phone-callout{
  opacity:0!important;
  filter:blur(6px)!important;
  transform:translate3d(16px,-50%,26px) scale(.88)!important;
  transition:opacity .22s ease,transform .34s cubic-bezier(.4,0,.8,.2),filter .22s ease!important;
  transition-delay:0s!important;
  animation:none!important;
}
.wb-card-swap.is-swapping .wb-phone-callout::before{
  opacity:0!important;
  transform:rotate(-9deg) scaleX(.35)!important;
  transition:opacity .2s ease,transform .24s ease!important;
  animation:none!important;
}
.wb-card-swap:not(.is-swapping) .wb-mobile-swap-card.is-front .wb-phone-callout{
  transition:opacity .42s ease,transform .68s cubic-bezier(.2,.8,.2,1),filter .42s ease;
  transition-delay:.08s;
}
@media(prefers-reduced-motion:reduce){
  .wb-card-swap.is-swapping .wb-phone-callout,
  .wb-card-swap.is-swapping .wb-phone-callout::before{
    transition:none!important;
    filter:none!important;
  }
}
/* Transición de mazo más larga y orgánica, sincronizada con el indicador */
.wb-card-swap .wb-swap-card{
  transition:transform .88s cubic-bezier(.22,.78,.22,1),opacity .78s ease,filter .78s ease,border-color .68s ease,box-shadow .78s ease;
}
.wb-swap-card.is-leaving{animation:wb-card-throw .52s cubic-bezier(.18,.72,.24,1) forwards}
@keyframes wb-card-throw{
  to{transform:translate3d(108%,-56%,-45px) rotateZ(10deg) scale(.95);opacity:0}
}
.wb-card-swap.is-swapping .wb-phone-callout{
  transition:opacity .32s ease,transform .46s cubic-bezier(.4,0,.8,.2),filter .32s ease!important;
}
.wb-card-swap.is-swapping .wb-phone-callout::before{
  transition:opacity .3s ease,transform .36s cubic-bezier(.4,0,.8,.2)!important;
}
.wb-mobile-swap-card.is-front .wb-phone-callout,
.wb-brand-stage--blackbull .wb-mobile-swap-card.is-front .wb-phone-callout{
  animation-delay:.76s,.76s;
}
.wb-card-swap:not(.is-swapping) .wb-mobile-swap-card.is-front .wb-phone-callout{
  transition:opacity .48s ease,transform .72s cubic-bezier(.22,.78,.22,1),filter .48s ease;
  transition-delay:.06s;
}
.wb-card-swap:not(.is-swapping) .wb-mobile-swap-card.is-front .wb-phone-callout::before{
  transition:opacity .52s ease,transform .72s cubic-bezier(.22,.78,.22,1);
  transition-delay:.12s;
}
@media(prefers-reduced-motion:reduce){
  .wb-card-swap .wb-swap-card{transition:none!important}
  .wb-swap-card.is-leaving{animation:none!important}
  .wb-mobile-swap-card.is-front .wb-phone-callout,
  .wb-brand-stage--blackbull .wb-mobile-swap-card.is-front .wb-phone-callout{animation:none!important}
}