:root {
  --brand: #0a7d3b; --brand-e: #06512a; --accent: #f5c400; --accent-e: #d9a900;
  --bg: #f7f8f4; --ink: #15201a; --muted: #5d6b63; --line: #e3e8e1; --white: #fff;
}
* { box-sizing: border-box; margin: 0; padding: 0; }
body { background: var(--bg); color: var(--ink); font-family: Inter, system-ui, sans-serif; min-height: 100dvh; }
button, input { font: inherit; }
.topo { height: 58px; display: grid; place-items: center; background: #fff; border-bottom: 1px solid var(--line); }
.marca { font-weight: 800; letter-spacing: .14em; font-size: 13px; color: var(--muted); display: flex; align-items: center; gap: 8px; }
.marca b { color: var(--brand); }
.marca i { width: 18px; height: 12px; border-radius: 2px; background: linear-gradient(90deg, var(--brand) 0 50%, var(--accent) 50% 75%, #0b2a6f 75%); }
main { max-width: 480px; margin: 0 auto; padding: 28px 18px 64px; }
h1 { font-size: 32px; line-height: 1.15; font-weight: 800; }
h2 { font-size: 22px; font-weight: 800; }
.hl { color: var(--brand); }
.tag { display: inline-block; font-size: 12px; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; color: var(--brand); background: #e8f5ed; border-radius: 999px; padding: 5px 11px; margin-bottom: 12px; }
.sub, .livros p { color: var(--muted); font-size: 16.5px; line-height: 1.45; margin: 10px 0 18px; font-weight: 500; }
.sub a { color: var(--brand); font-weight: 800; }
label { display: block; font-weight: 800; margin-bottom: 8px; }
input[type="email"] { width: 100%; border: 1.5px solid var(--line); background: #fff; border-radius: 14px; padding: 16px; font-size: 17px; }
input[type="email"]:focus { outline: 3px solid rgba(10, 125, 59, .18); border-color: var(--brand); }
.cta { display: block; width: 100%; text-align: center; font-weight: 800; letter-spacing: .04em; text-transform: uppercase; padding: 16px; border-radius: 14px; border: 0; background: var(--brand); color: #fff; margin-top: 14px; cursor: pointer; text-decoration: none; }
.cta.ouro { background: var(--accent); color: var(--brand-e); }
.cta[disabled] { opacity: .45; cursor: default; }
.arquivo { cursor: pointer; }
.erro { color: #b42318; font-weight: 700; min-height: 1.2em; margin-top: 10px; }
.cartao { position: relative; margin: 8px auto 4px; max-width: 420px; aspect-ratio: 910 / 539; background: url(/img/carteirinha-modelo.jpg?v=1) center / 100% 100% no-repeat; border-radius: 16px; overflow: hidden; box-shadow: 0 14px 34px rgba(6, 81, 42, .22); container-type: inline-size; }
.cartao-foto { position: absolute; left: 5.93%; top: 20.41%; width: 27.25%; height: 59.74%; object-fit: cover; border-radius: 10px; }
.cartao-vazio { position: absolute; left: 5.93%; top: 42%; width: 27.25%; text-align: center; color: #1a1f1c; font-size: 11px; letter-spacing: .14em; text-transform: uppercase; }
.cartao-nome { position: absolute; left: 36%; right: 5%; top: 36%; height: 20%; display: flex; align-items: center; color: #fff; font-family: "Playfair Display", Georgia, serif; font-weight: 900; font-style: normal; text-transform: uppercase; line-height: 1; font-size: clamp(16px, 5.4vw, 28px); }
.cert { margin: 18px auto 0; max-width: 420px; aspect-ratio: 297 / 210; background: url(/img/cert-modelo.jpg?v=aco3) center / 100% 100% no-repeat; position: relative; border-radius: 4px; }
.cert i { position: absolute; left: 18%; right: 18%; top: 41.2%; height: 12%; display: flex; align-items: flex-end; justify-content: center; font-family: "Playfair Display", Georgia, serif; font-style: italic; font-weight: 900; color: #0d2a6b; }
.livros { margin-top: 26px; background: #fff; border: 1px dashed var(--line); border-radius: 14px; padding: 14px; }
.link { display: block; margin: 18px auto 0; background: none; border: 0; color: var(--muted); text-decoration: underline; cursor: pointer; }
