@charset "UTF-8";
/**
 * ========================================
 * HOJA DE ESTILOS PRINCIPAL DEL TEMA
 * ========================================
 * Este archivo solo importa módulos. NO contiene estilos directos.
 * Para editar estilos, ir al archivo correspondiente.
 */
/* ========================================
   1. FUNDACIÓN (Variables y Mixins)
   ======================================== */
/**
 * ========================================
 * VARIABLES GLOBALES DEL TEMA
 * ========================================
 * Todas las variables de colores, espaciado, tipografía, etc.
 * Este archivo debe ser importado primero en estils.scss
 */
/* ========================================
   COLORES
   ======================================== */
/* ========================================
   TIPOGRAFÍA
   ======================================== */
/* ========================================
   ESPACIADO
   ======================================== */
/* ========================================
   BORDES Y RADIOS
   ======================================== */
/* ========================================
   TRANSICIONES Y ANIMACIONES
   ======================================== */
/* ========================================
   BREAKPOINTS
   ======================================== */
/* ========================================
   SOMBRAS
   ======================================== */
/* ========================================
   Z-INDEX
   ======================================== */
/* ========================================
   GRID Y LAYOUT
   ======================================== */
/**
 * ========================================
 * MIXINS GLOBALES DEL TEMA
 * ========================================
 * Mixins reutilizables para responsive, botones, animaciones, etc.
 */
/* ========================================
   MIXINS DE MEDIA QUERIES (Responsive)
   ======================================== */
/* ========================================
   MIXINS DE BOTONES
   ======================================== */
/* ========================================
   MIXINS DE LAYOUT
   ======================================== */
/* ========================================
   MIXINS DE TIPOGRAFÍA
   ======================================== */
/* ========================================
   MIXINS DE IMÁGENES
   ======================================== */
/* ========================================
   MIXINS DE EFECTOS
   ======================================== */
/* ========================================
   MIXINS DE ESTADO
   ======================================== */
@keyframes spin {
  to {
    transform: translate(-50%, -50%) rotate(360deg);
  }
}
/* ========================================
   MIXINS ESPECÍFICOS DEL TEMA
   ======================================== */
/* ========================================
   2. BASE (Estilos fundamentales)
   ======================================== */
/**
 * ========================================
 * ESTILOS BASE DEL TEMA
 * ========================================
 * Reset, tipografía base, elementos HTML básicos
 */
/* ========================================
   HTML & BODY BASE
   ======================================== */
html {
  font-size: 16px;
  scroll-padding-top: 7.8125rem;
}

body {
  font-weight: 400;
  line-height: 1.5rem;
  background-color: #fff;
  color: #000;
}

/* ========================================
   ELEMENTOS BASE
   ======================================== */
img {
  max-width: 100%;
  height: auto;
}

a {
  transition: all 0.5s ease-in-out;
  text-decoration: none;
  color: #000;
}
a:hover {
  color: inherit;
}

b {
  font-weight: 600;
}

strong {
  font-weight: 800;
}

/* ========================================
   TIPOGRAFÍA - FONT FAMILIES
   ======================================== */
h1, h2, h3, h4, h5, h6,
.h1, .h2, .h3, .h4, .h5, .h6 {
  font-family: var(--font-headings);
}

body, p, li, div, span, a, td, th {
  font-family: var(--font-body);
}

/* ========================================
   HEADINGS (TÍTULOS)
   ======================================== */
h1 {
  font-size: 4.5rem;
  font-style: normal;
  font-weight: 400;
  line-height: 5rem;
}
h1 span {
  color: #BB0825;
}
h1 b, h1 strong {
  font-weight: 800;
}
@media (max-width: 768px) {
  h1 {
    font-size: 3rem;
    line-height: 3.2rem;
  }
}

h2 {
  font-size: 2.625rem;
  font-weight: 400;
  line-height: 3.125rem;
}
h2 b, h2 strong {
  font-weight: 800;
  color: #BB0825;
}

h3 {
  font-size: 2rem;
  font-weight: 400;
  line-height: 3.125rem;
}

h4 {
  font-size: 1.25rem;
  font-style: normal;
  font-weight: 300;
  line-height: 1.56rem;
  text-transform: uppercase;
}
h4 b {
  font-weight: 500;
}

h5 {
  font-weight: 300;
}
h5 b {
  font-weight: 500;
}

/* ========================================
   PÁRRAFOS Y TEXTO
   ======================================== */
p, li {
  font-size: 1rem;
  font-weight: 300;
  line-height: 1.5em;
  word-break: break-word;
  overflow-wrap: break-word;
  hyphens: auto;
}
@media (max-width: 768px) {
  p, li {
    font-size: 1rem;
  }
}

li {
  margin-bottom: 0.375rem;
}

.large p, .large li {
  font-size: 1.25rem;
}

.small p, .small li {
  font-size: 0.8rem;
}

.line-height-2 p, .line-height-2 li {
  line-height: 1.625rem;
}

/* ========================================
   FORMULARIOS BASE
   ======================================== */
.wpcf7-form-control-wrap {
  width: 100%;
}

label {
  width: 100%;
  color: #BB0825;
  font-weight: 300;
  font-size: 1rem;
}

.wpcf7-spinner {
  display: none;
}

input, textarea {
  width: 100%;
  padding: 0.625rem 0.3125rem;
  border: 0;
  border-radius: 0;
  background-color: transparent;
  max-height: 6.25rem;
  margin-bottom: 1.25rem;
  border-bottom: 1px solid #e5e5e5;
}

input[type=submit] {
  display: inline-block;
  width: -moz-fit-content;
  width: fit-content;
}

.wpcf7-list-item {
  margin: 0;
  margin-right: 3rem;
}
.wpcf7-list-item label {
  display: flex;
  align-items: center;
  gap: 0.3125rem;
}
.wpcf7-list-item input {
  margin: 0;
  padding: 0;
}

.wpcf7-file {
  border: 1px solid #FBFAF8;
  border-radius: 999px;
  padding: 0.9375rem;
  width: -moz-fit-content;
  width: fit-content;
}

/* ========================================
   TABLAS
   ======================================== */
.taula-horaris {
  border: 1px solid #E5E5E5;
}
.taula-horaris tr {
  border-bottom: 1px solid #E5E5E5;
}
.taula-horaris th, .taula-horaris td {
  font-weight: normal;
  padding: 0.9375rem;
}
.taula-horaris th:first-child, .taula-horaris td:first-child {
  padding-left: 1.875rem;
}

/* ========================================
   UTILIDADES VARIAS
   ======================================== */
.multiply-container img {
  mix-blend-mode: multiply;
}

.bg-gris img {
  mix-blend-mode: multiply;
}

.p-sticky {
  position: sticky !important;
  top: 6.25rem;
  z-index: 0;
}

.backdropblur {
  backdrop-filter: blur(20px);
}

.social-media {
  display: flex;
  gap: 1.25rem;
}

/**
 * ========================================
 * CLASES DE UTILIDAD
 * ========================================
 * Clases helper reutilizables en todo el sitio
 */
/* ========================================
   CLASES DE COLOR (TEXTO)
   ======================================== */
.text-color0 {
  color: #BB0825;
}
.text-color0 h1, .text-color0 h2, .text-color0 h3, .text-color0 h4, .text-color0 p, .text-color0 li, .text-color0 span {
  color: #BB0825;
}

.text-color-1 {
  color: #100E0F;
}
.text-color-1 h1, .text-color-1 h2, .text-color-1 h3, .text-color-1 h4, .text-color-1 p, .text-color-1 li, .text-color-1 span {
  color: #100E0F;
}

.text-color-2 {
  color: #858585;
}
.text-color-2 h1, .text-color-2 h2, .text-color-2 h3, .text-color-2 h4, .text-color-2 p, .text-color-2 li, .text-color-2 span {
  color: #858585;
}

.text-color-3 {
  color: #D4D4D4 !important;
}
.text-color-3 h1, .text-color-3 h2, .text-color-3 h3, .text-color-3 h4, .text-color-3 p, .text-color-3 li, .text-color-3 span {
  color: #D4D4D4;
}

/* ========================================
   ESPACIADO Y GAP
   ======================================== */
.gap20 {
  gap: 1.25rem;
}

/* ========================================
   CLASES ESPECÍFICAS DE ELEMENTOR
   ======================================== */
.elementor-button:focus, .elementor-button:hover, .elementor-button:visited {
  color: inherit !important;
}

/* ========================================
   BOTONES LEGACY (COMPATIBILIDAD)
   ======================================== */
.button, .button-alternatiu-2, .button-alternatiu-2-ele a, .button-alternatiu, .button-alternatiu-ele a, .button-ele a, .button-white, .button-ele-white a, input[type=submit] {
  display: inline-flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  gap: 0.5625rem;
  padding: 0.8125rem 1.0625rem;
  border-radius: 0;
  flex-wrap: nowrap;
  background: #BB0825;
  border: 1px solid #BB0825;
  color: #fff;
}
.button .elementor-button-text, .button-alternatiu-2 .elementor-button-text, .button-alternatiu-2-ele a .elementor-button-text, .button-alternatiu .elementor-button-text, .button-alternatiu-ele a .elementor-button-text, .button-ele a .elementor-button-text, .button-white .elementor-button-text, .button-ele-white a .elementor-button-text, input[type=submit] .elementor-button-text {
  color: #BB0825;
  transition: all 0.3s ease-in-out;
}
.button::after, .button-alternatiu-2::after, .button-alternatiu-2-ele a::after, .button-alternatiu::after, .button-alternatiu-ele a::after, .button-ele a::after, .button-white::after, .button-ele-white a::after, input[type=submit]::after {
  content: "";
  width: 1.0625rem;
  height: 1.0625rem;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='17' height='17' viewBox='0 0 17 17' fill='none'%3E%3Cpath d='M3.54175 8.5H13.4584' stroke='%23ffffff' stroke-linecap='round' stroke-linejoin='round'/%3E%3Cpath d='M8.5 3.54169L13.4583 8.50002L8.5 13.4584' stroke='%23ffffff' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
  background-size: contain;
  background-repeat: no-repeat;
  display: inline-block;
}
.button:hover, .button-alternatiu-2:hover, .button-alternatiu-2-ele a:hover, .button-alternatiu:hover, .button-alternatiu-ele a:hover, .button-ele a:hover, .button-white:hover, .button-ele-white a:hover, input[type=submit]:hover, .button.active, .active.button-alternatiu-2, .button-alternatiu-2-ele a.active, .active.button-alternatiu, .button-alternatiu-ele a.active, .button-ele a.active, .active.button-white, .button-ele-white a.active, input.active[type=submit] {
  background: #100E0F;
  border: 1px solid #fff;
}

.button-white, .button-ele-white a {
  background-color: #fff;
  color: #858585 !important;
  border: 1px solid #fff;
}
.button-white span, .button-ele-white a span, .button-white .elementor-button-text, .button-ele-white a .elementor-button-text {
  color: #858585 !important;
}
.button-white::after, .button-ele-white a::after {
  display: none;
}
.button-white:hover, .button-ele-white a:hover {
  background-color: #858585;
  color: #fff !important;
}
.button-white:hover .elementor-button-text, .button-ele-white a:hover .elementor-button-text, .button-white:hover span, .button-ele-white a:hover span {
  color: #fff !important;
}
.button-white:hover::after, .button-ele-white a:hover::after {
  background-image: url(../img/white-arrow.svg);
}

.button-alternatiu, .button-alternatiu-ele a {
  background-color: #D4D4D4;
}
.button-alternatiu:hover, .button-alternatiu-ele a:hover {
  background-color: #fff;
}
.button-alternatiu:hover::after, .button-alternatiu-ele a:hover::after {
  background-image: url(../img/btn-orange-arrow.svg);
}

