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

/*==============================
992px
==============================*/

@media (max-width:992px){

    /* Navbar */

    .dr-toggle{
        display:flex;
        flex-direction:column;
        justify-content:center;
        align-items:center;
        gap:6px;
        cursor:pointer;
        z-index:1001;
        color: black;
    }

    .dr-toggle span{
        width:30px;
        height:3px;
        background:#0A3D62;
        border-radius:50px;
        transition:.35s;
    }


    
    .dr-menu{

        position:fixed;

        top:80px;

        right:-100%;

        width:280px;

        height:calc(100vh - 80px);

        background:#fff;

        padding:40px 30px;

        transition:.4s;

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

        overflow-y:auto;

        z-index:999;

    }

    .dr-menu.active{

        right:0;

    }

    .dr-menu ul{

        display:flex;

        flex-direction:column;

        gap:22px;

    }

    .dr-menu ul li{

        width:100%;

    }

    .dr-menu ul li a{

        display:block;

        font-size:18px;

    }

    /* Hero */

    .hero-wrapper{

        grid-template-columns:1fr;

        gap:50px;

        text-align:center;

    }

    .hero-content{

        order:2;

    }

    .hero-image{

        order:1;

    }

    .hero-image img{

        max-width:420px;

        width:100%;

        margin:auto;

        display:block;

    }

    .hero-btns{

        justify-content:center;

        flex-wrap:wrap;

    }

    .hero-stats{

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

        gap:20px;

    }

    /* About */

    .about-wrapper{

        grid-template-columns:1fr;

        gap:50px;

    }

    .about-content{

        text-align:center;

    }

    .about-list{

        display:inline-block;

        text-align:left;

    }

    /* Achievement */

    .achievement-wrapper{

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

    }

    .timeline-line{

        display:none;

    }

    /* Focus */

    .focus-grid{

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

    }

}


/*==============================
768px
==============================*/

@media (max-width:768px){

    .hero-section{

        padding:120px 0 80px;

    }

    .hero-content h1{

        font-size:48px;

        line-height:1.2;

    }

    .hero-content p{

        font-size:17px;

    }

    .hero-stats{

        grid-template-columns:1fr;

    }

    .hero-btns{

        flex-direction:column;

        gap:15px;

    }

    .hero-btn{

        width:100%;

        justify-content:center;

    }

    .about-section,

    .achievement-section,

    .focus-section{

        padding:90px 0;

    }

    .achievement-wrapper,

    .focus-grid{

        grid-template-columns:1fr;

    }

    .section-heading h2{

        font-size:36px;

    }

}


/*==============================
576px
==============================*/

@media (max-width:576px){

    .hero-content h1{

        font-size:34px;

    }

    .hero-content p{

        font-size:15px;

    }

    .section-heading h2{

        font-size:30px;

    }

    .about-content h2{

        font-size:30px;

    }

    .about-content h3{

        font-size:22px;

    }

    .about-content p{

        font-size:15px;

    }

    .about-section,

    .achievement-section,

    .focus-section{

        padding:70px 0;

    }

    .hero-image img{

        max-width:300px;

    }

    .stat-card{

        width:100%;

    }

}








@media (max-width:992px){

.dr-hero{

    padding:140px 0 80px;

}

.dr-hero-wrapper{

    grid-template-columns:1fr;

    gap:60px;

    text-align:center;

}

.dr-hero-content{

    order:2;

}

.dr-hero-image{

    order:1;

}

.dr-hero-image img{

    max-width:380px;

    width:100%;

}

.hero-circle{

    width:380px;

    height:380px;

}

.dr-hero-btns{

    justify-content:center;

}

.dr-hero-stats{

    justify-content:center;

}

}

@media (max-width:768px){

.dr-hero{

    padding:120px 0 70px;

}

.dr-hero-tag{

    font-size:14px;

    padding:10px 18px;

}

.dr-hero-content h1{

    font-size:46px;

    line-height:1.15;

}

.dr-hero-content h2{

    font-size:28px;

}

.dr-hero-content p{

    font-size:16px;

}

.dr-hero-image img{

    max-width:320px;

}

.hero-circle{

    width:320px;

    height:320px;

}

.dr-hero-btns{

    flex-wrap:wrap;

    justify-content:center;

}

.dr-stat{

    min-width:180px;

}

}



