/*
 * Brigen Consulting design tokens for the public site (UPGRADE-4 U4-R7): the admin's light tokens
 * (danang/assets/css/admin.css), the public type scale and spacing, and Barlow (SIL OFL,
 * assets/fonts/OFL.txt). The logo green carries white text (5.0:1); the lime is an accent only.
 */

@font-face { font-family: "Barlow"; font-style: normal; font-weight: 400; font-display: swap; src: url("../fonts/barlow-400.woff2") format("woff2"); }
@font-face { font-family: "Barlow"; font-style: normal; font-weight: 500; font-display: swap; src: url("../fonts/barlow-500.woff2") format("woff2"); }
@font-face { font-family: "Barlow"; font-style: normal; font-weight: 600; font-display: swap; src: url("../fonts/barlow-600.woff2") format("woff2"); }
@font-face { font-family: "Barlow"; font-style: normal; font-weight: 700; font-display: swap; src: url("../fonts/barlow-700.woff2") format("woff2"); }

/* Arial sized to Barlow's widths (measured in Edge, 2026-09-27: 96.1 % at 400, 90.7 % at 600, 91.5 % at
   700) and to its ascent and descent (1.00 and 0.20 em), so text keeps its line breaks when Barlow
   arrives and nothing shifts (U4-R12a: the home heading moved 31 px). */
@font-face { font-family: "Barlow Fallback"; font-weight: 400; src: local("Arial"), local("ArialMT"); size-adjust: 96.14%; ascent-override: 104.01%; descent-override: 20.8%; line-gap-override: 0%; }
@font-face { font-family: "Barlow Fallback"; font-weight: 500; src: local("Arial"), local("ArialMT"); size-adjust: 96.14%; ascent-override: 104.01%; descent-override: 20.8%; line-gap-override: 0%; }
@font-face { font-family: "Barlow Fallback"; font-weight: 600; src: local("Arial Bold"), local("Arial-BoldMT"); size-adjust: 90.66%; ascent-override: 110.3%; descent-override: 22.06%; line-gap-override: 0%; }
@font-face { font-family: "Barlow Fallback"; font-weight: 700; src: local("Arial Bold"), local("Arial-BoldMT"); size-adjust: 91.49%; ascent-override: 109.3%; descent-override: 21.86%; line-gap-override: 0%; }

:root {
    --bc-primary: #3b7a37;
    --bc-primary-hover: #2f6530;
    --bc-on-primary: #ffffff;
    --bc-primary-rgb: 59, 122, 55;
    --bc-brand: #8dc63f;
    --bc-brand-strong: #4a7a12;
    --bc-primary-soft: #e9f4dc;
    --bc-link: #2f6a2c;
    --bc-link-hover: #214d20;
    --bc-bg: #ffffff;
    --bc-bg-soft: #f4f6f1;
    --bc-surface: #ffffff;
    --bc-surface-raised: #ffffff;
    --bc-border: #dfe4d8;
    --bc-border-strong: #c5cebb;
    --bc-band: #1d3a1f;
    --bc-band-text: #eef5e6;
    --bc-input-border: #cdd5c4;
    --bc-text: #1b2119;
    --bc-muted: #5a6356;
    --bc-dark: #16201a;
    --bc-dark-text: #d7ddd2;
    --bc-focus: rgba(141, 198, 63, 0.45);
    /* The keyboard focus outline and ring: 3:1 or more against what is around it (DESIGN-UPGRADE
       D6a). The dark green on light surfaces (5.3:1 on white), the lime on dark ones. */
    --bc-focus-outline: #3b7a37;
    --bc-danger: #b42318;
    --bc-danger-bg: #fdecea;
    --bc-danger-text: #8a1c12;
    --bc-header-bg: rgba(255, 255, 255, 0.97);
    --bc-star-empty: #d5d9cf;
    --bc-link-rgb: 47, 106, 44;
    --bc-link-hover-rgb: 33, 77, 32;
    /* Depth: 1 at rest, 2 on hover and for panels, 3 for menus and dialogs. */
    --bc-shadow-1: 0 1px 2px rgba(20, 30, 15, 0.06);
    --bc-shadow-2: 0 1px 2px rgba(20, 30, 15, 0.04), 0 12px 32px rgba(20, 30, 15, 0.08);
    --bc-shadow-3: 0 1px 2px rgba(20, 30, 15, 0.04), 0 12px 32px rgba(20, 30, 15, 0.08);
    /* The names before DESIGN-UPGRADE D1, kept until D6. */
    --bc-shadow-sm: var(--bc-shadow-1);
    --bc-shadow-card: var(--bc-shadow-2);

    /* Type (DESIGN-UPGRADE D1): Barlow on a 1.25 scale, 13 to 48 px. */
    --bc-font: "Barlow", "Barlow Fallback", system-ui, -apple-system, "Segoe UI", sans-serif;
    --bc-text-xs: 0.8125rem;
    --bc-text-sm: 0.9375rem;
    --bc-text-md: 1.0625rem;
    --bc-text-lg: 1.25rem;
    --bc-h4: 1.1875rem;
    --bc-h3: clamp(1.3125rem, 1.2rem + 0.5vw, 1.5625rem);
    --bc-h2: clamp(1.625rem, 1.35rem + 1.2vw, 2.375rem);
    --bc-h1: clamp(2rem, 1.55rem + 1.9vw, 3rem);
    --bc-display: clamp(2rem, 1.3rem + 1.8vw, 3rem);
    /* The names before D1, kept until D6. */
    --bc-heading-2: var(--bc-h2);
    --bc-heading-1: var(--bc-h1);
    --bc-radius-lg: 16px;
    --bc-radius: 12px;
    --bc-radius-sm: 8px;
    /* The original's picture corners (DESIGN-UPGRADE §14.3a): framed pictures and the showcase. */
    --bc-radius-xs: 6px;
    --bc-radius-pill: 999px;
    /* Over a photo (the hero's caption and bar, picture carousels, the shine): the same in both
       themes, since the photo does not change with the theme. */
    --bc-on-photo: #ffffff;
    --bc-on-photo-muted: rgba(255, 255, 255, 0.9);
    --bc-photo-scrim-rgb: 8, 14, 9;
    --bc-shine: rgba(255, 255, 255, 0.4);
    /* Space: a 4 px scale. */
    --bc-space-1: 0.25rem;
    --bc-space-2: 0.5rem;
    --bc-space-3: 0.75rem;
    --bc-space-4: 1rem;
    --bc-space-5: 1.25rem;
    --bc-space-6: 1.5rem;
    --bc-space-8: 2rem;
    --bc-space-10: 2.5rem;
    --bc-space-12: 3rem;
    --bc-space-16: 4rem;
    --bc-card-pad: var(--bc-space-6);
    --bc-card-pad-sm: var(--bc-space-5);
    --bc-section: clamp(2.5rem, 1.75rem + 3vw, 4.5rem);
    --bc-header-height: 76px;

    /* Motion (DESIGN-UPGRADE D1): prefers-reduced-motion turns all of it off (site.css). */
    --bc-duration-fast: 150ms;
    --bc-duration: 250ms;
    --bc-duration-slow: 400ms;
    --bc-ease: cubic-bezier(0.2, 0.7, 0.2, 1);
    /* The original's fade-up (animate.css fadeInUp, 1 s), with a shorter rise (DESIGN-UPGRADE §14.3a). */
    --bc-duration-reveal: 1000ms;
    --bc-reveal-distance: 40px;
}

