/*==================================================
                GOOGLE FONT
==================================================*/

@import url('https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700;800;900&display=swap');


/*==================================================
                RESET
==================================================*/
html,
body{

overflow-x:hidden;
width:100%;

}
*{

margin:0;
padding:0;
box-sizing:border-box;

}

html{

scroll-behavior:smooth;

}

body{

font-family:'Poppins',sans-serif;

background:
linear-gradient(
180deg,
#edeef0 0%,
#d9dee6 25%,
#f7faff 50%,
#d5d8dd 100%
);

color:#222222;

overflow-x:hidden;

}



/*==================================================
            SCROLLBAR
==================================================*/
::-webkit-scrollbar{
width:5px;
}
::-webkit-scrollbar-track{
background:#08101d;
}
::-webkit-scrollbar-thumb{
background:#f7931a;
border-radius:3px;
}
::-webkit-scrollbar-thumb:hover{
background:#ffb347;
}


/*==================================================
            LOADER
==================================================*/

#loader{
position:fixed;
inset:0;
z-index:999999;
display:flex;
justify-content:center;
align-items:center;
overflow:hidden;
background:#f3f3f3;
}
.loader-blur{
position:absolute;
width:900px;
height:900px;
border-radius:50%;
background:
radial-gradient(
circle,
rgba(185, 160, 129, 0.25),
transparent 70%
);
filter:blur(120px);
animation:loaderGlow 6s linear infinite;
}
.loader-content{
position:relative;
z-index:5;
text-align:center;
}
.loader-logo{
width:120px;
height:120px;
margin:auto;
display:flex;
justify-content:center;
align-items:center;
border-radius:50%;
background:
linear-gradient(
135deg,
#f7931a,
#ffcc66
);
font-size:60px;
color:white;
box-shadow:
0 0 50px rgba(247,147,26,.6);
animation:pulse 2s infinite;
}


.loader-content h2{
margin-top:35px;
font-size:38px;
color:#1b160e;
font-weight:800;
letter-spacing:3px;
}
.loader-content p{
margin-top:15px;
font-size:17px;
color:#000000;
}

.loading-bar{
margin:auto;
margin-top:35px;
width:300px;
height:7px;
overflow:hidden;
border-radius:40px;
background:rgba(255,255,255,.08);
}
.loading-bar span{
display:block;
width:0%;
height:100%;
background:
linear-gradient(
90deg,
#f7931a,
#ffd56b
);
animation:loading 3s linear forwards;
}
/*==================================================
            HERO
==================================================*/
.hero{
position:relative;
min-height:100vh;
height:auto;
display:flex;
justify-content:center;
align-items:center;
overflow:hidden;
}
.hero-image{
position:absolute;
width:100%;
height:100%;
object-fit:cover;
animation:heroZoom 20s linear infinite alternate;
}
.hero-overlay{
position:absolute;
inset:0;
background:
linear-gradient(
180deg,
rgba(0,0,0,.55),
rgba(3,10,20,.75)
);
backdrop-filter:blur(2px);
}
.hero-content{
position:relative;
z-index:10;
width:min(1000px,90%);
text-align:center;
}
.hero-badge{
display:inline-block;
padding:10px 22px;
border-radius:50px;
background:
rgba(247,147,26,.12);
border:1px solid rgba(247,147,26,.3);
color:#ffca76;
font-weight:700;
letter-spacing:1px;
margin-bottom:25px;
}
.hero h1{
font-size:72px;
font-weight:900;
color: #f9fafc;
line-height:1.1;
margin-bottom:35px;
text-shadow:
0 10px 40px rgba(0,0,0,.45);
}

.hero p{
max-width:900px;
margin:auto;
font-size:22px;
line-height:1.9;
color:#f2f2f2;
}

