 
  /*==================================================
PRIVACY POLICY
Premium Design System
==================================================*/

:root{

--primary:#2563eb;
--primary-dark:#1d4ed8;

--background:#f5f7fb;
--card:#ffffff;

--border:#e5e7eb;

--text:#111827;
--muted:#6b7280;

--radius:18px;

--shadow:
0 8px 24px rgba(15,23,42,.06);

--transition:.25s;

}

body{

background:var(--background);
font-family:'Inter',sans-serif;
color:var(--text);

}

/*==================================================
PAGE
==================================================*/

.privacy-page{

padding:32px 0 60px;

}

/*==================================================
HERO
==================================================*/

.privacy-hero{

display:flex;
align-items:center;
gap:24px;

padding:32px;

background:#fff;

border:1px solid var(--border);

border-radius:24px;

box-shadow:var(--shadow);

margin-bottom:26px;

}

.privacy-hero-icon{

width:90px;
height:90px;

display:flex;
align-items:center;
justify-content:center;

font-size:42px;

border-radius:50%;

background:#edf5ff;

flex-shrink:0;

}

.privacy-badge{

display:inline-flex;

padding:5px 12px;

border-radius:999px;

background:#eef4ff;

color:var(--primary);

font-size:12px;

font-weight:700;

margin-bottom:12px;

}

.privacy-hero h1{

margin:0;

font-size:34px;

font-weight:800;

}

.privacy-last-updated{

margin:12px 0;

font-size:14px;

color:var(--muted);

}

.privacy-introduction{

margin:0;

font-size:15px;

line-height:1.8;

color:#374151;

max-width:850px;

}

/*==================================================
CONTENT
==================================================*/

.privacy-content{

display:flex;
flex-direction:column;
gap:22px;

}

.privacy-section{

background:#fff;

border:1px solid var(--border);

border-radius:20px;

padding:24px;

box-shadow:var(--shadow);

animation:fadeUp .35s ease;

}

.privacy-section h2{

font-size:24px;

font-weight:800;

margin-bottom:10px;

}

.privacy-section>p{

margin-bottom:20px;

color:var(--muted);

line-height:1.8;

}

/*==================================================
CARD
==================================================*/

.privacy-card{

background:#fafcff;

border:1px solid #e7eefc;

border-radius:16px;

padding:18px;

margin-bottom:18px;

transition:var(--transition);

}

.privacy-card:last-child{

margin-bottom:0;

}

.privacy-card:hover{

transform:translateY(-3px);

box-shadow:
0 10px 24px rgba(15,23,42,.08);

}

.privacy-card-header{

display:flex;

align-items:flex-start;

gap:16px;

margin-bottom:18px;

}

.privacy-card-icon{

width:48px;
height:48px;

display:flex;
align-items:center;
justify-content:center;

font-size:22px;

border-radius:14px;

background:#eef4ff;

flex-shrink:0;

}

.privacy-card-header h3{

margin:0 0 4px;

font-size:18px;

font-weight:700;

}

.privacy-card-header p{

margin:0;

font-size:14px;

color:var(--muted);

}

/*==================================================
LIST
==================================================*/

.privacy-list{

margin:0;
padding-left:20px;

display:grid;

gap:10px;

}

.privacy-list li{

line-height:1.7;

color:#374151;

}

/*==================================================
NOTE
==================================================*/

.privacy-note{

margin-top:18px;

padding:16px 18px;

background:#f8fbff;

border-left:4px solid var(--primary);

border-radius:12px;

font-size:14px;

line-height:1.8;

}

/*==================================================
CONTACT
==================================================*/

.privacy-contact-card{

background:#fafcff;

border:1px solid #e7eefc;

border-radius:16px;

padding:20px;

}

.privacy-contact-card h3{

margin-bottom:16px;

font-size:22px;

font-weight:700;

}

.privacy-contact-card p{

margin-bottom:10px;

}

.privacy-contact-card p:last-child{

margin-bottom:0;

}

.privacy-contact-card a{

color:var(--primary);

text-decoration:none;

font-weight:600;

}

.privacy-contact-card a:hover{

text-decoration:underline;

}

/*==================================================
FOOTER
==================================================*/

.privacy-footer{

margin-top:34px;

padding:20px;

text-align:center;

color:var(--muted);

font-size:14px;

}

/*==================================================
SCROLLBAR
==================================================*/

::-webkit-scrollbar{

width:9px;

}

::-webkit-scrollbar-track{

background:#edf2f7;

}

::-webkit-scrollbar-thumb{

background:#cbd5e1;

border-radius:30px;

}

::-webkit-scrollbar-thumb:hover{

background:#94a3b8;

}

/*==================================================
ANIMATIONS
==================================================*/

@keyframes fadeUp{

from{

opacity:0;

transform:
translateY(10px);

}

to{

opacity:1;

transform:
translateY(0);

}

}

/*==================================================
RESPONSIVE
==================================================*/

@media(max-width:992px){

.privacy-hero{

flex-direction:column;

align-items:flex-start;

padding:24px;

}

.privacy-hero h1{

font-size:30px;

}

}

@media(max-width:768px){

.privacy-page{

padding:20px 0 40px;

}

.privacy-section{

padding:18px;

}

.privacy-hero{

padding:20px;

gap:18px;

}

.privacy-hero-icon{

width:72px;
height:72px;

font-size:34px;

}

.privacy-hero h1{

font-size:26px;

}

.privacy-card{

padding:16px;

}

.privacy-card-header{

gap:12px;

}

.privacy-card-icon{

width:42px;
height:42px;

font-size:20px;

}

.privacy-card-header h3{

font-size:17px;

}

.privacy-section h2{

font-size:22px;

}

}

@media(max-width:576px){

.privacy-page{

padding:16px 0 32px;

}

.privacy-hero{

padding:18px;

border-radius:18px;

}

.privacy-section{

padding:16px;

border-radius:16px;

}

.privacy-card{

padding:14px;

}

.privacy-list{

gap:8px;

}

.privacy-list li{

font-size:14px;

}

.privacy-note{

padding:14px;

font-size:13px;

}

.privacy-contact-card{

padding:16px;

}

}  
    