/* 

------------- 01 TYPOGRAPHY SYSTEM

- Font Sizes(px):
10 / 12 / 14 / 16 / 18 / 20 / 24 / 30 / 36 / 44 / 52 / 62 / 74 / 86 / 98

- Font Weights:
Light: 300
Default: 400
Bold: 700
Extra-Bold: 900

- Line Heights:
Default: 1
Small: 1.05
Medium: 1.2
Paragraph Default: 1.6
Large: 1.8

- Letter Spacing:
-0.5px
0.75px

------------- 02 COLORS
- Primary: 
#fffffe
#ef6060

Accent:
#fde24f

Headline:
#00214d

Paragraph:
#1b2d45

Button:
#ff5470
#00ebc7
#00214d

Stroke:
#00214d

------------- 03 SHADOWS

box-shadow: 

------------- 04 BORDER RADIUS

Default: 
Medium: 

------------- 05 WHITESPACE

- Spacing System(px)
2 / 4 / 8 / 12 / 16 / 24 / 32 / 48 / 64 / 80 / 96 / 128
*/

*,
*::after,
*::before {
  margin: 0;
  padding: 0;
  box-sizing: inherit;
  text-decoration: none;
}

html {
  font-size: 62.5%;
  scroll-behavior: smooth;
  scroll-padding-top: 7.2rem;
}

body {
  box-sizing: border-box;
  line-height: 1;
  font-family: "Lato", sans-serif;
  font-size: 1.8rem;
  color: #1b2d45;
  background-color: #fffffe;
}

.page-container {
  position: relative;
  min-height: 100vh;
}

.content-wrap {
  padding-bottom: 12rem; /* Footer height */
}

*:focus {
  outline: none;
  box-shadow: 0 0 0 0.4rem rgba(255, 84, 112, 0.5);
}

.hero-description {
  max-width: 70rem;
}

/* ******************************** */
/*** GENERAL REUSABLE COMPONENTS ***/
/* ******************************** */

.heading-primary {
  color: #00214d;
  font-size: 5.2rem;
  line-height: 1.05;
  margin-bottom: 3.2rem;
  font-weight: 700;
}

.heading-secondary {
  color: #00214d;
  font-size: 4.4rem;
  margin-bottom: 6.8rem;
  font-weight: 700;
}

.container {
  max-width: 120rem;
  padding: 0 3.2rem;
  margin: 0 auto;
}

.txt-center {
  text-align: center;
  margin: 0 auto;
}

/* ******************************** */
/**** HELPER SETTINGS / CLASSES ****/
/* ******************************** */

.margin-right-sm {
  margin-right: 1.6rem !important;
}

.margin-bottom-md {
  margin-bottom: 4.8rem !important;
}

.margin-bottom-lg {
  margin-bottom: 6.4rem !important;
}

.margin-bottom-xl {
  margin-bottom: 9.8rem !important;
}

.margin-bottom-sm {
  margin-bottom: 2.4rem !important;
}

.margin-bottom-xs {
  margin-bottom: 1.2rem;
}

.center-text {
  text-align: center;
}