/* =========================================================
   TERMS
========================================================= */

#terms {

    position: relative;

    overflow: hidden;

    padding: 110px 20px;

    background:

            radial-gradient(
                    circle at top,
                    rgba(124,45,18,0.12),
                    transparent 42%
            ),

            #f7ede4;
}

/* glow background */
#terms::before {

    content: "";

    position: absolute;

    top: -180px;
    right: -180px;

    width: 420px;
    height: 420px;

    border-radius: 50%;

    background:
            radial-gradient(
                    circle,
                    rgba(185,28,28,0.12),
                    transparent 70%
            );

    pointer-events: none;
}

/* =========================================================
   CARD
========================================================= */

.terms-card {

    position: relative;

    overflow: hidden;

    border-radius: 34px;

    padding: 54px;

    background:
            rgba(255,250,245,0.92);

    border:
            1px solid rgba(124,45,18,0.08);

    box-shadow:
            0 20px 55px rgba(124,45,18,0.10);
}

/* top glow */
.terms-card::before {

    content: "";

    position: absolute;

    top: -120px;
    right: -120px;

    width: 260px;
    height: 260px;

    border-radius: 50%;

    background:
            radial-gradient(
                    circle,
                    rgba(185,28,28,0.16),
                    transparent 70%
            );
}

/* =========================================================
   HEADER
========================================================= */

#terms h1 {

    color: #3b2416;

    font-size: 52px;

    font-weight: 700;

    line-height: 1.2;
}

#terms .text-muted {

    color: #8a6a58 !important;
}

#terms p {

    color: #5b3d2f;

    line-height: 1.9;

    font-size: 16px;
}

/* =========================================================
   TOC
========================================================= */

.terms-toc {

    padding: 28px 30px;

    border-radius: 24px;

    background:
            rgba(255,255,255,0.58);

    border:
            1px solid rgba(124,45,18,0.08);
}

.terms-toc h5 {

    color: #7c2d12;

    font-weight: 700;

    margin-bottom: 20px;
}

.terms-toc ul {

    margin: 0;
    padding: 0;

    list-style: none;
}

.terms-toc li {

    margin-bottom: 14px;
}

.terms-toc a {

    color: #5b3d2f;

    text-decoration: none;

    font-weight: 500;

    transition: 0.2s ease;
}

.terms-toc a:hover {

    color: #b91c1c;

    padding-left: 4px;
}

/* =========================================================
   TERMS ITEM
========================================================= */

.terms-item {

    margin-bottom: 52px;
}

.terms-item h3 {

    position: relative;

    display: inline-block;

    margin-bottom: 22px;

    color: #7c2d12;

    font-weight: 700;

    font-size: 30px;
}

/* underline accent */
.terms-item h3::after {

    content: "";

    position: absolute;

    left: 0;
    bottom: -8px;

    width: 55%;

    height: 4px;

    border-radius: 999px;

    background:
            linear-gradient(
                    90deg,
                    #7c2d12,
                    #b91c1c
            );
}

/* list */
.terms-item ul {

    margin-top: 18px;

    padding-left: 18px;
}

.terms-item li {

    margin-bottom: 12px;

    color: #5b3d2f;

    line-height: 1.8;
}

/* =========================================================
   FOOTER
========================================================= */

.terms-footer {

    margin-top: 70px;

    padding-top: 34px;

    border-top:
            1px solid rgba(124,45,18,0.10);
}

/* =========================================================
   BUTTON
========================================================= */

#terms .btn-dark {

    border: none;

    border-radius: 16px;

    background:
            linear-gradient(
                    135deg,
                    #7c2d12,
                    #b91c1c
            );

    box-shadow:
            0 10px 30px rgba(124,45,18,0.18);

    transition: 0.25s ease;
}

#terms .btn-dark:hover {

    transform: translateY(-2px);

    box-shadow:
            0 16px 38px rgba(124,45,18,0.22);
}

/* =========================================================
   MOBILE
========================================================= */

@media (max-width: 768px) {

    #terms {

        padding: 80px 0;
    }

    #terms .container {

        width: 90%;

        max-width: 90%;

        padding: 0;
    }

    .terms-card {

        border-radius: 28px;

        padding: 34px 24px;
    }

    #terms h1 {

        font-size: 34px;
    }

    .terms-item {

        margin-bottom: 42px;
    }

    .terms-item h3 {

        font-size: 24px;
    }

    .terms-toc {

        padding: 24px;
    }

    .terms-footer {

        margin-top: 50px;
    }

    #terms .btn-dark {

        width: 100%;
    }
}