h1{
    color: var(--title-color);

    font-family: var(--ff-title);
    font-size: var(--fs-title-2);
    font-weight: var(--fw-bold);
    letter-spacing: var(--ls-tight-2);
    line-height: var(--lh-title-2);
}


h2{
    color: var(--title-color);

    font-family: var(--ff-title);
    font-size: var(--fs-title-2);
    font-weight: var(--fw-bold);
    letter-spacing: var(--ls-tight-2);
    line-height: var(--lh-title-2);
}

@media screen and (max-width:480px) {
    h1,
    h2{
        font-size: var(--fs-title-3);
        letter-spacing: var(--ls-tight-3);
        line-height: var(--lh-title-3);
    }
}

h3{
    color: var(--primary-color);

    font-family: var(--ff-title);
    font-size: var(--fs-title-3);
    font-weight: var(--fw-bold);
    letter-spacing: var(--ls-tight-3);
    line-height: var(--lh-title-3);
}

@media screen and (max-width:480px) {
    h3{
        font-size: var(--fs-title-4);
        letter-spacing: var(--ls-tight-4);
        line-height: var(--lh-title-4);
    }
}

h4{
    color: var(--title-color);

    font-family: var(--ff-title);
    font-size: var(--fs-title-4);
    font-weight: var(--fw-bold);
    letter-spacing: var(--ls-tight-4);
    line-height: var(--lh-title-4);
}

@media screen and (max-width:480px) {
    h4{
        font-size: var(--fs-title-5);
        letter-spacing: -0.44px;
        line-height: 30px;
    }
}

h6{
    font-family: var(--ff-title);
    color:var(--title-color);
    font-size: var(--fs-text-sm-section);
    line-height: var(--lh-text-2);
    letter-spacing: var(--ls-tight-5);
}

h1 > span,
h2 > span, 
h3 > span, 
h4 > span, 
h5 > span, 
h6 > span{
    color:var(--primary-color);

}

p > span{
    color:var(--primary-color);
  
}


p,
li{
    color: var(--text-color);
  
    font-family: var(--ff-text);
    font-size: var(--fs-text-section);
    font-weight: var(--fw-regular);
    line-height: var(--lh-text-1);
}

p.big-container{
    max-width: var(--content-big-container);
}

h1.sm-container,
h2.sm-container,
h3.sm-container,
h4.sm-container,
h5.sm-container,
h6.sm-container,
p.sm-container{
    max-width: var(--content-sm-container);
}


p.small{
    color:var(--text-card-color);
    font-size: var(--fs-text-sm-section);
    line-height: var(--lh-text-2);
}

p > b{
    font-weight: var(--fw-bold);
}

li.white,
p.white{
    color: var(--text-card-color);
}

p.blue{
    color: var(--primary-color);
}

p.center{
    text-align: center;
}

@media screen and (max-width:480px) {
    p.center{
        text-align: left;
    }
}

.button{
    display: flex;
    padding: 16px 28px;
    justify-content: center;
    align-items: center;
    width: fit-content;
    align-self: stretch;

    border-radius: 16px;
    background: var(--primary-color-2);
    color: var(--text-color);
    /* navigation/button */
    font-family: Outfit;
    font-size: 20px;
    font-style: normal;
    font-weight: 500;
    line-height: 24px; /* 120% */
}

.flex {
  display: flex;
}
.flex-col {
  flex-direction: column;
}
.flex-row {
  flex-direction: row;
}
.center {
  align-items: center;
  justify-content: center;
}

.spaced {
  justify-content: space-between;
}

.nowrap {
  flex-wrap: nowrap;
}