/* =========================================================
   HÖFERT — Restyle grafico (layer globale)  v2 · industriale
   Si appoggia ai token in style.css (:root --h-*)
   Font: Saira Expanded (display) + Saira (testo) + IBM Plex Mono (dati)
   REGOLE: niente pillole, niente righette/eyebrow/divisori decorativi,
           niente testi aggiunti — solo grafica sul contenuto esistente.
   ========================================================= */

:root{ --indigo-deep:#171A52; }

/* ---- Tipografia ---- */
body, p, li, span, a, input, textarea, button,
.elementor-widget-text-editor, .elementor-widget-container{
  font-family:"Saira",system-ui,-apple-system,Segoe UI,sans-serif;
}
h1,h2,h3,h4,h5,h6,
.elementor-heading-title,.sec-title,.sec-title h2,.heading,.title{
  font-family:"Saira Expanded","Saira",sans-serif !important;
  font-weight:700 !important;letter-spacing:-.005em;
}
body{color:var(--h-text);}
a{color:var(--h-link);transition:color .16s ease;}
a:hover{color:var(--h-link-hover);}

/* ---- Bottoni: SPIGOLO VIVO, maiuscolo (niente pillole) ---- */
.theme-btn,.elementor-button{
  border-radius:0 !important;
  font-family:"Saira",sans-serif !important;font-weight:600 !important;
  text-transform:uppercase !important;letter-spacing:.06em !important;
  transition:background .16s ease, color .16s ease !important;
}
/* default indigo pieno */
.theme-btn.style-four,.theme-btn.style-one,.elementor-button{
  background:var(--h-primary-500) !important;color:#fff !important;box-shadow:none !important;
}
.theme-btn.style-four:hover,.theme-btn.style-one:hover,.elementor-button:hover{background:var(--h-primary-600) !important;}
/* variante accento oro: classe .h-cta */
.theme-btn.h-cta,.elementor-button.h-cta{background:var(--h-accent-500) !important;color:var(--h-neutral-900) !important;}
.theme-btn.h-cta:hover,.elementor-button.h-cta:hover{background:var(--h-accent-600) !important;}

/* ================= HEADER ================= */
.main-header .header-lower{box-shadow:0 1px 0 var(--h-border);background:#fff;}
.main-header .header-lower .auto-container{max-width:1320px;}
.main-header .outer-box{display:flex;align-items:center;min-height:84px;}
/* logo ridimensionato e bilanciato */
.main-header .main-nav__logo{height:62px !important;width:auto !important;}
.main-header .logo-box{padding:10px 0 !important;margin:0 !important;display:flex;align-items:center;}
/* nav desktop (.main-menu) in stile Saira */
.main-header .menu-area{display:flex;align-items:center;gap:26px;margin-left:auto !important;padding-right:118px;}
.main-header .main-menu .navigation>li{margin-left:0 !important;}
.main-header .main-menu .navigation>li>a{
  font-family:"Saira",sans-serif !important;font-weight:600 !important;
  text-transform:uppercase;letter-spacing:.08em;font-size:14px;color:var(--h-ink,#0F121E) !important;
  padding:12px 16px !important;transition:color .16s ease;
}
.main-header .main-menu .navigation>li.current>a,
.main-header .main-menu .navigation>li.current-menu-item>a,
.main-header .main-menu .navigation>li:hover>a{color:var(--h-primary-600) !important;}
/* search: discreto */
.main-header .menu-right-content .search-btn{color:var(--h-neutral-500) !important;}

/* ---- Switch lingua: portato nell'angolo in alto a destra, stile mono ---- */
.elementor-271{position:relative;}
.elementor-271 .elementor-widget-polylang-language-switcher{
  position:absolute;top:-56px;right:48px;z-index:1200;margin:0 !important;
}
/* collasso la fascia vuota lasciata dallo switcher */
.elementor-271 .elementor-element-216b13c{min-height:0 !important;padding:0 !important;}
.cpel-switcher__toggle,.cpel-switcher__lang,.cpel-switcher__name{
  font-family:"IBM Plex Mono",monospace !important;font-size:13px !important;
  letter-spacing:.06em;text-transform:uppercase;color:var(--h-neutral-700) !important;
}
.cpel-switcher__toggle:hover .cpel-switcher__name{color:var(--h-primary-600) !important;}

/* =========================================================
   HERO — split netto (pannello indigo + foto reale a destra)
   Banner: .banner-section.style-two > .slide-item > .image-layer + .content-box
   Niente overlay totale, niente cerchi, niente eyebrow.
   ========================================================= */
.banner-section{position:relative;overflow:hidden;}
.banner-section .slide-item{position:relative;}
/* pannello indigo pieno sulla metà sinistra */
.banner-section .slide-item::before{
  content:"";position:absolute;top:0;bottom:0;left:0;right:46%;z-index:2;
  background:var(--indigo-deep);pointer-events:none;
}
/* raccordo morbido pannello->foto sul taglio */
.banner-section .image-layer::after{
  content:"";position:absolute;inset:0;pointer-events:none;
  background:linear-gradient(90deg,var(--indigo-deep) 0%,rgba(23,26,82,.0) 70%);
}
/* testo sopra il pannello */
.banner-section .auto-container,
.banner-section .content-box{position:relative;z-index:5;}
.banner-section .content-box{max-width:600px;}
/* titolo */
.banner-section .content-box .heading{
  font-family:"Saira Expanded","Saira",sans-serif !important;font-weight:800 !important;
  font-size:clamp(40px,4.4vw,68px) !important;line-height:1.0 !important;
  letter-spacing:-.01em !important;color:#fff !important;margin-bottom:18px !important;
}
.banner-section .content-box .text,
.banner-section .content-box p{color:rgba(255,255,255,.80) !important;font-size:19px !important;}
/* bottoni hero per posizione: 1° = CTA oro quadra, successivi = ghost quadra */
.banner-section .btn-box .theme-btn{min-width:188px;justify-content:center;text-align:center;border-radius:0 !important;}
.banner-section .btn-box .theme-btn:first-child{
  background:var(--h-accent-500) !important;color:var(--h-neutral-900) !important;border:0 !important;
}
.banner-section .btn-box .theme-btn:first-child:hover{background:var(--h-accent-600) !important;}
.banner-section .btn-box .theme-btn:not(:first-child){
  background:transparent !important;color:#fff !important;border:1.5px solid rgba(255,255,255,.5) !important;
}
.banner-section .btn-box .theme-btn:not(:first-child):hover{background:rgba(255,255,255,.1) !important;}

/* ---- Sezioni: bande nette (via i divisori a onda, stileme da template) ---- */
.elementor-shape{display:none !important;}
/* titoli sezione coerenti */
.sec-title h2,.elementor-widget-heading .elementor-heading-title{letter-spacing:-.01em;}

/* ---- Micro-rifiniture ---- */
::selection{background:var(--h-accent-500);color:var(--h-neutral-900);}