/*==================================
  ELEPAY OFFICIAL WEBSITE
  Premium Responsive CSS
==================================*/

*{
    margin:0;
    padding:0;
    box-sizing:border-box;
}

html{
    scroll-behavior:smooth;
}

body{
    font-family:'Poppins',sans-serif;
    background:#08111f;
    color:#fff;
    line-height:1.7;
    overflow-x:hidden;
}

img{
    max-width:100%;
    display:block;
}

a{
    text-decoration:none;
}

ul{
    list-style:none;
}

/*==========================
Container
===========================*/

.container{
    width:92%;
    max-width:1200px;
    margin:auto;
}

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

.header{

    position:fixed;
    top:0;
    left:0;
    width:100%;
    z-index:999;

    background:rgba(10,18,35,.85);

    backdrop-filter:blur(18px);

    border-bottom:1px solid rgba(255,255,255,.08);

}

.header .container{

    display:flex;

    justify-content:space-between;

    align-items:center;

    height:80px;

}

/*==========================
Logo
===========================*/

.logo{

display:flex;

align-items:center;

gap:12px;

}

.logo img{

width:55px;

height:55px;

border-radius:15px;

box-shadow:0 0 20px rgba(30,136,229,.4);

}

.logo h2{

font-size:22px;

font-weight:700;

color:#fff;

}

/*==========================
Navigation
===========================*/

nav ul{

display:flex;

gap:30px;

}

nav ul li a{

color:white;

font-weight:500;

transition:.3s;

}

nav ul li a:hover{

color:#53b6ff;

}

/*==========================
Mobile Menu Button
===========================*/

.menu-btn{

display:none;

font-size:34px;

cursor:pointer;

color:white;

}

/*==========================
Hero
===========================*/

.hero{

padding-top:150px;

padding-bottom:80px;

}

.hero-grid{

display:grid;

grid-template-columns:1fr 1fr;

align-items:center;

gap:60px;

}

