/* ============================================================
   BHAGWATI GRANITE AND MARBLE LLP
   Main Design System — style.css
   Premium Luxury | Dark Theme | Gold Accents
   ============================================================ */

/* ── Google Fonts ── */
@import url('https://fonts.googleapis.com/css2?family=Cormorant+Garamond:ital,wght@0,300;0,400;0,500;0,600;0,700;1,300;1,400;1,600&family=Montserrat:wght@200;300;400;500;600;700;800;900&family=Playfair+Display:ital,wght@0,400;0,500;0,700;1,400;1,700&display=swap');

/* ── Design Tokens ── */
:root {
  /* Colors */
  --gold:          #C9A84C;
  --gold-light:    #E8C97A;
  --gold-dark:     #9A7A2E;
  --gold-pale:     rgba(201,168,76,0.12);
  --black:         #080808;
  --dark-1:        #0E0E0E;
  --dark-2:        #141414;
  --dark-3:        #1C1C1C;
  --dark-4:        #242424;
  --grey-1:        #333333;
  --grey-2:        #555555;
  --grey-3:        #888888;
  --grey-4:        #AAAAAA;
  --grey-5:        #CCCCCC;
  --white:         #F8F8F8;
  --pure-white:    #FFFFFF;

  /* Glass */
  --glass-bg:      rgba(255,255,255,0.03);
  --glass-bg-2:    rgba(255,255,255,0.06);
  --glass-border:  rgba(201,168,76,0.18);
  --glass-border-2:rgba(255,255,255,0.08);
  --glass-blur:    blur(24px);
  --glass-blur-sm: blur(12px);

  /* Typography */
  --font-serif:    'Cormorant Garamond', Georgia, serif;
  --font-sans:     'Montserrat', -apple-system, sans-serif;
  --font-display:  'Playfair Display', Georgia, serif;

  /* Transitions */
  --ease:          cubic-bezier(0.25, 0.46, 0.45, 0.94);
  --ease-out:      cubic-bezier(0.16, 1, 0.3, 1);
  --ease-in-out:   cubic-bezier(0.76, 0, 0.24, 1);
  --t-fast:        0.25s;
  --t-med:         0.45s;
  --t-slow:        0.8s;
  --transition:    all var(--t-med) var(--ease);

  /* Shadows */
  --shadow-gold:   0 0 60px rgba(201,168,76,0.12);
  --shadow-dark:   0 24px 80px rgba(0,0,0,0.6);
  --shadow-card:   0 8px 40px rgba(0,0,0,0.4);

  /* Radii */
  --r-sm:  8px;
  --r-md:  14px;
  --r-lg:  24px;
  --r-xl:  40px;

  /* Spacing */
  --section-py: 7rem;
}

/* ── Reset ── */
*, *::before, *::after { 
  box-sizing: border-box; margin: 0; padding: 0; 
}
html { 
  scroll-behavior: smooth; font-size: 16px; overflow-x: hidden; 
}
body {
  font-family: var(--font-sans);
  background: var(--black);
  color: var(--white);
  overflow-x: hidden;
  cursor: none;
  line-height: 1.7;
  -webkit-font-smoothing: antialiased;
}
a { 
  text-decoration: none; color: inherit; 
}
img { 
  max-width: 100%; display: block; 
}
ul {
   list-style: none; 
  }
button { 
  border: none; 
  background: none; 
  cursor: none; 
  font-family: inherit; 
}
input, textarea, select { 
  font-family: inherit; 
}

/* ── Custom Cursor ── */
#cursor {
  width: 10px; 
  height: 10px;
  background: var(--gold);
  border-radius: 50%;
  position: fixed; 
  top: 0; 
  left: 0;
  pointer-events: none; 
  z-index: 999999;
  transform: translate(-50%,-50%);
  transition: width .3s var(--ease), height .3s var(--ease), opacity .3s;
  mix-blend-mode: difference;
  will-change: transform;
}
#cursor-ring {
  width: 38px; 
  height: 38px;
  border: 1.5px solid rgba(201,168,76,0.55);
  border-radius: 50%;
  position: fixed; 
  top: 0; 
  left: 0;
  pointer-events: none; 
  z-index: 999998;
  transform: translate(-50%,-50%);
  transition: width .4s var(--ease), height .4s var(--ease), border-color .3s;
  will-change: transform;
}
.cursor-hover #cursor { 
  width: 18px; 
  height: 18px; 
}
.cursor-hover #cursor-ring { 
  width: 56px; 
  height: 56px; 
  border-color: rgba(201,168,76,0.9); }
.cursor-trail {
  position: fixed; 
  border-radius: 50%;
  background: var(--gold); 
  pointer-events: none;
  z-index: 999990; 
  transform: translate(-50%,-50%);
  will-change: transform; 
  transition: opacity .5s;
}

/* ── Scroll Progress ── */
#scroll-progress {
  position: fixed; 
  top: 0; 
  left: 0; 
  height: 2px;
  background: linear-gradient(90deg, var(--gold-dark), var(--gold), var(--gold-light));
  z-index: 99997; 
  width: 0%; 
  transition: width .1s linear;
}

/* ── Mouse Glow ── */
#mouse-glow {
  position: fixed; 
  width: 500px; 
  height: 500px; 
  border-radius: 50%;
  background: radial-gradient(circle, rgba(201,168,76,0.05) 0%, transparent 70%);
  pointer-events: none; 
  z-index: 0;
  transform: translate(-50%,-50%);
  transition: left .12s ease, top .12s ease;
}

/* ── Page Transition ── */
#page-transition {
  position: fixed; 
  inset: 0; 
  background: var(--black);
  z-index: 9999998; 
  transform: scaleY(0); 
  transform-origin: bottom;
  transition: transform .55s var(--ease-in-out);
}
#page-transition.entering { 
  transform: scaleY(1); 
  transform-origin: bottom; }
#page-transition.leaving  { 
  transform: scaleY(0); 
  transform-origin: top; 
}

