/* ============================================
   SEO + UX styles aggiuntivi (skip link, fab, status badge, scroll-to-top)
   Caricato in tutte le pagine via <link rel="stylesheet" href="seo.css">
   ============================================ */

/* SKIP LINK — visibile solo su focus tastiera */
.skip-link{
  position:fixed; top:-100px; left:50%; transform:translateX(-50%);
  background:#1d1d1f; color:#fff; padding:10px 18px; border-radius:8px;
  font-size:14px; font-weight:500; letter-spacing:-.016em;
  z-index:9999; transition:top .18s ease;
  text-decoration:none;
}
.skip-link:focus{ top:12px; outline:2px solid #0071e3; outline-offset:2px }

/* FOCUS STATES — accessibili senza essere brutti */
:focus-visible{ outline:2px solid #0071e3; outline-offset:2px; border-radius:6px }
.btn:focus-visible, .btn-link:focus-visible, .filt:focus-visible{ outline-offset:3px }

/* LIVE STATUS BADGE — footer */
.live-status{
  display:inline-flex; align-items:center; gap:6px;
  font-variant-numeric:tabular-nums; font-weight:500;
}
.live-status i{
  width:8px; height:8px; border-radius:50%; display:inline-block;
}
.live-status.is-open{ color:#1d6b2e }
.live-status.is-open i{ background:#34c759; box-shadow:0 0 0 3px rgba(52,199,89,.18); animation:pulse 2s ease-in-out infinite }
.live-status.is-closed{ color:#6e6e73 }
.live-status.is-closed i{ background:#a1a1a6 }
@keyframes pulse{ 0%,100%{box-shadow:0 0 0 0 rgba(52,199,89,.5)} 50%{box-shadow:0 0 0 6px rgba(52,199,89,0)} }

/* Status badge inline (puoi metterlo nell'hero con classe .live-status-inline) */
.live-status-inline{
  display:inline-flex; align-items:center; gap:8px;
  padding:6px 14px; border-radius:980px;
  background:rgba(52,199,89,.1); color:#1d6b2e;
  font-size:13px; font-weight:500; letter-spacing:-.01em;
}
.live-status-inline.is-closed{ background:rgba(110,110,115,.1); color:#6e6e73 }
.live-status-inline i{ width:7px; height:7px; border-radius:50%; background:currentColor }
.live-status-inline.is-open i{ background:#34c759; animation:pulse 2s ease-in-out infinite }

/* SCROLL TO TOP */
#scroll-top{
  position:fixed; right:20px; bottom:90px; z-index:70;
  width:44px; height:44px; border-radius:50%;
  background:rgba(255,255,255,.92); color:#1d1d1f;
  box-shadow:0 4px 16px rgba(0,0,0,.12), 0 0 0 .5px rgba(0,0,0,.08);
  font-size:18px; font-weight:500;
  backdrop-filter:saturate(180%) blur(20px);
  display:flex; align-items:center; justify-content:center;
  cursor:pointer; opacity:0; transform:translateY(8px);
  transition:opacity .25s ease, transform .25s ease, background .15s;
  pointer-events:none;
}
#scroll-top.show{ opacity:1; transform:none; pointer-events:auto }
#scroll-top:hover{ background:#fff }
@media(max-width:734px){ #scroll-top{ bottom:90px; right:14px } }
@media(min-width:735px){ #scroll-top{ bottom:24px; right:24px } }

/* WHATSAPP FAB — solo desktop (su mobile c'è già nella sticky bar) */
#wa-fab{
  position:fixed; right:24px; bottom:80px; z-index:70;
  width:56px; height:56px; border-radius:50%;
  background:#25d366; color:#fff;
  box-shadow:0 6px 20px rgba(37,211,102,.35), 0 0 0 .5px rgba(0,0,0,.04);
  display:none; align-items:center; justify-content:center;
  text-decoration:none; transition:transform .18s ease, box-shadow .18s ease;
}
#wa-fab:hover{ transform:scale(1.06); box-shadow:0 10px 28px rgba(37,211,102,.45) }
#wa-fab:active{ transform:scale(.97) }
@media(min-width:735px){ #wa-fab{ display:flex } }
@media(min-width:735px){ #scroll-top{ bottom:90px } }

/* On larger screens scroll-top sopra al WA */
@media(min-width:735px){
  #scroll-top{ bottom:90px }
  #wa-fab{ bottom:24px }
}

/* CONTACT FORM */
.cform{ display:grid; gap:14px; max-width:560px; margin:0 auto }
.cform .row2{ display:grid; gap:14px; grid-template-columns:1fr }
@media(min-width:735px){ .cform .row2{ grid-template-columns:1fr 1fr } }
.cform label{ display:block; font-size:13px; font-weight:500; color:#1d1d1f; margin-bottom:6px; letter-spacing:-.01em }
.cform input, .cform select, .cform textarea{
  width:100%; padding:12px 14px;
  background:#fff; border:.5px solid #d2d2d7; border-radius:12px;
  font-size:16px; letter-spacing:-.022em; color:#1d1d1f;
  font-family:inherit; transition:border-color .15s, box-shadow .15s;
}
.cform input:focus, .cform select:focus, .cform textarea:focus{
  outline:none; border-color:#0071e3; box-shadow:0 0 0 3px rgba(0,113,227,.18);
}
.cform textarea{ resize:vertical; min-height:100px }
.cform .check{
  display:flex; align-items:flex-start; gap:10px; font-size:13px; color:#6e6e73; line-height:1.4;
}
.cform .check input{ width:auto; margin-top:3px }
.cform .check a{ color:#0071e3 }
.cform .submit-row{ display:flex; align-items:center; gap:14px; flex-wrap:wrap; margin-top:8px }
.cform .hp{ position:absolute; left:-9999px; opacity:0; pointer-events:none }
.cform-msg{ padding:14px 16px; border-radius:12px; font-size:14px; display:none }
.cform-msg.success{ background:#dff5e3; color:#1d6b2e; display:block }
.cform-msg.error{ background:#ffe5e0; color:#c1330d; display:block }
.cform .err{ color:#c1330d; font-size:12px; margin-top:4px; display:none }
.cform .err.show{ display:block }
.cform input.invalid, .cform select.invalid, .cform textarea.invalid{ border-color:#c1330d; box-shadow:0 0 0 3px rgba(193,51,13,.12) }

/* TRUST CHIPS hero */
.trust-chips{ display:flex; justify-content:center; gap:8px; flex-wrap:wrap; margin-top:14px }
.trust-chip{
  display:inline-flex; align-items:center; gap:6px;
  padding:6px 12px; border-radius:980px;
  background:rgba(255,255,255,.6); border:.5px solid rgba(0,0,0,.06);
  font-size:13px; color:#424245; font-weight:500; letter-spacing:-.01em;
  backdrop-filter:saturate(180%) blur(10px);
}
.trust-chip svg{ width:14px; height:14px; color:#34c759 }

/* DETAILS senza marker default fix */
details summary { cursor:pointer }
details summary:focus-visible { outline:2px solid #0071e3; outline-offset:4px; border-radius:4px }

/* PRINT */
@media print{
  #wa-fab, #scroll-top, #stk, .tnav, footer, .skip-link, .mbg{ display:none !important }
  body{ padding:0 !important }
  a{ color:#000; text-decoration:underline }
  a[href^="http"]:after{ content:" (" attr(href) ")"; font-size:.8em }
}

/* REDUCED MOTION */
@media (prefers-reduced-motion: reduce){
  *, *::before, *::after{ animation-duration:.01ms !important; animation-iteration-count:1 !important; transition-duration:.01ms !important; scroll-behavior:auto !important }
  .reveal{ opacity:1 !important; transform:none !important }
}
