:root{
  --tinta:#241318;      /* fundo das faixas, cabeçalho, rodapé */
  --tinta-2:#331C22;
  --tinta-3:#472831;
  --papel:#F3EEE9;      /* papel do rótulo: fundo do conteúdo */
  --papel-2:#E6DED6;
  --branco:#FDFBF8;
  --terra:#8E2438;      /* ações e links */
  --terra-2:#AC3149;
  --ouro:#C99A3F;        /* tarja de registro e destaques sobre escuro */
  --ouro-2:#E5BA63;
  --folha:#3F4A2E;      /* blocos de atacado */
  --texto:#1E1418;
  --suave:#6A5C60;      /* secundário sobre papel */
  --suave-claro:#B3A6A9;/* secundário sobre tinta */
  --borda:#D2C6BD;
  --largura:1140px;
  --medida:66ch;
}

*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth;scroll-padding-top:88px}
body{
  margin:0;background:var(--papel);color:var(--texto);
  font-family:'Archivo',system-ui,-apple-system,'Segoe UI',sans-serif;
  font-size:17px;line-height:1.62;font-variation-settings:'wdth' 100,'wght' 400;
  -webkit-font-smoothing:antialiased;
}
img{max-width:100%;height:auto;display:block}  /* height:auto é o que deixa o aspect-ratio valer:
  os atributos width/height do <img> entram como altura fixa e travariam a foto no tamanho do arquivo */
a{color:var(--terra);text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:3px}
a:hover{color:var(--terra-2)}
:focus-visible{outline:3px solid var(--terra);outline-offset:2px;border-radius:2px}
.sobre-tinta :focus-visible,.rodape :focus-visible{outline-color:var(--ouro)}
h1,h2,h3,h4{margin:0 0 .5em;line-height:1.14;font-variation-settings:'wdth' 88,'wght' 700;
  letter-spacing:-.012em;color:var(--texto)}
h1{font-size:clamp(30px,4.4vw,46px)}
h2{font-size:clamp(23px,2.9vw,33px)}
h3{font-size:20px;line-height:1.25}
h4{font-size:16px;font-variation-settings:'wdth' 92,'wght' 700}
p{margin:0 0 1.05em;max-width:var(--medida)}
p:last-child{margin-bottom:0}
strong{font-variation-settings:'wdth' 100,'wght' 650}
ul,ol{margin:0 0 1.05em;padding-left:1.15em;max-width:var(--medida)}
li{margin-bottom:.4em}
hr{border:0;border-top:1px solid var(--borda);margin:36px 0}
.env{max-width:var(--largura);margin:0 auto;padding:0 24px}
.pular{position:absolute;left:-9999px;top:0;background:var(--ouro);color:var(--tinta);
  padding:12px 18px;z-index:200;font-variation-settings:'wght' 700}
.pular:focus{left:12px;top:12px}

/* ── wordmark ─────────────────────────────────────────────────────────────── */
.marca{display:inline-flex;align-items:baseline;gap:8px;text-decoration:none;color:inherit}
.marca:hover{color:inherit}
.marca b{font-family:'Bitter',Georgia,'Times New Roman',serif;font-weight:400;
  font-size:23px;letter-spacing:-.005em;line-height:1;color:var(--branco)}
.marca b em{font-style:normal;color:var(--ouro)}
.marca span{font-size:11px;letter-spacing:.16em;text-transform:uppercase;
  font-variation-settings:'wdth' 84,'wght' 600;color:var(--suave-claro);white-space:nowrap}

/* ── cabeçalho ────────────────────────────────────────────────────────────── */
.topo{background:var(--tinta);border-bottom:3px solid var(--ouro);position:sticky;top:0;z-index:100}
.topo .env{display:flex;align-items:center;justify-content:space-between;gap:20px;
  min-height:68px;flex-wrap:wrap}
.topo nav{display:flex;gap:26px;flex-wrap:wrap}
.topo nav a{color:var(--papel);text-decoration:none;font-size:15px;
  font-variation-settings:'wdth' 92,'wght' 550;padding:6px 0;border-bottom:2px solid transparent}
.topo nav a:hover{color:var(--ouro-2);border-bottom-color:var(--ouro)}
.topo nav a[aria-current=page]{color:var(--ouro);border-bottom-color:var(--ouro)}

