:root{
    --black:#030303;
    --dark:#080808;
    --panel:#101012;
    --white:#ffffff;
    --muted:#b5b5b8;
    --soft:#f5f5f7;
    --gold:#c9a46a;
    --gold-light:#f5d69b;
    --border:rgba(255,255,255,.12);
}

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

html{
    scroll-behavior:smooth;
}

body{
    font-family:'Oswald',sans-serif;
    color:var(--white);
    background:var(--black);
    overflow-x:hidden;
}

a{
    color:inherit;
    text-decoration:none;
}

button{
    font:inherit;
}

img{
    max-width:100%;
    display:block;
}

.welcome-notice{
    position:fixed;
    top:98px;
    left:50%;
    z-index:100;
    width:min(560px,calc(100% - 28px));
    padding:14px 18px;
    border:1px solid rgba(117,220,158,.32);
    border-radius:16px;
    color:#d9ffe8;
    background:rgba(13,35,23,.92);
    backdrop-filter:blur(18px);
    transform:translateX(-50%);
    box-shadow:0 18px 60px rgba(0,0,0,.45);
    animation:noticeIn .5s ease both;
}

.welcome-notice strong{
    margin-right:5px;
}

@keyframes noticeIn{
    from{
        opacity:0;
        transform:translate(-50%,-16px);
    }
    to{
        opacity:1;
        transform:translate(-50%,0);
    }
}

.topbar{
    position:fixed;
    top:18px;
    left:50%;
    z-index:50;
    width:calc(100% - 36px);
    max-width:1260px;
    min-height:66px;
    padding:8px 10px 8px 18px;
    border:1px solid var(--border);
    border-radius:999px;
    background:rgba(8,8,9,.72);
    backdrop-filter:blur(20px);
    -webkit-backdrop-filter:blur(20px);
    box-shadow:0 20px 70px rgba(0,0,0,.42);
    transform:translateX(-50%);
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:24px;
}

.brand{
    display:flex;
    align-items:center;
    gap:12px;
    flex:none;
}

.brand img{
    width:43px;
    height:43px;
    object-fit:contain;
}

.brand span{
    font-family:'Cinzel',serif;
    font-size:15px;
    font-weight:900;
    letter-spacing:2px;
}

.desktop-nav{
    display:flex;
    align-items:center;
    gap:27px;
    color:#c6c6ca;
    font-size:13px;
    font-weight:500;
    letter-spacing:.6px;
}

.desktop-nav a{
    transition:.25s ease;
}

.desktop-nav a:hover{
    color:var(--gold-light);
}

.topbar-actions{
    display:flex;
    align-items:center;
    justify-content:flex-end;
    gap:10px;
    flex:none;
}

.login-link,
.register-link{
    min-height:45px;
    padding:0 18px;
    border-radius:999px;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    font-size:13px;
    font-weight:700;
    transition:.3s ease;
}

.login-link{
    color:#ddd;
}

.login-link:hover{
    color:#fff;
    background:rgba(255,255,255,.07);
}