.badge{

display:inline-block;

padding:8px 20px;

background:linear-gradient(90deg,#1e88e5,#00b0ff);

border-radius:40px;

font-size:14px;

margin-bottom:20px;

}

.hero h1{

font-size:52px;

line-height:1.2;

margin-bottom:20px;

}

.hero p{

font-size:18px;

color:#d6d6d6;

margin-bottom:35px;

}

/*==========================
Buttons
===========================*/

.hero-buttons{

display:flex;

flex-wrap:wrap;

gap:15px;

}

.btn{

padding:15px 30px;

border-radius:50px;

font-weight:600;

transition:.4s;

display:inline-block;

}

.primary{

background:linear-gradient(90deg,#1565c0,#42a5f5);

color:white;

}

.secondary{

background:#ffc107;

color:#000;

}

.telegram{

background:#00a8ff;

color:white;

}

.btn:hover{

transform:translateY(-4px);

box-shadow:0 12px 30px rgba(0,0,0,.35);

}

/*==========================
Hero Image
===========================*/

.hero-image{

display:flex;

justify-content:center;

}

.hero-image img{

width:380px;

border-radius:35px;

box-shadow:

0 0 40px rgba(30,136,229,.35);

animation:float 5s ease-in-out infinite;

}

@keyframes float{

0%{

transform:translateY(0);

}

50%{

transform:translateY(-15px);

}

100%{

transform:translateY(0);

}

}

/*==========================
Features
===========================*/

.features{

padding:80px 0;

}

.features .container{

display:grid;

grid-template-columns:repeat(3,1fr);

gap:25px;

}

.card{

background:rgba(255,255,255,.08);

border:1px solid rgba(255,255,255,.08);

backdrop-filter:blur(15px);

padding:35px;

border-radius:20px;

transition:.4s;

}

.card:hover{

transform:translateY(-8px);

border-color:#2196f3;

}

.card h3{

margin-bottom:15px;

font-size:24px;

}

.card p{

color:#ddd;

}

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

footer{

margin-top:80px;

padding:35px 0;

text-align:center;

background:#050b16;

border-top:1px solid rgba(255,255,255,.08);

}

footer p{

color:#bdbdbd;

}

/*==========================
Tablet
===========================*/

@media(max-width:992px){

.hero-grid{

grid-template-columns:1fr;

text-align:center;

}

.hero-buttons{

justify-content:center;

}

.features .container{

grid-template-columns:1fr;

}

.hero h1{

font-size:40px;

}

}

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

@media(max-width:768px){

.logo h2{

font-size:18px;

}

.logo img{

width:45px;

height:45px;

}

.menu-btn{

display:block;

}

nav{

position:fixed;

top:80px;

right:-100%;

width:270px;

height:100vh;

background:#0b1528;

transition:.4s;

padding:40px 25px;

}

nav.active{

right:0;

}

nav ul{

flex-direction:column;

gap:25px;

}

.hero{

padding-top:130px;

}

.hero h1{

font-size:33px;

}

.hero p{

font-size:16px;

}

.hero-image img{

width:260px;

}

.btn{

width:100%;

text-align:center;

}

}

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

@media(max-width:480px){

.container{

width:94%;

}

.hero h1{

font-size:28px;

}

.hero p{

font-size:15px;

}

.card{

padding:25px;

}

.logo h2{

font-size:16px;

}

}
/*=========================
Section Title
=========================*/

.section-title{

text-align:center;

margin-bottom:60px;

}

.section-title h2{

font-size:42px;

margin-bottom:20px;

}

.section-title p{

max-width:850px;

margin:auto;

color:#ccc;

}

/*=========================
About
=========================*/

.about-elepay{

padding:90px 0;

}

.about-grid{

display:grid;

grid-template-columns:repeat(3,1fr);

gap:25px;

}

.glass-box{

background:rgba(255,255,255,.05);

backdrop-filter:blur(15px);

border-radius:20px;

padding:35px;

border:1px solid rgba(255,255,255,.08);

transition:.4s;

}

.glass-box:hover{

transform:translateY(-10px);

border-color:#1E88E5;

}

.glass-box h3{

margin-bottom:15px;

}

/*=========================
Download
=========================*/

.download-section{

padding:90px 0;

}

.download-box{

background:linear-gradient(135deg,#0d47a1,#1976d2);

padding:60px;

border-radius:25px;

text-align:center;

}

.download-box h2{

margin-bottom:20px;

font-size:38px;

}

.download-box p{

margin-bottom:30px;

}

/*=========================
Register
=========================*/

.register{

padding:90px 0;

}

.steps{

display:grid;

grid-template-columns:repeat(4,1fr);

gap:25px;

}

.step{

background:#0f1d35;

padding:30px;

border-radius:18px;

text-align:center;

}

.step span{

display:inline-flex;

width:60px;

height:60px;

align-items:center;

justify-content:center;

border-radius:50%;

background:#1E88E5;

font-size:24px;

font-weight:bold;

margin-bottom:20px;

}

/*=========================
Login
=========================*/

.login-guide{

padding:80px 0;

text-align:center;

}

.login-guide p{

max-width:900px;

margin:auto;

}

/*=========================
CTA
=========================*/

.cta{

padding:90px 0;

text-align:center;

}

.cta h2{

font-size:40px;

margin-bottom:20px;

}

.cta p{

margin-bottom:30px;

}

/*=========================
Responsive
=========================*/

@media(max-width:992px){

.about-grid{

grid-template-columns:1fr;

}

.steps{

grid-template-columns:1fr 1fr;

}

}

@media(max-width:768px){

.download-box{

padding:35px 25px;

}

.download-box h2{

font-size:30px;

}

.steps{

grid-template-columns:1fr;

}

.section-title h2{

font-size:30px;

}

.cta h2{

font-size:28px;

}

}
/*==============================
WHY SECTION
==============================*/

.why-elepay{

padding:100px 0;

}

.why-grid{

display:grid;

grid-template-columns:repeat(3,1fr);

gap:25px;

}

.why-card{

background:rgba(255,255,255,.05);

border:1px solid rgba(255,255,255,.08);

padding:35px;

border-radius:20px;

transition:.4s;

text-align:center;

backdrop-filter:blur(20px);

}

.why-card:hover{

transform:translateY(-10px);

border-color:#2196f3;

}

.icon{

font-size:45px;

margin-bottom:20px;

}

/*==============================
Statistics
==============================*/

.stats{

padding:80px 0;

background:#0b172c;

}

.stats .container{

display:grid;

grid-template-columns:repeat(4,1fr);

gap:20px;

}

.stat-box{

text-align:center;

padding:30px;

background:#132340;

border-radius:20px;

}

.stat-box h2{

font-size:45px;

color:#42a5f5;

}

/*==============================
Latest Guides
==============================*/

.latest-guides{

padding:100px 0;

}

.guide-grid{

display:grid;

grid-template-columns:repeat(3,1fr);

gap:25px;

}

.guide-card{

background:#101d34;

padding:30px;

border-radius:20px;

transition:.4s;

}

.guide-card:hover{

transform:translateY(-8px);

}

.guide-card h3{

margin-bottom:15px;

}

.guide-card a{

color:#42a5f5;

font-weight:600;

}

/*==============================
Reviews
==============================*/

.reviews{

padding:100px 0;

}

.review-grid{

display:grid;

grid-template-columns:repeat(3,1fr);

gap:25px;

}

.review-card{

background:#0f1d35;

padding:30px;

border-radius:20px;

text-align:center;

}

/*==============================
BIG CTA
==============================*/

.big-cta{

padding:100px 0;

text-align:center;

background:linear-gradient(135deg,#0d47a1,#1565c0);

}

.big-cta h2{

font-size:45px;

margin-bottom:20px;

}

.big-cta p{

margin-bottom:35px;

}

/*==============================
Responsive
==============================*/

@media(max-width:992px){

.why-grid,

.guide-grid,

.review-grid,

.stats .container{

grid-template-columns:1fr 1fr;

}

}

@media(max-width:768px){

.why-grid,

.guide-grid,

.review-grid,

.stats .container{

grid-template-columns:1fr;

}

.big-cta h2{

font-size:30px;

}

.stat-box h2{

font-size:35px;

}

}
/*==============================
FAQ
==============================*/

.faq-section{

padding:100px 0;

}

.faq-container{

max-width:900px;

margin:auto;

}

.faq{

background:#111d34;

margin-bottom:20px;

border-radius:15px;

overflow:hidden;

border:1px solid rgba(255,255,255,.08);

}

.question{

display:flex;

justify-content:space-between;

align-items:center;

padding:22px;

cursor:pointer;

}

.question h3{

font-size:20px;

font-weight:600;

}

.question span{

font-size:30px;

color:#42a5f5;

}

.answer{

max-height:0;

overflow:hidden;

transition:.4s;

}

.answer p{

padding:0 22px 22px;

color:#d9d9d9;

}
/*=========================
NEWSLETTER
=========================*/

.newsletter{

padding:100px 0;

}

.newsletter-box{

background:linear-gradient(135deg,#1565c0,#1e88e5);

padding:60px;

border-radius:25px;

text-align:center;

}

.newsletter-box h2{

font-size:40px;

margin-bottom:20px;

}

.newsletter-box p{

margin-bottom:30px;

}

.newsletter form{

display:flex;

justify-content:center;

gap:15px;

flex-wrap:wrap;

}

.newsletter input{

width:420px;

max-width:100%;

padding:16px;

border:none;

border-radius:50px;

font-size:16px;

outline:none;

}

.newsletter button{

padding:16px 35px;

border:none;

border-radius:50px;

background:#ffc107;

font-weight:700;

cursor:pointer;

transition:.3s;

}

.newsletter button:hover{

transform:translateY(-3px);

}



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

.footer{

background:#050b16;

padding:80px 0 0;

margin-top:100px;

}

.footer-grid{

display:grid;

grid-template-columns:repeat(4,1fr);

gap:40px;

}

.footer-logo{

width:80px;

margin-bottom:20px;

border-radius:20px;

}

.footer-col h3{

margin-bottom:20px;

color:#fff;

}

.footer-col p{

color:#bdbdbd;

margin-bottom:15px;

}

.footer-col ul li{

margin-bottom:12px;

}

.footer-col ul li a{

color:#bdbdbd;

transition:.3s;

}

.footer-col ul li a:hover{

color:#42a5f5;

padding-left:6px;

}

.social-icons{

display:flex;

gap:15px;

margin-top:20px;

}

.social-icons a{

width:45px;

height:45px;

display:flex;

justify-content:center;

align-items:center;

border-radius:50%;

background:#132340;

font-size:22px;

transition:.3s;

}

.social-icons a:hover{

background:#1e88e5;

transform:translateY(-5px);

}

.copyright{

margin-top:60px;

padding:20px;

text-align:center;

background:#02060d;

border-top:1px solid rgba(255,255,255,.08);

}

.copyright p{

color:#9e9e9e;

}



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

@media(max-width:992px){

.footer-grid{

grid-template-columns:1fr 1fr;

}

}



@media(max-width:768px){

.footer-grid{

grid-template-columns:1fr;

text-align:center;

}

.footer-logo{

margin:auto auto 20px;

}

.social-icons{

justify-content:center;

}

.newsletter-box{

padding:40px 20px;

}

.newsletter-box h2{

font-size:30px;

}

.newsletter form{

flex-direction:column;

align-items:center;

}

.newsletter input{

width:100%;

}

.newsletter button{

width:100%;

}

}
/*=========================
Guide Section
=========================*/

.guide-section{

padding:100px 0;

}

.guide-content{

max-width:1000px;

margin:auto;

background:rgba(255,255,255,.04);

padding:45px;

border-radius:20px;

border:1px solid rgba(255,255,255,.08);

backdrop-filter:blur(15px);

}

.guide-content h3{

margin-top:35px;

margin-bottom:15px;

font-size:28px;

color:#42a5f5;

}

.guide-content p{

color:#d7d7d7;

margin-bottom:20px;

line-height:1.9;

}

.guide-content ul{

padding-left:20px;

margin-bottom:25px;

}

.guide-content ul li{

margin-bottom:12px;

color:#ddd;

}

@media(max-width:768px){

.guide-content{

padding:25px;

}

.guide-content h3{

font-size:22px;

}

}
/*=========================
RESOURCE CENTER
=========================*/

.resource-center{

padding:100px 0;

}

.resource-grid{

display:grid;

grid-template-columns:repeat(3,1fr);

gap:25px;

}

.resource-card{

background:#101d34;

padding:30px;

border-radius:18px;

border:1px solid rgba(255,255,255,.08);

transition:.35s;

}

.resource-card:hover{

transform:translateY(-8px);

border-color:#42a5f5;

}

.resource-card h3{

margin-bottom:15px;

color:#42a5f5;

}



/*=========================
BEST PRACTICES
=========================*/

.best-practices{

padding:90px 0;

background:#0b172c;

}

.practice-list{

display:grid;

grid-template-columns:repeat(2,1fr);

gap:20px;

margin-top:40px;

}

.practice-item{

background:#132340;

padding:20px;

border-radius:15px;

}



/*=========================
HELP CENTER
=========================*/

.help-center{

padding:100px 0;

}

.help-box{

background:linear-gradient(135deg,#1565c0,#1e88e5);

padding:60px;

text-align:center;

border-radius:25px;

}

.help-box h3{

font-size:35px;

margin-bottom:20px;

}

.help-box p{

max-width:800px;

margin:auto auto 30px;

line-height:1.8;

}



/*=========================
Responsive
=========================*/

@media(max-width:992px){

.resource-grid{

grid-template-columns:1fr 1fr;

}

.practice-list{

grid-template-columns:1fr;

}

}



@media(max-width:768px){

.resource-grid{

grid-template-columns:1fr;

}

.help-box{

padding:35px 20px;

}

.help-box h3{

font-size:28px;

}

}
/*=========================
ABOUT PAGE
=========================*/

.about-hero{

padding:150px 0 100px;

}

.about-story{

padding:90px 0;

}

.about-content{

max-width:950px;

margin:auto;

background:rgba(255,255,255,.05);

padding:40px;

border-radius:20px;

border:1px solid rgba(255,255,255,.08);

}

.about-content p{

margin-bottom:20px;

line-height:1.9;

color:#ddd;

}

.mission{

padding:90px 0;

}

.mission-grid{

display:grid;

grid-template-columns:repeat(2,1fr);

gap:30px;

}

.mission-card{

background:#101d34;

padding:40px;

border-radius:20px;

border:1px solid rgba(255,255,255,.08);

transition:.3s;

}

.mission-card:hover{

transform:translateY(-8px);

border-color:#42a5f5;

}

.mission-card h2{

margin-bottom:20px;

color:#42a5f5;

}



/*=========================
Responsive
=========================*/

@media(max-width:768px){

.about-hero{

padding-top:130px;

}

.mission-grid{

grid-template-columns:1fr;

}

.about-content{

padding:25px;

}

}
/*=========================
WHY TRUST
=========================*/

.trust-section{

padding:100px 0;

}

.trust-grid{

display:grid;

grid-template-columns:repeat(2,1fr);

gap:25px;

}

.trust-card{

background:#101d34;

padding:35px;

border-radius:20px;

text-align:center;

border:1px solid rgba(255,255,255,.08);

transition:.35s;

}

.trust-card:hover{

transform:translateY(-8px);

border-color:#42a5f5;

}

.trust-icon{

font-size:45px;

margin-bottom:20px;

}



/*=========================
TIMELINE
=========================*/

.timeline-section{

padding:100px 0;

}

.timeline{

max-width:850px;

margin:auto;

border-left:3px solid #1e88e5;

padding-left:35px;

}

.timeline-item{

margin-bottom:50px;

position:relative;

}

.circle{

width:18px;

height:18px;

border-radius:50%;

background:#42a5f5;

position:absolute;

left:-46px;

top:8px;

}

.timeline-content{

background:#101d34;

padding:25px;

border-radius:15px;

}



/*=========================
ABOUT STATS
=========================*/

.about-stats{

padding:90px 0;

background:#0b172c;

}

.stats-grid{

display:grid;

grid-template-columns:repeat(4,1fr);

gap:20px;

}

.stat-card{

background:#132340;

padding:35px;

text-align:center;

border-radius:18px;

}

.stat-card h2{

font-size:40px;

color:#42a5f5;

}



/*=========================
WHY CHOOSE
=========================*/

.choose-section{

padding:100px 0;

}

.choose-grid{

display:grid;

grid-template-columns:repeat(3,1fr);

gap:20px;

}

.choose-box{

background:#101d34;

padding:25px;

border-radius:15px;

font-weight:600;

text-align:center;

transition:.3s;

}

.choose-box:hover{

transform:translateY(-5px);

}



/*=========================
ABOUT CTA
=========================*/

.about-cta{

padding:100px 0;

text-align:center;

background:linear-gradient(135deg,#1565c0,#0d47a1);

}

.about-cta h2{

font-size:42px;

margin-bottom:20px;

}

.about-cta p{

max-width:700px;

margin:auto auto 30px;

line-height:1.8;

}



/*=========================
Responsive
=========================*/

@media(max-width:992px){

.trust-grid,

.stats-grid,

.choose-grid{

grid-template-columns:1fr 1fr;

}

}



@media(max-width:768px){

.trust-grid,

.stats-grid,

.choose-grid{

grid-template-columns:1fr;

}

.timeline{

padding-left:20px;

}

.circle{

left:-31px;

}

.about-cta h2{

font-size:30px;

}

}
/*=========================
About FAQ
=========================*/

.about-faq{

padding:90px 0;

}

.faq-preview{

display:grid;

grid-template-columns:1fr;

gap:20px;

max-width:900px;

margin:auto;

}

.faq-item{

background:#101d34;

padding:25px;

border-radius:18px;

border:1px solid rgba(255,255,255,.08);

transition:.3s;

}

.faq-item:hover{

border-color:#42a5f5;

transform:translateY(-5px);

}

.faq-item h3{

margin-bottom:15px;

color:#42a5f5;

}

.faq-item p{

color:#d7d7d7;

line-height:1.8;

}
/*=========================
CONTACT PAGE
=========================*/

.contact-hero{

padding:150px 0 80px;

text-align:center;

}

.contact-section{

padding:90px 0;

}

.contact-grid{

display:grid;

grid-template-columns:2fr 1fr;

gap:40px;

}

.contact-form-box{

background:#101d34;

padding:40px;

border-radius:20px;

border:1px solid rgba(255,255,255,.08);

}

.contact-form-box form{

display:flex;

flex-direction:column;

gap:18px;

}

.contact-form-box input,

.contact-form-box textarea{

width:100%;

padding:16px;

background:#132340;

border:1px solid rgba(255,255,255,.08);

border-radius:10px;

color:#fff;

font-size:16px;

}

.contact-form-box input:focus,

.contact-form-box textarea:focus{

outline:none;

border-color:#42a5f5;

}

.contact-info{

display:flex;

flex-direction:column;

gap:20px;

}

.info-card{

background:#101d34;

padding:30px;

border-radius:18px;

border:1px solid rgba(255,255,255,.08);

transition:.3s;

}

.info-card:hover{

transform:translateY(-5px);

border-color:#42a5f5;

}

.map-section{

padding:90px 0;

}

.map-box{

height:350px;

border-radius:20px;

display:flex;

align-items:center;

justify-content:center;

background:#132340;

border:2px dashed rgba(255,255,255,.15);

font-size:22px;

font-weight:600;

}



/*=========================
Responsive
=========================*/

@media(max-width:992px){

.contact-grid{

grid-template-columns:1fr;

}

}

@media(max-width:768px){

.contact-hero{

padding-top:130px;

}

.contact-form-box{

padding:25px;

}

.map-box{

height:250px;

}

}
/*=========================
CONTACT FAQ
=========================*/

.contact-faq{

padding:90px 0;

}

.contact-faq .faq-preview{

display:grid;

gap:20px;

max-width:900px;

margin:auto;

}

.contact-faq .faq-item{

background:#101d34;

padding:25px;

border-radius:18px;

border:1px solid rgba(255,255,255,.08);

transition:.3s;

}

.contact-faq .faq-item:hover{

transform:translateY(-5px);

border-color:#42a5f5;

}

.contact-faq h3{

margin-bottom:15px;

color:#42a5f5;

}

.contact-faq p{

line-height:1.8;

color:#d7d7d7;

}



/*=========================
CONTACT CTA
=========================*/

.contact-cta{

padding:100px 0;

text-align:center;

background:linear-gradient(135deg,#1565c0,#0d47a1);

}

.contact-cta h2{

font-size:40px;

margin-bottom:20px;

}

.contact-cta p{

max-width:700px;

margin:0 auto 30px;

line-height:1.8;

}

@media(max-width:768px){

.contact-cta h2{

font-size:30px;

}

}
.contact-form-box label{

display:block;

margin-bottom:8px;

font-weight:600;

color:#ffffff;

}

.contact-form-box input,

.contact-form-box textarea{

margin-bottom:18px;

}
/*=========================
FAQ PAGE
=========================*/

.faq-hero{

padding:150px 0 80px;

text-align:center;

}

#faqSearch{

width:100%;

max-width:600px;

margin-top:30px;

padding:16px;

border-radius:12px;

border:none;

font-size:16px;

background:#132340;

color:#fff;

}

.faq-page{

padding:90px 0;

}

.faq-list{

max-width:900px;

margin:auto;

}

.faq-box{

background:#101d34;

margin-bottom:20px;

border-radius:16px;

overflow:hidden;

border:1px solid rgba(255,255,255,.08);

}

.faq-question{

width:100%;

background:none;

border:none;

padding:22px;

color:#fff;

font-size:18px;

font-weight:600;

display:flex;

justify-content:space-between;

cursor:pointer;

}

.faq-answer{

display:none;

padding:0 22px 22px;

line-height:1.8;

color:#ddd;

}

.faq-box.active .faq-answer{

display:block;

}

@media(max-width:768px){

.faq-hero{

padding-top:130px;

}

}
/*=========================
FAQ CATEGORIES
=========================*/

.faq-categories{

padding:90px 0;

}

.category-grid{

display:grid;

grid-template-columns:repeat(3,1fr);

gap:25px;

}

.category-card{

background:#101d34;

padding:30px;

border-radius:18px;

border:1px solid rgba(255,255,255,.08);

transition:.3s;

text-align:center;

}

.category-card:hover{

transform:translateY(-6px);

border-color:#42a5f5;

}

.category-card h3{

margin-bottom:15px;

color:#42a5f5;

}




/*=========================
MORE FAQ
=========================*/

.faq-more{

padding:90px 0;

}



/*=========================
FAQ CTA
=========================*/

.faq-cta{

padding:100px 0;

text-align:center;

background:linear-gradient(135deg,#1565c0,#0d47a1);

}

.faq-cta h2{

font-size:38px;

margin-bottom:20px;

}

.faq-cta p{

max-width:700px;

margin:0 auto 30px;

line-height:1.8;

}



/*=========================
Responsive
=========================*/

@media(max-width:992px){

.category-grid{

grid-template-columns:repeat(2,1fr);

}

}

@media(max-width:768px){

.category-grid{

grid-template-columns:1fr;

}

.faq-cta h2{

font-size:30px;

}

}
/*=========================
PRIVACY POLICY
=========================*/

.policy-hero{

padding:150px 0 80px;

text-align:center;

}

.policy-content{

padding:90px 0;

}

.policy-box{

max-width:950px;

margin:auto;

background:#101d34;

padding:45px;

border-radius:20px;

border:1px solid rgba(255,255,255,.08);

}

.policy-box h2{

margin-top:35px;

margin-bottom:15px;

color:#42a5f5;

}

.policy-box p{

line-height:1.9;

margin-bottom:18px;

color:#ddd;

}

.policy-box ul{

padding-left:20px;

margin-bottom:20px;

}

.policy-box li{

margin-bottom:10px;

line-height:1.8;

color:#ddd;

}

@media(max-width:768px){

.policy-hero{

padding-top:130px;

}

.policy-box{

padding:25px;

}

}