/* ═══════════════════════════════════════════════════════════════
   SELKERMO TRANSITIONS v2.0 — Fluide (B + D discreta)
   Linea soft + accento centrale piccolo, zero animazioni
   ═══════════════════════════════════════════════════════════════ */

/* ═══ UNIFICA SFONDI — rimuovi "blocchi" navy ═══ */
.ai-section {
  background: transparent !important;
  border-top: none !important;
  border-bottom: none !important;
}

.about-wrap {
  background: transparent !important;
  border-top: none !important;
  border-bottom: none !important;
}

/* ═══ SEZIONI — tutti trasparenti, nessuna barriera ═══ */
.section,
.ai-section,
.about-wrap {
  position: relative !important;
  background: transparent !important;
}

/* ═══ LINEA BASE (opzione D) — gradient soft 65% ═══ */
.section::before,
.ai-section::before,
.about-wrap::before {
  content: '' !important;
  position: absolute !important;
  bottom: 0 !important;
  left: 50% !important;
  transform: translateX(-50%) !important;
  width: 65% !important;
  height: 1px !important;
  background: linear-gradient(90deg,
    transparent 0%,
    rgba(38, 128, 233, 0.15) 20%,
    rgba(79, 227, 255, 0.4) 50%,
    rgba(38, 128, 233, 0.15) 80%,
    transparent 100%) !important;
  pointer-events: none !important;
  z-index: 2 !important;
}

/* ═══ ACCENTO CENTRALE (opzione B) — piccolo, soft glow ═══ */
.section::after,
.ai-section::after,
.about-wrap::after {
  content: '' !important;
  position: absolute !important;
  bottom: 0 !important;
  left: 50% !important;
  transform: translateX(-50%) !important;
  width: 60px !important;
  height: 1px !important;
  background: linear-gradient(90deg,
    transparent 0%,
    rgba(127, 238, 255, 0.9) 50%,
    transparent 100%) !important;
  box-shadow:
    0 0 6px rgba(127, 238, 255, 0.5),
    0 0 14px rgba(79, 227, 255, 0.25) !important;
  pointer-events: none !important;
  z-index: 3 !important;
}

/* ═══ Z-INDEX contenuto sopra le linee ═══ */
.section > .container,
.ai-section > .container,
.about-wrap > .container {
  position: relative !important;
  z-index: 5 !important;
}

/* ═══ MOBILE — ridotto ma coerente ═══ */
@media (max-width: 640px) {
  .section::before,
  .ai-section::before,
  .about-wrap::before {
    width: 80% !important;
  }
  .section::after,
  .ai-section::after,
  .about-wrap::after {
    width: 50px !important;
  }
}

/* ═══ REDUCED MOTION — già statiche, nessun problema ═══ */