/*====================================================
AIC FESTIVAL
Global Stylesheet
Version: 2.0
=====================================================*/

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

/*==========================
ROOT VARIABLES
===========================*/

:root{

--primary:#0B6B53;
--primary-dark:#084B3B;

--secondary:#D4AF37;

--earth:#8B5E3C;

--sand:#F8F4EC;

--white:#ffffff;

--black:#1E293B;

--text:#64748B;

--border:#E5E7EB;

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

--shadow-lg:0 25px 60px rgba(0,0,0,.15);

--radius:18px;

--transition:.35s ease;

}

/*==========================
RESET
===========================*/

*{

margin:0;

padding:0;

box-sizing:border-box;

}

html{

scroll-behavior:smooth;

overflow-x:hidden;

}

body{

font-family:'Poppins',sans-serif;

font-size:16px;

line-height:1.7;

color:var(--text);

background:#fff;

overflow-x:hidden;

}

/*==========================
TYPOGRAPHY
===========================*/

h1,
h2,
h3,
h4,
h5,
h6{

font-family:'Playfair Display',serif;

color:var(--black);

font-weight:700;

line-height:1.2;

margin-bottom:20px;

}

h1{

font-size:70px;

}

h2{

font-size:48px;

}

h3{

font-size:34px;

}

h4{

font-size:26px;

}

p{

margin-bottom:20px;

}

.lead{

font-size:20px;

}

/*==========================
LINKS
===========================*/

a{

text-decoration:none;

transition:var(--transition);

}

img{

max-width:100%;

display:block;

}

/*==========================
SECTION SPACING
===========================*/

section{

padding:110px 0;

position:relative;

}

.section-title{

max-width:760px;

margin:0 auto 70px;

}

.section-title h2{

margin:15px 0;

}

.section-title p{

font-size:18px;

}

.section-label{

display:inline-block;

padding:8px 18px;

background:rgba(11,107,83,.12);

color:var(--primary);

border-radius:100px;

font-weight:600;

font-size:14px;

text-transform:uppercase;

letter-spacing:1px;

}

/*==========================
BUTTONS
===========================*/

.btn{

padding:14px 34px;

border-radius:50px;

font-weight:600;

transition:var(--transition);

}

.btn-warning{

background:var(--secondary);

border:none;

color:#222;

}

.btn-warning:hover{

background:#c79b1c;

transform:translateY(-3px);

}

.btn-outline-light{

border:2px solid #fff;

}

.btn-outline-light:hover{

background:#fff;

color:var(--primary);

}

/*==========================
CARDS
===========================*/

.card{

border:none;

border-radius:var(--radius);

box-shadow:var(--shadow);

overflow:hidden;

}

.shadow-box{

box-shadow:var(--shadow);

border-radius:var(--radius);

background:#fff;

}

/*==========================
LOADER
===========================*/

#loader{

position:fixed;

top:0;

left:0;

width:100%;

height:100%;

background:#fff;

display:flex;

justify-content:center;

align-items:center;

z-index:99999;

}

.loader-content{

text-align:center;

}

.loader-content img{

width:90px;

margin:auto auto 25px;

}

/*==========================
BACK TO TOP
===========================*/

#backToTop{

position:fixed;

right:25px;

bottom:25px;

width:55px;

height:55px;

border:none;

border-radius:50%;

background:var(--secondary);

color:#222;

font-size:20px;

cursor:pointer;

display:flex;

align-items:center;

justify-content:center;

box-shadow:var(--shadow);

opacity:0;

visibility:hidden;

transition:var(--transition);

z-index:999;

}

#backToTop.show{

opacity:1;

visibility:visible;

}

#backToTop:hover{

transform:translateY(-6px);

}

/*==========================
FORM ELEMENTS
===========================*/

input,
textarea,
select{

width:100%;

padding:15px 20px;

border:1px solid var(--border);

border-radius:12px;

outline:none;

transition:var(--transition);

}

input:focus,
textarea:focus{

border-color:var(--primary);

box-shadow:0 0 0 3px rgba(11,107,83,.15);

}

/*==========================
UTILITY CLASSES
===========================*/

.bg-light{

background:var(--sand)!important;

}

.text-primary{

color:var(--primary)!important;

}

.rounded-xl{

border-radius:25px;

}

.mt-80{

margin-top:80px;

}

.mb-80{

margin-bottom:80px;

}

/*====================================================
HEADER & NAVIGATION
=====================================================*/


