/* ==========================================================================
   ELAS CORRETORAS — Skin exclusivo: CASA DE PONTA NEGRA
   Camada visual aplicada SOBRE tokens.css + base.css + property.css.
   Motivo próprio desta página: LINHA D'ÁGUA. O maior diferencial da casa
   é a vista para o mar e o Morro do Careca de quase todos os ambientes —
   por isso o hero usa a própria paisagem aérea (praia + morro) em vez da
   fachada, e um traço fino horizontal (eco do horizonte do mar) se repete
   discreto no painel do hero, na faixa "A vista" e no topo dos cards de
   diferenciais. Nada disso se repete em nenhuma outra página de imóvel
   (curva do Therra Luna, tarja dourada do Lourdes Lamartine, listras do
   Graciliano, recorte flutuante do Afonso, corte diagonal do Amadeus,
   régua sólida do Alto da Boa Vista, prancha técnica do Hermes).
   Escopo: tudo dentro de body.property-pn.
   ========================================================================== */

.property-pn .eyebrow { color: var(--terracota); }
.property-pn .eyebrow::after { background: var(--terracota); }

/* Overlay do hero: degradê padrão — a foto aérea real da praia e do
   Morro do Careca já é forte o bastante como protagonista. */
.property-pn .property-hero-full__bg::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(100deg,
    rgba(32,33,31,0.94) 0%,
    rgba(32,33,31,0.76) 32%,
    rgba(32,33,31,0.42) 56%,
    rgba(32,33,31,0.16) 78%,
    rgba(32,33,31,0.06) 100%);
}

/* Linha d'água — traço fino horizontal, eco do horizonte do mar, que
   antecede o eyebrow em cada bloco de texto desta página. */
.pn-waterline {
  display: block;
  width: 56px;
  height: 2px;
  background: var(--terracota);
  margin-bottom: var(--space-3);
}

.property-pn .property-specs-bar__item .icon,
.property-pn .location-point .icon {
  color: var(--terracota);
}

/* Barra de specs ganha uma linha-d'água fina no topo, acima dos cards. */
.property-pn .property-specs-bar {
  position: relative;
  border-top: none;
}
.property-pn .property-specs-bar::before {
  content: "";
  position: absolute;
  top: -1px; left: 0; right: 0;
  height: 2px;
  background: var(--terracota);
  z-index: 1;
}

/* ==========================================================================
   Faixa "A vista" — elemento estrutural exclusivo desta página: o maior
   diferencial (vista para o mar e Morro do Careca) ganha uma faixa cheia
   própria entre as specs e o conteúdo, com legenda ancorada à esquerda
   sobre a foto, acima de um leve degradê inferior.
   ========================================================================== */

.pn-vista-band {
  position: relative;
  min-height: 320px;
  color: var(--marfim);
  overflow: hidden;
}
.pn-vista-band__bg { position: absolute; inset: 0; }
.pn-vista-band__bg img { width: 100%; height: 100%; object-fit: cover; object-position: center 55%; display: block; }
.pn-vista-band__bg::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(0deg, rgba(32,33,31,0.88) 0%, rgba(32,33,31,0.35) 48%, rgba(32,33,31,0.05) 100%);
}
.pn-vista-band__caption {
  position: relative;
  z-index: 1;
  max-width: 560px;
  padding: var(--space-6) var(--container-pad);
  margin-top: auto;
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  min-height: 320px;
}
.pn-vista-band__caption .eyebrow { color: var(--areia); }
.pn-vista-band__caption .eyebrow::after { background: var(--terracota); }
.pn-vista-band__caption p:not(.eyebrow) { font-size: 15px; max-width: 48ch; }

@media (min-width: 720px) {
  .pn-vista-band { min-height: 420px; }
  .pn-vista-band__caption { min-height: 420px; padding: var(--space-7) var(--container-pad); }
}

/* ==========================================================================
   Diferenciais — cada card recebe uma linha-d'água curta e centralizada
   no topo (horizonte em miniatura), em vez de selo, borda dourada,
   inversão de cor ou marca de canto usados em outras páginas.
   ========================================================================== */

.property-pn .diferenciais-grid { gap: var(--space-3); }
.property-pn .diferencial-item {
  position: relative;
  background: var(--marfim);
  border: 1px solid var(--grafite-12);
  border-radius: var(--radius-sm);
  padding-top: calc(var(--space-4) + 4px);
}
.property-pn .diferencial-item::before {
  content: "";
  position: absolute;
  top: 0;
  left: 30%;
  right: 30%;
  height: 2px;
  background: var(--terracota);
}
.property-pn .diferencial-item h3 { color: var(--grafite); }
.property-pn .diferencial-item p { color: var(--cinza-tecnico); }

/* ==========================================================================
   Galeria — fotos simples, cantos discretos, sem sobreposição gráfica.
   ========================================================================== */

.property-pn .property-gallery__item { border-radius: var(--radius-md); }
