/* Fleet module page. Shared section styles come from modules/inventory/inventory.css;
   this file only overrides the hero and adds the screen-list grid. */

.intro {
  width: 100%;
  position: relative;
  /* No fleet photo in the asset library yet: brand gradient with a faint road-line pattern. */
  background:
    repeating-linear-gradient(
      135deg,
      rgba(255, 255, 255, 0.04) 0 2px,
      transparent 2px 28px
    ),
    linear-gradient(120deg, #00264d 0%, #00458f 55%, #0b6fd6 100%);
  padding: 200px 0 120px 0;
}

.intro .intro-info {
  width: 55%;
  float: left;
}

.intro .intro-info h1 {
  color: white;
  font-size: 48px;
  font-weight: 700;
}

.intro .intro-info p {
  font-size: 18px;
}

.intro .intro-art {
  width: 42%;
  float: right;
  text-align: right;
}

.intro .intro-art img {
  max-width: 100%;
  height: auto;
}

/* "Everything the module records" list */
.screen-list {
  text-align: left;
}

.screen-list .screen-item {
  display: flex;
  align-items: flex-start;
  background: #fff;
  border-radius: 6px;
  padding: 16px;
  height: 100%;
}

.screen-list .screen-item .bi {
  font-size: 26px;
  color: #00366f;
  margin-right: 14px;
  line-height: 1;
}

.screen-list .screen-item h6 {
  font-weight: bold;
  margin-bottom: 4px;
}

.screen-list .screen-item p {
  margin-bottom: 0;
  font-size: 14px;
}

/* Report catalogue chips */
.report-chip {
  display: inline-block;
  background: #fff;
  border: 1px solid #cfe0f5;
  border-radius: 20px;
  padding: 6px 16px;
  margin: 4px;
  font-size: 14px;
  color: #00366f;
}

/* FAQ */
.faq-item {
  text-align: left;
  background: #fff;
  border-radius: 6px;
  padding: 16px 20px;
  margin-bottom: 12px;
}

.faq-item h6 {
  font-weight: bold;
  color: #00366f;
}

.faq-item p {
  margin-bottom: 0;
}

@media (max-width: 767px) {
  .intro .intro-info {
    width: 100%;
  }
  .intro .intro-info h1 {
    font-size: 34px;
  }
  .intro .intro-art {
    display: none;
  }
}