/* ============================================================
   Not a Number - notanumber.it
   Palette: #E3F77E (lime) - #4777A0 (blu) - #DEAEBE (rosa)
   ============================================================ */
:root{
  --lime:#E3F77E;
  --blue:#4777A0;
  --pink:#DEAEBE;
  --blue-deep:#2f566f;
  --ink:#0d1620;
  --ink-soft:#13202c;
  --ink-blue:#16293a;     /* sezioni a tinta blu */
  --ink-pink:#241a20;     /* sezioni a tinta rosa */
  --paper:#f7f9f4;
  --radius:18px;
  --maxw:1120px;
  --deadbeef:#DEADBE;
  --ease:cubic-bezier(.34,.08,.24,1);
}
/* embed Spotify: larghezza max = copertina */
.spotify-embed{width:100%;max-width:100%;border-radius:12px;display:block;border:0;overflow-anchor:none}
*{box-sizing:border-box;margin:0;padding:0}
/* scrollbar personalizzate */
html{scrollbar-width:thin;scrollbar-color:var(--blue) transparent}
::-webkit-scrollbar{width:11px;height:11px}
::-webkit-scrollbar-track{background:rgba(13,22,32,.6)}
::-webkit-scrollbar-thumb{
  background:linear-gradient(180deg,var(--blue),var(--blue-deep));
  border-radius:999px;border:2px solid rgba(13,22,32,.6)}
::-webkit-scrollbar-thumb:hover{background:linear-gradient(180deg,var(--lime),var(--blue))}
::-webkit-scrollbar-corner{background:transparent}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{
  font-family:'Inter',-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;
  color:var(--paper);background:var(--ink);line-height:1.65;overflow-x:hidden;-webkit-font-smoothing:antialiased;
}
h1,h2,h3{font-family:'Rationale',Georgia,"Times New Roman",serif;line-height:1.14;font-weight:700;letter-spacing:.01em}
a{color:var(--lime);text-decoration:none;transition:opacity .2s,color .2s}
a:hover{opacity:.8}
img{max-width:100%}
.wrap{max-width:var(--maxw);margin:0 auto;padding:0 22px}
section{padding:92px 0;position:relative;overflow:hidden}
.sec-bg{position:absolute;inset:0;z-index:0;pointer-events:none}
.sec-inner{position:relative;z-index:1}

/* N specchiata: stessa N del font, uniforme ovunque */
.rN{display:inline-block;transform:scaleX(-1)}

/* ===== layering base ===== */
body{position:relative}
header.nav,#hero,section,footer{position:relative;z-index:1}
/* contenitore effetti decorativi di sezione (stelle / lucciole) */
.sec-fx{position:absolute;inset:0;overflow:hidden;z-index:0;pointer-events:none;contain:layout paint}
.sec-fx + .wrap, .tint-blue > .wrap, .tint-pink > .wrap, .tint-dark > .wrap{position:relative;z-index:1}

