*{
margin:0;
padding:0;
box-sizing:border-box;
}


html{
scroll-behavior:smooth;
}


body{

font-family:'Poppins',sans-serif;
background:#fff8f5;
color:#4b332c;

}



/* LOADER */


.loader{

position:fixed;

inset:0;

background:#fff8f5;

display:flex;

justify-content:center;

align-items:center;

z-index:9999;

transition:opacity .6s ease, visibility .6s ease;

}


.loader-logo{

font-family:'Playfair Display';

font-size:90px;

color:#8b5e52;

font-weight:bold;

letter-spacing:2px;

position:relative;

padding-bottom:15px;

}


.loader-logo::after{

content:"";

position:absolute;

bottom:0;

left:50%;

transform:translateX(-50%);

width:0%;

height:3px;

background:#8b5e52;

animation:loaderUnderline 1.8s ease-in-out infinite;

}


.loader-logo span{

display:inline-block;

animation:letterFade 1.8s ease-in-out infinite;

}


.loader-logo span:nth-child(1){ animation-delay:0s; }

.loader-logo span:nth-child(2){ animation-delay:.1s; }

.loader-logo span:nth-child(3){ animation-delay:.2s; }

.loader-logo span:nth-child(4){ animation-delay:.3s; }

.loader-logo span:nth-child(5){ animation-delay:.4s; }

.loader-logo span:nth-child(6){ animation-delay:.5s; }


@keyframes letterFade{

0%{

opacity:1;

transform:translateY(0) scale(1);

}


50%{

opacity:.15;

transform:translateY(-6px) scale(1.05);

}


100%{

opacity:1;

transform:translateY(0) scale(1);

}

}


@keyframes loaderUnderline{

0%{

width:0%;

opacity:0;

}


50%{

width:100%;

opacity:1;

}


100%{

width:0%;

opacity:0;

}

}


.loader.hidden{

opacity:0;

visibility:hidden;

pointer-events:none;

}



/* NAVBAR */


.navbar{

position:fixed;
top:0;
left:0;

width:100%;

padding:25px 8%;

display:flex;
justify-content:space-between;
align-items:center;

z-index:1000;

transition:.4s;

}


.navbar.scrolled{

background:#fff8f5dd;

backdrop-filter:blur(10px);

box-shadow:0 5px 20px #00000015;

}



.logo{

font-family:'Playfair Display';
font-size:32px;

color:#8b5e52;

font-weight:bold;

}



nav a{

text-decoration:none;

margin-left:35px;

color:#5a4038;

font-weight:500;

}


.mobile-socials{

display:none;

}



.hero-socials{

position:absolute;

right:20%;

top:50%;

transform:translateY(-50%);

display:flex;

flex-direction:column;

gap:28px;

z-index:5;

}


.hero-socials a{

display:flex;

align-items:center;

justify-content:center;

width:115px;

height:115px;

border-radius:50%;

border:1.5px solid #f0dcd4;

color:#f0dcd4;

background:#00000015;

backdrop-filter:blur(6px);

transition:.35s;

}


.hero-socials a:hover{

background:#9d6658;

border-color:#9d6658;

color:white;

transform:translateY(-5px);

}


.hero-socials svg{

width:34px;

height:34px;

}


.menu-btn{

display:none;

border:none;
background:none;

font-size:25px;

}





/* HERO */


.hero{

height:100vh;

background:

linear-gradient(
rgba(255,240,235,.65),
rgba(255,240,235,.85)
),

url("../assets/images/hero.jpg");


background-size:cover;

background-position:center;

display:flex;

align-items:center;

padding:0 8%;

position:relative;

overflow:hidden;

}



.hero-content{

max-width:700px;

animation:fadeUp 1.2s ease;

}



.small-title{

letter-spacing:4px;

font-size:14px;

color:#a26f61;

margin-bottom:20px;

}



h1{

font-family:'Playfair Display';

font-size:75px;

line-height:1.1;

}



h1 span{

color:#b77b6d;

}



.description{

margin-top:30px;

font-size:18px;

max-width:500px;

color:#6d5047;

}



.buttons{

margin-top:40px;

display:flex;

gap:20px;

}



.primary-btn,
.secondary-btn{

padding:15px 35px;

border-radius:50px;

text-decoration:none;

cursor:pointer;

transition:.3s;

}



