/* Small additions on top of tailwind.css (compiled, don't edit) and theme-daybreak.css.
   Styles for the bits site.js drives: desktop Services menu, popups, cookie banner, ROI sliders. */

/* Desktop "Services" dropdown — opens on hover or keyboard focus */
.nav-dropdown {
  opacity: 0;
  visibility: hidden;
  transform: translateY(10px);
  transition: opacity .2s, transform .2s, visibility .2s;
  z-index: 60;
}
.group:hover > .nav-dropdown,
.group:focus-within > .nav-dropdown {
  opacity: 1;
  visibility: visible;
  transform: none;
}

[hidden] { display: none !important; }

/* Popup (video review, booking calendar) */
.site-modal {
  position: fixed; inset: 0; z-index: 100;
  display: flex; align-items: center; justify-content: center;
  padding: 1rem; background: rgba(0, 0, 0, .8);
}
.site-modal-panel {
  position: relative; width: 100%; max-height: 90vh; overflow-y: auto;
  background: hsl(var(--background, 0 0% 100%)); border-radius: .75rem;
  box-shadow: 0 25px 50px -12px rgba(0, 0, 0, .25);
}
.site-modal-close {
  position: absolute; top: .75rem; right: .75rem; z-index: 1;
  padding: .25rem; border-radius: .375rem; opacity: .7; color: inherit;
}
.site-modal-close:hover { opacity: 1; }

/* Cookie banner slides up */
.cookie-banner { animation: cookie-in .35s ease-out; }
@keyframes cookie-in { from { transform: translateY(100px); opacity: 0; } to { transform: none; opacity: 1; } }

/* ROI calculator sliders */
.roi-range { accent-color: hsl(var(--primary)); height: 1.25rem; cursor: pointer; }

/* Portfolio carousel */
[data-carousel-track] { transition: transform .45s ease; will-change: transform; }

/* Mobile menu: theme-daybreak.css fixes `nav > div > div` at 60px for the header row,
   which also clipped the open mobile menu to 60px on the old site. */
nav[aria-label="Main navigation"] #mobile-menu > div { height: auto; }
nav[aria-label="Main navigation"]:has(#mobile-menu:not([hidden])) { border-radius: 24px; }