/* ==========================================
   Aadya Hospitality
   Premium Luxury Theme
========================================== */

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



@font-face {
    font-family: 'Diodrum';
    src: url('assets/font/Diodrum-Light.otf') format('opentype');
    font-weight: 300;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Diodrum-Bold';
    src: url('assets/font/Diodrum-Bold.otf') format('opentype');
    font-weight: 700;
    font-style: normal;
    font-display: swap;
}
@font-face {
    font-family: 'Diodrum_Semibold';
    src: url('assets/font/Diodrum_Semibold.otf') format('opentype');
    font-weight: 700;
    font-style: normal;
    font-display: swap;
}
@font-face {
    font-family: 'Diodrum-Medium';
    src: url('assets/font/Diodrum-Bold.otf') format('opentype');
    font-weight: 700;
    font-style: normal;
    font-display: swap;
}
@font-face {
    font-family: 'Diodrum-Medium';
    src: url('assets/font/Diodrum-Medium.otf') format('opentype');
    font-weight: 800;
    font-style: normal;
    font-display: swap;
}

body{
    font-family:'Diodrum', Arial, sans-serif;

    margin:0;
}
/* ==========================================
Reset
========================================== */

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

html{
    scroll-behavior:smooth;
}

body{
  font-family:'Diodrum', Arial, sans-serif;
    color:#333;
    background:#fff;
    line-height:1.7;
    overflow-x:hidden;
}

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

a{
    text-decoration:none;
}

ul{
    list-style:none;
}

/* ==========================================
Variables
========================================== */

:root{

--primary:#0E2A47;
--secondary:#C8A24A;

--light:#f7f7f7;
--white:#ffffff;
--dark:#222;

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

--radius:18px;

--transition:.4s ease;

}

/* ==========================================
Container
========================================== */

.container{

width:90%;
max-width:1200px;
margin:auto;

}

/* ==========================================
Sections
========================================== */

.section{

padding:100px 0;

}

.light{

background:#f8f9fb;

}

.section-title{

text-align:center;
margin-bottom:60px;

}

.section-title h2{

 font-family:'Diodrum-Bold', Arial, sans-serif;
font-size:42px;
color:var(--primary);
position:relative;
display:inline-block;

}

.section-title h2::after{

content:'';
width:70px;
height:3px;
background:var(--secondary);
display:block;
margin:18px auto;

}

.center{

max-width:900px;
margin:auto;
text-align:center;
font-size:18px;

}

/* ==========================================
Header
========================================== */

/* ===========================
   Header
=========================== */

header{
    position:fixed;
    top:0;
    left:0;
    width:100%;
    z-index:999;
    background:rgba(14,42,71,.95);
    backdrop-filter:blur(10px);
}

.nav{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:30px;
    min-height:90px;
}

/* Logo */

.logo{
    flex:0 0 42%;
    max-width:42%;
    display:flex;
    align-items:center;
}

.logo img{
    width:100%;
    max-width:300px;
    height:auto;
    display:block;
    object-fit:contain;
}

/* Navigation */

nav{
    flex:0 0 46%;
}

nav ul{
    display:flex;
    justify-content:flex-end;
    align-items:center;
    gap:28px;
    list-style:none;
    margin:0;
    padding:0;
}

nav ul li a{
    color:#fff;
    text-decoration:none;
    font-weight:500;
    transition:.3s;
}

nav ul li a:hover{
    color:#C8A24A;
}

/* Tablet */

@media (max-width:992px){

    .logo{
        flex:0 0 38%;
        max-width:38%;
    }

    .logo img{
        max-width:380px;
    }

    nav ul{
        gap:18px;
    }

}

/* Mobile */

@media (max-width:768px){

    .nav{
        min-height:70px;
    }

    .logo{
        max-width:220px;
        flex:1;
    }

    .logo img{
        width:100%;
    }

}

/* ==========================================
Hero
========================================== */
.hero{

position:relative;

height:100vh;

overflow:hidden;

}

.hero-slider{

position:absolute;

top:0;
left:0;

width:100%;
height:100%;

}

.slide{

position:absolute;

width:100%;
height:100%;

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

opacity:0;

transition:opacity 1.5s ease;

}

.slide.active{

opacity:1;

}

.slide:nth-child(1){

background-image:url("https://images.unsplash.com/photo-1566073771259-6a8506099945?w=1800");

}

.slide:nth-child(2){

background-image:url("https://images.unsplash.com/photo-1522798514-97ceb8c4f1c8?w=1800");

}

.slide:nth-child(3){

background-image:url("https://images.unsplash.com/photo-1445019980597-93fa8acb246c?w=1800");

}
.hero{

height:100vh;

background:url('https://images.unsplash.com/photo-1566073771259-6a8506099945?auto=format&fit=crop&w=1800&q=80');

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

position:relative;

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

}

.overlay{
    position:absolute;
    inset:0;
    background:rgba(0,0,0,.45);
    z-index:1;
}

.hero-content{
    position:relative;
    z-index:5;
}

.hero-content{

position:relative;
z-index:2;

text-align:center;
color:#fff;

width:90%;
max-width:850px;

}

.hero h1{

font-family:'Diodrum-Bold',serif;
font-size:68px;
line-height:1.2;
margin-bottom:25px;

}

