/* ===== Página de planos ===== */
.hero--planos .hero__grid{padding-bottom:150px}
.stack{position:relative;height:480px;max-width:460px;width:100%;justify-self:center}
.stack__card{--r:0deg;position:absolute;margin:0;border-radius:24px;overflow:hidden;box-shadow:var(--shadow-lg);border:5px solid rgba(255,255,255,.1);background:#221c7a;transform:rotate(var(--r));animation:bobr 8s ease-in-out infinite}
.stack__card img{width:100%;height:100%;object-fit:cover}
.stack__card figcaption{position:absolute;left:12px;bottom:12px;background:rgba(14,11,58,.78);backdrop-filter:blur(8px);color:#fff;font-size:13px;font-weight:700;padding:7px 12px;border-radius:999px}
.stack__card--1{--r:-6deg;width:58%;height:80%;left:0;top:6%;z-index:2;animation-duration:7s}
.stack__card--2{--r:5deg;width:56%;height:46%;right:0;top:0;animation-delay:-2s}
.stack__card--3{--r:-2deg;width:54%;height:42%;right:2%;bottom:0;z-index:3;animation-duration:9s;animation-delay:-4s}
@keyframes bobr{0%,100%{transform:rotate(var(--r)) translateY(0)}50%{transform:rotate(var(--r)) translateY(-12px)}}
.chip{position:absolute;z-index:4;background:#fff;color:var(--ink);border-radius:16px;box-shadow:0 18px 40px -12px rgba(8,6,40,.55);font-weight:800;display:flex;align-items:center;gap:8px;animation:bob 6s ease-in-out infinite}
.chip--price{left:38%;top:44%;padding:12px 18px;flex-direction:column;align-items:flex-start;gap:0;line-height:1.1;background:var(--a);animation-delay:-3s}
.chip--price b{font-size:30px;letter-spacing:-.03em}
.chip--price small{font-size:12px;font-weight:700;opacity:.7}
.chip--ok{left:-18px;bottom:6%;padding:12px 16px;font-size:14px}
.chip--ok svg{color:#fff;background:var(--wa);border-radius:50%;padding:3px;width:22px;height:22px}

/* quiz */
.quiz-sec{position:relative;z-index:2;margin-top:-100px}
.quiz{max-width:860px;margin:0 auto;background:var(--card);border-radius:28px;box-shadow:0 40px 80px -30px rgba(26,21,96,.45);padding:34px clamp(20px,4vw,44px) 38px;border:1px solid var(--line);scroll-margin-top:100px}
.quiz__head{display:flex;gap:16px;align-items:center}
.quiz__ico{width:52px;height:52px;border-radius:16px;background:var(--p);color:var(--a);display:grid;place-items:center;flex:none}
.quiz__ico svg{width:26px;height:26px;animation:spin 6s linear infinite}
@keyframes spin{to{transform:rotate(360deg)}}
.quiz h2{font-size:clamp(22px,2.6vw,28px)}
.quiz__head p{color:var(--ink3);font-size:15px}
.quiz__bar{height:6px;border-radius:9px;background:var(--bg2);margin:24px 0 26px;overflow:hidden}
.quiz__bar i{display:block;height:100%;width:0;background:linear-gradient(90deg,var(--p3),var(--a));border-radius:inherit;transition:width .6s var(--ease)}
.quiz__step:not([hidden]){animation:slideIn .5s var(--ease)}
@keyframes slideIn{from{opacity:0;transform:translateX(24px)}}
.quiz__q{font-size:clamp(18px,2vw,21px);font-weight:700;margin-bottom:16px;display:flex;gap:12px;align-items:baseline}
.quiz__q span{font-size:13px;font-weight:800;color:var(--p2);background:rgba(55,48,217,.09);padding:4px 9px;border-radius:999px;flex:none}
.quiz__opts{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.quiz__opts button{font:inherit;text-align:left;cursor:pointer;background:var(--bg);border:2px solid transparent;border-radius:18px;padding:18px 20px;display:grid;gap:4px;color:var(--ink);transition:border-color .25s,transform .25s var(--ease),background .25s,box-shadow .25s}
.quiz__opts button:hover{border-color:var(--p3);background:#fff;transform:translateY(-3px);box-shadow:var(--shadow)}
.quiz__opts b{font-size:17px}
.quiz__opts small{color:var(--ink3);font-size:14.5px}
.quiz__back{font:inherit;font-size:14.5px;font-weight:700;color:var(--ink3);background:none;border:0;cursor:pointer;margin-top:14px;padding:6px 0}
.quiz__back:hover{color:var(--p2)}
.quiz__result{text-align:center}
.quiz__label{font-size:13px;font-weight:800;letter-spacing:.12em;text-transform:uppercase;color:var(--p2)}
.quiz__result h3{font-size:clamp(28px,4vw,40px);margin:8px 0 6px;background:linear-gradient(90deg,var(--p),var(--p3));-webkit-background-clip:text;background-clip:text;color:transparent}
.quiz__price{font-size:20px;font-weight:800}
.quiz__why{color:var(--ink2);max-width:560px;margin:10px auto 22px}
.quiz__ctas{display:flex;flex-wrap:wrap;gap:12px;justify-content:center;align-items:center}
.quiz__ctas .quiz__back{margin:0 0 0 4px}
.pop{animation:popIn .55s var(--ease) both}
@keyframes popIn{from{opacity:0;transform:translateY(16px) scale(.96)}}

/* filtro */
.ptabs{display:flex;justify-content:center;flex-wrap:wrap;gap:6px;margin:-16px auto 44px;padding:6px;background:var(--bg2);border-radius:999px;width:max-content;max-width:100%}
.ptabs button{font:inherit;font-weight:700;font-size:15px;border:0;cursor:pointer;padding:11px 20px;border-radius:999px;background:transparent;color:var(--ink2);transition:background .3s var(--ease),color .3s}
.ptabs button:hover{color:var(--p2)}
.ptabs button[aria-selected=true]{background:var(--p);color:#fff;box-shadow:0 8px 20px -8px rgba(26,21,96,.6)}

/* cards de plano */
.plans{display:grid;grid-template-columns:repeat(3,1fr);gap:26px;align-items:stretch;perspective:1200px}
.plan{position:relative;display:flex;scroll-margin-top:100px}
.plan.is-hidden{display:none}
.plan__in{--rx:0deg;--ry:0deg;--mx:50%;--my:0%;position:relative;z-index:1;display:flex;flex-direction:column;width:100%;background:var(--card);border-radius:26px;border:1px solid var(--line);box-shadow:var(--shadow);overflow:hidden;transform:rotateX(var(--rx)) rotateY(var(--ry));transition:transform .5s var(--ease),box-shadow .4s var(--ease)}
.plan__in::after{content:"";position:absolute;inset:0;pointer-events:none;background:radial-gradient(420px circle at var(--mx) var(--my),rgba(255,255,255,.2),transparent 45%);opacity:0;transition:opacity .3s}
.plan:hover .plan__in{box-shadow:var(--shadow-lg)}
.plan:hover .plan__in::after{opacity:1}
.plan__media{height:150px;overflow:hidden;position:relative}
.plan__media::after{content:"";position:absolute;inset:0;background:linear-gradient(transparent 40%,rgba(0,0,0,.25))}
.plan__media img{width:100%;height:100%;object-fit:cover;transition:transform .9s var(--ease)}
.plan:hover .plan__media img{transform:scale(1.07)}
.plan__body{padding:24px 26px 28px;display:flex;flex-direction:column;gap:10px;flex:1}
.plan h3{font-size:24px;margin-top:4px}
.plan__price{display:flex;align-items:baseline;gap:4px;line-height:1;margin-top:4px}
.plan__price b{font-size:50px;letter-spacing:-.045em;font-variant-numeric:tabular-nums}
.plan__price small{font-size:16px;font-weight:700;opacity:.65}
.plan__day{font-size:13.5px;font-weight:700;color:#168a42;margin-top:-2px}
.plan__desc{color:var(--ink2);font-size:15.5px}
.plan .checks{margin:6px 0 4px;font-size:15px}
.plan__ideal{font-size:14px;color:var(--ink3);padding:12px 14px;border-radius:12px;background:var(--bg);margin-top:auto}
.plan__ideal b{color:var(--ink)}
.plan__cta{margin-top:14px;width:100%}
.plan__ribbon{position:absolute;z-index:2;top:14px;right:14px;background:#fff;color:var(--p);font-size:12.5px;font-weight:800;padding:7px 12px;border-radius:999px;box-shadow:0 6px 16px -4px rgba(0,0,0,.3)}
.plan__ribbon--lime{background:var(--a);color:var(--ink)}

/* destaque com borda animada */
@property --ang{syntax:"<angle>";initial-value:0deg;inherits:false}
.plan--hot::before{content:"";position:absolute;inset:-3px;border-radius:29px;background:conic-gradient(from var(--ang),var(--a),var(--p3),#8A7BFF,var(--a));animation:ang 4s linear infinite;z-index:0}
@keyframes ang{to{--ang:360deg}}
.plan--hot .plan__in{background:var(--p);color:#fff;border:0}
.plan--hot .plan__desc,.plan--hot .checks{color:#D6D4F5}
.plan--hot .plan__ideal{background:rgba(255,255,255,.08);color:#C9C6F2}
.plan--hot .plan__ideal b{color:#fff}
.plan--dark .plan__in{background:linear-gradient(160deg,#17124f,var(--p-deep));color:#fff;border-color:rgba(255,255,255,.08)}
.plan--dark .plan__desc,.plan--dark .checks{color:#C9C6F2}
.plan--dark .plan__ideal{background:rgba(255,255,255,.07);color:#A9A5DD}
.plan--dark .plan__ideal b{color:#fff}
.plan--hot .plan__day,.plan--dark .plan__day{color:var(--a)}
.plan--hot .checks svg,.plan--dark .checks svg{background:var(--a);color:var(--ink)}
.plan--dark .tag:not(.tag--lime),.plan--hot .tag:not(.tag--lime){background:rgba(255,255,255,.1);color:#fff}
.plan.flash .plan__in{animation:flash 1.8s var(--ease)}
@keyframes flash{0%,100%{box-shadow:var(--shadow)}30%{box-shadow:0 0 0 5px var(--a),var(--shadow-lg)}}

/* tabela comparativa */
.cmp-wrap{overflow-x:auto;border-radius:var(--r);background:var(--card);box-shadow:var(--shadow);border:1px solid var(--line)}
.cmp{width:100%;border-collapse:collapse;min-width:780px;font-size:15px}
.cmp th,.cmp td{padding:16px 14px;text-align:center;border-bottom:1px solid var(--line)}
.cmp tbody tr:last-child>*{border-bottom:0}
.cmp thead th{font-size:15px;font-weight:800;vertical-align:bottom}
.cmp thead small{display:block;font-size:13px;font-weight:600;color:var(--ink3);margin-top:2px}
.cmp tbody th{text-align:left;font-weight:700;position:sticky;left:0;background:var(--card);z-index:1;min-width:180px}
.cmp tbody tr:hover>*{background:#faf9ff}
.cmp .is-hot{background:rgba(55,48,217,.06)}
.cmp thead .is-hot{background:var(--p);color:#fff}
.cmp thead .is-hot small{color:var(--a)}
.cmp i{font-style:normal;display:inline-flex;align-items:center;gap:6px;font-weight:700;font-size:13.5px;color:var(--p2);white-space:nowrap}
.cmp i.y::before{content:"";width:24px;height:24px;border-radius:50%;background:var(--p3) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='m6 12.5 4 4L18 8' fill='none' stroke='%23fff' stroke-width='2.6' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/16px no-repeat;flex:none}
.cmp i.n::before{content:"";width:16px;height:2px;background:#C9C6DA;border-radius:2px;display:block}
@media (scripting:enabled){
  .cmp-wrap .cmp i{transform:scale(0);transition:transform .45s var(--ease)}
  .cmp-wrap.in .cmp i{transform:none}
  .cmp-wrap.in tr:nth-child(2) i{transition-delay:.08s}.cmp-wrap.in tr:nth-child(3) i{transition-delay:.16s}.cmp-wrap.in tr:nth-child(4) i{transition-delay:.24s}.cmp-wrap.in tr:nth-child(5) i{transition-delay:.32s}.cmp-wrap.in tr:nth-child(6) i{transition-delay:.4s}.cmp-wrap.in tr:nth-child(7) i{transition-delay:.48s}
}

/* vantagens */
.perks{display:grid;grid-template-columns:repeat(4,1fr);gap:20px}
.perk{background:var(--card);border-radius:var(--r);padding:28px 24px;box-shadow:var(--shadow);border:1px solid var(--line);transition:transform .35s var(--ease)}
.perk:hover{transform:translateY(-6px)}
.perk__ico{width:54px;height:54px;border-radius:16px;display:grid;place-items:center;background:var(--p);color:var(--a);margin-bottom:18px;transition:transform .5s var(--ease)}
.perk:hover .perk__ico{transform:rotate(-8deg) scale(1.08)}
.perk__ico svg{width:26px;height:26px}
.perk h3{font-size:19px;margin-bottom:6px}
.perk p{color:var(--ink2);font-size:15px}

@media (max-width:1060px){.plans{grid-template-columns:1fr 1fr}.perks{grid-template-columns:1fr 1fr}}
@media (max-width:960px){.stack{height:420px;max-width:400px}}
@media (max-width:640px){
  .plans,.perks,.quiz__opts{grid-template-columns:1fr}
  .stack{height:340px}
  .chip--ok{left:0}
  .chip--price b{font-size:24px}
  .ptabs{width:100%;border-radius:20px}
  .ptabs button{flex:1 1 45%;padding:10px 12px;font-size:14px}
  .plan__price b{font-size:44px}
  .quiz-sec{margin-top:-80px}
}