/* ===== sezioni a tinta alternata (sfondo proprio, effetto sopra) ===== */
.tint-blue{background:
  radial-gradient(120% 80% at 15% 0%, rgba(71,119,160,.30), transparent 60%),
  radial-gradient(100% 70% at 90% 100%, rgba(71,119,160,.12), transparent 55%),
  linear-gradient(180deg,#16293a,#11202c)}
.tint-pink{background:
  radial-gradient(120% 80% at 85% 0%, rgba(222,174,190,.26), transparent 60%),
  radial-gradient(100% 70% at 10% 100%, rgba(222,174,190,.12), transparent 55%),
  linear-gradient(180deg,#241a20,#11202c)}
.tint-dark{background:
  radial-gradient(110% 70% at 50% 0%, rgba(227,247,126,.08), transparent 60%),
  #11202c}
/* barra accento colorata in cima a ogni sezione */
.tint-blue,.tint-pink,.tint-dark{border-top:1px solid rgba(247,249,244,.06)}
.tint-blue::after,.tint-pink::after,.tint-dark::after{
  content:"";position:absolute;top:0;left:0;right:0;height:3px;z-index:2;opacity:.95}
.tint-blue::after{background:linear-gradient(90deg,transparent,var(--blue),transparent)}
.tint-pink::after{background:linear-gradient(90deg,transparent,var(--pink),transparent)}
.tint-dark::after{background:linear-gradient(90deg,transparent,var(--lime),transparent)}

/* ===== EFFETTO 1: campo stellare parallax (CSS puro) ===== */
.fx-stars span{position:absolute;top:0;left:0;border-radius:50%;background:transparent;will-change:transform}
.fx-stars .s1{width:1px;height:1px;animation:starScroll 90s linear infinite}
.fx-stars .s2{width:2px;height:2px;animation:starScroll 130s linear infinite}
.fx-stars .s3{width:3px;height:3px;animation:starScroll 180s linear infinite}
@keyframes starScroll{from{transform:translateY(0)}to{transform:translateY(-2000px)}}

/* ===== EFFETTO 2: lucciole (CSS puro) ===== */
.fx-fireflies span{position:absolute;left:50%;top:50%;width:4px;height:4px;border-radius:50%;
  background:transparent;box-shadow:0 0 0 0 rgba(227,247,126,.25)}
.fx-fireflies span::before{content:"";position:absolute;inset:0;border-radius:50%;
  background:var(--lime);box-shadow:0 0 8px 1px rgba(227,247,126,.7)}
.fx-fireflies span::after{content:"";position:absolute;inset:0;border-radius:50%;
  background:var(--lime);opacity:0;animation:fireflyBlink var(--blink,2s) ease infinite}
@keyframes fireflyDrift{
  0%{transform:translate(0,0)}
  25%{transform:translate(var(--dx1,40px),var(--dy1,-30px))}
  50%{transform:translate(var(--dx2,-30px),var(--dy2,-60px))}
  75%{transform:translate(var(--dx3,30px),var(--dy3,-30px))}
  100%{transform:translate(0,0)}
}
@keyframes fireflyBlink{0%,100%{opacity:0}50%{opacity:.9;box-shadow:0 0 16px 3px var(--lime)}}

/* ============ NAV ============ */
header.nav{position:fixed;top:0;left:0;right:0;z-index:60;backdrop-filter:blur(11px);
  background:rgba(13,22,32,.78);border-bottom:1px solid rgba(227,247,126,.16);transition:background .3s}
.nav-inner{max-width:var(--maxw);margin:0 auto;padding:11px 22px;display:flex;align-items:center;justify-content:space-between;gap:14px}
.brand{display:flex;align-items:center;gap:11px}
.brand img{height:30px;width:auto;display:block}
.brand .dot{width:9px;height:9px;border-radius:50%;background:var(--lime);box-shadow:0 0 14px var(--lime);transition:transform .3s}
.brand:hover .dot{transform:scale(1.45)}
.nav-links{display:flex;gap:4px;align-items:center}
.nav-links a{color:var(--paper);font-size:.9rem;font-weight:500;padding:7px 12px;border-radius:8px;position:relative}
.nav-links a::after{content:"";position:absolute;left:12px;right:12px;bottom:3px;height:1.5px;
  background:linear-gradient(90deg,var(--lime),var(--pink));transform:scaleX(0);transform-origin:left;transition:transform .28s}
.nav-links a:hover,.nav-links > a.is-active{color:var(--lime);opacity:1}
.nav-links a:hover::after,.nav-links > a.is-active::after{transform:scaleX(1)}
.nav-links > a.is-active{background:rgba(227,247,126,.08)}
.lang-toggle{display:flex;border:1px solid rgba(227,247,126,.4);border-radius:999px;overflow:hidden;font-size:.76rem;font-weight:700;margin-left:8px}
.lang-toggle a{padding:6px 12px;color:var(--paper)}
.lang-toggle a.active{background:var(--lime);color:var(--ink)}
.lang-toggle a:hover{opacity:1}
/* switch bianco/nero + modalita leggera */
.bw-toggle,.perf-toggle{display:inline-flex;align-items:center;justify-content:center;width:34px;height:34px;
  margin-left:10px;border-radius:50%;border:1px solid rgba(247,249,244,.28);background:transparent;
  color:var(--paper);cursor:pointer;padding:0;transition:transform .4s var(--ease),border-color .4s var(--ease),background .4s var(--ease),box-shadow .4s var(--ease)}
.perf-toggle{margin-left:6px}
.bw-toggle:hover,.perf-toggle:hover{border-color:var(--lime);transform:translateY(-2px)}
.bw-toggle[aria-pressed="true"]{background:var(--paper);color:var(--ink);border-color:var(--paper)}
.perf-toggle[aria-pressed="true"]{background:rgba(227,247,126,.92);color:var(--ink);border-color:var(--lime);box-shadow:0 0 18px rgba(227,247,126,.25)}
.perf-toggle[data-source="auto"]{box-shadow:0 0 0 2px rgba(222,173,190,.22),0 0 20px rgba(222,173,190,.2)}
html.nan-lite header.nav{backdrop-filter:none;-webkit-backdrop-filter:none;background:rgba(13,22,32,.94)}
html.nan-lite .fx-stars .s3{display:none}
html.nan-lite .fx-fireflies span:nth-child(n+11){display:none}
/* versione in bianco e nero: filtro sull'elemento root, i fixed restano fissi */
html{transition:filter .45s ease}
html.bw{filter:grayscale(1)}
.burger{display:none;background:none;border:0;cursor:pointer;flex-direction:column;gap:5px;padding:6px}
.burger span{width:24px;height:2px;background:var(--paper);display:block;transition:.3s}

/* ============ HERO + FLUID ============ */
#hero{min-height:100vh;min-height:100svh;display:flex;align-items:center;justify-content:center;text-align:center;padding-top:72px;position:relative;isolation:isolate}
#fluid{position:absolute;inset:0;width:100%;height:100%;z-index:0;cursor:crosshair;display:block;touch-action:pan-y;contain:strict;transform:translateZ(0);-webkit-transform:translateZ(0);backface-visibility:hidden;-webkit-backface-visibility:hidden}
/* scrim radiale: tiene il testo leggibile sopra la fluid senza coprirla ai bordi */
#hero::after{content:"";position:absolute;z-index:1;left:50%;top:50%;transform:translate(-50%,-50%);
  width:min(960px,94vw);height:min(720px,86vh);pointer-events:none;
  background:radial-gradient(ellipse at center, rgba(13,22,32,.62) 0%, rgba(13,22,32,.42) 42%, transparent 72%)}
.hero-content{position:relative;z-index:2;pointer-events:none;max-width:840px;padding:0 22px;transform:translateZ(0);-webkit-transform:translateZ(0);backface-visibility:hidden;-webkit-backface-visibility:hidden}
.hero-logo{width:240px;max-width:64vw;margin:0 auto 24px;display:block;pointer-events:auto;
  filter:drop-shadow(0 4px 18px rgba(0,0,0,.85)) drop-shadow(0 0 40px rgba(13,22,32,.8))}
.badge{pointer-events:auto;display:inline-block;font-size:.74rem;letter-spacing:.2em;text-transform:uppercase;color:var(--lime);
  border:1px solid rgba(227,247,126,.5);border-radius:999px;padding:6px 16px;margin-bottom:22px;background:rgba(13,22,32,.55)}
.hero-content h1{font-size:clamp(.875rem,5vw,3.1rem);line-height:1.08;margin-bottom:16px;
  text-shadow:0 2px 8px rgba(13,22,32,.95),0 4px 30px rgba(13,22,32,.9),0 0 60px rgba(13,22,32,.7)}
.hero-content .lead{font-size:clamp(1rem,2.3vw,1.3rem);opacity:.98;
  text-shadow:0 2px 6px rgba(13,22,32,.95),0 2px 22px rgba(13,22,32,.9);max-width:690px;margin:0 auto}
.hero-cta{pointer-events:auto;margin-top:32px;display:flex;gap:12px;justify-content:center;flex-wrap:wrap}
.btn{display:inline-flex;align-items:center;gap:9px;padding:13px 26px;border-radius:999px;font-weight:600;font-size:.95rem;cursor:pointer;border:0;
  transition:transform .38s var(--ease),box-shadow .38s var(--ease),background .38s var(--ease);font-family:inherit}
.btn-primary{background:var(--lime);color:var(--ink)}
.btn-primary:hover{opacity:1;transform:translateY(-2px);box-shadow:0 10px 30px rgba(227,247,126,.4)}
.btn-blue{background:var(--blue);color:#fff}
.btn-blue:hover{opacity:1;transform:translateY(-2px);box-shadow:0 10px 30px rgba(71,119,160,.45)}
.btn-wa{background:#25D366;color:#06311a}
.btn-wa:hover{opacity:1;transform:translateY(-2px);box-shadow:0 10px 30px rgba(37,211,102,.4)}
.btn-ghost{background:rgba(13,22,32,.5);color:var(--paper);border:1px solid rgba(247,249,244,.45)}
.btn-ghost:hover{border-color:var(--lime);color:var(--lime);opacity:1;transform:translateY(-2px)}
.fluid-hint{position:absolute;bottom:18px;left:0;right:0;z-index:2;text-align:center;font-size:.7rem;letter-spacing:.14em;
  text-transform:uppercase;color:rgba(247,249,244,.5);pointer-events:none;animation:floaty 3s ease-in-out infinite}
@keyframes floaty{0%,100%{transform:translateY(0)}50%{transform:translateY(-6px)}}

/* ===== reveal on scroll ===== */
.reveal{opacity:0;transform:translate3d(0,14px,0);will-change:opacity,transform}
.reveal.in{animation:nanReveal .48s var(--ease) both}
@keyframes nanReveal{
  from{opacity:0;transform:translate3d(0,14px,0)}
  to{opacity:1;transform:translate3d(0,0,0)}
}

/* ===== section heads ===== */
.sec-head{max-width:700px;margin-bottom:46px}
.sec-head .kicker{font-size:.76rem;letter-spacing:.22em;text-transform:uppercase;font-weight:700;display:block;margin-bottom:12px}
.kicker-lime{color:var(--lime)} .kicker-pink{color:var(--pink)} .kicker-blue{color:#8fb4d6}
.sec-head h2{font-size:clamp(2rem,5vw,3.1rem)}
.sec-head p{margin-top:14px;color:rgba(247,249,244,.8);font-size:1.05rem}

/* ===== CONCEPT ===== */
.def-card{max-width:790px;margin:0 auto;text-align:center}
.formula{font-family:"Courier New",monospace;font-size:clamp(1.25rem,4vw,2.1rem);color:var(--lime);
  background:rgba(71,119,160,.2);border:1px dashed rgba(227,247,126,.45);border-radius:var(--radius);
  padding:16px 22px;display:inline-block;margin-bottom:26px;transition:transform .3s,box-shadow .3s}
.formula:hover{transform:scale(1.03);box-shadow:0 0 40px rgba(227,247,126,.25)}
.def-card p{font-size:1.07rem;color:rgba(247,249,244,.9)}
.def-card .big{font-family:'Rationale',Georgia,serif;font-size:clamp(1.3rem,4vw,1.6rem);color:var(--paper);margin-top:16px}

/* ===== ASCII art DOS ===== */
.ascii-wrap{max-width:760px;margin:34px auto 0;text-align:center}
.ascii-box{background:#05080c;border:1px solid rgba(227,247,126,.3);border-radius:10px;padding:18px 10px;
  box-shadow:0 0 0 1px rgba(0,0,0,.4),0 14px 40px rgba(0,0,0,.5);position:relative;overflow:hidden}
.ascii-box::before{content:"C:\\NAN> _";position:absolute;top:7px;left:12px;font-family:"Courier New",monospace;
  font-size:.66rem;color:rgba(227,247,126,.5);letter-spacing:.05em}
.ascii-art{font-family:"Courier New",ui-monospace,monospace;color:var(--lime);white-space:pre;line-height:1.02;
  font-size:clamp(.34rem,2.1vw,.92rem);margin-top:14px;text-shadow:0 0 8px rgba(227,247,126,.45);
  user-select:none;cursor:crosshair;display:inline-block;letter-spacing:0}
.ascii-cap{font-family:"Courier New",monospace;font-size:.72rem;color:rgba(222,174,190,.75);margin-top:12px;letter-spacing:.04em}
.scanline{position:absolute;inset:0;pointer-events:none;background:repeating-linear-gradient(
  0deg,rgba(227,247,126,.04) 0,rgba(227,247,126,.04) 1px,transparent 2px,transparent 4px)}

/* ===== WHO ===== */
.who-grid{display:grid;grid-template-columns:1.08fr .92fr;gap:50px;align-items:center}
#who p{color:rgba(247,249,244,.86);margin-bottom:16px;font-size:1.03rem}
.who-tags{display:flex;flex-wrap:wrap;gap:8px;margin-top:22px}
.who-tags span{font-size:.8rem;font-weight:600;padding:7px 13px;border-radius:999px;
  background:rgba(222,174,190,.14);color:var(--pink);border:1px solid rgba(222,174,190,.32);transition:transform .5s var(--ease),background .5s var(--ease);cursor:default}
.who-tags span:hover{transform:translateY(-2px);background:rgba(222,174,190,.26)}
.who-portrait{aspect-ratio:1;border-radius:var(--radius);background:linear-gradient(135deg,var(--blue),var(--blue-deep));
  display:flex;align-items:center;justify-content:center;position:relative;overflow:hidden;border:1px solid rgba(227,247,126,.22)}
.who-portrait .glyph{font-family:'Rationale',Georgia,serif;font-size:clamp(6rem,18vw,9.5rem);font-weight:700;color:rgba(227,247,126,.9);z-index:1}
/* contenitore: cover + cta sotto */
.who-side{display:flex;flex-direction:column;gap:14px}
/* cover album KymD. cliccabile (niente zoom su hover) */
.who-cover{display:block;padding:0;text-decoration:none;position:relative;aspect-ratio:1;border-radius:var(--radius);
  overflow:hidden;box-shadow:0 18px 50px rgba(0,0,0,.5)}
.who-cover img{width:100%;height:100%;object-fit:cover;display:block;border-radius:var(--radius)}
/* cornice luminosa che pulsa */
.who-cover::before{content:"";position:absolute;inset:0;border-radius:var(--radius);z-index:2;pointer-events:none;
  box-shadow:inset 0 0 0 2px rgba(227,247,126,.55);
  animation:coverGlow 3.4s ease-in-out infinite}
@keyframes coverGlow{
  0%,100%{box-shadow:inset 0 0 0 2px rgba(227,247,126,.35)}
  50%{box-shadow:inset 0 0 0 2px rgba(222,174,190,.85),0 0 26px 2px rgba(227,247,126,.28)}
}
/* CTA "ascolta" SOTTO il box (non sopra la cover) */
.cover-cta{display:flex;align-items:center;justify-content:center;gap:8px;text-decoration:none;
  font-family:'Inter',sans-serif;font-size:.92rem;font-weight:700;letter-spacing:.02em;color:var(--ink);
  background:linear-gradient(0deg,var(--lime),rgba(227,247,126,.94));border-radius:12px;padding:13px 16px;
  transition:transform .35s var(--ease),box-shadow .35s var(--ease)}
.cover-cta:hover{opacity:1;transform:translateY(-2px);box-shadow:0 10px 26px rgba(227,247,126,.35)}
.who-portrait:not(.who-cover)::after{content:"";position:absolute;inset:0;background:radial-gradient(circle at 70% 28%,rgba(222,174,190,.42),transparent 62%)}
.who-portrait:not(.who-cover)::before{content:"";position:absolute;width:150%;height:150%;
  background:conic-gradient(from 0deg,transparent,rgba(227,247,126,.1),transparent);animation:spin 16s linear infinite}
@keyframes spin{to{transform:rotate(360deg)}}

/* ===== SERVICES ===== */
.svc-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,300px),1fr));gap:18px}
.svc{background:rgba(15,26,38,.62);border:1px solid rgba(247,249,244,.09);border-radius:var(--radius);
  padding:26px 22px;transition:transform .5s var(--ease),border-color .5s var(--ease);position:relative;overflow:hidden}
.svc::before{content:"";position:absolute;top:0;left:0;right:0;height:2px;
  background:linear-gradient(90deg,var(--lime),var(--pink));transform:scaleX(0);transform-origin:left;transition:transform .5s var(--ease)}
.svc:hover{transform:translateY(-6px);border-color:rgba(227,247,126,.5)}
.svc::after{content:"";position:absolute;inset:0;border-radius:var(--radius);pointer-events:none;
  box-shadow:0 18px 44px rgba(0,0,0,.45);opacity:0;transition:opacity .4s var(--ease)}
.svc:hover::after{opacity:1}
.svc:hover::before{transform:scaleX(1)}
.svc .ico{display:inline-flex;align-items:center;justify-content:center;width:46px;height:46px;margin-bottom:14px;
  border-radius:12px;background:rgba(227,247,126,.12);border:1px solid rgba(227,247,126,.28);color:var(--lime);
  transition:transform .5s var(--ease),background .5s var(--ease)}
.svc:hover .ico{transform:translateX(-6px);background:rgba(227,247,126,.2)}
.svc h3{font-size:1.13rem;margin-bottom:8px;color:var(--lime)}
.svc p{color:rgba(247,249,244,.77);font-size:.94rem}

/* ===== mini experiments (myip / atomic / kymd) ===== */
.mini-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,230px),1fr));gap:16px}
.mini{border-radius:var(--radius);padding:24px 22px;position:relative;overflow:hidden;border:1px solid rgba(247,249,244,.1);
  transition:transform .34s var(--ease),border-color .34s var(--ease);display:flex;flex-direction:column;cursor:pointer;color:inherit}
