/* ==============================
   SANT JORDI
   ============================== */

.santjordi-section{
  background:#fff;
}

.santjordi-content{
  font-size:16px;
  line-height:1.8;
  color:#444;
}

.santjordi-content p{
  margin-bottom:24px;
}

.santjordi-highlight{
  border-left-color:#d92128 !important;
  background:rgba(217,33,40,.06) !important;
}

.santjordi-box{
  margin-top:28px;
  padding:26px;
  border-radius:16px;
  background:#fafafa;
  box-shadow:0 10px 30px rgba(0,0,0,.06);
}

.santjordi-box h4{
  color:#d92128;
  font-weight:800;
  margin-bottom:18px;
  text-transform:uppercase;
}

.santjordi-list li::before{
  color:#d92128 !important;
}


/* ==============================
   SLIDER PROYECTOS ITRAN - FUNCIONAL
   ============================== */

.project-page .project-image-slider{
  max-width:1120px;
  margin:45px auto 35px !important;
  padding:22px !important;

  border-radius:24px;

  background:#f5f5f5;

  box-shadow:0 18px 45px rgba(0,0,0,.11);
}

/* bxSlider */
.project-page .bx-wrapper{
  margin:0 auto !important;
  border:0 !important;
  background:transparent !important;
  box-shadow:none !important;
}

.project-page .bx-viewport{
  border-radius:22px !important;
  background:transparent !important;
}

/* Slider */
.project-page .project-slider{
  margin:0 !important;
  padding:0 !important;
  list-style:none !important;
}

.project-page .project-slider li{
  min-height:650px !important;
  padding:20px !important;

  text-align:center !important;
  background:transparent !important;
  border-radius:22px !important;
  overflow:hidden !important;
}

/* Imagen estable */
.project-page .project-slider img{
  display:inline-block !important;

  width:auto !important;
  height:auto !important;

  max-width:100% !important;
  max-height:610px !important;

  vertical-align:middle !important;

  border-radius:18px !important;
  box-shadow:0 10px 28px rgba(0,0,0,.14);

  transition:transform .35s ease;
}

/* Centrado vertical */
.project-page .project-slider li::before{
  content:"";
  display:inline-block;
  height:610px;
  vertical-align:middle;
}

.project-page .project-slider img:hover{
  transform:scale(1.01);
}

/* Flechas */
.project-page .bx-wrapper .bx-controls-direction a{
  width:54px !important;
  height:54px !important;

  border-radius:50% !important;
  background-color:rgba(255,255,255,.92) !important;

  box-shadow:0 8px 22px rgba(0,0,0,.14) !important;
  z-index:80 !important;

  transition:all .25s ease;
}

.project-page .bx-wrapper .bx-controls-direction a:hover{
  transform:scale(1.08);
  background-color:#fff !important;
}

.project-page .bx-wrapper .bx-prev{
  left:18px !important;
}

.project-page .bx-wrapper .bx-next{
  right:18px !important;
}

/* Paginación */
.project-page .bx-wrapper .bx-pager{
  bottom:-34px !important;
}

.project-page .bx-wrapper .bx-pager.bx-default-pager a{
  width:11px !important;
  height:11px !important;
  border-radius:50% !important;
  background:rgba(0,0,0,.25) !important;
}

.project-page .bx-wrapper .bx-pager.bx-default-pager a.active,
.project-page .bx-wrapper .bx-pager.bx-default-pager a:hover{
  background:#17b890 !important;
}

/* Mobile */
@media(max-width:768px){

  .project-page .project-image-slider{
    padding:12px !important;
    border-radius:18px;
  }

  .project-page .bx-viewport{
    border-radius:16px !important;
  }

  .project-page .project-slider li{
    min-height:380px !important;
    padding:10px !important;
  }

  .project-page .project-slider li::before{
    height:340px;
  }

  .project-page .project-slider img{
    max-height:340px !important;
    border-radius:14px !important;
  }

}
/* ==============================
   GALERÍA SANT JORDI
   ============================== */

.project-page .project-gallery{
  max-width:1120px;
  margin:45px auto 35px;
  display:grid;
  grid-template-columns:repeat(2, 1fr);
  gap:22px;
}

.project-page .project-gallery figure{
  margin:0;
  padding:18px;
  border-radius:22px;
  background:#f5f5f5;
  box-shadow:0 14px 36px rgba(0,0,0,.10);
}

.project-page .project-gallery img{
  width:100%;
  height:auto;
  display:block;
  border-radius:16px;
  box-shadow:0 8px 24px rgba(0,0,0,.10);
}

.project-page .project-gallery figure:first-child{
  grid-column:1 / -1;
}

@media(max-width:768px){
  .project-page .project-gallery{
    grid-template-columns:1fr;
    gap:16px;
  }

  .project-page .project-gallery figure{
    padding:10px;
    border-radius:16px;
  }

  .project-page .project-gallery img{
    border-radius:12px;
  }
}