.hero p{

font-size:22px;
margin-bottom:40px;

}

/* ==========================================
Button
========================================== */

.btn{

display:inline-block;

padding:16px 42px;

background:var(--secondary);

color:#fff;

border-radius:50px;

font-weight:600;

transition:.35s;

box-shadow:var(--shadow);

}

.btn:hover{

transform:translateY(-4px);

background:#b58c32;

}

/* ==========================================
About
========================================== */

.about-grid{

display:grid;

grid-template-columns:1fr 1fr;

gap:70px;

align-items:center;

}

.about-grid p{

font-size:18px;

}

.about-grid img{

border-radius:20px;

box-shadow:var(--shadow);

}

/* ==========================================
Cards
========================================== */

.cards{

display:grid;

grid-template-columns:repeat(auto-fit,minmax(260px,1fr));

gap:30px;

}

.card{

background:#fff;

padding:35px;

border-radius:18px;

box-shadow:var(--shadow);

transition:.4s;

text-align:center;
    font-weight: 700;

}

.card:hover{

transform:translateY(-10px);

}

.card h3{

font-size:24px;

margin-bottom:15px;

font-family:'Diodrum_Semibold',serif;

color:var(--primary);

}

.card i{

font-size:40px;

margin-bottom:20px;

color:var(--secondary);

}

.card ul{

margin-top:15px;

}

.card li{

padding:6px 0;

}

/* ==========================================
Scope
========================================== */

/* Main 50/50 */

/* ===============================
   Scope Section
=============================== */

.scope{
    display:grid;
    grid-template-columns:repeat(2, minmax(0,1fr));
    gap:30px;
    width:100%;
}

.scope-box{
    width:100%;
    background:#fff;
    padding:35px;
    border-radius:20px;
    box-shadow:0 15px 40px rgba(0,0,0,.08);
    overflow:hidden;
}

.scope-inner{
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:20px;
    margin-top:25px;
}

.scope-inner ul{
    list-style:none;
    padding:0;
    margin:0;
}

.scope-inner li{
    display:flex;
    align-items:flex-start;
    gap:10px;
    margin-bottom:14px;
    line-height:1.6;
    word-break:break-word;
}
.scope-box h3{

margin-bottom:8px;

font-family:'Diodrum-Bold',serif;

color:#0E2A47;
text-align:center;

}

/*.scope-inner li::before{
    content:"✔";
    color:#C8A24A;
    font-weight:bold;
    flex-shrink:0;
}*/

/* Responsive */

@media(max-width:991px){

.scope{

grid-template-columns:1fr;

}

}

@media(max-width:768px){

.scope-inner{

grid-template-columns:1fr;

}

}

/* ==========================================
Contact
========================================== */

.contact{

display:grid;

grid-template-columns:repeat(auto-fit,minmax(280px,1fr));

gap:35px;

}

.contact p{

background:#fff;

padding:30px;

border-radius:16px;

box-shadow:var(--shadow);

}

/* ==========================================
Footer
========================================== */

footer{

background:var(--primary);

color:#fff;

text-align:center;

padding:30px;

font-size:15px;

}
/* ==========================================
Luxury Glass Cards
========================================== */

.card {
    position: relative;
    overflow: hidden;
    border: 1px solid rgba(200,162,74,.12);
}

.card::before {
    content: "";
    position: absolute;
    top: -120%;
    left: -40%;
    width: 80%;
    height: 300%;
    background: rgba(255,255,255,.15);
    transform: rotate(25deg);
    transition: .8s;
}

.card:hover::before {
    left: 140%;
}

.card:hover {
    box-shadow: 0 25px 60px rgba(0,0,0,.12);
}

/* ==========================================
Value Cards
========================================== */

.card p{
    color:#666;
    font-size:15px;
    margin-top:12px;
}

.card:hover i{
    transform:scale(1.15);
    transition:.35s;
}

/* ==========================================
Hotels Cards
========================================== */

.card ul{
    margin:15px 0 0;
    padding:0;
}

.card li{
    display:flex;
    align-items:flex-start;
    gap:10px;
    margin-bottom:10px;
    line-height:1.6;
}

.card li::before{
    content:"✔";
    color:var(--secondary);
    font-size:16px;
    font-weight:bold;
    flex-shrink:0;
    margin-top:2px;
}

/* ==========================================
Section Fade
========================================== */

.section{

position:relative;

overflow:hidden;

}

.section::before{

content:"";

position:absolute;

width:220px;
height:220px;

background:rgba(200,162,74,.05);

border-radius:50%;

top:-80px;
right:-80px;

}

.section::after{

content:"";

position:absolute;

width:180px;
height:180px;

background:rgba(14,42,71,.03);

border-radius:50%;

bottom:-60px;
left:-60px;

}

/* ==========================================
Buttons
========================================== */

.btn{

letter-spacing:.5px;

}

.btn:hover{

letter-spacing:1px;

}

/* ==========================================
Hero Animation
========================================== */

.hero-content h1{

animation:fadeDown 1s ease;

}

.hero-content p{

animation:fadeUp 1.2s ease;

}

.hero-content .btn{

animation:zoomIn 1.5s ease;

}

/* ==========================================
Floating Image
========================================== */

.about-grid img{

animation:float 6s ease-in-out infinite;

}

