/* ITSME home (WP2): hero cinematografico + bande del design system (ds-*).
   Anton è definito una sola volta in design-system.css. */
main.it-home {
  --it-ink: var(--ds-ink-900);
  --it-paper: var(--ds-text);
  --it-lime: var(--ds-lime);
  --it-muted: var(--ds-text-2);
  --it-rule: var(--ds-line-strong);
  --it-gutter: var(--ds-gutter);
  --it-display: var(--ds-font-display);
  width: 100%;
  max-width: none;
  margin: 0;
  padding: 0;
  overflow: clip;
  background: var(--ds-ink-900);
  color: var(--ds-text);
  isolation: isolate;
}
main.it-home::before,
main.it-home::after { display: none; }
.it-home *, .it-home *::before, .it-home *::after { box-sizing: border-box; }
.it-home section { position: relative; }
.it-home :is(h1, h2, h3, p, figure, dl, dd) { margin: 0; }
.it-home img { display: block; max-width: 100%; }
.it-home .it-home-arrow { flex: none; width: 20px; height: 20px; transition: transform var(--ds-dur-2) var(--ds-ease); }
.it-home-actions { display: flex; align-items: center; flex-wrap: wrap; gap: var(--ds-space-4); }
.it-home .ds-btn { text-decoration: none; }
.it-home .ds-btn--ghost { color: var(--ds-lime); }
.it-home .ds-display em, .it-home .ds-card em { color: var(--ds-lime); font-style: normal; }

/* ------------------------------------------------------------------ hero (composizione invariata) */
.it-home-hero { min-height: 620px; height: clamp(580px, 40.7vw, 740px); border-bottom: 1px solid var(--ds-line); overflow: hidden; isolation: isolate; }
.it-home-scene { position: absolute; z-index: -2; inset: 0 0 0 29%; overflow: hidden; }
.it-home-scene img { width: 100%; height: 100%; max-width: none; object-fit: cover; object-position: 56% center; transform: scale(1.035) translate(calc(var(--hero-x, 0px) * -.5), calc(var(--hero-y, 0px) * -.5)); }
.it-home-scene::after { content: ''; position: absolute; inset: 0; background: linear-gradient(90deg, var(--ds-ink-900) 0%, rgba(11, 10, 9, .84) 12%, rgba(11, 10, 9, .3) 37%, transparent 63%); }
.it-home-wordmark { position: absolute; z-index: -1; top: 8px; right: -15px; color: transparent; -webkit-text-stroke: 1px rgba(243, 240, 231, .55); font: italic 400 clamp(130px, 19vw, 320px)/1 var(--ds-font-display); letter-spacing: -.04em; pointer-events: none; user-select: none; }
.it-home-agent { position: absolute; z-index: 0; top: -23px; left: 35%; width: 750px; height: 1250px; object-fit: contain; object-position: center top; pointer-events: none; transform: translate(var(--hero-x, 0px), var(--hero-y, 0px)); }
.it-home-hero-copy { position: relative; z-index: 1; display: flex; flex-direction: column; align-items: flex-start; justify-content: center; width: min(61%, 935px); height: 100%; min-height: inherit; padding: 44px 0 54px var(--ds-gutter); }
.it-home-hero-copy h1 { font: 400 var(--ds-display-xl)/1.02 var(--ds-font-display); letter-spacing: -.022em; text-transform: uppercase; }
.it-home-hero-copy h1 span { display: block; }
.it-home-hero-copy h1 span:last-child { color: var(--ds-lime); }
.it-home-hero-copy > p { max-width: 535px; margin: 24px 0 28px; color: var(--ds-text); font-size: clamp(17px, 1.55vw, 24px); line-height: 1.5; text-wrap: pretty; }
.it-home .it-home-outline { border-color: rgba(243, 240, 231, .85); background: rgba(5, 8, 11, .35); color: var(--ds-text); }
/* I tre giochi sotto i pulsanti: link semplici, non bottoni. */
.it-home-hero-games { display: flex; flex-wrap: wrap; gap: var(--ds-space-2) var(--ds-space-3); margin: var(--ds-space-5) 0 0; padding: 0; list-style: none; }
.it-home-hero-chip { display: inline-flex; align-items: center; gap: 8px; min-height: 40px; padding: 4px 12px 4px 4px; border: 1px solid var(--ds-line); border-radius: var(--ds-r-pill); background: rgba(5, 8, 11, .55); color: var(--ds-text); font-size: var(--ds-text-sm); font-weight: 700; text-decoration: none; }
.it-home-hero-chip img, .it-home-hero-chip b { flex: none; width: 30px; height: 30px; border-radius: 50%; object-fit: cover; object-position: 50% 15%; background: var(--ds-ink-800); }
.it-home-hero-chip b { display: grid; place-items: center; color: var(--ds-lime); font: 400 13px/1 var(--ds-font-display); }
.it-home-hero-chip:hover { border-color: var(--ds-line-strong); }

/* Con l'accesso: saluto breve al posto dell'hero. */
.it-home-hello { display: flex; flex-wrap: wrap; align-items: end; justify-content: space-between; gap: var(--ds-space-4) var(--ds-space-6); margin-bottom: var(--ds-space-6); }
.it-home-hello__copy { display: grid; justify-items: start; gap: var(--ds-space-3); min-width: 0; }
.it-home-hello h1 { overflow-wrap: anywhere; }
.it-home-hello__copy > p:last-child { color: var(--ds-text-2); font-size: 17px; line-height: 1.5; }
.it-home-today { padding-block: var(--ds-space-7) var(--ds-section-y); }

/* ------------------------------------------------------------------ bande */
.it-home-band { padding-block: var(--ds-section-y); border-top: 1px solid var(--ds-line); }
.it-home-hero + .it-home-band { border-top: 0; }
.it-home-head { display: flex; flex-wrap: wrap; align-items: end; justify-content: space-between; gap: var(--ds-space-4) var(--ds-space-6); margin-bottom: var(--ds-space-7); }
.it-home-head__copy { display: grid; justify-items: start; gap: var(--ds-space-4); min-width: 0; max-width: 980px; }
.it-home .ds-eyebrow { flex-wrap: nowrap; max-width: 100%; white-space: nowrap; }
@media (max-width: 559.98px) { .it-home .ds-eyebrow { white-space: normal; } }
.it-home-head h2 { overflow-wrap: anywhere; }
.it-home-head__lede { max-width: 60ch; color: var(--ds-text-2); font-size: 17px; line-height: 1.55; text-wrap: pretty; }
.it-home-dot { color: var(--ds-lime); }

