/* Galeno Academy — site institucional.
   Layout: coluna única de 1120px; seções alternam branco e névoa; o arco (topo em semicírculo) é a única forma de assinatura. */
@font-face { font-family: "Plus Jakarta Sans"; src: url("../fonts/pjs-500.woff2") format("woff2"); font-weight: 500; font-display: swap; }
@font-face { font-family: "Plus Jakarta Sans"; src: url("../fonts/pjs-600.woff2") format("woff2"); font-weight: 600; font-display: swap; }
@font-face { font-family: "Plus Jakarta Sans"; src: url("../fonts/pjs-700.woff2") format("woff2"); font-weight: 700; font-display: swap; }
@font-face { font-family: "Plus Jakarta Sans"; src: url("../fonts/pjs-800.woff2") format("woff2"); font-weight: 800; font-display: swap; }

:root {
  --vinho: #6B1D35; --deep: #3E0F1F; --ouro: #B8862F; --ouro-claro: #D9AE5F; --ouro-texto: #8A621F;
  --nevoa: #F6F4F5; --linha: #ECE7E9; --tinta: #1F1A1C; --cinza: #6B6266; --rosa: #F3E8EC; --branco: #FFFFFF; --texto-escuro: #E9DCE0;
  --f: "Plus Jakarta Sans", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  --r-sm: 8px; --r-md: 12px; --r-lg: 24px; --pill: 999px;
  --max: 1120px;
  color-scheme: light;
}
*, *::before, *::after { box-sizing: border-box; }
html { scroll-behavior: smooth; }
@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } * { transition: none !important; } }
body { margin: 0; background: var(--branco); color: var(--tinta); font-family: var(--f); font-weight: 500; font-size: 17px; line-height: 1.6; -webkit-font-smoothing: antialiased; }
img { max-width: 100%; display: block; }
a { color: var(--vinho); }
a:focus-visible, button:focus-visible { outline: 3px solid var(--ouro-claro); outline-offset: 3px; border-radius: 6px; }
h1, h2, h3 { margin: 0; font-weight: 800; letter-spacing: -0.02em; line-height: 1.08; text-wrap: balance; color: var(--tinta); }
h1 { font-size: clamp(2.3rem, 5vw, 3.9rem); }
h2 { font-size: clamp(1.8rem, 3.4vw, 2.6rem); }
h3 { font-size: 1.25rem; line-height: 1.25; }
p { margin: 0; }
.wrap { max-width: var(--max); margin: 0 auto; padding-left: max(20px, env(safe-area-inset-left, 0px)); padding-right: max(20px, env(safe-area-inset-right, 0px)); }
.eyebrow { font-size: .8rem; font-weight: 700; letter-spacing: .16em; text-transform: uppercase; color: var(--ouro-texto); }
.lead { font-size: 1.15rem; color: var(--cinza); max-width: 60ch; }
.stack { display: flex; flex-direction: column; gap: 16px; }

