/**
 * Layout alignment for prerendered pages.
 * Product detail uses the same Tailwind `container` shell as /products.
 */

:root {
  --navbar-height: 4.5rem;
}

/* Product detail video band: breakout margins match container padding (px-6 / md:px-12) */
.container.mx-auto .bg-white.py-16.-mx-6,
.container.mx-auto .bg-white.py-16[class*='-mx-6'] {
  margin-left: -1.5rem !important;
  margin-right: -1.5rem !important;
  padding-left: 1.5rem !important;
  padding-right: 1.5rem !important;
}

@media (min-width: 768px) {
  .container.mx-auto .bg-white.py-16.-mx-6,
  .container.mx-auto .bg-white.py-16[class*='-mx-6'] {
    margin-left: -3rem !important;
    margin-right: -3rem !important;
    padding-left: 3rem !important;
    padding-right: 3rem !important;
  }
}

/* Legacy prerender: max-w-7xl shell on product pages → container width */
body[data-page='product-detail'] .mx-auto.max-w-7xl.px-6.py-8,
body[data-page='product-detail'] .mx-auto.w-full.max-w-7xl.px-6.py-8 {
  max-width: none;
  width: 100%;
}

/*
 * Nav bar: use the same content column as hero/sections (container 2xl = 1400px).
 * Prerender uses max-w-7xl (1280px) inside px-6/md:px-12, which shifts the logo right on wide screens.
 */
.sticky.top-0 nav > .w-full.px-6,
.sticky.top-0 nav > .w-full[class*='px-6'] {
  padding-left: 0 !important;
  padding-right: 0 !important;
}

.sticky.top-0 nav > .w-full > .mx-auto.max-w-7xl {
  box-sizing: border-box;
  width: 100%;
  max-width: 1400px;
  margin-left: auto;
  margin-right: auto;
  padding-left: 1.5rem;
  padding-right: 1.5rem;
}

@media (min-width: 768px) {
  .sticky.top-0 nav > .w-full > .mx-auto.max-w-7xl {
    padding-left: 3rem;
    padding-right: 3rem;
  }
}

.sticky.top-0 nav > .w-full > .mx-auto.max-w-7xl > a:first-child {
  margin-left: 0;
}

.sticky.top-0 nav > .w-full > .mx-auto.max-w-7xl > a:first-child img {
  display: block;
  margin-left: 0;
}

/* Top nav primary labels — Inter ExtraBold (enterprise UI face, OFL) */
.sticky.top-0 nav > .w-full > .mx-auto.max-w-7xl > .hidden.md\:flex > .relative > a {
  font-family: Inter, system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif;
  font-weight: 800;
  letter-spacing: -0.01em;
}

#if-mobile-nav nav[aria-label='Mobile'] > .py-1 > a,
#if-mobile-nav .if-mobile-products-toggle > span {
  font-family: Inter, system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif;
  font-weight: 800;
  letter-spacing: -0.01em;
}

/* Products mega-menu panel (injected by nav.js) */
.sticky.top-0 [role='navigation'][aria-label='Products'] .if-mega-panel-inner {
  max-width: 1400px;
  margin-left: auto;
  margin-right: auto;
}

/* Footer Contact column — same Inter face as Quick Links / Products links */
footer [data-cms='global.footerAddress'],
footer [data-cms='global.footerEmail'],
footer [data-cms='global.footerWebsite'] {
  font-family: Inter, Arial, Helvetica, sans-serif;
}
