/* ==========================================================================
   Components — shared, non-chrome
   --------------------------------------------------------------------------
   The header, footer, navigation and lightbox now come from the design itself:
   03-chrome.css (generated by build-chrome.mjs) plus 04-chrome-state.css for
   the scroll behaviour the design implemented in JavaScript.

   An earlier version of this file hand-authored those with invented class
   names (cme-header__*, cme-nav__*) — it approximated the design rather than
   matching it, and the markup referenced classes the design never had. Those
   rules are removed; what remains is genuinely shared furniture.
   ========================================================================== */

/* --------------------------------------------------------------------------
   Primary navigation
   -------------------------------------------------------------------------- */

.cme-nav {
  align-items: center;
  gap: clamp(10px, 1.9vw, 40px);
  flex-wrap: nowrap;
  min-width: 0;
}

/* --------------------------------------------------------------------------
   Footer
   -------------------------------------------------------------------------- */

.cme-footer {
  position: relative;
  background: var(--cme-cream);
  color: var(--cme-footer-text);
  border-top: 2px solid var(--cme-gold);
  overflow: hidden;
}

/* --------------------------------------------------------------------------
   Buttons (shared)
   -------------------------------------------------------------------------- */

.cme-btn {
  display: inline-block;
  padding: 17px 38px;
  font-family: var(--cme-font-body);
  font-size: 12px;
  font-weight: 700;
  letter-spacing: var(--cme-track-button);
  text-transform: uppercase;
  transition: background .3s, border-color .3s, transform .25s var(--cme-ease);
}

.cme-btn--gold {
  background: var(--cme-gold);
  border: 1px solid var(--cme-gold);
  color: var(--cme-ink);
}

.cme-btn--gold:hover {
  background: var(--cme-gold-light);
  border-color: var(--cme-gold-light);
  color: var(--cme-ink);
}

/* --------------------------------------------------------------------------
   Fallback / empty states
   -------------------------------------------------------------------------- */

.cme-fallback,
.cme-empty {
  background: var(--cme-sand);
  padding: clamp(140px, 18vw, 260px) var(--cme-gutter) clamp(80px, 11vw, 150px);
}

.cme-fallback__inner,
.cme-empty {
  max-width: 720px;
  margin-inline: auto;
  text-align: center;
}

.cme-fallback__title {
  font-family: var(--cme-font-display);
  font-weight: 600;
  font-size: clamp(2rem, 3.8vw, 3rem);
  line-height: 1.05;
  color: var(--cme-ink-head);
  margin-bottom: 24px;
}

.cme-fallback__copy {
  font-size: 17px;
  line-height: 1.65;
  color: var(--cme-body);
  margin-bottom: 36px;
}

.cme-fallback__list {
  list-style: none;
  padding: 0;
  margin: 0 0 36px;
  display: flex;
  flex-direction: column;
  gap: 12px;
}