/* =========================================================
   CoRi Academy — Pacchetti ATA 2027
   Stili aggiuntivi per le pagine promozionali.
   Va caricato DOPO assets/css/style.css: header, menu e footer
   restano quelli del sito; qui ci sono solo le sezioni nuove.
   Caratteri e dimensioni seguono il sito: i titoli (h1–h3) prendono
   Georgia da style.css, il testo Times New Roman; le dimensioni usano
   la stessa scala fluida di style.css (variabile --s). Attenzione:
   la radice del sito è 13px, quindi 1rem = 13px.
   ========================================================= */

:root {
  --ata-ink: #000;
  --ata-muted: #4a4a4a;
  --ata-grey: var(--light);
  --ata-white: #fff;
  --ata-gold: #8a6122;        /* testo e pulsanti: contrasto AA su bianco e grigio */
  --ata-gold-line: #c9a46a;   /* filetti e decorazioni */
  --ata-gold-tint: #faf5ec;   /* fondo tenue per il pacchetto e l'offerta */
  --ata-rule: rgba(0, 0, 0, .18);
  --ata-pad: var(--gutter);   /* stessi margini laterali di header e footer */
  --ata-max: var(--max-width);
}

/* Testo di base delle pagine: come i paragrafi del sito (--s: 1.2).
   Elenchi, tabella e righe senza classe ereditano questa dimensione. */
.ata {
  --s: 1.2;
  color: var(--ata-ink);
  font-size: min(
    calc((var(--s) - 1) * 1.2vw + 1rem),
    max(calc((var(--s) - 1) * 24px + 1rem), calc(var(--s) * 1rem))
  );
}
@media (max-width: 767px) and (orientation: portrait) {
  .ata { font-size: calc((var(--s) - 1) * min(1.2vh, 10.8px) + 1rem); }
}
.ata img { height: auto; }

.ata-section { padding: clamp(3.5rem, 8vw, 7rem) var(--ata-pad); background: var(--ata-white); }
.ata-section--grey { background: var(--ata-grey); }
.ata-wrap { max-width: var(--ata-max); margin: 0 auto; }

/* Titoli: font, dimensione e interlinea arrivano da h1/h2/h3 di style.css */
.ata-h1 { margin: 0; }
.ata-h2 { margin: 0; }
.ata-lead { --s: 1.5; line-height: 1.45; margin: 1.5rem 0 0; max-width: 34ch; }
.ata-text { margin: 1rem 0 0; max-width: 60ch; color: var(--ata-muted); }

/* ---------- Pulsanti (stessa forma "pill" e stesso carattere dei .btn del sito) ---------- */
.ata-actions { display: flex; flex-wrap: wrap; gap: .75rem; margin-top: 2.25rem; }
.ata-btn {
  display: inline-flex; align-items: center; justify-content: center;
  padding: 1.3em 1.67em; border-radius: 999px;
  border: 1px solid var(--ata-ink); color: var(--ata-ink); background: transparent;
  font-family: var(--font-heading); font-size: 1rem; font-weight: 700; letter-spacing: .04em;
  line-height: 1.2em; text-align: center; text-decoration: none;
  transition: background-color .2s, color .2s, border-color .2s;
}
.ata-btn:hover { background: var(--ata-ink); color: var(--ata-white); }
.ata-btn--gold { background: var(--ata-gold); border-color: var(--ata-gold); color: var(--ata-white); }
.ata-btn--gold:hover { background: var(--ata-ink); border-color: var(--ata-ink); }
.ata a:focus-visible, .ata-btn:focus-visible { outline: 2px solid var(--ata-gold); outline-offset: 3px; }

/* ---------- Apertura ---------- */
.ata-hero { padding-top: clamp(2.5rem, 6vw, 5rem); }
.ata-hero__grid { display: grid; grid-template-columns: 1fr; gap: 3rem; align-items: center; }
.ata-hero__intro { margin: 0 0 1.25rem; color: var(--ata-muted); }
.ata-hero__motto { --s: 1.4; margin: 2.5rem 0 0; font-style: italic; color: var(--ata-gold); }
.ata-hero__media { position: relative; max-width: 30rem; justify-self: center; width: 100%; }
.ata-hero__media img { width: 100%; aspect-ratio: 564 / 665; object-fit: cover; }
.ata-hero__badge {
  position: absolute; left: .75rem; bottom: .75rem; margin: 0;
  width: 8.5rem; height: 8.5rem; border-radius: 50%;
  background: var(--ata-gold); color: var(--ata-white);
  display: grid; place-content: center; text-align: center;
  font-size: .9rem; line-height: 1.2; box-shadow: 0 0 0 6px var(--ata-grey);
}
.ata-hero__badge strong { display: block; font-size: 2.3rem; font-weight: 400; line-height: 1; }

@media (min-width: 900px) {
  .ata-hero__grid { grid-template-columns: 1.15fr .85fr; gap: 5rem; }
  .ata-hero__media { justify-self: end; }
  .ata-hero__badge { left: -1.25rem; bottom: 2rem; }
}

/* ---------- Vantaggi ---------- */
.ata-perks { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(2, 1fr); gap: 2rem 1.5rem; }
.ata-perks li { display: flex; flex-direction: column; gap: .9rem; line-height: 1.35; }
.ata-perks svg { width: 2.4rem; height: 2.4rem; color: var(--ata-gold); flex: none; }
@media (min-width: 900px) {
  .ata-perks { grid-template-columns: repeat(4, 1fr); gap: 0; }
  .ata-perks li { padding: 0 2rem; border-left: 1px solid var(--ata-gold-line); }
  .ata-perks li:first-child { padding-left: 0; border-left: 0; }
}

