/* Ebenezer chrome base: brand design tokens (ported from the Ebenezer theme's
   style.css), plus the two accessibility utilities and a scoped box-sizing reset
   the nav/footer markup relies on. Loaded only when the Ebenezer nav + footer
   toggle is on, so it never touches the rest of the ACU site. */

/* Brand colors (ACU Brand Guide 2026, sec. 3) */
:root {
  --acu-wildcat-purple: #4F2170;
  --acu-white: #FFFFFF;

  /* Of these, only Midnight, Wildcat, and Vibrant may appear in institutional logos. */
  --acu-midnight-purple: #21174B;
  --acu-vibrant-purple: #8131B0;
  --acu-sage-purple: #8868A6;
  --acu-lavender-purple: #CCA6CD;
  --acu-primrose-purple: #DFCDF3;

  /* Tertiary: never use alone, always pair with a core purple. */
  --acu-mesquite-red: #B4235A;
  --acu-horizon-red: #EF6181;
  --acu-prairie-bronze: #A76D12;
  --acu-sunset-orange: #ECA25C;
  --acu-casual-cream: #EFEDE3;
  --acu-nuclear-green: #C7D944;
  --acu-canyon-green: #778921;
  --acu-windmill-blue: #4C83AE;
  --acu-sky-blue: #A4C8F0;

  --acu-color-primary: var(--acu-wildcat-purple);
  --acu-color-primary-dark: var(--acu-midnight-purple);
  --acu-color-primary-accent: var(--acu-vibrant-purple);
  --acu-color-surface: var(--acu-white);
}

/* Typography */
:root {
  --font-sans: "proxima-nova", -apple-system, system-ui, BlinkMacSystemFont, "Segoe UI", Helvetica, Arial, sans-serif;
  --font-serif: "tiller", Georgia, "Times New Roman", serif;

  --text-2xs: 0.625rem;
  --text-xs:  0.75rem;
  --text-sm:  0.875rem;
  --text-md:  1rem;
  --text-lg:  1.125rem;
  --text-xl:  1.25rem;
  --text-2xl: 1.5rem;
  --text-3xl: 1.875rem;
  --text-4xl: 2.25rem;
  --text-5xl: 3rem;
  --text-6xl: 3.75rem;
  --text-7xl: 4.5rem;

  --font-light:    300;
  --font-regular:  400;
  --font-medium:   500;
  --font-semibold: 600;
  --font-bold:     700;
  --font-black:    900;

  --leading-tight:   1.1;
  --leading-snug:    1.25;
  --leading-normal:  1.5;
  --leading-relaxed: 1.625;

  --tracking-tight:   -0.02em;
  --tracking-normal:   0;
  --tracking-wide:     0.05em;
  --tracking-wider:    0.1em;
  --tracking-widest:   0.15em;
}

/* Spacing (4px base) */
:root {
  --space-2xs: 0.25rem;
  --space-xs:  0.5rem;
  --space-sm:  0.75rem;
  --space-md:  1rem;
  --space-lg:  1.5rem;
  --space-xl:  2rem;
  --space-2xl: 3rem;
  --space-3xl: 4rem;
  --space-4xl: 6rem;
  --space-5xl: 8rem;
}

/* Corner radius */
:root {
  --radius-none: 0;
  --radius-sm:   0.25rem;
  --radius-md:   0.5rem;
  --radius-lg:   1rem;
  --radius-xl:   1.5rem;
  --radius-full: 9999px;
}

/* Container widths */
:root {
  --container-text: 65ch;
  --container-sm:   40rem;
  --container-md:   48rem;
  --container-lg:   64rem;
  --container-xl:   80rem;
  --container-full: 100%;
}

/* Motion */
:root {
  --motion-fast: 150ms;
  --motion-base: 250ms;
  --motion-slow: 400ms;

  --ease-out:    cubic-bezier(0.16, 1, 0.3, 1);
  --ease-in-out: cubic-bezier(0.65, 0, 0.35, 1);
  --ease-linear: linear;
}

