/* u-pagine.css — pagine del sito: hub Servizi/Prodotti/Settori, Metodo, Chi siamo, Clienti, Contatti, Audit, Privacy, Cookie, Blog, Manutenzione.
   Lo stile dei blocchi sta nelle opzioni dei widget e nel Kit: qui solo ciò che il pannello non sa esprimere
   (alternanza di toni nei Loop Grid, timeline del metodo, testo lungo, forme). Dipende da u-template.css solo per la classe `bee-tone-light`. */

/* testo solo per gli screen reader (titoli di sezione che il disegno non mostra) */
body.bee .bee-sr{position:absolute!important;width:1px;height:1px;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
/* larghezza massima in ch del carattere del testo (il pannello la esprime in ch del contenitore) */
body.bee .bee-pgch-18 .elementor-heading-title,body.bee .elementor .bee-pgch-18.elementor-widget-text-editor{max-width:18ch}
body.bee .bee-pgch-20 .elementor-heading-title,body.bee .elementor .bee-pgch-20.elementor-widget-text-editor{max-width:20ch}
body.bee .bee-pgch-28 .elementor-heading-title,body.bee .elementor .bee-pgch-28.elementor-widget-text-editor{max-width:28ch}
body.bee .bee-pgch-36 .elementor-heading-title,body.bee .elementor .bee-pgch-36.elementor-widget-text-editor{max-width:36ch}
body.bee .bee-pgch-44 .elementor-heading-title,body.bee .elementor .bee-pgch-44.elementor-widget-text-editor{max-width:44ch}
body.bee .bee-pgch-46 .elementor-heading-title,body.bee .elementor .bee-pgch-46.elementor-widget-text-editor{max-width:46ch}
/* anello di focus nero sui fondi chiari (avorio e giallo) */
body.bee .bee-tone-light :focus-visible{outline-color:var(--bee-ink)}
/* il titolo che sta nella briciola di pane corrente non è un link: resta sul colore del testo attenuato */
body.bee .bee-crumbs .elementor-heading-title a{color:inherit;text-decoration:none}
body.bee .bee-crumbs .elementor-heading-title a:hover,body.bee .bee-crumbs .elementor-heading-title a:focus-visible{text-decoration:underline}

/* ---------- Hub prodotti: blocchi alternati avorio / nero / giallo (il Loop Grid mostra i prodotti, i toni ciclano) ---------- */
body.bee .bee-prd-loop .elementor-loop-container{counter-reset:bee-prd}
body.bee .bee-prd-loop .e-loop-item{counter-increment:bee-prd;height:auto}
body.bee .bee-prd-loop .e-loop-item:nth-child(3n+1){background:var(--bee-ivory);color:var(--bee-ink);--bee-pb-bg:var(--bee-ink);--bee-pb-fg:var(--bee-ivory);--bee-pb-bg-h:var(--bee-grey);--bee-pb-fg-h:var(--bee-ivory);--bee-tick:var(--bee-ink)}
body.bee .bee-prd-loop .e-loop-item:nth-child(3n+2){background:var(--bee-ink);color:var(--bee-ivory);--bee-pb-bg:var(--bee-yel);--bee-pb-fg:var(--bee-ink);--bee-pb-bg-h:var(--bee-ivory);--bee-pb-fg-h:var(--bee-ink);--bee-tick:var(--bee-yel)}
body.bee .bee-prd-loop .e-loop-item:nth-child(3n+3){background:var(--bee-yel);color:var(--bee-ink);--bee-pb-bg:var(--bee-ink);--bee-pb-fg:var(--bee-yel);--bee-pb-bg-h:var(--bee-grey);--bee-pb-fg-h:var(--bee-yel);--bee-tick:var(--bee-ink)}
body.bee .bee-prd-loop .e-loop-item:nth-child(3n+1) :focus-visible,body.bee .bee-prd-loop .e-loop-item:nth-child(3n+3) :focus-visible{outline-color:var(--bee-ink)}
body.bee .bee-prd-loop .bee-ticks li::before{background:var(--bee-tick)}
body.bee .bee-prd-n .elementor-heading-title::before{content:counter(bee-prd,decimal-leading-zero)}
body.bee .bee-prd-blk .elementor-heading-title{overflow-wrap:anywhere}
/* in elenco si mostrano le prime quattro funzioni (le altre stanno nella scheda del prodotto) */
body.bee .bee-prd-funz li:nth-child(n+5){display:none}
body.bee .bee-prd-funz p{margin:0}

/* ---------- Schede (.card): bordo, passaggio del mouse giallo ---------- */
body.bee .bee-pg-card{transition:transform .35s var(--bee-ease),background-color .3s,color .3s,border-color .3s}
body.bee .bee-pg-card:hover,body.bee .bee-pg-card:focus-within{transform:translateY(-4px);background-color:var(--bee-yel);color:var(--bee-ink);border-color:var(--bee-ink)}
body.bee .bee-pg-card :focus-visible{outline-color:var(--bee-ink)}
/* le schede di un Loop Grid riempiono l'altezza */
body.bee .bee-pg-cards .e-loop-item>.e-con{height:100%}

/* ---------- Clienti: griglia di loghi ---------- */
body.bee .bee-pg-logos .e-loop-item{min-width:0}

/* ---------- Metodo: timeline con linea, esagoni e tappe che si accendono allo scorrimento ---------- */
body.bee .bee-tl{--bee-tl-pad:clamp(36px,5vw,72px);position:relative;padding-left:var(--bee-tl-pad);--p:1}
body.bee .bee-tl::before{content:"";position:absolute;left:0;top:8px;bottom:8px;width:1px;background:var(--bee-grey)}
body.bee .bee-tl::after{content:"";position:absolute;left:-1px;top:8px;bottom:8px;width:3px;background:var(--bee-yel);transform-origin:top;transform:scaleY(var(--p))}
body.bee .bee-tl-st{position:relative}
body.bee .bee-tl-st::before{content:"";position:absolute;left:calc(var(--bee-tl-pad)*-1 - 7px);top:12px;width:15px;height:17px;background:var(--bee-mute);clip-path:var(--bee-hexp);transition:background .4s}
body.bee .bee-tl-st::after{content:"";position:absolute;left:calc(var(--bee-tl-pad)*-1 - 4px);top:17px;width:9px;height:10px;background:var(--bee-ink);clip-path:var(--bee-hexp);transition:background .4s}
body.bee .bee-tl-st.is-on::before,body.bee .bee-tl-st.is-on::after{background:var(--bee-yel)}
body.bee .bee-tl-dim{transition:opacity .5s}
html.bee-tl-js body.bee .bee-tl-st:not(.is-on) .bee-tl-dim{opacity:.35}

/* ---------- Testo lungo (privacy, cookie): elenchi con esagono, indice, link ---------- */
body.bee .bee-prose ul{list-style:none;margin:0 0 1.3em;padding:0}
body.bee .bee-prose li{position:relative;margin:0 0 .45em;padding-left:1.6em}
body.bee .bee-prose li::before{content:"";position:absolute;left:.1em;top:.5em;width:.62em;height:.7em;background:var(--bee-ink);clip-path:var(--bee-hexp)}
body.bee .bee-leg-idx ol{margin:0;padding-left:1.3em}
body.bee .bee-leg-idx li{margin:0 0 .3em}
body.bee .bee-leg-idx a{font-weight:500}
body.bee .bee-prose-h2{scroll-margin-top:84px}
body.bee .bee-legal .bee-ulink a{font-weight:700}

/* ---------- Manutenzione: esagoni che galleggiano piano ---------- */
body.bee .bee-pg-float{animation:bee-pg-float 7s ease-in-out infinite}
body.bee .bee-pg-float:nth-child(2n){animation-duration:9s;animation-delay:-2s}
body.bee .bee-pg-float:nth-child(3n){animation-duration:11s;animation-delay:-5s}
@keyframes bee-pg-float{50%{transform:translateY(-14px)}}
body.bee .bee-maint{isolation:isolate}
@media (prefers-reduced-motion:reduce){
  body.bee .bee-pg-float{animation:none}
  body.bee .bee-tl-dim,body.bee .bee-pg-card{transition:none}
}
