/* Piccole regole non coperte dalle utility Tailwind */

section[id] { scroll-margin-top: 6rem; }

/* Header con ombra dopo lo scroll (classe aggiunta da main.js) */
#site-header.is-scrolled {
  border-bottom-color: rgb(var(--ink-900) / .08);
  box-shadow: 0 6px 24px -12px rgb(var(--ink-900) / .18);
}

/* Griglia decorativa dello hero */
.bg-grid {
  background-image:
    linear-gradient(to right, rgb(var(--ink-900) / .05) 1px, transparent 1px),
    linear-gradient(to bottom, rgb(var(--ink-900) / .05) 1px, transparent 1px);
  background-size: 44px 44px;
  -webkit-mask-image: radial-gradient(ellipse at 50% 30%, #000 30%, transparent 75%);
          mask-image: radial-gradient(ellipse at 50% 30%, #000 30%, transparent 75%);
}

/* Onde decorative ispirate al simbolo wi-fi del logo */
.brand-waves {
  background:
    radial-gradient(circle at 0 100%, transparent 38%, rgb(var(--brand-500) / .18) 38.5%, rgb(var(--brand-500) / .18) 41%, transparent 41.5%),
    radial-gradient(circle at 0 100%, transparent 50%, rgb(var(--brand-500) / .12) 50.5%, rgb(var(--brand-500) / .12) 53%, transparent 53.5%),
    radial-gradient(circle at 0 100%, transparent 62%, rgb(var(--leaf-400) / .15) 62.5%, rgb(var(--leaf-400) / .15) 65%, transparent 65.5%);
}

/* Pulsante dei contatti protetti: aspetto da link */
.js-contact { cursor: pointer; text-decoration: underline; text-decoration-style: dotted; text-underline-offset: 3px; }

/* Comparsa progressiva: attiva solo quando main.js aggiunge .reveal-on */
.reveal-on .reveal { opacity: 0; transform: translateY(18px); transition: opacity .7s ease, transform .7s ease; }
.reveal-on .reveal.is-visible { opacity: 1; transform: none; }