/* AEDB Calcio — website layout on top of the design-system tokens.
   Assumes the design-system styles.css is linked first. */

/* ---------- Nav ---------- */
.nav {
  position: sticky;
  top: 0;
  z-index: 200;
  background: rgba(18, 59, 102, 0.82);
  backdrop-filter: saturate(160%) blur(16px);
  -webkit-backdrop-filter: saturate(160%) blur(16px);
  border-bottom: 1px solid var(--white-16);
}
.nav__inner {
  height: var(--nav-height);
  max-width: var(--container-max);
  margin: 0 auto;
  padding: 0 var(--container-pad);
  display: grid;
  grid-template-columns: 1fr auto 1fr;
  align-items: center;
}
.nav__logo { justify-self: start; display: flex; align-items: center; }
.nav__logo-img { height: 46px; width: auto; }
.nav__logo-img--dark { display: none; }
.nav--onlight { background: rgba(255, 255, 255, 0.82); border-bottom-color: rgba(18, 59, 102, 0.12); }
.nav--onlight .nav__logo-img--white { display: none; }
.nav--onlight .nav__logo-img--dark { display: block; }
.nav__brand {
  justify-self: center;
  font-family: var(--font-brand);
  color: var(--gold-500);
  font-size: 32px;
  letter-spacing: 0.08em;
  line-height: 1;
}
.nav__right { justify-self: end; position: relative; }
.nav__toggle {
  width: 46px; height: 46px;
  display: inline-flex; flex-direction: column; gap: 5px;
  align-items: center; justify-content: center;
  background: transparent; border: 1px solid var(--white-16);
  border-radius: var(--radius-sm); cursor: pointer;
  transition: border-color var(--dur-fast) var(--ease-out), background var(--dur-fast) var(--ease-out);
}
.nav__toggle:hover { border-color: var(--gold-400); background: var(--white-08); }
.nav__toggle span { display:block; width: 22px; height: 2px; background: var(--white); border-radius: 2px; transition: transform var(--dur-fast) var(--ease-out), opacity var(--dur-fast) var(--ease-out); }
.nav__toggle.is-open span:nth-child(1) { transform: translateY(7px) rotate(45deg); }
.nav__toggle.is-open span:nth-child(2) { opacity: 0; }
.nav__toggle.is-open span:nth-child(3) { transform: translateY(-7px) rotate(-45deg); }

.nav__menu {
  position: absolute; right: 0; top: calc(100% + 14px);
  min-width: 260px;
  background: var(--navy-800);
  border: 1px solid var(--white-16);
  border-radius: var(--radius-md);
  box-shadow: var(--shadow-lg);
  padding: var(--space-2);
  display: flex; flex-direction: column;
  opacity: 0; transform: translateY(-10px); pointer-events: none;
  transition: opacity var(--dur-fast) var(--ease-out), transform var(--dur-fast) var(--ease-out);
}
.nav__menu.is-open { opacity: 1; transform: none; pointer-events: auto; }
.nav__menu a {
  font-family: var(--font-body); text-transform: uppercase;
  letter-spacing: 0.16em; font-size: var(--fs-small);
  color: var(--white); padding: 15px 16px; border-radius: var(--radius-sm);
  transition: background var(--dur-fast) var(--ease-out), color var(--dur-fast) var(--ease-out);
}
.nav__menu a:hover { background: var(--white-08); color: var(--gold-300); }
.nav__menu a[aria-current="page"] { color: var(--gold-300); }

/* ---------- Nav: expandable "Le Nostre Squadre" group ---------- */
.nav__group { display: flex; flex-direction: column; }
.nav__group-row { display: flex; align-items: center; }
.nav__group-row .nav__group-link { flex: 1; }
.nav__group-toggle {
  flex: none; width: 40px; height: 40px; margin-right: 4px;
  display: inline-flex; align-items: center; justify-content: center;
  background: transparent; border: 0; border-radius: var(--radius-sm);
  color: var(--white-64); cursor: pointer;
  transition: color var(--dur-fast) var(--ease-out), background var(--dur-fast) var(--ease-out);
}
.nav__group-toggle:hover { color: var(--gold-300); background: var(--white-08); }
.nav__group-toggle svg { transition: transform var(--dur-fast) var(--ease-out); }
.nav__group-toggle[aria-expanded="true"] svg { transform: rotate(90deg); }
.nav__submenu {
  display: none;
  padding-left: 20px;
}
.nav__submenu.is-open {
  display: block;
  animation: navSubmenuIn 220ms var(--ease-out);
}
@keyframes navSubmenuIn {
  from { opacity: 0; transform: translateY(-6px); }
  to { opacity: 1; transform: translateY(0); }
}
@media (prefers-reduced-motion: reduce) { .nav__submenu.is-open { animation: none; } }
.nav__submenu-inner { display: flex; flex-direction: column; }
.nav__submenu-inner a {
  font-family: var(--font-body); text-transform: uppercase;
  letter-spacing: 0.14em; font-size: 12px; color: var(--white-64);
  padding: 11px 16px; border-radius: var(--radius-sm);
  transition: background var(--dur-fast) var(--ease-out), color var(--dur-fast) var(--ease-out);
}
.nav__submenu-inner a:hover { background: var(--white-08); color: var(--gold-300); }
.nav__submenu-inner a[aria-current="page"] { color: var(--gold-300); }
@media (prefers-reduced-motion: reduce) { .nav__submenu { transition: none; } }

/* ---------- Section shell ---------- */
.section { padding-block: var(--space-section); }
.section--tight { padding-block: clamp(48px, 6vw, 80px); }
.section__head { margin-bottom: var(--space-7); display:flex; flex-direction:column; gap: var(--space-3); }
.eyebrow {
  font-family: var(--font-body); text-transform: uppercase;
  letter-spacing: 0.32em; font-size: var(--fs-caption); color: var(--gold-300);
}
.title { font-family: var(--font-body); font-size: var(--fs-display); color: var(--white); line-height: var(--lh-snug); }
.lead { font-family: var(--font-body); font-size: var(--fs-lead); color: var(--white-64); max-width: 640px; }

/* ---------- Section-title reveal effects (replay on re-enter) ---------- */
.title-fx { will-change: transform, background-position, opacity; }
/* Shop · gold shimmer sweep */
.title-fx--shimmer { color: var(--white); background-image: linear-gradient(100deg, var(--white) 0%, var(--white) 38%, var(--gold-400) 50%, var(--white) 62%, var(--white) 100%); background-size: 260% 100%; background-position: 150% 0; -webkit-background-clip: text; background-clip: text; -webkit-text-fill-color: transparent; }
.title-fx--shimmer.fx-in { transition: background-position 1300ms cubic-bezier(0.22, 1, 0.36, 1); background-position: -60% 0; }
/* Sponsor · clip-reveal rise (settles in gold) */
.title-fx--clip { display: inline-block; overflow: hidden; padding: 0.06em 0.04em; }
.title-fx--clip .title-fx__inner { display: inline-block; color: var(--gold-400); transform: translateY(115%); transition: transform 820ms cubic-bezier(0.22, 1, 0.36, 1); }
.title-fx--clip.fx-in .title-fx__inner { transform: translateY(0); }
/* Contatti · hairline draw + fade */
.title-fx--hairline { position: relative; display: inline-block; color: var(--white); opacity: 0; transform: translateY(18px); transition: opacity 700ms ease, transform 700ms cubic-bezier(0.22, 1, 0.36, 1); }
.title-fx--hairline.fx-in { opacity: 1; transform: none; }
.title-fx--hairline::after { content: ""; position: absolute; left: 0; bottom: -0.32em; height: 2px; width: 100%; background: var(--gold-400); transform: scaleX(0); transform-origin: left; transition: transform 820ms cubic-bezier(0.22, 1, 0.36, 1) 220ms; }
.title-fx--hairline.fx-in::after { transform: scaleX(1); }
@media (prefers-reduced-motion: reduce) {
  .title-fx--shimmer { -webkit-text-fill-color: var(--white); background: none; }
  .title-fx--clip .title-fx__inner { transform: none; transition: none; }
  .title-fx--hairline { opacity: 1; transform: none; transition: none; }
  .title-fx--hairline::after { transform: scaleX(1); transition: none; }
}

