/* =========================================================
   REMOTE ROLES - PRIVACY POLICY DARK THEME
   PART 1/2
========================================================= */

:root{

    --bg:#0a0a0a;
    --surface:#111111;
    --surface-2:#171717;

    --border:#2d2d2d;

    --text:#fafafa;
    --muted:#a1a1aa;

    --primary:#8b5cf6;
    --primary2:#6366f1;

    --success:#22c55e;
}

body{

    background:
    radial-gradient(circle at top right,#312e81 0%,transparent 30%),
    linear-gradient(180deg,#0a0a0a,#111111);

    color:var(--text);
}

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

.nm-privacy-page{

    max-width:1180px;

    margin:0 auto;

    padding:0 20px 80px;
}

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

.nm-privacy-hero{

    position:relative;

    overflow:hidden;

    background:#171717;

    border:1px solid #2d2d2d;

    border-radius:24px;

    padding:75px 60px;

    margin:35px 0 50px;

    box-shadow:
    0 25px 70px rgba(0,0,0,.35);
}

.nm-privacy-overlay{

    position:absolute;

    inset:0;

    background:
    radial-gradient(
        circle at top right,
        rgba(139,92,246,.18),
        transparent 35%
    );

    pointer-events:none;
}

.nm-privacy-hero-content{

    position:relative;

    z-index:2;

    max-width:900px;
}

.nm-privacy-tag{

    display:inline-flex;

    align-items:center;

    padding:9px 16px;

    border-radius:999px;

    background:
    rgba(139,92,246,.15);

    border:
    1px solid rgba(139,92,246,.30);

    color:#c4b5fd;

    font-size:13px;

    font-weight:700;

    margin-bottom:24px;
}

.nm-privacy-hero h1{

    font-size:56px;

    line-height:1.08;

    font-weight:800;

    color:#fff;

    margin-bottom:24px;

    letter-spacing:-1px;
}

.nm-privacy-hero p{

    font-size:18px;

    line-height:1.95;

    color:#d4d4d8;

    max-width:820px;
}

.nm-privacy-date{

    margin-top:28px;

    font-size:14px;

    color:#a1a1aa;

    font-weight:600;
}

/* =========================================================
   CONTENT WRAPPER
========================================================= */

.nm-privacy-content{

    max-width:920px;

    margin:0 auto;
}

/* =========================================================
   CONTENT CARDS
========================================================= */

.nm-privacy-card{

    background:#171717;

    border:1px solid #2d2d2d;

    border-radius:20px;

    padding:40px;

    margin-bottom:24px;

    box-shadow:
    0 15px 40px rgba(0,0,0,.25);

    transition:.25s ease;
}

.nm-privacy-card:hover{

    border-color:#6366f1;
}

.nm-privacy-card h2{

    font-size:31px;

    line-height:1.25;

    font-weight:800;

    color:#fff;

    margin-bottom:22px;
}

.nm-privacy-card h3{

    font-size:22px;

    line-height:1.4;

    font-weight:700;

    color:#a78bfa;

    margin:
    28px
    0
    14px;
}

.nm-privacy-card p{

    font-size:16px;

    line-height:2;

    color:#d4d4d8;

    margin-bottom:18px;
}

.nm-privacy-card ul{

    padding-left:22px;

    margin-bottom:16px;
}

.nm-privacy-card li{

    font-size:16px;

    line-height:1.95;

    color:#d4d4d8;

    margin-bottom:10px;
}

.nm-privacy-card li::marker{

    color:#8b5cf6;
}

/* =========================================================
   CONTACT BOX
========================================================= */

.nm-privacy-contact{

    background:#171717;

    border:1px solid #2d2d2d;

    border-radius:20px;

    padding:45px;

    text-align:center;

    box-shadow:
    0 15px 40px rgba(0,0,0,.25);
}

.nm-privacy-contact h2{

    font-size:34px;

    line-height:1.2;

    font-weight:800;

    color:#fff;

    margin-bottom:18px;
}

.nm-privacy-contact p{

    font-size:16px;

    line-height:1.9;

    color:#d4d4d8;

    margin-bottom:20px;
}

.nm-privacy-contact a{

    display:inline-block;

    color:#a78bfa;

    font-size:20px;

    font-weight:700;

    text-decoration:none;

    margin-bottom:20px;
}

.nm-privacy-contact a:hover{

    color:#c4b5fd;

    text-decoration:underline;
}

.nm-privacy-company{

    font-size:14px;

    color:#a1a1aa;

    line-height:1.9;
}

/* =========================================================
   TABLET
========================================================= */

@media(max-width:992px){

    .nm-privacy-hero{

        padding:55px 38px;
    }

    .nm-privacy-hero h1{

        font-size:44px;
    }

    .nm-privacy-card{

        padding:34px;
    }

}

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

@media(max-width:768px){

    .nm-privacy-page{

        padding:0 14px 50px;
    }

    .nm-privacy-hero{

        padding:42px 22px;

        border-radius:16px;

        margin:22px 0 35px;
    }

    .nm-privacy-tag{

        font-size:12px;
    }

    .nm-privacy-hero h1{

        font-size:34px;

        line-height:1.15;
    }

    .nm-privacy-hero p{

        font-size:15px;

        line-height:1.9;
    }

    .nm-privacy-card{

        padding:28px 22px;

        border-radius:16px;
    }

    .nm-privacy-card h2{

        font-size:26px;
    }

    .nm-privacy-card h3{

        font-size:20px;
    }

    .nm-privacy-card p,
    .nm-privacy-card li{

        font-size:15px;

        line-height:1.9;
    }

    .nm-privacy-contact{

        padding:32px 22px;

        border-radius:16px;
    }

    .nm-privacy-contact h2{

        font-size:28px;
    }

    .nm-privacy-contact a{

        font-size:17px;

        word-break:break-word;
    }

}

/* =========================================================
   PREMIUM ACCENTS
========================================================= */

.nm-privacy-card strong,
.nm-privacy-contact strong{

    color:#ffffff;
}

.nm-privacy-card a{

    color:#a78bfa;

    text-decoration:none;
}

.nm-privacy-card a:hover{

    color:#c4b5fd;
}

.nm-privacy-card::before{

    content:"";

    display:block;

    width:60px;

    height:3px;

    margin-bottom:22px;

    border-radius:999px;

    background:
    linear-gradient(
        90deg,
        #8b5cf6,
        #6366f1
    );
}