/* ==========================================
Contact Cards
========================================== */
/* ===========================
Contact Section
=========================== */

.contact-wrapper{

display:grid;

grid-template-columns:40% 60%;

gap:50px;

align-items:start;

}

.contact-info{

display:flex;

flex-direction:column;

gap:25px;

}

.info-box{

display:flex;

gap:20px;

padding:25px;

background:#fff;

border-radius:18px;

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

transition:.3s;

}

.info-box:hover{

transform:translateY(-8px);

}

.info-box i{

width:60px;

height:60px;

background:#C8A24A;

color:#fff;

display:flex;

justify-content:center;

align-items:center;

border-radius:50%;

font-size:22px;

flex-shrink:0;

}

.info-box h3{

margin-bottom:8px;

font-family:'Diodrum-Bold',serif;

color:#0E2A47;

}

/* ===========================
Contact Form
=========================== */

.contact-form{

background:#fff;

padding:40px;

border-radius:20px;

box-shadow:0 20px 50px rgba(0,0,0,.08);

}

.form-row{

display:grid;

grid-template-columns:1fr 1fr;

gap:20px;

margin-bottom:20px;

}

.form-group{

display:flex;

flex-direction:column;

}

.form-group label{

margin-bottom:8px;

font-weight:600;

color:#0E2A47;

}

.form-group input,

.form-group textarea{

padding:15px 18px;

border:1px solid #ddd;

border-radius:10px;

font-size:15px;

font-family:Poppins,sans-serif;

transition:.3s;

}

.form-group input:focus,

.form-group textarea:focus{

outline:none;

border-color:#C8A24A;

box-shadow:0 0 10px rgba(200,162,74,.25);

}

.form-group textarea{

resize:none;

}

.contact-form .btn{

margin-top:10px;

border:none;

cursor:pointer;

}

/* ===========================
Responsive
=========================== */

@media(max-width:991px){

.contact-wrapper{

grid-template-columns:1fr;

}

}

@media(max-width:768px){

.form-row{

grid-template-columns:1fr;

}

.contact-form{

padding:25px;

}

}
.contact p{

transition:.35s;

}

.contact p:hover{

transform:translateY(-8px);

box-shadow:0 25px 55px rgba(0,0,0,.10);

}

/* ==========================================
Navbar Scroll
========================================== */

header.scrolled{

background:#081a2c;

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

transition:.4s;

}

/* ==========================================
Lists
========================================== */

.scope ul{

padding-top:10px;

}

.scope li{

transition:.3s;

}

.scope li:hover{

padding-left:10px;

color:var(--primary);

}

/* ==========================================
Footer
========================================== */

footer{

letter-spacing:.5px;

}

footer a{

color:#fff;

}

footer a:hover{

color:var(--secondary);

}

/* ==========================================
Animations
========================================== */

@keyframes fadeDown{

0%{

opacity:0;
transform:translateY(-60px);

}

100%{

opacity:1;
transform:translateY(0);

}

}

@keyframes fadeUp{

0%{

opacity:0;
transform:translateY(50px);

}

100%{

opacity:1;
transform:translateY(0);

}

}

@keyframes zoomIn{

0%{

opacity:0;
transform:scale(.8);

}

100%{

opacity:1;
transform:scale(1);

}

}

@keyframes float{

0%{

transform:translateY(0);

}

50%{

transform:translateY(-12px);

}

100%{

transform:translateY(0);

}

}

/* ==========================================
Scrollbar
========================================== */

::-webkit-scrollbar{

width:10px;

}

::-webkit-scrollbar-track{

background:#f1f1f1;

}

::-webkit-scrollbar-thumb{

background:var(--secondary);

border-radius:20px;

}

::-webkit-scrollbar-thumb:hover{

background:#b78d33;

}

/* ==========================================
Selection
========================================== */

::selection{

background:var(--secondary);

color:#fff;

}

/* ==========================================
Image Hover
========================================== */

.about-grid{

overflow:hidden;

}

.about-grid img{

transition:.6s;

}

.about-grid img:hover{

transform:scale(1.05);

}

/* ==========================================
Utility
========================================== */

.text-gold{

color:var(--secondary);

}

.bg-primary{

background:var(--primary);

}

.shadow{

box-shadow:var(--shadow);

}

.rounded{

border-radius:var(--radius);

}
/* ==========================================
   Responsive Design
========================================== */

/* Large Screens */
@media (max-width:1200px){

.hero h1{
    font-size:56px;
}

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

.section{
    padding:80px 0;
}

}

/* Laptop */
@media (max-width:992px){

.about-grid{
    grid-template-columns:1fr;
    gap:40px;
}

.scope{
    grid-template-columns:1fr;
    gap:40px;
}

.hero h1{
    font-size:48px;
}

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

.section-title h2{
    font-size:36px;
}

.cards{
    grid-template-columns:repeat(2,1fr);
}

}

/* ==========================================
   Mobile Navigation
========================================== */

.menu-toggle{

display:none;

width:45px;
height:45px;

background:var(--secondary);

border-radius:8px;

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

cursor:pointer;

}

.menu-toggle span{

display:block;

width:24px;
height:3px;

background:#fff;

margin:4px 0;

transition:.3s;

}

.menu-toggle.active span:nth-child(1){

transform:translateY(7px) rotate(45deg);

}

