/* Chi sono (10/11/2026): apertura, la strada con la faccia di Andrea che scende allo scroll, marchi, FAQ, link. */
.chi-sono-nuova{background:#fff}
.cs-ap{padding:170px 6% 60px;max-width:1100px;margin:0 auto}
.cs-ap h1{font-size:clamp(40px,6vw,84px);line-height:.98;letter-spacing:-.045em;font-weight:650;color:var(--notte)}
.cs-ap p{margin-top:26px;max-width:58ch;font-size:19px;line-height:1.6;color:#3b4d6e}

/* percorso: la strada a sinistra, le tappe a destra */
.pc{position:relative;max-width:1200px;margin:0 auto;padding:40px 4% 120px;display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:0 40px}
.pc-strada{position:relative;grid-column:1;grid-row:1}
.pc-strada svg{position:absolute;inset:0;width:100%;height:100%;overflow:visible}
.pc-asfalto{fill:none;stroke:#e3ebf7;stroke-width:64;stroke-linecap:round}
.pc-fatto{fill:none;stroke:var(--notte);stroke-width:64;stroke-linecap:round}
.pc-mezzeria{fill:none;stroke:#fff;stroke-width:3;stroke-dasharray:16 18;stroke-linecap:round;opacity:.85}
.pc-faccia{position:absolute;left:0;top:0;width:96px;height:96px;margin:-48px 0 0 -48px;border-radius:50%;object-fit:cover;border:5px solid #fff;
  box-shadow:0 0 0 3px var(--blu),0 18px 34px -12px rgb(15 45 107 / .6);will-change:transform;z-index:2}
.pc-tappe{grid-column:2;grid-row:1;list-style:none;margin:0;padding:0;display:grid;gap:90px}
.pc-tappa{opacity:.32;transform:translateX(18px);transition:opacity .5s,transform .6s var(--ease-out)}
.pc-tappa.accesa{opacity:1;transform:none}
.pc-anno{display:block;font-size:clamp(34px,4vw,56px);font-weight:700;letter-spacing:-.03em;color:#9db4d6;line-height:1;margin-bottom:14px;transition:color .5s}
.pc-tappa.accesa .pc-anno{color:var(--blu)}
.pc-carta{background:#fff;border-radius:22px;padding:24px 26px;box-shadow:0 24px 50px -32px rgb(15 45 107 / .5),0 0 0 1px rgb(15 45 107 / .06)}
.pc-carta h3{font-size:24px;letter-spacing:-.02em;margin:12px 0 2px;color:var(--notte)}
.pc-ruolo{color:var(--blu);font-weight:600;font-size:15px}
.pc-carta p:not(.pc-ruolo){margin-top:10px;color:#3b4d6e;font-size:16px;line-height:1.55}
.pc-logo{height:34px;width:auto;max-width:180px;object-fit:contain;object-position:left}
.pc-segno{display:inline-grid;place-items:center;min-width:54px;height:34px;padding:0 10px;border-radius:10px;background:var(--azzurro);color:var(--notte);font-size:13px;font-weight:700}
.pc-p{background:var(--blu);color:#fff;font-size:16px}
.pc-oggi .pc-carta{background:var(--notte)}
.pc-oggi .pc-carta h3,.pc-oggi .pc-carta p:not(.pc-ruolo){color:#fff}
.pc-oggi .pc-ruolo{color:#8fb3ff}

/* marchi, FAQ, link */
.cs-marchi,.cs-esplora{padding:90px 6%;max-width:1100px;margin:0 auto}
.cs-marchi h2,.cs-esplora h2,.chi-sono-nuova .faq-titolo{font-size:clamp(30px,4vw,52px);line-height:1.02;letter-spacing:-.04em;color:var(--notte)}
.cs-loghi{margin-top:34px;display:flex;flex-wrap:wrap;gap:28px 54px;align-items:center}
.cs-loghi img{height:44px;width:auto;max-width:200px;object-fit:contain;filter:grayscale(1);opacity:.75;transition:filter .3s,opacity .3s}
.cs-loghi img:hover{filter:none;opacity:1}
.chi-sono-nuova .faq{max-width:1100px;margin:0 auto;padding:90px 6%}
.chi-sono-nuova .faq-voce{background:var(--azzurro);border-radius:18px;margin-top:12px;padding:4px 22px}
.chi-sono-nuova .faq-voce summary{cursor:pointer;list-style:none;padding:16px 0}
.chi-sono-nuova .faq-voce summary::-webkit-details-marker{display:none}
.chi-sono-nuova .faq-voce summary h3{display:inline;font-size:18px;color:var(--notte);font-weight:600}
.chi-sono-nuova .faq-voce p{padding:0 0 18px;color:#3b4d6e;line-height:1.6;max-width:72ch}
.cs-esplora ul{list-style:none;margin:28px 0 0;padding:0;display:flex;flex-wrap:wrap;gap:10px}
.cs-esplora a{display:inline-block;padding:12px 20px;border-radius:999px;background:#fff;color:var(--notte);font-weight:600;font-size:15px;
  box-shadow:0 0 0 1px rgb(15 45 107 / .14);transition:background-color .2s,color .2s}
.cs-esplora a:hover{background:var(--blu);color:#fff}
.chi-sono-nuova .lv-fine{background:#fff}

@media (max-width:900px){
  .cs-ap{padding:120px 20px 30px}
  .pc{grid-template-columns:70px minmax(0,1fr);gap:0 14px;padding:20px 16px 80px}
  .pc-asfalto,.pc-fatto{stroke-width:34}
  .pc-faccia{width:60px;height:60px;margin:-30px 0 0 -30px;border-width:3px}
  .pc-tappe{gap:56px}
  .pc-carta{padding:18px}
  .pc-carta h3{font-size:20px}
  .cs-marchi,.cs-esplora,.chi-sono-nuova .faq{padding:60px 20px}
  .cs-loghi{gap:20px 30px}
  .cs-loghi img{height:32px}
}

/* I miei strumenti */
.cs-tool{padding:90px 6%;max-width:1100px;margin:0 auto}
.cs-tool h2{font-size:clamp(30px,4vw,52px);line-height:1.02;letter-spacing:-.04em;color:var(--notte)}
.cs-tool-griglia{margin-top:30px;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}
.cs-tool-carta{display:flex;flex-direction:column;gap:10px;padding:26px;border-radius:22px;background:var(--azzurro);transition:transform .3s var(--ease-out),box-shadow .3s}
.cs-tool-carta:hover{transform:translateY(-4px);box-shadow:0 24px 40px -28px rgb(15 45 107 / .5)}
.cs-tool-logo{width:64px;height:64px;padding:8px;border-radius:16px;background:#fff;box-shadow:0 6px 16px -10px rgb(15 45 107 / .5)}
.cs-tool-carta h3{font-size:22px;letter-spacing:-.02em;color:var(--notte);margin-top:6px}
.cs-tool-carta p{color:#3b4d6e;font-size:16px;line-height:1.55}
.cs-tool-carta a{margin-top:auto;align-self:flex-start;padding:10px 18px;border-radius:999px;background:var(--blu);color:#fff;font-weight:600;font-size:14px}
@media (max-width:900px){.cs-tool{padding:60px 20px}.cs-tool-griglia{grid-template-columns:1fr}}
