/**
 * Consultancy Edge — template stylesheet.
 *
 * Loaded after the shared front-end foundation and before the site's own
 * compiled design tokens, so this file can restyle anything the foundation
 * provides while the site owner's choices still beat both.
 *
 * **No colour, radius, or spacing value is hardcoded here.** Everything reads
 * a custom property, which is what lets the Live Design Panel restyle a whole
 * site instantly. A third-party template has to respect the same rule.
 */

/* ------------------------------------------------------------------ */
/* Header                                                             */
/* ------------------------------------------------------------------ */
.site-header-accent {
  background-color: transparent;
  border-bottom: 1px solid var(--color-line);
}

header a { color: var(--color-ink); }

/* The header lifts onto a shadow once the page scrolls, so it separates
   from the content without a permanent border competing with the hero. */
header[data-scrolled="true"] {
  box-shadow: var(--ui-shadow-md);
}

/* ------------------------------------------------------------------ */
/* Section headings                                                   */
/* ------------------------------------------------------------------ */
.site-heading {
  font-size: clamp(2.25rem, 6vw, 4rem);
  letter-spacing: -0.03em;
  line-height: 1.05;
}

/* ------------------------------------------------------------------ */
/* Cards                                                              */
/* ------------------------------------------------------------------ */
.site-card {
  box-shadow: none;
  border-color: transparent;
  background-color: var(--ui-surface-muted);
}

.site-card-hover:hover { transform: none; }

/* ------------------------------------------------------------------ */
/* Section rhythm                                                     */
/* ------------------------------------------------------------------ */

/* Alternating sections get a subtle tint, so a long page reads as distinct
   bands rather than one continuous scroll. Applied positionally with
   :nth-of-type, so it keeps working however the editor reorders, adds, or
   removes sections — the alternation is never baked into a section itself. */
[data-section-id]:nth-of-type(even) > div:not([class*="bg-"]) {
  background-color: var(--ui-surface-muted);
}