/*==================================================
            BUTTONS
==================================================*/
.hero-buttons{
margin-top:55px;
display:flex;
justify-content:center;
gap:25px;
flex-wrap:wrap;
}
.hero-buttons a{
position:relative;
overflow:hidden;
padding:18px 42px;
border-radius:60px;
font-size:18px;
font-weight:700;
text-decoration:none;
transition:.45s;
}
.hero-buttons a:first-child{
background:
linear-gradient(
135deg,

#f7931a,
#ffb347

);
color:white;

}

.hero-buttons a:last-child{
border:2px solid white;
color:white;
}
.hero-buttons a:hover{
transform:
translateY(-7px);
}
.hero-buttons a:first-child:hover{
box-shadow:
0 25px 60px rgba(247,147,26,.45);
}

.hero-buttons a:last-child:hover{
background:white;
color:#111827;
}

/*==================================================
        SCROLL INDICATOR
==================================================*/
.scroll-indicator{
position:absolute;
bottom:40px;
left:50%;
transform:translateX(-50%);
z-index:20;
}
.scroll-indicator span{
display:block;
width:28px;
height:48px;
border:2px solid white;
border-radius:40px;
position:relative;
}

.scroll-indicator span::before{
content:"";
position:absolute;
left:50%;
top:8px;
transform:translateX(-50%);
width:6px;
height:6px;
border-radius:50%;
background:white;
animation:scrollDown 2s infinite;
}

/*==================================================
            ANIMATIONS
==================================================*/

@keyframes loading{
100%{
width:100%;
}
}

@keyframes pulse{
50%{
transform:scale(1.08);
box-shadow:
0 0 80px rgb(247, 148, 26);
}
}

@keyframes loaderGlow{
50%{
transform:
rotate(180deg)
scale(1.15);

}

100%{
transform:rotate(360deg);
}
}

@keyframes heroZoom{
100%{
transform:scale(1.15);
}
}

@keyframes scrollDown{
0%{
opacity:1;
top:8px;
}
100%{
opacity:0;
top:28px;
}

}

/*==================================================
            RESPONSIVE
==================================================*/
@media(max-width:900px){
.hero h1{
font-size:46px;
}
.hero p{
font-size:18px;
}
.loader-content h2{
font-size:28px;
}
.loading-bar{
width:220px;
}
}

@media(max-width:600px){
.hero{
height:90vh;
}
.hero h1{
font-size:34px;
}
.hero p{
font-size:16px;
line-height:1.8;
}
.hero-buttons{
flex-direction:column;
}
.hero-buttons a{
width:100%;
}
.loader-logo{
width:90px;
height:90px;
font-size:45px;
}
}

/*==================================================
                INTRO SECTION
==================================================*/
.intro{
width:min(1300px,92%);
margin:140px auto;
display:grid;
grid-template-columns:1fr 1fr;
gap:70px;
align-items:center;
}

.intro-left{
position:relative;
}

.intro-left img{
width:100%;
max-width:100%;
display:block;
border-radius:35px;
display:block;

}
.intro-left::before{
content:"";
position:absolute;
inset:-20px;
background:
linear-gradient(
135deg,
rgba(235, 234, 234, 0.18),
transparent,
rgba(255,255,255,.05)

);
border-radius:40px;
z-index:-1;
filter:blur(20px);
}
.intro-left:hover img{
transform:
scale(1.04)
rotate(-1deg);
}
.intro-right h2{
font-size:52px;
font-weight:800;
margin-bottom:35px;
line-height:1.2;
}
.intro-right p{
font-size:18px;
line-height:2;
color:#292929;
margin-bottom:22px;
}

/*==================================================
                SECTION TITLES
==================================================*/

