:root{
  --bg:#FBFAF7;
  --card:#FFFFFF;
  --ink:#1B2430;
  --mute:#5C6672;
  --amber:#E8842C;      /* docenti */
  --amber-soft:#FCEEDD;
  --sea:#0E7C86;        /* studenti */
  --sea-soft:#DEF0F1;
  --ink-dark:#131A24;
  --line:rgba(27,36,48,.1);
  --disp:'Sora',system-ui,sans-serif;
  --body:'Manrope',system-ui,sans-serif;
}
*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth}
body{background:var(--bg);color:var(--ink);font-family:var(--body);font-size:17px;line-height:1.65;-webkit-font-smoothing:antialiased}
::selection{background:var(--sea);color:#fff}

/* ---------- INTRO (animated SVG) ---------- */
#intro{position:fixed;inset:0;background:#07090c;z-index:100;display:flex;align-items:center;justify-content:center;transition:opacity 1s ease,visibility 1s;cursor:pointer}
#intro.done{opacity:0;visibility:hidden}
.intro-stage{width:min(880px,86vw)}
.intro-stage svg{width:100%;height:auto;display:block;overflow:visible}
.intro-skip{position:absolute;bottom:30px;left:50%;transform:translateX(-50%);font-size:11px;letter-spacing:.2em;text-transform:uppercase;color:rgba(255,255,255,.35)}

#intro #lockup{transform:translateX(368px);animation:in-slide .95s cubic-bezier(.65,0,.35,1) 2.85s both}
@keyframes in-slide{to{transform:translateX(0)}}
#intro #blob-top,#intro #blob-bottom{transform-box:view-box}
#intro #blob-top{animation:in-blobTop 2.6s cubic-bezier(.4,0,.6,1) 0s both,in-blobFade .35s ease-out 2.35s both}
#intro #blob-bottom{animation:in-blobBottom 2.6s cubic-bezier(.4,0,.6,1) 0s both,in-blobFade .35s ease-out 2.35s both}
@keyframes in-blobTop{
  0%{transform:translateY(-300px);animation-timing-function:cubic-bezier(.5,0,.85,.4)}
  40%{transform:translateY(0);animation-timing-function:cubic-bezier(.2,.9,.35,1.25)}
  58%{transform:translateY(-57px);animation-timing-function:cubic-bezier(.4,0,.5,1)}
  72%{transform:translateY(-46px);animation-timing-function:cubic-bezier(.4,0,.5,1)}
  84%,100%{transform:translateY(-50px)}
}
@keyframes in-blobBottom{
  0%{transform:translateY(300px);animation-timing-function:cubic-bezier(.5,0,.85,.4)}
  40%{transform:translateY(0);animation-timing-function:cubic-bezier(.2,.9,.35,1.25)}
  58%{transform:translateY(76px);animation-timing-function:cubic-bezier(.4,0,.5,1)}
  72%{transform:translateY(63px);animation-timing-function:cubic-bezier(.4,0,.5,1)}
  84%,100%{transform:translateY(69px)}
}
@keyframes in-blobFade{to{opacity:0}}
#intro #flash{transform-box:view-box;transform-origin:143px 101px;transform:scale(.2);opacity:0;animation:in-flash .55s cubic-bezier(.16,1,.3,1) 1.05s both}
@keyframes in-flash{0%{transform:scale(.2);opacity:0}18%{opacity:.85}100%{transform:scale(1.25);opacity:0}}
#intro #ripple-inner,#intro #ripple-middle,#intro #ripple-outer{transform-box:view-box;transform-origin:143px 101px;transform:scale(0);opacity:0}
#intro #ripple-inner{animation:in-ripple .65s cubic-bezier(.22,1.25,.36,1) 1.07s both}
#intro #ripple-middle{animation:in-ripple .8s cubic-bezier(.22,1.25,.36,1) 1.15s both}
#intro #ripple-outer{animation:in-ripple .95s cubic-bezier(.22,1.25,.36,1) 1.23s both}
@keyframes in-ripple{0%{transform:scale(.1);opacity:0}25%{opacity:1}100%{transform:scale(1);opacity:1}}
#intro #drop-top,#intro #drop-bottom{opacity:0;animation:in-dropIn .4s ease-out 2.3s both}
@keyframes in-dropIn{to{opacity:1}}
#intro #letter-d,#intro #letter-m,#intro #letter-v{transform-box:fill-box;transform-origin:center;opacity:0;transform:translateX(46px);animation:in-letter .6s cubic-bezier(.22,1,.36,1) both}
#intro #letter-d{animation-delay:2.97s}
#intro #letter-m{animation-delay:3.11s}
#intro #letter-v{animation-delay:3.25s}
@keyframes in-letter{to{opacity:1;transform:translateX(0)}}
@media (prefers-reduced-motion:reduce){
  #intro *{animation-duration:.01s !important;animation-delay:0s !important}
}

/* ---------- CHROME ---------- */
.wrap{max-width:1180px;margin:0 auto;padding:0 28px}
header{position:sticky;top:0;background:rgba(251,250,247,.9);backdrop-filter:blur(12px);border-bottom:1px solid var(--line);z-index:50}
.nav{display:flex;align-items:center;justify-content:space-between;height:72px}
.brand{display:flex;align-items:center;text-decoration:none;color:var(--ink)}
.brand-logo{height:30px;width:auto;display:block}
.nav-links{display:flex;gap:34px}
.nav-links a{color:var(--mute);text-decoration:none;font-size:14.5px;font-weight:600}
.nav-links a:hover{color:var(--ink)}
.btn{display:inline-block;background:var(--ink);color:#fff;text-decoration:none;font-weight:700;font-size:15px;padding:14px 30px;border-radius:12px;transition:.25s}
.btn:hover{transform:translateY(-2px);box-shadow:0 10px 26px rgba(27,36,48,.22)}
.btn-sm{padding:10px 20px;font-size:13.5px;border-radius:10px}
.btn-amber{background:var(--amber)}
.btn-sea{background:var(--sea)}

/* ---------- HERO ---------- */
.hero{padding:100px 0 80px;text-align:center}
.eyebrow{display:inline-block;font-size:13px;font-weight:700;letter-spacing:.22em;text-transform:uppercase;color:var(--mute);margin-bottom:28px}
.eyebrow b{color:var(--amber)}
.eyebrow i{color:var(--sea);font-style:normal}
h1{font-family:var(--disp);font-weight:600;font-size:clamp(42px,6vw,76px);line-height:1.06;letter-spacing:-.02em;max-width:16ch;margin:0 auto}
.hl-a{background:linear-gradient(transparent 62%,var(--amber-soft) 62%)}
.hl-s{background:linear-gradient(transparent 62%,var(--sea-soft) 62%)}
.hero p{max-width:600px;margin:30px auto 42px;font-size:19px;color:var(--mute)}
.hero-cta{display:flex;gap:16px;justify-content:center;flex-wrap:wrap}

/* split product hero */
.split{display:grid;grid-template-columns:1fr 1fr;gap:26px;margin-top:8px}
.side{border-radius:24px;padding:52px 46px;position:relative;overflow:hidden;transition:transform .3s}
.side:hover{transform:translateY(-5px)}
.side-docenti{background:linear-gradient(160deg,#FDF3E6,#FAE3C6)}
.side-studenti{background:linear-gradient(160deg,#E3F2F3,#CBE8EA)}
.side .who{font-size:13px;font-weight:800;letter-spacing:.22em;text-transform:uppercase}
.side-docenti .who{color:var(--amber)}
.side-studenti .who{color:var(--sea)}
.side h3{font-family:var(--disp);font-weight:600;font-size:34px;margin:14px 0 12px}
.side>p{color:var(--mute);font-size:16px;margin-bottom:24px}
.side ul{list-style:none;margin-bottom:30px}
.side li{padding:11px 0;font-weight:600;font-size:15px;border-top:1px solid rgba(27,36,48,.1)}
.side-docenti li::before{content:"●";color:var(--amber);font-size:10px;margin-right:12px;vertical-align:2px}
.side-studenti li::before{content:"●";color:var(--sea);font-size:10px;margin-right:12px;vertical-align:2px}
.side .drop-deco{position:absolute;right:30px;top:34px;width:54px;opacity:.9}

/* vision */
.vision{background:var(--ink-dark);color:#fff;padding:110px 0;margin-top:96px}
.vision .k{font-size:13px;font-weight:700;letter-spacing:.24em;text-transform:uppercase;color:#59C2CC;margin-bottom:20px}
.vision h2{font-family:var(--disp);font-weight:600;font-size:clamp(30px,4.4vw,52px);line-height:1.14;max-width:24ch}
.vision h2 em{font-style:normal;color:var(--amber)}
.vision h2 i{font-style:normal;color:#59C2CC}
.vision-pts{display:grid;grid-template-columns:repeat(3,1fr);gap:40px;margin-top:64px}
.vp h3{font-family:var(--disp);font-size:19px;font-weight:600;margin-bottom:10px}
.vp p{font-size:15px;color:rgba(255,255,255,.6)}
.vp .bar{width:44px;height:4px;border-radius:2px;margin-bottom:18px}

/* science strip */
.science{padding:100px 0}
.sci-flex{display:grid;grid-template-columns:1.1fr 1fr;gap:70px;align-items:center}
.science h2{font-family:var(--disp);font-weight:600;font-size:clamp(28px,3.6vw,44px);line-height:1.14}
.science .lede{color:var(--mute);margin-top:18px;font-size:17px}
.sci-list{display:flex;flex-direction:column;gap:18px}
.sci-item{background:var(--card);border:1px solid var(--line);border-radius:16px;padding:24px 26px;display:flex;gap:18px;align-items:flex-start;box-shadow:0 2px 10px rgba(27,36,48,.04)}
.sci-item .dot{flex:none;width:38px;height:38px;border-radius:11px;display:flex;align-items:center;justify-content:center;font-weight:800;font-size:15px}
.d1{background:var(--amber-soft);color:var(--amber)}
.d2{background:var(--sea-soft);color:var(--sea)}
.d3{background:#EEEAF9;color:#6B5CD6}
.sci-item h4{font-family:var(--disp);font-size:16.5px;font-weight:600;margin-bottom:4px}
.sci-item p{font-size:14.5px;color:var(--mute)}

/* founders */
.founders{padding:20px 0 100px;text-align:center}
.f-kicker{
  font-size:12px;font-weight:700;letter-spacing:.24em;text-transform:uppercase;
  color:var(--mute);margin-bottom:18px;
}
.founders h2{
  font-family:var(--disp);font-weight:600;font-size:clamp(28px,3.4vw,40px);
  line-height:1.2;max-width:22ch;margin:0 auto;
}
.founders .sub{
  text-align:center;color:var(--mute);margin:16px auto 0;max-width:46ch;
  font-size:16px;line-height:1.65;
}
.f-grid{
  margin:52px auto 0;max-width:620px;
  display:grid;grid-template-columns:repeat(2,1fr);
  gap:20px;text-align:left;
}
.f-card{
  background:var(--card);border:1px solid var(--line);border-radius:8px;
  overflow:hidden;display:flex;flex-direction:column;
  box-shadow:0 10px 30px -12px rgba(20,24,29,.22);
}
.f-photo{
  margin:0;aspect-ratio:4/5;position:relative;
  background:linear-gradient(180deg,#FAF9F6 0%,#EBE8E2 100%);
  display:block;overflow:hidden;
}
.f-photo picture{display:block;width:100%;height:100%}
.f-photo img{
  width:100%;height:100%;display:block;
  object-fit:cover;object-position:center bottom;
}
/* Gianluca: nudge the figure down a touch */
.f-card:first-child .f-photo img{transform:translateY(4%)}
/* Roberto: full portrait, anchored bottom-right */
.f-card:last-child .f-photo picture{
  display:flex;
  align-items:flex-end;
  justify-content:flex-end;
  width:100%;
  height:100%;
}
.f-card:last-child .f-photo img{
  width:auto;
  height:90%;
  max-width:none;
  object-fit:contain;
  object-position:right bottom;
  transform-origin:100% 100%;
  transform:scale(1.14);
}
/* soft scrim so the cut-out figures settle onto the card */
.f-photo::after{
  content:"";position:absolute;inset:auto 0 0 0;height:34%;
  background:linear-gradient(180deg,rgba(235,232,226,0) 0%,rgba(228,224,217,.55) 100%);
  pointer-events:none;
}
.f-body{padding:22px 22px 0;flex:1;display:flex;flex-direction:column}
.f-card h3{
  font-family:var(--disp);font-size:18px;font-weight:600;line-height:1.2;margin:0 0 10px;
}
.f-bio{
  font-size:13.5px;line-height:1.6;color:var(--mute);margin:0 0 18px;flex:1;
}
.f-foot{
  padding:14px 22px;border-top:1px solid var(--line);margin:0 -22px;
  font-size:12.5px;font-weight:600;color:var(--sea);
}

/* final */
.final{padding:0 0 110px}
.final-card{background:linear-gradient(120deg,var(--amber-soft),var(--sea-soft));border-radius:28px;padding:80px 40px;text-align:center}
.final h2{font-family:var(--disp);font-weight:600;font-size:clamp(28px,4vw,46px);max-width:20ch;margin:0 auto}
.final p{max-width:520px;margin:20px auto 38px;color:var(--mute)}
footer{padding:38px 0;border-top:1px solid var(--line)}
.foot{display:flex;justify-content:space-between;font-size:13.5px;color:var(--mute);font-weight:600}

@media(max-width:840px){
  .nav-links{display:none}
  .split{grid-template-columns:1fr}
  .f-grid{grid-template-columns:1fr}
  .vision-pts{grid-template-columns:1fr}
  .sci-flex{grid-template-columns:1fr;gap:40px}
  .hero{padding:64px 0 52px}
}
/* ================= POLISH 1 — INCHIOSTRO =================
   Monochrome editorial: the site takes its palette from the
   metallic logo itself. Ink + steel, zero pastel. Hierarchy
   is built with weight and space, not color. */
:root{
  --bg:#F6F5F1;
  --card:#FFFFFF;
  --ink:#14181D;
  --mute:#5B636C;
  --amber:#14181D;        /* docenti = ink */
  --amber-soft:#E9E6DF;
  --sea:#46586A;          /* studenti = steel */
  --sea-soft:#E2E6EA;
  --ink-dark:#0E1216;
  --line:rgba(20,24,29,.12);
  --logo-drop-a:#14181D;
  --logo-drop-b:#46586A;
  --logo-ripple:#14181D;
}
::selection{background:var(--ink);color:#fff}
.eyebrow b{color:var(--ink)}
.eyebrow i{color:var(--sea)}
.hl-a{background:linear-gradient(transparent 62%,var(--amber-soft) 62%)}
.hl-s{background:linear-gradient(transparent 62%,var(--sea-soft) 62%)}
.btn{border-radius:6px}
.btn-amber{background:var(--ink)}
.btn-sea{background:var(--sea)}
.side{border-radius:10px;border:1px solid var(--line)}
.side-docenti{background:#FFFFFF}
.side-studenti{background:#EDF0F3}
.side-docenti .who{color:var(--ink)}
.side-studenti .who{color:var(--sea)}
.side-docenti li::before,.side-studenti li::before{content:"—";font-size:14px;vertical-align:0}
.side-docenti li::before{color:var(--ink)}
.side-studenti li::before{color:var(--sea)}
.side .drop-deco path{fill:currentColor}
.side-docenti .drop-deco{color:var(--ink);opacity:.14}
.side-studenti .drop-deco{color:var(--sea);opacity:.2}
.vision .k{color:#8FA3B8}
.vision h2 em{color:#fff;border-bottom:3px solid #8FA3B8}
.vision h2 i{color:#fff;border-bottom:3px solid #55697E}
.vp .bar{display:none}
.vp h3{border-top:1px solid rgba(255,255,255,.25);padding-top:16px}
.sci-item{border-radius:8px}
.d1{background:var(--amber-soft);color:var(--ink)}
.d2{background:var(--sea-soft);color:var(--sea)}
.d3{background:#E9E6DF;color:#5B636C}
.final-card{background:var(--ink-dark);border-radius:14px}
.final h2{color:#fff}
.final p{color:rgba(255,255,255,.65)}
.final .btn{background:#fff;color:var(--ink)}