/* Focus Mode Agency · extras: recorrido por scroll, precios, bonus + QR, sitios */
.mic{margin-top:1.1rem;font-size:.82rem;color:rgba(245,245,245,.62);animation:fade 1s 2.1s both}
.chg{animation:fade .5s both}
.scrolly{height:420vh;padding:0}
.stk{position:sticky;top:0;height:100svh;display:grid;align-content:center;overflow:hidden;background:radial-gradient(560px circle at 72% 50%,rgba(0,180,219,.17),transparent 70%)}
.sg{display:grid;grid-template-columns:1.1fr .9fr;gap:3rem;align-items:center;padding-top:64px}
.kick{color:var(--blue);font:700 .9rem var(--f-title);margin-bottom:1rem}
.sl h2{font-size:clamp(2rem,4.6vw,3.6rem);max-width:16ch;min-height:2.3em}
.sx{margin-top:1.3rem;display:flex;gap:.8rem;align-items:flex-start;max-width:34rem;font-size:1.05rem;min-height:3.4em}
.pill{flex:none;font:800 .72rem var(--f-title);padding:.35rem .8rem;border-radius:99px;background:var(--red);color:#fff;transition:background .3s}
.sx.ok .pill{background:var(--green);color:var(--ink)}
.sl .btn{margin-top:1.4rem;opacity:0;transform:translateY(10px);pointer-events:none;transition:opacity .4s,transform .4s}
.sl.end .btn{opacity:1;transform:none;pointer-events:auto}
.ph2{background:#151515;border-radius:30px;padding:1.4rem;box-shadow:0 50px 90px -30px #000,inset 0 1px 0 rgba(255,255,255,.1)}
.ph2 ul{list-style:none;display:grid;gap:.6rem}
.ph2 li{display:flex;align-items:center;gap:.9rem;padding:.9rem 1rem;border-radius:14px;background:rgba(255,255,255,.05);font:700 .95rem var(--f-title);opacity:.35;transition:all .35s}
.ph2 li i{width:26px;height:26px;border-radius:50%;display:grid;place-items:center;font-style:normal;font-size:.8rem;background:rgba(255,255,255,.12);flex:none}
.ph2 li.cur{opacity:1;background:rgba(255,75,75,.14);box-shadow:inset 0 0 0 1.5px var(--red);transform:scale(1.03)}
.ph2 li.cur i{background:var(--red)}
.ph2 li.cur.ok{background:rgba(0,230,118,.12);box-shadow:inset 0 0 0 1.5px var(--green)}
.ph2 li.cur.ok i,.ph2 li.done i{background:var(--green);color:var(--ink)}
.ph2 li.done{opacity:.9}
.rail{position:absolute;left:0;right:0;bottom:0;height:4px;background:rgba(255,255,255,.08)}
.rail::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,var(--blue),var(--green));transform-origin:left;transform:scaleX(var(--sp,0))}
@media(max-width:860px){.sg{grid-template-columns:1fr;gap:1rem}.sl h2{font-size:1.8rem;min-height:2.2em}.ph2{padding:.5rem}.ph2 ul{grid-template-columns:repeat(6,1fr);gap:.3rem}.ph2 li{flex-direction:column;gap:.3rem;padding:.55rem .1rem;font-size:.58rem;text-align:center}.ph2 li.cur{transform:none}}
.lad{display:grid;gap:1.1rem;grid-template-columns:repeat(4,1fr);margin-top:3.2rem;align-items:stretch}
@media(max-width:1000px){.lad{grid-template-columns:1fr 1fr}}@media(max-width:560px){.lad{grid-template-columns:1fr}}
.plan{background:var(--card);border-radius:22px;padding:1.6rem;display:flex;flex-direction:column;position:relative;box-shadow:0 30px 60px -35px rgba(26,26,26,.5)}
.plan h3{font-size:1.1rem}.plan .pz{font:800 2.3rem var(--f-title);margin:.5rem 0}
.plan .pz small{font-size:.9rem;font-weight:600;color:var(--mut)}.plan p{color:var(--mut);font-size:.9rem}
.plan ul{list-style:none;margin:1rem 0 1.4rem;display:grid;gap:.4rem;font-size:.88rem;flex:1}
.plan li::before{content:"✓ ";color:#00a85a;font-weight:800}
.plan .btn{text-align:center;font-size:.78rem;padding:.9rem 1rem}
.plan.rec{background:var(--ink);color:var(--paper);box-shadow:0 0 0 2px var(--green),0 40px 80px -30px rgba(0,230,118,.5)}
.plan.rec p,.plan.rec .pz small{color:rgba(245,245,245,.72)}.plan.rec li::before{color:var(--green)}
.tagr{position:absolute;top:-13px;left:1.4rem;background:var(--green);color:var(--ink);font:800 .72rem var(--f-title);padding:.25rem .8rem;border-radius:99px}
.sup{margin-top:1.2rem;display:flex;justify-content:space-between;gap:1rem;flex-wrap:wrap;align-items:center;background:var(--card);border-radius:20px;padding:1.3rem 1.6rem;box-shadow:0 20px 50px -35px rgba(26,26,26,.5)}
.note{margin-top:1.2rem;font-size:.82rem;color:var(--mut)}
.bonus .wrap{display:grid;grid-template-columns:1.1fr .9fr;gap:3rem;align-items:center}
@media(max-width:860px){.bonus .wrap{grid-template-columns:1fr}}
.bdg{display:inline-block;background:var(--green);color:var(--ink);font:800 .75rem var(--f-title);padding:.3rem .9rem;border-radius:99px;margin-bottom:1rem}
.bonus .sub b{color:var(--green)}.bonus small{display:block;margin-top:1rem;color:var(--mut);font-size:.8rem}
.qrc{background:#fff;color:var(--ink);border-radius:26px;padding:1.6rem;text-align:center;box-shadow:0 40px 80px -30px #000}
.qrc input{width:100%;padding:.8rem 1rem;border-radius:12px;border:2px solid #ddd;font:500 1rem var(--f-body);margin-bottom:1rem}
.qrc input:focus{border-color:var(--blue);outline:0}
#qrd{display:inline-block;min-height:160px;min-width:160px}
#qlk{font-size:.78rem;color:#555;margin-top:.8rem;word-break:break-all}
.modes{display:inline-flex;gap:.3rem;margin-top:1.6rem;background:rgba(26,26,26,.08);border-radius:99px;padding:.3rem}
.modes button{border:0;background:none;font:700 .85rem var(--f-title);padding:.55rem 1.2rem;border-radius:99px;cursor:pointer;color:var(--ink);transition:all .25s}
.modes button[aria-pressed=true]{background:var(--ink);color:var(--paper)}

.ph2 li{cursor:pointer}
.ph2 li:focus-visible{outline:3px solid var(--green)}
@media(hover:hover) and (pointer:fine){.ph2 li:hover{opacity:.9}}
.hint{margin-top:1.1rem;font:700 .95rem var(--f-title);color:var(--green);display:flex;gap:.6rem;align-items:center}
.hint i{font-style:normal;font-size:1.2rem;animation:bn 1.2s ease-in-out infinite}
.sl.end .hint i{animation:none}
@keyframes bn{50%{transform:translateY(6px)}}
.ctl{margin-top:1.3rem;display:flex;gap:1.2rem;align-items:center;flex-wrap:wrap;font-size:.85rem;color:rgba(245,245,245,.6)}
.ctl a{color:inherit}

/* móvil del cliente */
.gm{display:grid;grid-template-columns:1fr 1fr;gap:3rem;align-items:center}
@media(max-width:860px){.gm{grid-template-columns:1fr}}
.game{background:radial-gradient(560px circle at 78% 50%,rgba(0,180,219,.16),transparent 70%),var(--ink)}
.btn:disabled{opacity:.65;cursor:default}
.gmsg{min-height:3.2em;margin-top:1.2rem;color:var(--green);font-weight:600}
.skip2{display:inline-block;margin-top:.4rem;font-size:.85rem;color:rgba(245,245,245,.6)}
.lostw{display:flex;align-items:baseline;gap:.9rem;margin-top:1.6rem;color:var(--mut)}
.lost{font:800 clamp(3.2rem,8vw,5rem) var(--f-title);color:var(--red);line-height:1}
.sw{all:unset;cursor:pointer;display:inline-flex;align-items:center;gap:.9rem;margin-top:1.4rem;font:800 1rem var(--f-title);background:rgba(255,255,255,.07);padding:.5rem 1.3rem .5rem .5rem;border-radius:99px;box-shadow:inset 0 0 0 1.5px rgba(255,255,255,.18)}
.sw i{width:54px;height:30px;border-radius:99px;background:var(--red);position:relative;transition:background .3s;flex:none}
.sw i::after{content:"";position:absolute;top:3px;left:3px;width:24px;height:24px;border-radius:50%;background:#fff;transition:transform .3s cubic-bezier(.2,.8,.2,1)}
.sw[aria-checked=true] i{background:var(--green)}.sw[aria-checked=true] i::after{transform:translateX(24px)}
.sw.nudge{animation:pl3 1.2s infinite}
@keyframes pl3{0%{box-shadow:0 0 0 0 rgba(0,230,118,.7)}100%{box-shadow:0 0 0 16px rgba(0,230,118,0)}}
.pw{display:grid;place-items:center;position:relative}
.phone{width:min(300px,100%);aspect-ratio:300/600;background:#0c0c0c;border-radius:42px;padding:10px;position:relative;box-shadow:0 0 0 2px #333,0 60px 100px -30px #000,0 0 80px rgba(255,75,75,.28);transition:box-shadow .5s}
.phone.good{box-shadow:0 0 0 2px #333,0 60px 100px -30px #000,0 0 90px rgba(0,230,118,.5)}
.phone.shake{animation:shk .45s}
@keyframes shk{20%{transform:translateX(-9px) rotate(-1deg)}40%{transform:translateX(9px) rotate(1deg)}60%{transform:translateX(-6px)}80%{transform:translateX(6px)}}
.notch{position:absolute;top:18px;left:50%;transform:translateX(-50%);width:84px;height:22px;background:#0c0c0c;border-radius:99px;z-index:5}
.scr{height:100%;border-radius:32px;background:#fff;color:var(--ink);overflow:hidden;position:relative;display:flex;flex-direction:column}
.sb{padding:34px 20px 6px;font:700 .75rem var(--f-title);color:#888;display:flex;justify-content:space-between}
.sv{flex:1;padding:10px 20px 0;display:flex;flex-direction:column;align-items:center;text-align:center;animation:fade .4s both}
.sv .ic{font-size:3.4rem;margin:.9rem 0 .4rem}
.sv h4{font:800 1.3rem var(--f-title);margin-bottom:.2rem}.sv p{color:#777;font-size:.85rem}
.ln{margin-top:1rem}.ln i{display:block;height:8px;border-radius:5px;background:#eee;margin:.5rem auto}
.pbtn{margin-top:auto;margin-bottom:.8rem;width:100%;border:0;border-radius:14px;padding:1rem;font:800 .95rem var(--f-title);background:var(--blue);color:#fff;cursor:pointer;animation:pl4 1.4s infinite}
.phone.good .pbtn{background:var(--green);color:var(--ink)}
@keyframes pl4{0%{box-shadow:0 0 0 0 rgba(0,180,219,.6)}100%{box-shadow:0 0 0 16px rgba(0,180,219,0)}}
.toast{position:absolute;left:14px;right:14px;bottom:88px;padding:.8rem 1rem;border-radius:14px;font:700 .85rem var(--f-title);color:#fff;background:var(--red);transform:translateY(20px);opacity:0;transition:all .3s;text-align:center}
.toast.on{transform:none;opacity:1}.toast.ok{background:var(--green);color:var(--ink)}
.pdots{display:flex;gap:6px;justify-content:center;padding:0 0 14px}.pdots i{width:22px;height:4px;border-radius:3px;background:#ddd}.pdots i.d{background:var(--blue)}.phone.good .pdots i.d{background:var(--green)}
.ov{position:absolute;inset:0;background:rgba(17,17,17,.95);color:var(--paper);display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:1.6rem;gap:.7rem;z-index:4;animation:fade .4s both}
.ov h3{font-size:1.4rem}.ov p{font-size:.88rem;opacity:.8}
.cf{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;z-index:6}