.vision-title,
.mission-heading,
.impact-title,
.values-title,
.faq-title{
width:min(1100px,90%);
margin:auto;
text-align:center;
margin-bottom:70px;
}
.vision-title span,
.mission-heading span,
.impact-title span,
.values-title span,
.faq-title span{
display:inline-block;
padding:10px 24px;
border-radius:50px;
background:rgba(179, 178, 178, 0.1);
border:1px solid rgba(247,147,26,.30);
color:#ffbe5b;
font-weight:700;
letter-spacing:1px;
margin-bottom:20px;
}
.vision-title h2,
.mission-heading h2,
.impact-title h2,
.values-title h2,
.faq-title h2{
font-size:56px;
font-weight:900;
margin-bottom:25px;
line-height:1.2;
}
.vision-title p,
.mission-heading p,
.impact-title p{
font-size:19px;
line-height:2;
color:#2c2c2c;
}

/*==================================================
                VISION
==================================================*/

.vision-section{
padding:60px 0;
position:relative;
}
.vision-grid{
width:min(1350px,94%);
margin:auto;
display:grid;
grid-template-columns:repeat(auto-fit,minmax(300px,1fr));
gap:35px;
}

/*==================================================
                PREMIUM CARDS
==================================================*/
.vision-card{
position:relative;
overflow:hidden;
padding:45px;
border-radius:35px;
background:
linear-gradient(
145deg,
rgba(255,255,255,.06),
rgba(255,255,255,.03)

);
backdrop-filter:blur(18px);
border:1px solid rgba(255,255,255,.08);
transition:.45s;
box-shadow:
0 25px 60px rgba(0,0,0,.30);
}
.vision-card::before{
content:"";
position:absolute;
top:-100%;
left:-100%;
width:220%;
height:220%;
background:
linear-gradient(
135deg,
transparent,
rgba(252, 229, 201, 0.15),
rgba(247, 232, 215, 0.15)
transparent

);
transform:rotate(25deg);
transition:.8s;

}
.vision-card:hover::before{
top:-40%;
left:-40%;
}
.vision-card:hover{
transform:
translateY(-15px)
rotateX(4deg);
border-color:
rgba(247,147,26,.35);
box-shadow:
0 35px 90px rgba(247,147,26,.18);
}
.vision-card i{
font-size:62px;
margin-bottom:28px;
color:#f7931a;
transition:.45s;
}
.vision-card:hover i{
transform:
rotate(12deg)
scale(1.15);
}
.vision-card h3{
font-size:28px;
margin-bottom:18px;
font-weight:800
}
.vision-card p{
color:#1d1d1d;
font-size:17px;
line-height:1.9;
}

/*==================================================
            FLOAT EFFECT
==================================================*/
.vision-card:nth-child(1){
animation:floatCard 6s ease-in-out infinite;
}
.vision-card:nth-child(2){
animation:floatCard 7s ease-in-out infinite;
}
.vision-card:nth-child(3){
animation:floatCard 8s ease-in-out infinite;
}
.vision-card:nth-child(4){
animation:floatCard 9s ease-in-out infinite;
}

/*==================================================
                ANIMATION
==================================================*/
@keyframes floatCard{
0%{
transform:translateY(0px);
}
50%{
transform:translateY(-10px);
}
100%{
transform:translateY(0px);
}
}
/*==================================================
                RESPONSIVE
==================================================*/
@media(max-width:1100px){
.intro{
grid-template-columns:1fr;
}
.intro-right{
text-align:center;
}
.intro-right h2{
font-size:40px;
}
.vision-title h2,
.mission-heading h2,
.values-title h2,
.impact-title h2,
.faq-title h2{
font-size:42px;
}
}
@media(max-width:768px){
.intro{
margin:80px auto;
gap:40px;
}
.intro-right h2{
font-size:32px;
}
.intro-right p{
font-size:16px;
}
.vision-grid{
grid-template-columns:1fr;

}
.vision-card{

padding:35px;

}
.vision-title h2,
.mission-heading h2,
.values-title h2,
.impact-title h2,
.faq-title h2{
font-size:34px;
}
}
/*==================================================
                MISSION USE
==================================================*/

