:root{
  --orange:#ef9200;
  --orange-dark:#d67f00;
  --navy:#102b5b;
  --text:#172033;
  --muted:#6f7785;
  --line:#e1e6ec;
  --green:#168342;
  --bg:#f4f7fa;
  --shadow:0 12px 34px rgba(15,43,91,.09);
  --shadow-soft:0 7px 20px rgba(15,43,91,.07);
}

*{box-sizing:border-box}
html,body{margin:0;min-height:100%;max-width:100%;overflow-x:hidden}
body{
  color:var(--text);
  background:
    radial-gradient(circle at 15% 4%,rgba(255,165,0,.065),transparent 25%),
    radial-gradient(circle at 88% 8%,rgba(43,112,204,.05),transparent 24%),
    linear-gradient(#fbfcfd,#f3f6f9);
  font-family:Inter,system-ui,-apple-system,"Segoe UI",Arial,sans-serif;
  font-size:16px;
  line-height:1.5;
}
a{color:#c77700;text-decoration:none}
a:hover{text-decoration:underline}
img,picture,video,embed{max-width:100%}
img{vertical-align:middle}

.assinatura-container{
  width:min(1160px,calc(100% - 32px));
  margin:0 auto;
}
.assinatura-topo{
  padding:22px 0 12px;
}
.assinatura-logo{
  display:block;
  width:min(350px,82vw);
  margin:0 auto;
}
.assinatura-logo img{
  display:block;
  width:100%;
  height:auto;
}
.assinatura-main{padding-bottom:24px}

.assinatura-card{
  background:#fff;
  border:1px solid rgba(20,40,65,.07);
  border-radius:20px;
  box-shadow:var(--shadow);
  overflow:hidden;
  margin:12px auto 22px;
}
.assinatura-card-venda{padding-bottom:24px}
.assinatura-card-status{padding-bottom:20px}

.assinatura-section-head{
  padding:8px 20px;
  background:linear-gradient(135deg,#ffad19,var(--orange));
  color:#fff;
  text-align:center;
}
.assinatura-section-head h1,
.assinatura-section-head h2{
  margin:0;
  font-size:25px;
  line-height:1.2;
}
.assinatura-section-head p{
  margin:6px 0 0;
  opacity:.95;
  font-size:15px;
}
.assinatura-section-head-hero{
  padding:8px 20px;
}

.recursos-card{
  padding:14px 24px 4px;
}
.listaRecurso{
  width:min(850px,100%);
  margin:0 auto 12px;
  text-align:center;
}
.listaRecurso > div{
  margin:7px 0!important;
}
.listaRecurso h3{
  color:var(--navy);
  font-size:22px;
}
.listaRecurso img{
  max-height:31px;
  width:auto;
}

.recurso-item{
  display:grid;
  grid-template-columns:34px minmax(0,1fr);
  align-items:center;
  column-gap:9px;
  width:max-content;
  max-width:100%;
  margin-left:auto!important;
  margin-right:auto!important;
  text-align:left;
}
.recurso-item img{
  display:block;
  justify-self:center;
  margin:0;
}
.recurso-texto{
  min-width:0;
}
.recurso-destaque{
  color:#d47f00;
}
.video-intro{
  text-align:center;
  color:var(--muted);
  margin:12px 0 7px;
}
.video-responsive{
  position:relative;
  width:min(600px,100%);
  aspect-ratio:16/9;
  margin:0 auto 20px;
  overflow:hidden;
  border-radius:14px;
  background:#000;
  box-shadow:var(--shadow-soft);
}
.video-responsive iframe{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  border:0;
}

.form-assinatura{
  width:min(980px,calc(100% - 36px));
  margin:24px auto 0;
}
.campo-form{
  width:min(560px,100%);
  margin:0 auto 9px;
}
.campo-form label{
  display:block;
  margin-bottom:4px;
  color:var(--navy);
}
.campo-form input{
  width:100%;
}
.campo-form em{
  display:block;
  margin-top:3px;
  color:var(--muted);
  font-size:13px;
}

input[type="text"],
input[type="email"],
textarea,
select{
  min-height:42px;
  max-width:100%;
  padding:8px 10px;
  border:1px solid #cbd4df;
  border-radius:9px;
  background:#fff;
  color:var(--text);
  font:inherit;
}
textarea{min-height:100px}
input:focus,textarea:focus,select:focus{
  outline:none;
  border-color:#89a2c7;
  box-shadow:0 0 0 3px rgba(16,43,91,.08);
}

.selecao-bloco{
  margin-top:22px;
}
.titulo-bloco{
  text-align:center;
  margin-bottom:14px;
}
.titulo-bloco h2{
  margin:0;
  color:var(--navy);
  font-size:25px;
}
.titulo-bloco p{
  margin:5px 0 0;
  color:var(--muted);
}

.planos-grid{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:14px;
}
.botaoPlano{
  background:#fff;
  padding:18px;
  border:1px solid var(--line);
  border-radius:16px;
  cursor:pointer;
  line-height:1.5;
  box-shadow:var(--shadow-soft);
  transition:transform .15s ease,border-color .15s ease,box-shadow .15s ease,background .15s ease;
}
.botaoPlano:hover{
  transform:translateY(-2px);
  border-color:#bdc8d6;
  background:#fff;
}
.plano-card{
  position:relative;
  min-height:160px;
}
.plano-recomendado::before{
  content:"MAIS VANTAJOSO";
  position:absolute;
  top:0;
  right:0;
  padding:5px 9px;
  border-radius:0 15px 0 10px;
  background:var(--orange);
  color:#fff;
  font-size:10px;
  font-weight:900;
  letter-spacing:.04em;
}
.botaoPlano.selecionado{
  border:2px solid var(--orange);
  background:#fff8ea;
  box-shadow:0 10px 28px rgba(239,146,0,.15);
}
.botaoPlano strong em{
  color:var(--navy);
  font-size:17px;
}
.verde{color:var(--green)}

.pagamentos-grid{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:14px;
  align-items:stretch;
}
.pagamento-card{
  min-height:180px;
}
.pagamento-card img{
  max-width:110px;
  height:auto;
}

.termos-check{
  width:min(720px,100%);
  margin:24px auto 16px;
  padding:13px 15px;
  border-radius:12px;
  background:#f7f8fa;
  border:1px solid #e4e8ed;
  text-align:center;
}
.finalizar-wrap{
  text-align:center;
  margin:0 0 10px;
}
.btn-finalizar,
input[type="submit"],
input[type="button"]{
  border:0;
  border-radius:10px;
  padding:11px 18px;
  font:800 15px Inter,system-ui,-apple-system,"Segoe UI",Arial,sans-serif;
  cursor:pointer;
}
.btn-finalizar{
  min-width:230px;
  min-height:48px;
  background:linear-gradient(135deg,#ffad19,var(--orange));
  color:#fff;
  font-size:17px;
  box-shadow:0 7px 18px rgba(239,146,0,.2);
}
.btn-finalizar:hover{filter:brightness(.98)}

.caixa{
  background:#fff;
  border:1px solid var(--line);
  border-radius:14px;
  box-shadow:var(--shadow-soft);
  padding:14px;
  margin-bottom:14px;
}

.ontop{
  z-index:9999;
  width:100%;
  min-height:100%;
  inset:0;
  display:none;
  position:fixed;
  overflow:auto;
  background:rgba(20,28,40,.58);
  backdrop-filter:blur(3px);
  line-height:1.55;
  padding:20px;
}
.textoTermos{
  width:min(900px,100%);
  margin:0 auto 30px;
  background:#fff;
  border-radius:20px;
  box-shadow:0 26px 80px rgba(0,0,0,.25);
  padding:24px;
}
.textoTermos h2{
  margin-top:0;
  color:var(--navy);
}
.termos-alerta{
  margin:10px 0 18px;
  padding:14px;
  border-radius:12px;
  background:#fff0f1;
  border:1px solid #f3c3c8;
}

#pixCopiaCola{width:min(760px,80%)!important}
#comoAcessar{
  display:none;
  padding:12px!important;
  border-radius:12px;
  background:#f7f8fa;
}

.assinatura-footer-links{
  width:100%;
  border-top:1px solid #e5e9ee;
  background:#fff;
}
.assinatura-footer-inner{
  width:min(1160px,calc(100% - 32px));
  margin:0 auto;
  padding:17px 0 9px;
}
.assinatura-footer-inner nav{
  display:flex;
  flex-wrap:wrap;
  justify-content:center;
  gap:8px 18px;
}
.assinatura-footer-inner a{
  color:#34435b;
  font-size:14px;
}
.assinatura-copy{
  background:#fff;
  text-align:center;
  padding:7px 16px 18px;
  color:#8a929d;
  font-size:12px;
}

/* Resultado/etapa de pagamento */
.assinatura-card-status > p,
.assinatura-card-status > div:not(.assinatura-section-head),
.assinatura-card-status > form{
  margin-left:22px;
  margin-right:22px;
}
.assinatura-card-status table{
  width:min(760px,100%);
  margin:0 auto;
  border-collapse:collapse;
}
.assinatura-card-status td{
  padding:8px;
  vertical-align:middle;
}

/* Compatibilidade com conteúdo antigo */
table{max-width:100%}
td{vertical-align:top}

/* MOBILE */
@media(max-width:700px){
  .assinatura-container{width:calc(100% - 24px)}
  .assinatura-topo{padding:15px 0 9px}
  .assinatura-logo{width:min(300px,82vw)}
  .assinatura-card{border-radius:16px}
  .assinatura-section-head{padding:11px 14px}
  .assinatura-section-head h1,
  .assinatura-section-head h2{font-size:23px}
  .recursos-card{padding:12px 14px 2px}
  .listaRecurso{
    text-align:left;
    width:100%;
  }
  .listaRecurso > div{
    margin:9px 0!important;
  }
  .listaRecurso > div:first-child{
    display:block;
    text-align:center;
  }
  .recurso-item{
    width:100%;
    grid-template-columns:48px minmax(0,1fr);
    column-gap:10px;
    align-items:start;
  }
  .recurso-item img{
    max-width:40px;
    max-height:36px;
    margin-top:1px;
  }
  .recurso-texto{
    line-height:1.42;
  }
  .video-responsive{
    border-radius:10px;
    margin-bottom:16px;
  }
  .form-assinatura{
    width:calc(100% - 24px);
    margin-top:20px;
  }
  .planos-grid,
  .pagamentos-grid{
    grid-template-columns:1fr;
  }
  .plano-card,
  .pagamento-card{
    min-height:0;
  }
  .botaoPlano{
    padding:16px;
  }
  .titulo-bloco h2{font-size:23px}
  .termos-check{text-align:left}
  .btn-finalizar{width:100%}
  .textoTermos{
    padding:18px 15px;
    border-radius:16px;
  }
  .ontop{
    padding:12px;
  }
  #pixCopiaCola{width:100%!important}
  .assinatura-card-status > p,
  .assinatura-card-status > div:not(.assinatura-section-head),
  .assinatura-card-status > form{
    margin-left:14px;
    margin-right:14px;
  }
}


/* =========================================================
   CARDS DE PLANO E PAGAMENTO — mesmo padrão aprovado no renove.php
   ========================================================= */
.botaoPlano.caixa{
  background:#fff !important;
  border:1.5px solid #b8c3d2 !important;
  box-shadow:0 5px 15px rgba(15,43,91,.075) !important;
}

.botaoPlano.caixa:hover{
  transform:translateY(-2px);
  background:#f8fafc !important;
  border-color:#91a1b6 !important;
  box-shadow:0 8px 20px rgba(15,43,91,.11) !important;
}

.botaoPlano.caixa.selecionado{
  background:#fff8ea !important;
  border:2px solid var(--orange) !important;
  box-shadow:0 10px 28px rgba(239,146,0,.20) !important;
}

@media(max-width:700px){
  .botaoPlano.caixa{
    background:#fff !important;
    border:1.5px solid #b8c3d2 !important;
    box-shadow:0 5px 15px rgba(15,43,91,.075) !important;
  }

  .botaoPlano.caixa.selecionado{
    border:2px solid var(--orange) !important;
  }
}
