/*=========================================
Talent & Merit Competition
=========================================*/

:root{

    --primary:#7B1E1E;
    --secondary:#C89B3C;
    --white:#ffffff;
    --black:#1d1d1d;
    --text:#666;
    --light:#faf7f2;
    --border:#ececec;

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

    --transition:.35s ease;

}

body{

    overflow-x:hidden;

    background:#fff;

}

img{

    max-width:100%;

    display:block;

}

.sectionTitle{

    text-align:center;

    margin-bottom:70px;

}

.sectionTitle span{

    color:var(--secondary);

    letter-spacing:3px;

    font-size:14px;

    text-transform:uppercase;

    font-weight:600;

}

.sectionTitle h2{

    font-size:52px;

    margin:18px 0;

    color:var(--black);

    font-family:'Cormorant Garamond',serif;

}

.sectionTitle p{

    max-width:750px;

    margin:auto;

    color:#777;

    line-height:1.9;

}
.tmtHero{

    height:95vh;

    position:relative;

    background:url('../images/talent-merit-test/hero.jpg') center center/cover;

    display:flex;

    align-items:center;

    overflow:hidden;

}

.tmtOverlay{

    position:absolute;

    inset:0;

    background:linear-gradient(rgba(10,10,10,.65),
    rgba(123,30,30,.55));

    backdrop-filter:blur(3px);

}

.tmtHeroContent{

    position:relative;

    z-index:5;

    max-width:760px;

    color:#fff;

}

.tmtTag{

    display:inline-block;

    padding:10px 25px;

    border-radius:50px;

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

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

    margin-bottom:25px;

    letter-spacing:2px;

}

.tmtHeroContent h1{

    font-size:72px;

    line-height:1.1;

    margin-bottom:25px;

    font-family:'Cormorant Garamond',serif;

}

.tmtHeroContent p{

    max-width:620px;

    font-size:18px;

    line-height:1.9;

}

.tmtButtons{

    margin-top:45px;

    display:flex;

    gap:20px;

}

.tmtBtn{

    padding:16px 38px;

    background:var(--secondary);

    color:#fff;

    border-radius:50px;

    transition:.35s;

}

.tmtBtn:hover{

    background:#fff;

    color:var(--primary);

}

.tmtBtnOutline{

    padding:16px 38px;

    border:2px solid rgba(255,255,255,.3);

    color:#fff;

    border-radius:50px;

}

.tmtBtnOutline:hover{

    background:#fff;

    color:var(--primary);

}
.tmtAbout{

    padding:120px 0;

    background:#fff;

}

.tmtAboutGrid{

    display:grid;

    grid-template-columns:1fr 1fr;

    gap:70px;

    align-items:center;

}

.tmtImage img{

    border-radius:22px;

    box-shadow:var(--shadow);

}

.tmtContent h3{

    font-size:42px;

    color:var(--black);

    margin-bottom:25px;

    font-family:'Cormorant Garamond',serif;

}

.tmtContent p{

    margin-bottom:20px;

    color:#666;

    line-height:1.9;

}

.tmtContent ul{

    margin-top:30px;

    display:grid;

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

    gap:18px;

}

.tmtContent ul li{

    list-style:none;

    padding:16px;

    border-radius:10px;

    background:#fafafa;

    transition:.35s;

}

.tmtContent ul li:hover{

    background:var(--primary);

    color:#fff;

}
.competitionSection{

    padding:120px 0;

    background:var(--light);

}

.competitionGrid{

    display:grid;

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

    gap:35px;

}

.competitionCard{

    background:#fff;

    padding:45px 35px;

    border-radius:22px;

    box-shadow:var(--shadow);

    transition:.35s;

    text-align:center;

}

.competitionCard:hover{

    transform:translateY(-10px);

}

