/* ===================================================================
   ARU Grant Fund shared styles — used by [aru_grant_index] (grant page)
   and [aru_grant_apply] (apply page). Fonts, the scoped Tailwind-preflight
   reset, and the rules the React pages share (AruBaseStyles + AruFooter).
   (URLs are relative to this file, i.e. assets/ → ../fonts/.)
   =================================================================== */


/* ── Palette ──
   The one place this plugin defines its brand colors. Templates, the
   <style> blocks and shared.js all use var(--aru-grant-*); translucent
   shades are color-mix(in srgb, var(--aru-grant-*) N%, transparent), which
   matches the old rgba(r,g,b,N/100). Values mirror ARU_COLORS in the React
   app (app/components/aru/aru-styles.tsx) and GOLD in its AruFooter, and
   the same palette in the ARU Core plugin; keep them in sync. Defined on
   :root so the full-bleed template's page background and the header/footer
   that shared.js injects can use them too. The aru-grant prefix keeps them
   apart from ARU Core's --aru-* if both plugins share a site. Neutrals
   (white, black, grays) and the .svg images keep literal colors. */
:root {
  --aru-grant-orange: #FF6633;
  --aru-grant-dark-navy: #0B243F;
  --aru-grant-navy: #1A324B;
  --aru-grant-light-blue: #2ED5FD;
  --aru-grant-cream: #FEF9EF;
  --aru-grant-gold: #fec01b;
}

