/* FlySpark /about on the Olight content/4-about-us template (Elementor post 19). post-19.css carries the layout;
   this file swaps the demo background photos for FlySpark ones and styles the few FlySpark-only additions. */

/* background slots: intro (cms_image_1), collection banner (home2_bg_1), quote CTA (home1_bg_2; mirrored so
   the vehicle sits left and the copy column on the right stays on the plain wall, like the demo photo) */
/* the demo photo is dark behind its centred white copy; the FlySpark showroom photo is light, so darken it */
.fs-about .elementor-19 .elementor-element.elementor-element-1c0e059:not(.elementor-motion-effects-element-type-background) {
  background-image: linear-gradient(rgba(20, 19, 17, 0.62), rgba(20, 19, 17, 0.62)), url("/olight/fs/vt_olight_cms_image_1.jpg");
  background-position: center center;
  background-size: cover;
}
@media (max-width: 767px) {
  .fs-about .elementor-19 .elementor-element.elementor-element-1c0e059:not(.elementor-motion-effects-element-type-background) {
    background-image: linear-gradient(rgba(20, 19, 17, 0.62), rgba(20, 19, 17, 0.62)), url("/olight/fs/vt_olight_cms_image_1-m.jpg");
  }
}
/* company-record strip: the demo's grey flash pattern (upscaled 1.5x) → plain theme grey (G-20) */
.fs-about .elementor-19 .elementor-element.elementor-element-f9c0a68:not(.elementor-motion-effects-element-type-background) {
  background-image: none;
  background-color: #f5f5f5;
}
.fs-about .elementor-19 .elementor-element.elementor-element-9bba122:not(.elementor-motion-effects-element-type-background) {
  background-image: url("/olight/fs/vt_olight_home2_bg_1.jpg");
  background-position: center center;
  background-size: cover;
}
.fs-about .elementor-19 .elementor-element.elementor-element-79aac2f:not(.elementor-motion-effects-element-type-background) > .elementor-column-wrap {
  background-image: url("/olight/fs/fs-about-cta.jpg");
  background-position: center center;
  background-size: cover;
}

/* small uppercase line above section headings */
.fs-about .fs-about-kicker p,
.fs-about .fs-about-eyebrow p {
  font-size: 12px;
  font-weight: 600;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  margin-bottom: 12px;
}
.fs-about .fs-about-eyebrow--center p {
  text-align: center;
}
.fs-about .fs-about-kicker p {
  text-align: center;
  color: #fff;
}
.fs-about .elementor-element-d6f44ba > .elementor-column-wrap > .elementor-widget-wrap {
  justify-content: center;
}
.fs-about .elementor-element-d6f44ba .fs-about-btn--light .elementor-button {
  color: #fff;
}
.fs-about .elementor-element-d6f44ba .fs-about-btn--light .elementor-button:hover {
  background: #fff;
  color: #22201d;
  box-shadow: inset 0 0 0 1px #fff;
}

/* the demo story is one paragraph; ours has two */
.fs-about .elementor-element-dc4d7ac p + p {
  margin-top: 14px;
}
/* two buttons side by side where the demo has one (Elementor width:auto buttons) */
.fs-about .elementor-widget-button.elementor-widget__width-auto {
  width: auto;
  margin: 0 20px 15px 0;
}
.fs-about .elementor-element-d9a5209 .elementor-widget-button.elementor-widget__width-auto {
  margin-top: 20px;
}
.fs-about .elementor-element-d6f44ba .elementor-widget-button.elementor-widget__width-auto {
  margin: 0 10px 15px;
}
.fs-about .fs-about-btn--light .elementor-button {
  background: transparent;
  color: inherit;
  box-shadow: inset 0 0 0 1px currentColor;
}
.fs-about .fs-about-btn--light .elementor-button:hover {
  background: #22201d;
  color: #fff;
  box-shadow: inset 0 0 0 1px #22201d;
}

/* company counters (Elementor counter widgets) in place of the "finishing touch" paragraph */
.fs-about .elementor-element-d21da1c .elementor-column-wrap {
  padding: 0 15px;
}
.fs-about .elementor-counter .elementor-counter-number-wrapper {
  justify-content: center;
  font-size: 40px;
  line-height: 1.1;
  font-weight: 500;
  color: #22201d;
}
.fs-about .elementor-counter .elementor-counter-number-prefix,
.fs-about .elementor-counter .elementor-counter-number-suffix {
  display: none;
}
.fs-about .elementor-counter .elementor-counter-title {
  margin-top: 8px;
  font-size: 14px;
  line-height: 1.4;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  color: var(--text-color);
}

/* six capability tiles (demo has four): wrap into rows of three, same 30px gutter as the demo */
.fs-about .fs-about-tiles > .elementor-container > .elementor-row {
  flex-wrap: wrap;
  row-gap: 40px;
}
.fs-about .fs-about-tiles > .elementor-container > .elementor-row > .category__item {
  width: calc((100% - 60px) / 3);
  margin-bottom: 0;
}
/* the demo photos are dark at the bottom behind the white label; product shots on white need a scrim */
.fs-about .fs-about-tiles .category__image .elementor-image {
  position: relative;
}
.fs-about .fs-about-tiles .category__image .elementor-image::after {
  content: "";
  position: absolute;
  inset: auto 0 0 0;
  height: 26%;
  border-radius: 0 0 18px 18px;
  background: linear-gradient(to top, rgba(20, 19, 17, 0.62), rgba(20, 19, 17, 0));
  pointer-events: none;
}
.fs-about .fs-about-tiles .category__title {
  width: 100%;
}
.fs-about .fs-about-tiles .category__title a {
  color: inherit;
}
.fs-about .fs-about-tiles .category__image img {
  width: 100%;
  height: auto;
  aspect-ratio: 480 / 580;
  object-fit: cover;
  background: #f4f3f1;
}
.fs-about .fs-about-tiles .category__des p {
  min-height: 0;
}
/* copy lengths differ: stretch each tile's text block so the "See More Products" links share a baseline per row */
.fs-about .fs-about-tiles .category__item > .elementor-column-wrap,
.fs-about .fs-about-tiles .category__item > .elementor-column-wrap > .elementor-widget-wrap,
.fs-about .fs-about-tiles .category__item .elementor-inner-section:last-child,
.fs-about .fs-about-tiles .category__item .elementor-inner-section:last-child > .elementor-container,
.fs-about .fs-about-tiles .category__item .elementor-inner-section:last-child .elementor-row,
.fs-about .fs-about-tiles .category__item .elementor-inner-section:last-child .elementor-column,
.fs-about .fs-about-tiles .category__item .elementor-inner-section:last-child .elementor-column-wrap,
.fs-about .fs-about-tiles .category__item .elementor-inner-section:last-child .elementor-widget-wrap {
  display: flex;
  flex-direction: column;
  flex: 1 1 auto;
  width: 100%;
}
.fs-about .fs-about-tiles .category__item .btn__link {
  margin-top: auto;
}

@media (max-width: 1024px) {
  .fs-about .elementor-element-d21da1c .elementor-column.elementor-col-25 {
    width: 50%;
    margin-bottom: 30px;
  }
  .fs-about .fs-about-tiles > .elementor-container > .elementor-row > .category__item {
    width: calc((100% - 30px) / 2);
  }
}
@media (max-width: 767px) {
  .fs-about .elementor-counter .elementor-counter-number-wrapper {
    font-size: 30px;
  }
  .fs-about .fs-about-tiles > .elementor-container > .elementor-row > .elementor-column {
    width: 100%;
  }
}