.button-alternatiu-2, .button-alternatiu-2-ele a {
  background-color: #fff;
  border: 1px solid #F5F5F5;
  color: #858585;
}
.button-alternatiu-2::after, .button-alternatiu-2-ele a::after {
  background-image: url(../img/btn-blue-arrow.svg);
}
.button-alternatiu-2:hover, .button-alternatiu-2-ele a:hover {
  background-color: #fff;
  color: #D4D4D4 !important;
}
.button-alternatiu-2:hover::after, .button-alternatiu-2-ele a:hover::after {
  background-image: url(../img/btn-orange-arrow.svg);
}

.button-rodona, .button-rodona-ele a {
  width: 2.5625rem;
  height: 2.5625rem;
  border-radius: 62.4375rem;
  border: 1px solid #F5F5F5;
  background: #FFF;
  background-image: url("../img/btn-blue-arrow.svg");
  transition: all 0.5s ease-in-out;
}
.button-rodona:hover, .button-rodona-ele a:hover {
  background-image: url("../img/btn-orange-arrow.svg");
  box-shadow: 0 0.3125rem 0.3125rem 0 rgba(220, 220, 220, 0.5);
}

/* ========================================
   PROJECT FILTER BUTTONS
   ======================================== */
.project-filter-buttons {
  display: flex;
  gap: 0.625rem;
}

/* ========================================
   WHATSAPP BUTTON FLOTANTE
   ======================================== */
.whatsapp-button {
  position: fixed;
  bottom: 1.25rem;
  z-index: 9999;
  animation: whatsapp-pulse 2s infinite;
}
.whatsapp-button.whatsapp-right {
  right: 1.25rem;
}
.whatsapp-button.whatsapp-left {
  left: 1.25rem;
}
.whatsapp-button a {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 3.75rem;
  height: 3.75rem;
  border-radius: 50%;
  text-decoration: none;
  color: white;
  box-shadow: 0 0.25rem 0.5rem rgba(0, 0, 0, 0.3);
  transition: transform 0.3s ease, box-shadow 0.3s ease;
}
.whatsapp-button a:hover {
  transform: scale(1.1);
  box-shadow: 0 0.375rem 1rem rgba(0, 0, 0, 0.4);
}
.whatsapp-button a svg, .whatsapp-button a img {
  width: 2.1875rem;
  height: 2.1875rem;
}
.whatsapp-button a img {
  width: 100%;
  height: 100%;
  -o-object-fit: contain;
     object-fit: contain;
}
@media (max-width: 768px) {
  .whatsapp-button {
    bottom: 0.9375rem;
  }
  .whatsapp-button.whatsapp-right {
    right: 0.9375rem;
  }
  .whatsapp-button.whatsapp-left {
    left: 0.9375rem;
  }
  .whatsapp-button a {
    width: 3.125rem;
    height: 3.125rem;
  }
  .whatsapp-button a svg, .whatsapp-button a img {
    width: 100%;
    height: 100%;
  }
}

@keyframes whatsapp-pulse {
  0% {
    transform: scale(1);
  }
  50% {
    transform: scale(1.05);
  }
  100% {
    transform: scale(1);
  }
}
/* ========================================
   BOX COMPONENTS
   ======================================== */
.box-icons {
  position: relative;
  border: 1px solid #efefef;
  padding: 1.25rem 1.625rem !important;
  cursor: pointer;
}
.box-icons .ico-uncolor {
  z-index: 0;
}
.box-icons .ico-color {
  opacity: 0;
  position: absolute;
  top: 1.25rem;
  left: 1.625rem;
  z-index: 1;
  transition: all 0.5s ease-in-out;
}
.box-icons:hover .ico-color {
  opacity: 1;
}

.box-border {
  border: 1px solid #efefef;
  padding: 1.25rem 2.375rem 0 2.375rem !important;
}

.box-border-2 {
  border: 1px solid #efefef;
  padding: 1.25rem !important;
}

/* ========================================
   3. COMPONENTES GLOBALES
   ======================================== */
/**
 * ========================================
 * COMPONENTES GLOBALES DEL TEMA
 * ========================================
 * Componentes reutilizables que se usan en múltiples páginas
 */
/* ========================================
   BOTÓN VOLVER
   ======================================== */
.btn-volver {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
}
.btn-volver svg {
  transition: transform 0.3s ease;
}
.btn-volver {
  flex-direction: row-reverse;
}
.btn-volver:hover svg {
  transform: translateX(-0.25rem);
}
.btn-volver {
  color: #BB0825;
  font-size: 1rem;
  font-weight: 600;
  text-decoration: none;
  transition: all 0.3s ease;
}
.btn-volver:hover {
  color: #a00721;
}

/* ========================================
   HERO BANNERS
   ======================================== */
.hero-banner-base, .archive-hero-banner, .archive-blog-hero-banner {
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  padding: 7rem 0 2.06rem;
  position: relative;
  height: 39rem;
  display: flex;
  align-items: flex-end;
}
@media (max-width: 991px) {
  .hero-banner-base, .archive-hero-banner, .archive-blog-hero-banner {
    padding: 7.5rem 0 3.75rem;
    height: auto;
    min-height: 30rem;
  }
}
@media (max-width: 768px) {
  .hero-banner-base, .archive-hero-banner, .archive-blog-hero-banner {
    padding: 6.25rem 0 3.125rem;
    min-height: 25rem;
  }
}
.hero-banner-base .hero-content, .hero-banner-base .archive-blog-hero-content, .hero-banner-base .archive-hero-content, .archive-hero-banner .hero-content, .archive-hero-banner .archive-blog-hero-content, .archive-hero-banner .archive-hero-content, .archive-blog-hero-banner .hero-content, .archive-blog-hero-banner .archive-blog-hero-content, .archive-blog-hero-banner .archive-hero-content {
  position: relative;
  z-index: 1;
  text-align: left;
  color: #fff;
}
.hero-banner-base .hero-title, .hero-banner-base .archive-blog-hero-title, .hero-banner-base .archive-hero-title, .archive-hero-banner .hero-title, .archive-hero-banner .archive-blog-hero-title, .archive-hero-banner .archive-hero-title, .archive-blog-hero-banner .hero-title, .archive-blog-hero-banner .archive-blog-hero-title, .archive-blog-hero-banner .archive-hero-title {
  font-size: 3rem;
}
@media (max-width: 991px) {
  .hero-banner-base .hero-title, .hero-banner-base .archive-blog-hero-title, .hero-banner-base .archive-hero-title, .archive-hero-banner .hero-title, .archive-hero-banner .archive-blog-hero-title, .archive-hero-banner .archive-hero-title, .archive-blog-hero-banner .hero-title, .archive-blog-hero-banner .archive-blog-hero-title, .archive-blog-hero-banner .archive-hero-title {
    font-size: 2.5rem;
  }
}
@media (max-width: 768px) {
  .hero-banner-base .hero-title, .hero-banner-base .archive-blog-hero-title, .hero-banner-base .archive-hero-title, .archive-hero-banner .hero-title, .archive-hero-banner .archive-blog-hero-title, .archive-hero-banner .archive-hero-title, .archive-blog-hero-banner .hero-title, .archive-blog-hero-banner .archive-blog-hero-title, .archive-blog-hero-banner .archive-hero-title {
    font-size: 2rem;
  }
}
.hero-banner-base .hero-title, .hero-banner-base .archive-blog-hero-title, .hero-banner-base .archive-hero-title, .archive-hero-banner .hero-title, .archive-hero-banner .archive-blog-hero-title, .archive-hero-banner .archive-hero-title, .archive-blog-hero-banner .hero-title, .archive-blog-hero-banner .archive-blog-hero-title, .archive-blog-hero-banner .archive-hero-title {
  font-weight: 700;
  margin: 0 0 8.5rem 0;
  line-height: 1.2;
}
.hero-banner-base .hero-title span, .hero-banner-base .archive-blog-hero-title span, .hero-banner-base .archive-hero-title span, .archive-hero-banner .hero-title span, .archive-hero-banner .archive-blog-hero-title span, .archive-hero-banner .archive-hero-title span, .archive-blog-hero-banner .hero-title span, .archive-blog-hero-banner .archive-blog-hero-title span, .archive-blog-hero-banner .archive-hero-title span {
  color: inherit;
  font-weight: 700;
}
.hero-banner-base .hero-subtitle, .hero-banner-base .archive-blog-hero-subtitle, .hero-banner-base .archive-hero-subtitle, .archive-hero-banner .hero-subtitle, .archive-hero-banner .archive-blog-hero-subtitle, .archive-hero-banner .archive-hero-subtitle, .archive-blog-hero-banner .hero-subtitle, .archive-blog-hero-banner .archive-blog-hero-subtitle, .archive-blog-hero-banner .archive-hero-subtitle {
  font-size: 1.5rem;
}
@media (max-width: 991px) {
  .hero-banner-base .hero-subtitle, .hero-banner-base .archive-blog-hero-subtitle, .hero-banner-base .archive-hero-subtitle, .archive-hero-banner .hero-subtitle, .archive-hero-banner .archive-blog-hero-subtitle, .archive-hero-banner .archive-hero-subtitle, .archive-blog-hero-banner .hero-subtitle, .archive-blog-hero-banner .archive-blog-hero-subtitle, .archive-blog-hero-banner .archive-hero-subtitle {
    font-size: 1.25rem;
  }
}
@media (max-width: 768px) {
  .hero-banner-base .hero-subtitle, .hero-banner-base .archive-blog-hero-subtitle, .hero-banner-base .archive-hero-subtitle, .archive-hero-banner .hero-subtitle, .archive-hero-banner .archive-blog-hero-subtitle, .archive-hero-banner .archive-hero-subtitle, .archive-blog-hero-banner .hero-subtitle, .archive-blog-hero-banner .archive-blog-hero-subtitle, .archive-blog-hero-banner .archive-hero-subtitle {
    font-size: 1rem;
  }
}
.hero-banner-base .hero-subtitle, .hero-banner-base .archive-blog-hero-subtitle, .hero-banner-base .archive-hero-subtitle, .archive-hero-banner .hero-subtitle, .archive-hero-banner .archive-blog-hero-subtitle, .archive-hero-banner .archive-hero-subtitle, .archive-blog-hero-banner .hero-subtitle, .archive-blog-hero-banner .archive-blog-hero-subtitle, .archive-blog-hero-banner .archive-hero-subtitle {
  margin: 0 0 1.5rem 0;
  opacity: 0.95;
  max-width: 37.5rem;
}

/* ========================================
   PAGINACIÓN
   ======================================== */
.archive-pagination {
  display: flex;
  justify-content: center;
  margin-top: 3rem;
}
.archive-pagination .page-numbers,
.archive-pagination .nav-links {
  display: flex;
  gap: 0.5rem;
  list-style: none;
  padding: 0;
  margin: 0;
}
.archive-pagination .page-numbers li,
.archive-pagination .nav-links li {
  list-style: none;
}
.archive-pagination .page-numbers a,
.archive-pagination .page-numbers span,
.archive-pagination .nav-links a,
.archive-pagination .nav-links span {
  display: flex;
  align-items: center;
  justify-content: center;
  min-width: 2.8125rem;
  height: 2.8125rem;
  padding: 0.5rem 1rem;
  border-radius: 0.5rem;
  text-decoration: none;
  font-weight: 500;
  transition: all 0.3s ease;
  background-color: #fff;
  color: #100E0F;
  border: 1px solid #D4D4D4;
}
.archive-pagination .page-numbers a svg,
.archive-pagination .page-numbers span svg,
.archive-pagination .nav-links a svg,
.archive-pagination .nav-links span svg {
  width: 1.25rem;
  height: 1.25rem;
}
.archive-pagination .page-numbers a:hover,
.archive-pagination .page-numbers span:hover,
.archive-pagination .nav-links a:hover,
.archive-pagination .nav-links span:hover {
  background-color: #BB0825;
  color: #fff;
  border-color: #BB0825;
  transform: translateY(-0.125rem);
}
.archive-pagination .page-numbers a:hover svg path,
.archive-pagination .page-numbers span:hover svg path,
.archive-pagination .nav-links a:hover svg path,
.archive-pagination .nav-links span:hover svg path {
  stroke: #fff;
}
.archive-pagination .page-numbers .current,
.archive-pagination .nav-links .current {
  background-color: #BB0825;
  color: #fff;
  border-color: #BB0825;
}
.archive-pagination .page-numbers .dots,
.archive-pagination .nav-links .dots {
  border: none;
  background: none;
  color: #858585;
}
.archive-pagination .page-numbers .dots:hover,
.archive-pagination .nav-links .dots:hover {
  background: none;
  transform: none;
}
@media (max-width: 768px) {
  .archive-pagination {
    margin-top: 2rem;
  }
  .archive-pagination .page-numbers a,
  .archive-pagination .page-numbers span {
    min-width: 2.5rem;
    height: 2.5rem;
    padding: 0.5rem;
  }
  .archive-pagination .page-numbers a svg,
  .archive-pagination .page-numbers span svg {
    width: 1rem;
    height: 1rem;
  }
}

