/* Identidade Kiplesito: floresta, papel quente e pequenos acentos de cor. */
:root {
  --papel: #f6f1e6;
  --tinta: #202622;
  --suave: #5d665e;
  --linha: #d1d1c3;
  --vinho: #a13e36;
  --verde: #234638;
  --verde-profundo: #172e26;
  --amarelo: #e7ba58;
  --vermelho: #b84c43;
}
body { background: var(--papel); }
::selection { background: var(--amarelo); color: var(--verde-profundo); }
.cabecalho { background: var(--verde-profundo); color: var(--papel); border-color: #496153; }
.marca { font-family: var(--serif); font-size: 27px; font-weight: 400; }
.simbolo, .marca-ponto { color: var(--amarelo); }
nav a { position: relative; padding-block: 8px; }
nav a:hover { color: var(--amarelo); }
nav a::after { content: ''; position: absolute; left: 0; right: 0; bottom: 3px; height: 1px; background: var(--amarelo); transform: scaleX(0); transform-origin: left; transition: transform .2s; }
nav a:hover::after { transform: scaleX(1); }
.hero { background: var(--verde); color: var(--papel); padding-top: 65px; padding-bottom: 65px; }
.hero .eyebrow { color: var(--amarelo); }
.hero h1 { font-size: clamp(54px, 5.6vw, 82px); letter-spacing: -3px; }
.hero h1 em { color: var(--amarelo); }
.hero .intro, .hero .nota, .hero figcaption { color: #d4ddcf; }
.hero .nota { display: flex; align-items: center; gap: 10px; }
.hero .nota::before { content: ''; width: 22px; height: 1px; background: var(--amarelo); }
.botao { background: var(--vermelho); border-color: var(--vermelho); color: white; border-radius: 0; }
.botao:hover { background: #983e36; border-color: #983e36; }
.hero .botao:focus-visible, .cabecalho a:focus-visible { outline-color: var(--amarelo); }
.destaque { transform: rotate(1.3deg); padding: 12px 12px 0; border: 1px solid #83917b; background: #2c4e3f; }
.quadro { background: #e3e3cd; border: 1px solid #c5c8b0; aspect-ratio: 1/1.06; }
.quadro::before { content: ''; position: absolute; inset: 10%; border: 1px solid #b3b99f; border-radius: 50% 50% 0 0; }
.quadro:has(img)::before { display: none; }
.placeholder-centro { position: relative; }
.placeholder-centro .estrela { color: var(--verde); font-size: 90px; }
.placeholder-centro>span:not(.estrela) { color: var(--verde); }
.placeholder-centro small, .quadro-indice { color: #505c46; }
.canto { border-color: var(--verde); }
.destaque figcaption { padding: 13px 1px; font-size: 10px; }
.faixa { margin: 0; padding: 18px 6%; background: var(--amarelo); border: 0; color: var(--verde-profundo); }
.faixa span:nth-child(even) { color: var(--vinho); font-size: 15px; line-height: 1; }
.secao { padding-block: 80px; }
.titulo-secao .eyebrow, .sobre .eyebrow { color: var(--verde); }
h2 em { color: var(--verde); }
.filtros button { border-color: #b7c1ae; color: var(--verde); transition: background .2s, color .2s; }
.filtros button:hover { background: #e1e6d8; }
.filtros button[aria-pressed=true] { background: var(--verde); border-color: var(--verde); color: var(--papel); }
.galeria { gap: 36px 28px; }
.arte-quadro { background: #e0e4d5; border: 1px solid #c1cbb8; }
.arte:nth-child(4n+2) .arte-quadro { background: #eae0c7; border-color: #d6c9a6; }
.arte:nth-child(4n+3) .arte-quadro { background: #d9e0d8; border-color: #bdcbbd; }
.arte:nth-child(4n+4) .arte-quadro { background: #eaded4; border-color: #d6c3b7; }
.arte-quadro::before { content: ''; position: absolute; inset: 18px; border: 1px solid #79876d55; }
.arte-quadro:has(img)::before { display: none; }
.arte-numero { color: var(--verde); opacity: .8; font-size: 56px; }
.arte-em-breve { color: #56604e; }
.arte-info { padding-bottom: 13px; border-bottom: 1px solid var(--linha); }
.arte h3 { font-family: var(--serif); font-size: 22px; }
.arte-info p { font-size: 11px; }
.arte-info>span { color: var(--vinho); }
.sobre { background: var(--verde-profundo); color: var(--papel); }
.sobre .eyebrow, .sobre h2 em { color: var(--amarelo); }
.sobre-texto { color: #cbd6c9; }
.sobre .texto-grande { color: var(--papel); }
.assinatura { color: var(--amarelo); transform: rotate(-4deg); transform-origin: left; }
.interesses span { border-color: #6c8371; }
.trajetoria { border-color: #526c59; }
.disponibilidade { color: var(--verde); border-color: #adbba8; }
.disponibilidade::before { content: '○'; margin-right: 8px; color: var(--vinho); }
.precos { grid-template-columns: repeat(6, 1fr); gap: 18px; }
.preco { grid-column: span 2; position: relative; border-color: #c3cabb; padding: 26px; }
.preco:nth-child(n+4) { grid-column: span 3; }
.preco::before { content: ''; position: absolute; top: -1px; left: 26px; width: 30px; height: 3px; background: var(--verde); }
.preco:nth-child(2)::before, .preco:nth-child(5)::before { background: var(--amarelo); }
.preco:nth-child(3)::before { background: var(--vermelho); }
.preco .indice { color: var(--verde); }
.preco h3 { color: var(--verde); font-size: 28px; }
.valor { color: var(--verde); font-weight: 600; }
.termos summary { color: var(--verde); }
.termos summary span { color: var(--vinho); }
.contato { background: var(--verde); color: var(--papel); position: relative; }
.contato .eyebrow, .contato h2 em { color: var(--amarelo); }
.contato>p:not(.eyebrow) { color: #d4ddcf; }
.contato-pendente { border-color: #91a38c; color: #e0e6d8; }
.redes:empty::before { content: 'Redes sociais · em breve'; color: #d4ddcf; font-size: 11px; }
footer { background: var(--verde-profundo); color: var(--papel); }
footer p, footer>a:last-child { color: #cbd6c9; }
footer .marca>span:first-child { color: var(--amarelo); }
.skip { color: var(--tinta); }
@media(max-width:760px) {
  .cabecalho { padding-block: 19px; }
  .hero { padding-block: 42px; gap: 38px; }
  .hero h1 { font-size: clamp(44px,12vw,66px); letter-spacing: -2px; }
  .destaque { margin-inline: 3px; }
  .quadro { aspect-ratio: 1.05; }
  .secao { padding-block: 54px; }
  .arte h3 { font-size: 18px; line-height: 1.2; }
  .arte-info p { font-size: 10px; margin-top: 7px; }
  .arte-numero { font-size: 38px; }
  .precos { grid-template-columns: 1fr 1fr; gap: 14px; }
  .preco, .preco:nth-child(n+4) { grid-column: auto; padding: 20px; }
  .preco:last-child { grid-column: 1/-1; }
  .preco h3 { font-size: 25px; }
}
@media(max-width:480px) {
  .precos { grid-template-columns: 1fr; }
  .arte-quadro::before { inset: 12px; }
  .quadro-indice { font-size: 7px; letter-spacing: 1px; }
}