/* Errore 5xx: "non disponibile · Riprova", distinto dallo stato vuoto. */
.it-home-retry { position: relative; z-index: 2; display: flex; flex-wrap: wrap; align-items: center; gap: 2px var(--ds-space-2); padding: 2px var(--ds-space-3); border-left: 3px solid var(--ds-red); border-radius: var(--ds-r-1); background: var(--ds-ink-800); color: var(--ds-text-2); font-size: var(--ds-text-sm); line-height: 1.3; }
.it-home-retry button { min-height: var(--ds-tap); padding: 0 4px; border: 0; background: none; color: var(--ds-lime); font: 700 var(--ds-text-sm)/1 var(--ds-font-body); text-decoration: underline; text-underline-offset: 4px; cursor: pointer; }

/* ------------------------------------------------------------------ come funziona (senza accesso) */
.it-home-flow-band { padding-block: var(--ds-space-6) var(--ds-space-7); border-bottom: 1px solid var(--ds-line); }
.it-home-flow { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); margin: var(--ds-space-5) 0 0; padding: 0; list-style: none; }
.it-home-flow li { display: flex; align-items: flex-start; gap: var(--ds-space-5); min-width: 0; padding: 4px var(--ds-space-6); border-left: 1px solid var(--ds-line); }
.it-home-flow li:first-child { padding-left: 0; border-left: 0; }
.it-home-flow li:last-child { padding-right: 0; }
.it-home-flow li > b { color: var(--ds-lime); font: 400 40px/1 var(--ds-font-display); }
.it-home-flow li > span { display: grid; justify-items: start; gap: 6px; }
.it-home-flow strong { color: var(--ds-text); font-size: 17px; font-weight: 700; line-height: 1.3; }
.it-home-flow small { color: var(--ds-text-2); font-size: var(--ds-text-sm); line-height: 1.5; }
.it-home-flow .ds-btn { margin-top: var(--ds-space-2); }

/* ------------------------------------------------------------------ la tua giornata */
.it-home-today-grid { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.2fr); gap: var(--ds-space-5); align-items: start; }
.it-home-me { gap: var(--ds-space-5); }
.it-home-me__id { display: flex; align-items: center; gap: var(--ds-space-4); min-width: 0; }
.it-home-me__id > div { display: grid; gap: 4px; min-width: 0; }
.it-home-me__id strong { font: 400 var(--ds-display-s)/1 var(--ds-font-display); text-transform: uppercase; overflow-wrap: anywhere; }
.it-home-me__id small { color: var(--ds-text-2); font-size: var(--ds-text-sm); }
.it-home-me__xp { display: grid; gap: var(--ds-space-2); }
.it-home-me__xp span { color: var(--ds-text-3); font-size: var(--ds-text-xs); }
.it-home-me__stats { margin: 0; }
.it-home-me__stats dd { margin: 0; }

.it-home-me__actions { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: var(--ds-space-3); }
.it-home-glow { box-shadow: var(--ds-glow-lime); }
.it-home-turn { gap: var(--ds-space-4); }
.it-home-turn .ds-eyebrow .ds-dot { box-shadow: 0 0 0 4px var(--ds-lime-soft); }
.it-home-turn.is-hot { border-color: var(--ds-lime-line); background: linear-gradient(180deg, var(--ds-lime-soft), rgba(216, 172, 64, 0) 55%), var(--ds-ink-850); }
.it-home-turn__title { font: 400 var(--ds-display-m)/.95 var(--ds-font-display); text-transform: uppercase; }
.it-home-turn__rows { min-height: 64px; }
.it-home-turn__rows .ds-row { text-decoration: none; }
.it-home :is(.ds-row__title, .ds-row__meta) { display: block; }
.it-home-turn__lead { border: 1px solid var(--ds-line-strong); border-top: 2px solid var(--turn-accent, var(--ds-lime)); border-radius: var(--ds-r-1); color: var(--ds-text); font: 400 18px/1 var(--ds-font-display); }
.it-home-turn__lead[data-game="chess"] { --turn-accent: var(--ds-red); }
.it-home-turn__lead[data-game="tris"] { --turn-accent: var(--ds-site-a); }
.it-home-turn__lead[data-game="ecorush"] { --turn-accent: var(--ds-rarity-legend); }
.it-home-turn__empty { color: var(--ds-text-2); font-size: 15px; line-height: 1.5; }
.it-home-turn__actions { display: grid; grid-template-columns: auto minmax(0, 1fr); align-items: center; gap: var(--ds-space-3); padding-top: var(--ds-space-2); }
.it-home-puzzle-line { display: grid; grid-template-columns: auto minmax(0, 1fr) auto; align-items: center; gap: var(--ds-space-3); min-height: 56px; padding: var(--ds-space-2) var(--ds-space-3); border: 1px solid var(--ds-line); border-radius: var(--ds-r-1); color: var(--ds-text); text-decoration: none; transition: border-color var(--ds-dur-2) var(--ds-ease); }
.it-home-puzzle-line:hover { border-color: var(--ds-line-strong); }
.it-home-puzzle-line > span:nth-child(2) { display: grid; gap: 2px; min-width: 0; }
.it-home-puzzle-line strong { font-size: var(--ds-text-sm); font-weight: 700; }
.it-home-puzzle-line small { overflow: hidden; color: var(--ds-text-2); font-size: var(--ds-text-xs); text-overflow: ellipsis; white-space: nowrap; }
.it-home-puzzle-line .it-home-arrow { color: var(--ds-lime); }

