@import url("https://fonts.googleapis.com/css2?family=Inter:ital,opsz,wght@0,14..32,100..900;1,14..32,100..900&display=swap");

:root {
  --primary-color: #7f6051;
  --secondary-color: #ffffff;
  --white: #ffffff;
  --white-op-2: rgba(255, 255, 255, 0.2);
  --black: #000000;
  --black-op-16: rgba(0, 0, 0, .16);
  --black-op-18: rgba(0, 0, 0, .18);
  --black-op-2: rgba(0, 0, 0, .2);
  --black-op-5: rgba(0, 0, 0, .5);
  --magic-mint: #aef2d7;
  --honeydew: #e5fdf3;
  --lavender-blush: #ffe9f1;
  --gainsboro: #dddddd;
  --dark-charcoal: #333333;
  --philippine-silver: #AEB4B9;
  --eerie-black: #181818;
  --anti-flash-white: #f3f3f3;
  --midnight-green: #08445e;
  --ghost-white: #f9fafb;
  --platinum: #e3e3e3;
  --bright-gray: #ebebeb;
  --light-silver: #d9d9d9;

  /* font size */
  --fs-14: 14px;
  --fs-16: 16px;
  --fs-18: 18px;
  --fs-20: 20px;
  --fs-22: 22px;
  --fs-24: 24px;
  --fs-26: 26px;
  --fs-28: 28px;
  --fs-30: 30px;
  --fs-32: 32px;
  --fs-40: 40px;
  --fs-48: 48px;
  --fs-56: 56px;
  --fs-70: 70px;
  --fs-128: 128px;
}

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

body {
  margin: 0;
  font-family: "Inter", sans-serif;
  font-size: 14px;
  line-height: 22px;
  font-weight: 400;
  overflow-x: hidden;
}

p,
li,
a,
span,
button,
input,
input::placeholder {
  font-family: "Inter", sans-serif;
}

h1,
h2,
h3,
h4,
h5,
h6 {
  font-family: "Inter", sans-serif;
}

.container {
  max-width: 1460px;
  width: 100%;
  padding: 0px 20px;
  margin: 0 auto;
}

.btn__button {
  font-size: var(--fs-16);
  line-height: 22px;
  font-weight: 500;
  color: var(--black);
  width: 100%;
  height: 40px;
  background-color: var(--white);
  padding: 0px 24px;
  border-radius: 40px;
  border: none;
  display: flex;
  align-items: center;
  justify-content: center;
}

.outline__btn {
  border: 1px solid var(--gainsboro);
  background-color: transparent;
}

.section__border_bottom__btn {
  font-size: var(--fs-18);
  line-height: 26px;
  font-weight: 600;
  color: var(--black);
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding-bottom: 10px;
  text-decoration: none;
  border-bottom: 1px solid var(--black);
}

.container_section_margin{
    margin-top: 62px;
}

.section__subtitle {
  font-size: var(--fs-14);
  line-height: 22px;
  font-weight: 600;
  color: var(--midnight-green);
  margin-bottom: 4px;
  text-transform: uppercase;
}

.section__title {
  font-size: var(--fs-28);
  line-height: 40px;
  font-weight: 700;
  color: var(--black);
}

.section__desc {
  font-size: var(--fs-14);
  line-height: 22px;
  font-weight: 400;
  color: var(--black);
}




@media (min-width: 768px) {
    .btn__button {
      height: 44px;
    }
  
    .section__subtitle {
      font-size: var(--fs-16);
      line-height: 24px;
      margin-bottom: 12px;
    }
  
    .section__title {
      font-size: var(--fs-32);
      line-height: 40px;
    }
  
    .section__desc {
      font-size: var(--fs-16);
      line-height: 24px;
    }
  
  
  }

  @media (min-width: 1120px) {
    .container_section_margin{
        margin-top: 72px;
    }
  }
  
  @media (min-width: 1460px) {
    .btn__button {
      height: 56px;
    }
  
    .section__title {
      font-size: var(--fs-48);
      line-height: 58px;
    }
  
  }