/* RESET */

*{
    margin:0;
    padding:0;

    box-sizing:border-box;
}

/* BODY */

body{
    background:#080808;

    color:#F5F1E8;

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

    overflow-x:hidden;
}

/* HEADER */

header{
    width:92%;

    position:fixed;

    top:22px;
    left:50%;

    transform:translateX(-50%);

    padding:24px 42px;

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

    z-index:1000;

    border:
    1px solid rgba(255,255,255,0.04);

    border-radius:100px;

    background:
    rgba(12,12,12,0.18);

    backdrop-filter:blur(14px);

    transition:0.45s ease;
}

/* SCROLLED */

header.scrolled{
    background:
    rgba(10,10,10,0.55);

    backdrop-filter:blur(24px);

    box-shadow:
    0 12px 40px rgba(0,0,0,0.25);
}

/* LOGO */

.logo{
    font-family:'Cormorant Garamond',serif;

    font-size:1.6rem;
    font-weight:500;

    letter-spacing:5px;

    color:#F5F1E8;
}

/* NAV */

nav{
    display:flex;

    gap:45px;
}

nav a{
    position:relative;

    color:#EAEAEA;

    text-decoration:none;

    font-size:0.85rem;

    letter-spacing:2px;

    transition:0.4s ease;
}

/* HOVER */

nav a::after{
    content:"";

    position:absolute;

    left:0;
    bottom:-8px;

    width:0%;
    height:1px;

    background:#D6C2A4;

    transition:0.5s ease;
}

nav a:hover::after{
    width:100%;
}

nav a:hover{
    color:#D6C2A4;
}

/* MENU TOGGLE */

.menu-toggle{
    display:none;

    flex-direction:column;

    gap:8px;

    cursor:pointer;

    z-index:1200;
}

.menu-toggle span{
    width:32px;
    height:1px;

    background:#F5F1E8;

    transition:0.4s ease;
}

/* MOBILE MENU */

.mobile-menu{
    position:fixed;

    top:0;
    left:0;

    width:100%;
    height:100vh;

    background:rgba(5,5,5,0.96);

    backdrop-filter:blur(20px);

    display:flex;
    flex-direction:column;

    align-items:center;
    justify-content:center;

    gap:40px;

    transform:translateY(-100%);

    transition:0.7s ease;

    z-index:1100;

    opacity:0;

    visibility:hidden;
}

/* ACTIVE */

.mobile-menu.active{
    transform:translateY(0);

    opacity:1;

    visibility:visible;
}

/* LINKS */

.mobile-menu a{
    color:#F5F1E8;

    text-decoration:none;

    font-family:'Cormorant Garamond',serif;

    font-size:2.5rem;
    font-weight:300;

    letter-spacing:2px;

    transition:0.4s ease;
}

/* HOVER */

.mobile-menu a:hover{
    color:#D6C2A4;
}

/* MOBILE */

@media(max-width:900px){

    .nav-links{
        display:none;
    }

    .menu-toggle{
        display:flex;
    }

}

/* HERO */

.hero{
    position:relative;

    min-height:100vh;

    overflow:hidden;
}

/* VIDEO */

.hero-video{
    position:absolute;

    top:0;
    left:0;

    width:100%;
    height:100%;

    object-fit:cover;
}

/* OVERLAY */

.overlay{
    position:absolute;

    inset:0;

    background:
    linear-gradient(
        to bottom,
        rgba(0,0,0,0.38),
        rgba(0,0,0,0.82)
    );
}

/* CONTENT */

.hero-content{
    position:relative;

    z-index:5;

    min-height:100vh;

    display:flex;
    flex-direction:column;

    justify-content:center;

    padding:0 7%;

    max-width:850px;
}

/* SMALL TEXT */

.hero-content p{
    color:#D6C2A4;

    letter-spacing:6px;

    margin-bottom:28px;

    font-size:0.8rem;
}

/* TITLE */

.hero-content h1{
    font-family:'Cormorant Garamond',serif;

    font-size:7rem;
    font-weight:300;

    line-height:0.92;

    margin-bottom:35px;
}

/* DESCRIPTION */

.hero-content span{
    color:#D8D8D8;

    line-height:2;

    max-width:580px;

    margin-bottom:50px;
}

