* {
   padding: 0;
   margin: 0;
   box-sizing: border-box;
}

html {
   font-size: 62.5%;
   scroll-behavior: smooth;
   overflow-x: hidden;
}

body {
   font-family: 'outfit', sans-serif;
   line-height: 1;
   color: #555;
   overflow-x: hidden;
}

button {
   font-family: inherit;
}

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

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

.hidden {
   display: none;
}

/* HEADING */

.heading-primary {
   font-size: 5.2rem;
   text-transform: uppercase;
   margin-bottom: 4.8rem;
   line-height: 1.2;
}

.heading-primary-thin {
   margin-bottom: 8rem;
   font-weight: 600;
   letter-spacing: 1px;
}

.heading-secondary {
   font-size: 3rem;
   text-transform: uppercase;
   margin-bottom: 3.2rem;
   line-height: 1.2;
}

.heading-secondary-thin {
   font-weight: 400;
}

.heading-tertiary {
   font-size: 1.8rem;
   font-weight: 800;
   letter-spacing: 1.5px;
   margin-bottom: 1rem;
}

.heading-tertiary-thin {
   font-weight: 400;
   letter-spacing: 3px;
}

/* PARAGRAPH */

.paragraph-primary {
   font-size: 2.4rem;
   letter-spacing: 0.5px;
   line-height: 1.6;
}

.paragraph-secondary {
   font-size: 1.8rem;
   letter-spacing: 0.5px;
   line-height: 1.6;
}

/* -- GRID -- */

.grid {
   display: grid;
   gap: 8rem;
}

.grid--cols-2 {
   grid-template-columns: repeat(2, 1fr);
}

.grid--cols-3 {
   grid-template-columns: 3fr 0.1fr 4fr;
}

.no-gap {
   gap: 0;
}

/* -- HELPER CLASSES -- */

/* MARGIN */

.margin-b-s {
   margin-bottom: 2rem;
}

.margin-b-m {
   margin-bottom: 6rem;
}

.margin-b-l {
   margin-bottom: 9.6rem;
}

.margin-t-s {
   margin-top: 2rem;
}

.margin-t-m {
   margin-top: 8rem;
}

.margin-t-xl {
   margin-top: 9.6rem;
}

/* PADDING */

.padding-xl {
   padding: 12.8rem 0;
}

.padding-b-m {
   padding-bottom: 9.6rem;
}

.padding-b-xl {
   padding-bottom: 12.8rem;
}

.padding-t-xl {
   padding-top: 9.6rem;
}

/* BORDER */

.border-b {
   margin-bottom: 1.5rem;
   font-size: 2.8rem;
   display: block;
   padding-bottom: 1.5rem;
   border-bottom: 1px solid #555;
}
