.elementor-157 .elementor-element.elementor-element-ad3bdfd{--display:flex;--flex-direction:row;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );--container-widget-height:100%;--container-widget-flex-grow:1;--container-widget-align-self:stretch;--flex-wrap-mobile:wrap;--justify-content:flex-start;--align-items:center;--flex-wrap:nowrap;}.elementor-157 .elementor-element.elementor-element-cbedfd8{--display:flex;--flex-direction:row;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );--container-widget-height:100%;--container-widget-flex-grow:1;--container-widget-align-self:stretch;--flex-wrap-mobile:wrap;--justify-content:flex-start;--align-items:center;--gap:0% 0%;--row-gap:0%;--column-gap:0%;}.elementor-157 .elementor-element.elementor-element-cbedfd8.e-con{--flex-grow:0;--flex-shrink:0;}.elementor-157 .elementor-element.elementor-element-5aec4f2 .elementor-menu-toggle{margin-right:auto;}.elementor-157 .elementor-element.elementor-element-d98dea5{--display:flex;--flex-direction:row;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );--container-widget-height:100%;--container-widget-flex-grow:1;--container-widget-align-self:stretch;--flex-wrap-mobile:wrap;--justify-content:center;--align-items:center;}.elementor-157 .elementor-element.elementor-element-d98dea5.e-con{--align-self:center;}.elementor-157 .elementor-element.elementor-element-05bb405 img{width:42%;}.elementor-157 .elementor-element.elementor-element-af5d60b{--display:flex;--flex-direction:row;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );--container-widget-height:100%;--container-widget-flex-grow:1;--container-widget-align-self:stretch;--flex-wrap-mobile:wrap;--justify-content:flex-end;--align-items:center;}.elementor-157 .elementor-element.elementor-element-26d6166 .elementor-icon-wrapper{text-align:center;}.elementor-157 .elementor-element.elementor-element-fefffde .elementor-icon-wrapper{text-align:center;}.elementor-157 .elementor-element.elementor-element-b084f91{--divider-style:solid;--subtotal-divider-style:solid;--elementor-remove-from-cart-button:none;--remove-from-cart-button:block;--cart-border-style:none;--cart-footer-layout:1fr 1fr;--products-max-height-sidecart:calc(100vh - 240px);--products-max-height-minicart:calc(100vh - 385px);}.elementor-157 .elementor-element.elementor-element-b084f91 .widget_shopping_cart_content{--subtotal-divider-left-width:0;--subtotal-divider-right-width:0;}.elementor-theme-builder-content-area{height:400px;}.elementor-location-header:before, .elementor-location-footer:before{content:"";display:table;clear:both;}@media(min-width:768px){.elementor-157 .elementor-element.elementor-element-cbedfd8{--width:41%;}.elementor-157 .elementor-element.elementor-element-d98dea5{--width:28%;}}/* Start custom CSS for container, class: .elementor-element-ad3bdfd *//* =========================================================
   MERUMEI 3D LAB — HEADER
   File: 02-merumei-header.css

   SCOPO DEL FILE
   Gestisce esclusivamente l'header:
   - sfondo trasparente con blur;
   - struttura a tre colonne;
   - logo;
   - brand;
   - menu desktop;
   - menu mobile;
   - icone search/account/cart;
   - spaziatura tra header e contenuto.

   NOTA DI MANUTENZIONE
   Non inserire qui CSS della pagina prodotto.
   Non inserire qui CSS dello shop.
   Il carrello laterale Elementor viene gestito nel file separato:
   03-merumei-cart-overlay.css
   ========================================================= */

/* =========================================================
   HEADER — Container principale
   Classe da assegnare al container principale del template header:
   merumei-header
   ========================================================= */

.merumei-header {
  background: rgba(251, 250, 248, 0.72);
  backdrop-filter: blur(16px);
  -webkit-backdrop-filter: blur(16px);
  border-bottom: 1px solid var(--merumei-border-soft);
  transition: background-color 0.25s ease, border-color 0.25s ease;

  /*
    z-index alto ma non estremo.
    Il pannello carrello userà z-index ancora superiore.
  */
  position: relative;
  z-index: 99990;
  overflow: visible;
}

/* =========================================================
   HEADER — Colonne interne
   Classi da assegnare ai tre container interni:
   - merumei-header__left
   - merumei-header__center
   - merumei-header__right
   ========================================================= */

.merumei-header__left {
  flex: 1 1 0;
  min-width: 0;
}

.merumei-header__center {
  flex: 0 0 auto;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
}

.merumei-header__right {
  flex: 1 1 0;
  min-width: 0;
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 20px;
}

/* =========================================================
   HEADER — Logo
   Classe da assegnare al widget immagine logo:
   merumei-logo
   ========================================================= */

.merumei-logo img {
  width: 44px !important;
  height: 44px !important;
  object-fit: contain;
  display: block;
}

@media (max-width: 767px) {
  .merumei-logo img {
    width: 36px !important;
    height: 36px !important;
  }
}

/* =========================================================
   HEADER — Brand testuale
   Classe da assegnare al titolo/testo "Merumei":
   merumei-brand
   ========================================================= */

.merumei-brand .elementor-heading-title {
  font-family: var(--merumei-font-serif);
  font-size: 32px;
  font-weight: 300;
  line-height: 1;
  letter-spacing: -0.02em;
  color: var(--merumei-ink);
  margin: 0;
}

