
/* Zendejas — layout unificado de fichas. Cargado solo en Casas/Edificios/Comercial/Institucional/Diseño. */
html body main.project-detail{
  padding-left:0!important;
  padding-right:0!important;
  padding-bottom:4rem!important;
}
html body main.project-detail .project-layout{
  display:flex!important;
  flex-direction:column!important;
  align-items:stretch!important;
  width:100%!important;
  max-width:none!important;
  margin:0!important;
  gap:30px!important;
  grid-template-columns:none!important;
}
html body main.project-detail .project-gallery{
  order:1!important;
  width:100%!important;
  max-width:none!important;
  min-width:0!important;
  grid-column:auto!important;
  grid-row:auto!important;
}
html body main.project-detail .project-information{
  order:2!important;
  grid-column:auto!important;
  grid-row:auto!important;
  width:min(90vw,1480px)!important;
  max-width:1480px!important;
  margin:0 auto!important;
  padding-top:28px!important;
  border-top:1px solid rgba(255,255,255,.12)!important;
}
html body main.project-detail .project-tabs,
html body main.project-detail .gallery-stage,
html body main.project-detail .gallery-bottom{
  width:min(90vw,1480px)!important;
  max-width:1480px!important;
  margin-left:auto!important;
  margin-right:auto!important;
}
html body main.project-detail .gallery-stage{
  margin-top:0!important;
  background:#000!important;
}
html body main.project-detail .gallery-image-button{
  width:100%!important;
  height:100%!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  background:#000!important;
}
html body main.project-detail .gallery-image{
  width:100%!important;
  height:100%!important;
  object-fit:contain!important;
}
html body main.project-detail .gallery-bottom{
  display:grid!important;
  grid-template-columns:minmax(0,1fr) auto!important;
  align-items:end!important;
  gap:18px!important;
  margin-top:16px!important;
}
html body main.project-detail .thumbnails{
  justify-content:flex-start!important;
  flex-wrap:wrap!important;
}
/* House cover videos remain part of their gallery behavior; no second-column layout. */
html.za-theme-light body main.project-detail .project-information{
  border-color:#ddd!important;
}
html.za-theme-light body main.project-detail .project-information>h1{
  color:#111!important;
}
@media(max-width:950px){
  html body main.project-detail{padding-left:15px!important;padding-right:15px!important;}
  html body main.project-detail .project-tabs,
  html body main.project-detail .gallery-stage,
  html body main.project-detail .gallery-bottom,
  html body main.project-detail .project-information{
    width:100%!important;
    max-width:none!important;
  }
  html body main.project-detail .project-layout{gap:26px!important;}
  html body main.project-detail .gallery-bottom{grid-template-columns:1fr!important;gap:10px!important;}
}

