/* ==========================================================================
   Istituto Scolastico Serena Andersen — homepage
   Palette e font ufficiali dal brand book (SER_stuff_new.pdf).
   ========================================================================== */

/* ---------- Font ufficiali ---------- */
@font-face { font-family: "Brandon Grotesque"; src: url("../fonts/brandon-300.woff2") format("woff2"); font-weight: 300; font-style: normal; font-display: swap; }
@font-face { font-family: "Brandon Grotesque"; src: url("../fonts/brandon-400.woff2") format("woff2"); font-weight: 400; font-style: normal; font-display: swap; }
@font-face { font-family: "Brandon Grotesque"; src: url("../fonts/brandon-400i.woff2") format("woff2"); font-weight: 400; font-style: italic; font-display: swap; }
@font-face { font-family: "Brandon Grotesque"; src: url("../fonts/brandon-500.woff2") format("woff2"); font-weight: 500; font-style: normal; font-display: swap; }
@font-face { font-family: "Brandon Grotesque"; src: url("../fonts/brandon-700.woff2") format("woff2"); font-weight: 700; font-style: normal; font-display: swap; }
@font-face { font-family: "Brandon Grotesque"; src: url("../fonts/brandon-900.woff2") format("woff2"); font-weight: 900; font-style: normal; font-display: swap; }
@font-face { font-family: "Heyzilla"; src: url("../fonts/heyzilla-400.woff2") format("woff2"); font-weight: 400; font-style: normal; font-display: swap; }

/* ---------- Token ---------- */
:root {
  /* Palette ufficiale */
  --navy: #1E3B6E;
  --green: #ACC738;
  --sky: #86B2E0;
  --red: #D71E4D;

  /* Toni di servizio derivati dalla palette (non sostituiscono i colori ufficiali) */
  --navy-deep: #152B52;   /* footer, overlay */
  --red-deep: #B8173F;    /* hover pulsante rosso */
  --paper: #F7F5F0;       /* fondo caldo neutro */
  --paper-2: #EEF3FA;     /* azzurro velato per i segnaposto */
  --white: #FFFFFF;
  --ink: var(--navy);
  --ink-soft: #3E5682;    /* testo secondario su chiaro (contrasto ≥ 7:1 su bianco) */
  --line: rgba(30, 59, 110, .14);

  --font-sans: "Brandon Grotesque", "Avenir Next", "Segoe UI", system-ui, sans-serif;
  --font-script: "Heyzilla", "Brush Script MT", cursive;

  /* Spaziature (scala 4/8) */
  --s-1: .25rem; --s-2: .5rem; --s-3: .75rem; --s-4: 1rem; --s-5: 1.5rem;
  --s-6: 2rem; --s-7: 3rem; --s-8: 4rem; --s-9: 6rem; --s-10: 8rem;
  --section-y: clamp(4rem, 9vw, 8rem);
  --gutter: clamp(1rem, 4vw, 2.5rem);
  --wrap: 1240px;
  --radius: 4px;
  --radius-lg: 14px;
  --header-h: 108px;
  --ease: cubic-bezier(.2, .7, .2, 1);
}

/* ---------- Base ---------- */
*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; scroll-behavior: smooth; scroll-padding-top: calc(var(--header-h) + 1rem); }
body {
  margin: 0;
  background: var(--paper);
  color: var(--ink);
  font-family: var(--font-sans);
  font-size: 1.125rem;
  line-height: 1.65;
  font-weight: 400;
  text-rendering: optimizeLegibility;
  -webkit-font-smoothing: antialiased;
  overflow-x: hidden;
}
img, video, svg { display: block; max-width: 100%; }
img { height: auto; }
h1, h2, h3 { margin: 0; line-height: 1.08; font-weight: 700; letter-spacing: -.005em; text-wrap: balance; }
h2 { font-size: clamp(2rem, 3.6vw, 3.1rem); }
h3 { font-size: 1.35rem; line-height: 1.2; }
p { margin: 0 0 1em; text-wrap: pretty; }
a { color: inherit; }
ul, ol { padding: 0; margin: 0; list-style: none; }

.wrap { width: min(100% - 2 * var(--gutter), var(--wrap)); margin-inline: auto; }
.center { text-align: center; }
.visually-hidden { position: absolute !important; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); clip-path: inset(50%); white-space: nowrap; }
.script { font-family: var(--font-script); font-weight: 400; letter-spacing: 0; line-height: 1.1; }
.lead { font-size: 1.3rem; line-height: 1.5; font-weight: 500; }

/* Focus visibile ovunque, adattato a fondo chiaro / scuro */
:focus-visible { outline: 3px solid var(--navy); outline-offset: 3px; border-radius: 2px; }
.hero :focus-visible, .party :focus-visible, .visit :focus-visible, .site-footer :focus-visible { outline-color: var(--white); }

.skip-link {
  position: absolute; left: 1rem; top: -100px; z-index: 100;
  background: var(--navy); color: var(--white); padding: .75rem 1.25rem; border-radius: var(--radius);
  font-weight: 700; text-decoration: none;
}
.skip-link:focus { top: 1rem; }

