/* Página pública dos ambientes do Grupo IFT. */
.espacos-hero {
  position: relative;
  overflow: hidden;
  padding: clamp(8rem, 14vw, 11rem) 0 clamp(4rem, 8vw, 6.5rem);
  border-bottom: 1px solid rgba(var(--line-rgb), .14);
  background:
    radial-gradient(700px 420px at 78% 20%, rgba(var(--gold-rgb), .12), transparent 70%),
    linear-gradient(145deg, var(--ink-deep), #121c24);
}

.espacos-hero::after {
  content: "";
  position: absolute;
  right: max(4vw, 2rem);
  bottom: -14rem;
  width: 31rem;
  aspect-ratio: 1;
  border: 1px solid rgba(var(--gold-rgb), .11);
  border-radius: 50%;
  box-shadow: 0 0 0 4rem rgba(var(--gold-rgb), .018), 0 0 0 8rem rgba(var(--gold-rgb), .012);
  pointer-events: none;
}

.espacos-hero__inner { position: relative; z-index: 1; max-width: 860px; }
.espacos-hero h1 { max-width: 18ch; margin: 1rem 0 1.2rem; font-size: clamp(2.5rem, 6vw, 5rem); letter-spacing: -.045em; text-transform: uppercase; }
.espacos-hero p { max-width: 60ch; color: var(--text-3); font-size: clamp(1rem, 2vw, 1.2rem); }

.espacos-section { min-height: 36rem; background: #111920; }
.espacos-tabs { display: flex; gap: .55rem; overflow-x: auto; padding: .2rem .1rem 1.4rem; scrollbar-width: thin; scrollbar-color: rgba(var(--gold-rgb), .35) transparent; }
.espacos-tab {
  flex: 0 0 auto;
  padding: .62rem 1.15rem;
  border: 1px solid rgba(var(--line-rgb), .22);
  border-radius: var(--r-full);
  color: var(--text-3);
  background: rgba(var(--soft-rgb), .45);
  font: 600 var(--fs-sm) var(--font-body);
  cursor: pointer;
  transition: color var(--t-fast) var(--ease), border-color var(--t-fast) var(--ease), background var(--t-fast) var(--ease);
}
.espacos-tab:hover { color: var(--paper); border-color: rgba(var(--gold-rgb), .45); }
.espacos-tab.is-active { color: var(--gold-ink); border-color: var(--gold); background: linear-gradient(135deg, var(--gold-soft), var(--gold)); }

.espaco-detalhe__head { display: grid; grid-template-columns: minmax(0, 1fr) minmax(18rem, .75fr); align-items: end; gap: 3rem; margin: 1.2rem 0 2.2rem; }
.espaco-detalhe__head h2 { margin-top: .55rem; }
.espaco-detalhe__head p { color: var(--text-3); font-size: var(--fs-lg); white-space: pre-line; }

.espaco-fotos { display: grid; grid-template-columns: repeat(12, 1fr); grid-auto-rows: 9rem; gap: .8rem; }
.espaco-foto {
  position: relative;
  grid-column: span 4;
  grid-row: span 2;
  min-height: 0;
  padding: 0;
  overflow: hidden;
  border: 1px solid rgba(var(--line-rgb), .2);
  border-radius: var(--r-sm);
  background: var(--ink-soft);
  cursor: zoom-in;
}
.espaco-foto:first-child { grid-column: span 7; grid-row: span 3; }
.espaco-foto:nth-child(2) { grid-column: span 5; }
.espaco-foto:nth-child(3) { grid-column: span 5; }
.espaco-foto img { width: 100%; height: 100%; object-fit: cover; transition: transform .6s var(--ease), filter .4s var(--ease); }
.espaco-foto::after { content: "Ampliar ↗"; position: absolute; right: .8rem; bottom: .8rem; padding: .32rem .65rem; border: 1px solid rgba(255,255,255,.18); border-radius: var(--r-full); color: #fff; background: rgba(5,9,13,.68); backdrop-filter: blur(8px); font-size: var(--fs-xs); opacity: 0; transform: translateY(5px); transition: opacity var(--t-fast) var(--ease), transform var(--t-fast) var(--ease); }
.espaco-foto:hover img { transform: scale(1.045); filter: brightness(.86); }
.espaco-foto:hover::after, .espaco-foto:focus-visible::after { opacity: 1; transform: none; }

.espaco-fotos__vazio { grid-column: 1 / -1; display: grid; place-items: center; min-height: 16rem; border: 1px dashed rgba(var(--gold-rgb), .27); border-radius: var(--r-sm); color: var(--text-5); text-align: center; background: rgba(var(--gold-rgb), .025); }

.espacos-status { display: grid; place-items: center; gap: 1.3rem; min-height: 24rem; padding: 4rem 1.5rem; border: 1px solid rgba(var(--line-rgb), .15); border-radius: var(--r-lg); color: var(--text-4); text-align: center; background: radial-gradient(circle at 50% 35%, rgba(var(--gold-rgb), .075), transparent 42%), rgba(var(--soft-rgb), .22); }
.espacos-status strong { max-width: 28rem; color: var(--text-2); font-family: var(--font-display); font-size: clamp(1.1rem, 3vw, 1.5rem); }
.espacos-status p { max-width: 38rem; }
.espacos-status__marca { display: grid; grid-template-columns: repeat(3, 3.1rem); align-items: end; gap: .45rem; height: 6rem; }
.espacos-status__marca i { display: block; height: 72%; border: 1px solid rgba(var(--gold-rgb), .34); border-radius: .5rem .5rem .15rem .15rem; background: linear-gradient(160deg, rgba(var(--gold-rgb), .12), transparent); transform: perspective(180px) rotateY(8deg); }
.espacos-status__marca i:nth-child(2) { height: 100%; border-color: rgba(var(--gold-rgb), .55); }
.espacos-status__marca i:nth-child(3) { height: 58%; }
.espacos-status--vazio strong::before { content: "Em breve: "; color: var(--gold-soft); }

.espacos-cta__inner { display: grid; justify-items: center; max-width: 760px; text-align: center; }
.espacos-cta h2 { margin: .7rem 0 1rem; }
.espacos-cta p { max-width: 55ch; margin-bottom: 1.8rem; color: var(--text-3); }

.espacos-lightbox { position: fixed; z-index: 1100; inset: 0; display: grid; grid-template-columns: auto minmax(0, 1fr) auto; place-items: center; gap: 1rem; padding: clamp(1rem, 4vw, 3rem); background: rgba(3, 7, 10, .94); backdrop-filter: blur(12px); }
.espacos-lightbox figure { display: grid; justify-items: center; gap: .8rem; max-width: min(1100px, 100%); max-height: 90vh; }
.espacos-lightbox img { max-width: 100%; max-height: 82vh; object-fit: contain; border-radius: var(--r-xs); box-shadow: var(--shadow-4); }
.espacos-lightbox figcaption { min-height: 1.5em; color: var(--text-3); text-align: center; }
.espacos-lightbox__fechar, .espacos-lightbox__nav { border: 1px solid rgba(var(--line-rgb), .35); color: var(--paper); background: rgba(var(--soft-rgb), .75); font: inherit; cursor: pointer; transition: border-color var(--t-fast) var(--ease), color var(--t-fast) var(--ease); }
.espacos-lightbox__fechar:hover, .espacos-lightbox__nav:hover { color: var(--gold-soft); border-color: var(--gold); }
.espacos-lightbox__fechar { position: absolute; top: 1rem; right: 1rem; width: 44px; height: 44px; border-radius: 50%; font-size: 1.7rem; }
.espacos-lightbox__nav { width: 48px; height: 48px; border-radius: 50%; font-size: 1.2rem; }
body.is-lightbox-open { overflow: hidden; }

@media (max-width: 760px) {
  .espaco-detalhe__head { grid-template-columns: 1fr; gap: 1rem; }
  .espaco-fotos { grid-template-columns: 1fr 1fr; grid-auto-rows: 10rem; }
  .espaco-foto, .espaco-foto:first-child, .espaco-foto:nth-child(2), .espaco-foto:nth-child(3) { grid-column: span 1; grid-row: span 1; }
  .espaco-foto:first-child { grid-column: 1 / -1; grid-row: span 2; }
  .espacos-lightbox { grid-template-columns: 1fr; }
  .espacos-lightbox__nav { position: absolute; bottom: 1.2rem; }
  .espacos-lightbox__nav--anterior { left: calc(50% - 58px); }
  .espacos-lightbox__nav--proxima { right: calc(50% - 58px); }
}

@media (max-width: 480px) {
  .espaco-fotos { grid-template-columns: 1fr; }
  .espaco-foto, .espaco-foto:first-child, .espaco-foto:nth-child(2), .espaco-foto:nth-child(3) { grid-column: 1; }
  .espaco-foto:first-child { grid-row: span 2; }
}

@media (prefers-reduced-motion: reduce) {
  .espaco-foto img, .espaco-foto::after { transition: none; }
}