/* === 2026-09-21: Fotos / Planos + lightbox centrado === */
html body main.project-detail .project-cover-video{
  display:none!important; /* el video vive como primer elemento del carrusel, sin duplicarse */
}
html body main.project-detail .project-tabs{
  display:flex!important;
  align-items:flex-end!important;
  gap:26px!important;
  min-height:38px!important;
  margin-bottom:12px!important;
}
html body main.project-detail .project-tabs [role="tablist"],
html body main.project-detail .za-project-tabs-list{
  display:flex!important;
  align-items:center!important;
  gap:26px!important;
  background:transparent!important;
  padding:0!important;
  height:auto!important;
}
html body main.project-detail .project-tabs button{
  appearance:none!important;
  background:transparent!important;
  border:0!important;
  border-radius:0!important;
  box-shadow:none!important;
  color:rgba(255,255,255,.58)!important;
  font:inherit!important;
  font-size:12px!important;
  letter-spacing:.08em!important;
  line-height:1.2!important;
  padding:0 0 8px!important;
  position:relative!important;
  cursor:pointer!important;
  text-transform:uppercase!important;
}
html body main.project-detail .project-tabs button::after{
  content:""!important;
  position:absolute!important;
  left:0!important;
  right:0!important;
  bottom:0!important;
  height:1px!important;
  background:transparent!important;
}
html body main.project-detail .project-tabs button.za-tab-active,
html body main.project-detail .project-tabs button[aria-selected="true"]{
  color:#fff!important;
}
html body main.project-detail .project-tabs button.za-tab-active::after,
html body main.project-detail .project-tabs button[aria-selected="true"]::after{
  background:#fff!important;
}
html.za-theme-light body main.project-detail .project-tabs button{color:rgba(0,0,0,.52)!important;}
html.za-theme-light body main.project-detail .project-tabs button.za-tab-active,
html.za-theme-light body main.project-detail .project-tabs button[aria-selected="true"]{color:#111!important;}
html.za-theme-light body main.project-detail .project-tabs button.za-tab-active::after,
html.za-theme-light body main.project-detail .project-tabs button[aria-selected="true"]::after{background:#111!important;}

/* Zoom modal limpio: nunca se sale del viewport. */
html.za-lightbox-open{overflow:hidden!important;}
.za-project-lightbox{
  position:fixed;
  inset:0;
  z-index:2147483000;
  display:flex;
  align-items:center;
  justify-content:center;
  background:rgba(0,0,0,.94);
  opacity:0;
  visibility:hidden;
  pointer-events:none;
  transition:opacity .22s ease,visibility .22s ease;
  padding:32px 76px;
}
.za-project-lightbox.is-open{opacity:1;visibility:visible;pointer-events:auto;}
.za-project-lightbox .za-lightbox-media{
  width:min(92vw,1600px);
  height:min(88vh,1000px);
  display:flex;
  align-items:center;
  justify-content:center;
}
.za-project-lightbox .za-lightbox-media img{
  display:block;
  max-width:100%;
  max-height:100%;
  width:auto;
  height:auto;
  object-fit:contain;
  margin:auto;
  box-shadow:0 14px 60px rgba(0,0,0,.32);
}
.za-lightbox-close,.za-lightbox-nav{
  position:fixed;
  z-index:2;
  appearance:none;
  border:0;
  background:rgba(20,20,20,.72);
  color:#fff;
  cursor:pointer;
  display:grid;
  place-items:center;
  backdrop-filter:blur(8px);
}
.za-lightbox-close{top:22px;right:26px;width:44px;height:44px;border-radius:50%;font-size:28px;font-weight:200;}
.za-lightbox-nav{top:50%;transform:translateY(-50%);width:48px;height:64px;font-size:38px;font-weight:200;}
.za-lightbox-nav.prev{left:18px}.za-lightbox-nav.next{right:18px}
.za-lightbox-count{position:fixed;left:50%;bottom:22px;transform:translateX(-50%);font-size:11px;letter-spacing:.12em;color:rgba(255,255,255,.65);}
@media(max-width:700px){
  .za-project-lightbox{padding:56px 16px 52px;}
  .za-project-lightbox .za-lightbox-media{width:100%;height:calc(100vh - 108px);}
  .za-lightbox-close{top:12px;right:12px;width:40px;height:40px;}
  .za-lightbox-nav{width:38px;height:54px;font-size:30px;background:rgba(0,0,0,.56);}
  .za-lightbox-nav.prev{left:4px}.za-lightbox-nav.next{right:4px}
}

/* Información debajo de la galería, con la misma lectura que Casa. */
html body main.project-detail .project-information{
  display:grid!important;
  grid-template-columns:repeat(2,minmax(0,1fr))!important;
  gap:18px 44px!important;
}
html body main.project-detail .project-information>h1{grid-column:1/-1!important;}
html body main.project-detail .project-information .project-contact{grid-column:1!important;}
html body main.project-detail .project-information .back-link{grid-column:2!important;align-self:center!important;}
@media(max-width:760px){
  html body main.project-detail .project-information{grid-template-columns:1fr!important;gap:14px!important;}
  html body main.project-detail .project-information .project-contact,
  html body main.project-detail .project-information .back-link{grid-column:1!important;}
}