/* ---------- Listino pacchetti ---------- */
.ata-head { display: grid; gap: 1rem; margin-bottom: clamp(2.5rem, 5vw, 4rem); }
@media (min-width: 900px) { .ata-head { grid-template-columns: 1fr 1fr; align-items: end; gap: 4rem; } .ata-head .ata-text { margin: 0; } }

.ata-list { list-style: none; margin: 0; padding: 0; border-top: 1px solid var(--ata-ink); }
.ata-pack {
  display: grid; gap: 1.5rem;
  grid-template-columns: 1fr;
  padding: 2.25rem 0; border-bottom: 1px solid var(--ata-rule);
}
.ata-pack__num { --s: 1.1; color: var(--ata-gold); margin: 0 0 .4rem; }
.ata-pack__name { --s: 2; margin: 0; }
.ata-pack__tag { margin: .5rem 0 0; color: var(--ata-muted); }

.ata-items { list-style: none; margin: 0; padding: 0; }
.ata-items li {
  display: flex; align-items: baseline; gap: .6rem;
  padding: .55rem 0; border-bottom: 1px dotted var(--ata-rule);
}
.ata-items li:last-child { border-bottom: 0; }
.ata-items__name { flex: 1; }
.ata-items__price { white-space: nowrap; color: var(--ata-muted); }
.ata-items li::before {
  content: ""; width: .45rem; height: .45rem; border-radius: 50%;
  background: var(--ata-gold-line); flex: none; transform: translateY(-.1em);
}

/* I numeri restano in Times (cifre allineate): Georgia ha cifre "minuscole" */
.ata-price { display: grid; gap: .35rem; align-content: start; }
.ata-price__label { --s: 1.1; color: var(--ata-muted); margin: 0; }
.ata-price__list { --s: 1.3; margin: 0; }
.ata-price__list s { text-decoration-color: var(--ata-gold); text-decoration-thickness: 2px; }
.ata-price__offer { --s: 3; line-height: 1; margin: .4rem 0 0; }
.ata-price__save { margin: .6rem 0 0; }
.ata-price__save b { color: var(--ata-gold); font-weight: 700; }

/* Pagina senza prezzi: lo sconto prende il posto del prezzo */
.ata-price__pct { --s: 3.8; line-height: .95; color: var(--ata-gold); margin: 0; letter-spacing: -.02em; }
.ata-price__pctlabel { margin: .5rem 0 0; color: var(--ata-muted); }

.ata-pack__cta { margin: 1rem 0 0; }
.ata-pack__cta .ata-btn { padding: 1.05em 1.35em; font-size: .88rem; }

@media (min-width: 900px) {
  .ata-pack { grid-template-columns: 1.1fr 1.4fr .9fr; gap: 3rem; padding: 2.75rem 2rem; }
  .ata-price { justify-items: end; text-align: right; }
}

/* main.js ritarda di 0,1 s ogni elemento animato della stessa sezione.
   I pacchetti però entrano nello schermo uno alla volta, scorrendo:
   con il ritardo l'ultimo resterebbe vuoto per mezzo secondo. */
.js .ata-pack[data-anim] { transition-delay: 0s; }

/* ---------- Tabella di confronto ---------- */
.ata-table-wrap { position: relative; overflow-x: auto; -webkit-overflow-scrolling: touch; border-top: 1px solid var(--ata-ink); }
.ata-table { width: 100%; min-width: 44rem; border-collapse: collapse; }
.ata-table caption { text-align: left; padding: 0 0 1rem; color: var(--ata-muted); }
.ata-table th, .ata-table td { padding: 1rem .75rem; border-bottom: 1px solid var(--ata-rule); text-align: center; vertical-align: middle; }
.ata-table thead th { font-weight: 400; line-height: 1.25; vertical-align: bottom; }
.ata-table tbody th { text-align: left; font-weight: 400; padding-left: 0; }
.ata-table tfoot td, .ata-table tfoot th { border-bottom: 0; font-size: 1.15em; }
.ata-table tfoot tr:first-child > * { border-top: 1px solid var(--ata-ink); }
.ata-table tfoot th { text-align: left; padding-left: 0; font-weight: 400; }
.ata-table .ata-yes { color: var(--ata-gold); font-size: 1.2em; }
.ata-table .ata-no { color: #9a9a9a; }
.ata-table .ata-gold { color: var(--ata-gold); }

/* ---------- Offerta EIPASS ---------- */
.ata-extra {
  display: grid; gap: 2rem; padding: clamp(1.75rem, 4vw, 3rem);
  background: var(--ata-white); border: 1px solid var(--ata-gold-line);
}
.ata-extra .ata-items { max-width: 30rem; margin-top: 1.25rem; }
@media (min-width: 900px) {
  .ata-extra { grid-template-columns: 1.6fr 1fr; align-items: center; gap: 4rem; }
  .ata-extra .ata-price { justify-items: end; text-align: right; }
}
.ata-note { --s: 1.1; margin: 1.5rem 0 0; line-height: 1.6; color: var(--ata-muted); max-width: 62ch; }

/* ---------- Chiusura ---------- */
.ata-close { text-align: center; }
.ata-close .ata-h2 { max-width: 20ch; margin: 0 auto; }
.ata-close .ata-text { margin: 1.25rem auto 0; }
.ata-close .ata-actions { justify-content: center; }
.ata-contacts { margin: 1.75rem 0 0; color: var(--ata-muted); }
.ata-contacts a { color: inherit; }

@media (prefers-reduced-motion: reduce) {
  .ata-btn { transition: none; }
}