/* Bozza: banner e segnaposto */
.draft-banner { margin: 0; padding: .4rem var(--gutter); background: #FFF6CC; color: #4A3B00; font-size: .85rem; text-align: center; line-height: 1.4; }
mark.tbc { background: #FFF1A8; color: #4A3B00; padding: 0 .3em; border-radius: 3px; font-size: .9em; font-weight: 500; box-decoration-break: clone; -webkit-box-decoration-break: clone; }

/* ---------- Strisce palette (firma visiva) ---------- */
.stripe { display: grid; grid-template-columns: repeat(4, 1fr); height: 4px; }
.stripe span:nth-child(1) { background: var(--navy); }
.stripe span:nth-child(2) { background: var(--green); }
.stripe span:nth-child(3) { background: var(--sky); }
.stripe span:nth-child(4) { background: var(--red); }

/* ---------- Eyebrow ---------- */
.eyebrow {
  display: inline-flex; align-items: center; gap: .75rem;
  margin: 0 0 var(--s-4);
  font-size: .82rem; font-weight: 700; letter-spacing: .2em; text-transform: uppercase; color: var(--red);
}
.eyebrow::before { content: ""; width: 28px; height: 2px; background: currentColor; }
.eyebrow--light { color: var(--white); }
.eyebrow--light::before { background: var(--sky); }

/* ---------- Pulsanti ---------- */
.btn {
  --bg: var(--navy); --fg: var(--white); --bd: var(--navy);
  display: inline-flex; align-items: center; justify-content: center; gap: .5rem;
  min-height: 52px; padding: .8rem 1.6rem;
  border: 2px solid var(--bd); border-radius: 999px;
  background: var(--bg); color: var(--fg);
  font: 700 .95rem/1.1 var(--font-sans); letter-spacing: .1em; text-transform: uppercase; text-decoration: none;
  cursor: pointer;
  transition: background-color .25s var(--ease), color .25s var(--ease), border-color .25s var(--ease), transform .25s var(--ease);
}
.btn:hover { transform: translateY(-1px); }
.btn:active { transform: translateY(0); }
.btn--sm { white-space: nowrap; min-height: 44px; padding: .6rem 1.15rem; font-size: .82rem; }
.btn--red { --bg: var(--red); --bd: var(--red); }
.btn--red:hover { --bg: var(--red-deep); --bd: var(--red-deep); }
.btn--navy:hover { --bg: var(--navy-deep); --bd: var(--navy-deep); }
.btn--ghost-light { --bg: transparent; --fg: var(--white); --bd: rgba(255,255,255,.85); }
.btn--ghost-light:hover { --bg: var(--white); --fg: var(--navy); --bd: var(--white); }
.btn--light { --bg: var(--white); --fg: var(--navy); --bd: var(--white); }
.btn--light:hover { --bg: transparent; --fg: var(--white); }
/* CTA verso una pagina interna non ancora realizzata (solo in bozza) */
.btn.is-pending { flex-direction: column; gap: .2rem; cursor: help; border-style: dashed; --bg: transparent; --fg: var(--navy); --bd: var(--navy); border-radius: 18px; }
.btn--light.is-pending { --fg: var(--white); --bd: var(--white); }
.btn.is-pending small { font-size: .68rem; letter-spacing: .04em; text-transform: none; font-weight: 500; opacity: .8; }
.btn.is-pending:hover { transform: none; }

.btn--green { --bg: var(--green); --fg: var(--navy); --bd: var(--green); }
.btn--green:hover { --bg: #98B22C; --bd: #98B22C; }
.btn--outline { --bg: transparent; --fg: var(--navy); --bd: var(--navy); }
.btn--outline:hover { --bg: var(--navy); --fg: var(--white); }
.linklike { padding: 0; border: 0; background: none; color: inherit; font: inherit; text-decoration: underline; text-underline-offset: 3px; cursor: pointer; }

/* ---------- Header ---------- */
.site-header {
  position: sticky; top: 0; z-index: 50;
  background: var(--white);
  transition: box-shadow .3s var(--ease);
}
.site-header.is-scrolled { box-shadow: 0 6px 24px -12px rgba(21,43,82,.35); }
.site-header__inner { display: flex; align-items: center; gap: var(--s-5); min-height: var(--header-h); padding-block: 18px; }
.brand { flex: 0 0 auto; display: block; margin-right: clamp(1rem, 3vw, 3rem); }
.brand img { height: 72px; width: auto; }

.nav { margin-left: auto; }
.nav__list { display: flex; align-items: center; gap: clamp(1rem, 1.8vw, 1.9rem); }
.nav__list > li > a {
  position: relative; display: inline-block; padding: .4rem 0;
  font-size: .84rem; font-weight: 700; letter-spacing: .09em; text-transform: uppercase; text-decoration: none; color: var(--navy);
  white-space: nowrap;
}
.nav__list > li > a::after {
  content: ""; position: absolute; left: 0; right: 0; bottom: 0; height: 2px; background: var(--red);
  transform: scaleX(0); transform-origin: left; transition: transform .3s var(--ease);
}
.nav__list > li > a:hover::after, .nav__list > li > a:focus-visible::after, .nav__list > li > a[aria-current="page"]::after { transform: scaleX(1); }

/* Sottomenu Our Programs */
.has-sub { position: relative; display: flex; align-items: center; gap: .15rem; }
.sub-toggle { display: grid; place-items: center; width: 28px; height: 28px; padding: 0; border: 0; border-radius: 50%; background: none; color: var(--navy); cursor: pointer; }
.sub-toggle svg { width: 11px; height: 8px; transition: transform .25s var(--ease); }
.sub-toggle:hover { background: var(--paper-2); }
.has-sub.is-open .sub-toggle svg { transform: rotate(180deg); }
.sub {
  position: absolute; top: calc(100% + 14px); left: -1.25rem; z-index: 60;
  min-width: 320px; padding: .6rem;
  background: var(--white); border-radius: var(--radius-lg);
  box-shadow: 0 24px 50px -20px rgba(21,43,82,.45), 0 0 0 1px var(--line);
  visibility: hidden; opacity: 0; transform: translateY(-6px);
  transition: opacity .2s var(--ease), transform .2s var(--ease), visibility 0s linear .2s;
}
.sub::before { content: ""; position: absolute; left: 0; right: 0; top: -16px; height: 16px; } /* ponte per l'hover */
.has-sub.is-open .sub { visibility: visible; opacity: 1; transform: none; transition-delay: 0s; }
@media (hover: hover) and (min-width: 1101px) {
  .has-sub:hover .sub { visibility: visible; opacity: 1; transform: none; transition-delay: 0s; }
}
.sub a { display: flex; align-items: center; gap: .85rem; padding: .7rem .8rem; border-radius: 10px; text-decoration: none; color: var(--navy); }
.sub a:hover, .sub a:focus-visible { background: var(--paper); }
.sub strong { display: block; font-size: .98rem; line-height: 1.2; }
.sub small { display: block; font-size: .78rem; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; color: var(--ink-soft); }
.sub__dot { flex: 0 0 auto; width: 12px; height: 12px; border-radius: 50%; }
.sub__dot--green { background: var(--green); } .sub__dot--sky { background: var(--sky); }
.sub__dot--red { background: var(--red); } .sub__dot--navy { background: var(--navy); }

.site-header__actions { display: flex; align-items: center; gap: var(--s-4); }

.menu-toggle {
  display: none; width: 48px; height: 48px; padding: 0; border: 0; border-radius: 999px;
  background: var(--navy); color: var(--white); cursor: pointer;
}
.menu-toggle__bars { display: grid; gap: 5px; width: 20px; margin: auto; }
.menu-toggle__bars span { height: 2px; background: currentColor; border-radius: 2px; transition: transform .3s var(--ease), opacity .2s; }
.menu-toggle[aria-expanded="true"] .menu-toggle__bars span:nth-child(1) { transform: translateY(7px) rotate(45deg); }
.menu-toggle[aria-expanded="true"] .menu-toggle__bars span:nth-child(2) { opacity: 0; }
.menu-toggle[aria-expanded="true"] .menu-toggle__bars span:nth-child(3) { transform: translateY(-7px) rotate(-45deg); }

.mobile-cta { display: none; }

/* ---------- Hero homepage ---------- */
.hero {
  position: relative; isolation: isolate;
  min-height: min(88svh, 900px);
  display: flex; align-items: flex-end;
  color: var(--white);
  overflow: hidden;
}
.hero__media {
  position: absolute; inset: 0; z-index: -2;
  background:
    url("../video/hero-poster.jpg") center / cover no-repeat,
    url("../img/sa-pattern-light.svg") center / 900px auto repeat,
    var(--navy);
}
.hero__video { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; z-index: 1; }
.hero.is-fallback .hero__video { display: none; }
.hero__shade {
  position: absolute; inset: 0; z-index: -1; pointer-events: none;
  background:
    linear-gradient(180deg, rgba(21,43,82,.10) 0%, rgba(21,43,82,0) 30%, rgba(21,43,82,.55) 62%, rgba(21,43,82,.88) 100%),
    linear-gradient(90deg, rgba(21,43,82,.55) 0%, rgba(21,43,82,0) 65%);
}
.hero__content { position: relative; padding-block: var(--s-9) clamp(3rem, 7vw, 5.5rem); }
.hero__title {
  font-size: clamp(3.1rem, 8.4vw, 7.2rem); font-weight: 900; line-height: .92; letter-spacing: -.015em;
  text-transform: uppercase; max-width: 11ch;
  text-shadow: 0 2px 30px rgba(21,43,82,.35);
}
.hero__tagline { margin: .35em 0 .6em; font-size: clamp(2rem, 4.2vw, 3.4rem); color: var(--white); text-shadow: 0 2px 18px rgba(21,43,82,.5); }
.hero__intro { max-width: 34ch; font-size: clamp(1.15rem, 1.6vw, 1.35rem); line-height: 1.5; font-weight: 500; }
.hero__actions { display: flex; flex-wrap: wrap; align-items: center; gap: var(--s-4) var(--s-6); margin-top: var(--s-6); }
.hero__signature { margin: 0; font-size: clamp(1.6rem, 2.4vw, 2.1rem); color: var(--sky); text-shadow: 0 2px 14px rgba(21,43,82,.6); }
.hero__toggle {
  position: absolute; right: var(--gutter); bottom: var(--gutter); z-index: 2;
  display: grid; place-items: center; width: 48px; height: 48px; padding: 0;
  border: 1.5px solid rgba(255,255,255,.8); border-radius: 999px; background: rgba(21,43,82,.35); color: var(--white); cursor: pointer;
  transition: background-color .2s;
}
.hero__toggle:hover { background: rgba(21,43,82,.7); }
.hero__toggle svg { width: 20px; height: 20px; fill: currentColor; }
.hero__toggle[hidden] { display: none; }
.hero__toggle .i-play { display: none; }
.hero__toggle.is-paused .i-play { display: block; }
.hero__toggle.is-paused .i-pause { display: none; }

/* ---------- Hero pagine interne ---------- */
.page-hero { position: relative; overflow: hidden; background: var(--navy); color: var(--white); }
.page-hero__pattern { position: absolute; inset: 0; opacity: .3; pointer-events: none; background: url("../img/sa-pattern-light.svg") center / 1000px auto repeat; }
.page-hero--light .page-hero__pattern { opacity: .14; }
.page-hero__inner { position: relative; display: grid; grid-template-columns: 6fr 5fr; gap: clamp(2rem, 5vw, 5rem); align-items: center; padding-block: clamp(3rem, 6vw, 5.5rem); }
.page-hero h1 { font-size: clamp(2.4rem, 5vw, 4.4rem); font-weight: 900; line-height: 1; letter-spacing: -.01em; }
.page-hero__sub { margin: var(--s-4) 0 0; font-family: var(--font-script); font-size: clamp(1.7rem, 2.8vw, 2.5rem); line-height: 1.15; color: var(--sky); }
.page-hero__sub mark.tbc { font-family: var(--font-sans); font-size: 1rem; }
.page-hero .btn { margin-top: var(--s-6); }
.page-hero__actions { display: flex; flex-wrap: wrap; gap: var(--s-4); margin-top: var(--s-6); }
.page-hero__actions .btn { margin-top: 0; }
.page-hero__media img { width: 100%; aspect-ratio: 4 / 3; object-fit: cover; border-radius: var(--radius-lg); box-shadow: 0 30px 60px -30px rgba(0,0,0,.6); }
.page-hero--compact .page-hero__inner { padding-block: clamp(2.5rem, 5vw, 4rem); }
.page-hero--compact .page-hero__media img { aspect-ratio: 16 / 10; }
.page-hero--text .page-hero__inner { grid-template-columns: 1fr; max-width: 900px; margin-inline: auto; text-align: left; }
.age-chip { display: inline-block; margin: 0 0 var(--s-4); padding: .3rem .85rem; border-radius: 999px; background: var(--chip, var(--white)); color: var(--navy); font-size: .85rem; font-weight: 900; letter-spacing: .12em; text-transform: uppercase; }
.stage-theme--green { --chip: var(--green); } .stage-theme--sky { --chip: var(--sky); }
.stage-theme--red   { --chip: #F6C9D4; }    .stage-theme--navy { --chip: var(--white); }

.breadcrumb ol { display: flex; flex-wrap: wrap; gap: .4rem; margin: 0 0 var(--s-5); font-size: .85rem; font-weight: 500; color: rgba(255,255,255,.85); }
.breadcrumb li + li::before { content: "/"; margin-right: .4rem; opacity: .6; }
.breadcrumb a { text-decoration: none; }
.breadcrumb a:hover { text-decoration: underline; text-underline-offset: 3px; }

/* ---------- Sezioni ---------- */
.section { padding-block: var(--section-y); position: relative; }
.section--white { background: var(--white); }
.section--accent { background: var(--paper-2); }
.section--navy { background: var(--navy); color: var(--white); overflow: hidden; }
.section-head { max-width: 760px; margin-bottom: clamp(2.5rem, 5vw, 4rem); }
.section-head--center { margin-inline: auto; text-align: center; }
.section-head--center .eyebrow { justify-content: center; }
.narrow { max-width: 820px; }
.center { text-align: center; }

/* Testo a due colonne: titolo a sinistra, paragrafi a destra */
.prose-split { position: relative; display: grid; grid-template-columns: 4fr 7fr; gap: clamp(2rem, 6vw, 6rem); align-items: start; }
.prose-split__aside h2 { margin-bottom: var(--s-3); }
.prose-split__sub { font-family: var(--font-script); font-size: clamp(1.6rem, 2.4vw, 2.1rem); line-height: 1.2; color: var(--red); margin: 0; }
.prose-split__claim { font-size: clamp(2rem, 3vw, 2.6rem); color: var(--navy); margin: 0; }
.prose-split__body > :last-child { margin-bottom: 0; }
.prose-split--light .prose-split__sub { color: var(--sky); }
.prose-split--light a:not(.btn) { color: var(--white); text-decoration-color: var(--sky); text-decoration-thickness: 2px; text-underline-offset: 4px; }
.prose-split .btn { margin-top: var(--s-4); }

/* 2. What makes us different */
.different { background: var(--white); }
.different__grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: clamp(1.5rem, 3vw, 2.5rem); }
.pillar { padding-top: var(--s-5); border-top: 2px solid var(--line); }
.pillar__num { display: block; margin-bottom: var(--s-4); font-size: 2.6rem; font-weight: 900; line-height: 1; color: var(--accent); }
.pillar h3 { margin-bottom: var(--s-3); }
.pillar p { color: var(--ink-soft); margin: 0; }
.pillar__link { text-decoration: none; }
.pillar__link:hover { text-decoration: underline; text-decoration-color: var(--accent); text-decoration-thickness: 2px; text-underline-offset: 5px; }
.pillar--navy  { --accent: var(--navy);  border-top-color: var(--navy); }
.pillar--green { --accent: #7E9420;      border-top-color: var(--green); } /* numero: verde scurito per leggibilità */
.pillar--sky   { --accent: #4F7FB5;      border-top-color: var(--sky); }
.pillar--red   { --accent: var(--red);   border-top-color: var(--red); }

/* Tre blocchi (filosofia, percorsi) */
.trio { display: grid; grid-template-columns: repeat(3, 1fr); gap: clamp(1.25rem, 2.5vw, 2rem); }
.trio__item { padding: var(--s-6) var(--s-5); background: var(--paper); border-radius: var(--radius-lg); border-top: 6px solid var(--band); }
.section--accent .trio__item, .section .trio--cards .trio__item { background: var(--white); }
.trio__item h3 { margin-bottom: var(--s-3); }
.trio__item p { margin: 0; color: var(--ink-soft); }
.trio__item .pillar__num { color: var(--accent); }
.trio__item--green { --band: var(--green); --accent: #7E9420; }
.trio__item--sky   { --band: var(--sky);   --accent: #4F7FB5; }
.trio__item--red   { --band: var(--red);   --accent: var(--red); }
.trio--cards { margin-top: clamp(2.5rem, 5vw, 4rem); }
.trio--cards .trio__item { box-shadow: 0 0 0 1px var(--line); }

/* Split testo + immagine */
.split { display: grid; grid-template-columns: 5fr 6fr; gap: clamp(2rem, 6vw, 6rem); align-items: center; }
.split--reverse { grid-template-columns: 6fr 5fr; }
.split--reverse .split__media { order: 2; }
.split__text h2 { margin-bottom: var(--s-5); }
.split__text .btn { margin-top: var(--s-4); }

.ph, .photo { width: 100%; aspect-ratio: 4 / 5; border-radius: var(--radius-lg); object-fit: cover; }
.ph {
  display: grid; place-items: center; text-align: center;
  background: url("../img/sa-pattern.svg") center / 640px auto repeat, var(--paper-2);
  border: 1.5px dashed rgba(30,59,110,.35);
}
.ph__label { padding: .8rem 1.1rem; background: var(--white); border-radius: var(--radius); font-size: .9rem; font-weight: 700; letter-spacing: .06em; line-height: 1.5; }
.ph--portrait { aspect-ratio: 1; border-radius: 50%; }
.ph--portrait .ph__label { font-size: .75rem; }

.about { background: var(--paper); }

/* 4. Programs */
.programs { background: var(--white); overflow: hidden; }
.programs__pattern {
  position: absolute; inset: 0; pointer-events: none; opacity: .14;
  background: url("../img/sa-pattern.svg") center / 1100px auto repeat;
  -webkit-mask-image: linear-gradient(180deg, #000 0%, transparent 55%);
          mask-image: linear-gradient(180deg, #000 0%, transparent 55%);
}
.programs .wrap { position: relative; }
.stages { display: grid; grid-template-columns: repeat(4, 1fr); gap: var(--s-5); margin-bottom: var(--s-7); }
.section--white .stages { margin-bottom: 0; }
.stage {
  position: relative; display: flex;
  background: var(--white); border: 1px solid var(--line); border-radius: var(--radius-lg); overflow: hidden;
  box-shadow: 0 1px 0 rgba(30,59,110,.04);
  transition: transform .35s var(--ease), box-shadow .35s var(--ease);
}
.stage:hover, .stage:focus-within { transform: translateY(-4px); box-shadow: 0 18px 40px -24px rgba(21,43,82,.45); }
.stage__link-wrap { display: flex; flex-direction: column; width: 100%; text-decoration: none; color: inherit; }
.stage__link-wrap:focus-visible { outline-offset: -3px; }
.stage__img { width: 100%; aspect-ratio: 3 / 2; object-fit: cover; border-bottom: 6px solid var(--band); }
.stage__body { display: flex; flex-direction: column; flex: 1; padding: var(--s-5) var(--s-5) var(--s-5); }
.stage__title { font-size: 1.3rem; line-height: 1.15; margin: 0; }
.stage__age { margin: .35rem 0 var(--s-4); font-size: .85rem; font-weight: 900; letter-spacing: .14em; text-transform: uppercase; color: var(--age, var(--ink-soft)); }
.stage__text { color: var(--ink-soft); margin: 0 0 var(--s-4); }
.stage__more { margin-top: auto; align-self: flex-start; display: grid; place-items: center; width: 40px; height: 40px; border-radius: 50%; background: var(--band); color: var(--band-fg, var(--white)); font-weight: 900; transition: transform .3s var(--ease); }
.stage:hover .stage__more { transform: translateX(4px); }
.stage--green { --band: var(--green); --band-fg: var(--navy); --age: #6B7F1A; }
.stage--sky   { --band: var(--sky);   --band-fg: var(--navy); --age: #3F6FA6; }
.stage--red   { --band: var(--red);   --age: var(--red); }
.stage--navy  { --band: var(--navy);  --age: var(--navy); }

/* Timeline 0–10 */
.timeline { margin-top: clamp(2.5rem, 5vw, 4rem); }
.timeline__bar { display: grid; grid-template-columns: 2fr 1fr 3fr 4fr; gap: 4px; }
.timeline__seg { display: flex; align-items: center; min-height: 64px; padding: .5rem 1rem; border-radius: 10px; text-decoration: none; font-weight: 700; font-size: .9rem; line-height: 1.2; }
.timeline__seg--green { background: var(--green); color: var(--navy); }
.timeline__seg--sky   { background: var(--sky);   color: var(--navy); }
.timeline__seg--red   { background: var(--red);   color: var(--white); }
.timeline__seg--navy  { background: var(--navy);  color: var(--white); }
.timeline__ticks { position: relative; height: 2rem; margin-top: .5rem; }
.timeline__ticks li { position: absolute; left: calc(var(--at) * 10%); transform: translateX(-50%); font-weight: 900; font-size: 1.1rem; }
.timeline__ticks li:first-child { transform: none; }
.timeline__ticks li:last-child { transform: translateX(-100%); }

/* Navigazione tra percorsi */
.stage-nav { display: grid; grid-template-columns: 1fr 1fr; gap: var(--s-5); padding-block: var(--s-7); }
.stage-nav__link { display: flex; flex-direction: column; gap: .15rem; padding: var(--s-5); border: 1px solid var(--line); border-radius: var(--radius-lg); background: var(--white); text-decoration: none; transition: border-color .2s, transform .3s var(--ease); }
.stage-nav__link:hover { border-color: var(--navy); transform: translateY(-2px); }
.stage-nav__link small { font-size: .78rem; font-weight: 700; letter-spacing: .16em; text-transform: uppercase; color: var(--red); }
.stage-nav__link strong { font-size: 1.25rem; }
.stage-nav__link span { color: var(--ink-soft); font-weight: 500; }
.stage-nav__link--next { text-align: right; grid-column: 2; }
/* Colore della categoria di destinazione */
.stage-nav__link[class*="stage-nav__link--"] { border-color: transparent; background: var(--nav-bg); color: var(--nav-fg); }
.stage-nav__link[class*="stage-nav__link--"] small, .stage-nav__link[class*="stage-nav__link--"] span { color: var(--nav-fg); opacity: .85; }
.stage-nav__link[class*="stage-nav__link--"]:hover { border-color: transparent; box-shadow: 0 18px 40px -24px rgba(21,43,82,.6); }
.stage-nav__link--green { --nav-bg: var(--green); --nav-fg: var(--navy); }
.stage-nav__link--sky   { --nav-bg: var(--sky);   --nav-fg: var(--navy); }
.stage-nav__link--red   { --nav-bg: var(--red);   --nav-fg: var(--white); }
.stage-nav__link--navy  { --nav-bg: var(--navy);  --nav-fg: var(--white); }

/* Galleria spazi */
.gallery { display: grid; grid-template-columns: repeat(4, 1fr); grid-auto-flow: dense; gap: 12px; margin-top: clamp(2.5rem, 5vw, 4rem); }
.gallery__item img { width: 100%; height: 100%; aspect-ratio: 1; object-fit: cover; border-radius: 10px; }
.gallery__item--wide { grid-column: span 2; }
.gallery__item--wide img { aspect-ratio: 2 / 1; }
.gallery__claim { margin: var(--s-6) 0 0; text-align: center; font-size: clamp(2.2rem, 4vw, 3.2rem); color: var(--red); }

/* 5. The Serena Andersen Way */
.way { background: var(--paper); }

/* 6. Headmistress */
.head { background: var(--white); }
.head__inner { display: grid; grid-template-columns: 260px 1fr; gap: clamp(2rem, 6vw, 5rem); align-items: start; max-width: 1040px; }
.head__portrait { position: sticky; top: calc(var(--header-h) + 2rem); }
.head__text h2 { margin-bottom: var(--s-6); }
.quote { margin: 0; padding-left: clamp(1.25rem, 3vw, 2.25rem); border-left: 3px solid var(--red); }
.quote blockquote { margin: 0; font-size: clamp(1.2rem, 1.8vw, 1.45rem); line-height: 1.6; font-weight: 300; }
.quote blockquote p:first-child::before { content: "«"; }
.quote blockquote p:last-child::after { content: "»"; }
.quote figcaption { display: flex; flex-direction: column; margin-top: var(--s-5); }
.quote__name { font-family: var(--font-script); font-size: clamp(2.6rem, 3.6vw, 3.2rem); line-height: 1.05; margin-bottom: .2rem; }
.quote__role { font-size: .85rem; font-weight: 700; letter-spacing: .14em; text-transform: uppercase; color: var(--ink-soft); }

/* Fascia Play & Party */
.party { background: var(--red); color: var(--white); padding-block: clamp(3rem, 6vw, 5rem); }
.party__inner { display: grid; grid-template-columns: 1fr 1fr; gap: clamp(1.5rem, 5vw, 5rem); align-items: center; }
.party h2 { font-size: clamp(2.4rem, 5vw, 4rem); font-weight: 900; text-transform: uppercase; line-height: .95; }
.party p { font-size: 1.25rem; line-height: 1.55; font-weight: 500; }
.party .eyebrow--light::before { background: var(--white); }

/* Visit / CTA finale */
.visit { background: var(--navy); color: var(--white); overflow: hidden; }
.visit__pattern { position: absolute; inset: 0; pointer-events: none; opacity: .3; background: url("../img/sa-pattern-light.svg") center / 1000px auto repeat; }
.visit__center { position: relative; max-width: 820px; text-align: center; }
.visit__center .eyebrow { justify-content: center; }
.visit h2, .visit__center h2 { font-size: clamp(2.3rem, 4.4vw, 3.8rem); font-weight: 900; margin-bottom: var(--s-4); }
.visit__script { margin: 0 0 var(--s-5); font-size: clamp(1.8rem, 3vw, 2.5rem); color: var(--sky); }
.visit__lead { font-size: 1.2rem; line-height: 1.6; max-width: 62ch; margin-inline: auto; }
.visit__center .btn { margin-top: var(--s-5); }
.visit__signature { margin: var(--s-5) 0 0; font-size: clamp(2rem, 3.4vw, 2.8rem); color: var(--sky); }
.visit__center--dark .visit__lead { color: var(--ink); }
.spark { background: var(--paper); }

/* Instagram */
.insta { background: var(--white); }
.insta__head { display: flex; flex-wrap: wrap; align-items: flex-end; justify-content: space-between; gap: var(--s-5); margin-bottom: clamp(2rem, 4vw, 3rem); }
.insta__head h2 { font-size: clamp(2.2rem, 4vw, 3.4rem); font-weight: 900; }
.insta__grid { display: grid; grid-template-columns: repeat(6, 1fr); gap: 10px; }
.insta__tile { position: relative; display: block; aspect-ratio: 1; overflow: hidden; border-radius: 10px; background: var(--paper-2); }
.insta__tile img { width: 100%; height: 100%; object-fit: cover; transition: transform .6s var(--ease); }
.insta__tile:hover img { transform: scale(1.05); }
.insta__tile::after { content: ""; position: absolute; inset: 0; background: rgba(30,59,110,0); transition: background-color .3s; }
.insta__tile:hover::after { background: rgba(30,59,110,.18); }
.insta__tile--empty { background: url("../img/sa-pattern.svg") center / 420px auto repeat, var(--paper-2); }
.insta__tile--empty::before {
  content: ""; position: absolute; inset: 50% auto auto 50%; width: 30%; aspect-ratio: 1; transform: translate(-50%, -50%);
  border: 3px solid var(--navy); border-radius: 28%; opacity: .5;
  background: radial-gradient(circle at 50% 50%, transparent 32%, var(--navy) 33%, var(--navy) 41%, transparent 42%);
}
.insta__badge { position: absolute; top: 8px; right: 8px; z-index: 1; width: 22px; height: 22px; fill: var(--white); filter: drop-shadow(0 1px 3px rgba(0,0,0,.5)); }
.insta__note { margin: var(--s-4) 0 0; font-size: .9rem; }

/* Beyond the classroom: attività */
.activity-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: clamp(1.25rem, 2.5vw, 2rem); }
.activity { display: flex; flex-direction: column; background: var(--paper); border-radius: var(--radius-lg); overflow: hidden; }
.activity__img { width: 100%; aspect-ratio: 16 / 9; object-fit: cover; border-radius: 0; border: 0; border-bottom: 6px solid var(--band); }
.activity__body { padding: var(--s-6) var(--s-5) var(--s-5); }
.activity__body h3 { margin-bottom: var(--s-3); }
.activity__body p { color: var(--ink-soft); }
.activity__body p:last-child { margin-bottom: 0; }
.activity--green { --band: var(--green); } .activity--red { --band: var(--red); }
.activity--sky { --band: var(--sky); } .activity--navy { --band: var(--navy); }

/* Corsi pomeridiani */
.courses { margin-top: clamp(3rem, 6vw, 5rem); padding: clamp(1.5rem, 4vw, 3rem); background: var(--paper-2); border-radius: 20px; }
.courses__head { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: flex-end; gap: var(--s-4); margin-bottom: var(--s-5); }
.courses__title { font-size: clamp(1.6rem, 3vw, 2.2rem); }
.courses__note { margin: 0; padding: .45rem 1rem; border-radius: 999px; background: var(--navy); color: var(--white); font-weight: 700; font-size: .92rem; }
.courses__intro { columns: 2 320px; column-gap: var(--s-7); margin-bottom: var(--s-6); }
.courses__intro p { break-inside: avoid; }
.course-list { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: var(--s-4); }
.course { display: flex; flex-direction: column; padding: var(--s-5); background: var(--white); border-radius: var(--radius-lg); border-top: 6px solid var(--band); }
.course h4 { margin: 0 0 var(--s-3); font-size: 1.25rem; }
.course > p { color: var(--ink-soft); font-size: 1rem; }
.course dl { display: grid; gap: .35rem; margin: auto 0 0; padding-top: var(--s-4); border-top: 1px solid var(--line); font-size: .95rem; }
.course dl div { display: grid; grid-template-columns: 7.5rem 1fr; gap: .5rem; }
.course dt { font-size: .74rem; font-weight: 700; letter-spacing: .14em; text-transform: uppercase; color: var(--ink-soft); padding-top: .2rem; }
.course dd { margin: 0; font-weight: 500; }
.course--green { --band: var(--green); } .course--red { --band: var(--red); } .course--sky { --band: var(--sky); }
.courses__info { margin: var(--s-5) 0 0; }

/* Cambridge */
.cambridge .wrap { position: relative; }
.cambridge__head h2 { font-size: clamp(2.3rem, 4.4vw, 3.8rem); font-weight: 900; }
.cambridge__intro { margin: var(--s-4) auto 0; max-width: 52ch; font-size: 1.2rem; }
.cambridge__h3 { font-size: clamp(1.4rem, 2.2vw, 1.8rem); line-height: 1.2; }
.cambridge__h4 { margin: 0 0 var(--s-3); font-size: .85rem; letter-spacing: .16em; text-transform: uppercase; color: var(--sky); }
.milestones { display: grid; grid-template-columns: repeat(3, 1fr); gap: var(--s-4); margin-block: clamp(2.5rem, 5vw, 4rem); counter-reset: m; }
.milestone { padding: var(--s-6) var(--s-5); background: rgba(255,255,255,.06); border: 1px solid rgba(255,255,255,.16); border-top: 6px solid var(--band); border-radius: var(--radius-lg); }
.milestone__level { margin: 0 0 .3rem; font-size: .82rem; font-weight: 900; letter-spacing: .16em; text-transform: uppercase; color: var(--band); }
.milestone h3 { margin-bottom: var(--s-3); font-size: 1.5rem; }
.milestone p:last-child { margin-bottom: 0; }
.milestone--green { --band: var(--green); } .milestone--sky { --band: var(--sky); } .milestone--red { --band: #F07C98; }
.cambridge__program { display: grid; grid-template-columns: 1fr 1fr; gap: clamp(2rem, 5vw, 5rem); padding-top: var(--s-6); border-top: 1px solid rgba(255,255,255,.18); }
.cambridge__script { font-size: clamp(1.7rem, 2.6vw, 2.2rem); color: var(--sky); margin-top: var(--s-4); }
.ticks { display: grid; gap: .5rem; margin-bottom: var(--s-4); }
.ticks li { position: relative; padding-left: 1.8rem; }
.ticks li::before { content: ""; position: absolute; left: 0; top: .45em; width: 1rem; height: .55rem; border-left: 3px solid var(--green); border-bottom: 3px solid var(--green); transform: rotate(-45deg); }
.cambridge__badge { margin: var(--s-6) auto 0; max-width: max-content; padding: .7rem 1.4rem; border-radius: 999px; background: var(--white); color: var(--navy); text-align: center; font-weight: 500; }

/* Play & Party */
.theme-party .page-hero { background: var(--navy-deep); }
.theme-party .page-hero .eyebrow--light { color: var(--green); }
.theme-party .page-hero .eyebrow--light::before { background: var(--green); }
.theme-party .page-hero__sub { color: var(--green); }
.theme-party .prose-split__sub { color: #6B7F1A; }
.party-cards { display: grid; grid-template-columns: repeat(5, 1fr); gap: 12px; margin-top: clamp(2.5rem, 5vw, 4rem); }
.party-card { display: flex; flex-direction: column; justify-content: space-between; gap: var(--s-5); min-height: 150px; padding: var(--s-5); border-radius: var(--radius-lg); background: var(--bg); color: var(--fg); font-size: 1.2rem; font-weight: 900; line-height: 1.15; }
.party-card__n { font-size: .8rem; letter-spacing: .14em; opacity: .75; }
.party-card--green { --bg: var(--green); --fg: var(--navy); } .party-card--sky { --bg: var(--sky); --fg: var(--navy); }
.party-card--red { --bg: var(--red); --fg: var(--white); } .party-card--navy { --bg: var(--navy); --fg: var(--white); }
.party-celebrate { background: var(--green); color: var(--navy); }
.party-celebrate h2 { font-size: clamp(2.6rem, 5.5vw, 4.6rem); font-weight: 900; text-transform: uppercase; line-height: .95; margin-bottom: var(--s-5); }
.eyebrow--dark { color: var(--navy); }

/* Moduli */
.form-wrap { display: grid; grid-template-columns: 4fr 7fr; gap: clamp(2rem, 6vw, 6rem); align-items: start; }
.form-wrap__aside h2 { margin-bottom: var(--s-4); }
.form-wrap__script { font-size: 2rem; color: var(--red); margin-top: var(--s-5); }
.form { padding: clamp(1.5rem, 3vw, 2.5rem); background: var(--white); border-radius: 20px; box-shadow: 0 0 0 1px var(--line), 0 30px 60px -40px rgba(21,43,82,.4); }
.form__grid { display: grid; grid-template-columns: 1fr 1fr; gap: var(--s-5) var(--s-4); margin-bottom: var(--s-5); }
.field { display: flex; flex-direction: column; gap: .4rem; }
.field--wide { grid-column: 1 / -1; }
.field label { font-size: .85rem; font-weight: 700; letter-spacing: .06em; }
.field input, .field select, .field textarea {
  width: 100%; min-height: 50px; padding: .7rem .9rem;
  border: 1.5px solid rgba(30,59,110,.3); border-radius: 10px; background: var(--white);
  font: 400 1rem/1.4 var(--font-sans); color: var(--navy);
  transition: border-color .2s, box-shadow .2s;
}
.field textarea { resize: vertical; min-height: 130px; }
.field input:focus, .field select:focus, .field textarea:focus { outline: none; border-color: var(--navy); box-shadow: 0 0 0 3px rgba(134,178,224,.5); }
.field [aria-invalid="true"] { border-color: var(--red); }
.field--check { flex-direction: row; align-items: flex-start; gap: .75rem; }
.field--check input { width: 22px; height: 22px; min-height: 0; margin-top: .15rem; flex: 0 0 auto; accent-color: var(--navy); }
.field--check label { font-weight: 400; letter-spacing: 0; font-size: .95rem; line-height: 1.5; }
.form__status { margin: 0 0 var(--s-4); font-weight: 500; }
.form__status:empty { display: none; }
.form__status.is-error { color: var(--red); }
.form__status.is-warn { padding: .8rem 1rem; border-radius: 10px; background: #FFF6CC; color: #4A3B00; }
.form__req { margin: var(--s-4) 0 0; font-size: .85rem; color: var(--ink-soft); }

/* Contatti, iscrizioni */
.info-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: var(--s-5); margin: 0; }
.info-grid div { padding-top: var(--s-4); border-top: 2px solid var(--navy); }
.info-grid dt { font-size: .8rem; font-weight: 700; letter-spacing: .14em; text-transform: uppercase; color: var(--ink-soft); margin-bottom: .3rem; }
.info-grid dd { margin: 0; font-weight: 500; }
.info-grid__map { margin-top: var(--s-6); }
.info-grid a { text-decoration-color: var(--sky); text-underline-offset: 3px; }
.info-grid--single { grid-template-columns: 1fr; max-width: 420px; margin-top: var(--s-5); }
.steps { display: grid; grid-template-columns: repeat(4, 1fr); gap: var(--s-4); counter-reset: s; }
.step { position: relative; padding: var(--s-6) var(--s-5) var(--s-5); background: var(--white); border-radius: var(--radius-lg); box-shadow: 0 0 0 1px var(--line); }
.step__n { display: grid; place-items: center; width: 44px; height: 44px; margin-bottom: var(--s-4); border-radius: 50%; background: var(--navy); color: var(--white); font-weight: 900; font-size: 1.2rem; }
.step h3 { margin-bottom: var(--s-3); }
.step__link { font-weight: 700; font-size: .9rem; letter-spacing: .06em; }
.faq details { border-bottom: 1px solid var(--line); }
.faq summary { display: flex; justify-content: space-between; align-items: center; gap: 1rem; padding: 1.1rem 0; font-weight: 700; font-size: 1.15rem; cursor: pointer; list-style: none; }
.faq summary::-webkit-details-marker { display: none; }
.faq summary::after { content: "+"; font-size: 1.5rem; line-height: 1; color: var(--red); transition: transform .25s var(--ease); }
.faq details[open] summary::after { transform: rotate(45deg); }
.faq details p { padding-bottom: 1.1rem; margin: 0; }
.legal { font-size: 1.05rem; }

/* ---------- Footer ---------- */
.site-footer { background: var(--navy-deep); color: var(--white); font-size: 1rem; }
.site-footer__grid { display: grid; grid-template-columns: 1.3fr 1fr 1fr 1.2fr; gap: var(--s-7); padding-block: var(--s-8) var(--s-7); }
.site-footer__brand img { width: 150px; height: auto; }
.site-footer__since { margin: var(--s-4) 0 0; font-size: .8rem; font-weight: 700; letter-spacing: .2em; text-transform: uppercase; color: rgba(255,255,255,.8); }
.site-footer__brand .script { margin-top: var(--s-2); font-size: 1.6rem; color: var(--sky); }
.site-footer__title { margin-bottom: var(--s-4); font-size: .8rem; font-weight: 700; letter-spacing: .18em; text-transform: uppercase; color: var(--sky); }
.site-footer ul { display: grid; gap: .5rem; }
.site-footer a { text-decoration: none; }
.site-footer a:hover { text-decoration: underline; text-underline-offset: 4px; }
.site-footer__legal { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; gap: var(--s-4); padding-block: var(--s-5); border-top: 1px solid rgba(255,255,255,.15); font-size: .85rem; color: rgba(255,255,255,.8); }
.site-footer__legal p { margin: 0; }
.site-footer__legal-links { display: flex !important; flex-wrap: wrap; gap: .5rem 1.5rem; }

/* ---------- Banner cookie ---------- */
.cookie { position: fixed; left: var(--gutter); right: var(--gutter); bottom: var(--gutter); z-index: 80; display: flex; justify-content: center; pointer-events: none; }
.cookie[hidden] { display: none; }
.cookie__inner { pointer-events: auto; width: min(100%, 720px); padding: var(--s-5); background: var(--white); color: var(--navy); border-radius: var(--radius-lg); box-shadow: 0 0 0 1px var(--line), 0 30px 60px -20px rgba(21,43,82,.5); }
.cookie__title { margin: 0 0 .3rem; font-weight: 900; letter-spacing: .14em; text-transform: uppercase; font-size: .85rem; color: var(--red); }
.cookie__text { font-size: .95rem; margin-bottom: var(--s-4); }
.cookie__actions { display: flex; flex-wrap: wrap; gap: var(--s-3); }


/* ---------- Megamenu Beyond the Classroom ---------- */
.site-header__inner { position: relative; }
.has-sub--mega { position: static; }
.sub--mega { left: 0; right: 0; top: calc(100% - 6px); min-width: 0; padding: 0; border-radius: 0 0 20px 20px; }
.sub--mega::before { top: -40px; height: 40px; }
.mega { display: grid; grid-template-columns: 1fr 1.15fr 1.25fr; gap: var(--s-5); padding: var(--s-5); }
.mega__col { padding: var(--s-2); }
.mega__title { margin: 0 0 var(--s-3); padding: 0 .8rem; font-size: .76rem; font-weight: 700; letter-spacing: .18em; text-transform: uppercase; color: var(--red); }
.mega__col ul { display: grid; gap: .15rem; }
.sub .mega__feature {
  position: relative; overflow: hidden; display: flex; flex-direction: column; gap: .6rem;
  padding: var(--s-5); border-radius: var(--radius-lg); background: var(--navy); color: var(--white); text-decoration: none;
  transition: transform .3s var(--ease), box-shadow .3s var(--ease);
}
.sub .mega__feature::after { content: ""; position: absolute; inset: 0; background: url("../img/sa-pattern-light.svg") center / 560px auto repeat; opacity: .28; pointer-events: none; }
.sub .mega__feature:hover, .sub .mega__feature:focus-visible { background: var(--navy); transform: translateY(-2px); box-shadow: 0 18px 40px -20px rgba(21,43,82,.7); }
.sub .mega__feature { align-items: flex-start; justify-content: flex-start; text-align: left; }
.mega__feature > * { position: relative; z-index: 1; }
.mega__feature-eyebrow { font-size: .74rem; font-weight: 700; letter-spacing: .16em; text-transform: uppercase; color: var(--sky); }
.mega__feature-title { font-size: 1.45rem; font-weight: 900; line-height: 1.1; }
.mega__levels { display: flex; flex-wrap: wrap; gap: .4rem; }
.mega__feature-badge { font-size: .88rem; line-height: 1.4; opacity: .9; }
.mega__feature-cta { margin-top: auto; font-size: .8rem; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; color: var(--green); }
.lvl { display: inline-flex; align-items: baseline; gap: .3rem; padding: .25rem .7rem; border-radius: 999px; background: var(--lvl); color: var(--lvl-fg, var(--navy)); font-size: .78rem; font-weight: 700; letter-spacing: .04em; }
.lvl--green { --lvl: var(--green); } .lvl--sky { --lvl: var(--sky); } .lvl--red { --lvl: var(--red); --lvl-fg: var(--white); }

/* Cambridge in evidenza nella pagina */
.cambridge-teaser { padding-top: 0; margin-top: calc(var(--section-y) * -0.35); position: relative; z-index: 1; }
.cambridge-teaser__card {
  position: relative; overflow: hidden; display: grid; grid-template-columns: 1.4fr 1fr; align-items: center; gap: var(--s-5) clamp(2rem, 5vw, 4rem);
  padding: clamp(1.75rem, 4vw, 3rem); border-radius: 20px; background: var(--navy); color: var(--white); text-decoration: none;
  box-shadow: 0 30px 60px -30px rgba(21,43,82,.6); transition: transform .3s var(--ease);
}
.cambridge-teaser__card::after { content: ""; position: absolute; inset: 0; background: url("../img/sa-pattern-light.svg") center / 800px auto repeat; opacity: .28; pointer-events: none; }
.cambridge-teaser__card > * { position: relative; z-index: 1; }
.cambridge-teaser__card:hover { transform: translateY(-3px); }
.cambridge-teaser h2 { font-size: clamp(1.9rem, 3.6vw, 3rem); font-weight: 900; margin-bottom: var(--s-3); }
.cambridge-teaser__text p:last-child { margin: 0; font-size: 1.15rem; }
.cambridge-teaser__levels { display: grid; gap: .6rem; }
.cambridge-teaser__levels .lvl { justify-content: space-between; padding: .8rem 1.2rem; border-radius: 12px; font-size: 1.1rem; }
.cambridge-teaser__badge { grid-column: 1 / -1; margin: 0; padding-top: var(--s-4); border-top: 1px solid rgba(255,255,255,.2); font-weight: 700; color: var(--green); }
.trio__link { display: inline-block; margin-top: var(--s-4); font-weight: 700; font-size: .9rem; color: var(--red); }

@media (max-width: 1100px) {
  .site-header__inner { position: static; }
  .has-sub--mega { position: relative; }
  .sub--mega { border-radius: 0; }
  .mega { grid-template-columns: 1fr; gap: var(--s-3); padding: 0 0 .75rem; }
  .mega__col { padding: 0; }
  .mega__title { margin-top: var(--s-3); }
  .sub .mega__feature { margin-top: var(--s-2); }
}
@media (max-width: 900px) {
  .cambridge-teaser { margin-top: 0; padding-top: var(--s-5); }
  .cambridge-teaser__card { grid-template-columns: 1fr; }
}


/* ---------- Pagina Cambridge ---------- */
.page-hero__lead { margin: var(--s-4) 0 0; max-width: 46ch; font-size: 1.2rem; line-height: 1.55; }
.hero-levels { display: flex; flex-wrap: wrap; gap: .5rem; margin-top: var(--s-5); }
.hero-levels .lvl { padding: .45rem 1rem; font-size: .95rem; }
.cambridge-logo-card { margin: 0; padding: clamp(1.5rem, 3vw, 2.5rem); background: var(--white); color: var(--navy); border-radius: 20px; box-shadow: 0 30px 60px -30px rgba(0,0,0,.6); text-align: center; }
.page-hero__media .cambridge-logo-card img { width: min(100%, 420px); height: auto; aspect-ratio: auto; object-fit: contain; border-radius: 0; box-shadow: none; margin: 0 auto var(--s-5); }
.cambridge-logo-card figcaption { padding-top: var(--s-4); border-top: 1px solid var(--line); font-size: 1rem; line-height: 1.5; }
.skills { display: flex; flex-wrap: wrap; gap: .4rem; margin: 0 0 1em; }
.skills li { padding: .2rem .7rem; border: 1.5px solid rgba(255,255,255,.5); border-radius: 999px; font-size: .78rem; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; }
.cambridge__h4--dark { color: var(--red); margin-top: var(--s-5); }
.ticks--dark li::before { border-color: var(--red); }
.course--wide { display: grid; grid-template-columns: 1.4fr 1fr; gap: var(--s-6); align-items: center; margin-top: clamp(2.5rem, 5vw, 4rem); padding: clamp(1.5rem, 3vw, 2.5rem); background: var(--paper-2); }
.course--wide h3 { font-size: clamp(1.5rem, 2.6vw, 2rem); margin-bottom: var(--s-3); }
.course--wide p:last-child { margin-bottom: 0; color: var(--ink-soft); }
.course--wide dl { margin: 0; padding: var(--s-5); border-top: 0; background: var(--white); border-radius: var(--radius-lg); }
.spark__logo { width: min(100%, 300px); margin: 0 auto var(--s-5); }
.cambridge-teaser__badge { display: flex; flex-wrap: wrap; align-items: center; gap: var(--s-4); }
.cambridge-teaser__badge img { width: 170px; padding: .5rem .8rem; background: var(--white); border-radius: 10px; }
.sub .mega__logo { display: block; width: 100%; padding: .55rem .8rem; background: var(--white); border-radius: 10px; }
.mega__logo img { width: 150px; }
@media (max-width: 900px) {
  .course--wide { grid-template-columns: 1fr; }
  .page-hero--cambridge .page-hero__media { order: 0; }
}


/* =====================================================================
   VARIANTI DELL'APERTURA (una per tipo di pagina)
   ===================================================================== */
.page-hero__note { margin: var(--s-4) 0 0; }

/* Chiara: fondo azzurro velato, testo navy */
.page-hero--light { background: var(--paper-2); color: var(--navy); }
.page-hero--light .breadcrumb ol { color: var(--ink-soft); }
.page-hero--light .page-hero__sub { color: var(--red); }
.page-hero--light .page-hero__media img:not(.arch) { box-shadow: 0 30px 60px -35px rgba(21,43,82,.5); }

/* Immagine a tutto schermo (About) */
.page-hero--image { min-height: clamp(520px, 78vh, 820px); display: flex; align-items: flex-end; background: var(--navy-deep); }
.page-hero__bg { position: absolute; inset: 0; width: 100%; height: 100% !important; object-fit: cover; transform: scale(1.04); animation: heroZoom 14s var(--ease) forwards; }
@keyframes heroZoom { to { transform: scale(1); } }
.page-hero__shade { position: absolute; inset: 0; background: linear-gradient(180deg, rgba(21,43,82,.25) 0%, rgba(21,43,82,0) 35%, rgba(21,43,82,.75) 75%, rgba(21,43,82,.92) 100%), linear-gradient(90deg, rgba(21,43,82,.55), rgba(21,43,82,0) 70%); }
.page-hero--image .page-hero__inner { grid-template-columns: 1fr; width: min(100% - 2 * var(--gutter), var(--wrap)); padding-block: var(--s-9) clamp(3rem, 6vw, 5rem); }
.page-hero--image h1 { font-size: clamp(2.8rem, 6.4vw, 5.8rem); max-width: 14ch; text-shadow: 0 2px 30px rgba(21,43,82,.4); }
.scroll-cue { position: absolute; right: 0; bottom: clamp(3rem, 6vw, 5rem); display: grid; place-items: center; width: 52px; height: 52px; border: 1.5px solid rgba(255,255,255,.7); border-radius: 50%; }
.scroll-cue span { width: 10px; height: 10px; border-right: 2px solid var(--white); border-bottom: 2px solid var(--white); transform: translateY(-2px) rotate(45deg); animation: cue 1.8s var(--ease) infinite; }
@keyframes cue { 50% { transform: translateY(3px) rotate(45deg); } }

/* Mosaico delle quattro fasce (Our Programs) */
.page-hero--mosaic .page-hero__inner { grid-template-columns: 5fr 6fr; }
.mosaic { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.mosaic__tile:nth-child(odd) { transform: translateY(22px); }
.mosaic__tile a { position: relative; display: block; overflow: hidden; border-radius: 16px; text-decoration: none; }
.mosaic__tile img { width: 100%; aspect-ratio: 4 / 3.4; object-fit: cover; transition: transform .6s var(--ease); }
.mosaic__tile a:hover img { transform: scale(1.06); }
.mosaic__tile span { position: absolute; left: 10px; bottom: 10px; right: 10px; display: flex; flex-direction: column; padding: .55rem .8rem; border-radius: 10px; background: var(--tile); color: var(--tile-fg, var(--white)); font-size: .82rem; font-weight: 700; line-height: 1.2; }
.mosaic__tile strong { font-size: 1.35rem; font-weight: 900; }
.mosaic__tile--green { --tile: var(--green); --tile-fg: var(--navy); } .mosaic__tile--sky { --tile: var(--sky); --tile-fg: var(--navy); }
.mosaic__tile--red { --tile: var(--red); } .mosaic__tile--navy { --tile: var(--navy); }

/* Percorso: colore della fascia, numero gigante, foto ad arco */
.page-hero--stage { background: var(--stage-bg, var(--navy)); color: var(--stage-fg, var(--white)); }
.stage-theme--green { --stage-bg: var(--green); --stage-fg: var(--navy); }
.stage-theme--sky   { --stage-bg: var(--sky);   --stage-fg: var(--navy); }
.stage-theme--red   { --stage-bg: var(--red);   --stage-fg: var(--white); }
.stage-theme--navy  { --stage-bg: var(--navy);  --stage-fg: var(--white); }
.page-hero--stage .eyebrow { color: var(--stage-fg); }
.page-hero--stage .breadcrumb ol { color: var(--stage-fg); opacity: .9; }
.page-hero--stage .page-hero__sub { color: var(--stage-fg); }
.page-hero--stage .age-chip { background: var(--stage-fg); color: var(--stage-bg); }
.page-hero--stage :focus-visible { outline-color: var(--stage-fg); }
.page-hero__age { position: absolute; right: -2vw; bottom: -0.18em; font-size: clamp(9rem, 30vw, 26rem); font-weight: 900; line-height: .8; letter-spacing: -.04em; color: var(--stage-fg); opacity: .1; pointer-events: none; white-space: nowrap; }
.arch { width: 100%; aspect-ratio: 4 / 4.6; object-fit: cover; border-radius: 999px 999px 24px 24px !important; border: 8px solid var(--white); box-shadow: 0 40px 70px -40px rgba(21,43,82,.7) !important; }
.arch--wide { aspect-ratio: 5 / 4.4; }
.page-hero--stage .page-hero__media, .page-hero--light .page-hero__media { max-width: 460px; justify-self: end; width: 100%; }
.page-hero--stage .page-hero__inner { padding-block: clamp(3rem, 6vw, 5rem) clamp(3rem, 6vw, 5rem); }

/* Collage di polaroid (Beyond the Classroom) */
.collage { position: relative; height: clamp(360px, 36vw, 480px); }
.collage__item { position: absolute; margin: 0; width: 58%; padding: 10px 10px 14px; background: var(--white); border-radius: 6px; box-shadow: 0 30px 50px -25px rgba(0,0,0,.6); transition: transform .5s var(--ease); }
.collage__item img { width: 100%; aspect-ratio: 4 / 3; object-fit: cover; border-radius: 3px; }
.collage__item figcaption { margin-top: 8px; font-family: var(--font-script); font-size: 1.35rem; line-height: 1; color: var(--navy); text-align: center; }
.collage__item--1 { left: 0; top: 4%; transform: rotate(-6deg); }
.collage__item--2 { right: 0; top: 0; transform: rotate(5deg); z-index: 2; }
.collage__item--3 { left: 22%; bottom: 0; transform: rotate(-1.5deg); z-index: 3; }
.collage:hover .collage__item--1 { transform: rotate(-9deg) translate(-8px, -6px); }
.collage:hover .collage__item--2 { transform: rotate(8deg) translate(8px, -6px); }

/* Play & Party: verde, foto a forma libera, coriandoli */
.page-hero--party { background: var(--green); color: var(--navy); }
.page-hero--party .eyebrow { color: var(--navy); }
.page-hero--party .breadcrumb ol { color: var(--navy); }
.page-hero--party .page-hero__sub { color: var(--navy); }
.page-hero--party :focus-visible { outline-color: var(--navy); }
.blob { width: 100%; aspect-ratio: 1 / 1; object-fit: cover; border-radius: 58% 42% 52% 48% / 46% 58% 42% 54% !important; border: 8px solid var(--white); box-shadow: 0 40px 70px -40px rgba(21,43,82,.7) !important; animation: blob 12s ease-in-out infinite alternate; }
@keyframes blob { to { border-radius: 44% 56% 40% 60% / 58% 42% 58% 42%; } }
.page-hero--party .page-hero__media { max-width: 480px; justify-self: end; width: 100%; }
.confetti { position: absolute; width: 18px; height: 18px; border-radius: 50%; animation: float 7s ease-in-out infinite alternate; pointer-events: none; }
.confetti--1 { top: 14%; left: 46%; background: var(--red); }
.confetti--2 { top: 70%; left: 6%; width: 26px; height: 26px; background: var(--white); animation-delay: -2s; }
.confetti--3 { top: 22%; right: 4%; width: 14px; height: 14px; border-radius: 3px; background: var(--navy); transform: rotate(20deg); animation-delay: -4s; }
.confetti--4 { bottom: 12%; left: 52%; width: 34px; height: 34px; background: var(--sky); animation-delay: -1s; }
.confetti--5 { top: 8%; left: 30%; width: 12px; height: 12px; border-radius: 3px; background: var(--white); animation-delay: -3s; }
@keyframes float { to { transform: translateY(-18px) rotate(40deg); } }
.theme-party .page-hero { background: var(--green); }

/* Contatti: scheda con azioni rapide */
.contact-card { overflow: hidden; background: var(--navy); color: var(--white); border-radius: 20px; box-shadow: 0 40px 70px -40px rgba(21,43,82,.7); }
.contact-card__img { width: 100%; aspect-ratio: 16 / 8; object-fit: cover; border-radius: 0 !important; box-shadow: none !important; }
.contact-card__body { padding: var(--s-5); }
.contact-card__address { margin: 0 0 var(--s-5); font-size: 1.05rem; }
.quick { display: grid; grid-template-columns: repeat(4, 1fr); gap: 8px; }
.quick__btn { display: flex; flex-direction: column; align-items: center; gap: .4rem; padding: .85rem .4rem; border-radius: 12px; background: rgba(255,255,255,.08); color: var(--white); text-decoration: none; font-size: .8rem; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; transition: background-color .2s, transform .2s; }
.quick__btn svg { width: 24px; height: 24px; fill: var(--sky); }
.quick__btn:hover { background: var(--red); transform: translateY(-2px); }
.quick__btn:hover svg { fill: var(--white); }
.page-hero--contact .btn { margin-top: var(--s-6); }

/* Cambridge: chiaro */
.page-hero--cambridge .cambridge-logo-card { box-shadow: 0 30px 60px -35px rgba(21,43,82,.45); }

/* ---------- Comparsa allo scroll (solo con JS e movimento consentito) ---------- */
@media (prefers-reduced-motion: no-preference) {
  .js .reveal { opacity: 0; transform: translateY(26px); transition: opacity .8s var(--ease), transform .8s var(--ease); transition-delay: var(--d, 0s); }
  .js .reveal.is-visible { opacity: 1; transform: none; }
  .js .mosaic__tile.reveal.is-visible:nth-child(odd) { transform: translateY(22px); }
  .js .collage__item.reveal { transform: translateY(40px) rotate(0deg); }
  .js .collage__item--1.reveal.is-visible { transform: rotate(-6deg); }
  .js .collage__item--2.reveal.is-visible { transform: rotate(5deg); }
  .js .collage__item--3.reveal.is-visible { transform: rotate(-1.5deg); }
}
@media (prefers-reduced-motion: reduce) {
  .page-hero__bg, .blob, .confetti, .scroll-cue span { animation: none !important; }
}

@media (max-width: 900px) {
  .page-hero--mosaic .page-hero__inner { grid-template-columns: 1fr; }
  .mosaic__tile:nth-child(odd), .js .mosaic__tile.reveal.is-visible:nth-child(odd) { transform: none; }
  .page-hero--stage .page-hero__media, .page-hero--light .page-hero__media, .page-hero--party .page-hero__media { order: 0; max-width: 360px; justify-self: start; }
  .arch { aspect-ratio: 4 / 3.6; }
  .collage { height: 300px; order: 0; }
  .collage__item figcaption { font-size: 1.1rem; }
  .page-hero--image .page-hero__inner { padding-top: var(--s-8); }
  .scroll-cue { display: none; }
  .page-hero--contact .page-hero__inner { grid-template-columns: 1fr; }
  .contact-card { order: 0; }
}
@media (max-width: 600px) {
  .quick { grid-template-columns: repeat(2, 1fr); }
  .collage { height: 240px; }
  .collage__item { width: 62%; }
  .page-hero__age { font-size: 11rem; }
  .confetti--1, .confetti--3, .confetti--5 { display: none; }
  .mosaic__tile span { left: 6px; right: 6px; bottom: 6px; padding: .35rem .55rem; font-size: .7rem; }
  .mosaic__tile strong { font-size: 1.05rem; }
}


/* ---------- Contatti: dove siamo + mappa ---------- */
.where { display: grid; grid-template-columns: 5fr 7fr; gap: clamp(2rem, 5vw, 4.5rem); align-items: stretch; }
.where .section-head { margin-bottom: var(--s-5); }
.info-list { display: grid; gap: 0; margin: 0 0 var(--s-6); }
.info-list div { display: grid; grid-template-columns: 8.5rem 1fr; gap: var(--s-3); padding: var(--s-4) 0; border-top: 1px solid var(--line); }
.info-list dt { font-size: .78rem; font-weight: 700; letter-spacing: .14em; text-transform: uppercase; color: var(--ink-soft); padding-top: .2rem; }
.info-list dd { margin: 0; font-weight: 500; }
.info-list a { text-decoration-color: var(--sky); text-underline-offset: 3px; }
.map { position: relative; min-height: 520px; border-radius: 20px; overflow: hidden; background: url("../img/sa-pattern.svg") center / 700px auto repeat, var(--paper-2); box-shadow: 0 0 0 1px var(--line), 0 30px 60px -40px rgba(21,43,82,.5); }
.map__fallback { position: absolute; inset: 0; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: var(--s-3); text-align: center; padding: var(--s-5); }
.map__fallback img { width: 64px; }
.map--ready .map__fallback { display: none; }
.map--failed .map__fallback { display: flex; }
.map .maplibregl-canvas { outline: none; }
.map-pin { display: grid; place-items: center; width: 58px; height: 58px; padding: 7px; border-radius: 50% 50% 50% 0; transform: rotate(-45deg); background: var(--red); box-shadow: 0 10px 20px -6px rgba(21,43,82,.6); cursor: pointer; }
.map-pin img { width: 100%; height: 100%; padding: 4px; border-radius: 50%; background: var(--white); transform: rotate(45deg); }
.map-pop .maplibregl-popup-content { padding: .9rem 1.1rem; border-radius: 12px; font: 400 .92rem/1.5 var(--font-sans); color: var(--navy); box-shadow: 0 16px 30px -12px rgba(21,43,82,.45); }
.map-pop .maplibregl-popup-content a { color: var(--red); font-weight: 700; }
.map .maplibregl-ctrl-group { border-radius: 10px; }
@media (max-width: 900px) {
  .where { grid-template-columns: 1fr; }
  .map { min-height: 380px; }
  .info-list div { grid-template-columns: 1fr; gap: .15rem; }
}


@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { transition-duration: .01ms !important; animation-duration: .01ms !important; }
}

/* ---------- Responsive ---------- */
@media (max-width: 1240px) {
  .party-cards { grid-template-columns: repeat(5, 1fr); }
  .nav__list { gap: 1.1rem; }
}
@media (max-width: 1100px) {
  :root { --header-h: 84px; }
  .site-header__inner { padding-block: 14px; }
  .brand img { height: 56px; }
  .header-cta { display: none; }
  .menu-toggle { display: grid; place-items: center; }
  .nav {
    position: absolute; left: 0; right: 0; top: 100%; z-index: 40;
    height: calc(100dvh - var(--header-h) - 4px);
    display: flex; flex-direction: column; gap: var(--s-6);
    padding: var(--s-5) var(--gutter) 7rem;
    background: var(--white); overflow-y: auto;
    visibility: hidden; opacity: 0; transform: translateY(-8px);
    transition: opacity .25s var(--ease), transform .25s var(--ease), visibility 0s linear .25s;
  }
  .nav.is-open { visibility: visible; opacity: 1; transform: none; transition-delay: 0s; }
  .nav__list { flex-direction: column; align-items: stretch; gap: 0; }
  .nav__list > li { border-bottom: 1px solid var(--line); }
  .nav__list > li > a { display: block; padding: 1.05rem 0; font-size: 1.15rem; }
  .nav__list > li > a::after { display: none; }
  .has-sub { flex-wrap: wrap; justify-content: space-between; }
  .has-sub > a { flex: 1; }
  .sub-toggle { width: 44px; height: 44px; }
  .sub { position: static; flex-basis: 100%; min-width: 0; padding: 0 0 .75rem; box-shadow: none; display: none; visibility: visible; opacity: 1; transform: none; transition: none; }
  .has-sub.is-open .sub { display: block; }
  .sub::before { display: none; }
  body.menu-open { overflow: hidden; }

  /* Pulsante "Book a Visit" fisso in basso su mobile */
  .mobile-cta {
    display: flex; position: fixed; left: var(--gutter); right: var(--gutter); bottom: max(12px, env(safe-area-inset-bottom)); z-index: 45;
    box-shadow: 0 12px 30px -10px rgba(21,43,82,.55);
    transition: transform .3s var(--ease), opacity .3s;
  }
  .mobile-cta.is-hidden { transform: translateY(150%); opacity: 0; pointer-events: none; }
  body { padding-bottom: 80px; }
  .cookie { bottom: 84px; }

  .different__grid, .stages { grid-template-columns: repeat(2, 1fr); }
  .site-footer__grid { grid-template-columns: 1fr 1fr; }
  .party-cards { grid-template-columns: repeat(3, 1fr); }
  .insta__grid { grid-template-columns: repeat(3, 1fr); }
  .steps { grid-template-columns: repeat(2, 1fr); }
  .info-grid { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 900px) {
  .page-hero__inner { grid-template-columns: 1fr; }
  .page-hero__media { order: -1; }
  .page-hero--compact .page-hero__media { display: none; }
  .prose-split, .form-wrap { grid-template-columns: 1fr; gap: var(--s-5); }
  .trio, .milestones { grid-template-columns: 1fr; }
  .cambridge__program { grid-template-columns: 1fr; }
  .activity-grid { grid-template-columns: 1fr; }
  .gallery { grid-template-columns: repeat(2, 1fr); }
  .timeline__seg { min-height: 56px; font-size: .78rem; padding: .4rem .6rem; }
}
@media (max-width: 820px) {
  .split, .split--reverse { grid-template-columns: 1fr; }
  .split--reverse .split__media { order: 0; }
  .ph, .photo { aspect-ratio: 4 / 3; }
  .head__inner { grid-template-columns: 1fr; }
  .head__portrait { position: static; width: 160px; }
  .party__inner { grid-template-columns: 1fr; }
}
@media (max-width: 600px) {
  body { font-size: 1.0625rem; }
  :root { --header-h: 76px; }
  .site-header__inner { padding-block: 12px; }
  .brand img { height: 50px; }
  .site-header__actions { gap: .6rem; }
  .hero { min-height: 86svh; }
  .hero__actions .btn { flex: 1 1 100%; }
  .different__grid, .stages { grid-template-columns: 1fr; }
  .site-footer__grid { grid-template-columns: 1fr; gap: var(--s-6); }
  .split__text .btn, .center .btn, .visit__center .btn { width: 100%; }
  .form__grid { grid-template-columns: 1fr; }
  .party-cards { grid-template-columns: repeat(2, 1fr); }
  .party-card { min-height: 120px; font-size: 1.05rem; }
  .steps, .info-grid { grid-template-columns: 1fr; }
  .stage-nav { grid-template-columns: 1fr; }
  .stage-nav__link--next { grid-column: auto; }
  .stage-nav > span:empty { display: none; }
  .insta__grid { gap: 6px; }
  .timeline__bar { grid-template-columns: 1fr; }
  .timeline__seg { min-height: 48px; }
  .timeline__ticks { display: none; }
  .course dl div { grid-template-columns: 1fr; gap: 0; }
}


/* ---------- Selettore lingua ---------- */
.lang { display: inline-flex; align-items: center; border: 1.5px solid var(--navy); border-radius: 999px; padding: 2px; flex: 0 0 auto; }
.lang__item { display: inline-flex; align-items: center; justify-content: center; min-width: 36px; min-height: 32px; padding: 0 .5rem; border-radius: 999px; font-size: .78rem; font-weight: 700; letter-spacing: .12em; text-decoration: none; color: var(--navy); }
.lang__item.is-current { background: var(--navy); color: var(--white); }
a.lang__item:hover { background: var(--paper-2); }

/* Elementi del pannello mobile: nascosti su desktop */
.drawer-top, .drawer-foot, .stripe--drawer, .nav-backdrop { display: none; }
.menu-toggle__word { font-size: .78rem; font-weight: 700; letter-spacing: .18em; text-transform: uppercase; }

@media (max-width: 1100px) {
  .site-header__actions { margin-left: auto; gap: .6rem; }

  /* Pulsante Menu: pillola con due linee asimmetriche */
  .menu-toggle {
    display: inline-flex; align-items: center; gap: .55rem; width: auto; height: 44px; padding: 0 .95rem 0 .8rem;
    border: 1.5px solid var(--navy); border-radius: 999px; background: var(--white); color: var(--navy);
  }
  .menu-toggle__bars { display: grid; gap: 5px; width: 20px; margin: 0; justify-items: end; }
  .menu-toggle__bars span { display: block; height: 2px; width: 20px; background: currentColor; border-radius: 2px; }
  .menu-toggle__bars span:nth-child(2) { width: 13px; background: var(--red); }
  .menu-toggle[aria-expanded="true"] .menu-toggle__bars span:nth-child(1),
  .menu-toggle[aria-expanded="true"] .menu-toggle__bars span:nth-child(2) { transform: none; opacity: 1; }

  /* Pannello laterale stile iOS: entra da destra, si chiude con lo swipe */
  .nav-backdrop { display: block; position: fixed; inset: 0; z-index: 69; background: rgba(21,43,82,.45); -webkit-backdrop-filter: blur(3px); backdrop-filter: blur(3px); opacity: 0; transition: opacity .4s ease; }
  .nav-backdrop[hidden] { display: none; }
  .nav-backdrop.is-visible { opacity: 1; }
  .nav {
    position: fixed; top: 0; right: 0; bottom: 0; left: auto; z-index: 70;
    width: min(88vw, 420px); height: 100dvh; margin: 0; padding: 0 0 max(1.5rem, env(safe-area-inset-bottom));
    display: flex; flex-direction: column; gap: 0;
    background: var(--navy); color: var(--white);
    border-radius: 26px 0 0 26px; box-shadow: -30px 0 60px -20px rgba(21,43,82,.6);
    overflow-y: auto; overscroll-behavior: contain; touch-action: pan-y;
    visibility: hidden; opacity: 1; transform: translateX(105%);
    transition: transform .5s cubic-bezier(.32,.72,0,1), visibility 0s linear .5s;
  }
  .nav::before { content: ""; position: absolute; inset: 0; background: url("../img/sa-pattern-light.svg") center / 520px auto repeat; opacity: .22; pointer-events: none; border-radius: inherit; }
  .nav > * { position: relative; }
  .nav.is-open { visibility: visible; transform: translateX(var(--drag, 0px)); transition-delay: 0s; }
  .nav.is-dragging { transition: none; }
  /* maniglia per lo swipe */
  .nav::after { content: ""; position: absolute; left: 9px; top: 50%; width: 4px; height: 46px; margin-top: -23px; border-radius: 4px; background: rgba(255,255,255,.28); }

  .drawer-top { display: flex; align-items: center; gap: .8rem; padding: 1.1rem 1.25rem 1rem 1.6rem; }
  .drawer-top__crest { width: 44px; height: 44px; padding: 4px; border-radius: 50%; background: var(--white); }
  .drawer-top__since { margin: 0; font-size: .74rem; letter-spacing: .14em; text-transform: uppercase; line-height: 1.35; color: var(--sky); }
  .drawer-top__since strong { color: var(--white); font-size: .95rem; letter-spacing: .1em; }
  .drawer-close { margin-left: auto; display: grid; place-items: center; width: 44px; height: 44px; border: 1.5px solid rgba(255,255,255,.35); border-radius: 50%; background: transparent; color: var(--white); cursor: pointer; }
  .drawer-close svg { width: 20px; height: 20px; }
  .stripe--drawer { display: grid; height: 4px; }

  .nav__list { flex-direction: column; align-items: stretch; gap: 0; padding: .5rem 1.25rem 0 1.6rem; }
  .nav__list > li { border-bottom: 1px solid rgba(255,255,255,.14); }
  .nav__list > li > a { display: block; padding: 1rem 0; font-size: 1.12rem; letter-spacing: .07em; color: var(--white); }
  .nav .has-sub { flex-wrap: wrap; justify-content: space-between; align-items: center; }
  .nav .has-sub > a { flex: 1 1 0; min-width: 0; }
  .nav .has-sub > .sub-toggle { flex: 0 0 auto; }
  .stripe--drawer span:first-child { background: var(--white); }
  .nav__list > li > a[aria-current="page"] { color: var(--sky); }
  .nav__list > li > a[aria-current="page"]::after { display: none; }
  .sub-toggle { color: var(--white); border: 1.5px solid rgba(255,255,255,.3); }
  .sub-toggle:hover { background: rgba(255,255,255,.1); }
  .sub, .sub--mega { background: transparent; }
  .sub a { color: var(--white); padding: .55rem .2rem; }
  .sub a:hover, .sub a:focus-visible { background: rgba(255,255,255,.08); }
  .sub small { color: var(--sky); }
  .mega__title { color: var(--green); padding: 0 .2rem; }
  .sub .mega__feature { background: rgba(255,255,255,.08); }

  .drawer-foot { display: flex; flex-direction: column; gap: .8rem; margin-top: auto; padding: 1.6rem 1.25rem 0 1.6rem; }
  .drawer-foot__cta { width: 100%; }
  .drawer-foot__contact { margin: 0; font-size: .95rem; line-height: 1.7; }
  .drawer-foot__contact a { color: var(--sky); text-decoration: none; }
  .drawer-foot__script { margin: 0; font-size: 1.5rem; color: var(--green); }
  .drawer-foot__hint { margin: 0; font-size: .7rem; letter-spacing: .2em; text-transform: uppercase; color: rgba(255,255,255,.45); }
  .nav :focus-visible { outline-color: var(--white); }
  body.menu-open { overflow: hidden; }
}
@media (max-width: 600px) {
  .lang__item { min-width: 32px; min-height: 30px; padding: 0 .4rem; font-size: .72rem; }
  .menu-toggle { padding: 0 .75rem 0 .7rem; }
}
@media (max-width: 380px) {
  .menu-toggle__word { display: none; }
}

.site-footer__age { color: var(--sky); font-weight: 700; font-size: .85em; margin-left: .25em; }

/* Servizio riservato agli iscritti */
.members-only { display: flex; align-items: flex-start; gap: .55rem; max-width: 46ch; margin: var(--s-4) 0 0; padding: .7rem 1rem; border-radius: 12px; background: rgba(255,255,255,.55); color: var(--navy); font-size: .95rem; font-weight: 500; line-height: 1.45; }
.members-only svg { flex: 0 0 auto; width: 18px; height: 18px; margin-top: .1rem; fill: var(--red); }
.members-only--dark { background: var(--paper-2); }
.notice { margin-top: var(--s-5); padding: var(--s-4) var(--s-5); border-left: 4px solid var(--red); border-radius: 0 12px 12px 0; background: var(--white); font-size: 1rem; }
.party__note { margin: -.4rem 0 1rem; font-size: .95rem !important; font-weight: 500; opacity: .9; }

/* How to Apply */
.key-dates { display: grid; grid-template-columns: repeat(3, 1fr); gap: var(--s-4); margin: clamp(2.5rem, 5vw, 3.5rem) 0 0; }
.key-date { padding: var(--s-5); border-radius: var(--radius-lg); background: var(--white); border-top: 6px solid var(--band); box-shadow: 0 0 0 1px var(--line); }
.key-date dt { font-size: .78rem; font-weight: 700; letter-spacing: .16em; text-transform: uppercase; color: var(--ink-soft); }
.key-date dd { margin: .35rem 0 0; font-size: 1.45rem; font-weight: 900; line-height: 1.15; }
.key-date--green { --band: var(--green); } .key-date--sky { --band: var(--sky); } .key-date--red { --band: var(--red); }
.steps--apply .step { border-top: 6px solid var(--band, var(--navy)); }
.steps--apply .step__n { background: var(--band, var(--navy)); color: var(--band-fg, var(--white)); }
.step--navy { --band: var(--navy); } .step--green { --band: var(--green); --band-fg: var(--navy); }
.step--sky { --band: var(--sky); --band-fg: var(--navy); } .step--red { --band: var(--red); }
.step p { color: var(--ink-soft); font-size: 1rem; }
.step__tbc { font-size: .9rem !important; }
.apply-grid { display: grid; grid-template-columns: 1fr 1fr; gap: var(--s-5); }
.apply-card { padding: clamp(1.5rem, 3vw, 2.5rem); border-radius: 20px; background: var(--white); box-shadow: 0 0 0 1px var(--line); }
.apply-card h2 { font-size: clamp(1.6rem, 2.6vw, 2.2rem); margin-bottom: var(--s-4); }
.apply-card--navy { position: relative; overflow: hidden; background: var(--navy); color: var(--white); box-shadow: none; }
.apply-card--navy::after { content: ""; position: absolute; inset: 0; background: url("../img/sa-pattern-light.svg") center / 600px auto repeat; opacity: .22; pointer-events: none; }
.apply-card--navy > * { position: relative; }
.faq summary { text-align: left; }
.faq a { color: var(--red); font-weight: 500; }
@media (max-width: 900px) { .key-dates, .apply-grid { grid-template-columns: 1fr; } }

/* ===== Admissions ===== */
.hp { position: absolute !important; left: -9999px; width: 1px; height: 1px; overflow: hidden; }
.field__opt { font-weight: 400; color: var(--ink-soft); }
.adm-hero { position: relative; overflow: hidden; }
.adm-hero .page-hero__inner { position: relative; }
.adm-hero h1 { font-size: clamp(2.6rem, 5.6vw, 4.8rem); line-height: 1.02; }
.adm-hero__lead { font-family: var(--font-script); color: var(--red); font-size: clamp(1.7rem, 2.8vw, 2.4rem); line-height: 1.2; margin: var(--s-3) 0 var(--s-5); max-width: 28ch; }
.adm-hero .page-hero__media { position: relative; }
.adm-hero__since { position: absolute; left: -1.5rem; bottom: 1.5rem; margin: 0; width: 118px; height: 118px; border-radius: 50%; display: grid; place-content: center; text-align: center; background: var(--green); color: var(--navy); font-weight: 900; font-size: 1.7rem; line-height: 1; box-shadow: 0 20px 40px -20px rgba(21,43,82,.6); transform: rotate(-8deg); }
.adm-hero__since span { display: block; font-size: .72rem; font-weight: 700; letter-spacing: .2em; text-transform: uppercase; margin-bottom: .2rem; }

.adm-index { position: sticky; top: var(--header-h, 84px); z-index: 20; background: rgba(255,255,255,.94); backdrop-filter: blur(8px); -webkit-backdrop-filter: blur(8px); border-bottom: 1px solid var(--line); }
.adm-index__list { list-style: none; display: flex; gap: .4rem; margin: 0 auto; padding-block: .7rem; overflow-x: auto; scrollbar-width: none; }
.adm-index__list::-webkit-scrollbar { display: none; }
.adm-index a { display: inline-flex; align-items: center; gap: .5rem; white-space: nowrap; padding: .5rem .95rem; border-radius: 999px; color: var(--navy); text-decoration: none; font-size: .8rem; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; transition: background-color .2s, color .2s; }
.adm-index a span { color: var(--red); font-weight: 900; }
.adm-index a:hover, .adm-index a.is-active { background: var(--navy); color: var(--white); }
.adm-index a:hover span, .adm-index a.is-active span { color: var(--sky); }
.page-admissions [id] { scroll-margin-top: calc(var(--header-h, 84px) + 70px); }

.adm-intro { padding-block: clamp(4rem, 9vw, 7.5rem); }
.adm-intro__inner { max-width: 1040px; }
.adm-intro__big { font-size: clamp(1.6rem, 3vw, 2.5rem); line-height: 1.28; font-weight: 500; color: var(--navy); margin: 0 0 clamp(2rem, 4vw, 3rem); text-wrap: balance; }
.adm-intro__big::before { content: ""; display: block; width: 96px; height: 6px; margin-bottom: var(--s-5); border-radius: 6px; background: linear-gradient(90deg, var(--navy) 0 25%, var(--green) 25% 50%, var(--sky) 50% 75%, var(--red) 75%); }
.adm-intro__cols { display: grid; grid-template-columns: 1fr 1fr; gap: clamp(1.5rem, 4vw, 3.5rem); color: var(--ink-soft); font-size: 1.12rem; }
.adm-intro__cols p { margin: 0; }

.adm-num { margin: 0 0 var(--s-3); font-size: clamp(3.4rem, 6vw, 5rem); font-weight: 900; line-height: .9; color: transparent; -webkit-text-stroke: 2px var(--sky); letter-spacing: -.02em; }
.adm-num--light { -webkit-text-stroke-color: rgba(134,178,224,.85); }
.adm-chapter h2 { font-size: clamp(2rem, 3.6vw, 3rem); }
.adm-chapter .split__text p:not(.eyebrow):not(.adm-num) { color: var(--ink-soft); }
.adm-photo { position: relative; }
.adm-photo img { width: 100%; aspect-ratio: 4 / 3.4; object-fit: cover; border-radius: 28px; position: relative; z-index: 1; }
.adm-photo::before { content: ""; position: absolute; inset: 1.4rem -1.4rem -1.4rem 1.4rem; border-radius: 28px; background: var(--tone); }
.adm-photo--green { --tone: var(--green); }
.adm-photo--sky { --tone: var(--sky); }
.split--reverse .adm-photo::before { inset: 1.4rem 1.4rem -1.4rem -1.4rem; }
.adm-quote { font-size: 1.35rem; font-weight: 500; color: var(--navy) !important; line-height: 1.4; padding-left: 1.1rem; border-left: 4px solid var(--red); }

.adm-process { display: grid; grid-template-columns: 7fr 5fr; gap: clamp(2rem, 6vw, 6rem); align-items: center; }
.adm-process__text > p:not(.eyebrow):not(.adm-num) { color: var(--ink-soft); }
.adm-process__text strong { color: var(--navy); }
.adm-process .btn { margin-top: var(--s-3); }
.adm-notice { margin-top: var(--s-6); }
.adm-notice p { margin: 0; }
.adm-notice__label { font-size: .75rem; font-weight: 700; letter-spacing: .16em; text-transform: uppercase; color: var(--red); margin-bottom: .3rem !important; }
.adm-programs { display: block; position: relative; overflow: hidden; padding: clamp(1.75rem, 3vw, 2.5rem); border-radius: 28px; background: var(--navy); color: var(--white); text-decoration: none; box-shadow: 0 40px 70px -45px rgba(21,43,82,.9); transition: transform .3s var(--ease); }
.adm-programs::after { content: ""; position: absolute; inset: 0; background: url("../img/sa-pattern-light.svg") center / 560px auto repeat; opacity: .2; pointer-events: none; }
.adm-programs > * { position: relative; z-index: 1; }
.adm-programs:hover { transform: translateY(-4px); }
.adm-programs .eyebrow { color: var(--green); }
.adm-programs__title { font-size: clamp(1.4rem, 2.2vw, 1.8rem); font-weight: 900; line-height: 1.2; margin: 0 0 var(--s-5); }
.adm-programs__list { list-style: none; margin: 0 0 var(--s-5); padding: 0; }
.adm-programs__list li { display: flex; align-items: center; gap: .7rem; padding: .7rem 0; border-top: 1px solid rgba(255,255,255,.16); font-weight: 500; }
.adm-programs__list li::before { content: ""; width: 12px; height: 12px; border-radius: 50%; background: var(--dot); flex: none; box-shadow: 0 0 0 2px rgba(255,255,255,.25); }
.adm-programs__list span { margin-left: auto; font-size: .85rem; font-weight: 700; letter-spacing: .08em; color: var(--sky); }
.dot-green { --dot: var(--green); } .dot-red { --dot: var(--red); } .dot-sky { --dot: var(--sky); } .dot-navy { --dot: #fff; }
.adm-programs__more { font-size: .85rem; font-weight: 700; letter-spacing: .14em; text-transform: uppercase; color: var(--green); }

.adm-om { position: relative; }
.adm-om__inner { position: relative; display: grid; grid-template-columns: 6fr 5fr; gap: clamp(2rem, 6vw, 6rem); align-items: center; }
.adm-om__text h2 { text-align: left; }
.adm-om__text p:not(.eyebrow):not(.adm-num) { color: rgba(255,255,255,.88); font-size: 1.12rem; }
.om-card { position: relative; padding: clamp(1.75rem, 3.5vw, 2.75rem); border-radius: 28px; background: var(--paper); color: var(--navy); box-shadow: 0 50px 90px -50px rgba(0,0,0,.7); }
.om-card::before { content: ""; position: absolute; left: 0; right: 0; top: 0; height: 8px; border-radius: 28px 28px 0 0; background: linear-gradient(90deg, var(--navy) 0 25%, var(--green) 25% 50%, var(--sky) 50% 75%, var(--red) 75%); }
.om-card__kicker { margin: 0; font-family: var(--font-script); font-size: 2.2rem; line-height: 1; color: var(--red); }
.om-card__title { margin: .3rem 0 var(--s-4); font-size: clamp(1.6rem, 2.6vw, 2.1rem); font-weight: 900; line-height: 1.1; }
.om-card__dates { list-style: none; margin: 0 0 var(--s-4); padding: 0; }
.om-card__dates li { display: grid; grid-template-columns: 64px 1fr; gap: 1rem; align-items: center; padding: .8rem 0; border-top: 1px solid rgba(30,59,110,.12); }
.om-date { display: grid; place-items: center; width: 64px; height: 64px; border-radius: 16px; background: var(--navy); color: #fff; line-height: 1; }
.om-date b { font-size: 1.6rem; font-weight: 900; color: #fff; }
.om-date small { font-size: .68rem; font-weight: 700; letter-spacing: .14em; text-transform: uppercase; color: var(--sky); }
.om-card__dates strong { display: block; font-size: 1.05rem; }
.om-card__dates span { color: var(--ink-soft); font-size: .95rem; }
.om-card__how, .om-card__default { color: var(--ink-soft); margin: 0 0 var(--s-5); }
.om-card__updated { margin: var(--s-4) 0 0; font-size: .8rem; color: var(--ink-soft); }

.adm-contacts { list-style: none; margin: var(--s-5) 0 0; padding: 0; }
.adm-contacts li { display: flex; flex-direction: column; padding: .7rem 0; border-top: 1px solid var(--line); }
.adm-contacts span { font-size: .72rem; font-weight: 700; letter-spacing: .16em; text-transform: uppercase; color: var(--red); }
.adm-contacts a { color: var(--navy); font-weight: 500; font-size: 1.1rem; text-decoration: none; }
.adm-contacts a:hover { text-decoration: underline; text-decoration-color: var(--sky); }
.page-admissions .form-wrap h2 { font-size: clamp(1.9rem, 3.2vw, 2.6rem); }

@media (max-width: 900px) {
  .adm-process, .adm-om__inner, .adm-intro__cols { grid-template-columns: 1fr; }
  .adm-hero__since { left: .5rem; width: 96px; height: 96px; font-size: 1.4rem; }
  .adm-photo::before { inset: 1rem -.6rem -1rem 1rem; }
  .split--reverse .adm-photo::before { inset: 1rem 1rem -1rem -.6rem; }
}
.form__status.is-ok { padding: .8rem 1rem; border-radius: 10px; background: #EEF5D6; color: #3F4D0E; }

/* Credit agenzia nel footer */
.credit { display: inline; white-space: nowrap; text-decoration: none !important; opacity: .85; transition: opacity .2s; }
.credit:hover { opacity: 1; }
.credit__logo { font-weight: 900; font-size: 1rem; letter-spacing: -.01em; color: var(--white); }
.credit img { display: inline-block; height: .82em; width: auto; margin-left: .25em; vertical-align: -.04em; }

/* Ritratto Headmistress: cerchio con anello tratteggiato */
.head__portrait { isolation: isolate; padding: 12px; }
.head__portrait::before { content: ""; position: absolute; inset: 0; border-radius: 50%; border: 1.5px dashed rgba(30,59,110,.45); z-index: -1; }
.head__photo { display: block; width: 100%; height: auto; aspect-ratio: 1; object-fit: cover; object-position: 50% 18%; border-radius: 50%; }
@media (max-width: 820px) { .head__portrait { position: relative; top: auto; width: 180px; padding: 10px; } }