/* ── capa ─────────────────────────────────────────────────────────────────── */
.capa{position:relative;background:var(--tinta);color:var(--papel);overflow:hidden;isolation:isolate}
.capa img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:-2}
.capa::after{content:"";position:absolute;inset:0;z-index:-1;
  background:linear-gradient(180deg,rgba(23,17,13,.62) 0%,rgba(23,17,13,.74) 45%,rgba(23,17,13,.94) 100%)}
.capa .env{padding-top:clamp(64px,11vw,132px);padding-bottom:clamp(34px,5vw,52px)}
.capa h1{color:var(--branco);margin-bottom:20px;max-width:16ch}
.capa h1 .nome{display:block;font-family:'Bitter',Georgia,'Times New Roman',serif;
  font-weight:400;font-size:clamp(44px,8.6vw,92px);line-height:.94;letter-spacing:-.018em;
  color:var(--branco);text-shadow:0 2px 26px rgba(0,0,0,.45)}
.capa h1 .nome em{font-style:normal;color:var(--ouro)}
.capa h1 .frase{display:block;margin-top:16px;font-size:clamp(17px,2.1vw,23px);
  font-variation-settings:'wdth' 88,'wght' 500;line-height:1.3;color:var(--papel);
  letter-spacing:0;max-width:22ch}
.capa p{color:var(--suave-claro);max-width:50ch;font-size:17.5px}
.capa .acoes{margin-top:28px}
.capa-dados{display:flex;flex-wrap:wrap;gap:0;border-top:1px solid rgba(224,160,46,.35);
  margin-top:clamp(34px,6vw,58px)}
.capa-dados div{flex:1 1 200px;padding:18px 22px 18px 0;border-right:1px solid rgba(224,160,46,.2)}
.capa-dados div:last-child{border-right:0}
.capa-dados dt{font-size:11px;letter-spacing:.15em;text-transform:uppercase;
  font-variation-settings:'wdth' 84,'wght' 600;color:var(--ouro);margin-bottom:5px}
.capa-dados dd{margin:0;font-size:16px;color:var(--papel);font-variation-settings:'wdth' 92,'wght' 500}

/* ── arte desenhada ───────────────────────────────────────────────────────── */
/* Ocupa exatamente o lugar que a foto ocuparia, para as duas conviverem no mesmo site. */
.arte{display:block;width:100%;height:auto}
.capa .arte-capa{position:absolute;inset:0;width:100%;height:100%;z-index:-2}
.etapa .arte{width:100%;aspect-ratio:4/3}
.duas .arte{width:100%;height:100%;max-height:520px;object-fit:cover}

