.elementor-kit-169{--e-global-color-primary:#E8651A;--e-global-color-secondary:#1A1A18;--e-global-color-text:#2C2C28;--e-global-color-accent:#C04F0E;--e-global-color-624f752:#6B6B5E;--e-global-color-a92d65d:#FAF7F2;--e-global-color-d79f3d5:#F2EDE4;--e-global-color-58cb474:#D9D0C1;--e-global-typography-primary-font-family:"Playfair Display";--e-global-typography-primary-font-size:72px;--e-global-typography-primary-font-weight:900;--e-global-typography-secondary-font-family:"Playfair Display";--e-global-typography-secondary-font-size:36px;--e-global-typography-secondary-font-weight:700;--e-global-typography-text-font-family:"DM Sans";--e-global-typography-text-font-size:16px;--e-global-typography-text-font-weight:300;--e-global-typography-accent-font-family:"DM Mono";--e-global-typography-accent-font-weight:400;color:var( --e-global-color-text );font-family:var( --e-global-typography-text-font-family ), Sans-serif;font-size:var( --e-global-typography-text-font-size );font-weight:var( --e-global-typography-text-font-weight );}.elementor-kit-169 e-page-transition{background-color:#FFBC7D;}.elementor-kit-169 a{color:var( --e-global-color-accent );font-family:var( --e-global-typography-accent-font-family ), Sans-serif;font-weight:var( --e-global-typography-accent-font-weight );}.elementor-kit-169 h1{font-family:var( --e-global-typography-primary-font-family ), Sans-serif;font-size:var( --e-global-typography-primary-font-size );font-weight:var( --e-global-typography-primary-font-weight );}.elementor-kit-169 h2{font-family:var( --e-global-typography-secondary-font-family ), Sans-serif;font-size:var( --e-global-typography-secondary-font-size );font-weight:var( --e-global-typography-secondary-font-weight );}.elementor-kit-169 h3{font-family:var( --e-global-typography-secondary-font-family ), Sans-serif;font-size:var( --e-global-typography-secondary-font-size );font-weight:var( --e-global-typography-secondary-font-weight );}.elementor-kit-169 h4{font-family:var( --e-global-typography-secondary-font-family ), Sans-serif;font-size:var( --e-global-typography-secondary-font-size );font-weight:var( --e-global-typography-secondary-font-weight );}.elementor-kit-169 button,.elementor-kit-169 input[type="button"],.elementor-kit-169 input[type="submit"],.elementor-kit-169 .elementor-button{font-family:var( --e-global-typography-accent-font-family ), Sans-serif;font-weight:var( --e-global-typography-accent-font-weight );color:var( --e-global-color-accent );border-radius:8px 8px 8px 8px;}.elementor-section.elementor-section-boxed > .elementor-container{max-width:1140px;}.e-con{--container-max-width:1140px;}.elementor-widget:not(:last-child){--kit-widget-spacing:20px;}.elementor-element{--widgets-spacing:20px 20px;--widgets-spacing-row:20px;--widgets-spacing-column:20px;}{}h1.entry-title{display:var(--page-title-display);}.site-header .header-inner{width:1251px;max-width:100%;}.site-header{padding-inline-end:0px;padding-inline-start:0px;}.site-header .site-branding .site-logo img{width:186px;max-width:186px;}.site-header .site-navigation ul.menu > li > a{color:var( --e-global-color-primary );}.site-header .site-navigation ul.menu > li.menu-item-has-children::after{color:var( --e-global-color-primary );}.site-footer{padding-inline-end:0px;padding-inline-start:0px;}.site-footer .site-branding .site-logo img{width:184px;max-width:184px;}.site-footer .copyright p{color:var( --e-global-color-a92d65d );}@media(max-width:1024px){.elementor-kit-169{font-size:var( --e-global-typography-text-font-size );}.elementor-kit-169 h1{font-size:var( --e-global-typography-primary-font-size );}.elementor-kit-169 h2{font-size:var( --e-global-typography-secondary-font-size );}.elementor-kit-169 h3{font-size:var( --e-global-typography-secondary-font-size );}.elementor-kit-169 h4{font-size:var( --e-global-typography-secondary-font-size );}.elementor-section.elementor-section-boxed > .elementor-container{max-width:1024px;}.e-con{--container-max-width:1024px;}}@media(max-width:767px){.elementor-kit-169{font-size:var( --e-global-typography-text-font-size );}.elementor-kit-169 h1{font-size:var( --e-global-typography-primary-font-size );}.elementor-kit-169 h2{font-size:var( --e-global-typography-secondary-font-size );}.elementor-kit-169 h3{font-size:var( --e-global-typography-secondary-font-size );}.elementor-kit-169 h4{font-size:var( --e-global-typography-secondary-font-size );}.elementor-section.elementor-section-boxed > .elementor-container{max-width:767px;}.e-con{--container-max-width:767px;}}/* Start custom CSS *//* ============================================================
   DEZI LEGNAMI S.p.A. — dezilegnami.it
   CSS Personalizzato per Elementor
   Versione 1.0 — 2024
   Redatto da Excogito — excogito.me
   
   COME USARE:
   Incolla tutto questo file in:
   Elementor > Kit di stile globale > CSS personalizzato
   OPPURE
   Aspetto > Personalizza > CSS aggiuntivo
   ============================================================ */


/* ============================================================
   1. VARIABILI GLOBALI — Design System Dezi
   ============================================================ */

:root {

  /* Colori brand */
  --dezi-orange:      #E8651A;
  --dezi-orange-dk:   #C04F0E;
  --dezi-orange-lt:   rgba(232, 101, 26, 0.12);
  --dezi-charcoal:    #1A1A18;
  --dezi-graphite:    #2C2C28;
  --dezi-stone:       #6B6B5E;
  --dezi-linen:       #F2EDE4;
  --dezi-cream:       #FAF7F2;
  --dezi-white:       #FFFFFF;
  --dezi-beige:       #D9D0C1;

  /* Toni del legno */
  --wood-light:       #C8986A;
  --wood-medium:      #9B6B3A;
  --wood-dark:        #5C3D1E;

  /* Tipografia */
  --font-display:     'Playfair Display', Georgia, serif;
  --font-body:        'DM Sans', sans-serif;
  --font-mono:        'DM Mono', monospace;

  /* Spaziature */
  --section-pad:      100px;
  --container-max:    1280px;
  --gutter:           40px;
  --radius:           2px;

  /* Transizioni */
  --ease-smooth:      cubic-bezier(0.25, 0.46, 0.45, 0.94);
  --ease-bounce:      cubic-bezier(0.34, 1.56, 0.64, 1);
}


/* ============================================================
   2. RESET E BASE GLOBALE
   ============================================================ */

html {
  scroll-behavior: smooth;
}

body {
  overflow-x: hidden;
  padding-top: 72px; /* Compensazione header fisso */
}

img {
  max-width: 100%;
  display: block;
}

*:focus-visible {
  outline: 2px solid var(--dezi-orange);
  outline-offset: 3px;
}


/* ============================================================
   3. TIPOGRAFIA GLOBALE
   ============================================================ */

/* Titoli — Playfair Display */
.elementor h1,
.elementor h2,
.elementor h3,
.elementor .elementor-heading-title {
  font-family: var(--font-display);
  color: var(--dezi-charcoal);
  line-height: 1.1;
}

/* Corpo testo — DM Sans */
.elementor p,
.elementor .elementor-text-editor,
.elementor .elementor-widget-text-editor {
  font-family: var(--font-body);
  line-height: 1.8;
}

/* H1 hero */
.elementor h1 {
  font-size: clamp(52px, 7vw, 96px);
  font-weight: 900;
  line-height: 0.95;
}

/* H2 sezione */
.elementor h2 {
  font-size: clamp(36px, 4vw, 56px);
  font-weight: 700;
}

/* H3 card / sottotitolo */
.elementor h3 {
  font-size: 26px;
  font-weight: 700;
}

/* Testo corsivo arancione (usato nei titoli hero) */
.elementor h1 em,
.elementor h2 em {
  font-style: italic;
  color: var(--dezi-orange);
}

/* Classe helper: etichetta eyebrow sopra i titoli */
.dezi-eyebrow {
  font-family: var(--font-mono);
  font-size: 11px;
  font-weight: 400;
  letter-spacing: 0.25em;
  text-transform: uppercase;
  color: var(--dezi-orange);
  display: flex;
  align-items: center;
  gap: 12px;
  margin-bottom: 16px;
}

.dezi-eyebrow::before {
  content: '';
  display: inline-block;
  width: 28px;
  height: 1px;
  background: var(--dezi-orange);
  flex-shrink: 0;
}

/* Classe helper: etichetta mono piccola (es. dati, badge) */
.dezi-label {
  font-family: var(--font-mono);
  font-size: 10px;
  letter-spacing: 0.2em;
  text-transform: uppercase;
  color: var(--dezi-stone);
}

/* Classe helper: testo chiaro su sfondo scuro */
.dezi-text-muted-light {
  color: rgba(255, 255, 255, 0.55);
}


/* ============================================================
   4. HEADER E NAVIGAZIONE
   ============================================================ */

/* ============================================================
   HEADER FISSO — Flexbox Container
   ============================================================ */

.dezi-header-wrap {
  width: 100% !important;
  left: 0 !important;
  right: 0 !important;
  top: 0 !important;
  z-index: 9999 !important;
  min-height: 72px !important;
  display: flex !important;
  align-items: center !important;
  background: rgba(26, 26, 24, 0.92) !important;
  backdrop-filter: blur(12px) !important;
  -webkit-backdrop-filter: blur(12px) !important;
  border-bottom: 1px solid rgba(232, 101, 26, 0.25) !important;
}

/* Riduzione altezza header allo scroll */
.elementor-location-header.sticky-active,
header.site-header.sticky {
  height: 60px !important;
}

/* Logo nel header */
.elementor-location-header .site-logo img,
.elementor-location-header .elementor-widget-site-logo img {
  max-height: 44px;
  width: auto;
  transition: opacity 0.25s;
}

.elementor-location-header .site-logo img:hover {
  opacity: 0.85;
}

/* Link di navigazione */
.elementor-nav-menu > li > a,
.elementor-nav-menu--main .elementor-item {
  font-family: var(--font-body) !important;
  font-size: 13px !important;
  font-weight: 500 !important;
  letter-spacing: 0.12em !important;
  text-transform: uppercase !important;
  color: rgba(255, 255, 255, 0.65) !important;
  transition: color 0.25s !important;
  position: relative;
}

/* Hover link nav — sottolineatura arancione */
.elementor-nav-menu > li > a:hover,
.elementor-nav-menu--main .elementor-item:hover,
.elementor-nav-menu--main .elementor-item.elementor-item-active {
  color: #ffffff !important;
}

.elementor-nav-menu--main .elementor-item::after {
  content: '';
  position: absolute;
  bottom: -4px;
  left: 0;
  right: 100%;
  height: 1px;
  background: var(--dezi-orange);
  transition: right 0.3s var(--ease-smooth);
}

.elementor-nav-menu--main .elementor-item:hover::after,
.elementor-nav-menu--main .elementor-item.elementor-item-active::after {
  right: 0;
}

/* CTA button nel menu — voce "Richiedi preventivo" */
/* Aggiungi la classe CSS "menu-cta" alla voce di menu in Aspetto > Menu */
.menu-cta > a,
.elementor-nav-menu .menu-cta > a {
  background: var(--dezi-orange) !important;
  color: #ffffff !important;
  padding: 9px 22px !important;
  border-radius: var(--radius) !important;
  font-size: 12px !important;
  letter-spacing: 0.15em !important;
  transition: background 0.25s !important;
  border: none !important;
}

.menu-cta > a:hover,
.elementor-nav-menu .menu-cta > a:hover {
  background: var(--dezi-orange-dk) !important;
  color: #ffffff !important;
}

.menu-cta > a::after {
  display: none !important;
}

/* Menu hamburger mobile — colore bianco */
.elementor-menu-toggle {
  color: #ffffff !important;
}

.elementor-menu-toggle svg {
  fill: #ffffff !important;
}


/* ============================================================
   5. BOTTONI GLOBALI
   ============================================================ */

/* Bottone primario — arancione */
.elementor-button,
.elementor-button-wrapper .elementor-button {
  font-family: var(--font-body) !important;
  font-size: 13px !important;
  font-weight: 500 !important;
  letter-spacing: 0.12em !important;
  text-transform: uppercase !important;
  border-radius: var(--radius) !important;
  padding: 16px 32px !important;
  transition: all 0.3s var(--ease-smooth) !important;
}

.elementor-button.elementor-button-primary,
.elementor-button[style*="background-color: #E8651A"],
.elementor-button[style*="background-color: rgb(232, 101, 26)"] {
  background: var(--dezi-orange) !important;
  color: #ffffff !important;
  border: 1px solid var(--dezi-orange) !important;
}

.elementor-button.elementor-button-primary:hover {
  background: transparent !important;
  color: var(--dezi-orange) !important;
}

/* Bottone ghost / outline */
.elementor-button.btn-ghost {
  background: transparent !important;
  color: var(--dezi-stone) !important;
  border: none !important;
  padding: 0 !important;
  display: inline-flex !important;
  align-items: center !important;
  gap: 10px !important;
}

.elementor-button.btn-ghost:hover {
  color: var(--dezi-charcoal) !important;
}

/* Bottone su sfondo scuro — ghost versione chiara */
.elementor-section.dezi-dark .elementor-button.btn-ghost {
  color: rgba(255, 255, 255, 0.55) !important;
}

.elementor-section.dezi-dark .elementor-button.btn-ghost:hover {
  color: #ffffff !important;
}


/* ============================================================
   6. SEZIONE HERO — sfondo chiaro
   ============================================================ */

/* La sezione hero ha classe CSS "dezi-hero" in Elementor */
.dezi-hero.elementor-section {
  min-height: 100vh;
  background-color: var(--dezi-cream);
  overflow: hidden;
  position: relative;
}

/* Overlay gradiente sull'immagine di sfondo hero */
/* Imposta in Elementor: Sfondo > Overlay > Gradiente */
/* 160° — Da #FAF7F2 opacità 0% (sinistra) a #FAF7F2 opacità 97% (destra-basso) */
.dezi-hero .elementor-background-overlay {
  background: linear-gradient(
    160deg,
    rgba(242, 237, 228, 0.0) 0%,
    rgba(242, 237, 228, 0.60) 45%,
    rgba(242, 237, 228, 0.97) 100%
  ) !important;
}

/* Padding hero: compensa header fisso (72px) */
.dezi-hero > .elementor-container {
  padding-top: 120px;
  padding-bottom: 90px;
}

/* Titolo hero — colore scuro su sfondo chiaro */
.dezi-hero .elementor-heading-title {
  color: var(--dezi-charcoal) !important;
  font-size: clamp(52px, 7vw, 96px) !important;
  font-weight: 900 !important;
  line-height: 0.95 !important;
}

.dezi-hero .elementor-heading-title em {
  color: var(--dezi-orange) !important;
}

/* Sottotitolo hero */
.dezi-hero .elementor-widget-text-editor p {
  color: var(--dezi-stone) !important;
  font-size: 17px !important;
  font-weight: 300 !important;
  max-width: 520px;
}

/* Statistiche laterali nella hero */
.dezi-hero .dezi-stat-number {
  font-family: var(--font-display);
  font-size: 40px;
  font-weight: 900;
  color: var(--dezi-charcoal);
  line-height: 1;
  display: block;
}

.dezi-hero .dezi-stat-number span {
  color: var(--dezi-orange);
}

.dezi-hero .dezi-stat-label {
  font-family: var(--font-mono);
  font-size: 10px;
  letter-spacing: 0.2em;
  text-transform: uppercase;
  color: var(--dezi-stone);
  display: block;
  margin-top: 4px;
}

/* Scroll indicator animato */
.dezi-scroll-indicator {
  position: absolute;
  bottom: 30px;
  left: 50%;
  transform: translateX(-50%);
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 8px;
  font-family: var(--font-mono);
  font-size: 9px;
  letter-spacing: 0.2em;
  text-transform: uppercase;
  color: rgba(26, 26, 24, 0.35);
  pointer-events: none;
}

.dezi-scroll-indicator::before {
  content: '';
  display: block;
  width: 1px;
  height: 40px;
  background: linear-gradient(to bottom, var(--dezi-orange), transparent);
  animation: scrollPulse 2s ease-in-out infinite;
}

@keyframes scrollPulse {
  0%, 100% { opacity: 0.3; transform: scaleY(1); }
  50%       { opacity: 1;   transform: scaleY(0.7); }
}


/* ============================================================
   7. SEZIONE STORIA — sfondo cream
   ============================================================ */

.dezi-storia.elementor-section {
  background-color: var(--dezi-cream);
}

.dezi-storia .elementor-heading-title {
  color: var(--dezi-charcoal);
}

.dezi-storia .elementor-widget-text-editor p {
  color: var(--dezi-stone);
  font-size: 16px;
  font-weight: 300;
  line-height: 1.8;
}

/* Box citazione */
.dezi-quote {
  padding: 28px 32px;
  border-left: 3px solid var(--dezi-orange);
  background: rgba(232, 101, 26, 0.04);
  margin-top: 32px;
}

.dezi-quote p {
  font-family: var(--font-display) !important;
  font-size: 20px !important;
  font-style: italic !important;
  line-height: 1.5 !important;
  color: var(--dezi-charcoal) !important;
}

.dezi-quote cite {
  display: block;
  margin-top: 12px;
  font-family: var(--font-mono);
  font-size: 10px;
  letter-spacing: 0.15em;
  text-transform: uppercase;
  color: var(--dezi-orange);
  font-style: normal;
}

/* Timeline items */
.dezi-timeline-item {
  display: grid;
  grid-template-columns: 72px 1fr;
  gap: 24px;
  padding: 24px 0;
  border-bottom: 1px solid rgba(26, 26, 24, 0.08);
}

.dezi-timeline-item:last-child {
  border-bottom: none;
}

.dezi-timeline-year {
  font-family: var(--font-display);
  font-size: 22px;
  font-weight: 900;
  color: var(--dezi-orange);
  line-height: 1;
  padding-top: 4px;
}

.dezi-timeline-content h4 {
  font-family: var(--font-body);
  font-size: 15px;
  font-weight: 500;
  color: var(--dezi-charcoal);
  margin-bottom: 6px;
}

.dezi-timeline-content p {
  font-family: var(--font-body);
  font-size: 14px;
  line-height: 1.6;
  color: var(--dezi-stone);
}


/* ============================================================
   8. STRIP NUMERICA — sfondo arancione
   ============================================================ */

.dezi-numeri.elementor-section {
  background-color: var(--dezi-orange);
  padding-top: 64px;
  padding-bottom: 64px;
}

.dezi-numeri .dezi-numero-value {
  font-family: var(--font-display);
  font-size: 56px;
  font-weight: 900;
  color: #ffffff;
  line-height: 1;
  display: block;
}

.dezi-numeri .dezi-numero-value .unit {
  font-size: 28px;
}

.dezi-numeri .dezi-numero-label {
  font-family: var(--font-mono);
  font-size: 11px;
  letter-spacing: 0.2em;
  text-transform: uppercase;
  color: rgba(255, 255, 255, 0.6);
  display: block;
  margin-top: 10px;
}

/* Divisore verticale tra i numeri */
.dezi-numeri .elementor-col-25:not(:last-child) {
  border-right: 1px solid rgba(255, 255, 255, 0.2);
}


/* ============================================================
   9. SEZIONE PRODOTTI — sfondo charcoal
   ============================================================ */

.dezi-prodotti.elementor-section {
  background-color: var(--dezi-charcoal);
}

.dezi-prodotti .elementor-heading-title {
  color: #ffffff !important;
}

.dezi-prodotti .elementor-heading-title em {
  color: var(--dezi-orange) !important;
}

.dezi-prodotti .elementor-widget-text-editor p {
  color: rgba(255, 255, 255, 0.45);
  font-size: 15px;
  line-height: 1.7;
}

/* Card prodotto */
.dezi-prodotto-card {
  position: relative;
  overflow: hidden;
  background: var(--dezi-graphite);
  cursor: pointer;
}

/* Overlay gradiente sulla card */
.dezi-prodotto-card .elementor-background-overlay {
  background: linear-gradient(
    to top,
    rgba(26, 26, 24, 0.95) 0%,
    rgba(26, 26, 24, 0.4) 40%,
    transparent 100%
  ) !important;
  transition: opacity 0.35s var(--ease-smooth);
}

/* Zoom immagine hover sulla card */
.dezi-prodotto-card .elementor-widget-image img,
.dezi-prodotto-card > .elementor-background-video-container,
.dezi-prodotto-card .e-con-inner {
  transition: transform 0.6s var(--ease-smooth) !important;
}

.dezi-prodotto-card:hover .elementor-widget-image img {
  transform: scale(1.04) !important;
}

/* Etichetta categoria sulla card */
.dezi-card-category {
  font-family: var(--font-mono);
  font-size: 10px;
  letter-spacing: 0.2em;
  text-transform: uppercase;
  color: var(--dezi-orange);
  margin-bottom: 8px;
  display: block;
}

/* Nome prodotto sulla card */
.dezi-card-name {
  font-family: var(--font-display);
  font-size: 26px;
  font-weight: 700;
  color: #ffffff;
  line-height: 1.1;
  margin-bottom: 12px;
}

/* Descrizione sulla card */
.dezi-card-desc {
  font-family: var(--font-body);
  font-size: 14px;
  line-height: 1.6;
  color: rgba(255, 255, 255, 0.55);
  margin-bottom: 20px;
}

/* Link "Scopri la gamma →" */
.dezi-card-link {
  font-family: var(--font-body);
  font-size: 12px;
  font-weight: 500;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--dezi-orange);
  display: inline-flex;
  align-items: center;
  gap: 8px;
  transition: gap 0.25s;
  text-decoration: none;
}