.mini:hover{transform:translateY(-5px);border-color:rgba(227,247,126,.36);opacity:1}
.mini::after{content:"";position:absolute;inset:0;border-radius:var(--radius);pointer-events:none;
  box-shadow:0 16px 40px rgba(0,0,0,.4);opacity:0;transition:opacity .4s var(--ease)}
.mini:hover::after{opacity:1}
.mini.m-blue{background:linear-gradient(135deg,rgba(71,119,160,.3),rgba(71,119,160,.08))}
.mini.m-pink{background:linear-gradient(135deg,rgba(222,174,190,.24),rgba(222,174,190,.06))}
.mini.m-lime{background:linear-gradient(135deg,rgba(227,247,126,.2),rgba(227,247,126,.04))}
.mini .tag{font-family:"Courier New",monospace;font-size:.72rem;letter-spacing:.08em;color:rgba(247,249,244,.6);margin-bottom:10px}
.mini h3{font-size:1.18rem;margin-bottom:8px;color:var(--paper)}
.mini p{color:rgba(247,249,244,.8);font-size:.92rem;flex:1}
.mini-note{flex:0 1 auto;font-size:.82rem !important;color:rgba(247,249,244,.62) !important;
  border-top:1px solid rgba(247,249,244,.1);padding-top:11px;margin-top:4px}