/* ── tarja de registro: o dado oficial como selo do rótulo ───────────────── */
.tarja{background:var(--ouro);color:#2A1B08}
.tarja .env{display:flex;flex-wrap:wrap;gap:6px 30px;padding-top:11px;padding-bottom:11px;
  font-size:12.5px;letter-spacing:.055em;text-transform:uppercase;
  font-variation-settings:'wdth' 86,'wght' 600}
.tarja b{font-variation-settings:'wdth' 86,'wght' 800}

/* ── blocos ───────────────────────────────────────────────────────────────── */
.bloco{padding:clamp(52px,7vw,88px) 0}
.bloco-tinta{background:var(--tinta);color:var(--papel)}
.bloco-tinta h1,.bloco-tinta h2,.bloco-tinta h3,.bloco-tinta h4{color:var(--branco)}
.bloco-tinta p,.bloco-tinta li{color:var(--suave-claro)}
.bloco-tinta a{color:var(--ouro-2)}
.bloco-folha{background:var(--folha);color:#E6EADF}
.bloco-folha h2,.bloco-folha h3{color:#fff}
.bloco-folha p,.bloco-folha li{color:#CBD4C2}
.bloco-folha a{color:#F0E5B8}
.bloco-papel-2{background:var(--papel-2)}
.bloco+.bloco.bloco-papel-2,.bloco.bloco-papel-2+.bloco{border-top:0}

.cabeca{max-width:56ch;margin-bottom:clamp(30px,4vw,46px)}
.cabeca p{font-size:18px;color:var(--suave)}
.bloco-tinta .cabeca p,.bloco-folha .cabeca p{color:inherit}
.filete{border-top:4px solid var(--terra);width:64px;margin-bottom:22px}
.bloco-tinta .filete,.bloco-folha .filete{border-color:var(--ouro)}

/* ── botões ───────────────────────────────────────────────────────────────── */
a.btn{display:inline-block;background:var(--terra);color:var(--branco);text-decoration:none;
  padding:14px 26px;font-size:16px;font-variation-settings:'wdth' 92,'wght' 650;
  border:2px solid var(--terra);margin:0 10px 10px 0;transition:background .15s,border-color .15s}
a.btn:hover{background:var(--terra-2);border-color:var(--terra-2);color:var(--branco)}
.btn.btn-ouro{background:var(--ouro);border-color:var(--ouro);color:#2A1B08}
.btn.btn-ouro:hover{background:var(--ouro-2);border-color:var(--ouro-2);color:#2A1B08}
.btn.btn-vazio{background:transparent;color:var(--papel);border-color:rgba(237,231,218,.5)}
.btn.btn-vazio:hover{background:rgba(237,231,218,.1);border-color:var(--papel);color:var(--branco)}

/* ── catálogo: os pacotes desenhados ──────────────────────────────────────── */
.pacotes{display:grid;grid-template-columns:repeat(auto-fit,minmax(238px,1fr));gap:clamp(20px,3vw,34px)}
.pacote{display:flex;flex-direction:column}
.pacote svg{width:100%;height:auto;filter:drop-shadow(0 14px 22px rgba(23,17,13,.16))}
.pacote h3{margin:22px 0 4px}
.pacote .chamada{font-size:13px;letter-spacing:.12em;text-transform:uppercase;
  font-variation-settings:'wdth' 86,'wght' 600;color:var(--terra);margin:0 0 10px}
.bloco-tinta .pacote .chamada{color:var(--ouro)}
.pacote p{font-size:15.5px;color:var(--suave)}
.bloco-tinta .pacote p{color:var(--suave-claro)}
.pacote dl{margin:14px 0 0;font-size:14.5px;border-top:1px solid var(--borda);padding-top:12px}
.bloco-tinta .pacote dl{border-color:var(--tinta-3)}
.pacote dl div{display:flex;gap:10px;padding:3px 0}
.pacote dt{flex:0 0 84px;color:var(--suave);font-variation-settings:'wdth' 88,'wght' 600}
.bloco-tinta .pacote dt{color:var(--suave-claro)}
.pacote dd{margin:0}

/* ── etapas do processo ───────────────────────────────────────────────────── */
.etapas{display:grid;gap:clamp(24px,2.6vw,32px);grid-template-columns:repeat(auto-fit,minmax(215px,1fr))}
.etapa figure{margin:0}
.etapa img{width:100%;aspect-ratio:4/3;object-fit:cover}
.etapa .n{font-family:'Bitter',Georgia,'Times New Roman',serif;font-size:15px;color:var(--tinta);
  background:var(--ouro);width:34px;height:34px;display:flex;align-items:center;
  justify-content:center;margin:-17px 0 14px 16px;position:relative}
.etapa h3{margin-bottom:6px}
.etapa p{font-size:15.5px;color:var(--suave)}
.bloco-tinta .etapa p{color:var(--suave-claro)}

/* ── duas colunas ─────────────────────────────────────────────────────────── */
.duas{display:grid;grid-template-columns:1.05fr .95fr;gap:clamp(28px,5vw,60px);align-items:center}
.duas.topo-alinhado{align-items:start}
.duas img{width:100%;height:100%;max-height:520px;object-fit:cover}
.duas figure{margin:0}
.duas figcaption{font-size:13.5px;color:var(--suave);margin-top:10px}
.bloco-tinta .duas figcaption{color:var(--suave-claro)}

/* ── listas de dados ──────────────────────────────────────────────────────── */
.dados{width:100%;border-collapse:collapse;font-size:16px;margin:0 0 8px}
.dados th,.dados td{text-align:left;padding:13px 0;border-bottom:1px solid var(--borda);
  vertical-align:top}
.dados th{width:34%;color:var(--suave);font-variation-settings:'wdth' 90,'wght' 600;
  padding-right:18px}
.bloco-tinta .dados th,.bloco-tinta .dados td{border-color:var(--tinta-3)}
.bloco-tinta .dados th{color:var(--suave-claro)}
.dados tr:last-child th,.dados tr:last-child td{border-bottom:0}

.cartoes{display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:22px}
.cartao{border-top:3px solid var(--terra);padding-top:16px}
.bloco-tinta .cartao,.bloco-folha .cartao{border-top-color:var(--ouro)}
.cartao h3{font-size:17px;margin-bottom:6px}
.cartao p{font-size:15.5px;color:var(--suave);margin:0}
.bloco-tinta .cartao p,.bloco-folha .cartao p{color:inherit}

/* ── contato ──────────────────────────────────────────────────────────────── */
.canais{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:2px;
  background:var(--borda);border:1px solid var(--borda)}
.canais a,.canais div{background:var(--papel);padding:22px;text-decoration:none;color:var(--texto);display:block}
.canais a:hover{background:var(--branco);color:var(--terra)}
.canais dt{font-size:11px;letter-spacing:.15em;text-transform:uppercase;color:var(--suave);
  font-variation-settings:'wdth' 84,'wght' 600;margin-bottom:7px}
.canais dd{margin:0;font-size:17px;font-variation-settings:'wdth' 92,'wght' 600;word-break:break-word}

form{max-width:640px}
.campo{margin-bottom:18px}
label{display:block;font-size:14px;font-variation-settings:'wdth' 92,'wght' 600;margin-bottom:6px}
label .opc{font-variation-settings:'wdth' 92,'wght' 400;color:var(--suave)}
input,textarea{width:100%;font:inherit;font-size:16px;padding:12px 14px;background:var(--branco);
  border:1px solid var(--borda);border-radius:0;color:var(--texto)}
textarea{min-height:130px;resize:vertical}
input:focus,textarea:focus{outline:3px solid var(--terra);outline-offset:-1px;border-color:var(--terra)}
.aviso{background:var(--papel-2);border-left:4px solid var(--ouro);padding:16px 18px;
  font-size:15px;margin:24px 0}
.aviso p{max-width:none}
.erro{color:#8E1B12;font-size:15px;margin-top:12px;font-variation-settings:'wdth' 92,'wght' 600}

/* ── páginas legais ───────────────────────────────────────────────────────── */
.legal{max-width:76ch}
.legal h2{font-size:clamp(20px,2.2vw,25px);margin-top:44px}
.legal h3{font-size:17.5px;margin-top:28px}
.legal p,.legal li{max-width:none;font-size:16.5px;color:#33281F}
.legal .indice{background:var(--papel-2);padding:22px 26px;margin-bottom:36px}
.legal .indice ol{margin-bottom:0;columns:2;column-gap:34px}
.legal .indice li{margin-bottom:6px;break-inside:avoid}
.data{font-size:14.5px;color:var(--suave);margin-bottom:0}

/* ── rodapé ───────────────────────────────────────────────────────────────── */
.rodape{background:var(--tinta);color:var(--suave-claro);padding:clamp(44px,6vw,68px) 0 28px;
  font-size:15px;border-top:3px solid var(--ouro)}
.rodape h4{color:var(--branco);font-size:13px;letter-spacing:.14em;text-transform:uppercase;
  font-variation-settings:'wdth' 84,'wght' 600;margin-bottom:14px}
.rodape a{color:var(--papel);text-decoration:none}
.rodape a:hover{color:var(--ouro-2);text-decoration:underline}
.rodape ul{list-style:none;padding:0;margin:0}
.rodape li{margin-bottom:9px}
.rodape p{margin-bottom:9px;max-width:38ch}
.rodape-grade{display:grid;grid-template-columns:1.6fr 1fr 1fr 1.1fr;gap:34px}
.rodape .marca{margin-bottom:18px}
.rodape-fim{border-top:1px solid var(--tinta-3);margin-top:38px;padding-top:22px;
  font-size:13px;line-height:1.6}
.rodape-fim p{max-width:none;color:#8C7E70}

/* ── responsivo ───────────────────────────────────────────────────────────── */
@media(max-width:900px){
  .rodape-grade{grid-template-columns:1fr 1fr;gap:30px}
  .duas{grid-template-columns:1fr}
  .duas img,.duas .arte{max-height:340px}
}
@media(max-width:640px){
  body{font-size:16.5px}
  .topo .env{min-height:0;padding-top:12px;padding-bottom:12px}
  .topo nav{gap:18px;width:100%}
  .topo nav a{font-size:14px}
  .rodape-grade{grid-template-columns:1fr}
  .legal .indice ol{columns:1}
  .capa-dados div{flex-basis:100%;border-right:0;border-bottom:1px solid rgba(224,160,46,.2);padding-right:0}
  .capa-dados div:last-child{border-bottom:0}
  .btn{display:block;text-align:center;margin-right:0}
  .pacote svg{max-width:196px;margin-inline:auto}
}
@media(prefers-reduced-motion:reduce){
  *{animation-duration:.001ms!important;transition-duration:.001ms!important}
}
@media print{
  .topo,.rodape,.capa img,.capa .arte,.btn{display:none}
  body{background:#fff;color:#000;font-size:12pt}
}