:root {
  --gold: #C9A84C; --gold-light: #E8D49A; --dark-green: #1B3A2D;
  --cream: #F5F0E8; --charcoal: #1C1C1C; --warm-white: #FAF7F2; --stone-gray: #8A8880;
}
*, *::before, *::after { margin:0; padding:0; box-sizing:border-box; }
html { scroll-behavior: smooth; }
body { font-family:'Jost',sans-serif; background:var(--charcoal); color:var(--cream); overflow-x:hidden; }

/* ── PAGE SYSTEM ── */
/* Multi-page: pages are visible by default; sub-pages (detail views) use SPA toggling */
.page { display:block; opacity:1; }
.page.hidden { display:none; }
.page.active { display:block; animation:pageFadeIn .35s ease forwards; }
/* Sub-page groups — only one shows at a time on collection/handicraft pages */
.page-group .page { display:none; opacity:0; }
.page-group .page.active { display:block; animation:pageFadeIn .35s ease forwards; }
@keyframes pageFadeIn { from{opacity:0;transform:translateY(10px)} to{opacity:1;transform:translateY(0)} }

/* ── Indian Marble Detail Page ── */
.im-detail-back {
  display:inline-flex; align-items:center; gap:.5rem;
  font-size:.65rem; letter-spacing:.18em; text-transform:uppercase;
  color:rgba(245,240,232,.45); cursor:pointer; transition:color .25s;
  background:none; border:none; font-family:'Jost',sans-serif;
  padding:0; margin-bottom:2rem;
}
.im-detail-back:hover { color:var(--gold); }
.im-detail-back svg { transition:transform .25s; }
.im-detail-back:hover svg { transform:translateX(-3px); }
.im-detail-title {
  font-family:'Cormorant Garamond',serif;
  font-size:clamp(2.2rem,4vw,3.8rem); font-weight:300;
  color:var(--cream); margin-bottom:.5rem; line-height:1.1;
}
.im-detail-subtitle {
  font-size:.7rem; letter-spacing:.2em; text-transform:uppercase;
  color:var(--gold); margin-bottom:3rem;
}
.im-photo-grid {
  columns:3; column-gap:1rem;
}
.im-photo-grid .im-photo-item {
  break-inside:avoid; margin-bottom:1rem;
  overflow:hidden; cursor:pointer; position:relative;
}
.im-photo-grid .im-photo-item img {
  width:100%; display:block;
  transition:transform .6s ease, filter .4s ease;
}
.im-photo-grid .im-photo-item:hover img {
  transform:scale(1.04); filter:brightness(1.08);
}
.im-photo-tag {
  position:absolute; bottom:0; left:0; right:0;
  background:linear-gradient(to top, rgba(0,0,0,.55) 0%, transparent 100%);
  padding:.5rem .7rem;
  font-size:.55rem; letter-spacing:.15em; text-transform:uppercase;
  color:rgba(245,240,232,.65); pointer-events:none;
}
@media(max-width:900px) { .im-photo-grid { columns:2; } }
@media(max-width:500px) { .im-photo-grid { columns:1; } }

/* ── NAV ── */
nav {
  position:fixed; top:0; left:0; right:0; z-index:1000;
  display:flex; align-items:center; justify-content:space-between;
  padding:1.2rem 4rem;
  transition:background 0.5s ease, padding 0.4s ease;
}
nav.scrolled {
  background:rgba(27,58,45,0.96); backdrop-filter:blur(12px);
  padding:0.8rem 4rem; box-shadow:0 2px 30px rgba(0,0,0,0.3);
}
nav.solid { background:rgba(27,58,45,0.98); padding:0.8rem 4rem; box-shadow:0 2px 30px rgba(0,0,0,0.3); }
.nav-logo { display:flex; align-items:center; gap:0.8rem; text-decoration:none; cursor:pointer; }
.nav-logo img {
  height:64px; width:64px; object-fit:contain;
  /* PNG has black bg removed — invert to white then tint gold */
  filter: invert(1) sepia(1) saturate(1.4) hue-rotate(5deg) brightness(1.1);
  opacity:0.92;
  transition:opacity .3s, filter .3s;
}
.nav-logo:hover img { opacity:1; filter: invert(1) sepia(1) saturate(2) hue-rotate(5deg) brightness(1.2); }
.nav-brand-text { display:flex; flex-direction:column; line-height:1.1; }
.nav-brand-name { font-family:'Cormorant Garamond',serif; font-size:1.15rem; font-weight:600; color:var(--cream); letter-spacing:0.08em; }
.nav-brand-tagline { font-size:0.6rem; font-weight:300; letter-spacing:0.25em; color:var(--gold-light); text-transform:uppercase; }
.nav-links { display:flex; gap:2.8rem; list-style:none; align-items:center; }
.nav-links > li { position:relative; }
.nav-links a {
  text-decoration:none; font-size:0.72rem; font-weight:400; letter-spacing:0.2em;
  text-transform:uppercase; color:rgba(245,240,232,0.85); transition:color 0.3s; position:relative;
  background:none; border:none; cursor:pointer; font-family:'Jost',sans-serif; display:inline-block;
}
.nav-links a::after {
  content:''; position:absolute; bottom:-4px; left:0; width:0; height:1px;
  background:var(--gold); transition:width 0.35s ease;
}
.nav-links a:hover { color:var(--gold-light); }
.nav-links a:hover::after { width:100%; }
.nav-cta {
  background:transparent !important; border:1px solid var(--gold) !important;
  color:var(--gold) !important; padding:0.5rem 1.4rem !important;
}
.nav-cta:hover { background:var(--gold) !important; color:var(--charcoal) !important; }
.nav-cta::after { display:none !important; }

/* ── COLLECTION DROPDOWN ── */
.nav-collection-trigger { position:relative; }
.nav-collection-trigger > a { display:flex !important; align-items:center; gap:0.4rem; }
.nav-collection-trigger > a svg { transition:transform 0.3s; flex-shrink:0; }
.nav-collection-trigger:hover > a svg { transform:rotate(180deg); }

/* Wrapper sits flush at top:100% with padding-top as the visual gap.
   This means the hover area is unbroken — no gap for the cursor to escape through. */
.collection-dropdown {
  position:absolute; top:100%;
  right:-6rem;          /* aligns right edge of panel with right edge of nav area */
  left:auto;
  transform:translateY(-8px);
  padding-top:1rem; width:720px;
  opacity:0; visibility:hidden; pointer-events:none;
  transition:opacity 0.25s ease, visibility 0.25s, transform 0.25s ease;
}
.nav-collection-trigger:hover .collection-dropdown {
  opacity:1; visibility:visible; pointer-events:all;
  transform:translateY(0);
}

/* The visible box lives inside the wrapper */
.collection-dropdown-box {
  background: #0f1611;
  border:1px solid rgba(201,168,76,0.2);
  box-shadow:0 20px 60px rgba(0,0,0,0.7);
  position:relative;
  isolation: isolate;
}
/* Arrow tip — positioned to sit under the Collection trigger word */
.collection-dropdown-box::before {
  content:''; position:absolute; top:-6px; right:7.5rem;
  width:12px; height:12px; background:#0f1611;
  border-left:1px solid rgba(201,168,76,0.2); border-top:1px solid rgba(201,168,76,0.2);
  transform:rotate(45deg);
  z-index:1;
}

