/* =============================================================
   SETA LABS — SITE
   What the published site adds to the kit v1 (tokens, kit, hud,
   landing): legal pages, footer command, contact form wiring,
   cookie banner. Same tokens, no new colours: blue is the only
   action colour, bronze is instrumentation.
   ============================================================= */

/* --- footer: "Gestisci i cookie" reads like the links around it */
.lp-pie__comando {
  justify-self: start; padding: 0; border: 0; background: none; cursor: pointer;
  font-size: var(--t-small); color: var(--muted); text-align: left;
}
.lp-pie__comando:hover { color: var(--fg); }

/* --- bar of the inner pages: "Torna alla home" becomes an arrow on phones,
   so the logo, the language switcher and the button fit in 320px */
.lp-nav__indietro svg { display: none; transform: scaleX(-1); }
@media (max-width: 599px) {
  .lp-nav__indietro { width: 40px; min-height: 40px; padding: 0; }
  .lp-nav__indietro::before { content: none; }
  .lp-nav__indietro svg { display: block; }
  .lp-nav__indietro span {
    position: absolute; width: 1px; height: 1px; overflow: hidden;
    clip-path: inset(50%); white-space: nowrap;
  }
}

/* =============================================================
   NOTE LEGALI — privacy and cookie policy in a plate
   ============================================================= */
.lp-legale { position: relative; z-index: 1; padding-top: 96px; }
.lp-legale .lp-testa h1 {
  text-transform: uppercase; letter-spacing: 0.01em;
  font-size: clamp(1.6rem, 3.6vw, 2.75rem);
}
.lp-legale__data { font-size: var(--t-caption); letter-spacing: 0.14em; text-transform: uppercase; color: var(--ornato); }
.lp-legale__testo { display: grid; gap: clamp(28px, 4vw, 40px); max-width: 72ch; }
.lp-legale__testo section { display: grid; gap: var(--s-3); padding-top: var(--s-5); border-top: 1px solid var(--hud-tenue); }
.lp-legale__testo h2 {
  font-family: var(--font-display); font-variation-settings: 'wdth' 112;
  font-size: var(--t-small); font-weight: 600; letter-spacing: 0.16em; text-transform: uppercase;
  color: var(--fg);
}
.lp-legale__testo p, .lp-legale__testo li { color: var(--muted); overflow-wrap: anywhere; }
.lp-legale__testo ul { display: grid; gap: var(--s-2); }
.lp-legale__testo li { position: relative; padding-left: 22px; }
.lp-legale__testo li::before {
  content: ''; position: absolute; left: 2px; top: 0.62em;
  width: 7px; height: 9.7px; border: 1px solid var(--hud); border-radius: 50%;
}

/* =============================================================
   CONTATTO — form sent to FormSubmit (relay) or /api/contact (panel)
   ============================================================= */
/* Without the contact details column the form takes the whole row, up to a readable width. */
.lp-contatti--modulo { grid-template-columns: minmax(0, 820px); }
.lp-form .scelta a { color: var(--fg); text-decoration: underline; text-decoration-color: var(--hud); text-underline-offset: 3px; }
.lp-form .scelta a:hover { text-decoration-color: var(--accent); }
.lp-form .scelta abbr { color: var(--seta-bronzo); text-decoration: none; border: 0; }
/* Honeypot: out of sight and out of the tab order, still in the DOM for bots. */
.lp-form__trappola { position: absolute; left: -10000px; width: 1px; height: 1px; overflow: hidden; }
.lp-form__turnstile:not(:empty) { margin-bottom: var(--s-4); }
.lp-form__stato { margin-top: var(--s-3); font-size: var(--t-small); color: var(--errore); }
.lp-form__stato:empty { display: none; }
/* Paired fields keep their own height: an error under one does not push the other's input down. */
.lp-form__coppia { align-items: start; }
/* Narrow phones: smaller placeholders so the hints fit, an ellipsis if one still does not. */
.lp-form .input { text-overflow: ellipsis; }
@media (max-width: 480px) {
  .lp-form .input::placeholder, .lp-form .textarea::placeholder { font-size: var(--t-small); letter-spacing: 0.01em; }
}

/* =============================================================
   COOKIE — consent banner (only on the live site with tracking)
   ============================================================= */
.consent {
  position: fixed; z-index: 80; left: 12px; right: 12px; bottom: 12px;
  display: flex; justify-content: flex-start;
  pointer-events: none;
}
.consent[hidden], .consent [hidden] { display: none !important; }
.consent__box {
  position: relative; pointer-events: auto;
  width: min(100%, 560px); padding: var(--s-5);
  display: grid; gap: var(--s-4);
  border: 1px solid var(--hud);
  background: color-mix(in oklab, var(--surface) 92%, transparent);
  backdrop-filter: blur(14px); -webkit-backdrop-filter: blur(14px);
  box-shadow: 0 18px 48px -24px rgba(0, 0, 0, 0.8);
  max-height: calc(100svh - 24px); overflow-y: auto;
}
.consent__box::before, .consent__box::after {
  content: ''; position: absolute; width: 12px; height: 12px; border: 1px solid var(--ornato); opacity: 0.8;
}
.consent__box::before { top: -1px; left: -1px; border-right: 0; border-bottom: 0; }
.consent__box::after { bottom: -1px; right: -1px; border-left: 0; border-top: 0; }
.consent__box p { max-width: none; }
.consent__testa {
  display: flex; align-items: center; gap: var(--s-3);
  font-size: 10px; letter-spacing: 0.2em; text-transform: uppercase; color: var(--ornato);
  padding-bottom: var(--s-3); border-bottom: 1px solid var(--hud-tenue);
}
.consent__testa::after { content: ''; flex: 1; height: 7px; background-image: repeating-linear-gradient(to right, var(--hud-tenue) 0 1px, transparent 1px 6px); }
.consent__testo { font-size: var(--t-small); color: var(--muted); }
.consent__testo a { color: var(--fg); text-decoration: underline; text-decoration-color: var(--hud); text-underline-offset: 3px; }
.consent__prefs { display: grid; gap: var(--s-1); }
.consent__pref span { display: grid; gap: 2px; color: var(--muted); }
.consent__pref b { color: var(--fg); font-weight: var(--w-mid); }
.consent__azioni { display: flex; flex-wrap: wrap; gap: var(--s-2); }
@media (max-width: 480px) {
  .consent__box { padding: var(--s-4); }
  .consent__azioni .btn { flex: 1 1 100%; }
}
