
/* Breadcrumb più vicino al titolo */
.phead--slim{ padding-bottom:0; }
.phead--slim .phead__crumbs{ margin-bottom:clamp(22px,3vw,34px); }

/* ── Chi siamo — Hero "la storia" ─────────────────── */
.chero{ position:relative; background:var(--accent); }
.chero__media{ position:absolute; inset:0; }
.chero__media img{ width:100%; height:100%; object-fit:cover; object-position:center; filter:saturate(.82) brightness(.66) contrast(1.05); }
.chero__scrim{
  position:absolute; inset:0;
  background:
    linear-gradient(72deg, rgba(9,11,24,0.92) 0%, rgba(9,11,24,0.70) 30%, rgba(9,11,24,0.28) 60%, rgba(9,11,24,0.04) 82%),
    linear-gradient(0deg, rgba(9,11,24,0.88) 0%, rgba(9,11,24,0.32) 42%, rgba(9,11,24,0) 72%);
}
.chero__inner{
  position:relative; z-index:2; min-height:clamp(480px,74vh,760px);
  display:flex; flex-direction:column; justify-content:flex-end;
  padding-bottom:clamp(48px,7vw,104px); color:#fff;
}
.chero__crumbs{
  font-family:var(--mono); font-size:11px; letter-spacing:0.16em; text-transform:uppercase;
  color:rgba(255,255,255,0.6); display:flex; align-items:center; gap:10px;
  margin-bottom:auto; padding-top:clamp(30px,4.5vw,52px);
}
.chero__crumbs a{ transition:color .2s ease; }
.chero__crumbs a:hover{ color:#fff; }
.chero__crumbs span{ opacity:.5; }
.chero__eyebrow{
  font-family:var(--mono); font-size:12px; letter-spacing:0.22em; text-transform:uppercase;
  color:rgba(255,255,255,0.82); display:inline-flex; align-items:center; gap:12px;
}
.chero__eyebrow::before{ content:""; width:26px; height:1px; background:currentColor; opacity:.6; }
.chero__title{
  font-family:var(--display); font-weight:700; letter-spacing:-0.03em;
  font-size:clamp(40px,6.6vw,94px); line-height:0.98; margin-top:22px; text-wrap:balance; max-width:18ch;
}
.chero__title em{ font-style:normal; color:#e4a9a3; }
.chero__lead{
  margin-top:24px; font-size:clamp(16px,1.3vw,19px); line-height:1.62;
  color:rgba(255,255,255,0.86); max-width:52ch;
}

/* ── Storia: narrazione sotto l'hero ─────────────── */
.story{ padding:0 0 clamp(48px,7vw,96px); }

.story__top{
  display:grid; grid-template-columns:1fr 0.82fr; gap:clamp(32px,5vw,72px);
  align-items:start; margin-bottom:clamp(34px,4.5vw,60px);
}
@media (max-width:820px){ .story__top{ grid-template-columns:1fr; gap:clamp(22px,4vw,32px); } }
.story__num{
  font-family:var(--mono); font-size:11.5px; letter-spacing:0.2em; text-transform:uppercase;
  color:var(--accent-2); display:block; margin-bottom:18px;
}
.story__dek{
  font-family:var(--display); font-weight:600; letter-spacing:-0.01em;
  font-size:clamp(22px,2.4vw,34px); line-height:1.2; color:var(--ink); text-wrap:balance;
  max-width:22ch;
}
.story__body{ display:grid; grid-template-columns:1fr 1fr; gap:clamp(40px,4.5vw,72px); align-items:start; }
@media (max-width:820px){ .story__body{ grid-template-columns:1fr; gap:clamp(24px,4vw,32px); } }
.story__ch + .story__ch{ margin-top:clamp(22px,2.4vw,32px); }
.story__cont{ margin-bottom:clamp(22px,2.4vw,32px); }
.story__chtitle{
  font-family:var(--display); font-weight:700; letter-spacing:-0.01em;
  font-size:clamp(16.5px,1.35vw,20px); line-height:1.15; color:var(--accent-2);
  margin:0 0 9px;
}
.story__body p{ font-size:clamp(16.5px,1.2vw,18.5px); line-height:1.75; color:var(--ink-soft); text-align:justify; hyphens:auto; }
.story__body p + p{ margin-top:20px; }
.story__body strong{ color:var(--ink); font-weight:600; }
.story__body b{ color:var(--ink); font-weight:600; }
.story__figure{ margin:0; }
.story__figure img{
  display:block; width:100%; height:auto; aspect-ratio:1400/1024;
  object-fit:cover; border:1px solid var(--line);
}
.story__figcap{
  margin-top:14px; font-family:var(--mono); font-size:12px; letter-spacing:0.04em;
  color:var(--ink-soft); line-height:1.5; font-style:italic; text-align:center;
}
.story__figcap b{ color:var(--ink-soft); font-weight:400; }
@media (max-width:820px){ .story__figure{ margin-top:clamp(6px,2vw,14px); } }

/* ── Timeline a step ─────────────────────────────── */
.steps{ background:#f5f6fb; border-top:1px solid var(--line); padding:clamp(52px,7vw,104px) 0; }
.steps__head{ max-width:60ch; margin-bottom:clamp(40px,5vw,64px); }
.steps__title{
  font-family:var(--display); font-weight:700; letter-spacing:-0.03em;
  font-size:clamp(30px,4.2vw,56px); line-height:1.02; color:var(--ink); margin-top:18px; text-wrap:balance;
}
.steps__head .eyebrow::before,
.principi__head .eyebrow::before,
.premi__head .eyebrow::before{ display:none; }
/* ── Linea del tempo (orizzontale; verticale su mobile) ── */
.tl{
  list-style:none; margin:clamp(6px,1vw,14px) 0 0; padding:0; position:relative;
  display:grid; grid-template-columns:repeat(6,1fr);
}
.tl::before{
  content:""; position:absolute; top:42px; left:9px; right:calc(100% / 6 - 9px); height:2px;
  background:var(--line); transform:scaleX(0); transform-origin:left;
  transition:transform 1.2s cubic-bezier(.4,0,.2,1);
}
.tl.in::before{ transform:scaleX(1); }
.tl__item{ position:relative; padding-right:clamp(14px,1.6vw,28px); }
.tl__year{
  display:block; height:24px; line-height:24px;
  font-family:var(--display); font-weight:700; font-size:12.5px; letter-spacing:0.06em;
  text-transform:uppercase; color:var(--accent-2);
  opacity:0; transform:translateY(8px); transition:opacity .55s ease, transform .55s ease;
}
.tl__dot{
  display:block; width:18px; height:18px; border-radius:50%;
  background:var(--accent); border:3px solid var(--bg); box-shadow:0 0 0 1px var(--line);
  margin:10px 0 18px; position:relative; z-index:2;
  transform:scale(0); transition:transform .55s cubic-bezier(.34,1.56,.64,1);
}
.tl.in .tl__dot{ transform:scale(1); }
.tl__content{ opacity:0; transform:translateY(10px); transition:opacity .55s ease, transform .55s ease; }
.tl.in .tl__year, .tl.in .tl__content{ opacity:1; transform:none; }
.tl__item .tl__dot,
.tl__item .tl__year,
.tl__item .tl__content{ transition-delay:calc(var(--i,0) * 110ms + 220ms); }
.tl__title{
  font-family:var(--display); font-weight:700; letter-spacing:-0.01em;
  font-size:clamp(16px,1.4vw,20px); line-height:1.16; color:var(--ink);
}
.tl__note{ font-size:clamp(13px,0.95vw,14.5px); line-height:1.5; color:var(--ink-soft); margin-top:6px; }

@media (max-width:900px){
  .tl{ grid-template-columns:1fr; }
  .tl::before{ top:10px; bottom:10px; left:8px; right:auto; width:2px; height:auto;
    transform:scaleY(0); transform-origin:top; }
  .tl.in::before{ transform:scaleY(1); }
  .tl__item{ display:grid; grid-template-columns:auto 1fr; column-gap:18px; padding:13px 0 0; }
  .tl__year{ grid-column:2; grid-row:1; height:auto; line-height:1.3; }
  .tl__dot{ grid-column:1; grid-row:1 / span 2; margin:2px 0 0; align-self:start; }
  .tl__content{ grid-column:2; grid-row:2; margin-top:4px; }
}
@media (prefers-reduced-motion:reduce){
  .tl::before{ transform:none; }
  .tl__dot{ transform:scale(1); }
  .tl__year, .tl__content{ opacity:1; transform:none; }
}

/* ── Principi (scheda tecnica: bordo tracciato + tacche + icona) ── */
.principi{ padding:clamp(56px,8vw,110px) 0; }
.principi__head{ display:flex; justify-content:space-between; align-items:flex-end; gap:32px; flex-wrap:wrap; margin-bottom:clamp(40px,5vw,64px); }
.principi__title{ font-family:var(--display); font-weight:700; letter-spacing:-0.03em; font-size:clamp(28px,3.6vw,48px); line-height:1.04; color:var(--ink); margin-top:16px; }
.principi__grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:16px; }
@media (max-width:820px){ .principi__grid{ grid-template-columns:1fr; } }
.principio{ position:relative; border:1px solid transparent; padding:clamp(24px,2.4vw,34px); }
.principio__trace{ position:absolute; inset:0; width:100%; height:100%; overflow:visible; pointer-events:none; }
.principio__trace rect{ fill:none; stroke:var(--accent); stroke-width:1.4; stroke-dasharray:100 100; stroke-dashoffset:0; }
.principio__tk{
  position:absolute; width:11px; height:11px; border:0 solid var(--accent-2);
  transition:width .28s cubic-bezier(.2,.7,.2,1), height .28s cubic-bezier(.2,.7,.2,1);
}
.principio:hover .principio__tk{ width:17px; height:17px; }
.principio__tk--tl{ top:-1px; left:-1px; border-top-width:2px; border-left-width:2px; }
.principio__tk--tr{ top:-1px; right:-1px; border-top-width:2px; border-right-width:2px; }
.principio__tk--bl{ bottom:-1px; left:-1px; border-bottom-width:2px; border-left-width:2px; }
.principio__tk--br{ bottom:-1px; right:-1px; border-bottom-width:2px; border-right-width:2px; }
.principio__ico{ display:block; width:26px; height:26px; color:var(--accent); margin-bottom:18px; transition:color .28s; }
.principio:hover .principio__ico{ color:var(--accent-2); }
.principio__ico svg{ width:100%; height:100%; display:block; }
/* entrata: card a cascata, bordo che si traccia, poi tacche e icona */
@media (prefers-reduced-motion:no-preference){
  .principi__grid .principio{ opacity:0; }
  .principi__grid.in .principio{ opacity:1; animation:princIn .55s cubic-bezier(.2,.7,.2,1) backwards; }
  .principi__grid.in .principio:nth-child(2){ animation-delay:.09s }
  .principi__grid.in .principio:nth-child(3){ animation-delay:.18s }
  @keyframes princIn{ from{ opacity:0; transform:translateY(14px); } }
  .principi__grid .principio__trace rect{ stroke-dashoffset:100; }
  .principi__grid.in .principio__trace rect{ animation:princDraw .85s cubic-bezier(.4,.1,.2,1) .2s forwards; }
  .principi__grid.in .principio:nth-child(2) .principio__trace rect{ animation-delay:.35s; }
  .principi__grid.in .principio:nth-child(3) .principio__trace rect{ animation-delay:.5s; }
  @keyframes princDraw{ to{ stroke-dashoffset:0; } }
  .principi__grid .principio__tk,
  .principi__grid .principio__ico{ opacity:0; }
  .principi__grid.in .principio__tk,
  .principi__grid.in .principio__ico{ animation:princTkIn .3s ease-out 1s forwards; }
  .principi__grid.in .principio:nth-child(2) .principio__tk,
  .principi__grid.in .principio:nth-child(2) .principio__ico{ animation-delay:1.15s; }
  .principi__grid.in .principio:nth-child(3) .principio__tk,
  .principi__grid.in .principio:nth-child(3) .principio__ico{ animation-delay:1.3s; }
  @keyframes princTkIn{ to{ opacity:1; } }
}
.principio__h{ font-family:var(--display); font-weight:700; font-size:clamp(20px,1.8vw,25px); letter-spacing:-0.01em; line-height:1.12; color:var(--ink); margin:0 0 12px; }
.principio__p{ font-size:15px; line-height:1.68; color:var(--ink-soft); }

/* ── Premi e riconoscimenti ─────────────────────── */
.premi{ background:#f5f6fb; border-top:1px solid var(--line); padding:clamp(56px,8vw,110px) 0; }
.premi__head{ display:flex; justify-content:space-between; align-items:flex-end; gap:32px; flex-wrap:wrap; margin-bottom:clamp(36px,5vw,60px); }
.premi__title{ font-family:var(--display); font-weight:700; letter-spacing:-0.03em; font-size:clamp(28px,3.6vw,48px); line-height:1.04; color:var(--ink); margin-top:16px; }
.premi__lead{ font-size:16px; line-height:1.6; color:var(--ink-soft); max-width:40ch; }
.premi__grid{ display:grid; grid-template-columns:repeat(4,1fr); gap:clamp(18px,2vw,28px); }
@media (max-width:1080px){ .premi__grid{ grid-template-columns:repeat(3,1fr); } }
@media (max-width:760px){ .premi__grid{ grid-template-columns:repeat(2,1fr); } }
@media (max-width:440px){ .premi__grid{ grid-template-columns:1fr; } }
.premio{ display:flex; flex-direction:column; margin:0; }
.premio__frame{
  position:relative; width:100%; aspect-ratio:4/3; border:1px solid var(--line);
  background:linear-gradient(158deg,#fcfcfe 0%,#e8eaf2 100%);
  display:grid; place-items:center; padding:clamp(11px,1.3vw,17px); overflow:hidden;
  cursor:zoom-in; text-align:initial;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.75), 0 1px 2px rgba(30,37,80,.05);
  transition:box-shadow .3s ease, transform .3s ease;
}
.premio__frame img{
  width:100%; height:100%; object-fit:contain;
  filter:drop-shadow(0 6px 15px rgba(30,37,80,.18));
  transition:transform .45s cubic-bezier(.2,.7,.2,1);
}
.premio__frame:hover{ box-shadow: inset 0 1px 0 rgba(255,255,255,.75), 0 12px 28px rgba(30,37,80,.15); }
.premio__frame:hover img{ transform:scale(1.035); }
.premio__frame:focus-visible{ outline:2px solid var(--accent-2); outline-offset:2px; }
.premio__cap{ padding-top:15px; }
.premio__meta{ display:flex; align-items:center; gap:9px; margin-bottom:7px; flex-wrap:wrap; }
.premio__year{ font-family:var(--mono); font-size:11.5px; letter-spacing:0.14em; color:var(--accent-2); }
.premio__meta::before{ content:none; }
.premio__brand{ font-family:var(--mono); font-size:10.5px; letter-spacing:0.12em; text-transform:uppercase; color:var(--muted); }
.premio__year + .premio__brand{ padding-left:9px; border-left:1px solid var(--line); }
.premio__name{ font-family:var(--display); font-weight:700; letter-spacing:-0.01em; font-size:clamp(15px,1.1vw,17px); line-height:1.24; color:var(--ink); text-wrap:balance; }
@media (prefers-reduced-motion:no-preference){
  .premi__grid .premio{ opacity:0; }
  .premi__grid.in .premio{ opacity:1; animation:princIn .5s cubic-bezier(.2,.7,.2,1) backwards; }
  .premi__grid.in .premio:nth-child(2){ animation-delay:.06s }
  .premi__grid.in .premio:nth-child(3){ animation-delay:.12s }
  .premi__grid.in .premio:nth-child(4){ animation-delay:.18s }
  .premi__grid.in .premio:nth-child(5){ animation-delay:.24s }
  .premi__grid.in .premio:nth-child(6){ animation-delay:.30s }
  .premi__grid.in .premio:nth-child(7){ animation-delay:.36s }
  .premi__grid.in .premio:nth-child(8){ animation-delay:.42s }
}

/* ── Lightbox premi ──────────────────────────────── */
.lightbox{
  position:fixed; inset:0; z-index:200; display:none;
  place-items:center; padding:clamp(18px,4vw,56px);
  background:rgba(12,14,30,.93); opacity:0; transition:opacity .28s ease;
}
.lightbox.open{ display:grid; opacity:1; }
.lightbox__fig{ margin:0; display:flex; flex-direction:column; align-items:center; gap:16px; max-width:100%; }
.lightbox__img{
  max-width:min(1000px,92vw); max-height:78vh; width:auto; height:auto;
  box-shadow:0 34px 90px rgba(0,0,0,.55); background:#fff;
}
.lightbox__cap{
  font-family:var(--mono); font-size:12px; letter-spacing:0.06em; color:rgba(255,255,255,.82);
  text-align:center; max-width:60ch;
}
.lightbox__cap b{ color:#fff; font-weight:600; }
.lightbox__cap span{ color:var(--accent-2); }
.lightbox__close{
  position:absolute; top:22px; right:26px; width:44px; height:44px;
  display:grid; place-items:center; background:rgba(255,255,255,.1); border:1px solid rgba(255,255,255,.24);
  color:#fff; font-size:18px; border-radius:50%; transition:background .2s ease;
}
.lightbox__close:hover{ background:rgba(255,255,255,.22); }
.lightbox__arrow{
  position:absolute; top:50%; transform:translateY(-50%); width:52px; height:52px;
  display:grid; place-items:center; background:rgba(255,255,255,.08); border:1px solid rgba(255,255,255,.22);
  color:#fff; font-size:26px; line-height:1; border-radius:50%; transition:background .2s ease;
}
.lightbox__arrow:hover{ background:rgba(255,255,255,.2); }
.lightbox__arrow--prev{ left:clamp(12px,3vw,40px); }
.lightbox__arrow--next{ right:clamp(12px,3vw,40px); }
@media (max-width:600px){ .lightbox__arrow{ width:42px; height:42px; font-size:20px; } }
