/* ELAZAB AI Solutions: shared site layer (navigation, motion, accessibility) */

html { -webkit-text-size-adjust: 100%; }
body { overflow-x: hidden; }
img { max-width: 100%; }
[id] { scroll-margin-top: 92px; }
[hidden] { display: none !important; }

/* Smooth cross-page fades in supporting browsers */
@view-transition { navigation: auto; }
::view-transition-old(root) { animation: 180ms ease both vt-out; }
::view-transition-new(root) { animation: 260ms ease both vt-in; }
@keyframes vt-out { to { opacity: 0; } }
@keyframes vt-in { from { opacity: 0; } }

/* Skip link */
.skip-link {
  position: absolute; left: 16px; top: -60px; z-index: 100;
  background: #69B9F3; color: #041430; font-weight: 700; font-size: 15px;
  padding: 12px 16px; border-radius: 2px; text-decoration: none;
  transition: top .2s ease;
}
.skip-link:focus { top: 12px; }

/* Sticky header */
.site-header {
  position: sticky; top: 0; z-index: 50;
  background: rgba(4, 20, 48, 0.92);
  -webkit-backdrop-filter: saturate(1.4) blur(10px);
  backdrop-filter: saturate(1.4) blur(10px);
  transition: box-shadow .25s ease, background-color .25s ease;
}
.site-header.is-scrolled {
  background: rgba(4, 20, 48, 0.97);
  box-shadow: 0 1px 0 rgba(255,255,255,0.06), 0 8px 24px rgba(2, 10, 26, 0.35);
}
#mobile-menu { animation: menu-in .22s ease both; max-height: calc(100vh - 76px); overflow-y: auto; }
@keyframes menu-in { from { opacity: 0; transform: translateY(-6px); } to { opacity: 1; transform: none; } }

/* Nav link underline on hover */
.navlink { position: relative; }
.nav-links .navlink::after {
  content: ""; position: absolute; left: 0; right: 0; bottom: -6px; height: 2px;
  background: #69B9F3; transform: scaleX(0); transform-origin: left;
  transition: transform .25s ease;
}
.nav-links .navlink:hover::after { transform: scaleX(1); }
.nav-links .navlink[aria-current="page"]::after { display: none; }

/* Buttons: gentle lift */
.btn { transition: background-color .18s ease, color .18s ease, border-color .18s ease, transform .18s ease, box-shadow .18s ease; }
.btn:hover { transform: translateY(-1px); }
.btn:active { transform: translateY(0); }
.btn svg { transition: transform .2s ease; }
.btn:hover svg { transform: translateX(3px); }

/* Scroll reveal (only when JS is running) */
.js .reveal { opacity: 0; transform: translateY(18px); transition: opacity .7s cubic-bezier(.2,.7,.2,1), transform .7s cubic-bezier(.2,.7,.2,1); transition-delay: var(--d, 0s); }
.js .reveal.is-in { opacity: 1; transform: none; }

/* FAQ */
.faq-btn[aria-expanded="true"] .chev { transform: rotate(45deg); }
.faq-panel:not([hidden]) { animation: faq-in .28s ease both; }
@keyframes faq-in { from { opacity: 0; transform: translateY(-4px); } to { opacity: 1; transform: none; } }

/* Calculator number change */
[data-out].bump { animation: bump .35s ease; }
@keyframes bump { 0% { opacity: .55; } 100% { opacity: 1; } }

/* Cal.com embed */
.cal-wrap { display: flex; flex-direction: column; gap: 12px; }
.cal-inline { width: 100%; min-height: 0; overflow: auto; }
.cal-wrap.has-cal .cal-inline { min-height: 640px; }
.cal-wrap.has-cal .cal-loading { display: none !important; }

/* Founder photo: subtle settle */
figure img { transition: transform .8s cubic-bezier(.2,.7,.2,1); }


@media (prefers-reduced-motion: reduce) {
  @view-transition { navigation: none; }
  .js .reveal { opacity: 1; transform: none; transition: none; }
  .btn:hover, .btn:hover svg { transform: none; }
  #mobile-menu, .faq-panel:not([hidden]), [data-out].bump { animation: none; }
}