.menu-toggle.active span:nth-child(2){

opacity:0;

}

.menu-toggle.active span:nth-child(3){

transform:translateY(-7px) rotate(-45deg);

}

/* Tablet */

@media(max-width:768px){

header{

padding:0;

}

.nav{

height:75px;

}

.logo{

font-size:24px;

}
/* ==========================
   Logo
========================== */

.logo{
    display:flex;
    align-items:center;
    flex-shrink:0;
    text-decoration:none;
}

.logo img{
    display:block;
    width:auto;
    height:clamp(42px, 6vw, 70px);
    max-width:100%;
    object-fit:contain;
    transition:all .3s ease;
}

/* Smaller logo after scrolling */

header.scrolled .logo img{
    height:clamp(38px, 5vw, 58px);
}

/* Large Desktop */

@media (min-width:1400px){

    .logo img{
        height:72px;
    }

}
header .container{
    display:flex;
    justify-content:space-between;
    align-items:center;
    gap:20px;
}

.logo{
    flex:0 0 auto;
}

nav{
    flex:1;
    display:flex;
    justify-content:flex-end;
}
/* Tablet */

@media (max-width:992px){

    .logo img{
        height:55px;
    }

}

/* Mobile */

@media (max-width:768px){

    .logo img{
        height:48px;
    }

}

/* Small Mobile */

@media (max-width:480px){

    .logo img{
        height:42px;
    }

}

.logo-mobile{
    display:none;
}

@media (max-width:768px){
    .logo-desktop{
        display:none;
    }

    .logo-mobile{
        display:block;
        height:45px;
    }
}
.menu-toggle{

display:flex;
flex-direction:column;

}

nav{

position:absolute;

top:75px;
left:0;

width:100%;

background:rgba(14,42,71,.98);

max-height:0;

overflow:hidden;

transition:.4s;

}

nav.active{

max-height:450px;

}

nav ul{

display:flex;

flex-direction:column;

gap:0;

}

nav ul li{

border-bottom:1px solid rgba(255,255,255,.08);

}

nav ul li a{

display:block;

padding:18px 25px;

}

.hero{

height:85vh;

padding:120px 20px;

}

.hero h1{

font-size:40px;

}

.hero p{

font-size:18px;

}

.section{

padding:70px 0;

}

.cards{

grid-template-columns:1fr;

}

.about-grid{

grid-template-columns:1fr;

}

.scope{

grid-template-columns:1fr;

}

.contact{

grid-template-columns:1fr;

}

}

/* Small Phones */

@media(max-width:576px){

.container{

width:92%;

}

.hero{

height:80vh;

}

.hero h1{

font-size:34px;

line-height:1.3;

}

.hero p{

font-size:16px;

margin-bottom:30px;

}

.btn{

padding:14px 28px;

font-size:15px;

}

.section{

padding:60px 0;

}

.section-title{

margin-bottom:45px;

}

.section-title h2{

font-size:30px;

}

.card{

padding:28px;

}

.card h3{

font-size:22px;

}

.scope h3{

font-size:24px;

}

.logo{

font-size:22px;

}

footer{

font-size:14px;

padding:22px;

}

}

/* ==========================================
   Hover Effects
========================================== */

nav ul li{

position:relative;

}

nav ul li::after{

content:"";

position:absolute;

left:0;
bottom:-5px;

width:0;
height:2px;

background:var(--secondary);

transition:.3s;

}

nav ul li:hover::after{

width:100%;

}

.card{

cursor:pointer;

}

.card:hover h3{

color:var(--secondary);

}

.card:hover{

border-color:rgba(200,162,74,.3);

}

/* ==========================================
   Hero Overlay Enhancement
========================================== */



.hero-content{

position:relative;
z-index:2;

}

/* ==========================================
   Contact Section
========================================== */

.contact strong{

display:block;

font-size:18px;

margin-bottom:10px;

color:var(--primary);

}

/* ==========================================
   Footer Hover
========================================== */

footer{

transition:.4s;

}

footer:hover{

background:#081a2c;

}

/* ==========================================
   Reveal Animation Classes
========================================== */

.fade-up{

opacity:0;
transform:translateY(40px);

transition:.8s;

}

.fade-up.show{

opacity:1;
transform:translateY(0);

}

.fade-left{

opacity:0;
transform:translateX(-40px);

transition:.8s;

}

.fade-left.show{

opacity:1;
transform:translateX(0);

}

.fade-right{

opacity:0;
transform:translateX(40px);

transition:.8s;

}

.fade-right.show{

opacity:1;
transform:translateX(0);

}
/* =========================================================
   PREMIUM FINISHING
========================================================= */

body.loaded{
    animation:pageFade .8s ease;
}

@keyframes pageFade{
    from{
        opacity:0;
    }
    to{
        opacity:1;
    }
}

/* Floating decorative circles */

.hero::after{

content:"";

position:absolute;

width:550px;
height:550px;

right:-180px;
bottom:-180px;

border-radius:50%;

background:rgba(255,255,255,.05);

z-index:1;

filter:blur(2px);

}

/* ----------------------------------------------------- */

.section-title p{

max-width:700px;

margin:15px auto 0;

color:#777;

font-size:17px;

}

/* ----------------------------------------------------- */

