/* /Components/Layout/MainLayout.razor.rz.scp.css */
/*
 * Public site shell. Token-driven only (contract item 11).
 *
 * Deliberately minimal: the per-tenant theme supplies the firm's identity, and this
 * layer supplies only structure.
 */

.site-header[b-tcw7qpkjtw] {
    padding: var(--space-4) var(--space-5);
    border-bottom: var(--border-hairline) solid var(--semantic-border);
    background-color: var(--semantic-surface);
}

.site-header[b-tcw7qpkjtw] {
    display: flex;
    flex-wrap: wrap;
    gap: var(--space-3);
    align-items: baseline;
    justify-content: space-between;
}

.site-header .firm-name[b-tcw7qpkjtw] {
    font-size: var(--font-size-xl);
    font-weight: var(--font-weight-semibold);
    color: var(--semantic-text);
    text-decoration: none;
}

/* NAVIGATION (E3-F3-S4). Every value resolves through the token pipeline, like everything
   else on this surface: the gate greps component CSS for raw values. */
.site-nav ul[b-tcw7qpkjtw] {
    display: flex;
    flex-wrap: wrap;
    gap: var(--space-4);
    margin: 0;
    padding: 0;
    list-style: none;
}

.site-nav a[b-tcw7qpkjtw] {
    color: var(--semantic-text);
    text-decoration: none;
    font-size: var(--font-size-md);
}

/* Underlined on hover AND on focus. A nav whose only affordance is the pointer is a nav a
   keyboard user cannot see themselves moving through. */
.site-nav a:hover[b-tcw7qpkjtw],
.site-nav a:focus-visible[b-tcw7qpkjtw] {
    text-decoration: underline;
}

/* The link the whole site exists to deliver somebody to, so it is the one that looks like an
   action rather than another word in a row.

   PRIMARY, NOT ACCENT. The first version used --semantic-accent and the accessibility journeys
   failed it on four pages: that token on this surface is about 4.2:1, just under the 4.5:1 WCAG
   AA needs for text this size. --semantic-primary is about 6.1:1 and is the token that means
   "action" anyway, so the accessible choice and the semantically correct one turned out to be
   the same. Accent is a decorative token and is not safe as text on this surface.

   The ratios are described rather than written as colour values because the gate greps this
   file for raw hex, correctly: a hex in a comment is indistinguishable from one in a rule, and
   loosening the check to allow comments would weaken a control that is doing its job. */
.site-nav .site-nav-contact[b-tcw7qpkjtw] {
    font-weight: var(--font-weight-semibold);
    color: var(--semantic-primary);
}