/* ========================================
   SECCIONES RELACIONADAS
   ======================================== */
.related-section,
.related-furgonetas {
  padding: 5rem 0;
  background-color: #FBFAF8;
}
@media (max-width: 991px) {
  .related-section,
  .related-furgonetas {
    padding: 3.75rem 0;
  }
}
@media (max-width: 768px) {
  .related-section,
  .related-furgonetas {
    padding: 2.5rem 0;
  }
}

/* ========================================
   BOTONES GLOBALES
   ======================================== */
.btn-primary {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 0.8125rem 1.0625rem;
  border: none;
  border-radius: 0.5rem;
  font-size: 1rem;
  font-weight: 500;
  text-decoration: none;
  cursor: pointer;
  transition: all 0.3s ease;
  white-space: nowrap;
  width: -moz-fit-content;
  width: fit-content;
  background-color: #BB0825;
  color: #fff;
  border: 1px solid #BB0825;
}
.btn-primary:hover {
  background-color: #a00721;
  color: #fff;
  transform: translateY(-0.125rem);
}
.btn-primary:active {
  transform: scale(0.98);
}

.btn-secondary {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 0.8125rem 1.0625rem;
  border: none;
  border-radius: 0.5rem;
  font-size: 1rem;
  font-weight: 500;
  text-decoration: none;
  cursor: pointer;
  transition: all 0.3s ease;
  white-space: nowrap;
  width: -moz-fit-content;
  width: fit-content;
  background-color: #fff;
  color: #858585;
  border: 1px solid #fff;
}
.btn-secondary:hover {
  background-color: #858585;
  color: #fff;
}

.btn-outline {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 0.8125rem 1.0625rem;
  border: none;
  border-radius: 0.5rem;
  font-size: 1rem;
  font-weight: 500;
  text-decoration: none;
  cursor: pointer;
  transition: all 0.3s ease;
  white-space: nowrap;
  width: -moz-fit-content;
  width: fit-content;
  background-color: transparent;
  color: #BB0825;
  border: 1px solid #BB0825;
}
.btn-outline:hover {
  background-color: #BB0825;
  color: #fff;
}

.btn-solicitar {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 0.8125rem 1.0625rem;
  border: none;
  border-radius: 0.5rem;
  font-size: 1rem;
  font-weight: 500;
  text-decoration: none;
  cursor: pointer;
  transition: all 0.3s ease;
  white-space: nowrap;
  width: -moz-fit-content;
  width: fit-content;
  background-color: #BB0825;
  color: #fff;
  border: 1px solid #BB0825;
}
.btn-solicitar:hover {
  background-color: #a00721;
  color: #fff;
  transform: translateY(-0.125rem);
}
.btn-solicitar:active {
  transform: scale(0.98);
}
.btn-solicitar {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
}
.btn-solicitar svg {
  transition: transform 0.3s ease;
}
.btn-solicitar:hover svg {
  transform: translateX(0.25rem);
}
.btn-solicitar {
  padding: 0.56rem 1.25rem;
}

/* ========================================
   TARJETAS (CARDS)
   ======================================== */
