/*
Theme Name: Pies a Tierra Child
Theme URI: https://piesatierra.es
Description: Child Theme personalizado para Pies a Tierra
Author: Intelligent Marketing Solutions
Template: Divi
Version: 1.0.0
*/


/* ==========================================================
   PIES A TIERRA · GLOBAL
========================================================== */


/* ==========================================================
   HERO · CONTENEDOR
========================================================== */

.pat-hero{
  position:relative !important;
  overflow:hidden !important;
  isolation:isolate;

  min-height:calc(100svh - 92px) !important;

  display:flex !important;
  align-items:center !important;

  padding:0 !important;
}


/* ==========================================================
   HERO · CAPA DE IMÁGENES
========================================================== */

.pat-hero > .pat-hero-media{
  position:absolute !important;
  inset:0 !important;

  width:100% !important;
  height:100% !important;

  margin:0 !important;
  padding:0 !important;

  overflow:hidden !important;

  pointer-events:none;

  z-index:1 !important;
}


/* ==========================================================
   HERO · FOTOGRAFÍAS CROSSFADE
========================================================== */

.pat-hero-photo{
  position:absolute !important;
  inset:0 !important;

  width:100% !important;
  height:100% !important;

  background-size:cover !important;
  background-position:center center !important;
  background-repeat:no-repeat !important;

  opacity:0;

  transition:opacity 1.4s ease-in-out;

  will-change:opacity;
}

.pat-hero-photo.is-active{
  opacity:1;
}


/* ==========================================================
   HERO · OVERLAY
========================================================== */

.pat-hero-media::after{
  content:"";

  position:absolute !important;
  inset:0 !important;

  z-index:5 !important;

  pointer-events:none;

  background:
    linear-gradient(
      90deg,
      rgba(24,38,25,.72) 0%,
      rgba(24,38,25,.52) 38%,
      rgba(24,38,25,.22) 68%,
      rgba(24,38,25,.05) 100%
    );
}


/* ==========================================================
   HERO · FILA INTERIOR
========================================================== */

.pat-hero > .pat-hero-inner{
  position:relative !important;

  width:100% !important;
  max-width:100% !important;

  margin:0 !important;

  padding-top:clamp(70px,8vh,105px) !important;
  padding-right:clamp(48px,6vw,100px) !important;
  padding-bottom:clamp(60px,7vh,90px) !important;
  padding-left:clamp(48px,7vw,120px) !important;

  z-index:50 !important;

  isolation:isolate;
}


/* ==========================================================
   HERO · COLUMNA
========================================================== */

.pat-hero-inner .et_pb_column{
  position:relative !important;

  width:100% !important;
  max-width:920px !important;

  margin:0 !important;
  padding:0 !important;

  z-index:51 !important;
}


/* ==========================================================
   HERO · MÓDULOS VISIBLES
========================================================== */

.pat-hero-inner .et_pb_text,
.pat-hero-inner .et_pb_button_module_wrapper{
  position:relative !important;
  z-index:52 !important;
}


/* ==========================================================
   HERO · KICKER
========================================================== */

.pat-hero-kicker{
  position:relative !important;

  width:auto !important;

  margin:0 0 24px 0 !important;
  padding:0 !important;

  z-index:60 !important;
}

.pat-hero-kicker p{
  margin:0 !important;
  padding:0 !important;

  font-family:"Source Sans 3","Open Sans",Arial,sans-serif !important;

  font-size:16px !important;
  line-height:1.2 !important;
  font-weight:700 !important;

  letter-spacing:.19em !important;
  text-transform:uppercase !important;

  color:#D96A2B !important;
}


/* ==========================================================
   HERO · COPY
========================================================== */

.pat-hero-copy{
  position:relative !important;

  width:100% !important;
  max-width:900px !important;

  margin:0 !important;
  padding:0 !important;

  z-index:52 !important;
}


/* H1 */

.pat-hero-copy h1{
  width:100% !important;
  max-width:900px !important;

  margin:0 0 26px 0 !important;
  padding:0 !important;

  font-family:"Cormorant Garamond",Georgia,serif !important;

  font-size:86px !important;
  line-height:.90 !important;
  font-weight:500 !important;

  letter-spacing:-.035em !important;

  color:#FBF8F1 !important;
}