@media (max-width:576px){

.dr-hero{

    padding:110px 0 60px;

}

.dr-hero-tag{

    width:100%;

    text-align:center;

    font-size:15px;

}

.dr-hero-content h1{

    font-size:34px;

    line-height:1.2;

    margin-bottom:12px;

}

.dr-hero-content h2{

    font-size:22px;

    line-height:1.5;

}

.dr-hero-content p{

    font-size:15px;

    margin-bottom:25px;

}

.dr-hero-btns{

    flex-direction:column;

    gap:15px;

}

.dr-btn-primary,
.dr-btn-outline{

    width:100%;

    padding:16px;

}

.dr-hero-stats{

    display:grid;

    grid-template-columns:1fr;

    gap:20px;

}

.dr-stat{

    width:100%;

    min-width:100%;

    text-align:center;

}

.dr-stat h3{

    font-size:28px;

}

.dr-hero-image img{

    max-width:260px;

}

.hero-circle{

    width:260px;

    height:260px;

}

.hero-shape-1{

    width:220px;

    height:220px;

    right:-80px;

}

.hero-shape-2{

    width:180px;

    height:180px;

    left:-70px;

}

}   




/*=========================================
TABLET (992px)
=========================================*/

@media (max-width:992px){

    .dr-header{

        background:#fff;
        backdrop-filter:none;

    }

    .dr-navbar{

        height:80px;
        padding:0 20px;

    }

    .dr-logo{

        gap:10px;

    }

    .dr-logo img{

        width:50px;

    }

    .dr-logo-text h2{

        font-size:18px;
        line-height:1.2;
        margin:0;

    }

    .dr-logo-text span{

        display:block;
        font-size:12px;

    }

    .dr-contact-btn{

        padding:12px 24px;
        font-size:15px;

    }

    .dr-toggle{

        display:flex;
        flex-direction:column;
        justify-content:space-between;
        width:34px;
        height:24px;
        background:none;
        border:none;
        cursor:pointer;
        z-index:1001;

    }

    .dr-toggle span{

        width:100%;
        height:3px;
        background:#0A3D62;
        border-radius:30px;
        transition:.35s;

    }

    .dr-menu{

        position:fixed;
        top:80px;
        right:-100%;
        width:300px;
        height:calc(100vh - 80px);
        background:#fff;
        padding:35px 25px;
        transition:.35s;
        box-shadow:-10px 0 30px rgba(0,0,0,.12);
        overflow-y:auto;

    }

    .dr-menu.active{

        right:0;

    }

    .dr-menu ul{

        flex-direction:column;
        align-items:flex-start;
        gap:25px;

    }

    .dr-menu ul li{

        width:100%;

    }

    .dr-menu ul li a{

        display:block;
        width:100%;
        font-size:18px;
        padding:8px 0;

    }

}


/*=========================================
MOBILE (576px)
=========================================*/

@media (max-width:576px){

    .dr-navbar{

        height:75px;
        padding:0 15px;

    }

    .dr-logo img{

        width:42px;

    }

    .dr-logo{

        gap:8px;

    }

    .dr-logo-text h2{

        font-size:16px;

    }

    .dr-logo-text span{

        font-size:11px;

    }

    .dr-contact-btn{

        padding:10px 18px;
        font-size:14px;

    }

    .dr-menu{

        width:100%;
        top:75px;
        height:calc(100vh - 75px);

    }

}



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

@media(max-width:992px){

.biography-wrapper{

grid-template-columns:1fr;

text-align:center;

gap:60px;

}

.bio-content{

order:2;

}

.bio-image{

order:1;

}

.bio-info{

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

}

.about-page-content h1{

font-size:50px;

}

}

@media(max-width:768px){

.about-page-hero{

padding:140px 0 90px;

}

.about-page-content h1{

font-size:40px;

}

.about-page-content p{

font-size:16px;

}

.bio-content h2{

font-size:36px;

}

.bio-content h2 span{

font-size:26px;

}

.bio-image img{

max-width:320px;

}

.bio-circle{

width:320px;

height:320px;

}

}

@media(max-width:576px){

.about-page-content h1{

font-size:30px;

}

.about-page-content p{

font-size:15px;

}

.bio-info{

grid-template-columns:1fr;

}

.bio-content h2{

font-size:28px;

}

.bio-content h2 span{

font-size:22px;

}

.bio-image img{

max-width:260px;

}

.bio-circle{

width:260px;

height:260px;

}

}


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