.card-base {
  background-color: #fff;
  border-radius: 0.625rem;
  overflow: hidden;
  transition: all 0.3s ease;
  cursor: pointer;
}
.card-base:hover {
  transform: translateY(-0.125rem);
  box-shadow: 0 0.25rem 0.75rem rgba(0, 0, 0, 0.15);
}
.card-base .card-image {
  width: 100%;
  aspect-ratio: 16/10;
  overflow: hidden;
  background-color: #f5f5f5;
}
.card-base .card-image img {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
  transition: transform 0.3s ease;
}
.card-base:hover .card-image img {
  transform: scale(1.05);
}
.card-base .card-content {
  padding: 1.5rem;
}
.card-base .card-title {
  font-size: 1.25rem;
  font-weight: 600;
  color: #100E0F;
  margin-bottom: 0.5rem;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
.card-base .card-description {
  font-size: 1rem;
  color: #858585;
  line-height: 1.5;
  display: -webkit-box;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

/* ========================================
   BADGES Y ETIQUETAS
   ======================================== */
.badge, .badge-vector, .badge-secondary, .post-category, .categories-list .category-item, .badge-primary {
  display: inline-block;
  padding: 0.25rem 0.75rem;
  font-size: 0.875rem;
  font-weight: 600;
  border-radius: 0.25rem;
  white-space: nowrap;
}

.badge-primary {
  background-color: #BB0825;
  color: #fff;
}

.badge-secondary, .post-category, .categories-list .category-item {
  background-color: #FBFAF8;
  color: #100E0F;
  transition: all 0.3s ease;
}
.badge-secondary:hover, .post-category:hover, .categories-list .category-item:hover {
  background-color: #BB0825;
  color: #fff;
}

.badge-vector {
  background-color: #0066CC;
  color: #fff;
}

/* ========================================
   CATEGORÍAS Y TAGS
   ======================================== */
.post-tag {
  display: inline-block;
  padding: 0.35rem 0.85rem;
  margin-right: 0.5rem;
  margin-top: 0.5rem;
  background-color: #fff;
  border: 1px solid #D4D4D4;
  color: #858585;
  font-size: 0.875rem;
  text-decoration: none;
  border-radius: 0.25rem;
  transition: all 0.3s ease;
}
.post-tag:hover {
  background-color: #BB0825;
  color: #fff;
  border-color: #BB0825;
}

/* ========================================
   LISTAS DE CATEGORÍAS
   ======================================== */
.categories-list {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
}
/* ========================================
   SPINNER / LOADING
   ======================================== */
.loading-overlay {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  z-index: 5001;
}

.spinner {
  width: 3.125rem;
  height: 3.125rem;
  border: 0.25rem solid rgba(187, 8, 37, 0.2);
  border-top-color: #BB0825;
  border-radius: 50%;
  animation: spin 0.8s linear infinite;
}

@keyframes spin {
  to {
    transform: rotate(360deg);
  }
}
/* ========================================
   FILTROS (SELECTS Y BOTONES)
   ======================================== */
.filter-select {
  width: 100%;
  padding: 0.875rem 1rem;
  padding-right: 2.25rem;
  border: none;
  border-radius: 0.5rem;
  background-color: #fff;
  color: #100E0F;
  font-size: 1rem;
  font-weight: 500;
  cursor: pointer;
  transition: all 0.3s ease;
  -webkit-appearance: none;
     -moz-appearance: none;
          appearance: none;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath fill='%23100E0F' d='M1 1l5 5 5-5'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: right 0.75rem center;
}
.filter-select:hover {
  box-shadow: 0 0.25rem 0.75rem rgba(0, 0, 0, 0.15);
}
.filter-select:focus {
  outline: none;
  box-shadow: 0 0 0 0.1875rem rgba(187, 8, 37, 0.2);
}

.filter-button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 0.8125rem 1.0625rem;
  border: none;
  border-radius: 0.5rem;
  font-size: 1rem;
  font-weight: 500;
  text-decoration: none;
  cursor: pointer;
  transition: all 0.3s ease;
  white-space: nowrap;
  width: -moz-fit-content;
  width: fit-content;
  background-color: #BB0825;
  color: #fff;
  border: 1px solid #BB0825;
}
.filter-button:hover {
  background-color: #a00721;
  color: #fff;
  transform: translateY(-0.125rem);
}
.filter-button:active {
  transform: scale(0.98);
}
.filter-button {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
}
.filter-button svg {
  transition: transform 0.3s ease;
}
.filter-button:hover svg {
  transform: translateX(0.25rem);
}
.filter-button {
  padding: 0.875rem 2rem;
  font-weight: 600;
  white-space: nowrap;
}
.filter-button svg {
  width: 0.875rem;
  height: 0.75rem;
}
.filter-button:hover {
  box-shadow: 0 0.25rem 0.75rem rgba(187, 8, 37, 0.4);
}

/* ========================================
   FORMULARIOS
   ======================================== */
.form-input, .form-textarea {
  width: 100%;
  padding: 0.75rem 1rem;
  border: 1px solid #D4D4D4;
  border-radius: 0.5rem;
  font-size: 1rem;
  color: #100E0F;
  transition: all 0.3s ease;
}
.form-input:focus, .form-textarea:focus {
  outline: none;
  border-color: #BB0825;
  box-shadow: 0 0 0 0.1875rem rgba(187, 8, 37, 0.1);
}
.form-input::-moz-placeholder, .form-textarea::-moz-placeholder {
  color: #858585;
}
.form-input::placeholder, .form-textarea::placeholder {
  color: #858585;
}

.form-textarea {
  min-height: 7.5rem;
  resize: vertical;
}

/* ========================================
   SECCIONES VACÍAS
   ======================================== */
.empty-state, .archive-blog-empty, .archive-empty {
  text-align: center;
  padding: 3.75rem 2rem;
}
.empty-state p, .archive-blog-empty p, .archive-empty p, .empty-state li, .archive-blog-empty li, .archive-empty li {
  font-size: 1.25rem;
  color: #858585;
  margin: 0;
}

/* ========================================
   NAVEGACIÓN ENTRE POSTS/FURGONETAS
   ======================================== */
.post-navigation, .single-post-navigation {
  display: flex;
  justify-content: space-between;
  gap: 2rem;
  padding-top: 3.75rem;
  border-top: 1px solid #D4D4D4;
}
.post-navigation .nav-link, .single-post-navigation .nav-link {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
}
.post-navigation .nav-link svg, .single-post-navigation .nav-link svg {
  transition: transform 0.3s ease;
}
.post-navigation .nav-link:hover svg, .single-post-navigation .nav-link:hover svg {
  transform: translateX(0.25rem);
}
.post-navigation .nav-link, .single-post-navigation .nav-link {
  color: #100E0F;
  text-decoration: none;
  font-weight: 500;
  padding: 1rem;
  border-radius: 0.5rem;
  background-color: #FBFAF8;
}
.post-navigation .nav-link span, .single-post-navigation .nav-link span {
  max-width: 15.625rem;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.post-navigation .nav-link svg, .single-post-navigation .nav-link svg {
  flex-shrink: 0;
}
.post-navigation .nav-link:hover, .single-post-navigation .nav-link:hover {
  background-color: #BB0825;
  color: #fff;
}
.post-navigation .nav-link:hover svg path, .single-post-navigation .nav-link:hover svg path {
  stroke: #fff;
}
.post-navigation .nav-previous .nav-link, .single-post-navigation .nav-previous .nav-link {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
}
.post-navigation .nav-previous .nav-link svg, .single-post-navigation .nav-previous .nav-link svg {
  transition: transform 0.3s ease;
}
.post-navigation .nav-previous .nav-link, .single-post-navigation .nav-previous .nav-link {
  flex-direction: row-reverse;
}
.post-navigation .nav-previous .nav-link:hover svg, .single-post-navigation .nav-previous .nav-link:hover svg {
  transform: translateX(-0.25rem);
}
.post-navigation .nav-next, .single-post-navigation .nav-next {
  text-align: right;
}
.post-navigation .nav-next .nav-link, .single-post-navigation .nav-next .nav-link {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
}
.post-navigation .nav-next .nav-link svg, .single-post-navigation .nav-next .nav-link svg {
  transition: transform 0.3s ease;
}
.post-navigation .nav-next .nav-link:hover svg, .single-post-navigation .nav-next .nav-link:hover svg {
  transform: translateX(0.25rem);
}
@media (max-width: 768px) {
  .post-navigation, .single-post-navigation {
    flex-direction: column;
    gap: 1rem;
  }
  .post-navigation .nav-next, .single-post-navigation .nav-next {
    text-align: left;
  }
  .post-navigation .nav-link span, .single-post-navigation .nav-link span {
    max-width: 100%;
  }
}

/* ========================================
   IMAGEN DESTACADA PLACEHOLDER
   ======================================== */
.featured-image-placeholder {
  width: 100%;
  aspect-ratio: 16/10;
  background: linear-gradient(135deg, #f5f5f5 0%, rgb(219.5, 219.5, 219.5) 100%);
  display: flex;
  align-items: center;
  justify-content: center;
  color: #858585;
  font-size: 1rem;
  border-radius: 0.625rem;
}

/* ========================================
   GRIDS COMUNES
   ======================================== */
.grid-3col {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 2rem;
}
@media (max-width: 991px) {
  .grid-3col {
    grid-template-columns: repeat(2, 1fr);
    gap: 1.5rem;
  }
}
@media (max-width: 768px) {
  .grid-3col {
    grid-template-columns: 1fr;
    gap: 1rem;
  }
}

.grid-2col {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 2rem;
}
@media (max-width: 768px) {
  .grid-2col {
    grid-template-columns: 1fr;
    gap: 1rem;
  }
}

/* ========================================
   UTILIDADES DE ESPACIADO
   ======================================== */
.section-spacing {
  padding: 5rem 0;
}
@media (max-width: 991px) {
  .section-spacing {
    padding: 3.75rem 0;
  }
}
@media (max-width: 768px) {
  .section-spacing {
    padding: 2.5rem 0;
  }
}

/* ========================================
   4. LAYOUT (Estructura del sitio)
   ======================================== */
/**
 * ========================================
 * ESTILOS DEL HEADER
 * ========================================
 * Navegación principal, me header, animaciones
 */
header {
  z-index: 9999;
  position: fixed;
  top: 0;
  padding: 1.25rem 0;
  width: 100%;
  background: linear-gradient(to bottom, rgba(0, 0, 0, 0.5) 0%, rgba(0, 0, 0, 0) 100%);
  transition: background-color 0.3s ease-in-out, box-shadow 0.3s ease-in-out;
  /* ========================================
     ANIMACIONES DEL HEADER
     ======================================== */
}
header.header-hiding {
  transform: translateY(-100%);
  transition: transform 0.3s ease-in-out;
}
header.header-showing {
  transform: translateY(-100%);
  animation: slideDown 0.3s ease-in-out forwards;
}
@keyframes slideDown {
  from {
    transform: translateY(-100%);
  }
  to {
    transform: translateY(0);
  }
}
header {
  /* ========================================
     HEADER CON SCROLL
     ======================================== */
}
header.header-scroll {
  background: none;
  background-color: #fff;
  backdrop-filter: none;
  box-shadow: 0 0.125rem 0.625rem rgba(0, 0, 0, 0.1);
}
header.header-scroll ul li a {
  color: #100E0F;
}
header.header-scroll ul li a:hover {
  color: #BB0825;
}
header.header-scroll ul li:hover a {
  color: #BB0825;
}
header.header-scroll ul li.current-menu-item > a, header.header-scroll ul li.current_page_item > a, header.header-scroll ul li.current_page_parent > a, header.header-scroll ul li.current-menu-ancestor > a {
  color: #100E0F;
  border-bottom-color: #100E0F;
}
header.header-scroll ul li .sub-menu li a {
  color: #100E0F;
}
header.header-scroll ul li .sub-menu li a:hover {
  color: #BB0825;
}
header.header-scroll .mobile-menu-toggle svg line {
  stroke: #100E0F;
}
header.header-scroll .logo-default-wrapper {
  display: none;
}
header.header-scroll .logo-scroll-wrapper {
  display: block;
}
header {
  /* ========================================
     LOGOS
     ======================================== */
}
header .logo-container {
  position: relative;
}
header .logo-default-wrapper {
  display: block;
  transition: opacity 0.3s ease-in-out;
}
header .logo-scroll-wrapper {
  display: none;
  transition: opacity 0.3s ease-in-out;
}
header .logo-single-wrapper {
  display: block;
}
header .logo, header .custom-logo {
  max-width: 7rem;
  opacity: 1;
}
header .logo.visible, header .custom-logo.visible {
  display: block;
  opacity: 1;
  transition: all 0.5s ease-in-out;
}
header {
  /* ========================================
     MEN DESKTOP
     ======================================== */
}
header ul {
  list-style-type: none;
  padding: 0;
  margin: 0;
  display: inline-flex;
  flex-direction: row;
  gap: 3rem;
}
header ul li {
  display: inline-block;
  align-self: center;
  cursor: pointer;
}
header ul li .sub-menu {
  display: none;
  position: absolute;
  box-shadow: 0 0.3125rem 0.9375rem rgba(0, 0, 0, 0.15);
  background-color: #fff;
}
header ul li .sub-menu li {
  display: block;
}
header ul li .sub-menu li a {
  padding: 0.1875rem 0;
}
header ul li .sub-menu li a:hover {
  text-decoration: underline;
}
header ul li:hover .sub-menu {
  display: block;
}
header ul li a {
  font-family: "bricolage grotesque", sans-serif;
  display: inline-block;
  padding: 0.3125rem 0;
  text-align: center;
  font-size: 1rem;
  font-style: normal;
  font-weight: 400;
  line-height: 1.5625rem;
  color: #fff;
}
header ul li a:hover {
  color: #fff;
}
header ul li:hover a {
  text-decoration: none;
  color: #fff;
}
header ul li.current-menu-item > a, header ul li.current_page_parent > a, header ul li.current-menu-ancestor > a {
  font-weight: 700;
}
header ul li.current_page_item > a {
  color: #fff;
  border-bottom: 1px solid #fff;
}
header {
  /* ========================================
     HAMBURGER ICON
     ======================================== */
}
header #toggle span,
header #toggle span:after,
header #toggle span:before {
  background-color: #fff;
}
header #toggle.on span {
  background-color: transparent;
}
header #toggle.on span:after,
header #toggle.on span:before {
  background-color: #fff;
}
header.bg-menu #toggle span,
header.bg-menu #toggle span:after,
header.bg-menu #toggle span:before {
  background-color: #fff;
}
header.bg-menu #toggle.on span {
  background-color: transparent;
}
header.bg-menu #toggle.on span:after,
header.bg-menu #toggle.on span:before {
  background-color: #fff;
}
header {
  /* ========================================
     MENÚ MÓVIL
     ======================================== */
}
header .mobile-menu {
  position: absolute;
  inset: 0px;
  background-color: rgba(0, 0, 0, 0.4);
  right: 0;
  width: 100%;
  top: 0;
  min-height: 100vh;
  transition: all 0.5s ease-in;
  z-index: 50;
  text-align: right;
  left: auto;
  display: flex;
  flex-direction: column;
  padding-top: 3.125rem;
  overflow-x: auto;
  max-width: 0;
  width: 100dvw;
  padding: 0;
  backdrop-filter: blur(1.875rem);
}
header .mobile-menu .mobile-menu-close {
  position: absolute;
  top: 1.875rem;
  right: 2rem;
  z-index: 1000;
}
header .mobile-menu ul {
  padding: 0 !important;
  gap: 0;
}
header .mobile-menu ul li {
  align-self: self-start;
  padding: 1.25rem;
  width: 100%;
}
header .mobile-menu ul li > a {
  display: flex;
  font-size: 1.3rem;
  font-weight: 500;
  padding: 0.1875rem 0;
  position: relative;
  color: #fff;
  opacity: 0;
  transition: all 0.8s ease-in-out;
}
header .mobile-menu ul li.current_page_item > a {
  border: 0;
}
header .mobile-menu ul li .sub-menu {
  display: flex;
  flex-direction: column;
  margin-bottom: 0;
  gap: 0;
  margin-left: 0.1875rem;
  margin-top: 0;
  padding-left: 0.3125rem !important;
}
header .mobile-menu ul li .sub-menu li a {
  font-size: 1rem;
  padding: 0.1875rem 0;
  font-weight: 500;
  display: inline-flex;
  align-items: center;
  gap: 0.3125rem;
}
header .mobile-menu ul li .sub-menu li a::before {
  content: "";
  width: 0.9375rem;
  height: 1px;
  background-color: #100E0F;
}
header .mobile-menu ul li:hover > a {
  position: relative;
}
header .mobile-menu ul li:hover li.current-menu-item a::after {
  display: none;
}
header .mobile-menu ul li.current-menu-item > a {
  position: relative;
}
header .mobile-menu ul li.current-menu-item li.current-menu-item a::after {
  display: none;
}
header .mobile-menu.active {
  max-width: 100%;
  width: 100dvw;
}
header .mobile-menu.active a {
  opacity: 1;
}
header {
  /* ========================================
     TOGGLE BUTTONS
     ======================================== */
}
header #toggle,
header #toggle-x {
  display: block;
  width: 2.625rem;
  height: 2.625rem;
  border-radius: 6.25rem;
  padding: 0.75rem;
}
header #toggle-x {
  position: absolute;
  top: 1.25rem;
  right: 1.25rem;
}
header #toggle span:after,
header #toggle span:before,
header #toggle-x span:after,
header #toggle-x span:before {
  content: "";
  position: absolute;
  left: 0;
  top: -0.4375rem;
}
header #toggle span:after,
header #toggle-x span:after {
  top: 0.4375rem;
}
header #toggle span,
header #toggle-x span {
  position: relative;
  display: block;
  top: 0.5rem;
}
header #toggle span,
header #toggle span:after,
header #toggle span:before,
header #toggle-x span,
header #toggle-x span:after,
header #toggle-x span:before {
  width: 1.125rem;
  height: 0.125rem;
  background-color: #fff;
  transition: all 0.3s;
  backface-visibility: hidden;
  border-radius: 0;
}
header #toggle.on span,
header #toggle-x.on span {
  background-color: transparent;
}
header #toggle.on span:before,
header #toggle-x.on span:before {
  transform: rotate(45deg) translate(0.25rem, 0.25rem);
  background-color: #fff;
}
header #toggle.on span:after,
header #toggle-x.on span:after {
  transform: rotate(-45deg) translate(0.375rem, -0.375rem);
  background-color: #fff;
}
header #toggle + #menu,
header #toggle-x + #menu {
  opacity: 0;
  visibility: hidden;
}
header #toggle.on + #menu,
header #toggle-x.on + #menu {
  opacity: 1;
  visibility: visible;
}
header {
  /* ========================================
     RESPONSIVE MÓVIL
     ======================================== */
}
@media (max-width: 768px) {
  header .mobile-menu {
    padding-top: 1.875rem;
  }
  header .mobile-menu li {
    position: relative;
  }
  header .mobile-menu li.menu-item-has-children::after {
    content: "↓";
    position: absolute;
    top: 0.9375rem;
    right: 0.9375rem;
    color: #fff;
  }
  header .mobile-menu li a {
    padding: 0.9375rem 0;
    display: block;
    color: #fff;
    text-align: center;
  }
  header .mobile-menu li .sub-menu {
    display: none;
    position: relative;
  }
  header .mobile-menu li .sub-menu li {
    display: block;
    border: 0;
  }
  header .mobile-menu li .sub-menu li a {
    border: 0;
    padding-left: 0.625rem;
    color: #858585;
  }
  header .mobile-menu li:hover > .sub-menu {
    display: block;
  }
}

/* ========================================
   HEADER EN PÁGINAS SINGLE
   ======================================== */