.mini-note strong{color:rgba(227,247,126,.85);font-weight:600}
.mini .go{margin-top:14px;font-weight:600;font-size:.9rem;color:var(--lime);display:inline-block}
.mini.m-pink .go{color:var(--pink)}

/* ===== CASE STUDIES ===== */
.case-box{background:linear-gradient(135deg,rgba(71,119,160,.3),rgba(222,174,190,.14));
  border:1px solid rgba(227,247,126,.26);border-radius:var(--radius);padding:42px 40px;transition:border-color .4s var(--ease)}
.case-box+.case-box{margin-top:22px}
.case-box:hover{border-color:rgba(227,247,126,.55)}
.case-box .kicker{color:var(--lime);font-size:.76rem;letter-spacing:.22em;text-transform:uppercase;font-weight:700}
.case-box h2{font-size:clamp(1.5rem,4vw,2.2rem);margin:8px 0 14px}
.case-box p{color:rgba(247,249,244,.87);font-size:1.03rem;max-width:840px}
.case-metrics{display:flex;gap:34px;flex-wrap:wrap;margin-top:28px}
.case-metrics .m b{display:block;font-family:'Rationale',Georgia,serif;font-size:1.8rem;color:var(--lime)}
.case-metrics .m span{font-size:.82rem;color:rgba(247,249,244,.72)}
.case-stack{display:flex;flex-wrap:wrap;gap:7px;margin-top:22px}
.case-stack span{font-size:.74rem;font-weight:600;padding:5px 11px;border-radius:6px;background:rgba(13,22,32,.55);
  color:rgba(247,249,244,.82);border:1px solid rgba(247,249,244,.14)}

