/* ================================================================
   JUGLANS — Born in Kashmir. Built for Life.
   Complete Stylesheet v2 — Dark Walnut Edition
   ================================================================ */

/* ── Google Fonts loaded in HTML ── */

:root {
  --bg:          #050301;   /* near-black walnut */
  --bg-surface:  #0E0804;   /* dark walnut surface */
  --bg-card:     #160D07;   /* card backgrounds */
  --bg-lift:     #1E1109;   /* lifted card / hover */
  --gold:        #C5A059;   /* primary gold */
  --gold-hi:     #E9C176;   /* headline gold */
  --gold-dim:    #8A6D3B;   /* subdued gold */
  --cream:       #EAD9C4;   /* body text */
  --muted:       #B89A72;   /* secondary text */
  --gray:        #6B5640;   /* captions */
  --border:      rgba(197,160,89,.13);
  --ease:        cubic-bezier(0.22, 1, 0.36, 1);
}

/* ── Reset ── */
*, *::before, *::after { margin:0; padding:0; box-sizing:border-box; }
html { scroll-behavior: smooth; -webkit-text-size-adjust: 100%; }

body {
  background: var(--bg);
  color: var(--cream);
  font-family: 'Montserrat', sans-serif;
  font-weight: 300;
  font-size: 15px;
  line-height: 1.78;
  overflow-x: hidden;
  cursor: none;
}

/* wood grain overlay on body */
body::before {
  content: '';
  position: fixed; inset: 0;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='400' height='400'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='4' stitchTiles='stitch'/%3E%3CfeColorMatrix type='saturate' values='0'/%3E%3C/filter%3E%3Crect width='400' height='400' filter='url(%23n)' opacity='.025'/%3E%3C/svg%3E");
  pointer-events: none;
  z-index: 9998;
  opacity: .6;
}

img  { display:block; max-width:100%; }
a    { cursor: none; }

/* ── Custom Cursor ── */
#cur {
  position: fixed; width:10px; height:10px;
  background: var(--gold); border-radius: 50%;
  pointer-events: none; z-index: 99999;
  transform: translate(-50%,-50%);
  transition: width .28s var(--ease), height .28s var(--ease),
              background .28s ease, border .28s ease;
  will-change: left,top;
}
#cur.big {
  width:30px; height:30px;
  background: transparent;
  border: 1.5px solid var(--gold);
}
#cur-trail {
  position: fixed; width:40px; height:40px;
  border: 1px solid rgba(197,160,89,.22);
  border-radius: 50%;
  pointer-events: none; z-index:99997;
  transform: translate(-50%,-50%);
  will-change: left,top;
}

/* ── Hide custom cursor on touch/mobile ── */
@media (hover: none) {
  #cur, #cur-trail { display: none !important; }
  body, a, button, .btn, .scope-card, .mat-card,
  .furn-item, .nav-burger { cursor: auto; }
}

/* ── Loader ── */
#loader {
  position: fixed; inset:0;
  background: #0C0804;
  z-index: 999999;
  display: flex; align-items:center; justify-content:center;
  transition: opacity .6s ease, visibility .6s ease;
}
#loader.out { opacity:0; visibility:hidden; }
.loader-brand {
  display: flex; flex-direction:column; align-items:center; gap:14px;
  animation: loaderAnim 1s ease forwards;
}
.loader-brand img {
  width: 260px;
  filter: sepia(1) saturate(2) hue-rotate(5deg) brightness(2.2);
}
.loader-sub {
  font-family: 'Montserrat', sans-serif;
  font-size: 9px; font-weight:600; letter-spacing:.32em; text-transform:uppercase;
  color: var(--gold-dim);
}
@keyframes loaderAnim {
  0%   { opacity:0; transform: translateY(8px); }
  30%  { opacity:1; transform: translateY(0); }
  80%  { opacity:1; }
  100% { opacity:0; }
}

/* ── Navigation ── */
#nav {
  position: fixed; top:0; left:0; width:100%;
  z-index:1000;
  padding: 18px 68px;
  display: flex; align-items:center; justify-content:space-between;
  background: #F2E6D4;
  border-bottom: 1px solid rgba(197,160,89,.45);
  box-shadow: 0 2px 24px rgba(0,0,0,.22);
  transition: padding .35s ease, box-shadow .35s ease, transform .38s cubic-bezier(0.4,0,0.2,1);
}
#nav.pinned {
  padding: 12px 68px;
  box-shadow: 0 4px 32px rgba(0,0,0,.35);
}
#nav.nav--hidden {
  transform: translateY(-100%);
}

.nav-logo { display:flex; align-items:center; gap:10px; text-decoration:none; }
.nav-logo img {
  height: 52px; width:auto;
  filter: none;
}
/* fallback if image not loaded */
.nav-logo-text {
  font-family: 'Cinzel', serif;
  font-size: 17px; font-weight:700;
  letter-spacing:.18em;
  color: #3D1A06;
  display: none;
}

