/* RESET */

*{
    margin:0;
    padding:0;
    box-sizing:border-box;
}

/* BODY */

body{
    font-family:'Montserrat', sans-serif;
    background:#000;
}

/* HERO SECTION */

.hero-section{

    position:relative;

    width:100%;
    min-height:100vh;

    background-image:url('img/background.jpg');

    background-size:cover;
    background-position:center center;
    background-repeat:no-repeat;

    display:flex;
    align-items:center;
    justify-content:center;

    padding:40px 20px;

    overflow:hidden;
}

/* DARK OVERLAY */

.overlay{

    position:absolute;
    inset:0;

    background:rgba(0,0,0,0.60);

    z-index:1;
}

/* CONTENT */

.hero-content{

    position:relative;
    z-index:2;

    width:100%;
    max-width:1000px;

    text-align:center;

    color:#fff;
}

/* LOGO */

.logo{

    width:260px;
    max-width:80%;

    height:auto;

    margin-bottom:30px;
}

/* SMALL TEXT */

.top-text{

    color:#d4a54a;

    font-size:18px;
    font-weight:500;

    letter-spacing:12px;

    margin-bottom:18px;
}

/* TITLE */

.hero-content h1{

    font-family:'Cinzel', serif;

    font-size:clamp(70px, 12vw, 170px);

    line-height:0.9;

    font-weight:600;

    letter-spacing:6px;

    margin-bottom:28px;
}

/* DESCRIPTION */

.description{

    font-size:clamp(16px, 2vw, 24px);

    line-height:1.6;

    font-weight:300;

    margin-bottom:35px;
}

.description span{

    color:#d4a54a;
    font-weight:600;
}

/* BOX */

.coming-box{

    width:100%;
    max-width:580px;

    margin:auto;

    border:1px solid #d4a54a;

    padding:22px;

    background:rgba(0,0,0,0.30);

    backdrop-filter:blur(3px);
}

/* BOX TITLE */

.box-title{

    color:#d4a54a;

    font-size:18px;
    font-weight:600;

    letter-spacing:2px;

    margin-bottom:10px;
}

/* BOX TEXT */

.box-text{

    color:#fff;

    font-size:15px;

    line-height:1.5;
}

/* CONTACT INFO */

.contact-info{

    margin-top:40px;

    width:100%;
    max-width:520px;

    margin-left:auto;
    margin-right:auto;

    padding-top:25px;

    border-top:1px solid rgba(212,165,74,0.4);

    text-align:center;
}

/* CONTACT TITLE */

.contact-info h3{

    color:#fff;

    font-size:28px;

    letter-spacing:3px;

    font-weight:600;

    margin-bottom:25px;
}

/* CONTACT LINE */

.contact-line{

    display:flex;

    align-items:center;

    justify-content:center;

    gap:14px;

    margin-bottom:18px;

    color:#fff;
}

/* ICON */

.contact-line span{

    font-size:24px;

    color:#d4a54a;
}

/* TEXT */

.contact-line p{

    font-size:18px;

    line-height:1.4;
}

/* ========================= */
/* TABLET */
/* ========================= */

@media(max-width:991px){

    .logo{
        width:220px;
    }

    .top-text{
        font-size:15px;
        letter-spacing:8px;
    }

    .hero-content h1{
        letter-spacing:4px;
    }

}

/* ========================= */
/* MOBILE */
/* ========================= */

@media(max-width:768px){

    .hero-section{

        padding:30px 18px;

        background-position:center center;
    }

    .logo{

        width:170px;

        margin-bottom:22px;
    }

    .top-text{

        font-size:12px;

        letter-spacing:5px;

        margin-bottom:12px;
    }

    .hero-content h1{

        font-size:clamp(55px, 16vw, 90px);

        margin-bottom:20px;

        letter-spacing:2px;
    }

    .description{

        font-size:15px;

        line-height:1.5;

        margin-bottom:25px;
    }

    .coming-box{

        padding:18px 15px;
    }

    .box-title{

        font-size:14px;

        line-height:1.4;
    }

    .box-text{

        font-size:13px;
    }

    .contact-info{

        margin-top:30px;

        max-width:100%;
    }

    .contact-info h3{

        font-size:22px;

        letter-spacing:2px;
    }

    .contact-line{

        gap:10px;

        margin-bottom:14px;
    }

    .contact-line span{

        font-size:20px;
    }

    .contact-line p{

        font-size:15px;

        word-break:break-word;
    }

}

/* EXTRA SMALL */

@media(max-width:480px){

    .hero-section{
        min-height:100dvh;
    }

    .description br{
        display:none;
    }

}