/* ==========================================================================
   Reusable page patterns: hero, split sections, trust band, CTA band
   ========================================================================== */

.eyebrow {
  font-family: var(--font-heading);
  font-weight: 600;
  font-size: var(--step-sm);
  color: var(--calyon-gold);
  margin-bottom: var(--space-xs);
}

/* Hero */
.hero { position: relative; color: var(--white); overflow: hidden; min-height: min(92vh, 920px); display: flex; align-items: flex-end; background: var(--calyon-navy); }
.hero__media { position: absolute; inset: 0; z-index: 0; overflow: hidden; }
.hero__media img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: 50% 92%;
  animation: heroSlowZoom 14s ease-in-out infinite alternate;
}
@keyframes heroSlowZoom {
  0% { transform: scale(1); }
  100% { transform: scale(1.08); }
}
@media (prefers-reduced-motion: reduce) {
  .hero__media img { animation: none; }
}
@media (max-width: 640px) {
  .hero { min-height: min(78vh, 700px); }
}
.hero__media::after {
  content: '';
  position: absolute; inset: 0;
  background: linear-gradient(100deg, rgba(12,26,60,0.86) 0%, rgba(12,26,60,0.62) 42%, rgba(12,26,60,0.22) 100%);
}
.hero__content {
  position: relative;
  z-index: 1;
  padding-block: var(--space-3xl) var(--space-2xl);
  max-width: 720px;
}
.hero h1 { color: var(--white); }
.hero__lede { color: #E7ECF7; font-size: var(--step-md); max-width: 46ch; }
.hero__actions { display: flex; flex-wrap: wrap; gap: 0.9rem; margin-block: var(--space-md); }
.hero__trust span { color: #E7ECF7; }
.hero__trust span::after { background: var(--calyon-gold); }

.page-hero { min-height: 54vh; display: flex; align-items: flex-end; }
.page-hero .hero__content { padding-block: var(--space-2xl) var(--space-lg); }
.page-hero .hero__media img { object-position: 50% 10%; }
@media (max-width: 640px) {
  .page-hero { min-height: 46vh; }
}

/* Split section */
.split {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: var(--space-xl);
  align-items: center;
}
.split--reverse .split__media { order: 2; }
@media (max-width: 860px) {
  .split { grid-template-columns: 1fr; }
  .split--reverse .split__media { order: 0; }
}
.split__media img { border-radius: var(--radius-md); aspect-ratio: 4/3; object-fit: cover; width: 100%; }

/* Trust band — 7 items (an awkward number for any fixed grid), so use
   flexbox with wrap + center: any incomplete last row centers itself
   automatically instead of leaving an orphan or a ragged gap. */
.trust-band__grid {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: var(--space-lg) var(--space-md);
}
.trust-band__grid > div {
  flex: 1 1 240px;
  max-width: 280px;
}
.trust-band__grid h3 { color: var(--white); font-size: var(--step-base); }
.trust-band__grid p { color: #C9D3E8; font-size: var(--step-sm); margin: 0; }

/* CTA band */
.cta-band { background: var(--off-white); border-top: 1px solid var(--border-subtle); }
.cta-band__inner { text-align: center; max-width: 640px; margin-inline: auto; }
.cta-band__inner .btn { margin-top: var(--space-sm); }

.section-cta { margin-top: var(--space-lg); }

/* FAQ accordion */
.faq-item { border-bottom: 1px solid var(--border-subtle); }
.faq-item__q {
  width: 100%;
  text-align: left;
  background: none;
  border: none;
  padding: 1.1rem 0;
  font-family: var(--font-heading);
  font-weight: 600;
  font-size: var(--step-base);
  color: var(--calyon-navy);
  cursor: pointer;
  display: flex;
  justify-content: space-between;
  gap: 1rem;
  list-style: none;
}
.faq-item__q::-webkit-details-marker { display: none; }
.faq-item__q .icon { transition: transform var(--duration-fast) var(--ease-standard); flex-shrink: 0; }
.faq-item[open] .faq-item__q .icon { transform: rotate(45deg); }
.faq-item__a { padding-bottom: 1.1rem; }

/* Breadcrumbs */
.breadcrumbs { font-size: var(--step-xs); color: var(--text-secondary); padding-block: var(--space-sm); }
.breadcrumbs a { color: var(--text-secondary); text-decoration: none; }
.breadcrumbs a:hover { color: var(--calyon-navy); }
.breadcrumbs--on-dark, .breadcrumbs--on-dark a { color: #C9D3E8; }
.breadcrumbs--on-dark a:hover { color: var(--white); }

/* Simple content list styling for service/industry pages */
.content-list { padding-left: 1.2rem; }
.content-list li { margin-bottom: 0.5rem; color: var(--text-secondary); }
.content-list--2col { columns: 2; }
@media (max-width: 560px) {
  .content-list--2col { columns: 1; }
  /* Fallback for already-deployed pages still using the old inline style="columns:2"
     attribute (targets the attribute value directly, no HTML edit required). */
  .content-list[style*="columns:2"] { columns: 1 !important; }
}

/* Form */
.form-grid { display: grid; grid-template-columns: 1fr 1fr; gap: var(--space-md); }
@media (max-width: 700px) { .form-grid { grid-template-columns: 1fr; } }
.form-field { display: flex; flex-direction: column; gap: 0.35rem; min-width: 0; }
.form-field--full { grid-column: 1 / -1; }
.form-field label { font-family: var(--font-heading); font-weight: 600; font-size: var(--step-sm); color: var(--calyon-navy); }
.form-field input:not([type="checkbox"]):not([type="radio"]),
.form-field select,
.form-field textarea {
  width: 100%;
  min-width: 0;
  max-width: 100%;
  box-sizing: border-box;
  font-family: var(--font-body);
  font-size: var(--step-base);
  padding: 0.75rem 0.9rem;
  border: 1.5px solid var(--border-strong);
  border-radius: var(--radius-sm);
  background: var(--white);
}
.form-field input:focus, .form-field select:focus, .form-field textarea:focus {
  border-color: var(--calyon-navy);
}
.form-field input.visually-hidden { width: 1px !important; min-width: 1px !important; }
.form-field input[type="checkbox"], .form-field input[type="radio"] {
  width: 18px;
  height: 18px;
  flex-shrink: 0;
  accent-color: var(--calyon-navy);
}
.checkbox-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(200px, 100%), 1fr)); gap: 0.6rem; min-width: 0; }
.checkbox-row { display: flex; align-items: flex-start; gap: 0.5rem; font-size: var(--step-sm); color: var(--text-secondary); min-width: 0; }
.checkbox-row input[type="checkbox"] { margin-top: 0.2rem; }

.form-alert { padding: 1.25rem 1.5rem; border-radius: var(--radius-md); margin-bottom: var(--space-md); }
.form-alert--error { background: #FDECEC; border: 1px solid #E8A3A3; color: #8A1F1F; }
.form-alert--success { background: #EAF3E6; border: 1px solid #B7D6A8; padding: var(--space-lg); text-align: center; }
.form-alert--success h2 { color: var(--calyon-navy); }