.nav-links { display:flex; align-items:center; gap:48px; list-style:none; }
.nav-links a {
  font-size:10px; font-weight:600;
  letter-spacing:.18em; text-transform:uppercase;
  color: #6B3C14; text-decoration:none;
  position:relative; transition: color .3s ease;
}
.nav-links a::after {
  content:''; position:absolute; bottom:-5px; left:0;
  width:0; height:1px; background: #6B3C14;
  transition: width .35s ease;
}
.nav-links a:hover,
.nav-links a.active { color: #3D1A06; }
.nav-links a:hover::after,
.nav-links a.active::after { width:100%; }

/* hamburger */
.nav-burger {
  display:none; flex-direction:column; gap:5px;
  background:none; border:none; cursor:none; padding:4px;
}
.nav-burger span {
  display:block; width:24px; height:1px;
  background: #3D1A06; transition: all .35s ease;
}

/* ── Mobile overlay ── */
#mob-menu {
  position:fixed; inset:0;
  background: #000;
  z-index:9500;
  display:flex; flex-direction:column;
  align-items:center; justify-content:center; gap:44px;
  opacity:0; visibility:hidden;
  transition: opacity .4s ease, visibility .4s ease;
}
#mob-menu.open { opacity:1; visibility:visible; }
#mob-menu a {
  font-family:'Cinzel',serif; font-size:28px; font-weight:700;
  letter-spacing:.1em; color: var(--gold-hi);
  text-decoration:none;
  opacity:0; transform:translateY(20px);
  transition: color .3s ease;
}
#mob-menu.open a { animation: slideUp .5s ease forwards; }
#mob-menu.open a:nth-child(2){ animation-delay:.06s; }
#mob-menu.open a:nth-child(3){ animation-delay:.12s; }
#mob-menu.open a:nth-child(4){ animation-delay:.18s; }
#mob-menu.open a:nth-child(5){ animation-delay:.24s; }
#mob-menu.open a:nth-child(6){ animation-delay:.30s; }
@keyframes slideUp { to { opacity:1; transform:none; } }
#mob-close {
  position:absolute; top:28px; right:36px;
  background:none; border:none; cursor:none;
  font-family:'Cinzel',serif; font-size:22px; color: var(--gold);
}

