*{margin:0;padding:0;box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{
  font-family:'Hind Siliguri',sans-serif;
  background:var(--paper);
  color:var(--ink);
  line-height:1.6;
  overflow-x:hidden;
}
h1,h2,h3,h4{font-family:'Tiro Bangla',serif;font-weight:400;letter-spacing:0.2px;}
img{max-width:100%;display:block;}
a{text-decoration:none;color:inherit;}
.wrap{max-width:1180px;margin:0 auto;padding:0 24px;}
.eyebrow{
  font-size:13px;letter-spacing:2px;text-transform:uppercase;color:var(--crimson);
  font-weight:600;display:flex;align-items:center;gap:10px;margin-bottom:14px;
}
.eyebrow::before{content:""; width:24px;height:2px;background:var(--gold);display:inline-block;}


 /* HEADER BASE STYLES */
header {
  position: sticky;
  top: 0;
  z-index: 50;
  background: var(--ink);
  border-bottom: 1px solid rgba(255,255,255,0.08);
}

.nav {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 14px 24px;
  max-width: 1180px;
  margin: 0 auto;
}

.logo {
  color: var(--paper);
  font-family: 'Tiro Bangla', serif;
  font-size: 22px;
  display: flex;
  align-items: center;
  gap: 10px;
}

.logo .drop {
  width: 30px;
  height: 30px;
  border-radius: 50% 50% 50% 0;
  background: linear-gradient(135deg, var(--ember), var(--crimson-deep));
  transform: rotate(45deg);
}

.navlinks {
  display: flex;
  gap: 30px;
  list-style: none;
  align-items: center;
}

.navlinks a {
  color: rgba(246,240,230,0.8);
  font-size: 15px;
  transition: color .2s;
  text-decoration: none;
}

.navlinks a:hover {
  color: var(--gold-bright);
}

.nav-cta {
  background: var(--gold);
  color: var(--ink);
  padding: 10px 22px;
  border-radius: var(--radius);
  font-weight: 600;
  font-size: 14px;
  border: 1px solid var(--gold);
  transition: all .2s;
  text-decoration: none;
}

/* ডেক্সটপ ভিউতে মেনুর ভেতরের এক্সট্রা বাটনটি লুকানো থাকবে */
.mobile-menu-cta {
  display: none;
}
.nav-cta:hover{background:transparent;color:var(--gold-bright);}
.burger{display:none;color:var(--paper);font-size:26px;cursor:pointer;background:none;border:none;}

/* HERO */
.hero{
  position:relative;min-height:92vh;display:flex;align-items:center;
  background:#0c0a09;color:var(--paper);overflow:hidden;
}
.hero-bg{
  position:absolute;inset:0;
  background:url('images/hero-banner.png') center 30%/cover no-repeat;
  opacity:0.55;
}
.hero-bg::after{
  content:"";position:absolute;inset:0;
  background:linear-gradient(100deg, #0c0a09 28%, rgba(12,10,9,0.55) 55%, rgba(12,10,9,0.15) 100%);
}
.hero-inner{
  position:relative;z-index:2;max-width:1180px;margin:0 auto;padding:60px 24px;
  width:100%;
}
.hero-content{max-width:620px;}
.hero h1{
  font-size:clamp(34px,5vw,56px);line-height:1.2;margin-bottom:18px;
  color:var(--paper);
}
.hero h1 span{color:var(--gold-bright);}
.hero p.sub{
  font-size:18px;color:rgba(246,240,230,0.85);margin-bottom:22px;max-width:540px;
}
.badges{display:flex;flex-wrap:wrap;gap:14px;margin-bottom:34px;}
.badge{
  display:flex;align-items:center;gap:8px;font-size:14px;
  background:rgba(246,240,230,0.07);border:1px solid rgba(246,240,230,0.18);
  padding:8px 14px;border-radius:30px;color:rgba(246,240,230,0.9);
}
.badge .dot{color:var(--gold-bright);}
.hero-btns{display:flex;flex-wrap:wrap;gap:16px;}
.btn{
  display:inline-flex;align-items:center;gap:10px;padding:15px 28px;
  border-radius:var(--radius);font-weight:600;font-size:15px;
  cursor:pointer;border:1px solid transparent;transition:all .25s ease;
}
.btn-primary{background:var(--ember);color:#fff;}
.btn-primary:hover{background:var(--crimson-deep);}
.btn-outline{border:1px solid rgba(246,240,230,0.4);color:var(--paper);}
.btn-outline:hover{background:rgba(246,240,230,0.1);}
.btn-gold{background:var(--gold);color:var(--ink);}
.btn-gold:hover{background:var(--gold-bright);}

/* WHY CHOOSE US */
.section{padding:90px 0;}
.section-head{max-width:640px;margin-bottom:50px;}
.section-head h2{font-size:clamp(26px,3.4vw,38px);margin-bottom:10px;}
.section-head p{color:#5b5450;font-size:16px;}

.why-grid{
  display:grid;grid-template-columns:repeat(4,1fr);gap:1px;
  background:var(--line);border:1px solid var(--line);
}
.why-card{
  background:var(--paper);padding:36px 26px;text-align:left;
  transition:background .25s;
}
.why-card:hover{background:var(--paper-2);}
.why-num{font-family:'Tiro Bangla',serif;font-size:13px;color:var(--gold);letter-spacing:2px;margin-bottom:18px;}
.why-card h3{font-size:19px;margin-bottom:10px;}
.why-card p{font-size:14px;color:#5b5450;}

/* SERVICES */
.services-bg{background:var(--ink);color:var(--paper);}
.services-bg .section-head p{color:rgba(246,240,230,0.65);}
.services-bg .eyebrow{color:var(--gold-bright);}
.services-bg .eyebrow::before{background:var(--ember);}
.svc-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:24px;}
.svc-card{
  background:rgba(246,240,230,0.04);border:1px solid rgba(246,240,230,0.12);
  border-radius:var(--radius);overflow:hidden;transition:transform .25s,border-color .25s;
}
.svc-card:hover{transform:translateY(-6px);border-color:var(--gold);}
.svc-img{height:170px;overflow:hidden;}
.svc-img img{width:100%;height:100%;object-fit:cover;}
.svc-body{padding:22px;}
.svc-body h3{font-size:17px;margin-bottom:8px;color:var(--paper);}
.svc-body p{font-size:13.5px;color:rgba(246,240,230,0.6);}

/* PRODUCTS */
.prod-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:28px;}
.prod-card{
  background:#fff;border:1px solid var(--line);border-radius:var(--radius);
  overflow:hidden;transition:box-shadow .25s,transform .25s;
}
.prod-card:hover{box-shadow:0 18px 40px rgba(21,17,15,0.12);transform:translateY(-4px);}
.prod-img{height:230px;background:#fff;display:flex;align-items:center;justify-content:center;overflow:hidden;border-bottom:1px solid var(--line);}
.prod-img img{width:100%;height:100%;object-fit:cover;}
.prod-body{padding:22px;}
.prod-tag{font-size:12px;color:var(--crimson);font-weight:600;letter-spacing:1px;text-transform:uppercase;margin-bottom:6px;}
.prod-body h3{font-size:19px;margin-bottom:8px;}
.prod-feat{list-style:none;font-size:13px;color:#5b5450;margin-bottom:16px;}
.prod-feat li{padding:3px 0;}
.prod-feat li::before{content:"✓ ";color:var(--gold);font-weight:700;}
.prod-footer{display:flex;align-items:center;justify-content:space-between;}
.price{font-size:18px;font-weight:700;color:var(--crimson-deep);font-family:'Tiro Bangla',serif;}
.order-btn{
  background:var(--ink);color:var(--paper);padding:9px 18px;border-radius:var(--radius);
  font-size:13.5px;font-weight:600;transition:background .2s;
}
.order-btn:hover{background:var(--ember);}

/* BRANDS */
.brand-strip{
  background:var(--paper-2);border-top:1px solid var(--line);border-bottom:1px solid var(--line);
  padding:46px 0;overflow:hidden;
}
.brand-row{display:flex;gap:50px;justify-content:center;flex-wrap:wrap;font-family:'Tiro Bangla',serif;}
.brand-row span{font-size:21px;color:#8c8378;letter-spacing:1px;transition:color .2s;}
.brand-row span:hover{color:var(--crimson);}

/* PROCESS */
.process-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:0;position:relative;}
.process-step{padding:0 20px;text-align:center;position:relative;}
.process-step:not(:last-child)::after{
  content:"";position:absolute;top:34px;right:-10px;width:30px;height:1px;
  background:repeating-linear-gradient(90deg,var(--gold) 0 6px,transparent 6px 11px);
}
.step-circle{
  width:68px;height:68px;border-radius:50%;border:1.5px solid var(--gold);
  display:flex;align-items:center;justify-content:center;margin:0 auto 18px;
  font-size:26px;background:var(--paper);
}
.process-step .lbl{font-size:13px;color:var(--gold);font-weight:600;letter-spacing:1px;margin-bottom:6px;}
.process-step h4{font-size:16px;}

/* GALLERY */
.gal-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:18px;}
.gal-item{border-radius:var(--radius);overflow:hidden;height:230px;position:relative;}
.gal-item img{width:100%;height:100%;object-fit:cover;transition:transform .4s;}
.gal-item:hover img{transform:scale(1.06);}
.gal-cap{
  position:absolute;bottom:0;left:0;right:0;padding:14px 16px;
  background:linear-gradient(0deg,rgba(12,10,9,0.85),transparent);
  color:#fff;font-size:13px;
}

/* REVIEWS */
.reviews-bg{background:var(--crimson-deep);color:var(--paper);}
.reviews-bg .eyebrow{color:var(--gold-bright);}
.reviews-bg .eyebrow::before{background:var(--gold-bright);}
.reviews-bg .section-head p{color:rgba(246,240,230,0.7);}
.rev-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;}
.rev-card{
  background:rgba(246,240,230,0.06);border:1px solid rgba(246,240,230,0.14);
  border-radius:var(--radius);padding:28px;
}
.stars{color:var(--gold-bright);font-size:16px;margin-bottom:14px;letter-spacing:2px;}
.rev-card p.quote{font-size:15px;color:rgba(246,240,230,0.92);margin-bottom:18px;}
.rev-name{font-size:13px;color:rgba(246,240,230,0.55);font-weight:600;}

/* SERVICE AREAS */
.areas{display:flex;flex-wrap:wrap;gap:12px;}
.area-pill{
  border:1px solid var(--line);padding:9px 18px;border-radius:30px;font-size:14px;
  background:#fff;color:var(--ink);transition:all .2s;
}
.area-pill:hover{border-color:var(--crimson);color:var(--crimson);}

/* BOOKING FORM */
.booking-bg{background:var(--ink);color:var(--paper);}
.booking-wrap{display:grid;grid-template-columns:1fr 1.1fr;gap:60px;align-items:flex-start;}
.booking-info .eyebrow{color:var(--gold-bright);}
.booking-info .eyebrow::before{background:var(--ember);}
.booking-info h2{font-size:clamp(26px,3.4vw,36px);margin-bottom:18px;}
.booking-info p{color:rgba(246,240,230,0.65);margin-bottom:26px;font-size:15.5px;}
.contact-line{display:flex;align-items:center;gap:12px;margin-bottom:16px;font-size:15px;}
.contact-line .ico{color:var(--gold-bright);font-size:18px;}
form.booking{
  background:rgba(246,240,230,0.04);border:1px solid rgba(246,240,230,0.14);
  border-radius:var(--radius);padding:34px;
}
.frow{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin-bottom:16px;}
.fgroup{margin-bottom:16px;}
.fgroup label{display:block;font-size:13px;color:rgba(246,240,230,0.6);margin-bottom:7px;}
.fgroup input,.fgroup select,.fgroup textarea{
  width:100%;padding:12px 14px;background:rgba(246,240,230,0.06);
  border:1px solid rgba(246,240,230,0.2);border-radius:var(--radius);
  color:var(--paper);font-family:'Hind Siliguri',sans-serif;font-size:14.5px;
}
.fgroup input::placeholder,.fgroup textarea::placeholder{color:rgba(246,240,230,0.35);}
.fgroup input[type=file]{padding:9px 14px;}
.fgroup select{
    background: #000;
}
.submit-btn{
  width:100%;padding:15px;background:var(--ember);color:#fff;border:none;
  border-radius:var(--radius);font-size:15.5px;font-weight:700;cursor:pointer;
  transition:background .2s;font-family:'Hind Siliguri',sans-serif;
}
.submit-btn:hover{background:var(--gold);color:var(--ink);}

/* FOOTER */
footer{background:#0c0a09;color:rgba(246,240,230,0.7);padding:60px 0 24px;}
.foot-grid{display:grid;grid-template-columns:1.4fr 1fr 1fr 1fr;gap:40px;margin-bottom:40px;}
.foot-logo{color:var(--paper);font-family:'Tiro Bangla',serif;font-size:22px;margin-bottom:14px;display:flex;align-items:center;gap:10px;}
.foot-grid h4{color:var(--paper);font-size:15px;margin-bottom:16px;font-weight:600;font-family:'Hind Siliguri',sans-serif;}
.foot-grid ul{list-style:none;}
.foot-grid li{margin-bottom:9px;font-size:14px;}
.foot-grid a:hover{color:var(--gold-bright);}
.foot-bottom{
  border-top:1px solid rgba(246,240,230,0.1);padding-top:22px;
  display:flex;justify-content:space-between;flex-wrap:wrap;gap:10px;font-size:13px;color:rgba(246,240,230,0.4);
}
/* .social{display:flex;gap:14px;}
.social a{
  width:34px;height:34px;border:1px solid rgba(246,240,230,0.2);border-radius:50%;
  display:flex;align-items:center;justify-content:center;font-size:14px;
}
.social a:hover{border-color:var(--gold-bright);color:var(--gold-bright);} */

.social {
    display: flex;
    gap: 14px;
}

.social a {
    width: 36px;
    height: 36px;
    border: 1px solid rgba(246, 240, 230, 0.3); /* বর্ডারের অপাসিটি একটু বাড়ানো হয়েছে */
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--paper); /* ডিফল্ট কালার */
    transition: all 0.3s ease;
    text-decoration: none;
}

/* আইকনের নিজস্ব সাইজ ফিক্স করা */
.social a i[data-lucide] {
    width: 18px;
    height: 18px;
    margin: 0; /* গ্লোবাল মার্জিন রিমুভ করা হলো */
}

.social a:hover {
    border-color: var(--gold-bright);
    color: var(--gold-bright);
    background-color: rgba(255, 179, 92, 0.1); /* হোভারে হালকা ব্যাকগ্রাউন্ড */
    transform: translateY(-2px); /* হোভারে একটু উপরে উঠবে */
}

/* FLOATING BUTTONS */
.float-btns{position:fixed;bottom:24px;right:24px;z-index:60;display:flex;flex-direction:column;gap:12px;}
.fab{
  width:54px;height:54px;border-radius:50%;display:flex;align-items:center;justify-content:center;
  color:#fff;font-size:22px;box-shadow:0 10px 24px rgba(0,0,0,0.25);transition:transform .2s;
}
.fab:hover{transform:scale(1.08);}
.fab.call{background:var(--crimson);}
.fab.wa{background:#2bb24a;}



/* --- ORDER POPUP MODAL STYLES --- */
.modal-overlay {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(21, 17, 15, 0.7); /* Dark overlay */
    backdrop-filter: blur(4px);
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 1000;
    opacity: 0;
    visibility: hidden;
    transition: all 0.3s ease-in-out;
}

.modal-overlay.active {
    opacity: 1;
    visibility: visible;
}

.modal-box {
    background: var(--paper);
    width: 90%;
    max-width: 500px;
    padding: 30px;
    border-radius: 8px;
    position: relative;
    transform: translateY(-20px);
    transition: transform 0.3s ease-in-out;
    box-shadow: 0 10px 30px rgba(0,0,0,0.2);
}

.modal-overlay.active .modal-box {
    transform: translateY(0);
}

.close-btn {
    position: absolute;
    top: 15px;
    right: 20px;
    font-size: 28px;
    background: none;
    border: none;
    color: var(--ink);
    cursor: pointer;
    transition: color 0.2s;
}

.close-btn:hover {
    color: var(--ember);
}

.modal-box h2 {
    margin-bottom: 5px;
    font-size: 24px;
    color: var(--crimson-deep);
}

.modal-product-name {
    font-weight: bold;
    color: var(--gold);
    margin-bottom: 20px;
    font-size: 16px;
    border-bottom: 1px solid var(--line);
    padding-bottom: 10px;
}

.input-group {
    margin-bottom: 15px;
    text-align: left;
}

.input-group label {
    display: block;
    font-size: 14px;
    font-weight: 600;
    margin-bottom: 5px;
    color: var(--steel);
}

.input-group input,
.input-group textarea {
    width: 100%;
    padding: 10px 15px;
    border: 1px solid var(--line);
    border-radius: var(--radius);
    background: #fff;
    font-family: inherit;
    font-size: 15px;
    color: var(--ink);
}

.input-group input:focus,
.input-group textarea:focus {
    outline: none;
    border-color: var(--gold);
    box-shadow: 0 0 0 2px rgba(199, 154, 61, 0.2);
}

.submit-btn {
    width: 100%;
    background: var(--crimson-deep);
    color: var(--paper);
    padding: 12px;
    border: none;
    border-radius: var(--radius);
    font-size: 16px;
    font-weight: 600;
    cursor: pointer;
    transition: background 0.2s;
    margin-top: 10px;
}

.submit-btn:hover {
    background: var(--ember);
}

/* Update order button style in grid so it looks like a button */
.order-btn {
    background: var(--gold);
    color: var(--ink);
    padding: 8px 16px;
    border: none;
    border-radius: var(--radius);
    font-weight: 600;
    cursor: pointer;
    text-decoration: none;
}
/* আইকনের নিজস্ব সাইজ ফিক্স করা */
.social a i {
    font-size: 16px; /* Font Awesome আইকনের সাইজ */
    margin: 0;
}
/* End */

@media(max-width:980px){
    .navlinks { gap: 15px; } /* ট্যাবলেটে গ্যাপ একটু কমানো হলো */
  .why-grid{grid-template-columns:repeat(2,1fr);}
  .svc-grid{grid-template-columns:repeat(2,1fr);}
  .prod-grid{grid-template-columns:repeat(2,1fr);}
  .process-grid{grid-template-columns:repeat(2,1fr);gap:36px 0;}
  .process-step:nth-child(2)::after{display:none;}
  .gal-grid{grid-template-columns:repeat(2,1fr);}
  .rev-grid{grid-template-columns:1fr;}
  .booking-wrap{grid-template-columns:1fr;}
  .foot-grid{grid-template-columns:1fr 1fr;}
}
@media(max-width:680px){
  .burger{display:block;}
  .why-grid,.svc-grid,.prod-grid,.gal-grid{grid-template-columns:1fr;}
  .process-grid{grid-template-columns:1fr;}
  .frow{grid-template-columns:1fr;}
  .foot-grid{grid-template-columns:1fr;}
  .hero{min-height:auto;padding:40px 0;}
}
/* --- MOBILE RESPONSIVE STYLES --- */
@media screen and (max-width: 768px) {
  .burger {
    display: block;
    background: none;
    border: none;
    color: white; /* আপনার আইকনের কালার অনুযায়ী চেঞ্জ করতে পারেন */
    cursor: pointer;
  }

  /* স্লাইড মেনুর ডিজাইন */
  .navlinks {
    position: absolute;
    top: 100%;
    left: -100%;
    width: 250px;
    height: 100vh;
    background: var(--ink);
    flex-direction: column;
    align-items: flex-start;
    gap: 0;
    transition: left 0.3s ease-in-out;
    border-right: 1px solid rgba(255,255,255,0.08);
  }

  .navlinks.active {
    left: 0; /* JavaScript দিয়ে 'active' ক্লাস অ্যাড হলে মেনু শো করবে */
  }

  .navlinks li {
    width: 100%;
    text-align: left;
    border-bottom: 1px solid rgba(255, 255, 255, 0.05);
  }

  .navlinks a {
    display: block;
    padding: 15px 24px;
    font-size: 16px;
  }

  /* মোবাইলে মেনুর ভেতরের বাটনটি শো করানো */
  .mobile-menu-cta {
    display: block;
    padding: 20px 24px;
    border-bottom: none !important;
  }

  .mobile-menu-cta .nav-cta {
    display: block;
    width: 100%;
    text-align: center;
    font-size: 16px;
    padding: 12px;
    margin: 0;
  }
  a.nav-cta.header-cta {
    display: none; /* হেডারের বাটনটি মোবাইলে লুকানো */
  }
}