.dezi-prodotto-card:hover .dezi-card-link {
  gap: 14px;
}


/* ============================================================
   10. SEZIONE FINITURE PVC — sfondo charcoal
   ============================================================ */

.dezi-finiture.elementor-section {
  background-color: var(--dezi-charcoal);
}

.dezi-finiture .elementor-heading-title {
  color: #ffffff !important;
}

.dezi-finiture .elementor-widget-text-editor p {
  color: rgba(255, 255, 255, 0.4);
  font-size: 15px;
  line-height: 1.7;
}

/* Swatch colore */
.dezi-swatch {
  aspect-ratio: 1 / 1;
  border-radius: var(--radius);
  position: relative;
  overflow: hidden;
  cursor: pointer;
  transition: transform 0.3s var(--ease-bounce);
  margin-bottom: 10px;
}

.dezi-swatch:hover {
  transform: scale(1.06);
}

.dezi-swatch::after {
  content: '';
  position: absolute;
  inset: 0;
  border: 1px solid rgba(255, 255, 255, 0.08);
  border-radius: var(--radius);
  pointer-events: none;
}

/* Etichetta sotto lo swatch */
.dezi-swatch-label {
  font-family: var(--font-mono);
  font-size: 10px;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: rgba(255, 255, 255, 0.4);
  text-align: center;
  line-height: 1.3;
  display: block;
}

