.elementor-kit-6{--e-global-color-primary:#2F2A2C;--e-global-color-secondary:#574060;--e-global-color-text:#444242;--e-global-color-accent:#D7A557;--e-global-color-crema:#FFF9F0;--e-global-color-avorio:#FAF7F2;--e-global-color-lilla:#DCCFE2;--e-global-color-lillacornice:#D0BEDA;--e-global-color-lillapannello:#E6DCEB;--e-global-color-glicine:#E2B2F6;--e-global-color-oroscuro:#8F6A2E;--e-global-typography-primary-font-family:"Fraunces";--e-global-typography-primary-font-weight:300;--e-global-typography-secondary-font-family:"Fraunces";--e-global-typography-secondary-font-weight:300;--e-global-typography-text-font-family:"Jost";--e-global-typography-text-font-size:17px;--e-global-typography-text-font-weight:400;--e-global-typography-accent-font-family:"Jost";--e-global-typography-accent-font-size:17px;--e-global-typography-accent-font-weight:500;}.elementor-kit-6 e-page-transition{background-color:#FFBC7D;}.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 .site-branding{flex-direction:column;align-items:stretch;}.site-header{padding-inline-end:0px;padding-inline-start:0px;}.site-footer .site-branding{flex-direction:column;align-items:stretch;}@media(max-width:1024px){.elementor-section.elementor-section-boxed > .elementor-container{max-width:1024px;}.e-con{--container-max-width:1024px;}}@media(max-width:767px){.elementor-section.elementor-section-boxed > .elementor-container{max-width:767px;}.e-con{--container-max-width:767px;}}:root { --nero:#2F2A2C; --boiserie-nero-cornice:#3A3437; --grafite:#444242; --crema:#FFF9F0; --avorio:#FAF7F2; --boiserie-avorio-cornice:#EFE6F1; --lilla:#DCCFE2; --boiserie-lilla-cornice:#D0BEDA; --boiserie-lilla-pannello:#E6DCEB; --lilla-50:#F8F2FA; --prugna:#574060; --oro:#D7A557; --glicine:#E2B2F6; --bianco:#FFFFFF; --oro-scuro:#8F6A2E; --font-serif:Fraunces; --font-sans:Jost; --fs-display:clamp(3.5rem, 2.5rem + 4.444vw, 6.5rem); --fs-h1:clamp(2.625rem, 2.083rem + 2.407vw, 4.25rem); --fs-cta:clamp(2.25rem, 1.833rem + 1.852vw, 3.5rem); --fs-h2:clamp(2.125rem, 1.833rem + 1.296vw, 3rem); --fs-lead:clamp(1.5rem, 1.292rem + 0.9259vw, 2.125rem); --fs-quote:clamp(1.375rem, 1.208rem + 0.7407vw, 1.875rem); --fs-h3:clamp(1.5rem, 1.417rem + 0.3704vw, 1.75rem); --fs-contact:clamp(1.25rem, 1.208rem + 0.1852vw, 1.375rem); --fs-body:clamp(1rem, 0.9792rem + 0.09259vw, 1.062rem); --fs-body-s:0.9375rem; --fs-small:0.875rem; --fs-button:clamp(1rem, 0.9792rem + 0.09259vw, 1.062rem); --fs-nav:0.9375rem; --fs-label:clamp(0.75rem, 0.7083rem + 0.1852vw, 0.875rem); --fs-link:clamp(0.8125rem, 0.7917rem + 0.09259vw, 0.875rem); --fs-label-s:clamp(0.75rem, 0.7292rem + 0.09259vw, 0.8125rem); --space-4:4px; --space-8:8px; --space-12:12px; --space-16:16px; --space-20:20px; --space-24:24px; --space-28:28px; --space-32:32px; --space-48:48px; --space-64:64px; --radius-btn:6px; --section-y:clamp(4.5rem, 3.5rem + 4.444vw, 7.5rem); --section-y-l:clamp(5.5rem, 4.417rem + 4.815vw, 8.75rem); --gutter:clamp(1.25rem, -0.8333rem + 9.259vw, 7.5rem); --gap-cols:clamp(2.5rem, 1.333rem + 5.185vw, 6rem); --gap-hero:clamp(2.5rem, 1.667rem + 3.704vw, 5rem); --gap-section:clamp(2.5rem, 2.167rem + 1.481vw, 3.5rem); --boiserie-pad:clamp(2rem, 1.333rem + 2.963vw, 4rem); --cta-pad-y:clamp(3rem, 2.333rem + 2.963vw, 5rem); --cta-pad-x:clamp(1.5rem, 0rem + 6.667vw, 6rem); --container:1200px; --container-text:800px; --container-cta:1000px; --linea-footer:rgba(255,249,240,0.4); }
/* Start custom CSS *//* Kit 6 → Custom CSS (Elementor Pro). Sorgente: ATMOSPHERA EVENT DESIGN/tokens/kit-custom.css
   Applicare con: python3 tokens/apply_kit.py (unisce alle impostazioni esistenti del Kit, mai sostituirle) */

/* Font ospitati sullo staging (wp-content/uploads/fonts/, sorgenti in assets/fonts/), non più da Google.
   Fraunces variabile con dimensione ottica, SOFT e WONK come nel Figma; Jost variabile 400–500.
   Il caricamento Google di Elementor è spento (opzione elementor_google_font = 0). */
@font-face { font-family: "Fraunces"; font-style: normal; font-weight: 300 400; font-display: swap; src: url("/wp-content/uploads/fonts/fraunces.woff2") format("woff2"); }
@font-face { font-family: "Fraunces"; font-style: italic; font-weight: 300 400; font-display: swap; src: url("/wp-content/uploads/fonts/fraunces-italic.woff2") format("woff2"); }
@font-face { font-family: "Jost"; font-style: normal; font-weight: 400 500; font-display: swap; src: url("/wp-content/uploads/fonts/jost.woff2") format("woff2"); }
html { font-optical-sizing: auto; }

/* Base pagina */
body {
  background-color: var(--avorio);
  color: var(--grafite);
  font-family: var(--font-sans), sans-serif;
  -webkit-font-smoothing: antialiased;
}
::selection { background-color: var(--lilla); color: var(--nero); }

/* Fraunces come nel Figma: SOFT 0, WONK 1 (vale se il file del font ha gli assi) */
.elementor h1, .elementor h2, .elementor h3, .elementor h4, .elementor h5,
.t-display, .t-display-italic, .t-h1, .t-cta, .t-number, .t-h2, .t-lead, .t-quote, .t-h3, .t-contact {
  font-variation-settings: "SOFT" 0, "WONK" 1;
}

/* Titoli bilanciati su più righe */
.elementor h1, .elementor h2, .t-cta, .t-lead { text-wrap: balance; }

/* Focus visibile da tastiera (oro) */
.elementor a:focus-visible, .elementor button:focus-visible,
.elementor input:focus-visible, .elementor textarea:focus-visible, .elementor select:focus-visible {
  outline: 2px solid var(--oro);
  outline-offset: 3px;
}

/* Scorrimento morbido (disattivato con riduci movimento) */
@media (prefers-reduced-motion: no-preference) {
  html { scroll-behavior: smooth; }
}

/* Le immagini dentro le cornici riempiono il pannello senza bordi bianchi */
.pannello img, .pannello .e-image img { display: block; width: 100%; height: 100%; object-fit: cover; }

/* ---------- Header: menu principale (widget Menu classico di Elementor Pro dentro .header) ---------- */
/* !important: gli stili di base del widget Menu usano selettori con l'ID e i font/colori globali */
.header .elementor-widget-nav-menu { width: auto !important; }
.header .elementor-nav-menu--main .elementor-item {
  font-family: var(--font-sans), sans-serif !important;
  font-weight: 500 !important;
  font-size: var(--fs-nav) !important;
  line-height: 1.4 !important;
  letter-spacing: 0.08em !important;
  text-transform: uppercase !important;
  color: var(--crema) !important;
  padding: 8px 0 !important;
  transition: color 0.2s !important;
}
.header .elementor-nav-menu--main > .elementor-nav-menu > li + li { margin-left: 36px !important; }
.header .elementor-nav-menu--main .elementor-item:hover,
.header .elementor-nav-menu--main .elementor-item:focus,
.header .elementor-nav-menu--main .elementor-item.elementor-item-active,
.header .elementor-nav-menu--main .elementor-item.highlighted { color: var(--oro) !important; }
.header .elementor-nav-menu .sub-arrow { padding-left: 8px !important; font-size: 10px !important; }
/* sottomenu Servizi */
.header .elementor-nav-menu--main .sub-menu {
  background-color: var(--boiserie-nero-cornice) !important;
  padding: 12px 0 !important;
  min-width: 280px !important;
  border-top: 1px solid var(--oro) !important;
}
.header .elementor-nav-menu--main .sub-menu .elementor-sub-item {
  font-family: var(--font-sans), sans-serif !important;
  font-size: var(--fs-nav) !important;
  letter-spacing: 0.02em !important;
  text-transform: none !important;
  color: var(--crema) !important;
  padding: 10px 24px !important;
  background: none !important;
}
.header .elementor-nav-menu--main .sub-menu .elementor-sub-item:hover,
.header .elementor-nav-menu--main .sub-menu .elementor-sub-item.elementor-item-active { color: var(--oro) !important; background: none !important; }
/* mobile/tablet: hamburger e tendina */
.header .elementor-menu-toggle { background: none !important; color: var(--crema) !important; font-size: 26px !important; padding: 4px !important; }
.header .elementor-menu-toggle svg { fill: var(--crema) !important; }
.header .elementor-nav-menu--dropdown { background-color: var(--nero) !important; border-top: 1px solid var(--boiserie-nero-cornice) !important; }
.header .elementor-nav-menu--dropdown a {
  font-family: var(--font-sans), sans-serif !important;
  font-weight: 500 !important;
  font-size: var(--fs-nav) !important;
  letter-spacing: 0.08em !important;
  text-transform: uppercase !important;
  color: var(--crema) !important;
  padding: 16px var(--gutter) !important;
  background: none !important;
}
.header .elementor-nav-menu--dropdown .sub-menu a { text-transform: none !important; letter-spacing: 0.02em !important; padding-left: calc(var(--gutter) + 20px) !important; }
.header .elementor-nav-menu--dropdown a:hover,
.header .elementor-nav-menu--dropdown a.elementor-item-active { color: var(--oro) !important; background: none !important; }

/* tablet/mobile: il widget menu si riduce all'hamburger, così "Contatti" sta accanto all'icona */
@media (max-width: 1024px) {
  .header .elementor-widget-nav-menu { width: 34px !important; flex: 0 0 34px; }
  /* la tendina si aggancia all'header (position: relative), a tutta larghezza sotto la barra */
  .header .header-nav, .header .elementor-widget-nav-menu, .header .elementor-widget-nav-menu > .elementor-widget-container { position: static !important; }
  .header .elementor-nav-menu--dropdown.elementor-nav-menu__container {
    position: absolute !important; top: 100% !important; left: 0 !important; right: 0 !important;
    width: 100% !important; margin: 0 !important; z-index: 60;
  }
}

/* ---------- Footer ---------- */
.footer-testo a { color: var(--glicine); transition: color 0.2s; }
.footer-testo a:hover { color: var(--crema); }
.footer-menu a { color: var(--crema); }
.footer-menu a:hover { color: var(--glicine); }

/* H1 della Home: "Atmosphera" + <em>Event Design</em> = seconda riga corsiva lilla (un solo H1, come da keyword) */
.t-display em { font-style: italic; color: var(--lilla); line-height: 1.077; }
/* Ancora #servizi della Home: lascia spazio sopra quando ci si arriva dal link */
#servizi { scroll-margin-top: 120px; }

/* ---------- Form contatti (widget Form classico di Elementor Pro, classe contatti-form, pagina 126) ----------
   !important: gli stili di base del widget usano selettori con l'ID e i colori/font globali */
.contatti-form .elementor-form-fields-wrapper { margin: 0 -10px !important; }
.contatti-form .elementor-field-group { padding: 0 10px !important; margin-bottom: 24px !important; gap: 8px; }
.contatti-form .elementor-field-group:last-child { margin-bottom: 0 !important; }
.contatti-form .elementor-field-label {
  font-family: var(--font-sans), sans-serif !important;
  font-weight: 500 !important;
  font-size: var(--fs-label) !important;
  line-height: 1.71 !important;
  letter-spacing: 0.26em !important;
  text-transform: uppercase !important;
  color: var(--prugna) !important;
  padding: 0 !important;
  margin-bottom: 0 !important;
}
.contatti-form .elementor-field-textual,
.contatti-form .elementor-select-wrapper select {
  font-family: var(--font-sans), sans-serif !important;
  font-size: var(--fs-body) !important;
  color: var(--nero) !important;
  background-color: var(--crema) !important;
  border: 1px solid var(--boiserie-lilla-cornice) !important;
  border-radius: 0 !important;
  min-height: 48px !important;
  padding: 10px 14px !important;
  box-shadow: none !important;
}
.contatti-form textarea.elementor-field-textual { min-height: 140px !important; resize: vertical; }
.contatti-form .elementor-field-textual:focus,
.contatti-form .elementor-select-wrapper select:focus { border-color: var(--prugna) !important; outline: 2px solid var(--oro); outline-offset: 1px; }
.contatti-form .elementor-select-wrapper .select-caret-down-wrapper { color: var(--prugna) !important; }
.contatti-form .elementor-field-type-acceptance .elementor-field-subgroup label,
.contatti-form .elementor-field-option label {
  font-family: var(--font-sans), sans-serif !important;
  font-size: var(--fs-small) !important;
  line-height: 1.57 !important;
  color: var(--grafite) !important;
}
.contatti-form .elementor-field-type-acceptance .elementor-field-label { display: none; }
.contatti-form .elementor-field-option { display: flex; gap: 10px; align-items: flex-start; }
.contatti-form .elementor-field-option input { accent-color: var(--prugna); width: 16px; height: 16px; margin-top: 3px; flex-shrink: 0; }
.contatti-form .elementor-field-option a { color: var(--prugna); text-decoration: underline; }
.contatti-form .elementor-button {
  font-family: var(--font-sans), sans-serif !important;
  font-weight: 500 !important;
  font-size: var(--fs-button) !important;
  line-height: 29px !important;
  padding: 3px 15px !important;
  border-radius: var(--radius-btn) !important;
  background-color: var(--oro) !important;
  color: var(--nero) !important;
  min-height: 0 !important;
  transition: filter 0.2s;
}
.contatti-form .elementor-button:hover { filter: brightness(1.08); }
.contatti-form .elementor-message { font-family: var(--font-sans), sans-serif; font-size: var(--fs-small); color: var(--nero); }

/* ---------- Animazioni di entrata (03/11/2026) ----------
   Le classi atm-motion / atm-reveal / is-in le mette lo script "Atmosphera – animazioni di entrata"
   (Elementor → Codice personalizzato, sorgente tokens/animazioni.js). Senza script o con "riduci movimento"
   non si nasconde nulla. :root alza la priorità sopra le transizioni degli hover. Dopo l'entrata lo script toglie le classi, così restano solo gli hover. */
@media (prefers-reduced-motion: no-preference) {
  :root.atm-motion .atm-reveal {
    opacity: 0;
    transform: translate3d(0, 28px, 0);
    transition: opacity 0.9s cubic-bezier(0.2, 0.65, 0.2, 1) var(--atm-delay, 0s),
                transform 1.1s cubic-bezier(0.2, 0.65, 0.2, 1) var(--atm-delay, 0s);
  }
  /* cornici delle foto: dissolvenza con un leggero ingrandimento, senza salire */
  :root.atm-motion .atm-reveal.cornice, :root.atm-motion .atm-reveal.cornice-parete, :root.atm-motion .atm-reveal.cornice-cta { transform: scale(0.97); }
  /* fili oro: si disegnano (da sinistra; dal centro nei blocchi centrati) */
  :root.atm-motion .atm-reveal.filo-oro { opacity: 1; transform: scaleX(0); transform-origin: left center; }
  :root.atm-motion .contenitore-testo > .atm-reveal.filo-oro { transform-origin: center; }
  :root.atm-motion .atm-reveal.is-in { opacity: 1; transform: none; }
}

/* ---------- Hover ---------- */
/* Card con link (Home, Private Events): tutta la card è cliccabile, si alza e la foto si avvicina piano */
.cornice-card:has(.t-link a) { position: relative; transition: transform 0.45s cubic-bezier(0.2, 0.65, 0.2, 1), box-shadow 0.45s ease; }
.cornice-card .t-link a::after { content: ""; position: absolute; inset: 0; z-index: 1; }
.pannello-card { overflow: hidden; }
.pannello-card .foto-card { transform-origin: 50% 100%; transition: transform 1.2s cubic-bezier(0.2, 0.65, 0.2, 1); }
@media (hover: hover) {
  .cornice-card:has(.t-link a):hover { transform: translate3d(0, -6px, 0); box-shadow: 0 24px 48px -28px rgba(47, 42, 44, 0.45); }
  .cornice-card:has(.t-link a):hover .foto-card { transform: scale(1.05); }
  .cornice-card:has(.t-link a):hover .t-link { color: var(--oro-scuro); }
}
/* "Scopri di più →": filo che si allunga sotto il testo */
.t-link a {
  text-decoration: none;
  background: linear-gradient(currentColor, currentColor) 0 100% / 0 1px no-repeat;
  padding-bottom: 3px;
  transition: background-size 0.4s cubic-bezier(0.2, 0.65, 0.2, 1);
}
.t-link a:hover, .t-link a:focus-visible, .cornice-card:hover .t-link a { background-size: 100% 1px; }
/* bottoni: si alzano di poco con un'ombra morbida (oltre alla luminosità già nella classe btn) */
.elementor a.btn { transition: filter 0.2s, transform 0.3s cubic-bezier(0.2, 0.65, 0.2, 1), box-shadow 0.3s ease; }
@media (hover: hover) {
  .elementor a.btn:hover { transform: translate3d(0, -2px, 0); box-shadow: 0 10px 20px -12px rgba(47, 42, 44, 0.55); }
}
.contatti-form .elementor-button { transition: filter 0.2s, transform 0.3s cubic-bezier(0.2, 0.65, 0.2, 1), box-shadow 0.3s ease !important; }
@media (hover: hover) {
  .contatti-form .elementor-button:hover { transform: translate3d(0, -2px, 0); box-shadow: 0 10px 20px -12px rgba(47, 42, 44, 0.55); }
}
/* voci del menu: filo oro sotto la voce in hover */
.header .elementor-nav-menu--main > .elementor-nav-menu > li > .elementor-item { position: relative; }
.header .elementor-nav-menu--main > .elementor-nav-menu > li > .elementor-item::before {
  content: ""; position: absolute; left: 0; right: 0; bottom: 2px; height: 1px; background: var(--oro);
  transform: scaleX(0); transform-origin: left; transition: transform 0.35s cubic-bezier(0.2, 0.65, 0.2, 1);
}
.header .elementor-nav-menu--main > .elementor-nav-menu > li > .elementor-item:hover::before,
.header .elementor-nav-menu--main > .elementor-nav-menu > li > .elementor-item.elementor-item-active::before { transform: scaleX(1); }/* End custom CSS */