/* WhatsApp floating button */
.wa-btn {
  position: fixed; bottom:32px; right:32px;
  width:56px; height:56px; border-radius:50%;
  background: #1a1a1a;
  border: 1px solid rgba(37,211,102,.4);
  display:flex; align-items:center; justify-content:center;
  z-index:5000; text-decoration:none;
  transition: transform .3s ease, background .3s ease;
  box-shadow: 0 4px 20px rgba(0,0,0,.6);
}
.wa-btn:hover { transform:scale(1.1); background:#111; }
.wa-btn svg { width:26px; height:26px; }

/* ── Gold rule ── */
.gold-rule {
  width:100%; overflow:hidden; line-height:0;
}
.gold-rule svg { display:block; width:100%; }
.gold-rule line {
  stroke: var(--gold); stroke-width:1;
  stroke-dasharray:2000; stroke-dashoffset:2000;
  transition: stroke-dashoffset 1.8s var(--ease);
}
.gold-rule.drawn line { stroke-dashoffset:0; }

/* ── Scroll reveal ── */
.reveal {
  opacity:0; transform:translateY(32px);
  transition: opacity .9s ease, transform .9s ease;
}
.reveal.in { opacity:1; transform:none; }
.reveal.d1 { transition-delay:.1s; }
.reveal.d2 { transition-delay:.2s; }
.reveal.d3 { transition-delay:.3s; }
.reveal.d4 { transition-delay:.4s; }

/* ── Section label ── */
.eyebrow {
  font-size:9px; font-weight:600; letter-spacing:.32em; text-transform:uppercase;
  color: var(--gray); margin-bottom:20px;
}

/* ── Primary button ── */
.btn {
  display:inline-block;
  padding:14px 52px;
  border: 1px solid var(--gold);
  font-size:10px; font-weight:600;
  letter-spacing:.22em; text-transform:uppercase;
  color: var(--gold); text-decoration:none;
  position:relative; overflow:hidden;
  transition: color .5s ease;
  background:transparent;
  cursor:none;
}
.btn::before {
  content:''; position:absolute; top:0; left:-101%; width:101%; height:100%;
  background: var(--gold);
  transition: left .5s var(--ease); z-index:-1;
}
.btn:hover { color: var(--bg); }
.btn:hover::before { left:0; }

/* Ghost/outline hero button variant */
.btn--ghost {
  border-color: rgba(234,217,196,.5);
  color: rgba(234,217,196,.85);
  margin-left: 18px;
}
.btn--ghost::before { background: rgba(234,217,196,.12); }
.btn--ghost:hover { color: var(--cream); }
.btn--ghost:hover::before { left: 0; }

/* ================================================================
   HERO
   ================================================================ */
.hero {
  position:relative; width:100%; height:100vh;
  overflow:hidden;
  display:flex; align-items:center; justify-content:center;
}
.hero__bg {
  position:absolute; inset:0;
  background: var(--bg-surface);
  background-image: url('../images/hero-bg.jpg');
  background-size:cover; background-position:center;
  animation: kenBurns 22s ease-in-out infinite;
  will-change: transform;
}
.hero__bg::after {
  content:''; position:absolute; inset:0;
  background: linear-gradient(
    160deg,
    rgba(5,3,1,.72) 0%,
    rgba(5,3,1,.4)  45%,
    rgba(5,3,1,.85) 100%
  );
}
@keyframes kenBurns {
  0%  { transform:scale(1.00); }
  50% { transform:scale(1.07); }
  100%{ transform:scale(1.00); }
}

#particles { position:absolute; inset:0; z-index:1; pointer-events:none; }

.hero__inner {
  position:relative; z-index:2;
  text-align:center; padding:0 24px;
}
.hero__tagline {
  font-family:'Cormorant Garamond',serif;
  font-size:clamp(16px,2.2vw,24px);
  font-weight:300; font-style:italic;
  letter-spacing:.08em; color: var(--cream);
  margin:0 0 48px; /* override browser h1 defaults */
  opacity:0; transform:translateY(16px);
}
.hero__cta {
  opacity:0; transform:translateY(12px);
  display: flex; align-items: center; justify-content: center; flex-wrap: wrap; gap: 14px;
}
.hero__scroll {
  position:absolute; bottom:40px; left:50%;
  transform:translateX(-50%);
  z-index:2; display:flex; flex-direction:column;
  align-items:center; gap:10px;
  opacity:0;
}
.hero__scroll span {
  font-size:9px; font-weight:600; letter-spacing:.24em; text-transform:uppercase;
  color: var(--gray);
}
.hero__scroll-line {
  width:1px; height:52px;
  background:linear-gradient(to bottom, var(--gold), transparent);
  animation:scrollDrop 2.4s ease-in-out infinite;
  transform-origin:top;
}
@keyframes scrollDrop {
  0%  { transform:scaleY(0); opacity:1; }
  50% { transform:scaleY(1); opacity:1; }
  100%{ transform:scaleY(1); opacity:0; }
}

/* ================================================================
   SCOPE OF WORK
   ================================================================ */
.s-scope {
  background: var(--bg-surface);
  padding: 100px 0 0;
}
.s-scope__head {
  padding: 0 68px 64px;
}
.s-scope__head h2 {
  font-family:'Cinzel',serif;
  font-size:clamp(28px,3.6vw,48px);
  font-weight:700; letter-spacing:.06em;
  color: var(--cream);
}

.scope-grid {
  display:grid;
  grid-template-columns: repeat(4,1fr);
  gap:2px;
}
.scope-card {
  position:relative;
  aspect-ratio:3/4;
  overflow:hidden;
  text-decoration:none;
  display:block;
  cursor:none;
}
.scope-card__img {
  position:absolute; inset:0;
  background: var(--bg-card);
  background-size:cover; background-position:center;
  transition:transform .7s var(--ease), filter .5s ease;
  filter:brightness(.6);
}
.scope-card:hover .scope-card__img {
  transform:scale(1.05);
  filter:brightness(.45);
}
.scope-card__body {
  position:absolute; inset:0;
  background:linear-gradient(to top, rgba(5,3,1,.9) 0%, transparent 55%);
  display:flex; flex-direction:column; justify-content:flex-end;
  padding:40px 36px;
  transition: background .4s ease;
}
.scope-card__num {
  font-family:'Cinzel',serif;
  font-size:56px; font-weight:700;
  color: var(--gold); opacity:.1;
  line-height:1; margin-bottom:-16px;
}
.scope-card__title {
  font-family:'Cinzel',serif;
  font-size:clamp(18px,2vw,24px); font-weight:700;
  letter-spacing:.1em; color: var(--cream);
  margin-bottom:10px;
  transition: color .3s ease;
}
.scope-card:hover .scope-card__title { color: var(--gold-hi); }
.scope-card__sub {
  font-size:11px; font-weight:300;
  letter-spacing:.06em; color: var(--muted);
  opacity:0; transform:translateY(8px);
  transition: opacity .4s ease, transform .4s ease;
}
.scope-card:hover .scope-card__sub { opacity:1; transform:none; }
.scope-card__arrow {
  margin-top:16px;
  font-size:9px; font-weight:600; letter-spacing:.22em; text-transform:uppercase;
  color: var(--gold);
  opacity:0; transform:translateY(8px);
  transition: opacity .4s ease .08s, transform .4s ease .08s;
  display:flex; align-items:center; gap:10px;
}
.scope-card__arrow::after {
  content:''; display:block;
  width:32px; height:1px; background: var(--gold);
}
.scope-card:hover .scope-card__arrow { opacity:1; transform:none; }

/* scope card image backgrounds */
.scope-card[data-scope="living"]    .scope-card__img { background-image:url('../images/living-1.jpg'); }
.scope-card[data-scope="kitchen"]   .scope-card__img { background-image:url('../images/kitchen-3.jpg'); }
.scope-card[data-scope="bedroom"]   .scope-card__img { background-image:url('../images/bedroom-1.jpg'); }
.scope-card[data-scope="furniture"] .scope-card__img { background-image:url('../images/furniture-sofa.jpg'); }

/* ================================================================
   OUR PROCESS
   ================================================================ */
.s-process {
  padding: 120px 68px;
  background: var(--bg);
  position: relative;
  overflow: hidden;
}

/* ghost watermark */
.s-process::before {
  content: 'VIII STEPS';
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  font-family: 'Cinzel', serif;
  font-size: clamp(60px, 9vw, 130px);
  font-weight: 900;
  letter-spacing: .35em;
  color: rgba(197,160,89,.03);
  white-space: nowrap;
  pointer-events: none;
  user-select: none;
}

.s-process__head {
  margin-bottom: 64px;
  position: relative;
}

.s-process__head h2 {
  font-family: 'Cinzel', serif;
  font-size: clamp(28px, 3.4vw, 46px);
  font-weight: 700;
  letter-spacing: .06em;
  color: var(--cream);
}

/* gold line + ornament under heading */
.s-process__head::after {
  content: '❧';
  display: block;
  color: var(--gold-dim);
  font-size: 22px;
  margin-top: 24px;
  letter-spacing: .1em;
}

.process-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 1px;
  background: rgba(197,160,89,.1);
  border: 1px solid rgba(197,160,89,.1);
}

.process-step {
  padding: 44px 32px 40px;
  background: var(--bg);
  position: relative;
  overflow: hidden;
  transition: background .4s var(--ease);
  cursor: default;
}

/* ghost large number */
.process-step::after {
  content: attr(data-step);
  position: absolute;
  bottom: -22px;
  right: -4px;
  font-family: 'Cinzel', serif;
  font-size: 120px;
  font-weight: 900;
  line-height: 1;
  color: rgba(197,160,89,.06);
  pointer-events: none;
  transition: color .5s ease;
}

.process-step:hover { background: var(--bg-lift); }
.process-step:hover::after { color: rgba(197,160,89,.13); }

/* gold top bar that grows on hover */
.process-step::before {
  content: '';
  position: absolute;
  top: 0; left: 0;
  width: 0; height: 2px;
  background: linear-gradient(90deg, var(--gold), var(--gold-hi));
  transition: width .5s var(--ease);
}
.process-step:hover::before { width: 100%; }

