.hero__container {
    display: grid;
    grid-template-columns: 1fr;
    align-items: center;
    margin: 0 auto;
    padding: 0 9.6rem;
    max-width: 120rem;
    height: 70%;
    overflow-y:hidden;
}
.hero{
    overflow-y:hidden;
}
.hero__text-box {
    text-align: center;
    margin: 12.8rem auto 0;
}
.hero__title {
    font-size: 5.2rem;
    line-height: 1.35;
    font-weight: 700;
    margin-bottom: 3.2rem;
    color: #2563eb;
    text-shadow: 1px 1px 2px black;
}
.hero__description {
    font-size: 1.8rem;
    line-height: 1.5;
    color: #333;
    margin-bottom: 6.4rem;
    
}
.hero__btn-holder {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 1.2rem;
}
.hero__cta:link,
.hero__cta:visited {
    display: inline-block;
    text-decoration: none;
    background-color: #2563eb;
    color: #fff;
    border-radius: 11rem;
    padding: 2.4rem 4.8rem;
    font-size: 2rem;
    font-weight: 700;
    letter-spacing: 0.05rem;
    box-shadow: 0 0.4rem 0.8rem rgba(7, 20, 47, 0.2);
    transition: all 0.3s;
}
.hero__cta:hover,
.hero__cta:active {
    background-color: #1e4fbc;
    color: #fff;
    transform: scale(1.05);
}
.hero__btn:link,
.hero__btn:visited {
    display: inline-block;
    text-decoration: none;
    color: #444;
    border-radius: 11rem;
    padding: 2.4rem 4.8rem;
    font-size: 2rem;
    font-weight: 700;
    letter-spacing: 0.05rem;
    box-shadow: inset 0 0 0 2px rgb(68, 68, 68, 0.1);
    transition: all 0.3s;
}
.hero__btn:hover,
.hero__btn:active {
    color: #163b8d;
    box-shadow: inset 0 0 0 2px #2563eb;
}

/* ABOUT US SECTION */
.about-us {
    padding: 12.8rem 0;
}

.about-us__container {
    padding: 0 6.4rem;
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    align-items: center;
    justify-items: center;
    gap: 2.4rem;
}
.about-us__heading {
    font-size: 3.6rem;
    font-weight: 500;
    margin-bottom: 4.8rem;
    text-align: center;
    color: #3b73ed;
}
.about-us__text-box {
    display: flex;
    flex-direction: column;
    align-items: start;
    justify-content: center;
}
.about-us__description {
    font-size: 1.6rem;
    line-height: 2;
    margin-bottom: 3.2rem;
}
.about-us__btn-container {
    display: inline-block;
}
.about-us__btn:link,
.about-us__btn:visited {
    display: flex;
    align-items: center;
    justify-content: center;
    text-decoration: none;
    background-color: #2563eb;
    color: #fff;
    border-radius: 11rem;
    padding: 1.6rem 3.2rem;
    font-size: 2rem;
    font-weight: 500;
    letter-spacing: 0.05rem;
    transition: all 0.3s;
}
.about-us__btn:hover,
.about-us__btn:active {
    background-color: #1e4fbc;
    color: #fff;
}
.about-us__icon {
    width: 2.4rem;
    margin-left: 0.8rem;
}
.about-us__img-box img {
    width: 100%;
}

/* FEATURES SECTION */
.features {
    padding: 4.8rem 0 9.6rem;
    text-align: center;
}
.features__container {
    margin: 0 auto;
    padding: 0 6.4rem;
    gap: 2.4rem;
}
.features__heading {
    font-size: 3.6rem;
    font-weight: 500;
    margin-bottom: 4.8rem;
    color: #3b73ed;
}
.features__text-box {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    align-items: center;
    justify-content: center;
    gap: 4.8rem;
}
.features__icon {
    font-size: 3.2rem;
    margin-bottom: 2.4rem;
    background-color: #e9effd;
    border-radius: 50%;
    padding: 8px;
    color: #2159d4;
}
.features__title {
    font-size: 2.4rem;
    font-weight: 500;
    margin-bottom: 1.2rem;
    color: #5182ef;
}
.features__description {
    font-size: 1.4rem;
    line-height: 2;
}

