/*
Theme Name: Hausbrandt Trieste 1892
Theme URI: https://hausbrandt.cl
Author: Tu Nombre/Agencia
Author URI: https://hausbrandt.cl
Description: Tema personalizado para Hausbrandt, basado en el diseño original.
Version: 1.0.2
Text Domain: hausbrandt
Tags: custom, gutenberg-ready
*/

/* Los estilos principales de la web están en la cabecera (in-line o renderizados por dc-runtime en el diseño original). 
   Aquí se pueden añadir clases de soporte para Gutenberg o estilos globales de WordPress. */

/* Ajustes básicos para que los bloques de Gutenberg fluyan bien si se añaden más adelante */
.aligncenter {
    display: block;
    margin: 0 auto;
}
.alignleft {
    float: left;
    margin-right: 1.5em;
}
.alignright {
    float: right;
    margin-left: 1.5em;
}
.wp-block-image img {
    max-width: 100%;
    height: auto;
}

/* ==========================================================================
   Elementor-native page building blocks (hb-e-*).
   These classes let pages be built with real Elementor Containers/Widgets
   (so they stay editable) while keeping pixel parity with the original
   static design. Applied via each element's "CSS Classes" advanced control.
   ========================================================================== */
.hb-e-hero {
  padding: clamp(130px,20vh,190px) clamp(20px,6vw,80px) clamp(70px,9vh,110px) !important;
}
.hb-e-hero > .e-con-inner {
  display: grid !important;
  grid-template-columns: minmax(0,1.1fr) minmax(0,0.9fr) !important;
  gap: clamp(30px,5vw,70px) !important;
  align-items: end !important;
  /* Elementor's "boxed" container width (default 1140px, centered) leaves a
     gap on wide screens that the image's negative margin can't see past —
     force it to span the full section so the image's breakout always
     reaches the true edge, on every page, regardless of that per-container
     Elementor setting. */
  max-width: none !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
}
.hb-e-hero-text { display: flex !important; flex-direction: column !important; justify-content: center !important; }
.hb-e-eyebrow .elementor-heading-title { font-size: 13px !important; letter-spacing: 0.28em !important; text-transform: uppercase !important; color: #8a7f70 !important; font-weight: 700 !important; margin-bottom: 18px !important; }
.hb-e-eyebrow-brown .elementor-heading-title { font-size: 13px !important; letter-spacing: 0.28em !important; text-transform: uppercase !important; color: #8a5a3a !important; font-weight: 700 !important; margin-bottom: 18px !important; }
.hb-e-h1 .elementor-heading-title { font-size: clamp(38px,5.6vw,80px) !important; line-height: 1 !important; font-weight: 800 !important; letter-spacing: -0.02em !important; margin: 0 0 24px !important; color: #161311 !important; }
.hb-e-h2 .elementor-heading-title { font-size: clamp(26px,3.2vw,40px) !important; font-weight: 800 !important; letter-spacing: -0.01em !important; line-height: 1.15 !important; margin: 0 0 22px !important; color: #161311 !important; }
.hb-e-hero-lead p { font-family: 'Instrument Serif', serif !important; font-size: clamp(18px,2vw,23px) !important; line-height: 1.5 !important; color: #3a332c !important; max-width: 48ch; margin: 0 !important; }
/* Full-bleed hero image: breaks out of .hb-e-hero's own padding on the top,
   right and bottom sides (matching Hausbrandt's official site, where the
   photo runs edge-to-edge instead of sitting as a padded/floating box) while
   the text column keeps its normal padding on the left. */
.hb-e-hero-image-wrap {
  align-self: stretch !important;
  width: auto !important;
  height: auto !important;
  aspect-ratio: auto !important;
  overflow: hidden !important;
  margin-top: calc(-1 * clamp(130px,20vh,190px)) !important;
  margin-right: calc(-1 * clamp(20px,6vw,80px)) !important;
  margin-bottom: calc(-1 * clamp(70px,9vh,110px)) !important;
}
.hb-e-hero-image-wrap img { width: 100%; height: 100%; object-fit: cover; display: block; }
@media (max-width: 860px) {
  .hb-e-hero-image-wrap { margin-top: 0; margin-right: 0; margin-bottom: 0; aspect-ratio: 4/3; }
}

.hb-e-nosotros {
  background: #f2e4d4 !important;
  padding: clamp(60px,9vh,100px) clamp(20px,6vw,80px) !important;
}
.hb-e-nosotros > .e-con-inner {
  display: grid !important;
  grid-template-columns: minmax(0,1.1fr) minmax(0,0.9fr) !important;
  gap: clamp(40px,6vw,80px) !important;
  align-items: start !important;
}
.hb-e-dark-box { padding: clamp(32px,4vw,44px) !important; }
.hb-e-form-section { padding: clamp(20px,4vh,40px) clamp(20px,6vw,80px) clamp(90px,12vh,140px) !important; }
.hb-e-form-card { max-width: 760px !important; margin: 0 auto !important; padding: clamp(32px,5vw,56px) !important; }
.hb-e-direct { padding: clamp(60px,9vh,100px) clamp(20px,6vw,80px) !important; }
.hb-e-body-text p { font-family: 'Instrument Serif', serif !important; font-size: 16px !important; line-height: 1.75 !important; color: #3a332c !important; margin: 0 0 18px !important; max-width: 52ch; }
.hb-e-body-text p:last-child { margin-bottom: 0 !important; }
.hb-e-dark-box { background: #161311 !important; color: #f7f2e9 !important; border-radius: 2px; }
.hb-e-dark-box *, .hb-e-dark-box p, .hb-e-dark-box div, .hb-e-dark-box span { color: #f7f2e9 !important; }
.hb-e-dark-label .elementor-heading-title { font-size: 12px !important; letter-spacing: 0.1em !important; text-transform: uppercase !important; color: rgba(247,242,233,0.5) !important; font-weight: 700 !important; margin-bottom: 16px !important; }
.hb-e-dark-address p { font-family: 'Instrument Serif', serif !important; font-size: 19px !important; line-height: 1.6 !important; margin: 0 !important; }
.hb-e-dark-divider { margin: 26px 0 !important; }
.hb-e-dark-divider .elementor-divider-separator { border-top-color: rgba(247,242,233,0.15) !important; }
.hb-e-pill-row { display: flex !important; flex-wrap: wrap !important; gap: 10px !important; }
.hb-e-pill { font-size: 12px !important; letter-spacing: 0.04em !important; font-weight: 600 !important; padding: 8px 14px !important; border: 1px solid rgba(247,242,233,0.25) !important; border-radius: 2px !important; color: #f7f2e9 !important; }

.hb-e-cta-btn .elementor-button {
  background: #161311 !important;
  color: #f7f2e9 !important;
  padding: 16px 32px !important;
  border-radius: 2px !important;
  font-size: 13px !important;
  letter-spacing: 0.06em !important;
  text-transform: uppercase !important;
  font-weight: 700 !important;
  transition: background 0.3s ease !important;
}
.hb-e-cta-btn .elementor-button:hover { background: #d6081f !important; color: #f7f2e9 !important; }

.hb-e-form-card { background: #fff !important; border: 1px solid rgba(22,19,17,0.08); box-shadow: 0 30px 60px -30px rgba(22,19,17,0.15); }
.hb-e-form-label .elementor-heading-title { font-size: 12px !important; letter-spacing: 0.1em !important; text-transform: uppercase !important; color: #8a7f70 !important; font-weight: 700 !important; margin-bottom: 10px !important; }

.hb-e-direct { background: #161311 !important; text-align: center !important; }
.hb-e-direct *, .hb-e-direct p, .hb-e-direct div { color: #f7f2e9 !important; }
.hb-e-direct-eyebrow .elementor-heading-title { font-size: 13px !important; letter-spacing: 0.28em !important; text-transform: uppercase !important; color: #d6081f !important; font-weight: 700 !important; margin-bottom: 18px !important; }
.hb-e-direct-links { display: flex !important; justify-content: center !important; flex-wrap: wrap !important; gap: clamp(24px,4vw,48px) !important; }
.hb-e-direct-links a { font-size: clamp(18px,2vw,24px) !important; font-family: 'Instrument Serif', serif !important; color: #f7f2e9 !important; }

/* "Next category" CTA used at the end of catalog pages (Granos/Molido/Monodosis/Hogar) */
.hb-e-next-section { padding: clamp(70px,10vh,120px) clamp(20px,6vw,80px) !important; text-align: center !important; }
.hb-e-next-dark { background: #161311 !important; }
.hb-e-next-eyebrow-dark .elementor-heading-title { color: #d6081f !important; font-size: 13px !important; letter-spacing: 0.28em !important; text-transform: uppercase !important; font-weight: 700 !important; margin-bottom: 20px !important; }
.hb-e-next-eyebrow-light .elementor-heading-title { color: #8a7f70 !important; font-size: 13px !important; letter-spacing: 0.28em !important; text-transform: uppercase !important; font-weight: 700 !important; margin-bottom: 20px !important; }
.hb-e-next-link-dark .elementor-heading-title, .hb-e-next-link-dark .elementor-heading-title a { color: #f7f2e9 !important; font-size: clamp(30px,4.4vw,54px) !important; font-weight: 800 !important; letter-spacing: -0.02em !important; text-decoration: none !important; }
.hb-e-next-link-dark .elementor-heading-title a:hover { color: #d6081f !important; }
.hb-e-next-link-light .elementor-heading-title, .hb-e-next-link-light .elementor-heading-title a { color: #161311 !important; font-size: clamp(30px,4.4vw,54px) !important; font-weight: 800 !important; letter-spacing: -0.02em !important; text-decoration: none !important; }
.hb-e-next-link-light .elementor-heading-title a:hover { color: #d6081f !important; }

/* "Formato" info section (Monodosis) */
.hb-e-formato-section { background: #161311 !important; padding: clamp(70px,10vh,120px) clamp(20px,6vw,80px) !important; text-align: center !important; }
.hb-e-formato-inner { max-width: 680px !important; margin: 0 auto !important; }
.hb-e-formato-eyebrow .elementor-heading-title { color: #d6081f !important; font-size: 13px !important; letter-spacing: 0.28em !important; text-transform: uppercase !important; font-weight: 700 !important; margin-bottom: 22px !important; }
.hb-e-formato-text p { font-family: 'Instrument Serif', serif !important; font-size: clamp(18px,2vw,22px) !important; line-height: 1.6 !important; color: rgba(247,242,233,0.75) !important; margin: 0 !important; }

@media (max-width: 860px) {
  .hb-e-hero > .e-con-inner, .hb-e-nosotros > .e-con-inner { grid-template-columns: 1fr !important; }
}