:root{
  --marfim:#f7f5ef;
  --papel:#eee9df;
  --pedra:#ded5c5;
  --ink:#242823;
  --muted:#62655d;
  --linha:#d7d4ca;
  --serif:Georgia,'Times New Roman',serif;
  --sans:Arial,Helvetica,sans-serif;
  color-scheme:light
}
*{
  box-sizing:border-box
}
html{
  scroll-behavior:smooth;
  scroll-padding-top:24px
}
body{
  margin:0;
  background:var(--marfim);
  color:var(--ink);
  font-family:var(--sans);
  font-size:16px;
  line-height:1.6
}
a{
  color:inherit;
  text-underline-offset:5px
}
button{
  font:inherit;
  cursor:pointer
}
button:disabled{
  cursor:default;
  opacity:.65
}
a:focus-visible,button:focus-visible{
  outline:3px solid var(--ink);
  outline-offset:5px
}
::selection{
  background:var(--linha)
}
h1,h2,h3,p,figure,dl{
  margin:0
}
h1,h2{
  font-family:var(--serif);
  font-weight:400;
  letter-spacing:-.045em;
  line-height:1.07
}
h1{
  font-size:clamp(42px,5.15vw,72px);
  max-width:780px
}
h2{
  font-size:clamp(35px,3.6vw,48px)
}
h3{
  font-size:18px;
  font-weight:500;
  line-height:1.35
}
dd{
  margin:0
}
dt{
  font-size:12px;
  color:var(--muted)
}
.moldura{
  width:min(1280px,calc(100% - 112px));
  margin-inline:auto
}
.cabecalho{
  height:116px;
  display:flex;
  align-items:center;
  border-bottom:1px solid var(--linha);
  gap:28px
}
.marca{
  font-size:44px;
  font-weight:700;
  letter-spacing:-4px;
  line-height:1;
  text-decoration:none
}
.marca-ponto{
  color:var(--ink)
}
.assinatura{
  font-size:9px;
  line-height:1.6;
  letter-spacing:.17em;
  border-left:1px solid var(--linha);
  padding-left:25px
}
.cabecalho nav{
  margin-left:auto;
  display:flex;
  align-items:center;
  gap:32px;
  font-size:12px
}
.cabecalho nav a{
  text-decoration:none
}
.cabecalho nav a:hover,.rodape a:hover{
  color:var(--ink)
}
.nav-contato{
  border-bottom:1px solid var(--ink);
  padding-bottom:6px
}
.nav-contato span{
  margin-left:18px
}
.aviso-demo{
  display:flex;
  align-items:center;
  gap:16px;
  padding:17px 0;
  border-bottom:1px solid var(--linha);
  font-size:11px;
  color:var(--muted)
}
.selo{
  font-size:9px;
  letter-spacing:.1em;
  font-weight:600;
  padding:4px 8px;
  border:1px solid var(--linha);
  color:var(--ink);
  white-space:nowrap;
  display:inline-block;
  line-height:1.5
}
.introducao{
  display:flex;
  justify-content:space-between;
  align-items:end;
  padding:49px 0 34px;
  gap:32px
}
.sobretitulo{
  font-size:10px;
  font-weight:500;
  letter-spacing:.17em;
  line-height:1.6;
  margin-bottom:20px
}
.sobretitulo span{
  padding-inline:10px;
  color:#9b9c92
}
.local{
  margin-top:20px;
  font-size:14px;
  color:var(--muted)
}
.local span{
  padding-inline:8px
}
.referencia{
  font-size:9px;
  letter-spacing:.12em;
  color:var(--muted);
  white-space:nowrap;
  padding-bottom:5px
}
.referencia span{
  display:block;
  letter-spacing:.04em;
  font-size:11px;
  margin-top:6px;
  color:var(--ink)
}
.destaque{
  display:grid;
  grid-template-columns:minmax(0,1.65fr) minmax(310px,1fr)
}
.visual{
  position:relative;
  min-width:0;
  background:var(--pedra);
  overflow:hidden;
  display:flex
}
.visual img{
  width:100%;
  height:100%;
  min-height:450px;
  object-fit:cover;
  display:block
}
.visual figcaption{
  position:absolute;
  bottom:0;
  left:0;
  right:0;
  background:#f4eee3e8;
  padding:13px 20px;
  display:flex;
  flex-wrap:wrap;
  gap:5px 20px;
  justify-content:space-between;
  font-size:9px;
  color:#4b4c43
}
.visual figcaption span:first-child{
  letter-spacing:.12em
}
.lance{
  background:transparent;
  color:var(--ink);
  padding:42px 34px 24px;
  display:flex;
  flex-direction:column
}
.lance .sobretitulo{
  color:var(--muted);
  font-size:9px;
  margin-bottom:10px
}
.valor{
  font-family:var(--serif);
  font-size:clamp(38px,3.7vw,52px);
  letter-spacing:-.04em;
  line-height:1.1;
  white-space:nowrap
}
.referencia-valor{
  font-size:10px;
  color:var(--muted);
  margin-top:12px
}
.leilao{
  display:grid;
  grid-template-columns:1fr 1fr;
  border-block:1px solid var(--linha);
  margin-top:30px;
  padding:22px 0;
  gap:16px
}
.leilao dt{
  color:var(--muted);
  font-size:10px
}
.leilao dd{
  font-size:16px;
  margin-top:5px
}
.nota-lance{
  font-size:11px;
  color:var(--muted);
  line-height:1.75;
  margin:22px 0 28px;
  max-width:320px
}
.botao{
  border:0;
  border-radius:0;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  padding:17px 20px;
  text-decoration:none;
  font-size:12px;
  line-height:1.5;
  min-height:52px;
  text-align:left;
  font-weight:500
}
.botao span{
  font-size:19px;
  line-height:1
}
.botao-claro{
  background:transparent;
  border:1px solid #8b8d81;
  color:var(--ink);
  margin-top:auto
}
.botao-claro:hover{
  background:var(--papel)
}
.botao-escuro{
  background:transparent;
  color:var(--ink);
  border:1px solid #8b8d81;
  width:100%
}
.botao-escuro:hover{
  background:var(--papel)
}
.modo-contato{
  font-size:9px;
  color:var(--muted);
  text-align:center;
  margin-top:10px
}
.ficha{
  display:grid;
  grid-template-columns:.9fr .7fr 1.1fr 1.3fr;
  padding:31px 0;
  border-bottom:1px solid var(--linha);
  gap:16px
}
.ficha>div{
  padding:0 20px;
  border-right:1px solid var(--linha)
}
.ficha>div:first-child{
  padding-left:0
}
.ficha>div:last-child{
  border:0
}
.ficha dt{
  font-size:10px;
  margin-bottom:7px
}
.ficha dd{
  font-size:18px;
  line-height:1.5
}
.ficha small{
  display:block;
  font-size:11px;
  color:var(--muted)
}
.secao{
  padding-block:64px;
  border-bottom:1px solid var(--linha)
}
.sobre{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:80px
}
.texto{
  font-size:14px;
  line-height:1.85;
  color:#4a4f45
}
.endereco{
  margin-top:22px
}
.endereco dt{
  font-size:10px
}
.endereco dd{
  font-size:12px;
  color:var(--ink);
  margin-top:3px
}
.nota{
  font-size:11px;
  line-height:1.8;
  color:var(--muted);
  margin-top:20px
}
.link-fonte{
  display:inline-block;
  margin-top:23px;
  font-size:11px;
  color:var(--ink)
}
.link-fonte span[aria-hidden]{
  padding-left:8px
}
.fonte-nota{
  font-size:10px;
  line-height:1.7;
  color:var(--muted);
  margin-top:10px;
  max-width:400px
}
.titulo-secao{
  display:flex;
  justify-content:space-between;
  align-items:end;
  gap:30px
}
.titulo-secao>p{
  font-size:12px;
  color:var(--muted);
  padding-bottom:5px
}
.passos{
  list-style:none;
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:40px;
  padding:0;
  margin:42px 0 25px
}
.passos li{
  border-top:1px solid #aaa99d;
  padding-top:20px
}
.numero{
  font-size:11px;
  color:var(--ink);
  display:block;
  margin-bottom:18px
}
.passos h3{
  margin-bottom:12px
}
.passos p{
  font-size:12px;
  line-height:1.85;
  color:var(--muted);
  max-width:290px
}
.limite-servico{
  font-size:10px;
  color:var(--muted);
  max-width:740px
}
.contato{
  background:transparent;
  margin:52px 0 0;
  padding:48px;
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:80px;
  border:0
}
.contato h2{
  margin-bottom:20px
}
.contato>div>p:not(.sobretitulo){
  font-size:12px;
  color:var(--muted)
}
.acao-contato{
  align-self:center;
  max-width:360px;
  width:100%;
  justify-self:end
}
.acao-contato .selo{
  margin-bottom:17px
}
.acao-contato>p{
  font-size:10px!important;
  line-height:1.8;
  margin-top:15px
}
.rodape{
  display:grid;
  grid-template-columns:1fr 1.4fr auto;
  align-items:center;
  gap:30px;
  padding-block:48px
}
.rodape .marca{
  font-size:32px
}
.rodape p{
  font-size:9px;
  line-height:1.8;
  color:var(--muted);
  margin-top:10px
}
.rodape>a{
  font-size:10px
}
.pular{
  position:absolute;
  top:-100px;
  left:20px;
  background:var(--ink);
  color:white;
  padding:12px;
  z-index:20
}
.pular:focus{
  top:10px
}
.sr-only{
  position:absolute;
  width:1px;
  height:1px;
  padding:0;
  margin:-1px;
  overflow:hidden;
  clip:rect(0,0,0,0);
  white-space:nowrap;
  border:0
}
dialog{
  border:1px solid var(--linha);
  padding:40px;
  background:var(--marfim);
  color:var(--ink);
  max-width:560px;
  width:calc(100% - 32px);
  max-height:calc(100% - 32px);
  overflow:auto
}
dialog::backdrop{
  background:#171c17a8
}
dialog h2{
  font-size:34px;
  margin-bottom:20px
}
dialog>p:not(.sobretitulo){
  font-size:13px;
  line-height:1.8
}
dialog .mensagem{
  background:var(--papel);
  padding:20px;
  margin-top:22px;
  overflow-wrap:anywhere
}
dialog .botao{
  margin-top:24px;
  justify-content:center
}
.fechar{
  position:absolute;
  right:15px;
  top:12px;
  border:0;
  background:none;
  color:var(--ink);
  font-size:25px;
  min-width:44px;
  min-height:44px
}
@media(min-width:1500px){
  .lance{
    padding:46px 40px 28px
  }
  .visual img{
    min-height:490px
  }
}
@media(max-width:1050px){
  .moldura{
    width:calc(100% - 64px)
  }
  .cabecalho nav{
    gap:22px
  }
  .assinatura{
    display:none
  }
  .introducao{
    padding-top:38px
  }
  .referencia{
    display:none
  }
  .destaque{
    grid-template-columns:minmax(0,1.15fr) minmax(300px,1fr)
  }
  .lance{
    padding:30px 26px 22px
  }
  .valor{
    font-size:39px
  }
  .ficha dd{
    font-size:16px
  }
  .sobre{
    gap:45px
  }
  .contato{
    gap:40px;
    padding:36px
  }
  .rodape{
    grid-template-columns:1fr 1.5fr
  }
  .rodape>a{
    grid-column:2
  }
}
@media(max-width:720px){
  .moldura{
    width:calc(100% - 40px)
  }
  .cabecalho{
    height:82px;
    gap:20px
  }
  .marca{
    font-size:36px
  }
  .cabecalho nav{
    gap:20px;
    font-size:11px
  }
  .cabecalho nav>a:first-child,.cabecalho nav>a:nth-child(2){
    display:none
  }
  .nav-contato span{
    margin-left:10px
  }
  .aviso-demo{
    align-items:flex-start;
    gap:10px;
    padding-block:15px
  }
  .aviso-demo p{
    font-size:10px;
    line-height:1.7
  }
  .selo{
    font-size:8px;
    padding:4px 6px
  }
  .introducao{
    padding:31px 0 25px
  }
  .sobretitulo{
    font-size:9px;
    letter-spacing:.13em;
    margin-bottom:15px
  }
  h1{
    font-size:44px;
    line-height:1.08;
    max-width:500px;
    letter-spacing:-.05em
  }
  .local{
    font-size:12px;
    margin-top:16px;
    max-width:300px
  }
  .local span{
    padding-inline:3px
  }
  .destaque{
    grid-template-columns:1fr
  }
  .visual img{
    min-height:0;
    height:auto;
    aspect-ratio:1.35;
    object-fit:cover
  }
  .visual figcaption{
    font-size:8px;
    padding:10px 13px;
    gap:2px
  }
  .visual figcaption span{
    display:block
  }
  .visual figcaption span:first-child{
    font-size:7px
  }
  .lance{
    padding:30px 25px 20px
  }
  .lance .sobretitulo{
    margin-bottom:11px
  }
  .valor{
    font-size:48px
  }
  .leilao{
    margin-top:24px;
    padding-block:18px
  }
  .leilao dd{
    font-size:17px
  }
  .nota-lance{
    margin:18px 0 23px;
    max-width:none
  }
  .botao{
    font-size:12px;
    min-height:54px
  }
  .ficha{
    grid-template-columns:1fr 1fr;
    gap:22px 16px;
    padding-block:25px
  }
  .ficha>div{
    padding:0 12px 0 0;
    border:0
  }
  .ficha>div:nth-child(odd){
    border-right:1px solid var(--linha)
  }
  .ficha dt{
    font-size:9px
  }
  .ficha dd{
    font-size:16px
  }
  .ficha small{
    font-size:10px
  }
  .secao{
    padding-block:38px
  }
  .sobre{
    grid-template-columns:1fr;
    gap:24px
  }
  h2{
    font-size:37px
  }
  .texto{
    font-size:13px
  }
  .titulo-secao{
    display:block
  }
  .titulo-secao>p{
    margin-top:22px;
    font-size:12px
  }
  .passos{
    grid-template-columns:1fr;
    gap:24px;
    margin-top:30px
  }
  .passos li{
    padding-top:18px;
    display:grid;
    grid-template-columns:32px 1fr;
    column-gap:16px
  }
  .numero{
    grid-row:1/3;
    margin:0;
    padding-top:1px
  }
  .passos h3{
    font-size:17px;
    margin-bottom:8px
  }
  .passos p{
    grid-column:2;
    max-width:none
  }
  .limite-servico{
    font-size:10px
  }
  .contato{
    grid-template-columns:1fr;
    gap:30px;
    padding:30px 23px;
    margin-top:32px
  }
  .acao-contato{
    max-width:none;
    justify-self:start
  }
  .contato h2{
    font-size:39px
  }
  .rodape{
    grid-template-columns:1fr;
    gap:20px;
    padding-block:34px
  }
  .rodape>a{
    grid-column:auto;
    width:max-content;
    min-height:32px;
    padding-top:5px
  }
  .rodape p{
    font-size:10px
  }
  .rodape .marca{
    font-size:35px
  }
  .quebra-desktop{
    display:none
  }
  dialog{
    padding:42px 23px 26px
  }
  dialog h2{
    font-size:30px
  }
  .fechar{
    top:5px;
    right:5px
  }
}
@media(prefers-reduced-motion:reduce){
  html{
    scroll-behavior:auto
  }
}