.primary-btn{

background:#9d6658;

color:white;

}



.primary-btn:hover{

transform:translateY(-5px);

box-shadow:0 15px 25px #9d665850;

}



.secondary-btn{

border:1px solid #9d6658;

color:#9d6658;

}



.secondary-btn:hover{

background:#9d6658;

color:white;

}



.scroll{

position:absolute;

bottom:30px;

left:50%;

transform:translateX(-50%);

animation:bounce 2s infinite;

}





.placeholder{

height:500px;

display:flex;

justify-content:center;

align-items:center;

}





/* ANIMATIONS */


@keyframes fadeUp{

from{

opacity:0;

transform:translateY(40px);

}


to{

opacity:1;

transform:translateY(0);

}

}



@keyframes bounce{


50%{

transform:translate(-50%,20px);

}


}





/* MOBILE */


@media(max-width:800px){


nav{

display:none;

position:absolute;

top:100%;

left:0;

width:100%;

background:#fff8f5;

flex-direction:column;

align-items:center;

padding:20px 0;

box-shadow:0 15px 25px #00000015;

}


nav.open{

display:flex;

}


nav a{

margin:12px 0;

}


.mobile-socials{

display:flex;

justify-content:center;

gap:26px;

margin-top:20px;

}


.mobile-socials a{

display:flex;

align-items:center;

justify-content:center;

width:64px;

height:64px;

border-radius:50%;

border:1.5px solid #9d6658;

color:#9d6658;

transition:.3s;

}


.mobile-socials a:hover{

background:#9d6658;

color:white;

}


.mobile-socials svg{

width:30px;

height:30px;

}


.hero-socials{

display:none;

}


.menu-btn{

display:block;

position:relative;

z-index:1001;

}



h1{

font-size:45px;

}


.description{

font-size:16px;

}



.buttons{

flex-direction:column;

}



}
/* BRANDS */


.brands{

padding:70px 8%;

text-align:center;

background:#fff;


}


.brands h3{

color:#8b5e52;

margin-bottom:40px;

}



.brand-slider{

display:flex;

justify-content:space-around;

flex-wrap:wrap;

gap:30px;

font-size:20px;

letter-spacing:3px;

color:#b58a7d;

}





/* ABOUT */


.about{

padding:120px 8%;

display:grid;

grid-template-columns:1fr 1fr;

gap:70px;

align-items:center;

}



.about-image img{

width:100%;

max-width:500px;

border-radius:30px;

box-shadow:0 20px 50px #0002;

}



.section-title{

letter-spacing:4px;

font-size:14px;

color:#a26f61;

margin-bottom:20px;

}



.about-text h2,
.services h2{

font-family:'Playfair Display';

font-size:45px;

line-height:1.2;

}



.about-text p{

margin-top:25px;

font-size:17px;

line-height:1.8;

}



.features{

margin-top:30px;

display:grid;

gap:15px;

color:#7a5449;

}





/* STATS */


.stats{

padding:80px 8%;

background:#f5e6df;

display:grid;

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

gap:30px;

text-align:center;

}



.stat h2{

font-size:50px;

font-family:'Playfair Display';

color:#9d6658;

}



.stat p{

margin-top:10px;

}





/* SERVICES */


.services{

padding:120px 8%;

text-align:center;

}



.service-grid{

margin-top:60px;

display:grid;

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

gap:25px;

}



.service-card{

background:white;

padding:40px 25px;

border-radius:25px;

box-shadow:0 15px 40px #00000010;

transition:.4s;

}



.service-card:hover{

transform:translateY(-15px);

}



.service-card h3{

color:#9d6658;

margin-bottom:20px;

}





/* SCROLL ANIMATION */


.reveal{

opacity:0;

transform:translateY(50px);

transition:1s;

}



.reveal.active{

opacity:1;

transform:translateY(0);

}





/* RESPONSIVE */


@media(max-width:900px){


.about{

grid-template-columns:1fr;

}



.stats{

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

}



.service-grid{

grid-template-columns:1fr;

}



}

/* PORTFOLIO */


.portfolio{

padding:120px 8%;

text-align:center;

background:#fff8f5;

}



.portfolio h2{

font-family:'Playfair Display';

font-size:45px;

}



.filters{

margin:50px 0;

display:flex;

justify-content:center;

gap:15px;

flex-wrap:wrap;

}



