/* =============================================
   SITE PÚBLICO — landing page + lista de espera
   Tradução do design aprovado (Seu Manual.dc.html) pra classes reutilizáveis.
   ============================================= */
html { scroll-behavior: smooth; }

@keyframes rise { from { opacity: 0; transform: translateY(18px); } to { opacity: 1; transform: none; } }
@keyframes fade { from { opacity: 0; } to { opacity: 1; } }
@keyframes drift { 0% { transform: translate(0,0) } 50% { transform: translate(0,-14px) } 100% { transform: translate(0,0) } }

/* ---------- Header ---------- */
.pub-header {
    position: sticky; top: 0; z-index: 50; background: rgba(247,241,231,.93);
    backdrop-filter: blur(12px); border-bottom: 1px solid rgba(22,53,43,.1); padding: 13px 0;
}
.pub-header .container { display: flex; align-items: center; justify-content: space-between; gap: 18px; }
.pub-header .marca { display: flex; align-items: center; gap: 12px; }
.pub-header .marca img { width: 44px; height: 44px; border-radius: 50%; object-fit: cover; border: 1px solid rgba(185,143,62,.45); }
.pub-header .marca-nome { display: flex; flex-direction: column; line-height: 1; }
.pub-header .marca-nome .principal { font-family: var(--font-titulo); font-size: 22px; font-weight: 600; letter-spacing: .03em; color: var(--dark); }
.pub-header .marca-nome .principal em { color: var(--primary); font-style: normal; }
.pub-header .marca-nome .sub { font-size: 9px; letter-spacing: .3em; text-transform: uppercase; color: rgba(22,53,43,.5); margin-top: 5px; }
.pub-header .marca-horizontal img { width: auto; height: 62px; border-radius: 0; border: none; object-fit: contain; }
.pub-header nav { display: flex; align-items: center; gap: clamp(14px,2.5vw,30px); }
.pub-header nav .links { display: flex; gap: clamp(14px,2vw,26px); font-size: 13px; letter-spacing: .06em; text-transform: uppercase; color: var(--dark); flex-wrap: wrap; }
.pub-header .btn-membros {
    display: inline-flex; align-items: center; gap: 9px; background: var(--dark); color: var(--light);
    padding: 12px 20px; border-radius: 999px; font-size: 12px; letter-spacing: .12em; text-transform: uppercase; white-space: nowrap;
}
.pub-header .btn-membros:hover { background: var(--primary); color: var(--dark); }
.pub-header .btn-membros .bolinha { width: 6px; height: 6px; border-radius: 50%; background: var(--secondary); display: inline-block; }

/* ---------- Hero + lista de espera ---------- */
.hero { position: relative; padding: clamp(50px,6vw,96px) 0 clamp(56px,7vw,96px); overflow: hidden; }
.hero .bolha-decor {
    position: absolute; top: -140px; right: -120px; width: 520px; height: 520px; border-radius: 50%;
    background: radial-gradient(circle, rgba(185,143,62,.18), transparent 68%); animation: drift 14s ease-in-out infinite; pointer-events: none;
}
.hero-grid { position: relative; display: grid; grid-template-columns: repeat(auto-fit, minmax(330px, 1fr)); gap: clamp(34px,5vw,70px); align-items: center; }
.hero-texto { animation: rise .8s ease both; }
.selo {
    display: inline-flex; align-items: center; gap: 10px; border: 1px solid rgba(185,143,62,.5); border-radius: 999px;
    padding: 7px 16px; font-size: 11px; letter-spacing: .2em; text-transform: uppercase; color: #8d6b26; margin-bottom: 24px;
}
.selo .bolinha { width: 7px; height: 7px; border-radius: 50%; background: var(--primary); }
.hero h1 { font-size: clamp(38px,5.4vw,68px); line-height: 1.05; font-weight: 500; margin: 0 0 22px; letter-spacing: -.01em; color: var(--dark); }
.hero h1 em { color: var(--primary); font-weight: 400; font-style: normal; }
.hero-desc { font-size: clamp(16px,1.25vw,18.5px); line-height: 1.65; color: rgba(22,53,43,.74); max-width: 520px; margin: 0 0 32px; }
.hero-ctas { display: flex; flex-wrap: wrap; gap: 14px; margin-bottom: 36px; }
.hero-stats { display: flex; flex-wrap: wrap; gap: 14px 0; border-top: 1px solid rgba(22,53,43,.14); padding-top: 22px; }
.hero-stats .item { padding-right: clamp(20px,3vw,34px); margin-right: clamp(20px,3vw,34px); border-right: 1px solid rgba(22,53,43,.12); }
.hero-stats .valor { font-family: var(--font-titulo); font-size: 31px; line-height: 1; color: var(--dark); }
.hero-stats .rotulo { font-size: 10.5px; letter-spacing: .15em; text-transform: uppercase; color: rgba(22,53,43,.5); margin-top: 8px; }