/* Avaliação e lance formam a primeira leitura comercial do hero. */
.destaque {
  grid-template-columns: minmax(0, 1.35fr) minmax(340px, 1fr);
}
.visual {
  grid-column: 1;
  grid-row: 1;
}
.lance {
  grid-column: 2;
  grid-row: 1;
  padding: 32px 34px 24px;
}
.valores-financeiros {
  display: grid;
  gap: 20px;
}
.valores-financeiros dt {
  font-size: 10px;
  letter-spacing: .13em;
  color: var(--muted);
  margin-bottom: 8px;
}
.valor-avaliacao {
  font-family: var(--serif);
  font-size: 40px;
  line-height: 1.1;
  letter-spacing: -.04em;
  color: var(--ink);
  white-space: nowrap;
}
.lance .valor {
  font-size: 54px;
}
.comparacao {
  border-block: 1px solid var(--linha);
  padding-block: 14px;
  margin-top: 22px;
}
.comparacao-chamada {
  display: flex;
  align-items: center;
  gap: 12px;
}
.percentual {
  font-family: var(--serif);
  font-size: 38px;
  line-height: 1.1;
  letter-spacing: -.04em;
  color: var(--ink);
}
.comparacao-texto {
  max-width: 170px;
  font-size: 13px;
  line-height: 1.5;
  color: var(--ink);
}
.diferenca-nominal {
  font-size: 10px;
  color: var(--muted);
  margin-top: 7px;
}
.lance .leilao {
  border-top: 0;
  margin-top: 8px;
  padding-block: 14px;
}
.lance .nota-lance {
  margin: 16px 0 22px;
  max-width: none;
}
@media (max-width: 1050px) and (min-width: 721px) {
  .destaque {
    grid-template-columns: minmax(0, 1fr) minmax(320px, 1fr);
  }
  .lance {
    padding-inline: 26px;
  }
  .lance .valor {
    font-size: 46px;
  }
}
@media (max-width: 720px) {
  .destaque {
    grid-template-columns: 1fr;
  }
  .lance, .visual {
    grid-column: auto;
    grid-row: auto;
  }
  .lance {
    padding: 24px 20px 18px;
  }
  .valores-financeiros {
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    gap: 14px;
  }
  .valores-financeiros dt {
    font-size: 8px;
    letter-spacing: .07em;
    margin-bottom: 9px;
  }
  .valor-avaliacao, .lance .valor {
    font-size: clamp(25px, 7.5vw, 38px);
  }
  .comparacao {
    margin-top: 20px;
    padding-block: 12px;
  }
  .percentual {
    font-size: 36px;
  }
  .comparacao-texto {
    font-size: 12px;
  }
  .lance .nota-lance {
    font-size: 10px;
    margin: 14px 0 18px;
  }
  .lance .botao {
    margin-top: 0;
  }
}