/* BUTTON */

.hero-content a{
    width:fit-content;

    padding:18px 40px;

    border:
    1px solid rgba(255,255,255,0.15);

    color:#F5F1E8;

    text-decoration:none;

    letter-spacing:3px;

    font-size:0.8rem;

    transition:0.5s ease;
}

.hero-content a:hover{
    background:#F5F1E8;

    color:#0A0A0A;
}

/* MOBILE */

/* MOBILE */

@media(max-width:900px){

    nav{
        display:none;
    }

    .menu-toggle{
        display:flex;
    }

    header{
        padding:22px 28px;
    }

    .hero-content h1{
        font-size:3.5rem;

        line-height:1;
    }

    .hero-content span{
        font-size:0.95rem;
    }

}


/* COLLECTIONS */

.collections{
    padding:160px 7%;

    background:#080808;
}

/* TITLE */

.collections-title{
    margin-bottom:90px;
}

.collections-title p{
    color:#D6C2A4;

    letter-spacing:6px;

    margin-bottom:22px;

    font-size:0.8rem;
}

.collections-title h2{
    font-family:'Cormorant Garamond',serif;

    font-size:5.5rem;
    font-weight:300;

    line-height:1;
}

/* GRID */

.collections-grid{
    display:grid;

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

    gap:35px;
}

/* CARD */

.collection-card{
    position:relative;

    overflow:hidden;

    height:720px;

    cursor:pointer;
}

/* IMAGE */

.collection-card img{
    width:100%;
    height:100%;

    object-fit:cover;

    transition:1s ease;
}

/* OVERLAY */

.collection-card::after{
    content:"";

    position:absolute;

    inset:0;

    background:
    linear-gradient(
        to top,
        rgba(0,0,0,0.88),
        rgba(0,0,0,0.15)
    );
}

/* INFO */

.collection-info{
    position:absolute;

    left:40px;
    bottom:40px;

    z-index:5;
}

.collection-info h3{
    font-family:'Cormorant Garamond',serif;

    font-size:2.4rem;
    font-weight:300;

    margin-bottom:10px;
}

.collection-info span{
    color:#D8D8D8;

    letter-spacing:2px;

    font-size:0.82rem;
}

/* HOVER */

.collection-card:hover img{
    transform:scale(1.08);
}

/* MOBILE */

@media(max-width:900px){

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

    .collections-title h2{
        font-size:4rem;
    }

}

@media(max-width:600px){

    .collections{
        padding:120px 7%;
    }

    .collections-title{
        margin-bottom:60px;
    }

    .collections-title h2{
        font-size:3rem;
    }

    .collection-card{
        height:520px;
    }

    .collection-info{
        left:28px;
        bottom:28px;
    }

    .collection-info h3{
        font-size:2rem;
    }

             }


/* PHILOSOPHY */

.philosophy{
    position:relative;

    height:85vh;

    background:
    url('images/philosophy.jpg');

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

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

    text-align:center;

    overflow:hidden;
}

/* OVERLAY */

.philosophy-overlay{
    position:absolute;

    inset:0;

    background:
    linear-gradient(
        to bottom,
        rgba(0,0,0,0.55),
        rgba(0,0,0,0.82)
    );
}

/* CONTENT */

.philosophy-content{
    position:relative;

    z-index:5;

    padding:0 7%;

    max-width:900px;
}

.philosophy-content p{
    color:#D6C2A4;

    letter-spacing:6px;

    margin-bottom:28px;

    font-size:0.8rem;
}

.philosophy-content h2{
    font-family:'Cormorant Garamond',serif;

    font-size:6rem;
    font-weight:300;

    line-height:1;

    margin-bottom:35px;
}

.philosophy-content span{
    color:#D8D8D8;

    line-height:2;

    max-width:650px;

    display:block;

    margin:auto;
}

/* MOBILE */

@media(max-width:900px){

    .philosophy-content h2{
        font-size:4rem;
    }

}

@media(max-width:600px){

    .philosophy{
        height:70vh;
    }

    .philosophy-content h2{
        font-size:3rem;
    }

}


/* CAMPAIGN */

.campaign{
    padding:160px 7%;

    background:#050505;

    display:grid;

    grid-template-columns:
    1fr 1fr;

    gap:40px;
}