.process-step__num {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 40px; height: 40px;
  border-radius: 50%;
  border: 1px solid rgba(197,160,89,.4);
  font-family: 'Cinzel', serif;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: .06em;
  color: var(--gold);
  margin-bottom: 24px;
  position: relative;
  z-index: 1;
  transition: border-color .4s, background .4s;
}
.process-step:hover .process-step__num {
  background: rgba(197,160,89,.12);
  border-color: var(--gold);
}

.process-step__title {
  font-family: 'Cinzel', serif;
  font-size: 11.5px;
  font-weight: 700;
  letter-spacing: .16em;
  text-transform: uppercase;
  color: var(--cream);
  margin-bottom: 14px;
  position: relative;
  z-index: 1;
}

/* gold bar above title */
.process-step__title::before {
  content: '';
  display: block;
  width: 28px;
  height: 1.5px;
  background: var(--gold);
  margin-bottom: 12px;
  transition: width .4s var(--ease);
}
.process-step:hover .process-step__title::before { width: 48px; }

.process-step__desc {
  font-size: 13px;
  line-height: 1.85;
  color: var(--gray);
  position: relative;
  z-index: 1;
}

/* ================================================================
   MATERIALS
   ================================================================ */
.s-materials {
  padding:0;
  background: var(--bg-surface);
}
.s-materials__head {
  padding:100px 68px 60px;
}
.s-materials__head h2 {
  font-family:'Cinzel',serif;
  font-size:clamp(28px,3.4vw,46px);
  font-weight:700; letter-spacing:.06em;
  color: var(--cream);
}

.materials-grid {
  display:grid;
  grid-template-columns:repeat(2,1fr);
  gap:2px;
}
.mat-card {
  position:relative; overflow:hidden;
  aspect-ratio:16/9;
  display:flex; align-items:flex-end;
}
.mat-card__bg {
  position:absolute; inset:0;
  background: var(--bg-card);
  background-size:cover; background-position:center;
  transition:transform .7s var(--ease), filter .5s ease;
  filter:brightness(.45);
}
.mat-card:hover .mat-card__bg {
  transform:scale(1.04);
  filter:brightness(.35);
}
.mat-card__body {
  position:relative; z-index:1;
  padding:44px 48px;
  background:linear-gradient(to top, rgba(5,3,1,.95) 0%, transparent 100%);
  width:100%;
}
.mat-card__label {
  font-size:9px; font-weight:600; letter-spacing:.28em; text-transform:uppercase;
  color: var(--gold-dim); margin-bottom:10px;
}
.mat-card__title {
  font-family:'Cinzel',serif;
  font-size:clamp(20px,2.4vw,30px); font-weight:700;
  letter-spacing:.06em; color: var(--gold-hi);
  margin-bottom:14px;
}
.mat-card__desc {
  font-size:13px; line-height:1.85; color: var(--muted);
  max-width:420px;
}

/* material card backgrounds */
.mat-card[data-mat="wood"]     .mat-card__bg { background-image:url('../images/walnut-wood.jpg'); background-position:center center; }
.mat-card[data-mat="finish"]   .mat-card__bg { background-image:url('../images/material-finish.jpg'); background-position:center center; }
.mat-card[data-mat="hardware"] .mat-card__bg { background-image:url('../images/hardware.jpg'); background-position:center center; }
.mat-card[data-mat="glass"]    .mat-card__bg { background-image:url('../images/glass-new.jpg'); background-position:center center; }

/* ================================================================
   BOOK APPOINTMENT — shared
   ================================================================ */
.s-book {
  padding: 110px 68px;
  background: url('../images/hero-bg.jpg') center/cover no-repeat var(--bg);
  position: relative;
  overflow: hidden;
}
.s-book::before {
  content: '';
  position: absolute; inset: 0;
  background: rgba(5,3,1,.88) linear-gradient(135deg, rgba(5,3,1,.92) 0%, rgba(20,12,4,.85) 100%);
  z-index: 0;
}
.s-book::after {
  content: '';
  position: absolute;
  top: 0; left: 68px; right: 68px;
  height: 1px;
  background: linear-gradient(90deg, transparent, var(--gold), var(--gold-hi), var(--gold), transparent);
  z-index: 1;
}
.s-book__inner {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 100px;
  align-items: start;
  max-width: 1200px;
  position: relative; z-index: 1;
}
.s-book__left h2 {
  font-family:'Cinzel',serif;
  font-size:clamp(26px,3.2vw,44px); font-weight:700;
  letter-spacing:.06em; color: var(--cream);
  line-height:1.15; margin-bottom:28px;
}
.s-book__left p {
  font-size:15px; line-height:1.85; color: var(--muted);
  margin-bottom:16px;
}
.s-book__contact {
  margin-top:40px; padding-top:32px;
  border-top: 1px solid var(--border);
}
.s-book__contact-item {
  font-size:13px; line-height:2; color: var(--muted);
}
.s-book__contact-item a {
  color: var(--gold); text-decoration:none;
  transition: color .3s ease;
}
.s-book__contact-item a:hover { color: var(--gold-hi); }