/* I 9 colori swatch */
.dezi-swatch.faggio-ev  { background: linear-gradient(135deg, #C8A06A, #A07840); }
.dezi-swatch.faggio-ch  { background: linear-gradient(135deg, #E0C898, #C0A870); }
.dezi-swatch.ciliegio   { background: linear-gradient(135deg, #8C3820, #6C2810); }
.dezi-swatch.acero      { background: linear-gradient(135deg, #D8C090, #B8A070); }
.dezi-swatch.avorio     { background: linear-gradient(135deg, #F0E8D0, #D8D0B8); }
.dezi-swatch.bianco     { background: linear-gradient(135deg, #F4F2EC, #E0DDD5); }
.dezi-swatch.grigio     { background: linear-gradient(135deg, #A0A0A0, #808080); }
.dezi-swatch.alluminio  { background: linear-gradient(135deg, #C0C4C8, #9098A0); }
.dezi-swatch.nero       { background: #111111; }

/* Separatore con CTA sotto le finiture */
.dezi-finiture-footer {
  margin-top: 48px;
  padding-top: 48px;
  border-top: 1px solid rgba(255, 255, 255, 0.06);
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.dezi-finiture-footer p {
  font-family: var(--font-mono);
  font-size: 11px;
  letter-spacing: 0.15em;
  text-transform: uppercase;
  color: rgba(255, 255, 255, 0.25);
}


/* ============================================================
   11. SEZIONE MACCHINARI — sfondo linen
   ============================================================ */

.dezi-macchinari.elementor-section {
  background-color: var(--dezi-linen);
  padding-left: 0 !important;
  padding-right: 0 !important;
  overflow: hidden;
}

.dezi-macchinari .elementor-heading-title {
  color: var(--dezi-charcoal) !important;
}

.dezi-macchinari .elementor-widget-text-editor p {
  color: var(--dezi-stone);
  font-size: 16px;
  line-height: 1.8;
}

/* Galleria orizzontale — scroll snapping */
.dezi-gallery-scroll {
  display: flex;
  gap: 3px;
  overflow-x: auto;
  scroll-snap-type: x mandatory;
  scrollbar-width: none;
  -ms-overflow-style: none;
  padding: 0 var(--gutter);
}

.dezi-gallery-scroll::-webkit-scrollbar {
  display: none;
}

/* Singolo item galleria */
.dezi-gallery-item {
  flex: 0 0 420px;
  height: 300px;
  overflow: hidden;
  scroll-snap-align: start;
  position: relative;
  background: var(--dezi-graphite);
}

.dezi-gallery-item img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform 0.6s var(--ease-smooth), filter 0.4s;
  filter: grayscale(15%);
}

.dezi-gallery-item:hover img {
  transform: scale(1.05);
  filter: grayscale(0%);
}

/* Didascalia sull'item galleria */
.dezi-gallery-item-label {
  position: absolute;
  bottom: 16px;
  left: 16px;
  background: rgba(26, 26, 24, 0.8);
  padding: 6px 12px;
  font-family: var(--font-mono);
  font-size: 10px;
  letter-spacing: 0.15em;
  text-transform: uppercase;
  color: rgba(255, 255, 255, 0.6);
  pointer-events: none;
}

/* Usa anche con Elementor Carousel widget */
.dezi-macchinari .elementor-carousel .swiper-slide {
  height: 300px !important;
  overflow: hidden;
}

.dezi-macchinari .elementor-carousel .swiper-slide img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform 0.6s var(--ease-smooth);
  filter: grayscale(15%);
}

.dezi-macchinari .elementor-carousel .swiper-slide:hover img {
  transform: scale(1.04);
  filter: grayscale(0%);
}

/* Frecce carosello — colore Dezi */
.dezi-macchinari .elementor-swiper-button {
  color: var(--dezi-orange) !important;
  background: rgba(26, 26, 24, 0.7);
  border-radius: 50%;
  width: 44px;
  height: 44px;
  display: flex;
  align-items: center;
  justify-content: center;
}

.dezi-macchinari .elementor-swiper-button:hover {
  background: var(--dezi-orange);
  color: #ffffff !important;
}


/* ============================================================
   12. SEZIONE CAMPIONI FOTOGRAFICI — sfondo cream
   ============================================================ */

.dezi-campioni.elementor-section {
  background-color: var(--dezi-cream);
}

.dezi-campioni .elementor-heading-title {
  color: var(--dezi-charcoal) !important;
}

.dezi-campioni .elementor-widget-text-editor p {
  color: var(--dezi-stone);
  font-size: 16px;
  line-height: 1.8;
}

/* Griglia immagini campioni */
.dezi-campioni .elementor-widget-image {
  overflow: hidden;
  position: relative;
}

.dezi-campioni .elementor-widget-image img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform 0.7s var(--ease-smooth);
}

.dezi-campioni .elementor-widget-image:hover img {
  transform: scale(1.04);
}

/* Gap minimo tra le immagini della griglia campioni */
.dezi-campioni .elementor-container {
  gap: 4px !important;
}

/* Etichetta sovrapposta sull'immagine */
.dezi-campione-tag {
  position: absolute;
  bottom: 20px;
  right: 20px;
  background: rgba(26, 26, 24, 0.7);
  padding: 5px 10px;
  font-family: var(--font-mono);
  font-size: 9px;
  letter-spacing: 0.15em;
  text-transform: uppercase;
  color: rgba(255, 255, 255, 0.6);
  pointer-events: none;
}


/* ============================================================
   13. SEZIONE CERTIFICAZIONI — sfondo cream
   ============================================================ */

.dezi-certificazioni.elementor-section {
  background-color: var(--dezi-cream);
}

.dezi-certificazioni .elementor-heading-title {
  color: var(--dezi-charcoal) !important;
}

.dezi-certificazioni .elementor-widget-text-editor p {
  color: var(--dezi-stone);
  font-size: 16px;
  line-height: 1.8;
}

/* Badge certificazione */
.dezi-cert-badge {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 10px;
  padding: 24px 28px;
  background: #ffffff;
  border-radius: 4px;
  box-shadow: 0 2px 20px rgba(0, 0, 0, 0.06);
  transition: transform 0.3s var(--ease-bounce), box-shadow 0.3s;
  text-align: center;
  cursor: default;
}

.dezi-cert-badge:hover {
  transform: translateY(-4px);
  box-shadow: 0 8px 32px rgba(0, 0, 0, 0.10);
}

.dezi-cert-badge-icon {
  width: 56px;
  height: 56px;
  background: var(--dezi-cream);
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 24px;
}

.dezi-cert-badge-name {
  font-family: var(--font-mono);
  font-size: 11px;
  font-weight: 500;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--dezi-charcoal);
}

/* Griglia immagini nella sezione certificazioni */
.dezi-certificazioni .dezi-cert-visual {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 3px;
}

.dezi-certificazioni .dezi-cert-visual img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  filter: grayscale(20%);
  transition: filter 0.4s;
}

.dezi-certificazioni .dezi-cert-visual img:hover {
  filter: grayscale(0%);
}


/* ============================================================
   14. SEZIONE CTA + FORM CONTATTI — sfondo charcoal
   ============================================================ */

.dezi-cta.elementor-section {
  background-color: var(--dezi-charcoal);
  position: relative;
  overflow: hidden;
}

/* Watermark testuale decorativo */
.dezi-cta.elementor-section::before {
  content: 'DEZI';
  position: absolute;
  right: -20px;
  top: 50%;
  transform: translateY(-50%);
  font-family: var(--font-display);
  font-size: 280px;
  font-weight: 900;
  color: rgba(255, 255, 255, 0.015);
  line-height: 1;
  letter-spacing: -10px;
  pointer-events: none;
  user-select: none;
}

/* Titolo CTA */
.dezi-cta .elementor-heading-title {
  color: #ffffff !important;
}

.dezi-cta .elementor-heading-title em {
  color: var(--dezi-orange) !important;
  font-style: italic !important;
}

/* Testo CTA */
.dezi-cta .elementor-widget-text-editor p {
  color: rgba(255, 255, 255, 0.5);
  font-size: 16px;
  line-height: 1.8;
}

/* Righe informazioni di contatto */
.dezi-contact-row {
  display: flex;
  align-items: center;
  gap: 14px;
  margin-bottom: 14px;
}

.dezi-contact-icon {
  width: 36px;
  height: 36px;
  border-radius: 50%;
  border: 1px solid rgba(232, 101, 26, 0.3);
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  color: rgba(232, 101, 26, 0.8);
}

.dezi-contact-text {
  font-family: var(--font-mono);
  font-size: 12px;
  color: rgba(255, 255, 255, 0.4);
  letter-spacing: 0.05em;
}

/* Box form — sfondo semi-trasparente */
.dezi-form-box {
  background: rgba(255, 255, 255, 0.04);
  border: 1px solid rgba(255, 255, 255, 0.08);
  padding: 48px;
  border-radius: 4px;
}

/* ---- WPForms styling sul dark background ---- */

/* Label */
.dezi-cta .wpforms-field label,
.dezi-cta .wpforms-field-label {
  font-family: var(--font-mono) !important;
  font-size: 10px !important;
  font-weight: 400 !important;
  letter-spacing: 0.2em !important;
  text-transform: uppercase !important;
  color: rgba(255, 255, 255, 0.4) !important;
  margin-bottom: 8px !important;
}

/* Input e textarea */
.dezi-cta .wpforms-field input[type="text"],
.dezi-cta .wpforms-field input[type="email"],
.dezi-cta .wpforms-field input[type="tel"],
.dezi-cta .wpforms-field textarea {
  background: rgba(255, 255, 255, 0.06) !important;
  border: 1px solid rgba(255, 255, 255, 0.1) !important;
  border-radius: var(--radius) !important;
  padding: 14px 18px !important;
  font-family: var(--font-body) !important;
  font-size: 15px !important;
  color: #ffffff !important;
  outline: none !important;
  width: 100% !important;
  transition: border-color 0.25s !important;
  box-shadow: none !important;
}

.dezi-cta .wpforms-field input::placeholder,
.dezi-cta .wpforms-field textarea::placeholder {
  color: rgba(255, 255, 255, 0.2) !important;
}

.dezi-cta .wpforms-field input:focus,
.dezi-cta .wpforms-field textarea:focus {
  border-color: var(--dezi-orange) !important;
  background: rgba(255, 255, 255, 0.08) !important;
}

/* Bottone submit */
.dezi-cta .wpforms-submit,
.dezi-cta .wpforms-submit-container button {
  width: 100% !important;
  background: var(--dezi-orange) !important;
  color: #ffffff !important;
  border: none !important;
  padding: 16px 24px !important;
  font-family: var(--font-body) !important;
  font-size: 13px !important;
  font-weight: 500 !important;
  letter-spacing: 0.15em !important;
  text-transform: uppercase !important;
  border-radius: var(--radius) !important;
  cursor: pointer !important;
  transition: background 0.25s !important;
  margin-top: 8px !important;
}

.dezi-cta .wpforms-submit:hover,
.dezi-cta .wpforms-submit-container button:hover {
  background: var(--dezi-orange-dk) !important;
}

/* Messaggio di successo */
.dezi-cta .wpforms-confirmation-container-full {
  background: rgba(232, 101, 26, 0.1) !important;
  border: 1px solid rgba(232, 101, 26, 0.3) !important;
  border-radius: 4px !important;
  padding: 24px !important;
  color: rgba(255, 255, 255, 0.8) !important;
  font-family: var(--font-body) !important;
}

/* Messaggi di errore */
.dezi-cta .wpforms-error {
  color: #ff6b6b !important;
  font-family: var(--font-mono) !important;
  font-size: 10px !important;
  letter-spacing: 0.1em !important;
  margin-top: 6px !important;
}

/* Anche Contact Form 7 se usato in alternativa */
.dezi-cta .wpcf7-form input[type="text"],
.dezi-cta .wpcf7-form input[type="email"],
.dezi-cta .wpcf7-form input[type="tel"],
.dezi-cta .wpcf7-form textarea {
  background: rgba(255, 255, 255, 0.06) !important;
  border: 1px solid rgba(255, 255, 255, 0.1) !important;
  border-radius: var(--radius) !important;
  padding: 14px 18px !important;
  font-family: var(--font-body) !important;
  color: #ffffff !important;
  width: 100% !important;
}

.dezi-cta .wpcf7-submit {
  background: var(--dezi-orange) !important;
  color: #ffffff !important;
  border: none !important;
  padding: 16px 32px !important;
  font-family: var(--font-body) !important;
  font-size: 13px !important;
  letter-spacing: 0.15em !important;
  text-transform: uppercase !important;
  border-radius: var(--radius) !important;
  cursor: pointer !important;
  width: 100% !important;
  transition: background 0.25s !important;
}

.dezi-cta .wpcf7-submit:hover {
  background: var(--dezi-orange-dk) !important;
}


/* ============================================================
   15. FOOTER — sfondo quasi nero
   ============================================================ */

.elementor-location-footer,
footer.site-footer,
#site-footer {
  background: #111110 !important;
  border-top: 1px solid rgba(232, 101, 26, 0.15);
}

/* Testo footer */
.elementor-location-footer p,
.elementor-location-footer .elementor-widget-text-editor {
  font-family: var(--font-body) !important;
  font-size: 14px !important;
  color: rgba(255, 255, 255, 0.3) !important;
  line-height: 1.7 !important;
}

/* Titoli colonne footer */
.elementor-location-footer .dezi-footer-col-title {
  font-family: var(--font-mono);
  font-size: 10px;
  letter-spacing: 0.2em;
  text-transform: uppercase;
  color: var(--dezi-orange);
  margin-bottom: 20px;
  display: block;
}

/* Link footer */
.elementor-location-footer a,
.elementor-location-footer .elementor-nav-menu a {
  font-family: var(--font-body) !important;
  font-size: 14px !important;
  color: rgba(255, 255, 255, 0.35) !important;
  transition: color 0.25s !important;
  text-decoration: none !important;
}

.elementor-location-footer a:hover,
.elementor-location-footer .elementor-nav-menu a:hover {
  color: #ffffff !important;
}

/* Footer bottom — copyright */
.dezi-footer-bottom {
  border-top: 1px solid rgba(255, 255, 255, 0.06);
  padding-top: 24px;
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.dezi-footer-bottom p {
  font-family: var(--font-mono) !important;
  font-size: 11px !important;
  color: rgba(255, 255, 255, 0.2) !important;
  letter-spacing: 0.08em !important;
}

/* Badge ISO nel footer */
.dezi-iso-badge {
  display: flex;
  align-items: center;
  gap: 8px;
  font-family: var(--font-mono);
  font-size: 10px;
  color: rgba(255, 255, 255, 0.3);
  letter-spacing: 0.1em;
}

.dezi-iso-badge::before {
  content: '';
  display: inline-block;
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: var(--dezi-orange);
  flex-shrink: 0;
}


/* ============================================================
   16. ANIMAZIONI DI INGRESSO — fade-up on scroll
   ============================================================ */

/* Usa la classe .dezi-fade-up sui widget Elementor
   (Avanzate > Classe CSS aggiuntiva) */

.dezi-fade-up {
  opacity: 0;
  transform: translateY(30px);
  transition: opacity 0.7s var(--ease-smooth),
              transform 0.7s var(--ease-smooth);
}

.dezi-fade-up.dezi-visible {
  opacity: 1;
  transform: translateY(0);
}

/* Ritardi per elementi figli */
.dezi-fade-up:nth-child(2) { transition-delay: 0.1s; }
.dezi-fade-up:nth-child(3) { transition-delay: 0.2s; }
.dezi-fade-up:nth-child(4) { transition-delay: 0.3s; }

/* Script per attivare le animazioni — aggiungilo in
   Elementor > Kit di stile > JS personalizzato
   (oppure in un widget HTML in fondo alla pagina):

   <script>
   const obs = new IntersectionObserver((entries) => {
     entries.forEach(e => {
       if (e.isIntersecting) e.target.classList.add('dezi-visible');
     });
   }, { threshold: 0.1, rootMargin: '0px 0px -40px 0px' });
   document.querySelectorAll('.dezi-fade-up').forEach(el => obs.observe(el));
   </script>
*/


/* ============================================================
   17. RESPONSIVE — Tablet (max 1024px)
   ============================================================ */

@media (max-width: 1024px) {

  :root {
    --gutter: 24px;
    --section-pad: 80px;
  }

  /* Hero stats su tablet: nascondi per spazio */
  .dezi-hero .dezi-stats-col {
    display: none;
  }

  /* Strip numerica: 2 colonne */
  .dezi-numeri .elementor-col-25 {
    width: 50% !important;
    border-right: none !important;
  }

  .dezi-numeri .elementor-col-25:nth-child(odd) {
    border-right: 1px solid rgba(255, 255, 255, 0.2) !important;
  }

  /* Finiture: 5 colonne */
  .dezi-finiture .elementor-col-auto {
    width: 20% !important;
  }

  /* Gallery macchinari: item più stretti */
  .dezi-gallery-item {
    flex: 0 0 320px;
  }
}


/* ============================================================
   18. RESPONSIVE — Mobile (max 768px)
   ============================================================ */

@media (max-width: 768px) {

  :root {
    --section-pad: 64px;
    --gutter: 20px;
  }

  /* Hero mobile */
  .dezi-hero .elementor-heading-title {
    font-size: 44px !important;
    line-height: 1 !important;
  }

  .dezi-hero .elementor-widget-text-editor p {
    font-size: 15px !important;
  }

  /* Padding hero compensato su mobile */
  .dezi-hero > .elementor-container {
    padding-top: 90px;
    padding-bottom: 60px;
  }

  /* Strip numerica: 2 colonne su mobile */
  .dezi-numeri .elementor-col-25 {
    width: 50% !important;
    border-right: none !important;
    border-bottom: 1px solid rgba(255, 255, 255, 0.15);
    padding-bottom: 20px !important;
    margin-bottom: 20px !important;
  }

  .dezi-numeri .dezi-numero-value {
    font-size: 40px;
  }

  /* Prodotti: una colonna */
  .dezi-prodotti .elementor-column {
    width: 100% !important;
  }

  /* Finiture: 3 colonne su mobile */
  .dezi-finiture .elementor-col-auto {
    width: 33.33% !important;
  }

  /* Gallery macchinari mobile */
  .dezi-gallery-item {
    flex: 0 0 280px;
    height: 220px;
  }

  /* CTA form: padding ridotto */
  .dezi-form-box {
    padding: 28px 20px;
  }

  /* Footer: tutto in colonna */
  .elementor-location-footer .elementor-column {
    width: 100% !important;
    margin-bottom: 32px;
  }

  /* Nascondi watermark su mobile */
  .dezi-cta.elementor-section::before {
    display: none;
  }
}


/* ============================================================
   19. UTILITÀ GENERALI
   ============================================================ */

/* Sezioni scure — classe helper */
.dezi-dark {
  background-color: var(--dezi-charcoal);
}

/* Sezioni chiare — classe helper */
.dezi-light {
  background-color: var(--dezi-cream);
}

/* Sezione linen */
.dezi-linen {
  background-color: var(--dezi-linen);
}

/* Testi su sfondo scuro */
.dezi-dark .elementor-heading-title {
  color: #ffffff !important;
}

.dezi-dark .elementor-widget-text-editor p {
  color: rgba(255, 255, 255, 0.55);
}

/* Larghezza contenuto limitata */
.dezi-max-w-520 { max-width: 520px; }
.dezi-max-w-600 { max-width: 600px; }
.dezi-max-w-800 { max-width: 800px; }

/* Allineamento testo */
.dezi-text-center { text-align: center !important; }
.dezi-text-right  { text-align: right  !important; }

/* Divisore linea arancione */
.dezi-divider {
  width: 100%;
  height: 1px;
  background: rgba(232, 101, 26, 0.2);
  margin: 0;
  border: none;
}

/* Divisore verticale */
.dezi-divider-v {
  width: 1px;
  height: 100%;
  background: rgba(232, 101, 26, 0.2);
}

/* Testo colore arancione */
.dezi-orange { color: var(--dezi-orange) !important; }

/* Overflow nascosto su contenitori immagine */
.dezi-overflow-hidden {
  overflow: hidden !important;
}
/* Compensazione header fisso */
body {
  padding-top: 72px;
}
/* ============================================================
   Fine CSS — Dezi Legnami v1.0
   Excogito — excogito.me
   ============================================================ *//* End custom CSS */