@media (max-width:992px){

    .journey-section{

        padding:90px 0;

    }

    .section-heading{

        margin-bottom:60px;

    }

    .section-heading h2{

        font-size:40px;

    }

    .journey-timeline{

        padding-left:25px;

    }

    .journey-timeline::before{

        left:30px;

        transform:none;

    }

    .journey-item,
    .journey-item:nth-child(even){

        width:100%;

        margin-left:0;
        padding-left:80px;
        padding-right:0;

    }

    .journey-year,
    .journey-item:nth-child(even) .journey-year{

        left:0;
        right:auto;
        top:20px;

        width:60px;
        height:60px;

        font-size:14px;

    }

    .journey-card{

        padding:35px;

    }

}

/*==============================
TABLET
==============================*/

@media (max-width:768px){

    .journey-section{

        padding:80px 0;

    }

    .section-heading h2{

        font-size:34px;

    }

    .section-heading p{

        font-size:16px;

    }

    .journey-item,
    .journey-item:nth-child(even){

        padding-left:70px;

        margin-bottom:45px;

    }

    .journey-timeline::before{

        left:25px;

    }

    .journey-year,
    .journey-item:nth-child(even) .journey-year{

        width:55px;

        height:55px;

        font-size:13px;

    }

    .journey-card{

        padding:28px;

    }

    .journey-card h3{

        font-size:22px;

    }

    .journey-card p{

        font-size:15px;

        line-height:1.8;

    }

}

/*==============================
MOBILE
==============================*/

@media (max-width:576px){

    .journey-section{

        padding:70px 0;

    }

    .section-heading{

        margin-bottom:45px;

    }

    .section-heading h2{

        font-size:28px;

    }

    .section-heading p{

        font-size:15px;

        line-height:1.7;

    }

    .journey-timeline{

        padding-left:15px;

    }

    .journey-timeline::before{

        left:20px;

        width:3px;

    }

    .journey-item,
    .journey-item:nth-child(even){

        padding-left:55px;

        margin-bottom:35px;

    }

    .journey-year,
    .journey-item:nth-child(even) .journey-year{

        width:42px;

        height:42px;

        left:0;

        top:18px;

        font-size:11px;

        border-width:3px;

    }

    .journey-card{

        padding:22px 18px;

        border-radius:16px;

    }

    .journey-card i{

        width:50px;

        height:50px;

        font-size:20px;

        margin-bottom:18px;

    }

    .journey-card h3{

        font-size:18px;

        margin-bottom:10px;

    }

    .journey-card p{

        font-size:14px;

        line-height:1.7;

    }

}




@media(max-width:992px){

.education-grid{

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

gap:25px;

}

}

@media(max-width:768px){

.education-section{

padding:90px 0;

}

.education-grid{

grid-template-columns:1fr;

}

.education-card{

padding:30px;

}

.education-card h3{

font-size:22px;

}

.education-icon{

width:65px;

height:65px;

font-size:26px;

}

}

@media(max-width:576px){

.education-section{

padding:70px 0;

}

.education-card{

padding:24px;

border-radius:18px;

}

.education-card h3{

font-size:20px;

}

.education-card p{

font-size:14px;

line-height:1.8;

}

.education-icon{

width:55px;

height:55px;

font-size:22px;

}

}


@media(max-width:992px){

.publication-grid{

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

}

}

@media(max-width:768px){

.publication-section{

padding:90px 0;

}

.publication-grid{

grid-template-columns:1fr;

}

.publication-card{

padding:30px;

}

.publication-card h3{

font-size:24px;

}

}

@media(max-width:576px){

.publication-section{

padding:70px 0;

}

.publication-card{

padding:24px;

}

.publication-icon{

width:60px;

height:60px;

font-size:24px;

}

.publication-card h3{

font-size:20px;

}

.publication-card p{

font-size:14px;

}

.publication-btn{

padding:12px 24px;

font-size:14px;

}

}



@media(max-width:992px){

.parliament-hero{

padding:170px 0 100px;

}

.parliament-hero-content h1{

font-size:52px;

}

}

@media(max-width:768px){

.parliament-hero{

padding:150px 0 90px;

}

.parliament-hero-content h1{

font-size:40px;

}

.parliament-hero-content p{

font-size:16px;

}

}

@media(max-width:576px){

.parliament-hero{

padding:130px 0 80px;

}

.parliament-hero-content h1{

font-size:32px;

}

.parliament-hero-content p{

font-size:15px;

}

.parliament-breadcrumb{

font-size:14px;

gap:8px;

}

}




@media(max-width:992px){

.profile-wrapper{

grid-template-columns:1fr;

gap:60px;

text-align:center;

}

.profile-info{

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

}

.profile-content{

order:2;

}

.profile-image{

order:1;

}

}

