/* Frantoi Innovativi: pezzi propri sopra tokens.css e componenti.css del brand kit 1.0.
   Solo colori dei token. Eccezione dichiarata: la firma F2 è più piccola perché
   «Frantoi Innovativi» è lungo il doppio di «Nextfuture». */

/* Testata */
.fi-testa { position: sticky; top: 0; z-index: 20; background: color-mix(in srgb, var(--bg) 92%, transparent); backdrop-filter: blur(10px); border-bottom: 1px solid var(--line); }
.fi-testa .wrap { height: 72px; display: flex; align-items: center; justify-content: space-between; gap: 24px; }
.fi-logo img { height: 58px; width: auto; }
.fi-nav { display: flex; align-items: center; gap: 28px; font-weight: 600; font-size: 16px; }
.fi-nav a:not(.btn) { text-decoration: none; }
.fi-nav a[aria-current] { color: var(--brand); }
.fi-nav .btn { height: 44px; padding: 0 18px; font-size: 15px; }

section { padding: 96px 0; }
.fi-h2 { font-size: var(--t-h2); max-width: 820px; }
.fi-lead { margin-top: 18px; font-size: var(--t-lead); color: var(--muted); max-width: 640px; }
.fi-quando { display: flex; flex-wrap: wrap; gap: 6px 22px; font-size: 16px; color: var(--muted); }
.fi-quando b { color: var(--ink); }

/* Conto alla rovescia */
.fi-conto { display: flex; gap: 10px; }
.fi-conto > div { min-width: 76px; padding: 12px 10px 10px; border: 1px solid var(--line); border-radius: var(--r-md); text-align: center; background: var(--bg); }
.fi-conto b { display: block; font: var(--display-weight) 34px/1 var(--font-display); letter-spacing: -0.03em; font-variant-numeric: tabular-nums; }
.fi-conto span { display: block; margin-top: 6px; font-size: 13px; color: var(--muted); }
.ground-inverse .fi-conto > div { border-color: var(--deep-line); background: transparent; }
.fi-conto--grande > div { min-width: 0; flex: 1; border: 0; border-top: 2px solid var(--ink); border-radius: 0; text-align: left; padding: 18px 0 0; background: none; }
.fi-conto--grande b { font-size: clamp(64px, 11vw, 176px); letter-spacing: -0.05em; }
.fi-conto--grande span { font-size: 16px; }

/* Posti */
.fi-posti { font-size: 15px; color: var(--muted); }
.fi-posti b { color: var(--ink); }
.fi-barra { height: 6px; background: var(--line); border-radius: 3px; margin-top: 10px; overflow: hidden; }
.fi-barra i { display: block; height: 100%; background: var(--brand); border-radius: 3px; }

/* Copertina */
.fi-cop { border-radius: var(--r-lg); overflow: hidden; border: 1px solid var(--line); background: var(--surface); }
.fi-cop img { width: 100%; height: 100%; object-fit: cover; transition: transform .5s var(--ease); }
@media (hover: hover) { a:hover > .fi-cop img, .fi-card:hover .fi-cop img { transform: scale(1.025); } }

/* Vantaggi */
.fi-vant { display: grid; grid-template-columns: repeat(3, 1fr); gap: 40px; margin-top: 56px; }
.fi-vant > div { border-top: 1px solid var(--ink); padding-top: 22px; }
.fi-vant .n { font: var(--display-weight) 15px var(--font-text); color: var(--brand); }
.fi-vant h3 { font-size: var(--t-h3); margin-top: 10px; }
.fi-vant p { margin-top: 10px; color: var(--muted); }
.fi-vant--grandi .n { font: var(--display-weight) clamp(56px, 6vw, 88px)/1 var(--font-display); letter-spacing: -0.04em; color: var(--ink); }

/* Relatori e organizzatori */
.fi-rel { display: flex; flex-wrap: wrap; gap: 28px; }
.fi-rel > div { display: flex; align-items: center; gap: 14px; }
.fi-rel img, .fi-rel .ini { width: 56px; height: 56px; border-radius: 50%; object-fit: cover; flex: none; }
.fi-rel .ini { display: grid; place-items: center; background: var(--surface); font: var(--display-weight) 18px var(--font-display); color: var(--ink); border: 1px solid var(--line); }
.fi-rel b { display: block; font-size: 16px; }
.fi-rel span { font-size: 14px; color: var(--muted); }
.ground-inverse .fi-rel .ini { background: transparent; border-color: var(--deep-line); color: var(--deep-ink); }