.it-home-card-title { font: 400 var(--ds-display-s)/1 var(--ds-font-display); text-transform: uppercase; }
.it-home-me__head { display: flex; flex-wrap: wrap; align-items: baseline; justify-content: space-between; gap: var(--ds-space-2) var(--ds-space-4); }
.it-home-me__level { color: var(--ds-lime); font-size: var(--ds-text-sm); font-weight: 700; text-decoration: none; }
.it-home-me__level:hover { text-decoration: underline; text-underline-offset: 4px; }
.it-home-me__bonus { display: flex; flex-wrap: wrap; align-items: center; gap: var(--ds-space-2) var(--ds-space-4); }
.it-home-me__bonus small { color: var(--ds-text-2); font-size: var(--ds-text-xs); }
.it-home-missions { margin: 0; }
.it-home-missions .ds-row { --ds-row-action: auto; min-height: 56px; }
.it-home-missions .ds-row__title { font-size: var(--ds-text-sm); }
.it-home-me__done { display: flex; align-items: center; gap: var(--ds-space-2); color: var(--ds-lime); font-size: var(--ds-text-sm); font-weight: 700; }
.it-home-me__note { color: var(--ds-text-2); font-size: var(--ds-text-xs); line-height: 1.5; }
.it-home-me__note a { color: var(--ds-lime); font-weight: 700; }
.it-home-turn__wait { --ds-row-action: auto; }
.it-home-turn__wait-link { display: grid; min-width: 0; color: inherit; text-decoration: none; }
.it-home-turn__wait .ds-row__action { white-space: nowrap; }
.it-home-turn__rows .ds-row[data-kind="invite"] .ds-row__title { color: var(--ds-lime); }
.it-home-turn__note { grid-column: 1 / -1; color: var(--ds-text-2); font-size: var(--ds-text-xs); line-height: 1.45; }
.it-home-turn__actions { grid-template-columns: minmax(0, auto); justify-content: start; }

/* Primi passi (nuovi membri). */
.it-home-welcome { gap: var(--ds-space-4); margin-bottom: var(--ds-space-5); border-color: var(--ds-lime-line); background: linear-gradient(135deg, var(--ds-lime-soft), rgba(216, 172, 64, 0) 60%), var(--ds-ink-850); }
.it-home-welcome__head { display: flex; align-items: flex-start; justify-content: space-between; gap: var(--ds-space-4); }
.it-home-welcome__head > div { display: grid; gap: var(--ds-space-2); }
.it-home-welcome__title { font: 400 var(--ds-display-s)/1 var(--ds-font-display); text-transform: uppercase; }
.it-home-welcome__title em { color: var(--ds-lime); font-style: normal; }
.it-home-welcome__close { flex: none; }
.it-home-welcome__steps { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--ds-space-3); margin: 0; padding: 0; list-style: none; }
.it-home-welcome__steps li { display: grid; grid-template-columns: auto minmax(0, 1fr); align-items: start; gap: var(--ds-space-2) var(--ds-space-3); padding: var(--ds-space-4); border: 1px solid var(--ds-line); border-radius: var(--ds-r-1); background: rgba(5, 8, 11, .35); }
.it-home-welcome__steps li[data-done] { border-color: var(--ds-lime-line); }
.it-home-welcome__steps li > :is(.ds-btn, .it-home-welcome__ok, .it-home-welcome__where) { grid-column: 2; justify-self: start; }
.it-home-welcome__copy { display: grid; gap: 4px; min-width: 0; }
.it-home-welcome__copy strong { font-size: var(--ds-text-sm); font-weight: 700; line-height: 1.35; }
.it-home-welcome__copy small { color: var(--ds-text-2); font-size: var(--ds-text-xs); line-height: 1.45; }
.it-home-welcome__ok { color: var(--ds-lime); font-size: var(--ds-text-sm); font-weight: 700; }
.it-home-welcome__end { color: var(--ds-text-2); font-size: var(--ds-text-sm); }
.it-home-welcome-after { margin-top: var(--ds-space-5); }
.it-home-welcome-after .it-home-welcome { margin-bottom: 0; }
.it-home-link { min-height: var(--ds-tap); padding: 0 4px; border: 0; background: none; color: var(--ds-lime); font: 700 var(--ds-text-sm)/1 var(--ds-font-body); text-decoration: underline; text-underline-offset: 4px; cursor: pointer; }

/* ------------------------------------------------------------------ giochi di oggi */
.it-home-games-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--ds-space-4); margin-top: var(--ds-space-6); }
.it-home-games > .ds-shell:first-child .it-home-head { margin-bottom: var(--ds-space-6); }
/* Spike Chess è dentro la banda Giochi: il puzzle del giorno resta uno solo (il pulsante), niente riquadro doppio. */
.it-home-games .sc-home { padding-block: clamp(32px, 5vw, 64px); }
.it-home-games .sc-home-puzzle, .it-home-games .sc-home-strip[data-single] { display: none; }
.it-home-game { min-height: 400px; }
.it-home-game .ds-game-card__body { align-content: end; gap: var(--ds-space-3); min-height: 100%; padding: var(--ds-space-5); }
.it-home-game .ds-game-card__title { font-size: clamp(30px, 2.6vw, 40px); }
.it-home-game .ds-game-card__fallback { background: radial-gradient(circle at 70% 25%, var(--ds-ink-700), var(--ds-ink-850) 70%); color: var(--ds-line-strong); }
.it-home-game__chips { display: flex; flex-wrap: wrap; gap: 6px; }
.it-home-game__chips .ds-chip { background: rgba(5, 8, 11, .72); }
.it-home-game__link { color: inherit; text-decoration: none; }
.it-home-game__link::after { content: ""; position: absolute; inset: 0; z-index: 1; border-radius: inherit; }
.it-home-game__link:focus-visible { outline: none; }
.it-home-game__link:focus-visible::after { outline: var(--ds-focus-width) solid var(--ds-focus-color); outline-offset: -3px; }
.it-home-game__tagline { color: var(--ds-text-2); font-size: var(--ds-text-sm); line-height: 1.45; }
.it-home-game__status { width: 100%; min-height: 20px; color: var(--ds-text); font-size: 13px; line-height: 1.4; }
.it-home-game__status strong { font-weight: 700; }
.it-home-game .it-home-retry { padding: 0 0 0 var(--ds-space-3); border-left-width: 2px; background: none; }
.it-home-game .ds-game-card__body > * { min-width: 0; max-width: 100%; }
.it-home-game .it-home-retry button { min-height: 36px; }
.it-home-game__links { position: relative; z-index: 2; display: flex; flex-wrap: wrap; gap: 0 var(--ds-space-4); margin-top: calc(-1 * var(--ds-space-2)); font-size: 13px; }
.it-home-game__links a { display: inline-flex; align-items: center; min-height: 36px; color: var(--ds-text-2); text-decoration: underline; text-underline-offset: 4px; }
.it-home-game__links a:hover { color: var(--ds-text); }
.it-home-game__skeleton { width: 72%; height: 18px; min-height: 0; }
.it-home-game__cta { display: inline-flex; align-items: center; gap: var(--ds-space-2); padding-top: var(--ds-space-1); color: var(--ds-lime); font: 700 15px/1.2 var(--ds-font-body); }
.it-home-game:hover .it-home-game__cta .it-home-arrow { transform: translateX(4px); }