.single header {
  background: #fff;
  box-shadow: 0 0.125rem 0.625rem rgba(0, 0, 0, 0.1);
}
.single header.header-scroll {
  background-color: #fff;
  backdrop-filter: none;
}
.single header ul li a {
  color: #100E0F;
}
.single header ul li a:hover {
  color: #BB0825;
}
.single header ul li:hover a {
  color: #BB0825;
}
.single header ul li.current-menu-item > a, .single header ul li.current_page_item > a, .single header ul li.current_page_parent > a, .single header ul li.current-menu-ancestor > a {
  color: #100E0F;
  border-bottom-color: #100E0F;
}
.single header ul li .sub-menu li a {
  color: #100E0F;
}
.single header ul li .sub-menu li a:hover {
  color: #BB0825;
}
.single header .mobile-menu-toggle svg line {
  stroke: #100E0F;
}
.single header .mobile-menu .mobile-menu-close line {
  stroke: #fff;
}

/**
 * ========================================
 * ESTILOS DEL FOOTER
 * ========================================
 * Footer principal, menús, contacto y legal
 */
footer {
  padding-top: 2.87rem;
  padding-bottom: 1.5rem;
  background-color: #FCFCFC;
  /* ========================================
     FOOTER MAIN SECTION
     ======================================== */
}
footer .footer-main {
  margin-bottom: 2.5rem;
}
footer {
  /* ========================================
     LOGO Y MARCA
     ======================================== */
}
footer .footer-brand {
  display: flex;
  flex-direction: row;
  gap: 2.55rem;
  flex-wrap: nowrap;
}
footer .footer-brand .info-footer {
  display: flex;
  flex-direction: column;
  gap: 0.88rem;
}
footer .footer-brand .footer-logo-link {
  display: inline-block;
  margin-bottom: 0.9375rem;
}
footer .footer-brand .footer-logo-link .logo {
  height: 6.8rem;
  width: auto;
}
footer .footer-brand .footer-title {
  font-size: 1.125rem;
  font-weight: 600;
  line-height: 1.3rem;
  color: #100E0F;
  margin-bottom: 0;
  margin-top: 0;
}
footer .footer-brand .footer-tagline {
  font-size: 0.875rem;
  color: #100E0F;
  line-height: 1.5;
  margin-bottom: 0;
  max-width: 18.75rem;
}
footer .footer-brand .footer-whatsapp {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 2.5rem;
  height: 2.5rem;
  border-radius: 50%;
  transition: all 0.3s ease;
}
footer .footer-brand .footer-whatsapp svg {
  width: 1.5rem;
  height: 1.5rem;
}
footer .footer-brand .footer-whatsapp:hover {
  background-color: #F5F5F5;
  transform: scale(1.1);
}
footer {
  /* ========================================
     MENÚ FOOTER
     ======================================== */
}
footer .footer-menu .footer-section-title {
  display: block;
  font-size: 1.25rem;
  line-height: 1.3rem;
  font-weight: 500;
  color: #BB0825;
  margin-bottom: 0.88rem;
  margin-top: 0;
}
footer .footer-menu .footer-nav .footer-menu-list {
  list-style: none;
  padding: 0;
  margin: 0;
}
footer .footer-menu .footer-nav .footer-menu-list li {
  margin-bottom: 0.69rem;
}
footer .footer-menu .footer-nav .footer-menu-list li a {
  font-size: 0.875rem;
  color: #100E0F;
  text-decoration: none;
  transition: color 0.3s ease;
  display: inline-block;
}
footer .footer-menu .footer-nav .footer-menu-list li a:hover {
  color: #BB0825;
}
footer {
  /* ========================================
     CONTACTO FOOTER
     ======================================== */
}
footer .footer-contact .footer-section-title {
  display: block;
  font-size: 1.25rem;
  line-height: 1.3rem;
  font-weight: 500;
  color: #BB0825;
  margin-bottom: 0.88rem;
  margin-top: 0;
}
footer .footer-contact .footer-contact-info p, footer .footer-contact .footer-contact-info li {
  font-size: 0.875rem;
  color: #100E0F;
  margin-bottom: 0.5rem;
  line-height: 1.6;
}
footer .footer-contact .footer-contact-info .footer-address {
  margin-bottom: 0.75rem;
}
footer .footer-contact .footer-contact-info .footer-phone {
  font-weight: 500;
  margin-bottom: 0;
}
footer {
  /* ========================================
     DIVISOR
     ======================================== */
}
footer .footer-divider {
  border: 0;
  border-top: 1px solid #D9D9D9;
  margin: 1.5rem 0;
}
footer {
  /* ========================================
     FOOTER BOTTOM (COPYRIGHT Y LEGAL)
     ======================================== */
}
footer .footer-bottom .footer-copyright p, footer .footer-bottom .footer-copyright li {
  font-size: 0.875rem;
  color: #100E0F;
  margin: 0;
}
footer .footer-bottom .footer-legal .legal-menu,
footer .footer-bottom .footer-legal .legal-menu-list {
  margin: 0;
  padding: 0;
  list-style: none;
}
footer .footer-bottom .footer-legal .legal-menu-list {
  display: flex;
  justify-content: flex-end;
  gap: 1.5625rem;
  flex-wrap: wrap;
}
footer .footer-bottom .footer-legal .legal-menu-list li {
  margin: 0;
}
footer .footer-bottom .footer-legal .legal-menu-list li a {
  font-size: 0.875rem;
  color: #100E0F;
  text-decoration: none;
  transition: color 0.3s ease;
}
footer .footer-bottom .footer-legal .legal-menu-list li a:hover {
  color: #BB0825;
}
footer {
  /* ========================================
     ESTILOS LEGACY (COMPATIBILIDAD)
     ======================================== */
}
footer .logo {
  height: 3rem;
}
footer .xarxes {
  display: flex;
  gap: 1.25rem;
}
footer .xarxes img {
  width: 2.1875rem;
}
footer .titular li a {
  font-weight: 300;
}
footer .titular li:first-child a {
  font-weight: 500;
}
footer {
  /* ========================================
     RESPONSIVE
     ======================================== */
}
@media (max-width: 991px) {
  footer .footer-menu .footer-section-title,
  footer .footer-contact .footer-section-title {
    margin-top: 1.25rem;
  }
}
@media (max-width: 768px) {
  footer {
    padding-top: 2.5rem;
    padding-bottom: 1.875rem;
  }
  footer .footer-bottom .footer-legal {
    margin-top: 1.25rem;
  }
  footer .footer-bottom .footer-legal .legal-menu-list {
    justify-content: center;
  }
}

/**
 * ========================================
 * LAYOUT Y PÁGINAS ESPECÍFICAS
 * ========================================
 * Layouts globales, top-page, home, etc.
 */
/* ========================================
   TOP PAGE (CABECERA DE PÁGINA)
   ======================================== */
.top-page {
  display: flex;
  align-items: center;
  height: 19.375rem;
  position: relative;
  border-bottom: 1px solid #D4D4D4;
}
.top-page .page-header {
  display: flex;
  flex-direction: column;
  gap: 0.6rem;
}
.top-page .container {
  z-index: 1;
}
.top-page h1 {
  color: #BB0825;
  margin-top: 0;
}
.top-page h1 span {
  color: #858585;
  font-weight: bold;
}
.top-page .preheader {
  color: #ABBCC4;
  font-size: 0.9375rem;
  font-style: normal;
  font-weight: 700;
  line-height: normal;
}
.top-page .header-text {
  color: #494E51;
  font-size: 0.9375rem;
  font-style: normal;
  font-weight: 400;
  line-height: 1.375rem;
}
@media (max-width: 768px) {
  .top-page {
    height: 13.75rem;
  }
  .top-page h1 {
    font-size: 2.5rem;
    line-height: 1.1em !important;
  }
}

/* ========================================
   HOME BACKGROUND
   ======================================== */
.bg-home {
  position: relative;
}
.bg-home::after {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  bottom: 0;
  width: 50%;
  height: 100%;
  background-color: #004775;
  mix-blend-mode: hard-light;
  z-index: 0;
}
.bg-home h1, .bg-home p, .bg-home li {
  color: #fff;
}
@media (max-width: 768px) {
  .bg-home::after {
    width: 100%;
    height: 100%;
  }
}

/* ========================================
   HEADER SECTION
   ======================================== */
.header-section {
  margin-top: 15rem;
  margin-bottom: 7.4rem;
}

/* ========================================
   CTA FOOTER
   ======================================== */
.cta-footer {
  background-color: #212121;
  background-image: url("../img/cta-bg.jpg");
  background-size: cover;
  background-position: center;
  padding: 6.25rem 0;
  position: relative;
}
.cta-footer h2 {
  color: #fff;
  font-weight: bold;
}
.cta-footer p, .cta-footer li {
  color: #fff;
  margin: 1.5625rem auto;
}
.cta-footer .button-line {
  border-color: #fff;
  color: #fff;
}
.cta-footer .button-line span {
  color: #fff;
}
.cta-footer .button-alternatiu, .cta-footer .button-alternatiu-ele a, .button-alternatiu-ele .cta-footer a {
  margin: auto;
}
.cta-footer .button-alternatiu:hover, .cta-footer .button-alternatiu-ele a:hover, .button-alternatiu-ele .cta-footer a:hover {
  color: #000;
}

/* ========================================
   PROJECT LIST
   ======================================== */
.project-list {
  position: relative;
}
.project-list .project-item {
  position: relative;
}
.project-list .project-item h2 {
  opacity: 0;
  color: #fff;
  font-size: 1.4rem;
  font-weight: bold;
  top: 0;
  padding: 1.875rem;
  position: absolute;
  left: 0;
  width: 100%;
  height: 100%;
  justify-content: center;
  align-items: center;
  display: flex;
  background: rgba(0, 0, 0, 0.7);
  transition: all 0.5s ease-in-out;
}
.project-list .project-item:hover h2 {
  opacity: 1;
}

/* ========================================
   UN TALLER (SECCIÓN ESPECÍFICA)
   ======================================== */
.un-taller .horari {
  color: #100E0F;
  font-size: 1rem;
  font-style: normal;
  font-weight: 500;
}

/* ========================================
   PRODUCTO (TABLA Y DETALLES)
   ======================================== */
.img-producto {
  mix-blend-mode: multiply;
}
.img-producto img {
  position: sticky;
  top: 3.125rem;
}

.unproducto h3 {
  color: #858585;
  font-size: 1.4rem;
  font-weight: bold;
  margin-top: 1.25rem;
  margin-bottom: 1.25rem;
}
.unproducto .table-responsive {
  width: 100%;
  overflow-x: auto;
}
.unproducto table {
  width: 100%;
}
.unproducto table td {
  padding: 0.625rem 0.9375rem;
  text-align: center;
  border: 0.125rem solid #f1f1f1;
  background: #fff;
  align-items: center;
}
.unproducto table td p, .unproducto table td li {
  font-size: 0.8rem;
  margin: 0;
}
.unproducto table tr:first-child td {
  color: #858585;
}

/* ========================================
   5. MÓDULOS ESPECÍFICOS
   ======================================== */
/**
 * Estilos de botones globales del tema
 * Se aplican a todos los botones del sitio (tema y plugins)
 */
.btn-primary {
  display: inline-flex;
  align-items: center;
  padding: 0.56rem 1.25rem;
  background-color: #BB0825;
  color: #fff;
  text-decoration: none;
  gap: 0.5rem;
  border-radius: 0.5rem;
  font-weight: 500;
  transition: background-color 0.3s ease, transform 0.2s ease;
  white-space: nowrap;
  width: -moz-fit-content;
  width: fit-content;
}
.btn-primary:hover {
  background-color: #9a0620;
  color: #fff;
  /*transform: translateY(-2px);*/
}

.last-news-widget-button,
.list-post-type-button {
  display: inline-flex;
  align-items: center;
  padding: 0.56rem 1.25rem;
  background-color: #BB0825;
  color: #fff;
  text-decoration: none;
  gap: 0.5rem;
  border-radius: 0.5rem;
  font-weight: 500;
  transition: background-color 0.3s ease, transform 0.2s ease;
  white-space: nowrap;
  width: -moz-fit-content;
  width: fit-content;
}
.last-news-widget-button:hover,
.list-post-type-button:hover {
  background-color: #9a0620;
  color: #fff;
  /*transform: translateY(-2px);*/
}