@media(max-width:768px){

.profile-content h2{

font-size:38px;

}

.profile-content h2 span{

font-size:24px;

}

.profile-image img{

max-width:320px;

}

.profile-bg{

width:320px;

height:320px;

}

.profile-info{

grid-template-columns:1fr;

}

}

@media(max-width:576px){

.parliament-profile{

padding:80px 0;

}

.profile-content h2{

font-size:30px;

}

.profile-content h2 span{

font-size:20px;

}

.profile-image img{

max-width:260px;

}

.profile-bg{

width:260px;

height:260px;

}

.info-card{

padding:22px;

}

}



@media(max-width:992px){

.profile-wrapper{

grid-template-columns:1fr;

gap:60px;

text-align:center;

}

.profile-info{

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

}

.profile-content{

order:2;

}

.profile-image{

order:1;

}

}

@media(max-width:768px){

.profile-content h2{

font-size:38px;

}

.profile-content h2 span{

font-size:24px;

}

.profile-image img{

max-width:320px;

}

.profile-bg{

width:320px;

height:320px;

}

.profile-info{

grid-template-columns:1fr;

}

}

@media(max-width:576px){

.parliament-profile{

padding:80px 0;

}

.profile-content h2{

font-size:30px;

}

.profile-content h2 span{

font-size:20px;

}

.profile-image img{

max-width:260px;

}

.profile-bg{

width:260px;

height:260px;

}

.info-card{

padding:22px;

}

}



@media(max-width:992px){

.timeline::before{

left:30px;

transform:none;

}

.timeline-item,
.timeline-item:nth-child(even){

width:100%;

padding-left:90px;

padding-right:0;

margin-left:0;

}

.timeline-year,
.timeline-item:nth-child(even) .timeline-year{

left:0;

right:auto;

width:60px;

height:60px;

font-size:14px;

}

}

@media(max-width:768px){

.parliament-timeline{

padding:90px 0;

}

.timeline-item{

padding-left:75px;

margin-bottom:45px;

}

.timeline-content{

padding:28px;

}

.timeline-content h3{

font-size:22px;

}

.timeline-content i{

width:60px;

height:60px;

font-size:24px;

}

}

@media(max-width:576px){

.parliament-timeline{

padding:70px 0;

}

.timeline::before{

left:20px;

}

.timeline-item{

padding-left:55px;

}

.timeline-year{

width:45px;

height:45px;

font-size:11px;

border-width:3px;

}

.timeline-content{

padding:22px;

border-radius:18px;

}

.timeline-content h3{

font-size:18px;

}

.timeline-content p{

font-size:14px;

line-height:1.7;

}

.timeline-content i{

width:50px;

height:50px;

font-size:20px;

}

}



@media(max-width:992px){

.contribution-grid{

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

}

}

@media(max-width:768px){

.parliament-contributions{

padding:90px 0;

}

.contribution-grid{

grid-template-columns:1fr;

gap:25px;

}

.contribution-card{

padding:30px;

}

}

@media(max-width:576px){

.parliament-contributions{

padding:70px 0;

}

.contribution-card{

padding:24px;

border-radius:18px;

}

.contribution-card i{

width:60px;

height:60px;

font-size:24px;

}

.contribution-card h3{

font-size:20px;

}

.contribution-card p{

font-size:14px;

}

}



@media(max-width:992px){

.committee-grid{

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

}

}

@media(max-width:768px){

.committee-section{

padding:90px 0;

}

.committee-grid{

grid-template-columns:1fr;

}

.committee-card{

padding:30px;

}

.committee-card h3{

font-size:22px;

}

}

@media(max-width:576px){

.committee-section{

padding:70px 0;

}

.committee-card{

padding:22px;

border-radius:18px;

}

.committee-top{

flex-direction:column;

align-items:flex-start;

gap:10px;

}

.committee-card h3{

font-size:20px;

}

.committee-card p{

font-size:14px;

line-height:1.7;

}

}   



@media(max-width:992px){

.stats-grid{

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

}

}

@media(max-width:768px){

.parliament-stats{

padding:90px 0;

}

.stats-grid{

grid-template-columns:1fr;

gap:25px;

}

.stats-card{

padding:35px 25px;

}

.stats-card h3{

font-size:42px;

}

}

@media(max-width:576px){

.parliament-stats{

padding:70px 0;

}

.stats-card{

padding:28px 20px;

border-radius:18px;

}

.stats-card i{

width:65px;

height:65px;

font-size:24px;

}

.stats-card h3{

font-size:36px;

}

.stats-card p{

font-size:15px;

}

}