.mission-use{
padding:70px 0;
position:relative;
}
.mission-grid{
width:min(1450px,94%);
margin:auto;
display:grid;
grid-template-columns:
repeat(auto-fit,minmax(380px,1fr));
gap:45px;
}
/*==================================================
                CARD
==================================================*/
.mission-item{
position:relative;
overflow:hidden;
border-radius:35px;
background:
linear-gradient(
145deg,
rgba(255,255,255,.05),
rgba(255,255,255,.02)
);

border:1px solid rgba(255,255,255,.08);
transition:.55s;
box-shadow:
0 25px 60px rgba(0,0,0,.35);

}
.mission-item:hover{
transform:
translateY(-15px)
rotateX(4deg);
box-shadow:
0 40px 100px rgba(247,147,26,.18);
}

/*==================================================
                IMAGE
==================================================*/
.mission-item img{
width:100%;
height:280px;
object-fit:cover;
display:block;
transition:1s;
}
.mission-item:hover img{
transform:scale(1.12);
}
/*==================================================
            IMAGE OVERLAY
==================================================*/
.mission-item::before{
content:"";
position:absolute;
top:0;
left:0;
width:100%;
height:280px;
background:
linear-gradient(
180deg,
transparent,
rgba(5,12,22,.75)
);
z-index:1;
pointer-events:none;

}
/*==================================================
            LIGHT EFFECT
==================================================*/
.mission-item::after{
content:"";
position:absolute;
top:-120%;
left:-120%;
width:260%;
height:260%;
background:
linear-gradient(
135deg,
transparent,
rgba(255,255,255,.08),
transparent
);
transform:rotate(25deg);
transition:1s;
}
.mission-item:hover::after{
top:-40%;
left:-40%;
}
/*==================================================
                CONTENT
==================================================*/
.mission-content{
padding:35px;
position:relative;
z-index:2;
}
.mission-content h3{
font-size:30px;
font-weight:800;
margin-bottom:18px;
margin-top: 1rem;
color:rgb(2, 2, 2);

}
.mission-content p{
font-size:17px;
line-height:1.9;
color:#242424;
}

/*==================================================
            TOP BORDER
==================================================*/
.mission-content::before{
content:"";
display:block;
width:80px;
height:4px;
border-radius:50px;
margin-bottom:22px;
background:
linear-gradient(
90deg,
#f7931a,
#ffd56b
);

}
/*==================================================
                FLOAT
==================================================*/
.mission-item:nth-child(odd){
animation:missionFloat1 8s ease-in-out infinite;
}

.mission-item:nth-child(even){
animation:missionFloat2 10s ease-in-out infinite;
}
@keyframes missionFloat1{
0%{
transform:translateY(0);
}
50%{
transform:translateY(-10px);
}
100%{
transform:translateY(0);
}
}
@keyframes missionFloat2{
0%{
transform:translateY(0);
}
50%{
transform:translateY(10px);
}
100%{
transform:translateY(0);
}

}
/*==================================================
            ANNUAL GOALS
==================================================*/
.annual-goals{
width:min(1350px,92%);
margin:100px auto;
display:grid;
grid-template-columns:1fr 1fr;
gap:70px;
align-items:center;
}
.annual-left{
position:relative;
}
.annual-left img{
width:100%;
display:block;
transition:.8s;
}
.annual-left:hover img{
transform:
scale(1.05)
rotate(-2deg);
}
.annual-right span{
display:inline-block;
padding:10px 22px;
border-radius:50px;
background:rgba(247,147,26,.12);
color:#ffbe5b;
margin-bottom:18px;
font-weight:700;
}
.annual-right h2{
font-size:54px;
font-weight:900;
margin-bottom:30px;
line-height:1.2;

}
.annual-right p{
font-size:18px;
line-height:2;
color:#272727;
margin-bottom:35px;
}
.annual-right ul{
list-style:none;
}
.annual-right li{
display:flex;
align-items:center;
gap:15px;
padding:18px 24px;
margin-bottom:18px;
border-radius:18px;
background:
rgba(59, 56, 56, 0.04);
border:1px solid rgba(255,255,255,.06);
transition:.35s;

}
.annual-right li:hover{
transform:translateX(12px);
border-color:rgba(247,147,26,.25);
background:
rgba(247,147,26,.06);
}
.annual-right strong{
color:#f89704;

}
/*==================================================
            RESPONSIVE
==================================================*/
@media(max-width:1100px){
.mission-grid{
grid-template-columns:1fr;
}
.annual-goals{
grid-template-columns:1fr;
}
.annual-right{
text-align:center;
}

.annual-right h2{
font-size:40px;
}
}
@media(max-width:768px){
.mission-item img{
height:220px;
}
.mission-content{
padding:28px;
}
.mission-content h3{
font-size:24px;
}
.mission-content p{
font-size:16px;
}
.annual-right h2{
font-size:32px;
}
.annual-right li{
text-align:left;
}
}