.post-type-card-button {
  display: inline-flex;
  align-items: center;
  padding: 0.56rem 1.25rem;
  background-color: #BB0825;
  color: #fff;
  text-decoration: none;
  gap: 0.5rem;
  border-radius: 0.5rem;
  font-weight: 500;
  transition: background-color 0.3s ease, transform 0.2s ease;
  white-space: nowrap;
  width: -moz-fit-content;
  width: fit-content;
}
.post-type-card-button:hover {
  background-color: #9a0620;
  color: #fff;
  /*transform: translateY(-2px);*/
}
.post-type-card-button {
  /*justify-content: center;
  padding: 0.875rem 1.5rem;
  font-weight: 600;
  font-size: 1rem;*/
  margin-top: auto;
}

.btn-solicitar {
  display: inline-flex;
  align-items: center;
  padding: 0.56rem 1.25rem;
  background-color: #BB0825;
  color: #fff;
  text-decoration: none;
  gap: 0.5rem;
  border-radius: 0.5rem;
  font-weight: 500;
  transition: background-color 0.3s ease, transform 0.2s ease;
  white-space: nowrap;
  width: -moz-fit-content;
  width: fit-content;
}
.btn-solicitar:hover {
  background-color: #9a0620;
  color: #fff;
  /*transform: translateY(-2px);*/
}
.btn-solicitar {
  /*justify-content: center;
  padding: 1rem 2rem;
  font-weight: 600;
  font-size: 1rem;
  border: none;
  cursor: pointer;*/
}

/**
 * Estilos del formulario de contacto
 * Reutilizable en cualquier parte del sitio
 * Las variables, mixins y componentes base están en _variables.scss, _mixins.scss y _components.scss
 */
.contact-form-section {
  padding: 5rem 0;
  background-color: #fff;
}

.contact-form-wrapper {
  position: relative;
  background-image: url("../img/logo-fondo.png");
  background-position: center;
  background-repeat: no-repeat;
  background-size: contain;
}

.contact-form-header {
  text-align: left;
  padding-right: 6rem;
  padding-top: 1.5rem;
}

.contact-form-subtitle {
  font-size: 1rem;
  color: #858585;
  margin: 0;
}

.contact-form-content {
  background-color: transparent;
}
.contact-form-content .wpforms-field-medium {
  max-width: 100% !important;
}

.wpforms-container input.wpforms-field-medium {
  max-width: 100% !important;
}

div.wpforms-container-full input[type=date], div.wpforms-container-full input[type=datetime], div.wpforms-container-full input[type=datetime-local], div.wpforms-container-full input[type=email], div.wpforms-container-full input[type=month], div.wpforms-container-full input[type=number], div.wpforms-container-full input[type=password], div.wpforms-container-full input[type=range], div.wpforms-container-full input[type=search], div.wpforms-container-full input[type=tel], div.wpforms-container-full input[type=text], div.wpforms-container-full input[type=time], div.wpforms-container-full input[type=url], div.wpforms-container-full input[type=week], div.wpforms-container-full select, div.wpforms-container-full textarea, .wp-core-ui div.wpforms-container-full input[type=date], .wp-core-ui div.wpforms-container-full input[type=datetime], .wp-core-ui div.wpforms-container-full input[type=datetime-local], .wp-core-ui div.wpforms-container-full input[type=email], .wp-core-ui div.wpforms-container-full input[type=month], .wp-core-ui div.wpforms-container-full input[type=number], .wp-core-ui div.wpforms-container-full input[type=password], .wp-core-ui div.wpforms-container-full input[type=range], .wp-core-ui div.wpforms-container-full input[type=search], .wp-core-ui div.wpforms-container-full input[type=tel], .wp-core-ui div.wpforms-container-full input[type=text], .wp-core-ui div.wpforms-container-full input[type=time], .wp-core-ui div.wpforms-container-full input[type=url], .wp-core-ui div.wpforms-container-full input[type=week], .wp-core-ui div.wpforms-container-full select, .wp-core-ui div.wpforms-container-full textarea {
  border-bottom: 1px solid #D9D9D9 !important;
  padding-left: 0px !important;
  color: #000 !important;
}
div.wpforms-container-full input[type=date]::-moz-placeholder, div.wpforms-container-full input[type=datetime]::-moz-placeholder, div.wpforms-container-full input[type=datetime-local]::-moz-placeholder, div.wpforms-container-full input[type=email]::-moz-placeholder, div.wpforms-container-full input[type=month]::-moz-placeholder, div.wpforms-container-full input[type=number]::-moz-placeholder, div.wpforms-container-full input[type=password]::-moz-placeholder, div.wpforms-container-full input[type=range]::-moz-placeholder, div.wpforms-container-full input[type=search]::-moz-placeholder, div.wpforms-container-full input[type=tel]::-moz-placeholder, div.wpforms-container-full input[type=text]::-moz-placeholder, div.wpforms-container-full input[type=time]::-moz-placeholder, div.wpforms-container-full input[type=url]::-moz-placeholder, div.wpforms-container-full input[type=week]::-moz-placeholder, div.wpforms-container-full select::-moz-placeholder, div.wpforms-container-full textarea::-moz-placeholder, .wp-core-ui div.wpforms-container-full input[type=date]::-moz-placeholder, .wp-core-ui div.wpforms-container-full input[type=datetime]::-moz-placeholder, .wp-core-ui div.wpforms-container-full input[type=datetime-local]::-moz-placeholder, .wp-core-ui div.wpforms-container-full input[type=email]::-moz-placeholder, .wp-core-ui div.wpforms-container-full input[type=month]::-moz-placeholder, .wp-core-ui div.wpforms-container-full input[type=number]::-moz-placeholder, .wp-core-ui div.wpforms-container-full input[type=password]::-moz-placeholder, .wp-core-ui div.wpforms-container-full input[type=range]::-moz-placeholder, .wp-core-ui div.wpforms-container-full input[type=search]::-moz-placeholder, .wp-core-ui div.wpforms-container-full input[type=tel]::-moz-placeholder, .wp-core-ui div.wpforms-container-full input[type=text]::-moz-placeholder, .wp-core-ui div.wpforms-container-full input[type=time]::-moz-placeholder, .wp-core-ui div.wpforms-container-full input[type=url]::-moz-placeholder, .wp-core-ui div.wpforms-container-full input[type=week]::-moz-placeholder, .wp-core-ui div.wpforms-container-full select::-moz-placeholder, .wp-core-ui div.wpforms-container-full textarea::-moz-placeholder {
  color: #d9d9d9 !important;
}
div.wpforms-container-full input[type=date]::placeholder, div.wpforms-container-full input[type=datetime]::placeholder, div.wpforms-container-full input[type=datetime-local]::placeholder, div.wpforms-container-full input[type=email]::placeholder, div.wpforms-container-full input[type=month]::placeholder, div.wpforms-container-full input[type=number]::placeholder, div.wpforms-container-full input[type=password]::placeholder, div.wpforms-container-full input[type=range]::placeholder, div.wpforms-container-full input[type=search]::placeholder, div.wpforms-container-full input[type=tel]::placeholder, div.wpforms-container-full input[type=text]::placeholder, div.wpforms-container-full input[type=time]::placeholder, div.wpforms-container-full input[type=url]::placeholder, div.wpforms-container-full input[type=week]::placeholder, div.wpforms-container-full select::placeholder, div.wpforms-container-full textarea::placeholder, .wp-core-ui div.wpforms-container-full input[type=date]::placeholder, .wp-core-ui div.wpforms-container-full input[type=datetime]::placeholder, .wp-core-ui div.wpforms-container-full input[type=datetime-local]::placeholder, .wp-core-ui div.wpforms-container-full input[type=email]::placeholder, .wp-core-ui div.wpforms-container-full input[type=month]::placeholder, .wp-core-ui div.wpforms-container-full input[type=number]::placeholder, .wp-core-ui div.wpforms-container-full input[type=password]::placeholder, .wp-core-ui div.wpforms-container-full input[type=range]::placeholder, .wp-core-ui div.wpforms-container-full input[type=search]::placeholder, .wp-core-ui div.wpforms-container-full input[type=tel]::placeholder, .wp-core-ui div.wpforms-container-full input[type=text]::placeholder, .wp-core-ui div.wpforms-container-full input[type=time]::placeholder, .wp-core-ui div.wpforms-container-full input[type=url]::placeholder, .wp-core-ui div.wpforms-container-full input[type=week]::placeholder, .wp-core-ui div.wpforms-container-full select::placeholder, .wp-core-ui div.wpforms-container-full textarea::placeholder {
  color: #d9d9d9 !important;
}
div.wpforms-container-full input[type=date]::-webkit-input-placeholder, div.wpforms-container-full input[type=datetime]::-webkit-input-placeholder, div.wpforms-container-full input[type=datetime-local]::-webkit-input-placeholder, div.wpforms-container-full input[type=email]::-webkit-input-placeholder, div.wpforms-container-full input[type=month]::-webkit-input-placeholder, div.wpforms-container-full input[type=number]::-webkit-input-placeholder, div.wpforms-container-full input[type=password]::-webkit-input-placeholder, div.wpforms-container-full input[type=range]::-webkit-input-placeholder, div.wpforms-container-full input[type=search]::-webkit-input-placeholder, div.wpforms-container-full input[type=tel]::-webkit-input-placeholder, div.wpforms-container-full input[type=text]::-webkit-input-placeholder, div.wpforms-container-full input[type=time]::-webkit-input-placeholder, div.wpforms-container-full input[type=url]::-webkit-input-placeholder, div.wpforms-container-full input[type=week]::-webkit-input-placeholder, div.wpforms-container-full select::-webkit-input-placeholder, div.wpforms-container-full textarea::-webkit-input-placeholder, .wp-core-ui div.wpforms-container-full input[type=date]::-webkit-input-placeholder, .wp-core-ui div.wpforms-container-full input[type=datetime]::-webkit-input-placeholder, .wp-core-ui div.wpforms-container-full input[type=datetime-local]::-webkit-input-placeholder, .wp-core-ui div.wpforms-container-full input[type=email]::-webkit-input-placeholder, .wp-core-ui div.wpforms-container-full input[type=month]::-webkit-input-placeholder, .wp-core-ui div.wpforms-container-full input[type=number]::-webkit-input-placeholder, .wp-core-ui div.wpforms-container-full input[type=password]::-webkit-input-placeholder, .wp-core-ui div.wpforms-container-full input[type=range]::-webkit-input-placeholder, .wp-core-ui div.wpforms-container-full input[type=search]::-webkit-input-placeholder, .wp-core-ui div.wpforms-container-full input[type=tel]::-webkit-input-placeholder, .wp-core-ui div.wpforms-container-full input[type=text]::-webkit-input-placeholder, .wp-core-ui div.wpforms-container-full input[type=time]::-webkit-input-placeholder, .wp-core-ui div.wpforms-container-full input[type=url]::-webkit-input-placeholder, .wp-core-ui div.wpforms-container-full input[type=week]::-webkit-input-placeholder, .wp-core-ui div.wpforms-container-full select::-webkit-input-placeholder, .wp-core-ui div.wpforms-container-full textarea::-webkit-input-placeholder {
  color: #d9d9d9 !important;
}
div.wpforms-container-full input[type=date]::-moz-placeholder, div.wpforms-container-full input[type=datetime]::-moz-placeholder, div.wpforms-container-full input[type=datetime-local]::-moz-placeholder, div.wpforms-container-full input[type=email]::-moz-placeholder, div.wpforms-container-full input[type=month]::-moz-placeholder, div.wpforms-container-full input[type=number]::-moz-placeholder, div.wpforms-container-full input[type=password]::-moz-placeholder, div.wpforms-container-full input[type=range]::-moz-placeholder, div.wpforms-container-full input[type=search]::-moz-placeholder, div.wpforms-container-full input[type=tel]::-moz-placeholder, div.wpforms-container-full input[type=text]::-moz-placeholder, div.wpforms-container-full input[type=time]::-moz-placeholder, div.wpforms-container-full input[type=url]::-moz-placeholder, div.wpforms-container-full input[type=week]::-moz-placeholder, div.wpforms-container-full select::-moz-placeholder, div.wpforms-container-full textarea::-moz-placeholder, .wp-core-ui div.wpforms-container-full input[type=date]::-moz-placeholder, .wp-core-ui div.wpforms-container-full input[type=datetime]::-moz-placeholder, .wp-core-ui div.wpforms-container-full input[type=datetime-local]::-moz-placeholder, .wp-core-ui div.wpforms-container-full input[type=email]::-moz-placeholder, .wp-core-ui div.wpforms-container-full input[type=month]::-moz-placeholder, .wp-core-ui div.wpforms-container-full input[type=number]::-moz-placeholder, .wp-core-ui div.wpforms-container-full input[type=password]::-moz-placeholder, .wp-core-ui div.wpforms-container-full input[type=range]::-moz-placeholder, .wp-core-ui div.wpforms-container-full input[type=search]::-moz-placeholder, .wp-core-ui div.wpforms-container-full input[type=tel]::-moz-placeholder, .wp-core-ui div.wpforms-container-full input[type=text]::-moz-placeholder, .wp-core-ui div.wpforms-container-full input[type=time]::-moz-placeholder, .wp-core-ui div.wpforms-container-full input[type=url]::-moz-placeholder, .wp-core-ui div.wpforms-container-full input[type=week]::-moz-placeholder, .wp-core-ui div.wpforms-container-full select::-moz-placeholder, .wp-core-ui div.wpforms-container-full textarea::-moz-placeholder {
  color: #d9d9d9 !important;
}
div.wpforms-container-full input[type=date]:-ms-input-placeholder, div.wpforms-container-full input[type=datetime]:-ms-input-placeholder, div.wpforms-container-full input[type=datetime-local]:-ms-input-placeholder, div.wpforms-container-full input[type=email]:-ms-input-placeholder, div.wpforms-container-full input[type=month]:-ms-input-placeholder, div.wpforms-container-full input[type=number]:-ms-input-placeholder, div.wpforms-container-full input[type=password]:-ms-input-placeholder, div.wpforms-container-full input[type=range]:-ms-input-placeholder, div.wpforms-container-full input[type=search]:-ms-input-placeholder, div.wpforms-container-full input[type=tel]:-ms-input-placeholder, div.wpforms-container-full input[type=text]:-ms-input-placeholder, div.wpforms-container-full input[type=time]:-ms-input-placeholder, div.wpforms-container-full input[type=url]:-ms-input-placeholder, div.wpforms-container-full input[type=week]:-ms-input-placeholder, div.wpforms-container-full select:-ms-input-placeholder, div.wpforms-container-full textarea:-ms-input-placeholder, .wp-core-ui div.wpforms-container-full input[type=date]:-ms-input-placeholder, .wp-core-ui div.wpforms-container-full input[type=datetime]:-ms-input-placeholder, .wp-core-ui div.wpforms-container-full input[type=datetime-local]:-ms-input-placeholder, .wp-core-ui div.wpforms-container-full input[type=email]:-ms-input-placeholder, .wp-core-ui div.wpforms-container-full input[type=month]:-ms-input-placeholder, .wp-core-ui div.wpforms-container-full input[type=number]:-ms-input-placeholder, .wp-core-ui div.wpforms-container-full input[type=password]:-ms-input-placeholder, .wp-core-ui div.wpforms-container-full input[type=range]:-ms-input-placeholder, .wp-core-ui div.wpforms-container-full input[type=search]:-ms-input-placeholder, .wp-core-ui div.wpforms-container-full input[type=tel]:-ms-input-placeholder, .wp-core-ui div.wpforms-container-full input[type=text]:-ms-input-placeholder, .wp-core-ui div.wpforms-container-full input[type=time]:-ms-input-placeholder, .wp-core-ui div.wpforms-container-full input[type=url]:-ms-input-placeholder, .wp-core-ui div.wpforms-container-full input[type=week]:-ms-input-placeholder, .wp-core-ui div.wpforms-container-full select:-ms-input-placeholder, .wp-core-ui div.wpforms-container-full textarea:-ms-input-placeholder {
  color: #d9d9d9 !important;
}

