/* Site NexMed — topo azul, Dr. Nex com estetoscópio, órbita de ícones, cartões brancos animados */
body{background:#F6F8FF}
.top{position:relative;background:radial-gradient(60% 45% at 80% 35%,#4D6BFF,transparent 70%),linear-gradient(160deg,#1438E6,#0E26A8);color:#fff;padding-bottom:128px;border-radius:0 0 34px 34px;overflow:hidden;isolation:isolate}
.top::before{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(rgba(255,255,255,.06) 1px,transparent 1px) 0 0/40px 40px,linear-gradient(90deg,rgba(255,255,255,.06) 1px,transparent 1px) 0 0/40px 40px}
.top::after{content:"";position:absolute;inset:-40%;z-index:-1;background:conic-gradient(from 0deg,transparent 0 70%,rgba(159,227,255,.16) 80%,transparent 90%);animation:spin 14s linear infinite}
.plus{position:absolute;bottom:-20px;z-index:-1;color:rgba(255,255,255,.35);font-weight:900;font-style:normal;animation:rise linear infinite}
header .wrap{display:flex;justify-content:space-between;align-items:center;height:60px}
.logo .wm{height:19px}
header .ig{font-weight:800;font-size:12.5px;background:rgba(255,255,255,.14);padding:8px 12px;border-radius:999px}
header .back{font-weight:800;font-size:14px;background:rgba(255,255,255,.14);padding:8px 12px;border-radius:999px}
.hero{padding-top:16px;text-align:center}
.top .kick{color:#fff;border-color:rgba(255,255,255,.55);background:rgba(255,255,255,.1)}.top .kick i{background:#4ADE80}
.top .big{font-size:clamp(40px,12vw,88px);line-height:.95;margin:16px auto 12px;color:#fff;max-width:11ch;text-wrap:balance}
.top .big em{display:inline-block;background:linear-gradient(90deg,#9FE3FF,#fff,#9FE3FF);background-size:200% 100%;-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;animation:sheen 4s linear infinite}
.top .sub{font-size:17px;line-height:1.5;color:#D6DEFF;max-width:30ch;margin:0 auto;text-wrap:pretty}
.stage{position:relative;width:min(340px,74vw);aspect-ratio:1;margin:54px auto 0}
.ring{position:absolute;inset:8%;border-radius:50%;border:2px solid rgba(255,255,255,.5);animation:pulse 3s ease-out infinite}
.ring.r2{animation-delay:1s}.ring.r3{animation-delay:2s}
.disc{position:absolute;inset:8%;border-radius:50%;background:radial-gradient(circle at 50% 38%,#6C88FF,#2443E8 72%);box-shadow:inset 0 -20px 40px rgba(10,20,90,.35)}
.stage .nex{position:absolute;left:3%;bottom:0;width:94%;animation:float 5s ease-in-out infinite;filter:drop-shadow(0 18px 26px rgba(5,15,80,.45));-webkit-mask-image:linear-gradient(180deg,#000 84%,transparent);mask-image:linear-gradient(180deg,#000 84%,transparent)}
.orbit{position:absolute;inset:0;border-radius:50%;border:1.5px dashed rgba(255,255,255,.28);animation:spin 26s linear infinite}
.ob{position:absolute;left:50%;top:50%;width:48px;height:48px;margin:-24px 0 0 -24px;transform:rotate(var(--a)) translate(calc(min(340px,74vw)*.5)) rotate(calc(var(--a)*-1))}
.ob span{display:grid;place-items:center;width:100%;height:100%;border-radius:50%;background:#fff;color:var(--blue);box-shadow:0 12px 26px rgba(5,15,80,.4);animation:spin 26s linear infinite reverse}
.ob svg{width:24px;height:24px;fill:none;stroke:currentColor;stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round}

/* cartões */
.doors{display:grid;gap:14px;margin-top:-66px;position:relative}
@media(min-width:860px){.doors{grid-template-columns:repeat(3,1fr)}}
.door{position:relative;display:block;background:#fff;border-radius:24px;padding:16px;box-shadow:0 24px 48px -22px rgba(14,38,168,.4);overflow:hidden;transition:transform .25s}
.door:active{transform:scale(.98)}
.door .row{display:flex;align-items:center;gap:14px}
.door .th{position:relative;width:78px;height:78px;flex:none;border-radius:18px;background:linear-gradient(160deg,#EEF2FF,#D5DFFF);display:grid;place-items:center;overflow:hidden}
.door .th img{max-height:70px;max-width:70px;width:auto;object-fit:contain;filter:drop-shadow(0 6px 10px rgba(14,38,168,.3));animation:float 4.5s ease-in-out infinite}
/* miniatura da plataforma: celular desenhado com a tela do Qbank */
.mini{position:relative;width:42px;height:82px;margin-top:22px;border-radius:9px;background:#05070f;padding:3px;box-shadow:0 10px 18px rgba(14,38,168,.45);transform:rotate(-8deg);animation:tilt 4.5s ease-in-out infinite}
.mini::before{content:"";position:absolute;top:4px;left:50%;width:14px;height:4px;transform:translateX(-50%);background:#05070f;border-radius:4px;z-index:1}
.door .th .mini img{width:100%;height:100%;max-width:none;max-height:none;object-fit:cover;object-position:top;border-radius:6px;filter:none;animation:none}
.door .th .badge{position:absolute;right:6px;top:6px;font-weight:900;font-size:9px;color:#fff;background:var(--blue);padding:3px 5px;border-radius:6px;animation:pop 2.4s ease-in-out infinite}
.door .th.ph{background:linear-gradient(160deg,#FFF4D6,#FFE2A3)}
.door .th.ph img{max-width:74px}
.door .th.wa{background:linear-gradient(160deg,#DCFCE7,#A7F3D0)}
.door .th.wa img{width:70px;height:70px;max-width:none;border-radius:50%;object-fit:cover;border:3px solid #fff}
.door .th.wa .dot{position:absolute;right:7px;bottom:7px;width:14px;height:14px;border-radius:50%;background:#25D366;border:2px solid #fff;animation:pop 1.6s ease-in-out infinite}
.door b{display:block;font-weight:900;font-size:20px;letter-spacing:-.02em;line-height:1.12}
.door small{display:block;color:var(--mut);font-size:15px;line-height:1.35;margin-top:4px}
.door .btn{position:relative;overflow:hidden;margin-top:14px;display:flex;justify-content:space-between;align-items:center;font-weight:800;font-size:16px;color:#fff;background:linear-gradient(90deg,#1438E6,#2F5BFF);padding:14px 16px;border-radius:14px;box-shadow:0 12px 24px -10px rgba(20,56,230,.7)}
.door .btn::after{content:"";position:absolute;inset:0;background:linear-gradient(115deg,transparent 35%,rgba(255,255,255,.4) 50%,transparent 65%);transform:translateX(-120%);animation:shine 3.6s ease-in-out infinite}
.door .btn i{font-style:normal;animation:nudge 1.2s ease-in-out infinite}
.door.ph .btn{background:linear-gradient(90deg,#E89B00,#F5B82E);box-shadow:0 12px 24px -10px rgba(232,155,0,.7)}
.door.wa .btn{background:linear-gradient(90deg,#16A34A,#25D366);box-shadow:0 12px 24px -10px rgba(37,211,102,.7)}
.door.off .btn{background:var(--sky);color:var(--blue);box-shadow:none}.door.off .btn::after{display:none}
.soon{display:inline-block;margin-bottom:6px;font-weight:800;font-size:10px;letter-spacing:1.2px;color:#fff;background:var(--purple);padding:4px 8px;border-radius:999px}
.live{display:inline-flex;margin-bottom:6px;align-items:center;gap:6px;font-weight:800;font-size:10px;letter-spacing:1.2px;color:#15803D;background:#DCFCE7;padding:4px 8px;border-radius:999px}
.live i{width:6px;height:6px;border-radius:50%;background:#22C55E;animation:blink 1.2s steps(2) infinite}
.rv.l{transform:translateX(-40px)}.rv.r{transform:translateX(40px)}.rv.l.in,.rv.r.in{transform:none}
.foot{color:var(--ink)}

/* página da plataforma */
.phone{position:relative;width:min(300px,76vw);aspect-ratio:9/16;margin:28px auto 0;border-radius:36px;padding:9px;background:#05070f;box-shadow:0 30px 60px rgba(5,15,80,.5),0 0 0 1px rgba(255,255,255,.12)}
.phone video{width:100%;height:100%;border-radius:28px;object-fit:cover;background:#000;display:block}
.phone::before{content:"";position:absolute;top:16px;left:50%;width:78px;height:20px;transform:translateX(-50%);background:#000;border-radius:20px;z-index:2}
.mega{position:relative;overflow:hidden;display:flex;align-items:center;justify-content:center;gap:12px;width:100%;max-width:520px;margin:-40px auto 0;padding:22px 20px;font-weight:900;font-size:clamp(19px,5.4vw,23px);color:#fff;background:linear-gradient(90deg,#1438E6,#2F5BFF);border-radius:18px;box-shadow:0 20px 40px -14px rgba(20,56,230,.8);animation:glow 2.2s ease-in-out infinite}
.mega::after{content:"";position:absolute;inset:0;background:linear-gradient(115deg,transparent 35%,rgba(255,255,255,.45) 50%,transparent 65%);transform:translateX(-120%);animation:shine 3s ease-in-out infinite}
.mega i{font-style:normal;animation:nudge 1.2s ease-in-out infinite}
.note{margin-top:12px;font-size:14px;color:var(--mut);text-align:center}
.chips{display:flex;flex-wrap:wrap;justify-content:center;gap:8px;margin-top:22px}
.chip{font-weight:800;font-size:14px;padding:10px 13px;border-radius:12px;background:#fff;border:2px solid var(--line)}
.chip b{color:var(--blue);margin-right:6px}

@keyframes spin{to{transform:rotate(360deg)}}
@keyframes pulse{0%{transform:scale(1);opacity:.7}100%{transform:scale(1.45);opacity:0}}
@keyframes sheen{to{background-position:-200% 0}}
@keyframes rise{0%{transform:translateY(0) rotate(0);opacity:0}10%{opacity:1}100%{transform:translateY(-120vh) rotate(180deg);opacity:0}}
@keyframes tilt{0%,100%{transform:rotate(-8deg) translateY(0)}50%{transform:rotate(-3deg) translateY(-5px)}}
@keyframes pop{0%,100%{transform:scale(1)}50%{transform:scale(1.18)}}
@keyframes glow{0%,100%{box-shadow:0 20px 40px -14px rgba(20,56,230,.8)}50%{box-shadow:0 20px 56px -8px rgba(47,91,255,1)}}

.door{display:flex;flex-direction:column}.door .row{margin-bottom:14px}.door .btn{margin-top:auto}