:root {
  --spacing: 0.25rem;
  --spacing-1: calc(var(--spacing) * 1);    /* 0.25rem | 4px */
  --spacing-2: calc(var(--spacing) * 2);    /* 0.5rem | 8px */
  --spacing-3: calc(var(--spacing) * 3);    /* 0.75rem | 12px */
  --spacing-4: calc(var(--spacing) * 4);    /* 1rem | 16px */
  --spacing-6: calc(var(--spacing) * 6);    /* 1.5rem | 24px */
  --spacing-8: calc(var(--spacing) * 8);    /* 2rem | 32px */
  --spacing-10: calc(var(--spacing) * 10);  /* 2.5rem | 40px */
  --spacing-15: calc(var(--spacing) * 15);  /* 3.75rem | 60px */
  --spacing-16: calc(var(--spacing) * 16);  /* 4rem | 64px */
  --spacing-20: calc(var(--spacing) * 20);  /* 5rem | 80px */
  --spacing-30: calc(var(--spacing) * 30);  /* 7.5rem | 120px */
  --spacing-60: calc(var(--spacing) * 60);  /* 15rem | 240px */

  --spacing-xxsm: var(--spacing-1);
  --spacing-sxm: var(--spacing-2);
  --spacing-sm: var(--spacing-4);
  --spacing-md1: var(--spacing-6);
  --spacing-md2: var(--spacing-8);
  --spacing-lg: var(--spacing-10);
  --spacing-xlg: var(--spacing-16);
  --spacing-xxlg: var(--spacing-20);
  --spacing-xxxlg: var(--spacing-30);
  --spacing-xxxxlg: var(--spacing-60);

  --primary: var(--skymiles-journal-page);
  --secondary: var(--white);
  --reverse: var(--dark-blue);
  --reverse-secondary: var(--delta-blue);
  --accent: var(--canyon-orange);
  --accent-reverse: var(--canyon-orange);
  --primary: var(--reserve-shade1);
  --secondary: var(--delta-blue);
  --subtle: #FFFFFF0D;
  --reverse: var(--skymiles-journal-page);
  --reverse-secondary: var(--reserve-shade4);
  --accent: var(--canyon-orange);
  --cta: var(--canyon-orange);
  --strong: var(--skymiles-journal-page);
  --subtle: var(--delta-blue);
  --reverse: var(--dark-blue);
  --reverse-subtle: var(--light-blue);
  --accent: var(--canyon-orange);
  --accent-reverse: var(--canyon-orange);

  --dark-blue: #0b253f;
  --skymiles-journal-page: #e3dcd2;
  --delta-blue: #003366;
  --delta-dark-red: #991933;
  --light-blue: #d1e7f2;
  --evergreen: #437e75;
  --canyon-orange: #c0402c;
  --gold-transit: #e1bd75;
  --reserve-shade1: #0b1b23;
  --reserve-shade2: #304246;
  --reserve-shade3: #42535d;
  --reserve-shade4: #788ea0;
  --platinum-shade1: #404040;
  --platinum-shade2: #6f7374;
  --platinum-shade3: #bec2c3;
  --platinum-shade4: #f6f8f9;
  --gold-shade1: #644919;
  --gold-shade2: #91723a;
  --gold-shade3: #cab078;
  --gold-shade4: #ffebb7;
  --blue-shade1: #204074;
  --blue-blue-shade2: #0b5ea2;
  --blue-blue-shade3: #0176b8;
  --blue-shade4: #61a2d5;
  --amex-white: #ffffff;
  --amex-blue: #006fcf;
  --amex-darkblue: #00175a;
  --amex-darkgrey: #333333;

  --font-primary: 'Whitney', sans-serif;
	--font-secondary: 'WhitneyCondense', sans-serif;
	--font-primary-amex: 'BentonSans', 'Helvetica Neue', Helvetica, sans-serif;
	--font-weight-default: 400;
	--font-weight-medium: 500;
	--font-weight-semibold: 600;
	--font-weight-bold: 700;
	--vertical-space: clamp(50px, 4.5vw, 80px);
	--width-lg: 2730px;

  --amex-onenav-height: 64px;
  --card-nav-height: 56px;
  /* Figma color tokens */

  --color-Primary-Delta-Blue: #003366;
  --color-Primary-Dark-Blue: #0B253F;
  --color-Primary-SkyMiles-Journal: #E3DCD2;
  --color-Primary-Light-Blue: #D1E7F2;

  --color-Secondary-Canyon-Orange: #C0402C;
  --text-icon-primary: var(--color-Primary-SkyMiles-Journal);
  --text-icon-secondary: var(--amex-white);
  --text-icon-reverse: var(--color-Primary-Dark-Blue);
  --text-icon-reverse-secondary: var(--color-Primary-Delta-Blue);
  --text-icon-accent: var(--color-Secondary-Canyon-Orange);
  --text-icon-accent-reverse: var(--color-Secondary-Canyon-Orange);

  --surface-primary: var(--reserve-shade1);
  --surface-secondary: var(--color-Primary-Delta-Blue);
  --surface-subtle: rgba(255, 255, 255, 0.05);
  --surface-reverse: var(--color-Primary-SkyMiles-Journal);
  --surface-reverse-secondary: var(--reserve-shade4);
  --surface-accent: var(--color-Secondary-Canyon-Orange);
  --surface-cta: var(--color-Secondary-Canyon-Orange);

  --stroke-strong: var(--color-Primary-SkyMiles-Journal);
  --stroke-subtle: var(--color-Primary-Delta-Blue);
  --stroke-reverse: var(--color-Primary-Dark-Blue);
  --stroke-reverse-subtle: var(--color-Primary-Light-Blue);
  --stroke-accent: var(--color-Secondary-Canyon-Orange);
  --stroke-accent-reverse: var(--color-Secondary-Canyon-Orange);
}
body {
  color: var(--text-icon-primary);
}
/* Navigation */


/* components */
  /* c-pagehero */
  .c-pagehero__bg {
    &::before {
      background: linear-gradient(to bottom, rgba(0, 51, 102, 0.00) 0%, #036 85%);
      content: '';
      position: absolute;
      inset: 0;
    }

    &::after {
      background: linear-gradient(77deg, #036 42.43%, rgba(11, 37, 63, 0.00) 86.65%);
      content: '';
      position: absolute;
      inset: 0;
      opacity: 0.56;
    }
  }

.c-card__new-tag {
  background: var(--surface-primary);
}

.c-footer__nav {
  margin-bottom: 0;
}

.c-terms {
  color: var(--amex-darkgrey);
}