.card{

transition:
transform .35s,
box-shadow .35s,
border .35s;

border:1px solid transparent;

}

.card:hover{

border-color:rgba(200,162,74,.35);

}

/* ----------------------------------------------------- */

.card i{

transition:.35s;

}

.card:hover i{

transform:rotate(6deg) scale(1.15);

}

/* ----------------------------------------------------- */

.about-grid img{

object-fit:cover;

min-height:420px;

}

/* =========================================================
   Button Variants
========================================================= */

.btn-outline{

display:inline-block;

padding:15px 38px;

border:2px solid var(--secondary);

color:var(--secondary);

border-radius:40px;

transition:.35s;

font-weight:600;

}

.btn-outline:hover{

background:var(--secondary);

color:#fff;

}

/* =========================================================
   Shadows
========================================================= */

.shadow-sm{

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

}

.shadow-lg{

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

}

/* =========================================================
   Rounded Helpers
========================================================= */

.rounded-sm{

border-radius:10px;

}

.rounded-lg{

border-radius:30px;

}

/* =========================================================
   Spacing Helpers
========================================================= */

.mt-1{margin-top:10px;}
.mt-2{margin-top:20px;}
.mt-3{margin-top:30px;}
.mt-4{margin-top:40px;}
.mt-5{margin-top:60px;}

.mb-1{margin-bottom:10px;}
.mb-2{margin-bottom:20px;}
.mb-3{margin-bottom:30px;}
.mb-4{margin-bottom:40px;}
.mb-5{margin-bottom:60px;}

/* =========================================================
   Flex Helpers
========================================================= */

.flex{

display:flex;

}

.flex-center{

display:flex;

justify-content:center;

align-items:center;

}

.flex-between{

display:flex;

justify-content:space-between;

align-items:center;

}

/* =========================================================
   Grid Helpers
========================================================= */

.grid-2{

display:grid;

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

gap:30px;

}

.grid-3{

display:grid;

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

gap:30px;

}

.grid-4{

display:grid;

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

gap:25px;

}

/* =========================================================
   Background Helpers
========================================================= */

.bg-light{

background:#f8f9fb;

}

.bg-dark{

background:var(--primary);

color:#fff;

}

.bg-gold{

background:var(--secondary);

color:#fff;

}

/* =========================================================
   Typography Helpers
========================================================= */

.text-center{

text-align:center;

}

.text-primary{

color:var(--primary);

}

.text-secondary{

color:var(--secondary);

}

.text-white{

color:#fff;

}

.lead{

font-size:20px;

line-height:1.8;

}

/* =========================================================
   Divider
========================================================= */

.divider{

width:80px;

height:3px;

background:var(--secondary);

margin:25px auto;

}

/* =========================================================
   Image Overlay Hover
========================================================= */

.image-box{

overflow:hidden;

border-radius:20px;

}

.image-box img{

transition:transform .6s ease;

}

.image-box:hover img{

transform:scale(1.08);

}

/* =========================================================
   Scroll To Top Button
========================================================= */

.scroll-top{

position:fixed;

right:25px;

bottom:25px;

width:48px;

height:48px;

background:var(--secondary);

color:#fff;

border-radius:50%;

display:flex;

justify-content:center;

align-items:center;

cursor:pointer;

opacity:0;

visibility:hidden;

transition:.35s;

z-index:999;

box-shadow:0 10px 30px rgba(0,0,0,.2);

}

.scroll-top.active{

opacity:1;

visibility:visible;

}

.scroll-top:hover{

transform:translateY(-5px);

}

/* =========================================================
   Loading Spinner
========================================================= */

.loader{

position:fixed;

inset:0;

background:#fff;

display:flex;

justify-content:center;

align-items:center;

z-index:99999;

transition:.6s;

}

.loader.hide{

opacity:0;

visibility:hidden;

}

.loader::before{

content:"";

width:60px;

height:60px;

border-radius:50%;

border:5px solid #eee;

border-top:5px solid var(--secondary);

animation:spin 1s linear infinite;

}

@keyframes spin{

100%{

transform:rotate(360deg);

}

}

/* =========================================================
   Accessibility
========================================================= */

a:focus,
button:focus{

outline:3px solid rgba(200,162,74,.45);

outline-offset:4px;

}

img{

max-width:100%;

height:auto;

}

/* =========================================================
   Print
========================================================= */

@media print{

header,
footer,
.btn,
.scroll-top{

display:none;

}

body{

background:#fff;

color:#000;

}

.section{

padding:30px 0;

}

}
/* ===========================
   Social Icons
=========================== */

.social-icons{
    display:flex;
    align-items:center;
    gap:12px;
    margin-left:20px;
}

.social-icons a{
    width:40px;
    height:40px;
    display:flex;
    align-items:center;
    justify-content:center;
    border-radius:50%;
    background:rgba(255,255,255,.12);
    color:#fff;
    font-size:16px;
    transition:.35s ease;
}

.social-icons a:hover{
    background:var(--secondary);
    color:#fff;
    transform:translateY(-4px);
}

/* Tablet */

@media(max-width:992px){

.social-icons{

display:none;

}

}

.footer-social{
    margin:25px 0;
    display:flex;
    justify-content:center;
    gap:18px;
}

