:root{
  --bg: #14161a;
  --panel: #1f2328;
  --muted: #9aa0a6;
  --gold: #d6b25e;
  --card: #23262a;
}

*{box-sizing:border-box}
body{
  margin:0;
  font-family:'Poppins',system-ui,-apple-system,Segoe UI,Roboto,Helvetica,Arial;
  background:var(--bg);
  color:#fff;
  -webkit-font-smoothing:antialiased;
  -moz-osx-font-smoothing:grayscale;
  line-height:1.55;
}

/* Topbar */
.topbar{
  background:#0b0c0d;
  color:var(--muted);
  font-size:.88rem;
  padding:.35rem 0;
}
.topbar a{color:var(--muted); text-decoration:none}
.topbar a:hover{color:var(--gold)}
.topbar .socials a{ color:var(--muted); }

.nav-link {
  transition: color .25s ease;
}

.nav-link:hover {
  color: var(--gold) !important;
}


/* Navbar */
/* Fix split dropdown alignment */
.navbar .nav-item.dropdown {
  display: flex;
  align-items: center;
  position: relative; /* REQUIRED */
}

.navbar .nav-item.dropdown > a {
  white-space: nowrap;
}

.navbar .dropdown-toggle-split {
  padding-left: .25rem;
  padding-right: .25rem;
}

/* Force submenu below */
.navbar .dropdown-menu {
  top: 100%;
  bottom: auto;
  margin-top: .4rem;
}