/* ---------- Hero (section 2): logo card + info column ---------- */
.hero { position: relative; padding-block: 0; height: 220vh; width: 100vw; margin-inline: calc(50% - 50vw); }
.hero__grid { display: grid; grid-template-columns: 1fr 1fr; gap: var(--space-6); align-items: stretch; }
.logo-card {
  background: linear-gradient(160deg, var(--navy-600), var(--navy-800));
  border: 1px solid var(--white-08);
  border-radius: var(--radius-xl);
  display: grid; place-items: center; padding: var(--space-8);
  min-height: 460px; position: relative; overflow: hidden;
}
.logo-card::after {
  content: ""; position: absolute; width: 420px; height: 420px; border-radius: 50%;
  background: radial-gradient(circle, rgba(190,161,81,0.16), transparent 70%);
  top: -60px; right: -80px;
}
.logo-card img { width: min(74%, 360px); height: auto; position: relative; z-index: 1; }
.video-card {
  border-radius: var(--radius-xl); border: 1px solid var(--white-08);
  overflow: hidden; box-shadow: var(--shadow-md); background: var(--navy-700);
}
.hero__actions { display: flex; gap: var(--space-4); justify-content: center; flex-wrap: wrap; margin-top: var(--space-6); }

/* ---------- Hero: training video in a rounded frame (pinned) ---------- */
.hero-stage { position: sticky; top: var(--nav-height); height: calc(100vh - var(--nav-height)); display: grid; place-items: center; }
.hero-video-frame {
  position: relative; z-index: 2; width: min(1600px, 94vw); aspect-ratio: 16 / 9; max-height: 78vh;
  border-radius: var(--radius-xl); overflow: hidden; border: 1px solid var(--white-16);
  box-shadow: 0 30px 80px rgba(4, 16, 32, 0.55), inset 0 1px 0 rgba(255, 255, 255, 0.18);
  contain: paint;
}
.hero-video { width: 100%; height: 100%; object-fit: cover; display: block; transform: translateZ(0); }
@media (prefers-reduced-motion: reduce) { .hero { height: auto; } .hero-stage { position: relative; top: 0; height: auto; min-height: calc(100vh - var(--nav-height)); } }
@media (max-width: 560px) {
  .hero-stage { min-height: calc(100vh - var(--nav-height)); }
  .hero-video-frame { width: 100vw; height: 100%; max-height: none; aspect-ratio: auto; border-radius: 0; border: none; }
}

.info-col { display: flex; flex-direction: column; gap: var(--space-4); }
.thumb-frame { border-radius: var(--radius-lg); overflow: hidden; box-shadow: var(--shadow-md); border: 1px solid var(--white-08); }
.thumb-frame img { width: 100%; height: auto; display: block; }
.season-soon { position: relative; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: var(--space-4); text-align: center; padding: var(--space-7) var(--space-5); background: linear-gradient(160deg, var(--navy-600), var(--navy-800)); }
.season-soon__rule { width: 64px; height: 2px; background: var(--gold-400); }
.season-soon__t { font-family: var(--font-body); text-transform: uppercase; letter-spacing: 0.04em; line-height: 1.12; font-size: clamp(1rem, 2.6vw, 2.2rem); color: var(--white); white-space: nowrap; }
.thumb-frame .season-soon { min-height: clamp(260px, 34vw, 440px); }
.match-frame .season-soon { height: calc((100vh - var(--nav-height) - 230px) / 2); }
.philosophy {
  background: rgba(255,255,255,0.04);
  border: 1px solid var(--white-08);
  border-radius: var(--radius-lg);
  padding: var(--space-5) var(--space-6);
  display: flex; flex-direction: column; gap: var(--space-3);
  flex: 1;
}
.philosophy p { font-family: var(--font-body); font-size: var(--fs-lead); color: var(--white-80); line-height: var(--lh-body); }
.philosophy .kicker { font-family: var(--font-brand); color: var(--gold-500); font-size: 26px; letter-spacing: 0.05em; }
.philosophy > div:last-child { display: flex; justify-content: center; }

/* ---------- Manifesto: scroll-highlight statement ---------- */
.manifesto { position: relative; height: 200vh; background: var(--aedb-navy); width: 100vw; margin-inline: calc(50% - 50vw); }
.manifesto__sticky {
  position: sticky; top: var(--nav-height); height: calc(100vh - var(--nav-height));
  width: 100vw; margin-left: calc(50% - 50vw);
  display: flex; flex-direction: column; align-items: center; justify-content: center;
  gap: clamp(24px, 5vh, 56px);
  padding: clamp(24px, 5vh, 64px) var(--container-pad) clamp(16px, 3vh, 32px);
}
.manifesto__textwrap { position: relative; width: 100%; }
.manifesto__mark {
  position: absolute;
  font-family: var(--font-brand);
  font-size: clamp(4rem, 9vw, 8rem); line-height: 1;
  color: rgba(255, 255, 255, 0.22);
  transition: color 300ms linear;
  pointer-events: none; user-select: none;
}
.manifesto__mark--open { top: -0.55em; left: 0; }
.manifesto__mark--close { bottom: -0.55em; right: 0; }
.manifesto__mark.is-active { color: var(--gold-500); }
.manifesto__text {
  max-width: none; width: 100%; margin: 0 auto; text-align: center;
  font-family: var(--font-body); font-weight: 400;
  font-size: clamp(3.2rem, 9.4vw, 8.4rem); line-height: 1.12;
  letter-spacing: 0.02em; text-transform: uppercase;
}
.manifesto__text .word {
  color: rgba(255, 255, 255, 0.22);
  transition: color 120ms linear;
}
.manifesto__text .word.is-active { color: var(--aedb-white); }
.manifesto__logo {
  flex: none;
  width: clamp(48px, 8vh, 72px); height: clamp(48px, 8vh, 72px);
  background: var(--gold-500);
  -webkit-mask: url("assets/aedb-logo-white.png") no-repeat center / contain;
  mask: url("assets/aedb-logo-white.png") no-repeat center / contain;
  pointer-events: none;
}
@media (prefers-reduced-motion: reduce) {
  .manifesto { height: auto; }
  .manifesto__sticky { position: relative; height: auto; padding-block: var(--space-section); }
  .manifesto__text .word { color: var(--aedb-white); transition: none; }
  .manifesto__mark { color: var(--gold-500); transition: none; }
}