.footer-social a{
    width:45px;
    height:45px;
    border-radius:50%;
    background:rgba(255,255,255,.1);
    color:#fff;
    display:flex;
    align-items:center;
    justify-content:center;
    font-size:18px;
    transition:.35s;
}

.footer-social a:hover{
    background:var(--secondary);
    transform:translateY(-5px);
}

/*==========================
    Our Presence
==========================*/

.presence-grid{
    display:grid;
    grid-template-columns:repeat(3,1fr);
    gap:30px;
}

.presence-card{
    position:relative;
    height:380px;
    overflow:hidden;
    border-radius:20px;
    background-size:cover;
    background-position:center;
    box-shadow:0 20px 45px rgba(0,0,0,.15);
    transition:.5s;
}

.presence-card::before{
    content:"";
    position:absolute;
    inset:0;
    background:linear-gradient(
        to top,
        rgba(0,0,0,.88),
        rgba(0,0,0,.45),
        rgba(0,0,0,.15)
    );
    z-index:1;
    pointer-events:none;   /* IMPORTANT */
}

.presence-card:hover{

    transform:translateY(-10px);

}

.overlay{
    position:absolute;
    left:1px;
    right:1px;
    bottom:0px;
    z-index:2;
    pointer-events:auto;
}

.overlay h3{

    color:#fff;
    font-size:34px;
    margin-bottom:20px;
    font-family:'Diodrum-Bold',serif;
    padding-top: 56px;
}

.overlay ul{
text-align: center;
    list-style:none;
    padding:0;
    margin:0;

}
.hotel-list,
.hotel-item,
.hotel-actions{
    position:relative;
    z-index:10;
}

.hotel-btn{
    position:relative;
    z-index:20;
    pointer-events:auto;
}
.overlay li{

    color:#fff;
    margin-bottom:12px;
    /*display:flex;*/
    align-items:center;
    gap:10px;
    font-size:16px;

}



/* Background Images */

.gujarat{
    background-image:url('assets/images/presence/gujarat.jpg');
}

.punjab{
    background-image:url('assets/images/presence/punjab.jpg');
}

.pipeline{
    background-image:url('assets/images/presence/uttarpradesh.jpg');
}

/* Responsive */

@media(max-width:992px){

.presence-grid{
grid-template-columns:repeat(2,1fr);
}

}

@media(max-width:768px){

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

.presence-card{
height:320px;
}

}



/*==========================
 Vision & Mission
==========================*/

.vision-mission{
    display:grid;
    grid-template-columns:repeat(2,1fr);
    gap:35px;
    margin-top:50px;
}

.vm-card{
    background:#fff;
    padding:45px 35px;
    border-radius:20px;
    box-shadow:0 15px 45px rgba(0,0,0,.08);
    text-align:center;
    transition:.4s ease;
    border-top:4px solid var(--secondary);
}

.vm-card:hover{
    transform:translateY(-10px);
    box-shadow:0 20px 50px rgba(0,0,0,.15);
}

.vm-icon{
    width:80px;
    height:80px;
    margin:0 auto 25px;
    border-radius:50%;
    background:rgba(200,162,74,.12);
    display:flex;
    align-items:center;
    justify-content:center;
}

.vm-icon i{
    font-size:34px;
    color:var(--secondary);
}

.vm-card h3{
   
    color:var(--primary);
    font-size:30px;
    margin-bottom:18px;
}

.vm-card p{
    color:#555;
    line-height:1.9;
    text-align:justify;
}

@media(max-width:991px){

    .vision-mission{
        grid-template-columns:1fr;
    }

}

/*==========================
 Business Solutions
==========================*/

.business-solutions{
    display:grid;
    grid-template-columns:repeat(2,1fr);
    gap:35px;
    margin-top:50px;
}

.solution-box{
    background:#fff;
    border-radius:20px;
    padding:40px;
    box-shadow:0 18px 45px rgba(0,0,0,.08);
    transition:.4s;
    position:relative;
    overflow:hidden;
}