.dropdown-inner {
  display:grid;
  grid-template-columns:1fr 1fr 0.72fr;
}

.dropdown-col {
  padding:1.8rem 1.6rem;
  background:#0f1611;
}
.dropdown-col:not(:last-child) { border-right:1px solid rgba(201,168,76,0.15); }

.dropdown-col-header {
  display:flex; align-items:center; gap:0.7rem;
  font-size:0.6rem; letter-spacing:0.35em; text-transform:uppercase;
  color:var(--gold); margin-bottom:1.2rem; cursor:pointer;
  transition:color 0.25s; padding-bottom:0.8rem;
  border-bottom:1px solid rgba(201,168,76,0.2);
}
.dropdown-col-header:hover { color:var(--gold-light); }
.dropdown-col-header svg { flex-shrink:0; }

.dropdown-list { list-style:none; display:flex; flex-direction:column; gap:0.15rem; }
.dropdown-list li a {
  display:flex; align-items:center; gap:0.6rem;
  padding:0.4rem 0.5rem; font-size:0.75rem; letter-spacing:0.08em;
  color:rgba(245,240,232,0.6); text-decoration:none;
  transition:all 0.2s; border-radius:2px;
  font-family:'Jost',sans-serif; cursor:pointer;
}
.dropdown-list li a:hover {
  color:var(--cream); background:rgba(201,168,76,0.08); padding-left:0.9rem;
}
.dropdown-list li a:hover::after { display:none; }
/* Sub-items indented under a parent range */
.dropdown-list li.dropdown-sub a {
  font-size:0.68rem; letter-spacing:0.06em;
  padding-left:1.4rem; color:rgba(245,240,232,0.4);
  position:relative;
}
.dropdown-list li.dropdown-sub a::before {
  content:''; position:absolute; left:0.7rem; top:50%;
  width:4px; height:1px; background:rgba(201,168,76,0.4);
}
.dropdown-list li.dropdown-sub a:hover {
  color:var(--gold-light); background:rgba(201,168,76,0.06); padding-left:1.7rem;
}
.colour-pip {
  width:9px; height:9px; border-radius:50%; flex-shrink:0;
  border:1px solid rgba(255,255,255,0.15);
}

/* Custom Designs — feature cards */
.dropdown-design-cards {
  display:flex; flex-direction:column; gap:0.7rem; margin-top:0.2rem;
}
.dropdown-design-card {
  border:1px solid rgba(201,168,76,0.15);
  padding:0.9rem 1rem;
  cursor:pointer;
  transition:border-color 0.25s, background 0.25s;
  border-radius:2px; position:relative; overflow:hidden;
}
.dropdown-design-card:hover {
  border-color:rgba(201,168,76,0.5);
  background:rgba(201,168,76,0.06);
}
.dropdown-design-card-icon {
  display:block; margin-bottom:0.5rem;
  stroke:var(--gold); opacity:0.65; width:22px; height:22px;
}
.dropdown-design-card-title {
  font-family:'Cormorant Garamond',serif;
  font-size:1rem; color:var(--cream); letter-spacing:0.03em;
  margin-bottom:0.2rem;
}
.dropdown-design-card-desc {
  font-size:0.58rem; letter-spacing:0.12em;
  color:rgba(245,240,232,0.35); text-transform:uppercase;
}
.dropdown-design-card-arrow {
  position:absolute; bottom:0.7rem; right:0.8rem;
  font-size:0.7rem; color:var(--gold);
  opacity:0; transition:opacity 0.2s, transform 0.2s;
}
.dropdown-design-card:hover .dropdown-design-card-arrow {
  opacity:1; transform:translateX(3px);
}

.dropdown-footer {
  grid-column:1/-1;
  border-top:1px solid rgba(201,168,76,0.15);
  padding:0.9rem 1.6rem; display:flex; align-items:center; justify-content:space-between;
  background:#0f1611;
}
.dropdown-footer-text { font-size:0.62rem; color:rgba(245,240,232,0.35); letter-spacing:0.12em; }
.dropdown-footer-link {
  font-size:0.62rem; letter-spacing:0.15em; text-transform:uppercase;
  color:var(--gold); cursor:pointer; transition:color 0.25s;
}
.dropdown-footer-link:hover { color:var(--gold-light); }



/* ── HAMBURGER ── */
.hamburger { display:none; flex-direction:column; gap:5px; cursor:pointer; padding:0.5rem; }
.hamburger span { display:block; width:24px; height:1px; background:var(--cream); transition:all 0.3s; }

/* ── HERO ── */
#home { position:relative; height:100vh; overflow:hidden; display:flex; align-items:center; justify-content:center; }
.hero-video-container { position:absolute; inset:0; z-index:0; }
.hero-video-container video {
  width:100%; height:100%; object-fit:cover;
  filter:saturate(0.85) brightness(0.9);
  animation:heroVideoFadeIn 1.8s ease both;
}
@keyframes heroVideoFadeIn {
  from { opacity:0; transform:scale(1.04); }
  to   { opacity:1; transform:scale(1); }
}
/* Subtle vignette — darkens edges only, centre stays bright */
.video-bg {
  position:absolute; inset:0; z-index:1; pointer-events:none;
  background:
    radial-gradient(ellipse 120% 100% at 50% 50%, transparent 40%, rgba(0,0,0,.55) 100%),
    radial-gradient(ellipse at 10% 90%, rgba(201,168,76,.06) 0%, transparent 50%),
    radial-gradient(ellipse at 90% 10%, rgba(27,58,45,.12) 0%, transparent 50%);
}
/* Fine grain texture — very subtle, just adds premium feel */
.hero-marble-overlay {
  position:absolute; inset:0; z-index:2; pointer-events:none;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='600' height='600'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.65' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='600' height='600' filter='url(%23n)' opacity='0.03'/%3E%3C/svg%3E");
  opacity:0.5; mix-blend-mode:overlay;
}
/* Top + bottom gradient — nav area dark, bottom fade, centre stays visible */
.hero-gradient-overlay {
  position:absolute; inset:0; z-index:3; pointer-events:none;
  background:
    linear-gradient(to bottom,
      rgba(0,0,0,.72)  0%,
      rgba(0,0,0,.45) 12%,
      rgba(0,0,0,.15) 28%,
      rgba(0,0,0,.05) 45%,
      rgba(0,0,0,.05) 55%,
      rgba(0,0,0,.5)  80%,
      rgba(0,0,0,.82) 100%),
    linear-gradient(to right, rgba(0,0,0,.18) 0%, transparent 30%, transparent 70%, rgba(0,0,0,.18) 100%);
}
.hero-content {
  position:relative; z-index:4; text-align:center; max-width:820px;
  padding:5rem 2rem 0; animation:fadeInUp 1.4s ease both;
}
@keyframes fadeInUp { from{opacity:0;transform:translateY(30px)} to{opacity:1;transform:translateY(0)} }
.hero-eyebrow { font-size:0.65rem; letter-spacing:0.45em; text-transform:uppercase; color:var(--gold); margin-bottom:1.5rem; animation:fadeInUp 1.2s .2s ease both; }
.hero-title { font-family:'Cormorant Garamond',serif; font-size:clamp(3.5rem,8vw,7rem); font-weight:300; line-height:1.05; color:var(--cream); margin-bottom:1.5rem; animation:fadeInUp 1.2s .4s ease both; }
.hero-title em { font-style:italic; color:var(--gold-light); }
.hero-subtitle { font-size:0.85rem; font-weight:300; letter-spacing:0.12em; color:rgba(245,240,232,.7); margin-bottom:2.8rem; animation:fadeInUp 1.2s .6s ease both; }
.hero-divider { width:60px; height:1px; background:var(--gold); margin:0 auto 2.5rem; animation:scaleX 1.2s .8s ease both; transform-origin:center; }
@keyframes scaleX { from{transform:scaleX(0);opacity:0} to{transform:scaleX(1);opacity:1} }
.hero-buttons { display:flex; gap:1.2rem; justify-content:center; animation:fadeInUp 1.2s 1s ease both; }
.btn-primary { display:inline-block; padding:1rem 2.5rem; background:var(--gold); color:var(--charcoal); text-decoration:none; font-size:0.7rem; font-weight:500; letter-spacing:0.2em; text-transform:uppercase; transition:all .3s; cursor:pointer; border:none; font-family:'Jost',sans-serif; }
.btn-primary:hover { background:var(--gold-light); transform:translateY(-2px); }
.btn-secondary { display:inline-block; padding:1rem 2.5rem; border:1px solid rgba(245,240,232,.4); color:var(--cream); text-decoration:none; font-size:0.7rem; font-weight:300; letter-spacing:0.2em; text-transform:uppercase; transition:all .3s; cursor:pointer; background:none; font-family:'Jost',sans-serif; }
.btn-secondary:hover { border-color:var(--gold); color:var(--gold-light); transform:translateY(-2px); }