/*==================================================
                BITCOIN MISSION
==================================================*/
.bitcoin-mission{
padding:50px 0;
position:relative;
overflow:hidden;
}
.bitcoin-mission::before{
content:"₿";
position:absolute;
right:-120px;
top:60px;
font-size:520px;
font-weight:900;
color:rgba(247,147,26,.03);
pointer-events:none;
user-select:none;
}
.bitcoin-intro{
width:min(1100px,90%);
margin:auto;
text-align:center;
margin-bottom:90px;
}
.bitcoin-intro span{
display:inline-block;
padding:10px 24px;
border-radius:50px;
background:rgba(247,147,26,.10);
border:1px solid rgba(247,147,26,.25);
color:#ffbe5b;
font-weight:700;
margin-bottom:20px;
}
.bitcoin-intro h2{
font-size:58px;
font-weight:900;
margin-bottom:25px;

}
.bitcoin-intro p{
font-size:19px;
line-height:2;
color:#222222;
max-width:950px;
margin:auto;
}
/*==================================================
                TIMELINE
==================================================*/

.bitcoin-timeline{
width:min(1150px,92%);
margin:auto;
position:relative;
padding-left:70px;
}
.bitcoin-timeline::before{
content:"";
position:absolute;
left:26px;
top:0;
bottom:0;
width:4px;
border-radius:50px;
background:linear-gradient(
180deg,
#f7931a,
#ffca64,
#f7931a
);

}

.timeline-item{
position:relative;
margin-bottom:70px;
transition:.45s;
}
.timeline-item:hover{
transform:translateX(15px);
}
.timeline-icon{
position:absolute;
left:-18px;
top:10px;
width:52px;
height:52px;
border-radius:50%;
display:flex;
justify-content:center;
align-items:center;
background:linear-gradient(
135deg,
#f7931a,
#ffca64
);

color:white;
font-size:22px;
box-shadow:
0 0 30px rgba(247,147,26,.45);

}

.timeline-content{
margin-left:70px;
padding:35px;
border-radius:28px;
background:
linear-gradient(
145deg,
rgba(255,255,255,.05),
rgba(255,255,255,.02)
);
border:1px solid rgba(255,255,255,.08);
transition:.4s;
}
.timeline-content:hover{
border-color:rgba(247,147,26,.35);
box-shadow:
0 25px 70px rgba(247,147,26,.12);

}

.timeline-content h3{
font-size:30px;
margin-bottom:15px;
font-weight:800;
}
.timeline-content p{
font-size:17px;
line-height:1.9;
color:#2b2b2b;
}



