, non

: applica la classe .todo-section al container per ottenere lo stesso padding verticale delle sezioni originali. ========================================================= */ .todo-page .todo-section{ padding:88px 0; position:relative; overflow:hidden; } .todo-page .todo-section > .e-con-inner{ max-width:1200px; margin:0 auto; padding:0 32px; } /* Elementor imposta un max-width sui container "boxed": lo neutralizziamo dove usiamo il .wrap originale */ .todo-page .e-con.todo-full > .e-con-inner{ max-width:none; padding:0; } /* Astra aggiunge margini ai titoli: li azzeriamo dentro la pagina */ .todo-page .entry-content > *:first-child{ margin-top:0; } .todo-page .elementor-widget-container > h1, .todo-page .elementor-widget-container > h2, .todo-page .elementor-widget-container > h3, .todo-page .elementor-widget-container > h4{ margin-top:0; } /* Il contatore Elementor riusa lo stile .stat */ .todo-page .elementor-counter-number-wrapper{ font-family:var(--font-display); font-weight:800; font-size:clamp(2.2rem,5vw,3.4rem); color:var(--magenta-soft); } /* Ancora mancante nell'HTML originale: la sezione contatti non aveva id="contatti" pur essendo linkata dal menu */ .todo-page #contatti{ scroll-margin-top:90px; } .todo-page [id]{ scroll-margin-top:90px; } /* --------------------------------------------------------- Blog loop via shortcode [todoe20_blog] L'HTML originale aveva thumb solo a gradiente: qui la featured image, quando c'e', copre il gradiente. --------------------------------------------------------- */ .todo-page .blog-thumb img{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; z-index:0; transition:transform .5s var(--ease); } .todo-page .blog-card:hover .blog-thumb img{ transform:scale(1.05); } /* velo scuro per tenere leggibile l'etichetta categoria sopra la foto */ .todo-page .blog-thumb::after{ content:""; position:absolute; inset:0; z-index:1; background:linear-gradient(180deg, transparent 45%, rgba(10,7,16,.72) 100%); pointer-events:none; } .todo-page .blog-thumb span{ z-index:2; } .todo-page .blog-empty{ padding:24px; border:1px dashed var(--line-strong); border-radius:var(--radius); color:var(--text-mute); font-family:var(--mono); font-size:.85rem; text-align:center; } /* --------------------------------------------------------- Icone social nel footer via CSS background (SVG data-URI) Evita la rimozione di