.it-home-academy { --ds-card-accent: var(--ds-lime); display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: end; gap: var(--ds-space-5) var(--ds-space-7); margin-top: var(--ds-space-4); padding: var(--ds-space-6); overflow: hidden; border-top: 2px solid var(--ds-lime); isolation: isolate; }
.it-home-academy__art { position: absolute; z-index: -1; inset: 0 0 0 52%; }
.it-home-academy__art img { width: 100%; height: 100%; object-fit: cover; object-position: 50% 18%; opacity: .55; }
.it-home-academy__art::before { content: ""; position: absolute; inset: 0; z-index: 1; background: linear-gradient(90deg, var(--ds-ink-850) 0%, rgba(14, 22, 29, .7) 45%, rgba(14, 22, 29, .2) 100%); }
.it-home-academy__copy { display: grid; justify-items: start; gap: var(--ds-space-3); min-width: 0; }
.it-home-academy__title { font: 400 var(--ds-display-m)/.95 var(--ds-font-display); text-transform: uppercase; }
.it-home-academy__lede { max-width: 62ch; color: var(--ds-text-2); font-size: 15px; line-height: 1.55; }
.it-home-academy__games { display: grid; grid-template-columns: repeat(3, minmax(120px, 190px)); gap: var(--ds-space-3) var(--ds-space-5); margin: var(--ds-space-2) 0 0; padding: 0; list-style: none; }
.it-home-academy__games li { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: baseline; gap: 6px var(--ds-space-2); font-size: 13px; }
.it-home-academy__games li > span:first-child { color: var(--ds-text); font-weight: 600; }
.it-home-academy__games b { color: var(--ds-text-2); font-size: var(--ds-text-xs); }
.it-home-academy__games li[data-ready] b { color: var(--ds-lime); }
.it-home-academy__games .ds-progress { grid-column: 1 / -1; height: 4px; }
.it-home-academy__skeleton { width: min(100%, 420px); height: 32px; }
.it-home-academy__actions { display: grid; justify-items: start; gap: var(--ds-space-2); }
.it-home-academy__meta { color: var(--ds-text-3); font-size: var(--ds-text-xs); }

/* ------------------------------------------------------------------ missioni */
.it-home-missions-grid { display: grid; grid-template-columns: minmax(0, 1.55fr) minmax(0, 1fr); gap: var(--ds-space-4); align-items: start; }

/* ------------------------------------------------------------------ community */
.it-home-pulse-grid { display: grid; grid-template-columns: minmax(0, 1.75fr) minmax(280px, 1fr); gap: var(--ds-space-6); align-items: start; }
.it-home-pulse-main { display: grid; justify-items: start; gap: var(--ds-space-3); min-width: 0; }
.it-home-pulse-main > * { width: 100%; }
.it-home-pulse-main > .it-home-pulse-all { width: auto; }
.it-home-threads .it-home-thread { --ds-row-action: auto; padding-block: var(--ds-space-4); text-decoration: none; }
.it-home-thread__rank { color: var(--ds-text-3); font: 400 26px/1 var(--ds-font-display); }
.it-home-thread__copy { display: grid; gap: 4px; min-width: 0; }
.it-home-thread__copy .ds-row__meta { margin: 0; }
.it-home-thread__copy .ds-row__meta b { color: var(--ds-lime); font-size: 11px; letter-spacing: .1em; text-transform: uppercase; }
.it-home-thread__copy .ds-row__title { font-size: 17px; overflow-wrap: anywhere; }
.it-home-thread__preview { display: -webkit-box; overflow: hidden; color: var(--ds-text-2); font-size: var(--ds-text-sm); line-height: 1.45; -webkit-box-orient: vertical; -webkit-line-clamp: 2; }
.it-home-thread__metrics { justify-self: end; color: var(--ds-text-3); font-size: var(--ds-text-xs); white-space: nowrap; }
.it-home-thread__metrics b { color: var(--ds-text); font-weight: 700; }
.it-home-row-actions { display: flex; flex-wrap: wrap; justify-content: center; gap: var(--ds-space-3); }
.it-home-pulse-side { display: grid; gap: var(--ds-space-4); min-width: 0; }
.it-home-latest { width: 100%; font: inherit; text-align: left; text-decoration: none; }
.it-home-latest__media { display: grid; place-items: center; aspect-ratio: 16 / 9; overflow: hidden; background: var(--ds-ink-800); color: var(--ds-text-2); }
.it-home-latest__media img { width: 100%; height: 100%; object-fit: cover; }
.it-home-latest__copy { display: grid; gap: 6px; padding: var(--ds-space-4); }
.it-home-latest strong { font-size: 17px; font-weight: 600; line-height: 1.3; overflow-wrap: anywhere; }
.it-home-latest small { color: var(--ds-text-3); font-size: var(--ds-text-xs); }
.it-home-latest--empty { gap: 6px; }
.it-home-lfg { flex-direction: row; align-items: center; gap: var(--ds-space-4); text-decoration: none; }
.it-home-lfg > svg:first-child { color: var(--ds-lime); }
.it-home-lfg > span { display: grid; flex: 1; gap: 4px; min-width: 0; }
.it-home-lfg strong { font-size: 16px; font-weight: 700; }
.it-home-lfg small { color: var(--ds-text-2); font-size: 13px; line-height: 1.4; }
.it-home-lfg .it-home-arrow { color: var(--ds-lime); }