/* ── Loader ── */
#loader {
  position: fixed; 
  inset: 0; 
  background: var(--black);
  z-index: 9999999; 
  display: flex; 
  flex-direction: column;
  align-items: center; 
  justify-content: center;
  transition: opacity .9s var(--ease), visibility .9s;
}
#loader.hidden { 
  opacity: 0; 
  visibility: hidden; 
  pointer-events: none; 
}
.loader-logo { 
  width: 110px; 
  animation: loaderPulse 2s var(--ease) infinite; 
}
.loader-brand {
  font-family: var(--font-serif); 
  font-size: 1rem;
  letter-spacing: .5em; 
  color: var(--gold); 
  margin-top: 1.8rem;
  text-transform: uppercase; 
  animation: loaderFade 2s ease infinite;
}
.loader-bar-wrap {
  width: 180px; 
  height: 1px; 
  background: var(--dark-4);
  margin-top: 1.5rem; 
  overflow: hidden; 
  border-radius: 2px;
}
.loader-bar-fill {
  height: 100%;
  background: linear-gradient(90deg, var(--gold-dark), var(--gold-light));
  animation: loaderBar 2.6s var(--ease) forwards;
}
@keyframes loaderPulse { 
  0%,100%{
    transform:scale(1);opacity:1
  } 
  50%{
    transform:scale(1.06);opacity:.8
  } 
}
@keyframes loaderFade  { 
  0%,100%{
    opacity:.4
  } 
  50%{
    opacity:1
  } 
}
@keyframes loaderBar   { 
  0%{
    width:0
  } 
  100%{
    width:100%
  } 
}

/* ── Navbar ── */
#navbar {
  position: fixed; 
  top: 0; 
  left: 0; 
  right: 0;
  z-index: 9990; 
  padding: 1.6rem 0;
  transition: var(--transition);
}

#navbar.scrolled {
  background: rgba(8,8,8,0.88);
  backdrop-filter: var(--glass-blur);
  -webkit-backdrop-filter: var(--glass-blur);
  padding: 1rem 0;
  border-bottom: 1px solid var(--glass-border);
  box-shadow: 0 4px 40px rgba(0,0,0,0.5);
}
.navbar-brand img { 
  height: 50px; 
  width: auto; 
  transition: var(--transition);
}
#navbar.scrolled .navbar-brand img { 
  height: 42px; 
}

.nav-link {
  font-family: var(--font-sans); 
  font-size: .72rem;
  font-weight: 500; 
  letter-spacing: .18em;
  text-transform: uppercase; 
  color: rgba(248,248,248,.75) !important;
  padding: .5rem 1.1rem !important; 
  position: relative;
  transition: color var(--t-fast) var(--ease);
}
.nav-link::after {
  content: ''; 
  position: absolute; 
  bottom: 0; 
  left: 50%;
  width: 0; 
  height: 1px; 
  background: var(--gold);
  transition: width var(--t-med) var(--ease), left var(--t-med) var(--ease);
}
.nav-link:hover, .nav-link.active { 
  color: var(--gold) !important; 
}
.nav-link:hover::after, .nav-link.active::after { 
  width: 60%; 
  left: 20%; 
}

.navbar-toggler {
  border: 1px solid var(--glass-border); 
  padding: .4rem .65rem;
  border-radius: 6px; 
  transition: var(--transition);
}
.navbar-toggler:hover { 
  border-color: var(--gold); 
}
.navbar-toggler-icon {
  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'%3e%3cpath stroke='rgba%28201,168,76,0.9%29' stroke-linecap='round' stroke-width='2' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e");
}

/* ── Buttons ── */
.btn-gold {
  display: inline-flex; 
  align-items: center; 
  gap: .55rem;
  padding: .95rem 2.4rem;
  background: linear-gradient(135deg, var(--gold-dark), var(--gold), var(--gold-light));
  color: var(--black); 
  font-family: var(--font-sans);
  font-size: .72rem; 
  font-weight: 700; 
  letter-spacing: .22em;
  text-transform: uppercase; 
  border-radius: 2px;
  position: relative; 
  overflow: hidden;
  transition: transform var(--t-med) var(--ease), box-shadow var(--t-med) var(--ease);
  cursor: none;
}
.btn-gold::before {
  content: ''; 
  position: absolute; 
  inset: 0;
  background: linear-gradient(135deg, var(--gold-light), var(--gold), var(--gold-dark));
  opacity: 0; 
  transition: opacity var(--t-med) var(--ease);
}
.btn-gold:hover { 
  transform: translateY(-3px); 
  box-shadow: 0 12px 40px rgba(201,168,76,.45); color: var(--black); 
}
.btn-gold:hover::before { 
  opacity: 1; 
}
.btn-gold > * { 
  position: relative; 
  z-index: 1; 
}

.btn-outline-gold {
  display: inline-flex; 
  align-items: center; 
  gap: .55rem;
  padding: .9rem 2.4rem; 
  background: transparent;
  color: var(--gold); 
  border: 1px solid var(--gold);
  font-family: var(--font-sans); 
  font-size: .72rem;
  font-weight: 600; 
  letter-spacing: .22em; 
  text-transform: uppercase;
  border-radius: 2px; 
  transition: var(--transition); 
  cursor: none;
}
.btn-outline-gold:hover {
  background: var(--gold); 
  color: var(--black);
  transform: translateY(-3px); 
  box-shadow: 0 12px 40px rgba(201,168,76,.35);
}

/* ── Section Utilities ── */
.section-label {
  display: flex; 
  align-items: center; 
  gap: .8rem;
  font-family: var(--font-sans); 
  font-size: .65rem;
  font-weight: 700; 
  letter-spacing: .4em;
  text-transform: uppercase; 
  color: var(--gold); 
  margin-bottom: 1rem;
}
.section-label::before {
  content: ''; 
  width: 32px; 
  height: 1px; 
  background: var(--gold); 
  flex-shrink: 0;
}
.section-title {
  font-family: var(--font-serif);
  font-size: clamp(2rem, 4.5vw, 3.8rem);
  font-weight: 300; 
  line-height: 1.12; 
  color: var(--white);
}
.section-title em { 
  font-style: italic; 
  color: var(--gold); 
}
.section-title strong { 
  font-weight: 600; 
}
.section-sub {
  font-family: var(--font-sans); 
  font-size: .88rem;
  font-weight: 300; 
  color: var(--grey-3); line-height: 1.85;
  max-width: 560px;
}
.divider {
  width: 48px; height: 1px;
  background: linear-gradient(90deg, var(--gold), transparent);
  margin: 1.4rem 0;
}
.divider-center { margin: 1.4rem auto; }
.py-section { padding: var(--section-py) 0; }

/* ── Glass Card ── */
.glass-card {
  background: var(--glass-bg);
  border: 1px solid var(--glass-border);
  backdrop-filter: var(--glass-blur-sm);
  -webkit-backdrop-filter: var(--glass-blur-sm);
  border-radius: var(--r-md);
  transition: var(--transition);
}
.glass-card:hover {
  border-color: rgba(201,168,76,.45);
  box-shadow: var(--shadow-gold);
  transform: translateY(-5px);
}