/*==================================================
                TRANSPARENCY
==================================================*/
.transparency{
width:min(1350px,92%);
margin:50px auto;
display:grid;
grid-template-columns:1fr 1fr;
gap:80px;
align-items:center;
}
.transparency-left img{
width:100%;
display:block;
transition:.7s;
}
.transparency-left:hover img{
transform:scale(1.05);
}
.transparency-right span{
display:inline-block;
padding:10px 24px;
border-radius:50px;
background:rgba(247,147,26,.12);
color:#ffbe5b;
margin-bottom:18px;
font-weight:700;
}
.transparency-right h2{
font-size:54px;
margin-bottom:30px;
font-weight:900;
line-height:1.2;
}
.transparency-right p{
font-size:18px;
line-height:2;
margin-bottom:25px;
color:#2e2e2e;
}
.transparency-list{
margin-top:35px;
display:grid;
grid-template-columns:1fr 1fr;
gap:20px;
}
.transparency-list div{
display:flex;
align-items:flex-start;
gap:14px;
padding:18px;
border-radius:18px;
background:rgba(150, 145, 145, 0.116);
transition:.35s;
}
.transparency-list div:hover{
transform:translateY(-6px);
background:rgba(247,147,26,.06);
}
.transparency-list i{
color:#f7931a;
font-size:22px;
margin-top:3px;
}
/*==================================================
                VALUES
==================================================*/
.values{
padding:50px 0;
}
.values-grid{
width:min(1300px,92%);
margin:auto;
display:grid;
grid-template-columns:repeat(auto-fit,minmax(280px,1fr));
gap:35px;

}
.value-card{
padding:45px;
text-align:center;
border-radius:30px;
background:
linear-gradient(
145deg,
rgba(255,255,255,.05),
rgba(255,255,255,.02)
);
border:1px solid rgba(255,255,255,.08);
transition:.45s;
position:relative;
overflow:hidden;

}
.value-card::before{
content:"";
position:absolute;
width:200px;
height:200px;
background:rgba(247, 148, 26, 0.233);
border-radius:50%;
top:-120px;
right:-120px;
transition:.6s;
}
.value-card:hover::before{
transform:scale(2);
}

.value-card:hover{
transform:
translateY(-12px)
rotateX(5deg);
border-color:rgba(247,147,26,.35);
box-shadow:
0 30px 80px rgba(247,147,26,.15);
}
.value-card i{
font-size:60px;
color:#f7931a;
margin-bottom:25px;
position:relative;
z-index:2;
}
.value-card h3{
font-size:28px;
margin-bottom:18px;
font-weight:800;
position:relative;
z-index:2;
}

.value-card p{
font-size:17px;
line-height:1.9;
color:#303030;
position:relative;
z-index:2;
}
/*==================================================
                RESPONSIVE
==================================================*/
@media(max-width:1100px){
.transparency{
grid-template-columns:1fr;
}
.transparency-right{
text-align:center;
}
.bitcoin-intro h2{
font-size:42px;
}
.transparency-right h2{
font-size:40px;
}
}
@media(max-width:768px){
.bitcoin-timeline{
padding-left:45px;
}
.timeline-content{
margin-left:45px;
padding:25px;
}
.timeline-content h3{
font-size:24px;
}
.timeline-content p{
font-size:16px;
}
.transparency-list{
grid-template-columns:1fr;
}
.values-grid{
grid-template-columns:1fr;

}

}
/*==================================================
                IMPACT COUNTERS
==================================================*/
.impact-counter{
padding:60px 0;
position:relative;
}
.impact-grid{
width:min(1400px,94%);
margin:auto;
display:grid;
grid-template-columns:repeat(auto-fit,minmax(260px,1fr));
gap:35px;

}
.impact-box{
padding:45px;
text-align:center;
border-radius:30px;
background:
linear-gradient(
145deg,
rgba(117, 115, 115, 0.13),
rgba(117, 113, 113, 0.116)

);
border:1px solid rgba(255, 255, 255, 0.288);
transition:.45s;
}
.impact-box:hover{
transform:translateY(-12px);
border-color:rgba(247,147,26,.35);
box-shadow:0 25px 70px rgba(247,147,26,.15);
}
.impact-box h3{
font-size:70px;
color:#f7931a;
font-weight:900;
margin-bottom:15px;
}
.impact-box p{
font-size:18px;
line-height:1.8;
color:#303030;
}


