/* Pagina "in arrivo": autonoma, non usa site.css. Colori del marchio (brand/README.md). */
@font-face { font-family: Sora; src: url('../assets/fonts/sora.ttf') format('truetype'); font-weight: 100 800; font-display: swap; }
@font-face { font-family: Manrope; src: url('../assets/fonts/manrope.ttf') format('truetype'); font-weight: 200 800; font-display: swap; }

:root { --navy: #06182b; --blue: #087ef5; --yellow: #ffd329; --ink: #fff; --muted: #a9bad0; }
* { box-sizing: border-box; }
html, body { margin: 0; min-height: 100%; }
body {
  display: flex; flex-direction: column; min-height: 100vh; min-height: 100dvh;
  background: radial-gradient(1200px 600px at 85% -10%, #0b2c52 0%, transparent 60%), var(--navy);
  color: var(--ink); font: 400 17px/1.6 Manrope, system-ui, sans-serif;
}

.cs { position: relative; flex: 1; width: 100%; max-width: 880px; margin: 0 auto; padding: 72px 28px 48px; overflow: hidden; }
.cs-glow { position: absolute; inset: auto -120px -160px auto; width: 420px; height: 420px; border-radius: 50%; background: radial-gradient(circle, rgba(8, 126, 245, .28), transparent 70%); pointer-events: none; }
.cs-logo { display: block; width: min(420px, 100%); height: auto; }

.cs-badge { display: inline-flex; align-items: center; gap: 10px; margin: 64px 0 20px; padding: 6px 14px; border: 1px solid rgba(255, 211, 41, .45); border-radius: 999px; color: var(--yellow); font: 600 14px/1.4 Sora, system-ui, sans-serif; letter-spacing: .04em; text-transform: uppercase; }
.cs-badge span { width: 8px; height: 8px; border-radius: 50%; background: var(--yellow); animation: cs-pulse 1.8s ease-in-out infinite; }
@keyframes cs-pulse { 50% { opacity: .35; transform: scale(.8); } }

h1 { margin: 0; max-width: 760px; font: 700 clamp(32px, 5.2vw, 54px)/1.12 Sora, system-ui, sans-serif; letter-spacing: -.03em; }
h1 em { font-style: normal; color: var(--blue); }
.cs-lead { max-width: 640px; margin: 24px 0 0; color: var(--muted); font-size: 19px; }

.cs-points { display: flex; flex-wrap: wrap; gap: 12px 28px; margin: 36px 0 0; padding: 0; list-style: none; }
.cs-points li { display: flex; align-items: center; gap: 10px; font-weight: 600; }
.cs-points svg { width: 20px; height: 20px; flex-shrink: 0; fill: none; stroke: var(--yellow); stroke-width: 2.4; stroke-linecap: round; stroke-linejoin: round; }

.cs-scope { margin: 40px 0 0; padding-top: 24px; border-top: 1px solid rgba(169, 186, 208, .2); color: var(--muted); font-size: 15px; }

.cs-footer { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 10px 24px; width: 100%; max-width: 880px; margin: 0 auto; padding: 20px 28px 28px; color: var(--muted); font-size: 13px; }
.cs-footer nav { display: flex; gap: 18px; }
.cs-footer a { color: var(--muted); text-decoration: none; }
.cs-footer a:hover, .cs-footer a:focus-visible { color: var(--ink); text-decoration: underline; }

@media (max-width: 760px) {
  .cs { padding: 40px 20px 32px; }
  .cs-badge { margin-top: 44px; }
  .cs-lead { font-size: 17px; }
  .cs-points { flex-direction: column; }
  .cs-footer { padding: 16px 20px 24px; }
}
@media (prefers-reduced-motion: reduce) { .cs-badge span { animation: none; } }