.competitionIcon{

    width:95px;

    height:95px;

    border-radius:50%;

    background:linear-gradient(135deg,var(--primary),#9c2b2b);

    color:#fff;

    margin:auto;

    display:flex;

    justify-content:center;

    align-items:center;

    font-size:34px;

    margin-bottom:30px;

}

.competitionCard h3{

    font-size:30px;

    margin-bottom:20px;

    font-family:'Cormorant Garamond',serif;

}

.competitionCard p{

    color:#666;

    line-height:1.9;

}

.competitionCard a{

    display:inline-block;

    margin-top:25px;

    color:var(--secondary);

    font-weight:600;

}
/*====================================================
RULES BANNER
====================================================*/

.rulesBanner{
    padding:120px 0 80px;
    background:#fff;
}

.rulesBannerImage{
    margin-top:50px;
}

.rulesBannerImage img{
    width:100%;
    border-radius:24px;
    overflow:hidden;
    box-shadow:0 20px 45px rgba(0,0,0,.12);
    transition:.4s;
}

.rulesBannerImage img:hover{
    transform:scale(1.02);
}


/*====================================================
RULES SECTION
====================================================*/

.rulesSection{

    padding:100px 0;

    background:#faf7f2;

}

.rulesSection.alternate{

    background:#ffffff;

}

.rulesGrid{

    display:grid;

    grid-template-columns:45% 55%;

    gap:70px;

    align-items:center;

}

.rulesGrid.reverse{

    grid-template-columns:55% 45%;

}

.rulesImage{

    position:relative;

}

.rulesImage img{

    width:100%;

    border-radius:25px;

    box-shadow:0 20px 45px rgba(0,0,0,.12);

    transition:.35s;

}

.rulesImage:hover img{

    transform:scale(1.03);

}

.rulesContent h2{

    font-size:46px;

    margin-bottom:25px;

    color:#222;

    font-family:'Cormorant Garamond',serif;

}

.rulesContent p{

    color:#666;

    line-height:1.9;

    margin-bottom:30px;

}


/*====================================================
RULE LIST
====================================================*/

.rulesContent ul{

    margin:0;

    padding:0;

}

.rulesContent ul li{

    list-style:none;

    position:relative;

    padding:16px 20px 16px 58px;

    margin-bottom:16px;

    background:#fff;

    border-radius:14px;

    box-shadow:0 8px 20px rgba(0,0,0,.05);

    transition:.35s;

}

.rulesContent ul li:before{

    content:"✓";

    position:absolute;

    left:18px;

    top:50%;

    transform:translateY(-50%);

    width:28px;

    height:28px;

    border-radius:50%;

    background:#7B1E1E;

    color:#fff;

    display:flex;

    justify-content:center;

    align-items:center;

    font-weight:bold;

}

.rulesContent ul li:hover{

    background:#7B1E1E;

    color:#fff;

    transform:translateX(8px);

}

.rulesContent ul li:hover:before{

    background:#C89B3C;

    color:#fff;

}


/*====================================================
IMAGE EFFECT
====================================================*/

.rulesImage::after{

    content:"";

    position:absolute;

    width:140px;

    height:140px;

    background:#C89B3C;

    opacity:.15;

    border-radius:50%;

    right:-25px;

    top:-25px;

    z-index:-1;

}

.rulesImage::before{

    content:"";

    position:absolute;

    width:90px;

    height:90px;

    border:4px solid #7B1E1E;

    opacity:.15;

    left:-25px;

    bottom:-25px;

    border-radius:18px;

    transform:rotate(12deg);

}


/*====================================================
RULE TITLE DECORATION
====================================================*/

.rulesContent h2:after{

    content:"";

    display:block;

    width:90px;

    height:4px;

    background:#C89B3C;

    margin-top:15px;

    border-radius:20px;

}


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

@media(max-width:991px){

.rulesGrid{

grid-template-columns:1fr;

gap:40px;

}

.rulesGrid.reverse{

grid-template-columns:1fr;

}

.rulesGrid.reverse .rulesImage{

order:1;

}

.rulesGrid.reverse .rulesContent{

order:2;

}

.rulesContent h2{

font-size:36px;

}

}

@media(max-width:768px){

.rulesBanner{

padding:80px 0 50px;

}

.rulesSection{

padding:70px 0;

}

.rulesContent h2{

font-size:30px;

}

.rulesContent ul li{

padding:14px 15px 14px 50px;

font-size:15px;

}

.rulesImage::before,

.rulesImage::after{

display:none;

}

}
/*=========================================
SCHEDULE SECTION
=========================================*/

.scheduleSection{
    padding:120px 0;
    background:#fff;
}

.scheduleGrid{
    display:grid;
    grid-template-columns:repeat(2,1fr);
    gap:35px;
}

.scheduleCard{
    background:#fff;
    border-radius:22px;
    overflow:hidden;
    box-shadow:0 15px 40px rgba(0,0,0,.08);
    transition:.35s;
}

.scheduleCard:hover{
    transform:translateY(-10px);
}

.scheduleImage{
    overflow:hidden;
}

.scheduleImage img{
    width:100%;
    height:280px;
    object-fit:cover;
    transition:.4s;
}

.scheduleCard:hover .scheduleImage img{
    transform:scale(1.08);
}

.scheduleContent{
    padding:30px;
}

.scheduleContent span{
    display:inline-block;
    background:#7B1E1E;
    color:#fff;
    padding:6px 16px;
    border-radius:30px;
    font-size:13px;
    letter-spacing:2px;
    margin-bottom:18px;
}

.scheduleContent h3{
    font-size:30px;
    margin-bottom:15px;
    font-family:'Cormorant Garamond',serif;
}

.scheduleContent p{
    color:#666;
    line-height:1.8;
}


/*=========================================
PROSPECTUS
=========================================*/

.prospectusSection{
    padding:100px 0;
    background:#faf7f2;
}

.prospectusBox{
    background:linear-gradient(135deg,#7B1E1E,#9b2727);
    color:#fff;
    border-radius:25px;
    padding:60px;
    display:flex;
    justify-content:space-between;
    align-items:center;
    gap:40px;
}

.prospectusBox h2{
    font-size:42px;
    margin-bottom:15px;
    font-family:'Cormorant Garamond',serif;
}

.prospectusBox p{
    max-width:650px;
    line-height:1.9;
}

.downloadBtn{
    background:#C89B3C;
    color:#fff;
    padding:18px 36px;
    border-radius:50px;
    white-space:nowrap;
    font-weight:600;
    transition:.35s;
}

.downloadBtn:hover{
    background:#fff;
    color:#7B1E1E;
}


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

.faqSection{
    padding:120px 0;
    background:#fff;
}

.faqWrapper{
    max-width:950px;
    margin:auto;
}

.faqItem{
    background:#fafafa;
    border-left:5px solid #C89B3C;
    padding:30px;
    border-radius:15px;
    margin-bottom:25px;
    transition:.35s;
}

.faqItem:hover{
    transform:translateX(8px);
    box-shadow:0 15px 35px rgba(0,0,0,.08);
}

.faqItem h3{
    font-size:24px;
    color:#7B1E1E;
    margin-bottom:15px;
}

.faqItem p{
    color:#666;
    line-height:1.8;
}


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

.competitionCTA{
    padding:120px 0;
    background:linear-gradient(rgba(0,0,0,.60),rgba(0,0,0,.60)),
    url('../images/talent-merit-test/hero.jpg') center/cover;
}

.ctaContent{
    text-align:center;
    color:#fff;
    max-width:850px;
    margin:auto;
}

.ctaContent span{
    color:#C89B3C;
    letter-spacing:3px;
    text-transform:uppercase;
}

.ctaContent h2{
    font-size:60px;
    margin:20px 0;
    font-family:'Cormorant Garamond',serif;
}

.ctaContent p{
    line-height:1.9;
    margin-bottom:40px;
}

.ctaButtons{
    display:flex;
    justify-content:center;
    gap:20px;
}

.applyBtn,
.contactBtn{
    display:inline-block;
    padding:18px 40px;
    border-radius:50px;
    transition:.35s;
    font-weight:600;
}

.applyBtn{
    background:#C89B3C;
    color:#fff;
}

.applyBtn:hover{
    background:#fff;
    color:#7B1E1E;
}

.contactBtn{
    border:2px solid rgba(255,255,255,.3);
    color:#fff;
}

.contactBtn:hover{
    background:#fff;
    color:#7B1E1E;
}


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

@media(max-width:991px){

.scheduleGrid{
grid-template-columns:1fr;
}

.prospectusBox{
flex-direction:column;
text-align:center;
}

.ctaContent h2{
font-size:42px;
}

}

@media(max-width:768px){

.scheduleSection,
.prospectusSection,
.faqSection,
.competitionCTA{
padding:80px 0;
}

.scheduleImage img{
height:220px;
}

.scheduleContent{
padding:20px;
}

.scheduleContent h3{
font-size:24px;
}

.prospectusBox{
padding:35px 25px;
}

.prospectusBox h2{
font-size:30px;
}

.faqItem{
padding:20px;
}

.ctaButtons{
flex-direction:column;
}

.applyBtn,
.contactBtn{
width:100%;
}

.ctaContent h2{
font-size:34px;
}

}