.solution-box::before{
    content:"";
    position:absolute;
    top:0;
    left:0;
    width:100%;
    height:5px;
    background:linear-gradient(90deg,#C8A24A,#E6C76A);
}

.solution-box:hover{
    transform:translateY(-10px);
    box-shadow:0 25px 55px rgba(0,0,0,.15);
}

.solution-header{
    display:flex;
    align-items:center;
    gap:18px;
    margin-bottom:30px;
}

.solution-icon{
    width:70px;
    height:70px;
    border-radius:50%;
    background:rgba(200,162,74,.12);
    display:flex;
    justify-content:center;
    align-items:center;
}

.solution-icon i{
    color:var(--secondary);
    font-size:30px;
}

.solution-header h3{
    margin:0;
    color:var(--primary);
    font-size:30px;
    font-family:'Diodrum_Semibold',serif;
}

.solution-list{
    list-style:none;
    padding:0;
    margin:0;
}

.solution-list li{
    display:flex;
    align-items:center;
    gap:15px;
    padding:14px 0;
    border-bottom:1px solid rgba(0,0,0,.08);
    transition:.3s;
    font-size:16px;
}

.solution-list li:last-child{
    border-bottom:none;
}

.solution-list li i{
    width:42px;
    height:42px;
    border-radius:50%;
    background:#F8F4EA;
    color:var(--secondary);
    display:flex;
    justify-content:center;
    align-items:center;
    transition:.3s;
}

.solution-list li:hover{
    padding-left:10px;
    color:var(--primary);
}

.solution-list li:hover i{
    background:var(--secondary);
    color:#fff;
    transform:rotate(10deg);
}

@media(max-width:991px){

.business-solutions{
grid-template-columns:1fr;
}

}

/*=================================
    Premium CTA Section
==================================*/

.cta-section{

    position:relative;

    padding:140px 0;

    background:url("assets/images/cta-bg.jpeg") center center/cover no-repeat fixed;

    overflow:hidden;

}

.cta-overlay{

    position:absolute;

    inset:0;

    background:linear-gradient(
        135deg,
        rgba(10,27,45,.88),
        rgba(10,27,45,.70)
    );

}

.cta-content{

    position:relative;

    z-index:2;

    max-width:850px;

    margin:auto;

    text-align:center;

    color:#fff;

}

.cta-tag{

    display:inline-block;

    padding:8px 24px;

    background:rgba(200,162,74,.18);

    border:1px solid rgba(200,162,74,.4);

    color:#F4D77B;

    border-radius:50px;

    letter-spacing:2px;

    text-transform:uppercase;

    font-size:13px;

    margin-bottom:25px;

}

.cta-content h2{

    font-family:'Diodrum-Bold',serif;

    font-size:56px;

    line-height:1.2;

    margin-bottom:25px;

    color:#fff;

}

.cta-content h2 span{

    color:#C8A24A;

}

.cta-content p{

    font-size:18px;

    line-height:1.9;

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

    max-width:760px;

    margin:0 auto 40px;

}

.cta-buttons{

    display:flex;

    justify-content:center;

    gap:20px;

    flex-wrap:wrap;

}

.btn-outline{

    background:transparent;

    border:2px solid #fff;

    color:#fff;

}

.btn-outline:hover{

    background:#fff;

    color:#0E2A47;

}

/* Floating Animation */

.cta-content{

    animation:floatText 5s ease-in-out infinite;

}

@keyframes floatText{

    0%,100%{

        transform:translateY(0);

    }

    50%{

        transform:translateY(-8px);

    }

}

/* Mobile */

@media(max-width:768px){

.cta-section{

padding:90px 0;

background-attachment:scroll;

}

.cta-content h2{

font-size:36px;

}

.cta-content p{

font-size:16px;

}

}

/*==========================
      Mini CTA
==========================*/

.mini-cta{

     position:relative;

    padding:50px 0;

    background:url("assets/images/cta-small.png") center center/cover no-repeat fixed;

    overflow:hidden;
}

.mini-cta::before{

    content:"";
    position:absolute;
    inset:0;
    background:linear-gradient(90deg,
        rgba(14,42,71,.95),
        rgba(14,42,71,.75));
}

.mini-cta .container{

    position:relative;
    z-index:2;

}

.mini-cta-content{

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

}

.mini-cta-text{

    flex:1;

}

.mini-cta-text span{

    display:inline-block;
    color:#C8A24A;
    font-weight:600;
    text-transform:uppercase;
    letter-spacing:2px;
    margin-bottom:12px;
    font-size:13px;

}

.mini-cta-text h2{

    color:#fff;
    font-size:40px;
    font-family:'Diodrum_Semibold', serif;
    margin-bottom:15px;

}

.mini-cta-text p{

    color:rgba(255,255,255,.85);
    font-size:17px;
    line-height:1.8;
    margin:0;

}

.mini-cta-action{

    display:flex;
    flex-direction:column;
    gap:15px;
    min-width:240px;
    align-items:flex-end;

}

.btn-outline-light{

    background:transparent;
    color:#fff;
    border:2px solid rgba(255,255,255,.4);

}

.btn-outline-light:hover{

    background:#C8A24A;
    border-color:#C8A24A;
    color:#fff;

}

@media(max-width:991px){

.mini-cta-content{

    flex-direction:column;
    text-align:center;

}

.mini-cta-action{

    align-items:center;

}

.mini-cta-text h2{

    font-size:32px;

}

}

@media(max-width:576px){

.mini-cta{

    padding:50px 0;

}

.mini-cta-text h2{

    font-size:28px;

}

.mini-cta-action{

    width:100%;

}

.mini-cta-action .btn{

    width:100%;
    text-align:center;

}

}

/*==============================
Navigation
==============================*/

header{
    position:fixed;
    top:0;
    left:0;
    width:100%;
    z-index:9999;
    background:#0E2A47;
}

.nav{
    display:flex;
    align-items:center;
    justify-content:space-between;
}

nav ul{
    display:flex;
    gap:25px;
    list-style:none;
}

.menu-toggle{
    display:none;
    color:#fff;
    font-size:28px;
    cursor:pointer;
}

/*==============================
Mobile
==============================*/

@media(max-width:991px){

.menu-toggle{
    display:block;
    z-index:10001;
	padding-left: 10px;
}

nav{

    position:absolute;
    top:100%;
    left:0;
    width:100%;
    background:#0E2A47;

    display:none;

}

nav.active{

    display:block;

}

nav ul{

    flex-direction:column;
    padding:20px;

}

nav ul li{

    width:100%;

}

nav ul li a{

    display:block;
    padding:15px;
    border-bottom:1px solid rgba(255,255,255,.1);
    color:#fff;

}

}

.hotel-item{

    margin-bottom:22px;
    padding-bottom:18px;
    border-bottom:1px solid rgba(255,255,255,.18);

}

.hotel-item:last-child{

    margin-bottom:0;
    padding-bottom:0;
    border-bottom:none;

}

.hotel-item h4{

    color:#fff;
    font-size:18px;
    font-weight:600;
    margin-bottom:12px;

}

.hotel-links{

   /* display:flex;*/
    gap:10px;
    flex-wrap:wrap;

}

.hotel-btn{

    display:inline-flex;
    align-items:center;
    gap:8px;
    padding:8px 16px;
    border-radius:30px;
    background:rgba(255,255,255,.15);
    color:#fff;
    text-decoration:none;
    font-size:14px;
    transition:.3s ease;
    backdrop-filter:blur(8px);

}

.hotel-btn i{

    color:#C8A24A;

}

.hotel-btn:hover{

    background:#C8A24A;
    color:#fff;
    transform:translateY(-2px);

}

.hotel-btn:hover i{

    color:#fff;

}

.hotel-list{
    margin-top:20px;
}

.hotel-item{

    padding:18px 0;

    border-bottom:1px solid rgba(255,255,255,.18);

}

.hotel-item:last-child{

    border:none;

}

.hotel-info h4{

    color:#fff;

    font-size:18px;

    margin-bottom:15px;

}

.hotel-actions{

    display:flex;

    gap:10px;

    flex-wrap:wrap;

}

.hotel-btn{

    display:inline-flex;

    align-items:center;

    gap:8px;

    padding:10px 18px;

    border-radius:30px;

    font-size:14px;

    text-decoration:none;

    transition:.35s;

}

.website-btn{

    background:#C8A24A;

    color:#fff;

}

.website-btn:hover{

    background:#fff;

    color:#0E2A47;

}

.gallery-btn{

    background:rgba(255,255,255,.15);

    color:#fff;

    border:1px solid rgba(255,255,255,.25);

}

.gallery-btn:hover{

    background:#fff;

    color:#0E2A47;

}

.gallery-modal{

    display:none;

    position:fixed;

    inset:0;

    background:rgba(0,0,0,.92);

    z-index:99999;

    justify-content:center;

    align-items:center;

}

.gallery-content{

    width:90%;

    max-width:1000px;

}

#galleryImage{

    width:100%;

    border-radius:12px;

}