/* Programma */
.fi-prog { list-style: none; margin: 0; padding: 0; }
.fi-prog li { display: grid; grid-template-columns: 96px 1fr; gap: 24px; padding: 20px 0; border-top: 1px solid var(--line); }
.fi-prog li:last-child { border-bottom: 1px solid var(--line); }
.fi-prog time { font: var(--display-weight) 22px var(--font-display); letter-spacing: -0.02em; }
.fi-prog b { display: block; font-size: 18px; }
.fi-prog span { color: var(--muted); }

/* Schede degli eventi */
.fi-griglia { display: grid; grid-template-columns: repeat(4, 1fr); gap: 28px 24px; margin-top: 48px; }
.fi-card { display: block; text-decoration: none; transition: transform var(--m-card) var(--ease); }
.fi-card .fi-cop { aspect-ratio: 768 / 381; border-radius: var(--r-md); }
.fi-card .meta { margin-top: 14px; font-size: 14px; color: var(--muted); display: flex; gap: 14px; }
.fi-card .meta .stato { color: var(--brand); font-weight: 700; }
.fi-card h3 { font-size: 19px; line-height: 1.3; letter-spacing: -0.015em; margin-top: 6px; }
.fi-card .gratis { margin-top: 8px; font-size: 14px; color: var(--muted); }
@media (hover: hover) { .fi-card:hover { transform: translateY(-2px); } }
.fi-testa-sez { display: flex; justify-content: space-between; align-items: end; gap: 24px; }

/* Ricerca e filtro (pagina eventi) */
.fi-filtri { display: flex; flex-wrap: wrap; gap: 16px 28px; align-items: end; justify-content: space-between; margin-top: 40px; padding-bottom: 24px; border-bottom: 1px solid var(--line); }
.fi-filtri .campo { width: min(420px, 100%); }
.fi-schede { display: flex; gap: 0; border: 1px solid var(--line-strong); border-radius: 6px; overflow: hidden; }
.fi-schede button { height: 44px; padding: 0 18px; border: 0; background: var(--bg); font: 600 15px var(--font-text); color: var(--muted); cursor: pointer; }
.fi-schede button + button { border-left: 1px solid var(--line-strong); }
.fi-schede button[aria-pressed="true"] { background: var(--ink); color: var(--bg); }

/* Newsletter */
.fi-news { display: flex; gap: 12px; margin-top: 28px; max-width: 560px; }
.fi-news .campo { flex: 1; }

/* Modulo d'iscrizione */
.fi-modulo { border: 1px solid var(--line); border-radius: var(--r-lg); padding: 36px; background: var(--bg); box-shadow: 0 30px 60px -40px color-mix(in srgb, var(--ink) 45%, transparent); }
.fi-modulo h3 { font-size: 28px; }
.fi-modulo .campi { margin-top: 24px; }
.fi-modulo .spunta { margin-top: 18px; }
.fi-modulo .btn { width: 100%; margin-top: 22px; }

/* Footer F2 con la firma lunga */
.f2-firma.fi-firma { font-size: clamp(44px, 10.2vw, 156px); }
.f2 .f2-frase { max-width: 420px; }

@media (max-width: 1100px) { .fi-griglia { grid-template-columns: repeat(3, 1fr); } }
@media (max-width: 900px) {
  section { padding: 64px 0; }
  .fi-vant { grid-template-columns: 1fr; gap: 28px; margin-top: 36px; }
  .fi-griglia { grid-template-columns: 1fr 1fr; }
  .fi-nav a:not(.btn) { display: none; }
}
@media (max-width: 560px) {
  .fi-griglia { grid-template-columns: 1fr; }
  .fi-conto > div { min-width: 0; flex: 1; }
  .fi-conto b { font-size: 28px; }
  .fi-prog li { grid-template-columns: 64px 1fr; gap: 14px; }
  .fi-news { flex-direction: column; }
  .fi-modulo { padding: 24px; }
  .fi-testa .wrap { height: 64px; }
  .fi-logo img { height: 38px; }
}
.sr { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }

/* «by Nextfuture» accanto al logo */
.fi-logo { display: flex; align-items: center; gap: 14px; text-decoration: none; }
.fi-by { padding-left: 14px; border-left: 1px solid var(--line-strong); font-size: 14px; color: var(--muted); white-space: nowrap; }
.fi-by b { font-family: var(--font-display); font-weight: 600; color: var(--ink); }
.fi-testa--scura .fi-by { border-left-color: var(--deep-line); color: var(--deep-muted); }
.fi-testa--scura .fi-by b { color: var(--deep-ink); }

/* Il logo Nextfuture al posto della scritta «by Nextfuture» */
.fi-by img { height: 26px; width: auto; display: block; }
