.elementor-kit-673{--e-global-color-primary:#c4aa83;--e-global-color-secondary:#25231f;--e-global-color-text:#26231f;--e-global-color-accent:#d9d3c7;--e-global-color-charcoal_2:#1c1a17;--e-global-color-charcoal_soft:#2c2925;--e-global-color-beige_2:#e1dbd0;--e-global-color-ink_soft:#3c3833;--e-global-color-muted:#5d574e;--e-global-color-gold:#c7ab7d;--e-global-color-tan_btn:#b6a486;--e-global-color-cream:#ffffff;--e-global-typography-primary-font-family:"Playfair Display";--e-global-typography-primary-font-weight:400;--e-global-typography-primary-font-style:italic;--e-global-typography-secondary-font-family:"Playfair Display";--e-global-typography-secondary-font-weight:500;--e-global-typography-text-font-family:"Open Sans";--e-global-typography-text-font-weight:400;--e-global-typography-accent-font-family:"Poppins";--e-global-typography-accent-font-weight:500;--e-global-typography-accent-text-transform:uppercase;--e-global-typography-accent-letter-spacing:1.8px;--e-global-typography-eyebrow_bronze-font-family:"Poppins";--e-global-typography-eyebrow_bronze-font-size:20px;--e-global-typography-eyebrow_bronze-font-weight:500;--e-global-typography-eyebrow_bronze-text-transform:uppercase;--e-global-typography-eyebrow_bronze-letter-spacing:2.5px;--e-global-typography-nav-font-family:"Poppins";--e-global-typography-nav-font-size:14px;--e-global-typography-nav-font-weight:500;--e-global-typography-nav-text-transform:uppercase;--e-global-typography-nav-letter-spacing:1.7px;--e-global-typography-chefs_serif-font-family:"Playfair Display";--e-global-typography-chefs_serif-font-size:26px;--e-global-typography-chefs_serif-font-weight:400;--e-global-typography-faq_title-font-family:"Poppins";--e-global-typography-faq_title-font-size:42px;--e-global-typography-faq_title-font-weight:500;--e-global-typography-faq_title-letter-spacing:6.2px;color:#26231f;font-family:"Open Sans", Sans-serif;font-size:17px;font-weight:400;line-height:1.6em;background-color:#ffffff;}.elementor-kit-673 p{margin-block-end:1em;}.elementor-kit-673 a{color:#c4aa83;font-family:"Open Sans", Sans-serif;font-weight:400;}.elementor-kit-673 a:hover{color:#a78a5d;}.elementor-kit-673 h1{color:#26231f;font-family:"Playfair Display", Sans-serif;font-size:62px;font-weight:400;font-style:italic;line-height:1.05em;}.elementor-kit-673 h2{color:#26231f;font-family:"Playfair Display", Sans-serif;font-size:56px;font-weight:400;font-style:italic;line-height:1.05em;}.elementor-kit-673 h3{color:#26231f;font-family:"Playfair Display", Sans-serif;font-size:44px;font-weight:500;line-height:1.05em;}.elementor-kit-673 h4{color:#26231f;font-family:"Playfair Display", Sans-serif;font-size:32px;font-weight:500;line-height:1.1em;}.elementor-kit-673 h5{color:#26231f;font-family:"Open Sans", Sans-serif;font-size:17px;font-weight:700;line-height:1.5em;}.elementor-kit-673 h6{color:#c4aa83;font-family:"Poppins", Sans-serif;font-size:16px;font-weight:500;text-transform:uppercase;line-height:1.4em;letter-spacing:2px;}.elementor-kit-673 button,.elementor-kit-673 input[type="button"],.elementor-kit-673 input[type="submit"],.elementor-kit-673 .elementor-button{font-family:"Poppins", Sans-serif;font-size:14px;font-weight:500;text-transform:uppercase;letter-spacing:1.7px;color:#ffffff;background-color:#25231f;border-radius:0px 0px 0px 0px;padding:16px 38px 16px 38px;}.elementor-kit-673 button:hover,.elementor-kit-673 button:focus,.elementor-kit-673 input[type="button"]:hover,.elementor-kit-673 input[type="button"]:focus,.elementor-kit-673 input[type="submit"]:hover,.elementor-kit-673 input[type="submit"]:focus,.elementor-kit-673 .elementor-button:hover,.elementor-kit-673 .elementor-button:focus{color:#ffffff;background-color:#000000;}.elementor-kit-673 img{border-radius:0px 0px 0px 0px;}.elementor-kit-673 label{color:#3c3833;font-family:"Open Sans", Sans-serif;font-size:15px;font-weight:400;}.elementor-kit-673 input:not([type="button"]):not([type="submit"]),.elementor-kit-673 textarea,.elementor-kit-673 .elementor-field-textual{font-family:"Open Sans", Sans-serif;font-size:16px;font-weight:400;color:#26231f;background-color:transparent;border-radius:0px 0px 0px 0px;}.elementor-kit-673 input:focus:not([type="button"]):not([type="submit"]),.elementor-kit-673 textarea:focus,.elementor-kit-673 .elementor-field-textual:focus{background-color:transparent;}.elementor-section.elementor-section-boxed > .elementor-container{max-width:1400px;}.e-con{--container-max-width:1400px;}.elementor-widget:not(:last-child){margin-block-end:0px;}.elementor-element{--widgets-spacing:0px 0px;--widgets-spacing-row:0px;--widgets-spacing-column:0px;}{}h1.entry-title{display:var(--page-title-display);}.elementor-kit-673 e-page-transition{background-color:#FFBC7D;}@media(max-width:1024px){.elementor-kit-673 h1{font-size:50px;}.elementor-kit-673 h2{font-size:44px;}.elementor-kit-673 h3{font-size:36px;}.elementor-section.elementor-section-boxed > .elementor-container{max-width:1024px;}.e-con{--container-max-width:1024px;}}@media(max-width:767px){.elementor-kit-673 h1{font-size:38px;}.elementor-kit-673 h2{font-size:34px;}.elementor-kit-673 h3{font-size:30px;}.elementor-section.elementor-section-boxed > .elementor-container{max-width:767px;}.e-con{--container-max-width:767px;}}/* Start custom CSS *//* ============================================================
   MIBRASA HOME — Custom CSS estructural MÍNIM
   Principi: tot el layout es fa amb Elementor settings (Containers
   flex, widget config). CSS només per:
   - Pseudo-elements (::after, ::before)
   - position:absolute (caption overlay, FAB fix)
   - Hover transitions específiques
   - Aspect-ratio per Container bg-image (no es pot natiu)
   ============================================================ */

:root{
  --mb-ease: cubic-bezier(.22,.61,.36,1);
}

/* ============================================================
   HEADER sticky (Elementor settings no permeten sticky a Container)
   ============================================================ */
.mb-header{
  position: sticky !important; top: 0; z-index: 500;
  border-bottom: 1px solid rgba(255,255,255,.06);
}

/* ============================================================
   HERO — scrim gradient via pseudo-element + play button cursor
   (Elementor's overlay no permet un gradient directional al nivell
   que el disseny necessita, però es podria substituir per
   Container "Background Overlay" gradient)
   ============================================================ */
.mb-hero{ position: relative; overflow: hidden; }
.mb-hero .mb-hero__play.elementor-widget-icon .elementor-icon{
  border: 2px solid rgba(255,255,255,.9) !important;
  background: rgba(255,255,255,.16) !important;
  transition: transform .3s var(--mb-ease), background .3s var(--mb-ease);
}
.mb-hero .mb-hero__play.elementor-widget-icon .elementor-icon:hover{
  transform: scale(1.06);
  background: rgba(255,255,255,.3) !important;
}

/* ============================================================
   PRODUCT carousel — omplir alçada del container (Elementor flex
   no controla aspect-ratio de carousel nadiu, necessita CSS)
   ============================================================ */
.mb-product__media{ position: relative; min-height: clamp(340px, 46vw, 560px); }
.mb-product__media > .elementor-widget-image-carousel,
.mb-product__media > .elementor-widget-image-carousel > .elementor-widget-container{
  position: absolute !important; inset: 0;
  width: 100% !important; height: 100% !important;
}
.mb-product__media .elementor-image-carousel-wrapper,
.mb-product__media .elementor-image-carousel,
.mb-product__media .swiper,
.mb-product__media .swiper-wrapper{ height: 100% !important; }
.mb-product__media .swiper-slide{ height: 100% !important; display: flex; }
.mb-product__media .swiper-slide a,
.mb-product__media .swiper-slide figure{ width: 100%; height: 100%; display: block; }
.mb-product__media .swiper-slide img{
  width: 100% !important; height: 100% !important;
  object-fit: cover !important; max-width: none !important;
}
.mb-product__media .elementor-swiper-button{ color: #fff !important; }

/* ============================================================
   CHEFS caption overlay (slide-up on hover via CSS — no nadiu)
   ============================================================ */
.mb-cell--photo.e-con{ position: relative !important; overflow: hidden; }
.mb-cell--photo .mb-chef-caption.e-con{
  position: absolute !important; left: 0; right: 0; bottom: 0;
  background: linear-gradient(0deg, rgba(10,9,7,.85), rgba(10,9,7,0)) !important;
  transform: translateY(100%); opacity: 0;
  transition: transform .5s var(--mb-ease), opacity .5s var(--mb-ease);
  pointer-events: none; z-index: 2;
}
.mb-cell--photo.e-con:hover .mb-chef-caption.e-con,
.mb-cell--photo.e-con:focus-within .mb-chef-caption.e-con{
  transform: translateY(0); opacity: 1;
}

/* ============================================================
   CONTACT photo — solapada absolutament amb el panel beige
   (position: absolute, no es pot natiu)
   ============================================================ */
.mb-contact-grid{ position: relative; }
.mb-contact__photo.elementor-widget-image{
  align-self: end !important;
  margin-left: clamp(-90px, -5vw, -44px) !important;
  aspect-ratio: 1300 / 772;
  position: relative; z-index: 2;
}
.mb-contact__photo.elementor-widget-image > .elementor-widget-container{
  height: 100%;
}
.mb-contact__photo.elementor-widget-image img{
  width: 100% !important; height: 100% !important; object-fit: cover;
}
@media (max-width: 860px){
  .mb-contact__photo.elementor-widget-image{
    margin-left: 0 !important; aspect-ratio: 16/10;
  }
}

/* ============================================================
   RECIPE image hover zoom (transitions)
   ============================================================ */
.mb-recipe-img.e-con{ overflow: hidden; transition: transform .7s var(--mb-ease); }
.mb-recipe.e-con:hover .mb-recipe-img.e-con{ transform: scale(1.02); }

/* ============================================================
   FOOTER dividers (border-right entre brand i main no es pot
   posar al Container settings, requereix CSS)
   ============================================================ */
.mb-footer-brand.e-con{
  border-right: 1px solid rgba(255,255,255,.18);
}
.mb-footer-contact.e-con{
  border-top: 1px solid rgba(255,255,255,.18);
}
@media (max-width: 860px){
  .mb-footer-brand.e-con{
    border-right: 0;
    border-bottom: 1px solid rgba(255,255,255,.18);
  }
}

/* ============================================================
   FAB — position fixed (no es pot natiu via Container settings)
   ============================================================ */
.mb-float-contact.elementor-widget-button{
  position: fixed !important;
  right: 0; top: 55%;
  transform: translateY(-50%);
  z-index: 480;
}
.mb-float-contact.elementor-widget-button .elementor-button{
  background: var(--e-global-color-secondary, #25231f) !important;
  color: #fff !important;
  border: 0 !important;
  border-radius: 8px 0 0 8px !important;
  box-shadow: -4px 6px 22px rgba(0,0,0,.28);
  transition: padding-right .3s var(--mb-ease), background .3s;
  display: inline-flex; align-items: center; gap: 12px;
  padding: 15px 20px !important;
}
.mb-float-contact.elementor-widget-button .elementor-button:hover{
  background: #000 !important; padding-right: 26px !important;
}
.mb-float-contact.elementor-widget-button .elementor-button-icon i,
.mb-float-contact.elementor-widget-button .elementor-button-icon svg{
  color: var(--e-global-color-gold, #c7ab7d) !important;
  fill: var(--e-global-color-gold, #c7ab7d) !important;
}
@media (max-width: 560px){
  .mb-float-contact.elementor-widget-button .elementor-button{ padding: 14px !important; }
  .mb-float-contact.elementor-widget-button .elementor-button-text{ display: none; }
}

/* ============================================================
   STORY products — alternança LTR/RTL responsive col·lapse
   (Elementor flex_direction handles desktop, només cal mobile)
   ============================================================ */
@media (max-width: 860px){
  .mb-product.e-con,
  .mb-product.e-con > .e-con-inner{ flex-direction: column !important; }
  .mb-product .mb-product__panel.e-con{
    text-align: left !important; align-items: flex-start !important;
  }
}

/* ============================================================
   GRAVITY FORMS via EAE — estils essencials que no es poden fer
   amb Site Settings (els fields de GF no s'inherenten de Theme Style)
   ============================================================ */
.mb-contact__panel .gform_wrapper{ font-family: 'Open Sans', sans-serif; }
.mb-contact__panel .gform_wrapper .gfield_label{
  font-family: 'Open Sans', sans-serif !important;
  font-weight: 400 !important; font-size: 15px !important;
  color: var(--e-global-color-ink_soft, #3c3833) !important;
  margin-bottom: 8px !important;
}
.mb-contact__panel .gform_wrapper input[type="text"],
.mb-contact__panel .gform_wrapper input[type="email"],
.mb-contact__panel .gform_wrapper input[type="tel"],
.mb-contact__panel .gform_wrapper textarea,
.mb-contact__panel .gform_wrapper select{
  background: transparent !important;
  border: 0 !important;
  border-bottom: 1.5px solid rgba(38,35,31,.4) !important;
  border-radius: 0 !important;
  padding: 8px 2px !important;
  font-family: 'Open Sans', sans-serif !important;
  font-size: 16px !important;
  color: var(--e-global-color-text, #26231f) !important;
  box-shadow: none !important;
}
.mb-contact__panel .gform_wrapper input:focus,
.mb-contact__panel .gform_wrapper textarea:focus,
.mb-contact__panel .gform_wrapper select:focus{
  outline: none !important;
  border-bottom-color: var(--e-global-color-primary, #c4aa83) !important;
}
.mb-contact__panel .gform_wrapper .gform_footer{
  display: flex; justify-content: flex-end; padding: 18px 0 0 !important;
}
.mb-contact__panel .gform_wrapper .gform_button,
.mb-contact__panel .gform_wrapper input[type="submit"]{
  background: var(--e-global-color-secondary, #25231f) !important;
  color: #fff !important; border: 0 !important; border-radius: 0 !important;
  font-family: 'Poppins', sans-serif !important; font-weight: 500 !important;
  letter-spacing: 1.7px !important; text-transform: uppercase !important;
  font-size: 14px !important; padding: 16px 38px !important;
}
.mb-contact__panel .gform_wrapper .gform_button:hover{ background: #000 !important; }

/* Newsletter inline */
.mb-newsletter__form .gform_wrapper .gform_fields{
  display: flex; flex-direction: row; gap: 0;
  max-width: 680px; align-items: stretch;
}
.mb-newsletter__form .gform_wrapper .gfield{ flex: 1; margin: 0 !important; }
.mb-newsletter__form .gform_wrapper input[type="email"]{
  background: #fff !important; border: 0 !important; border-radius: 0 !important;
  padding: 15px 18px !important;
  font-family: 'Open Sans', sans-serif !important;
  font-size: 15px !important; color: #26231f !important;
}
.mb-newsletter__form .gform_wrapper .gform_footer{ margin: 0; padding: 0; }
.mb-newsletter__form .gform_wrapper .gform_button{
  background: var(--e-global-color-tan_btn, #b6a486) !important;
  color: #1f1c17 !important; border: 0 !important; border-radius: 0 !important;
  font-family: 'Poppins', sans-serif !important; font-weight: 500 !important;
  letter-spacing: 1.1px !important; text-transform: uppercase !important;
  font-size: 13.5px !important; padding: 0 30px !important; height: 100%;
}
@media (max-width: 560px){
  .mb-newsletter__form .gform_wrapper .gform_fields{ flex-direction: column; }
}

/* ============================================================
   HEADER nav — underline hover effect via pseudo-element
   ============================================================ */
.mb-header__nav-link.elementor-widget-button .elementor-button{
  background: transparent !important;
  border: 0 !important;
  position: relative;
  padding: 10px 2px !important;
}
.mb-header__nav-link.elementor-widget-button .elementor-button::after{
  content: ""; position: absolute; left: 2px; right: auto; bottom: 6px;
  width: 0; height: 1.5px;
  background: var(--e-global-color-gold, #c7ab7d);
  transition: width .35s var(--mb-ease);
}
.mb-header__nav-link.elementor-widget-button .elementor-button:hover::after,
.mb-header__nav-link.elementor-widget-button .elementor-button:focus-visible::after{
  width: calc(100% - 4px);
}
.mb-header__nav-link.elementor-widget-button .elementor-button:hover .elementor-button-text{
  color: #fff !important;
}/* End custom CSS */