/**
Theme Name: Astra Child
Author: Brainstorm Force
Author URI: http://wpastra.com/about/
Description: Astra is the fastest, fully customizable & beautiful theme suitable for blogs, personal portfolios and business websites. It is very lightweight, customizable and compatible with major plugins.
Version: 1.0.0
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: astra-child
Template: astra
*/



/* ========================================
   TIPOGRAFÍAS
======================================== */

@import url('https://fonts.googleapis.com/css2?family=Abril+Fatface&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Montserrat:ital,wght@0,100..900;1,100..900&display=swap');

:root {
  --fuente-titulares: "Abril Fatface", serif;
  --fuente-base: "Montserrat", sans-serif;
}

/* ========================================
   TIPOGRAFÍA BASE
======================================== */

body,
p,
a,
li,
button,
input,
textarea,
select,
label,
blockquote,
figcaption,
.elementor-widget-text-editor,
.elementor-widget-text-editor p,
.elementor-widget-text-editor span,
.elementor-widget-text-editor div,
.elementor-widget-button a,
.elementor-widget-button .elementor-button,
.elementor-button,
.elementor-icon-list-text,
.elementor-accordion-content,
.elementor-tab-content,
.elementor-testimonial-content,
.fuente-base,
.fuente-base * {
  font-family: var(--fuente-base) !important;
}

/* ========================================
   TITULARES REALES
   Solo h1, h2, h3, h4, h5, h6
======================================== */

h1,
h2,
h3,
h4,
h5,
h6,
h1.elementor-heading-title,
h2.elementor-heading-title,
h3.elementor-heading-title,
h4.elementor-heading-title,
h5.elementor-heading-title,
h6.elementor-heading-title,
.elementor-element h1.elementor-heading-title,
.elementor-element h2.elementor-heading-title,
.elementor-element h3.elementor-heading-title,
.elementor-element h4.elementor-heading-title,
.elementor-element h5.elementor-heading-title,
.elementor-element h6.elementor-heading-title,
.ast-single-post .entry-title,
.page-title,
.entry-title {
  font-family: var(--fuente-titulares) !important;
  font-weight: 400 !important;
}

/* Si el titular real lleva spans, strong o em internos */
h1.elementor-heading-title *,
h2.elementor-heading-title *,
h3.elementor-heading-title *,
h4.elementor-heading-title *,
h5.elementor-heading-title *,
h6.elementor-heading-title *,
.elementor-element h1.elementor-heading-title *,
.elementor-element h2.elementor-heading-title *,
.elementor-element h3.elementor-heading-title *,
.elementor-element h4.elementor-heading-title *,
.elementor-element h5.elementor-heading-title *,
.elementor-element h6.elementor-heading-title * {
  font-family: var(--fuente-titulares) !important;
  font-weight: 400 !important;
}

/* ========================================
   PÁRRAFOS USADOS COMO HEADING EN ELEMENTOR
======================================== */

p.elementor-heading-title,
.elementor-element p.elementor-heading-title,
.elementor-widget-heading p.elementor-heading-title,
.elementor-element p.elementor-heading-title.elementor-size-default {
  font-family: var(--fuente-base) !important;
  font-weight: inherit !important;
}

p.elementor-heading-title *,
.elementor-element p.elementor-heading-title *,
.elementor-widget-heading p.elementor-heading-title *,
.elementor-element p.elementor-heading-title.elementor-size-default * {
  font-family: var(--fuente-base) !important;
}

/* ========================================
   SUBTÍTULOS PERSONALIZADOS
======================================== */

.subtitulo,
.subtitulo * {
  font-family: var(--fuente-titulares) !important;
  font-weight: 400 !important;
  text-transform: uppercase !important;
}

.fuente-titular,
.fuente-titular * {
  font-family: var(--fuente-titulares) !important;
  font-weight: 400 !important;
}

/* ========================================
   RESET BÁSICO
======================================== */

h1,
h2,
h3,
h4,
h5,
h6,
.elementor-element h1.elementor-heading-title,
.elementor-element h2.elementor-heading-title,
.elementor-element h3.elementor-heading-title,
.elementor-element h4.elementor-heading-title,
.elementor-element h5.elementor-heading-title,
.elementor-element h6.elementor-heading-title,
.elementor-element p.elementor-heading-title {
  margin: 0 !important;
  padding: 0 !important;
}

p {
  margin-bottom: 0 !important;
}

/* ========================================
   SECCIONES
======================================== */

.section_100,
.section {
  padding-top: clamp(60px, 6.25vw, 100px);
  padding-bottom: clamp(60px, 6.25vw, 100px);
  padding-left: clamp(20px, 3vw, 30px);
  padding-right: clamp(20px, 3vw, 30px);
}

.pdt_250 {
  padding-top: clamp(100px, 6.25vw, 250px);
}

.pdt_0 {
  padding-top: 0;
}

.pdb_0 {
  padding-bottom: 0;
}

/* ========================================
   TAMAÑOS DE TITULARES
======================================== */

.titulo_xl :is(
  h1.elementor-heading-title,
  h2.elementor-heading-title,
  h3.elementor-heading-title,
  h4.elementor-heading-title,
  h5.elementor-heading-title,
  h6.elementor-heading-title,
  h1, h2, h3, h4, h5, h6
) {
  font-family: var(--fuente-titulares) !important;
      font-size: clamp(32px, 4.2vw, 70px) !important;
    line-height: clamp(38px, 5vw, 82px) !important;
  font-weight: 400 !important;
}

