*{box-sizing:border-box}
:root{
  --bg:#edeced;--surface:#f8f9fa;--surface-2:#f1f2f4;--text:#1e2633;--muted:#596274;
  --line:#d8dce2;--blue:#0a49cd;--green:#3f800b;
}
html,body{margin:0;min-height:100%;font-family:Arial,Helvetica,sans-serif;color:var(--text);background:var(--bg)}
body{display:flex;justify-content:center}
button,a,input{font:inherit}
button{cursor:pointer}
.hidden{display:none!important}
.page-shell{width:min(592px,calc(100vw - 30px));padding:14px 0 20px}
.top-card{background:var(--surface);border-radius:8px 8px 0 0;overflow:hidden;box-shadow:0 0 0 1px rgba(20,28,40,.03)}
.header{height:60px;display:flex;align-items:center;justify-content:space-between;padding:7px 22px 6px 18px}
.brand{width:84px;height:43px;object-fit:contain}
.outline-btn{min-width:125px;height:40px;border:1.5px solid var(--blue);border-radius:24px;background:#fff;color:#111;font-weight:700;font-size:12px}
.hero-wrap{padding:0 18px}.hero{display:block;width:100%;height:auto;border-radius:9px}
.draw-row{margin:4px 18px 0;padding-bottom:5px;display:flex;gap:12px;justify-content:space-between;align-items:center;border-bottom:1px solid #cfd3da;font-size:14px}
.draw-row strong{font-weight:600}.draw-row span{font-size:12px;color:#596274;white-space:nowrap}
.meta-row{padding:6px 18px 7px;display:flex;justify-content:space-between;align-items:center;font-size:11px;color:#343b48}
.meta-row a,.cookie-row a,.checkout-cookie a,.legal a{color:#133e88;text-decoration:underline}
.price-chip{display:inline-block;margin-left:4px;padding:5px 7px;background:#d4d8dd;border-radius:3px}.divider{height:1px;background:#e2e4e7}
.buy-section{padding:9px 18px 8px}.buy-section h2{margin:0 0 10px;font-size:16px;line-height:1;font-weight:800;color:#465164}
.packs{display:grid;grid-template-columns:1fr 1fr;gap:18px}
.pack{position:relative;height:76px;border:1px solid #2f3a4c;border-radius:9px;background:#fff;padding:12px 10px;text-align:left;color:var(--text);display:flex;flex-direction:column;justify-content:space-between}
.pack b{font-size:14px}.pack span:not(.badge){font-size:14px;color:#566173}.pack strong{font-size:14px}.pack.active{border-color:#0a49cd;background:#f1f7ef}
.badge{position:absolute;top:-10px;left:18px;padding:2px 14px 2px 13px;background:#155ccf;color:#fff;border-radius:3px 3px 0 0;font-size:10px;font-weight:800;line-height:15px;box-shadow:10px 0 0 -5px #155ccf,-10px 0 0 -5px #155ccf}
.badge:before,.badge:after{content:"";position:absolute;top:0;border-top:19px solid #155ccf}.badge:before{left:-8px;border-left:8px solid transparent}.badge:after{right:-8px;border-right:8px solid transparent}
.quantity-row{border-top:1px solid #e1e4e8;border-bottom:1px solid #e1e4e8;padding:15px 18px 13px;display:grid;grid-template-columns:42px 1fr 42px;gap:8px;background:#f7f8f9}
.qty-btn,.qty-value{height:42px;border:1px solid #506078;border-radius:9px;background:#fbfcfd;display:flex;align-items:center;justify-content:center}
.qty-btn{font-size:20px;color:#2e394a}.qty-value{font-size:16px;font-weight:700;color:#5b6574}
.qty-btn:disabled{opacity:.4;cursor:default}
.checkout-bar{min-height:59px;padding:8px 18px;display:flex;justify-content:space-between;align-items:center;background:#f8f9fa}
.checkout-bar small{display:block;font-weight:700;font-size:10px;color:#526072;margin-bottom:3px}.checkout-bar strong{display:block;font-size:17px}
.buy-btn{border:0;border-radius:5px;background:var(--green);color:white;font-weight:900;font-size:14px;padding:13px 21px;min-width:118px}
.client-card{margin-top:30px;min-height:260px;padding:28px 18px;background:var(--surface-2);border-radius:8px;box-shadow:0 0 0 1px rgba(20,28,40,.02)}
.client-card h3{margin:0 0 19px;font-size:20px;color:#090d14}
.client-link{width:100%;height:58px;padding:0 18px;border:1px solid #556074;border-radius:8px;background:#f8f9fa;display:flex;align-items:center;justify-content:space-between;color:#1b2636}
.client-left{display:flex;align-items:center;gap:10px}.search-icon{font-size:23px;color:#0a49cd;transform:rotate(-15deg);display:inline-block}.client-link strong{font-size:13px}.arrow{font-size:25px;color:#111}
.cookie-row{margin-top:25px;display:flex;align-items:center;justify-content:space-between;gap:18px}.cookie-row p{margin:0;font-size:9px;color:#4a5362;line-height:1.45}
.cookie-row button{width:60px;height:39px;border:1px solid #4c596d;border-radius:7px;background:#f8f9fa;color:#4a5362;font-size:11px;font-weight:700}
.partners{height:75px;display:flex;align-items:flex-end;justify-content:center;background:var(--surface-2)}.partners img{width:255px;max-width:75%;height:auto;object-fit:contain}

/* CHECKOUT */
.checkout-view{padding:2px 0 6px}
.checkout-card{background:#f8f9fa;border-radius:8px;padding:8px 22px 36px;min-height:595px}
.checkout-logo-wrap{height:48px;display:flex;justify-content:center;align-items:flex-start}
.checkout-logo-wrap img{width:92px;height:45px;object-fit:contain}
.breadcrumb{display:flex;align-items:center;gap:5px;margin-top:6px;margin-bottom:14px;font-size:9px;color:#303745}
.breadcrumb-link{border:0;padding:0;background:transparent;color:#0b49c4;font-size:9px}
.order-mini{display:none}
.checkout-card h1{font-size:16px;margin:0 0 11px;color:#080c12}
#personalForm{display:flex;flex-direction:column;gap:14px}
#personalForm label{display:flex;flex-direction:column;gap:6px;font-size:13px;color:#485467;font-weight:500}
#personalForm input{height:43px;border:1px solid #d9dfe6;border-radius:8px;background:#fbfcfd;padding:0 10px;font-size:16px;outline:none;color:#273142}
#personalForm input:focus{border-color:#9bb7ea;box-shadow:0 0 0 2px rgba(10,73,205,.06)}
#personalForm input::placeholder{color:#929fb1}
.payment-btn{margin-top:4px;height:50px;border:0;border-radius:7px;background:var(--green);color:#fff;font-size:14px;font-weight:800}
.checkout-cookie{text-align:center;padding:20px 8px 0;font-size:11px;color:#111}
.checkout-cookie strong{display:block;font-size:11px;margin-bottom:8px}.checkout-cookie p{margin:0;font-size:11px;line-height:1.45}
.checkout-partners{height:91px;display:flex;justify-content:center;align-items:center}.checkout-partners img{width:246px;max-width:78%;object-fit:contain}
.legal{font-size:10.5px;line-height:1.5;color:#111;padding:2px 22px 0;text-align:justify}
.legal p{margin:0 0 24px}.legal p:nth-child(2){text-align:center;font-size:12px;margin-bottom:13px}
.legal-links{display:flex;justify-content:center;gap:38px;font-size:10px}.legal-links a{color:#111}
.legal .version{text-align:center;font-size:10px;margin-top:20px;margin-bottom:0}
.field-error{border-color:#cc3c3c!important}
.btn-spinner{width:16px;height:16px;border:2px solid rgba(255,255,255,.45);border-top-color:#fff;border-radius:50%;display:inline-block;vertical-align:-3px;margin-right:8px;animation:captcha-spin .7s linear infinite}
.confirm-buy-btn:disabled{opacity:.85;cursor:default}
.cpf-hint{display:none;margin-top:5px;font-size:11px;line-height:1.35}
.cpf-hint.show{display:block}
.cpf-hint.err{color:#cc3c3c}
.cpf-hint.busy{color:var(--muted)}
.cpf-hint.ok{color:var(--green)}

.toast{position:fixed;left:50%;bottom:18px;transform:translate(-50%,20px);opacity:0;padding:10px 14px;border-radius:7px;background:#121820;color:#fff;font-size:12px;pointer-events:none;transition:.18s ease;white-space:nowrap;z-index:20;box-shadow:0 8px 25px rgba(0,0,0,.2)}
.toast.show{opacity:1;transform:translate(-50%,0)}

@media(max-width:520px){
  .page-shell{width:100%;padding-top:0}
  .top-card{border-radius:0}.header{padding-left:14px;padding-right:14px}.hero-wrap,.buy-section{padding-left:14px;padding-right:14px}
  .draw-row{margin-left:14px;margin-right:14px}.meta-row,.quantity-row,.checkout-bar{padding-left:14px;padding-right:14px}.packs{gap:14px}
  .client-card{margin-top:18px;border-radius:0;padding-left:14px;padding-right:14px}
  .checkout-card{border-radius:0;padding-left:20px;padding-right:20px}
  .legal{padding-left:20px;padding-right:20px}
}


/* TELA 3 — PAGAMENTO */
.payment-view{padding:10px 0 6px}
.payment-card-shell{
  background:#f7f8f9;
  border-radius:8px;
  padding:8px 14px 38px;
}
.payment-breadcrumb{margin:5px 7px 15px}
.customer-summary{
  min-height:50px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:16px;
  margin:0;
  padding:9px 22px;
  background:#fbfcfd;
  border-radius:12px;
  box-shadow:0 3px 9px rgba(24,34,49,.06);
}
.customer-summary>div{display:flex;flex-direction:column;gap:6px}
.customer-summary strong{font-size:13px;color:#3b4454}
.customer-summary span{font-size:10px;color:#667080}
.customer-summary button{
  border:0;
  background:transparent;
  padding:0;
  color:#3c4655;
  text-decoration:underline;
  font-size:10px;
}
.payment-method-card{
  margin-top:5px;
  padding:10px 22px 12px;
  background:#fff;
  border-radius:12px;
  box-shadow:0 3px 9px rgba(24,34,49,.06);
}
.payment-method-card h2,.order-summary-card h2{
  margin:0;
  font-size:16px;
  color:#111723;
}
.pix-option{
  margin-top:16px;
  height:57px;
  padding:10px 12px;
  border:1.5px solid #0a49cd;
  border-radius:7px;
  display:flex;
  align-items:center;
  gap:9px;
  cursor:pointer;
}
.pix-option input{position:absolute;opacity:0;pointer-events:none}
.fake-radio{
  width:20px;height:20px;
  border:1.6px solid #1c5ed8;
  border-radius:50%;
  position:relative;
  flex:0 0 auto;
}
.fake-radio:after{
  content:"";
  position:absolute;
  inset:4px;
  background:#1c5ed8;
  border-radius:50%;
}
.pix-option>span:last-child{display:flex;flex-direction:column;gap:2px}
.pix-option strong{font-size:14px}
.pix-option small{font-size:11px;color:#697386}

.order-summary-card{
  margin-top:6px;
  padding:12px 22px 15px;
  background:#fff;
}
.summary-title{display:flex;align-items:center;justify-content:space-between;margin-bottom:17px}
.summary-title span{font-size:20px;line-height:1}
.summary-line{display:flex;align-items:center;justify-content:space-between;gap:12px;font-size:11px}
.summary-line small{font-size:9px;color:#697386}
.summary-line strong{font-size:10px;color:#454f5f}
.summary-separator{height:1px;background:#e6e9ed;margin:13px 0 17px}
.summary-count{
  margin-top:13px;
  background:#f4f5f7;
  border-radius:14px;
  min-height:24px;
  padding:5px 10px;
  display:flex;
  align-items:center;
  justify-content:space-between;
}
.summary-count strong{font-size:8px;color:#566070}
.summary-count b{font-size:13px;color:#0a49cd}

.upsell-box{
  margin-top:21px;
  border:1px solid #d8dde4;
  background:#f9fafb;
}
.upsell-head{
  height:36px;
  display:flex;
  align-items:center;
  justify-content:center;
  background:#ff9417;
  font-size:12px;
  font-weight:800;
  color:#111;
}
.upsell-body{
  height:51px;
  display:flex;
  align-items:center;
  justify-content:center;
  gap:12px;
  cursor:pointer;
}
.upsell-body input{position:absolute;opacity:0}
.upsell-check{
  width:18px;height:18px;
  border:1px solid #dfe3e8;
  border-radius:3px;
  background:#fff;
  position:relative;
}
.upsell-body input:checked + .upsell-check{
  border-color:#0a49cd;background:#0a49cd;
}
.upsell-body input:checked + .upsell-check:after{
  content:"✓";color:#fff;position:absolute;inset:0;
  display:flex;align-items:center;justify-content:center;font-size:12px;font-weight:800;
}
.upsell-body strong{font-size:11px}



.confirm-buy-btn{
  margin-top:9px;
  width:100%;
  height:47px;
  border:0;
  border-radius:8px;
  background:var(--green);
  color:#fff;
  font-size:14px;
  font-weight:800;
}
.demo-payment-note{
  margin-top:10px;
  padding:8px 10px;
  border-radius:6px;
  background:#eef2f6;
  color:#536071;
  text-align:center;
  font-size:9px;
  line-height:1.4;
}
.payment-cookie{padding-top:22px}

@media(max-width:520px){
  .payment-view{padding-top:0}
  .payment-card-shell{border-radius:0;padding-left:14px;padding-right:14px}
  .customer-summary,.payment-method-card,.order-summary-card{padding-left:18px;padding-right:18px}
}


/* CAPTCHA local funcional (não imita Cloudflare) */
.captcha-box{
  margin-top:15px;
  border:1px solid #d7dce3;
  background:#fff;
  padding:10px;
}
.captcha-main{
  min-height:42px;
  width:100%;
  display:grid;
  grid-template-columns:28px 1fr;
  align-items:center;
  gap:10px;
  border:0;
  background:transparent;
  padding:0;
  text-align:left;
  cursor:pointer;
}
.captcha-main:disabled{cursor:default}
.captcha-check{
  width:22px;height:22px;
  border:1px solid #4d5662;
  border-radius:3px;
  background:#fff;
  position:relative;
}
.captcha-check.verifying{border-color:#1f5fc4}
.captcha-check.verifying:after{
  content:"";
  position:absolute;inset:3px;
  border:2px solid #cfd8e6;
  border-top-color:#1f5fc4;
  border-radius:50%;
  animation:captcha-spin .7s linear infinite;
}
.captcha-check.verified{
  border-color:#2e7d32;
  background:#2e7d32;
}
.captcha-check.verified:after{
  content:"✓";
  position:absolute;inset:0;
  display:flex;align-items:center;justify-content:center;
  color:#fff;font-weight:900;font-size:15px;
  border:0;animation:none;
}
@keyframes captcha-spin{to{transform:rotate(360deg)}}
.captcha-copy{display:flex;flex-direction:column;gap:2px}
.captcha-copy strong{font-size:12px;font-weight:500}
.captcha-copy span{font-size:9px;color:#6b7483}

/* ===== TELA 4: PAGAMENTO PIX ===== */
.pix-card-shell{
  background:#f7f8f9;
  border-radius:8px;
  padding:20px 22px 34px;
  text-align:center;
}
.pix-card-shell .checkout-logo-wrap{margin-bottom:6px}
.pix-title{font-size:19px;margin:6px 0 6px;color:#080c12}
.pix-sub{font-size:12px;color:var(--muted);margin:0 0 16px;line-height:1.45}
.pix-amount{
  display:flex;flex-direction:column;gap:2px;align-items:center;
  margin:0 0 16px;padding:12px;border:1px solid var(--line);border-radius:9px;background:#fff;
}
.pix-amount small{font-size:10px;color:var(--muted);text-transform:uppercase;letter-spacing:.04em}
.pix-amount strong{font-size:26px;color:var(--green)}
.pix-qr-wrap{display:flex;justify-content:center;margin:0 0 16px}
.pix-qr{width:210px;height:210px;border:1px solid var(--line);border-radius:9px;background:#fff;padding:8px;object-fit:contain}
.pix-copy-label{display:block;font-size:11px;font-weight:700;color:#465164;text-align:left;margin:0 0 6px}
.pix-copy-row{display:flex;gap:8px;margin:0 0 16px}
.pix-code-input{
  flex:1;min-width:0;height:44px;border:1px solid #506078;border-radius:8px;background:#fff;
  padding:0 12px;font-size:12px;color:#2e394a;
}
.pix-copy-btn{
  min-width:88px;height:44px;border:0;border-radius:8px;background:var(--blue);color:#fff;
  font-size:13px;font-weight:800;
}
.pix-status{
  display:flex;align-items:center;justify-content:center;gap:10px;
  margin:4px 0 10px;font-size:13px;font-weight:700;color:#1f5fc4;
}
.pix-spinner{
  width:18px;height:18px;border:2px solid #cfd8e6;border-top-color:#1f5fc4;border-radius:50%;
  display:inline-block;animation:captcha-spin .7s linear infinite;
}
.pix-hint{font-size:10px;color:var(--muted);margin:0}
.pix-success-icon{
  width:64px;height:64px;margin:8px auto 12px;border-radius:50%;background:var(--green);
  color:#fff;font-size:34px;font-weight:900;display:flex;align-items:center;justify-content:center;
}
.pix-error{
  margin-top:12px;padding:10px 12px;border-radius:8px;background:#fdecec;color:#b3261e;
  font-size:12px;line-height:1.4;
}
@media(max-width:520px){
  .pix-view{padding-top:0}
  .pix-card-shell{border-radius:0;padding-left:16px;padding-right:16px}
}
