:root {
  --bg: #090711;
  --panel: rgba(24, 19, 38, 0.88);
  --panel-2: #21192f;
  --line: rgba(255,255,255,.12);
  --text: #fff;
  --muted: #afa7bd;
  --accent: #a876ff;
  --accent-2: #ff72bd;
  --ok: #66e7b3;
  font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}
* { box-sizing: border-box; }
[hidden] { display: none !important; }
body { margin: 0; min-height: 100vh; overflow-x: hidden; color: var(--text); background: radial-gradient(circle at 50% 0, #25163c 0, var(--bg) 46%); }
button,input { font: inherit; }
button { cursor: pointer; }
.ambient { position: fixed; width: 460px; height: 460px; border-radius: 50%; filter: blur(100px); opacity: .18; pointer-events: none; }
.ambient-one { top: -220px; left: -150px; background: #995cff; }
.ambient-two { right: -200px; bottom: -200px; background: #ff5aae; }
.quiz-header { position: sticky; top: 0; z-index: 10; display: grid; grid-template-columns: 220px minmax(260px,560px) 220px; align-items: center; justify-content: space-between; gap: 28px; min-height: 82px; padding: 14px 4vw; border-bottom: 1px solid var(--line); background: rgba(9,7,17,.82); backdrop-filter: blur(18px); }
.brand { display: flex; align-items: center; gap: 10px; color: #fff; text-decoration: none; }
.brand span { display: grid; place-items: center; width: 37px; height: 37px; border-radius: 11px; background: linear-gradient(135deg,var(--accent),var(--accent-2)); font-weight: 950; }
.progress-copy { display: flex; justify-content: space-between; margin-bottom: 7px; color: var(--muted); font-size: .72rem; }
.progress-copy strong { color: #fff; }
.progress-track { height: 6px; overflow: hidden; border-radius: 99px; background: #2e2739; }
.progress-track i { display: block; width: 11%; height: 100%; border-radius: inherit; background: linear-gradient(90deg,var(--accent),var(--accent-2)); box-shadow: 0 0 18px #a876ff; transition: width .35s ease; }
.secure-badge { justify-self: end; border: 1px solid #4a3c5c; border-radius: 99px; padding: 8px 12px; color: #cfc6dc; font-size: .72rem; }
.quiz-stage { position: relative; z-index: 1; display: grid; place-items: center; min-height: calc(100vh - 82px); padding: 34px 18px; }
#quizForm { width: min(1120px,100%); }
.quiz-step { display: none; text-align: center; animation: enter .34s ease; }
.quiz-step.active { display: block; }
.quiz-step.wide-step { width: 100%; }
@keyframes enter { from { opacity:0; transform:translateY(16px); } to { opacity:1; transform:translateY(0); } }
.step-kicker { display: inline-block; margin-bottom: 12px; color: #c9aaff; font-size: .72rem; font-weight: 900; letter-spacing: .14em; text-transform: uppercase; }
h1 { max-width: 780px; margin: 0 auto; font-size: clamp(2rem,5vw,4rem); line-height: 1.03; letter-spacing: -.045em; }
.quiz-step > p { max-width: 650px; margin: 16px auto 30px; color: var(--muted); line-height: 1.55; }
.choice-grid { display: grid; gap: 14px; max-width: 790px; margin: 0 auto; }
.choice-grid.single-choice { grid-template-columns: repeat(3,1fr); }
.choice-grid.two { grid-template-columns: repeat(2,1fr); max-width: 680px; }
.choice-card { position: relative; display: grid; justify-items: center; gap: 8px; min-height: 190px; border: 1px solid var(--line); border-radius: 18px; padding: 25px 18px; color: #fff; background: linear-gradient(145deg,rgba(38,29,56,.95),rgba(20,16,31,.95)); }
.choice-card:hover:not(:disabled),.choice-card.selected { border-color: var(--accent); box-shadow: 0 0 0 1px #a876ff,0 18px 45px rgba(104,55,165,.25); transform: translateY(-3px); }
.choice-card.locked { opacity:.38; cursor:not-allowed; }
.choice-card i { position:absolute; top:12px; right:12px; border-radius:99px; padding:4px 8px; color:#140c1c; background:var(--ok); font-size:.6rem; font-style:normal; font-weight:900; }
.choice-icon { display:grid; place-items:center; width:64px; height:64px; border-radius:18px; color:#e8d8ff; background:#392950; font-size:1.3rem; font-weight:900; }
.choice-card strong { font-size:1.05rem; }
.choice-card small { color:var(--muted); line-height:1.4; }
.hero-input { display:grid; gap:8px; max-width:520px; margin:18px auto; text-align:left; }
.hero-input span { color:#cfc5db; font-size:.78rem; font-weight:850; }
.hero-input input { width:100%; border:1px solid var(--line); border-radius:14px; padding:17px; color:#fff; background:#181222; outline:none; }
.hero-input input:focus { border-color:var(--accent); box-shadow:0 0 0 3px rgba(168,118,255,.13); }
.hero-input input:disabled { opacity:.4; }
.whatsapp-number-notice { display:flex; align-items:flex-start; gap:11px; max-width:520px; margin:10px auto 18px; border:1px solid rgba(102,231,179,.24); border-radius:13px; padding:12px 13px; color:#d8d0e1; background:rgba(42,86,69,.18); text-align:left; }
.whatsapp-number-notice > span { display:grid; place-items:center; flex:0 0 28px; height:28px; border-radius:9px; color:#12251e; background:var(--ok); font-size:.8rem; font-weight:950; }
.whatsapp-number-notice p { margin:0; color:#aaa0b5; font-size:.72rem; line-height:1.5; }
.whatsapp-number-notice strong { color:#e8e2ed; }
.toggle-card,.consent-card { display:flex; align-items:center; gap:13px; max-width:520px; margin:20px auto; border:1px solid var(--line); border-radius:14px; padding:15px; background:rgba(30,23,44,.8); text-align:left; cursor:pointer; }
.toggle-card input,.consent-card input { width:20px; height:20px; accent-color:var(--accent); }
.toggle-card span { display:grid; gap:3px; }
.toggle-card small { color:var(--muted); }
.selection-counter { position:sticky; top:96px; z-index:3; display:inline-flex; align-items:center; gap:7px; margin-bottom:15px; border:1px solid #5e477c; border-radius:99px; padding:8px 13px; background:#171020; }
.selection-counter strong { color:#d5b7ff; font-size:1.2rem; }
.selection-counter span { color:var(--muted); font-size:.72rem; }
.reference-choices { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:12px; padding:4px; }
.reference-choice { position:relative; overflow:hidden; border:2px solid transparent; border-radius:13px; padding:0; color:#fff; background:#21192c; }
.reference-choice img { display:block; width:100%; aspect-ratio:3/4; object-fit:cover; }
.reference-choice span { display:block; padding:8px; overflow:hidden; font-size:.68rem; text-overflow:ellipsis; white-space:nowrap; }
.reference-choice.selected { border-color:var(--accent); box-shadow:0 0 20px rgba(168,118,255,.35); }
.reference-choice.selected::after { content:"✓"; position:absolute; top:8px; right:8px; display:grid; place-items:center; width:27px; height:27px; border-radius:50%; color:#140c1c; background:var(--ok); font-weight:950; }
.reference-pagination { display:flex; align-items:center; justify-content:center; gap:14px; margin:22px auto 0; }
.reference-pagination button,.reviews-controls button { display:grid; place-items:center; width:43px; height:43px; border:1px solid #5e4b72; border-radius:50%; color:#fff; background:#241a31; font-size:1.05rem; }
.reference-pagination button:disabled { opacity:.28; cursor:not-allowed; }
.reference-pagination span { min-width:108px; color:#c9c0d1; font-size:.75rem; font-weight:800; text-align:center; }
.loading-message { grid-column:1/-1; color:var(--muted); }
.upload-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:14px; }
.photo-upload { position:relative; display:grid; place-items:center; align-content:center; gap:7px; min-height:280px; overflow:hidden; border:1px dashed #76648b; border-radius:18px; background:rgba(28,21,42,.82); cursor:pointer; }
.photo-upload.required { border-color:#a876ff; }
.photo-upload input { position:absolute; opacity:0; }
.photo-upload img { position:absolute; inset:0; display:none; width:100%; height:100%; object-fit:cover; }
.photo-upload.has-image img { display:block; }
.photo-upload.has-image::after { content:"Trocar foto"; position:absolute; right:10px; bottom:10px; border-radius:99px; padding:7px 10px; color:#fff; background:rgba(9,7,17,.8); font-size:.68rem; }
.upload-icon { display:grid; place-items:center; width:56px; height:56px; border-radius:50%; color:#d8c3ff; background:#3b2a50; font-size:1.7rem; }
.photo-upload small { max-width:190px; color:var(--muted); line-height:1.45; }
.photo-tip { display:flex; justify-content:center; gap:10px; margin-top:15px; color:#cfc5db; font-size:.75rem; }
.photo-tip span { color:var(--muted); }
.female-photo-tip { max-width:780px; margin:10px auto 0; border:1px solid #ad75ef; border-radius:13px; padding:13px; background:rgba(116,67,160,.18); line-height:1.45; }
.female-photo-tip strong { color:#e0c5ff; }
.plan-notices { display:grid; grid-template-columns:1fr 1fr; gap:12px; margin:0 auto 24px; }
.plan-notices article { display:flex; align-items:flex-start; gap:12px; border:1px solid var(--line); border-radius:15px; padding:15px; background:rgba(31,23,45,.82); text-align:left; }
.plan-notices article > span { display:grid; place-items:center; flex:0 0 46px; height:46px; border-radius:13px; color:#eadcff; background:#422e5d; font-weight:950; }
.plan-notices article div { display:grid; gap:5px; }
.plan-notices article p { margin:0; color:var(--muted); font-size:.75rem; line-height:1.45; }
.plan-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:12px; align-items:stretch; }
.plan-card { position:relative; display:grid; gap:8px; min-height:230px; border:1px solid var(--line); border-radius:18px; padding:24px 16px; color:#fff; background:linear-gradient(155deg,#251b35,#15101e); text-align:left; }
.plan-card > span { color:#bd99f7; font-size:.72rem; font-weight:950; letter-spacing:.1em; }
.plan-card strong { font-size:1.35rem; }
.plan-card b { margin:9px 0; font-size:1.7rem; }
.plan-card small { color:var(--muted); }
.plan-card.featured { border-color:#8f62d1; }
.plan-card > i { position:absolute; top:-11px; left:50%; transform:translateX(-50%); border-radius:99px; padding:5px 10px; color:#1b0f24; background:linear-gradient(90deg,#d9baff,#ff9bd0); font-size:.57rem; font-style:normal; font-weight:950; white-space:nowrap; }
.plan-card.selected { border-color:var(--ok); box-shadow:0 0 0 1px var(--ok),0 20px 50px rgba(67,198,147,.16); }
.consent-card span { color:#d2c9dd; line-height:1.45; }
.consent-card.prominent { max-width:780px; }
.order-summary { display:grid; grid-template-columns:1fr 1fr; gap:12px; max-width:800px; margin:0 auto 20px; text-align:left; }
.summary-card { border:1px solid var(--line); border-radius:15px; padding:16px; background:var(--panel); }
.summary-card span { color:var(--muted); font-size:.72rem; }
.summary-card strong { display:block; margin-top:5px; }
.summary-references { grid-column:1/-1; display:grid; grid-template-columns:repeat(auto-fit,minmax(68px,1fr)); gap:8px; overflow:visible; }
.summary-references img { width:100%; aspect-ratio:3/4; border:1px solid rgba(255,255,255,.1); border-radius:10px; object-fit:cover; }
.payment-layout { display:grid; gap:15px; max-width:850px; margin:0 auto; text-align:left; }
.payment-whatsapp-notice { display:flex; align-items:center; justify-content:center; gap:10px; max-width:850px; margin:0 auto 14px; border:1px solid rgba(102,231,179,.2); border-radius:13px; padding:11px 14px; background:rgba(37,78,63,.18); text-align:left; }
.payment-whatsapp-notice > span { flex:0 0 auto; border-radius:99px; padding:5px 8px; color:#10241c; background:var(--ok); font-size:.61rem; font-weight:950; text-transform:uppercase; }
.payment-whatsapp-notice p { margin:0; color:#bdb4c6; font-size:.71rem; line-height:1.45; }
.pix-card,.payment-assurance { border:1px solid var(--line); border-radius:20px; padding:22px; background:var(--panel); }
.pix-card { display:grid; gap:13px; width:min(560px,100%); margin:0 auto; }
.pix-status { width:max-content; border-radius:99px; padding:6px 9px; color:#f7d675; background:#4b3a17; font-size:.65rem; font-weight:900; }
.pix-card > strong { font-size:1.3rem; }
.pix-card > b { font-size:2rem; }
.pix-configured { display:grid; gap:8px; border-radius:12px; padding:13px; background:#120e19; }
.pix-qr-image { width:min(260px,100%); aspect-ratio:1; justify-self:center; border-radius:12px; padding:8px; background:#fff; }
.pix-configured code { overflow-wrap:anywhere; color:#d9c2fb; }
.pix-configured button,.tracking-link,.whatsapp-link { border:0; border-radius:10px; padding:12px; color:#fff; background:#6e45aa; font-weight:900; text-align:center; text-decoration:none; }
.whatsapp-link { background:#1c9b66; }
.tracking-link { background:#30263e; }
.post-payment-actions { display:grid; gap:10px; }
.instagram-link { display:flex; align-items:center; justify-content:center; gap:9px; border:1px solid #5b496e; border-radius:10px; padding:11px 12px; color:#e4d9ee; background:rgba(255,255,255,.035); font-size:.78rem; font-weight:850; text-decoration:none; }
.instagram-link svg { width:19px; height:19px; fill:none; stroke:currentColor; stroke-width:1.8; }
.instagram-link .instagram-dot { fill:currentColor; stroke:none; }
.pix-missing { display:grid; gap:5px; border-radius:12px; padding:13px; color:#d6ccd8; background:#392932; }
.pix-missing span { color:#b8aebc; font-size:.75rem; line-height:1.45; }
.payment-assurance { display:grid; grid-template-columns:180px 1fr; align-items:center; gap:22px; background:linear-gradient(135deg,rgba(47,34,67,.95),rgba(25,19,37,.95)); }
.payment-assurance-heading { display:grid; gap:4px; }
.payment-assurance-heading > span { color:#c5a3f5; font-size:.65rem; font-weight:900; letter-spacing:.1em; text-transform:uppercase; }
.payment-assurance-heading strong { font-size:1.05rem; line-height:1.25; }
.payment-assurance ol { display:grid; grid-template-columns:repeat(4,1fr); gap:8px; margin:0; padding:0; list-style:none; }
.payment-assurance li { display:grid; align-content:start; gap:8px; min-height:105px; border-left:1px solid rgba(255,255,255,.1); padding:5px 11px; color:var(--muted); font-size:.7rem; line-height:1.4; }
.payment-assurance li i { display:grid; place-items:center; width:28px; height:28px; border-radius:9px; color:#160d20; background:linear-gradient(135deg,#d4b1ff,#ff95cb); font-style:normal; font-weight:950; }
.reviews-preview { max-width:1000px; margin:28px auto 0; border-top:1px solid var(--line); padding-top:24px; text-align:left; }
.reviews-heading { display:flex; align-items:end; justify-content:space-between; gap:20px; margin-bottom:14px; }
.reviews-heading > div:first-child { display:grid; gap:5px; }
.reviews-preview small { color:var(--muted); }
.stars { color:#ffc857; font-size:1.2rem; letter-spacing:3px; }
.reviews-controls { display:flex; gap:8px; }
.feedback-gallery { display:grid; grid-auto-flow:column; grid-auto-columns:minmax(220px,27%); gap:12px; overflow-x:auto; padding:3px 3px 12px; scroll-behavior:smooth; scroll-snap-type:x mandatory; scrollbar-width:none; }
.feedback-gallery::-webkit-scrollbar { display:none; }
.feedback-card { position:relative; height:340px; overflow:hidden; border:1px solid #4e405d; border-radius:17px; padding:0; background:#17111f; scroll-snap-align:start; box-shadow:0 14px 35px rgba(0,0,0,.2); }
.feedback-card img { width:100%; height:100%; object-fit:contain; object-position:center top; background:#0b0d0c; transition:transform .3s ease; }
.feedback-card span { position:absolute; left:50%; bottom:12px; transform:translateX(-50%); border:1px solid rgba(255,255,255,.14); border-radius:99px; padding:7px 12px; color:#fff; background:rgba(10,7,15,.8); backdrop-filter:blur(8px); font-size:.67rem; font-weight:850; white-space:nowrap; opacity:0; }
.feedback-card:hover img { transform:scale(1.025); }
.feedback-card:hover span { opacity:1; }
.feedback-modal { width:min(620px,calc(100% - 24px)); max-height:calc(100vh - 24px); overflow:auto; border:1px solid #5c4b6e; border-radius:20px; padding:10px; background:#110d17; box-shadow:0 30px 90px rgba(0,0,0,.7); }
.feedback-modal::backdrop { background:rgba(4,2,7,.82); backdrop-filter:blur(5px); }
.feedback-modal img { display:block; width:100%; border-radius:13px; }
.feedback-modal > button { position:sticky; top:5px; z-index:2; float:right; display:grid; place-items:center; width:38px; height:38px; margin:4px; border:0; border-radius:50%; color:#fff; background:rgba(16,10,22,.85); font-size:1.4rem; }
.quiz-navigation { display:grid; grid-template-columns:140px 1fr 180px; align-items:center; gap:12px; margin-top:35px; }
.back-button,.next-button { border:1px solid var(--line); border-radius:12px; padding:14px 18px; color:#fff; background:#21192e; font-weight:900; }
.next-button { display:inline-flex; align-items:center; justify-content:center; gap:12px; min-height:54px; border:1px solid rgba(255,255,255,.16); border-radius:14px; padding:14px 22px; background-color:#9b46c6; background-image:linear-gradient(135deg,#8049d1,#c64b9f); box-shadow:0 13px 28px rgba(146,67,190,.3),inset 0 1px rgba(255,255,255,.2); white-space:nowrap; }
.next-button i { display:inline; width:auto; height:auto; color:#fff; background:transparent; font-size:1.05rem; font-style:normal; box-shadow:none; transition:transform .2s ease; }
.next-button:hover i { transform:translateX(3px); }
.next-button:disabled { opacity:.5; cursor:wait; }
#stepError { margin:0; color:#ff9aa8; font-size:.76rem; text-align:center; }
.quiz-toast { position:fixed; left:50%; bottom:20px; z-index:30; transform:translate(-50%,20px); border-radius:99px; padding:11px 17px; color:#fff; background:#3d2851; opacity:0; transition:.2s; }
.quiz-toast.show { opacity:1; transform:translate(-50%,0); }
@media(max-width:850px){
  .quiz-header{grid-template-columns:1fr auto}.progress-shell{grid-column:1/-1;grid-row:2}.secure-badge{display:none}
  .choice-grid.single-choice,.plan-grid{grid-template-columns:repeat(2,1fr)}
  .reference-choices{grid-template-columns:repeat(3,1fr)}
  .payment-assurance{grid-template-columns:1fr}
  .feedback-gallery{grid-auto-columns:minmax(220px,42%)}
}
@media(max-width:580px){
  .quiz-header{position:relative;padding:12px 16px}.brand strong{font-size:.82rem}.quiz-stage{min-height:auto;padding:24px 13px 32px}
  .choice-grid.single-choice,.choice-grid.two,.upload-grid,.plan-grid,.plan-notices,.payment-layout,.order-summary,.review-placeholders{grid-template-columns:1fr}
  .choice-card{min-height:150px}.reference-choices{grid-template-columns:repeat(2,1fr)}
  .photo-upload{min-height:220px}.summary-references{grid-column:auto;grid-template-columns:repeat(4,1fr);gap:7px}
  .quiz-navigation{grid-template-columns:92px minmax(155px,1fr);gap:9px}.quiz-navigation #stepError{grid-column:1/-1;grid-row:1}.back-button{grid-column:1;grid-row:2}.next-button{grid-column:2;grid-row:2;width:100%}
  .quiz-navigation:has(.back-button[hidden]) .next-button{grid-column:1/-1}
  .pix-card,.payment-assurance{padding:17px}
  .pix-card > b{font-size:1.7rem}
  .pix-configured code{max-height:92px;overflow:auto;font-size:.68rem}
  .payment-assurance ol{grid-template-columns:1fr 1fr}
  .payment-assurance li{min-height:92px;border:1px solid rgba(255,255,255,.08);border-radius:12px;padding:11px}
  .reviews-heading{align-items:center}
  .reviews-heading strong{font-size:.9rem}
  .feedback-gallery{grid-auto-columns:78%}
  .feedback-card{height:390px}
  .feedback-card span{opacity:1}
  .payment-whatsapp-notice{align-items:flex-start;flex-direction:column;gap:7px}
}