/* ===== METHOD ===== */
.method-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,420px),1fr));gap:20px;margin-top:6px}
.method{padding:26px;border-left:3px solid var(--pink);background:rgba(15,26,38,.52);border-radius:0 var(--radius) var(--radius) 0;
  transition:transform .5s var(--ease),border-color .5s var(--ease),background .5s var(--ease)}
.method:hover{transform:translateX(6px);border-left-color:var(--lime);background:rgba(13,22,32,.62)}
.method h3{color:var(--paper);font-size:1.12rem;margin-bottom:7px}
.method p{color:rgba(247,249,244,.74);font-size:.95rem}

/* ===== PARTNERS ===== */
/* ===== PARTNERS (impilati uno sotto l'altro) ===== */
.partner-list{display:flex;flex-direction:column;gap:20px}
.partner{display:flex;gap:34px;align-items:center;flex-wrap:wrap;justify-content:space-between;
  background:rgba(15,26,38,.62);border:1px solid rgba(247,249,244,.1);border-radius:var(--radius);
  padding:30px 36px;transition:border-color .5s var(--ease),transform .5s var(--ease)}
.partner:hover{border-color:rgba(227,247,126,.4);transform:translateY(-4px)}
.partner .ptxt{flex:1;min-width:280px}
.partner .ptag{font-size:.72rem;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--pink);display:block;margin-bottom:6px}
.partner h3{font-size:1.25rem;color:var(--lime);margin-bottom:8px}
.partner p{font-size:.96rem;color:rgba(247,249,244,.82);margin-bottom:10px}
.partner a.go{font-weight:600;font-size:.9rem}
.partner .plogo{background:#fff;border-radius:12px;padding:18px 26px;display:flex;align-items:center;justify-content:center;
  min-width:210px;min-height:78px;transition:box-shadow .5s var(--ease)}