/* Párrafos */

.pat-hero-copy p{
  width:100% !important;
  max-width:700px !important;

  margin:0 0 22px 0 !important;
  padding:0 !important;

  font-family:"Open Sans",Arial,sans-serif !important;

  font-size:19px !important;
  line-height:1.55 !important;
  font-weight:400 !important;

  color:#FBF8F1 !important;
}

.pat-hero-copy p:first-of-type{
  margin-bottom:25px !important;
}

.pat-hero-copy p:last-child{
  margin-bottom:0 !important;
}

.pat-hero-copy strong{
  font-weight:700 !important;
  color:#FFFFFF !important;
}


/* ==========================================================
   HERO · GRUPO DE BOTONES
========================================================== */

.pat-hero-actions{
  display:flex !important;

  flex-direction:row !important;
  flex-wrap:wrap !important;

  align-items:center !important;
  justify-content:flex-start !important;

  gap:14px !important;

  width:auto !important;

  margin:32px 0 0 0 !important;
  padding:0 !important;
}


/* Wrapper de cada botón de Divi */

.pat-hero-actions .et_pb_button_module_wrapper{
  position:relative !important;

  width:auto !important;

  margin:0 !important;
  padding:0 !important;
}


/* ==========================================================
   HERO · BOTONES · BASE
========================================================== */

.pat-hero-actions a.et_pb_button,
.pat-hero-actions .et_pb_button{
  display:inline-flex !important;

  align-items:center !important;
  justify-content:center !important;

  width:auto !important;
  min-height:58px !important;

  margin:0 !important;
  padding:17px 28px !important;

  font-family:"Open Sans",Arial,sans-serif !important;

  font-size:17px !important;
  line-height:1.2 !important;
  font-weight:700 !important;

  text-align:center !important;
  text-decoration:none !important;

  white-space:nowrap !important;

  border-radius:0 !important;
  box-shadow:none !important;

  transition:
    background-color .25s ease,
    border-color .25s ease,
    color .25s ease,
    transform .25s ease !important;
}


/* Eliminar iconos automáticos de Divi */

.pat-hero-actions .et_pb_button::before,
.pat-hero-actions .et_pb_button::after{
  display:none !important;
}


/* ==========================================================
   HERO · BOTÓN PRINCIPAL
========================================================== */

.pat-hero-btn-primary .et_pb_button,
.et_pb_button.pat-hero-btn-primary{
  background:#D96A2B !important;

  color:#FFFFFF !important;

  border:1px solid #D96A2B !important;
}

.pat-hero-btn-primary .et_pb_button:hover,
.et_pb_button.pat-hero-btn-primary:hover{
  background:#263A22 !important;

  color:#FFFFFF !important;

  border-color:#263A22 !important;

  transform:translateY(-2px);
}


/* ==========================================================
   HERO · BOTÓN SECUNDARIO
========================================================== */

.pat-hero-btn-secondary .et_pb_button,
.et_pb_button.pat-hero-btn-secondary{
  background:transparent !important;

  color:#FFFFFF !important;

  border:1px solid rgba(255,255,255,.70) !important;
}

.pat-hero-btn-secondary .et_pb_button:hover,
.et_pb_button.pat-hero-btn-secondary:hover{
  background:#263A22 !important;

  color:#FFFFFF !important;

  border-color:#263A22 !important;

  transform:translateY(-2px);
}


/* ==========================================================
   HERO · MÓDULO CÓDIGO
========================================================== */

.pat-hero-inner .et_pb_code,
.pat-hero-inner .et_pb_code_inner{
  position:static !important;

  margin:0 !important;
  padding:0 !important;

  min-height:0 !important;
}


/* ==========================================================
   HERO · TABLET
   641px — 980px
========================================================== */

