/**
 * Card de oferta — uma fonte de verdade.
 *
 * A home e a busca mantinham DOIS cards diferentes para a mesma coisa: sombras,
 * raios, tamanhos de fonte e tratamentos de preço distintos, cada um com o hover
 * escrito em onmouseover inline. É o que fazia o site parecer costurado de
 * pedaços. Agora existe um card, e as duas páginas o incluem.
 *
 * Mesma paleta da marca — nada de cor nova.
 */

.acc-card {
    display: flex;
    flex-direction: column;
    text-decoration: none;
    color: inherit;
    background: var(--surface, #fff);
    border: 1px solid var(--line-soft, #f1f5f9);
    border-radius: var(--radius-lg, 16px);
    overflow: hidden;
    box-shadow: 0 2px 8px rgba(0,0,0,.06);
    transition: transform .22s, box-shadow .22s;
}
.acc-card:hover {
    transform: translateY(-4px);
    box-shadow: 0 14px 36px rgba(0,0,0,.12);
}
.acc-card:focus-visible {
    outline: 2px solid var(--accent, #f5004d);
    outline-offset: 3px;
}

.acc-card-img {
    position: relative;
    overflow: hidden;
    height: 200px;
    background: #dde3ed;
    flex-shrink: 0;
}
.acc-card-img img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
    transition: transform .4s;
}
.acc-card:hover .acc-card-img img { transform: scale(1.04); }

.acc-card-empty {
    width: 100%; height: 100%;
    display: flex; align-items: center; justify-content: center;
    background: linear-gradient(135deg, #253b71, #1a2a55);
}
.acc-card-empty .material-symbols-outlined {
    font-size: 3rem;
    color: rgba(255,255,255,.18);
}

/* Um véu no topo, só o suficiente para o badge ler sobre foto clara. */
.acc-card-veil {
    position: absolute; inset: 0;
    background: linear-gradient(to bottom, rgba(0,0,0,.28) 0%, transparent 38%);
    pointer-events: none;
}

.acc-card-type {
    position: absolute; top: .75rem; left: .75rem;
    background: rgba(15,30,61,.82);
    backdrop-filter: blur(4px);
    color: #fff;
    font-size: .625rem; font-weight: 700;
    text-transform: uppercase; letter-spacing: .07em;
    padding: .2rem .625rem;
    border-radius: 999px;
}

.acc-card-featured {
    position: absolute; top: .75rem; right: .75rem;
    display: flex; align-items: center; gap: .2rem;
    background: var(--accent, #f5004d);
    color: #fff;
    font-size: .625rem; font-weight: 700;
    text-transform: uppercase; letter-spacing: .06em;
    padding: .2rem .5rem .2rem .375rem;
    border-radius: 999px;
}
.acc-card-featured .material-symbols-outlined {
    font-size: .8125rem;
    font-variation-settings: 'FILL' 1;
}

/* A nota fica sobre a foto: é atributo da hospedagem, não do corpo do card. */
.acc-card-rating {
    position: absolute; bottom: .75rem; right: .75rem;
    display: flex; align-items: center; gap: .25rem;
    background: rgba(255,255,255,.94);
    padding: .1875rem .5rem;
    border-radius: 8px;
}
.acc-card-rating .material-symbols-outlined {
    font-size: .8rem; color: #f59e0b;
    font-variation-settings: 'FILL' 1;
}
.acc-card-rating span:last-child {
    font-size: .75rem; font-weight: 700;
    color: var(--ink, #1e293b);
    font-variant-numeric: tabular-nums;
}

.acc-card-body {
    display: flex;
    flex-direction: column;
    flex: 1;
    padding: 1rem 1.125rem 1.125rem;
}
.acc-card-title {
    font-size: .9375rem; font-weight: 700;
    color: var(--ink, #1e293b);
    letter-spacing: -.01em; line-height: 1.35;
    margin: 0 0 .25rem;
}
.acc-card-place {
    display: flex; align-items: center; gap: .2rem;
    font-size: .8125rem;
    color: var(--muted, #64748b);
    margin: 0 0 .75rem;
}
.acc-card-place .material-symbols-outlined {
    font-size: .9375rem;
    color: var(--accent, #f5004d);
}

.acc-card-specs {
    display: flex; flex-wrap: wrap; gap: .875rem;
    font-size: .78rem;
    color: var(--faint, #94a3b8);
    padding: .625rem 0;
    margin-bottom: .75rem;
    border-top: 1px solid var(--line-soft, #f1f5f9);
}
.acc-card-spec { display: flex; align-items: center; gap: .25rem; }
.acc-card-spec .material-symbols-outlined { font-size: .9375rem; }

.acc-card-foot {
    display: flex; align-items: flex-end; justify-content: space-between;
    gap: .75rem;
    margin-top: auto;
}

/* O preço era "R$ 2.640,00" seguido de um "/noite" cinza, menor e fora da
   baseline — lia como erro de digitação, e a barra não é informação. A unidade
   ganha uma linha própria; tabular-nums alinha os preços entre os cards. */
.acc-card-price {
    display: block;
    font-size: 1.1875rem; font-weight: 800;
    color: var(--accent, #f5004d);
    letter-spacing: -.02em; line-height: 1.15;
    font-variant-numeric: tabular-nums;
}
.acc-card-unit {
    display: block;
    font-size: .75rem;
    color: var(--faint, #94a3b8);
    margin-top: .125rem;
}

.acc-card-tag {
    flex-shrink: 0;
    font-size: .6875rem; font-weight: 700;
    color: var(--muted, #64748b);
    background: var(--line-soft, #f1f5f9);
    border-radius: 6px;
    padding: .25rem .5rem;
}

@media (prefers-reduced-motion: reduce) {
    .acc-card,
    .acc-card-img img { transition: none; }
    .acc-card:hover { transform: none; }
    .acc-card:hover .acc-card-img img { transform: none; }
}