.register-link{
    color:#080808;
    background:linear-gradient(135deg,#fff,var(--gold-light));
}

.register-link:hover{
    transform:translateY(-2px);
    box-shadow:0 14px 35px rgba(201,164,106,.18);
}

.user-greeting{
    max-width:120px;
    color:#ddd;
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;
    font-size:13px;
}

.logout-form{
    display:flex;
}

.logout-form button{
    width:42px;
    height:42px;
    border:1px solid var(--border);
    border-radius:50%;
    color:#bbb;
    background:rgba(255,255,255,.05);
    cursor:pointer;
}

.logout-form button:hover{
    color:#fff;
    background:rgba(255,255,255,.10);
}

.hero{
    position:relative;
    min-height:100vh;
    padding:132px max(6vw,24px) 75px;
    display:grid;
    grid-template-columns:minmax(0,1fr) minmax(420px,.9fr);
    gap:clamp(45px,6vw,90px);
    align-items:center;
    overflow:hidden;
    background:
        linear-gradient(90deg,rgba(3,3,3,.96),rgba(3,3,3,.82) 48%,rgba(3,3,3,.58)),
        #030303;
}

.hero-glow{
    position:absolute;
    border-radius:50%;
    pointer-events:none;
    filter:blur(5px);
}

.hero-glow-one{
    top:-180px;
    left:-170px;
    width:540px;
    height:540px;
    background:rgba(201,164,106,.13);
}

.hero-glow-two{
    right:-190px;
    bottom:-220px;
    width:620px;
    height:620px;
    background:rgba(78,62,203,.09);
}

.hero-content{
    position:relative;
    z-index:2;
    max-width:720px;
}

.eyebrow{
    display:inline-flex;
    margin-bottom:20px;
    color:var(--gold-light);
    font-size:12px;
    font-weight:700;
    letter-spacing:4px;
    text-transform:uppercase;
}

.hero h1{
    max-width:760px;
    margin-bottom:25px;
    font-family:'Cinzel',serif;
    font-size:clamp(58px,7vw,108px);
    line-height:.9;
    letter-spacing:-4px;
}

.hero h1 span{
    display:block;
    color:transparent;
    -webkit-text-stroke:1px rgba(245,214,155,.82);
}

.hero p{
    max-width:570px;
    margin-bottom:33px;
    color:var(--muted);
    font-size:clamp(19px,2vw,24px);
    line-height:1.5;
}

.hero-actions{
    display:flex;
    flex-wrap:wrap;
    gap:13px;
}

.main-btn,
.secondary-btn{
    min-height:54px;
    padding:0 25px;
    border-radius:999px;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    font-size:14px;
    font-weight:800;
    letter-spacing:.6px;
    transition:.3s ease;
}

.main-btn{
    color:#090909;
    background:linear-gradient(135deg,#fff,var(--gold));
    box-shadow:0 18px 50px rgba(201,164,106,.16);
}

.secondary-btn{
    border:1px solid var(--border);
    color:#e6e6e6;
    background:rgba(255,255,255,.04);
}

.main-btn:hover,
.secondary-btn:hover{
    transform:translateY(-3px);
}

.secondary-btn:hover{
    border-color:rgba(245,214,155,.38);
    background:rgba(255,255,255,.08);
}

.hero-details{
    margin-top:39px;
    display:flex;
    flex-wrap:wrap;
    gap:20px;
    color:#77777d;
    font-size:10px;
    font-weight:700;
    letter-spacing:2.6px;
    text-transform:uppercase;
}

.hero-details span{
    display:flex;
    align-items:center;
    gap:20px;
}

.hero-details span:not(:last-child)::after{
    content:"";
    width:4px;
    height:4px;
    border-radius:50%;
    background:var(--gold);
}

.hero-video{
    position:relative;
    z-index:2;
    width:100%;
    height:min(78vh,820px);
    min-height:610px;
    border:1px solid rgba(255,255,255,.14);
    border-radius:44px;
    overflow:hidden;
    box-shadow:
        0 45px 140px rgba(0,0,0,.7),
        inset 0 1px 0 rgba(255,255,255,.14);
}

.hero-video::before{
    content:"";
    position:absolute;
    inset:0;
    z-index:1;
    background:
        linear-gradient(to top,rgba(0,0,0,.72),transparent 42%,rgba(0,0,0,.24)),
        linear-gradient(110deg,rgba(201,164,106,.11),transparent 42%);
    pointer-events:none;
}

.hero-video video{
    width:100%;
    height:100%;
    object-fit:cover;
    transform:scale(1.015);
}

.video-caption{
    position:absolute;
    left:28px;
    right:28px;
    bottom:28px;
    z-index:2;
    padding-top:18px;
    border-top:1px solid rgba(255,255,255,.18);
}

.video-caption small,
.video-caption strong{
    display:block;
}

.video-caption small{
    margin-bottom:5px;
    color:var(--gold-light);
    font-size:9px;
    font-weight:700;
    letter-spacing:3px;
}

.video-caption strong{
    font-family:'Cinzel',serif;
    font-size:18px;
}

.experience-strip{
    padding:0 6vw 80px;
    display:grid;
    grid-template-columns:repeat(3,1fr);
    background:#030303;
}

.experience-strip article{
    min-height:135px;
    padding:28px;
    border-top:1px solid var(--border);
    border-bottom:1px solid var(--border);
    display:flex;
    gap:18px;
}

.experience-strip article:not(:last-child){
    border-right:1px solid var(--border);
}

.experience-strip article > span{
    color:var(--gold);
    font-family:'Cinzel',serif;
    font-size:13px;
    font-weight:900;
}

.experience-strip strong{
    display:block;
    margin-bottom:9px;
    font-family:'Cinzel',serif;
    font-size:18px;
}

.experience-strip p{
    color:#929297;
    font-size:15px;
    line-height:1.5;
}

.ad-section{
    min-height:100vh;
    padding:115px 7vw;
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:clamp(50px,7vw,100px);
    align-items:center;
    background:#09090a;
}

.ad-section.dark{
    background:#050505;
}

.ad-section.reverse{
    background:
        radial-gradient(circle at 80% 20%,rgba(201,164,106,.08),transparent 25%),
        #0b0b0c;
}

.ad-text{
    max-width:590px;
}

.ad-text h2,
.section-title h2,
.gallery-heading h2,
.booking-card h2,
.contact h2{
    margin-bottom:23px;
    font-family:'Cinzel',serif;
    font-size:clamp(43px,5.4vw,78px);
    line-height:1.02;
    letter-spacing:-2px;
}

.ad-text p,
.section-title p,
.booking-card p{
    color:var(--muted);
    font-size:20px;
    line-height:1.65;
}

.text-line{
    width:90px;
    height:1px;
    margin-top:32px;
    background:linear-gradient(90deg,var(--gold),transparent);
}

.ad-image{
    position:relative;
}

.ad-image img{
    width:100%;
    height:min(74vh,740px);
    border-radius:42px;
    object-fit:cover;
    box-shadow:0 35px 110px rgba(0,0,0,.42);
}

.image-label{
    position:absolute;
    right:19px;
    bottom:19px;
    padding:10px 13px;
    border:1px solid rgba(255,255,255,.15);
    border-radius:999px;
    color:#ddd;
    background:rgba(8,8,8,.68);
    backdrop-filter:blur(14px);
    font-size:9px;
    font-weight:700;
    letter-spacing:2px;
}

.full-ad{
    position:relative;
    min-height:100vh;
    display:flex;
    align-items:flex-end;
    justify-content:center;
    overflow:hidden;
    background:#000;
}

.full-ad img{
    position:absolute;
    inset:0;
    width:100%;
    height:100%;
    object-fit:cover;
    opacity:.77;
    transform:scale(1.02);
}

.full-ad::after{
    content:"";
    position:absolute;
    inset:0;
    background:
        linear-gradient(to top,rgba(0,0,0,.97),rgba(0,0,0,.22) 48%,rgba(0,0,0,.65)),
        linear-gradient(90deg,rgba(0,0,0,.35),transparent,rgba(0,0,0,.35));
}

.full-ad-content{
    position:relative;
    z-index:2;
    max-width:950px;
    padding:0 24px 100px;
    text-align:center;
}

.full-ad-content h2{
    margin-bottom:19px;
    font-family:'Cinzel',serif;
    font-size:clamp(48px,6.5vw,100px);
    line-height:.95;
    letter-spacing:-3px;
}

.full-ad-content p{
    color:#ddd;
    font-size:22px;
}

.services{
    padding:120px 7vw;
    background:
        radial-gradient(circle at 50% 0,rgba(201,164,106,.09),transparent 30%),
        #050505;
}

.section-title{
    max-width:850px;
    margin:0 auto 60px;
    text-align:center;
}

.section-title p{
    max-width:680px;
    margin:auto;
    font-size:18px;
}

.service-grid{
    max-width:1220px;
    margin:auto;
    display:grid;
    grid-template-columns:repeat(3,1fr);
    gap:20px;
}

.service-card{
    position:relative;
    min-height:315px;
    padding:30px;
    border:1px solid var(--border);
    border-radius:30px;
    overflow:hidden;
    background:
        linear-gradient(145deg,rgba(255,255,255,.085),rgba(255,255,255,.018));
    display:flex;
    flex-direction:column;
    justify-content:flex-end;
    transition:.35s ease;
}

.service-card::before{
    content:"";
    position:absolute;
    top:-70px;
    right:-65px;
    width:190px;
    height:190px;
    border-radius:50%;
    background:rgba(201,164,106,.13);
    filter:blur(5px);
}

.service-card:hover{
    border-color:rgba(245,214,155,.36);
    transform:translateY(-8px);
}

.service-number{
    position:absolute;
    top:28px;
    left:30px;
    color:rgba(245,214,155,.7);
    font-family:'Cinzel',serif;
    font-size:12px;
    font-weight:900;
}

.service-card h3{
    position:relative;
    margin-bottom:13px;
    font-family:'Cinzel',serif;
    font-size:27px;
}

.service-card p{
    position:relative;
    color:var(--muted);
    font-size:17px;
    line-height:1.5;
}

.gallery{
    padding:120px 6vw;
    background:#0a0a0b;
}

.gallery-heading{
    max-width:830px;
    margin-bottom:55px;
}

.gallery-grid{
    display:grid;
    grid-template-columns:1.3fr .7fr;
    grid-template-rows:repeat(2,minmax(260px,39vh));
    gap:18px;
}

.gallery-grid figure{
    overflow:hidden;
    border-radius:30px;
}

.gallery-grid .gallery-main{
    grid-row:1/3;
}

.gallery-grid img{
    width:100%;
    height:100%;
    object-fit:cover;
    transition:transform .6s ease;
}

.gallery-grid figure:hover img{
    transform:scale(1.035);
}

.booking-cta{
    padding:110px 6vw;
    background:
        radial-gradient(circle at 15% 50%,rgba(201,164,106,.17),transparent 30%),
        #050505;
}

.booking-card{
    max-width:1250px;
    margin:auto;
    padding:clamp(35px,6vw,75px);
    border:1px solid rgba(245,214,155,.18);
    border-radius:38px;
    background:
        linear-gradient(125deg,rgba(255,255,255,.075),rgba(255,255,255,.016));
    display:grid;
    grid-template-columns:minmax(0,1.4fr) auto;
    gap:50px;
    align-items:center;
    box-shadow:0 35px 100px rgba(0,0,0,.35);
}

.booking-card h2{
    max-width:850px;
    font-size:clamp(39px,5vw,70px);
}

.booking-card p{
    max-width:720px;
    font-size:18px;
}

.booking-actions{
    min-width:215px;
    display:grid;
    gap:12px;
}

.coming-soon{
    padding:15px 19px;
    border:1px solid rgba(117,220,158,.28);
    border-radius:16px;
    color:#cffff0;
    background:rgba(117,220,158,.08);
    text-align:center;
    font-weight:700;
}

.contact{
    padding:120px 7vw;
    background:
        radial-gradient(circle at center,rgba(201,164,106,.15),transparent 35%),
        #080808;
    text-align:center;
}

.contact-content{
    max-width:900px;
    margin:auto;
}

.contact-buttons{
    margin:40px auto 28px;
    display:flex;
    flex-wrap:wrap;
    justify-content:center;
    gap:13px;
}

.contact-buttons a{
    min-width:145px;
    padding:15px 22px;
    border:1px solid var(--border);
    border-radius:999px;
    background:rgba(255,255,255,.055);
    font-weight:700;
    transition:.3s ease;
}

.contact-buttons a:hover{
    color:#000;
    background:#fff;
    transform:translateY(-3px);
}

.address{
    color:var(--muted);
    font-size:17px;
}

footer{
    padding:34px 6vw;
    border-top:1px solid rgba(255,255,255,.07);
    background:#030303;
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:20px;
    color:rgba(255,255,255,.46);
    font-size:13px;
}

.footer-brand{
    color:var(--gold-light);
    font-family:'Cinzel',serif;
    font-weight:900;
    letter-spacing:2px;
}

.reveal{
    opacity:0;
    transform:translateY(58px);
    transition:
        opacity .85s ease,
        transform .85s cubic-bezier(.22,1,.36,1);
}

.reveal.active{
    opacity:1;
    transform:translateY(0);
}

@media(max-width:1080px){

    .desktop-nav{
        display:none;
    }

    .hero{
        grid-template-columns:1fr;
        text-align:center;
    }

    .hero-content{
        max-width:850px;
        margin:auto;
    }

    .hero p{
        margin-left:auto;
        margin-right:auto;
    }

    .hero-actions,
    .hero-details{
        justify-content:center;
    }

    .hero-video{
        height:66vh;
        min-height:470px;
    }

    .ad-section{
        grid-template-columns:1fr;
    }

    .ad-section.reverse .ad-image{
        order:2;
    }

    .ad-section.reverse .ad-text{
        order:1;
    }

    .ad-text{
        max-width:760px;
    }

    .booking-card{
        grid-template-columns:1fr;
    }

    .booking-actions{
        max-width:320px;
    }

}

@media(max-width:780px){

    .topbar{
        padding-left:13px;
    }

    .brand span{
        display:none;
    }

    .user-greeting{
        display:none;
    }

    .experience-strip{
        grid-template-columns:1fr;
        padding-inline:20px;
    }

    .experience-strip article:not(:last-child){
        border-right:0;
        border-bottom:0;
    }

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

    .gallery-grid{
        grid-template-columns:1fr;
        grid-template-rows:none;
    }

    .gallery-grid figure,
    .gallery-grid .gallery-main{
        grid-row:auto;
        min-height:390px;
    }

    footer{
        flex-direction:column;
        text-align:center;
    }

}

@media(max-width:560px){

    .topbar{
        top:10px;
        width:calc(100% - 20px);
        min-height:58px;
    }

    .brand img{
        width:38px;
        height:38px;
    }

    .login-link{
        display:none;
    }

    .register-link{
        min-height:40px;
        padding:0 14px;
        font-size:12px;
    }

    .logout-form button{
        width:38px;
        height:38px;
        font-size:11px;
    }

    .welcome-notice{
        top:82px;
        font-size:13px;
    }

    .hero{
        padding:110px 18px 60px;
    }

    .hero h1{
        font-size:50px;
        letter-spacing:-2px;
    }

    .hero p{
        font-size:18px;
    }

    .hero-actions{
        display:grid;
    }

    .main-btn,
    .secondary-btn{
        width:100%;
    }

    .hero-details{
        gap:11px;
    }

    .hero-details span{
        gap:11px;
    }

    .hero-video{
        height:55vh;
        min-height:350px;
        border-radius:28px;
    }

    .video-caption{
        left:20px;
        right:20px;
        bottom:20px;
    }

    .ad-section,
    .services,
    .gallery,
    .booking-cta,
    .contact{
        padding:82px 20px;
    }

    .ad-text h2,
    .section-title h2,
    .gallery-heading h2,
    .booking-card h2,
    .contact h2{
        font-size:39px;
        letter-spacing:-1px;
    }

    .ad-text p,
    .section-title p,
    .booking-card p{
        font-size:17px;
    }

    .ad-image img{
        height:auto;
        max-height:620px;
        border-radius:28px;
    }

    .full-ad-content{
        padding-bottom:70px;
    }

    .full-ad-content h2{
        font-size:45px;
    }

    .gallery-grid figure,
    .gallery-grid .gallery-main{
        min-height:330px;
        border-radius:25px;
    }

    .booking-card{
        padding:30px 22px;
        border-radius:27px;
    }

}