/* =========================================================
   THH LEGAL PAGES
   Privacy Policy + Terms & Conditions
========================================================= */

:root{

    --thh-blue:#04113a;
    --thh-blue-light:#0b1f63;

    --thh-gold:#FFD700;
    --thh-gold-soft:#ffeb8a;

    --thh-cyan:#76edfa;

    --thh-white:#ffffff;
    --thh-text:#dce4ff;
    --thh-muted:#aeb8d8;

    --glass-bg:rgba(255,255,255,0.07);
    --glass-border:rgba(255,255,255,0.12);

    --shadow-dark:
        0 20px 60px rgba(0,0,0,0.35);

    --shadow-gold:
        0 0 35px rgba(255,215,0,0.12);

    --radius-xl:32px;
    --radius-lg:24px;
    --radius-md:18px;

    --transition:all .35s ease;
}


/* =========================================================
   PAGE WRAPPER
========================================================= */

.legal-page{
    position:relative;

    min-height:100vh;

    padding-top:120px;
    padding-bottom:80px;
}

.legal-container{
    width:100%;
    max-width:1100px;

    margin:auto;

    padding-left:20px;
    padding-right:20px;
}

/* =========================================================
   HERO SECTION
========================================================= */

.legal-hero{

    position:relative;

    overflow:hidden;

    text-align:center;

    padding:60px 40px;

    border-radius:36px;

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

    backdrop-filter:blur(18px);
    -webkit-backdrop-filter:blur(18px);

    border:
        1px solid rgba(255,255,255,0.4);

    box-shadow:
        0 18px 50px rgba(0,0,0,0.08);

    margin-bottom:30px;
}


/* Glow */

.legal-hero::before{
    content:"";

    position:absolute;

    width:280px;
    height:280px;

    background:
        rgba(255,215,0,0.08);

    border-radius:50%;

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

    filter:blur(20px);
}

.legal-hero::after{
    content:"";

    position:absolute;

    width:240px;
    height:240px;

    background:
        rgba(118,237,250,0.08);

    border-radius:50%;

    bottom:-120px;
    left:-100px;

    filter:blur(20px);
}

/* =========================================================
   BADGE
========================================================= */

.legal-badge{

    position:relative;
    z-index:2;

    display:inline-flex;
    align-items:center;
    justify-content:center;

    padding:10px 20px;

    border-radius:999px;

    background:
        rgba(4,17,58,0.06);

    border:
        1px solid rgba(4,17,58,0.08);

    color:#04113a;

    font-size:13px;
    font-weight:700;

    letter-spacing:0.4px;

    margin-bottom:22px;

    box-shadow:
        0 6px 18px rgba(0,0,0,0.04);
}

/* =========================================================
   HERO TEXT
========================================================= */

.legal-hero h1{
    position:relative;
    z-index:2;

    margin:0 0 18px 0;

    font-size:3.3rem;
    line-height:1.1;
    font-weight:800;

    color:#04113a;
}

.legal-hero p{
    position:relative;
    z-index:2;

    max-width:760px;

    margin:auto;

    color:#55627f;

    font-size:1.08rem;
    line-height:1.8;
}

.legal-updated{
    position:relative;
    z-index:2;

    margin-top:26px;

    display:inline-block;

    padding:12px 20px;

    border-radius:18px;

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

    border:
        1px solid rgba(255,255,255,0.08);

    color:var(--thh-muted);

    font-size:13px;
    font-weight:600;
}

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

.legal-card{

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

    backdrop-filter:blur(18px);
    -webkit-backdrop-filter:blur(18px);

    border:
        1px solid rgba(255,255,255,0.5);

    border-radius:36px;

    padding:50px;

    box-shadow:
        0 18px 50px rgba(0,0,0,0.08);
}


/* =========================================================
   SECTION
========================================================= */

.legal-section{
    margin-bottom:42px;
}

.legal-section:last-child{
    margin-bottom:0;
}

/* =========================================================
   HEADINGS
========================================================= */

.legal-section h2{
    display:flex;
    align-items:center;

    gap:10px;

    margin-top:0;
    margin-bottom:18px;

    font-size:1.5rem;
    line-height:1.4;
    font-weight:700;

    color:#04113a;

}

/* =========================================================
   PARAGRAPH
========================================================= */

.legal-section p{
    margin-top:0;
    margin-bottom:18px;

    color:#55627f;

    font-size:15px;
    line-height:1.95;
}

/* =========================================================
   LISTS
========================================================= */

.legal-section ul{
    margin:0 0 18px 0;

    padding-left:22px;
}

.legal-section ul li{
    color:#55627f;

    margin-bottom:12px;

    line-height:1.8;

    font-size:15px;
}

/* =========================================================
   STRONG
========================================================= */

.legal-section strong{
    color:#04113a;
}

/* =========================================================
   LINKS
========================================================= */

.legal-section a{
    color:var(--thh-cyan);

    text-decoration:none;

    transition:var(--transition);
}

.legal-section a:hover{
    color:#04113a;

}

/* =========================================================
   DIVIDER EFFECT
========================================================= */

.legal-section{
    position:relative;
}

.legal-section::after{
    content:"";

    position:absolute;

    left:0;
    bottom:-22px;

    width:100%;
    height:1px;

    background:
        linear-gradient(
            90deg,
            transparent,
            rgba(0,0,0,0.06),
            transparent
        );
}

.legal-section:last-child::after{
    display:none;
}

/* =========================================================
   SCROLLBAR
========================================================= */

::-webkit-scrollbar{
    width:10px;
}

::-webkit-scrollbar-track{
    background:#06184c;
}

::-webkit-scrollbar-thumb{
    background:
        linear-gradient(
            180deg,
            var(--thh-gold),
            #c7a400
        );

    border-radius:999px;
}

/* =========================================================
   RESPONSIVE
========================================================= */

@media(max-width:992px){

    .legal-hero h1{
        font-size:2.7rem;
    }

    .legal-card{
        padding:40px;
    }
}

@media(max-width:768px){

    .legal-page{
        padding-top:90px;
        padding-bottom:50px;
    }

    .legal-container{
        padding-left:16px;
        padding-right:16px;
    }

    .legal-hero{
        padding:40px 24px;

        border-radius:28px;
    }

    .legal-hero h1{
        font-size:2.2rem;
    }

    .legal-hero p{
        font-size:15px;
        line-height:1.8;
    }

    .legal-card{
        padding:28px;

        border-radius:28px;
    }

    .legal-section h2{
        font-size:1.25rem;
    }

    .legal-section p,
    .legal-section ul li{
        font-size:14px;
        line-height:1.9;
    }
}

@media(max-width:480px){

    .legal-hero{
        padding:34px 20px;
    }

    .legal-hero h1{
        font-size:1.9rem;
    }

    .legal-card{
        padding:22px;
    }

    .legal-badge{
        font-size:12px;
        padding:9px 14px;
    }

    .legal-updated{
        width:100%;
    }
}