/* Page Hero Section */
.page-hero {
  min-height: 330px;
  background: linear-gradient(90deg, #031d42 0%, #031d42e8 42%, #031d4233 70%), var(--hero) center/cover;
  display: flex;
  align-items: center;
  color: #fff;
}

.crumb-link, 
.crumb-link:visited {
    color: inherit; 
    text-decoration: none; /* Removes the default blue underline */
}

/* Optional: Slight opacity change on hover so users know it is clickable */
.crumb-link:hover {
    opacity: 0.8;
}

.page-hero .crumb {
  font-size: 12px;
  color: #e0e7f4;
  margin: 0 0 12px;
}

.page-hero .crumb span {
  color: var(--orange);
}

.page-hero h1 {
  font-size: 45px;
}

.page-hero h1 em {
  color: var(--orange);
}

.page-hero .lead {
  font-size: 15px;
  max-width: 510px;
  color: #f3f6fb;
  margin: 16px 0 0;
}

/* Page Content */
.page-content {
  padding: 62px 0;
}

/* Split Intro Section */
.split-intro {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 45px;
  align-items: center;
  margin-bottom: 40px;
}

.split-intro img {
  width: 100%;
  height: 275px;
  object-fit: cover;
  border-radius: 8px;
}

.split-intro h2 {
  font-size: 31px;
}

.split-intro .eyebrow {
  color: var(--orange);
}

.split-intro p {
  color: var(--muted);
}

/* Feature Grid */
.feature-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 16px;
}

.feature-grid article {
  border: 1px solid var(--line);
  border-radius: 7px;
  padding: 23px 18px;
  min-height: 185px;
}

.feature-grid i {
  color: var(--orange);
  width: 33px;
  height: 33px;
}

.feature-grid h3 {
  font-size: 15px;
  margin: 12px 0 5px;
}

.feature-grid p {
  font-size: 12px;
  margin: 0;
  color: var(--muted);
}

/* Detail Grid */
.detail-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 16px;
  align-items: stretch;
}

.detail-grid article {
  border: 1px solid var(--line);
  border-radius: 7px;
  overflow: hidden;
  background: #fff;
  display: flex;
  flex-direction: column;
  height: 100%;
}

.detail-grid img {
  width: 100%;
  height: 150px;
  object-fit: cover;
}

.detail-grid .high-mast-image {
  object-position: center top;
}

.detail-grid .bms-image {
  object-fit: fill;
  background: var(--navy);
}

.detail-grid .card-copy {
  padding: 12px 14px 14px;
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  gap: 6px;
  flex: 1;
}

.detail-grid h3 {
  font-size: 16px;
  line-height: 1.3;
  margin: 0;
}

.detail-grid p {
  font-size: 12px;
  color: var(--muted);
  margin: 0;
  line-height: 1.55;
}

.detail-grid a {
  font-size: 11px;
  color: var(--ink);
  font-weight: 800;
  text-transform: uppercase;
  text-decoration: none;
}