div.wpforms-container-full input[type=checkbox]::before, div.wpforms-container-full input[type=radio]::before {
  border: 1px solid #D9D9D9 !important;
}

div.wpforms-container-full button[type=submit],
div.wpforms-container-full input[type=submit] {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  position: relative;
  padding-right: 2.5rem !important;
}
div.wpforms-container-full button[type=submit]::after,
div.wpforms-container-full input[type=submit]::after {
  content: "";
  display: inline-block;
  width: 14px;
  height: 12px;
  background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="14" height="12" viewBox="0 0 14 12" fill="none"><path d="M7.41489 0.5L13.5 6M13.5 6L7.41489 11.5M13.5 6H0.5" stroke="white" stroke-linecap="round" stroke-linejoin="round"/></svg>');
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
  position: absolute;
  right: 1rem;
}

@media (max-width: 991px) {
  .contact-form-section {
    padding: 3.75rem 0;
  }
  .contact-form-wrapper {
    background-size: 60%;
  }
  .contact-form-title {
    font-size: 1.75rem;
  }
  .contact-form-content {
    padding: 1.875rem;
  }
}
@media (max-width: 768px) {
  .contact-form-section {
    padding: 2.5rem 0;
  }
  .contact-form-wrapper {
    background-size: 80%;
    padding: 1.25rem 0;
  }
  .contact-form-header {
    text-align: center;
    padding: 0;
  }
  .contact-form-title {
    font-size: 1.5rem;
  }
  .contact-form-subtitle {
    font-size: 0.9rem;
  }
  .contact-form-content {
    padding: 1.5rem 1.25rem;
  }
  .wpforms-container .wpforms-field.wpforms-one-half {
    width: 100% !important;
    margin-left: 0 !important;
  }
}
/* ========================================
   6. PÁGINAS Y PLANTILLAS
   ======================================== */
/**
 * Estilos para archive de furgonetas
 * Incluye hero con imagen de fondo y filtros AJAX
 * Las variables, mixins y componentes base están en _variables.scss, _mixins.scss y _components.scss
 */
.archive-furgonetas {
  background-color: #fff;
}

.archive-hero-subtitle {
  margin-bottom: 0;
}

.archive-filters {
  margin-top: 1rem;
}

.filters-form {
  display: flex;
  gap: 0.75rem;
  align-items: center;
  flex-wrap: wrap;
  max-width: 1200px;
}

.filter-item {
  flex: 1;
  min-width: 11.25rem;
  max-width: 13.75rem;
}

#furgonetas-results {
  padding: 3.75rem 0;
  position: relative;
  transition: opacity 0.3s ease;
}
#furgonetas-results.loading {
  opacity: 0.6;
  pointer-events: none;
}

.archive-empty {
  grid-column: 1/-1;
}

.archive-pagination {
  margin-top: 3.75rem;
  text-align: center;
}
.archive-pagination .nav-links {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 0.75rem;
  flex-wrap: wrap;
}
.archive-pagination .page-numbers {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 2.75rem;
  height: 2.75rem;
  padding: 0.5rem 0.75rem;
  background-color: transparent;
  color: #100E0F;
  text-decoration: none;
  font-weight: 500;
  border-radius: 0.375rem;
  transition: all 0.3s ease;
}
.archive-pagination .page-numbers svg {
  width: 0.5rem;
  height: 0.875rem;
  transition: transform 0.3s ease;
}
.archive-pagination .page-numbers:hover {
  background-color: #FBFAF8;
  color: #BB0825;
}
.archive-pagination .page-numbers.current {
  background-color: #BB0825;
  color: #fff;
  font-weight: 600;
}
.archive-pagination .page-numbers.prev, .archive-pagination .page-numbers.next {
  gap: 0.5rem;
}
.archive-pagination .page-numbers.prev:hover svg, .archive-pagination .page-numbers.next:hover svg {
  transform: translateX(-0.125rem);
}
.archive-pagination .page-numbers.next:hover svg {
  transform: translateX(0.125rem);
}
.archive-pagination .page-numbers.dots {
  background-color: transparent;
  cursor: default;
}
.archive-pagination .page-numbers.dots:hover {
  background-color: transparent;
  color: #100E0F;
}

@media (max-width: 1200px) {
  .filter-item {
    min-width: 9.375rem;
    max-width: 12.5rem;
  }
}
@media (max-width: 991px) {
  .archive-hero-banner {
    padding: 7.5rem 0 3.75rem;
  }
  .archive-hero-title {
    font-size: 2.75rem;
  }
  .archive-hero-subtitle {
    font-size: 1.125rem;
  }
  .filter-item {
    min-width: 8.75rem;
  }
  .filter-button {
    padding: 0.75rem 1.5rem;
  }
  #furgonetas-results {
    padding: 2.5rem 0;
  }
  .archive-pagination {
    margin-top: 2.5rem;
  }
}
@media (max-width: 768px) {
  .archive-hero-banner {
    padding: 6.25rem 0 3.125rem;
  }
  .archive-hero-title {
    font-size: 2rem;
  }
  .archive-hero-subtitle {
    font-size: 1rem;
    margin-bottom: 1.875rem;
  }
  .archive-filters {
    margin-top: 2.5rem;
  }
  .filters-form {
    gap: 0.625rem;
  }
  .filter-item {
    min-width: 100%;
    max-width: 100%;
  }
  .filter-select {
    padding: 0.75rem 0.875rem;
  }
  .filter-button {
    width: 100%;
    justify-content: center;
    padding: 0.875rem 1.5rem;
  }
  #furgonetas-results {
    padding: 1.875rem 0;
  }
  .archive-empty {
    padding: 2.5rem 1.25rem;
  }
  .archive-empty p, .archive-empty li {
    font-size: 1rem;
  }
  .archive-pagination {
    margin-top: 1.875rem;
  }
  .archive-pagination .page-numbers {
    min-width: 2.5rem;
    height: 2.5rem;
    padding: 0.375rem 0.625rem;
    font-size: 0.9rem;
  }
}
/**
 * Estilos para archive de blog (posts)
 * Usa el estilo de last-news-widget con hero banner
 * Las variables, mixins y componentes base están en _variables.scss, _mixins.scss y _components.scss
 */
.archive-blog {
  background-color: #fff;
}

.archive-blog-hero-title span {
  color: #BB0825;
}

.archive-blog-content {
  padding: 4rem 0;
}
.archive-blog-content .last-news-widget-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 2rem;
}
@media (max-width: 991px) {
  .archive-blog-content .last-news-widget-grid {
    grid-template-columns: repeat(2, 1fr);
    gap: 1.5rem;
  }
}
@media (max-width: 768px) {
  .archive-blog-content .last-news-widget-grid {
    grid-template-columns: 1fr;
    gap: 1rem;
  }
}
.archive-blog-content .last-news-widget-grid {
  margin-bottom: 3rem;
}

@media (max-width: 768px) {
  .archive-blog-content {
    padding: 2rem 0;
  }
}
/**
 * Estilos para single post (blog)
 * Diseño con imagen destacada a la izquierda, meta a la derecha, contenido centrado
 * Las variables, mixins y componentes base están en _variables.scss, _mixins.scss y _components.scss
 */
.single-post-wrapper {
  padding-top: 6.31rem;
  padding-bottom: 6rem;
  background-color: #FCFCFC;
}

section {
  background-color: #fff;
}

.single-post-header {
  margin-bottom: 4rem;
}

