/* ============================================================================
 * services.css — services.html only.
 * ==========================================================================*/

/* --------------------------------------------------------- service blocks
 * Four alternating image/text rows. Each is an anchor target from the header
 * and footer, so they need scroll-margin to clear the sticky header.
 * ------------------------------------------------------------------------ */
.svcblock { scroll-margin-block-start: calc(var(--header-h) + 32px); }

.svcblock h2 { margin-block-end: 12px; }

.svcblock__lead {
  font-size: 1.1rem;
  font-weight: 600;
  color: var(--text);
  margin-block-end: 16px;
}
.svcblock__body {
  color: var(--text-muted);
  margin-block-end: var(--gap-md);
}

.svcblock .tile { margin-block-end: 20px; }

.media--framed {
  border-radius: var(--r-xl);
  box-shadow: var(--shadow-lg);
  border: 1px solid var(--border);
}

/* --------------------------------------------------------------- exclusions
 * Deliberately styled as a warning band rather than a footnote: telling a
 * shipper up front what we cannot carry is the point of the section.
 * ------------------------------------------------------------------------ */
.exclusions { scroll-margin-block-start: calc(var(--header-h) + 32px); }

.exclcard {
  padding: var(--gap-md);
  border-radius: var(--r-lg);
  background: var(--surface);
  border: 1px solid var(--border);
  border-inline-start: 3px solid var(--danger);
}
.exclcard h3 {
  font-size: 1.05rem;
  margin-block-end: 8px;
}
.exclcard p {
  color: var(--text-muted);
  font-size: .93rem;
  margin: 0;
}
.exclcard .tile { margin-block-end: 16px; }

.exclusions__note {
  margin-block-start: var(--gap-md);
  max-width: 880px;
  margin-inline: auto;
}

/* ===================================================================== FAQ
 * Native <details>/<summary>: opens with no JavaScript, keyboard accessible
 * for free, and the answers stay in the served markup for crawlers.
 * ======================================================================= */
.faq { scroll-margin-block-start: calc(var(--header-h) + 32px); }

.faq__list {
  max-width: 820px;
  margin-inline: auto;
  display: grid;
  gap: 12px;
}

.faq__item {
  border-radius: var(--r);
  border: 1px solid var(--border);
  background: var(--surface);
  overflow: hidden;
  transition: border-color .2s var(--ease), box-shadow .2s var(--ease);
}
.faq__item[open] {
  border-color: color-mix(in srgb, var(--brand) 35%, transparent);
  box-shadow: var(--shadow-sm);
}

.faq__q {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  padding: 18px 22px;
  cursor: pointer;
  font-weight: 700;
  font-size: 1.02rem;
  list-style: none;
  transition: color .18s var(--ease);
}
.faq__q::-webkit-details-marker { display: none; }
.faq__q:hover { color: var(--brand); }
.faq__item[open] .faq__q { color: var(--brand); }

.faq__chev {
  width: 20px; height: 20px;
  flex: none;
  color: var(--text-faint);
  transition: transform .25s var(--ease);
}
.faq__item[open] .faq__chev { transform: rotate(180deg); color: var(--brand); }

.faq__a {
  padding: 0 22px 20px;
  border-block-start: 1px solid var(--border);
  padding-block-start: 16px;
  margin-inline: 22px;
  margin-block-end: 20px;
  padding-inline: 0;
}
.faq__a p {
  color: var(--text-muted);
  font-size: .96rem;
  line-height: 1.8;
  margin: 0;
}
