/* Base comum das páginas de schaffa.com.br (entrada, Arrais, Mestre). Padrão PSCPP, paleta Noite. */
:root {
  --fundo: #0e1114; --elevado: #1d2227;
  --estudio-1: #0b0e11; --estudio-2: #1d2227; --estudio-3: #333a40;
  --texto: #f1eee6; --texto-forte: #f6f3ec; --texto-sec: #c6c9cb; --texto-terc: #a6abae;
  --destaque: #e9c98b; --alerta: #e8705e;
  --linha: rgba(241,238,230,0.10); --controle: rgba(241,238,230,0.40);
  --papel: #eef2f3; --papel-texto: #213b4c; --papel-forte: #152a38; --papel-sec: #3f5362; --papel-destaque: #7c5610; --papel-alerta: #a8392a; --papel-linha: rgba(33,59,76,0.14);
  --f-titulo: "Barlow Condensed", "Arial Narrow", "Roboto Condensed", sans-serif;
  --f-texto: "Barlow", "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
  --margem: clamp(20px, 5vw, 64px); --largura: 1320px;
  color-scheme: dark;
}
* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } *, *::before, *::after { transition: none !important; animation: none !important; } }
body { margin: 0; background: var(--fundo); color: var(--texto); font: 400 17px/1.6 var(--f-texto); -webkit-font-smoothing: antialiased; overflow-x: hidden; }
img { max-width: 100%; height: auto; display: block; }
a { color: inherit; }
p { margin: 0; }
h1, h2, h3 { margin: 0; font-family: var(--f-titulo); font-weight: 700; text-transform: uppercase; color: var(--texto-forte); line-height: 1; text-wrap: balance; }
.envelope { max-width: var(--largura); margin-inline: auto; padding-inline: var(--margem); }
.sobre { font: 600 13px/1.4 var(--f-texto); letter-spacing: .28em; text-transform: uppercase; color: var(--destaque); }
.sobre .sep { color: var(--texto-terc); margin-inline: .5em; letter-spacing: 0; }
.tnum { font-variant-numeric: tabular-nums; }
:focus-visible { outline: 2px solid var(--destaque); outline-offset: 3px; }
.sombra { filter: drop-shadow(0 24px 22px rgba(0,0,0,.55)); }

.botao {
  display: inline-flex; align-items: center; justify-content: center; gap: 12px; min-height: 52px; padding: 0 22px;
  font: 600 17px/1 var(--f-titulo); letter-spacing: .16em; text-transform: uppercase; text-decoration: none;
  background: var(--destaque); color: var(--estudio-1); border: 0; border-radius: 3px; cursor: pointer; transition: background .2s;
}
.botao:hover { background: var(--texto-forte); }
.botao:disabled { opacity: .6; cursor: progress; }
.botao svg { width: 18px; height: 18px; }
.botao.secundario { background: transparent; color: var(--texto-forte); border: 1.5px solid var(--controle); }
.botao.secundario:hover { border-color: var(--destaque); background: transparent; }

/* Trilha no topo */
.trilha { padding-block: clamp(20px, 3vw, 32px) 0; }
.trilha a { text-decoration: none; color: var(--texto-sec); }
.trilha b { color: var(--destaque); font-weight: 600; }

/* Etiqueta de museu (papel claro) */
.etiqueta { background: var(--papel); color: var(--papel-texto); border-radius: 2px; padding: 22px 26px 24px; box-shadow: 0 18px 40px -18px rgba(0,0,0,.6); display: grid; gap: 10px; }
.etiqueta .num { font: 600 12px/1.3 var(--f-texto); letter-spacing: .24em; text-transform: uppercase; color: var(--papel-destaque); display: flex; flex-wrap: wrap; justify-content: space-between; gap: 4px 12px; }
.etiqueta h3 { font-size: clamp(28px, 2.6vw, 36px); color: var(--papel-forte); }
.etiqueta p { font-size: 16.5px; line-height: 1.55; }

/* Formulário (lista ou aviso de lançamento) */
.inscricao { display: grid; gap: 10px; }
.inscricao label { font: 600 12px/1.2 var(--f-texto); letter-spacing: .26em; text-transform: uppercase; color: var(--texto-terc); }
.inscricao .linha { display: flex; flex-wrap: wrap; gap: 12px; }
.inscricao input[type=email] { flex: 1 1 240px; min-width: 0; min-height: 52px; padding: 0 2px; background: transparent; border: 0; border-radius: 0; border-bottom: 1.5px solid var(--controle); color: var(--texto-forte); font: 500 20px/1 var(--f-texto); }
.inscricao input[type=email]::placeholder { color: var(--texto-terc); }
.inscricao input[type=email]:focus { outline: none; border-bottom-color: var(--destaque); }
.armadilha { position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden; }
.aviso { font-size: 15px; min-height: 1.5em; color: var(--texto-sec); }
.aviso.ok { color: var(--destaque); }
.aviso.erro { color: var(--alerta); }
.nota { font-size: 13px; color: var(--texto-terc); }

/* Bloco de rascunho (só no esqueleto; some quando o conteúdo entrar) */
.rascunho { border: 1.5px dashed var(--controle); border-radius: 4px; padding: 18px 20px; color: var(--texto-sec); font-size: 15px; }
.rascunho b { color: var(--destaque); font-weight: 600; }

.rodape { border-top: 1px solid var(--linha); }
.rodape .envelope { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 12px 40px; padding-block: 36px 52px; font-size: 14px; color: var(--texto-terc); }
.rodape b { font: 700 18px/1 var(--f-titulo); letter-spacing: .2em; color: var(--texto-sec); }
.rodape nav { display: flex; flex-wrap: wrap; gap: 8px 24px; }
.rodape a { color: var(--texto-sec); text-underline-offset: 3px; }

/* Escala única de espaçamento e grade de 12 colunas (Pedro: tudo alinhado, pouco vazio). */
:root { --s1: 8px; --s2: 16px; --s3: 24px; --s4: 32px; --s5: 48px; --s6: 64px; --secao: clamp(40px, 5vw, 64px); --botao-texto: var(--estudio-1); }
.botao { color: var(--botao-texto); }
.grade { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); column-gap: var(--s4); row-gap: var(--s3); }
.col-4 { grid-column: span 4; } .col-5 { grid-column: span 5; } .col-6 { grid-column: span 6; } .col-7 { grid-column: span 7; } .col-8 { grid-column: span 8; } .col-12 { grid-column: 1 / -1; }
@media (max-width: 900px) { .grade > [class*="col-"] { grid-column: 1 / -1; } }
.titulo-secao h2 { font-size: clamp(32px, 3.6vw, 52px); line-height: .95; margin-top: var(--s1); }
.titulo-secao .fonte-sec { margin-top: var(--s2); font-size: 14px; color: var(--texto-terc); }