.header{

position:absolute;

top:0;

left:0;

width:100%;

z-index:999;

padding:25px 0;

}



.nav-container{

display:flex;

align-items:center;

justify-content:space-between;

gap:40px;

}




.logo{

font-family:'Playfair Display',serif;

font-size:30px;

font-weight:800;

color:white;

line-height:1;

white-space:nowrap;

}



.logo span{

color:var(--secondary);

}




nav{

margin-left:auto;

}



nav ul{

display:flex;

align-items:center;

gap:18px;

list-style:none;

}



nav ul li a{

font-size:14px;

font-weight:600;

color:white;

padding:8px 5px;

white-space:nowrap;

}




nav ul li a:hover,
nav ul li a.active{

color:var(--secondary);

}




/* REGISTER BUTTON */


.register-btn{

background:var(--secondary);

padding:11px 22px!important;

border-radius:50px;

color:#222!important;

}



.register-btn:hover{

background:white;

}



/* DROPDOWN */


.dropdown{

position:relative;

}



.dropdown-menu{

position:absolute;

top:35px;

left:0;

width:180px;

background:white;

padding:10px 0;

border-radius:12px;

display:none;

box-shadow:var(--shadow-lg);

}



.dropdown:hover .dropdown-menu{

display:block;

}



.dropdown-menu li{

width:100%;

}



.dropdown-menu li a{

display:block;

padding:12px 20px;

color:var(--black);

}



.dropdown-menu li a:hover{

background:var(--sand);

}



/* MOBILE ICON */


.menu-toggle{

display:none;

color:white;

font-size:28px;

}



@media(max-width:1100px){


nav ul{

gap:12px;

}


nav ul li a{

font-size:13px;

}



}



@media(max-width:900px){


nav{

display:none;

}


.menu-toggle{

display:block;

}


}


/*==========================
CONTAINER
===========================*/

.container{

width:90%;

max-width:1200px;

margin:auto;

}

/*==========================
CONTAINER
===========================*/

.container{

width:90%;

max-width:1200px;

margin:auto;

}

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


.footer{

background:var(--primary-dark);

color:white;

padding:70px 0 20px;

}



.footer-grid{

display:grid;

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

gap:50px;

}



.footer h3,
.footer h4{

color:white;

margin-bottom:20px;

}



.footer h3{

font-size:30px;

}



.footer h4{

font-size:20px;

color:var(--secondary);

}



.footer p{

color:rgba(255,255,255,.75);

line-height:1.8;

}



.footer ul{

list-style:none;

padding:0;

}



.footer ul li{

margin-bottom:12px;

}



.footer ul li a{

color:rgba(255,255,255,.75);

}



.footer ul li a:hover{

color:var(--secondary);

}



/* FOOTER BOTTOM */


.footer-bottom{

margin-top:50px;

padding-top:25px;

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

text-align:center;

}



.footer-bottom p{

color:rgba(255,255,255,.6);

font-size:14px;

margin:0;

}




@media(max-width:800px){


.footer-grid{

grid-template-columns:1fr;

}


}

/*====================================================
GLOBAL BUTTONS
=====================================================*/

.btn-primary,
.btn-secondary,
.btn-outline{

display:inline-flex;

align-items:center;

justify-content:center;

padding:18px 40px;

min-width:220px;

border-radius:50px;

font-size:16px;

font-weight:600;

text-decoration:none;

transition:all .35s ease;

cursor:pointer;

}

/* Primary */

.btn-primary{

background:var(--secondary);

color:#1E293B;

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

}

.btn-primary:hover{

background:#c89b22;

transform:translateY(-4px);

color:#1E293B;

}

/* Secondary */

.btn-secondary{

background:var(--primary);

color:#fff;

box-shadow:0 15px 35px rgba(11,107,83,.25);

}

.btn-secondary:hover{

background:var(--primary-dark);

transform:translateY(-4px);

color:#fff;

}

/* Outline */

.btn-outline{

border:2px solid #fff;

color:#fff;

background:transparent;

}

.btn-outline:hover{

background:#fff;

color:var(--primary);

}

/* Button Groups */

.cta-buttons{

display:flex;

justify-content:center;

align-items:center;

gap:20px;

flex-wrap:wrap;

margin-top:40px;

}

@media(max-width:768px){

.cta-buttons{

flex-direction:column;

}

.btn-primary,
.btn-secondary,
.btn-outline{

width:100%;
max-width:320px;

}

}