/* ---------- Match banners (section 3): pinned slide-to-center with hold ---------- */
.match-pin { height: 280vh; padding-block: 0; width: 100vw; margin-inline: calc(50% - 50vw); }
.match-pin__sticky {
  background: var(--aedb-navy);
  position: sticky; top: var(--nav-height); height: calc(100vh - var(--nav-height));
  display: grid; place-items: center; overflow: hidden;
}
.match-pin__sticky .section__head { position: absolute; inset: 0; display: flex; flex-direction: column; align-items: center; justify-content: center; text-align: center; z-index: 0; padding-inline: var(--container-pad); }
.match-banners { position: relative; z-index: 1; display: flex; flex-direction: column; gap: var(--space-4); width: 100%; }
.match-title { font-family: var(--font-body); text-transform: uppercase; letter-spacing: 0.02em; line-height: 1.1; font-size: clamp(2rem, 5vw, 4rem); }
.match-title .word { color: rgba(255, 255, 255, 0.22); transition: color 120ms linear; }
.match-title .word.is-active { color: var(--gold-400); }
@media (prefers-reduced-motion: reduce) { .match-title .word { color: var(--gold-400); transition: none; } }
.match-banners { display: flex; flex-direction: column; gap: var(--space-4); }
.match-banner {
  display: grid; grid-template-columns: 3fr 1fr; align-items: stretch;
  background: var(--surface-card); overflow: hidden; box-shadow: var(--shadow-md);
  width: min(1440px, 92vw); margin-inline: auto; will-change: transform;
  height: max(190px, calc((100vh - var(--nav-height) - 130px) / 2));
  isolation: isolate;
}
.match-banner__media { overflow: hidden; background: var(--navy-700); min-height: 0; height: 100%; }
.match-banner__media img { width: 100%; height: 100%; object-fit: cover; display: block; }
.match-banner__body { padding: clamp(10px, 1.6vh, 22px) var(--space-5); display: flex; flex-direction: column; justify-content: center; gap: clamp(4px, 0.8vh, 10px); min-width: 0; }
.match-banner__k { font-family: var(--font-body); text-transform: uppercase; letter-spacing: 0.22em; font-size: clamp(0.62rem, 1.3vh, 0.78rem); color: var(--white-80); }
.match-banner__t { font-family: var(--font-body); font-size: clamp(1.1rem, 2.6vh, 1.8rem); color: var(--white); line-height: 1.1; }
.match-banner__p { font-family: var(--font-body); font-size: clamp(0.78rem, 1.5vh, 0.95rem); color: var(--white-80); line-height: 1.35; }
.match-banner .aedb-btn { align-self: flex-start; margin-top: clamp(2px, 0.6vh, 8px); }
.match-banner[data-dir="right"] { grid-template-columns: 1fr 3fr; }
.match-banner[data-dir="right"] .match-banner__media { order: 2; }
.match-banner[data-dir="right"] .match-banner__body { order: 1; }
.match-pin .match-banners { align-items: center; gap: var(--space-4); }
.match-frame { border-radius: var(--radius-lg); overflow: hidden; box-shadow: var(--shadow-md); border: 1px solid var(--white-08); background: var(--navy-700); width: min(1440px, 92vw); margin-inline: auto; will-change: transform; }
.match-frame img { display: block; width: 100%; height: calc((100vh - var(--nav-height) - 230px) / 2); object-fit: cover; }
.match-cta { display: flex; justify-content: center; margin-top: var(--space-2); opacity: 0; transform: translateY(16px); transition: opacity 500ms ease, transform 600ms cubic-bezier(0.22, 1, 0.36, 1); }
.match-pin.is-cta-in .match-cta { opacity: 1; transform: none; }
.match-pin__sticky .section__head { transition: opacity 260ms ease; }
.match-pin.is-title-gone .section__head { opacity: 0 !important; }
@media (prefers-reduced-motion: reduce) {
  .match-pin { height: auto; padding-block: var(--space-section); }
  .match-pin__sticky { position: relative; top: 0; height: auto; overflow: visible; }
  .match-frame { transform: none !important; }
  .match-frame img { max-height: none; }
  .match-cta { opacity: 1 !important; transform: none !important; }
}
@media (max-width: 760px) {
  .match-banner { grid-template-columns: 1fr; }
}

/* ---------- Match cards (section 3) ---------- */
.card-duo { display: grid; grid-template-columns: 1fr 1fr; gap: var(--space-6); }
.match-card {
  background: var(--surface-card);
  border-radius: var(--radius-lg);
  overflow: hidden; box-shadow: var(--shadow-md);
  display: flex; flex-direction: column;
  transition: transform var(--dur) var(--ease-out), box-shadow var(--dur) var(--ease-out);
}
.match-card:hover { transform: translateY(-6px); box-shadow: var(--shadow-lg); }
.match-card__media { aspect-ratio: 16 / 9; overflow: hidden; background: var(--navy-700); }
.match-card__media img { width: 100%; height: 100%; object-fit: cover; display: block; transition: transform var(--dur) var(--ease-out); }
.match-card:hover .match-card__media img { transform: scale(1.03); }
.match-card__body { padding: var(--space-5) var(--space-6); display: flex; flex-direction: column; gap: var(--space-3); }
.match-card__k { font-family: var(--font-body); text-transform: uppercase; letter-spacing: 0.22em; font-size: var(--fs-caption); color: var(--white-80); }
.match-card__t { font-family: var(--font-body); font-size: var(--fs-h2); color: var(--white); }
.match-card__p { font-family: var(--font-body); font-size: var(--fs-small); color: var(--white-80); }

/* ---------- Ultime Notizie: white pinned section — title highlights centered, docks to top, tiles reveal ---------- */
.news-pin { height: 320vh; padding-block: 0; width: 100vw; margin-inline: calc(50% - 50vw); background: var(--aedb-navy); }
.news-pin__sticky {
  position: sticky; top: var(--nav-height); height: calc(100vh - var(--nav-height));
  display: flex; flex-direction: column; justify-content: center;
  padding-inline: var(--container-pad);
  background: #123b66;
}
.news-head {
  text-align: center; position: relative; z-index: 2;
  transform: translateY(var(--news-head-shift, 0px));
  transition: transform 800ms cubic-bezier(0.22, 1, 0.36, 1);
}
.news-pin.is-docked .news-head { transform: none; }
.news-title { font-family: var(--font-body); text-transform: uppercase; letter-spacing: 0.02em; line-height: 1.1; font-size: clamp(2.6rem, 6.5vw, 5.2rem); margin: 0; }
.news-title .word { color: rgba(255, 255, 255, 0.22); transition: color 120ms linear; }
.news-title .word.is-active { color: var(--gold-400); }
.news-sub { position: relative; margin: var(--space-4) auto 0; padding-top: var(--space-4); text-transform: uppercase; letter-spacing: 0.2em; font-size: clamp(0.95rem, 1.5vw, 1.25rem); font-weight: 400; }
.news-sub__rule { position: absolute; top: 0; left: 50%; transform: translateX(-50%) scaleX(var(--rule-scale, 0)); transform-origin: center; width: clamp(90px, 12vw, 170px); height: 1px; background: var(--gold-400); transition: transform 520ms cubic-bezier(0.22, 1, 0.36, 1); }
.news-sub .word { color: rgba(255, 255, 255, 0.18); transition: color 120ms linear; }
.news-sub .word.is-active { color: rgba(255, 255, 255, 0.82); }
.news-sub .news-sub__accent.is-active { color: rgba(255, 255, 255, 0.82); }
.news-pin .ig-grid { margin-top: var(--space-6); }
.news-pin.is-scrolly .ig-tile {
  opacity: 0; transform: translateY(48px) scale(0.96);
  transition: opacity 600ms ease-out, transform 750ms cubic-bezier(0.22, 1, 0.36, 1);
}
.news-pin.is-scrolly .ig-tile.is-shown { opacity: 1; transform: none; }
.news-pin.is-scrolly .news-pin__cta {
  opacity: 0; transform: translateY(48px) scale(0.96);
  transition: opacity 600ms ease-out, transform 750ms cubic-bezier(0.22, 1, 0.36, 1);
}
.news-pin.is-scrolly .news-pin__cta.is-shown { opacity: 1; transform: none; }
@media (prefers-reduced-motion: reduce) {
  .news-pin { height: auto; padding-block: var(--space-section); }
  .news-pin__sticky { position: relative; top: 0; height: auto; }
  .news-pin.is-scrolly .ig-tile { opacity: 1; transform: none; transition: none; }
  .news-pin.is-scrolly .news-pin__cta { opacity: 1; transform: none; transition: none; }
  .news-head { transform: none !important; transition: none; }
  .news-title .word { color: var(--gold-400); transition: none; }
  .news-sub .word { color: rgba(255, 255, 255, 0.82); transition: none; }
  .news-sub .news-sub__accent { color: var(--gold-400); }
  .news-sub__rule { transform: translateX(-50%) scaleX(1); transition: none; }
}