/* ── Floating Blobs ── */
.blob {
  position: absolute; 
  border-radius: 50%;
  filter: blur(90px); 
  opacity: .1; 
  pointer-events: none;
  animation: blobFloat 9s ease-in-out infinite;
}
.blob-gold { 
  background: var(--gold); 
}
.blob-white { 
  background: #fff; 
}
@keyframes blobFloat {
  0%,100%{transform:translate(0,0) scale(1)}
  33%{transform:translate(28px,-28px) scale(1.06)}
  66%{transform:translate(-18px,18px) scale(.95)}
}

/* ── Back to Top ── */
#back-to-top {
  position: fixed; 
  bottom: 2rem; 
  right: 2rem;
  width: 46px; 
  height: 46px;
  background: linear-gradient(135deg, var(--gold-dark), var(--gold));
  color: var(--black); 
  border-radius: 50%;
  display: flex; 
  align-items: center; 
  justify-content: center;
  z-index: 9980; 
  opacity: 0; 
  visibility: hidden;
  transform: translateY(20px); 
  transition: var(--transition);
  cursor: none; 
  box-shadow: 0 4px 24px rgba(201,168,76,.4);
  font-size: .9rem;
}
#back-to-top.visible { 
  opacity: 1; 
  visibility: visible; 
  transform: translateY(0); 
}
#back-to-top:hover { 
  transform: translateY(-4px); 
  box-shadow: 0 8px 32px rgba(201,168,76,.6); 
}