/* PROJECTS */
.projects {
    padding: 9.6rem 0;
    
}
.projects__heading {
    font-size: 3.6rem;
    font-weight: 500;
    margin-bottom: 2.4rem;
    text-align: center;
    color: #3b73ed;
}
.projects__description {
    margin-bottom: 4.8rem;
    font-size: 1.8rem;
    text-align: center;
}
.projects__container {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 2.4rem;
    padding: 2.4rem;
}
.projects__box {
    max-width: 40rem;
    box-shadow: 0 2.4rem 4.8rem rgba(7, 20, 47, 0.1);
    border-radius: 11px;
    overflow: hidden;
    transition: all 0.3s;
}
.projects__box:hover {
    transform: translateY(-0.8rem);
    box-shadow: #000 5px 6px 15px;
}
.projects__text-box {
    padding: 2.4rem;
    text-align: center;
}
.projects__img-box {
    position: relative;
}
.projects__img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}
.overlay {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 1;
    box-shadow: #000 0px 6px 10px;
}
.projects__title {
    font-size: 2.4rem;
    font-weight: 500;
    margin-bottom: 2.4rem;
    text-align: start;
    color: #0f285e;
}
.projects__btn:link,
.projects__btn:visited {
    display: inline-block;
    text-decoration: none;
    background-color: #2563eb;
    color: #fff;
    border-radius: 11rem;
    padding: 1.2rem 2.4rem;
    font-size: 1.6rem;
    font-weight: 500;
    letter-spacing: 0.05rem;
    transition: all 0.3s;
}
.projects__btn:hover,
.projects__btn:active {
    background-color: #1e4fbc;
    color: #f1f1f1;
}

/* PACKAGES */
.packages {
    padding: 9.6rem 0;
    text-align: center;
}
.packages__heading {
    font-size: 3.6rem;
    font-weight: 500;
    margin-bottom: 2.4rem;
    color: #3b73ed;
}
.packages__description {
    margin-bottom: 4.8rem;
    font-size: 1.8rem;
}
.packages__container {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    grid-template-rows: repeat(2, 1fr);
    align-items: center;
    justify-items: right;
    gap: 3.2rem;
    padding: 0 12.8rem;
}
.packages__item {
    background-color: #fefefe;
    padding: 1.2rem;
    border-radius: 11px;
    box-shadow: 0 2.4rem 4.8rem rgba(7, 20, 47, 0.1);
    transition: all 0.3s;
    border: #92b1f5 solid 2px;
}
.packages__item:hover {
    transform: translateY(-0.8rem);
}
.packages__item-cta {
    padding: 1.2rem;
    border-radius: 11px;
    border: #1a45a5 solid 2px;
}

.packages__item-cta:hover{
    box-shadow: gray 10px 0px 18px;
}

.packages__icon_cta {
    font-size: 3.2rem;
    margin-bottom: 2.4rem;
    background-color: #e9effd;
    border-radius: 50%;
    padding: 8px;
    color: #1a45a5;
}

.packages__name_cta {
    font-size: 2rem;
    font-weight: 700;
    margin-bottom: 2.4rem;
    color: #1a45a5;
}

.packages__item--justify-left {
    justify-self: left;
}
.packages__icon {
    font-size: 3.2rem;
    margin-bottom: 2.4rem;
    background-color: #e9effd;
    border-radius: 50%;
    padding: 8px;
    color: #2563eb;
}
.packages__name {
    font-size: 2rem;
    font-weight: 700;
    margin-bottom: 2.4rem;
    color: #2159d4;
}
.packages__cta:link,
.packages__cta:visited {
    display: inline-block;
    text-decoration: none;
    background-color: #fff;
    color: #1a45a5;
    border-radius: 11rem;
    padding: 1.2rem 2.4rem;
    font-size: 1.8rem;
    font-weight: 500;
    letter-spacing: 0.05rem;
    transition: all 0.3s;
}
.packages__btn:link,
.packages__btn:visited {
    display: inline-block;
    text-decoration: none;
    color: #444;
    border-radius: 11rem;
    padding: 1.2rem 2.4rem;
    font-size: 1.8rem;
    font-weight: 500;
    letter-spacing: 0.05rem;
    transition: all 0.3s;
    color: #2563eb;
}
.packages__cta:hover{
    box-shadow: grey 5px 5px 5px;
}
.packages__cta:active {
    background-color: #1e4fbc;
    color: #fff;
}
.packages__btn:hover,
.packages__btn:active {
    background-color: #eee;
    box-shadow: #5182ef 3px 4px 7px;
}