/* VIDEOFERRARI.IT - Main Stylesheet */
*,*::before,*::after{margin:0;padding:0;box-sizing:border-box}
:root{--ferrari-red:#DC0000;--ferrari-dark:#9B0000;--ferrari-light:#FFE5E5;--yellow-modena:#FEDC28;--black:#0A0A0A;--gray-900:#1A1A1A;--gray-800:#333;--gray-600:#666;--gray-400:#999;--gray-200:#E5E5E5;--gray-100:#F5F5F5;--white:#FFF;--font-display:"Playfair Display",Georgia,serif;--font-body:"Inter",system-ui,sans-serif;--max-width:1280px;--header-height:70px;--radius:4px;--shadow:0 2px 12px rgba(0,0,0,.08);--shadow-lg:0 8px 32px rgba(0,0,0,.12);--tr:.3s cubic-bezier(.4,0,.2,1)}
html{scroll-behavior:smooth}body{font-family:var(--font-body);color:var(--gray-800);background:var(--white);line-height:1.7;-webkit-font-smoothing:antialiased}
a{color:var(--ferrari-red);text-decoration:none;transition:color var(--tr)}a:hover{color:var(--ferrari-dark)}img{max-width:100%;height:auto;display:block}
.header{position:fixed;top:0;left:0;right:0;height:var(--header-height);background:var(--black);z-index:1000;border-bottom:3px solid var(--ferrari-red)}
.header-inner{max-width:var(--max-width);margin:0 auto;padding:0 1.5rem;height:100%;display:flex;align-items:center;justify-content:space-between}
.logo-text{font-family:var(--font-display);font-size:1.6rem;font-weight:900;color:var(--white);letter-spacing:.03em}.logo-text span{color:var(--ferrari-red)}
.nav{display:flex;gap:0}.nav a{white-space:nowrap;color:var(--gray-400);font-size:.85rem;font-weight:500;padding:.5rem 1rem;letter-spacing:.04em;text-transform:uppercase;transition:all var(--tr);border-bottom:2px solid transparent}.nav a:hover,.nav a.active{color:var(--white);border-bottom-color:var(--ferrari-red)}
.nav-lang{display:flex;gap:.25rem;margin-left:1.5rem;padding-left:1.5rem;border-left:1px solid rgba(255,255,255,.15)}.nav-lang a{color:var(--gray-600);font-size:.75rem;padding:.3rem .5rem;border-radius:var(--radius)}.nav-lang a:hover,.nav-lang a.active{color:var(--white);background:rgba(255,255,255,.1)}
.btn{display:inline-flex;align-items:center;gap:.5rem;padding:.5rem 1.25rem;border-radius:var(--radius);font-size:.85rem;font-weight:500;cursor:pointer;transition:all var(--tr);border:none}
.btn-primary{background:var(--ferrari-red);color:var(--white)}.btn-primary:hover{background:var(--ferrari-dark);color:var(--white)}
.btn-outline{background:transparent;color:var(--gray-400);border:1px solid var(--gray-600)}.btn-outline:hover{color:var(--white);border-color:var(--white)}
.menu-toggle{display:none;background:none;border:none;color:var(--white);font-size:1.5rem;cursor:pointer}
.hero{margin-top:var(--header-height);position:relative;height:70vh;min-height:500px;background:var(--black);display:flex;align-items:flex-end;overflow:hidden}
.hero-bg{position:absolute;inset:0;background:linear-gradient(135deg,#0a0a0a 0%,#1a0000 40%,#2d0000 60%,#0a0a0a 100%)}
.hero-overlay{position:absolute;inset:0;background:linear-gradient(to top,rgba(0,0,0,.9) 0%,transparent 60%)}
.hero-accent{position:absolute;top:-20%;right:-10%;width:60%;height:140%;background:radial-gradient(ellipse,rgba(220,0,0,.08) 0%,transparent 70%);pointer-events:none}
.hero-content{position:relative;z-index:2;max-width:var(--max-width);margin:0 auto;padding:3rem 1.5rem 4rem;width:100%}
.hero-label{display:inline-block;background:var(--ferrari-red);color:var(--white);font-size:.75rem;font-weight:600;padding:.3rem .8rem;letter-spacing:.1em;text-transform:uppercase;margin-bottom:1rem}
.hero-title{font-family:var(--font-display);font-size:clamp(2rem,5vw,3.5rem);font-weight:900;color:var(--white);line-height:1.15;margin-bottom:1rem;max-width:700px}
.hero-excerpt{font-size:1.1rem;color:var(--gray-400);line-height:1.7;max-width:550px;margin-bottom:1.5rem}
.hero-meta{display:flex;gap:1.5rem;font-size:.85rem;color:var(--gray-600)}.hero-meta span{display:flex;align-items:center;gap:.4rem}
.main{max-width:var(--max-width);margin:0 auto;padding:3rem 1.5rem}
.layout{display:grid;grid-template-columns:1fr 320px;gap:3rem}
.section-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:2rem;padding-bottom:1rem;border-bottom:2px solid var(--ferrari-red)}
.section-title{font-family:var(--font-display);font-size:1.8rem;font-weight:700;color:var(--black)}
.section-link{font-size:.85rem;font-weight:500;text-transform:uppercase;letter-spacing:.05em}
.cards-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:1.5rem;margin-bottom:3rem}
.card{background:var(--white);border:1px solid var(--gray-200);border-radius:var(--radius);overflow:hidden;transition:all var(--tr)}
.card:hover{transform:translateY(-4px);box-shadow:var(--shadow-lg);border-color:var(--ferrari-red)}
.card-img{aspect-ratio:16/10;background:var(--gray-100);overflow:hidden;position:relative}
.card-img img{width:100%;height:100%;object-fit:cover;transition:transform var(--tr)}.card:hover .card-img img{transform:scale(1.05)}
.card-cat{position:absolute;top:.75rem;left:.75rem;background:var(--ferrari-red);color:var(--white);font-size:.7rem;font-weight:600;padding:.2rem .6rem;letter-spacing:.05em;text-transform:uppercase}
.card-body{padding:1.25rem}
.card-title{font-family:var(--font-display);font-size:1.15rem;font-weight:700;line-height:1.35;margin-bottom:.5rem;color:var(--black)}.card-title a{color:inherit}.card-title a:hover{color:var(--ferrari-red)}
.card-excerpt{font-size:.9rem;color:var(--gray-600);line-height:1.6;margin-bottom:1rem;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
.card-meta{display:flex;align-items:center;justify-content:space-between;font-size:.8rem;color:var(--gray-400)}
.featured-row{display:grid;grid-template-columns:1fr 1fr;gap:1.5rem;margin-bottom:3rem}
.card-featured .card-img{aspect-ratio:16/9}.card-featured .card-title{font-size:1.4rem}
.sidebar{display:flex;flex-direction:column;gap:2rem}
.sidebar-box{background:var(--gray-100);border-radius:var(--radius);padding:1.5rem}
.sidebar-box h3{font-family:var(--font-display);font-size:1.1rem;font-weight:700;margin-bottom:1rem;padding-bottom:.75rem;border-bottom:2px solid var(--ferrari-red)}
.sidebar-list{list-style:none}.sidebar-list li{padding:.75rem 0;border-bottom:1px solid var(--gray-200);font-size:.9rem}.sidebar-list li:last-child{border-bottom:none}
.sidebar-list a{color:var(--gray-800)}.sidebar-list a:hover{color:var(--ferrari-red)}.sidebar-list .num{font-family:var(--font-display);font-weight:700;color:var(--ferrari-red);margin-right:.5rem;font-size:1.1rem}
.ad-banner{background:var(--gray-100);border:1px dashed var(--gray-200);border-radius:var(--radius);display:flex;align-items:center;justify-content:center;min-height:250px;color:var(--gray-400);font-size:.8rem;text-transform:uppercase;letter-spacing:.1em}
.ad-leaderboard{max-width:var(--max-width);margin:2rem auto;padding:0 1.5rem}.ad-leaderboard .ad-banner{min-height:90px}
.newsletter{background:var(--black);padding:4rem 1.5rem;text-align:center}
.newsletter-inner{max-width:600px;margin:0 auto}
.newsletter h2{font-family:var(--font-display);font-size:2rem;font-weight:900;color:var(--white);margin-bottom:.75rem}
.newsletter p{color:var(--gray-400);margin-bottom:2rem}
.newsletter-form{display:flex;gap:.5rem;max-width:450px;margin:0 auto}
.newsletter-form input{flex:1;padding:.75rem 1rem;border:1px solid var(--gray-600);background:var(--gray-900);color:var(--white);border-radius:var(--radius);font-size:.95rem}.newsletter-form input::placeholder{color:var(--gray-600)}
.newsletter-form button{padding:.75rem 1.5rem;background:var(--ferrari-red);color:var(--white);border:none;border-radius:var(--radius);font-weight:600;cursor:pointer;transition:background var(--tr);white-space:nowrap}.newsletter-form button:hover{background:var(--ferrari-dark)}
.footer{background:var(--black);border-top:3px solid var(--ferrari-red);padding:3rem 1.5rem 1.5rem}
.footer-inner{max-width:var(--max-width);margin:0 auto}
.footer-grid{display:grid;grid-template-columns:2fr 1fr 1fr 1fr;gap:2rem;margin-bottom:2.5rem}
.footer h4{color:var(--white);font-size:.9rem;font-weight:600;margin-bottom:1rem;text-transform:uppercase;letter-spacing:.05em}
.footer p,.footer a,.footer li{color:var(--gray-600);font-size:.85rem;line-height:1.8}.footer a:hover{color:var(--ferrari-red)}.footer ul{list-style:none}
.footer-bottom{border-top:1px solid rgba(255,255,255,.08);padding-top:1.5rem;display:flex;justify-content:space-between;align-items:flex-start;gap:1rem;flex-wrap:wrap}
.footer-disclaimer{font-size:.7rem;color:var(--gray-600);line-height:1.7;max-width:700px}
.footer-copy{font-size:.75rem;color:var(--gray-600);white-space:nowrap}
@media(max-width:1024px){.layout{grid-template-columns:1fr}.sidebar{display:grid;grid-template-columns:1fr 1fr;gap:1.5rem}.footer-grid{grid-template-columns:1fr 1fr}}
@media(max-width:768px){.nav,.nav-lang{display:none}.menu-toggle{display:block}.hero{min-height:400px;height:60vh}.hero-title{font-size:1.8rem}.featured-row,.cards-grid,.sidebar{grid-template-columns:1fr}.newsletter-form{flex-direction:column}.footer-grid{grid-template-columns:1fr}.footer-bottom{flex-direction:column}}
.nav-mobile{display:none;position:fixed;inset:0;background:rgba(0,0,0,.95);z-index:999;flex-direction:column;align-items:center;justify-content:center;gap:1.5rem}
.nav-mobile.open{display:flex}.nav-mobile a{color:var(--white);font-size:1.3rem;font-weight:500;text-transform:uppercase;letter-spacing:.1em}
.nav-mobile .close-btn{position:absolute;top:1.5rem;right:1.5rem;background:none;border:none;color:var(--white);font-size:2rem;cursor:pointer}

/* DARK MODE */
[data-theme="dark"] {
  --black:#F5F5F5;--gray-900:#E5E5E5;--gray-800:#CCC;--gray-600:#999;--gray-400:#777;--gray-200:#333;--gray-100:#1A1A1A;--white:#111;
  --ferrari-light:#2D0000;--shadow:0 2px 12px rgba(0,0,0,.3);--shadow-lg:0 8px 32px rgba(0,0,0,.4);
}
[data-theme="dark"] body{background:#111;color:#CCC}
[data-theme="dark"] .header{background:#0A0A0A}
[data-theme="dark"] .card{background:#1A1A1A;border-color:#333}
[data-theme="dark"] .card:hover{border-color:var(--ferrari-red);box-shadow:0 4px 20px rgba(220,0,0,.15)}
[data-theme="dark"] .card-title a{color:#EEE}
[data-theme="dark"] .sidebar-box{background:#1A1A1A}
[data-theme="dark"] .footer{background:#0A0A0A}
[data-theme="dark"] .section-title{color:#EEE}
[data-theme="dark"] .ad-banner{background:#1A1A1A;color:#555;border:1px dashed #333}
[data-theme="dark"] .newsletter{background:#1A1A1A}
[data-theme="dark"] .auth-card{background:#1A1A1A}
[data-theme="dark"] .auth-page{background:#111}
[data-theme="dark"] .legal-page h1,[data-theme="dark"] .legal-page h2{color:#EEE}
[data-theme="dark"] .legal-page p,[data-theme="dark"] .legal-page li{color:#AAA}

/* Dark mode toggle button */
.theme-toggle{background:none;border:1px solid var(--gray-600);color:var(--gray-400);width:40px;height:40px;border-radius:50%;cursor:pointer;display:flex;align-items:center;justify-content:center;font-size:1rem;transition:all .2s;margin-left:.5rem}
.theme-toggle:hover{border-color:var(--ferrari-red);color:var(--ferrari-red)}


.header-actions{display:flex;align-items:center;gap:.75rem;flex-shrink:0;white-space:nowrap}


/* Fix navbar overflow */
.nav{display:flex;align-items:center;gap:.25rem;overflow-x:auto;-webkit-overflow-scrolling:touch;scrollbar-width:none;flex-shrink:1}
.nav::-webkit-scrollbar{display:none}
.nav a{white-space:nowrap;flex-shrink:0;padding:.5rem .6rem;font-size:.85rem}

.card-stats{display:flex;gap:1rem;padding:.5rem 1.25rem 1rem;font-size:.8rem;color:var(--gray-400)}.card-stats span{display:flex;align-items:center;gap:.25rem}

/* Fix Esci posizione - override forte */
.header-actions{display:flex!important;align-items:center!important;gap:.5rem!important;flex-shrink:0!important;white-space:nowrap!important;flex-wrap:nowrap!important}
.header-actions>div{display:inline-flex!important;align-items:center!important;flex-wrap:nowrap!important;white-space:nowrap!important}
.header-actions #logoutBtn{padding:2px 8px!important;font-size:.7rem!important;line-height:1.2!important;white-space:nowrap!important}


/* Fix navbar troppi link */
.nav a{padding:.5rem .45rem!important;font-size:.8rem!important;letter-spacing:-.01em}
@media(min-width:1200px){.nav a{padding:.5rem .55rem!important;font-size:.85rem!important}}
.header-actions{gap:6px!important}
.theme-toggle{width:40px;height:40px;font-size:1rem;background:none;border:1px solid #444;border-radius:50%;color:#ccc;cursor:pointer;display:flex;align-items:center;justify-content:center;flex-shrink:0}
.theme-toggle:hover{border-color:#DC0000;color:#DC0000}

/* Header actions - fix definitivo Esci inline */
.header-actions{display:flex!important;align-items:center!important;gap:6px!important;flex-shrink:0!important;white-space:nowrap!important;flex-wrap:nowrap!important;max-width:250px}
.header-inner{display:flex!important;align-items:center!important;flex-wrap:nowrap!important}



/* Navbar 14 link - compatto */
.nav{display:flex!important;align-items:center!important;gap:0!important;overflow-x:auto!important;-webkit-overflow-scrolling:touch;scrollbar-width:none;flex-wrap:nowrap!important}
.nav::-webkit-scrolllbar{display:none}
.nav a{padding:.4rem .35rem!important;font-size:.72rem!important;letter-spacing:-.01em!important;white-space:nowrap;flex-shrink:0;font-weight:500}
.nav a:hover{color:#DC0000}
.nav a.nav-special{background:#DC0000;color:white!important;border-radius:3px;padding:.3rem .5rem!important;margin:0 2px;font-weight:600!important}
.nav a.nav-special:hover{background:#9B0000}
@media(min-width:1400px){.nav a{padding:.5rem .55rem!important;font-size:.8rem!important}}
@media(max-width:1100px){.nav{overflow-x:auto;justify-content:flex-start}.nav a{font-size:.7rem!important;padding:.3rem .25rem!important}}



/* Dropdown lingue compatto */
.nav-lang{position:relative;flex-shrink:0}
.lang-current{background:transparent;border:1px solid #444;color:#ccc;padding:4px 10px;font-size:.75rem;border-radius:3px;cursor:pointer;display:flex;align-items:center;gap:4px}
.lang-current:hover{border-color:#DC0000;color:#DC0000}
.lang-dropdown{display:none;position:absolute;top:100%;right:0;background:#1a1a1a;border:1px solid #333;border-radius:4px;padding:4px;min-width:120px;margin-top:4px;z-index:100;box-shadow:0 4px 12px rgba(0,0,0,.3)}
.lang-dropdown.open{display:block}
.lang-dropdown a{display:block;padding:6px 12px;color:#ccc;font-size:.8rem;text-decoration:none;border-radius:3px}
.lang-dropdown a:hover{background:#DC0000;color:white}
.lang-dropdown a.active{background:#333;color:#DC0000}



/* Footer migliorato - Etelweb + Primaris Group */
.footer-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:2rem;padding:2rem 0;border-bottom:1px solid #333}
.footer-col h4{color:#DC0000;font-family:Playfair Display,serif;font-size:1rem;margin-bottom:.75rem;font-weight:700}
.footer-col ul{list-style:none;padding:0;margin:0}
.footer-col ul li{padding:.2rem 0}
.footer-col ul li a{color:#aaa;text-decoration:none;font-size:.85rem;transition:color .2s}
.footer-col ul li a:hover{color:#DC0000}
.footer-bottom{padding:1.5rem 0;text-align:center}
.footer-companies{font-size:.85rem;color:#bbb;margin-bottom:1rem;line-height:1.7}
.footer-companies strong{color:#fff}
.footer-disclaimer{font-size:.75rem;color:#888;margin:.5rem 0;line-height:1.5}
.footer-copy{font-size:.75rem;color:#666}

/* Banner full-width responsive */
.ad-banner{width:100%!important;max-width:100%!important;background:linear-gradient(135deg,#1a1a1a,#0a0a0a);color:#666;display:flex;align-items:center;justify-content:center;border:1px dashed #333;border-radius:8px;font-size:.85rem;letter-spacing:.05em;text-transform:uppercase}
.ad-banner.leaderboard{min-height:120px!important;width:100%!important;max-width:none!important}
.ad-banner.sidebar{min-height:250px!important}

/* Sidebar piu ricca */
.with-sidebar{display:grid!important;grid-template-columns:1fr 320px!important;gap:2rem!important;align-items:flex-start!important}
@media(max-width:1024px){.with-sidebar{grid-template-columns:1fr!important}.page-sidebar{display:none}}
.page-sidebar{position:sticky;top:80px;max-height:calc(100vh - 100px);overflow-y:auto}
.page-sidebar::-webkit-scrollbar{width:4px}
.page-sidebar::-webkit-scrollbar-thumb{background:#DC0000;border-radius:2px}

/* Contenitori main piu larghi */
.video-page,.models-page,.pilots-page,.market-page,.races-page,.sponsor-page,.search-page,.about-content,.contact-content{max-width:1400px!important;margin:0 auto!important;padding:2rem 1.5rem!important}

/* Banner dentro le pagine devono essere full width */
.video-page .ad-banner,
.models-page .ad-banner,
.pilots-page .ad-banner,
.market-page .ad-banner,
.races-page .ad-banner,
.sponsor-page .ad-banner,
.f1-page .ad-banner,
.about-content .ad-banner,
.contact-content .ad-banner{width:100%!important;max-width:none!important;min-height:120px!important}



/* === LINGUE COMPATTE FINAL === */
.nav-lang{position:relative;flex-shrink:0;margin-right:.5rem}
.lang-current{background:transparent!important;border:1px solid #444!important;color:#ccc!important;padding:3px 6px!important;font-size:.7rem!important;border-radius:3px!important;cursor:pointer;display:flex!important;align-items:center;gap:2px;line-height:1!important;height:24px!important}
.lang-current:hover{border-color:#DC0000;color:#DC0000}
.lang-dropdown{display:none!important;position:absolute;top:calc(100% + 4px);right:0;background:#1a1a1a;border:1px solid #333;border-radius:4px;padding:4px;min-width:130px;z-index:100;box-shadow:0 4px 12px rgba(0,0,0,.5)}
.lang-dropdown.open{display:block!important}
.lang-dropdown a{display:block;padding:6px 12px;color:#ccc;font-size:.78rem;text-decoration:none;border-radius:3px}
.lang-dropdown a:hover{background:#DC0000;color:white}
.lang-dropdown a.active{background:#333;color:#DC0000}

/* Footer migliorato */
.footer{background:#0A0A0A;color:white;padding:2rem 1.5rem 1rem;margin-top:3rem}
.footer-inner{max-width:1400px;margin:0 auto}
.footer-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:2rem;padding:1rem 0 2rem;border-bottom:1px solid #333}
.footer-col h4{color:#DC0000;font-family:Playfair Display,serif;font-size:1rem;margin:0 0 .75rem;font-weight:700}
.footer-col ul{list-style:none;padding:0;margin:0}
.footer-col ul li{padding:.2rem 0}
.footer-col ul li a{color:#aaa;text-decoration:none;font-size:.85rem;transition:color .2s}
.footer-col ul li a:hover{color:#DC0000}
.footer-bottom{padding:1.5rem 0;text-align:center}
.footer-disclaimer{font-size:.75rem;color:#888;margin:.5rem 0;line-height:1.5}
.footer-copy{font-size:.8rem;color:#999}
.footer-copy a{font-weight:600}



/* === NAVBAR DEFINITIVA === */
.header-inner{display:flex!important;align-items:center!important;flex-wrap:nowrap!important;gap:.5rem!important;max-width:100%!important;padding:0 1rem!important}
.logo{flex-shrink:0!important;margin-right:1rem}
.nav{display:flex!important;align-items:center!important;flex:1!important;gap:.1rem!important;flex-wrap:nowrap!important;overflow-x:auto;-webkit-overflow-scrolling:touch}
.nav::-webkit-scrollbar{display:none}
.nav{scrollbar-width:none}
.nav a{padding:.4rem .5rem!important;font-size:.78rem!important;letter-spacing:0!important;white-space:nowrap;color:#ccc;text-decoration:none;font-weight:500;text-transform:uppercase}
.nav a:hover{color:#DC0000}
.nav a.nav-special{background:#DC0000;color:white!important;border-radius:3px;padding:.3rem .55rem!important;margin:0 2px;font-weight:600!important}

/* Dropdown Strumenti */








/* Lingue mini */
.nav-lang{position:relative;flex-shrink:0;margin-left:auto;margin-right:.4rem}
.lang-current{background:transparent!important;border:1px solid #444!important;color:#ccc!important;padding:3px 6px!important;font-size:.7rem!important;border-radius:3px!important;cursor:pointer;display:inline-flex!important;align-items:center;gap:2px;line-height:1!important;height:24px!important}
.lang-current:hover{border-color:#DC0000;color:#DC0000}
.lang-dropdown{display:none!important;position:absolute;top:calc(100% + 4px);right:0;background:#1a1a1a;border:1px solid #333;border-radius:4px;padding:4px;min-width:130px;z-index:100;box-shadow:0 4px 12px rgba(0,0,0,.5)}
.lang-dropdown.open{display:block!important}
.lang-dropdown a{display:block;padding:5px 12px;color:#ccc;font-size:.78rem;text-decoration:none;border-radius:3px}
.lang-dropdown a:hover{background:#DC0000;color:white}

/* Tema toggle dark mode (luna) */
.theme-toggle{background:transparent;border:1px solid #444;color:#ccc;width:40px;height:40px;border-radius:50%;cursor:pointer;display:inline-flex;align-items:center;justify-content:center;font-size:.85rem}
.theme-toggle:hover{border-color:#DC0000;color:#DC0000}

/* Header actions */
.header-actions{display:flex!important;align-items:center!important;gap:6px!important;flex-shrink:0!important}
.header-actions .btn{padding:.35rem .8rem!important;font-size:.75rem!important}

/* Mobile */
@media(max-width:1100px){
  .nav a, 
  .nav{overflow-x:auto;justify-content:flex-start}
}
@media(max-width:850px){
  .nav, .nav-lang{display:none!important}
}

/* Click outside chiude dropdown */



/* === FIX NAVBAR DEFINITIVO === */
/* Sticky sidebar - segue lo scroll */
/* sidebar generic sticky disabled - handled by article-layout > aside.sidebar */
.sidebar::-webkit-scrollbar{width:4px}
.sidebar::-webkit-scrollbar-thumb{background:#DC0000;border-radius:2px}

/* Layout home con sidebar sticky */
.layout{display:grid!important;grid-template-columns:1fr 320px!important;gap:2rem!important;align-items:flex-start!important}

/* Mobile e tablet: nascondi sidebar sticky */
@media(max-width:1024px){
  .layout{grid-template-columns:1fr!important}
  .sidebar{position:static!important;max-height:none!important;display:grid!important;grid-template-columns:1fr 1fr!important;gap:1rem!important}
}
@media(max-width:768px){
  .sidebar{grid-template-columns:1fr!important}
}

/* === NAVBAR RESPONSIVE === */
/* Da 769px a 1100px: navbar scorrevole orizzontale + hamburger */
@media(max-width:1100px){
  .nav{display:none!important}
  .menu-toggle{display:block!important}
  .nav-lang{display:none!important}
  .header-actions{margin-left:auto}
}
@media(min-width:1101px){
  .menu-toggle{display:none!important}
  .nav{display:flex!important}
  .nav-lang{display:flex!important}
}

/* Menu mobile arricchito */
.nav-mobile{display:none;position:fixed;inset:0;background:rgba(0,0,0,.97);z-index:9999;flex-direction:column;align-items:center;justify-content:flex-start;padding:5rem 1rem 2rem;overflow-y:auto}
.nav-mobile.open{display:flex}
.nav-mobile a{color:white;font-size:1.1rem;font-weight:500;text-transform:uppercase;letter-spacing:.05em;padding:.75rem 1rem;border-bottom:1px solid #333;width:100%;max-width:400px;text-align:center;text-decoration:none}
.nav-mobile a:hover{color:#DC0000}
.nav-mobile a.special{background:#DC0000;color:white;border:none;border-radius:6px;margin-top:.5rem}
.nav-mobile .close-btn{position:fixed;top:1rem;right:1rem;background:#DC0000;color:white;border:none;width:44px;height:44px;border-radius:50%;font-size:1.5rem;cursor:pointer;display:flex;align-items:center;justify-content:center;z-index:10000}

/* Menu toggle button (hamburger) */
.menu-toggle{background:transparent;border:none;color:white;font-size:1.5rem;cursor:pointer;padding:.5rem;margin-left:.5rem}

CSSEOF

/* === HEADER CENTRATO === */
.header{background:#0A0A0A;border-bottom:3px solid #DC0000;position:sticky;top:0;z-index:1000}
.header-inner{max-width:1400px!important;margin:0 auto!important;padding:.5rem 1.5rem!important;display:flex!important;align-items:center!important;gap:1rem!important;height:60px}
.logo{flex-shrink:0;text-decoration:none}
.logo-text{font-family:Playfair Display,serif;font-size:1.4rem;font-weight:900;color:white;letter-spacing:-.01em}
.logo-text span{color:#DC0000}

/* === FOOTER PRIMARIS BLOCK === */
.footer-sponsor-block{padding:2rem 0;border-top:1px solid #333;border-bottom:1px solid #333;margin:1rem 0}
.footer-sponsor-card{background:linear-gradient(135deg,#fff,#f5f5f5);border-radius:8px;padding:1.5rem;display:grid;grid-template-columns:auto 1fr;gap:2rem;align-items:center;max-width:800px;margin:0 auto;box-shadow:0 4px 20px rgba(0,0,0,.3)}
.footer-sponsor-logo{text-align:center;padding:1rem 1.5rem;background:linear-gradient(135deg,#003F7F,#0066CC);color:white;border-radius:6px;min-width:200px}
.footer-sponsor-logo strong{display:block;font-size:1.1rem;letter-spacing:.05em;margin-bottom:.25rem}
.footer-sponsor-logo span{font-size:.7rem;opacity:.9;font-style:italic}
.footer-sponsor-info{font-size:.85rem;line-height:1.6;color:#333}
.footer-sponsor-info p{margin:0;color:#444}
.footer-sponsor-info p:first-child{font-weight:700;color:#003F7F;font-size:.95rem;margin-bottom:.25rem}
.footer-sponsor-info a{color:#DC0000;text-decoration:none}
.footer-sponsor-info a:hover{text-decoration:underline}

@media(max-width:700px){
  .footer-sponsor-card{grid-template-columns:1fr;text-align:center}
  .footer-sponsor-info{text-align:left}
}



/* Dropdown Strumenti SEMPRE VISIBILE */




/* Su mobile, il dropdown si trasforma e mantiene visibilità */
@media(max-width:1100px){
  
  
}



/* === DROPDOWN STRUMENTI - REGOLA DEFINITIVA === */





/* Lingue */
.lang-dropdown.open {
  display: block !important;
  visibility: visible !important;
  z-index: 99999 !important;
}



/* DROPDOWN MENU VISIBILE GARANTITO */




/* ============================================ */
/* === NAV DROPDOWN STRUMENTI - VERSIONE FINALE === */
/* ============================================ */

.nav-dropdown {
  position: relative;
  display: flex;
  align-items: center;
}

.nav-dropdown-btn {
  background: transparent;
  border: none;
  color: #ccc;
  cursor: pointer;
  padding: 0.4rem 0.5rem;
  font-size: 0.78rem;
  font-weight: 500;
  text-transform: uppercase;
  letter-spacing: 0;
  font-family: inherit;
  white-space: nowrap;
  line-height: 1;
  height: 100%;
  display: flex;
  align-items: center;
  gap: 3px;
}

.nav-dropdown-btn:hover {
  color: #DC0000;
}

.nav-dropdown-menu {
  display: none;
  position: absolute;
  top: 100%;
  right: 0;
  background: #1a1a1a;
  border: 2px solid #DC0000;
  border-radius: 8px;
  padding: 8px;
  min-width: 240px;
  z-index: 99999;
  box-shadow: 0 12px 40px rgba(0,0,0,0.8);
  margin-top: 6px;
}

.nav-dropdown.open 

.nav-dropdown-menu a {
  display: block;
  padding: 10px 14px;
  color: #ccc;
  text-decoration: none;
  font-size: 14px;
  border-radius: 4px;
  text-transform: none;
  white-space: nowrap;
  font-weight: 400;
  letter-spacing: 0;
}

.nav-dropdown-menu a:hover {
  background: #DC0000;
  color: white;
}

@media (max-width: 1100px) {
  .nav-dropdown {
    display: none;
  }
}

/* DARK MODE */
body.dark{background:#0d0d0d;color:#e8e8e8}
body.dark .article-card,body.dark .listing-card,body.dark .video-card,body.dark .model-card,body.dark .badge-card,body.dark .set-section,body.dark .set-box,body.dark .legal-page,body.dark .reset-card,body.dark .article-body,body.dark .market-detail,body.dark .model-detail,body.dark .chart-box,body.dark .kpi,body.dark .data-table,body.dark .trend-card,body.dark .sidebar-box,body.dark .post-row,body.dark .gp-card,body.dark .adm-box,body.dark .comment{background:#1a1a1a !important;color:#e0e0e0 !important;border-color:#333 !important}
body.dark a{color:#ff6b6b}
body.dark .footer{background:#000}
body.dark input,body.dark textarea,body.dark select{background:#262626 !important;color:#e8e8e8 !important;border-color:#444 !important}
body.dark .market-filters,body.dark .points-banner{background:#1a1a1a !important;color:#e0e0e0}
body.dark .header{background:rgba(10,10,10,0.95)}
body.dark .pref-tab,body.dark .tab,body.dark .range-tab{background:#262626;color:#aaa;border-color:#444}
body.dark .pref-tab.active,body.dark .tab.active{background:#DC0000;color:white}
body.dark .article-card-title,body.dark .trend-title,body.dark h1,body.dark h2,body.dark h3,body.dark h4{color:#fff !important}
body.dark .legal-page,body.dark .legal-page p,body.dark .legal-page li{color:#ccc !important}
body.dark p,body.dark li{color:#d0d0d0}
body.dark .nav a{color:#e0e0e0}
body.dark hr{border-color:#333}
body.dark code,body.dark pre{background:#262626;color:#e8e8e8}
body.dark blockquote{border-left-color:#DC0000;background:#1a1a1a;color:#ccc}
.dark-toggle{background:transparent;border:none;color:white;font-size:1.2rem;cursor:pointer;padding:.4rem;margin-right:.3rem}
body.dark .dark-toggle{color:#FEDC28}

/* ==================== SKELETON LOADERS ==================== */
.skeleton{background:linear-gradient(90deg,#f0f0f0 25%,#e0e0e0 50%,#f0f0f0 75%);background-size:200% 100%;animation:skeleton-load 1.4s ease-in-out infinite;border-radius:6px;color:transparent !important;pointer-events:none}
body.dark .skeleton{background:linear-gradient(90deg,#1a1a1a 25%,#262626 50%,#1a1a1a 75%);background-size:200% 100%}
@keyframes skeleton-load{0%{background-position:200% 0}100%{background-position:-200% 0}}

.skeleton-card{background:white;border:1px solid #eee;border-radius:8px;overflow:hidden;margin-bottom:1rem}
body.dark .skeleton-card{background:#1a1a1a;border-color:#333}
.skeleton-img{height:160px;background:linear-gradient(90deg,#f0f0f0 25%,#e0e0e0 50%,#f0f0f0 75%);background-size:200% 100%;animation:skeleton-load 1.4s ease-in-out infinite}
body.dark .skeleton-img{background:linear-gradient(90deg,#1a1a1a 25%,#262626 50%,#1a1a1a 75%);background-size:200% 100%}
.skeleton-body{padding:1rem}
.skeleton-line{height:14px;background:linear-gradient(90deg,#f0f0f0 25%,#e0e0e0 50%,#f0f0f0 75%);background-size:200% 100%;animation:skeleton-load 1.4s ease-in-out infinite;border-radius:4px;margin-bottom:.5rem}
body.dark .skeleton-line{background:linear-gradient(90deg,#262626 25%,#333 50%,#262626 75%);background-size:200% 100%}
.skeleton-line.short{width:60%}
.skeleton-line.title{height:18px;width:90%}

.skeleton-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:1rem}
.skeleton-list-item{display:flex;gap:.75rem;padding:.75rem;background:white;border:1px solid #eee;border-radius:8px;margin-bottom:.5rem}
body.dark .skeleton-list-item{background:#1a1a1a;border-color:#333}
.skeleton-avatar{width:42px;height:42px;border-radius:50%;flex-shrink:0;background:linear-gradient(90deg,#f0f0f0 25%,#e0e0e0 50%,#f0f0f0 75%);background-size:200% 100%;animation:skeleton-load 1.4s ease-in-out infinite}
.skeleton-content{flex:1}

/* ==================== SPONSOR BANNERS (uniformi e responsive) ==================== */
/* Leaderboard (970x90) */
.vf-ad{display:flex;height:90px;background:#fff;text-decoration:none;padding:0 1rem;border-radius:8px;margin:1rem auto;max-width:970px;align-items:center;justify-content:space-between;gap:.75rem;overflow:hidden;border:2px solid #ccc;box-shadow:0 2px 8px rgba(0,0,0,.08);transition:transform .15s ease,box-shadow .15s ease}
.vf-ad:hover{transform:translateY(-1px);box-shadow:0 4px 12px rgba(0,0,0,.12)}
.vf-ad-content{display:flex;align-items:center;gap:1rem;flex:1;min-width:0}
.vf-ad-logo{height:50px;width:auto;flex-shrink:0;object-fit:contain}
.vf-ad-brand{font-family:Playfair Display,serif;font-size:1.4rem;font-weight:900;letter-spacing:-.02em;flex-shrink:0;line-height:1}
.vf-ad-text{text-align:left;min-width:0;overflow:hidden}
.vf-ad-title{font-size:.95rem;font-weight:700;line-height:1.2;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.vf-ad-sub{font-size:.82rem;font-weight:500;margin-top:.15rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.vf-ad-cta{color:white;padding:.55rem 1.2rem;border-radius:24px;font-size:.8rem;font-weight:700;white-space:nowrap;flex-shrink:0;letter-spacing:.02em}

/* Sidebar (300x250-ish, layout verticale) */
.vf-ad.vf-ad-sidebar{flex-direction:column;height:auto;min-height:200px;padding:1.25rem 1rem;align-items:center;justify-content:center;text-align:center;gap:.6rem;max-width:100%;margin:1rem 0}
.vf-ad.vf-ad-sidebar .vf-ad-content{flex-direction:column;gap:.5rem;text-align:center;width:100%}
.vf-ad.vf-ad-sidebar .vf-ad-logo{height:40px}
.vf-ad.vf-ad-sidebar .vf-ad-brand{font-size:1.5rem}
.vf-ad.vf-ad-sidebar .vf-ad-text{text-align:center}
.vf-ad.vf-ad-sidebar .vf-ad-title{white-space:normal;font-size:.95rem;line-height:1.3}
.vf-ad.vf-ad-sidebar .vf-ad-sub{white-space:normal;font-size:.82rem;line-height:1.4;margin-top:.3rem}
.vf-ad.vf-ad-sidebar .vf-ad-cta{margin-top:.4rem;padding:.6rem 1.6rem;font-size:.82rem}

/* Mobile: anche il leaderboard collassa in verticale sotto i 600px */
@media(max-width:600px){
  .vf-ad{flex-direction:column;height:auto;padding:1rem;gap:.6rem;text-align:center;align-items:center}
  .vf-ad-content{flex-direction:column;gap:.5rem;text-align:center}
  .vf-ad-text{text-align:center}
  .vf-ad-title,.vf-ad-sub{white-space:normal}
}

/* Etichetta "ANNUNCIO" piccola in alto a destra */
.vf-ad{position:relative}
.vf-ad::before{content:"ANNUNCIO";position:absolute;top:4px;right:6px;font-size:.55rem;font-weight:600;color:#999;letter-spacing:.08em;opacity:.7;pointer-events:none}

/* Dark mode */
body.dark .vf-ad{background:#1a1a1a;border-color:#444;box-shadow:0 2px 8px rgba(0,0,0,.4)}
body.dark .vf-ad::before{color:#666}

/* === A11Y FIX: WCAG AA contrast 4.5:1 on card meta/stats === */
.card-meta, .card-stats {
  color: #5e5e5e !important;
}
.card-meta span, .card-stats span {
  color: #5e5e5e !important;
}

/* === CLS FIX: stabilize layout shifts === */
.article-cover {
  aspect-ratio: 16/9;
  object-fit: cover;
  background: #f5f5f5;
}
.card-img img {
  aspect-ratio: 16/9;
  object-fit: cover;
}

/* === CLS FIX: reserve space for dynamic sidebar boxes === */
.article-layout aside.sidebar,
main .sidebar {
  min-height: 800px;
}
@media(max-width:768px){
  .article-layout aside.sidebar,
  main .sidebar { min-height: 200px; }
}
.sidebar-box { min-height: 80px; }
#sidebarVideosList,
#topArticlesList { min-height: 300px; }
#vfAnnouncement { min-height: 0; }

/* === CLS FIX: cookie banner overlay (no layout shift) === */
#cookieBanner {
  position: fixed !important;
  bottom: 0;
  left: 0;
  right: 0;
  z-index: 9999;
  box-shadow: 0 -4px 16px rgba(0,0,0,0.15);
}

/* === CLS FIX V2: page-level placeholder height === */
.article-page {
  min-height: calc(100vh - 200px);
}

/* === MOBILE FIX: tabelle responsive su mobile === */
@media(max-width:768px){
  table.cookie-table,
  table.lb-table,
  table.standings-table {
    display: block;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    max-width: 100%;
    white-space: nowrap;
  }
  table.cookie-table th,
  table.cookie-table td {
    white-space: normal;
    min-width: 100px;
  }
}

/* === MOBILE UX: touch-friendly improvements === */
@media(max-width:768px){
  /* Bottoni minimum tappable - ma solo per quelli che hanno spazio */
  .btn, button.btn, a.btn,
  .btn-primary, .btn-outline {
    min-height: 44px;
    min-width: 44px;
    padding: .65rem 1rem;
  }
  /* Form input più alti per dito */
  input[type="text"], input[type="email"], input[type="password"],
  input[type="search"], input[type="tel"], input[type="url"],
  input[type="number"], select, textarea {
    min-height: 44px;
    font-size: 16px !important; /* impedisce zoom su iOS al focus */
  }
  /* Migliora tap su link in liste */
  .sidebar-list a, .sb-item, .card a {
    padding-top: .35rem;
    padding-bottom: .35rem;
  }
  /* Smooth scroll quando si tappa un anchor */
  html { scroll-behavior: smooth; }
  /* Prevenire selezione testo accidentale durante swipe */
  .nav, .header, .footer-nav {
    -webkit-user-select: none;
    user-select: none;
  }
  /* Tap highlight elegante (era brutto blu di default) */
  a, button {
    -webkit-tap-highlight-color: rgba(220,0,0,.15);
  }
}
/* Sempre, evita overflow orizzontale anche per bug futuri */
html, body { overflow-x: hidden; max-width: 100vw; }
img, video, iframe { max-width: 100%; }

/* =====================================================================
   === REDESIGN HOMEPAGE - Magazine Premium look (v1)                ===
   === Added: 2026-05-08 - Massimiliano (purely additive, no breakage)
   === Override only: hero, section headers, cards, body bg
   === All rules scoped to avoid touching admin pages or forms
   ===================================================================== */

/* --- Body & general feel --- */
body {
  background: #fafafa;
  background-image:
    radial-gradient(circle at 20% 10%, rgba(220,0,0,0.025) 0%, transparent 50%),
    radial-gradient(circle at 80% 80%, rgba(254,220,40,0.018) 0%, transparent 60%);
}
.dark body, body.dark {
  background-color: #0a0a0a;
  background-image:
    radial-gradient(circle at 20% 10%, rgba(220,0,0,0.05) 0%, transparent 50%),
    radial-gradient(circle at 80% 80%, rgba(254,220,40,0.03) 0%, transparent 60%);
}

/* --- HERO refresh: more cinematic, more "magazine" --- */
.hero {
  height: 78vh !important;
  min-height: 560px !important;
  background: #060606;
}
.hero::before {
  content: "";
  position: absolute;
  inset: 0;
  background:
    repeating-linear-gradient(
      90deg,
      transparent,
      transparent 60px,
      rgba(220,0,0,0.04) 60px,
      rgba(220,0,0,0.04) 61px
    );
  pointer-events: none;
  z-index: 1;
}
.hero-bg {
  filter: brightness(0.62) saturate(1.18) contrast(1.05);
  transform: scale(1.04);
  transition: transform 8s ease-out;
}
.hero:hover .hero-bg { transform: scale(1.0); }
.hero-overlay {
  background: linear-gradient(
    to top,
    rgba(0,0,0,0.95) 0%,
    rgba(0,0,0,0.55) 35%,
    rgba(0,0,0,0.15) 70%,
    transparent 100%
  ) !important;
}
.hero-content {
  padding: 4rem 1.5rem 5rem !important;
  position: relative;
}
.hero-content::before {
  content: "";
  position: absolute;
  left: 1.5rem;
  top: 4rem;
  width: 4px;
  height: 50px;
  background: linear-gradient(to bottom, #DC0000 0%, #FEDC28 100%);
}
@media(min-width:769px){
  .hero-content { padding-left: 3rem !important; }
  .hero-content::before { left: 1.5rem; }
}
.hero-label {
  background: #DC0000 !important;
  font-weight: 700 !important;
  letter-spacing: 0.18em !important;
  font-size: .72rem !important;
  padding: .45rem 1rem !important;
  position: relative;
  box-shadow: 0 4px 16px rgba(220,0,0,0.4);
}
.hero-label::after {
  content: "";
  position: absolute;
  right: -8px;
  top: 0;
  bottom: 0;
  width: 12px;
  background: #DC0000;
  clip-path: polygon(0 0, 100% 50%, 0 100%);
  box-shadow: 0 4px 16px rgba(220,0,0,0.4);
}
.hero-title {
  font-size: clamp(2.2rem, 5.5vw, 4.2rem) !important;
  font-weight: 900 !important;
  line-height: 1.05 !important;
  letter-spacing: -0.015em;
  text-shadow: 0 2px 24px rgba(0,0,0,0.5);
  margin-bottom: 1.25rem !important;
}
.hero-title a {
  background-image: linear-gradient(120deg, transparent 0%, transparent 100%);
  background-position: 0 100%;
  background-repeat: no-repeat;
  background-size: 100% 3px;
  transition: background-size .4s ease;
}
.hero-title a:hover {
  background-image: linear-gradient(120deg, #DC0000 0%, #FEDC28 100%);
}
.hero-excerpt {
  color: rgba(255,255,255,0.85) !important;
  font-size: 1.18rem !important;
  font-weight: 300;
  letter-spacing: 0.005em;
  max-width: 620px !important;
}
.hero-meta {
  font-size: .82rem !important;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  color: rgba(255,255,255,0.7) !important;
}
.hero-meta span:first-child::before {
  content: "BY ";
  color: #DC0000;
  font-weight: 700;
}

/* --- SECTION HEADERS magazine style --- */
.section-header {
  display: flex !important;
  align-items: baseline;
  justify-content: space-between;
  margin: 3.5rem 0 1.75rem !important;
  padding-bottom: .9rem;
  border-bottom: 2px solid #0a0a0a;
  position: relative;
}
.section-header::after {
  content: "";
  position: absolute;
  bottom: -2px;
  left: 0;
  width: 80px;
  height: 4px;
  background: #DC0000;
}
.section-title {
  font-size: clamp(1.4rem, 2.5vw, 2rem) !important;
  font-weight: 900 !important;
  letter-spacing: -0.01em !important;
  text-transform: none;
  position: relative;
  padding-left: 0;
}
.section-link {
  font-family: 'Inter', sans-serif;
  font-size: .82rem !important;
  font-weight: 600 !important;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  color: #DC0000 !important;
  text-decoration: none;
  transition: gap .25s ease;
  display: inline-flex;
  align-items: center;
  gap: .25rem;
}
.section-link:hover {
  gap: .55rem;
  color: #9B0000 !important;
}

/* --- CARDS refresh: better hover, more magazine feel --- */
.card {
  background: #fff;
  border-radius: 8px !important;
  border: 1px solid #ececec !important;
  overflow: hidden;
  transition: transform .35s cubic-bezier(.4,0,.2,1), box-shadow .35s ease, border-color .25s ease;
  position: relative;
}
.card::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  height: 3px;
  background: linear-gradient(90deg, #DC0000 0%, #DC0000 100%);
  transform: scaleX(0);
  transform-origin: left;
  transition: transform .35s ease;
  z-index: 2;
}
.card:hover {
  transform: translateY(-4px);
  box-shadow: 0 14px 32px rgba(220,0,0,0.12), 0 4px 8px rgba(0,0,0,0.06) !important;
  border-color: rgba(220,0,0,0.2) !important;
}
.card:hover::before { transform: scaleX(1); }
.card-img {
  position: relative;
  overflow: hidden;
}
.card-img img {
  transition: transform .6s cubic-bezier(.4,0,.2,1);
  display: block;
  width: 100%;
}
.card:hover .card-img img {
  transform: scale(1.06);
}
.card-cat {
  background: #DC0000 !important;
  font-weight: 700 !important;
  letter-spacing: 0.12em !important;
  font-size: .68rem !important;
  padding: .35rem .75rem !important;
  box-shadow: 0 2px 10px rgba(220,0,0,0.4);
}
.card-title {
  font-family: 'Playfair Display', Georgia, serif !important;
  line-height: 1.3 !important;
  letter-spacing: -0.005em;
  transition: color .2s ease;
}
.card:hover .card-title { color: #DC0000; }

/* --- FEATURED card slightly different --- */
.card-featured {
  /* lasciato come da JS, no override invasive */
}
.featured-row .card:first-child {
  /* il primo della riga "featured" può essere più grande in desktop */
}

/* --- HEADER più premium: logo respira --- */
.header {
  backdrop-filter: blur(10px);
  background: rgba(10,10,10,0.96) !important;
}
.logo-text {
  font-size: 1.7rem !important;
  letter-spacing: 0.04em !important;
  position: relative;
}
.logo-text::after {
  content: ".it";
  color: #DC0000;
  font-weight: 700;
  font-size: 0.55em;
  position: relative;
  top: -.4em;
  margin-left: 0.1em;
  display: none; /* lo nascondiamo, c'è già lo span del file logo */
}

/* --- Section dividers between content blocks --- */
.content > .section-header + * {
  animation: fadeInUp .5s ease both;
}
@keyframes fadeInUp {
  from { opacity: 0; transform: translateY(12px); }
  to { opacity: 1; transform: translateY(0); }
}

/* --- Newsletter section refresh --- */
.newsletter {
  background:
    linear-gradient(135deg, #0a0a0a 0%, #1a0000 50%, #2d0000 100%) !important;
  position: relative;
  overflow: hidden;
}
.newsletter::before {
  content: "";
  position: absolute;
  top: -50%;
  right: -20%;
  width: 400px;
  height: 400px;
  background: radial-gradient(circle, rgba(220,0,0,0.15) 0%, transparent 70%);
  pointer-events: none;
}
.newsletter::after {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  height: 4px;
  background: linear-gradient(90deg, #DC0000 0%, #FEDC28 50%, #DC0000 100%);
}
.newsletter h2 {
  position: relative;
  z-index: 2;
}

/* --- "Strumenti Ferrari" tile cards uniformity --- */
.content > div[style*="grid-template-columns:repeat(auto-fill,minmax(220px,1fr))"] > a {
  position: relative;
  overflow: hidden;
  transition: transform .3s ease, box-shadow .3s ease !important;
}
.content > div[style*="grid-template-columns:repeat(auto-fill,minmax(220px,1fr))"] > a:hover {
  transform: translateY(-3px);
  box-shadow: 0 10px 30px rgba(0,0,0,0.18);
}

/* --- Mobile tweaks for redesign --- */
@media(max-width:768px){
  .hero {
    height: 65vh !important;
    min-height: 480px !important;
  }
  .hero-content { padding: 2.5rem 1.25rem 3rem !important; }
  .hero-content::before { display: none; } /* riservo spazio mobile */
  .hero-title {
    font-size: 2rem !important;
    line-height: 1.1 !important;
  }
  .hero-excerpt { font-size: 1rem !important; }
  .section-header {
    margin: 2.5rem 0 1.25rem !important;
  }
  .section-title { font-size: 1.4rem !important; }
}

/* === END REDESIGN HOMEPAGE v1 === */

/* === MOBILE FIX redesign v1.1 === */
@media(max-width:768px){
  /* Nascondi floating dark mode button (c'è già nel header) */
  #vfDmToggle { display: none !important; }
  /* Bottoni Accedi/Registrati nel header devono restare visibili o essere accorpati */
  #loginBtn, #registerBtn {
    padding: .45rem .75rem !important;
    font-size: .8rem !important;
    min-height: auto !important;
    min-width: auto !important;
  }
  #registerBtn { display: none; } /* solo Accedi su mobile, c'è anche "Registrati" dentro la pagina login */
  /* Logo più compatto su mobile */
  .logo-text { font-size: 1.3rem !important; }
}
@media(max-width:380px){
  #loginBtn { padding: .4rem .6rem !important; font-size: .75rem !important; }
}
/* === END MOBILE FIX redesign v1.1 === */



/* ═══════════════════════════════════════════════════════════════
 * VIDEOFERRARI - PATCH PULITA (sessione N - clean)
 * Ripartiamo da style.css originale (45KB) + SOLO i fix necessari.
 * Selettori SPECIFICI per non rompere altre sidebar.
 * ═══════════════════════════════════════════════════════════════ */

/* === HEADER UNIFORME === */
.header {
  position: fixed !important;
  top: 0; left: 0; right: 0;
  height: 70px !important;
  background: #0A0A0A !important;
  z-index: 1000 !important;
  border-bottom: 3px solid #DC0000 !important;
}
.header-inner {
  max-width: 1280px !important;
  margin: 0 auto !important;
  padding: 0 1.25rem !important;
  height: 100% !important;
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 1rem !important;
  flex-wrap: nowrap !important;
}
.logo { flex-shrink: 0 !important; text-decoration: none !important; }
.logo-text {
  font-family: 'Playfair Display', serif !important;
  font-size: 1.4rem !important;
  font-weight: 900 !important;
  color: white !important;
  letter-spacing: .02em !important;
  white-space: nowrap !important;
}
/* Restoro il rosso FERRARI sul logo */
.logo-text > span { color: #DC0000 !important; }

/* === NAV: 7 voci primarie + dropdown "Più" === */
.nav {
  display: flex !important;
  align-items: center !important;
  gap: 0 !important;
  flex: 1 !important;
  justify-content: center !important;
  flex-wrap: nowrap !important;
  overflow: visible !important;
}
.nav a, .nav .nav-more-btn {
  white-space: nowrap !important;
  color: #d1d5db !important;
  font-size: .82rem !important;
  font-weight: 500 !important;
  padding: .55rem .8rem !important;
  letter-spacing: .03em !important;
  text-transform: uppercase !important;
  transition: all .15s !important;
  border-bottom: 2px solid transparent !important;
  text-decoration: none !important;
  background: none !important;
  border-left: none !important;
  border-right: none !important;
  border-top: none !important;
  cursor: pointer !important;
  font-family: inherit !important;
}
.nav a:hover, .nav a.active, .nav .nav-more-btn:hover {
  color: white !important;
  border-bottom-color: #DC0000 !important;
}
.nav a.nav-special { color: #FEDC28 !important; }
.nav a.nav-special:hover { color: white !important; }

/* "Più" dropdown */
.nav-more { position: relative; }
.nav-more-list {
  display: none;
  position: absolute;
  top: 100%; right: 0;
  background: #0A0A0A;
  border: 1px solid #2a2a2a;
  border-top: 3px solid #DC0000;
  min-width: 220px;
  padding: .5rem 0;
  box-shadow: 0 8px 24px rgba(0,0,0,.4);
  z-index: 1001;
  border-radius: 0 0 8px 8px;
}
.nav-more.open .nav-more-list { display: block !important; }
.nav-more-list a {
  display: block !important;
  padding: .55rem 1rem !important;
  border-bottom: none !important;
  text-transform: none !important;
  font-size: .85rem !important;
  letter-spacing: 0 !important;
  color: #d1d5db !important;
}
.nav-more-list a:hover {
  background: rgba(220,0,0,.15) !important;
  color: white !important;
}

.header-actions {
  display: flex !important;
  align-items: center !important;
  gap: .5rem !important;
  flex-shrink: 0 !important;
}
.header-actions #vfHeaderSearch {
  display: inline-flex !important;
  align-items: center !important; justify-content: center !important;
  width: 32px !important; height: 32px !important;
  border-radius: 50% !important;
  border: 1px solid #555 !important;
}
.header-actions #vfHeaderSearch:hover,
.header-actions #vfHeaderDM:hover {
  background: rgba(220,0,0,.15) !important;
  border-color: #DC0000 !important;
}

.menu-toggle {
  display: none !important;
  background: none !important; border: none !important;
  color: white !important; font-size: 1.6rem !important;
  cursor: pointer !important;
  padding: .25rem .5rem !important;
}

/* Mobile: hamburger sotto 1100px */
@media (max-width: 1099px) {
  .nav { display: none !important; }
  .menu-toggle { display: block !important; }
  .header-actions #vfHeaderSearch,
  .header-actions #vfHeaderDM { display: none !important; }
  .header-actions .vf-login-btn,
  .header-actions .vf-profile-link {
    padding: .35rem .6rem !important;
    font-size: .72rem !important;
  }
}

/* Nav mobile fullscreen */
.nav-mobile {
  display: none;
  position: fixed; inset: 0;
  background: rgba(10,10,10,.97);
  z-index: 9998;
  flex-direction: column;
  align-items: stretch;
  justify-content: flex-start;
  padding: 4rem 1rem 2rem;
  overflow-y: auto;
}
.nav-mobile.open { display: flex !important; }
.nav-mobile a {
  display: block !important;
  color: white !important;
  font-size: 1.05rem !important;
  font-weight: 500 !important;
  text-transform: uppercase !important;
  letter-spacing: .06em !important;
  padding: .9rem 1rem !important;
  border-bottom: 1px solid #1f1f1f !important;
  text-decoration: none !important;
}
.nav-mobile a:hover { background: rgba(220,0,0,.15); color: #FEDC28 !important; }
.nav-mobile h4 {
  color: #6b7280;
  font-size: .68rem;
  text-transform: uppercase;
  letter-spacing: .1em;
  padding: .85rem 1rem .35rem;
  margin: 0;
  font-weight: 700;
}
.nav-mobile .close-btn {
  position: absolute !important;
  top: 1.25rem !important; right: 1.25rem !important;
  background: none !important; border: none !important;
  color: white !important; font-size: 2rem !important;
  cursor: pointer !important;
  z-index: 9999;
  padding: 0 .5rem;
}

/* === ANTI-FLICKER: nasconde nav originale finché JS non riscrive === */
html:not(.vf-nav-ready) .header-inner > .nav,
html:not(.vf-nav-ready) .header-inner > nav.nav,
html:not(.vf-nav-ready) .header-inner > .header-actions {
  visibility: hidden !important;
}
html.vf-nav-ready .header-inner > .nav,
html.vf-nav-ready .header-inner > .header-actions {
  visibility: visible;
}

/* === STICKY SIDEBAR SOLO PER ARTICOLI ===
 * Selettore SPECIFICO: .article-layout > aside.sidebar
 * NON tocca .sidebar generica (homepage, sezioni)
 */
.article-layout {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) 320px !important;
  gap: 2rem !important;
  align-items: start !important;
  max-width: 1280px !important;
  margin: 0 auto !important;
  padding: 1.5rem 1.25rem !important;
}
.article-layout > article {
  grid-column: 1 !important;
  min-width: 0 !important;
}
.article-layout > aside.sidebar {
  grid-column: 2 !important;
  position: sticky !important;
  top: 88px !important;
  align-self: start !important;
  display: flex !important;
  flex-direction: column !important;
  gap: 1rem !important;
  min-height: 0 !important;
  max-height: none !important;
  overflow: visible !important;
}
@media (max-width: 900px) {
  .article-layout {
    grid-template-columns: 1fr !important;
  }
  .article-layout > aside.sidebar {
    grid-column: 1 !important;
    position: static !important;
  }
}

/* Fix overflow body per non rompere sticky */
html, body {
  overflow-x: clip !important;
}

/* === BANNER: niente duplicati consecutivi === */
.vf-ad + .vf-ad,
.vf-ad-sidebar + .vf-ad-sidebar {
  display: none !important;
}
