#heroAbout {
  max-height: 65vh;
  height: 65vh;
  min-height: 320px; /* optional: ensures it's not too small on mobile */
  overflow: hidden;
}
#BlueBar_about {
    padding: 1.5rem;
}

.mosaic--about {
  display: grid;
  grid-template-columns: 1fr 1fr 1fr 1fr 1fr;
  grid-template-rows: 1fr 1fr 1fr 1fr 1fr 1fr 1fr;
  gap: 1.2rem;
  width: 95%;
  margin: 3rem auto;
  padding: 0 1rem;
  max-height: 150vh;
}


.mosaic--about .t1 {
  grid-column: 1 / span 5;
  grid-row: 1 / span 2;
  background: #fff;
  border-radius: 1rem;
  box-shadow: 0 4px 16px rgba(0,0,0,0.06);
  padding: 2rem;
  display: flex;
  align-items: center;
}
/*george*/
.mosaic--about .t2 {
  grid-column: 4 / span 1;
  grid-row: 6 / span 2;
  background: #fff;
  border-radius: 1rem;
  box-shadow: 0 4px 16px rgba(0,0,0,0.06);
  overflow: hidden;
  display: flex;
  align-items: center;
  justify-content: center;
}

/*98*/
.mosaic--about .t3 {
  grid-column: 1 / span 1;
  grid-row: 3 / span 2;
  background: #fff;
  border-radius: 1rem;
  box-shadow: 0 4px 16px rgba(0,0,0,0.06);
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 1.2rem;
}
.mosaic--about .t3 img {
  width: 100%;
  object-fit: cover;
  border-radius: 1rem;
}

/* engergy */
.mosaic--about .t4 {
  grid-column: 5 / span 1;
  grid-row: 6 / span 2;
  background: #fff;
  border-radius: 1rem;
  box-shadow: 0 4px 16px rgba(0,0,0,0.06);
  overflow: hidden;
  display: flex;
  align-items: center;
  justify-content: center;
}

/* Tony */
.mosaic--about .t5 {
  grid-column: 2 / span 2;
  grid-row: 3 / span 2;
}

.mosaic--about .t5 img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  border-radius: 1rem;
}
/* chem */
.mosaic--about .t6 {
  grid-column: 3 / span 1;
  grid-row: 5 / span 2;
}

/* quote */
.mosaic--about .t7 {
  grid-column: 1 / span 2;
  grid-row: 5 / span 1;
}
/* reviuew */
.mosaic--about .t8 {
  grid-column: 4 / span 2;
  grid-row: 4 / span 2;
}
/*big photo*/
.mosaic--about .t9 {
  grid-column: 1 / span 2;
  grid-row: 6 / span 2;
}

/* smal 1x1*/
.mosaic--about .t10 {
  grid-column: 3 / span 1;
  grid-row: 7 / span 1;
}
/* photo upper right*/
.mosaic--about .t11 {
  grid-column: 4 / span 2;
  grid-row: 3 / span 1;
}

.mosaic__tile--stat {
  background: #0a2a4d !important;
  border-radius: 1rem;
  box-shadow: 0 4px 16px rgba(0,0,0,0.06);
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 2rem 1.5rem;
}


.core-stats {
  display: flex;
  justify-content: space-between;
  align-items: stretch;
  background: #0a2a4d;
  border-radius: 1rem;
  padding: 2rem 1.5rem;
  gap: 1.5rem;
}

.core-stat {
  flex: 1 1 0;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
}

.core-stat-icon {
  margin-bottom: 1rem;
}

.core-stat-value {
  font-size: 2.5rem;
  font-weight: 700;
  color: #d0b81c;
  margin-bottom: 0.5rem;
  letter-spacing: 1px;
}

.core-stat-label {
  font-size: 1.15rem;
  color: #fff;
  text-align: center;
  margin-top: 0.2rem;
}

.stats-section {
  display: none;
}
@media (max-width: 1120px) {
  .team-cards {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 1rem;
  }
}
/* Tablet: Hide big photo and top right photo, reorganize grid */
@media (max-width: 1000px) {
  .mosaic--about {
    display: flex;
    flex-direction: column;
    gap: 1rem;
    width: 100%;
    padding: 0;
    max-height: none;
  }
  /* Hide tiles you don't want on mobile */
  .mosaic--about .t4,
  .mosaic--about .t2,
  .mosaic--about .t6,
  .mosaic--about .t3,
  .mosaic--about .t5,
  .mosaic--about .t9,
  .mosaic--about .t11 {
    display: none !important;
  }
  /* Optionally, style the remaining tiles for better spacing */
  .mosaic--about .mosaic__tile {
    margin-bottom: 1rem;
    width: 100%;
    min-height: 120px;
  }

  .stats-section {
    display: block;
  }

  
}

/* Phone: Show only one photo (top left), hide all others except text */
@media (max-width: 600px) {
  .mosaic--about .mosaic__tile--photo:not(.t2) { /* hide all photos except t2 */
    display: none !important;
  }
  .mosaic--about .mosaic__tile--text {
    grid-column: 1 / -1;
    grid-row: 1 / 2;
  }
  /* Hide all other tiles except text and t2 photo */
  .mosaic--about .mosaic__tile:not(.mosaic__tile--text):not(.t2) {
    display: none !important;
  }
  .mosaic--about {
    grid-template-columns: 1fr;
    grid-template-rows: auto;
    gap: 1rem;
  }
  .team-cards {
  display: flex;
  gap: 2rem;
  justify-content: center;
  flex-wrap: wrap;
  }
  .story-box {
  font-size: 1rem;
  }
  .highlight-word {
    font-size: 1rem;
  }
  .highlight-word.active {
  font-size: 1rem;
  font-weight: bold;
  color: #0077c2;           /* Blue when active */
}
}