/* LEFT */

.campaign-left{
    height:950px;

    overflow:hidden;
}

.campaign-left img{
    width:100%;
    height:100%;

    object-fit:cover;

    transition:1s ease;
}

/* RIGHT */

.campaign-right{
    display:flex;
    flex-direction:column;

    gap:40px;
}

/* TEXT */

.campaign-text{
    padding:40px 20px;
}

.campaign-text p{
    color:#D6C2A4;

    letter-spacing:6px;

    margin-bottom:25px;

    font-size:0.8rem;
}

.campaign-text h2{
    font-family:'Cormorant Garamond',serif;

    font-size:5rem;
    font-weight:300;

    line-height:1;

    margin-bottom:30px;
}

.campaign-text span{
    color:#D8D8D8;

    line-height:2;

    display:block;

    margin-bottom:45px;

    max-width:500px;
}

/* BUTTON */

.campaign-text a{
    display:inline-block;

    padding:18px 40px;

    border:
    1px solid rgba(255,255,255,0.12);

    color:#F5F1E8;

    text-decoration:none;

    letter-spacing:3px;

    font-size:0.8rem;

    transition:0.5s ease;
}

.campaign-text a:hover{
    background:#F5F1E8;

    color:#050505;
}

/* IMAGE */

.campaign-right img{
    width:100%;
    height:520px;

    object-fit:cover;

    transition:1s ease;
}

/* HOVER */

.campaign-left:hover img,
.campaign-right:hover img{
    transform:scale(1.05);
}

/* MOBILE */

@media(max-width:900px){

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

    .campaign-left{
        height:650px;
    }

    .campaign-text h2{
        font-size:4rem;
    }

}

@media(max-width:600px){

    .campaign{
        padding:120px 7%;
    }

    .campaign-left{
        height:520px;
    }

    .campaign-text{
        padding:0;
    }

    .campaign-text h2{
        font-size:3rem;
    }

    .campaign-right img{
        height:420px;
    }

}

/* PIECES */

.pieces{
    padding:160px 7%;

    background:#080808;
}

/* TITLE */

.pieces-title{
    margin-bottom:90px;
}

.pieces-title p{
    color:#D6C2A4;

    letter-spacing:6px;

    margin-bottom:22px;

    font-size:0.8rem;
}

.pieces-title h2{
    font-family:'Cormorant Garamond',serif;

    font-size:5rem;
    font-weight:300;

    line-height:1;
}

/* GRID */

.pieces-grid{
    display:grid;

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

    gap:35px;
}

/* CARD */

.piece-card{
    background:#0E0E0E;

    overflow:hidden;

    transition:0.5s ease;
}

/* IMAGE */

.piece-card img{
    width:100%;
    height:520px;

    object-fit:cover;

    transition:1s ease;
}

/* INFO */

.piece-info{
    padding:35px;
}

.piece-info h3{
    font-family:'Cormorant Garamond',serif;

    font-size:2rem;
    font-weight:300;

    margin-bottom:10px;
}

.piece-info span{
    color:#BEBEBE;

    letter-spacing:1px;

    font-size:0.82rem;
}

/* HOVER */

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

.piece-card:hover img{
    transform:scale(1.05);
}

/* MOBILE */

@media(max-width:900px){

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

    .pieces-title h2{
        font-size:4rem;
    }

}

@media(max-width:600px){

    .pieces{
        padding:120px 7%;
    }

    .pieces-title{
        margin-bottom:60px;
    }

    .pieces-title h2{
        font-size:3rem;
    }

    .piece-card img{
        height:420px;
    }

}


/* JOURNAL */

.journal{
    padding:160px 7%;

    background:#050505;

    display:grid;

    grid-template-columns:
    1fr 1fr;

    gap:70px;

    align-items:center;
}

/* LEFT */

.journal-left p{
    color:#D6C2A4;

    letter-spacing:6px;

    margin-bottom:25px;

    font-size:0.8rem;
}

.journal-left h2{
    font-family:'Cormorant Garamond',serif;

    font-size:5rem;
    font-weight:300;

    line-height:1;

    margin-bottom:35px;
}