/* The form */
.appt-form { display:flex; flex-direction:column; gap:28px; }
.form-row { display:grid; grid-template-columns:1fr 1fr; gap:24px; }
.fg { display:flex; flex-direction:column; gap:8px; }
.fg label {
  font-size:9px; font-weight:600; letter-spacing:.24em; text-transform:uppercase;
  color: var(--gray);
}
.fg input,
.fg select,
.fg textarea {
  background:transparent;
  border:none; border-bottom:1px solid rgba(197,160,89,.2);
  padding:12px 0;
  font-family:'Montserrat',sans-serif;
  font-size:14px; font-weight:300;
  color: var(--cream);
  outline:none;
  transition:border-color .3s ease;
  -webkit-appearance:none; appearance:none;
}
.fg select { background:var(--bg); cursor:none; }
.fg select option { background:var(--bg-card); }
.fg input:focus,
.fg select:focus,
.fg textarea:focus { border-bottom-color: var(--gold); }
.fg input::placeholder,
.fg textarea::placeholder { color: var(--gray); }
.fg textarea { resize:none; height:90px; }
.form-submit {
  align-self:flex-start;
  padding:15px 52px;
  border:1px solid var(--gold);
  font-family:'Montserrat',sans-serif;
  font-size:10px; font-weight:600;
  letter-spacing:.22em; text-transform:uppercase;
  color: var(--gold);
  background:transparent;
  cursor:none; position:relative; overflow:hidden;
  transition:color .5s ease;
}
.form-submit::before {
  content:''; position:absolute; top:0; left:-101%; width:101%; height:100%;
  background: var(--gold);
  transition:left .5s var(--ease); z-index:-1;
}
.form-submit:hover { color: var(--bg); }
.form-submit:hover::before { left:0; }
.form-note {
  font-family:'Cormorant Garamond',serif;
  font-style:italic; font-size:14px;
  color: var(--gray); margin-top:12px;
  display:block;
}
.form-success {
  display:none;
  font-family:'Cormorant Garamond',serif;
  font-style:italic; font-size:20px;
  color: var(--gold-hi); margin-top:16px;
}

/* ================================================================
   FOOTER
   ================================================================ */
footer {
  background: var(--bg-surface);
  padding:64px 68px 32px;
  border-top:1px solid var(--gold);
}
.footer-grid {
  display:grid;
  grid-template-columns:1.6fr 1fr 1fr;
  gap:80px; margin-bottom:52px;
}
.footer-logo {
  height:52px; width:auto; margin-bottom:18px;
  filter: sepia(1) saturate(2) hue-rotate(5deg) brightness(2.1);
}
.footer-tagline {
  font-family:'Cormorant Garamond',serif;
  font-style:italic; font-size:14px;
  color: var(--gray); margin-bottom:24px;
}
.footer-about {
  font-size:13px; line-height:1.9; color: var(--gray);
}
.footer-col h4 {
  font-size:9px; font-weight:600; letter-spacing:.28em; text-transform:uppercase;
  color: var(--gray); margin-bottom:24px;
}
.footer-col ul { list-style:none; }
.footer-col li { margin-bottom:12px; }
.footer-col a {
  font-size:13px; color: var(--muted);
  text-decoration:none; transition:color .3s ease;
}
.footer-col a:hover { color: var(--gold-hi); }
.footer-ig {
  display:inline-flex; align-items:center; gap:8px;
  margin-top:20px; font-size:13px;
  color: var(--muted); text-decoration:none;
  transition:color .3s ease;
}
.footer-ig:hover { color: var(--gold-hi); }

.footer-bottom {
  display:flex; align-items:center; justify-content:space-between;
  padding-top:28px;
  border-top:1px solid var(--border);
}
.footer-legal {
  font-size:10px; letter-spacing:.04em; color: var(--gray);
}

/* ================================================================
   SCOPE INNER PAGES
   ================================================================ */
/* Page hero (inner pages) */
.page-hero {
  position:relative; height:75vh;
  display:flex; align-items:flex-end;
  padding:0 84px 80px;
  overflow:hidden;
}
.page-hero__bg {
  position:absolute; inset:0;
  background: var(--bg-card);
  background-size:cover; background-position:center;
  filter:brightness(.38);
  animation:kenBurns 24s ease-in-out infinite;
}
.page-hero__bg::after {
  content:''; position:absolute; inset:0;
  background:linear-gradient(to top, rgba(5,3,1,.94) 0%, transparent 55%);
}
.page-hero__content { position:relative; z-index:1; }
.page-hero__title {
  font-family:'Cinzel',serif;
  font-size:clamp(36px,5.5vw,72px);
  font-weight:700; letter-spacing:.07em;
  color: var(--cream); line-height:1.05;
}

/* commission section — furniture page */
.s-commission          { padding:90px 68px; background:var(--bg-surface); }
.commission-grid       { display:grid; grid-template-columns:1fr 1fr; gap:64px; margin-top:48px; align-items:start; }
.commission-spec       { display:flex; flex-direction:column; gap:24px; }
.commission-spec__item { padding:28px 32px; background:var(--bg-card); border-top:2px solid var(--gold); }
.commission-spec__label{ font-size:10px; font-weight:600; letter-spacing:.2em; text-transform:uppercase; color:var(--gold-dim); margin-bottom:8px; }
.commission-spec__val  { font-size:14px; color:var(--cream); }

/* deliverables grid — used in all scope pages */
.s-deliverables { padding:90px 68px; background:var(--bg-surface); }
.deliverables-grid {
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:48px 40px;
  margin-top:48px;
}
.deliverables-grid__title {
  font-family:'Cinzel',serif; font-size:12px; font-weight:700;
  letter-spacing:.16em; text-transform:uppercase;
  color:var(--gold); margin-bottom:12px;
}
.deliverables-grid__desc {
  font-size:13px; line-height:1.85; color:var(--gray);
}

/* project gallery — 1 wide on top, 2 side-by-side below */
.project-gallery {
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:2px;
  background: var(--bg);
}
.project-gallery__item {
  aspect-ratio:4/3;
  overflow:hidden;
  position:relative;
}
.project-gallery__item img {
  width:100%; height:100%;
  object-fit:cover; object-position:center center;
  filter:brightness(.75);
  transition:transform .6s var(--ease), filter .4s ease;
}
.project-gallery__item:hover img {
  transform:scale(1.04);
  filter:brightness(.58);
}
/* wide item spans both columns = full-width top image */
.project-gallery__item.wide {
  grid-column:span 2;
  aspect-ratio:16/7;
}