@media(max-width:992px){

.speech-grid{

grid-template-columns:1fr;

}

}

@media(max-width:768px){

.parliament-speeches{

padding:90px 0;

}

.speech-image img{

height:260px;

}

.speech-content{

padding:28px;

}

.speech-content h3{

font-size:24px;

}

}

@media(max-width:576px){

.parliament-speeches{

padding:70px 0;

}

.speech-image img{

height:220px;

}

.speech-content{

padding:22px;

}

.speech-content h3{

font-size:20px;

}

.speech-buttons{

flex-direction:column;

}

.speech-buttons a{

width:100%;

text-align:center;

}

}



@media(max-width:992px){

.work-grid{

grid-template-columns:1fr;

}

}

@media(max-width:768px){

.parliament-work{

padding:90px 0;

}

.work-card{

padding:30px;

}

.work-card h3{

font-size:22px;

}

.work-card h4{

font-size:38px;

}

}

@media(max-width:576px){

.parliament-work{

padding:70px 0;

}

.work-card{

padding:24px;

border-radius:18px;

}

.work-icon{

width:60px;

height:60px;

font-size:22px;

}

.work-card h3{

font-size:20px;

}

.work-card h4{

font-size:32px;

}

.work-card p{

font-size:14px;

line-height:1.7;

}

}



@media(max-width:768px){

.media-hero{

padding:140px 0 90px;

}

.media-hero h1{

font-size:48px;

}

.media-buttons{

flex-direction:column;

align-items:center;

}

}

@media(max-width:576px){

.media-hero h1{

font-size:36px;

}

.media-hero p{

font-size:16px;

}

.media-buttons a{

width:220px;

text-align:center;

}

}


@media(max-width:992px){

.featured-media-grid{

grid-template-columns:1fr;

}

}

@media(max-width:768px){

.featured-media{

padding:90px 0;

}

.featured-image img{

height:280px;

}

.featured-content{

padding:25px;

}

.featured-content h3{

font-size:28px;

}

}

@media(max-width:576px){

.featured-media{

padding:70px 0;

}

.media-small-card{

flex-direction:column;

align-items:flex-start;

}

.media-small-card img{

width:100%;

height:200px;

}

.featured-content h3{

font-size:22px;

}

}




@media(max-width:768px){

.gallery-hero{

padding:140px 0 90px;

}

.gallery-hero h1{

font-size:46px;

}

.gallery-buttons{

flex-direction:column;

align-items:center;

}

}

@media(max-width:576px){

.gallery-hero h1{

font-size:34px;

}

.gallery-buttons a{

width:220px;

text-align:center;

}

}




@media(max-width:992px){

.gallery-category-grid{

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

}

}

@media(max-width:768px){

.gallery-categories{

padding:90px 0;

}

.gallery-category-grid{

grid-template-columns:1fr;

gap:25px;

}

}

@media(max-width:576px){

.gallery-categories{

padding:70px 0;

}

.gallery-category-card{

padding:35px 20px;

}

.gallery-category-card h3{

font-size:20px;

}

.gallery-category-card i{

width:65px;

height:65px;

font-size:24px;

}

}
@media(max-width:992px){

.gallery-grid{

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

}

.gallery-item.large,
.gallery-item.wide,
.gallery-item.tall{

grid-column:unset;
grid-row:unset;

}

}

@media(max-width:768px){

.photo-gallery{

padding:90px 0;

}

.gallery-grid{

grid-template-columns:1fr;

grid-auto-rows:260px;

}

.gallery-filter{

gap:10px;

}

.gallery-filter button{

padding:12px 22px;

}

}

@media(max-width:576px){

.photo-gallery{

padding:70px 0;

}

.gallery-overlay{

padding:20px;

}

.gallery-overlay h3{

font-size:20px;

}

}



@media(max-width:992px){

.contact-wrapper{

grid-template-columns:1fr;

}

}

@media(max-width:768px){

.contact-hero{

padding:140px 0 90px;

}

.contact-hero h1{

font-size:46px;

}

.form-grid{

grid-template-columns:1fr;

}

.contact-form-box{

padding:30px;

}

}

@media(max-width:576px){

.contact-section{

padding:70px 0;

}

.contact-hero h1{

font-size:34px;

}

.contact-card{

flex-direction:column;

text-align:center;

align-items:center;

}

.contact-map iframe{

height:350px;

}

}