/* Elevation (shadow color is --acu-midnight-purple, expressed raw because
   rgba() can't take a hex custom property). */
:root {
  --shadow-sm: 0 1px 3px rgba(33, 23, 75, 0.10);
  --shadow-md: 0 0.75rem 1.5rem rgba(33, 23, 75, 0.15);
  --shadow-lg: 0 0.75rem 2rem rgba(33, 23, 75, 0.12), 0 0 0 1px rgba(33, 23, 75, 0.04);
}

/* Breakpoints. Custom properties can't be used inside @media, so match these
   px values directly: sm 640, md 768, lg 1024, xl 1280, 2xl 1536. */

/* Accessibility utilities (from the Ebenezer reset) so the BEM markup keeps its
   screen-reader-only text without pulling in the theme's global reset. */
.visually-hidden {
  position: absolute;
  background: inherit;
}

.screen-reader-text,
.visually-hidden:not(:focus):not(:active) {
  border: 0;
  clip-path: inset(50%);
  height: 1px;
  overflow: hidden;
  position: absolute;
  white-space: nowrap;
  width: 1px;
}

/* Scoped border-box, matching the refresh reset, so the nav/footer layout
   computes correctly without touching the rest of the ACU site. */
.site-masthead,
.site-masthead *,
.site-masthead *::before,
.site-masthead *::after,
.site-footer,
.site-footer *,
.site-footer *::before,
.site-footer *::after {
  box-sizing: border-box;
}

/* The type baseline is the fix for the button/spacing mismatch: the chrome
   inherits font size and, critically, the em-based line-height that sets button
   and link heights. The ACU body is 16px / 1.2, but this chrome was designed
   against the refresh body (18px / 1.618em), which made the buttons render ~10px
   shorter and tighter here. Mirror the refresh body on the masthead/footer so
   heights and spacing match. (A blanket margin/padding reset was deliberately
   avoided: it shrank the mobile header, and the components set their own spacing.) */
.site-masthead,
.site-footer {
  font-family: var(--font-sans);
  font-size: clamp(16px, 2vw, 18px);
  line-height: 1.618em;
}

/* The ACU theme ships a global `a:hover { color:#251035; text-decoration:underline }`
   that bleeds into the Ebenezer chrome: it darkens links the components leave at
   their base color (invisible on the dark footer and the sage top bar, and dark
   text on the dark action-button hover) and adds stray underlines. Re-assert the
   chrome's own hover intent here, scoped and specific enough to win this context.

   Light links that stay light on hover: footer text links, the top utility bar,
   and the action buttons (their dark hover background is set by the component).
   The footer social buttons are intentionally excluded: they invert to a dark
   glyph on a white background on hover, so they keep their own rule. */
.site-footer__links a:hover,
.site-footer__links a:focus-visible,
.site-footer__contact-link:hover,
.site-footer__contact-link:focus-visible,
.site-footer__safety-phone:hover,
.site-footer__safety-phone:focus-visible,
a.site-footer__safety-label:hover,
a.site-footer__safety-label:focus-visible,
.site-footer__legal-list a:hover,
.site-footer__legal-list a:focus-visible,
.site-masthead .top-nav__list a:hover,
.site-masthead .top-nav__list a:focus-visible,
.site-masthead .top-nav__search:hover,
.site-masthead .top-nav__search:focus-visible,
.site-masthead .action-nav__list > li > a:hover,
.site-masthead .action-nav__list > li > a:focus-visible {
  color: var(--acu-white);
}

/* Suppress the stray underline ACU adds on the button and primary-nav hovers.
   (The footer and top bar use underlines by design, so they are left alone.) */
.site-masthead .action-nav__list > li > a:hover,
.site-masthead .action-nav__list > li > a:focus-visible,
.site-masthead .primary-nav__list > li > a:hover,
.site-masthead .primary-nav__list > li > a:focus-visible {
  text-decoration: none;
}