:root{
--maroon-dark: #630B0B;
--maroon-darker: #3B0707;
--gold: #FCF27B;
--cream: #F6EED9;
--cream-soft: #E8DAB9;
--footer-muted: #CDAA9A;
--maroon: #630B0B;
--card-border: rgba(246,238,217,.12);
--white: #ffffff;
}

*{ box-sizing: border-box; }

html,body{ margin:0; padding:0; }

body{
font-family: Mukta, sans-serif;
font-size: 16px;
color: var(--cream-soft);
background-color: var(--maroon-darker);
background-image:
radial-gradient(1200px 600px at 80% -10%, rgba(252,242,123,.1), rgba(0,0,0,0) 60%),
radial-gradient(900px 500px at -10% 20%, rgba(99,11,11,.55), rgba(0,0,0,0) 55%),
linear-gradient(170deg, var(--maroon-dark), var(--maroon-darker) 90%);
background-attachment: fixed;
}

img{ max-width:100%; display:block; }

a{ text-decoration:none; color:inherit; }

.wrap{
max-width: 1120px;
margin: 0 auto;
padding: 0 22px;
}

/* ---------- Header ---------- */

.hero{
padding: 70px 0 40px;
text-align: center;
}

.hero .logo{
width: 300px;
margin: 0 auto 22px;
}

.selo{
display: inline-flex;
align-items: center;
gap: 8px;
color: var(--gold);
font-size: 12.5px;
font-weight: 700;
letter-spacing: 1.6px;
text-transform: uppercase;
border: 0.8px solid rgba(252,242,123,.4);
border-radius: 999px;
padding: 8px 18px;
margin-bottom: 28px;
}

.selo::before{
content: "";
width: 6px;
height: 6px;
border-radius: 50%;
background: var(--gold);
display: inline-block;
}

.hero h1{
font-family: Fraunces, serif;
font-size: 56px;
font-weight: 600;
color: var(--cream);
line-height: 1.08;
letter-spacing: -0.5px;
max-width: 780px;
margin: 0 auto 22px;
}

.hero h1 em{
color: var(--gold);
font-style: italic;
}

.hero p{
max-width: 560px;
margin: 0 auto;
color: var(--cream-soft);
font-size: 16.5px;
line-height: 1.55;
}

/* ---------- Toolbar / busca ---------- */

.toolbar{
display: grid;
grid-template-columns: 1.5fr 1fr 1fr;
gap: 12px;
background: rgba(246,238,217,.06);
border: 0.8px solid var(--card-border);
border-radius: 20px;
padding: 16px;
margin: 36px 0 18px;
}

.field label{
display: block;
color: var(--gold);
font-size: 11px;
font-weight: 700;
letter-spacing: 1.4px;
text-transform: uppercase;
margin-bottom: 8px;
}

.field input,
.field select{
width: 100%;
background: var(--cream);
color: var(--maroon-dark);
border: 1.6px solid transparent;
border-radius: 14px;
padding: 13px 16px;
font-size: 16px;
font-family: Mukta, sans-serif;
appearance: none;
}

.field select{
background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%23630B0B' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'><polyline points='6 9 12 15 18 9'></polyline></svg>");
background-repeat: no-repeat;
background-position: right 14px center;
padding-right: 36px;
cursor: pointer;
}

.field input::placeholder{ color: rgba(43,0,0,.45); }

.field input:focus,
.field select:focus{
outline: none;
box-shadow: 0 0 0 3px rgba(252,242,123,.4);
}

/* ---------- Contador ---------- */

.resultcount{
text-align: center;
color: var(--cream-soft);
font-size: 15px;
margin: 0 0 22px;
}

.resultcount b{ color: var(--cream); }

/* ---------- Grid de unidades ---------- */

.grid{
display: grid;
grid-template-columns: 1fr 1fr;
gap: 18px;
padding-bottom: 20px;
}

article{
background: linear-gradient(160deg, rgba(246,238,217,.08), rgba(246,238,217,.03));
border: 0.8px solid var(--card-border);
border-radius: 20px;
padding: 24px 24px 22px;
display: flex;
flex-direction: column;
}

article .cidade{
color: var(--gold);
font-size: 11.5px;
font-weight: 700;
letter-spacing: 1.6px;
text-transform: uppercase;
margin-bottom: 6px;
}

article h3{
font-family: Fraunces, serif;
font-size: 22px;
font-weight: 600;
color: var(--cream);
margin: 0 0 10px;
}

article .endereco{
display: flex;
align-items: flex-start;
gap: 8px;
color: var(--cream-soft);
font-size: 14.5px;
line-height: 1.4;
margin: 0 0 20px;
}

article .endereco svg{ flex-shrink: 0; margin-top: 2px; }

article .acoes{
display: flex;
gap: 10px;
margin-top: auto;
}

.btn{
flex: 1;
text-align: center;
border-radius: 999px;
padding: 13px 14px;
font-weight: 600;
font-size: 14.5px;
}

.btn-primary{
background: var(--cream);
color: var(--maroon);
}

.btn-ghost{
background: transparent;
color: var(--cream);
border: 0.8px solid rgba(246,238,217,.3);
}

.empty{
text-align: center;
color: var(--cream-soft);
padding: 40px 20px;
grid-column: 1 / -1;
}

/* ---------- Footer ---------- */

footer{
border-top: 0.8px solid rgba(246,238,217,.08);
padding: 34px 22px 50px;
color: var(--footer-muted);
font-size: 14px;
text-align: center;
}

footer b{ color: var(--cream-soft); }

/* ---------- Responsive ---------- */

@media (max-width: 780px){
.hero{ padding-top: 46px; }
.hero .logo{ width: 220px; }
.hero h1{ font-size: 36px; }
.toolbar{ grid-template-columns: 1fr; }
.grid{ grid-template-columns: 1fr; }
}