.navbar{ background:transparent; padding-top:.6rem; padding-bottom:.6rem; }
.site-logo{ height:46px; object-fit:contain; }
.navbar .nav-link{ color:#ddd; font-weight:600; text-transform:uppercase; letter-spacing:.6px; padding:.5rem .8rem; }
.navbar .nav-link.active, .navbar .nav-link:hover{ color:var(--gold); }
.btn-cta{ background:var(--gold); color:#111; border-radius:30px; padding:.45rem .9rem; font-weight:700; border:0;}
.btn-cta:hover{ background:#caa344; }
.btn-ghost{ background:transparent; color:#fff; border:1px solid rgba(255,255,255,0.03); border-radius:8px; padding:.35rem .5rem; }

/* Hero slider */
.hero-slide{
  height:88vh;
  min-height:560px;
  position:relative;
  background-size:cover;
  background-position:center;
}
.hero-overlay{ position:absolute; inset:0; background:linear-gradient(180deg, rgba(7,8,9,0.55) 0%, rgba(7,8,9,0.75) 100%); }
.hero-inner{ position:absolute; inset:0; display:flex; align-items:center; justify-content:center; text-align:center; padding:2rem; }
.hero-title{ font-size:3.1rem; line-height:1.02; font-weight:700; color:#fff; margin-bottom:.6rem; text-transform:none; letter-spacing:0.3px; }
.hero-sub{ color:var(--muted); max-width:760px; margin:0 auto 1rem; }

/* ABOUT + COLLECTIONS */
.about-row{ background:var(--panel); padding:4rem 0 2.5rem 0; border-top:1px solid rgba(255,255,255,0.02); border-bottom:1px solid rgba(255,255,255,0.02);}
.exp-box{
  position:relative;
  padding:28px 18px;
  border-radius:8px;
  background:transparent;
  min-height:140px;
}
.exp-inner{position: relative;
    z-index: 2;
    text-align: center;
    padding: 15px;}
.exp-number{ font-size:48px; font-weight:800; color:var(--gold); }
.exp-years{ color:#fff; margin-top:6px; font-weight:600; }

/* bracket corners */
.bracket{ position: absolute;
    width: 36px;
    height: 36px;
    border: 10px solid rgb(255 195 60 / 32%);
    z-index: 1;
    padding: 20px; }
.bracket-tl{ top:12px; left:12px; border-right:0; border-bottom:0; }
.bracket-tr{ top:12px; right:12px; border-left:0; border-bottom:0; }
.bracket-bl{ bottom:12px; left:12px; border-right:0; border-top:0; }
.bracket-br{ bottom:12px; right:12px; border-left:0; border-top:0; }

/* About text */
.tag{ color:var(--gold); letter-spacing:2px; font-weight:700; }
.about-head{ font-weight:700; margin-top:.3rem; font-size:28px; color:#fff; }
.about-sub{ color:var(--muted); margin-top:.5rem; max-width:760px; }

/* collection-card */


/* Global hover effect for cards/boxes */
.collection-card,
.card,
.card-why,
.blog-card,
.quote-card,
.stat-box,
.exp-box {
  transition: all .35s ease;
}

.collection-card:hover,
.card:hover,
.card-why:hover,
.blog-card:hover,
.quote-card:hover,
.stat-box:hover,
.exp-box:hover {
  transform: translateY(-6px);
  box-shadow: 0 15px 30px rgba(0,0,0,0.35);
  border-color: rgba(255,255,255,0.15);
}

.collection-card .img {
  transition: all .4s ease;
}

.collection-card:hover .img {
  transform: scale(1.08);
}


.collection-card{
  background:linear-gradient(180deg, rgba(255,255,255,0.01), rgba(255,255,255,0.01));
  border-radius:8px;
  overflow:hidden;
  position:relative;
  border:1px solid rgba(255,255,255,0.04);
}
.collection-card .img{ width:100%; height:230px; object-fit:cover; display:block; }
.collection-card .caption{ position:absolute; left:16px; top:14px; color:#fff; font-weight:700; background:rgba(0,0,0,0.25); padding:6px 10px; border-radius:6px; font-size:.9rem; }
.collection-card .read-more{ position:absolute; left:16px; bottom:16px; background:rgba(0,0,0,0.45); color:#fff; padding:8px 12px; border-radius:25px; font-weight:700; font-size:.85rem; text-decoration:none; border:1px solid rgba(255,255,255,0.03); }

/* WHY CHOOSE */
.card-why{ background:var(--card); border-radius:10px; padding:1.25rem; border:1px solid rgba(255,255,255,0.03); color:#fff; min-height:180px; }
.card-why .icon{ width:68px; height:68px; border-radius:12px; display:flex; align-items:center; justify-content:center; background:rgba(255,255,255,0.03); color:var(--gold); margin:auto; font-size:20px; }

/* PROMO */
.promo{ background-size:cover; background-position:center; border-radius:8px; overflow:hidden; min-height:280px; display:flex; align-items:center; color:#fff; }
.promo-inner{ padding:2rem; background:linear-gradient(90deg, rgba(0,0,0,0.28), rgba(0,0,0,0.6)); border-radius:8px; width:100%; height:100%; }
.promo-tag{ color:var(--gold); font-weight:700; letter-spacing:2px; font-size:.85rem; }
.promo-head{ margin-top:.4rem; }
.quote-card{ background:#26292d; border-radius:12px; padding:1.5rem; border-left:6px solid rgba(214,178,94,0.12); min-height:140px; }

/* METHOD */
.method{ background:linear-gradient(180deg, rgba(255,255,255,0.01), rgba(255,255,255,0.005)); padding:1.5rem; border-radius:8px; }

/* STATS */
.stats-row{ background:linear-gradient(180deg, rgba(255,255,255,0.01), rgba(255,255,255,0.005)); padding:1.5rem 0; }
.stat-box{ text-align:center; padding:1.25rem; }
.stat-box .big{ font-size:34px; color:var(--gold); font-weight:800; }
.stat-box .text{ color:var(--muted); }

/* DESIGNS GRID */
.blog-card, .blog-thumb{ background:var(--card); border-radius:8px; border:1px solid rgba(255,255,255,0.03); }
.blog-thumb{ height:160px; object-fit:cover; }

/* CTA BANNER */
.cta-banner{ background: linear-gradient(180deg, rgba(0,0,0,0.12), rgba(0,0,0,0.28)); padding:3rem 0; text-align:center; }

/* Footer */
/* =========================
   FOOTER STRUCTURE
   ========================= */
.site-footer{
  background:#0b0c0e;
  color:#fff;
}

/* Main footer */
.footer-main{
  padding:35px 0;
}

.footer-logo{
  height:42px;
  margin-bottom:15px;
}

.footer-text{
  color:var(--muted);
  font-size:0.95rem;
}

/* Section headings with line */
.footer-links h6{
  color:var(--gold);
  margin-bottom:15px;
  position:relative;
  padding-bottom:8px;
}

.footer-links h6::after{
  content:"";
  position:absolute;
  left:0;
  bottom:0;
  width:40px;
  height:2px;
  background:var(--gold);
}

/* Links */
.footer-links ul li{
  margin-bottom:8px;
}

.footer-links ul li,
.footer-links ul li a{
  color:var(--muted);
  text-decoration:none;
  font-size:0.9rem;
}

.footer-links ul li a:hover{
  color:#fff;
}

/* Address icons */
.footer-address li{
  display:flex;
  gap:10px;
  align-items:flex-start;
}

.footer-address i{
  color:var(--gold);
  margin-top:3px;
}

/* Social icons */
.footer-social{
  display:flex;
  gap:12px;
  margin-top:15px;
}

.footer-social a{
  width:36px;
  height:36px;
  border:1px solid rgba(255,255,255,0.15);
  border-radius:50%;
  display:flex;
  align-items:center;
  justify-content:center;
  color:#fff;
  transition:0.3s;
}

.footer-social a:hover{
  background:var(--gold);
  border-color:var(--gold);
  color:#000;
}

/* Bottom bar */
.footer-bottom{
  background:#070809;
  border-top:1px solid rgba(255,255,255,0.08);
  padding:15px 0;
  text-align:center;
}

.footer-bottom p{
  margin:0;
  font-size:0.85rem;
  color:var(--muted);
}

/* Mobile */
@media (max-width: 768px){
  .footer-main{
    text-align:center;
  }

  .footer-links h6::after{
    left:50%;
    transform:translateX(-50%);
  }

  .footer-address li{
    justify-content:center;
  }

  .footer-social{
    justify-content:center;
  }
}

.muted{ color:var(--muted); }

/* small screens */
@media (max-width:992px){
  .hero-title{ font-size:2.25rem; }
  .collection-card .img{ height:200px; }
  .exp-inner{text-align:center;}
  .exp-box{ padding:20px; }
}
@media (max-width:576px){
  .hero-slide{ height:68vh; min-height:420px; }
  .hero-title{ font-size:1.6rem; }
  .collection-card .img{ height:150px; }
}
.promo-video-section {
  background: url('assets/image/bg-dark.jpg') center/cover no-repeat fixed;
  position: relative;
  color: #fff;
  padding: 100px 0;
}

.promo-video-section .dark-overlay {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: rgba(10, 10, 10, 0.6);
}

.bg-gold {
  background: var(--gold);
}

.video-box {
  border-radius: 10px;
  overflow: hidden;
  cursor: pointer;
}

.video-thumb {
  transition: 0.3s ease;
}

.video-box:hover .video-thumb {
  transform: scale(1.04);
}



.play-btn:hover {
  background: #fff;
}

.play-btn {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 70px;
  height: 70px;
  background: rgba(255, 200, 0, 0.9);
  color: #000;
  border-radius: 50%;
  display: flex;
  justify-content: center;
  align-items: center;
  font-size: 28px;
  transition: 0.3s;
  cursor: pointer;
}

.video-box:hover .play-btn {
  background: white;
}

.video-box {
  cursor: pointer;
}

        .about-hero {
            background: url("assets/img/about-banner.jpg") center/cover no-repeat;
            padding: 180px 0 140px;
            position: relative;
        }

        .about-hero::after {
            content: "";
            position: absolute;
            inset: 0;
            background: rgba(0,0,0,0.45);
        }

        .about-hero h1 {
            position: relative;
            z-index: 2;
            color: #fff;
            font-size: 54px;
        }

        .breadcrumb-light {
            position: relative;
            z-index: 2;
            color: #fff;
            opacity: .9;
        }


/* Show dropdown on hover only for wide pointer devices */
@media (min-width: 992px) and (hover: hover) and (pointer: fine) {
  .navbar .dropdown:hover > .dropdown-menu {
    display: block;
    margin-top: 0; /* avoid jump if you have margin on dropdown */
    visibility: visible;
    opacity: 1;
  }

  /* Optional: keep the parent li highlighted when open */
  .navbar .dropdown:hover > .nav-link {
    color: inherit;
  }
}


/* Glass Modal */
.glass {
  background: linear-gradient(180deg, rgba(31,35,40,.9), rgba(20,22,26,.95));
  backdrop-filter: blur(14px);
  border-radius: 18px;
  border: 1px solid rgba(255,255,255,.06);
  overflow: hidden;
  animation: scaleIn .35s ease;
}

@keyframes scaleIn {
  from { transform: scale(.96); opacity: 0; }
  to { transform: scale(1); opacity: 1; }
}

/* Left visual */
.appointment-visual {
  background: url('assets/image/sl3.jpg') center/cover no-repeat;
  position: relative;
  padding: 40px;
  color: #fff;
}

.appointment-visual::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg, rgba(0,0,0,.4), rgba(0,0,0,.85));
}

.visual-content {
  position: relative;
  z-index: 2;
}

.visual-content .badge {
  background: var(--gold);
  color: #111;
  font-weight: 700;
  padding: 6px 12px;
  border-radius: 20px;
  font-size: .75rem;
}

.visual-content h3 {
  margin-top: 20px;
  font-weight: 700;
}

.visual-content p {
  color: #ccc;
  margin-top: 10px;
}

/* Floating form */
.appointment-form {
  display: flex;
  flex-direction: column;
  gap: 18px;
}

.floating-group {
  position: relative;
}

.floating-group input,
.floating-group select,
.floating-group textarea {
  width: 100%;
  padding: 14px 42px 14px 14px;
  background: #14161a;
  border: 1px solid rgba(255,255,255,.08);
  border-radius: 10px;
  color: #fff;
  outline: none;
}

.floating-group label {
  position: absolute;
  left: 14px;
  top: 50%;
  transform: translateY(-50%);
  color: #aaa;
  font-size: .85rem;
  pointer-events: none;
  transition: .25s;
}

.floating-group textarea + label {
  top: 18px;
  transform: none;
}

.floating-group input:focus + label,
.floating-group input:valid + label,
.floating-group select:focus + label,
.floating-group select:valid + label,
.floating-group textarea:focus + label,
.floating-group textarea:not(:placeholder-shown) + label {
  top: -8px;
  left: 10px;
  background: #1f2328;
  padding: 0 6px;
  font-size: .7rem;
  color: var(--gold);
}

.floating-group .icon {
  position: absolute;
  right: 12px;
  top: 50%;
  transform: translateY(-50%);
  opacity: .6;
}

/* Mobile */
@media (max-width: 768px) {
  .appointment-visual {
    display: none;
  }
}



/* =========================
   CTA + FOOTER BACKGROUND
   ========================= */
.cta-footer-wrap{
  position: relative;
  background: url("../image/h2-banner6.jpg") center/cover no-repeat;
  color: #fff;
}

.cta-footer-overlay{
  position: absolute;
  inset: 0;
  background: linear-gradient(
    180deg,
    rgba(5,7,9,0.65) 0%,
    rgba(5,7,9,0.75) 40%,
    rgba(5,7,9,0.9) 100%
  );
  z-index: 1;
}

/* keep content above overlay */
.cta-footer-wrap > *{
  position: relative;
  z-index: 2;
}

/* CTA spacing */
.cta-section{
  padding: 100px 0 20px;
}

/* Footer spacing */
.site-footer{
  background: transparent;
  padding-bottom: 60px;
}

/* Bottom bar */
.footer-bottom{
  background: #070809;
  padding: 15px 0;
  text-align: center;
}

.footer-bottom p{
  margin: 0;
  color: var(--muted);
  font-size: 0.85rem;
}




:root{
      --bg: #14161a;
      --panel: #1f2328;
      --muted: #9aa0a6;
      --gold: #d6b25e;
      --card: #23262a;
    }
    *{box-sizing:border-box}
    body{
      margin:0;
      font-family:'Poppins',system-ui,-apple-system,Segoe UI,Roboto,Helvetica,Arial;
      background:var(--bg);
      color:#fff;
      -webkit-font-smoothing:antialiased;
      -moz-osx-font-smoothing:grayscale;
    }

    /* TOPBAR */
    .topbar{
      background:#0b0c0d;
      font-size:.85rem;
      color:var(--muted);
      padding:.35rem 0;
    }
    .topbar a{color:var(--muted); text-decoration:none}
    .topbar a:hover{color:var(--gold)}

    /* NAV */
  
    .btn-cta{ background:var(--gold); color:#111; border-radius:30px; padding:.45rem 1rem; font-weight:700; border:0;}
    .btn-cta:hover{ background:#caa344; }

    /* HERO (carousel item) */
    .hero-slide{
      height:88vh;
      min-height:560px;
      position:relative;
      background-size:cover;
      background-position:center;
    }
    .hero-overlay{ position:absolute; inset:0; background:linear-gradient(180deg, rgba(7,8,9,0.55) 0%, rgba(7,8,9,0.7) 100%); }
    .hero-inner{
      position:absolute;
      inset:0;
      display:flex;
      align-items:center;
      justify-content:center;
      text-align:center;
      padding:2rem;
    }
    .hero-title{
      font-size:3.1rem; line-height:1.02; font-weight:700; color:#fff;
      margin-bottom:.6rem;
      text-transform: none;
    }
    .hero-sub{ color:var(--muted); max-width:760px; margin:0 auto 1rem; }
	  
	  /* =========================
   MOBILE HERO FIX
   ========================= */
@media (max-width: 768px) {

  .hero-slide{
    height: 70vh;        /* Fit mobile screen */
    min-height: unset;  /* 🔥 Remove fixed min height */
  }

  .hero-inner{
    padding: 1.2rem;
  }

  .hero-title{
    font-size: 1.9rem;
    line-height: 1.15;
  }

  .hero-sub{
    font-size: 0.95rem;
    max-width: 100%;
  }

  .hero-inner .btn{
    padding: 10px 16px;
    font-size: 0.85rem;
  }
}


    /* 10 years box + About */
   
    /* collections carousel cards */
  
    /* why choose us */
    .why-cards .card{
      background:var(--card);
      border-radius:10px; padding:1.25rem;
      border:1px solid rgba(255,255,255,0.03);
    }
    .why-cards .icon{
      width:68px; height:68px; border-radius:12px; display:flex; align-items:center; justify-content:center; background:rgba(255,255,255,0.03); color:var(--gold); margin-bottom:.8rem;
      font-size:20px;
    }

    /* promo video block */
   
    /* testimonials */
    .quote-card{
      background:#26292d; border-radius:12px; padding:2rem; position:relative;
      border-left:6px solid rgba(214,178,94,0.12);
      min-height:170px;
    }
    .quote-card .avatar{ width:52px; height:52px; border-radius:50%; object-fit:cover; }

    /* method block */
    .method{
      background: linear-gradient(180deg, rgba(0,0,0,0.22), rgba(0,0,0,0.4));
      padding:2rem; border-radius:8px;
    }

    /* stats row */
    .stat-box{ text-align:center; padding:1.25rem;     border: 3px solid rgb(214 178 94 / 15%);
}
    .stat-box .big{ font-size:34px; color:var(--gold); font-weight:800; }
    .stat-box .text{ color:var(--muted); font-size:.95rem; margin-top:.35rem; }

    /* Blog */
    .blog-card{ background:var(--card); border-radius:8px; overflow:hidden; border:3px solid rgb(214 178 94); }
    .blog-thumb{ height:160px; object-fit:cover; width:100%; display:block; }

    /* footer */
    footer{ background:#0b0c0d; padding:3.25rem 0; color:var(--muted); }
    footer a{ color:var(--muted); text-decoration:none }
    footer a:hover{ color:var(--gold); }

    /* responsiveness tweaks */
    @media (max-width:992px){
      .hero-title{ font-size:2.25rem; }
      .collection-card .img{ height:200px; }
    }
    @media (max-width:576px){
      .hero-slide{ height:68vh; min-height:420px; }
      .hero-title{ font-size:1.5rem; }
      .collection-card .img{ height:160px; }
    }


.stat-box .big{
  font-size: 2.5rem;
  font-weight: 700;
  color: var(--gold);
}

.stat-box .text{
  color: var(--muted);
  letter-spacing: 0.5px;
}