/* Botões: pílula. Vinho = navegar/entrar; ouro claro = comprar/inscrever */
.btn { display: inline-flex; align-items: center; justify-content: center; gap: 8px; min-height: 48px; padding: 0 24px; border-radius: var(--pill); font: 700 1rem/1 var(--f); text-decoration: none; border: 2px solid transparent; transition: background .15s, color .15s, border-color .15s; }
.btn-primario { background: var(--vinho); color: var(--branco); }
.btn-primario:hover { background: var(--deep); }
.btn-compra { background: var(--ouro-claro); color: var(--deep); }
.btn-compra:hover { background: #CF9E48; }
.btn-linha { border-color: var(--vinho); color: var(--vinho); background: transparent; }
.btn-linha:hover { background: var(--rosa); }
.btn-claro { border-color: rgba(255,255,255,.55); color: var(--branco); }
.btn-claro:hover { background: var(--branco); color: var(--deep); }
.acoes { display: flex; flex-wrap: wrap; gap: 12px; }

/* Cabeçalho */
.topo { position: sticky; top: env(safe-area-inset-top, 0px); z-index: 20; background: rgba(255,255,255,.94); backdrop-filter: saturate(1.4) blur(8px); border-bottom: 1px solid var(--linha); }
body::before { content: ""; position: fixed; inset: 0 0 auto; height: env(safe-area-inset-top, 0px); z-index: 30; background: var(--branco); }
.topo .wrap { display: flex; align-items: center; justify-content: space-between; gap: 16px; min-height: 72px; }
.topo .marca img { height: 40px; width: auto; }
.nav { display: flex; align-items: center; gap: 28px; }
.nav a { color: var(--tinta); font-weight: 600; text-decoration: none; font-size: .97rem; }
.nav a:hover, .nav a[aria-current="page"] { color: var(--vinho); box-shadow: inset 0 -2px 0 var(--ouro); }
.nav .btn { min-height: 42px; padding: 0 20px; box-shadow: none; color: var(--branco); }
.nav .btn:hover { color: var(--branco); box-shadow: none; }
.topo .menu-movel { display: none; gap: 20px; overflow-x: auto; padding-block: 0 12px; min-height: 0; justify-content: flex-start; }
@media (max-width: 760px) { .nav a:not(.btn) { display: none; } .topo .marca img { height: 34px; } .topo .menu-movel { display: flex; } }
.menu-movel a { color: var(--tinta); font-weight: 600; text-decoration: none; white-space: nowrap; font-size: .95rem; }

/* Seções */
.secao { padding-block: clamp(56px, 8vw, 104px); }
.secao.nevoa { background: var(--nevoa); }
.secao.escura { background: var(--deep); color: var(--texto-escuro); }
.secao.escura h2, .secao.escura h3 { color: var(--branco); }
.secao.escura .eyebrow { color: var(--ouro-claro); }
.cabeca { display: flex; flex-direction: column; gap: 14px; margin-bottom: 40px; max-width: 760px; }
.cabeca-linha { display: flex; justify-content: space-between; align-items: flex-end; gap: 24px; flex-wrap: wrap; margin-bottom: 40px; }
.cabeca-linha .cabeca { margin-bottom: 0; }

/* Hero */
.hero { padding-block: clamp(48px, 7vw, 96px); }
.hero .wrap { display: grid; grid-template-columns: 1.15fr .85fr; gap: clamp(32px, 5vw, 72px); align-items: center; }
.hero-texto { display: flex; flex-direction: column; gap: 22px; min-width: 0; }
.hero h1 em { font-style: normal; color: var(--vinho); }
.portal { position: relative; aspect-ratio: 4 / 5; max-width: 100%; background: var(--deep); border-radius: 999px 999px var(--r-lg) var(--r-lg); overflow: hidden; display: flex; align-items: flex-end; justify-content: center; }
.portal img.simbolo { width: 62%; height: auto; margin-bottom: -2px; }
.portal-cartao { position: absolute; left: -28px; bottom: -24px; width: min(300px, 86%); background: var(--branco); border-radius: var(--r-lg); padding: 20px 22px; box-shadow: 0 18px 40px rgba(62,15,31,.22); display: flex; flex-direction: column; gap: 6px; text-decoration: none; color: var(--tinta); }
.portal-cartao .eyebrow { font-size: .72rem; }
.portal-cartao strong { font-size: 1.05rem; line-height: 1.3; }
.portal-cartao span { color: var(--cinza); font-size: .92rem; }
.portal-wrap { position: relative; padding-left: 28px; }
@media (max-width: 860px) {
  .hero .wrap { grid-template-columns: 1fr; }
  .portal-wrap { max-width: 320px; width: 100%; margin: 0 auto; padding-left: 0; }
  .portal { aspect-ratio: 4 / 4.2; }
  .portal-cartao { position: relative; left: auto; bottom: auto; margin: -36px auto 0; }
}

/* Pilares */
.pilares { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 20px; }
.pilar { background: var(--nevoa); border-radius: var(--r-lg); padding: 28px; display: flex; flex-direction: column; gap: 10px; }
.pilar p { color: var(--cinza); }
.pilar .eyebrow { color: var(--ouro-texto); }
.pilar.destaque { background: var(--vinho); }
.pilar.destaque h3 { color: var(--branco); } .pilar.destaque p { color: var(--texto-escuro); } .pilar.destaque .eyebrow { color: var(--ouro-claro); }
@media (max-width: 760px) { .pilares { grid-template-columns: 1fr; } }

/* Cursos */
.cursos { display: grid; grid-template-columns: 1.4fr 1fr; gap: 24px; }
.curso { background: var(--branco); border: 1px solid var(--linha); border-radius: 220px 220px var(--r-lg) var(--r-lg); overflow: hidden; display: flex; flex-direction: column; }
.curso-capa { aspect-ratio: 16 / 9; object-fit: cover; width: 100%; height: auto; }
.curso-corpo { padding: 28px; display: flex; flex-direction: column; gap: 14px; flex: 1; }
.chips { display: flex; flex-wrap: wrap; gap: 8px; }
.chip { display: inline-flex; align-items: center; min-height: 30px; padding: 0 14px; border-radius: var(--pill); background: var(--rosa); color: var(--vinho); font-size: .85rem; font-weight: 600; }
.chip.ouro { background: #F7EEDC; color: var(--ouro-texto); }
.curso .data { color: var(--ouro-texto); font-weight: 700; }
.curso .chamada { color: var(--cinza); }
.curso .rodape-curso { margin-top: auto; display: flex; align-items: center; justify-content: space-between; gap: 16px; flex-wrap: wrap; padding-top: 8px; }
.preco { font-weight: 800; font-size: 1.35rem; color: var(--tinta); }
.preco small { display: block; font-size: .8rem; font-weight: 600; color: var(--cinza); }
.em-breve { display: flex; flex-direction: column; gap: 16px; }
.em-breve .item { border: 1px dashed #D9C9CF; border-radius: var(--r-lg); padding: 24px; display: flex; flex-direction: column; gap: 8px; flex: 1; }
.em-breve .item p { color: var(--cinza); }
@media (max-width: 860px) { .cursos { grid-template-columns: 1fr; } }

/* Plataforma */
.recursos { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 20px; }
.recurso { display: flex; flex-direction: column; gap: 10px; padding: 26px; border-radius: var(--r-lg); background: rgba(255,255,255,.06); border: 1px solid rgba(255,255,255,.12); }
.secao:not(.escura) .recurso { background: var(--branco); border-color: var(--linha); }
.recurso svg { width: 36px; height: 36px; }
.recurso p { font-size: .97rem; }
.secao:not(.escura) .recurso p { color: var(--cinza); }
@media (max-width: 960px) { .recursos { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 520px) { .recursos { grid-template-columns: 1fr; } }

/* Passos (sequência real) */
.passos { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 20px; counter-reset: p; }
.passos li { counter-increment: p; display: flex; flex-direction: column; gap: 8px; padding-top: 20px; border-top: 2px solid var(--linha); }
.passos li::before { content: counter(p, decimal-leading-zero); font-weight: 800; color: var(--ouro); font-size: .95rem; letter-spacing: .04em; }
.passos p { color: var(--cinza); font-size: .97rem; }
.secao.escura .passos li { border-top-color: rgba(255,255,255,.18); } .secao.escura .passos p { color: var(--texto-escuro); } .secao.escura .passos li::before { color: var(--ouro-claro); }
@media (max-width: 860px) { .passos { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 520px) { .passos { grid-template-columns: 1fr; } }

/* Duas colunas */
.duas { display: grid; grid-template-columns: 1fr 1fr; gap: clamp(32px, 5vw, 72px); align-items: start; }
.duas > * { min-width: 0; }
@media (max-width: 860px) { .duas { grid-template-columns: 1fr; } }
.texto { display: flex; flex-direction: column; gap: 18px; max-width: 62ch; }
.texto p { color: var(--cinza); }
.texto p strong { color: var(--tinta); }

/* Princípios */
.principios { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 20px; }
.principio { border-left: 3px solid var(--ouro); padding: 4px 0 4px 20px; display: flex; flex-direction: column; gap: 6px; }
.principio p { color: var(--cinza); }
@media (max-width: 640px) { .principios { grid-template-columns: 1fr; } }

/* Linha do tempo */
.tempo { list-style: none; padding: 0; margin: 0; display: flex; flex-direction: column; }
.tempo li { display: grid; grid-template-columns: 120px 1fr; gap: 20px; padding: 20px 0; border-top: 1px solid var(--linha); }
.tempo li:last-child { border-bottom: 1px solid var(--linha); }
.tempo .ano { font-weight: 800; color: var(--vinho); font-variant-numeric: tabular-nums; }
.tempo p { color: var(--cinza); }
@media (max-width: 520px) { .tempo li { grid-template-columns: 1fr; gap: 4px; } }

/* Arco com símbolo (Sobre) */
.arco-figura { background: var(--deep); border-radius: 999px 999px var(--r-lg) var(--r-lg); aspect-ratio: 1 / 1.05; display: flex; align-items: center; justify-content: center; max-width: 440px; width: 100%; }
.arco-figura img { width: 58%; }

/* Certificado (ilustração) */
.certificado { background: var(--branco); color: var(--tinta); border-radius: var(--r-lg); padding: 32px; display: flex; flex-direction: column; gap: 14px; box-shadow: 0 24px 60px rgba(0,0,0,.28); border-top: 6px solid var(--ouro); }
.certificado .topo-cert { display: flex; justify-content: space-between; align-items: center; gap: 12px; }
.certificado .topo-cert img { height: 30px; width: auto; }
.certificado .nome { font-size: 1.6rem; font-weight: 800; letter-spacing: -0.02em; }
.certificado .meta { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; padding-top: 14px; border-top: 1px solid var(--linha); }
.certificado .meta span { display: block; font-size: .75rem; color: var(--cinza); font-weight: 600; text-transform: uppercase; letter-spacing: .08em; }
.certificado .meta strong { font-size: .95rem; font-variant-numeric: tabular-nums; }
.certificado .exemplo { font-size: .78rem; color: var(--cinza); }

/* Página do curso */
.curso-hero { background: var(--deep); color: var(--texto-escuro); padding-block: clamp(48px, 7vw, 88px); }
.curso-hero .wrap { display: grid; grid-template-columns: 1.2fr .8fr; gap: clamp(28px, 5vw, 64px); align-items: center; }
.curso-hero h1 { color: var(--branco); }
.curso-hero .eyebrow { color: var(--ouro-claro); }
.curso-hero .chip { background: rgba(255,255,255,.1); color: var(--branco); }
.curso-portal { background: var(--vinho); max-width: 380px; width: 100%; justify-self: end; aspect-ratio: 4 / 4.6; }
@media (max-width: 860px) { .curso-hero .wrap { grid-template-columns: 1fr; } .curso-portal { justify-self: center; max-width: 300px; } }
.ficha { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 0; border: 1px solid var(--linha); border-radius: var(--r-lg); background: var(--branco); margin-top: -36px; position: relative; }
.ficha div { padding: 20px 24px; display: flex; flex-direction: column; gap: 2px; }
.ficha div + div { border-left: 1px solid var(--linha); }
.ficha span { font-size: .78rem; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; color: var(--cinza); }
.ficha strong { font-size: 1.02rem; }
@media (max-width: 760px) { .ficha { grid-template-columns: 1fr 1fr; } .ficha div:nth-child(3) { border-left: 0; } .ficha div:nth-child(n+3) { border-top: 1px solid var(--linha); } }
.lista-check { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 14px; }
.lista-check li { display: grid; grid-template-columns: 28px 1fr; gap: 12px; align-items: start; }
.lista-check li::before { content: ""; width: 22px; height: 22px; margin-top: 3px; border-radius: 50%; background: var(--rosa) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M6 12.5l4 4 8-9' fill='none' stroke='%236B1D35' stroke-width='2.6' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center / 14px no-repeat; }
.lista-num { margin: 0; padding: 0; list-style: none; counter-reset: n; display: flex; flex-direction: column; }
.lista-num li { counter-increment: n; display: grid; grid-template-columns: 48px 1fr; gap: 12px; padding: 16px 0; border-top: 1px solid var(--linha); }
.lista-num li::before { content: counter(n, decimal-leading-zero); font-weight: 800; color: var(--ouro); }
.professor { display: grid; grid-template-columns: 120px 1fr; gap: 24px; align-items: center; background: var(--nevoa); border-radius: var(--r-lg); padding: 28px; }
.professor .foto { width: 120px; height: 140px; border-radius: 999px 999px var(--r-md) var(--r-md); background: var(--linha); display: flex; align-items: center; justify-content: center; color: var(--cinza); font-size: .8rem; text-align: center; padding: 8px; }
@media (max-width: 520px) { .professor { grid-template-columns: 1fr; } }
.compra { background: var(--branco); border: 1px solid var(--linha); border-radius: var(--r-lg); padding: 32px; display: flex; flex-direction: column; gap: 16px; position: sticky; top: 96px; }
.compra .valor { font-size: 2.4rem; font-weight: 800; letter-spacing: -0.02em; color: var(--tinta); line-height: 1; }
.compra .nota { color: var(--cinza); font-size: .92rem; }
.compra .btn { width: 100%; }
.compra .miuda { font-size: .82rem; color: var(--cinza); }
.grade-curso { display: grid; grid-template-columns: 1fr 380px; gap: clamp(32px, 5vw, 64px); align-items: start; }
.grade-curso > * { min-width: 0; }
@media (max-width: 960px) { .grade-curso { grid-template-columns: 1fr; } .compra { position: static; } }

/* FAQ */
.faq { display: flex; flex-direction: column; border-top: 1px solid var(--linha); }
.faq details { border-bottom: 1px solid var(--linha); padding: 18px 0; }
.faq summary { cursor: pointer; font-weight: 700; list-style: none; display: flex; justify-content: space-between; gap: 16px; }
.faq summary::-webkit-details-marker { display: none; }
.faq summary::after { content: "+"; color: var(--vinho); font-weight: 800; font-size: 1.3rem; line-height: 1; }
.faq details[open] summary::after { content: "–"; }
.faq details p { color: var(--cinza); padding-top: 10px; max-width: 70ch; }

/* Chamada final */
.chamada-final { background: var(--deep); border-radius: var(--r-lg); padding: clamp(32px, 5vw, 56px); display: flex; justify-content: space-between; align-items: center; gap: 24px; flex-wrap: wrap; color: var(--texto-escuro); position: relative; overflow: hidden; }
.chamada-final h2 { color: var(--branco); max-width: 18ch; }
.chamada-final .stack { position: relative; z-index: 1; max-width: 560px; }
.chamada-final img.simbolo { position: absolute; right: 40px; bottom: 0; width: 200px; opacity: .12; }
.chamada-final .acoes { position: relative; z-index: 1; }

/* Rodapé */
.rodape { background: var(--nevoa); padding-block: 56px 40px; font-size: .92rem; color: var(--cinza); }
.rodape .wrap { display: grid; grid-template-columns: 1.3fr 1fr 1fr; gap: 32px; }
.rodape img { height: 40px; width: auto; align-self: flex-start; }
.rodape h3 { font-size: .8rem; letter-spacing: .14em; text-transform: uppercase; color: var(--tinta); margin-bottom: 10px; }
.rodape ul { list-style: none; padding: 0; margin: 0; display: flex; flex-direction: column; gap: 6px; }
.rodape a { color: var(--cinza); text-decoration: none; } .rodape a:hover { color: var(--vinho); }
.rodape .legal { grid-column: 1 / -1; border-top: 1px solid var(--linha); padding-top: 20px; font-size: .82rem; }
@media (max-width: 760px) { .rodape .wrap { grid-template-columns: 1fr; } }