/* ── HERITAGE STRIP ── */
.heritage-strip { background:var(--dark-green); padding:1.2rem 4rem; display:flex; justify-content:center; align-items:center; gap:4rem; flex-wrap:wrap; }
.heritage-item { display:flex; align-items:center; gap:0.8rem; font-size:0.65rem; letter-spacing:0.18em; text-transform:uppercase; color:var(--gold-light); }

/* ── COMMON SECTION ── */
.section-label { font-size:0.6rem; letter-spacing:0.4em; text-transform:uppercase; color:var(--gold); margin-bottom:1rem; }
.section-heading { font-family:'Cormorant Garamond',serif; font-size:clamp(2.2rem,4vw,3.5rem); font-weight:300; line-height:1.15; }

/* ── ABOUT ── */
#about { background:var(--warm-white); color:var(--charcoal); padding:7rem 0; overflow:hidden; }
.about-inner { max-width:1300px; margin:0 auto; padding:0 4rem; display:grid; grid-template-columns:1fr 1fr; gap:6rem; align-items:center; }
.about-text .section-heading { margin-bottom:1.5rem; color:var(--charcoal); }
.about-text p { font-size:0.95rem; line-height:1.85; color:#4a4a4a; margin-bottom:1.2rem; font-weight:300; }
.about-quote { margin:2rem 0; padding:1.5rem 0 1.5rem 2rem; border-left:2px solid var(--gold); }
.about-quote p { font-family:'Cormorant Garamond',serif; font-size:1.3rem; font-style:italic; color:var(--dark-green) !important; margin-bottom:0 !important; }
.about-stats { display:grid; grid-template-columns:1fr 1fr; gap:1.5rem; margin-top:2.5rem; }
.stat-card { padding:1.5rem; background:var(--cream); border-bottom:2px solid var(--gold); }
.stat-number { font-family:'Cormorant Garamond',serif; font-size:2.5rem; font-weight:300; color:var(--dark-green); line-height:1; }
.stat-label { font-size:0.65rem; letter-spacing:0.15em; text-transform:uppercase; color:var(--stone-gray); margin-top:0.4rem; }
.about-visual { position:relative; }
.about-img-wrap {
  width:100%; height:550px; overflow:hidden; position:relative;
}
.about-img-wrap img {
  width:100%; height:100%; object-fit:cover; display:block;
  transition:transform 1.2s ease;
}
.about-img-wrap:hover img { transform:scale(1.04); }
/* Subtle gold-tinted vignette at edges to frame the photo */
.about-img-wrap::after {
  content:''; position:absolute; inset:0; pointer-events:none;
  background:
    linear-gradient(to bottom, rgba(0,0,0,.18) 0%, transparent 25%, transparent 70%, rgba(0,0,0,.3) 100%),
    linear-gradient(to right, rgba(0,0,0,.1) 0%, transparent 20%, transparent 80%, rgba(0,0,0,.1) 100%);
}
.about-logo-badge {
  position:absolute;
  bottom:-1.8rem; right:-1.8rem;
  width:110px; height:110px;
  background:var(--dark-green);
  border-radius:50%;
  display:flex; align-items:center; justify-content:center;
  z-index:3;
  border:3px solid var(--gold);
  box-shadow:0 8px 32px rgba(0,0,0,.35), 0 0 0 6px rgba(201,168,76,.12);
  transition:transform .4s ease, box-shadow .4s ease;
}
.about-logo-badge:hover {
  transform:scale(1.06);
  box-shadow:0 12px 40px rgba(0,0,0,.4), 0 0 0 8px rgba(201,168,76,.18);
}
.about-logo-badge img {
  width:72px; height:72px; object-fit:contain;
  /* Invert dark initials to white/cream against dark green background */
  filter: invert(1) brightness(1.05);
  opacity:0.9;
}

/* ── HERITAGE TIMELINE ── */
.heritage-section { background:var(--charcoal); padding:7rem 0; overflow:hidden; }
.heritage-inner { max-width:1300px; margin:0 auto; padding:0 4rem; }
.heritage-inner .section-heading { color:var(--cream); margin-bottom:1rem; }
.heritage-inner > p { font-size:0.9rem; color:rgba(245,240,232,.6); max-width:600px; margin-bottom:4rem; line-height:1.8; }
.heritage-timeline { display:grid; grid-template-columns:repeat(3,1fr); gap:0; border-top:1px solid rgba(201,168,76,.3); }
.timeline-item { padding:3rem 2.5rem; border-right:1px solid rgba(201,168,76,.15); transition:background .4s; }
.timeline-item:last-child { border-right:none; }
.timeline-item:hover { background:rgba(201,168,76,.04); }
.timeline-number { font-family:'Cormorant Garamond',serif; font-size:4rem; font-weight:300; color:rgba(201,168,76,.2); line-height:1; margin-bottom:1rem; }
.timeline-title { font-family:'Cormorant Garamond',serif; font-size:1.4rem; color:var(--gold-light); margin-bottom:0.8rem; }
.timeline-text { font-size:0.82rem; line-height:1.75; color:rgba(245,240,232,.55); font-weight:300; }

/* ── WHY SECTION ── */
.why-section { background:var(--dark-green); padding:6rem 0; }
.why-inner { max-width:1300px; margin:0 auto; padding:0 4rem; }
.why-inner .section-heading { color:var(--cream); margin-bottom:3.5rem; }
.why-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:2rem; }
.why-card { padding:2.5rem 2rem; border:1px solid rgba(201,168,76,.2); transition:border-color .4s,transform .3s; }
.why-card:hover { border-color:var(--gold); transform:translateY(-4px); }
.why-icon { width:48px; height:48px; margin-bottom:1.5rem; color:var(--gold); }
.why-title { font-family:'Cormorant Garamond',serif; font-size:1.3rem; color:var(--cream); margin-bottom:0.8rem; }
.why-text { font-size:0.8rem; line-height:1.75; color:rgba(245,240,232,.55); font-weight:300; }