/* project about block */
.project-about {
  display:grid;
  grid-template-columns:1fr 1fr;
  min-height:60vh;
  background: var(--bg-surface);
}
.project-about__img {
  position:relative; overflow:hidden;
}
.project-about__img img {
  width:100%; height:100%;
  object-fit:cover; filter:brightness(.6);
  transition:transform .6s var(--ease);
}
.project-about__img:hover img { transform:scale(1.03); }
.project-about__body {
  padding:80px 68px;
  display:flex; flex-direction:column; justify-content:center;
  position:relative;
}
.project-about__body::before {
  content:''; position:absolute; left:0; top:64px; bottom:64px;
  width:1px; background: var(--gold);
}
.project-about__body h2 {
  font-family:'Cinzel',serif;
  font-size:clamp(22px,2.8vw,38px); font-weight:700;
  letter-spacing:.06em; color: var(--cream);
  line-height:1.2; margin-bottom:28px;
}
.project-about__body p {
  font-size:15px; line-height:1.9; color: var(--muted);
  margin-bottom:16px;
}

/* furniture grid (for furniture page) */
.furniture-grid {
  display:grid;
  grid-template-columns:repeat(2,1fr);
  gap:2px;
  background: var(--bg);
}
.furn-item {
  position:relative; overflow:hidden;
  aspect-ratio:4/3;
  background: var(--bg-card);
}
.furn-item img {
  width:100%; height:100%;
  object-fit:cover; object-position:center center;
  filter:brightness(.68);
  transition:transform .6s var(--ease), filter .4s ease;
}
/* chairs — centered by default, individual overrides via inline style */
.furn-item.chair img { object-position: center center; }
/* tables — show surface slightly lower */
.furn-item.table img { object-position: center 55%; }
/* sofa/daybed — center */
.furn-item.sofa img  { object-position: center 40%; }
.furn-item:hover img { transform:scale(1.04); filter:brightness(.5); }
.furn-item__label {
  position:absolute; bottom:0; left:0; right:0;
  padding:28px 36px;
  background:linear-gradient(to top, rgba(5,3,1,.9) 0%, transparent 100%);
}
.furn-item__label h3 {
  font-family:'Cinzel',serif;
  font-size:18px; font-weight:700;
  letter-spacing:.1em; color: var(--cream);
  margin-bottom:6px;
}
.furn-item__label p {
  font-size:12px; color: var(--muted);
}

/* tree illustration block */
.about-block__img.tree-bg {
  background: #0A0600;
  display: flex; align-items: center; justify-content: center;
}
.about-block__img.tree-bg img {
  object-fit: contain;
  object-position: center center;
  filter: brightness(.9) sepia(.1);
  padding: 32px;
  height: 100%;
  width: 100%;
}

/* ================================================================
   THE STANDARD — std-section (alternating image/text blocks)
   ================================================================ */
.std-section {
  display: grid;
  grid-template-columns: 52% 48%;
  min-height: 600px;
  background: var(--bg-surface);
}
.std-section.reverse .std-section__img { order: 2; }
.std-section.reverse .std-section__body { order: 1; }
.std-section__img {
  overflow: hidden;
  position: relative;
}
.std-section__img img {
  width: 100%; height: 100%;
  object-fit: cover; object-position: center;
  filter: brightness(.68);
  transition: transform .8s var(--ease), filter .5s ease;
}
.std-section:hover .std-section__img img { transform: scale(1.04); filter: brightness(.55); }
.std-section__body {
  padding: 80px 68px;
  display: flex; flex-direction: column; justify-content: center;
}
.std-section__num {
  font-family: 'Cinzel', serif;
  font-size: 9px; font-weight: 700;
  letter-spacing: .3em;
  color: var(--gold);
  margin-bottom: 20px;
  display: flex; align-items: center; gap: 12px;
}
.std-section__num::after {
  content: '';
  flex: 1; max-width: 36px; height: 1px;
  background: var(--gold); opacity: .5;
}
.std-section__body h2 {
  font-family: 'Cinzel', serif;
  font-size: clamp(22px, 2.8vw, 38px);
  font-weight: 700; letter-spacing: .06em;
  color: var(--cream); margin-bottom: 24px; line-height: 1.15;
}
.std-section__body p {
  font-size: 15px; line-height: 1.9;
  color: var(--muted); margin-bottom: 16px;
}
.std-section__body em {
  display: block;
  font-family: 'Cormorant Garamond', serif;
  font-size: 19px; font-style: italic;
  color: var(--gold); margin-top: 20px; line-height: 1.45;
}

.standard-intro {
  padding: 100px 15%;
  text-align: center;
  background: var(--bg-surface);
}
.standard-intro p {
  font-family: 'Cormorant Garamond', serif;
  font-size: clamp(19px, 2.4vw, 30px);
  font-style: italic; line-height: 1.7;
  color: var(--cream); max-width: 860px; margin: 0 auto;
}
.s-final {
  padding: 120px 68px; text-align: center;
  background: var(--bg);
}
.s-final p {
  font-family: 'Cinzel', serif;
  font-size: clamp(24px, 3.5vw, 50px);
  letter-spacing: .1em; color: var(--cream); line-height: 1.5;
}
.s-contact-strip {
  padding: 56px 68px;
  background: var(--bg-card);
  border-top: 1px solid var(--border);
  display: flex; align-items: center;
  justify-content: space-between; gap: 40px; flex-wrap: wrap;
}
.strip-logo {
  font-family: 'Cinzel', serif;
  font-size: 20px; letter-spacing: .2em; color: var(--cream);
}
.strip-logo small {
  display: block;
  font-family: 'Montserrat', sans-serif;
  font-size: 9px; letter-spacing: .16em; font-weight: 600;
  color: var(--gold); margin-top: 8px;
}
.strip-info { font-size: 13px; line-height: 2; color: var(--muted); }

/* ================================================================
   MAP SECTION
   ================================================================ */
