:root{

    /* ======================================================
       BACKGROUND SURFACES
    ====================================================== */
    --surface-1:#FFFFFF;
    --surface-2:#F8FAFC;
    --surface-3:#EEF3FF;


    /* ======================================================
       BRAND
    ====================================================== */

    --brand-primary:#273076;

    --brand-secondary:#516AC8;

    --brand-accent:#F5C402;

/* ======================================================
   NAVBAR
====================================================== */

--navbar-background: var(--brand-accent);

--navbar-text: var(--brand-primary);

/* ------------------------------------------------------
   Brand
------------------------------------------------------ */

--navbar-brand: var(--brand-primary);

/* ------------------------------------------------------
   Navigation
------------------------------------------------------ */

--navbar-link: var(--brand-primary);

--navbar-link-hover: #1D2145;

/* Active menu item */

--navbar-link-active: #FFFFFF;

/* ------------------------------------------------------
   Pills
------------------------------------------------------ */

/* Hover background */

--navbar-hover-background: rgba(255,255,255,.35);

/* Active menu background */

--navbar-active-background: var(--brand-primary);

/* Active menu text */

--navbar-active-text: #FFFFFF;

/* ------------------------------------------------------
   Legacy (for backward compatibility)
------------------------------------------------------ */

--navbar-separator: rgba(39,48,118,.18);

--navbar-shadow: none;

/* ======================================================
   /NAVBAR END
====================================================== */

/* ======================================================
   HERO
====================================================== */

/* Background */

--hero-background: var(--brand-primary);

--hero-overlay:
linear-gradient(
    rgba(15,25,57,.45),
    rgba(15,25,57,.32)
);

--hero-image-position: 70% center;


/* Content */

--hero-content-width: 38rem;

--hero-text: #FFFFFF;

--hero-description: rgba(255,255,255,.92);


/* Title */

--hero-title-size: clamp(3rem,5vw,4.5rem);

--hero-title-weight: 800;


/* Badge */

--hero-badge-background: var(--brand-accent);

--hero-badge-text: var(--brand-primary);

--hero-badge-size: .9rem;

--hero-badge-weight: 700;

--hero-badge-padding: .5rem 1.5rem;

--hero-badge-radius: var(--radius-round);

/* ======================================================
   HERO END
====================================================== */

    /* ======================================================
      ACCORDION
    ====================================================== */

    --accordion-gap:2rem;

    --accordion-background:#FFFFFF;

    --accordion-border:rgba(15,23,42,.06);

    --accordion-border-hover:rgba(245,196,2,.25);

    --accordion-shadow:0 12px 30px rgba(15,23,42,.06);

    --accordion-shadow-hover:0 20px 40px rgba(15,23,42,.10);

    --accordion-radius:1.5rem;

    --accordion-padding:2rem;

    --accordion-heading-color:var(--brand-primary);

    --accordion-heading-font:inherit;

    --accordion-heading-size:1.35rem;

    --accordion-heading-weight:700;

    --accordion-text-color:#475467;

    --accordion-body-font:inherit;

    --accordion-body-weight:400;

    --accordion-line-height:1.9;

    --accordion-icon-color:var(--brand-accent);

    --accordion-icon-size:2rem;
   /* ======================================================
      CTA
   ====================================================== */

   --cta-background:var(--brand-accent);

   --cta-heading-color:var(--brand-primary);

   --cta-text-color:var(--brand-primary);

   --cta-button-background:var(--brand-primary);

   --cta-button-text:#FFFFFF;

   --cta-heading-font:inherit;

   --cta-body-font:inherit;

/* ======================================================
   BUTTON
====================================================== */

--button-font-family: inherit;

--button-font-weight: 600;

--button-radius: var(--radius-round);

/* ======================================================
   HERO BUTTONS
====================================================== */

--hero-button-primary-background: var(--brand-accent);

--hero-button-primary-text: var(--brand-primary);

--hero-button-primary-border: var(--brand-accent);

--hero-button-primary-hover-background: #FFD54A;

--hero-button-primary-hover-text: var(--brand-primary);

--hero-button-primary-hover-border: #FFD54A;

/* ------------------------------------------------------
   Primary
------------------------------------------------------ */

--button-primary-background: var(--brand-primary);

--button-primary-text: #FFFFFF;

--button-primary-border: var(--brand-primary);

--button-primary-hover-background: #1F2565;

--button-primary-hover-text: #FFFFFF;

--button-primary-hover-border: #1F2565;



/* ------------------------------------------------------
   Secondary
------------------------------------------------------ */

--button-secondary-background: transparent;

--button-secondary-text: var(--brand-primary);

--button-secondary-border: var(--brand-primary);

--button-secondary-hover-background: var(--brand-primary);

--button-secondary-hover-text: #FFFFFF;

--button-secondary-hover-border: var(--brand-primary);

/* ======================================================
   SECTION INTRO
====================================================== */

--section-badge-background: var(--brand-accent);

--section-badge-text: var(--brand-primary);

--section-title-color: var(--brand-primary);

--section-description-color: #475467;

}