. La citazione in Mindset deve restare in stile normale (solo il font, niente obliquo). --------------------------------------------------------- */ .todo-page .approach blockquote { font-style:normal; } /* --------------------------------------------------------- iubenda-header-fix: il documento Privacy/Cookie Policy generato da Iubenda include un proprio
con position:fixed, che collide con il nostro header fisso. Lo riportiamo al flusso normale della pagina. --------------------------------------------------------- */ .todo-page #iub-pp-container header, .todo-page #iub-cs-container header { position:static !important; top:auto !important; box-shadow:none !important; } .todo-page #iub-pp-container button.close-dialog, .todo-page #iub-cs-container button.close-dialog { position:static !important; } /* --------------------------------------------------------- Blog: articolo singolo, archivio e paginazione. L'articolo vero e proprio vive dentro .entry-content: qui ripristiniamo una tipografia da lettura (i titoli/liste/link del resto del sito sono tarati per le sezioni marketing, troppo grandi/senza pallini/senza colore per un corpo testo). --------------------------------------------------------- */ .todo-page .article-single { max-width:760px; padding-top:70px; padding-bottom:110px; } .todo-page .article-single .eyebrow a { color:var(--teal); text-decoration:none; } .todo-page .article-single .eyebrow a:hover { text-decoration:underline; } .todo-page .article-single h1 { font-size:clamp(2rem,5vw,3.2rem); margin-bottom:16px; } .todo-page .article-single > p.meta { font-family:var(--mono); font-size:.85rem; color:var(--text-mute); margin-bottom:36px; } .todo-page .article-cover { border-radius:var(--radius-lg,20px); overflow:hidden; margin-bottom:40px; } .todo-page .article-cover img { width:100%; height:auto; } .todo-page .entry-content { color:var(--text-dim); font-size:1.05rem; line-height:1.75; max-width:68ch; } .todo-page .entry-content > * + * { margin-top:22px; } .todo-page .entry-content h2 { font-size:1.7rem; line-height:1.25; margin-top:48px; color:var(--magenta); } .todo-page .entry-content h3 { font-size:1.3rem; line-height:1.3; margin-top:36px; color:var(--text); } .todo-page .entry-content ul, .todo-page .entry-content ol { list-style:revert; padding-left:1.4em; } .todo-page .entry-content li + li { margin-top:8px; } .todo-page .entry-content a { color:var(--teal); text-decoration:underline; text-underline-offset:3px; } .todo-page .entry-content a:hover { color:var(--magenta-soft); } .todo-page .entry-content strong { color:var(--text); } .todo-page .entry-content blockquote { border-left:3px solid var(--teal); padding-left:22px; color:var(--text); font-size:1.15rem; } .todo-page .entry-content img { border-radius:14px; margin:8px 0; } .todo-page .entry-content code { font-family:var(--mono); font-size:.9em; background:var(--bg-panel); padding:.15em .4em; border-radius:6px; } .todo-page .entry-content pre { background:var(--bg-panel); padding:20px; border-radius:14px; overflow-x:auto; } .todo-page .entry-content hr { border:none; border-top:1px solid var(--line); margin:40px 0; } /* Archivio blog: griglia + paginazione */ .todo-page .blog-archive-todoe20 .blog-grid { margin-top:48px; } .todo-page .blog-pagination { display:flex; justify-content:center; align-items:center; gap:10px; margin-top:56px; font-family:var(--mono); } .todo-page .blog-pagination .page-numbers { display:inline-flex; align-items:center; justify-content:center; min-width:38px; height:38px; padding:0 10px; border-radius:999px; border:1px solid var(--line-strong); color:var(--text-dim); text-decoration:none; font-size:.9rem; transition:border-color .25s var(--ease), color .25s var(--ease), background .25s var(--ease); } .todo-page .blog-pagination .page-numbers:hover { border-color:var(--teal); color:var(--text); } .todo-page .blog-pagination .page-numbers.current { background:var(--teal); border-color:var(--teal); color:var(--bg); } .todo-page .blog-pagination .page-numbers.dots { border:none; } /* --------------------------------------------------------- blog-shortcode-wrap-fix: in Home la sezione Blog e' divisa fra tre widget Elementor (head HTML + widget Shortcode + chiusura HTML). Il widget Shortcode vive quindi FUORI dal .wrap che conteneva la griglia, e la griglia si allarga a tutta pagina. Qui gli ridiamo lo stesso contenimento di .wrap. --------------------------------------------------------- */ .todo-page .elementor-widget-shortcode .blog-grid, .todo-page .elementor-widget-shortcode .blog-cta, .todo-page .elementor-widget-shortcode .blog-empty { max-width:1200px; margin-left:auto; margin-right:auto; padding-left:32px; padding-right:32px; } @media (max-width:760px) { .todo-page .elementor-widget-shortcode .blog-grid, .todo-page .elementor-widget-shortcode .blog-cta, .todo-page .elementor-widget-shortcode .blog-empty { padding-left:20px; padding-right:20px; } } /* --------------------------------------------------------- blog-archive-bottom-space: sull'archivio /blog/ il
non aveva spazio inferiore e le card finivano attaccate (anzi, leggermente sotto) al footer. --------------------------------------------------------- */ .todo-page.blog-archive-todoe20 main.todo-page, body.blog-archive-todoe20 main.todo-page { padding-bottom:120px; } /* --------------------------------------------------------- footer-ai-notice: informativa AI Act (Reg. UE 2024/1689). Deve restare sempre visibile (niente accordion) ma senza competere col resto del footer: testo piccolo e attenuato, sopra la barra del copyright. --------------------------------------------------------- */ .todo-page .footer-ai-notice { font-size:.72rem; line-height:1.65; color:var(--text-mute); max-width:none; margin-top:26px; padding-top:0; border-top:none; } @media (max-width:760px) { .todo-page .footer-ai-notice { font-size:.7rem; } } /* Footer su mobile: le colonne flex si stringevano troppo e testi lunghi (es. "Scarica la brochure") venivano troncati. Sotto i 760px passiamo a due colonne piene, poi a una sola. */ @media (max-width:760px) { .todo-page .footer-top { gap:28px 24px; } .todo-page .footer-top > * { flex:1 1 calc(50% - 12px); min-width:0; } } @media (max-width:480px) { .todo-page .footer-top > * { flex:1 1 100%; } } /* --------------------------------------------------------- scroll-cue-interactive: lo "Scorri" nella hero era un
decorativo; ora e' un verso la sezione successiva. Su mobile lo nascondiamo: cade fuori dalla viewport e non serve, visto che li' si scorre naturalmente col dito. --------------------------------------------------------- */ .todo-page a.scroll-cue { text-decoration:none; cursor:pointer; transition:color .25s var(--ease), opacity .25s var(--ease); } .todo-page a.scroll-cue:hover { color:var(--teal); } .todo-page a.scroll-cue:hover .line { background:var(--teal); } .todo-page a.scroll-cue:focus-visible { outline:2px solid var(--teal); outline-offset:6px; border-radius:4px; } @media (max-width:760px) { .todo-page .scroll-cue { display:none; } } /* --------------------------------------------------------- nav-mobile-breathing-room: su schermi stretti la pillola dell'header arrivava a filo dei bordi. Il margine laterale ora cresce in modo graduale con la larghezza dello schermo (min 10px), invece di passare di colpo da 0 a 32px. L'icona del menu diventa tonda, coerente con la pillola e con i pulsanti social del footer. --------------------------------------------------------- */ @media (max-width:860px) { .todo-page .nav { margin-left:clamp(10px, 3vw, 32px); margin-right:clamp(10px, 3vw, 32px); } .todo-page .nav-toggle { border-radius:50%; display:flex; align-items:center; justify-content:center; line-height:1; } }