.filter{

border:none;

background:#ead5cc;

color:#6d5047;

padding:12px 25px;

border-radius:50px;

cursor:pointer;

transition:.3s;

}



.filter:hover,
.filter.active{

background:#9d6658;

color:white;

}





.portfolio-grid{


display:grid;

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

gap:25px;


}




.video-card{


position:relative;

height:520px;

overflow:hidden;

border-radius:30px;

cursor:pointer;

background:black;

transition:.4s;

}



.video-card:hover{

transform:translateY(-15px);

box-shadow:0 20px 40px #0003;

}



.video-card video{

width:100%;

height:100%;

object-fit:cover;

}




.video-info{


position:absolute;

bottom:0;

left:0;

width:100%;

padding:30px 20px;


background:linear-gradient(
transparent,
rgba(0,0,0,.7)
);


color:white;


text-align:left;

}



.video-info h3{

font-size:22px;

}




/* MODAL */


.video-modal{


display:none;

position:fixed;

inset:0;

background:#000d;

z-index:3000;

justify-content:center;

align-items:center;


}



.video-modal video{

height:80%;

max-width:90%;

border-radius:20px;

}



.close{

position:absolute;

top:30px;

right:50px;

font-size:50px;

color:white;

cursor:pointer;

}





@media(max-width:1200px){


.portfolio-grid{

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

}


}




@media(max-width:700px){


.portfolio-grid{

grid-template-columns:1fr;

}



.video-card{

height:600px;

}



}

/* TESTIMONIALS */


.testimonials,
.packages,
.process,
.faq{

padding:120px 8%;

text-align:center;

}



.testimonial-grid{

display:grid;

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

gap:30px;

margin-top:60px;

}



.testimonial-card{

background:white;

padding:40px;

border-radius:30px;

box-shadow:0 15px 40px #00000012;

}



.stars{

color:#c08a6f;

font-size:25px;

margin-bottom:20px;

}





/* PACKAGES */


.package-grid{

display:grid;

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

gap:30px;

margin-top:60px;

}



.package-card{

background:white;

padding:50px 30px;

border-radius:30px;

box-shadow:0 15px 40px #0002;

}



.package-card h3{

font-family:'Playfair Display';

font-size:35px;

color:#9d6658;

}



.package-card ul{

list-style:none;

margin:30px 0;

line-height:2;

}



.package-card a{

background:#9d6658;

color:white;

padding:15px 30px;

border-radius:50px;

}



.featured{

transform:scale(1.05);

background:#f5e6df;

}







/* PROCESS */


.steps{

display:grid;

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

gap:30px;

margin-top:60px;

}



.steps span{

font-size:50px;

color:#b77b6d;

font-family:'Playfair Display';

}







/* FAQ */


.faq-box{

max-width:700px;

margin:50px auto;

}



.faq-box button{

width:100%;

padding:20px;

border:none;

background:#ead5cc;

margin-top:15px;

font-size:18px;

cursor:pointer;

}



.faq-box p{

background:white;

padding:20px;

display:none;

}







/* CONTACT */


.contact{

padding:120px 8%;

background:#f5e6df;

display:grid;

grid-template-columns:1fr 1fr;

gap:60px;

align-items:center;

}



.contact h2{

font-family:'Playfair Display';

font-size:50px;

}



form{

display:flex;

flex-direction:column;

gap:20px;

}


.form-success{

display:none;

background:#e8f0e5;

color:#3d5c3a;

padding:16px 20px;

border-radius:15px;

font-size:15px;

text-align:center;

}


form.submitted .form-success{

display:block;

}



input,
textarea{

padding:18px;

border:none;

border-radius:15px;

font-family:Poppins;

}



textarea{

height:150px;

}



form button{

padding:18px;

border:none;

border-radius:50px;

background:#9d6658;

color:white;

cursor:pointer;

}






/* FOOTER */


footer{

padding:60px 8%;

text-align:center;

background:#4b332c;

color:white;

}



footer h2{

font-family:'Playfair Display';

font-size:40px;

}



.socials{

display:flex;

justify-content:center;

gap:30px;

margin:30px;

}







@media(max-width:900px){


.testimonial-grid,
.package-grid,
.steps,
.contact{

grid-template-columns:1fr;

}



.featured{

transform:none;

}


}