.partner .plogo:hover{box-shadow:0 12px 30px rgba(0,0,0,.28)}
.partner .plogo img{max-height:42px;max-width:190px;width:auto}
/* box Select in evidenza (collaborazione di lunga data) */
.partner.featured{
  background:linear-gradient(135deg,rgba(71,119,160,.34),rgba(15,26,38,.7));
  border:1px solid rgba(227,247,126,.4);box-shadow:0 0 0 1px rgba(227,247,126,.12),0 18px 50px rgba(0,0,0,.4);
  padding:38px 40px;flex-direction:column;align-items:stretch;gap:24px}
.partner.featured .featured-top{display:flex;gap:34px;align-items:center;flex-wrap:wrap;justify-content:space-between}
.partner.featured .ptxt{min-width:300px}
.partner.featured h3{font-size:1.55rem}
.h3-sub{font-size:1.3rem;font-weight:700;color:var(--lime)}
@media(max-width:560px){.h3-sub{display:block;white-space:normal;margin-top:2px;font-size:1.1rem}}
.partner.featured .plogo{flex-direction:column;gap:12px;padding:20px 28px;min-height:96px}
.partner.featured .plogo .pl-main{max-height:46px}
.partner.featured .plogo .pl-badge{max-height:30px}
.partner .badge-years{display:inline-block;font-size:.72rem;font-weight:700;letter-spacing:.08em;text-transform:uppercase;
  color:var(--ink);background:var(--lime);border-radius:999px;padding:4px 12px;margin-left:8px}
