/* ====== Base / marca ====== */
:root{
  --brand:#133871;
  --brand-contrast:#ffffff;
  --radius:20px;
}

/* Tipos y títulos */
.hero-title{
  font-size: clamp(28px, 4.5vw, 42px);
  line-height: 1.15;
  text-align:center;
  margin: 0 0 .5rem 0;
}
.hero-sub{
  font-size: clamp(16px, 2.6vw, 20px);
  text-align:center;
  margin: .25rem 0 1rem 0;
  opacity:.95;
}

/* Botón primario consistente */
.boton-reserva,
.wp-block-button__link.is-style-fill,
.wp-element-button.boton-primario{
  background: var(--brand) !important;
  color: var(--brand-contrast) !important;
  border-radius: 999px !important;
  padding: .7rem 1.25rem !important;
  border: 1px solid var(--brand);
  box-shadow: 0 2px 6px rgba(0,0,0,.12);
}
.boton-reserva:hover,
.wp-element-button.boton-primario:hover{
  filter: brightness(1.05);
}
.boton-reserva:focus,
a:focus{
  outline: 3px solid #ffcc00;
  outline-offset: 2px;
}

/* Justificar párrafos de tus bloques con clase personalizada */
.text-justificat,
.text-justificat p{
  text-align: justify;
  hyphens: auto;
}

/* Header / separadores: sombras suaves o nada */
.kadence-row-layout-wrap{
  box-shadow: 0 8px 18px rgba(0,0,0,.06) !important;
  border-radius: 25px;
}

/* === Menú deslizante accesible === */
.gspb_slidingPanel[aria-hidden="false"]{ outline: none; }
.gspb_slidingPanel-close{ cursor:pointer; }

/* === Fondo fijo: evita problemas en móvil === */
@media (min-width:1024px){
  .fondo-fijo{ background-attachment: fixed; z-index:0; }
}
@media (max-width:1023px){
  .fondo-fijo{ background-attachment: scroll; }
}

/* === Swiper / carruseles: bordes redondeados consistentes === */
.gs-swiper .swiper,
.gs-swiper .swiper-slide,
.gs-swiper .swiper-slide img{
  border-radius: var(--radius);
  overflow: hidden;
}

/* === Comparador “abans/després” redondo y limpio === */
.comparador-redondo .icb-container,
.comparador-redondo .icb-wrapper,
.comparador-redondo .icb-img,
.comparador-redondo canvas{
  border-radius: var(--radius) !important;
  overflow: hidden !important;
}
.comparador-redondo .icb-comparison-slider-handle{
  border: 2px solid rgba(0,0,0,.08);
  box-shadow: 0 2px 6px rgba(0,0,0,.12);
}

/* === Tarjetas de “Com funciona” a la misma altura === */
.alturas-iguales .gspb_row__content{
  display:flex; flex-wrap:wrap; align-items:stretch;
}
.alturas-iguales .gspb_row__col--3{ display:flex; }
.alturas-iguales .kt-info-box20_05bda2-3e,
.alturas-iguales .kt-info-box20_3ff700-4e,
.alturas-iguales .kt-info-box20_ba56a9-eb,
.alturas-iguales .kt-info-box20_3020a8-38{ width:100%; }

/* === Animaciones: respeta reduced motion === */
@media (prefers-reduced-motion: reduce){
  [data-aos]{
    opacity:1 !important;
    transform:none !important;
    transition:none !important;
  }
}

/* === Galerías Jetpack: bordes y alts visibles si falta alt === */
.tiled-gallery__item img{
  border-radius: var(--radius);
}
.tiled-gallery__item img[alt=""]{ outline: 2px dashed rgba(255,0,0,.35); } /* te ayuda a detectar imágenes sin alt */

/* Ajust del botó Latepoint per a pantalles mòbils */
@media (max-width: 768px) {

  /* Aplica a totes les variants del botó Latepoint */
  a.latepoint-book-button,
  .latepoint-book-button,
  .latepoint-book-button.os-trigger,
  .latepoint-button-wrapper a {
    font-size: 16px !important;
    padding: 16px 16px !important;
    border-radius: 8px !important;
    line-height: 1.2 !important;
    display: inline-block !important;
  }

  /* Si el botó està centrat dins d’un contenidor */
  .latepoint-book-button-wrapper,
  .os-trigger {
    text-align: center !important;
    margin-top: 10px !important;
    margin-bottom: 10px !important;
  }

  /* Evita que s'estiri massa a pantalla completa */
  .latepoint-book-button {
    width: auto !important;
    max-width: 220px !important;
  }
}

