/* Shared Gutenberg, product-tab, and form behaviour for XS designed pages. */
.xs-page {
  width: 100%;
  max-width: none;
  margin: 0;
  overflow: clip;
}

.xs-page > .xs-section-block,
.xs-page > .wp-block-group.xs-section-block {
  width: 100%;
  max-width: none;
  margin: 0;
  padding: 0;
}

.xs-page .xs-products.wp-block-xs-lighting-rental-products {
  max-width: none;
  margin: 0;
  scroll-margin-top: 7rem;
}

.xs-page .xs-hero__breadcrumb ol {
  display: flex;
  flex-wrap: wrap;
  gap: .4rem;
  align-items: center;
  margin: 0;
  padding: 0;
  list-style: none;
}

.xs-page .xs-hero__breadcrumb li {
  display: inline-flex;
  gap: .4rem;
  align-items: center;
  margin: 0;
}

.xs-page .xs-hero__breadcrumb li > span {
  margin: 0;
}

.xs-page--gobos .xs-directory {
  padding: clamp(4rem, 8vw, 7rem) clamp(1.25rem, 4vw, 3rem);
}

.xs-page--gobos .xs-legacy-content {
  max-width: 780px;
  margin: 0 auto;
}

.xs-legacy-content :where(h2, h3) {
  font-family: var(--xs-font-heading, Georgia, serif);
  color: var(--xs-black, #111);
}

.xs-legacy-content :where(p, li) {
  color: var(--xs-gray-600, #5c5955);
  line-height: 1.75;
}

.xs-tab-panel {
  width: 100%;
}

.xs-has-js .xs-tab-panel[hidden] {
  display: none;
}

.xs-products__grid--buy {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.xs-buy-card {
  min-height: 190px;
  display: flex;
  align-items: flex-end;
  text-decoration: none;
}

.xs-buy-card .xs-product__info {
  width: 100%;
  padding: 2rem;
}

.xs-buy-card p {
  margin: .75rem 0 1rem;
  color: var(--xs-gray-600, #5c5955);
}

.xs-buy-card span,
.xs-product__availability {
  display: inline-block;
  margin-top: .5rem;
  color: var(--xs-red, var(--xs-green, var(--xs-blue, #c0272d)));
  font-size: .82rem;
  font-weight: 700;
}

.xs-products__empty {
  grid-column: 1 / -1;
  padding: 2rem;
  border: 1px solid var(--xs-gray-100, #eae8e4);
  border-radius: var(--xs-radius-lg, 18px);
  background: var(--xs-offwhite, #f4f3f1);
}

.xs-products__empty h3 {
  margin: 0 0 .5rem;
  font-family: var(--xs-font-heading, Georgia, serif);
}

.xs-products__empty p {
  margin: 0 0 1rem;
}

.xs-page .xs-supply-products.wp-block-xs-lighting-supply-products {
  width: 100%;
  max-width: none;
  margin: 0;
}

.xs-supply-products__header {
  max-width: 680px;
  margin: 0 auto 2rem;
}

.xs-supply-products__header h2,
.xs-supply-products__empty :is(h2, h3) {
  margin: 0 0 .65rem;
  color: var(--xs-black, #111);
  font-family: var(--xs-font-heading, Georgia, serif);
  line-height: 1.2;
}

.xs-supply-products__header h2 {
  font-size: clamp(1.5rem, 2.5vw, 2rem);
}

.xs-supply-products__empty h2 {
  font-size: clamp(1.5rem, 2.5vw, 2rem);
}

.xs-supply-products__header p,
.xs-supply-products__empty p {
  margin: 0;
  color: var(--xs-gray-600, #5c5955);
  line-height: 1.65;
}

.xs-supply-products__grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 1.25rem;
  text-align: left;
}

.xs-supply-product {
  display: flex;
  min-width: 0;
  flex-direction: column;
  overflow: hidden;
  border: 1px solid var(--xs-gray-100, #eae8e4);
  border-radius: var(--xs-radius, 10px);
  background: var(--xs-white, #fafafa);
  color: var(--xs-gray-800, #2d2b28);
  text-decoration: none;
  transition: box-shadow .25s ease, transform .25s ease;
}

.xs-supply-product:hover {
  box-shadow: 0 14px 34px rgba(0, 0, 0, .08);
  transform: translateY(-2px);
}

.xs-supply-product__image {
  display: block;
  overflow: hidden;
  aspect-ratio: 4 / 3;
  background: var(--xs-offwhite, #f4f3f1);
}

.xs-supply-product__image img {
  width: 100%;
  height: 100%;
  object-fit: contain;
}

.xs-supply-product__body {
  display: flex;
  flex: 1;
  align-items: flex-start;
  flex-direction: column;
  padding: 1.15rem;
}

.xs-supply-product__body strong {
  font-family: var(--xs-font-heading, Georgia, serif);
  font-size: 1.05rem;
}

.xs-supply-product__price {
  margin-top: .6rem;
  color: var(--xs-gray-600, #5c5955);
  font-size: .9rem;
}

.xs-supply-product__link {
  margin-top: auto;
  padding-top: 1rem;
  color: var(--xs-accent, #1a7a4c);
  font-size: .8rem;
  font-weight: 700;
}

.xs-supply-products__empty {
  max-width: 680px;
  margin: 0 auto;
}

.xs-supply-products__empty .xs-btn {
  margin-top: 1.25rem;
}

.xs-contact-form-block {
  scroll-margin-top: 7rem;
}

/* Keep our forms light regardless of Astra's dark-mode and autofill colors. */
.xs-page .xs-contact-form-block .xs-form :is(input:not([type="hidden"]), select, textarea) {
  background: #fff !important;
  color: var(--xs-gray-800, #2d2b28) !important;
  -webkit-text-fill-color: var(--xs-gray-800, #2d2b28) !important;
  caret-color: var(--xs-gray-800, #2d2b28);
  color-scheme: light;
  box-shadow: none !important;
}
.xs-page .xs-contact-form-block .xs-form :is(input:not([type="hidden"]), select, textarea):is(:focus, .is-filled, :autofill, :-webkit-autofill) {
  background: #e8f0fe !important;
}
.xs-page .xs-contact-form-block .xs-form :is(input, select, textarea):is(:autofill, :-webkit-autofill) {
  box-shadow: inset 0 0 0 1000px #e8f0fe !important;
}
.xs-page .xs-contact-form-block .xs-form option {
  background: #fff !important;
  color: var(--xs-gray-800, #2d2b28) !important;
  -webkit-text-fill-color: var(--xs-gray-800, #2d2b28) !important;
}

/* Scope the compact form independently of the Contact page's form styles. */
.xs-inquiry {
  --xs-inquiry-accent: var(--xs-red, #c0272d);
  padding: var(--xs-section-pad, 4rem 1.25rem);
  background: var(--xs-offwhite, #f4f3f1);
  border-top: 1px solid var(--xs-gray-100, #eae8e4);
  font-family: var(--xs-font-body, sans-serif);
}
.xs-page--sound .xs-inquiry { --xs-inquiry-accent: var(--xs-green, #1a7a4c); }
.xs-page--video .xs-inquiry { --xs-inquiry-accent: var(--xs-blue, #1c6ea4); }
.xs-inquiry__inner { max-width: 780px; margin: 0 auto; }
.xs-inquiry h2 {
  margin: 0 0 1.75rem;
  font-family: var(--xs-font-heading, Georgia, serif);
  font-size: clamp(1.25rem, 2vw, 1.6rem);
  line-height: 1.5;
  color: var(--xs-black, #111);
}
.xs-contact-form-block--inquiry .xs-form { display: flex; flex-direction: column; gap: 1.25rem; }
.xs-contact-form-block--inquiry .xs-form__row { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1rem; }
.xs-contact-form-block--inquiry .xs-form label { display: block; margin-bottom: .4rem; font-size: .85rem; font-weight: 600; color: var(--xs-gray-800, #2d2b28); }
.xs-contact-form-block--inquiry .xs-form input:not([type="hidden"]) {
  box-sizing: border-box;
  width: 100%;
  padding: .8rem 1rem;
  border: 1px solid var(--xs-gray-200, #d4d1cb);
  border-radius: 8px;
  font: inherit;
}
.xs-contact-form-block--inquiry .xs-form input:focus-visible { outline: 2px solid var(--xs-inquiry-accent); outline-offset: 2px; }
.xs-inquiry__submit { background: var(--xs-inquiry-accent); color: #fff; }
.xs-inquiry__submit:hover { filter: brightness(.9); color: #fff; }
@media (max-width: 640px) {
  .xs-contact-form-block--inquiry .xs-form__row { grid-template-columns: 1fr; }
}

.xs-honeypot {
  position: absolute !important;
  left: -10000px !important;
  width: 1px !important;
  height: 1px !important;
  overflow: hidden !important;
}

.xs-form-notice {
  margin-bottom: 1.25rem;
  padding: 1rem 1.1rem;
  border: 1px solid;
  border-radius: var(--xs-radius, 10px);
  font-weight: 600;
}

.xs-form-notice--success {
  color: #14532d;
  border-color: #86efac;
  background: #f0fdf4;
}

.xs-form-notice--error {
  color: #7f1d1d;
  border-color: #fca5a5;
  background: #fef2f2;
}

.xs-page :where(a, button, input, select, textarea):focus-visible {
  outline: 3px solid currentColor;
  outline-offset: 3px;
}

@media (max-width: 640px) {
  .xs-products__grid--buy {
    grid-template-columns: 1fr;
  }

  .xs-supply-products__grid {
    grid-template-columns: 1fr;
  }
}

@media (min-width: 641px) and (max-width: 960px) {
  .xs-supply-products__grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (prefers-reduced-motion: reduce) {
  .xs-page *,
  .xs-page *::before,
  .xs-page *::after {
    scroll-behavior: auto !important;
    animation-duration: .01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: .01ms !important;
  }

  .xs-page .xs-reveal {
    opacity: 1;
    transform: none;
  }
}
.xs-supply-links{padding:clamp(3rem,6vw,5rem) clamp(1.25rem,4vw,3rem);border-top:1px solid var(--xs-gray-100);background:var(--xs-offwhite)}
.xs-supply-links__inner{max-width:var(--xs-max-width,1200px);margin:0 auto}
.xs-supply-links__grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:.8rem;margin-top:2rem}
.xs-supply-links__grid a{display:flex;align-items:center;justify-content:space-between;gap:1rem;padding:1rem 1.15rem;border:1px solid var(--xs-gray-100);border-radius:var(--xs-radius,10px);background:var(--xs-white);color:var(--xs-gray-800);font-size:.9rem;font-weight:600;text-decoration:none;transition:border-color .2s,transform .2s}
.xs-supply-links__grid a:hover{border-color:var(--xs-accent,var(--xs-green));transform:translateY(-1px)}
.xs-supply-links__grid a:focus-visible{outline:3px solid currentColor;outline-offset:3px}
.xs-supply-links__grid span{color:var(--xs-accent,var(--xs-green))}
.xs-resource-links{padding:var(--xs-section-pad,clamp(4rem,8vw,7rem) clamp(1.25rem,4vw,3rem));background:var(--xs-offwhite)}
.xs-resource-links .xs-directory__inner{max-width:var(--xs-max-width,1200px);margin:0 auto}
.xs-resource-links .xs-dir-grid--2{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1rem;margin-top:2rem}
.xs-resource-links .xs-dir-link{display:flex;gap:1rem;align-items:center;padding:1.25rem 1.5rem;border:1px solid var(--xs-gray-100);border-radius:var(--xs-radius,10px);background:var(--xs-white);color:inherit;text-decoration:none;transition:border-color .2s,transform .2s}
.xs-resource-links .xs-dir-link:hover{border-color:var(--xs-accent,var(--xs-green));transform:translateY(-1px)}
.xs-resource-links .xs-dir-link:focus-visible{outline:3px solid currentColor;outline-offset:3px}
.xs-resource-links .xs-dir-link__dot{flex:0 0 8px;width:8px;height:8px;border-radius:50%;background:var(--xs-accent,var(--xs-green))}
.xs-resource-links .xs-dir-link strong,.xs-resource-links .xs-dir-link small{display:block}.xs-resource-links .xs-dir-link strong{color:var(--xs-black);font-size:.9rem}.xs-resource-links .xs-dir-link small{margin-top:.2rem;color:var(--xs-gray-400);font-size:.78rem}.xs-resource-links .xs-dir-link__arrow{margin-left:auto;color:var(--xs-accent,var(--xs-green));font-size:.78rem;font-weight:600;white-space:nowrap}
@media(max-width:800px){.xs-supply-links__grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:640px){.xs-resource-links .xs-dir-grid--2{grid-template-columns:1fr}}
@media(max-width:520px){.xs-supply-links__grid{grid-template-columns:1fr}}
@media(prefers-reduced-motion:reduce){.xs-supply-links__grid a,.xs-resource-links .xs-dir-link{transition:none}}