.gallery-thumbs{

    display:flex;

    gap:10px;

    justify-content:center;

    margin-top:15px;

}

.gallery-thumbs img{

    width:110px;

    height:75px;

    object-fit:cover;

    cursor:pointer;

    border-radius:8px;

    transition:.3s;

}

.gallery-thumbs img:hover{

    transform:scale(1.08);

}

.gallery-close{

    position:absolute;

    top:25px;

    right:40px;

    color:#fff;

    font-size:42px;

    cursor:pointer;

}

.overlay{

    pointer-events:auto;
	text-align: center;
}


.hotel-btn{
    position:relative;
    z-index:21;
}

.hotel-list{
    list-style:none;
    margin:20px 0 0;
    padding:0;
}

.hotel-list li{
    /*-display:flex;*/
    justify-content:space-between;
    align-items:center;
    gap:15px;
    padding:15px 0;
    border-bottom:1px solid rgba(255,255,255,.15);
}

.hotel-list li:last-child{
    border-bottom:none;
}

.hotel-list span{
    color:#fff;
    font-weight:600;
}


.hotel-btn{
    display:inline-flex;
    align-items:center;
    gap:6px;
    padding:8px 14px;
    border-radius:25px;
    background:rgba(255,255,255,.15);
    color:#fff;
    text-decoration:none;
    font-size:13px;
    transition:.3s;
    backdrop-filter:blur(8px);
}

.hotel-btn:hover{
    background:#C8A24A;
    color:#fff;
}

.f-panzoom__viewport>.f-panzoom__content {
    border-radius: 10px;
}

/* ==========================
   Contact CTA Menu
========================== */

.nav-cta{
    display:inline-flex;
    align-items:center;
    gap:8px;
    padding:12px 22px !important;
    border-radius:50px;
    background:linear-gradient(135deg,#C8A24A,#E5C66B);
    color:#fff !important;
    font-weight:700;
    letter-spacing:.5px;
    text-transform:uppercase;
    font-size:14px;
    box-shadow:0 8px 25px rgba(200,162,74,.35);
    transition:all .35s ease;
    position:relative;
    overflow:hidden;
}

.nav-cta i{
    font-size:15px;
}

.nav-cta:hover{
    background:linear-gradient(135deg,#E5C66B,#C8A24A);
    color:#fff !important;
    transform:translateY(-3px);
    box-shadow:0 15px 35px rgba(200,162,74,.45);
}

/* Shine Animation */

.nav-cta::before{
    content:"";
    position:absolute;
    top:0;
    left:-100%;
    width:50%;
    height:100%;
    background:linear-gradient(
        120deg,
        transparent,
        rgba(255,255,255,.45),
        transparent
    );
    transform:skewX(-25deg);
    transition:.7s;
}

.nav-cta:hover::before{
    left:150%;
}
/* =========================================================
   END OF STYLESHEET
========================================================= */