/* ============ Liti360 — shared theme styles ============ */

/* Scroll-reveal */
.reveal { opacity: 0; transform: translateY(26px); transition: opacity .7s ease, transform .7s ease; }
.reveal.is-visible { opacity: 1; transform: translateY(0); }
.reveal-d1 { transition-delay: .1s; }
.reveal-d2 { transition-delay: .2s; }
.reveal-d3 { transition-delay: .3s; }

/* Slow drift for hero images */
@keyframes drift { 0% { transform: scale(1.04); } 100% { transform: scale(1.15); } }
.hero-drift { animation: drift 22s ease-in-out infinite alternate; }

/* Desktop dropdown */
.nav-item > .nav-panel {
  opacity: 0; visibility: hidden; transform: translateY(8px);
  transition: opacity .2s ease, transform .2s ease, visibility .2s;
}
.nav-item:hover > .nav-panel,
.nav-item:focus-within > .nav-panel {
  opacity: 1; visibility: visible; transform: translateY(0);
}

/* Route stepper "connected diagram" */
.route-flow { display: flex; flex-wrap: wrap; align-items: stretch; gap: .5rem; }
.route-step {
  display: flex; align-items: center; gap: .5rem;
  background: #fff; border: 1px solid rgba(63,107,82,.15);
  border-radius: 1rem; padding: .6rem .9rem; font-weight: 600; color: #2d4f3c;
}
.route-step .dot { display:grid; place-items:center; height:1.6rem; width:1.6rem; border-radius:9999px; background:#3f6b52; color:#f8f3ea; font-size:.7rem; }
.route-step.is-hub { background:#e2883b; color:#fff; border-color:#e2883b; }
.route-step.is-hub .dot { background:#fff; color:#e2883b; }
.route-arrow { display:grid; place-items:center; color:#e2883b; }

/* FAQ accordion chevron */
details > summary svg { transition: transform .25s ease; }
details[open] > summary svg { transform: rotate(180deg); }
details > summary::-webkit-details-marker { display: none; }

::selection { background: #e2883b; color: #fff; }
html { scroll-behavior: smooth; }
body { scrollbar-color: #5a8a6e #eaf3ee; }