:root {
  /* Font Families */
  --font-family-feature: 'Varela Round', "Helvetica Neue", Arial, sans-serif;
  --font-family-body: 'Open Sans', "Helvetica Neue", Arial, sans-serif;

  /* Container Sizes */
  --container-max-width-xl: 1400px;

  /* Base Colors */
  --gray: #000;
  --brand-default: #151d41;
  --brand-feature: #f75069;
  --brand-primary: var(--brand-feature);
  --brand-secondary: var(--brand-default);

  /* Brand Primary Hover Shades */
  --brand-primary-90: #de485f; /* 90% of primary - slightly darker */
  --brand-primary-80: #c64054; /* 80% of primary - medium darker */
  --brand-primary-70: #ad384a; /* 70% of primary - darker for gradient end */
  
  /* Blog Modern Quote Box */
  --blog-modern-quote-box-base-color-light-52: #8a92a5; /* Lightened 52% from #151d41 */

  /* RGB values for transparency (CRITICAL for glassmorphic effects!) */
  --brand-default-rgb: 21, 29, 65;       /* #151d41 */
  --brand-primary-rgb: 247, 80, 105;     /* #f75069 */
  --brand-secondary-rgb: 21, 29, 65;     /* #151d41 */
  --navbar-text-color-rgb: 21, 29, 65;   /* #151d41 - using brand-default */

  /* Footer */
  --footer-bg: var(--brand-default);
  --footer-menu-padding: 20px 0px;

  /* Subscription Banner - 20% lighter than footer */
  --subscription-banner-bg-dark-10: #f97387;

  /* Logo Sizes */
  --logo-max-width-xs: 180px;
  --logo-max-width-sm: 180px;
  --logo-max-width-md: 200px;
  --logo-max-width-lg: 220px;
  --logo-max-width-xl: 220px;

  /* Navbar Styles */
  --navbar-text-color: var(--brand-default);
  --navbar-text-color-active-with-background: var(--brand-feature);
  --navbar-text-color-active: var(--brand-feature);
  --navbar-font-weight-active: 700;
  --navbar-btn-bg: var(--brand-feature);
  --navbar-font-weight: 400;
  --navbar-font-size-lg: 1.1rem;
  --navbar-font-size-md: 1rem;
  --navbar-text-color-with-background-scrolled: white;
  --navbar-bg-with-background-scrolled: var(--brand-default);

  /* Jumbotron Styles */
  --jumbotron-font-size-h1: 2.8rem;
  --jumbotron-font-size-lead: 1.4rem;
  --jumbotron-overlay-font-weight: 700;
  --jumbotron-banner-padding: 7.5rem 0 2.5rem;
  --jumbotron-text-alignment: left;
  --jumbotron-overlay-color-opacity: 0.7;
  --jumbotron-overlay-font-color: var(--brand-default);
  --jumbotron-min-height-desktop: 80vh;
  --jumbotron-min-height-mobile: 0;
  --jumbotron-margin-bottom-sm: 0px;
  --jumbotron-banner-top-margin: -65px;

  /* Gallery */
  --gallery-image-background-size: contain;

  /* Typography */
  --font-weight-base: 400;
  --h1-font-color: var(--brand-default);
  --h2-font-color: var(--brand-default);
  --h3-font-color: var(--brand-default);
  --link-weight: 700;

  /* Search Page */
  --search-landing-page-margin-top: 80px;

  /* Button Colors */
  --btn-primary-font-color: white;
  --btn-secondary-font-color: white;
  --btn-feature-font-color: white;

  /* Chat Styles */
  --chat-padding-top-xl: 64px;
  --chat-padding-top-lg: 64px;
  --chat-padding-top-sm: 52px;
  --chat-feature-color: var(--brand-primary);
  --chat-feature-color-50: #fba8b5; /* Lightened 50% from #f75069 */
  --chat-feature-color-light: #cfd1dc;
  /* Lightened 70% from #151d41 */

  /* Bootstrap RGB Values - Using Brand Colors */
  --bs-primary-rgb: 247, 80, 105;
  /* Using brand-primary/feature #f75069 */
  --bs-secondary-rgb: 21, 29, 65;
  /* Using brand-secondary/default #151d41 */
  --bs-danger-rgb: 21, 29, 65;
  /* Using brand-default #151d41 */

  /* Bootstrap 5 Variable Overrides */
  --bs-font-family-sans-serif: var(--font-family-body);
  --bs-font-family-base: var(--font-family-body);
  --bs-font-size-base: 1rem;
  --bs-font-weight-base: var(--font-weight-base);
  --bs-font-weight-semibold: 600;
  --bs-font-weight-bold: 700;
  --bs-line-height-base: 1.5;

  --bs-primary: var(--brand-primary);
  --bs-secondary: var(--brand-secondary);
  --bs-body-color: var(--gray);
  --bs-body-color-rgb: 0, 0, 0;

  --bs-link-color: var(--brand-primary);
  --bs-link-color-rgb: 247, 80, 105;
  --bs-link-hover-color: var(--brand-secondary);
  --bs-link-hover-color-rgb: 21, 29, 65;

  --bs-heading-color: var(--brand-default);
}