/* ==========================================================================
   ELAS CORRETORAS — Skin exclusivo: AFONSO 1095
   Camada visual aplicada SOBRE tokens.css + base.css + property.css.
   Não redefine a marca (grafite/marfim/terracota seguem os mesmos em
   header, footer, botões de conversão) — só empresta a paleta do próprio
   apartamento (pedra travertino, latão escovado) para a atmosfera da
   página, ecoando os materiais reais do imóvel decorado.
   Escopo: tudo dentro de body.property-af1095.
   ========================================================================== */

.property-af1095 {
  --af-stone: #EDE4D3;
  --af-stone-deep: #DCCFB4;
  --af-brass: #A98B5C;
  --af-brass-deep: #8C7048;
  --af-ink: #2B281F;
}

/* Fundo com textura sutil de travertino nas seções claras da página */
.property-af1095 .section:not(.section--dark) {
  background:
    repeating-linear-gradient(100deg, rgba(169,139,92,0.05) 0px, rgba(169,139,92,0.05) 1px, transparent 1px, transparent 68px),
    linear-gradient(180deg, var(--af-stone) 0%, var(--marfim) 340px);
}

/* Lockup do nome do empreendimento no hero — eco da fachada ripada */
.property-af1095 .property-hero__copy h1 {
  position: relative;
  padding-left: 22px;
}
.property-af1095 .property-hero__copy h1::before {
  content: "";
  position: absolute;
  left: 0; top: 0.1em; bottom: 0.1em;
  width: 3px;
  background: repeating-linear-gradient(180deg, var(--af-brass) 0 6px, transparent 6px 11px);
}

.property-af1095 .eyebrow { color: var(--af-brass); }
.property-af1095 .eyebrow::after { background: var(--af-brass); }

/* Especificações e diferenciais em tom latão, mantendo os CTAs no padrão ELAS */
.property-af1095 .property-hero__panel-item .icon,
.property-af1095 .property-specs-bar__item .icon,
.property-af1095 .diferencial-item .icon,
.property-af1095 .location-point .icon {
  color: var(--af-brass);
}
.property-af1095 .property-hero__price strong { color: var(--af-brass); }
.property-af1095 .property-subnav__list a:hover,
.property-af1095 .property-subnav__list a.is-active { color: var(--af-ink); border-color: var(--af-brass); }

.property-af1095 .diferencial-item {
  border-color: rgba(169,139,92,0.28);
  background: linear-gradient(180deg, #FFFFFF, #FBF7EF);
}

.property-af1095 .property-specs-bar {
  border-color: rgba(169,139,92,0.3);
}
.property-af1095 .property-specs-bar__item { background: linear-gradient(180deg, #FFFFFF, #FBF7EF); }

/* Frase de abertura editorial — como uma legenda de projeto arquitetônico */
.property-af1095 .af-kicker {
  font-family: var(--font-display);
  font-style: italic;
  font-size: 1.3rem;
  color: var(--af-brass-deep);
  max-width: 46ch;
  margin-bottom: var(--space-4);
  line-height: 1.4;
}

/* Ficha técnica — créditos do projeto, com régua fina lembrando a fachada */
.af-credits {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: var(--space-4) var(--space-6);
  padding: var(--space-5) 0 0;
  margin-top: var(--space-5);
  border-top: 1px solid rgba(169,139,92,0.3);
}
@media (min-width: 640px) { .af-credits { grid-template-columns: repeat(4, 1fr); } }
.af-credits div small {
  display: block;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--af-brass-deep);
  margin-bottom: 4px;
}
.af-credits div strong {
  font-family: var(--font-display);
  font-size: 1.05rem;
  font-weight: 600;
  color: var(--grafite);
}

/* Alternância de planta (pavimento inferior / superior) */
.af-plans {
  display: grid;
  grid-template-columns: 1fr;
  gap: var(--space-4);
}
.af-plan-tabs {
  display: inline-flex;
  gap: 4px;
  background: var(--af-stone);
  border-radius: var(--radius-sm);
  padding: 4px;
  margin-bottom: var(--space-4);
  width: fit-content;
}
.af-plan-tabs button {
  border: none;
  background: transparent;
  padding: 10px 18px;
  font-size: 12.5px;
  font-weight: 700;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: var(--cinza-tecnico);
  border-radius: 4px;
  cursor: pointer;
  transition: background var(--dur) var(--ease), color var(--dur) var(--ease);
}
.af-plan-tabs button.is-active { background: var(--grafite); color: var(--marfim); }
.af-plan-panel { display: none; }
.af-plan-panel.is-active { display: block; }
.af-plan-panel img {
  width: 100%;
  border-radius: var(--radius-md);
  border: 1px solid rgba(169,139,92,0.3);
}