/* ---------- Instagram (section 4) ---------- */
.ig-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: var(--space-4); }
.ig-tile {
  position: relative; aspect-ratio: 4/5; border-radius: var(--radius-md);
  overflow: hidden; background: linear-gradient(160deg, var(--navy-600), var(--navy-800));
  display: grid; place-items: center; box-shadow: var(--shadow-sm);
}
.ig-tile__ph { font-family: var(--font-brand); color: var(--white-40); font-size: 44px; letter-spacing: 0.06em; }
.ig-tile img { position:absolute; inset:0; width:100%; height:100%; object-fit: cover; transition: transform var(--dur) var(--ease-out); }
.ig-tile a { position: absolute; inset: 0; display: block; }
.ig-tile__overlay {
  position: absolute; inset: 0; padding: var(--space-4);
  background: linear-gradient(180deg, rgba(11,36,64,0) 45%, rgba(11,36,64,0.85));
  display: flex; align-items: flex-end; gap: var(--space-2);
  opacity: 0.7; transition: opacity var(--dur) var(--ease-out);
  pointer-events: none;
}
.ig-tile:hover .ig-tile__overlay { opacity: 1; }
.ig-tile:hover img { transform: scale(1.06); }
.ig-tile__overlay span {
  font-family: var(--font-body); font-size: var(--fs-caption); letter-spacing: 0.02em; color: var(--white);
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.ig-tile__glyph { width: 22px; height: 22px; flex: none; }
.ig-tile--skeleton { animation: igPulse 1.6s ease-in-out infinite; }
@keyframes igPulse { 0%, 100% { opacity: 1; } 50% { opacity: 0.55; } }
.ig-tile--error {
  grid-column: 1 / -1; aspect-ratio: auto; padding: var(--space-8) var(--space-6);
  background: var(--navy-700); border: 1px solid var(--white-08);
}
.ig-tile--error span {
  font-family: var(--font-body); text-transform: uppercase; letter-spacing: 0.14em;
  font-size: var(--fs-caption); color: var(--white-64); text-align: center;
}
@media (prefers-reduced-motion: reduce) { .ig-tile--skeleton { animation: none; } }
@media (max-width: 720px) { .ig-grid { grid-template-columns: repeat(2, 1fr); } }

/* ---------- Shop (section 5): pinned — title highlights word-by-word, fades, then card rises in ---------- */
.shop-pin { height: 300vh; padding-block: 0; width: 100vw; margin-inline: calc(50% - 50vw); background: var(--aedb-navy); }
.shop-pin__sticky {
  position: sticky; top: var(--nav-height); height: calc(100vh - var(--nav-height));
  display: flex; align-items: center; justify-content: center;
  padding-inline: var(--container-pad);
}
.shop-pin__stack { position: relative; width: 100%; max-width: 1200px; display: grid; place-items: center; }
.shop-pin__stack > * { grid-area: 1 / 1; }
.shop-head { text-align: center; transition: opacity 500ms ease, transform 700ms cubic-bezier(0.22, 1, 0.36, 1); }
.shop-title { font-family: var(--font-body); text-transform: uppercase; letter-spacing: 0.02em; line-height: 1.1; font-size: clamp(2.6rem, 6.5vw, 5.2rem); margin: 0; }
.shop-title .word { color: rgba(255, 255, 255, 0.22); transition: color 120ms linear; }
.shop-title .word.is-active { color: var(--gold-400); }
.shop-reveal { display: flex; flex-direction: column; align-items: center; width: 100%; }
.shop-sub { font-family: var(--font-body); text-transform: uppercase; letter-spacing: 0.02em; line-height: 1.1; font-size: clamp(2.6rem, 6.5vw, 5.2rem); text-align: center; margin: 0 0 var(--space-5); }
.shop-sub .word { color: rgba(255, 255, 255, 0.22); transition: color 120ms linear; }
.shop-sub .word.is-active { color: var(--gold-400); }
.shop-pin.is-scrolly .shop-sub { opacity: 0; transform: translateY(20px); transition: opacity 500ms ease-out, transform 650ms cubic-bezier(0.22, 1, 0.36, 1); }
.shop-pin.is-scrolly .shop-sub.is-shown { opacity: 1; transform: none; }
.shop-pin.is-title-out .shop-head { opacity: 0; transform: translateY(-28px); pointer-events: none; }
.shop-pin__stack .coming { width: 100%; }
.shop-pin.is-scrolly .coming { opacity: 0; transform: translateY(48px) scale(0.98); transition: opacity 600ms ease-out, transform 750ms cubic-bezier(0.22, 1, 0.36, 1); }
.shop-pin.is-scrolly .coming.is-shown { opacity: 1; transform: none; }
@media (prefers-reduced-motion: reduce) {
  .shop-pin { height: auto; padding-block: var(--space-section); }
  .shop-pin__sticky { position: relative; top: 0; height: auto; }
  .shop-pin__stack { display: block; }
  .shop-head { margin-bottom: var(--space-7); }
  .shop-title .word, .shop-sub .word { color: var(--gold-400); }
  .shop-pin.is-title-out .shop-head { opacity: 1; transform: none; }
  .shop-pin.is-scrolly .coming, .shop-pin.is-scrolly .shop-sub { opacity: 1; transform: none; transition: none; }
}

.coming {
  position: relative; border-radius: var(--radius-xl); overflow: hidden;
  min-height: 480px; display: grid; place-items: center; text-align: center;
  box-shadow: var(--shadow-lg);
}
.coming img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.coming::before { content:""; position:absolute; inset:0; background: rgba(11,36,64,0.35); }
.coming__inner { position: relative; z-index: 1; display:flex; flex-direction:column; gap: var(--space-4); align-items:center; padding: var(--space-6); }
.coming__soon { font-family: var(--font-brand); color: var(--white); font-size: var(--fs-hero); line-height: 1; letter-spacing: 0.04em; text-shadow: 0 4px 30px rgba(0,0,0,0.4); animation: floaty 6s ease-in-out infinite; }
.coming__sub { font-family: var(--font-body); text-transform: uppercase; letter-spacing: 0.3em; font-size: var(--fs-small); color: var(--gold-300); }
@keyframes floaty { 0%,100% { transform: translateY(0); } 50% { transform: translateY(-10px); } }
@media (prefers-reduced-motion: reduce) { .coming__soon { animation: none; } }

/* ---------- Sponsors (section 6): pinned horizontal scroll ---------- */
.sponsor-pin { height: 260vh; padding-block: 0; width: 100vw; margin-inline: calc(50% - 50vw); }
.sponsor-pin__sticky {
  background: var(--aedb-navy);
  position: sticky; top: var(--nav-height); height: calc(100vh - var(--nav-height));
  display: flex; flex-direction: column; justify-content: center; gap: var(--space-7);
  overflow: hidden;
}
.sponsor-pin .sponsor-head { text-align: center; position: relative; z-index: 3; padding-inline: var(--container-pad); transform: translateY(var(--sp-head-shift, 0px)); transition: transform 800ms cubic-bezier(0.22, 1, 0.36, 1); }
.sponsor-pin.is-docked .sponsor-head { transform: none; }
.sponsor-title { font-family: var(--font-body); text-transform: uppercase; letter-spacing: 0.02em; line-height: 1.1; font-size: clamp(2.6rem, 6.5vw, 5.2rem); margin: 0; }
.sponsor-title .word { color: rgba(255, 255, 255, 0.22); transition: color 120ms linear; }
.sponsor-title .word.is-active { color: var(--gold-400); }
.sponsor-rows { display: flex; flex-direction: column; gap: var(--space-5); opacity: 0; transition: opacity 650ms ease; }
.sponsor-pin.is-cards-in .sponsor-rows { opacity: 1; }
.sponsor-row {
  display: flex; gap: var(--space-5); width: max-content; padding-block: 6px;
  will-change: transform;
}
@media (prefers-reduced-motion: reduce) {
  .sponsor-pin { height: auto; padding-block: var(--space-section); }
  .sponsor-pin__sticky { position: relative; top: 0; height: auto; overflow: visible; }
  .sponsor-pin .sponsor-head { position: static; opacity: 1 !important; transform: none !important; margin-bottom: var(--space-6); }
  .sponsor-title .word { color: var(--gold-400); }
  .sponsor-rows { align-items: center; opacity: 1 !important; }
  .sponsor-row { flex-wrap: wrap; justify-content: center; width: 100%; transform: none !important; }
}

/* ---------- Sponsors (section 6) ---------- */
.marquee {
  overflow: hidden; padding-top: 12px; margin-top: -12px;
  -webkit-mask-image: linear-gradient(90deg, transparent, #000 8%, #000 92%, transparent);
  mask-image: linear-gradient(90deg, transparent, #000 8%, #000 92%, transparent);
}
.marquee__track { display: flex; gap: var(--space-5); width: max-content; animation: marquee 32s linear infinite; }
.marquee:hover .marquee__track { animation-play-state: paused; }
.sponsor {
  flex: none; width: 220px; height: 120px; border-radius: var(--radius-lg);
  background: rgba(255,255,255,0.05); border: 1px solid var(--white-08);
  display: grid; place-items: center; color: var(--white-40);
  font-family: var(--font-body); letter-spacing: 0.16em; text-transform: uppercase; font-size: var(--fs-caption);
  transition: background var(--dur) var(--ease-out), color var(--dur) var(--ease-out), border-color var(--dur) var(--ease-out), transform var(--dur) var(--ease-out);
}
.sponsor:hover { background: var(--white-08); color: var(--gold-300); border-color: var(--gold-500); transform: translateY(-4px); }
@keyframes marquee { from { transform: translateX(0); } to { transform: translateX(-50%); } }
@media (prefers-reduced-motion: reduce) { .marquee__track { animation: none; } }

/* ---------- Contatti (section 7): pinned — title docks, cards slide in, rule expands ---------- */
.contact-pin { height: 300vh; padding-block: 0; width: 100vw; margin-inline: calc(50% - 50vw); }
.contact-pin__sticky {
  background: var(--aedb-navy);
  position: sticky; top: var(--nav-height); height: calc(100vh - var(--nav-height));
  display: flex; flex-direction: column; justify-content: center; gap: var(--space-6);
  padding-inline: var(--container-pad); overflow: hidden;
}
.contact-pin .contact-head { text-align: center; position: relative; z-index: 3; transform: translateY(var(--ct-head-shift, 0px)); transition: transform 800ms cubic-bezier(0.22, 1, 0.36, 1); }
.contact-pin.is-docked .contact-head { transform: none; }
.contact-title { font-family: var(--font-body); text-transform: uppercase; letter-spacing: 0.02em; line-height: 1.1; font-size: clamp(2.6rem, 6.5vw, 5.2rem); margin: 0; }
.contact-title .word { color: rgba(255, 255, 255, 0.22); transition: color 120ms linear; }
.contact-title .word.is-active { color: var(--gold-400); }
.contact-pin .contact-grid { width: 100%; }
.contact-pin .map-frame, .contact-pin .contact-info { opacity: 0; transition: opacity 700ms ease, transform 850ms cubic-bezier(0.22, 1, 0.36, 1); }
.contact-pin .map-frame { transform: translateX(-80px); }
.contact-pin .contact-info { transform: translateX(80px); justify-content: center; background: rgba(255, 255, 255, 0.04); border: 1px solid var(--white-08); border-radius: var(--radius-lg); box-shadow: var(--shadow-md); padding: var(--space-6); }
.contact-pin.is-cards-in .map-frame, .contact-pin.is-cards-in .contact-info { opacity: 1; transform: none; }
.contact-rule { display: block; height: 2px; width: clamp(140px, 20vw, 300px); margin-inline: auto; background: var(--gold-400); transform: scaleX(var(--ct-rule-scale, 0)); transform-origin: center; transition: transform 200ms linear; }
@media (prefers-reduced-motion: reduce) {
  .contact-pin { height: auto; padding-block: var(--space-section); }
  .contact-pin__sticky { position: relative; top: 0; height: auto; overflow: visible; }
  .contact-pin .contact-head { transform: none !important; margin-bottom: var(--space-6); }
  .contact-title .word { color: var(--gold-400); }
  .contact-pin .map-frame, .contact-pin .contact-info { opacity: 1 !important; transform: none !important; }
  .contact-rule { transform: scaleX(1) !important; }
}
.contact-grid { display: grid; grid-template-columns: 1.1fr 0.9fr; gap: var(--space-6); align-items: stretch; }
.map-frame { border-radius: var(--radius-lg); overflow: hidden; border: 1px solid var(--white-08); box-shadow: var(--shadow-md); min-height: 380px; }
.map-frame iframe { width: 100%; height: 100%; min-height: 380px; border: 0; display:block; filter: grayscale(0.2) brightness(0.95); }
.contact-info { display:flex; flex-direction:column; gap: var(--space-5); }
.contact-item { display:flex; flex-direction:column; gap: 4px; }
.contact-item .lbl { font-family: var(--font-body); text-transform: uppercase; letter-spacing: 0.22em; font-size: var(--fs-caption); color: var(--gold-300); }
.contact-item .val { font-family: var(--font-body); font-size: var(--fs-lead); color: var(--white); }
.contact-item .val a:hover { color: var(--gold-300); }
.social-links { display: inline-flex; align-items: center; gap: var(--space-2); flex-wrap: wrap; }
.social-links a { display: inline-flex; align-items: center; gap: 6px; }

/* ---------- Contact form (contatti page) ---------- */
.contact-form { display: flex; flex-direction: column; gap: var(--space-4); }
.field { display: flex; flex-direction: column; gap: var(--space-2); }
.field label { font-family: var(--font-body); text-transform: uppercase; letter-spacing: 0.18em; font-size: var(--fs-caption); color: var(--gold-300); }
.field input, .field textarea {
  font-family: var(--font-body); font-size: var(--fs-small); color: var(--white);
  background: rgba(255,255,255,0.05); border: 1px solid var(--white-16);
  border-radius: var(--radius-sm); padding: 14px 16px; width: 100%;
  transition: border-color var(--dur-fast) var(--ease-out), background var(--dur-fast) var(--ease-out);
}
.field textarea { resize: vertical; min-height: 130px; }
.field input::placeholder, .field textarea::placeholder { color: var(--white-40); }
.field input:focus, .field textarea:focus { outline: none; border-color: var(--gold-400); background: rgba(255,255,255,0.08); }
.form-note { font-family: var(--font-body); font-size: var(--fs-caption); color: var(--gold-300); min-height: 1.2em; }

/* ---------- Footer ---------- */
body:has(.pin-sec) { background: var(--aedb-navy); }
.footer { background: var(--aedb-navy); border-top: 1px solid var(--white-08); padding-top: 0; overflow: hidden; }
.footer > .aedb-container:empty { display: none; }
.footer__legal {
  font-family: var(--font-body); font-size: var(--fs-caption); color: var(--white-40);
  text-align: center; padding-bottom: var(--space-5);
}
.footer__legal a { color: var(--gold-300); }
.footer__legal a:hover { color: var(--gold-400); }
.footer__word {
  display: flex; justify-content: space-between; align-items: flex-end;
  width: 100%; padding: 0 4px;
  overflow: visible;
  font-family: var(--font-body); color: var(--gold-500);
  font-size: 20.5vw; line-height: 1; margin-top: 0; margin-bottom: -0.1em; padding-top: 0.08em;
  letter-spacing: -0.02em;
  text-transform: uppercase;
  user-select: none;
}
.footer__letter {
  display: inline-block;
  transform: translateY(112%); opacity: 0;
  transition: transform 850ms cubic-bezier(0.22, 1, 0.36, 1), opacity 500ms ease-out;
}
.footer__word.is-visible .footer__letter { transform: none; opacity: 1; }
.footer__word.is-visible .footer__letter:nth-child(1) { transition-delay: 0ms; }
.footer__word.is-visible .footer__letter:nth-child(2) { transition-delay: 55ms; }
.footer__word.is-visible .footer__letter:nth-child(3) { transition-delay: 110ms; }
.footer__word.is-visible .footer__letter:nth-child(4) { transition-delay: 165ms; }
.footer__word.is-visible .footer__letter:nth-child(5) { transition-delay: 220ms; }
.footer__word.is-visible .footer__letter:nth-child(6) { transition-delay: 275ms; }
.footer__word.is-visible .footer__letter:nth-child(7) { transition-delay: 330ms; }
.footer__word.is-visible .footer__letter:nth-child(8) { transition-delay: 385ms; }
.footer__word.is-visible .footer__letter:nth-child(9) { transition-delay: 440ms; }

.reveal-fallback .footer__letter { transform: none; opacity: 1; transition: none; }
@media (prefers-reduced-motion: reduce) {
  .footer__letter { transform: none; opacity: 1; transition: none; }
}

/* ---------- Page hero (subpages) ---------- */
.page-hero { padding-top: clamp(56px, 8vw, 96px); padding-bottom: clamp(32px, 4vw, 56px); }
.page-hero .eyebrow { margin-bottom: var(--space-3); }
.page-hero h1 { font-family: var(--font-body); font-size: var(--fs-display); color: var(--white); line-height: var(--lh-snug); }
.page-hero p { font-family: var(--font-body); font-size: var(--fs-lead); color: var(--white-64); max-width: 680px; margin-top: var(--space-4); }

/* ---------- Team subpage: unified pinned sections (title highlights, then content rises) ---------- */
.pin-sec { width: 100vw; margin-inline: calc(50% - 50vw); background: var(--aedb-navy); }
.pin-sec__sticky { display: flex; flex-direction: column; align-items: center; gap: clamp(24px, 4vh, 52px); padding-block: clamp(48px, 8vh, 96px); padding-inline: var(--container-pad); }
.pin-sec__head { text-align: center; max-width: 1000px; margin-inline: auto; }
.pin-sec__title { font-family: var(--font-body); text-transform: uppercase; letter-spacing: 0.02em; line-height: 1.1; font-size: clamp(2.6rem, 6.5vw, 5.2rem); margin: 0; }
.pin-sec__title .word { color: rgba(255, 255, 255, 0.22); transition: color 120ms linear; }
.pin-sec__title .word.is-active { color: var(--gold-400); }
.pin-sec__title .char { color: rgba(255, 255, 255, 0.22); transition: color 120ms linear; }
.pin-sec__title .char.is-active { color: var(--gold-400); }
.pin-sec__sub { font-family: var(--font-body); text-transform: uppercase; letter-spacing: 0.04em; font-size: var(--fs-lead); color: var(--white-64); max-width: 720px; margin: var(--space-4) auto 0; }
.pin-sec__sub .word { color: rgba(255, 255, 255, 0.2); transition: color 120ms linear; }
.pin-sec__sub .word.is-active { color: var(--white-80); }
.pin-sec__body { width: min(1200px, 92vw); display: flex; flex-direction: column; gap: var(--space-5); align-items: center; }
.pin-sec__body--bleed { width: 100vw; }
.pin-sec__body .roster-marquee-live, .pin-sec__body .roster-marquee { width: 100%; align-self: stretch; }
.pin-sec__body .team-photo-card { width: 100%; }
.pin-sec__body .team-photo-card image-slot { width: 100%; height: clamp(240px, 40vh, 380px); }
.pin-sec__body .thumb-frame { width: 100%; }
.pin-sec__body .team-actions { margin-top: 0; }
.pin-sec.is-scrolly { height: 260vh; position: relative; }
.pin-sec.is-scrolly .pin-sec__sticky { position: sticky; top: var(--nav-height); height: calc(100vh - var(--nav-height)); display: block; padding-block: 0; overflow: hidden; }
.pin-sec.is-scrolly .pin-sec__head { position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); width: min(1000px, 92vw); will-change: transform; z-index: 2; }
.pin-sec.is-scrolly .pin-sec__body { position: absolute; left: 50%; top: 32vh; transform: translate(-50%, 0) translateY(90vh); opacity: 0; will-change: transform, opacity; }
.pin-sec.is-scrolly .pin-sec__body--bleed { left: 0; width: 100vw; transform: translate(0, 0) translateY(90vh); }
.pin-sec__body .player__name { text-transform: uppercase; letter-spacing: 0.04em; }
@media (prefers-reduced-motion: reduce) {
  .pin-sec.is-scrolly { height: auto; }
  .pin-sec.is-scrolly .pin-sec__sticky { position: relative; top: 0; height: auto; display: flex; padding-block: clamp(48px, 8vh, 96px); overflow: visible; }
  .pin-sec.is-scrolly .pin-sec__head, .pin-sec.is-scrolly .pin-sec__body { position: relative; left: auto; top: auto; transform: none !important; opacity: 1 !important; }
  .pin-sec.is-scrolly .pin-sec__title .word { color: var(--gold-400); }
  .pin-sec.is-scrolly .pin-sec__title .char { color: var(--gold-400); }
  .pin-sec.is-scrolly .pin-sec__sub .word { color: var(--white-80); }
}

/* ---------- Squad grid ---------- */
.squad-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: var(--space-6); }
.squad-card {
  background: rgba(255,255,255,0.04); border: 1px solid var(--white-08);
  border-radius: var(--radius-lg); padding: var(--space-6); display:flex; flex-direction:column; gap: var(--space-3);
  transition: transform var(--dur) var(--ease-out), border-color var(--dur) var(--ease-out);
}
.squad-card:hover { transform: translateY(-6px); border-color: var(--gold-500); }
.squad-card { position: relative; }
.squad-card .num { font-family: var(--font-brand); font-size: 40px; color: var(--gold-500); line-height: 1; }
.squad-card h3 { font-family: var(--font-body); font-size: var(--fs-h2); color: var(--white); }
.squad-card p { font-family: var(--font-body); font-size: var(--fs-small); color: var(--white-64); }
.squad-card__link {
  margin-top: auto; align-self: flex-start;
  font-family: var(--font-body); text-transform: uppercase; letter-spacing: 0.16em;
  font-size: var(--fs-caption); color: var(--gold-300);
  display: inline-flex; align-items: center; gap: 6px;
}
.squad-card__link::after { content: ""; position: absolute; inset: 0; }

/* ---------- Squadre page: pinned title + per-scroll card rows ---------- */
.squads-pin { height: 400vh; padding-block: 0; width: 100vw; margin-inline: calc(50% - 50vw); background: transparent; }
.squads-pin__sticky { position: sticky; top: var(--nav-height); height: calc(100vh - var(--nav-height)); display: flex; flex-direction: column; justify-content: flex-start; gap: clamp(6px, 1.2vh, 18px); padding-top: clamp(28px, 5vh, 72px); padding-bottom: clamp(8px, 1.4vh, 18px); padding-inline: var(--container-pad); overflow: hidden; }
.squads-head { text-align: center; position: relative; z-index: 3; transform: translateY(var(--sq-head-shift, 0px)); transition: transform 800ms cubic-bezier(0.22, 1, 0.36, 1); }
.squads-pin.is-docked .squads-head { transform: none; }
.squads-pin.is-docked .squads-sub { max-height: 0; margin: 0; opacity: 0; overflow: hidden; pointer-events: none; transition: opacity 300ms ease, max-height 300ms ease, margin 300ms ease; }
.squads-title { font-family: var(--font-body); text-transform: uppercase; letter-spacing: 0.02em; line-height: 1.1; font-size: clamp(3rem, 7.4vw, 6.4rem); margin: 0; transition: font-size 500ms cubic-bezier(0.22, 1, 0.36, 1); }
.squads-pin.is-docked .squads-title { font-size: clamp(1.5rem, 3.5vh, 2.9rem); }
.squads-title .word { color: rgba(255, 255, 255, 0.22); transition: color 120ms linear; }
.squads-title .word.is-active { color: var(--gold-400); }
.squads-sub { font-family: var(--font-body); text-transform: uppercase; letter-spacing: 0.06em; font-size: clamp(0.95rem, 2.4vh, 1.3rem); line-height: 1.5; max-width: 820px; margin: clamp(12px, 2.2vh, 24px) auto 0; }
.squads-sub .word { color: rgba(255, 255, 255, 0.22); transition: color 120ms linear; }
.squads-sub .word.is-active { color: var(--white-80); }
.squads-rows { display: flex; flex-direction: column; gap: clamp(6px, 1vh, 14px); width: min(1520px, 90vw); margin-inline: auto; margin-top: clamp(10px, 2.4vh, 40px); }
.squads-row { display: flex; flex-wrap: wrap; justify-content: center; gap: clamp(6px, 1vh, 14px) clamp(14px, 1.6vw, 26px); }
.squads-row .sqc { flex: 0 0 calc(25% - 20px); min-width: 0; }
.sqc { position: relative; display: block; overflow: hidden; border-radius: var(--radius-lg); border: 1px solid var(--white-16); background: var(--navy-800); height: clamp(118px, 20vh, 300px); text-decoration: none; color: inherit; cursor: pointer; opacity: 0; transform: translate(var(--dx, 0px), var(--dy, 0px)); transition: opacity 620ms ease, transform 820ms cubic-bezier(0.22, 1, 0.36, 1), border-color var(--dur) var(--ease-out), box-shadow var(--dur) var(--ease-out); }
.sqc.is-shown { opacity: 1; transform: translate(0px, 0px); }
.sqc.is-shown:hover { border-color: var(--gold-500); box-shadow: var(--shadow-md); }
.sqc::after { content: ""; position: absolute; inset: 0; border-radius: inherit; box-shadow: inset 0 0 0 1px rgba(255,255,255,0.06); pointer-events: none; z-index: 3; }
.sqc__media { position: absolute; inset: 0; background: linear-gradient(180deg, var(--navy-800), #071627); background-size: cover; background-position: center; transition: transform 700ms cubic-bezier(0.22, 1, 0.36, 1); }
.sqc.is-shown:hover .sqc__media { transform: scale(1.06); }
.sqc__scrim { position: absolute; inset: 0; background: linear-gradient(180deg, rgba(6,20,38,0) 32%, rgba(6,20,38,0.74) 100%); transition: background 400ms ease; }
.sqc.is-shown:hover .sqc__scrim { background: linear-gradient(180deg, rgba(6,20,38,0.18) 18%, rgba(6,20,38,0.88) 100%); }
.sqc__tag { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); font-family: var(--font-brand); text-transform: none; letter-spacing: 0.04em; font-size: clamp(1.1rem, 2.6vh, 1.9rem); color: var(--gold-300); z-index: 2; text-align: center; }
.sqc__name { position: absolute; left: clamp(13px,1.3vw,22px); right: clamp(13px,1.3vw,22px); bottom: clamp(11px,1.8vh,20px); margin: 0; font-family: var(--font-body); text-transform: uppercase; letter-spacing: 0.02em; line-height: 1.05; font-size: clamp(1rem, 2.4vh, 1.85rem); color: var(--white); z-index: 2; text-wrap: balance; }
@media (max-width: 640px) {
  .squads-pin { height: auto; padding-block: var(--space-section) var(--space-6); }
  .squads-pin__sticky { position: relative; top: 0; height: auto; overflow: visible; }
  .squads-head { transform: none !important; margin-bottom: var(--space-6); }
  .squads-title .word { color: var(--gold-400); }
  .squads-sub .word { color: var(--white-80); }
  .squads-row .sqc { flex: 0 0 100%; max-width: 460px; margin-inline: auto; height: clamp(200px, 54vw, 300px); }
  .sqc { opacity: 1 !important; transform: none !important; }
}
@media (prefers-reduced-motion: reduce) {
  .squads-pin { height: auto; padding-block: var(--space-section); }
  .squads-pin__sticky { position: relative; top: 0; height: auto; overflow: visible; }
  .squads-head { transform: none !important; margin-bottom: var(--space-6); }
  .squads-title .word { color: var(--gold-400); }
  .squads-sub .word { color: var(--white-80); }
  .squads-row { opacity: 1 !important; transform: none !important; }
  .sqc { opacity: 1 !important; transform: none !important; }
}

/* ---------- Team detail pages ---------- */
.back-link {
  display: inline-flex; align-items: center; gap: 8px;
  font-family: var(--font-body); text-transform: uppercase; letter-spacing: 0.16em;
  font-size: var(--fs-caption); color: var(--gold-500);
  transition: color var(--dur-fast) var(--ease-out);
}
.back-link:hover { color: var(--gold-300); }
.team-info-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: var(--space-6); }
.team-info-card {
  background: rgba(255,255,255,0.04); border: 1px solid var(--white-08);
  border-radius: var(--radius-lg); padding: var(--space-6);
  display: flex; flex-direction: column; gap: var(--space-3); min-height: 180px;
  transition: transform var(--dur) var(--ease-out), border-color var(--dur) var(--ease-out);
}
.team-info-card:hover { transform: translateY(-6px); border-color: var(--gold-500); }
.team-info-card h3 { font-family: var(--font-body); font-size: var(--fs-h3); color: var(--white); }
.team-info-card p { font-family: var(--font-body); font-size: var(--fs-small); color: var(--white-64); }
.team-info-card .soon {
  margin-top: auto; font-family: var(--font-body); text-transform: uppercase;
  letter-spacing: 0.22em; font-size: var(--fs-caption); color: var(--gold-300);
}

/* ---------- Prima Squadra: team photo, actions, player roster ---------- */
.team-photo-card { border-radius: var(--radius-xl); box-shadow: var(--shadow-lg); }
.team-actions { display: flex; gap: var(--space-4); justify-content: center; flex-wrap: wrap; margin-top: var(--space-6); }
.roster-marquee {
  overflow: hidden;
  -webkit-mask-image: linear-gradient(90deg, transparent, #000 8%, #000 92%, transparent);
  mask-image: linear-gradient(90deg, transparent, #000 8%, #000 92%, transparent);
}
.roster-track { display: flex; gap: var(--space-4); width: max-content; animation: marquee 68s linear infinite; }
.player-card {
  flex: none; width: 180px; height: 220px; border-radius: var(--radius-lg);
  background: linear-gradient(160deg, var(--navy-600), var(--navy-800));
  border: 1px solid var(--white-08);
  display: flex; flex-direction: column; align-items: center; justify-content: center; gap: var(--space-2);
}
.player-card .jersey { font-family: var(--font-brand); font-size: 52px; color: var(--gold-500); line-height: 1; }
.player-card .role { font-family: var(--font-body); text-transform: uppercase; letter-spacing: 0.16em; font-size: var(--fs-caption); color: var(--white-64); text-align: center; padding: 0 var(--space-3); }
@media (prefers-reduced-motion: reduce) { .roster-track { animation: none; } }

/* ---------- Value / society blocks ---------- */
.story-text {
  max-width: 860px; margin: 0 auto;
  display: flex; flex-direction: column; gap: var(--space-4);
}
.story-text p {
  font-family: var(--font-body); font-size: var(--fs-body); line-height: var(--lh-body); color: var(--white-80);
}
.story-text h3 {
  font-family: var(--font-body); font-size: var(--fs-h3); color: var(--gold-300);
  margin-top: var(--space-3);
}
.value-grid { display:grid; grid-template-columns: repeat(3,1fr); gap: var(--space-6); }
.value { display:flex; flex-direction:column; gap: var(--space-2); padding: var(--space-5); border-left: 2px solid var(--gold-500); background: rgba(255,255,255,0.03); border-radius: 0 var(--radius-md) var(--radius-md) 0; }
.value h3 { font-family: var(--font-body); font-size: var(--fs-h3); color: var(--white); }
.value p { font-family: var(--font-body); font-size: var(--fs-small); color: var(--white-64); }
.stat-row { display:grid; grid-template-columns: repeat(4,1fr); gap: var(--space-5); }
.stat { text-align:center; }
.stat .n { font-family: var(--font-brand); font-size: clamp(2.4rem,5vw,3.6rem); color: var(--gold-500); line-height:1; }
.stat .l { font-family: var(--font-body); text-transform:uppercase; letter-spacing: 0.18em; font-size: var(--fs-caption); color: var(--white-64); margin-top: var(--space-2); }
.stat .bar {
  height: 6px; margin-top: var(--space-4);
  background: var(--white-08); border-radius: var(--radius-pill); overflow: hidden;
}
.stat .bar i {
  display: block; height: 100%; width: 0;
  background: linear-gradient(90deg, var(--gold-700), var(--gold-400));
  border-radius: inherit;
  transition: width 1300ms cubic-bezier(0.22, 1, 0.36, 1);
}
.stat.is-filled .bar i { width: var(--fill, 100%); }
@media (prefers-reduced-motion: reduce) {
  .stat .bar i { width: var(--fill, 100%); transition: none; }
}

/* ---------- Responsive ---------- */
@media (max-width: 900px) {
  .hero__grid, .card-duo, .contact-grid { grid-template-columns: 1fr; }
  .ig-grid { grid-template-columns: repeat(2, 1fr); }
  .squad-grid, .value-grid, .stat-row, .team-info-grid { grid-template-columns: 1fr 1fr; }
  .logo-card { min-height: 340px; }
}
@media (max-width: 560px) {
  .ig-grid, .squad-grid, .value-grid, .stat-row, .team-info-grid { grid-template-columns: 1fr; }
  .nav__brand { font-size: 26px; }
}

/* ---------- Società: white pinned self-filling lines ---------- */
body.soc-page .nav { background: transparent; backdrop-filter: none; -webkit-backdrop-filter: none; border-bottom-color: transparent; }
body.soc-page .nav.nav--onlight { background: rgba(255, 255, 255, 0.9); border-bottom-color: rgba(18, 59, 102, 0.12); backdrop-filter: saturate(160%) blur(16px); -webkit-backdrop-filter: saturate(160%) blur(16px); }
body.soc-page .section--tight { background: var(--aedb-navy); }
.soc-open { position: relative; width: 100vw; margin-inline: calc(50% - 50vw); }
.soc-hero { position: sticky; top: var(--nav-height); height: calc(100vh - var(--nav-height)); display: grid; place-items: center; text-align: center; padding-inline: var(--container-pad); background: var(--aedb-navy); z-index: 1; }
.soc-hero__head { max-width: min(1000px, 92vw); will-change: opacity; }
.soc-gap { height: 90vh; background: var(--aedb-navy); }
@media (prefers-reduced-motion: reduce) { .soc-hero { position: relative; top: 0; height: auto; padding-block: var(--space-section); } .soc-gap { display: none; } }
.stats-pin { position: relative; z-index: 2; height: 260vh; background: var(--aedb-white); width: 100vw; margin-inline: calc(50% - 50vw); }
.stats-pin__sticky { position: sticky; top: var(--nav-height); height: calc(100vh - var(--nav-height)); display: flex; flex-direction: column; align-items: center; justify-content: center; gap: clamp(32px, 6vh, 68px); padding-inline: var(--container-pad); overflow: hidden; }
.stats-pin__head { text-align: center; }
.stats-pin__eyebrow { display: block; font-family: var(--font-body); text-transform: uppercase; letter-spacing: 0.32em; font-size: var(--fs-caption); color: var(--gold-700); margin-bottom: var(--space-3); }
.stats-pin__title { font-family: var(--font-body); text-transform: uppercase; letter-spacing: 0.02em; line-height: 1.1; font-size: clamp(2.2rem, 5vw, 4rem); margin: 0; }
.stats-pin__title .word { color: rgba(18, 59, 102, 0.18); transition: color 120ms linear; }
.stats-pin__title .word.is-active { color: var(--aedb-navy); }
.stats-pin__lines { width: min(880px, 92vw); display: flex; flex-direction: column; gap: clamp(22px, 3.6vh, 44px); }
.sline { opacity: 0; transform: translateY(30px); transition: opacity 640ms cubic-bezier(0.22, 1, 0.36, 1), transform 640ms cubic-bezier(0.22, 1, 0.36, 1); }
.sline.is-shown { opacity: 1; transform: none; }
.sline__top { display: flex; align-items: baseline; gap: var(--space-4); margin-bottom: var(--space-3); }
.sline__n { font-family: var(--font-brand); font-size: clamp(2rem, 4.6vw, 3.4rem); color: var(--gold-700); line-height: 1; }
.sline__l { font-family: var(--font-body); text-transform: uppercase; letter-spacing: 0.18em; font-size: var(--fs-small); color: var(--aedb-navy); }
.sline__bar { height: 8px; background: rgba(18, 59, 102, 0.12); border-radius: var(--radius-pill); overflow: hidden; }
.sline__bar i { display: block; height: 100%; width: 0; background: linear-gradient(90deg, var(--gold-700), var(--gold-400)); border-radius: inherit; transition: width 900ms cubic-bezier(0.22, 1, 0.36, 1); }
.sline.is-shown .sline__bar i { width: var(--fill, 100%); }
@media (prefers-reduced-motion: reduce) {
  .stats-pin { height: auto; }
  .stats-pin__sticky { position: relative; top: 0; height: auto; padding-block: var(--space-section); overflow: visible; }
  .stats-pin__title .word { color: var(--aedb-navy); }
  .sline { opacity: 1; transform: none; }
  .sline__bar i { width: var(--fill, 100%); transition: none; }
}

/* ---------- Società: uppercase prose (strutture + storia) ---------- */
.society-title { font-family: var(--font-body); text-transform: uppercase; letter-spacing: 0.02em; line-height: 1.1; font-size: clamp(2rem, 5vw, 3.6rem); color: var(--gold-400); margin: 0 0 var(--space-7); text-align: center; }
.society-prose { max-width: 1000px; margin: 0 auto; display: flex; flex-direction: column; gap: var(--space-5); }
.society-prose p { font-family: var(--font-body); text-transform: uppercase; letter-spacing: 0.05em; font-size: clamp(1.25rem, 2.3vw, 2rem); line-height: 1.7; text-wrap: pretty; text-align: justify; }
.society-prose .word { color: rgba(255, 255, 255, 0.22); transition: color 140ms linear; }
.society-prose .word.is-active { color: var(--white); }
@media (prefers-reduced-motion: reduce) { .society-prose .word { color: var(--white); } }

/* Società video: matches the homepage hero frame size */
.society-video { position: relative; left: 50%; transform: translateX(-50%); width: min(1600px, 94vw); aspect-ratio: 16 / 9; max-height: 78vh; margin: 0 auto var(--space-8); border-radius: var(--radius-xl); overflow: hidden; border: 1px solid var(--white-16); box-shadow: var(--shadow-lg); background: var(--navy-700); }
.society-video image-slot { width: 100%; height: 100%; display: block; }
.society-video__el { width: 100%; height: 100%; display: block; object-fit: cover; }

/* Società sponsor: full-bleed marquee band (not pinned) */
.sponsor-band { width: 100vw; margin-inline: calc(50% - 50vw); background: var(--aedb-navy); padding-block: clamp(48px, 8vh, 96px); }
.sponsor-band .society-title { margin-bottom: var(--space-8); }
.sponsor-band .roster-marquee-live { width: 100%; }

/* ===== Mobile fixes (v27) ===== */
@media (max-width: 640px) {
  /* Each pinned panel fills the EXACT mobile viewport (dvh tracks the browser
     toolbar) so no strip of the neighbouring section shows above or below */
  .hero-stage, .manifesto__sticky, .match-pin__sticky, .news-pin__sticky,
  .shop-pin__sticky, .sponsor-pin__sticky, .contact-pin__sticky,
  .stats-pin__sticky, .soc-hero, .squads-pin__sticky, .pin-sec.is-scrolly .pin-sec__sticky {
    height: calc(100dvh - var(--nav-height));
  }
  /* Home · Instagram CTA: breathing room before the next section */
  .news-pin__sticky { padding-bottom: clamp(44px, 9vh, 96px); }
  /* Team subpages · keep the "season" card + BOTH action buttons inside the pinned frame */
  .pin-sec.is-scrolly .pin-sec__body { top: 27vh; }
  .team-photo-card .season-soon { min-height: 0; padding: var(--space-5) var(--space-4); }
  .team-actions { margin-top: var(--space-4); gap: var(--space-3); }
}

/* ===== Home · full-bleed pinned sections (v28) ===== */
/* Give every pinned section its own solid colour on the OUTER wrapper (not just
   the inner sticky) so no strip of the neighbouring section shows above/below
   when 100vh doesn't match the mobile viewport. Navy sections were transparent. */
.hero, .match-pin, .sponsor-pin, .contact-pin { background: var(--aedb-navy); }

/* ===== Root background: no white flash anywhere (v29) ===== */
/* The page root is navy so Safari's toolbar surround, the safe-area insets and
   overscroll rubber-band never show white. overscroll-behavior stops the bounce
   that would otherwise flash the root colour past a section edge. */
html { background: var(--aedb-navy); overscroll-behavior: none; }
body { background: var(--aedb-navy); overscroll-behavior: none; }