/* Mides base (mòbil) */
h1 { font-size: 18px; line-height: 1.5; }
h2 { font-size: 20px; line-height: 1.2; }

/* Tablet */
@media (min-width: 768px) {
  h1 { font-size: 44px; }
  h2 { font-size: 34px; }
}

/* Escriptori */
@media (min-width: 1024px) {
  h1 { font-size: 22px; }
  h2 { font-size: 36px; }
}

/* === Igualar altura de columnas (Greenshift / Blocksy / WP) === */
.equal-steps {
  /* forzamos layout consistente y que todas las celdas se estiren */
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: clamp(16px, 2vw, 28px);
  align-items: stretch;
}

/* Hacer que cada columna/tarjeta ocupe toda la altura disponible */
.equal-steps > * { height: 100%; }

/* Cubrimos wrappers típicos de Greenshift, Blocksy y WP Group */
.equal-steps .equal-card,
.equal-steps .gspb_column,
.equal-steps .ct-column,
.equal-steps .wp-block-group,
.equal-steps .wp-block-columns > .wp-block-column {
  height: 100%;
  display: flex;
  flex-direction: column;     /* para poder “pegar” el botón/último párrafo abajo si quieres */
}

/* Si tu tarjeta tiene un wrapper interior (panel/box), también estíralo */
.equal-steps .equal-card > *,
.equal-steps .gspb_column > .gspb_column_inner,
.equal-steps .ct-column > .ct-column-inner,
.equal-steps .wp-block-group__inner-container {
  flex: 1 1 auto;
  display: flex;
  flex-direction: column;
}

/* Opcional: que el bloque de texto/CTA final empuje hacia abajo */
.equal-steps .push-bottom { margin-top: auto; }

/* Responsivo */
@media (max-width: 1024px) {
  .equal-steps { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 600px) {
  .equal-steps { grid-template-columns: 1fr; }
}

/* Pequeños ajustes por si los títulos crean saltos de línea largos */
.equal-steps h3, .equal-steps h2, .equal-steps h4 { hyphens: auto; }

/* === Fondo fijo optimitzat === */
body::before {
  content: "";
  position: fixed;
  inset: 0;
  background-image: url('https://spcdn.shortpixel.ai/spio/ret_img,q_cdnize,to_webp,s_webp/espaiargila.com/wp-content/uploads/2025/11/Sin-titulo-1-_1_-1.webp');
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  z-index: -1;
  pointer-events: none;
  will-change: transform;
}

/* Centrar i netejar el footer al mòbil */
@media (max-width: 768px) {

  /* El contenidor principal del footer */
  footer,
  .site-footer,
  .site-footer .wp-block-group {
    width: 100% !important;
    max-width: 100% !important;
    margin: 0 auto !important;
    padding-left: 16px !important;
    padding-right: 16px !important;
    box-sizing: border-box;
  }

  /* Elimina desplaçaments rars */
  .site-footer .alignwide,
  .site-footer .alignleft,
  .site-footer .alignright {
    margin-left: 0 !important;
    margin-right: 0 !important;
    float: none !important;
  }

  /* Textos centrats */
  .site-footer,
  .site-footer p,
  .site-footer a,
  .site-footer li {
    text-align: center !important;
  }

  /* Xarxes socials centrades */
  .site-footer .wp-block-social-links,
  .site-footer .wp-block-buttons,
  .site-footer .gs-button,
  .site-footer .gs-block {
    justify-content: center !important;
    margin-left: auto !important;
    margin-right: auto !important;
  }
}

/* Ajust tipografia del formulari de regal */
.single-product form.wc-giftcard-form,
.single-product .wc-giftcard-form * {
    font-size: 15px !important;
    line-height: 1.4 !important;
}

/* Inputs i selects */
.single-product .wc-giftcard-form input,
.single-product .wc-giftcard-form textarea,
.single-product .wc-giftcard-form select {
    font-size: 15px !important;
    padding: 10px 14px !important;
}

/* Etiquetes (labels) */
.single-product .wc-giftcard-form label {
    font-size: 14px !important;
    font-weight: 600 !important;
}

/* Placeholder més petit */
.single-product .wc-giftcard-form ::placeholder {
    font-size: 14px !important;
}

/* Títols del formulari */
.single-product .wc-giftcard-form h3,
.single-product .wc-giftcard-form h4 {
    font-size: 17px !important;
}