.single-post-featured-image {
  width: 100%;
  border-radius: 0.63rem;
  overflow: hidden;
  aspect-ratio: 16/10;
  background-color: #FBFAF8;
}
.single-post-featured-image img {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
}
.single-post-featured-image.single-post-no-image {
  background: linear-gradient(135deg, #f5f5f5 0%, #e0e0e0 100%);
  display: flex;
  align-items: center;
  justify-content: center;
  color: #999;
  font-size: 1rem;
}

.single-post-meta-wrapper {
  display: flex;
}

.single-post-meta {
  width: 100%;
  display: flex;
  flex-direction: column;
}

.single-post-title {
  font-size: 2.5rem;
  font-weight: 700;
  color: #100E0F;
  margin-bottom: 1.25rem;
  line-height: 1.2;
}

.single-post-fecha {
  color: #858585;
  font-size: 1rem;
}

.single-post-date {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  color: #100E0F;
  font-size: 1rem;
  margin-bottom: 1rem;
}
.single-post-date svg {
  width: 1rem;
  height: 1rem;
}

.single-post-categories {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
  margin-bottom: 1.5rem;
}
.single-post-categories .post-category, .single-post-categories .categories-list .category-item, .categories-list .single-post-categories .category-item {
  display: inline-block;
  padding: 0.4rem 1rem;
  background-color: #FBFAF8;
  color: #100E0F;
  font-size: 0.875rem;
  font-weight: 500;
  text-decoration: none;
  border-radius: 2rem;
  transition: all 0.3s ease;
}
.single-post-categories .post-category:hover, .single-post-categories .categories-list .category-item:hover, .categories-list .single-post-categories .category-item:hover {
  background-color: #BB0825;
  color: #fff;
}

.single-post-excerpt {
  font-size: 1.125rem;
  line-height: 1.6;
  color: #858585;
  padding: 1.25rem;
  background-color: #FBFAF8;
  border-left: 3px solid #BB0825;
  border-radius: 0.25rem;
}

.single-post-content {
  font-size: 1.0625rem;
  line-height: 1.8;
  color: #100E0F;
  margin-bottom: 3rem;
}
.single-post-content p, .single-post-content li {
  margin-bottom: 1.25rem;
}
.single-post-content p:last-child, .single-post-content li:last-child {
  margin-bottom: 0;
}
.single-post-content h2 {
  font-size: 2rem;
  font-weight: 700;
  margin-top: 2.5rem;
  margin-bottom: 1.25rem;
  color: #100E0F;
}
.single-post-content h3 {
  font-size: 1.625rem;
  font-weight: 600;
  margin-top: 2rem;
  margin-bottom: 1rem;
  color: #100E0F;
}
.single-post-content h4 {
  font-size: 1.375rem;
  font-weight: 600;
  margin-top: 1.75rem;
  margin-bottom: 0.875rem;
  color: #100E0F;
}
.single-post-content ul, .single-post-content ol {
  margin-bottom: 1.5rem;
  padding-left: 1.5rem;
}
.single-post-content ul li, .single-post-content ol li {
  margin-bottom: 0.5rem;
}
.single-post-content blockquote {
  margin: 2rem 0;
  padding: 1.5rem 2rem;
  background-color: #FBFAF8;
  border-left: 4px solid #BB0825;
  font-size: 1.125rem;
  font-style: italic;
  color: #100E0F;
}
.single-post-content blockquote p, .single-post-content blockquote li {
  margin-bottom: 0;
}
.single-post-content img {
  max-width: 100%;
  height: auto;
  border-radius: 0.5rem;
  margin: 2rem 0;
}
.single-post-content a {
  color: #BB0825;
  text-decoration: underline;
  transition: color 0.3s ease;
}
.single-post-content a:hover {
  color: rgb(138.0923076923, 5.9076923077, 27.3230769231);
}
.single-post-content code {
  background-color: #FBFAF8;
  padding: 0.2rem 0.5rem;
  border-radius: 0.25rem;
  font-size: 0.9em;
  color: #BB0825;
}
.single-post-content pre {
  background-color: #100E0F;
  color: #fff;
  padding: 1.5rem;
  border-radius: 0.5rem;
  overflow-x: auto;
  margin: 1.5rem 0;
}
.single-post-content pre code {
  background: none;
  color: #fff;
  padding: 0;
}

.single-post-tags {
  padding-top: 2rem;
  border-top: 1px solid #D4D4D4;
  margin-bottom: 3rem;
}
.single-post-tags strong {
  color: #100E0F;
  margin-right: 0.75rem;
}
.single-post-tags a {
  display: inline-block;
  padding: 0.35rem 0.85rem;
  margin-right: 0.5rem;
  margin-top: 0.5rem;
  background-color: #fff;
  border: 1px solid #D4D4D4;
  color: #858585;
  font-size: 0.875rem;
  text-decoration: none;
  border-radius: 0.25rem;
  transition: all 0.3s ease;
}
.single-post-tags a:hover {
  background-color: #BB0825;
  color: #fff;
  border-color: #BB0825;
}

@media (max-width: 991px) {
  .single-post-header {
    margin-bottom: 3rem;
  }
  .single-post-title {
    font-size: 2rem;
  }
  .single-post-meta-wrapper {
    padding-top: 1rem;
  }
  .single-post-content h2 {
    font-size: 1.75rem;
  }
  .single-post-content h3 {
    font-size: 1.5rem;
  }
}
@media (max-width: 768px) {
  .single-post-wrapper {
    padding-top: 5rem;
    padding-bottom: 3.75rem;
  }
  .single-post-title {
    font-size: 1.75rem;
  }
  .single-post-excerpt {
    font-size: 1rem;
  }
  .single-post-content {
    font-size: 1rem;
  }
  .single-post-content h2 {
    font-size: 1.5rem;
    margin-top: 2rem;
  }
  .single-post-content h3 {
    font-size: 1.25rem;
  }
  .single-post-navigation {
    flex-direction: column;
    gap: 1rem;
  }
  .single-post-navigation .nav-next {
    text-align: left;
  }
  .single-post-navigation .nav-link span {
    max-width: 100%;
  }
}
/* ================================================================
   SINGLE FURGONETAS - SWIPER GALLERY
   ================================================================
   Las variables, mixins y componentes base están en _variables.scss, 
   _mixins.scss y _components.scss
 */
.single-furgoneta {
  padding-top: 6.25rem;
  padding-bottom: 5rem;
  background-color: #fff;
}

/* Galería Swiper */
.furgoneta-gallery {
  position: relative;
}
.furgoneta-gallery .swiper-pagination {
  position: relative;
  margin-top: 1rem;
  margin-bottom: 1rem;
}
.furgoneta-gallery .swiper-pagination-bullet {
  background: #D9D9D9;
  opacity: 1;
}
.furgoneta-gallery .swiper-pagination-bullet-active {
  background: #000;
}

.furgoneta-swiper-main {
  width: 100%;
  border-radius: 0.5rem;
  overflow: hidden;
  margin-bottom: 1rem;
  height: 32rem;
}
.furgoneta-swiper-main .swiper-slide {
  aspect-ratio: 16/10;
  overflow: hidden;
  background-color: #f5f5f5;
}
.furgoneta-swiper-main .swiper-slide img {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
}
.furgoneta-swiper-main .swiper-button-next,
.furgoneta-swiper-main .swiper-button-prev {
  color: #fff;
  background-color: rgba(0, 0, 0, 0.5);
  width: 2.75rem;
  height: 2.75rem;
  border-radius: 50%;
  transition: all 0.3s ease;
}
.furgoneta-swiper-main .swiper-button-next:hover,
.furgoneta-swiper-main .swiper-button-prev:hover {
  background-color: #BB0825;
}
.furgoneta-swiper-main .swiper-button-next::after,
.furgoneta-swiper-main .swiper-button-prev::after {
  font-size: 1.25rem;
}

/* Miniaturas */
.furgoneta-swiper-thumbs {
  display: none;
  width: 100%;
}
.furgoneta-swiper-thumbs .swiper-slide {
  width: 25%;
  height: 5rem;
  opacity: 0.6;
  cursor: pointer;
  border-radius: 0.25rem;
  overflow: hidden;
  border: 2px solid transparent;
  transition: all 0.3s ease;
}
.furgoneta-swiper-thumbs .swiper-slide img {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
}
.furgoneta-swiper-thumbs .swiper-slide:hover {
  opacity: 1;
}
.furgoneta-swiper-thumbs .swiper-slide-thumb-active {
  opacity: 1;
  border-color: #BB0825;
}

/* Información de la furgoneta */
.furgoneta-info {
  padding-left: 6.88rem;
}
.furgoneta-info .furgoneta-title {
  font-size: 2.62rem;
  font-weight: 800;
  color: #000;
  margin-bottom: 0.5rem;
  line-height: 3rem;
}
.furgoneta-info .furgoneta-subtitle {
  font-size: 1.25rem;
  color: #858585;
  margin-bottom: 1.5rem;
  font-weight: 400;
}
.furgoneta-info .furgoneta-precio {
  display: flex;
  flex-direction: column;
  gap: 0.25rem;
}
.furgoneta-info .furgoneta-precio .precio-principal {
  font-size: 1.25rem;
  font-weight: 600;
  color: #BB0825;
  line-height: 1;
}
.furgoneta-info .furgoneta-precio .precio-descuento {
  font-size: 0.75rem;
  color: #858585;
  font-weight: 400;
}

/* Precio y CTA en línea */
.furgoneta-precio-cta {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1.25rem;
  margin-bottom: 1.9rem;
  padding-bottom: 2.5rem;
  margin-top: 1.9rem;
  padding-top: 2.5rem;
  border-bottom: 1px solid #D9D9D9;
  border-top: 1px solid #D9D9D9;
}
.furgoneta-precio-cta .btn-solicitar svg {
  transition: transform 0.3s ease;
}
.furgoneta-precio-cta .btn-solicitar:hover svg {
  transform: translateX(0.25rem);
}

/* Badge Vector */
.furgoneta-badge {
  margin-bottom: 1.5rem;
}
.furgoneta-badge .badge-vector {
  display: inline-block;
  padding: 0.25rem 0.75rem;
  background-color: #0066CC;
  color: #fff;
  font-size: 0.875rem;
  font-weight: 600;
  border-radius: 0.25rem;
}

/* Especificaciones */
.furgoneta-specs {
  margin-bottom: 0;
}
.furgoneta-specs .specs-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 2.3rem;
  margin-bottom: 2.9rem;
}
.furgoneta-specs .specs-grid:last-child {
  margin-bottom: 0;
  padding-bottom: 0;
  border-bottom: none;
}
.furgoneta-specs .spec-item {
  display: flex;
  flex-direction: column;
  gap: 0.25rem;
}
.furgoneta-specs .spec-label {
  font-size: 1rem;
  color: #898989;
  font-weight: 400;
  text-transform: capitalize;
}
.furgoneta-specs .spec-value {
  font-size: 1rem;
  color: #100E0F;
  font-weight: 500;
}

/* Responsive */
@media (max-width: 991px) {
  .single-furgoneta {
    padding-top: 5rem;
  }
  .furgoneta-info .furgoneta-title {
    font-size: 1.5rem;
  }
  .furgoneta-info .furgoneta-precio .precio-principal {
    font-size: 1.5rem;
  }
  .furgoneta-precio-cta {
    flex-direction: column;
    align-items: flex-start;
  }
  .furgoneta-precio-cta .btn-solicitar {
    width: 100%;
  }
  .furgoneta-specs .specs-grid {
    grid-template-columns: repeat(2, 1fr);
  }
  .furgoneta-swiper-thumbs .swiper-slide {
    height: 4.375rem;
  }
}
@media (max-width: 767px) {
  .furgoneta-swiper-main .swiper-button-next,
  .furgoneta-swiper-main .swiper-button-prev {
    width: 2.25rem;
    height: 2.25rem;
  }
  .furgoneta-swiper-main .swiper-button-next::after,
  .furgoneta-swiper-main .swiper-button-prev::after {
    font-size: 1rem;
  }
  .furgoneta-swiper-thumbs .swiper-slide {
    height: 3.75rem;
  }
  .furgoneta-specs .specs-grid {
    grid-template-columns: 1fr;
  }
}
/* ================================================================
   RELATED FURGONETAS
   ================================================================ */
/* ========================================
   FIN DE IMPORTS
   ======================================== *//*# sourceMappingURL=estils.css.map */