/*
 * OZ Italy – componenti del design "Rotta OZ" (proposta B).
 *
 * Colori, font e misure del testo sono stili GLOBALI di Elementor
 * (Impostazioni sito → Colori globali / Font globali) e sono collegati
 * ai singoli widget: per cambiarli si interviene lì, non qui.
 *
 * Questo file contiene solo ciò che Elementor free non sa fare:
 * forme (anelli, rotta tratteggiata, tappe numerate, etichette a pillola),
 * posizionamenti sovrapposti e piccoli fix di compatibilità.
 * Ogni regola si aggancia a una classe "oz-..." assegnata nel pannello
 * Avanzate → Classi CSS dell'elemento.
 */

:root {
	/* stessi valori dei colori globali, usati solo dalle forme qui sotto */
	--oz-navy: var(--e-global-color-primary, #1C244B);
	--oz-navy-2: var(--e-global-color-accent, #2A3568);
	--oz-muted: var(--e-global-color-secondary, #4A5373);
	--oz-cream: var(--e-global-color-oz_cream, #F6F4EF);
	--oz-line: var(--e-global-color-oz_line, #E6E9F0);
	--oz-dash: var(--e-global-color-oz_dash, #C6CBDA);
	--oz-label-dark: var(--e-global-color-oz_label_dark, #C9CFE3);
	--oz-fam: var(--e-global-color-oz_fam, #137B36);
	--oz-sch: var(--e-global-color-oz_sch, #0B55B5);
	--oz-tut: var(--e-global-color-oz_tut, #D71A2E);
	/* spaziature del layout */
	--oz-gutter: clamp(20px, 4vw, 48px);
	--oz-pad-y: clamp(64px, 8vw, 112px);
	--oz-spine: clamp(40px, 5vw, 64px);
	--oz-spine-gap: clamp(12px, 2vw, 28px);
	--oz-plane: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M23 12c0-.8-1-1-2-1h-6.5l-4-8h-2l2.5 8H5.5L4 8H2.5l1 4-1 4H4l1.5-3H11l-2.5 8h2l4-8H21c1 0 2-.2 2-1z'/%3E%3C/svg%3E");
}

/* ---------- Base ---------- */
body { -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; }
.elementor-widget-text-editor p { margin-top: 0; }
.elementor-widget-text-editor p:last-child { margin-bottom: 0; }
/* Ripiego per i widget Titolo non ancora collegati a un font globale
   (i colori/font "predefiniti" di Elementor sono disattivati) */
.elementor-widget-heading .elementor-heading-title { font-weight: 800; letter-spacing: -.025em; color: var(--oz-navy); line-height: 1.15; }
/* Hello Elementor sottolinea i link dentro .page-content: non i pulsanti */
.page-content .elementor-button, .elementor .elementor-button { text-decoration: none; }
.elementor-button { min-height: 52px; display: inline-flex; align-items: center; justify-content: center; }
:where(.elementor) a:focus-visible, :where(.elementor) .elementor-button:focus-visible { outline: 3px solid var(--oz-sch); outline-offset: 3px; }
.oz-dark a:focus-visible, .oz-dark .elementor-button:focus-visible, .oz-cta a:focus-visible, .oz-cta .elementor-button:focus-visible { outline-color: #fff; }

/* ---------- Layout di pagina ---------- */
.oz-sec { --padding-left: var(--oz-gutter); --padding-right: var(--oz-gutter); }
.oz-maxw { max-width: 520px; }
.oz-maxw-l { max-width: 640px; }
.oz-head-row { align-items: flex-end; }
/* pulsanti colorati: leggero scurimento al passaggio del mouse */
.oz-btn-fam .elementor-button:hover, .oz-btn-sch .elementor-button:hover, .oz-btn-tut .elementor-button:hover { filter: brightness(.88); }

/* ---------- Etichette colorate (chip) ---------- */
.oz-chip .elementor-heading-title { display: inline-flex; align-items: center; min-height: 32px; padding: 0 14px; border-radius: 999px; background: var(--oz-navy); }
.oz-chip-sm .elementor-heading-title { min-height: 28px; }
.oz-fam .elementor-heading-title { background: var(--oz-fam); }
.oz-sch .elementor-heading-title { background: var(--oz-sch); }
.oz-tut .elementor-heading-title { background: var(--oz-tut); }

/* ---------- Immagini ad anello ---------- */
.oz-ring img { width: 100%; height: auto; aspect-ratio: 1 / 1; object-fit: cover; display: block; border-radius: 50%; border: 12px solid var(--oz-navy); box-sizing: border-box; background: #E8EBF2; }
.oz-ring-m img { border-width: 10px; }
.oz-ring-s img { border-width: 8px; }
.oz-ring-xs img { border-width: 5px; }

/* ---------- Rotta animata (widget HTML con SVG) ---------- */
.oz-route { pointer-events: none; }
.oz-route svg { display: block; width: 100%; height: 100%; overflow: visible; }
.oz-trail { stroke-dasharray: 6 5; animation: oz-trail 2.4s linear infinite; }
@keyframes oz-trail { to { stroke-dashoffset: -44; } }
@media (prefers-reduced-motion: reduce) { .oz-trail { animation: none; } .oz-route .oz-plane { display: none; } }

/* ---------- HERO ---------- */
.oz-hero { --padding-top: clamp(40px, 6vw, 88px); --padding-bottom: clamp(56px, 7vw, 96px); overflow: hidden; }
.oz-hero-visual { position: relative; min-height: 560px; }
.oz-hero-visual > .elementor-element.oz-hero-main, .oz-hero-visual > .elementor-element.oz-route-hero { position: absolute; right: 4%; top: 56px; width: min(440px, 86%); max-width: none; aspect-ratio: 1 / 1; margin: 0; }
.oz-hero-visual > .elementor-element.oz-route-hero { z-index: 2; }
.oz-hero-visual > .elementor-element.oz-hero-small { position: absolute; left: 0; bottom: 24px; width: 190px; margin: 0; z-index: 3; }
.oz-hero-visual > .elementor-element.oz-video-pill { position: absolute; right: calc(4% + 16px); bottom: 30px; width: auto; margin: 0; z-index: 4; }
.oz-video-pill .elementor-button { min-height: 56px; padding: 6px 20px 6px 6px; box-shadow: 0 12px 30px rgba(28, 36, 75, .18); }
.oz-video-pill .elementor-button-content-wrapper { align-items: center; gap: 12px; }
.oz-video-pill .elementor-button-icon { width: 44px; height: 44px; border-radius: 50%; background: var(--oz-navy); color: #fff; display: inline-flex; align-items: center; justify-content: center; font-size: 13px; }
.oz-video-pill .elementor-button-icon svg { fill: #fff; width: 14px; height: 14px; }

/* Card "Chi sei?" (widget Icon Box): forma della card e intera area cliccabile */
.oz-who { position: relative; background: #fff; border-radius: 16px; padding: 12px 52px 12px 12px; box-shadow: 0 1px 2px rgba(28, 36, 75, .08); transition: box-shadow .2s ease, transform .2s ease; }
.oz-who:hover { box-shadow: 0 8px 22px rgba(28, 36, 75, .14); transform: translateY(-1px); }
.oz-who::after { content: "\2192"; position: absolute; right: 18px; top: 50%; transform: translateY(-50%); font-size: 22px; line-height: 1; color: var(--oz-navy); pointer-events: none; }
.oz-who .elementor-icon-box-wrapper { display: flex; flex-direction: row; align-items: center; gap: 16px; text-align: left; }
.oz-who .elementor-icon-box-icon { margin: 0 !important; flex: 0 0 48px; display: flex; }
.oz-who .elementor-icon { width: 48px; height: 48px; padding: 0; font-size: 22px; border-radius: 50%; display: flex; align-items: center; justify-content: center; }
.oz-who .elementor-icon svg { width: 22px; height: 22px; }
.oz-who .elementor-icon-box-content { flex: 1; min-width: 0; }
.oz-who .elementor-icon-box-title { margin: 0; }
.oz-who .elementor-icon-box-title a { text-decoration: none; }
.oz-who .elementor-icon-box-title a::before { content: ""; position: absolute; inset: 0; border-radius: 16px; }
.oz-who .elementor-icon-box-description { margin: 0; }

/* ---------- Numeri + stampa ---------- */
.oz-stats-sec { border-bottom: 1px solid var(--oz-line); --padding-top: 0px; --padding-bottom: 0px; }
.oz-stat { --padding-top: 30px; --padding-bottom: 30px; --padding-left: 24px; --padding-right: 24px; border-left: 1px solid var(--oz-line); }
.oz-stat:first-child { border-left: 0; --padding-left: 0px; }
.oz-press { border-top: 1px solid var(--oz-line); --padding-top: 22px; --padding-bottom: 22px; }
.oz-press .elementor-icon-list-items { gap: 10px 34px; }
.oz-press .elementor-icon-list-item { margin: 0 !important; }

/* ---------- Sezioni numerate: la "rotta" verticale ---------- */
.oz-leg { --padding-top: 0px; --padding-bottom: 0px; }
.oz-leg > .e-con-inner { position: relative; padding-left: calc(var(--oz-spine) + var(--oz-spine-gap)); padding-top: var(--oz-pad-y); padding-bottom: var(--oz-pad-y); }
.oz-leg > .e-con-inner::before { content: ""; position: absolute; left: 21px; top: 0; bottom: 0; border-left: 3px dashed var(--oz-dash); }
.oz-dark.oz-leg > .e-con-inner::before { border-left-color: rgba(255, 255, 255, .35); }
.oz-leg-end > .e-con-inner { padding-top: clamp(40px, 5vw, 72px); }
.oz-leg-end > .e-con-inner::before { bottom: auto; height: clamp(40px, 5vw, 72px); }
.oz-leg > .e-con-inner > .elementor-element.oz-stop { position: absolute; left: 0; top: var(--oz-pad-y); width: 46px; margin: 0; z-index: 1; }
.oz-leg-end > .e-con-inner > .elementor-element.oz-stop { top: clamp(40px, 5vw, 72px); }
.oz-stop .elementor-heading-title { width: 46px; height: 46px; border-radius: 50%; background: #fff; border: 3px solid var(--oz-navy); box-sizing: border-box; display: flex; align-items: center; justify-content: center; font-size: 15px; font-weight: 800; line-height: 1; letter-spacing: 0; color: var(--oz-navy); }
.oz-dark .oz-stop .elementor-heading-title { background: var(--oz-navy); border-color: #fff; color: #fff; }
.oz-stop-plane .elementor-heading-title { background: var(--oz-navy); color: transparent; font-size: 0; }
.oz-stop-plane .elementor-heading-title::before { content: ""; width: 24px; height: 24px; background: #fff; -webkit-mask: var(--oz-plane) center / contain no-repeat; mask: var(--oz-plane) center / contain no-repeat; }

/* ---------- 01 · Cos'è ---------- */
.oz-compose { position: relative; min-height: 420px; }
.oz-compose > .elementor-element.oz-compose-main { position: absolute; left: 0; top: 0; width: 72%; margin: 0; }
.oz-compose-main img { width: 100%; height: 340px; object-fit: cover; border-radius: 24px; display: block; }
.oz-compose > .elementor-element.oz-compose-ring, .oz-compose > .elementor-element.oz-route-one { position: absolute; right: 0; bottom: 0; width: 220px; aspect-ratio: 1 / 1; margin: 0; }
.oz-compose > .elementor-element.oz-route-one { z-index: 2; }
.oz-compose-ring img { object-position: center 25%; }
.oz-feature { border-top: 3px solid var(--oz-navy); --padding-top: 16px; --padding-left: 0px; --padding-right: 0px; --padding-bottom: 0px; }

/* ---------- 02 · Tre percorsi ---------- */
.oz-paths-line .oz-dots { position: relative; height: 28px; margin: 0 8px -12px; }
.oz-paths-line .oz-dots::before { content: ""; position: absolute; left: 0; right: 34px; top: 13px; border-top: 3px dashed #B9BFD0; }
.oz-paths-line .oz-dot { position: absolute; top: 5px; width: 18px; height: 18px; margin-left: -9px; border-radius: 50%; box-shadow: 0 0 0 4px var(--oz-cream); }
.oz-paths-line svg { position: absolute; right: 0; top: 0; width: 30px; height: 30px; fill: var(--oz-navy); }
@media (max-width: 1024px) { .oz-paths-line { display: none; } }
.oz-path-card { border-radius: 22px; overflow: hidden; --padding-top: 0px; --padding-bottom: 0px; --padding-left: 0px; --padding-right: 0px; --gap: 0px; --row-gap: 0px; }
.oz-path-img img { width: 100%; aspect-ratio: 3 / 2; object-fit: cover; display: block; }
.oz-path-card > .elementor-element.oz-chip { margin: -18px 0 0 18px; position: relative; z-index: 1; }
.oz-path-card .oz-chip .elementor-heading-title { min-height: 36px; padding: 0 16px; box-shadow: 0 0 0 4px #fff; }
.oz-path-body { --padding-top: 18px; --padding-bottom: 26px; --padding-left: 24px; --padding-right: 24px; flex: 1 1 auto; }
/* "Ricevete / Offrite": etichette e liste dentro l'Editor di testo */
.oz-give-get p { font-weight: 800; font-size: 15px; margin: 0 0 6px; }
.oz-give-get ul { margin: 0 0 14px; padding-left: 18px; }
.oz-give-get ul:last-child { margin-bottom: 0; }
.oz-give-get li { margin-bottom: 4px; }
.oz-path-foot { margin-top: auto; border-top: 1px solid var(--oz-line); --padding-top: 16px; --padding-left: 0px; --padding-right: 0px; --padding-bottom: 0px; }

/* ---------- 03 · Come funziona: lista dei 6 passi (Editor di testo) ---------- */
.oz-steps { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 24px 16px; position: relative; }
.oz-steps::before { content: ""; position: absolute; left: 20px; right: 20px; top: 22px; border-top: 3px dashed var(--oz-dash); }
.oz-steps li { display: flex; flex-direction: column; gap: 6px; position: relative; margin: 0; }
.oz-steps .oz-num { width: 44px; height: 44px; border-radius: 50%; background: #fff; border: 3px solid var(--oz-navy); box-sizing: border-box; display: flex; align-items: center; justify-content: center; font-weight: 800; font-size: 15px; margin-bottom: 4px; }
.oz-steps .oz-key .oz-num { background: var(--oz-navy); color: #fff; }
.oz-steps .oz-num svg { width: 22px; height: 22px; fill: #fff; }
.oz-steps .oz-tag { font-size: 11px; font-weight: 700; letter-spacing: .14em; text-transform: uppercase; }
.oz-steps strong { font-weight: 800; display: block; line-height: 1.3; }
.oz-steps .oz-step-text { color: var(--oz-muted); font-size: 15px; line-height: 1.45; }
@media (max-width: 1024px) { .oz-steps { grid-template-columns: repeat(3, minmax(0, 1fr)); } .oz-steps::before { display: none; } }
@media (max-width: 600px) {
	.oz-steps { grid-template-columns: 1fr; }
	.oz-steps li { display: grid; grid-template-columns: 44px 1fr; column-gap: 16px; row-gap: 2px; align-items: start; }
	.oz-steps .oz-num { grid-row: span 3; }
}

/* ---------- 04 · La selezione ---------- */
.oz-checks .elementor-icon-list-item { padding: 14px 0 !important; border-top: 1px solid #3A4472; margin: 0 !important; }
.oz-checks .elementor-icon-list-item:last-child { border-bottom: 1px solid #3A4472; }
.oz-checks .elementor-icon-list-text { padding-left: 14px !important; }
/* segnaposto foto circolari (da sostituire con le foto di Francesca) */
.oz-photo-ph { width: min(400px, 100%); aspect-ratio: 1 / 1; border-radius: 50%; border: 12px solid #fff; background: var(--oz-navy-2); --padding-top: 40px; --padding-bottom: 40px; --padding-left: 40px; --padding-right: 40px; justify-content: center; text-align: center; margin-left: auto; margin-right: auto; }
.oz-photo-ph-light { background: #E3E1DA; border-color: var(--oz-navy); width: min(420px, 100%); }

/* ---------- 05 · Testimonianze ---------- */
.oz-feat-quote { align-items: center; }
.oz-feat-quote > .elementor-element.oz-ring { width: min(300px, 100%); flex: 0 0 auto; }
.oz-feat-quote > .e-con { flex: 1 1 0; min-width: 0; }
/* le citazioni prendono il font dal widget (Font globali): azzeriamo solo lo stile del browser */
.oz-quote-xl blockquote, .oz-tcard blockquote { margin: 0; padding: 0; border: 0; font: inherit; letter-spacing: inherit; color: inherit; }
.oz-caption { align-items: center; }
.oz-tcard { border-radius: 22px; --padding-top: 24px; --padding-bottom: 24px; --padding-left: 24px; --padding-right: 24px; align-items: center; }
.oz-tcard > .elementor-element.oz-ring { width: 96px; flex: 0 0 96px; }
.oz-tcard > .e-con { --width: auto; flex: 1 1 0; min-width: 0; }
.oz-tcard p { font-size: 17px; }

/* ---------- 06 · Francesca ---------- */
.oz-fra-visual { position: relative; align-items: center; }
.oz-fra-visual > .elementor-element.oz-route-fra { position: absolute; left: 50%; top: 0; width: min(420px, 100%); aspect-ratio: 1 / 1; transform: translateX(-50%); margin: 0; z-index: 2; }
.oz-creds ul { list-style: none; margin: 0; padding: 0; }
.oz-creds li { display: flex; justify-content: space-between; gap: 16px; padding: 12px 0; border-top: 1px solid #DCD8CE; margin: 0; }
.oz-creds li:last-child { border-bottom: 1px solid #DCD8CE; }
.oz-creds li strong { font-weight: 700; }
.oz-creds li span { color: var(--oz-muted); text-align: right; }

/* ---------- 07 · Instagram (griglia provvisoria) ---------- */
.oz-ig { display: grid !important; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 12px !important; }
.oz-ig > .elementor-element { width: auto !important; margin: 0 !important; }
.oz-ig img { width: 100%; aspect-ratio: 1 / 1; object-fit: cover; border-radius: 16px; display: block; }
@media (max-width: 1024px) { .oz-ig { grid-template-columns: repeat(3, minmax(0, 1fr)); } }

/* ---------- Invito finale ---------- */
.oz-cta { border-radius: 28px; position: relative; overflow: hidden; --padding-top: clamp(36px, 5vw, 72px); --padding-bottom: clamp(36px, 5vw, 72px); --padding-left: clamp(28px, 5vw, 72px); --padding-right: clamp(28px, 5vw, 72px); }
.oz-cta > .elementor-element:not(.oz-route-cta) { position: relative; z-index: 1; }
.oz-cta > .elementor-element.oz-route-cta { position: absolute; right: 28px; top: 28px; bottom: 28px; width: 260px; margin: 0; opacity: .55; z-index: 0; }
.oz-cta.e-con > .elementor-widget-text-editor { max-width: 600px !important; } /* Elementor impone max-width:100% con un selettore molto specifico */
.oz-cta.e-con > .elementor-widget-heading { max-width: 700px !important; }

/* ---------- Header ---------- */
.oz-topbar { --padding-top: 9px; --padding-bottom: 9px; }
.oz-topbar a { color: #fff; font-weight: 700; }
.oz-topbar a:hover { color: var(--oz-label-dark); }
.oz-mainbar { --padding-top: 20px; --padding-bottom: 20px; }
.oz-mainbar > .e-con-inner > .e-con { --width: auto; flex: 1 1 auto; }
.oz-mainbar .oz-logo { flex: 0 0 auto; }
.oz-logo img { height: 40px; width: auto; display: block; }
.oz-mainbar .oz-logo img { max-width: none; object-fit: contain; }
.oz-nav .hfe-nav-menu a.hfe-menu-item { min-height: 44px; display: flex; align-items: center; }

/* ---------- Footer ---------- */
.oz-footer a { color: var(--e-global-color-oz_on_dark, #D6DAE8); }
.oz-footer a:hover { color: #fff; }
.oz-footer-cols { --padding-top: 64px; --padding-bottom: 44px; }
.oz-footer-cols .e-con { align-items: flex-start; }
.oz-footer-cols .e-con > .elementor-widget { align-self: stretch; }
.oz-footer .elementor-widget-heading, .oz-footer .elementor-widget-heading .elementor-heading-title { text-align: left; }
.oz-footer-logo img { height: 34px; width: auto; display: block; }
.oz-footer-bottom { border-top: 1px solid #34407A; --padding-top: 18px; --padding-bottom: 18px; }
.oz-footer-cols .hfe-nav-menu, .oz-footer-cols .hfe-nav-menu__layout-vertical .hfe-nav-menu { margin: 0; padding: 0; }
.oz-footer-cols .hfe-nav-menu li { margin: 0 !important; }
.oz-footer-cols .hfe-nav-menu a.hfe-menu-item { padding: 5px 0 !important; justify-content: flex-start; }
.oz-footer-bottom .hfe-nav-menu { gap: 16px; }

/* ---------- Responsive ---------- */
@media (max-width: 1024px) {
	.oz-hero-visual { min-height: 480px; }
	/* header: logo a sinistra, hamburger e Contattaci sulla stessa riga */
	.oz-mainbar { position: relative; z-index: 50; }
	.oz-mainbar > .e-con-inner { flex-wrap: nowrap; }
	.oz-mainbar > .e-con-inner > .e-con { flex-wrap: nowrap; gap: 12px; }
	.oz-mainbar .oz-nav { flex: 0 0 44px; width: 44px; position: static; }
	/* UAE calcola via JS un "left" negativo pensato per un altro contenitore: lo azzeriamo */
	.oz-mainbar .oz-nav nav { position: absolute; left: 0 !important; right: 0; top: 100%; width: 100% !important; z-index: 60; box-shadow: 0 12px 24px rgba(28, 36, 75, .12); }
}
@media (max-width: 767px) {
	:root { --oz-spine: 46px; --oz-spine-gap: 14px; }
	.oz-logo img { height: 26px; }
	.oz-mainbar { --padding-top: 14px; --padding-bottom: 14px; }
	.oz-mainbar .elementor-button { min-height: 44px; padding: 10px 16px; }
	.oz-hero-visual { min-height: 400px; }
	.oz-hero-visual > .elementor-element.oz-hero-main, .oz-hero-visual > .elementor-element.oz-route-hero { top: 10px; right: 2%; width: min(320px, 84%); }
	.oz-hero-visual > .elementor-element.oz-hero-small { width: 120px; bottom: 60px; }
	.oz-hero-visual > .elementor-element.oz-video-pill { right: 0; bottom: 0; }
	.oz-stat { border-left: 0; border-top: 1px solid var(--oz-line); --padding-left: 0px; }
	.oz-stat:first-child { border-top: 0; }
	.oz-compose { min-height: 340px; }
	.oz-compose-main img { height: 260px; }
	.oz-compose > .elementor-element.oz-compose-ring, .oz-compose > .elementor-element.oz-route-one { width: 160px; }
	.oz-ig { grid-template-columns: repeat(2, minmax(0, 1fr)); }
	.oz-cta > .elementor-element.oz-route-cta { display: none; }
	.oz-tcard { flex-direction: column; align-items: flex-start; }
}