/* ==========================================================================
   EMPREENDIMENTOS.CSS — Listagem e página de torre
   ========================================================================== */

/* ---------- Listagem ---------- */
.torres { display: grid; gap: 2px; }
.torre-card {
    position: relative; overflow: hidden; isolation: isolate;
    min-height: clamp(340px, 46vw, 540px);
    display: flex; flex-direction: column; justify-content: flex-end;
    padding: clamp(26px, 3.4vw, 56px);
}
.torre-card--volt     { --accent: var(--volt-dourado);   --accent-line: rgba(232,184,75,.30); --accent-soft: rgba(232,184,75,.12); }
.torre-card--electron { --accent: var(--electron-ciano); --accent-line: rgba(53,224,232,.30); --accent-soft: rgba(53,224,232,.11); }

.torre-card__midia { position: absolute; inset: 0; z-index: -2; }
.torre-card__midia img, .torre-card__midia video { width: 100%; height: 100%; object-fit: cover; opacity: .5; transition: transform 1.2s var(--ease), opacity var(--dur) var(--ease); }
.torre-card:hover .torre-card__midia img, .torre-card:hover .torre-card__midia video { transform: scale(1.05); opacity: .68; }
.torre-card::before {
    content: ''; position: absolute; inset: 0; z-index: -1;
    background: linear-gradient(180deg, transparent 24%, color-mix(in srgb, var(--void) 94%, transparent));
}
.torre-card__cidade {
    font-family: var(--font-mono); font-size: 11px; letter-spacing: .16em;
    text-transform: uppercase; color: var(--accent); margin-bottom: 12px;
}
.torre-card h2 { margin-bottom: 8px; }
.torre-card__tag { color: var(--text-muted); font-size: var(--fs-small); font-weight: 300; margin-bottom: 18px; }
.torre-card__specs { display: flex; flex-wrap: wrap; gap: 22px; margin-bottom: 22px; }
.torre-card__specs div { font-family: var(--font-mono); font-size: 12px; color: var(--text-muted); }
.torre-card__specs b { display: block; color: var(--text); font-size: 15px; font-weight: 400; margin-bottom: 2px; }

/* ---------- Página de torre: herói com scrub ---------- */
.torre-hero__conteudo h1 { margin-bottom: 14px; }
.torre-hero__conteudo .tag {
    font-family: var(--font-display); font-size: 11px;
    letter-spacing: var(--tracking-wide); text-transform: uppercase;
    color: var(--accent); margin-bottom: 18px;
}
.torre-hero__conteudo .sub { color: var(--text-muted); font-weight: 300; max-width: 48ch; margin-inline: auto; }

.rolar {
    position: absolute; left: 50%; bottom: 26px; z-index: 3;
    transform: translateX(-50%);
    font-family: var(--font-display); font-size: 9.5px;
    letter-spacing: .24em; text-transform: uppercase; color: var(--text-dim);
    display: grid; gap: 8px; justify-items: center;
}
.rolar::after {
    content: ''; width: 1px; height: 34px;
    background: linear-gradient(var(--accent), transparent);
    animation: desce 2.2s var(--ease) infinite;
}
@keyframes desce { 0% { opacity: 0; transform: scaleY(.3); transform-origin: top; } 45% { opacity: 1; } 100% { opacity: 0; transform: scaleY(1); transform-origin: top; } }
@media (prefers-reduced-motion: reduce) { .rolar::after { animation: none; } }

/* ---------- Conceito do nome ---------- */
.conceito { display: grid; grid-template-columns: .9fr 1.1fr; gap: clamp(32px, 5vw, 76px); align-items: center; }
@media (max-width: 900px) { .conceito { grid-template-columns: 1fr; } }
.conceito__frase {
    font-family: var(--font-display);
    font-size: clamp(20px, 2.3vw, 30px); font-weight: 200; line-height: 1.32;
}
.conceito__frase em { font-style: normal; color: var(--accent); font-weight: 400; }

/* ---------- Ambientes ---------- */
.ambientes { display: grid; grid-template-columns: repeat(3, 1fr); gap: 2px; }
@media (max-width: 900px) { .ambientes { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 560px) { .ambientes { grid-template-columns: 1fr; } }

.ambiente { position: relative; overflow: hidden; aspect-ratio: 4/3; background: var(--surface); }
.ambiente img, .ambiente video { width: 100%; height: 100%; object-fit: cover; transition: transform 1.1s var(--ease); }
.ambiente:hover img, .ambiente:hover video { transform: scale(1.06); }
.ambiente__nome {
    position: absolute; left: 0; right: 0; bottom: 0;
    padding: 16px 18px;
    background: linear-gradient(transparent, color-mix(in srgb, var(--void) 92%, transparent));
    font-family: var(--font-display); font-size: 12px;
    letter-spacing: .16em; text-transform: uppercase;
}
.ambiente__area { font-family: var(--font-mono); font-size: 10.5px; color: var(--accent); display: block; margin-top: 3px; letter-spacing: .08em; }

/* Ambiente em destaque ocupa duas colunas — quebra o ritmo do grid
   e evita a leitura de catálogo. */
.ambiente--largo { grid-column: span 2; aspect-ratio: 16/9; }
@media (max-width: 560px) { .ambiente--largo { grid-column: span 1; aspect-ratio: 4/3; } }

/* ---------- Plantas ---------- */
.plantas__figura { background: var(--surface); padding: clamp(18px, 2.4vw, 34px); display: grid; place-items: center; min-height: 380px; }
.plantas__figura img { max-height: 62vh; width: auto; object-fit: contain; }
.plantas__ficha { display: flex; flex-wrap: wrap; gap: 26px; margin-top: 18px; }
.plantas__ficha div { font-family: var(--font-mono); font-size: 12px; color: var(--text-muted); }
.plantas__ficha b { display: block; color: var(--accent); font-size: 16px; font-weight: 400; }

/* ---------- Localização ---------- */
.local { display: grid; grid-template-columns: 1.2fr .8fr; gap: clamp(28px, 4vw, 60px); align-items: start; }
@media (max-width: 900px) { .local { grid-template-columns: 1fr; } }
.entorno li {
    display: flex; justify-content: space-between; gap: 18px;
    padding: 13px 0; border-bottom: 1px solid var(--line);
    font-size: var(--fs-small); color: var(--text-muted); font-weight: 300;
}
.entorno li b { font-family: var(--font-mono); color: var(--accent); font-weight: 400; white-space: nowrap; }