/* ------------------------------------------------------------------ lobby */
.it-home-lobby-intro { position: relative; display: flex; align-items: flex-end; justify-content: space-between; gap: var(--ds-space-6); padding: clamp(24px, 4vw, 48px); overflow: hidden; border: 1px solid var(--ds-line); border-radius: var(--ds-r-2); isolation: isolate; }
.it-home-lobby-intro::before { content: ''; position: absolute; z-index: -1; inset: 0; background: linear-gradient(90deg, var(--ds-ink-900) 15%, rgba(11, 10, 9, .72)), url('/assets/valorant/official/gioca-jett.webp') 64% 62% / cover; filter: grayscale(1); opacity: .8; }
.it-home-lobby-intro > div { display: grid; justify-items: start; gap: var(--ds-space-4); min-width: 0; }
.it-home-lobby-intro h2 { overflow-wrap: anywhere; }
.it-home-lobby-intro .ds-btn { flex-shrink: 0; }
.it-home-lobby-list { margin-top: var(--ds-space-4); }
.it-home-lobby-list .ds-row { --ds-row-action: auto; text-decoration: none; }
.it-home-lobby-count { justify-self: end; color: var(--ds-lime); font-size: var(--ds-text-sm); font-weight: 700; }

/* ------------------------------------------------------------------ tornei (crema) */
.it-home-tournament-main { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); min-height: 560px; }
.it-home-tournament-copy { display: grid; align-content: center; justify-items: start; gap: var(--ds-space-5); padding: var(--ds-section-y) var(--ds-space-6) var(--ds-section-y) 0; }
.it-home-tournament-copy h3 { max-width: 520px; font: 400 var(--ds-display-s)/1 var(--ds-font-display); text-transform: uppercase; overflow-wrap: anywhere; }
.it-home-tournament-lede { max-width: 46ch; color: var(--ds-text-2); font-size: 18px; line-height: 1.55; }
.it-home-event-meta { display: flex; flex-wrap: wrap; gap: var(--ds-space-4) var(--ds-space-6); }
.it-home-event-meta > div { display: grid; gap: 4px; }
.it-home-event-meta dt { color: var(--ds-text-2); font-size: 11px; font-weight: 700; letter-spacing: var(--ds-tracking-caps); text-transform: uppercase; }
.it-home-event-meta dd { font-size: 16px; font-weight: 700; }
.it-home-tournament-status { max-width: 52ch; padding-top: var(--ds-space-4); border-top: 1px solid var(--ds-line-strong); color: var(--ds-text-2); font-size: var(--ds-text-sm); line-height: 1.5; }
.it-home-tournament-status strong { color: var(--ds-text); }
.it-home-tournament-art { position: relative; align-self: stretch; margin-right: calc(-1 * var(--ds-gutter)) !important; overflow: hidden; clip-path: polygon(20% 0, 100% 0, 100% 100%, 14% 100%, 0 82%, 0 20%); }
.it-home-tournament-art img { width: 100%; height: 100%; max-width: none; object-fit: cover; object-position: 100% center; }
.it-home-tournament-art[data-editorial="true"] img { transform: scale(1.25); transform-origin: right center; }

/* ------------------------------------------------------------------ clip */
.it-home-cliphub__top { display: grid; grid-template-columns: minmax(0, 1.15fr) minmax(0, .85fr); align-items: center; gap: var(--ds-space-7); }
.it-home-cliphub[data-has-clips] .it-home-cliphub__top { grid-template-columns: minmax(0, 1fr); margin-bottom: var(--ds-space-6); }
.it-home-cliphub__art img { width: 100%; height: auto; aspect-ratio: 1.45; object-fit: cover; object-position: center; }
.it-home-cliphub__copy { display: grid; justify-items: start; gap: var(--ds-space-4); min-width: 0; }
.it-home-cliphub__list { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--ds-space-4); align-items: start; }
.it-home-cliphub__list :is(video, iframe, img) { display: block; width: 100%; height: auto; aspect-ratio: 16 / 9; max-height: 410px; border: 0; background: var(--ds-ink-950); object-fit: cover; }
.it-home-cliphub__list video { object-fit: contain; }
.it-home-cliphub__details { display: flex; align-items: center; justify-content: space-between; gap: var(--ds-space-4); padding: var(--ds-space-4); }
.it-home-cliphub__details > div { display: grid; gap: 4px; min-width: 0; }
.it-home-cliphub__details h3 { font-size: 17px; font-weight: 600; line-height: 1.3; overflow-wrap: anywhere; }
.it-home-cliphub__details span { color: var(--ds-text-3); font-size: var(--ds-text-xs); }
.it-home-cliphub__details .ds-icon-btn { color: var(--ds-lime); }

/* ------------------------------------------------------------------ chiusura (crema) */
.it-home-closing > .ds-shell { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); align-items: end; gap: var(--ds-space-6) var(--ds-space-8); padding-block: var(--ds-section-y); }
.it-home-closing > .ds-shell > div:first-child { display: grid; justify-items: start; gap: var(--ds-space-4); }
.it-home-closing__copy { display: grid; justify-items: start; gap: var(--ds-space-5); }
.it-home-closing__copy > p { max-width: 30ch; font-size: clamp(20px, 2vw, 28px); line-height: 1.35; }

/* Community: lobby e torneo solo se esistono, in schede laterali compatte. */
.it-home-pulse-grid[data-single] { grid-template-columns: minmax(0, 1fr); }
.it-home-pulse-grid[data-single] .it-home-pulse-side { grid-template-columns: repeat(auto-fit, minmax(min(100%, 320px), 1fr)); }
.it-home-side-card { gap: var(--ds-space-3); }
.it-home-side-card .ds-btn { align-self: flex-start; }
.it-home-side-card__title { font: 400 var(--ds-display-s)/1 var(--ds-font-display); text-transform: uppercase; overflow-wrap: anywhere; }
.it-home-side-card .it-home-event-meta dd { font-size: var(--ds-text-sm); }
.it-home-cliphub { display: grid; gap: var(--ds-space-4); margin-top: var(--ds-space-7); }
.it-home-cliphub__head { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: var(--ds-space-3); }
.it-home-cliphub__details h4 { font-size: 17px; font-weight: 600; line-height: 1.3; overflow-wrap: anywhere; }

