/* Abertura imersiva: fachada ampliada, texto estável e interior em detalhe. */
.hero-immersive { isolation: isolate; display: grid; align-items: center; min-height: max(800px, 100svh); padding: 126px 0 64px; }
.hero-facade-scene { position: absolute; inset: 0; z-index: -3; }
.hero-facade-scene img { width: 100%; height: 100%; object-fit: cover; object-position: right top; }
.hero-facade-shade { position: absolute; inset: 0; z-index: -2; pointer-events: none; background: linear-gradient(90deg, #000 0%, #000f 12%, #000e 27%, #000a 39%, #0003 52%, #0000 69%), linear-gradient(180deg, #000c 0%, #0000 23%, #0000 78%, #000c 100%); }
.hero-immersive .hero-inner { display: block; width: min(100% - 2 * var(--gutter), var(--max)); padding: 0; opacity: 1; transform: none; }
.hero-immersive .hero-project-copy { width: min(42vw, 580px); }
.hero-immersive .hero-project-title { font-size: clamp(32px, 3.7vw, 58px); margin: 24px 0; }
.hero-immersive .hero-project-description { max-width: 29em; font-size: clamp(15px, 1.15vw, 17px); }
.hero-immersive .hero-ctas { display: flex; flex-wrap: wrap; align-items: center; gap: 18px 24px; margin-top: 26px; }
.hero-immersive .hero-ctas .btn { min-height: 60px; padding-inline: 24px; font-size: 10px; letter-spacing: .15em; }
.hero-immersive .hero-model-link { font-size: 12px; gap: 14px; }
.hero-interior-preview { margin-top: 34px; display: flex; align-items: center; gap: 20px; width: fit-content; max-width: 100%; color: var(--off); }
.hero-interior-preview > img { width: clamp(140px, 13vw, 180px); height: auto; aspect-ratio: 1672 / 941; border: 1px solid #cfcdc966; }
.hero-interior-label { display: grid; gap: 9px; font-family: var(--font-serif); font-style: italic; font-size: clamp(17px, 1.4vw, 21px); line-height: 1.15; }
.hero-interior-number, .hero-interior-open { font-family: var(--font-body); font-style: normal; font-size: 9px; letter-spacing: .15em; text-transform: uppercase; line-height: 1.5; }
.hero-interior-open { font-size: 9px; letter-spacing: .06em; text-transform: none; display: flex; gap: 12px; align-items: center; }
.hero-interior-open > span { font-size: 16px; transition: transform .25s; }
.hero-interior-preview:hover .hero-interior-open > span { transform: translate(2px, -2px); }
.hero-project-signature { position: absolute; right: var(--gutter); bottom: 30px; color: var(--off); font-size: 9px; letter-spacing: .17em; text-transform: uppercase; }
.hero-project-signature > span { margin-inline: 16px; }
.header:not(.is-solid) { background: #000; }
.project-viewer { width: min(1200px, calc(100vw - 48px)); max-width: none; max-height: calc(100svh - 48px); padding: 56px 20px 20px; border: 1px solid #cfcdc94d; background: #000; color: #f7f7f7; overflow-y: auto; }
.project-viewer::backdrop { background: #000e; }
.project-viewer img { display: block; width: 100%; height: auto; max-height: calc(100svh - 178px); object-fit: contain; }
.project-viewer figcaption { display: flex; justify-content: space-between; gap: 20px; padding-top: 14px; font-size: 12px; }
.project-viewer figcaption > span { font-size: 10px; text-transform: uppercase; letter-spacing: .12em; }
.project-viewer-close { position: absolute; top: 12px; right: 20px; display: flex; gap: 16px; align-items: center; min-height: 32px; color: #f7f7f7; font-size: 12px; }
.project-viewer-close > span { font-size: 25px; }
html:has(.project-viewer[open]) { overflow: hidden; }
@media (max-width: 1099px) and (min-width: 900px) {
  .hero-immersive .hero-project-copy { width: 45vw; }
  .hero-immersive .hero-ctas { gap: 16px; }
  .hero-immersive .hero-ctas .btn { padding-inline: 18px; font-size: 9px; }
  .hero-facade-shade { background: linear-gradient(90deg,#000 0%,#000e 24%,#000a 39%,#0002 62%,#0000 85%),linear-gradient(180deg,#000c,#0000 28%,#0000 72%,#000d); }
}
@media (max-width: 899px) {
  .hero-immersive { display: block; min-height: 0; padding-top: calc(76px + 52vw); padding-bottom: 48px; }
  .hero-facade-scene { top: 76px; bottom: auto; aspect-ratio: 1672 / 941; }
  .hero-facade-scene img { object-fit: contain; }
  .hero-facade-shade { inset: 76px 0 auto; height: 57vw; background: linear-gradient(180deg,#0000 60%,#0006 82%,#000 100%); }
  .hero-immersive .hero-project-copy { width: 100%; }
  .hero-immersive .hero-project-title { font-size: clamp(30px, 6.4vw, 52px); }
  .hero-immersive .hero-project-description { max-width: 38em; }
  .hero-immersive .hero-ctas { display: flex; width: 100%; gap: 20px 24px; }
  .hero-immersive .hero-ctas .btn { width: auto; }
  .hero-interior-preview { margin-top: 32px; }
  .hero-interior-preview > img { width: clamp(142px, 30vw, 220px); }
  .hero-interior-label { font-size: 20px; }
  .hero-project-signature { position: static; display: block; margin: 36px var(--gutter) 0; font-size: 8px; letter-spacing: .08em; }
  .hero-project-signature > span { margin-inline: 9px; }
}
@media (max-width: 480px) {
  .hero-immersive .hero-ctas { display: grid; gap: 20px; }
  .hero-immersive .hero-ctas .btn { width: 100%; font-size: 10px; min-height: 62px; }
  .hero-immersive .hero-model-link { justify-self: start; }
  .hero-interior-preview { gap: 16px; }
  .hero-interior-preview > img { width: 44%; }
  .hero-interior-label { font-size: 18px; }
  .hero-interior-number { font-size: 8px; }
  .project-viewer { width: calc(100vw - 24px); padding: 54px 12px 16px; }
  .project-viewer figcaption { flex-direction: column; gap: 7px; }
}
@media (prefers-reduced-motion: reduce) { .hero-interior-open > span { transition: none; } }