
/* Global layout */
*, *::before, *::after { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { font-family: var(--font-body); color: var(--color-text-dark); background: #fff; margin: 0; -webkit-font-smoothing: antialiased; }
h1,h2,h3,h4,h5,h6 { font-family: var(--font-heading); line-height: 1.25; margin: 0; }
p { margin: 0; }
a { color: inherit; }
img { max-width: 100%; height: auto; display: block; }
ul { list-style: none; padding: 0; margin: 0; }
button { font-family: var(--font-body); }

.container {
  max-width: 80rem;
  margin-inline: auto;
  padding-inline: 1.5rem;
}
.section { padding-block: 5rem; }
.section-gray { background: var(--color-bg-gray); }

.section-head {
  text-align: center;
  max-width: 36rem;
  margin: 0 auto 3rem;
}
.section-head h2 {
  font-family: var(--font-heading);
  font-size: clamp(1.75rem, 4vw, 2.25rem);
  font-weight: 700;
  color: var(--color-text-dark);
  margin-bottom: 1rem;
  letter-spacing: -0.3px;
}
.section-head p { font-size: 1rem; color: var(--color-text-muted); }

/* Stripe divider   4px, blue left | pink right */
.stripe-divider { display: flex; height: 4px; width: 100%; }
.half-blue { flex: 1; background: var(--color-blue); }
.half-pink  { flex: 1; background: var(--color-pink); }

/* Skip link */
.skip-link { position: absolute; left: -9999px; }
.skip-link:focus { position: fixed; top: 1rem; left: 1rem; z-index: 9999; padding: 0.5rem 1rem; background: var(--color-blue); color: #fff; border-radius: var(--radius-sm); font-weight: 600; text-decoration: none; }

/* Drupal messages */
.highlighted { padding: 1rem; }
.messages { padding: 0.75rem 1rem; border-radius: var(--radius-sm); margin-bottom: 1rem; font-size: 0.875rem; }
.messages--status  { background: var(--color-success-bg); color: var(--color-success-text); }
.messages--warning { background: var(--color-warning-bg); color: var(--color-warning-text); }
.messages--error   { background: var(--color-error-bg); color: var(--color-error-text); }

/* Editorial 2-column grid for desktop */
.editorial-2col-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 2rem 4rem;
  width: 100%;
}


@media (max-width: 767px) { .section { padding-block: 3rem; } }

/* ── Mobile nav: show simple About link, hide dropdown trigger + submenu ── */
@media (max-width: 767px) {
  .nav-mobile-about { display: block !important; }
  .nav-dropdown-trigger { display: none !important; }
  .nav-dropdown-menu { display: none !important; }
}
@media (min-width: 768px) {
  .nav-mobile-about { display: none !important; }
}
