/* Ci sei? — stile condiviso del sito (landing, invito, pagine legali). Font self-hosted: nessuna chiamata a terzi. */
@font-face { font-family: "Bricolage"; src: url("/fonts/bricolage_bold.ttf") format("truetype"); font-weight: 700; font-display: swap; }
@font-face { font-family: "Bricolage"; src: url("/fonts/bricolage_extrabold.ttf") format("truetype"); font-weight: 800; font-display: swap; }
@font-face { font-family: "Atkinson"; src: url("/fonts/atkinson_regular.ttf") format("truetype"); font-weight: 400; font-display: swap; }
@font-face { font-family: "Atkinson"; src: url("/fonts/atkinson_bold.ttf") format("truetype"); font-weight: 700; font-display: swap; }

:root {
  --mist: #f2f5f7; --paper: #ffffff; --mist-deep: #e5ebee; --ink: #17232b; --muted: #4a5862;
  --pine: #1d5c45; --on-pine: #ffffff; --pine-soft: #d3ecdf; --mint: #2b9466;
  --lamp: #b87510; --lamp-soft: #fceacb; --on-lamp-soft: #4a2f00; --alarm: #b3261e; --alarm-soft: #fbe2de; --line: #c9d3d9;
}
@media (prefers-color-scheme: dark) {
  :root {
    --mist: #0d171c; --paper: #14222a; --mist-deep: #1c2e37; --ink: #e3ecef; --muted: #a2b3bc;
    --pine: #8eddb8; --on-pine: #06301f; --pine-soft: #1f4a3a; --mint: #5fd39d;
    --lamp: #f2c063; --lamp-soft: #3a2c12; --on-lamp-soft: #fce9c8; --alarm: #ffb4ab; --alarm-soft: #5c1a14; --line: #2e434d;
  }
}
* { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; }
body { margin: 0; background: var(--mist); color: var(--ink); font: 18px/1.6 "Atkinson", system-ui, sans-serif; }
h1, h2, h3 { font-family: "Bricolage", system-ui, sans-serif; line-height: 1.12; letter-spacing: -0.015em; margin: 0; }
a { color: var(--pine); text-underline-offset: 3px; }
:focus-visible { outline: 3px solid var(--mint); outline-offset: 3px; border-radius: 6px; }
.wrap { max-width: 1040px; margin: 0 auto; padding: 0 20px; }
.btn { display: inline-flex; align-items: center; justify-content: center; min-height: 54px; padding: 12px 26px; border-radius: 999px;
       font-weight: 700; font-size: 1.05rem; text-decoration: none; border: 2px solid var(--pine); }
.btn-primary { background: var(--pine); color: var(--on-pine); }
.btn-ghost { background: transparent; color: var(--ink); border-color: var(--line); }
.btn[aria-disabled="true"] { opacity: .6; pointer-events: none; }
.muted { color: var(--muted); }
.panel { background: var(--paper); border-radius: 24px; padding: 22px; }
.note-alarm { background: var(--alarm-soft); border-radius: 18px; padding: 16px 18px; font-weight: 700; }
@media (prefers-reduced-motion: reduce) { * { animation: none !important; transition: none !important; } }