@media (max-width: 767px) {
  .merumei-brand .elementor-heading-title {
    font-size: 28px;
  }
}

/* =========================================================
   HEADER — Menu desktop
   Classe da assegnare al widget Nav Menu:
   merumei-nav

   Obiettivo:
   ottenere un menu editoriale, sottile, uppercase,
   coerente con Lovable e con la pagina Chi siamo.
   ========================================================= */

.merumei-nav .elementor-nav-menu--main .elementor-nav-menu {
  gap: 32px;
}

.merumei-nav .elementor-nav-menu--main .elementor-item {
  font-family: var(--merumei-font-sans);
  font-size: 11px;
  font-weight: 500;
  letter-spacing: 0.28em;
  text-transform: uppercase;
  color: rgba(20, 17, 17, 0.7);
  padding: 0 !important;
  transition: color 0.2s ease;
}

.merumei-nav .elementor-nav-menu--main .elementor-item:hover,
.merumei-nav .elementor-nav-menu--main .elementor-item.elementor-item-active,
.merumei-nav .elementor-nav-menu--main .current-menu-item > a,
.merumei-nav .elementor-nav-menu--main .current-menu-ancestor > a {
  color: var(--merumei-terracotta);
}

/* =========================================================
   HEADER — Toggle mobile
   Gestisce l'icona hamburger del menu mobile Elementor.
   ========================================================= */

.merumei-nav .elementor-menu-toggle {
  padding: 0;
  color: var(--merumei-ink);
  background: transparent;
  border: 0;
  min-height: auto;
}

.merumei-nav .elementor-menu-toggle:hover {
  color: var(--merumei-terracotta);
}

.merumei-nav .elementor-menu-toggle i,
.merumei-nav .elementor-menu-toggle svg {
  font-size: 20px;
}

/* =========================================================
   HEADER — Menu mobile dropdown
   Obiettivo:
   dropdown chiaro, pulito, coerente con header trasparente.
   ========================================================= */

.merumei-nav .elementor-nav-menu--dropdown {
  margin-top: 16px;
  padding: 24px;
  background: rgba(251, 250, 248, 0.95);
  backdrop-filter: blur(16px);
  -webkit-backdrop-filter: blur(16px);
  border-top: 1px solid var(--merumei-border-soft);
}

.merumei-nav .elementor-nav-menu--dropdown .elementor-item {
  font-family: var(--merumei-font-sans);
  font-size: 11px;
  font-weight: 500;
  letter-spacing: 0.28em;
  text-transform: uppercase;
  color: rgba(20, 17, 17, 0.8);
  padding: 10px 0 !important;
  transition: color 0.2s ease;
}

.merumei-nav .elementor-nav-menu--dropdown .elementor-item:hover,
.merumei-nav .elementor-nav-menu--dropdown .elementor-item.elementor-item-active {
  color: var(--merumei-terracotta);
  background: transparent;
}

/* =========================================================
   HEADER — Icone search/account
   Classi:
   - merumei-search
   - merumei-account
   ========================================================= */

.merumei-search .elementor-icon,
.merumei-account .elementor-icon {
  color: var(--merumei-ink);
  transition: color 0.2s ease, transform 0.2s ease;
}

.merumei-search .elementor-icon:hover,
.merumei-account .elementor-icon:hover {
  color: var(--merumei-terracotta);
}

.merumei-search .elementor-icon svg,
.merumei-account .elementor-icon svg,
.merumei-search .elementor-icon i,
.merumei-account .elementor-icon i {
  width: 18px;
  height: 18px;
  font-size: 18px;
}

/* =========================================================
   HEADER — Widget Menu Cart
   Classe da assegnare al widget cart Elementor:
   merumei-cart

   Nota:
   qui si stilizza solo icona e badge.
   Il pannello laterale è nel file 03.
   ========================================================= */

.merumei-cart .elementor-menu-cart__toggle_wrapper a,
.merumei-cart .elementor-menu-cart__toggle_wrapper,
.merumei-cart .elementor-button-icon {
  color: var(--merumei-ink);
  transition: color 0.2s ease;
}

.merumei-cart .elementor-menu-cart__toggle_wrapper a:hover,
.merumei-cart .elementor-menu-cart__toggle_wrapper:hover,
.merumei-cart:hover .elementor-button-icon {
  color: var(--merumei-terracotta);
}

.merumei-cart .elementor-menu-cart__toggle .elementor-button-icon[data-counter]:after,
.merumei-cart .elementor-menu-cart__toggle_wrapper .elementor-button-icon[data-counter]:after {
  background: var(--merumei-terracotta);
  color: var(--merumei-cream);
  font-family: var(--merumei-font-sans);
  font-size: 10px;
  font-weight: 500;
  min-width: 16px;
  min-height: 16px;
  line-height: 16px;
  box-shadow: none;
}

/* =========================================================
   HEADER — Mobile
   Nasconde la ricerca su mobile per ridurre rumore visivo.
   ========================================================= */

@media (max-width: 767px) {
  .merumei-search {
    display: none;
  }
}

/* =========================================================
   HEADER — Spazio tra header e contenuto
   Utile se l'header è fixed/sticky.
   ========================================================= */

body:not(.elementor-editor-active) .site-main,
body:not(.elementor-editor-active) main {
  padding-top: 80px;
}

@media (max-width: 767px) {
  body:not(.elementor-editor-active) .site-main,
  body:not(.elementor-editor-active) main {
    padding-top: 64px;
  }
}/* End custom CSS */