/* ── PROCESS ── */
.process-section { background:var(--warm-white); color:var(--charcoal); padding:7rem 0; }
.process-inner { max-width:1300px; margin:0 auto; padding:0 4rem; }
.process-inner .section-heading { margin-bottom:4rem; }
.process-steps { display:grid; grid-template-columns:repeat(4,1fr); gap:0; position:relative; }
.process-steps::before { content:''; position:absolute; top:2.5rem; left:12.5%; right:12.5%; height:1px; background:linear-gradient(to right,var(--gold),var(--gold-light),var(--gold)); z-index:0; }
.process-step { text-align:center; padding:0 1.5rem; position:relative; z-index:1; }
.step-circle { width:5rem; height:5rem; border-radius:50%; border:1px solid var(--gold); display:flex; align-items:center; justify-content:center; margin:0 auto 1.5rem; background:var(--warm-white); font-family:'Cormorant Garamond',serif; font-size:1.5rem; color:var(--gold); }
.step-title { font-family:'Cormorant Garamond',serif; font-size:1.1rem; margin-bottom:0.8rem; color:var(--dark-green); }
.step-text { font-size:0.78rem; line-height:1.7; color:#666; font-weight:300; }

/* ── CONTACT ── */
#contact-section { background:var(--charcoal); padding:7rem 0; }
.contact-inner { max-width:1300px; margin:0 auto; padding:0 4rem; display:grid; grid-template-columns:1fr 1.2fr; gap:6rem; align-items:start; }
.contact-left .section-heading { color:var(--cream); margin-bottom:1.5rem; }
.contact-left > p { font-size:0.88rem; line-height:1.8; color:rgba(245,240,232,.55); margin-bottom:2.5rem; }
.contact-details { display:flex; flex-direction:column; gap:1.2rem; }
.contact-detail { display:flex; align-items:flex-start; gap:1rem; }
.contact-detail-icon { width:40px; height:40px; border:1px solid rgba(201,168,76,.4); display:flex; align-items:center; justify-content:center; flex-shrink:0; color:var(--gold); }
.contact-detail-text h4 { font-size:0.65rem; letter-spacing:0.2em; text-transform:uppercase; color:var(--gold); margin-bottom:0.3rem; }
.contact-detail-text p { font-size:0.85rem; color:rgba(245,240,232,.7); line-height:1.5; }
.contact-form-wrapper { background:rgba(255,255,255,.03); border:1px solid rgba(201,168,76,.15); padding:3rem; }
.form-title { font-family:'Cormorant Garamond',serif; font-size:1.5rem; color:var(--gold-light); margin-bottom:2rem; }
.form-group { margin-bottom:1.5rem; }
.form-group label { display:block; font-size:0.62rem; letter-spacing:0.2em; text-transform:uppercase; color:rgba(245,240,232,.5); margin-bottom:0.5rem; }
.form-group input,.form-group select,.form-group textarea { width:100%; background:rgba(255,255,255,.05); border:1px solid rgba(201,168,76,.2); color:var(--cream); padding:0.85rem 1rem; font-family:'Jost',sans-serif; font-size:0.85rem; outline:none; transition:border-color .3s; }
.form-group input:focus,.form-group select:focus,.form-group textarea:focus { border-color:var(--gold); }
.form-group select option { background:var(--charcoal); }
.form-group textarea { height:120px; resize:vertical; }
.form-row { display:grid; grid-template-columns:1fr 1fr; gap:1rem; }
.form-submit { width:100%; padding:1rem; background:var(--gold); color:var(--charcoal); border:none; font-family:'Jost',sans-serif; font-size:0.7rem; font-weight:500; letter-spacing:0.2em; text-transform:uppercase; cursor:pointer; transition:background .3s; margin-top:0.5rem; }
.form-submit:hover { background:var(--gold-light); }

/* ── FOOTER ── */
footer { background:#0d0d0d; padding:4rem 0 2rem; }
.footer-inner { max-width:1300px; margin:0 auto; padding:0 4rem; }
.footer-top { display:grid; grid-template-columns:1.5fr 1fr 1fr 1fr; gap:4rem; margin-bottom:3rem; padding-bottom:3rem; border-bottom:1px solid rgba(201,168,76,.15); }
.footer-brand img {
  height:64px; width:auto; margin-bottom:1rem; display:block;
  /* Gold tint against the dark footer */
  filter: invert(1) sepia(1) saturate(1.4) hue-rotate(5deg) brightness(1.05);
  opacity:0.85;
}
.footer-brand-name { font-family:'Cormorant Garamond',serif; font-size:1.2rem; color:var(--cream); margin-bottom:0.3rem; }
.footer-brand-tagline { font-size:0.62rem; letter-spacing:0.2em; text-transform:uppercase; color:var(--gold); margin-bottom:1rem; }
.footer-brand p { font-size:0.8rem; line-height:1.7; color:rgba(245,240,232,.4); }
.footer-col h5 { font-size:0.65rem; letter-spacing:0.25em; text-transform:uppercase; color:var(--gold); margin-bottom:1.2rem; }
.footer-col ul { list-style:none; }
.footer-col ul li { margin-bottom:0.7rem; }
.footer-col ul li a { font-size:0.8rem; color:rgba(245,240,232,.45); text-decoration:none; transition:color .3s; cursor:pointer; }
.footer-col ul li a:hover { color:var(--gold-light); }
.footer-bottom { display:flex; justify-content:space-between; align-items:center; }
.footer-bottom p { font-size:0.72rem; color:rgba(245,240,232,.3); }
.footer-social { display:flex; gap:1rem; }
.social-link { width:36px; height:36px; border:1px solid rgba(201,168,76,.3); display:flex; align-items:center; justify-content:center; color:rgba(245,240,232,.5); text-decoration:none; font-size:0.75rem; transition:all .3s; }
.social-link:hover { border-color:var(--gold); color:var(--gold); }

/* ══════════════════════════════════════
   COLLECTION PAGES
══════════════════════════════════════ */
#page-range, #page-colour {
  background:var(--charcoal); min-height:100vh; padding-top:0;
}

/* Page hero banner */
.coll-hero {
  background:linear-gradient(135deg,#0f1a12 0%,#1a2a1e 50%,#0d1510 100%);
  padding:9rem 4rem 4rem;
  border-bottom:1px solid rgba(201,168,76,.15);
  position:relative; overflow:hidden;
}
.coll-hero::before {
  content:''; position:absolute; inset:0;
  background:repeating-linear-gradient(25deg,transparent,transparent 50px,rgba(201,168,76,.02) 50px,rgba(201,168,76,.02) 51px);
}
.coll-hero-inner { max-width:1300px; margin:0 auto; position:relative; z-index:1; }
.coll-breadcrumb { display:flex; align-items:center; gap:0.6rem; font-size:0.62rem; letter-spacing:0.2em; text-transform:uppercase; color:rgba(245,240,232,.4); margin-bottom:1.5rem; }
.coll-breadcrumb a { color:var(--gold); cursor:pointer; transition:color .25s; }
.coll-breadcrumb a:hover { color:var(--gold-light); }
.coll-breadcrumb span { color:rgba(245,240,232,.3); }
.coll-hero h1 { font-family:'Cormorant Garamond',serif; font-size:clamp(2.5rem,5vw,4.5rem); font-weight:300; color:var(--cream); margin-bottom:0.8rem; }
.coll-hero p { font-size:0.85rem; color:rgba(245,240,232,.5); font-weight:300; max-width:500px; }

/* Filter bar on collection pages */
.coll-filter-bar {
  background:rgba(255,255,255,.02); border-bottom:1px solid rgba(201,168,76,.12);
  padding:1.2rem 4rem; position:sticky; top:70px; z-index:100;
  backdrop-filter:blur(8px);
}
.coll-filter-bar-inner { max-width:1300px; margin:0 auto; display:flex; align-items:center; gap:0.8rem; flex-wrap:wrap; }
.coll-filter-label { font-size:0.6rem; letter-spacing:0.3em; text-transform:uppercase; color:var(--gold); margin-right:0.5rem; white-space:nowrap; }
.coll-pill {
  padding:0.35rem 1.1rem; border:1px solid rgba(245,240,232,.15);
  background:transparent; font-family:'Jost',sans-serif; font-size:0.63rem;
  letter-spacing:0.12em; text-transform:uppercase; cursor:pointer;
  color:rgba(245,240,232,.55); transition:all .25s; white-space:nowrap;
  display:flex; align-items:center; gap:0.4rem;
}
.coll-pill:hover { border-color:rgba(201,168,76,.5); color:var(--cream); }
.coll-pill.active { background:var(--dark-green); border-color:var(--dark-green); color:var(--cream); }
.coll-pill .cpip { width:8px; height:8px; border-radius:50%; flex-shrink:0; border:1px solid rgba(255,255,255,.2); }
.coll-results-count { margin-left:auto; font-size:0.65rem; letter-spacing:0.15em; color:rgba(245,240,232,.35); white-space:nowrap; }

/* Grid on collection pages */
.coll-grid-wrap { max-width:1300px; margin:0 auto; padding:3.5rem 4rem 6rem; }

/* Gallery page */
#gallery-grid > div img { transition:transform .7s ease, filter .4s ease; }
#gallery-grid > div:hover img { transform:scale(1.06); filter:brightness(1.08); }
.coll-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:1.2rem; }

.stone-card {
  position:relative; overflow:hidden; cursor:pointer;
  background:#111; transition:transform .4s;
}
.stone-card:hover { transform:translateY(-4px); }
.stone-card-img {
  width:100%; aspect-ratio:3/4; object-fit:cover;
  transition:transform .7s ease; display:block;
}
.stone-card:hover .stone-card-img { transform:scale(1.06); }

/* CSS marble swatches (until real images are added) */
.stone-swatch { width:100%; aspect-ratio:3/4; transition:transform .7s ease; position:relative; display:block; }
.stone-card:hover .stone-swatch { transform:scale(1.04); }
.sw-white   { background:linear-gradient(150deg,#f4f0e8,#e8e2d8,#f0ece4,#ddd8ce); }
.sw-white::before   { content:'';position:absolute;inset:0;background:repeating-linear-gradient(22deg,transparent,transparent 35px,rgba(180,160,130,.1) 35px,rgba(180,160,130,.1) 36px); }
.sw-black   { background:linear-gradient(140deg,#1a1818,#2a2624,#1e1c1a,#302c28); }
.sw-black::before   { content:'';position:absolute;inset:0;background:repeating-linear-gradient(-18deg,transparent,transparent 28px,rgba(255,255,255,.07) 28px,rgba(255,255,255,.07) 29px); }
.sw-green   { background:linear-gradient(130deg,#1e4030,#2a5840,#1a3828,#305048); }
.sw-green::before   { content:'';position:absolute;inset:0;background:repeating-linear-gradient(38deg,transparent,transparent 35px,rgba(255,255,255,.08) 35px,rgba(255,255,255,.08) 36px); }
.sw-beige   { background:linear-gradient(140deg,#d8c8a8,#c8b898,#d4c4a4,#c0b090); }
.sw-beige::before   { content:'';position:absolute;inset:0;background:repeating-linear-gradient(-25deg,transparent,transparent 30px,rgba(100,80,50,.1) 30px,rgba(100,80,50,.1) 31px); }
.sw-gold    { background:linear-gradient(130deg,#c8a040,#b89030,#d4ac50,#a88028); }
.sw-gold::before    { content:'';position:absolute;inset:0;background:radial-gradient(ellipse at 40% 40%,rgba(255,220,100,.2) 0%,transparent 60%); }
.sw-grey    { background:linear-gradient(145deg,#8a8680,#706c68,#7e7a74,#686460); }
.sw-grey::before    { content:'';position:absolute;inset:0;background:repeating-linear-gradient(15deg,transparent,transparent 40px,rgba(255,255,255,.06) 40px,rgba(255,255,255,.06) 41px); }
.sw-brown   { background:linear-gradient(140deg,#6a4028,#7e5034,#5c3820,#7a4c30); }
.sw-brown::before   { content:'';position:absolute;inset:0;background:repeating-linear-gradient(30deg,transparent,transparent 32px,rgba(255,200,150,.08) 32px,rgba(255,200,150,.08) 33px); }
.sw-cream   { background:linear-gradient(140deg,#f2ede0,#e8e0d0,#eee8d8,#e0d8c8); }
.sw-pink    { background:linear-gradient(140deg,#d890a0,#c87888,#d09898,#c07080); }
.sw-blue    { background:linear-gradient(130deg,#2a4868,#384e78,#2c4460,#405870); }
.sw-red     { background:linear-gradient(140deg,#8a1810,#a82018,#781008,#981810); }
.sw-orange  { background:linear-gradient(140deg,#c05820,#d86828,#b04818,#c86020); }
.sw-purple  { background:linear-gradient(140deg,#504068,#604878,#484060,#586070); }
.sw-yellow  { background:linear-gradient(140deg,#c8a820,#d8b828,#b89818,#c8a820); }
.sw-multi   { background:linear-gradient(140deg,#c8a040 0%,#2a5840 33%,#1a1818 66%,#d8c8a8 100%); }
.sw-granite { background:linear-gradient(145deg,#3a3835,#4a4845,#2e2c2a,#424040); }
.sw-granite::before { content:'';position:absolute;inset:0;background:radial-gradient(circle at 20% 30%,rgba(201,168,76,.15) 0%,transparent 20%),radial-gradient(circle at 70% 70%,rgba(255,255,255,.1) 0%,transparent 15%); }
.sw-onyx    { background:linear-gradient(130deg,#0a0808,#1a1614,#120e0c,#201a18); }
.sw-onyx::before    { content:'';position:absolute;inset:0;background:repeating-linear-gradient(55deg,transparent,transparent 18px,rgba(201,168,76,.12) 18px,rgba(201,168,76,.12) 19px); }
.sw-travertine { background:linear-gradient(140deg,#d4c4a0,#c4b490,#cec0a0,#bab088); }
.sw-travertine::before { content:'';position:absolute;inset:0;background:repeating-linear-gradient(0deg,transparent,transparent 12px,rgba(100,80,40,.12) 12px,rgba(100,80,40,.12) 13px); }
.sw-limestone { background:linear-gradient(140deg,#c8c0b0,#b8b0a0,#c0b8a8,#a8a098); }
.sw-vietnam { background:linear-gradient(140deg,#d0c0a0,#c0b090,#cab8a0,#b0a888); }
.sw-italian { background:linear-gradient(150deg,#f0ece4,#e4ddd4,#eee8e0,#d8d0c8); }
.sw-italian::before { content:'';position:absolute;inset:0;background:repeating-linear-gradient(20deg,transparent,transparent 45px,rgba(140,120,100,.12) 45px,rgba(140,120,100,.12) 46px); }
.sw-satwario { background:linear-gradient(150deg,#f2eeea,#e2ddd8,#eee8e4,#d4cfc8); }
.sw-satwario::before { content:'';position:absolute;inset:0;background:repeating-linear-gradient(-15deg,transparent,transparent 38px,rgba(80,60,40,.1) 38px,rgba(80,60,40,.1) 39px); }
.sw-brazilian { background:linear-gradient(140deg,#1e3828,#2a4c38,#183020,#305040); }
.sw-brazilian::before { content:'';position:absolute;inset:0;background:repeating-linear-gradient(42deg,transparent,transparent 25px,rgba(255,255,255,.07) 25px,rgba(255,255,255,.07) 26px); }

/* Range/colour label badge */
.stone-badge {
  position:absolute; top:0.8rem; left:0.8rem;
  background:rgba(0,0,0,.55); backdrop-filter:blur(4px);
  padding:0.25rem 0.7rem; font-size:0.55rem; letter-spacing:0.15em;
  text-transform:uppercase; color:var(--gold-light);
}

.stone-card-info {
  position:absolute; bottom:0; left:0; right:0; padding:1.4rem;
  background:linear-gradient(to top,rgba(0,0,0,.8),transparent);
}
.stone-name { font-family:'Cormorant Garamond',serif; font-size:1.2rem; color:var(--cream); margin-bottom:0.2rem; }
.stone-meta { font-size:0.6rem; letter-spacing:0.2em; text-transform:uppercase; color:var(--gold-light); display:flex; align-items:center; gap:0.5rem; }
.stone-colour-dot { width:7px; height:7px; border-radius:50%; border:1px solid rgba(255,255,255,.3); flex-shrink:0; }

.stone-card-overlay {
  position:absolute; inset:0; background:rgba(0,0,0,.75);
  display:flex; flex-direction:column; justify-content:center; align-items:center;
  gap:1rem; padding:1.5rem; opacity:0; transition:opacity .35s;
  text-align:center;
}
.stone-card:hover .stone-card-overlay { opacity:1; }
.stone-overlay-name { font-family:'Cormorant Garamond',serif; font-size:1.4rem; color:var(--cream); }
.stone-overlay-desc { font-size:0.75rem; line-height:1.65; color:rgba(245,240,232,.7); }
.stone-overlay-btn {
  padding:0.5rem 1.4rem; border:1px solid var(--gold); color:var(--gold);
  font-size:0.62rem; letter-spacing:0.15em; text-transform:uppercase;
  cursor:pointer; background:transparent; font-family:'Jost',sans-serif;
  transition:all .25s;
}
.stone-overlay-btn:hover { background:var(--gold); color:var(--charcoal); }

/* No results state */
.no-results { grid-column:1/-1; text-align:center; padding:5rem 2rem; }
.no-results p { font-family:'Cormorant Garamond',serif; font-size:1.8rem; color:rgba(245,240,232,.25); }
.no-results span { display:block; font-family:'Jost',sans-serif; font-size:0.75rem; letter-spacing:0.2em; color:rgba(245,240,232,.2); margin-top:0.8rem; text-transform:uppercase; }

/* ── REVEAL ANIMATION ── */
.reveal { opacity:0; transform:translateY(25px); transition:opacity .8s ease,transform .8s ease; }
.reveal.visible { opacity:1; transform:translateY(0); }

/* ── RESPONSIVE ── */
@media(max-width:1100px) { .coll-grid { grid-template-columns:repeat(3,1fr); } }
@media(max-width:900px) {
  nav { padding:1rem 2rem; } nav.scrolled,nav.solid { padding:0.8rem 2rem; }
  .nav-links { display:none; } .hamburger { display:flex; }
  .about-inner,.contact-inner { grid-template-columns:1fr; gap:3rem; }
  .why-grid { grid-template-columns:repeat(2,1fr); }
  .process-steps { grid-template-columns:repeat(2,1fr); }
  .process-steps::before { display:none; }
  .footer-top { grid-template-columns:1fr 1fr; gap:2rem; }
  .heritage-strip { gap:2rem; padding:1rem 2rem; }
  .heritage-timeline { grid-template-columns:1fr; }
  .about-inner,.heritage-inner,.why-inner,.process-inner,.contact-inner,.footer-inner { padding-left:1.5rem; padding-right:1.5rem; }
  .coll-hero,.coll-filter-bar,.coll-grid-wrap { padding-left:1.5rem; padding-right:1.5rem; }
  .coll-grid { grid-template-columns:repeat(2,1fr); }
  .dropdown-inner { grid-template-columns:1fr; }
  .dropdown-col:not(:last-child) { border-right:none; border-bottom:1px solid rgba(201,168,76,.15); }
  .collection-dropdown { width:300px; right:0; }
  .collection-dropdown-box::before { right:2rem; }
}
@media(max-width:500px) { .coll-grid { grid-template-columns:1fr 1fr; gap:0.7rem; } }

/* ── ONYX PHOTO GALLERY CARDS ── */
.onyx-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:1.2rem; }
.onyx-card {
  position:relative; cursor:pointer; border-radius:6px; overflow:hidden;
  background:var(--charcoal); border:1px solid rgba(201,168,76,.15);
  transition:transform .35s ease, box-shadow .35s ease, border-color .35s;
}
.onyx-card:hover { transform:translateY(-5px); border-color:rgba(201,168,76,.5); box-shadow:0 12px 40px rgba(0,0,0,.5); }
.onyx-card-img-wrap { position:relative; aspect-ratio:3/4; overflow:hidden; }
.onyx-card-img-wrap img { width:100%; height:100%; object-fit:cover; display:block; transition:transform .7s ease; }
.onyx-card:hover .onyx-card-img-wrap img { transform:scale(1.06); }
.onyx-card-badge {
  position:absolute; top:0.7rem; left:0.7rem;
  background:rgba(0,0,0,.7); backdrop-filter:blur(8px);
  border:1px solid rgba(201,168,76,.4); border-radius:3px;
  font-size:0.55rem; letter-spacing:0.18em; text-transform:uppercase;
  color:var(--gold); padding:0.25rem 0.55rem;
}
.onyx-card-count {
  position:absolute; bottom:0.7rem; right:0.7rem;
  background:rgba(0,0,0,.65); backdrop-filter:blur(6px);
  border-radius:20px; font-size:0.65rem; color:rgba(245,240,232,.7);
  padding:0.2rem 0.6rem; display:flex; align-items:center; gap:0.35rem;
}
.onyx-card-info { padding:0.9rem 1rem 1rem; }
.onyx-card-name { font-family:'Cormorant Garamond',serif; font-size:1.1rem; color:var(--cream); margin-bottom:0.2rem; }
.onyx-card-meta { font-size:0.6rem; letter-spacing:0.18em; text-transform:uppercase; color:var(--gold-light); }
.onyx-card-hover-layer {
  position:absolute; inset:0; background:linear-gradient(to top,rgba(0,0,0,.8) 0%,transparent 60%);
  opacity:0; transition:opacity .35s; display:flex; align-items:flex-end; padding:1.2rem;
}
.onyx-card:hover .onyx-card-hover-layer { opacity:1; }
.onyx-hover-btn {
  font-size:0.65rem; letter-spacing:0.18em; text-transform:uppercase;
  border:1px solid var(--gold); color:var(--gold); padding:0.45rem 1rem;
  background:transparent; cursor:pointer; transition:background .2s,color .2s;
}
.onyx-hover-btn:hover { background:var(--gold); color:var(--charcoal); }

/* ── LIGHTBOX MODAL ── */
#onyx-modal {
  display:none; position:fixed; inset:0; z-index:9999;
  background:rgba(0,0,0,.92); backdrop-filter:blur(12px);
  align-items:center; justify-content:center;
}
#onyx-modal.open { display:flex; }
.modal-inner {
  position:relative; width:90vw; max-width:1100px; max-height:92vh;
  background:#111; border:1px solid rgba(201,168,76,.2);
  border-radius:8px; display:flex; flex-direction:column; overflow:hidden;
}
.modal-header {
  display:flex; align-items:center; justify-content:space-between;
  padding:1rem 1.4rem; border-bottom:1px solid rgba(201,168,76,.15);
  flex-shrink:0;
}
.modal-title { font-family:'Cormorant Garamond',serif; font-size:1.6rem; color:var(--cream); }
.modal-subtitle { font-size:0.6rem; letter-spacing:0.2em; text-transform:uppercase; color:var(--gold); margin-top:0.1rem; }
.modal-close {
  width:36px; height:36px; border:1px solid rgba(201,168,76,.3); background:transparent;
  color:var(--cream); font-size:1.2rem; cursor:pointer; border-radius:50%;
  display:flex; align-items:center; justify-content:center; transition:background .2s,border-color .2s;
  flex-shrink:0;
}
.modal-close:hover { background:rgba(201,168,76,.15); border-color:var(--gold); }
.modal-body { display:flex; gap:0; flex:1; overflow:hidden; min-height:0; }
/* Main image viewer */
.modal-main {
  flex:1; position:relative; background:#0a0a0a; display:flex;
  align-items:center; justify-content:center; min-width:0;
}
.modal-main img {
  max-width:100%; max-height:100%; object-fit:contain; display:block;
  transition:opacity .25s ease;
}
.modal-main img.fade { opacity:0; }
.modal-nav {
  position:absolute; top:50%; transform:translateY(-50%);
  width:42px; height:42px; background:rgba(0,0,0,.6); backdrop-filter:blur(6px);
  border:1px solid rgba(201,168,76,.3); border-radius:50%; color:var(--cream);
  font-size:1.1rem; cursor:pointer; display:flex; align-items:center; justify-content:center;
  transition:background .2s,border-color .2s; z-index:2;
}
.modal-nav:hover { background:rgba(201,168,76,.2); border-color:var(--gold); }
.modal-nav.prev { left:1rem; }
.modal-nav.next { right:1rem; }
.modal-img-label {
  position:absolute; bottom:0; left:0; right:0;
  background:linear-gradient(to top,rgba(0,0,0,.8),transparent);
  padding:1.5rem 1.2rem 0.8rem; font-size:0.65rem; letter-spacing:0.18em;
  text-transform:uppercase; color:rgba(245,240,232,.6);
}
/* Thumbnail strip */
.modal-thumbs {
  width:130px; flex-shrink:0; overflow-y:auto; background:#0d0d0d;
  border-left:1px solid rgba(201,168,76,.1); padding:0.6rem;
  display:flex; flex-direction:column; gap:0.5rem;
}
.modal-thumbs::-webkit-scrollbar { width:3px; }
.modal-thumbs::-webkit-scrollbar-track { background:transparent; }
.modal-thumbs::-webkit-scrollbar-thumb { background:rgba(201,168,76,.3); border-radius:2px; }
.modal-thumb {
  position:relative; aspect-ratio:1; border-radius:4px; overflow:hidden; cursor:pointer;
  border:2px solid transparent; transition:border-color .2s; flex-shrink:0;
}
.modal-thumb.active { border-color:var(--gold); }
.modal-thumb img { width:100%; height:100%; object-fit:cover; display:block; }
.modal-thumb-tag {
  position:absolute; bottom:0; left:0; right:0;
  background:rgba(0,0,0,.7); font-size:0.5rem; letter-spacing:0.1em;
  text-transform:uppercase; color:var(--gold); text-align:center;
  padding:0.15rem 0.2rem;
}
.modal-enquire {
  padding:0.9rem 1.4rem; border-top:1px solid rgba(201,168,76,.15);
  display:flex; align-items:center; justify-content:space-between; flex-shrink:0;
}
.modal-enquire-text { font-size:0.7rem; letter-spacing:0.12em; color:rgba(245,240,232,.45); text-transform:uppercase; }
.modal-enquire-btn {
  font-size:0.65rem; letter-spacing:0.2em; text-transform:uppercase;
  border:1px solid var(--gold); color:var(--gold); padding:0.5rem 1.4rem;
  background:transparent; cursor:pointer; transition:background .2s,color .2s;
}
.modal-enquire-btn:hover { background:var(--gold); color:var(--charcoal); }

@media(max-width:1100px) { .onyx-grid { grid-template-columns:repeat(3,1fr); } }
@media(max-width:768px) {
  .onyx-grid { grid-template-columns:repeat(2,1fr); }
  .modal-thumbs { width:90px; }
  .modal-title { font-size:1.2rem; }
}
@media(max-width:500px) {
  .onyx-grid { grid-template-columns:repeat(2,1fr); gap:0.6rem; }
  .modal-inner { width:100vw; max-height:100vh; border-radius:0; }
  .modal-thumbs { display:none; }
}

/* ══════════════════════════════════════
   COMPREHENSIVE MOBILE RESPONSIVE STYLES
══════════════════════════════════════ */

/* ── Mobile nav menu ── */
@media(max-width:900px) {
  /* Smooth slide-down mobile menu */
  .nav-links {
    position:fixed; top:0; left:0; right:0;
    background:rgba(15,22,17,.98); backdrop-filter:blur(16px);
    flex-direction:column; align-items:flex-start;
    padding:5rem 2rem 2.5rem; gap:0;
    z-index:998; transform:translateY(-110%);
    transition:transform .35s cubic-bezier(.4,0,.2,1);
    border-bottom:1px solid rgba(201,168,76,.2);
    max-height:100vh; overflow-y:auto;
  }
  .nav-links.mobile-open {
    transform:translateY(0);
    display:flex !important;
  }
  .nav-links > li { width:100%; border-bottom:1px solid rgba(201,168,76,.08); }
  .nav-links > li:last-child { border-bottom:none; }
  .nav-links a {
    display:block; padding:1rem 0; font-size:.85rem;
    letter-spacing:.15em; width:100%;
  }
  .nav-cta {
    margin-top:1rem; display:inline-block !important;
    width:auto !important; text-align:center;
    padding:.7rem 1.8rem !important;
  }
  /* Hide dropdown on mobile — collection items show inline */
  .collection-dropdown { display:none !important; }
  .nav-collection-trigger > a svg { display:none; }

  /* Mobile hamburger → X animation */
  .hamburger.open span:nth-child(1) { transform:translateY(6px) rotate(45deg); }
  .hamburger.open span:nth-child(2) { opacity:0; transform:scaleX(0); }
  .hamburger.open span:nth-child(3) { transform:translateY(-6px) rotate(-45deg); }

  /* Inline Collection links in mobile menu */
  .mobile-collection-links { display:flex; flex-direction:column; gap:0; }
  .mobile-collection-link {
    display:block; padding:.6rem 0 .6rem 1rem;
    font-size:.72rem; letter-spacing:.12em; text-transform:uppercase;
    color:rgba(245,240,232,.5); cursor:pointer; border:none;
    background:none; font-family:'Jost',sans-serif; text-align:left;
    width:100%; transition:color .2s;
  }
  .mobile-collection-link:hover { color:var(--gold); }
}

/* ── Hero ── */
@media(max-width:768px) {
  .hero-content { padding:5rem 1.5rem 0; }
  .hero-title { font-size:clamp(2.4rem,11vw,4rem); }
  .hero-subtitle { font-size:.78rem; }
  .hero-buttons { flex-direction:column; align-items:center; gap:.8rem; }
  .btn-primary,.btn-secondary { width:100%; max-width:280px; text-align:center; padding:.9rem 1.5rem; }
}

/* ── Heritage strip ── */
@media(max-width:600px) {
  .heritage-strip { flex-direction:column; gap:1.2rem; padding:1.5rem 1.5rem; align-items:flex-start; }
}

/* ── About section ── */
@media(max-width:768px) {
  #about { padding:4rem 0; }
  .about-inner { padding:0 1.5rem; gap:2.5rem; }
  .about-img-wrap { height:300px; }
  .about-logo-badge { width:80px; height:80px; bottom:-1rem; right:-0.5rem; }
  .about-logo-badge img { width:52px; height:52px; }
  .about-stats { grid-template-columns:1fr 1fr; gap:1rem; }
  .stat-number { font-size:2rem; }
}

/* ── Heritage timeline ── */
@media(max-width:768px) {
  .heritage-section { padding:4rem 0; }
  .heritage-inner { padding:0 1.5rem; }
  .heritage-inner > p { margin-bottom:2rem; }
  .heritage-timeline { grid-template-columns:1fr; }
  .timeline-item { padding:2rem 1.5rem; border-right:none; border-bottom:1px solid rgba(201,168,76,.12); }
  .timeline-item:last-child { border-bottom:none; }
  .timeline-number { font-size:3rem; }
}

/* ── Why section ── */
@media(max-width:768px) {
  .why-section { padding:4rem 0; }
  .why-inner { padding:0 1.5rem; }
  .why-grid { grid-template-columns:1fr 1fr; gap:1rem; }
  .why-card { padding:1.5rem 1.2rem; }
  .why-icon { width:36px; height:36px; }
}
@media(max-width:420px) {
  .why-grid { grid-template-columns:1fr; }
}

/* ── Process section ── */
@media(max-width:768px) {
  .process-section { padding:4rem 0; }
  .process-inner { padding:0 1.5rem; }
  .process-steps { grid-template-columns:1fr 1fr; gap:1.5rem; }
  .process-steps::before { display:none; }
  .step-circle { width:4rem; height:4rem; font-size:1.2rem; }
}
@media(max-width:420px) {
  .process-steps { grid-template-columns:1fr; }
}

/* ── Contact section ── */
@media(max-width:768px) {
  #contact-section { padding:4rem 0; }
  .contact-inner { padding:0 1.5rem; gap:2rem; }
  .contact-form-wrapper { padding:1.8rem 1.2rem; }
  .form-row { grid-template-columns:1fr; gap:0; }
}

/* ── Footer ── */
@media(max-width:768px) {
  footer { padding:3rem 0 1.5rem; }
  .footer-inner { padding:0 1.5rem; }
  .footer-top { grid-template-columns:1fr 1fr; gap:2rem; margin-bottom:2rem; padding-bottom:2rem; }
  .footer-brand { grid-column:1/-1; }
}
@media(max-width:420px) {
  .footer-top { grid-template-columns:1fr; }
  .footer-bottom { flex-direction:column; gap:1rem; text-align:center; }
}

/* ── Featured stones on home page ── */
@media(max-width:768px) {
  .stone-grid { grid-template-columns:repeat(2,1fr) !important; gap:.8rem !important; }
}
@media(max-width:420px) {
  .stone-grid { grid-template-columns:1fr 1fr !important; gap:.6rem !important; }
}

/* ── Collection pages (range, colour, onyx, carving, handicraft) ── */
@media(max-width:768px) {
  .coll-hero { padding:7rem 1.5rem 3rem; }
  .coll-hero h1 { font-size:clamp(2rem,8vw,3rem); }
  .coll-filter-bar { padding:1rem 1.5rem; top:60px; }
  .coll-grid-wrap { padding:2rem 1.5rem 4rem; }
  .coll-grid { grid-template-columns:repeat(2,1fr); gap:.8rem; }
  .onyx-grid { grid-template-columns:repeat(2,1fr); gap:.8rem; }
  /* Breadcrumb wrap */
  .coll-breadcrumb { flex-wrap:wrap; gap:.3rem; }
}
@media(max-width:420px) {
  .coll-hero { padding:6.5rem 1rem 2.5rem; }
  .coll-grid { grid-template-columns:1fr 1fr; gap:.5rem; }
  .onyx-grid { grid-template-columns:1fr 1fr; gap:.5rem; }
  /* Stone cards — tighter info */
  .stone-name { font-size:1rem; }
  .onyx-card-name { font-size:.95rem; }
}

/* ── Collection filter pills — horizontal scroll on mobile ── */
@media(max-width:768px) {
  .coll-filter-bar-inner { flex-wrap:nowrap; overflow-x:auto; -webkit-overflow-scrolling:touch; padding-bottom:.3rem; }
  .coll-filter-bar-inner::-webkit-scrollbar { display:none; }
  .coll-results-count { display:none; }
  .coll-pill { white-space:nowrap; flex-shrink:0; }
}

/* ── Indian Marble detail page ── */
@media(max-width:768px) {
  .im-photo-grid { columns:2; column-gap:.6rem; }
  .im-detail-title { font-size:clamp(1.8rem,7vw,3rem); }
}
@media(max-width:420px) {
  .im-photo-grid { columns:1; }
}

/* ── Lightbox modal ── */
@media(max-width:768px) {
  .modal-inner { width:100vw; max-height:100dvh; border-radius:0; margin:0; }
  .modal-title { font-size:1.1rem; }
  .modal-subtitle { font-size:.55rem; }
  .modal-thumbs { width:80px; }
  .modal-thumb-tag { display:none; }
  .modal-nav { width:34px; height:34px; font-size:.9rem; }
  .modal-nav.prev { left:.4rem; }
  .modal-nav.next { right:.4rem; }
  .modal-enquire { padding:.7rem 1rem; }
  .modal-enquire-text { display:none; }
}
@media(max-width:500px) {
  .modal-thumbs { display:none; }
  .modal-main img { max-height:calc(100dvh - 110px); }
}

/* ── Gallery page grid ── */
@media(max-width:768px) {
  #gallery-grid { grid-template-columns:repeat(2,1fr) !important; gap:.6rem !important; }
}
@media(max-width:420px) {
  #gallery-grid { grid-template-columns:1fr 1fr !important; }
}

/* ── Prevent horizontal overflow globally ── */
@media(max-width:768px) {
  html, body { overflow-x:hidden; }
  .page { overflow-x:hidden; }
}


@media(max-width:900px) {
  #mobile-collection-block { display:block !important; }
}