.titulo_md :is(
  h1.elementor-heading-title,
  h2.elementor-heading-title,
  h3.elementor-heading-title,
  h4.elementor-heading-title,
  h5.elementor-heading-title,
  h6.elementor-heading-title,
  h1, h2, h3, h4, h5, h6
) {
  font-family: var(--fuente-titulares) !important;
	font-size: clamp(32px, 3.2vw, 55px) !important;
  line-height: clamp(40px, 3.5vw, 65px) !important;
  font-weight: 400 !important;
}

.titulo_sm :is(
  h1.elementor-heading-title,
  h2.elementor-heading-title,
  h3.elementor-heading-title,
  h4.elementor-heading-title,
  h5.elementor-heading-title,
  h6.elementor-heading-title,
  h1, h2, h3, h4, h5, h6
) {
  font-family: var(--fuente-titulares) !important;
  font-size: clamp(25px, 2.6vw, 35px) !important;
  line-height: clamp(32px, 3.5vw, 42px) !important;
  font-weight: 400 !important;
}

.titulo_xs :is(
  h1.elementor-heading-title,
  h2.elementor-heading-title,
  h3.elementor-heading-title,
  h4.elementor-heading-title,
  h5.elementor-heading-title,
  h6.elementor-heading-title,
  h1, h2, h3, h4, h5, h6
) {
  font-family: var(--fuente-titulares) !important;
  font-size: clamp(20px, 2vw, 25px) !important;
  line-height: clamp(28px, 3.5vw, 32px) !important;
  font-weight: 400 !important;
}

/* ========================================
   PÁRRAFOS CON ESTILO DE TÍTULO EN ELEMENTOR
   Para textos tipo subtítulo, entradilla o claim
======================================== */

.titulo_xl .elementor-element p.elementor-heading-title,
.titulo_xl p.elementor-heading-title {
  font-family: var(--fuente-base) !important;
  font-size: clamp(32px, 4.2vw, 52px) !important;
  line-height: clamp(38px, 5vw, 62px) !important;
}

.titulo_md .elementor-element p.elementor-heading-title,
.titulo_md p.elementor-heading-title {
  font-family: var(--fuente-base) !important;
  font-size: clamp(32px, 3.2vw, 45px) !important;
  line-height: clamp(40px, 3.5vw, 54px) !important;
}

.titulo_sm .elementor-element p.elementor-heading-title,
.titulo_sm p.elementor-heading-title {
  font-family: var(--fuente-base) !important;
  font-size: clamp(25px, 2.6vw, 35px) !important;
  line-height: clamp(32px, 3.5vw, 42px) !important;
}

.titulo_xs .elementor-element p.elementor-heading-title,
.titulo_xs p.elementor-heading-title {
  font-family: var(--fuente-base) !important;
  font-size: clamp(20px, 2vw, 25px) !important;
  line-height: clamp(28px, 3.5vw, 32px) !important;
}

/* ========================================
   TAMAÑOS DE TEXTO
======================================== */

.texto_xl,
.texto_xl :is(
  p,
  p.elementor-heading-title,
  span,
  a,
  li,
  strong,
  em
) {
  font-family: var(--fuente-base) !important;
  font-size: clamp(18px, 0.5rem + 1.5vw, 22px) !important;
  line-height: clamp(27px, 0.75rem + 2vw, 33px) !important;
}

.texto_md,
.texto_md :is(
  p,
  p.elementor-heading-title,
  span,
  a,
  li,
  strong,
  em
) {
  font-family: var(--fuente-base) !important;
  font-size: clamp(16px, 0.5rem + 1vw, 20px) !important;
  line-height: clamp(24px, 0.75rem + 1.5vw, 30px) !important;
}

.texto_sm,
.texto_sm :is(
  p,
  p.elementor-heading-title,
  span,
  a,
  li,
  strong,
  em
) {
  font-family: var(--fuente-base) !important;
  font-size: clamp(16px, 0.5rem + 0.8vw, 18px) !important;
  line-height: clamp(24px, 0.75rem + 1.2vw, 27px) !important;
}

.texto_xs,
.texto_xs :is(
  p,
  p.elementor-heading-title,
  span,
  a,
  li,
  strong,
  em
) {
  font-family: var(--fuente-base) !important;
  font-size: clamp(14px, 0.5rem + 0.8vw, 16px) !important;
  line-height: clamp(20px, 0.75rem + 1.2vw, 22px) !important;
}

/* ========================================
   UTILIDADES MANUALES
======================================== */

.titulo_xl.fuente-base h1,
.fuente-base,
.fuente-base * {
  font-family: "Montserrat", sans-serif !important;
}

.titulo_xs.fuente-base h3,
.fuente-base h3{
	font-family: "Montserrat", sans-serif !important;
	font-weight: 700 !important;
}

.fuente-titular,
.fuente-titular * {
  font-family: var(--fuente-titulares) !important;
  font-weight: 400 !important;
}


/*CARRUSEL CARDS HOVER HOME*/

.card_hover {
  position: relative;
  z-index: 1;
  transition:
    transform 0.45s cubic-bezier(0.22, 1, 0.36, 1),
    box-shadow 0.45s cubic-bezier(0.22, 1, 0.36, 1);
  transform-origin: center center;
  will-change: transform;
}

.card_hover:hover {
  transform: translateY(-12px) scale(1.075);
  z-index: 20;
  box-shadow: 0 24px 60px rgba(0, 0, 0, 0.22);
}


.texto_card {
  opacity: 0;
  transform: translateY(18px);
  visibility: hidden;
  transition:
    opacity 0.4s ease 0.08s,
    transform 0.4s ease 0.08s,
    visibility 0.4s ease 0.08s;
  will-change: opacity, transform;
}

.card_hover:hover .texto_card {
  opacity: 1;
  transform: translateY(0);
  visibility: visible;
}