.s-map {
  display: grid;
  grid-template-columns: 1fr 1fr;
  background: var(--bg-card);
  border-top: 1px solid rgba(197,160,89,.15);
}
.s-map__embed {
  overflow: hidden;
  height: 500px;
  position: relative;
}
.s-map__embed iframe {
  position: absolute; inset: 0;
  width: 100%; height: 100%;
  border: 0;
  filter: grayscale(.5) brightness(.8) sepia(.1);
  display: block;
}
.s-map__info {
  padding: 80px 68px;
  display: flex; flex-direction: column; justify-content: center;
  position: relative;
}
.s-map__info::before {
  content: '';
  position: absolute; left: 0; top: 64px; bottom: 64px;
  width: 1px; background: var(--gold);
}
.s-map__info h2 {
  font-family: 'Cinzel', serif;
  font-size: clamp(22px, 2.8vw, 36px);
  font-weight: 700; letter-spacing: .06em;
  color: var(--cream); margin-bottom: 24px; line-height: 1.2;
}
.s-map__info p {
  font-size: 14px; line-height: 2;
  color: var(--muted); margin-bottom: 20px;
}
.s-map__hours {
  margin-top: 28px; padding-top: 24px;
  border-top: 1px solid var(--border);
}
.s-map__hours .eyebrow { margin-bottom: 10px; }
.s-map__hours p { margin-bottom: 0; }

/* ================================================================
   LEGAL PAGES (terms / privacy)
   ================================================================ */
.s-legal {
  padding: 100px 68px;
  max-width: 900px;
  margin: 0 auto;
}
.s-legal h2 {
  font-family: 'Cinzel', serif;
  font-size: clamp(18px, 2vw, 26px);
  font-weight: 700; letter-spacing: .06em;
  color: var(--cream); margin: 48px 0 16px;
  padding-top: 32px;
  border-top: 1px solid rgba(197,160,89,.15);
}
.s-legal h2:first-child { margin-top: 0; padding-top: 0; border-top: none; }
.s-legal h3 {
  font-family: 'Montserrat', sans-serif;
  font-size: 11px; font-weight: 600;
  letter-spacing: .16em; text-transform: uppercase;
  color: var(--gold); margin: 28px 0 10px;
}
.s-legal p {
  font-size: 15px; line-height: 1.9;
  color: var(--muted); margin-bottom: 16px;
}
.s-legal ul {
  list-style: none; padding: 0; margin-bottom: 16px;
}
.s-legal ul li {
  font-size: 15px; line-height: 1.85;
  color: var(--muted); padding-left: 20px; position: relative;
  margin-bottom: 8px;
}
.s-legal ul li::before {
  content: '—';
  position: absolute; left: 0;
  color: var(--gold); font-size: 12px;
}
.s-legal .last-updated {
  font-size: 11px; letter-spacing: .1em; text-transform: uppercase;
  color: var(--gold); margin-bottom: 48px;
  padding-bottom: 32px; border-bottom: 1px solid rgba(197,160,89,.2);
}
.s-legal a { color: var(--gold); text-decoration: none; }
.s-legal a:hover { color: var(--gold-hi); }
.s-legal .legal-entity {
  background: rgba(197,160,89,.05);
  border: 1px solid rgba(197,160,89,.15);
  border-left: 2px solid var(--gold);
  padding: 24px 28px; margin-bottom: 32px;
}
.s-legal .legal-entity p { margin-bottom: 4px; font-size: 13px; }
.s-legal .legal-entity strong { color: var(--cream); }

/* ================================================================
   S-BOOK — premium background
   ================================================================ */

/* back link on scope inner pages */
.back-link {
  display: inline-flex; align-items: center; gap: 10px;
  font-size: 9px; font-weight: 600;
  letter-spacing: .2em; text-transform: uppercase;
  color: var(--cream);
  text-decoration: none;
  margin-bottom: 28px;
  padding: 10px 22px 10px 18px;
  border: 1px solid rgba(197,160,89,.55);
  background: rgba(5,3,1,.5);
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
  transition: all .35s var(--ease);
}
.back-link:hover {
  color: var(--gold-hi);
  border-color: var(--gold);
  background: rgba(5,3,1,.7);
}
.back-link::before {
  content: '←';
  font-size: 14px;
  color: var(--gold);
}

/* ================================================================
   ABOUT PAGE
   ================================================================ */
.about-block {
  display:grid;
  grid-template-columns:1fr 1fr;
  min-height:80vh;
}
.about-block.rev { direction:rtl; }
.about-block.rev > * { direction:ltr; }
.about-block__img {
  position:relative; overflow:hidden;
}
.about-block__img img {
  width:100%; height:100%;
  object-fit:cover; filter:brightness(.6);
  transition:transform .6s var(--ease);
}
.about-block__img:hover img { transform:scale(1.03); }
.about-block__body {
  background: var(--bg-surface);
  padding:96px 80px;
  display:flex; flex-direction:column; justify-content:center;
  position:relative;
}
.about-block__body::before {
  content:''; position:absolute; left:0; top:70px; bottom:70px;
  width:1px; background: var(--gold);
}
.about-block.rev .about-block__body::before { left:auto; right:0; }
.about-block__body h2 {
  font-family:'Cinzel',serif;
  font-size:clamp(22px,2.8vw,38px); font-weight:700;
  letter-spacing:.05em; color: var(--cream);
  line-height:1.2; margin-bottom:28px;
}
.about-block__body p {
  font-size:15px; line-height:1.9; color: var(--muted);
  margin-bottom:18px;
}
.pull-quote {
  font-family:'Cormorant Garamond',serif;
  font-size:clamp(20px,2.4vw,28px);
  font-weight:300; font-style:italic;
  color: var(--gold-hi); line-height:1.5;
  padding:24px 0; border-top:1px solid var(--border);
  margin-top:12px;
}