/* Banner Section */
.banner {
  margin: 25px 0 0;
  border-radius: 8px;
  padding: 28px 34px;
  color: #fff;
  /* background: linear-gradient(100deg, #031d42, #082955), url('https://images.unsplash.com/photo-1516939884455-1445c8652f83?auto=format&fit=crop&w=1300&q=80') right/cover; */
  background: linear-gradient(100deg, #031d42, #082955), url('assets/common/common_hero_2.webp') right/cover;
  background-blend-mode: soft-light;
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.banner h2 {
  font-size: 25px;
}

.banner p {
  margin: 4px 0;
  color: #d7e0ee;
}

/* Timeline */
.timeline {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 0;
  border: 1px solid var(--line);
  border-radius: 7px;
  overflow: hidden;
}

.timeline article {
  padding: 22px 17px;
  border-right: 1px solid var(--line);
}

.timeline article:last-child {
  border: 0;
}

.timeline b {
  color: var(--orange);
  font: 800 13px Manrope;
}

.timeline h3 {
  font-size: 15px;
  margin: 4px 0;
}

.timeline p {
  font-size: 12px;
  color: var(--muted);
  margin: 0;
}

/* Contact Grid */
.contact-grid {
  display: grid;
  grid-template-columns: 1.1fr 0.9fr;
  gap: 24px;
}

.form-card,
.contact-card {
  padding: 28px;
  border: 1px solid var(--line);
  border-radius: 8px;
}

.form-card h2,
.contact-card h2 {
  font-size: 27px;
  margin-bottom: 4px;
}

.form-card p,
.contact-card p {
  color: var(--muted);
}

/* Leadership */
.leadership-section {
  margin-top: 64px;
}

.leadership-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 24px;
  margin-top: 32px;
}

.leadership-card {
  display: grid;
  grid-template-columns: 150px minmax(0, 1fr);
  overflow: hidden;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #fff;
}

.leadership-card img {
  width: 100%;
  height: 100%;
  min-height: 220px;
  object-fit: cover;
}

.leadership-content {
  padding: 24px;
}

.leadership-message {
  margin-top: 0;
  color: var(--muted);
}

.leadership-content h3 {
  margin: 20px 0 2px;
}

.leadership-content .role {
  margin: 0;
  color: var(--orange);
  font-size: 14px;
  font-weight: 600;
}

/* Form Grid */
.form-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 14px;
  margin-top: 20px;
}

.form-grid input,
.form-grid select,
.form-grid textarea {
  font: inherit;
  border: 1px solid #dfe4eb;
  padding: 13px;
  border-radius: 4px;
  width: 100%;
}

.form-grid textarea,
.form-grid .full {
  grid-column: 1/-1;
}

.form-card button {
  margin-top: 14px;
  cursor: pointer;
}

/* Contact Card */
.contact-card {
  background: #f4f8fd;
}

.contact-card article {
  display: flex;
  gap: 13px;
  margin: 18px 0;
}

.contact-card i {
  color: var(--orange);
  width: 25px;
}

.contact-card h3 {
  font-size: 14px;
}

.contact-card article p {
  font-size: 13px;
  margin: 2px 0;
}

/* Map Placeholder */
.map-placeholder {
  height: 190px;
  margin-top: 23px;
  border-radius: 5px;
  background: linear-gradient(45deg, #dce7d7 25%, #eaf0f5 25% 50%, #dce7d7 50% 75%, #eaf0f5 75%);
  background-size: 35px 35px;
  display: grid;
  place-items: center;
  color: var(--orange);
  font: 700 16px Manrope;
}

.map-placeholder i {
  width: 35px;
  height: 35px;
}

/* Mobile Responsive - Tablets (max-width: 780px) */
@media (max-width: 780px) {
  .page-hero {
    min-height: 300px;
  }

  .page-hero h1 {
    font-size: 36px;
  }

  .page-content {
    padding: 45px 0;
  }

  .split-intro,
  .contact-grid {
    grid-template-columns: 1fr;
  }

  .leadership-grid {
    grid-template-columns: 1fr;
  }

  .feature-grid {
    grid-template-columns: 1fr 1fr;
  }

  .detail-grid {
    grid-template-columns: 1fr 1fr;
  }

  .timeline {
    grid-template-columns: 1fr 1fr;
  }

  .timeline article:nth-child(2) {
    border-right: 0;
  }

  .timeline article:nth-child(-n+2) {
    border-bottom: 1px solid var(--line);
  }

  .banner {
    flex-direction: column;
    align-items: flex-start;
    gap: 15px;
  }
}

/* Mobile Responsive - Phones (max-width: 470px) */
@media (max-width: 470px) {
  .feature-grid,
  .detail-grid,
  .timeline,
  .form-grid {
    grid-template-columns: 1fr;
  }

  .timeline article:nth-child(2) {
    border-right: 0;
  }

  .timeline article {
    border-right: 0;
    border-bottom: 1px solid var(--line);
  }

  .timeline article:last-child {
    border-bottom: 0;
  }
}