/* ── WhatsApp Float ── */
#wa-float {
  position: fixed; 
  bottom: 5.5rem; 
  right: 2rem;
  z-index: 9980; 
  display: flex; 
  flex-direction: column;
  align-items: flex-end; 
  gap: .5rem;
}
.wa-pill {
  display: flex; 
  align-items: center; 
  gap: .55rem;
  padding: .55rem 1.1rem; 
  background: #25D366;
  color: #fff; 
  border-radius: 50px; 
  font-size: .72rem;
  font-weight: 600; 
  letter-spacing: .04em;
  transition: var(--transition); 
  cursor: none;
  box-shadow: 0 4px 20px rgba(37,211,102,.4);
  white-space: nowrap;
}
.wa-pill:hover { 
  transform: translateX(-5px); 
  box-shadow: 0 8px 32px rgba(37,211,102,.6); 
  color: #fff; }
.wa-pill i { 
  font-size: 1rem; 
}

/* ── Hero ── */
.hero {
  position: relative; 
  height: 100vh; 
  min-height: 680px;
  overflow: hidden; 
  display: flex; 
  align-items: center;
}
.hero-slides { 
  position: absolute; 
  inset: 0; 
  z-index: 0; 
}
.hero-slide {
  position: absolute; 
  inset: 0;
  background-size: cover; 
  background-position: center;
  opacity: 0; 
  transform: scale(1.06);
  transition: opacity 1.6s var(--ease), transform 9s ease;
}
.hero-slide.active { 
  opacity: 1; 
  transform: scale(1); 
}
.hero-overlay {
  position: absolute; 
  inset: 0; 
  z-index: 1;
  background: linear-gradient(135deg, rgba(8,8,8,.82) 0%, rgba(8,8,8,.38) 55%, rgba(8,8,8,.65) 100%);
}
.hero-content { 
  position: relative; 
  z-index: 2; 
}
.hero-eyebrow {
  display: flex; 
  align-items: center; 
  gap: 1rem;
  font-family: var(--font-sans); 
  font-size: .65rem;
  font-weight: 700; 
  letter-spacing: .5em;
  text-transform: uppercase; 
  color: var(--gold); 
  margin-bottom: 1.8rem;
}
.hero-eyebrow::before { 
  content: ''; 
  width: 36px; 
  height: 1px; 
  background: var(--gold); 
}
.hero-title {
  font-family: var(--font-serif);
  font-size: clamp(3rem, 7.5vw, 7rem);
  font-weight: 300; 
  line-height: 1.04; 
  color: var(--white);
  margin-bottom: 1.6rem;
}
.hero-title .line { 
  display: block; 
  overflow: hidden; 
}
.hero-title .line-inner { 
  display: block; 
  transform: translateY(105%); 
  transition: transform 1s var(--ease-out); 
}
.hero-title .line-inner.revealed { 
  transform: translateY(0); 
}
.hero-title em { 
  font-style: italic; 
  color: var(--gold); 
}
.hero-desc {
  font-family: var(--font-sans); 
  font-size: .92rem;
  font-weight: 300; 
  color: rgba(248,248,248,.72);
  max-width: 460px; 
  line-height: 1.9; 
  margin-bottom: 2.6rem;
}
.hero-cta { 
  display: flex; 
  gap: 1rem; 
  flex-wrap: wrap; 
}
.hero-scroll {
  position: absolute; 
  bottom: 2.5rem; 
  left: 50%;
  transform: translateX(-50%); 
  z-index: 2;
  display: flex; 
  flex-direction: column; 
  align-items: center; 
  gap: .5rem;
  color: var(--grey-3); 
  font-size: .6rem; 
  letter-spacing: .25em; 
  text-transform: uppercase;
}
.scroll-line {
  width: 1px; 
  height: 48px;
  background: linear-gradient(to bottom, var(--gold), transparent);
  animation: scrollAnim 2.2s ease-in-out infinite;
}
@keyframes scrollAnim {
  0%{
    transform:scaleY(0);
    transform-origin:top
  }
  50%{
    transform:scaleY(1);
    transform-origin:top
  }
  51%{
    transform:scaleY(1);
    transform-origin:bottom
  }
  100%{
    transform:scaleY(0);
    transform-origin:bottom
  }
}
.hero-dots {
  position: absolute; 
  bottom: 2.5rem; 
  right: 3rem; 
  z-index: 2;
  display: flex; 
  gap: .5rem;
}
.hero-dot {
  width: 6px; 
  height: 6px; 
  border-radius: 50%;
  background: rgba(255,255,255,.3); 
  transition: var(--transition); 
  cursor: none;
}
.hero-dot.active { 
  background: var(--gold); 
  width: 22px; 
  border-radius: 3px; 
}

/* ── Marquee ── */
.marquee-wrap {
  overflow: hidden; 
  padding: 1.6rem 0;
  border-top: 1px solid var(--glass-border);
  border-bottom: 1px solid var(--glass-border);
  background: var(--dark-2);
}
.marquee-track {
  display: flex; 
  gap: 3rem; 
  white-space: nowrap;
  animation: marqueeRun 22s linear infinite;
}
.marquee-track:hover { 
  animation-play-state: paused; 
}
@keyframes marqueeRun { 
  0%{
    transform:translateX(0)
  } 
  100%{
    transform:translateX(-50%)
  } 
}
.marquee-item {
  display: flex; 
  align-items: center; 
  gap: .9rem;
  font-family: var(--font-serif); 
  font-size: 1rem;
  font-style: italic; 
  color: var(--grey-3); 
  flex-shrink: 0;
}
.marquee-item i { 
  color: var(--gold); 
  font-size: .45rem; 
}

/* ================= COLLECTION SECTION ================= */
.collection-section .col-lg-3,
.collection-section .col-md-6{
    display:flex;
}

.coll-card{
    width:100%;
    min-height:350px;
    position:relative;
    overflow:hidden;
    border-radius:20px;
    display:flex;
    align-items:flex-end;
}

.collection-section{
    padding:var(--section-py) 0;
    background:var(--dark-2);
}

.coll-card{
    position:relative;
    width:100%;
    height:380px;
    display:block;
    overflow:hidden;

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

    background:#111;
}

/* FORCE IMAGE */

.coll-card img{
    position:absolute;
    top:0;
    left:0;

    width:100% !important;
    height:100% !important;

    object-fit:cover !important;

    z-index:1;

    opacity:1 !important;
    visibility:visible !important;

    transition:transform .8s ease;
}

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

/* DARK OVERLAY */

.coll-card::after{
    content:"";
    position:absolute;
    inset:0;

    z-index:2;

    background:linear-gradient(
        to top,
        rgba(0,0,0,.95),
        rgba(0,0,0,.35),
        transparent
    );
}

/* CONTENT */

.coll-card-overlay{
    position:absolute;
    bottom:0;
    left:0;

    width:100%;
    padding:25px;

    z-index:3;
}

.coll-card-tag{
    display:block;
    color:var(--gold);
    margin-bottom:8px;
}

.coll-card-title{
    color:#fff;
    margin-bottom:8px;
}

.coll-card-sub{
    color:rgba(255,255,255,.8);
}

.coll-card-arrow{
    color:#fff;
    margin-top:15px;
}

.coll-card:hover .coll-card-arrow{
    color:var(--gold);
    transform:translateX(8px);
}

@media(max-width:768px){

.coll-card{
    height:320px;
}

}

/* ── Stats ── */
.stats-section {
  padding: 5rem 0; 
  background: var(--black);
  border-top: 1px solid var(--glass-border);
  border-bottom: 1px solid var(--glass-border);
}
.stat-item { 
  text-align: center; 
  padding: 2rem 1rem; 
}
.stat-num {
  font-family: var(--font-serif); 
  font-size: clamp(2.4rem,5vw,4rem);
  font-weight: 300; 
  color: var(--gold); 
  line-height: 1; 
  display: block;
}
.stat-suf { 
  font-family: var(--font-serif); 
  font-size: 2rem; 
  color: var(--gold-light); 
}
.stat-lbl {
  font-family: var(--font-sans); 
  font-size: .68rem;
  letter-spacing: .28em; 
  text-transform: uppercase;
  color: var(--grey-3); 
  margin-top: .7rem; 
  display: block;
}

/* ── Why Choose Us ── */
.why-section { 
  padding: var(--section-py) 0; 
  background: var(--dark-2); 
  position: relative; 
  overflow: hidden; 
}
.why-card {
  padding: 2.4rem 2rem; 
  border-radius: var(--r-md);
  background: var(--glass-bg); 
  border: 1px solid var(--glass-border);
  transition: var(--transition); 
  height: 100%;
}
.why-card:hover { 
  border-color: var(--gold); 
  transform: translateY(-6px); 
  box-shadow: var(--shadow-gold); 
}
.why-icon {
  width: 54px; 
  height: 54px; 
  border: 1px solid var(--glass-border);
  border-radius: 50%; 
  display: flex; 
  align-items: center; 
  justify-content: center;
  color: var(--gold); 
  font-size: 1.25rem; 
  margin-bottom: 1.5rem; 
  transition: var(--transition);
}
.why-card:hover .why-icon { 
  background: var(--gold); 
  color: var(--black); 
  border-color: var(--gold); 
}
.why-card h5 { 
  font-family: var(--font-serif); 
  font-size: 1.15rem; 
  font-weight: 400; 
  color: var(--white); 
  margin-bottom: .7rem; 
}
.why-card p { 
  font-size: .82rem; 
  color: var(--grey-3); 
  line-height: 1.85; 
}

/* ── Testimonials ── */
.testi-section { 
  padding: var(--section-py) 0; 
  background: var(--black); 
  position: relative; 
  overflow: hidden; 
}
.testi-card {
  padding: 2.4rem; 
  background: var(--glass-bg);
  border: 1px solid var(--glass-border); 
  border-radius: var(--r-lg);
  flex-shrink: 0;
}
.testi-quote { 
  font-family: var(--font-serif); 
  font-size: 3.5rem; 
  color: var(--gold); 
  opacity: .35; 
  line-height: 1; 
  margin-bottom: .8rem; 
}
.testi-text { 
  font-family: var(--font-serif); 
  font-size: 1rem; 
  font-style: italic; 
  color: var(--grey-5); 
  line-height: 1.85; 
  margin-bottom: 1.5rem; 
}
.testi-author { 
  display: flex; 
  align-items: center; 
  gap: .9rem; 
}
.testi-avatar { 
  width: 46px; 
  height: 46px; 
  border-radius: 50%; 
  object-fit: cover; 
  border: 2px solid var(--gold); 
}
.testi-name { 
  font-family: var(--font-sans); 
  font-size: .82rem; 
  font-weight: 600; 
  color: var(--white); 
}
.testi-role { 
  font-size: .7rem; 
  color: var(--gold); 
  letter-spacing: .08em; 
}
.stars { 
  color: var(--gold); 
  font-size: .78rem; 
  margin-bottom: .9rem; 
}
.testi-track { 
  display: flex; 
  gap: 1.5rem; 
  transition: transform .65s var(--ease); 
}
.slider-ctrl {
  width: 42px; 
  height: 42px; 
  border: 1px solid var(--glass-border);
  border-radius: 50%; 
  display: flex; 
  align-items: center; 
  justify-content: center;
  color: var(--grey-4); 
  font-size: .85rem; 
  transition: var(--transition); 
  cursor: none;
}
.slider-ctrl:hover { 
  border-color: var(--gold); 
  color: var(--gold); 
}
.testi-dot { 
  width: 6px; 
  height: 6px; 
  border-radius: 50%; 
  background: var(--grey-1); 
  transition: var(--transition); 
  cursor: none; 
}
.testi-dot.active { 
  background: var(--gold); 
  width: 20px; 
  border-radius: 3px; 
}

/* ── FAQ ── */
.faq-section { 
  padding: var(--section-py) 0; 
  background: var(--dark-1); }
.faq-item { 
  border-bottom: 1px solid var(--glass-border);
  overflow: hidden; 
}
.faq-q {
  display: flex; 
  justify-content: space-between; 
  align-items: center;
  padding: 1.5rem 0; 
  cursor: none;
  font-family: var(--font-serif); 
  font-size: 1.05rem; 
  color: var(--white);
  transition: color var(--t-fast) var(--ease);
}
.faq-q:hover { 
  color: var(--gold); 
}
.faq-icon {
  width: 30px; 
  height: 30px; 
  border: 1px solid var(--glass-border);
  border-radius: 50%; 
  display: flex; 
  align-items: center; 
  justify-content: center;
  color: var(--gold); 
  font-size: .75rem; 
  transition: var(--transition); 
  flex-shrink: 0;
}
.faq-item.open .faq-icon { 
  transform: rotate(45deg); 
  background: var(--gold); 
  color: var(--black); 
  border-color: var(--gold); 
}
.faq-a { 
  max-height: 0; 
  overflow: hidden; 
  transition: max-height .5s var(--ease); 
}
.faq-item.open .faq-a { 
  max-height: 280px; 
}
.faq-a p { 
  padding-bottom: 1.5rem; 
  font-size: .86rem; 
  color: var(--grey-3); 
  line-height: 1.9; 
}

/* ── Newsletter ── */
.newsletter-section {
  padding: 5.5rem 0; 
  background: var(--dark-3);
  border-top: 1px solid var(--glass-border); 
  border-bottom: 1px solid var(--glass-border);
}
.nl-form { 
  display: flex; 
  max-width: 480px; 
}
.nl-input {
  flex: 1; 
  padding: 1rem 1.4rem;
  background: rgba(255,255,255,.04); 
  border: 1px solid var(--glass-border);
  border-right: none; 
  color: var(--white); 
  font-family: var(--font-sans);
  font-size: .84rem; 
  border-radius: 2px 0 0 2px; 
  outline: none; 
  transition: var(--transition);
}
.nl-input:focus { 
  border-color: var(--gold); 
  background: rgba(201,168,76,.04); 
}
.nl-input::placeholder { 
  color: var(--grey-3); 
}
.nl-btn {
  padding: 1rem 1.8rem; 
  background: linear-gradient(135deg, var(--gold-dark), var(--gold));
  color: var(--black); 
  font-size: .7rem; 
  font-weight: 700;
  letter-spacing: .18em; 
  text-transform: uppercase;
  border-radius: 0 2px 2px 0; 
  transition: var(--transition); 
  cursor: none;
}
.nl-btn:hover { 
  background: linear-gradient(135deg, var(--gold), var(--gold-light)); 
}

/* ── CTA ── */
.cta-section {
  padding: 8rem 0; 
  background: var(--black);
  position: relative; 
  overflow: hidden; 
  text-align: center;
}
.cta-bg { 
  position: absolute; 
  inset: 0; 
  background-size: cover; 
  background-position: 
  center; opacity: .12; 
}
.cta-content { 
  position: relative; 
  z-index: 1; 
}
.cta-title { 
  font-family: var(--font-serif); 
  font-size: clamp(2.2rem,5vw,4.2rem); 
  font-weight: 300; 
  color: var(--white); 
  margin-bottom: 1.4rem; 
}
.cta-title em { 
  font-style: italic; 
  color: var(--gold); 
}

/* ── Footer ── */
footer {
  background: var(--dark-2); 
  border-top: 1px solid var(--glass-border);
  padding: 5rem 0 2rem;
}
.footer-logo { 
  height: 52px; 
  margin-bottom: 1.4rem; 
}
.footer-desc { 
  font-size: .8rem; 
  color: var(--grey-3); 
  line-height: 1.9; 
  max-width: 270px; 
}
.footer-heading {
  font-family: var(--font-sans); 
  font-size: .65rem; 
  font-weight: 700;
  letter-spacing: .32em; 
  text-transform: uppercase; 
  color: var(--gold); 
  margin-bottom: 1.4rem;
}
.footer-links li { 
  margin-bottom: .55rem; 
}
.footer-links a {
  font-size: .8rem; 
  color: var(--grey-3); 
  transition: var(--transition);
  display: flex; 
  align-items: center; 
  gap: .4rem;
}
.footer-links a:hover { 
  color: var(--gold); 
  padding-left: 4px; 
}
.footer-contact-row {
  display: flex; 
  align-items: flex-start; 
  gap: .7rem;
  margin-bottom: .9rem; 
  font-size: .8rem; 
  color: var(--grey-3);
}
.footer-contact-row i { 
  color: var(--gold); 
  margin-top: 2px; 
  flex-shrink: 0; 
}
.footer-contact-row a:hover { 
  color: var(--gold); 
}
.social-btn {
  width: 36px; 
  height: 36px; 
  border: 1px solid var(--glass-border);
  border-radius: 50%; 
  display: flex; 
  align-items: center; 
  justify-content: center;
  color: var(--grey-3); 
  font-size: .82rem; 
  transition: var(--transition); 
  cursor: none;
}
.social-btn:hover { 
  border-color: var(--gold); 
  color: var(--gold); 
  transform: translateY(-3px); 
}
.footer-bottom {
  border-top: 1px solid var(--glass-border); 
  padding-top: 2rem; 
  margin-top: 3rem;
  display: flex; 
  justify-content: space-between; 
  align-items: center; 
  flex-wrap: wrap; 
  gap: 1rem;
}
.footer-bottom p { 
  font-size: .74rem; 
  color: var(--grey-3); 
}

/* ── Page Hero (inner pages) ── */
.page-hero {
  height: 52vh; 
  min-height: 380px; 
  position: relative;
  display: flex; 
  align-items: center; 
  overflow: hidden;
}
.page-hero-bg {
  position: absolute; 
  inset: 0; 
  background-size: cover; 
  background-position: center;
  transform: scale(1.06); 
  transition: transform 9s ease;
}
.page-hero-overlay {
  position: absolute; 
  inset: 0;
  background: linear-gradient(135deg, rgba(8,8,8,.85) 0%, rgba(8,8,8,.4) 100%);
}
.page-hero-content { 
  position: relative; 
  z-index: 1; 
}
.breadcrumb-nav {
  display: flex; 
  align-items: center; 
  gap: .5rem;
  font-size: .68rem; 
  letter-spacing: .18em; 
  text-transform: uppercase;
  color: var(--grey-3); 
  margin-bottom: 1rem;
}
.breadcrumb-nav a { 
  color: var(--gold); 
}

/* ── About Page ── */
/* Owner Card */
/* OWNER SECTION */

.owner-frame,
.founder-message{
height:100%;
border-radius:24px;
overflow:hidden;
background:var(--dark-2);
border:1px solid rgba(255,215,0,.12);
box-shadow:0 20px 50px rgba(0,0,0,.25);
transition:.4s ease;
}

.owner-frame:hover,
.founder-message:hover{
transform:translateY(-8px);
}

/* Same image size */
.owner-frame img{
width:100%;
height:480px;
display:block;
object-fit:cover;
object-position:center;
}

/* Info */
.owner-info{
padding:24px;
text-align:center;
min-height:120px;
display:flex;
flex-direction:column;
justify-content:center;
}

.owner-info h5{
font-family:var(--font-serif);
font-size:1.7rem;
color:var(--white);
margin-bottom:8px;
}

.owner-info p{
font-size:.75rem;
text-transform:uppercase;
letter-spacing:.25em;
color:var(--gold);
margin:0;
}

/* Message */
.founder-message{
padding:40px;
display:flex;
flex-direction:column;
justify-content:center;
}

.founder-message h2{
font-family:var(--font-serif);
margin-bottom:20px;
}

.founder-message p{
line-height:1.9;
color:var(--grey-3);
}

/* Mobile */

@media(max-width:991px){

.owner-frame img{
height:380px;
}

}

/* Premium owner animation enhancement */

.owner-frame,
.founder-message{
will-change:transform, opacity;
backface-visibility:hidden;
transform:translateZ(0);
}

/* Luxury hover movement */
.owner-frame:hover{
transform:translateY(-12px) scale(1.02);
}

.owner-frame:hover img{
transform:scale(1.06);
}

.owner-frame img{
transition:transform .8s ease;
}

/* Message hover */
.founder-message:hover{
transform:translateY(-12px);
transition:.5s ease;
}

/* Owner section animation refinement */

.owner-frame,
.founder-message{
will-change:opacity,transform;
backface-visibility:hidden;
}

/* AOS + hover conflict fix */
.owner-frame[data-aos],
.founder-message[data-aos]{
transform:none;
}

/* Smooth image motion */
.owner-frame img{
transition:
transform .9s cubic-bezier(.22,.61,.36,1);
}

.owner-frame:hover img{
transform:scale(1.05);
}


/* Owner image animation only */
.owner-img-animate{
transition:transform 1.2s cubic-bezier(.22,.61,.36,1);
}

.owner-frame:hover .owner-img-animate{
transform:scale(1.08);
}

/* Smooth reveal compatibility */
.owner-frame,
.founder-message{
will-change:opacity,transform;
backface-visibility:hidden;
}

/* ── Timeline ── */
/* Vision & Mission */
.mission-vision-section{
  position:relative;
  overflow:hidden;
  background:var(--black);
  padding-top:82px;
  padding-bottom:86px;
}
.vm-heading-wrap{
  margin-bottom:2.4rem;
}
.vm-heading-wrap .divider{
  margin-bottom:0;
}
.vm-row{
  align-items:stretch;
}
.vm-card{
  position:relative;
  min-height:430px;
  padding:3.85rem 4.15rem;
  overflow:hidden;
  transition:transform .55s cubic-bezier(.22,.61,.36,1), border-color .45s ease, box-shadow .45s ease;
}
.vm-card::before{
  content:'';
  position:absolute;
  inset:0;
  background:linear-gradient(135deg, rgba(201,168,76,.16), transparent 45%);
  opacity:0;
  transition:opacity .45s ease;
  pointer-events:none;
}
.vm-card:hover{
  transform:translateY(-9px);
}
.vm-card:hover::before{
  opacity:1;
}
.vm-card .why-icon{
  width:68px;
  height:68px;
  margin-bottom:2.15rem !important;
  font-size:1.12rem;
  transition:background .45s ease, color .45s ease, border-color .45s ease, transform .45s ease;
}
.vm-card h3{
  margin-bottom:1.25rem !important;
}
.vm-card p{
  margin-bottom:0;
  line-height:2 !important;
  padding-right:.6rem;
}
.vm-card:hover .why-icon{
  background:var(--gold);
  color:var(--black);
  border-color:var(--gold);
  transform:translateY(-3px) scale(1.04);
}

@media(max-width:991px){
  .mission-vision-section{
    padding-top:64px;
    padding-bottom:68px;
  }
  .vm-heading-wrap{
    margin-bottom:1.8rem;
  }
  .vm-card{
    min-height:auto;
    padding:2.75rem;
  }
}

.timeline-section{
    padding:var(--section-py) 0;
    background:var(--dark-3);
    position:relative;
}

.timeline-line{
  position:absolute;
  left:50%;
  top:250px; /* heading ke neeche se start */
  width:2px;
  height:calc(100% - 260px); /* sirf timeline items cover kare */
  transform:translateX(-50%);
  background:rgba(255,255,255,.12);
  overflow:hidden;
  z-index:1;
}

.timeline-progress{
  position:absolute;
  top:0;
  left:0;
  width:100%;
  height:0%;
  background:linear-gradient(
    to bottom,
    var(--gold),
    #f5d37a
  );
  border-radius:10px;
}

.tl-item{
  position:relative;
  margin-bottom:4rem;
}

.tl-dot{
  position:absolute;
  left:50%;
  top:0;
  width:12px;
  height:12px;
  background:var(--gold);
  border-radius:50%;
  transform:translateX(-50%);
  box-shadow:0 0 18px rgba(201,168,76,.5);
  z-index:3;
}

.tl-content{
  width:44%;
  padding:2rem;
  background:var(--glass-bg);
  border:1px solid var(--glass-border);
  border-radius:var(--r-md);
}

.tl-item:nth-child(odd) .tl-content{
  margin-left:auto;
}

.tl-year{
  font-family:var(--font-serif);
  font-size:1.9rem;
  color:var(--gold);
  font-weight:300;
  display:block;
  margin-bottom:.4rem;
}

.tl-content h5{
  font-family:var(--font-serif);
  font-size:1.05rem;
  color:var(--white);
  margin-bottom:.5rem;
}

.tl-content p{
  font-size:.8rem;
  color:var(--grey-3);
  line-height:1.85;
}

/* ── Products Page ── */
.products-section { 
  padding: 5rem 0; 
  background: var(--dark-1); 
}
.cat-tabs { 
  display: flex; 
  gap: .5rem; 
  flex-wrap: wrap; 
  margin-bottom: 2.5rem; 
}
.cat-tab {
  padding: .55rem 1.3rem; 
  border: 1px solid var(--glass-border);
  border-radius: 50px; 
  font-size: .7rem; 
  font-weight: 600;
  letter-spacing: .1em; 
  text-transform: uppercase; 
  color: var(--grey-3);
  transition: var(--transition); 
  cursor: none; 
  background: transparent;
}
.cat-tab:hover, .cat-tab.active { 
  background: var(--gold); 
  border-color: var(--gold); 
  color: var(--black); 
}
.search-wrap { 
  position: relative; 
  max-width: 380px; 
  margin-bottom: 2.5rem; 
}
.search-wrap input {
  width: 100%; 
  padding: .88rem 1.1rem .88rem 2.8rem;
  background: var(--glass-bg); 
  border: 1px solid var(--glass-border);
  border-radius: 50px; 
  color: var(--white); 
  font-family: var(--font-sans);
  font-size: .84rem; 
  outline: none; 
  transition: var(--transition);
}
.search-wrap input:focus { 
  border-color: var(--gold); 
}
.search-wrap input::placeholder { 
  color: var(--grey-3); 
}
.search-wrap i { 
  position: absolute; 
  left: 1rem; 
  top: 50%; 
  transform: translateY(-50%); 
  color: var(--gold); 
  font-size: .88rem; 
}
.prod-card {
  border-radius: var(--r-md); 
  overflow: hidden; 
  cursor: none;
  background: var(--dark-3); 
  border: 1px solid var(--glass-border);
  transition: var(--transition); 
  transform-style: preserve-3d;
}
.prod-card:hover { 
  transform: translateY(-7px); 
  box-shadow: var(--shadow-gold); 
  border-color: rgba(201,168,76,.4); 
}
.prod-img-wrap { 
  position: relative; 
  overflow: hidden; 
  height: 250px; 
}
.prod-img-wrap img { 
  width: 100%; 
  height: 100%; 
  object-fit: cover; 
  transition: transform .8s var(--ease); 
}
.prod-card:hover .prod-img-wrap img { 
  transform: scale(1.09); 
}
.prod-overlay {
  position: absolute; 
  inset: 0; 
  background: rgba(8,8,8,.6);
  display: flex; 
  align-items: center; 
  justify-content: center;
  opacity: 0; 
  transition: var(--transition);
}
.prod-card:hover .prod-overlay { 
  opacity: 1; 
}
.prod-body { 
  padding: 1.4rem; 
}
.prod-cat { 
  font-size: .62rem; 
  letter-spacing: .28em; 
  text-transform: uppercase; 
  color: var(--gold); 
  margin-bottom: .35rem; 
}
.prod-name { 
  font-family: var(--font-serif); 
  font-size: 1.05rem; 
  color: var(--white); 
  margin-bottom: .4rem; 
}
.prod-desc { 
  font-size: .76rem; 
  color: var(--grey-3); 
  line-height: 1.75; 
}

/* ── Product Modal ── */
.prod-modal .modal-content {
  background: var(--dark-2); 
  border: 1px solid var(--glass-border);
  border-radius: var(--r-lg); 
  color: var(--white);
}
.prod-modal .modal-header { 
  border-bottom: 1px solid var(--glass-border); 
  padding: 1.5rem 2rem; 
}
.prod-modal .modal-title { 
  font-family: var(--font-serif); 
  font-size: 1.5rem; 
}
.prod-modal .btn-close { 
  filter: invert(1); 
}
.prod-modal .modal-body { 
  padding: 2rem; 
}
.prod-modal-img { 
  width: 100%; 
  border-radius: var(--r-md); 
  object-fit: cover; 
  max-height: 340px; 
}

/* ── Services Page ── */
.svc-card {
  padding: 2.8rem 2.4rem; 
  background: var(--glass-bg);
  border: 1px solid var(--glass-border); 
  border-radius: var(--r-lg);
  transition: var(--transition); 
  height: 100%; 
  position: relative; 
  overflow: hidden;
}
.svc-card::before {
  content: ''; 
  position: absolute; 
  top: 0; 
  left: 0;
  width: 3px; 
  height: 0; 
  background: linear-gradient(to bottom, var(--gold), var(--gold-dark));
  transition: height .5s var(--ease);
}
.svc-card:hover::before { 
  height: 100%; 
}
.svc-card:hover { 
  transform: translateY(-8px); 
  box-shadow: var(--shadow-gold); 
  border-color: rgba(201,168,76,.3); 
}
.svc-icon {
  width: 66px; 
  height: 66px; 
  border: 1px solid var(--glass-border);
  border-radius: var(--r-sm); 
  display: flex; 
  align-items: center; 
  justify-content: center;
  color: var(--gold); 
  font-size: 1.7rem; 
  margin-bottom: 1.8rem; 
  transition: var(--transition);
}
.svc-card:hover .svc-icon { 
  background: linear-gradient(135deg, var(--gold-dark), var(--gold)); 
  color: var(--black); 
  border-color: var(--gold); 
}
.svc-card h4 { 
  font-family: var(--font-serif); 
  font-size: 1.35rem; 
  font-weight: 400; 
  color: var(--white); 
  margin-bottom: .9rem; 
}
.svc-card p { 
  font-size: .84rem; 
  color: var(--grey-3); 
  line-height: 1.9; 
}

/* ── Process Steps ── */
.process-section { 
  padding: var(--section-py) 0; 
  background: var(--black); 
}
.process-steps { 
  display: flex; 
  gap: 0; 
  position: relative; 
}
.process-steps::before {
  content: ''; 
  position: absolute; 
  top: 34px; 
  left: 0; 
  right: 0; 
  height: 1px;
  background: linear-gradient(90deg, transparent, var(--gold), transparent);
}
.process-step { 
  flex: 1; 
  text-align: center; 
  padding: 0 1rem; 
  position: relative; 
}
.process-num {
  width: 68px; 
  height: 68px; 
  border: 1px solid var(--gold); 
  border-radius: 50%;
  display: flex; 
  align-items: center; 
  justify-content: center;
  font-family: var(--font-serif); 
  font-size: 1.4rem; 
  color: var(--gold);
  margin: 0 auto 1.4rem; 
  background: var(--black); 
  position: relative; 
  z-index: 1;
  transition: var(--transition);
}
.process-step:hover .process-num { 
  background: var(--gold); 
  color: var(--black); 
  box-shadow: 0 0 28px rgba(201,168,76,.5); 
}
.process-step h6 { 
  font-family: var(--font-serif); 
  font-size: .98rem; 
  color: var(--white); 
  margin-bottom: .4rem; 
}
.process-step p { 
  font-size: .76rem; 
  color: var(--grey-3); 
  line-height: 1.75; 
}

/* ── Contact Page ── */
.contact-section { 
  padding: 86px 0 92px; 
  background: var(--dark-1); 
}
.contact-main-row{
  --bs-gutter-x:2rem;
  --bs-gutter-y:2rem;
  align-items:flex-start;
}
.contact-form-wrap {
  background: var(--glass-bg); 
  border: 1px solid var(--glass-border);
  border-radius: var(--r-lg); 
  padding: 3rem;
  backdrop-filter: var(--glass-blur-sm); 
  -webkit-backdrop-filter: var(--glass-blur-sm);
}
.form-group { 
  position: relative; 
  margin-bottom: 1.6rem; 
}
.form-field {
  width: 100%; 
  padding: 1.2rem 1rem .5rem;
  background: rgba(255,255,255,.04); 
  border: none;
  border-bottom: 1px solid var(--glass-border);
  color: var(--white); 
  font-family: var(--font-sans); 
  font-size: .88rem;
  outline: none; 
  transition: var(--transition); 
  border-radius: 0;
  -webkit-appearance: none; 
  appearance: none;
}
.form-field:focus { 
  border-bottom-color: var(--gold); 
  background: rgba(201,168,76,.03); 
}
.form-field::placeholder { 
  color: transparent; 
}
.form-label {
  position: absolute; 
  top: 1rem; 
  left: 1rem;
  font-size: .78rem; 
  color: var(--grey-3); 
  transition: var(--transition);
  pointer-events: none; 
  letter-spacing: .04em;
}
.form-field:focus ~ .form-label,
.form-field:not(:placeholder-shown) ~ .form-label,
.form-field.has-value ~ .form-label {
  top: .2rem; 
  font-size: .62rem; 
  color: var(--gold);
  letter-spacing: .18em; 
  text-transform: uppercase;
}
select.form-field { 
  color: var(--grey-3); 
}
select.form-field:focus, select.form-field.has-value { 
  color: var(--white); 
}
select.form-field option { 
  background: var(--dark-2); 
  color: var(--white); 
}
textarea.form-field { 
  min-height: 110px; 
  resize: vertical; 
}
.contact-info-card {
  padding: 1.7rem 1.8rem; 
  background: var(--glass-bg);
  border: 1px solid var(--glass-border); 
  border-radius: var(--r-md);
  margin-bottom: 1rem; 
  transition: var(--transition);
}
.contact-info-card:hover { 
  border-color: var(--gold); 
  transform: translateX(4px); 
}
.ci-icon {
  width: 44px; 
  height: 44px; 
  border: 1px solid var(--glass-border);
  border-radius: 50%; 
  display: flex; 
  align-items: center; 
  justify-content: center;
  color: var(--gold); 
  font-size: 1rem; 
  margin-bottom: .9rem;
}
.contact-info-card h6 {
  font-family: var(--font-sans); 
  font-size: .62rem;
  letter-spacing: .28em; 
  text-transform: uppercase; 
  color: var(--gold); 
  margin-bottom: .4rem;
}
.contact-info-card p, .contact-info-card a { 
  font-size: .84rem; 
  color: var(--grey-5); 
  line-height: 1.75; 
}
.contact-info-card a:hover { 
  color: var(--gold); 
}
.contact-map-block{
  margin-top:2.6rem;
}
.map-wrap { 
  border-radius: var(--r-lg); 
  overflow: hidden; 
  border: 1px solid var(--glass-border); 
  height: 340px; 
}
.map-wrap iframe { 
  width: 100%; 
  height: 100%; 
  border: none; 
  filter: grayscale(1) invert(.9); 
}

@media(max-width:991px){
  .contact-section{
    padding:70px 0 76px;
  }
  .contact-main-row{
    --bs-gutter-y:2.4rem;
  }
  .contact-map-block{
    margin-top:2.2rem;
  }
}

/* ── Skeleton ── */
.skeleton {
  background: linear-gradient(90deg, var(--dark-3) 25%, var(--dark-4) 50%, var(--dark-3) 75%);
  background-size: 200% 100%; 
  animation: skeletonAnim 1.6s infinite; 
  border-radius: var(--r-md);
}
@keyframes skeletonAnim { 
  0%{
    background-position:200% 0
  } 
  100%{
    background-position:-200% 0
  } 
}

/* ── Utilities ── */
.text-gold { 
  color: var(--gold) !important; 
}
.overflow-hidden { 
  overflow: hidden; 
}
.visually-hidden { 
  position: absolute; 
  width: 1px; 
  height: 1px; 
  padding: 0; 
  margin: -1px; 
  overflow: hidden; 
  clip: rect(0,0,0,0); 
  white-space: nowrap; 
  border: 0; 
}
.cursor-none { 
  cursor: none; 
}
a, button, [role="button"], 
.cat-tab, .faq-q, .prod-card, 
.coll-card, .svc-card, 
.why-card, .glass-card, 
.social-btn, .wa-pill, 
.slider-ctrl, .testi-dot, 
.hero-dot, .footer-links a, 
.nav-link, .navbar-brand { 
  cursor: none; 
}


/* FORCE COLLECTION VISIBILITY */

.collection-section{
  display:block !important;
  visibility:visible !important;
  opacity:1 !important;
}

.coll-card{
  position:relative;
  width:100%;
  height:350px;
  overflow:hidden;

  border-radius:var(--r-md);
  background:var(--glass-bg);
  border:1px solid var(--glass-border);

  transition:border-color var(--t-med) var(--ease), box-shadow var(--t-med) var(--ease), background var(--t-med) var(--ease);

  opacity:1;
  transform:none;
  backface-visibility:hidden;
  transform:translateZ(0);
  will-change:transform, opacity;
}

.coll-card img{
  display:block !important;
  opacity:1 !important;
  visibility:visible !important;
  width:100% !important;
  height:100% !important;
  object-fit:cover !important;
  backface-visibility:hidden;
  transform:translate3d(0,0,0);
}

.coll-card-overlay{
  display:block !important;
  opacity:1 !important;
  visibility:visible !important;
  position:absolute !important;
  bottom:30px;
  left:25px;
  color:white;
  z-index:5;
}