.reserva-box {
    animation: rise 1s ease both; background: var(--dark); color: var(--light); border-radius: 26px;
    padding: clamp(26px,3vw,40px); box-shadow: 0 40px 80px -50px rgba(22,53,43,.7);
}
.reserva-box .rotulo { font-size: 10.5px; letter-spacing: .22em; text-transform: uppercase; color: var(--secondary); }
.reserva-box h2 { font-weight: 400; font-size: clamp(26px,2.6vw,34px); line-height: 1.15; margin: 14px 0 10px; color: var(--light); }
.reserva-box p { font-size: 14.5px; line-height: 1.6; color: rgba(247,241,231,.66); margin: 0 0 24px; }
.reserva-box .campo { margin-bottom: 14px; }
.reserva-box .campo label {
    display: flex; flex-direction: column; gap: 8px; font-size: 10.5px; letter-spacing: .16em; text-transform: uppercase; color: rgba(247,241,231,.55); font-weight: 400;
}
.reserva-box .campo input {
    background: rgba(247,241,231,.07); border: 1px solid rgba(247,241,231,.2); border-radius: 12px;
    padding: 15px 16px; color: var(--light); font-size: 15px;
}
.reserva-box .campo input::placeholder { color: rgba(247,241,231,.4); }
.reserva-box .campo input:focus { outline: none; border-color: var(--secondary); }
.reserva-box .interesses-titulo { font-size: 10.5px; letter-spacing: .16em; text-transform: uppercase; color: rgba(247,241,231,.55); margin-bottom: 9px; display: block; }
.chip {
    border-radius: 999px; padding: 9px 15px; font-size: 12px; letter-spacing: .06em; cursor: pointer;
    border: 1px solid rgba(247,241,231,.25); background: transparent; color: rgba(247,241,231,.75); transition: all .2s ease; font-family: inherit;
}
.chip.selecionado { background: var(--secondary); color: var(--dark); border-color: var(--secondary); }
.chip-checkbox { position: absolute; opacity: 0; width: 1px; height: 1px; }
.chip-checkbox:checked + .chip { background: var(--secondary); color: var(--dark); border-color: var(--secondary); }
.chip-checkbox:focus-visible + .chip { outline: 2px solid var(--secondary); outline-offset: 2px; }
.chips-wrap { display: flex; flex-wrap: wrap; gap: 8px; }
.reserva-box .btn-enviar {
    margin-top: 6px; width: 100%; background: var(--secondary); color: var(--dark); border: none; border-radius: 999px;
    padding: 18px; font-size: 12.5px; letter-spacing: .13em; text-transform: uppercase; cursor: pointer; font-weight: 600;
}
.reserva-box .btn-enviar:hover { background: var(--light); }
.reserva-box .aviso-baixo { font-size: 11.5px; color: rgba(247,241,231,.45); text-align: center; margin-top: 12px; }
.reserva-erro { font-size: 13px; color: #e8bd93; margin-bottom: 4px; }

.reserva-sucesso { animation: fade .5s ease both; border: 1px solid rgba(201,169,97,.45); border-radius: 18px; padding: 30px 26px; text-align: center; }
.reserva-sucesso .check {
    width: 48px; height: 48px; border-radius: 50%; background: var(--secondary); color: var(--dark);
    display: flex; align-items: center; justify-content: center; margin: 0 auto 16px; font-size: 22px;
}
.reserva-sucesso .titulo { font-family: var(--font-titulo); font-size: 25px; margin-bottom: 8px; color: var(--light); }
.reserva-sucesso p { font-size: 14px; line-height: 1.6; color: rgba(247,241,231,.68); margin: 0; }

/* ---------- Seção curso (5 sistemas) ---------- */
.secao-curso { background: var(--dark); color: var(--light); padding: clamp(60px,7vw,106px) 0; }
.secao-cabecalho { display: flex; flex-wrap: wrap; align-items: flex-end; justify-content: space-between; gap: 26px; margin-bottom: clamp(34px,4vw,56px); }
.secao-cabecalho .rotulo { font-size: 10.5px; letter-spacing: .22em; text-transform: uppercase; color: var(--secondary); margin-bottom: 16px; }
.secao-curso .secao-cabecalho .rotulo { color: var(--secondary); }
.secao-cabecalho h2 { font-weight: 400; font-size: clamp(32px,4.2vw,54px); line-height: 1.06; margin: 0; }
.secao-cabecalho .desc { font-size: 15.5px; line-height: 1.7; max-width: 400px; margin: 0; }
.secao-curso .secao-cabecalho .desc { color: rgba(247,241,231,.62); }

.modulos-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(205px, 1fr)); gap: 1px; background: rgba(247,241,231,.14); border-radius: 4px; overflow: hidden; }
.modulo-card { background: var(--dark); padding: 30px 24px 34px; transition: background .3s ease; }
.modulo-card:hover { background: var(--dark-2); }
.modulo-card .num { font-family: var(--font-titulo); font-size: 14px; color: var(--secondary); letter-spacing: .2em; margin-bottom: 22px; }
.modulo-card h3 { font-weight: 500; font-size: 25px; margin: 0 0 12px; color: var(--light); }
.modulo-card p { font-size: 13.5px; line-height: 1.65; color: rgba(247,241,231,.6); margin: 0; }