.journal-left span{
    color:#D8D8D8;

    line-height:2;

    display:block;

    margin-bottom:50px;

    max-width:520px;
}

/* BUTTON */

.journal-left a{
    display:inline-block;

    padding:18px 40px;

    border:
    1px solid rgba(255,255,255,0.12);

    color:#F5F1E8;

    text-decoration:none;

    letter-spacing:3px;

    font-size:0.8rem;

    transition:0.5s ease;
}

.journal-left a:hover{
    background:#F5F1E8;

    color:#050505;
}

/* IMAGE */

.journal-right{
    overflow:hidden;
}

.journal-right img{
    width:100%;
    height:760px;

    object-fit:cover;

    transition:1s ease;
}

.journal-right:hover img{
    transform:scale(1.05);
}

/* MOBILE */

@media(max-width:900px){

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

    .journal-left h2{
        font-size:4rem;
    }

}

@media(max-width:600px){

    .journal{
        padding:120px 7%;
    }

    .journal-left h2{
        font-size:3rem;
    }

    .journal-right img{
        height:500px;
    }

    }


/* FOOTER */

.footer{
    position:relative;

    height:90vh;

    background:
    url('images/footer.jpg');

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

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

    text-align:center;

    overflow:hidden;
}

/* OVERLAY */

.footer-overlay{
    position:absolute;

    inset:0;

    background:
    linear-gradient(
        to bottom,
        rgba(0,0,0,0.58),
        rgba(0,0,0,0.92)
    );
}

/* CONTENT */

.footer-content{
    position:relative;

    z-index:5;

    padding:0 7%;
}

.footer-content p{
    color:#D6C2A4;

    letter-spacing:6px;

    margin-bottom:28px;

    font-size:0.8rem;
}

.footer-content h2{
    font-family:'Cormorant Garamond',serif;

    font-size:6rem;
    font-weight:300;

    line-height:1;

    margin-bottom:45px;
}

/* BUTTON */

.footer-content a{
    display:inline-block;

    padding:18px 42px;

    border:
    1px solid rgba(255,255,255,0.12);

    color:#F5F1E8;

    text-decoration:none;

    letter-spacing:3px;

    font-size:0.8rem;

    transition:0.5s ease;
}

.footer-content a:hover{
    background:#F5F1E8;

    color:#050505;
}

/* MOBILE */

@media(max-width:900px){

    .footer-content h2{
        font-size:4rem;
    }

}

@media(max-width:600px){

    .footer{
        height:75vh;
    }

    .footer-content h2{
        font-size:3rem;
    }

}


/* FOOTER BOTTOM */

.footer-bottom{
    margin-top:60px;

    display:flex;
    flex-direction:column;

    gap:10px;

    align-items:center;
}

.footer-line{
    width:120px;
    height:1px;

    background:
    rgba(214,194,164,0.35);

    margin-bottom:12px;
}

/* TEXT */

.footer-bottom span,
.footer-bottom p{
    color:rgba(255,255,255,0.45);

    font-size:0.72rem;

    letter-spacing:2px;

    text-transform:uppercase;
}


/* REVEAL ANIMATION */

.reveal{
    opacity:0;

    transform:translateY(80px);

    transition:
    opacity 1.4s ease,
    transform 1.4s ease;
}

/* ACTIVE */

.reveal.active{
    opacity:1;

    transform:translateY(0);
}


/* FLOATING WHATSAPP */

.floating-whatsapp{

    position:fixed;

    right:25px;
    bottom:25px;

    width:74px;
    height:74px;

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

    border-radius:50%;

    background:#050505;

    border:1px solid
    rgba(201,169,125,0.25);

    color:#C9A97D;

    text-decoration:none;

    font-size:1.8rem;

    z-index:9999;

    backdrop-filter:blur(10px);

    box-shadow:
    0 0 30px
    rgba(201,169,125,0.15);

    transition:0.45s ease;
}

.floating-whatsapp:hover{

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

    background:#C9A97D;

    color:#050505;

    box-shadow:
    0 0 40px
    rgba(201,169,125,0.35);
}

/* MOBILE */

@media(max-width:768px){

    .floating-whatsapp{

        width:68px;
        height:68px;

        right:20px;
        bottom:20px;

        font-size:1.6rem;
    }

    }