@media (max-width:980px){

  .pat-hero{
    min-height:calc(100svh - 80px) !important;
  }


  /* Fila */

  .pat-hero > .pat-hero-inner{
    width:100% !important;
    max-width:100% !important;

    margin:0 !important;

    padding-top:70px !important;
    padding-right:42px !important;
    padding-bottom:64px !important;
    padding-left:42px !important;
  }


  /* Columna */

  .pat-hero-inner .et_pb_column{
    width:100% !important;
    max-width:760px !important;
  }


  /* Kicker */

  .pat-hero-kicker{
    margin-bottom:20px !important;
  }

  .pat-hero-kicker p{
    font-size:14px !important;
    letter-spacing:.18em !important;
  }


  /* Copy */

  .pat-hero-copy{
    max-width:760px !important;
  }


  /* H1 */

  .pat-hero-copy h1{
    width:100% !important;
    max-width:760px !important;

    font-size:clamp(64px,8.5vw,78px) !important;
    line-height:.90 !important;

    margin-bottom:24px !important;
  }


  /* Párrafos */

  .pat-hero-copy p{
    width:100% !important;
    max-width:650px !important;

    font-size:18px !important;
    line-height:1.5 !important;
  }


  /* Botones */

  .pat-hero-actions{
    gap:12px !important;

    margin-top:28px !important;
  }

  .pat-hero-actions a.et_pb_button,
  .pat-hero-actions .et_pb_button{
    min-height:56px !important;

    padding:16px 24px !important;

    font-size:16px !important;
  }

}


/* ==========================================================
   HERO · MÓVIL
   hasta 640px
========================================================== */

@media (max-width:640px){

  .pat-hero{
    min-height:90svh !important;

    align-items:center !important;
  }


  /* Fila */

  .pat-hero > .pat-hero-inner{
    width:100% !important;
    max-width:100% !important;

    margin:0 !important;

    padding-top:54px !important;
    padding-right:24px !important;
    padding-bottom:54px !important;
    padding-left:24px !important;
  }


  /* Columna */

  .pat-hero-inner .et_pb_column{
    width:100% !important;
    max-width:100% !important;
  }


  /* Kicker */

  .pat-hero-kicker{
    margin-bottom:18px !important;
  }

  .pat-hero-kicker p{
    font-size:12px !important;
    line-height:1.3 !important;

    letter-spacing:.16em !important;
  }


  /* Copy */

  .pat-hero-copy{
    width:100% !important;
    max-width:100% !important;
  }


  /* H1 */

  .pat-hero-copy h1{
    width:100% !important;
    max-width:100% !important;

    font-size:clamp(48px,13vw,64px) !important;
    line-height:.91 !important;

    letter-spacing:-.03em !important;

    margin-bottom:22px !important;
  }


  /* Párrafos */

  .pat-hero-copy p{
    width:100% !important;
    max-width:100% !important;

    font-size:16px !important;
    line-height:1.5 !important;

    margin-bottom:18px !important;
  }

  .pat-hero-copy p:first-of-type{
    margin-bottom:22px !important;
  }


  /* Botones */

  .pat-hero-actions{
    flex-direction:column !important;
    flex-wrap:nowrap !important;

    align-items:stretch !important;

    width:100% !important;
    max-width:340px !important;

    gap:10px !important;

    margin-top:26px !important;
  }

  .pat-hero-actions .et_pb_button_module_wrapper{
    width:100% !important;
  }

  .pat-hero-actions a.et_pb_button,
  .pat-hero-actions .et_pb_button{
    width:100% !important;

    min-height:54px !important;

    padding:15px 20px !important;

    font-size:15px !important;

    white-space:normal !important;
  }

}


/* ==========================================================
   HERO · MÓVIL PEQUEÑO
========================================================== */

@media (max-width:390px){

  .pat-hero > .pat-hero-inner{
    padding-right:20px !important;
    padding-left:20px !important;
  }

  .pat-hero-copy h1{
    font-size:clamp(44px,12.5vw,52px) !important;
  }

  .pat-hero-copy p{
    font-size:15px !important;
  }

}


/* ==========================================================
   ACCESIBILIDAD · MOVIMIENTO REDUCIDO
========================================================== */

@media (prefers-reduced-motion:reduce){

  .pat-hero-photo{
    transition:none !important;
  }

  .pat-hero-actions .et_pb_button{
    transition:none !important;
  }

  .pat-hero-actions .et_pb_button:hover{
    transform:none !important;
  }

}