.faixa-cta {
    margin-top: clamp(32px,4vw,50px); display: flex; flex-wrap: wrap; gap: 16px; align-items: center; justify-content: space-between;
    border: 1px solid rgba(201,169,97,.3); border-radius: 20px; padding: 26px 30px;
}
.faixa-cta .texto { font-family: var(--font-titulo); font-size: clamp(20px,2vw,27px); max-width: 600px; color: var(--light); }
.faixa-cta .btn-faixa { background: var(--secondary); color: var(--dark); padding: 15px 28px; border-radius: 999px; font-size: 12px; letter-spacing: .13em; text-transform: uppercase; }
.faixa-cta .btn-faixa:hover { background: var(--light); }

/* ---------- Ebooks ---------- */
.secao-ebooks { padding: clamp(60px,7vw,106px) 0; }
.secao-ebooks .secao-cabecalho .rotulo { color: #8d6b26; }
.secao-ebooks .secao-cabecalho .desc { color: rgba(22,53,43,.66); }
.filtros-chips { display: flex; flex-wrap: wrap; gap: 8px; }
.chip-filtro {
    border-radius: 999px; padding: 9px 15px; font-size: 12px; letter-spacing: .06em; cursor: pointer; font-family: inherit;
    background: transparent; color: rgba(22,53,43,.7); border: 1px solid rgba(22,53,43,.22);
}
.chip-filtro.selecionado { background: var(--dark); color: var(--light); border-color: var(--dark); }

.ebooks-vitrine { display: grid; grid-template-columns: repeat(auto-fill, minmax(250px, 1fr)); gap: clamp(18px,2vw,26px); }
.ebook-card {
    background: var(--card-bg); border: 1px solid rgba(22,53,43,.1); border-radius: 20px; overflow: hidden;
    display: flex; flex-direction: column; transition: transform .3s ease, box-shadow .3s ease;
}
.ebook-card:hover { transform: translateY(-6px); box-shadow: 0 30px 50px -34px rgba(22,53,43,.45); }
.ebook-card .capa {
    aspect-ratio: 3/4; background: repeating-linear-gradient(135deg, rgba(22,53,43,.07) 0 9px, rgba(247,241,231,0) 9px 18px), var(--accent);
    display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 10px;
    border-bottom: 1px solid rgba(22,53,43,.08); position: relative; background-size: cover; background-position: center;
}
.ebook-card .capa .marca-capa { font-family: ui-monospace, Menlo, monospace; font-size: 10px; letter-spacing: .14em; text-transform: uppercase; color: rgba(22,53,43,.45); }
.ebook-card .capa .titulo-capa { font-family: var(--font-titulo); font-size: 25px; text-align: center; padding: 0 22px; line-height: 1.15; color: rgba(22,53,43,.82); }
.ebook-card .capa .categoria-tag {
    position: absolute; top: 14px; left: 14px; background: var(--dark); color: var(--light);
    font-size: 9.5px; letter-spacing: .15em; text-transform: uppercase; padding: 6px 11px; border-radius: 999px;
}
.ebook-card .corpo-ebook { padding: 22px 22px 24px; display: flex; flex-direction: column; gap: 14px; flex: 1; }
.ebook-card .resumo { font-size: 14px; line-height: 1.6; color: rgba(22,53,43,.68); margin: 0; flex: 1; }
.ebook-card .rodape { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.ebook-card .preco { font-family: var(--font-titulo); font-size: 24px; line-height: 1; color: var(--dark); }
.ebook-card .btn-comprar { border: 1px solid rgba(22,53,43,.25); border-radius: 999px; padding: 11px 19px; font-size: 11px; letter-spacing: .12em; text-transform: uppercase; color: var(--dark); }
.ebook-card .btn-comprar:hover { background: var(--dark); color: var(--light); border-color: var(--dark); }

/* ---------- Apps ---------- */
.secao-apps { padding: 0 0 clamp(60px,7vw,100px); }
.apps-box { background: var(--card-bg); border: 1px solid rgba(22,53,43,.1); border-radius: 30px; padding: clamp(30px,4vw,60px); }
.apps-box .secao-cabecalho .rotulo { color: #8d6b26; }
.apps-box .secao-cabecalho .desc { color: rgba(22,53,43,.66); }
.apps-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(235px, 1fr)); gap: clamp(16px,2vw,20px); }
.app-card {
    display: flex; flex-direction: column; gap: 13px; background: var(--light); border: 1px solid rgba(22,53,43,.09);
    border-radius: 20px; padding: 24px 22px 26px; transition: border-color .3s ease, transform .3s ease;
}
.app-card:hover { border-color: var(--primary); transform: translateY(-4px); }
.app-card .topo { display: flex; align-items: center; justify-content: space-between; gap: 10px; }
.app-card .icone-caixa { width: 32px; height: 32px; border-radius: 10px; background: var(--dark); display: inline-block; }
.app-card .status { font-size: 9.5px; letter-spacing: .14em; text-transform: uppercase; color: #8d6b26; border: 1px solid rgba(185,143,62,.4); border-radius: 999px; padding: 5px 10px; }
.app-card h3 { font-weight: 500; font-size: 23px; margin: 0; color: var(--dark); }
.app-card p { font-size: 13.5px; line-height: 1.6; color: rgba(22,53,43,.65); margin: 0; }

.konstely-destaque {
    display: grid; grid-template-columns: 1fr 260px; gap: 30px; align-items: center;
    background: var(--light); border: 1px solid rgba(22,53,43,.09); border-radius: 20px; padding: clamp(22px,3vw,32px);
}
.konstely-lista { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 13px; }
.konstely-lista li { font-size: 14px; line-height: 1.6; color: rgba(22,53,43,.72); padding-left: 22px; position: relative; }
.konstely-lista li::before { content: '✓'; position: absolute; left: 0; color: var(--primary); font-weight: 700; }
.konstely-lista li strong { color: var(--dark); }
.konstely-cta { display: flex; flex-direction: column; align-items: center; text-align: center; gap: 12px; }
.konstely-preview-link { display: block; width: 100%; border-radius: 12px; overflow: hidden; box-shadow: 0 14px 30px -14px rgba(22,53,43,.35); border: 1px solid rgba(22,53,43,.1); }
.konstely-preview-link img { display: block; width: 100%; height: auto; transition: transform .35s ease; }
.konstely-preview-link:hover img { transform: scale(1.04); }
@media (max-width: 760px) {
    .konstely-destaque { grid-template-columns: 1fr; }
}

/* ---------- Área de membros (CTA final) ---------- */
.secao-membros { background: var(--dark); color: var(--light); padding: clamp(56px,6vw,92px) 0; text-align: center; }
.secao-membros .interno { max-width: 900px; margin: 0 auto; }
.secao-membros .rotulo { font-size: 10.5px; letter-spacing: .22em; text-transform: uppercase; color: var(--secondary); margin-bottom: 18px; }
.secao-membros h2 { font-weight: 400; font-size: clamp(30px,3.8vw,48px); line-height: 1.08; margin: 0 0 16px; }
.secao-membros p { font-size: 16px; line-height: 1.7; color: rgba(247,241,231,.65); max-width: 520px; margin: 0 auto 30px; }
.secao-membros .ctas { display: flex; flex-wrap: wrap; gap: 14px; justify-content: center; }
.secao-membros .btn-entrar { background: var(--secondary); color: var(--dark); padding: 17px 34px; border-radius: 999px; font-size: 12.5px; letter-spacing: .13em; text-transform: uppercase; }
.secao-membros .btn-entrar:hover { background: var(--light); }
.secao-membros .btn-fora { border: 1px solid rgba(247,241,231,.3); color: var(--light); padding: 17px 30px; border-radius: 999px; font-size: 12.5px; letter-spacing: .13em; text-transform: uppercase; }
.secao-membros .btn-fora:hover { border-color: var(--secondary); color: var(--secondary); }

/* ---------- Rodapé ---------- */
.pub-footer { padding: 44px 0 52px; }
.pub-footer .interno {
    display: flex; flex-wrap: wrap; gap: 22px; align-items: center; justify-content: space-between;
    border-top: 1px solid rgba(22,53,43,.14); padding-top: 34px;
}
.pub-footer .marca-rodape { display: flex; align-items: center; gap: 12px; }
.pub-footer .marca-rodape img { width: 38px; height: 38px; border-radius: 50%; object-fit: cover; }
.pub-footer .marca-rodape span { font-family: var(--font-titulo); font-size: 19px; color: var(--dark); }
.pub-footer .links-rodape { display: flex; flex-wrap: wrap; gap: 22px; font-size: 12.5px; letter-spacing: .08em; text-transform: uppercase; }
.pub-footer .copy { font-size: 12px; color: rgba(22,53,43,.5); }

@media (max-width: 640px) {
    .pub-header nav .links { display: none; }
}