.featured-extra{border-top:1px solid rgba(247,249,244,.12);padding-top:20px}
.featured-extra h4{font-family:'Inter',sans-serif;font-size:.78rem;letter-spacing:.14em;text-transform:uppercase;
  color:var(--pink);margin-bottom:14px;font-weight:700}
.featured-extra .chips{display:flex;flex-wrap:wrap;gap:10px}
.featured-extra .chips span{display:inline-flex;align-items:center;gap:7px;font-size:.88rem;font-weight:500;
  color:rgba(247,249,244,.92);background:rgba(71,119,160,.2);border:1px solid rgba(71,119,160,.45);
  border-radius:10px;padding:9px 14px}
.featured-extra .chips span::before{content:"";width:7px;height:7px;border-radius:50%;background:var(--lime);flex:none}
/* logo dentro i mini box (experiments) */
.mini .mlogo{height:38px;margin-bottom:14px;display:flex;align-items:center}
.mini .mlogo img{max-height:38px;max-width:170px;width:auto;filter:drop-shadow(0 2px 8px rgba(0,0,0,.5))}

/* ===== HOME-CONSULT note ===== */
.home-note{margin-top:24px;background:rgba(227,247,126,.08);border:1px solid rgba(227,247,126,.25);border-radius:var(--radius);
  padding:20px 24px;font-size:.98rem;color:rgba(247,249,244,.88);display:flex;gap:14px;align-items:flex-start}
.home-note .ic{font-size:1.4rem;line-height:1}

/* ===== CONTACT ===== */
#contact{text-align:center}
.contact-card{max-width:680px;margin:0 auto}
.contact-card h2{font-size:clamp(2rem,5vw,3.1rem);margin-bottom:14px}
.contact-card p{color:rgba(247,249,244,.84);font-size:1.06rem;margin-bottom:6px}
.contact-first{display:inline-flex;align-items:center;gap:8px;font-size:.82rem;letter-spacing:.05em;color:var(--pink);
  background:rgba(222,174,190,.13);border:1px solid rgba(222,174,190,.32);padding:7px 16px;border-radius:999px;margin:22px 0 4px}
