/*=========================================
 GOOGLE FONT
=========================================*/

@import url('https://fonts.googleapis.com/css2?family=Poppins:wght@300;400;500;600;700;800&display=swap');

*{
margin:0;
padding:0;
box-sizing:border-box;
font-family:'Poppins',sans-serif;
}

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

.certificate-hero{

background:#ff0000;

background-size:cover;
background-position:center;

padding:140px 0 120px;

position:relative;

color:#fff;
margin-top:100px;

}


.certificate-hero::before{

content:'';

position:absolute;

width:100%;
height:100%;

left:0;
top:300;

background:url('https://www.transparenttextures.com/patterns/cubes.png');

opacity:.12;

}

.hero-content{

position:relative;
z-index:2;

}

.hero-sub{

display:inline-block;

background:#ff0000;

padding:8px 22px;

border-radius:40px;

font-size:14px;

letter-spacing:1px;

backdrop-filter:blur(10px);

margin-bottom:20px;

}


.hero-content h1{

font-size:56px;

font-weight:800;

margin-bottom:20px;

}

.hero-content p{

font-size:18px;

max-width:760px;

margin:auto;

line-height:33px;

color:#d9e7ff;

}

.breadcrumb-custom{

margin-top:25px;

}

.breadcrumb-custom a{

color:#fff;

text-decoration:none;

font-weight:500;

}

.breadcrumb-custom span{

color:#ff0000;

}


/*=========================================
 TRUST BOXES
=========================================*/

.trust-area{

margin-top:-70px;
position:relative;
z-index:20;

}

.trust-box{

background:#fff;

border-radius:20px;

padding:35px;

box-shadow:0 15px 45px rgba(0,0,0,.08);

transition:.4s;

height:100%;

}

.trust-box:hover{

transform:translateY(-10px);

}

.trust-icon{

width:80px;
height:80px;

background:#ff0000;

border-radius:50%;

display:flex;

align-items:center;

justify-content:center;

margin-bottom:25px;

color:#fff;

font-size:30px;

}

.trust-box h4{

font-weight:700;

margin-bottom:15px;

}

.trust-box p{

color:#777;

line-height:28px;

}


/*=========================================
 INTRO
=========================================*/

.section-title{

font-size:42px;

font-weight:800;

color:#ff0000;

margin-bottom:20px;

}

.section-sub{

font-size:17px;

color:#666;

line-height:31px;

max-width:900px;

margin:auto;

}

.section-space{

padding:100px 0;

}


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

.counter-box{

background:#fff;

padding:30px;

border-radius:18px;

text-align:center;

box-shadow:0 10px 30px rgba(0,0,0,.06);

transition:.3s;

}

.counter-box:hover{

transform:translateY(-8px);

}

.counter-box h2{

font-size:45px;

font-weight:800;

color:#ff0000;

}

.counter-box h6{

margin-top:10px;

font-weight:600;

color:#555;

}


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

@media(max-width:991px){

.certificate-hero{

padding:120px 0 90px;

}

.hero-content h1{

font-size:42px;

}

.section-title{

font-size:34px;

}

}


@media(max-width:767px){

.certificate-hero{

padding:100px 0 80px;

}

.hero-content h1{

font-size:32px;

}

.hero-content p{

font-size:15px;

line-height:28px;

}

.section-title{

font-size:28px;

}

.trust-area{

margin-top:-40px;

}

.trust-box{

margin-bottom:25px;

}

}

.certificate-gallery{

background:#f8f9fc;

}

.gallery-badge{

display:inline-block;

background:#ffe5e5;

color:#ff0000;

padding:10px 22px;

border-radius:50px;

font-weight:600;

}

.gallery-title{

font-size:42px;

font-weight:700;

color:#222;

}

.gallery-text{

font-size:17px;

color:#666;

line-height:30px;

}

.certificate-card{

background:#fff;

border-radius:20px;

overflow:hidden;

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

transition:.4s;

height:100%;

}

.certificate-card:hover{

transform:translateY(-10px);

box-shadow:0 25px 60px rgba(255,0,0,.18);

}

.certificate-image{

position:relative;

overflow:hidden;

}

.certificate-image img{

width:100%;

height:420px;

object-fit:cover;

transition:.5s;

}

.certificate-card:hover img{

transform:scale(1.08);

}

.certificate-overlay{

position:absolute;

top:0;

left:0;

width:100%;

height:100%;

display:flex;

justify-content:center;

align-items:center;

background:rgba(255,0,0,.75);

opacity:0;

transition:.4s;

}

.certificate-card:hover .certificate-overlay{

opacity:1;

}

.certificate-overlay .btn{

padding:12px 28px;

font-weight:600;

border-radius:50px;

}

.certificate-content{

padding:30px;

}

.verified{

display:inline-block;

background:#e8fff0;

color:#0a9d48;

padding:7px 18px;

border-radius:40px;

font-size:14px;

font-weight:600;

margin-bottom:18px;

}

.certificate-content h4{

font-size:26px;

font-weight:700;

margin-bottom:15px;

}

.certificate-content p{

color:#666;

line-height:28px;

}

.certificate-footer{

display:flex;

justify-content:space-between;

align-items:center;

margin-top:25px;

border-top:1px solid #eee;

padding-top:20px;

}

.download-btn{

background:#ff0000;

color:#fff;

padding:10px 24px;

border-radius:50px;

text-decoration:none;

transition:.3s;

}

.download-btn:hover{

background:#cc0000;

color:#fff;

}

@media(max-width:991px){

.gallery-title{

font-size:34px;

}

.certificate-image img{

height:350px;

}

}

@media(max-width:767px){

.gallery-title{

font-size:28px;

}

.certificate-image img{

height:260px;

}

.certificate-footer{

flex-direction:column;

gap:15px;

}

}