/* Riga di link finale. */
.it-home-links { padding-block: var(--ds-space-6); border-top: 1px solid var(--ds-line); }
.it-home-links ul { display: flex; flex-wrap: wrap; gap: var(--ds-space-2) var(--ds-space-3); margin: 0; padding: 0; list-style: none; }
.it-home-links a { display: inline-flex; align-items: center; gap: var(--ds-space-2); min-height: var(--ds-tap); padding: 0 var(--ds-space-4); border: 1px solid var(--ds-line); border-radius: var(--ds-r-pill); color: var(--ds-text); font-size: var(--ds-text-sm); font-weight: 700; text-decoration: none; }
.it-home-links a:hover { border-color: var(--ds-line-strong); color: var(--ds-lime); }
.it-home-links .ds-icon { color: var(--ds-lime); }

@media (hover: hover) and (pointer: fine) {
  .it-home .it-home-outline:hover { border-color: var(--ds-text); background: var(--ds-text); color: var(--ds-ink-900); }
  .it-home .ds-btn:hover .it-home-arrow, .it-home-puzzle-line:hover .it-home-arrow, .it-home-lfg:hover .it-home-arrow { transform: translateX(4px); }
  .it-home-thread:hover .ds-row__title { color: var(--ds-lime); }
}

/* ------------------------------------------------------------------ news */
.it-home-news { min-height: 70vh; background: var(--ds-ink-900); color: var(--ds-text); }
.it-home-news-shell { display: grid; gap: var(--ds-space-4); padding-bottom: var(--ds-section-y); }
.it-home-news-grid { display: grid; grid-template-columns: minmax(260px, .8fr) minmax(0, 1.7fr); gap: var(--ds-space-6); align-items: start; }
.it-home-news-index { display: grid; gap: var(--ds-space-3); }
.it-home-news-index .ds-list li { display: block; }
.it-home-news-item { display: grid; gap: 4px; width: 100%; min-height: 64px; padding: var(--ds-space-3) var(--ds-space-4); border: 0; border-bottom: 1px solid var(--ds-line); border-left: 2px solid transparent; background: none; color: var(--ds-text); font: inherit; text-align: left; cursor: pointer; }
.it-home-news-item .ds-row__meta { margin: 0; }
.it-home-news-item:hover { background: var(--ds-ink-850); }
.it-home-news-item[aria-current="true"] { border-left-color: var(--ds-lime); background: var(--ds-ink-850); }
.it-home-news-article__image { aspect-ratio: 16 / 9; overflow: hidden; background: var(--ds-ink-800); }
.it-home-news-article__image img { width: 100%; height: 100%; object-fit: cover; }
.it-home-news-article__body { display: grid; justify-items: start; gap: var(--ds-space-4); padding: clamp(20px, 3vw, 40px); }
.it-home-news-article__lede { max-width: 60ch; color: var(--ds-text); font-size: 18px; line-height: 1.55; }
.it-home-news-article__note { max-width: 60ch; color: var(--ds-text-2); font-size: var(--ds-text-sm); line-height: 1.55; }
.it-home-news .ds-btn { text-decoration: none; }

/* ------------------------------------------------------------------ breakpoint 1440 / 1180 / 820 / 560 */
@media (min-width: 1680px) {
  .it-home-hero-copy { padding-left: max(var(--ds-gutter), calc((100vw - 1440px) / 2)); }
  .it-home-agent { left: 40%; }
}