/*==================================================
                FAQ
==================================================*/
.faq-section{
padding:50px 0;
}
.faq-container{
width:min(1000px,92%);
margin:auto;
}
.faq-item{
margin-bottom:20px;
overflow:hidden;
border-radius:25px;
background:
rgba(95, 92, 92, 0.178);
border:1px solid rgba(182, 182, 182, 0.205);
transition:.35s;
}
.faq-item.active{
border-color:#f7931a;
}
.faq-question{
display:flex;
justify-content:space-between;
align-items:center;
padding:30px;
cursor:pointer;
}
.faq-question h3{
font-size:24px;
font-weight:700;
}
.faq-question i{
font-size:24px;
color:#f7931a;
transition:.4s;
}
.faq-item.active i{
transform:rotate(45deg);
}
.faq-answer{
max-height:0;
overflow:hidden;
transition:.45s;
}
.faq-answer p{
padding:0 30px 30px;
font-size:17px;
line-height:2;
color:#292929;
}
/*==================================================
                CTA
==================================================*/

.final-cta{
position:relative;
height:100vh;
overflow:hidden;
display:flex;
justify-content:center;
align-items:center;
margin-top:40px;
}
.cta-background{
position:absolute;
width:100%;
height:100%;
object-fit:cover;
animation:heroZoom 20s infinite alternate;
}
.cta-overlay{
position:absolute;
inset:0;
background:
linear-gradient(
180deg,
rgba(0,0,0,.55),
rgba(5,10,18,.80)
);

}
.cta-content{
position:relative;
z-index:2;
width:min(1000px,90%);
text-align:center;
}
.cta-content span{
display:inline-block;
padding:10px 22px;
border-radius:50px;
background:rgba(247,147,26,.12);
color:#ffbe5b;
margin-bottom:20px;
font-weight:700;
}
.cta-content h2{
font-size:66px;
font-weight:900;
color: #ffffff;
margin-bottom:35px;
line-height:1.15;
}
.cta-content p{
font-size:20px;
line-height:2;
color:#dfdddd;
margin-bottom:45px;
}
.cta-buttons{
display:flex;
justify-content:center;
gap:25px;
flex-wrap:wrap;
}
.cta-buttons a{
padding:18px 42px;
border-radius:60px;
text-decoration:none;
font-size:18px;
font-weight:700;
transition:.35s;
}
.cta-buttons a:first-child{
background:
linear-gradient(135deg,#f7931a,#ffb347);
color:rgb(255, 255, 255);
}
.cta-buttons a:last-child{
border:2px solid rgb(202, 202, 202);
color:rgb(214, 214, 214);
}
.cta-buttons a:hover{
transform:translateY(-8px);
}
/*==================================================
                QUOTE
=================================================*/
.quote-section{
padding:30px 0;
text-align:center;
}
.quote-section blockquote{
width:min(900px,90%);
margin:auto;
font-size:42px;
font-weight:800;
line-height:1.6;
}
.quote-section p{
margin-top:35px;
font-size:22px;
color:#f7931a;
font-weight:700;
}
/*==================================================
            SCROLL REVEAL
==================================================*/
.reveal{
opacity:0;
transform:translateY(80px);
transition:1s ease;
}
.reveal.show{
opacity:1;
transform:translateY(0);
}
/*==================================================
                RESPONSIVE
==================================================*/

@media(max-width:900px){
.impact-box h3{
font-size:54px;
}
.cta-content h2{
font-size:42px;
}
.quote-section blockquote{
font-size:30px;
}
}
@media(max-width:768px){
.impact-grid{
grid-template-columns:1fr;
}
.faq-question{
padding:22px;
}
.faq-question h3{
font-size:19px;
}
.cta-content p{
font-size:17px;
}
.cta-buttons{
flex-direction:column;
}
.cta-buttons a{
width:100%;
}
.quote-section{
padding:100px 0;
}
.quote-section blockquote{
font-size:24px;
}
}