.contact-list{display:flex;flex-direction:column;gap:12px;margin-top:28px;font-size:1rem}
.contact-list a{font-weight:600}
.contact-list .label{color:rgba(247,249,244,.56);font-size:.78rem;text-transform:uppercase;letter-spacing:.1em}

/* ===== FOOTER ===== */
footer{background:var(--ink);border-top:1px solid rgba(227,247,126,.14);padding:44px 0 26px;font-size:.85rem;color:rgba(247,249,244,.62)}
.foot-inner{display:flex;justify-content:space-between;gap:26px;flex-wrap:wrap;align-items:flex-start}
.foot-logo img{width:148px;height:auto;margin-bottom:11px}
.foot-inner a{color:rgba(247,249,244,.72)}
.foot-inner a:hover{color:var(--lime)}
.foot-legal{font-size:.77rem;line-height:1.85}
.foot-links{display:flex;gap:15px;flex-wrap:wrap;align-items:center}
.deadbeef-sig{font-family:"Courier New",monospace;font-size:.7rem;color:rgba(222,173,190,.5);letter-spacing:.05em;margin-top:13px}
.foot-community{display:inline-block;margin-top:8px;font-size:.82rem;color:rgba(247,249,244,.6);font-family:'Inter',sans-serif;letter-spacing:0}
.foot-community a{color:var(--blue)}
.foot-community a:hover{color:var(--lime)}
.facebook-community-link{display:inline-flex;align-items:center;gap:6px;text-decoration:none}
.facebook-community-link span{text-decoration:underline;text-underline-offset:3px}
.facebook-icon{flex:0 0 auto;filter:drop-shadow(0 0 8px rgba(92,211,255,.22))}
.deadbeef-sig .egg{display:inline-flex;align-items:center;justify-content:center;opacity:.35;text-decoration:none;vertical-align:-.28em;transition:opacity .3s var(--ease),filter .3s var(--ease)}
.deadbeef-sig .egg svg{width:20px;height:20px}
.deadbeef-sig .egg:hover{opacity:1;filter:drop-shadow(0 0 6px rgba(227,247,126,.7))}

/* ===== background fx ===== */

/* ============ RESPONSIVE / MOBILE ============ */
@media(max-width:900px){
  .partner-list .partner{flex-direction:column;align-items:flex-start;gap:18px}
  .partner.featured .featured-top{flex-direction:column;align-items:flex-start;gap:18px}
  .partner .plogo{width:100%}
  .who-grid{grid-template-columns:1fr}
  .who-portrait{max-width:300px;margin:0 auto;order:-1}
}
@media(max-width:760px){
  .nav-links{position:fixed;top:54px;right:0;flex-direction:column;align-items:stretch;gap:0;
    background:rgba(13,22,32,.98);width:min(78vw,280px);padding:8px 0;border-left:1px solid rgba(227,247,126,.2);
    transform:translateX(110%);transition:transform .32s;height:calc(100vh - 54px);overflow-y:auto}
  .nav-links.open{transform:translateX(0)}
  .nav-links a{padding:14px 22px;border-radius:0}
  .nav-links a::after{display:none}
  .nav-links .lang-toggle{margin:14px 22px 14px 22px;align-self:flex-start;width:auto;flex:0 0 auto;font-size:.8rem;display:inline-flex}
  .nav-links .lang-toggle a{padding:7px 16px}
  .nav-links .bw-toggle,.nav-links .perf-toggle{margin:0 0 16px 22px;align-self:flex-start}
  .nav-links .perf-toggle{margin-top:-8px}
  .burger{display:flex}
  section{padding:62px 0}
  .case-box{padding:28px 22px}
  .foot-inner{flex-direction:column;gap:20px}
  .hero-cta{gap:10px}
  .btn{padding:12px 20px;font-size:.9rem}
}
@media(max-width:380px){
  .wrap{padding:0 16px}
  .hero-content h1{font-size:5vw}
  .ascii-art{font-size:.3rem}
}
@media(prefers-reduced-motion:reduce){
  /* v9: non spegniamo globalmente le animazioni.
     La v8 tagliava quasi tutto su sistemi/browser che segnalano reduce,
     facendo sparire sfondi, burst iniziale e fuoco fatuo. Manteniamo solo
     lo scroll non-animato: la pausa performance degli effetti resta gestita
     dalla logica offscreen/visibility dei singoli componenti. */
  html{scroll-behavior:auto}
}
