/* === Design system premium — Francesco Gizzi === */
:root{--paper:#fdfcfa;--panel:#f6f3ec;--card:#ffffff;--ink:#16181c;--muted:#56606a;--faint:#7b8088;--line:#ece8df;--line-strong:#ddd6c8;--gold:#d8b86a;--cta:#16181c;--cta-ink:#f8f4e9;--p1:#eef0f4;--p2:#f7f5ef;--chip:#f4f1ea;--chip-border:#e7e2d6;--chip-ink:#3a3d42;}
*{box-sizing:border-box}
body{margin:0;background:var(--paper);font-family:'Hanken Grotesk',sans-serif;color:var(--muted);-webkit-font-smoothing:antialiased}
h1,h2,h3{font-family:'Newsreader',serif;font-weight:500;color:var(--ink);margin:0}
a{color:inherit}
img{max-width:100%}
input,select,textarea,button{font-family:inherit}
::placeholder{color:var(--faint)}
button{cursor:pointer}
a[href]:hover{opacity:.86}
@media (max-width:820px){
  [style*="grid-template-columns"]{grid-template-columns:1fr !important;}
  [style*="space-between"]{gap:14px !important;}
  header > div{flex-direction:column !important;align-items:flex-start !important;}
  header nav{flex-wrap:wrap !important;gap:10px 16px !important;font-size:13px !important;}
  section > div, header > div, footer > div{padding-left:22px !important;padding-right:22px !important;}
  section > div{padding-top:46px !important;padding-bottom:46px !important;}
  h1{font-size:32px !important;line-height:1.14 !important;}
  h2{font-size:25px !important;line-height:1.22 !important;}
}

/* === Articoli blog === */
.article-wrap{max-width:768px;margin:0 auto;padding:54px 40px 86px}
.article-wrap .eyebrow{font:600 11px 'Hanken Grotesk',sans-serif;letter-spacing:.28em;text-transform:uppercase;color:var(--gold);margin:0 0 18px}
.article-wrap h1{font-size:46px;line-height:1.07;letter-spacing:-.02em;margin:0 0 16px}
.article-wrap .reading-meta{color:var(--faint);font-size:13px;margin:0 0 8px;font-family:'Hanken Grotesk',sans-serif}
.article-wrap .gold-rule{height:1px;background:linear-gradient(90deg,var(--gold),transparent);max-width:420px;margin:26px 0 30px}
.article-wrap h2{font-size:29px;line-height:1.2;letter-spacing:-.01em;margin:44px 0 16px}
.article-wrap h3{font-size:20px;line-height:1.3;margin:30px 0 10px;color:var(--ink);font-weight:600}
.article-wrap p{font-size:17.5px;line-height:1.72;color:var(--muted);margin:0 0 20px}
.article-wrap ul{font-size:17.5px;line-height:1.7;color:var(--muted);padding-left:22px;margin:0 0 20px}
.article-wrap li{margin:7px 0}
.article-wrap a{color:var(--ink);border-bottom:1px solid var(--gold);text-decoration:none}
.article-wrap strong{color:var(--ink);font-weight:600}
.article-wrap .callout-box{display:block;background:var(--panel);border:1px solid var(--line);border-left:3px solid var(--gold);border-radius:12px;padding:20px 24px;margin:30px 0;color:var(--ink);font-size:16.5px}
.article-wrap .vertical-cta{background:var(--panel);border:1px solid var(--line);border-radius:12px;padding:18px 22px;color:var(--ink)}
.article-cta{background:var(--ink)}
.article-cta .inner{max-width:1200px;margin:0 auto;padding:64px 40px;display:flex;align-items:center;justify-content:space-between;gap:32px;flex-wrap:wrap}
.article-cta h2{margin:0;font:500 30px/1.2 'Newsreader',serif;color:#f8f4e9;max-width:560px}
.article-cta a{background:var(--gold);color:#1a1305;font:600 15px 'Hanken Grotesk',sans-serif;padding:15px 30px;border-radius:8px;text-decoration:none;white-space:nowrap}
@media(max-width:820px){.article-wrap{padding:34px 22px 60px}.article-wrap h1{font-size:32px}.article-wrap h2{font-size:24px}}

/* === Brand marquee animato === */
.brand-marquee{overflow-x:auto;overflow-y:hidden;position:relative;margin-top:4px;cursor:grab;scrollbar-width:none;touch-action:pan-x;-webkit-overflow-scrolling:touch;-webkit-mask-image:linear-gradient(90deg,transparent,#000 6%,#000 94%,transparent);mask-image:linear-gradient(90deg,transparent,#000 6%,#000 94%,transparent)}
.brand-marquee::-webkit-scrollbar{display:none}
.brand-track{display:flex;gap:14px;width:max-content}
@keyframes brand-scroll{from{transform:translateX(0)}to{transform:translateX(-50%)}}
.brand-chip{display:flex;align-items:center;gap:10px;background:var(--card);border:1px solid var(--line);border-radius:11px;padding:12px 16px;text-decoration:none;white-space:nowrap;flex:0 0 auto}
.brand-chip img{width:26px;height:26px;border-radius:6px;object-fit:contain;background:#fff;border:1px solid var(--chip-border);flex:none}
.brand-chip span{font:500 13px 'Hanken Grotesk',sans-serif;color:var(--ink)}

/* === Cookie banner (palette premium) === */
#cookie-banner{position:fixed;top:0;left:0;right:0;z-index:9999;background:var(--ink);border-bottom:1px solid rgba(255,255,255,.12);padding:16px 28px;display:flex;gap:16px;align-items:center;flex-wrap:wrap;transform:translateY(-100%);transition:transform .45s cubic-bezier(.25,1,.4,1)}
#cookie-banner.show{transform:translateY(0)}
#cookie-banner p{margin:0;font:400 14px/1.5 'Hanken Grotesk',sans-serif;color:#aeb2ba;flex:1;min-width:220px}
#cookie-banner a{color:#f8f4e9}
.cookie-actions{display:flex;align-items:center;gap:16px;flex-shrink:0}
.cookie-accept{padding:10px 22px;border-radius:8px;font:600 14px 'Hanken Grotesk',sans-serif;cursor:pointer;border:none;background:var(--gold);color:#1a1305;transition:opacity .15s}
.cookie-accept:hover{opacity:.9}
.cookie-reject{background:none;border:none;font-size:13px;color:rgba(255,255,255,.45);cursor:pointer;padding:4px;text-decoration:underline}
.cookie-reject:hover{color:rgba(255,255,255,.75)}
@media(max-width:640px){#cookie-banner{flex-direction:column;padding:16px 18px;gap:10px}.cookie-actions{width:100%;flex-direction:column;gap:8px}.cookie-accept{width:100%;text-align:center;padding:13px}}

/* === Mobile: ritratto ridotto + stats centrate === */
@media(max-width:820px){
  .hero-photo-box{width:62% !important;max-width:62% !important;min-height:0 !important;aspect-ratio:1/1.05 !important;margin:0 auto}
  .home-stats > div{text-align:center;padding-left:6px !important;padding-right:6px !important}
  .home-stats > div:last-child{border-right:none}
}

/* === Sector marquee === */
.sector-marquee{overflow-x:auto;overflow-y:hidden;position:relative;margin-bottom:26px;cursor:grab;scrollbar-width:none;touch-action:pan-x;-webkit-overflow-scrolling:touch;-webkit-mask-image:linear-gradient(90deg,transparent,#000 6%,#000 94%,transparent);mask-image:linear-gradient(90deg,transparent,#000 6%,#000 94%,transparent)}
.sector-marquee::-webkit-scrollbar{display:none}
.sector-track{display:flex;gap:9px;width:max-content}
.sector-chip{border:1px solid var(--line-strong);border-radius:999px;padding:8px 16px;font:400 13px 'Hanken Grotesk',sans-serif;color:var(--muted);white-space:nowrap;flex:0 0 auto}

/* === Cover articoli === */
.article-cover{width:100%;aspect-ratio:16/10;object-fit:cover;border:1px solid var(--line);border-radius:14px;margin-bottom:30px;display:block}
.home-card-cover{width:100%;aspect-ratio:16/10;object-fit:cover;border:1px solid var(--line);border-radius:10px;margin-bottom:16px;display:block}

/* === Blog filtri categoria === */
.blog-chip{border:1px solid var(--line-strong);background:transparent;border-radius:999px;padding:8px 16px;font:400 13px 'Hanken Grotesk',sans-serif;color:var(--muted);cursor:pointer;transition:border-color .15s,color .15s,background .15s;}
.blog-chip:hover{border-color:var(--gold);color:var(--ink);}
.blog-chip.active{background:var(--ink);color:var(--paper);border-color:var(--ink);font-weight:500;}

/* === Animazioni & micro-interazioni === */
html{scroll-behavior:auto}
[id]{scroll-margin-top:82px}
body > header{position:sticky;top:0;z-index:100;background:var(--paper);transition:box-shadow .3s ease}
body > header.scrolled{box-shadow:0 1px 0 var(--line),0 12px 30px -24px rgba(20,18,12,.4)}
.scroll-progress{position:fixed;top:0;left:0;height:3px;width:0;background:linear-gradient(90deg,#e3c777,var(--gold));z-index:9998;pointer-events:none;transition:width .1s linear}
.nav-toggle{display:none;background:none;border:none}
@media (prefers-reduced-motion: no-preference){
  html{scroll-behavior:smooth}
  .reveal-init{opacity:0;transform:translateY(26px)}
  .reveal-in{opacity:1;transform:none;transition:opacity .55s cubic-bezier(.22,1,.36,1),transform .55s cubic-bezier(.22,1,.36,1)}
  .lift{transition:transform .28s cubic-bezier(.22,1,.36,1),box-shadow .28s cubic-bezier(.22,1,.36,1)}
  .lift:hover{transform:translateY(-4px);opacity:1;box-shadow:0 22px 46px -26px rgba(20,18,12,.34)}
  a[style*="var(--cta)"],a[style*="background:var(--gold)"]{transition:transform .22s ease,box-shadow .22s ease,opacity .2s}
  a[style*="var(--cta)"]:hover,a[style*="background:var(--gold)"]:hover{transform:translateY(-2px);opacity:1;box-shadow:0 14px 30px -14px rgba(160,125,40,.75)}
}
/* === Menu mobile a scomparsa === */
@media(max-width:820px){
  html.js-nav .site-header > div{flex-direction:row !important;align-items:center !important;gap:16px !important}
  html.js-nav .site-header .nav-toggle{display:inline-flex;flex-direction:column;justify-content:center;gap:5px;width:44px;height:44px;padding:0 11px;border:1px solid var(--line-strong);border-radius:10px;background:var(--card);cursor:pointer;flex:none}
  html.js-nav .site-header .nav-toggle span{display:block;height:2px;width:100%;background:var(--ink);border-radius:2px;transition:transform .3s ease,opacity .2s ease}
  html.js-nav .site-header.nav-open .nav-toggle span:nth-child(1){transform:translateY(7px) rotate(45deg)}
  html.js-nav .site-header.nav-open .nav-toggle span:nth-child(2){opacity:0}
  html.js-nav .site-header.nav-open .nav-toggle span:nth-child(3){transform:translateY(-7px) rotate(-45deg)}
  html.js-nav .site-header .site-nav{position:fixed;top:0;right:0;height:100dvh;width:min(82vw,320px);background:var(--paper);flex-direction:column !important;align-items:flex-start !important;justify-content:flex-start !important;gap:2px !important;padding:92px 30px 30px !important;transform:translateX(106%);transition:none;box-shadow:-24px 0 60px -34px rgba(0,0,0,.55);z-index:200;overflow-y:auto;font-size:17px !important}
  html.nav-ready .site-header .site-nav{transition:transform .42s cubic-bezier(.22,1,.36,1)}
  html.js-nav .site-header.nav-open .site-nav{transform:translateX(0)}
  html.js-nav .site-header .site-nav a{width:100%;padding:15px 0 !important;border-bottom:1px solid var(--line);border-radius:0 !important;color:var(--ink) !important}
  html.js-nav .site-header .site-nav a[style*="var(--gold)"]{border:1px solid var(--gold) !important;border-radius:8px !important;padding:13px 18px !important;margin-top:14px;text-align:center}
  html.js-nav .nav-backdrop{position:fixed;inset:0;background:rgba(18,16,12,.42);opacity:0;visibility:hidden;transition:opacity .3s ease;z-index:150}
  html.js-nav .site-header.nav-open .nav-backdrop{opacity:1;visibility:visible}
}

/* === Effetti extra: parole oro che si illuminano + underline nav === */
@media (prefers-reduced-motion: no-preference){
  h1 em[style*="var(--gold)"], h2 em[style*="var(--gold)"]{
    animation: goldGlow 5s ease-in-out infinite;
    transition: text-shadow .3s ease;
  }
  @keyframes goldGlow{
    0%,100%{ text-shadow: 0 0 0 rgba(216,184,106,0); }
    50%{ text-shadow: 0 0 16px rgba(216,184,106,.4); }
  }
  h1 em[style*="var(--gold)"]:hover, h2 em[style*="var(--gold)"]:hover{
    text-shadow: 0 0 22px rgba(216,184,106,.6);
  }
}
@media (min-width:821px){
  .site-header nav a:not([style*="border:1px"]){ position:relative; }
  .site-header nav a:not([style*="border:1px"])::after{
    content:""; position:absolute; left:0; bottom:-5px; height:1.5px; width:0;
    background:var(--gold); transition:width .28s cubic-bezier(.22,1,.36,1);
  }
  .site-header nav a:not([style*="border:1px"]):hover::after{ width:100%; }
  .site-header nav a:hover{ opacity:1; }
}

/* === Effetti avanzati (aggiungi tutto) === */
@media (prefers-reduced-motion: no-preference){
  body{animation:pageIn .45s ease}
  @keyframes pageIn{from{opacity:0}to{opacity:1}}
  body.page-out{opacity:0;transition:opacity .17s ease}
  .word{display:inline-block;will-change:transform,opacity}
  .fx-bg{position:fixed;inset:0;overflow:hidden;pointer-events:none;z-index:-1}
  .fx-blob{position:absolute;border-radius:50%;filter:blur(72px)}
  .fx-blob.b1{top:-6%;left:-4%;width:44vw;max-width:520px;height:44vw;max-height:520px;background:radial-gradient(circle,rgba(216,184,106,.5),transparent 70%);animation:drift1 36s ease-in-out infinite}
  .fx-blob.b2{bottom:-8%;right:-6%;width:40vw;max-width:460px;height:40vw;max-height:460px;background:radial-gradient(circle,rgba(232,212,152,.42),transparent 70%);animation:drift2 46s ease-in-out infinite}
  @keyframes drift1{0%,100%{transform:translate(-8%,-6%) scale(1)}50%{transform:translate(16%,12%) scale(1.08)}}
  @keyframes drift2{0%,100%{transform:translate(8%,10%) scale(1)}50%{transform:translate(-10%,-8%) scale(1.1)}}
  .cursor-glow{position:fixed;top:0;left:0;width:520px;height:520px;margin:-260px 0 0 -260px;border-radius:50%;background:radial-gradient(circle,rgba(216,184,106,.10),transparent 62%);pointer-events:none;z-index:1;opacity:0;transition:opacity .35s ease;will-change:transform}
  .cursor-glow.on{opacity:1}
  .tilt{transition:transform .2s cubic-bezier(.22,1,.36,1),box-shadow .28s ease}
  a[style*="var(--cta)"],a[style*="background:var(--gold)"]{position:relative;overflow:hidden}
  a[style*="var(--cta)"]::after,a[style*="background:var(--gold)"]::after{content:"";position:absolute;top:0;left:-70%;width:46%;height:100%;background:linear-gradient(100deg,transparent,rgba(255,255,255,.42),transparent);transform:skewX(-18deg);pointer-events:none}
  a[style*="var(--cta)"]:hover::after,a[style*="background:var(--gold)"]:hover::after{animation:shine .75s ease}
  @keyframes shine{from{left:-70%}to{left:170%}}
}