:root {
  --color-dark: #062f3c;
  --color-light-gray: #edebe8;
  --color-white: #ffffff;
  --color-primary: #ff5e2c;
}

html {
    scroll-behavior: smooth;
}


/* =========================
   Campton Font Setup
========================= */

@font-face {
  font-family: 'Campton';
  src: url('../fonts/CamptonLight.otf') format('opentype');
  font-weight: 300;
  font-style: normal;
}

@font-face {
  font-family: 'Campton';
  src: url('../fonts/CamptonMedium.otf') format('opentype');
  font-weight: 500;
  font-style: normal;
}

@font-face {
  font-family: 'Campton';
  src: url('../fonts/CamptonBold.otf') format('opentype');
  font-weight: 700;
  font-style: normal;
}

/* Base */
body {
  background-color: var(--color-white);
  color: var(--color-dark);
  font-family: 'Campton', sans-serif;
}

/* Botón primary personalizado */
.btn-primary {
    background-color: var(--color-primary);
    border: 1px solid var(--color-primary);
}

h1, h2 {
  font-weight: 700;
}

p {
  font-weight: 300;
}

/* Botón */
.btn{
    border-radius: 999px !important;
    padding-top: 0.65rem;
}

.btn-primary {
    background-color: var(--color-primary);
    border-color: var(--color-primary);
    font-weight: 500;
}

.btn-primary:hover {
  background-color: var(--color-primary);
  border-color: var(--color-primary);
}

@media (max-width: 768px) {
    body{
        padding: 0 0.75rem;
    }
}