/* Shared promotion blocks for the chiller water treatment service.
   Loaded after colors_and_type.css by the pages that promote the service. */

/* Announcement pill (dark hero) */
.announce {
  display: inline-flex; align-items: center; gap: 10px;
  padding: 6px 16px 6px 6px; margin-bottom: var(--bq-space-5);
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.1);
  border: 1px solid rgba(255, 255, 255, 0.22);
  color: #fff !important;
  font-family: var(--bq-font-display); font-size: var(--bq-text-sm); font-weight: 600;
  transition: background var(--bq-transition-fast), transform var(--bq-transition-fast);
}
.announce:hover { background: rgba(255, 255, 255, 0.18); transform: translateY(-1px); color: #fff !important; }
.announce__tag {
  background: var(--bq-aqua); color: var(--bq-navy-deep);
  padding: 3px 10px; border-radius: 999px;
  font-size: var(--bq-text-xs); font-weight: 700;
  letter-spacing: var(--bq-tracking-wider); text-transform: uppercase;
}

/* Home page: services section */
.promo-cards { display: grid; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); gap: var(--bq-space-5); }
.promo-card {
  background: #fff; border: 1px solid var(--bq-mist); border-radius: var(--bq-radius-xl);
  padding: var(--bq-space-6);
}
.promo-card__tag {
  font-family: var(--bq-font-mono); font-size: var(--bq-text-xs);
  letter-spacing: var(--bq-tracking-wider); text-transform: uppercase;
  color: var(--bq-royal); font-weight: 600; display: block; margin-bottom: var(--bq-space-3);
}
.promo-card h3 {
  font-family: var(--bq-font-display); font-weight: 700; font-size: var(--bq-text-xl);
  line-height: 1.2; color: var(--bq-navy); margin-bottom: var(--bq-space-3);
}
.promo-card p { font-size: var(--bq-text-base); line-height: 1.65; color: var(--bq-slate); }
.promo-actions { display: flex; gap: var(--bq-space-4); flex-wrap: wrap; margin-top: var(--bq-space-8); }
.btn--outline {
  background: transparent; color: var(--bq-royal) !important;
  border: 1.5px solid var(--bq-royal);
}
.btn--outline:hover { background: var(--bq-aqua-pale); }

/* Inline callout used on Products and Case studies */
.service-callout {
  display: grid; grid-template-columns: 1fr auto; gap: var(--bq-space-8); align-items: center;
  padding: var(--bq-space-8);
  background: #fff; border: 1px solid var(--bq-mist); border-left: 4px solid var(--bq-royal);
  border-radius: var(--bq-radius-xl);
}
@media (max-width: 720px) { .service-callout { grid-template-columns: 1fr; gap: var(--bq-space-5); } }
.service-callout__eyebrow {
  font-family: var(--bq-font-display); font-size: var(--bq-text-sm); font-weight: 600;
  letter-spacing: var(--bq-tracking-wider); text-transform: uppercase;
  color: var(--bq-royal); display: block; margin-bottom: var(--bq-space-2);
}
.service-callout h2 {
  font-family: var(--bq-font-display); font-weight: 700;
  font-size: clamp(1.4rem, 2.8vw, 1.9rem); line-height: 1.2;
  letter-spacing: var(--bq-tracking-tight); color: var(--bq-navy); margin-bottom: var(--bq-space-3);
}
.service-callout h2 em { font-family: var(--bq-font-editorial); font-style: italic; font-weight: 500; color: var(--bq-royal); }
.service-callout p { font-size: var(--bq-text-base); line-height: 1.65; color: var(--bq-slate); max-width: 60ch; }

/* Case study link */
.case__link {
  display: inline-block; margin-top: var(--bq-space-3);
  font-family: var(--bq-font-display); font-weight: 600; font-size: var(--bq-text-sm);
}