/* ========================================================================= LAYOUT "EDITORIALE" — skin scura immersiva ispirata ai grandi siti sportivi. Si attiva con . Riveste gli stessi blocchi del layout classico. Usa l'accento della società (--c-accent / --c-primary). ========================================================================= */ body.layout-editoriale{ /* Editoriale scuro Solignano: navy coordinato al brand (#0B2233) invece del nero */ --ed-bg:#07141f; --ed-bg2:#0b2233; --ed-card:#0f2a3f; --ed-text:#f1f5f9; --ed-muted:#9fb3c6; --ed-line:rgba(135,175,210,.16); --ed-acc:var(--c-accent,#2FA8E0); /* superfici/bordi "chiari" del tema -> navy, così box e riquadri restano leggibili */ --c-surface:#0f2a3f; --c-border:rgba(135,175,210,.20); --c-bg:#07141f; --c-text:#f1f5f9; --gray-100:#16344c; background:var(--ed-bg); color:var(--ed-text); font-family:'Inter',system-ui,-apple-system,sans-serif; } /* Riquadri "in allestimento"/avviso: leggibili su scuro */ body.layout-editoriale .wip-box{color:var(--ed-text);background:var(--c-surface,#16161b)!important;border-color:var(--c-border,rgba(255,255,255,.16))!important} body.layout-editoriale .wip-box h3{color:#fff!important} body.layout-editoriale .wip-box p{color:var(--ed-muted)!important} body.layout-editoriale .container{max-width:1280px;padding-left:26px;padding-right:26px} body.layout-editoriale a{color:inherit} /* Tipografia editoriale: titoli grandi, maiuscoli, condensati */ body.layout-editoriale h1, body.layout-editoriale h2, body.layout-editoriale h3, body.layout-editoriale .block-heading h2, body.layout-editoriale .hero-inner h1{ font-family:'Oswald','Inter',sans-serif; text-transform:uppercase; letter-spacing:.5px; font-weight:700; line-height:1.04; } body.layout-editoriale h2{font-size:clamp(1.6rem,3.4vw,2.7rem)} body.layout-editoriale .block-heading{text-align:left} body.layout-editoriale .block-heading h2{position:relative;padding-left:18px} body.layout-editoriale .block-heading h2::before{content:"";position:absolute;left:0;top:.1em;bottom:.1em;width:6px;background:var(--ed-acc);border-radius:3px} /* ---------- Header: trasparente sopra l'hero, solido allo scroll ---------- */ body.layout-editoriale .site-header{ position:sticky; top:0; z-index:50; background:color-mix(in srgb, var(--c-header-bg) 92%, transparent); backdrop-filter:blur(10px); border-bottom:1px solid var(--ed-line); box-shadow:none; transition:background .25s ease,border-color .25s ease; } body.layout-editoriale.page-has-hero .site-header{position:fixed;left:0;right:0;background:transparent;border-bottom-color:transparent} /* Editoriale TOP (non laterale): header con fondo scuro SFUMATO sopra l'hero, cosi' il menu resta leggibile anche su foto chiare */ body.layout-editoriale:not(.menu-laterale).page-has-hero:not(.scrolled) .site-header{background:linear-gradient(to bottom, color-mix(in srgb, var(--c-header-bg) 96%, transparent), color-mix(in srgb, var(--c-header-bg) 55%, transparent))} body.layout-editoriale.page-has-hero.scrolled .site-header{background:color-mix(in srgb, var(--c-header-bg) 92%, transparent);border-bottom-color:var(--ed-line)} /* Editoriale TOP: il carosello/hero della home scende sotto l'header (alto ~120px) cosi' l'immagine si vede per intero e non viene coperta dal menu */ body.layout-editoriale:not(.menu-laterale).page-has-hero .block-slideshow{margin-top:120px} body.layout-editoriale .header-inner{min-height:74px} body.layout-editoriale .brand-name{color:var(--c-header-text,#fff);font-family:'Oswald',sans-serif;text-transform:uppercase;letter-spacing:1px} body.layout-editoriale .brand-tagline{color:var(--ed-muted)} body.layout-editoriale .site-nav ul{gap:6px} body.layout-editoriale .site-nav a{ color:var(--c-header-text,#e9eaed); text-transform:uppercase; font-weight:600; letter-spacing:.6px; font-size:.86rem; padding:10px 12px; border-radius:8px; } body.layout-editoriale .site-nav a:hover{background:rgba(255,255,255,.08)} body.layout-editoriale .site-nav .active>a{color:var(--ed-acc)} body.layout-editoriale .site-nav .submenu{background:var(--c-header-bg);border:1px solid var(--ed-line)} body.layout-editoriale .nav-toggle span{background:var(--c-header-text,#fff)} body.layout-editoriale .header-icons .my-access{color:var(--c-header-text,#fff);border:1px solid var(--ed-line);border-radius:10px} body.layout-editoriale .header-icons .my-access:hover{background:var(--ed-acc);border-color:var(--ed-acc)} /* ---------- Hero / banner: full-bleed con overlay e titolo grande ---------- */ body.layout-editoriale .block-hero{position:relative;padding:0} body.layout-editoriale .block-hero .hero-inner{ min-height:clamp(440px,82vh,820px); display:flex;flex-direction:column;justify-content:flex-end; max-width:1280px;margin:0 auto;padding:0 26px 64px; } body.layout-editoriale .block-hero::after{ content:"";position:absolute;inset:0;pointer-events:none; background:linear-gradient(180deg,rgba(7,20,31,.35) 0%,rgba(7,20,31,0) 35%,rgba(7,20,31,.85) 100%); } body.layout-editoriale .block-hero .hero-inner>*{position:relative;z-index:2} body.layout-editoriale .block-hero h1{font-size:clamp(2.2rem,6vw,5rem);color:#fff;max-width:18ch;text-shadow:0 2px 24px rgba(0,0,0,.4)} body.layout-editoriale .hero-sub{color:#e9eaed;font-size:clamp(1rem,1.6vw,1.25rem);max-width:48ch;margin-top:14px} body.layout-editoriale .block-page-banner{position:relative;min-height:360px;display:flex;align-items:flex-end;border-radius:0} body.layout-editoriale .block-page-banner h1{color:#fff;font-size:clamp(2rem,5vw,3.6rem)} body.layout-editoriale .block-page-banner .pb-sub{color:var(--ed-muted)} /* ---------- Sezioni: spaziatura ampia, alternanza scura ---------- */ body.layout-editoriale .block{padding:44px 0;background:var(--ed-bg)} /* Heading + testo introduttivo: meno vuoto verticale */ body.layout-editoriale .block-heading{padding:34px 0 0} body.layout-editoriale .block-heading + .block{padding-top:14px} body.layout-editoriale .block-text, body.layout-editoriale .block-widgets, body.layout-editoriale .block-embed{background:var(--ed-bg)} body.layout-editoriale .block-sponsors, body.layout-editoriale .block-gallery{background:var(--ed-bg2)} body.layout-editoriale .block-text{color:var(--ed-text)} body.layout-editoriale .block-text a{color:var(--ed-acc)} /* ---------- Pulsanti: grandi, bold, maiuscoli ---------- */ body.layout-editoriale .btn{border-radius:999px;text-transform:uppercase;letter-spacing:.6px;font-weight:700;padding:14px 26px} body.layout-editoriale .btn-primary{background:var(--ed-acc);color:#06121a;border:0} body.layout-editoriale .btn-primary:hover{filter:brightness(1.08);transform:translateY(-2px)} /* ---------- News / card editoriali ---------- */ body.layout-editoriale .block-cards{background:var(--ed-bg)} body.layout-editoriale .cards-grid{gap:22px} /* le colonne le decide il CSS base via .cols-N della pagina */ body.layout-editoriale .card{ background:var(--ed-card);border:1px solid var(--ed-line);border-radius:18px;overflow:hidden; transition:transform .25s ease,border-color .25s ease,box-shadow .25s ease; } body.layout-editoriale .card:hover{transform:translateY(-6px);border-color:rgba(255,255,255,.22);box-shadow:0 22px 44px rgba(0,0,0,.5)} body.layout-editoriale .card img{width:100%;aspect-ratio:16/10;object-fit:cover;display:block;transition:transform .4s ease} body.layout-editoriale .card:hover img{transform:scale(1.05)} body.layout-editoriale .card-noimg{display:flex;align-items:center;justify-content:center;aspect-ratio:16/10;background:var(--gray-100);color:var(--ed-muted);font-size:2rem} body.layout-editoriale .card-body{padding:18px 18px 22px} body.layout-editoriale .card-body h3{font-size:1.12rem;color:#fff;margin:.2em 0 .4em;text-transform:none;font-family:'Inter',sans-serif;letter-spacing:0;font-weight:700;line-height:1.25} body.layout-editoriale .card-date{color:var(--ed-acc);font-weight:700;text-transform:uppercase;letter-spacing:.6px;font-size:.74rem} /* Rosa: in hover il nome NON deve diventare blu scuro (illeggibile su card scura) */ body.layout-editoriale .block-roster .card:hover h3, body.layout-editoriale .block-roster .card:hover h3 a{color:var(--ed-acc,#2FA8E0)} /* Leggibilità su fondo SCURO: elementi che nel tema base sono navy (--c-primary) e sparirebbero. Nel tema chiaro (.ed-chiaro) restano navy, quindi questi override valgono solo per lo scuro. */ body.layout-editoriale:not(.ed-chiaro) .roster-role-title{color:var(--ed-text)} body.layout-editoriale:not(.ed-chiaro) .roster-section-title{color:var(--ed-text);border-bottom-color:var(--ed-line,rgba(255,255,255,.18))} body.layout-editoriale:not(.ed-chiaro) .rtab.active{color:var(--ed-acc)} body.layout-editoriale:not(.ed-chiaro) .card-link{color:var(--ed-acc)} body.layout-editoriale:not(.ed-chiaro) .card h3 a:hover{color:var(--ed-acc)} body.layout-editoriale:not(.ed-chiaro) .pagination .page{color:var(--ed-text)} /* Foto giocatori intere (niente taglio): ritratto + contain su sfondo scuro */ body.layout-editoriale .block-roster .card img{aspect-ratio:3/4; object-fit:contain; object-position:center; background:var(--ed-card)} body.layout-editoriale .card-link, body.layout-editoriale .card p{color:var(--ed-muted)} body.layout-editoriale .pagination .page{background:#1b1b21;color:var(--ed-text);border:1px solid var(--ed-line)} body.layout-editoriale .pagination .page.current{background:var(--ed-acc);color:#06121a;border-color:var(--ed-acc)} /* ---------- Gallery / sponsor / widget su base scura ---------- */ body.layout-editoriale .gallery-item{border-radius:14px;overflow:hidden} body.layout-editoriale .sponsor-logo{background:#fff;border-radius:12px;padding:14px} body.layout-editoriale .widget-cell{background:var(--ed-card);border:1px solid var(--ed-line);border-radius:16px;padding:16px} body.layout-editoriale .widget-title{color:#fff} body.layout-editoriale .embed-ph{background:var(--ed-card);border-color:var(--ed-line);color:var(--ed-muted)} body.layout-editoriale .embed-ph-title{color:#fff} /* ---------- Contatti ---------- */ body.layout-editoriale .block-contact{background:var(--ed-bg2)} body.layout-editoriale .contact-form input, body.layout-editoriale .contact-form textarea{background:var(--ed-card);border:1px solid var(--ed-line);color:#fff;border-radius:10px} body.layout-editoriale .contact-form label{color:var(--ed-muted)} /* ---------- Footer ---------- */ body.layout-editoriale .footer-cta{background:linear-gradient(90deg,var(--c-primary,#0B2233),var(--ed-acc))} body.layout-editoriale .footer-cta-text{color:#fff} body.layout-editoriale .footer-cta .btn-primary{color:#fff} body.layout-editoriale .site-footer{background:#08080a;color:var(--ed-muted);border-top:1px solid var(--ed-line)} body.layout-editoriale .site-footer h4{color:#fff;text-transform:uppercase;letter-spacing:.6px} body.layout-editoriale .footer-links a:hover{color:var(--ed-acc)} body.layout-editoriale .footer-divider{border-color:var(--ed-line)} /* Riduci il "salto" del contenuto sotto l'header fisso quando NON c'è hero */ body.layout-editoriale:not(.page-has-hero) .site-main{padding-top:0} /* ---------- Preset di palette (sovrascrivono l'accento) ---------- */ body.layout-editoriale.preset-oro{--ed-acc:#d4af37} body.layout-editoriale.preset-rosso{--ed-acc:#e23b3b} body.layout-editoriale.preset-verde{--ed-acc:#1fbf73} body.layout-editoriale.preset-viola{--ed-acc:#8b5cf6} /* (preset "accento" = usa il colore accento del tema, nessun override) */ /* ---------- Rail social laterale (desktop) ---------- */ .ed-social-rail{ position:fixed; right:0; top:50%; transform:translateY(-50%); z-index:45; display:flex; flex-direction:column; gap:2px; background:rgba(18,18,22,.66); backdrop-filter:blur(8px); border:1px solid var(--ed-line,rgba(255,255,255,.12)); border-right:0; border-radius:14px 0 0 14px; padding:7px; } .ed-social-rail .ed-soc{ width:42px; height:42px; display:flex; align-items:center; justify-content:center; color:#e9eaed; border-radius:9px; transition:background .15s ease,color .15s ease; } .ed-social-rail .ed-soc:hover{background:var(--ed-acc,#2FA8E0); color:#06121a} .ed-social-rail svg{width:18px; height:18px} @media(max-width:1100px){.ed-social-rail{display:none}} /* ---------- Slideshow nello stile editoriale ---------- */ body.layout-editoriale .block-slideshow{padding:0; background:#000} body.layout-editoriale .slide-inner{ min-height:clamp(440px,80vh,800px); display:flex; flex-direction:column; justify-content:flex-end; padding-bottom:60px; } body.layout-editoriale .slide-bg{filter:brightness(.9)} body.layout-editoriale .slide-inner h2{font-size:clamp(2rem,5.5vw,4.2rem); color:#fff; max-width:18ch; text-shadow:0 2px 24px rgba(0,0,0,.45)} body.layout-editoriale .slide-sub{color:#e9eaed; max-width:48ch; font-size:clamp(1rem,1.5vw,1.2rem)} body.layout-editoriale .slide-nav{background:rgba(0,0,0,.45); color:#fff; border:1px solid var(--ed-line); width:48px; height:48px; border-radius:50%} body.layout-editoriale .slide-nav:hover{background:var(--ed-acc); color:#06121a; border-color:var(--ed-acc)} body.layout-editoriale .slide-dots .dot{background:rgba(255,255,255,.45)} body.layout-editoriale .slide-dots .dot.active{background:var(--ed-acc)} /* ---------- Banner di intestazione pagina: mini-hero scuro ---------- */ body.layout-editoriale .block-page-banner{position:relative; min-height:380px; overflow:hidden} body.layout-editoriale .block-page-banner::after{content:""; position:absolute; inset:0; background:linear-gradient(180deg,rgba(7,20,31,.25),rgba(7,20,31,.82)); pointer-events:none} body.layout-editoriale .block-page-banner>.container{position:relative; z-index:2; padding-bottom:40px} /* ---------- Hero/banner con VIDEO di sfondo ---------- */ .block-hero .hero-video, .block-page-banner .hero-video{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; z-index:0; pointer-events:none; } .block-hero .hero-inner{position:relative; z-index:2} /* ---------- Animazioni: comparsa allo scroll ---------- */ @media (prefers-reduced-motion: no-preference){ body.layout-editoriale .reveal{opacity:0; transform:translateY(26px); transition:opacity .7s ease, transform .7s cubic-bezier(.2,.7,.2,1)} body.layout-editoriale .reveal.is-visible{opacity:1; transform:none} body.layout-editoriale .cards-grid .card.reveal{transition-delay:var(--d,0s)} } /* ---------- Hero a tutto schermo + indicatore di scroll ---------- */ body.layout-editoriale.page-has-hero .block-hero .hero-inner{min-height:100vh} body.layout-editoriale.page-has-hero .block-hero::before{ content:""; position:absolute; left:50%; bottom:26px; width:20px; height:20px; border-right:2px solid rgba(255,255,255,.85); border-bottom:2px solid rgba(255,255,255,.85); transform:translateX(-50%) rotate(45deg); z-index:3; animation:edScrollCue 1.8s ease-in-out infinite; } @keyframes edScrollCue{0%,100%{transform:translateX(-50%) rotate(45deg) translateY(0);opacity:.5}50%{transform:translateX(-50%) rotate(45deg) translateY(7px);opacity:1}} /* ---------- Rifinitura card news ---------- */ body.layout-editoriale .card{position:relative} body.layout-editoriale .card-date{display:inline-block; background:rgba(255,255,255,.08); padding:3px 10px; border-radius:999px} body.layout-editoriale .card-link{display:inline-flex; align-items:center; gap:6px; color:#fff; font-weight:700; margin-top:8px; transition:transform .2s ease} /* niente freccia ::after: il testo del link contiene già la freccia giusta (→ oppure ←) */ body.layout-editoriale .card:hover .card-link{transform:translateX(4px)} /* ---------- Menu mobile coerente con lo scuro ---------- */ @media(max-width:860px){ body.layout-editoriale .site-nav{background:#0b0b0e; z-index:120} body.layout-editoriale .site-nav a{font-size:1.05rem; padding:14px 18px} /* Niente backdrop-filter sull'header in mobile: altrimenti diventa il "containing block" del menu fixed — a menu aperto lo confina all'altezza dell'header, a menu chiuso lo spinge off-canvas creando scroll orizzontale di pagina */ body.layout-editoriale .site-header{backdrop-filter:none; -webkit-backdrop-filter:none} } /* ---------- Header compatto allo scroll ---------- */ body.layout-editoriale .brand-logo{transition:height .25s ease} body.layout-editoriale.scrolled .header-inner{min-height:60px} body.layout-editoriale.scrolled .brand-logo{height:42px !important} /* ---------- Back-to-top ---------- */ .ed-top{ position:fixed; right:18px; bottom:18px; z-index:46; width:46px; height:46px; border-radius:50%; border:1px solid var(--ed-line,rgba(255,255,255,.14)); background:rgba(18,18,22,.8); backdrop-filter:blur(6px); color:#fff; font-size:1.2rem; cursor:pointer; opacity:0; transform:translateY(10px); pointer-events:none; transition:opacity .25s ease, transform .25s ease, background .2s ease, color .2s ease; } .ed-top.show{opacity:1; transform:none; pointer-events:auto} .ed-top:hover{background:var(--ed-acc,#2FA8E0); color:#06121a; border-color:var(--ed-acc,#2FA8E0)} @media(max-width:1100px){.ed-top{right:14px; bottom:14px}} /* ---------- Tocchi premium ---------- */ body.layout-editoriale ::selection{background:var(--ed-acc,#2FA8E0); color:#06121a} body.layout-editoriale a:focus-visible, body.layout-editoriale button:focus-visible{outline:2px solid var(--ed-acc,#2FA8E0); outline-offset:3px; border-radius:6px} body.layout-editoriale ::-webkit-scrollbar{width:12px; height:12px} body.layout-editoriale ::-webkit-scrollbar-track{background:var(--ed-bg)} body.layout-editoriale ::-webkit-scrollbar-thumb{background:#1e3e58; border-radius:8px; border:3px solid var(--ed-bg)} body.layout-editoriale ::-webkit-scrollbar-thumb:hover{background:#3a3a44} /* ---------- Hover su sponsor, gallery, widget ---------- */ body.layout-editoriale .sponsor-logo{transition:transform .2s ease} body.layout-editoriale .sponsor-logo:hover{transform:translateY(-3px)} body.layout-editoriale .gallery-item img{transition:transform .45s ease} body.layout-editoriale .gallery-item:hover img{transform:scale(1.06)} body.layout-editoriale .widget-cell{transition:border-color .2s ease, transform .2s ease} body.layout-editoriale .widget-cell:hover{border-color:rgba(255,255,255,.22); transform:translateY(-3px)} /* ---------- Entrata animata dei testi dell'hero ---------- */ @media (prefers-reduced-motion: no-preference){ body.layout-editoriale .block-hero h1{animation:edUp .75s .05s ease both} body.layout-editoriale .block-hero .hero-sub{animation:edUp .75s .18s ease both} body.layout-editoriale .block-hero .hero-inner .btn{animation:edUp .75s .3s ease both} } @keyframes edUp{from{opacity:0; transform:translateY(26px)} to{opacity:1; transform:none}} /* ---------- Micro-interazioni pulsanti (riflesso) ---------- */ body.layout-editoriale .btn-primary{position:relative; overflow:hidden} body.layout-editoriale .btn-primary::after{ content:""; position:absolute; top:0; left:-120%; width:60%; height:100%; background:linear-gradient(100deg,transparent,rgba(255,255,255,.38),transparent); transform:skewX(-18deg); transition:left .55s ease; } body.layout-editoriale .btn-primary:hover::after{left:140%} /* ---------- Sottolineatura animata nel menu (desktop) ---------- */ @media(min-width:861px){ body.layout-editoriale .site-nav>ul>li>a{position:relative} body.layout-editoriale .site-nav>ul>li>a::after{ content:""; position:absolute; left:12px; right:12px; bottom:5px; height:2px; background:var(--ed-acc); transform:scaleX(0); transform-origin:left; transition:transform .25s ease; } body.layout-editoriale .site-nav>ul>li:hover>a::after, body.layout-editoriale .site-nav>ul>li.active>a::after{transform:scaleX(1)} } /* ---------- Link di testo con underline animato ---------- */ body.layout-editoriale .block-text a{ text-decoration:none; background-image:linear-gradient(var(--ed-acc),var(--ed-acc)); background-size:0% 2px; background-position:0 100%; background-repeat:no-repeat; transition:background-size .25s ease; } body.layout-editoriale .block-text a:hover{background-size:100% 2px} /* ---------- Barra di avanzamento lettura ---------- */ .ed-progress{position:fixed; top:0; left:0; height:3px; width:0; background:var(--ed-acc,#2FA8E0); z-index:60; transition:width .08s linear; pointer-events:none} /* ---------- Footer editoriale ---------- */ body.layout-editoriale .site-footer{border-top:3px solid var(--ed-acc,#2FA8E0)} body.layout-editoriale .footer-crest{filter:drop-shadow(0 6px 18px rgba(0,0,0,.5))} body.layout-editoriale .site-footer .social-links a{ width:42px; height:42px; border:1px solid var(--ed-line,rgba(255,255,255,.14)); border-radius:50%; display:inline-flex; align-items:center; justify-content:center; color:#fff; transition:background .2s ease, color .2s ease, border-color .2s ease; } body.layout-editoriale .site-footer .social-links a:hover{background:var(--ed-acc,#2FA8E0); color:#06121a; border-color:var(--ed-acc,#2FA8E0)} body.layout-editoriale .footer-bar{border-top:1px solid var(--ed-line,rgba(255,255,255,.12)); text-transform:uppercase; letter-spacing:.4px; font-size:.78rem; padding-top:16px} body.layout-editoriale .footer-reserved a:hover{color:var(--ed-acc,#2FA8E0)} /* ---------- Tipografia ricca nei blocchi di testo ---------- */ /* Container standard come gli altri blocchi: bordo sinistro allineato al titolo a OGNI larghezza, niente overflow su mobile */ body.layout-editoriale .block-text>.container{max-width:1280px} /* Misura di lettura comoda, allineata a sinistra (non si applica a immagini/figure) */ body.layout-editoriale .block-text p, body.layout-editoriale .block-text h2, body.layout-editoriale .block-text h3, body.layout-editoriale .block-text h4, body.layout-editoriale .block-text ul, body.layout-editoriale .block-text ol, body.layout-editoriale .block-text blockquote{max-width:760px} body.layout-editoriale .block-text p{font-size:1.06rem; line-height:1.75; color:#d7d9de} body.layout-editoriale .block-text h3{margin-top:1.2em} body.layout-editoriale .block-text strong{color:#fff} body.layout-editoriale .block-text blockquote{border-left:4px solid var(--ed-acc,#2FA8E0); padding:6px 0 6px 18px; margin:20px 0; color:#fff; font-size:1.2rem; font-style:italic} body.layout-editoriale .block-text ul, body.layout-editoriale .block-text ol{padding-left:22px} body.layout-editoriale .block-text li{margin:6px 0; color:#d7d9de} /* ---------- Titoli ben contrastati sullo sfondo scuro ---------- */ body.layout-editoriale h1, body.layout-editoriale h2, body.layout-editoriale h3, body.layout-editoriale h4, body.layout-editoriale .block-heading h2, body.layout-editoriale .block-cards h2, body.layout-editoriale .block-gallery h2, body.layout-editoriale .block-embed h2, body.layout-editoriale .block-social h2, body.layout-editoriale .block-results h2{color:#ffffff} /* Stato "vuoto" (es. nessuna news) leggibile */ body.layout-editoriale .block p[style*="opacity"]{color:#cfd2d8} /* ===================================================================== EDITORIALE CHIARO — variante chiara (classe ed-chiaro sul ). Pagina e riquadri chiari, header solido chiaro con testo scuro; gli hero/banner mantengono lo scrim scuro per leggere il titolo bianco. Blocco additivo: lo stile editoriale scuro resta invariato. ===================================================================== */ body.layout-editoriale.ed-chiaro{ --ed-bg:#ffffff; --ed-bg2:#eef1f5; --ed-card:#ffffff; --ed-text:#17222e; --ed-muted:#5a6675; --ed-line:rgba(11,34,51,.14); --c-surface:#ffffff; --c-border:rgba(11,34,51,.14); --c-bg:#ffffff; --c-text:#17222e; --gray-100:#eef1f5; background:var(--ed-bg); color:var(--ed-text); } /* L'header (barra + dropdown) segue SEMPRE i colori impostati in admin (Sfondo/Testo header), a prescindere dal tema chiaro/scuro del corpo pagina: nessun override chiaro qui. */ /* Titoli e testi scuri su fondo chiaro */ body.layout-editoriale.ed-chiaro h1, body.layout-editoriale.ed-chiaro h2, body.layout-editoriale.ed-chiaro h3, body.layout-editoriale.ed-chiaro h4, body.layout-editoriale.ed-chiaro .block-heading h2, body.layout-editoriale.ed-chiaro .block-cards h2, body.layout-editoriale.ed-chiaro .block-gallery h2, body.layout-editoriale.ed-chiaro .block-embed h2, body.layout-editoriale.ed-chiaro .block-social h2, body.layout-editoriale.ed-chiaro .block-results h2, body.layout-editoriale.ed-chiaro .card-body h3, body.layout-editoriale.ed-chiaro .widget-title, body.layout-editoriale.ed-chiaro .embed-ph-title, body.layout-editoriale.ed-chiaro .block-text strong{color:var(--ed-text)} body.layout-editoriale.ed-chiaro .block-text p, body.layout-editoriale.ed-chiaro .block-text li{color:#39434f} body.layout-editoriale.ed-chiaro .block-text blockquote{color:var(--ed-text)} /* Hero/banner: restano scuri con titolo bianco sopra la foto */ body.layout-editoriale.ed-chiaro .block-hero h1, body.layout-editoriale.ed-chiaro .block-page-banner h1{color:#fff} body.layout-editoriale.ed-chiaro .hero-sub{color:#e9eaed} /* Card e superfici chiare */ body.layout-editoriale.ed-chiaro .card:hover{border-color:rgba(11,34,51,.22);box-shadow:0 20px 40px rgba(11,34,51,.14)} body.layout-editoriale.ed-chiaro .card-noimg, body.layout-editoriale.ed-chiaro .block-roster .card img, body.layout-editoriale.ed-chiaro .embed-ph, body.layout-editoriale.ed-chiaro .pagination .page{background:#eef1f5} body.layout-editoriale.ed-chiaro .contact-form input, body.layout-editoriale.ed-chiaro .contact-form textarea{background:#fff;color:#17222e} /* Footer: resta navy (brand) per contrasto, testo chiaro */ body.layout-editoriale.ed-chiaro .site-footer{background:var(--c-primary,#0B2233);color:rgba(255,255,255,.82)} body.layout-editoriale.ed-chiaro .site-footer h4{color:#fff}