/* Iris — stile «Atlante pastello» (direzione F), senza font o script esterni */
:root {
  color-scheme: light;
  --ink: #14213d; --muted: #4d5b72; --paper: #eef4f8; --surface: #fffdf8;
  --line: #bdc9d8; --sky: #dcebff; --mint: #d8f2e6; --peach: #ffe1d3; --lilac: #efe3ff; --butter: #fff3c9;
  --p2: #285e78; --link: #234d72;
  --primary-top: #9dc7ff; --primary-bottom: #6791ce;
  --r: 18px; --shadow: 0 18px 45px #233a5d1b;
}
* { box-sizing: border-box; }
html { scroll-behavior: smooth; -webkit-text-size-adjust: 100%; }
body {
  margin: 0; min-height: 100vh; display: flex; flex-direction: column;
  background: var(--paper); color: var(--ink);
  font: 17px/1.6 ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto, "Noto Sans", "Noto Sans Arabic", "Noto Sans SC", sans-serif;
}
a { color: var(--link); text-underline-offset: 3px; }
a:focus-visible, .bottone:focus-visible { outline: 3px solid #5e85b7; outline-offset: 3px; border-radius: 6px; }
main { flex: 1; width: 100%; max-width: 900px; margin: 0 auto; padding: 24px 16px 48px; }

.testata {
  display: flex; align-items: center; justify-content: space-between; gap: 12px; flex-wrap: wrap;
  padding: 10px clamp(16px, 4vw, 40px);
  background: linear-gradient(125deg, #dcebff, #f4e7ff 62%, #ffe1d3);
  border-bottom: 1px solid #b8c6d9;
}
.marchio { display: inline-flex; align-items: center; gap: 10px; text-decoration: none; color: var(--ink); font-weight: 900; font-size: 24px; letter-spacing: -.02em; min-height: 48px; }
.marchio img { width: 56px; height: auto; }
.testata nav { display: flex; gap: 4px; flex-wrap: wrap; }
.testata nav a { min-height: 44px; display: inline-flex; align-items: center; padding: 6px 12px; border-radius: 10px; color: var(--ink); font-weight: 750; text-decoration: none; }
.testata nav a[aria-current] { background: var(--lilac); border: 1px solid #ad95ca; }

.eroe { text-align: center; padding: 28px 0 16px; }
.logo { width: min(220px, 60vw); height: auto; }
h1 { font-size: clamp(30px, 6vw, 48px); line-height: 1.1; letter-spacing: -.03em; margin: 12px 0; }
.breve { font-size: 20px; color: #36465f; max-width: 640px; margin: 0 auto 22px; }

.bottone {
  display: inline-flex; align-items: center; justify-content: center; min-height: 52px; padding: 10px 22px;
  border: 1px solid #557ba7; border-radius: 15px; color: #102241; font-weight: 900; text-decoration: none;
  background: linear-gradient(180deg, var(--primary-top), var(--primary-bottom));
  box-shadow: inset 0 2px 0 #ffffffa8, 0 5px 0 #4d74a3, 0 10px 16px #426c9c38;
}
.bottone:active { transform: translateY(4px); box-shadow: inset 0 2px 5px #31547735, 0 1px 0 #4d74a3; }
.bottone.spento { background: linear-gradient(180deg, #fff, #e6d8f5); border-color: #a897bd; color: #293858; box-shadow: inset 0 2px 0 #fff, 0 4px 0 #ad9bbb; cursor: default; }

.carta { background: var(--surface); border: 1px solid var(--line); border-radius: var(--r); padding: clamp(18px, 4vw, 36px); box-shadow: var(--shadow); margin-top: 20px; }
.carta > h1:first-child { margin-top: 0; }
.email { font-size: 20px; font-weight: 800; }
mark.segnaposto { background: var(--butter); color: #6b4d00; padding: 0 4px; border-radius: 4px; }

/* home */
main:has(.vetrina) { max-width: 1120px; }
.intro { max-width: 760px; margin: 26px auto 0; text-align: start; color: var(--muted); }
.vetrina { margin: 28px 0 8px; }
.vetrina h2, .sezioni h2, .carta h2 { font-size: 24px; letter-spacing: -.02em; margin: 0 0 12px; }
.vetrina h2 { text-align: center; }
.schermate { list-style: none; margin: 0; padding: 4px 4px 18px; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 18px; align-items: start; }
.schermate figure { margin: 0; }
.schermate img { display: block; width: 100%; height: auto; border-radius: 22px; border: 6px solid #26344e; box-shadow: var(--shadow); background: #26344e; }
.schermate figcaption { text-align: center; font-weight: 800; font-size: 15px; margin-top: 10px; }
@media (max-width: 820px) {
  .schermate { display: flex; overflow-x: auto; scroll-snap-type: x mandatory; gap: 14px; margin: 0 -16px; padding: 4px 16px 18px; }
  .schermate li { flex: 0 0 68%; scroll-snap-align: center; }
}
.sezioni { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0 20px; }
.sezioni .larga { grid-column: 1 / -1; }
@media (max-width: 820px) { .sezioni { grid-template-columns: 1fr; } }
.punti { list-style: none; padding: 0; margin: 0; }
.punti li { position: relative; padding-inline-start: 28px; margin: 10px 0; }
.punti li::before { content: ""; position: absolute; inset-inline-start: 4px; top: .55em; width: 11px; height: 11px; border-radius: 50%; background: linear-gradient(135deg, #9dc7ff, #d8b4f0, #ffc7a8); box-shadow: 0 0 0 3px #dcebff; }
.passi { list-style: none; padding: 0; margin: 0; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; counter-reset: passo; }
.passi li { counter-increment: passo; background: var(--sky); border-radius: 16px; padding: 16px; }
.passi li::before { content: counter(passo); display: grid; place-items: center; width: 38px; height: 38px; border-radius: 12px; margin-bottom: 8px; font-weight: 950; font-size: 20px; color: #102241; background: linear-gradient(180deg, var(--primary-top), var(--primary-bottom)); box-shadow: inset 0 2px 0 #ffffffa8, 0 3px 0 #4d74a3; }
.passi strong { display: block; }
@media (max-width: 820px) { .passi { grid-template-columns: 1fr; } }
.privata { background: linear-gradient(160deg, var(--mint), var(--surface) 70%); }
.chip { list-style: none; padding: 0; margin: 14px 0 0; display: flex; flex-wrap: wrap; gap: 8px; }
.chip li { padding: 6px 12px; border-radius: 99px; background: var(--lilac); border: 1px solid #cdb9e6; font-size: 15px; font-weight: 650; }
.avviso { margin-top: 20px; background: var(--butter); border-inline-start: 5px solid #8b6515; border-radius: 10px 16px 16px 10px; padding: 14px 18px; }
.avviso p { margin: 0; }
.link-privacy { text-align: center; margin-top: 28px; }

/* informativa */
.testo-legale h1 { font-size: clamp(28px, 5vw, 40px); }
.testo-legale h2 { font-size: 24px; margin: 40px 0 8px; padding-top: 12px; border-top: 1px solid var(--line); scroll-margin-top: 16px; }
.testo-legale h3 { font-size: 19px; margin: 26px 0 6px; color: var(--p2); }
.testo-legale li { margin: 6px 0; }
.testo-legale li > p { margin: 8px 0; }
.testo-legale code { background: #eaf0f5; padding: 1px 5px; border-radius: 5px; font-size: .92em; overflow-wrap: anywhere; }
.altra-lingua { margin-top: -4px; }
.sommario { background: var(--sky); border-radius: 14px; padding: 12px 18px; margin: 20px 0; }
.sommario ol { margin: 0; padding-inline-start: 22px; }
.sommario li { margin: 4px 0; }
.tabella { overflow-x: auto; margin: 14px 0; border: 1px solid var(--line); border-radius: 12px; }
table { border-collapse: collapse; width: 100%; min-width: 560px; font-size: 15px; }
th, td { text-align: start; vertical-align: top; padding: 9px 12px; border-bottom: 1px solid var(--line); }
th { background: #eaf0f5; }
tr:last-child td { border-bottom: 0; }

/* pagine di scelta */
.scelta { text-align: center; padding-top: 48px; }
.bottoni { display: flex; gap: 14px; justify-content: center; flex-wrap: wrap; margin: 24px 0; }
.bottoni .bottone { min-width: 160px; }
.griglia { display: grid; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); max-width: 680px; margin: 24px auto; }
.piccolo { font-size: 14px; color: var(--muted); }

.piede { background: #1d2940; color: #e8effc; padding: 20px clamp(16px, 4vw, 40px); font-size: 14px; }
.piede p { margin: 0 0 8px; }
.lingue { display: flex; flex-wrap: wrap; gap: 4px 14px; }
.lingue a { color: #fff; min-height: 40px; display: inline-flex; align-items: center; }
.lingue a[aria-current] { font-weight: 900; text-decoration: none; }

@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    color-scheme: dark;
    --ink: #f2f6ff; --muted: #c5d1e6; --paper: #1b2538; --surface: #24324b; --line: #4b5d7c;
    --sky: #2d4466; --lilac: #43386a; --butter: #5c4d1d; --p2: #9fd0ea; --link: #a9cdff;
  }
  :root:not([data-theme="light"]) .testata { background: linear-gradient(125deg, #2a3d5f, #3b3361 62%, #4d3a3a); border-color: #4b5d7c; }
  :root:not([data-theme="light"]) .breve { color: #d6e0f0; }
  :root:not([data-theme="light"]) .testo-legale code, :root:not([data-theme="light"]) th { background: #2e3f5c; }
  :root:not([data-theme="light"]) mark.segnaposto { color: #ffe9a8; }
  :root:not([data-theme="light"]) .privata { background: linear-gradient(160deg, #24493f, var(--surface) 70%); }
  :root:not([data-theme="light"]) .chip li { border-color: #6c5b93; }
  :root:not([data-theme="light"]) .punti li::before { box-shadow: 0 0 0 3px #2d4466; }
}
