/* terms/style.css */

* {
    box-sizing: border-box;

    margin: 0;
    padding: 0;
}


body {

    min-height: 100vh;

    font-family:
        "Inter",
        "Segoe UI",
        Arial,
        sans-serif;

    background: #0f1117;

    color: #e6e6e6;

    line-height: 1.7;

}



/* =========================
   Header
========================= */


.page-header {

    padding: 50px 20px 35px;

    text-align: center;

}


.header-content {

    max-width: 900px;

    margin: auto;

}


.page-header h1 {

    font-size: 3rem;

    color: #ffffff;

    margin: 20px 0 10px;

    letter-spacing: -1px;

}


.page-header p {

    color: #a9adb8;

    font-size: 1.1rem;

}



/* =========================
   Back button
========================= */


.back-button {

    display: inline-block;

    background: #171a22;

    border: 1px solid #272c38;

    color: #e6e6e6;

    text-decoration: none;

    padding: 10px 18px;

    border-radius: 10px;

    font-weight: 600;

    transition:
        background .2s ease,
        transform .2s ease,
        border-color .2s ease;

}


.back-button:hover {

    background: #222735;

    border-color: #3d7cff;

    transform: translateY(-2px);

}



/* =========================
   Divider
========================= */


hr {

    border: none;

    height: 1px;

    background: #292d38;

    max-width: 1100px;

    margin: 20px auto;

}



/* =========================
   Legal Content
========================= */


main {

    padding: 0 20px;

}


.legal-page {

    max-width: 900px;

    margin: 45px auto;

    padding: 45px 50px;

    background: #171a22;

    border:

        1px solid #272c38;

    border-radius: 20px;


    animation:

        fadeIn .6s ease-out;

}



.legal-page > p:first-child {

    color: #8f95a3;

    margin-bottom: 35px;

}



/* =========================
   Typography
========================= */


.legal-page h2 {

    color: #ffffff;

    font-size: 1.7rem;

    margin-top: 40px;

    margin-bottom: 15px;

    letter-spacing: -.3px;

}


.legal-page h3 {

    color: #ffffff;

    font-size: 1.3rem;

    margin-top: 30px;

    margin-bottom: 10px;

}


.legal-page p {

    color: #b6bbc7;

    margin-bottom: 18px;

}



/* =========================
   Lists
========================= */


.legal-page ul {

    margin:

        15px 0 25px 25px;

}


.legal-page li {

    color: #b6bbc7;

    margin-bottom: 8px;

}


.legal-page li::marker {

    color: #3d7cff;

}



/* =========================
   Links
========================= */


.legal-page a {

    color: #60a5fa;

    text-decoration: none;

    font-weight: 600;

    position: relative;

    display: inline-block;

}


.legal-page a::after {

    content: "";

    position: absolute;

    left: 50%;

    bottom: -3px;

    width: 0;

    height: 2px;

    background:

        linear-gradient(
            90deg,
            #3d7cff,
            #60a5fa
        );

    border-radius: 10px;

    transform:

        translateX(-50%);

    transition:

        width .3s ease;

}


.legal-page a:hover {

    color: #93c5fd;

}


.legal-page a:hover::after {

    width: 100%;

}

.legal-page a.external::before {

    content: "↗ ";

    font-size: .85em;

}

/* Date box */

.legal-meta {

    background: #0f1117;

    border:

        1px solid #272c38;


    padding: 14px 18px;

    border-radius: 12px;


    margin-bottom: 25px;

}



/* =========================
   Footer
========================= */


footer {

    text-align: center;

    color: #8b8f99;

    padding: 30px 20px;

}


footer p {

    margin-top: 20px;

}



/* =========================
   Animation
========================= */


@keyframes fadeIn {

    from {

        opacity: 0;

        transform:

            translateY(15px);

    }


    to {

        opacity: 1;

        transform:

            translateY(0);

    }

}



/* =========================
   Mobile
========================= */


@media (max-width: 700px) {


    .page-header h1 {

        font-size: 2.2rem;

    }


    .legal-page {

        padding: 30px 25px;

        border-radius: 16px;

    }


    .legal-page h2 {

        font-size: 1.45rem;

    }

}