/* ================================================================
   RESPONSIVE
   ================================================================ */
@media(max-width:1100px){
  .scope-grid         { grid-template-columns:repeat(2,1fr); }
  /* mat-card: side-by-side image + text on mobile — no movement */
  .materials-grid     { grid-template-columns:1fr; }
  .mat-card           { aspect-ratio:unset; min-height:180px; display:flex; align-items:stretch; }
  .mat-card__bg       { position:relative; inset:unset; flex:0 0 44%; filter:brightness(.55);
                        transition:none; background-size:cover; background-position:center center; }
  .mat-card[data-mat="finish"] .mat-card__bg { background-size:cover; background-position:center center; }
  .mat-card__body     { flex:1; position:relative; background:var(--bg-card);
                        padding:28px 22px; background:linear-gradient(90deg,rgba(5,3,1,.97) 0%,rgba(5,3,1,.88) 100%); }
  .mat-card:hover .mat-card__bg { transform:none; }
  /* also kill scope-card and std-section image movement on mobile */
  .scope-card__img    { transition:none; }
  .std-section__img img { transition:none; }
  .page-hero__bg      { animation:none; transition:none; }
  .process-grid       { grid-template-columns:repeat(4,1fr); }
  .s-book__inner      { grid-template-columns:1fr; gap:56px; }
  .s-map              { grid-template-columns:1fr; }
  .s-map__embed       { height:300px; }
  .std-section        { grid-template-columns:1fr 1fr; min-height:0; }
}

@media(max-width:900px){
  #nav { padding:20px 28px; }
  #nav.pinned { padding:14px 28px; }
  .nav-links { display:none; }
  .nav-burger { display:flex; }

  .s-scope__head,
  .s-process,
  .s-materials__head,
  .s-book,
  .s-map__info,
  footer { padding-left:28px; padding-right:28px; }

  .scope-grid         { grid-template-columns:1fr 1fr; }
  .scope-card         { aspect-ratio:1/1; }
  /* Process: 4 per row on mobile — hide desc for clean grid */
  .process-grid         { grid-template-columns:repeat(4,1fr); gap:1px; }
  .process-step         { padding:26px 12px 22px; }
  .process-step__num    { width:32px; height:32px; font-size:9px; margin-bottom:12px; }
  .process-step__title  { font-size:9.5px; letter-spacing:.08em; }
  .process-step__desc   { display:none; } /* hide long text on mobile — title tells the story */
  .process-step::after  { font-size:56px; bottom:-10px; }
  .project-gallery    { grid-template-columns:1fr; }
  .project-gallery__item.wide { grid-column:span 1; aspect-ratio:4/3; }
  /* deliverables grid: single column on mobile */
  .s-deliverables     { padding:60px 24px !important; }
  .deliverables-grid  { grid-template-columns:1fr !important; gap:32px !important; }
  /* commission grid: single column on mobile */
  .s-commission       { padding:60px 24px !important; }
  .commission-grid    { grid-template-columns:1fr !important; gap:40px !important; }
  .project-about,
  .about-block        { grid-template-columns:1fr; }
  .about-block.rev    { direction:ltr; }
  .project-about__img,
  .about-block__img   { height:48vh; }
  .project-about__body,
  .about-block__body  { padding:56px 28px; }
  .project-about__body::before,
  .about-block__body::before { display:none; }
  .furniture-grid     { grid-template-columns:1fr; }
  .page-hero          { padding:0 28px 56px; height:55vh; }
  .page-hero__bg      { animation:none; } /* no ken-burns on mobile */
  .footer-grid        { grid-template-columns:1fr; gap:44px; }
  .footer-bottom      { flex-direction:column; gap:10px; text-align:center; }
  .form-row           { grid-template-columns:1fr; }
  .wa-btn             { bottom:20px; right:20px; }
  /* std-section: keep side-by-side on mobile */
  .std-section        { grid-template-columns:1fr 1fr; min-height:0; }
  .std-section.reverse .std-section__img { order:0; }
  .std-section.reverse .std-section__body { order:0; }
  .std-section__img   { min-height:260px; }
  .std-section__body  { padding:40px 22px; }
  .std-section__body p{ font-size:13px; }
  .std-section__body em{ font-size:16px; }
  .standard-intro     { padding:64px 28px; }
  .s-final            { padding:80px 28px; }
  .s-contact-strip    { flex-direction:column; text-align:center; padding:48px 28px; }
  .s-map__info::before{ display:none; }
  .s-map__info        { padding:56px 28px; }
  .s-legal            { padding:64px 28px; }
  .s-book::after      { left:28px; right:28px; }
}

@media(max-width:600px){
  /* Hero CTAs: stack & center both buttons */
  .hero__cta          { flex-direction:column; align-items:center; width:100%; gap:12px; }
  .hero__cta .btn     { width:min(280px,80vw); padding:14px 20px; white-space:nowrap; text-align:center; display:block; }
  /* std-section compact on small phones */
  .std-section__img   { min-height:180px; }
  .std-section__body  { padding:24px 12px; }
  .std-section__body h2 { font-size:15px; margin-bottom:10px; }
  .std-section__body p{ font-size:11px; line-height:1.65; }
  .std-section__body em{ font-size:13px; margin-top:12px; }
  .std-section__num   { font-size:8px; margin-bottom:10px; }
  /* s-map stacked */
  .s-map              { grid-template-columns:1fr; }
}

@media(max-width:540px){
  .scope-grid { grid-template-columns:1fr; }
  .scope-card { aspect-ratio:3/2; }
  .s-process  { padding:60px 16px; }
  .process-grid { grid-template-columns:repeat(4,1fr); }
  .process-step { padding:20px 8px 16px; }
  .process-step__title { font-size:8.5px; }
  .process-step__num { width:28px; height:28px; font-size:8px; }
}