/* The dark theme (U4-R12a): the admin's dark values (danang/assets/css/admin.css), plus the public
   site's own. The logo lime carries dark text; photos keep white text in both themes. */
[data-bs-theme="dark"] {
    --bc-primary: #8dc63f;
    --bc-primary-hover: #a3d662;
    --bc-on-primary: #10200a;
    --bc-primary-rgb: 141, 198, 63;
    --bc-primary-soft: #1d2f14;
    --bc-brand-strong: #a6d66a;
    --bc-link: #a6d66a;
    --bc-link-hover: #c3e896;
    --bc-link-rgb: 166, 214, 106;
    --bc-link-hover-rgb: 195, 232, 150;
    --bc-bg: #10140f;
    --bc-bg-soft: #161c14;
    --bc-surface: #191e17;
    --bc-surface-raised: #1f261c;
    --bc-border: #2b3327;
    --bc-border-strong: #3d4836;
    --bc-band: #1d2f14;
    --bc-band-text: #e6ebe1;
    --bc-input-border: #3a4533;
    --bc-text: #e6ebe1;
    --bc-muted: #a2ab9b;
    --bc-dark: #0a0d09;
    --bc-dark-text: #c9d0c3;
    --bc-focus: rgba(141, 198, 63, 0.3);
    --bc-focus-outline: #8dc63f;
    --bc-danger: #f28b7f;
    --bc-danger-bg: #3a1512;
    --bc-danger-text: #ffc9c2;
    --bc-header-bg: rgba(16, 20, 15, 0.96);
    --bc-star-empty: #3a4533;
    --bc-shadow-1: 0 1px 2px rgba(0, 0, 0, 0.3);
    --bc-shadow-2: 0 1px 2px rgba(0, 0, 0, 0.3), 0 16px 40px rgba(0, 0, 0, 0.35);
    --bc-shadow-3: 0 1px 2px rgba(0, 0, 0, 0.3), 0 16px 40px rgba(0, 0, 0, 0.35);
    color-scheme: dark;
}

/* Bootstrap's variables, from ours, in both themes (Bootstrap's own [data-bs-theme] rules come
   first in the page, so these win). */
:root,
[data-bs-theme="light"],
[data-bs-theme="dark"] {
    --bs-body-font-family: var(--bc-font);
    --bs-body-font-size: var(--bc-text-md);
    --bs-body-line-height: 1.65;
    --bs-body-color: var(--bc-text);
    --bs-body-bg: var(--bc-bg);
    --bs-border-color: var(--bc-border);
    --bs-link-color: var(--bc-link);
    --bs-link-color-rgb: var(--bc-link-rgb);
    --bs-link-hover-color: var(--bc-link-hover);
    --bs-link-hover-color-rgb: var(--bc-link-hover-rgb);
    --bs-primary: var(--bc-primary);
    --bs-primary-rgb: var(--bc-primary-rgb);
    --bs-focus-ring-color: var(--bc-focus);
    --bs-border-radius: var(--bc-radius-sm);
    --bs-border-radius-lg: var(--bc-radius);
    --bs-emphasis-color: var(--bc-text);
    --bs-secondary-color: var(--bc-muted);
}