*{
margin:0;
padding:0;
box-sizing:border-box;
font-family:Segoe UI,sans-serif;
}

body{
background:linear-gradient(180deg,#f3f7ff,#eaf1ff);
color:#222;
overflow-x:hidden;
}

/* NAVBAR */
.navbar{
position:fixed;
top:0;
width:100%;
background:rgba(11,87,208,.9);
backdrop-filter:blur(10px);
display:flex;
align-items:center;
justify-content:space-between;
padding:15px 20px;
color:white;
box-shadow:0 4px 20px rgba(0,0,0,.15);
z-index:1000;
flex-wrap:nowrap;   /* IMPORTANT */
}

.logo{
font-size:26px;
font-weight:700;
letter-spacing:.5px;
white-space:nowrap;
}

.logo span{
color:#ffd43b;
}

/* FINAL MENU FIX */
.menu{
display:flex;
align-items:center;
gap:18px;           /* thoda kam gap */
margin-left:auto;
flex-wrap:nowrap;   /* line break band */
}

.menu a{
color:white;
text-decoration:none;
padding:6px 4px;    /* padding kam kiya */
font-weight:500;
cursor:pointer;
transition:.3s;
white-space:nowrap; /* About neeche nahi jayega */
}

.logo{
font-size:26px;
font-weight:700;
letter-spacing:.5px;
}

.logo span{
color:#ffd43b;
}

/* MENU */
.menu{
display:flex;
gap:20px;
}

.menu a{
color:white;
text-decoration:none;
position:relative;
padding:6px 8px;
cursor:pointer;
font-weight:500;
transition:.3s;
}

.menu a:hover{
transform:translateY(-2px);
}

.menu a::after{
content:"";
position:absolute;
left:0;
bottom:-4px;
width:0%;
height:2px;
background:#ffd43b;
transition:.3s;
}

.menu a:hover::after{
width:100%;
}

/* CONTAINER */
.container{
max-width:950px;
margin:auto;
padding:110px 20px 40px;
}

/* PAGE ANIMATION */
.page{
display:none;
animation:fade .5s ease;
}

.page.active{
display:block;
}

@keyframes fade{
from{opacity:0;transform:translateY(15px);}
to{opacity:1;transform:translateY(0);}
}

/* NOTICE */
.notice{
background:#ffffff;
border-left:5px solid #ffd43b;
padding:12px 16px;
border-radius:10px;
margin-bottom:20px;
font-size:14px;
font-weight:500;
display:flex;
align-items:center;
gap:10px;
box-shadow:0 6px 18px rgba(0,0,0,.08);
}

/* HERO */
.hero{
background:linear-gradient(135deg,#0b57d0,#4f8cff);
color:white;
padding:60px 25px;
border-radius:18px;
text-align:center;
box-shadow:0 12px 30px rgba(0,0,0,.2);
position:relative;
overflow:hidden;
}

.hero::before{
content:"";
position:absolute;
width:200%;
height:200%;
background:rgba(255,255,255,.05);
top:-50%;
left:-50%;
transform:rotate(25deg);
}

.hero h1{
font-size:36px;
margin-bottom:10px;
}

.hero h1 span{
color:#ffd43b;
}

.hero button{
margin-top:18px;
padding:13px 26px;
border:none;
background:white;
color:#0b57d0;
font-weight:bold;
border-radius:10px;
cursor:pointer;
transition:.3s;
animation:pulse 1.4s infinite;
}

.hero button:hover{
transform:translateY(-2px);
box-shadow:0 5px 15px rgba(0,0,0,.2);
}

@keyframes pulse{
0%{transform:scale(1);}
50%{transform:scale(1.06);}
100%{transform:scale(1);}
}

/* CARD (NEW PREMIUM STYLE) */
.card{
background:white;
padding:15px;
margin-top:22px;
border-radius:16px;
box-shadow:0 8px 25px rgba(0,0,0,.08);
transition:.35s;
overflow:hidden;
}

.card:hover{
transform:translateY(-6px);
box-shadow:0 15px 35px rgba(0,0,0,.15);
}

.card img{
width:100%;
border-radius:12px;
transition:.4s;
}

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

.card h3{
margin-top:10px;
}

.card button{
margin-top:12px;
padding:11px 16px;
background:linear-gradient(90deg,#0b57d0,#0047c2);
color:white;
border:none;
border-radius:8px;
cursor:pointer;
transition:.3s;
}

.card button:hover{
opacity:.9;
}

/* BUTTON CLICK EFFECT */
button:active{
background:#ffd43b !important;
color:#000 !important;
transform:scale(.95);
}

/* GALLERY */
.gallery{
display:grid;
grid-template-columns:repeat(auto-fit,minmax(160px,1fr));
gap:18px;
margin-top:20px;
}

.gallery img{
width:100%;
border-radius:12px;
cursor:pointer;
transition:.4s;
box-shadow:0 5px 15px rgba(0,0,0,.1);
}

.gallery img:hover{
transform:scale(1.07);
}

/* IMAGE VIEWER */
.imageViewer{
position:fixed;
top:0;
left:0;
width:100%;
height:100%;
background:rgba(0,0,0,.92);
display:none;
justify-content:center;
align-items:center;
z-index:2000;
animation:fade .3s;
}

.imageViewer img{
max-width:90%;
max-height:90%;
border-radius:14px;
}

/* WHATSAPP FLOAT */
.whatsapp{
position:fixed;
right:20px;
bottom:20px;
width:62px;
height:62px;
background:#25D366;
color:white;
border-radius:50%;
display:flex;
justify-content:center;
align-items:center;
font-size:28px;
cursor:pointer;
animation:whatsappBlink 1.2s infinite;
box-shadow:0 0 18px #25D366;
transition:.3s;
}

.whatsapp:hover{
transform:scale(1.1);
}

@keyframes whatsappBlink{
0%,100%{transform:scale(1);}
50%{transform:scale(1.15);}
}

/* MOBILE */
@media(max-width:768px){
.menu{
gap:12px;
font-size:14px;
}
.hero h1{
font-size:26px;
}
}
/* CONTACT DESIGN */
.contactBox{
background:white;
padding:18px;
border-radius:14px;
box-shadow:0 6px 18px rgba(0,0,0,.08);
margin-top:15px;
}

.contactItem{
display:flex;
align-items:center;
gap:15px;
padding:12px 0;
border-bottom:1px solid #eee;
}

.contactItem:last-child{
border-bottom:none;
}

.contactItem i{
font-size:22px;
color:#0b57d0;
width:35px;
text-align:center;
}

.contactItem h3{
font-size:16px;
margin-bottom:3px;
}

.contactItem p{
font-size:14px;
color:#555;
}

/* CALL LINK */
.callLink{
text-decoration:none;
color:#222;
font-weight:600;
}

/* WHATSAPP BUTTON */
.waBtn{
padding:9px 16px;
background:#25D366;
color:white;
border:none;
border-radius:8px;
cursor:pointer;
font-weight:600;
margin-top:5px;
}

/* MAP LINK */
.mapLink{
display:inline-block;
margin-top:6px;
text-decoration:none;
color:#0b57d0;
font-weight:600;
}

/* MAP */
.mapBox{
margin-top:18px;
}
/* LOCATION TEXT NORMAL */
.locationText{
color:#555;
cursor:default;
}

/* CALL BUTTON (same feel as WhatsApp) */
.callBtn{
padding:9px 16px;
background:#25D366;
color:white;
border:none;
border-radius:8px;
cursor:pointer;
font-weight:600;
margin-top:5px;
transition:.3s;
}

.callBtn:hover{
opacity:.9;
}

.callBtn:active{
background:#1ebe5d;
transform:scale(.96);
}

/* OPEN LIVE LOCATION SAME AS WHATSAPP */
.mapLink{
display:inline-block;
margin-top:6px;
padding:9px 16px;
background:#25D366;
color:white;
border-radius:8px;
text-decoration:none;
font-weight:600;
transition:.3s;
}

.mapLink:hover{
opacity:.9;
}

.mapLink:active{
background:#1ebe5d;
transform:scale(.96);
}
/* CONTACT BUTTON SAME STYLE (NO CHANGE DESIGN) */
.contact-btn{
    display:inline-block;
    text-decoration:none;
    padding:12px 20px;
    margin:8px 5px;
    border-radius:8px;
    font-weight:600;
    transition:0.3s;
    color:white;
}

/* DEFAULT BLUE (jaise pehle tha) */
.call-btn,
.whatsapp-btn,
.location-btn{
    background:#0d6efd;
}

/* HOVER EFFECT */
.contact-btn:hover{
    background:#0b5ed7;
}

/* CLICK EFFECT (PHONE / WHATSAPP jaisa BLUE PRESS) */
.contact-btn:active{
    background:#0a58ca;
    transform:scale(0.96);
}

/* LOCATION BACKGROUND BLUE REMOVE */
.location-box{
    background:transparent !important;
}
.contact-btn{
display:inline-block;
background:#0d6efd;
color:#fff;
padding:12px 18px;
border-radius:8px;
text-decoration:none;
font-weight:600;
margin-top:6px;
transition:0.3s;
}

.contact-btn:hover{
background:#0b5ed7;
}

.contact-btn:active{
background:#0a58ca;
transform:scale(0.96);
}
/* ===== CONTACT BUTTON STYLE ===== */

.contact-btn{
display:inline-flex;
align-items:center;
gap:8px;
background:#0b57d0;
color:#fff;
padding:12px 22px;
border-radius:30px;
text-decoration:none;
font-weight:600;
margin-top:8px;
box-shadow:0 4px 12px rgba(11,87,208,0.25);
transition:.3s;
}

.contact-btn:hover{
background:#0847b8;
transform:translateY(-2px);
box-shadow:0 6px 18px rgba(11,87,208,0.35);
}

.contact-btn:active{
transform:scale(.95);
}

/* LOCATION CARD */
.locationText{
margin-top:8px;
padding:12px 15px;
background:#f4f7ff;
border-radius:10px;
display:flex;
align-items:center;
gap:10px;
font-weight:500;
box-shadow:0 2px 8px rgba(0,0,0,.05);
}

.locationText i{
color:#0b57d0;
font-size:18px;
}
/* ===== CONTACT BUTTON SAME ORIGINAL STYLE ===== */

.callBtn,
.waBtn,
.mapBtn{
padding:10px 16px;
background:#0b57d0;
color:white;
border:none;
border-radius:8px;
cursor:pointer;
font-weight:600;
margin-top:6px;
transition:.2s;
}

/* hover */
.callBtn:hover,
.waBtn:hover,
.mapBtn:hover{
opacity:.9;
}

/* CLICK PRESS EFFECT (OLD BLUE HOLD STYLE) */
.callBtn:active,
.waBtn:active,
.mapBtn:active{
background:#0847b8;
transform:scale(.95);
}

.locationText{
margin-top:6px;
color:#555;
font-size:14px;
}
/* ===== CONTACT BUTTON SAME AS HOME BOOK NOW ===== */

/* buttons container */
.contactButtons{
display:flex;
flex-direction:column;
gap:12px;
margin-top:15px;
}

/* SAME STYLE AS BOOK NOW BUTTON */
.callBtn,
.waBtn,
.mapBtn{
display:inline-block;
text-align:center;
text-decoration:none;
padding:12px 25px;
border-radius:8px;
font-weight:600;
cursor:pointer;

/* HOME BOOK NOW COLOR */
background:#0b57d0;
color:#fff;

transition:0.3s ease;
border:none;
}

/* HOVER */
.callBtn:hover,
.waBtn:hover,
.mapBtn:hover{
background:#0842a0;
transform:translateY(-2px);
}

/* CLICK PRESS EFFECT (OLD BLUE HOLD STYLE) */
.callBtn:active,
.waBtn:active,
.mapBtn:active{
transform:scale(0.95);
background:#062d73;
}

/* ADDRESS STYLE IMPROVE */
.address{
margin-top:10px;
font-size:15px;
color:#333;
display:flex;
align-items:center;
gap:6px;
}
/* ===== BUTTON WHITE + LIGHT BLUE STYLE ===== */

.callBtn,
.waBtn,
.mapBtn{
background:#ffffff;        /* white background */
color:#0b57d0;             /* blue text */
border:2px solid #0b57d0;  /* blue border */
}

/* HOVER */
.callBtn:hover,
.waBtn:hover,
.mapBtn:hover{
background:#e8f0fe;   /* light google blue */
color:#0b57d0;
}

/* CLICK / HOLD EFFECT (BLUE PRESS STYLE) */
.callBtn:active,
.waBtn:active,
.mapBtn:active{
background:#0b57d0;
color:#ffffff;
transform:scale(0.96);
}
/* ===== BLUE WITH SOFT RIGHT LIGHT ===== */
.homeCopyright{
    width:100vw;
    margin-left:calc(-50vw + 50%);
    margin-top:80px;
    padding:26px 0;
    text-align:center;
    font-size:14px;

    background:linear-gradient(to right,
        #0b57d0 0%,
        #0847b8 75%,
        #dbe7ff 100%
    );

    color:#ffffff;
    font-weight:500;
    letter-spacing:.7px;
    border-top:3px solid #ffd43b;
}

/* brand highlight */
.homeCopyright strong{
    color:#ffd43b;
    font-weight:600;
}
/* ===== HOME NOTICE BOARD ===== */
.noticeBoard{
display:flex;
align-items:center;
gap:15px;
background:linear-gradient(135deg,#ffffff,#f4f8ff);
padding:18px 20px;
border-radius:16px;
box-shadow:0 8px 25px rgba(0,0,0,.08);
margin-bottom:25px;
position:relative;
overflow:hidden;
animation:fade .6s ease;
border-left:5px solid #ffd43b;
}

.noticeBoard::before{
content:"";
position:absolute;
right:-40px;
top:-40px;
width:120px;
height:120px;
background:rgba(11,87,208,.08);
border-radius:50%;
}

.noticeIcon{
width:55px;
height:55px;
background:linear-gradient(135deg,#0b57d0,#4f8cff);
color:#fff;
display:flex;
align-items:center;
justify-content:center;
border-radius:50%;
font-size:22px;
box-shadow:0 6px 18px rgba(11,87,208,.25);
}

.noticeText h3{
font-size:17px;
margin-bottom:4px;
color:#0b57d0;
}

.noticeText p{
font-size:15px;
font-weight:600;
color:#333;
}