/* Pagina "Prossimamente" (inc/coming-soon-page.php blocco + templates/coming-soon.html).
   Sostituisce il "Pardon our dust" generico di WooCommerce: solo logo, messaggio,
   contatto. Niente header/nav (la pagina non include parts/header.html), niente
   form/countdown/social — si guarda in tre secondi e via.
   Sfondo chiaro (gradiente --sky-fade gia' in theme.json), zero nero pieno.
   Tipografia dai token di style.css: nessun px/font scritto a mano qui, lo
   verifica node tools/css/check-type.mjs. */

.ldd-comingsoon {
  min-height: 100vh;
  width: 100%;
  box-sizing: border-box;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: clamp(28px, 6vw, 64px) var(--ldd-gutter);
  background: var(--wp--preset--gradient--sky-fade, linear-gradient(160deg, #e4f1f9 0%, #ffffff 100%));
  text-align: center;
}

.ldd-comingsoon-inner {
  max-width: 32rem;
  width: 100%;
  margin-inline: auto;
}

.ldd-comingsoon-logo {
  margin: 0 0 clamp(14px, 3vw, 22px);
}
.ldd-comingsoon-logo img {
  height: 34px;
  width: auto;
  max-width: 100%;
}

/* Filo tricolore del brand: lo stesso motivo che chiude l'header su ogni altra
   pagina (home.css .ldd-header::after). Qui non c'e' header, ma il richiamo
   di marca resta. */
.ldd-comingsoon-bricks {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 10px;
  margin: 0 0 clamp(20px, 4vw, 32px);
}
.ldd-comingsoon-bricks span {
  width: 9px;
  height: 9px;
  border-radius: 3px;
  background: var(--bk-band-line);
}
.ldd-comingsoon-bricks span:nth-child(3n+2) {
  background: var(--bk-blue-100);
}
.ldd-comingsoon-bricks span:nth-child(3n) {
  background: var(--bk-red-100);
}

.ldd-comingsoon-title {
  font-family: var(--bk-font-sans);
  /* Un gradino sotto --bk-fs-display-sm (52px): a quella misura "Stiamo
     montando il negozio" spezzava a 1440 con un'orfana in seconda riga.
     --bk-fs-h1 e' il gradino immediatamente sotto nella scala display
     (h1 33px < display-sm 52px < display 68px). Niente white-space:nowrap:
     polacco/olandese restano libere di andare a capo su schermi stretti. */
  font-size: var(--bk-fs-h1);
  font-weight: 900;
  line-height: 1.15;
  letter-spacing: -0.01em;
  color: var(--wp--preset--color--contrast, #171717);
  margin: 0 0 clamp(10px, 2vw, 16px);
}

.ldd-comingsoon-sub {
  font-family: var(--bk-font-sans);
  font-size: var(--bk-fs-lg);
  font-weight: 500;
  line-height: 1.5;
  color: var(--wp--preset--color--muted, #52525b);
  margin: 0 0 clamp(28px, 5vw, 44px);
}

.ldd-comingsoon-contact {
  font-family: var(--bk-font-sans);
  font-size: var(--bk-fs-sm);
  font-weight: 500;
  color: var(--wp--preset--color--muted, #52525b);
  margin: 0;
}
.ldd-comingsoon-contact a {
  color: var(--bk-blue-700);
  font-weight: 700;
  text-decoration: underline;
  text-underline-offset: 2px;
}
.ldd-comingsoon-contact a:hover,
.ldd-comingsoon-contact a:focus-visible {
  color: var(--bk-blue-600);
}

/* Schermi molto bassi (bassa altezza, non solo mobile stretto): il centraggio
   verticale rigido su 100vh non deve tagliare il contenuto, si scrolla. */
@media (max-height: 480px) {
  .ldd-comingsoon {
    min-height: auto;
    padding-block: clamp(24px, 8vh, 48px);
  }
}