@media (max-width: 1179.98px) {
  .it-home-hero { min-height: 590px; }
  .it-home-hero-copy { width: 66%; }
  .it-home-agent { left: 33%; top: -5px; width: 680px; height: 1120px; }
  .it-home-hero-copy > p { max-width: 410px; }
  .it-home-games-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .it-home-games-grid > :last-child:nth-child(odd) { grid-column: 1 / -1; min-height: 300px; }
  .it-home-game { min-height: 360px; }
  .it-home-welcome__steps { grid-template-columns: minmax(0, 1fr); }
  .it-home-welcome__steps li { grid-template-columns: auto minmax(0, 1fr) auto; align-items: center; }
  .it-home-welcome__steps li > :is(.ds-btn, .it-home-welcome__ok, .it-home-welcome__where) { grid-column: 3; grid-row: 1; }
  .it-home-today-grid, .it-home-missions-grid, .it-home-pulse-grid { grid-template-columns: minmax(0, 1fr); }
  .it-home-turn { order: -1; }
  .it-home-pulse-side { grid-template-columns: repeat(2, minmax(0, 1fr)); align-items: start; }
  .it-home-flow li { gap: var(--ds-space-4); padding-inline: var(--ds-space-5); }
  .it-home-tournament-main { min-height: 500px; }
  .it-home-cliphub__list { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .it-home-news-grid { grid-template-columns: minmax(0, 1fr); }
}

@media (max-width: 819.98px) {
  .it-home-hero { height: auto; min-height: 0; }
  .it-home-scene { inset: 0 0 28% 0; }
  .it-home-scene img { object-position: 62% center; }
  .it-home-scene::after { background: linear-gradient(0deg, var(--ds-ink-900), transparent 72%), linear-gradient(90deg, var(--ds-ink-900), transparent 52%); }
  .it-home-wordmark { top: 20px; right: -8px; font-size: 31vw; opacity: .8; }
  .it-home-agent { top: 12px; left: 21%; width: 510px; height: 820px; }
  .it-home-hero-copy { justify-content: flex-end; width: 100%; min-height: 0; padding: 300px var(--ds-gutter) 32px; }
  .it-home-hero-copy::before { content: ''; position: absolute; z-index: -1; inset: 35% 0 0; background: linear-gradient(0deg, var(--ds-ink-900) 12%, rgba(11, 10, 9, .93) 48%, transparent 100%); pointer-events: none; }
  .it-home-hero-copy h1 { font-size: clamp(56px, 10.8vw, 79px); line-height: 1.07; }
  .it-home-hero-copy > p { max-width: 470px; margin: 20px 0 25px; font-size: 18px; }
  .it-home-head { margin-bottom: var(--ds-space-5); }
  .it-home-flow { grid-template-columns: minmax(0, 1fr); }
  .it-home-flow li, .it-home-flow li:first-child, .it-home-flow li:last-child { padding: var(--ds-space-4) 0; border-left: 0; border-bottom: 1px solid var(--ds-line); }
  .it-home-flow li:last-child { border-bottom: 0; }
  .it-home-flow li > b { flex-basis: 40px; font-size: 34px; }
  .it-home-pulse-side { grid-template-columns: minmax(0, 1fr); }
  .it-home-lobby-intro { flex-direction: column; align-items: flex-start; }
  .it-home-tournament-main { grid-template-columns: minmax(0, 1fr); min-height: 0; }
  .it-home-tournament-copy { padding: var(--ds-section-y) 0 var(--ds-space-6); }
  .it-home-tournament-art { height: 320px; margin-left: calc(-1 * var(--ds-gutter)) !important; clip-path: polygon(14% 0, 100% 0, 100% 100%, 0 100%, 0 14%); }
  .it-home-tournament-art img { object-position: 100% 40%; }
  .it-home-cliphub__top { grid-template-columns: minmax(0, 1fr); gap: var(--ds-space-5); }
  .it-home-cliphub__list { grid-template-columns: minmax(0, 1fr); }
  .it-home-closing > .ds-shell { grid-template-columns: minmax(0, 1fr); }
  .it-home-academy { grid-template-columns: minmax(0, 1fr); padding: var(--ds-space-5); }
  .it-home-academy__art { inset: 0 0 0 40%; }
  .it-home-academy__art img { opacity: .3; }
  /* ds: la regola compact batte quella mobile, il testo finirebbe sull'arte. */
  .it-home-news .ds-hero--compact .ds-hero__inner { padding-top: min(46vw, 210px); }
}

@media (max-width: 559.98px) {
  .it-home-hero { min-height: 0; }
  .it-home-hero-copy { min-height: 0; padding-top: 150px; padding-bottom: 24px; }
  .it-home-scene { inset: 0 0 40% 0; }
  .it-home-agent { left: 30%; top: -20px; width: 300px; height: 480px; }
  .it-home-wordmark { font-size: 26vw; }
  .it-home-hero-copy h1 { font-size: clamp(40px, 11.4vw, 50px); letter-spacing: -.018em; }
  .it-home-hero-copy > p { margin: 12px 0 16px; font-size: 15px; line-height: 1.45; }
  .it-home-hero-copy .ds-btn--lg, .it-home-hello .ds-btn--lg { min-height: 52px; font-size: 16px; }
  .it-home-welcome { padding: var(--ds-space-4); }
  .it-home-welcome__steps li { padding: var(--ds-space-3); }
  .it-home-welcome__steps li:not([data-done]) .it-home-welcome__copy small { display: none; }
  .it-home-welcome__copy strong { font-size: 15px; }
  .it-home-hero-games { margin-top: var(--ds-space-3); gap: 6px; }
  .it-home-hero-chip { min-height: 36px; padding-right: 10px; font-size: 13px; }
  .it-home-hero-chip img, .it-home-hero-chip b { width: 26px; height: 26px; }
  .it-home-hello { margin-bottom: var(--ds-space-5); }
  .it-home-hello .it-home-actions { width: 100%; gap: 10px; }
  .it-home-hello .ds-btn { width: 100%; }
  .it-home-today { padding-block: var(--ds-space-5) var(--ds-space-7); }
  .it-home-links a { padding-inline: var(--ds-space-3); }
  /* Home più corta su telefono: bande più strette e l'illustrazione di Spike Chess più bassa. */
  .it-home-band { padding-block: var(--ds-space-7); }
  .it-home-games .sc-home { padding-block: var(--ds-space-6); }
  .it-home-games .sc-home-stage { min-height: 220px; }
  .it-home-flow-band { padding-block: var(--ds-space-5); }
  .it-home-games .it-home-head__lede { display: none; }
  .it-home-games .it-home-head { margin-bottom: var(--ds-space-4); }
  .it-home-games-grid { margin-top: var(--ds-space-5); }
  .it-home-games-grid > :last-child:nth-child(odd) { min-height: 240px; }
  .it-home-academy__games, .it-home-academy__lede { display: none; }
  .it-home-hero-copy .it-home-actions { align-items: stretch; width: 100%; gap: 10px; }
  .it-home-hero-copy .ds-btn { width: 100%; }
  .it-home-actions .ds-btn--primary { flex: 1 1 100%; }
  .it-home-games-grid { gap: var(--ds-space-3); }
  .it-home-game { min-height: 268px; }
  .it-home-game .ds-game-card__body { gap: var(--ds-space-2); padding: var(--ds-space-3); }
  .it-home-game .ds-game-card__title { font-size: 26px; }
  .it-home-game__tagline, .it-home-game__chips .ds-chip + .ds-chip { display: none; }
  .it-home-game__chips .ds-chip { min-height: 24px; padding-inline: 8px; }
  .it-home-game__status { font-size: var(--ds-text-xs); }
  .it-home-game__cta { font-size: var(--ds-text-sm); }
  .it-home-game .it-home-retry { gap: 0 6px; padding-left: var(--ds-space-2); font-size: var(--ds-text-xs); }
  .it-home-game .it-home-retry > span[aria-hidden] { display: none; }
  .it-home-game__links { display: none; }
  .it-home-academy__games { grid-template-columns: minmax(0, 1fr); width: 100%; }
  .it-home-turn__actions { grid-template-columns: minmax(0, 1fr); }
  .it-home-turn__actions .ds-btn { width: 100%; }
  .it-home-me__stats { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .it-home-me__stats .ds-stat { padding: var(--ds-space-3); }
  .it-home-threads .it-home-thread { grid-template-columns: 32px minmax(0, 1fr); }
  .it-home-thread__metrics { grid-column: 2; justify-self: start; }
  .it-home-tournament-art { height: 260px; }
  .it-home-lobby-intro .ds-btn { width: 100%; }
}

@media (prefers-reduced-motion: no-preference) {
  .it-home-agent { transition: transform 320ms ease-out; }
  .it-home-scene img { transition: transform 550ms ease-out; }
  .it-home-hero-copy { animation: it-home-enter 620ms var(--ds-ease) both; }
  .it-home-glow { animation: it-home-glow 2.4s var(--ds-ease) infinite; }
  @keyframes it-home-enter { from { opacity: 0; transform: translateY(14px); } to { opacity: 1; transform: translateY(0); } }
  @keyframes it-home-glow { 50% { box-shadow: 0 0 0 1px rgba(216, 172, 64, .5), 0 14px 40px -10px rgba(216, 172, 64, .65); } }
}

@media (prefers-reduced-motion: reduce) {
  .it-home *, .it-home *::before, .it-home *::after { animation: none !important; transition: none !important; scroll-behavior: auto !important; }
  .it-home-agent, .it-home-scene img { transform: none !important; }
}

/* Primi passi: il bonus si riscuote nel riquadro «Oggi» (un solo pulsante "Riscuoti" in pagina). */
.it-home-welcome__where { color: var(--ds-text-2); font-size: var(--ds-text-sm); font-weight: 600; }

/* "+5 nuovi" accanto ai giochi dell'hero: porta alla striscia dei giochi nuovi. */
.it-home-hero-chip--new { border-color: var(--ds-lime-line); }
.it-home-hero-chip--new b { background: var(--ds-lime); color: var(--ds-ink-900, #0b1016); }

/* Nuovi giochi: 5 card corte (arte, nome, una riga, Gioca). Desktop: una riga da 5. Telefono: striscia che scorre. */
.it-home-new { scroll-margin-top: calc(var(--ds-topnav-h, 64px) + 8px); }
.it-home-new__head { display: flex; flex-wrap: wrap; align-items: end; justify-content: space-between; gap: var(--ds-space-3) var(--ds-space-6); margin-bottom: var(--ds-space-5); }
.it-home-new__head h2 { margin: 0; }
.it-home-new__head > p { max-width: 420px; margin: 0; color: var(--ds-text-2); }
.it-home-new__list { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: var(--ds-space-3); margin: 0; padding: 0; list-style: none; }
.it-home-new__card { --new-accent: var(--ds-lime); display: grid; grid-template-rows: auto 1fr; height: 100%; overflow: hidden; border: 1px solid var(--ds-line); border-radius: var(--ds-r-2); background: var(--ds-ink-800, #111a22); color: var(--ds-text); text-decoration: none; transition: border-color var(--ds-dur-1, .15s) ease, transform var(--ds-dur-1, .15s) ease; }
.it-home-new__card:hover { border-color: color-mix(in srgb, var(--new-accent) 60%, transparent); }
.it-home-new__card:focus-visible { outline: 2px solid var(--ds-lime); outline-offset: 2px; }
.it-home-new__art { position: relative; display: block; aspect-ratio: 16 / 9; overflow: hidden; border-bottom: 2px solid var(--new-accent); background: linear-gradient(135deg, color-mix(in srgb, var(--new-accent) 30%, #0b1016), #0b1016); }
.it-home-new__art img { width: 100%; height: 100%; object-fit: cover; }
.it-home-new__art b { display: grid; place-items: center; height: 100%; color: var(--new-accent); font: 400 34px/1 var(--ds-font-display); }
.it-home-new__art em { position: absolute; top: 8px; left: 8px; font-style: normal; }
.it-home-new__body { display: grid; align-content: start; gap: 4px; padding: 12px 14px 14px; }
.it-home-new__body strong { font: 400 22px/1.05 var(--ds-font-display); text-transform: uppercase; }
.it-home-new__body small { overflow: hidden; color: var(--ds-text-2); font-size: var(--ds-text-sm); line-height: 1.35; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; }
.it-home-new__cta { display: inline-flex; align-items: center; gap: 6px; justify-self: start; margin-top: 8px; padding: 6px 12px; border: 1px solid var(--ds-line-strong); border-radius: var(--ds-r-1); font-size: var(--ds-text-sm); font-weight: 700; }
.it-home-new__card:hover .it-home-new__cta { border-color: var(--ds-lime); color: var(--ds-lime); }
.it-home-new__cta .it-home-arrow { width: 16px; height: 16px; }
@media (max-width: 1179.98px) {
  .it-home-new__list { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}
@media (max-width: 819.98px) {
  .it-home-new__list { display: flex; gap: 10px; margin-inline: calc(-1 * var(--ds-gutter, 16px)); padding: 2px var(--ds-gutter, 16px) 6px; overflow-x: auto; scroll-snap-type: x mandatory; scroll-padding-inline: var(--ds-gutter, 16px); scrollbar-width: none; }
  .it-home-new__list::-webkit-scrollbar { display: none; }
  .it-home-new__list > li { flex: 0 0 200px; scroll-snap-align: start; }
  .it-home-new__head { margin-bottom: var(--ds-space-4); }
  .it-home-new__head > p { font-size: 14px; }
}
@media (max-width: 559.98px) {
  .it-home-new { padding-block: var(--ds-space-6); }
  .it-home-new__list > li { flex-basis: 172px; }
  .it-home-new__body { padding: 10px 12px 12px; }
  .it-home-new__body strong { font-size: 19px; }
  .it-home-new__body small { -webkit-line-clamp: 3; }
}
/* Ospiti: "Come funziona" chiude la banda dei giochi nuovi (una banda in meno, Home più corta). */
.it-home-flow-inline { margin-top: var(--ds-space-7); padding-top: var(--ds-space-6); border-top: 1px solid var(--ds-line); }
@media (max-width: 559.98px) { .it-home-flow-inline { margin-top: var(--ds-space-6); padding-top: var(--ds-space-5); } }