/* ── Poppins ── */
@font-face {
  font-family: 'ARU Poppins';
  src: url('../fonts/poppins-400-devanagari.woff2') format('woff2');
  font-weight: 400; font-style: normal; font-display: swap;
  unicode-range: U+0900-097F, U+1CD0-1CF9, U+200C-200D, U+20A8, U+20B9, U+20F0, U+25CC, U+A830-A839, U+A8E0-A8FF, U+11B00-11B09;
}
@font-face {
  font-family: 'ARU Poppins';
  src: url('../fonts/poppins-400-latin-ext.woff2') format('woff2');
  font-weight: 400; font-style: normal; font-display: swap;
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: 'ARU Poppins';
  src: url('../fonts/poppins-400-latin.woff2') format('woff2');
  font-weight: 400; font-style: normal; font-display: swap;
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: 'ARU Poppins';
  src: url('../fonts/poppins-500-devanagari.woff2') format('woff2');
  font-weight: 500; font-style: normal; font-display: swap;
  unicode-range: U+0900-097F, U+1CD0-1CF9, U+200C-200D, U+20A8, U+20B9, U+20F0, U+25CC, U+A830-A839, U+A8E0-A8FF, U+11B00-11B09;
}
@font-face {
  font-family: 'ARU Poppins';
  src: url('../fonts/poppins-500-latin-ext.woff2') format('woff2');
  font-weight: 500; font-style: normal; font-display: swap;
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: 'ARU Poppins';
  src: url('../fonts/poppins-500-latin.woff2') format('woff2');
  font-weight: 500; font-style: normal; font-display: swap;
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: 'ARU Poppins';
  src: url('../fonts/poppins-600-devanagari.woff2') format('woff2');
  font-weight: 600; font-style: normal; font-display: swap;
  unicode-range: U+0900-097F, U+1CD0-1CF9, U+200C-200D, U+20A8, U+20B9, U+20F0, U+25CC, U+A830-A839, U+A8E0-A8FF, U+11B00-11B09;
}
@font-face {
  font-family: 'ARU Poppins';
  src: url('../fonts/poppins-600-latin-ext.woff2') format('woff2');
  font-weight: 600; font-style: normal; font-display: swap;
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: 'ARU Poppins';
  src: url('../fonts/poppins-600-latin.woff2') format('woff2');
  font-weight: 600; font-style: normal; font-display: swap;
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: 'ARU Poppins';
  src: url('../fonts/poppins-700-devanagari.woff2') format('woff2');
  font-weight: 700; font-style: normal; font-display: swap;
  unicode-range: U+0900-097F, U+1CD0-1CF9, U+200C-200D, U+20A8, U+20B9, U+20F0, U+25CC, U+A830-A839, U+A8E0-A8FF, U+11B00-11B09;
}
@font-face {
  font-family: 'ARU Poppins';
  src: url('../fonts/poppins-700-latin-ext.woff2') format('woff2');
  font-weight: 700; font-style: normal; font-display: swap;
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: 'ARU Poppins';
  src: url('../fonts/poppins-700-latin.woff2') format('woff2');
  font-weight: 700; font-style: normal; font-display: swap;
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

/* ── Libre Baskerville ── */
@font-face {
  font-family: 'ARU Baskerville';
  src: url('../fonts/libre-baskerville-regular-ext.woff2') format('woff2');
  font-weight: 400; font-style: normal; font-display: swap;
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: 'ARU Baskerville';
  src: url('../fonts/libre-baskerville-regular-latin.woff2') format('woff2');
  font-weight: 400; font-style: normal; font-display: swap;
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: 'ARU Baskerville';
  src: url('../fonts/libre-baskerville-italic-ext.woff2') format('woff2');
  font-weight: 400; font-style: italic; font-display: swap;
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: 'ARU Baskerville';
  src: url('../fonts/libre-baskerville-italic-latin.woff2') format('woff2');
  font-weight: 400; font-style: italic; font-display: swap;
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: 'ARU Baskerville';
  src: url('../fonts/libre-baskerville-700-latin-ext.woff2') format('woff2');
  font-weight: 700; font-style: normal; font-display: swap;
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: 'ARU Baskerville';
  src: url('../fonts/libre-baskerville-700-latin.woff2') format('woff2');
  font-weight: 700; font-style: normal; font-display: swap;
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}


/* ===================================================================
   WordPress safety note:
   The React pages sit on Tailwind's global preflight reset (bare *, a,
   img, button, ... selectors). In a WordPress page that reset would leak
   into the active theme, so every reset rule below is scoped to the
   `.aru-grant-root` wrapper the shortcodes output. The wrapper is matched
   via :where() so it adds ZERO specificity: the reset behaves like the
   bare element selectors it replaces and never out-ranks the page's own
   single-class rules (e.g. `.aru-accordion-btn` padding). Plain
   `.aru-grant-root button` would be (0,1,1) and wrongly beat that rule.
   The @font-face rules above are global (harmless). Their family names
   ('ARU Poppins', 'ARU Baskerville') are deliberately not 'Poppins' /
   'Libre Baskerville', so a host site's own registration of those
   families cannot win and change the weights.
   =================================================================== */

/* ── Reset (scoped to the grant pages only) ── */
:where(.aru-grant-root),
:where(.aru-grant-root) *,
:where(.aru-grant-root) *::before,
:where(.aru-grant-root) *::after {
  box-sizing: border-box;
  border-width: 0;
  border-style: solid;
}
:where(.aru-grant-root) {
  line-height: 1.5;
  -webkit-text-size-adjust: 100%;
  -moz-tab-size: 4;
  tab-size: 4;
  font-family: 'ARU Poppins', sans-serif;
  background-color: var(--aru-grant-cream);
}
:where(.aru-grant-root) h1,
:where(.aru-grant-root) h2,
:where(.aru-grant-root) h3,
:where(.aru-grant-root) h4,
:where(.aru-grant-root) h5,
:where(.aru-grant-root) h6 { font-size: inherit; font-weight: inherit; margin: 0; }
:where(.aru-grant-root) p,
:where(.aru-grant-root) blockquote,
:where(.aru-grant-root) figure,
:where(.aru-grant-root) pre { margin: 0; }
:where(.aru-grant-root) a { color: inherit; text-decoration: inherit; }
:where(.aru-grant-root) button {
  font-family: inherit; font-feature-settings: inherit; font-variation-settings: inherit;
  font-size: 100%; font-weight: inherit; line-height: inherit; letter-spacing: inherit;
  color: inherit; margin: 0; padding: 0; background-color: transparent; background-image: none;
  cursor: pointer; -webkit-appearance: button;
}
:where(.aru-grant-root) img,
:where(.aru-grant-root) svg,
:where(.aru-grant-root) video,
:where(.aru-grant-root) canvas { display: block; vertical-align: middle; }
:where(.aru-grant-root) img { max-width: 100%; height: auto; }
:where(.aru-grant-root) ul { margin: 0; padding: 0; }

/* ── Scroll-reveal (React: AruBaseStyles) ── */
.aru-reveal {
  opacity: 0;
  transform: translateY(24px);
  transition: opacity 0.7s cubic-bezier(0.16,1,0.3,1), transform 0.7s cubic-bezier(0.16,1,0.3,1);
}
.aru-reveal.aru-visible { opacity: 1; transform: translateY(0); }
.aru-d1 { transition-delay: 0.08s; }
.aru-d2 { transition-delay: 0.16s; }
.aru-d3 { transition-delay: 0.24s; }
.aru-d4 { transition-delay: 0.32s; }

/* ── Buttons ── */
.aru-cta-primary {
  transition: transform 0.2s ease, box-shadow 0.2s ease, filter 0.2s ease;
}
.aru-cta-primary:hover {
  transform: translateY(-3px) scale(1.03);
  box-shadow: 0 6px 18px color-mix(in srgb, var(--aru-grant-orange) 35%, transparent);
  filter: brightness(1.1);
}
.aru-cta-primary:active {
  transform: translateY(0) scale(0.98);
}

/* ── Step cards ── */
.aru-step-card {
  border: 1px solid rgba(255,255,255,0.07);
  transition: border-color 0.2s ease;
}
.aru-step-card:hover { border-color: color-mix(in srgb, var(--aru-grant-orange) 35%, transparent); }

/* ── Nav links ── */
.aru-nav-link { transition: opacity 0.18s ease; position: relative; text-decoration: none !important; }
.aru-nav-link::after {
  content: ''; position: absolute; bottom: -2px; left: 0; width: 0; height: 1px;
  background: var(--aru-grant-orange); transition: width 0.25s ease;
}
.aru-nav-link:hover { opacity: 1 !important; }
.aru-nav-link:hover::after { width: 100%; }

/* ── Footer (React: AruFooter) ── */
.aru-footer-nav-link { text-decoration: none !important; transition: color 0.2s ease; }
.aru-footer-nav-link:hover { color: var(--aru-grant-gold) !important; }
.aru-footer-social { transition: background-color 0.2s ease; }
.aru-footer-social:hover { background-color: var(--aru-grant-gold) !important; }
.aru-footer-donate {
  display: inline-block; padding: 8px 24px; border-radius: 6px; font-weight: 500;
  background-color: var(--aru-grant-gold); color: #000; text-decoration: none !important;
  transition: transform 0.2s ease;
}
.aru-footer-donate:hover { transform: scale(1.05) translateY(-2px); }
@media (max-width: 767px) {
  .aru-footer-grid { grid-template-columns: 1fr !important; }
  .aru-footer-wrap { padding: 40px 20px !important; }
  .aru-footer-bottom { padding: 16px 20px !important; }
}