/* ==========================================================================
   JN SIGNATURE EVENTS — "The Atelier Reveal"
   A cinematic, editorial luxury build. Black / charcoal / gold / warm white.
   ========================================================================== */

:root{
  /* ---- palette (strictly: black, charcoal, gold, warm white) ---- */
  --black:        #060606;
  --charcoal:     #141311;
  --charcoal-2:   #1c1a17;
  --charcoal-3:   #262320;
  --gold:         #c6a355;
  --gold-light:   #ecdcae;
  --gold-deep:    #816126;
  --warm-white:   #f7f3ea;
  --warm-white-60: #fff;
  --warm-white-35: #fff;
  --warm-white-14: #fff;
  --warm-white-08: rgba(247,243,234,.08);
  --ink:          #000000;
  --ink-60:       rgba(0,0,0,.86);
  --ink-35:       rgba(0,0,0,.64);
  --ink-14:       rgba(198,163,85,.3);

  /* ---- type ---- */
  --f-display: 'Fraunces', serif;
  --f-body:    'Inter Tight', sans-serif;
  --f-mono:    'Space Mono', monospace;

  /* ---- motion ---- */
  --ease-out:   cubic-bezier(.16,1,.3,1);
  --ease-soft:  cubic-bezier(.22,1,.36,1);
  --ease-in-out:cubic-bezier(.65,0,.35,1);

  /* ---- layout ---- */
  --edge: clamp(24px, 5vw, 72px);
  --radius: 2px;

  --angle: 0deg;
}
@property --angle{
  syntax: '<angle>';
  inherits: false;
  initial-value: 0deg;
}

p {font-size:18px !important; font-weight:500;}

*,*::before,*::after{ margin:0; padding:0; box-sizing:border-box; }
html{ scroll-behavior:auto; background:var(--warm-white); font-size:18px; }
html.has-smooth{ overflow:hidden; height:100%; }
body{
  background:var(--warm-white);
  color:var(--ink-60);
  font-family:var(--f-body);
  font-weight:500;
  line-height:1.65;
  overflow-x:hidden;
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
}
#smooth-wrap{ position:relative; }
#smooth-content{ will-change:transform; }

img{ max-width:100%; display:block; }
a{ color:inherit; text-decoration:none; }
ul{ list-style:none; }
button{ font-family:inherit; background:none; border:none; cursor:pointer; color:inherit; }
svg{ display:block; }

::selection{ background:var(--gold); color:var(--black); }

.sr-only{
  position:absolute; width:1px; height:1px; padding:0; margin:-1px;
  overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0;
}
.skip-link{
  position:fixed; top:-60px; left:16px; z-index:9999;
  background:var(--gold); color:var(--black); padding:12px 20px;
  font-family:var(--f-mono); font-size:12px; letter-spacing:.05em;
  transition:top .3s var(--ease-out);
}
.skip-link:focus{ top:16px; }

@media (prefers-reduced-motion: reduce){
  *{ animation-duration:.01ms !important; animation-iteration-count:1 !important; transition-duration:.01ms !important; scroll-behavior:auto !important; }
}

/* ---- shared type utilities ---- */
.eyebrow{
  font-family:var(--f-mono);
  font-size:13px;
  letter-spacing:.24em;
  font-weight:600;
  text-transform:uppercase;
  color:#000;
  display:inline-flex;
  align-items:center;
  gap:12px;
}
.eyebrow::before{ content:''; width:22px; height:1px; background:var(--gold-deep); }

.index-num{
  font-family:var(--f-mono);
  font-size:12px;
  letter-spacing:.1em;
  color:var(--warm-white-35);
}

h1,h2,h3,h4{ font-family:var(--f-display); color:var(--warm-white); font-weight:700; line-height:1.08; letter-spacing:-.01em; }
h1{ font-weight:900; }
.italic{ font-style:italic; color:var(--gold-light); font-weight:400; }
.accent-gold{ color:var(--gold-deep); font-style:normal; }

.split-word{ display:inline-block; overflow:hidden; vertical-align:top; }
.split-word > span{
  display:inline-block;
  transform:translateY(110%);
  transition:transform .9s var(--ease-out);
  transition-delay:calc(var(--i, 0) * 60ms);
}
.split-ready .split-word > span{ transform:translateY(0); }

.reveal{ opacity:0; transform:translateY(46px); transition:opacity 1s var(--ease-out), transform 1s var(--ease-out); }
.reveal.in{ opacity:1; transform:translateY(0); }
.reveal-scale{ opacity:0; transform:scale(.92); transition:opacity 1.1s var(--ease-out), transform 1.1s var(--ease-out); }
.reveal-scale.in{ opacity:1; transform:scale(1); }
.reveal-blur{ opacity:0; filter:blur(14px); transform:translateY(24px); transition:opacity 1s var(--ease-out), filter 1s var(--ease-out), transform 1s var(--ease-out); }
.reveal-blur.in{ opacity:1; filter:blur(0); transform:translateY(0); }
.stagger > *{ opacity:0; transform:translateY(28px); transition:opacity .8s var(--ease-out), transform .8s var(--ease-out); }
.stagger.in > *{ opacity:1; transform:translateY(0); }
.stagger.in > *:nth-child(1){ transition-delay:.03s; } .stagger.in > *:nth-child(2){ transition-delay:.12s; }
.stagger.in > *:nth-child(3){ transition-delay:.21s; } .stagger.in > *:nth-child(4){ transition-delay:.3s; }
.stagger.in > *:nth-child(5){ transition-delay:.39s; } .stagger.in > *:nth-child(6){ transition-delay:.48s; }
.stagger.in > *:nth-child(7){ transition-delay:.57s; } .stagger.in > *:nth-child(8){ transition-delay:.66s; }
.stagger.in > *:nth-child(9){ transition-delay:.75s; } .stagger.in > *:nth-child(10){ transition-delay:.84s; }

/* ==========================================================================
   PROGRESS BAR
   ========================================================================== */
.scroll-progress{
  position:fixed; top:0; left:0; height:2px; width:0%; z-index:9997;
  background:linear-gradient(90deg,var(--gold-deep),var(--gold-light));
  transition:width .1s linear;
}

/* ==========================================================================
   SIGNATURE SEAL — sticky glowing brand tab
   ========================================================================== */
.signature-tab{
  position:fixed; left:50%; bottom:24px; transform:translateX(-50%); z-index:150;
  display:flex; align-items:center; gap:16px;
  padding:18px 40px; background:#000; backdrop-filter:blur(16px) saturate(150%);
  border:1px solid var(--gold-deep); border-radius:999px;
  box-shadow:0 14px 40px -14px rgba(0,0,0,.75), 0 0 0 0 rgba(198,163,85,.4);
  animation:sealGlow 2.8s ease-in-out infinite;
  transition:padding .4s var(--ease-out), background .4s var(--ease-out), border-color .4s var(--ease-out), transform .4s var(--ease-out);
}
.signature-tab:hover{
  padding:18px 48px; background:rgba(28,26,23,.82); border-color:var(--gold-light);
  transform:translateX(-50%) translateY(-3px);
}
.signature-tab-logo{
  width:34px; height:34px; border-radius:50%; flex-shrink:0; object-fit:cover;
  border:1px solid var(--gold-deep); background:var(--black);
  transition:border-color .4s var(--ease-out), transform .4s var(--ease-out);
}
.signature-tab:hover .signature-tab-logo{ border-color:var(--gold-light); transform:scale(1.06); }
.signature-tab-dot{
  width:9px; height:9px; border-radius:50%; background:var(--gold-light); flex-shrink:0;
  animation:sealPulse 2.6s ease-in-out infinite;
}
@keyframes sealPulse{
  0%,100%{ box-shadow:0 0 6px 2px rgba(198,163,85,.5); }
  50%{ box-shadow:0 0 18px 7px rgba(198,163,85,.9); }
}
@keyframes sealGlow{
  0%,100%{ box-shadow:0 14px 40px -14px rgba(0,0,0,.75), 0 0 18px 0 rgba(198,163,85,.18); }
  50%{ box-shadow:0 14px 40px -14px rgba(0,0,0,.75), 0 0 40px 6px rgba(198,163,85,.5); }
}
.signature-tab-text{
  font-family:var(--f-display); font-weight:600; font-size:clamp(20px,3.2vw,32px);
  letter-spacing:.02em; white-space:nowrap;
  background-image:linear-gradient(100deg, var(--gold-deep) 0%, var(--gold-light) 30%, var(--warm-white) 45%, var(--gold-light) 60%, var(--gold-deep) 100%);
  background-size:220% 100%; -webkit-background-clip:text; background-clip:text; -webkit-text-fill-color:transparent; color:transparent;
  animation:shimmer 6s linear infinite, textGlow 2.4s ease-in-out infinite;
}
@keyframes textGlow{
  0%,100%{ filter:drop-shadow(0 0 6px rgba(198,163,85,.45)) drop-shadow(0 0 2px rgba(255,255,255,.15)); }
  50%{ filter:drop-shadow(0 0 20px rgba(198,163,85,.85)) drop-shadow(0 0 6px rgba(255,255,255,.3)); }
}
@media (max-width:560px){
  .signature-tab{ padding:14px 24px; gap:12px; }
  .signature-tab:hover{ padding:14px 28px; }
  .signature-tab-text{ font-size:clamp(16px,5vw,22px); }
}
@media (prefers-reduced-motion:reduce){ .signature-tab-dot,.signature-tab,.signature-tab-text{ animation:none; } }

/* ==========================================================================
   HEADER / NAV
   ========================================================================== */
.site-header{
  position:fixed; inset:0 0 auto 0; z-index:200;
  display:flex; align-items:center; justify-content:space-between;
  padding:26px var(--edge);
  transition:padding .5s var(--ease-out), background .5s var(--ease-out), border-color .5s var(--ease-out);
  border-bottom:1px solid transparent;
}
.site-header.is-scrolled{
  padding:16px var(--edge);
  background:rgba(6,6,6,.72);
  backdrop-filter:blur(16px) saturate(140%);
  border-color:var(--warm-white-08);
}
.site-header.is-scrolled .header-nav-links a{ color: #000; }
.site-header.is-scrolled .header-nav-links a::after{ background:var(--gold-light); }
.site-header.is-scrolled .header-nav-links a:hover,
.site-header.is-scrolled .header-nav-links a.is-active{ color:#000; }
.site-header.is-scrolled .header-nav-cta{ border-color:var(--warm-white-14); }
.site-header.is-scrolled .menu-btn{ color:var(--warm-white); }
.site-header.is-scrolled .menu-btn .bars span{ background:var(--warm-white); }
.brand{ display:flex; align-items:center; gap:13px; z-index:2; }
.brand img{ height:75px; width:auto; transition:height .5s var(--ease-out); }
.site-header.is-scrolled .brand img{ height:30px; }
.brand-name{ font-family:var(--f-mono); font-size:11px; letter-spacing:.16em; color:var(--warm-white-60); line-height:1.4; }
.brand-name b{ display:block; color:var(--warm-white); font-size:12px; letter-spacing:.2em; }
@media (max-width:640px){ .brand-name{ display:none; } }

/* ---- desktop inline navigation (replaces .header-meta at >=1024px) ---- */
.header-nav{ display:none; }
.header-nav-links{
  display:flex; align-items:center; gap:clamp(20px,2.4vw,40px);
}
.header-nav-links a{
  position:relative; display:inline-block; padding:6px 1px;
      background: #ffffffb8; border-radius: 50px;
    padding: 10px 20px; 
  font-family:var(--f-mono); font-size:12px; font-weight:600; letter-spacing:.14em;
  text-transform:uppercase; color:#000;
  transition:color .4s var(--ease-out);
}
 
.header-nav-links a:hover::after,
.header-nav-links a.is-active::after{ transform:scaleX(1); transform-origin:left; }
.header-nav-links a:hover,
.header-nav-links a.is-active{ color:var(--gold-deep); }
.header-nav-cta{
  margin-left:8px; padding:11px 24px !important; border:1px solid var(--ink-14);
  border-radius:999px; transition:border-color .4s var(--ease-out), background .4s var(--ease-out), color .4s var(--ease-out);
}
.header-nav-cta::after{ display:none; }
.header-nav-cta:hover{ background:var(--gold-deep); color:var(--black) !important; border-color:var(--gold-deep); }

@media (min-width:1024px){
  .header-nav{ display:flex; }
  .menu-btn{ display:none; }
  .nav-overlay{ display:none; }
}

.menu-btn{
  display:flex; align-items:center; gap:12px; z-index:2;
  font-family:var(--f-mono); font-size:11px; letter-spacing:.2em; text-transform:uppercase; color:#000;
}
.menu-btn .bars{ display:flex; flex-direction:column; gap:5px; width:26px; }
.menu-btn .bars span{ height:1px; background:#000; transition:transform .4s var(--ease-out), opacity .3s; }
.menu-btn[aria-expanded="true"] .bars span:nth-child(1){ transform:translateY(6px) rotate(45deg); }
.menu-btn[aria-expanded="true"] .bars span:nth-child(2){ opacity:0; }
.menu-btn[aria-expanded="true"] .bars span:nth-child(3){ transform:translateY(-6px) rotate(-45deg); }

/* ---- full-screen nav overlay ---- */
.nav-overlay{
  position:fixed; inset:0; z-index:190; background:#000;
  clip-path:circle(0% at calc(100% - 52px) 46px);
  transition:clip-path .8s var(--ease-in-out);
  display:flex; flex-direction:column; justify-content:space-between;
  padding:120px var(--edge) 60px;
  pointer-events:none;
}
.nav-overlay.is-open{ clip-path:circle(150% at calc(100% - 52px) 46px); pointer-events:auto; }
.nav-overlay-grid{ display:grid; grid-template-columns:1.3fr .7fr; gap:60px; }
@media (max-width:860px){ .nav-overlay-grid{ grid-template-columns:1fr; gap:40px; } }
.nav-links{ display:flex; flex-direction:column; }
.nav-links li{ border-top:1px solid var(--warm-white-08); }
.nav-links li:last-child{ border-bottom:1px solid var(--warm-white-08); }
.nav-links a{
  display:flex; align-items:baseline; gap:20px; padding:18px 4px;
  font-family:var(--f-display); font-weight:700; font-size:clamp(30px,5.4vw,64px); color:var(--warm-white-60);
  transition:color .35s var(--ease-out), padding-left .35s var(--ease-out), gap .35s var(--ease-out);
}
.nav-links a .n{ font-family:var(--f-mono); font-size:13px; color:var(--gold); }
.nav-links a:hover{ color:var(--warm-white); padding-left:16px; gap:30px; }
.nav-overlay-side{ display:flex; flex-direction:column; justify-content:space-between; }
.nav-services{ display:flex; flex-direction:column; gap:10px; }
.nav-services span{ font-family:var(--f-body); font-weight:600; font-size:15px; color:var(--warm-white-35); }
.nav-contact{ margin-top:40px; }
.nav-contact a{ display:block; font-family:var(--f-mono); font-weight:700; font-size:14px; letter-spacing:.04em; color:var(--gold-light); margin-top:8px; }
.nav-overlay-foot{ display:flex; justify-content:space-between; font-family:var(--f-mono); font-size:11px; color:var(--warm-white-35); letter-spacing:.08em; text-transform:uppercase; }

/* ==========================================================================
   HERO
   ========================================================================== */
.hero{
  position:relative; height:100svh; min-height:560px; overflow:hidden;
  background:#f6efe1; isolation:isolate;
  --ink:#2b241c;
}
.hero-ghost{ display:none; }
.hero-base{
  position:absolute; inset:0; z-index:0;
  background:radial-gradient(ellipse at 50% 30%, #fffaf0 0%, #f3e9d4 65%, #ecdfc2 100%);
}
.hero-reveal{
  position:absolute; inset:0; z-index:2; overflow:hidden;
}
.hero-reveal img{
  position:absolute; inset:0; width:100%; height:100%; object-fit:cover;
  object-position:42% 40%;
  transform:scale(1.04); animation:heroZoom 32s ease-in-out infinite alternate;
  filter:brightness(1.12) contrast(.97) saturate(1.1);
}
@keyframes heroZoom{ from{ transform:scale(1.04); } to{ transform:scale(1.12); } }
.hero-reveal::after{
  content:''; position:absolute; inset:0;
  background:
    radial-gradient(ellipse 720px 560px at 46% 42%, rgba(255,204,120,.22), transparent 68%),
    linear-gradient(180deg, rgba(255,255,255,.12) 0%, rgba(255,255,255,0) 32%, rgba(0,0,0,0) 62%, rgba(0,0,0,.18) 100%);
}
.hero-noise{
  position:absolute; inset:0; z-index:3; opacity:.03; pointer-events:none; mix-blend-mode:overlay;
  background-image:radial-gradient(circle at 1px 1px, #fff 1px, transparent 0);
  background-size:3px 3px;
}
.hero-sweep{ display:none; }
.hero::before{
  content:''; position:absolute; inset:0; z-index:4; pointer-events:none;
  background:
    radial-gradient(circle 200px at 84% 20%, rgba(255,238,200,.5), transparent 70%),
    radial-gradient(circle 150px at 92% 64%, rgba(255,228,175,.4), transparent 70%),
    radial-gradient(circle 240px at 70% 88%, rgba(255,244,215,.35), transparent 70%);
  mix-blend-mode:screen; filter:blur(1px);
  animation:heroBokeh 24s ease-in-out infinite alternate;
}
@keyframes heroBokeh{ from{ transform:translate(0,0); } to{ transform:translate(-16px,12px); } }
.hero::after{
  content:''; position:absolute; z-index:4; pointer-events:none;
  width:1100px; height:1100px; left:-320px; bottom:-680px;
  border-radius:50%; border:1px solid rgba(198,163,85,.28);
  opacity:.55;
}
@media (prefers-reduced-motion:reduce){ .hero::before{ animation:none; } }
.particles{ position:absolute; inset:0; z-index:4; pointer-events:none; will-change:transform; }
.particle{
  position:absolute; border-radius:50%; background:var(--gold-light);
  opacity:0; animation:drift linear infinite;
}
.hero .particle{ background:var(--gold-deep); mix-blend-mode:multiply; }
@keyframes drift{
  0%{ opacity:0; transform:translateY(0) translateX(0); }
  10%{ opacity:.7; }
  90%{ opacity:.5; }
  100%{ opacity:0; transform:translateY(-120vh) translateX(var(--dx,20px)); }
}

.hero-content{
  position:relative; z-index:5; height:100%; max-width:680px;
  display:flex; flex-direction:column; justify-content:center;
  padding:130px var(--edge) 64px;
}
.hero-top{
  position:absolute; top:120px; left:var(--edge); right:var(--edge);
  display:flex; flex-direction:column; align-items:flex-start; gap:14px;
}
@media (max-width:640px){ .hero-top{ top:104px; gap:10px; } }

.hero-brand-mark{
  font-family:var(--f-display); font-weight:600; font-size:clamp(30px,4.4vw,50px);
  line-height:1; letter-spacing:.01em; color:var(--warm-white);
}
.hero-brand-mark em{
  font-style:italic; font-weight:500; margin-left:.14em;
  background-image:linear-gradient(100deg, var(--gold-deep) 0%, var(--gold-light) 30%, var(--warm-white) 45%, var(--gold-light) 60%, var(--gold-deep) 100%);
  background-size:220% 100%; -webkit-background-clip:text; background-clip:text; -webkit-text-fill-color:transparent; color:transparent;
  animation:shimmer 6s linear infinite;
  filter:drop-shadow(0 0 18px rgba(198,163,85,.35));
}
@media (prefers-reduced-motion:reduce){ .hero-brand-mark em{ animation:none; } }
.hero-headline{
  font-size:clamp(38px,8vw,68px); color:var(--ink); max-width:620px;
  margin-top:18px; perspective:600px;
  text-shadow:0 2px 22px rgba(255,255,255,.6);
}
.hero-headline .split-word{ margin-right:.22em; }
.hero-headline em{ font-style:italic; color:var(--gold-deep); }
.hero-headline .char-word{ display:inline-block; white-space:pre; margin-right:.22em; }
.hero-headline .char-word:nth-child(3),
.hero-headline .char-word:nth-child(4){ font-style:italic; color:var(--gold-deep); }
.hero-headline .char{ display:inline-block; }

.hero-bottom-row{
  display:flex; flex-direction:column; align-items:flex-start; gap:28px;
  margin-top:36px;
  animation:heroContentUp 1.1s var(--ease-out) .9s both;
}
@keyframes heroContentUp{ from{ opacity:0; transform:translateY(22px); } to{ opacity:1; transform:translateY(0); } }
@media (prefers-reduced-motion:reduce){ .hero-bottom-row{ animation:none; } }

.glass-card{
  position:relative; max-width:420px; padding:28px 30px;
  background:rgba(255,255,255,.10); backdrop-filter:blur(18px) saturate(140%);
  -webkit-backdrop-filter:blur(18px) saturate(140%);
  border:1px solid rgba(212,175,55,.35); border-radius:20px; overflow:hidden;
  box-shadow:0 24px 60px -30px rgba(120,90,40,.35);
}
.glass-card::before{
  content:''; position:absolute; inset:0; padding:1px; border-radius:20px;
  background:conic-gradient(from var(--angle), var(--gold-deep), var(--gold-light), transparent 40%, var(--gold-deep));
  -webkit-mask:linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
  -webkit-mask-composite:xor; mask-composite:exclude;
  animation:rotateStroke 6s linear infinite;
  pointer-events:none; opacity:.5;
}
@keyframes rotateStroke{ to{ --angle:360deg; } }
.glass-card p{ font-size:16px; font-weight:600; line-height:1.75; color:var(--ink); position:relative; }

.hero-actions{ display:flex; gap:16px; flex-wrap:wrap; }
.magnetic{ display:inline-block; }
.btn{
  position:relative; display:inline-flex; align-items:center; gap:10px;
  font-family:var(--f-mono); font-size:13px; font-weight:700; letter-spacing:.1em; text-transform:uppercase;
  padding:17px 30px; border-radius:1px; white-space:nowrap;
}
.btn-solid{ background:var(--gold); color:var(--black); overflow:hidden; }
.btn-solid span{ position:relative; z-index:1; }
.btn-solid::before{
  content:''; position:absolute; inset:0; background:var(--gold-light);
  transform:translateX(-101%); transition:transform .5s var(--ease-out);
}
.btn-solid:hover::before{ transform:translateX(0); }
.btn-outline{ border:1px solid var(--warm-white-35); color:var(--warm-white); transition:border-color .35s, background .35s; }
.btn-outline:hover{ border-color:var(--gold); background:rgba(198,163,85,.08); }
.btn-glass{
  background:rgba(247,243,234,.06); backdrop-filter:blur(14px) saturate(140%);
  border:1px solid var(--warm-white-14); color:var(--warm-white);
  transition:border-color .35s, background .35s, transform .3s;
}
.btn-glass:hover{ border-color:var(--gold); background:rgba(198,163,85,.14); }

.hero .btn{ border-radius:999px; transition:transform .35s var(--ease-out), box-shadow .35s var(--ease-out); }
.hero .btn:hover{ transform:translateY(-2px); }
.hero .btn-solid{
  background:linear-gradient(135deg, var(--gold-deep), var(--gold) 45%, var(--gold-light) 100%);
  color:#2a2115; box-shadow:0 14px 34px -14px rgba(198,163,85,.65);
}
.hero .btn-solid::before{ background:linear-gradient(135deg, var(--gold), var(--gold-light)); }
.hero .btn-solid:hover{ box-shadow:0 18px 44px -14px rgba(198,163,85,.8); }
.hero .btn-outline{
  background:rgba(255,255,255,.16); backdrop-filter:blur(10px) saturate(140%);
  -webkit-backdrop-filter:blur(10px) saturate(140%);
  border:1px solid var(--gold-deep); color:var(--ink);
  transition:border-color .35s, background .35s, color .35s, transform .35s var(--ease-out), box-shadow .35s var(--ease-out);
}
.hero .btn-outline:hover{ background:var(--gold); border-color:var(--gold); color:#fff; }

.scroll-cue{
  position:absolute; right:var(--edge); bottom:40px; z-index:5;
  display:flex; flex-direction:column; align-items:center; gap:14px;
}
.scroll-cue .track{ width:1px; height:64px; background:rgba(43,36,28,.2); position:relative; overflow:hidden; }
.scroll-cue .track::after{ content:''; position:absolute; left:0; top:-24px; width:100%; height:24px; background:linear-gradient(var(--gold-deep),var(--gold-light)); animation:cueMove 2.2s var(--ease-in-out) infinite; }
@keyframes cueMove{ 0%{ top:-24px; } 100%{ top:64px; } }
.scroll-cue span{ writing-mode:vertical-rl; font-family:var(--f-mono); font-size:10px; letter-spacing:.24em; color:var(--ink); opacity:.7; text-transform:uppercase; text-shadow:0 1px 12px rgba(255,255,255,.7); }
@media (max-width:760px){ .scroll-cue{ display:none; } }

@media (max-width:860px){
  .hero-content{ max-width:100%; justify-content:flex-end; padding:130px var(--edge) 56px; }
}
@media (max-width:640px){
  .hero-reveal img{ object-position:46% 34%; }
  .glass-card{ padding:22px 22px; }
}

/* ==========================================================================
   SHARED SECTION FRAME
   ========================================================================== */
main{ position:relative; background:var(--warm-white); z-index:1; }
section{ position:relative; padding:clamp(90px,12vw,68px) var(--edge); }
.section-tag{ display:flex; align-items:center; gap:16px; margin-bottom:28px; }
.section-head{ display:grid; grid-template-columns:1fr auto; gap:40px; align-items:end; margin-bottom:72px; }
@media (max-width:760px){ .section-head{ grid-template-columns:1fr; gap:20px; } }
.section-head h2{ font-size:clamp(32px,5vw,64px); max-width:14ch; }
.section-head .lede{ max-width:340px; font-size:17px; font-weight:500; line-height:1.8; color:var(--warm-white-35); }

.divider{ position:relative; height:1px; background:var(--warm-white-08); margin:0 var(--edge); }

/* ==========================================================================
   OUR STORY — asymmetric editorial storytelling
   ========================================================================== */
@keyframes shimmer{ to{ background-position:-220% 0; } }

#about{
  position:relative; overflow:hidden; isolation:isolate;
  background:var(--warm-white); --ink:#2b241c;
}
.story-atmosphere{ display:none; }
.story-atmosphere-overlay{ display:none; }
.story-noise{
  position:absolute; inset:0; z-index:0; opacity:.025; pointer-events:none; mix-blend-mode:multiply;
  background-image:radial-gradient(circle at 1px 1px, #000 1px, transparent 0); background-size:3px 3px;
}
.story-ghost{ display:none; }
.story-inner{ position:relative; z-index:1; }

/* Shared grain texture — same pattern as Our Story, reused on every section below it */
.section-noise{
  position:absolute; inset:0; z-index:-1; opacity:.025; pointer-events:none; mix-blend-mode:multiply;
  background-image:radial-gradient(circle at 1px 1px, #000 1px, transparent 0); background-size:3px 3px;
}
.cta-section .section-noise{ z-index:1; }

.story-intro{ max-width:720px; margin-bottom:70px; }
.story-intro h2{ font-size:clamp(36px,5.6vw,72px); margin-top:20px; color:var(--ink); }
.story-intro h2 .accent-gold{ color:var(--gold-deep); font-style:normal; }
.story-intro h2 .italic{ color:var(--ink); }

.story-composition{
  position:relative; display:grid; grid-template-columns:1.05fr .95fr; gap:8vw;
  align-items:start;
}
@media (max-width:980px){ .story-composition{ grid-template-columns:1fr; gap:90px; } }

.story-media-zone{ position:relative; padding-bottom:70px; }
.story-media-primary{
  position:relative; width:84%; aspect-ratio:4/5; overflow:hidden; border-radius:4px;
  box-shadow:0 0 0 1px rgba(198,163,85,.4), 0 40px 80px -34px rgba(120,90,40,.3);
}
.story-media-primary img{
  width:100%; height:100%; object-fit:cover; transform:scale(1.02);
  filter:brightness(1.05) saturate(1.05);
  transition:transform 1.4s var(--ease-out);
}
.story-composition:hover .story-media-primary img{ transform:scale(1.08); }
.story-badge{
  position:absolute; z-index:3; top:-28px; left:-28px; width:98px; height:98px; border-radius:50%;
  background:rgba(255,255,255,.7); backdrop-filter:blur(14px) saturate(140%);
  border:1px solid var(--gold-deep);
  display:flex; flex-direction:column; align-items:center; justify-content:center;
}
.story-badge span{ font-family:var(--f-mono); font-size:9.5px; letter-spacing:.14em; text-transform:uppercase; color:var(--ink-60); font-weight:700; }
.story-badge b{ font-family:var(--f-display); font-style:italic; font-size:22px; color:var(--gold-deep); font-weight:500; margin-top:2px; }
.story-media-secondary{
  position:absolute; z-index:2; right:0; bottom:0; width:46%; aspect-ratio:1/1; overflow:hidden;
  border-radius:4px; border:6px solid var(--warm-white);
  box-shadow:0 0 0 1px rgba(198,163,85,.4), 0 30px 60px -24px rgba(120,90,40,.32);
}
.story-media-secondary img{ width:100%; height:100%; object-fit:cover; filter:brightness(1.05) saturate(1.08); }
@media (max-width:980px){
  .story-media-zone{ padding-bottom:0; }
  .story-media-primary{ width:100%; }
  .story-media-secondary{ position:relative; width:60%; margin:-60px 0 0 auto; }
  .story-badge{ top:-20px; left:20px; }
}
@media (max-width:560px){ .story-media-secondary{ width:70%; } }

.story-content-zone{ padding-top:56px; }
@media (max-width:980px){ .story-content-zone{ padding-top:0; } }
.story-quote{
  position:relative; font-family:var(--f-display); font-style:italic; color:var(--ink); font-weight:600;
  font-size:clamp(22px,2.3vw,30px); line-height:1.5; padding-left:38px; margin:0 0 52px; max-width:32ch;
}
.story-quote::before{
  content:'“'; position:absolute; left:-8px; top:-34px; font-size:96px; color:var(--gold-deep); opacity:.7;
  font-family:var(--f-display); font-style:normal;
}
.story-blocks{ display:grid; grid-template-columns:1fr 1fr; gap:36px 30px; }
@media (max-width:640px){ .story-blocks{ grid-template-columns:1fr; gap:30px; } }
.story-block{ border-top:1px solid rgba(198,163,85,.35); padding-top:18px; }
.story-block-num{ font-family:var(--f-mono); font-size:11px; letter-spacing:.08em; color:var(--gold-deep); }
.story-block h4{ font-family:var(--f-display); font-size:20px; font-weight:700; margin:10px 0 8px; color:var(--ink); }
.story-block p{ font-size:15px; line-height:1.7; color:var(--ink-60); }

.story-timeline{
  position:relative; z-index:1; margin-top:110px; display:flex; border-top:1px solid rgba(198,163,85,.35);
}
@media (max-width:760px){ .story-timeline{ flex-direction:column; margin-top:80px; } }
.story-time-point{ flex:1; padding:30px 30px 0 0;  position:relative; }
.story-time-point::before{ content:''; position:absolute; top:-1px; left:0; width:44px; height:2px; background:var(--gold-deep); }
.story-time-point:last-child{ border-right:none; }
@media (max-width:760px){
  .story-time-point{ border-right:none; border-bottom:1px solid rgba(198,163,85,.35); padding:26px 0 24px; }
  .story-time-point:last-child{ border-bottom:none; }
}
.story-time-year{
  display:block; font-family:var(--f-display); font-style:italic; font-size:34px; font-weight:500; margin-bottom:12px;
  background-image:linear-gradient(100deg, var(--gold-deep) 0%, var(--gold) 35%, var(--gold-light) 50%, var(--gold) 65%, var(--gold-deep) 100%);
  background-size:220% 100%; -webkit-background-clip:text; background-clip:text; -webkit-text-fill-color:transparent; color:transparent;
  animation:shimmer 6s linear infinite;
}
@media (prefers-reduced-motion:reduce){ .story-time-year{ animation:none; } }
.story-time-point p{ font-size:15px; line-height:1.7; color:var(--ink-60); max-width:26ch; }

/* ==========================================================================
   WHY CHOOSE US — cinematic floating bento
   ========================================================================== */
#why{
  position:relative; overflow:hidden; isolation:isolate;
  background:
    radial-gradient(ellipse 60% 50% at 12% 0%, rgba(198,163,85,.09), transparent 60%),
    radial-gradient(ellipse 50% 40% at 92% 100%, rgba(43,36,28,.045), transparent 60%),
    var(--warm-white);
  --ink:#2b241c; --luxury-ease:cubic-bezier(.22,.61,.36,1);
}
#why::before{
  content:''; position:absolute; inset:0; z-index:0; pointer-events:none;
  background:
    radial-gradient(circle 280px at 88% 6%, rgba(198,163,85,.12), transparent 70%),
    radial-gradient(circle 240px at 5% 94%, rgba(198,163,85,.09), transparent 70%);
  filter:blur(8px);
}
.why-atmosphere{ display:none; }
.why-overlay{ display:none; }
.why-rays{ display:none; }
.why-glow{ display:none; }
.why-noise{
  position:absolute; inset:0; z-index:0; opacity:.02; pointer-events:none; mix-blend-mode:multiply;
  background-image:radial-gradient(circle at 1px 1px, #000 1px, transparent 0); background-size:3px 3px;
}
.why-particles{ position:absolute; inset:0; z-index:0; pointer-events:none; }
.why-particles .particle{ background:var(--gold-deep); mix-blend-mode:multiply; opacity:.6; }
.why-ghost{ display:none; }
.why-inner{ position:relative; z-index:1; }
#why .lede{ color:var(--ink-60); }
#why h2{ color:var(--ink); }
#why h2 .italic{ color:var(--ink); }
#why-h{ font-size:clamp(40px,6.4vw,80px); letter-spacing:-.015em; margin-top:26px; }
#why .section-head{ gap:56px; margin-bottom:88px; }
@media (max-width:760px){ #why .section-head{ margin-bottom:56px; } }

.gold-underline{
  display:block; width:64px; height:2px; margin-top:26px;
  background:linear-gradient(90deg, var(--gold), transparent);
  transform-origin:left center; transform:scaleX(0); transition:transform .9s var(--ease-out) .2s;
}
.section-head h2.in .gold-underline{ transform:scaleX(1); }

.bento{
  display:grid; grid-template-columns:repeat(3, 1fr); gap:28px; align-items:stretch;
}
.bento-card{
  position:relative; isolation:isolate; border-radius:24px;
  background:rgba(255,255,255,.92);
  backdrop-filter:blur(20px) saturate(160%); -webkit-backdrop-filter:blur(20px) saturate(160%);
  border:1px solid rgba(198,163,85,.38);
  padding:34px; overflow:hidden;
  display:flex; flex-direction:column; justify-content:space-between;
  aspect-ratio:4/5;
  box-shadow:0 26px 60px -36px rgba(120,90,40,.3);
  transition:box-shadow .45s var(--luxury-ease), border-color .45s var(--luxury-ease), transform .45s var(--luxury-ease);
  will-change:transform;
}
.bento-card:hover{
  border-color:var(--gold);
  box-shadow:0 34px 70px -28px rgba(120,90,40,.34), 0 0 40px -12px rgba(198,163,85,.35);
  transform:translateY(-7px);
}
.bento-bg{
  position:absolute; inset:0; width:100%; height:100%; object-fit:cover; z-index:0;
  opacity:1; filter:saturate(1.16) brightness(1.07) contrast(1.05);
  transform:scale(1);
  transition:transform .6s var(--luxury-ease);
}
.bento-card:hover .bento-bg{ transform:scale(1.05); }
@media (prefers-reduced-motion:reduce){ .bento-bg{ transition:opacity .3s; } }
@media (max-width:980px){
  .bento{ grid-template-columns:repeat(2, 1fr); }
  .bento-card{ padding:26px; }
  .bento-card h3{ font-size:19px; overflow-wrap:break-word; }
}
@media (max-width:560px){
  .bento{ grid-template-columns:1fr; }
  .bento-card{ aspect-ratio:auto; min-height:260px; padding:24px; }
}
.bento-card::before{
  content:''; position:absolute; inset:0; z-index:1; opacity:0;
  background:radial-gradient(circle at var(--mx,30%) var(--my,20%), rgba(198,163,85,.16), transparent 55%);
  transition:opacity .5s var(--ease-out);
}
.bento-card:hover::before{ opacity:1; }
.bento-card::after{
  content:''; position:absolute; inset:0; z-index:1; pointer-events:none; border-radius:inherit;
  background:linear-gradient(120deg, transparent 30%, rgba(198,163,85,.16) 50%, transparent 70%);
  background-size:260% 260%; background-position:-120% -120%;
  transition:background-position 1s var(--ease-out);
}
.bento-card:hover::after{ background-position:120% 120%; }
.bento-card.has-image::after{
  background:
    linear-gradient(180deg, rgba(20,15,8,0) 0%, rgba(20,15,8,0) 48%, rgba(20,15,8,.46) 100%),
    linear-gradient(120deg, transparent 30%, rgba(255,238,205,.28) 50%, transparent 70%);
  background-size:100% 100%, 260% 260%;
  background-position:0 0, -120% -120%;
}
.bento-card.has-image:hover::after{ background-position:0 0, 120% 120%; }
.bento-card .index-num{ position:relative; z-index:2; color:var(--ink-35); letter-spacing:.14em; font-weight:700; }
.bento-card h3{
  font-size:26px; margin:16px 0 11px; position:relative; z-index:2; font-weight:700;
  overflow-wrap:break-word; color:var(--ink); letter-spacing:-.01em;
}
.bento-card p{
  font-size:15px; font-weight:500; line-height:1.8; letter-spacing:.012em;
  color:var(--ink-60); max-width:34ch; position:relative; z-index:2;
}
.bento-card.has-image .index-num{ color:rgba(255,255,255,.8); text-shadow:0 1px 10px rgba(0,0,0,.4); }
.bento-card.has-image h3{ color:#fff; text-shadow:0 2px 14px rgba(0,0,0,.5); }
.bento-card.has-image p{ color:rgba(255,255,255,.92); text-shadow:0 2px 12px rgba(0,0,0,.45); }
.bento-card .icon-badge{
  position:relative; z-index:2; width:60px; height:60px; border-radius:50%; margin-bottom:6px;
  display:flex; align-items:center; justify-content:center;
  background:linear-gradient(150deg, rgba(198,163,85,.14), rgba(198,163,85,.03));
  backdrop-filter:blur(6px);
  border:1.5px solid var(--gold-deep);
  box-shadow:0 0 0 0 rgba(198,163,85,.4);
  transition:border-color .45s var(--luxury-ease), transform .45s var(--luxury-ease), box-shadow .45s var(--luxury-ease), background .45s var(--luxury-ease);
}
.bento-card.has-image .icon-badge{
  background:rgba(255,255,255,.2); backdrop-filter:blur(8px) saturate(140%);
  border:1.5px solid rgba(255,255,255,.65);
  box-shadow:0 6px 18px -8px rgba(0,0,0,.35);
}
.bento-card:hover .icon-badge{
  background:linear-gradient(135deg, var(--gold-deep), var(--gold) 55%, var(--gold-light));
  border-color:var(--gold-light); transform:scale(1.1);
  box-shadow:0 0 26px 5px rgba(198,163,85,.5);
}
.bento-card svg{ width:24px; height:24px; stroke:var(--gold-deep); position:relative; margin:0; transition:stroke .3s var(--luxury-ease); }
.bento-card.has-image svg{ stroke:#fff; }
.bento-card:hover svg{ stroke:#fff; }

.why-stats{
  position:relative; z-index:1; margin-top:64px;
  display:flex; flex-wrap:wrap; align-items:center; justify-content:center; gap:0;
  padding:34px var(--edge); border-top:1px solid rgba(198,163,85,.3); border-bottom:1px solid rgba(198,163,85,.3);
}
.why-stat{ display:flex; align-items:center; gap:14px; padding:12px 34px; transition:transform .4s var(--ease-out); }
.why-stat:hover{ transform:translateY(-3px); }
.why-stat svg{
  width:22px; height:22px; flex-shrink:0; color:var(--gold-deep); padding:8px; border-radius:50%;
  border:1px solid var(--gold-deep); box-sizing:content-box;
  transition:box-shadow .4s var(--ease-out), border-color .4s var(--ease-out);
}
.why-stat:hover svg{ border-color:var(--gold); box-shadow:0 0 18px 1px rgba(198,163,85,.35); }
.why-stat div{ display:flex; flex-direction:column; }
.why-stat b{ font-family:var(--f-display); font-size:26px; font-weight:800; color:var(--ink); }
.why-stat span{ font-family:var(--f-mono); font-size:10.5px; letter-spacing:.1em; text-transform:uppercase; color:#000; font-weight:700; }
.why-stat-divider{ width:1px; height:32px; background:rgba(198,163,85,.3); }
@media (max-width:760px){
  .why-stats{ flex-direction:column; gap:20px; align-items:flex-start; padding:34px var(--edge); }
  .why-stat-divider{ display:none; }
  .why-stat{ padding:0; width:100%; }
}

/* ==========================================================================
   SERVICES — editorial index list
   ========================================================================== */
.services-layout{ display:grid; grid-template-columns:1fr 500px; gap:56px; align-items:start; }
@media (max-width:980px){ .services-layout{ grid-template-columns:1fr; } }
#services{ position:relative; isolation:isolate; background:var(--warm-white); }
#services h2{ color:var(--ink); }
#services h2 .italic{ color:var(--gold-deep); }
#services .lede{ color:var(--ink-60); }
.services-preview{
  position:sticky; top:130px; aspect-ratio:3/4; border-radius:16px; overflow:hidden;
  background:var(--warm-white); display:none; border:1px solid var(--ink-14);
  box-shadow:0 30px 60px -34px rgba(120,90,40,.3);
}
@media (min-width:981px){ .services-preview{ display:block; } }
.services-preview-img{
  position:absolute; inset:0; width:100%; height:100%; object-fit:cover; opacity:0;
  transition:opacity .7s var(--ease-out); transform:scale(1.05); filter:saturate(1.1) brightness(1.05);
}
.services-preview-img.is-active{ opacity:1; }
.services-preview-frame{
  position:absolute; inset:0; pointer-events:none;
  border:1px solid rgba(198,163,85,.4);
  background:linear-gradient(180deg, transparent 62%, rgba(43,36,28,.14));
}
.services-list{ border-top:1px solid var(--ink-14); }
.service-row{
  position:relative; display:grid; grid-template-columns:0px 1fr auto; align-items:center; gap:30px;
  padding:26px 0; border-bottom:1px solid var(--ink-14); cursor:pointer; overflow:hidden;
  transition:padding .5s var(--ease-out);
}
.service-row::after{
  content:''; position:absolute; left:0; right:0; bottom:-1px; height:1px; background:var(--gold);
  transform:scaleX(0); transform-origin:left; transition:transform .6s var(--ease-out);
}
.service-row:hover::after, .service-row.is-open::after{ transform:scaleX(1); }
.service-row .index-num{ font-size:14px; color:var(--ink-35); transition:color .4s var(--ease-out); }
.service-row:hover .index-num{ color:var(--gold-deep); }
.service-row h3{
  font-size:clamp(24px,3.4vw,30px); font-weight:700; color:var(--ink);
  transition:color .4s var(--ease-out), transform .5s var(--ease-out); transform-origin:left center;
}
.service-row .arrow{ width:22px; height:22px; stroke:var(--ink-35); transition:transform .5s var(--ease-out), stroke .4s; flex-shrink:0; }
.service-row:hover .arrow{ transform:translateX(6px); stroke:var(--gold-deep); }
.service-row-desc{
  grid-column:1 / -1; max-height:0; overflow:hidden; opacity:0;
  transition:max-height .55s var(--ease-out), opacity .4s var(--ease-out), padding .5s var(--ease-out);
  display:grid; grid-template-columns:70px 1fr 220px; gap:30px;
}
.service-row-desc p{ font-size:16px; font-weight:500; line-height:1.8; color:var(--ink-60); max-width:52ch; align-self:center; }
.service-row-desc .thumb{ aspect-ratio:4/3; overflow:hidden; border-radius:12px; align-self:center; transform:scale(.9); opacity:0; transition:transform .5s var(--ease-out) .1s, opacity .5s .1s; }
.service-row-desc .thumb img{ width:100%; height:100%; object-fit:cover; filter:saturate(1.1) brightness(1.05); }
.service-row.is-open{ padding-bottom:32px; }
.service-row.is-open h3{ color:var(--gold-deep); transform:translateX(10px); }
.service-row.is-open .arrow{ transform:rotate(90deg); stroke:var(--gold-deep); }
.service-row.is-open .service-row-desc{ max-height:280px; opacity:1; padding-top:14px; padding-bottom:6px; }
.service-row.is-open .service-row-desc .thumb{ transform:scale(1); opacity:1; }
.service-row:hover h3{ color:var(--gold-deep); }
@media (max-width:700px){
  .service-row{ grid-template-columns:40px 1fr auto; gap:16px; }
  .service-row-desc{ grid-template-columns:1fr; }
  .service-row-desc .thumb{ aspect-ratio:16/9; }
}

/* ==========================================================================
   FEATURED EDITIONS — magazine alternating, broken grid
   ========================================================================== */
#editions{ position:relative; isolation:isolate; background:var(--warm-white); }
#editions h2{ color:var(--ink); }
#editions h2 .italic{ color:var(--gold-deep); }
#editions .lede{ color:var(--ink-60); }
.edition{
  position:relative; display:grid; grid-template-columns:.92fr 1.08fr; align-items:center; gap:7vw;
  padding:clamp(70px,9vw,132px) 0;
}
.edition:not(:last-child){ border-bottom:1px solid var(--ink-14); }
.edition:nth-child(even){ direction:rtl; grid-template-columns:1.08fr .92fr; }
.edition:nth-child(even) > *{ direction:ltr; }
.edition-ghost{ display:none; }
.edition-media, .edition-copy{ position:relative; z-index:1; }
.edition:nth-child(1) .edition-media{ margin-top:-32px; }
.edition:nth-child(2) .edition-copy{ margin-top:36px; }
.edition:nth-child(3) .edition-media{ margin-bottom:-32px; align-self:start; }

/* ---- premium layered image frame ---- */
.edition-media{
  max-width:480px; padding:14px;
  background:linear-gradient(155deg,#fffdf6,var(--warm-white) 55%,#f5efe0);
  border-radius:3px;
  box-shadow:
    0 34px 70px -34px rgba(120,90,40,.34),
    0 10px 26px -16px rgba(0,0,0,.22),
    0 0 0 1px rgba(198,163,85,.22);
  transition:box-shadow .7s var(--ease-out);
  will-change:transform;
}
.edition-media::before{
  content:''; position:absolute; inset:6px; z-index:2; pointer-events:none;
  border:1px solid rgba(198,163,85,.55);
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.5);
  transition:border-color .6s var(--ease-out), box-shadow .6s var(--ease-out), inset .5s var(--ease-out);
}
.edition:hover .edition-media{
  box-shadow:
    0 50px 96px -30px rgba(120,90,40,.44),
    0 14px 34px -14px rgba(0,0,0,.26),
    0 0 0 1px rgba(198,163,85,.3),
    0 0 34px 0 rgba(198,163,85,.22);
}
.edition:hover .edition-media::before{ border-color:rgba(198,163,85,.92); inset:5px; }

.edition-frame{
  position:relative; aspect-ratio:4/5; overflow:hidden; isolation:isolate; z-index:1;
}
.edition-frame img{
  width:100%; height:100%; object-fit:cover; display:block;
  transform:scale(1) translate3d(var(--tx,0px),var(--ty,0px),0);
  transition:transform .75s var(--ease-out), filter .75s var(--ease-out);
  filter:saturate(1.1) brightness(1.05);
  will-change:transform;
}
.edition:hover .edition-frame img{ transform:scale(1.07) translate3d(var(--tx,0px),var(--ty,0px),0); }
.edition-frame-sheen{
  position:absolute; inset:0; z-index:2; pointer-events:none;
  background:linear-gradient(128deg, rgba(255,255,255,.28) 0%, rgba(255,255,255,0) 26%, rgba(255,255,255,0) 68%, rgba(255,255,255,.14) 100%);
  mix-blend-mode:overlay; opacity:.7;
}
.edition-media .num{
  position:absolute; top:14px; left:14px; z-index:3; font-family:var(--f-mono); font-size:11px; color:var(--warm-white);
  padding:8px 14px; background:rgba(6,6,6,.5); backdrop-filter:blur(8px); letter-spacing:.1em;
}
.edition-copy h3{ font-size:clamp(28px,3.6vw,46px); margin:18px 0 20px; color:var(--ink); }
.edition-copy p{ font-size:16.5px; font-weight:500; line-height:1.85; color:var(--ink-60); max-width:46ch; margin-bottom:22px; }
.edition-points{ display:flex; flex-direction:column; gap:11px; margin-bottom:28px; }
.edition-points li{
  position:relative; padding-left:24px; font-size:14.5px; font-weight:500; letter-spacing:.01em;
  color:var(--ink-60); line-height:1.5;
}
.edition-points li::before{
  content:''; position:absolute; left:0; top:9px; width:14px; height:1px; background:var(--gold-deep);
}
.edition-copy .tag-row{ display:flex; gap:10px; flex-wrap:wrap; margin-top:6px; }
.edition-copy .tag-row span{
  font-family:var(--f-mono); font-size:10.5px; letter-spacing:.08em; text-transform:uppercase;
  padding:7px 13px; border:1px solid rgba(198,163,85,.4); color:#000;
}
@media (max-width:860px){
  .edition{ grid-template-columns:1fr; direction:ltr !important; gap:40px; }
  .edition:nth-child(even){ grid-template-columns:1fr; }
  .edition > *{ direction:ltr; }
  .edition-media{ max-width:none; margin:0 !important; }
  .edition-frame{ aspect-ratio:4/3; }
  .edition-copy{ margin:0 !important; }
}

/* ==========================================================================
   PROCESS — horizontal scroll timeline
   ========================================================================== */
#process{ position:relative; isolation:isolate; background:var(--warm-white); }
#process h2{ color:var(--ink); }
#process h2 .italic{ color:var(--gold-deep); }
.process-section{ padding-left:0; padding-right:0; }
.process-head{ padding:0 var(--edge); margin-bottom:56px; }
.process-track-wrap{ overflow:hidden; }
.process-track{
  display:flex; gap:0; overflow-x:auto; scroll-snap-type:x proximity;
  padding:0 var(--edge) 40px; scrollbar-width:none;
}
.process-track::-webkit-scrollbar{ display:none; }
.process-track.js-pin{ overflow:visible; scroll-snap-type:none; will-change:transform; }
.process-panel{
  flex:0 0 min(78vw,460px); scroll-snap-align:start; padding:44px 44px 44px 0;
  border-right:1px solid var(--ink-14); position:relative;
}
.process-panel .big-num{
  font-family:var(--f-display); font-style:italic; font-size:110px; line-height:1; color:transparent;
  -webkit-text-stroke:1px rgba(198,163,85,.3); position:absolute; top:0; right:60px; z-index:0; pointer-events:none;
}
.process-panel .content{ position:relative; z-index:1; padding-top:60px; }
.process-panel h3{ font-size:26px; margin:16px 0 14px; color:var(--ink); }
.process-panel p{ font-size:16px; font-weight:500; line-height:1.8; color:var(--ink-60); max-width:38ch; }
.process-bar{
  height:2px; background:var(--ink-14); margin:0 var(--edge); position:relative; overflow:hidden;
}
.process-bar-fill{ position:absolute; left:0; top:0; height:100%; width:0%; background:var(--gold); transition:width .1s linear; }
.process-hint{ padding:16px var(--edge) 0; font-family:var(--f-mono); font-size:10.5px; letter-spacing:.14em; color:var(--ink-35); text-transform:uppercase; display:flex; justify-content:space-between; }

/* ==========================================================================
   STATISTICS
   ========================================================================== */
.stats-band{
  background:var(--warm-white); border-top:1px solid var(--ink-14); border-bottom:1px solid var(--ink-14);
  display:grid; grid-template-columns:repeat(4,1fr);
}
@media (max-width:860px){ .stats-band{ grid-template-columns:repeat(2,1fr); } }
.stat-cell{
  padding:64px 36px; border-right:1px solid var(--ink-14); position:relative; overflow:hidden;
}
.stat-cell:last-child{ border-right:none; }
@media (max-width:860px){ .stat-cell:nth-child(2n){ border-right:none; } .stat-cell{ border-bottom:1px solid var(--ink-14); } }
.stat-cell .num{
  font-family:var(--f-display); font-style:italic; font-size:clamp(44px,4.4vw,68px);
  display:flex; align-items:baseline; gap:4px;
}
.stat-cell .num span{
  background-image:linear-gradient(100deg, #5a5957 0%, #565553 30%, #232322 45%, #0e0e0e 60%, #030303 100%);
  background-size:220% 100%; -webkit-background-clip:text; background-clip:text; -webkit-text-fill-color:transparent; color:transparent;
  animation:shimmer 6s linear infinite;
  filter:drop-shadow(0 0 20px rgba(198,163,85,.3));
}
@media (prefers-reduced-motion:reduce){ .stat-cell .num span{ animation:none; } }
.stat-cell .label{ margin-top:14px; font-family:var(--f-mono); font-size:11px; letter-spacing:.1em; text-transform:uppercase; color:var(--ink-35); max-width:22ch; }

/* ==========================================================================
   GALLERY — bento grid
   ========================================================================== */
#gallery{ position:relative; isolation:isolate; background:var(--warm-white); }
#gallery h2{ color:var(--ink); }
#gallery h2 .italic{ color:var(--gold-deep); }
#gallery .lede{ color:var(--ink-60); }

/* 4-col bento: 2 feature tiles (2x2) + 8 supporting tiles (1x1) = exactly 16
   cells = 4x4 rows, so grid-auto-flow:dense packs it with zero gaps and a
   flush bottom edge at every breakpoint below. */
.gallery-bento{
  display:grid;
  grid-template-columns:repeat(4, 1fr);
  grid-auto-rows:clamp(150px, 15vw, 220px);
  grid-auto-flow:dense;
  gap:14px;
}
.g-item:nth-child(1),
.g-item:nth-child(7){
  grid-column:span 2;
  grid-row:span 2;
}
@media (max-width:1100px){
  .gallery-bento{ grid-template-columns:repeat(3, 1fr); grid-auto-rows:clamp(130px, 18vw, 190px); gap:12px; }
  /* 3 cols: feature #1 becomes a full-width banner (3x2) so item areas
     still sum to an exact multiple of 3 rows — no partial last row. */
  .g-item:nth-child(1){ grid-column:span 3; grid-row:span 2; }
}
@media (max-width:760px){
  .gallery-bento{ grid-template-columns:repeat(2, 1fr); grid-auto-rows:clamp(120px, 32vw, 190px); gap:10px; }
}

.g-item{
  position:relative; overflow:hidden; border-radius:14px;
  cursor:zoom-in; transition:transform .35s var(--ease-out); will-change:transform;
  border:1px solid rgba(198,163,85,.3); box-shadow:0 20px 40px -28px rgba(120,90,40,.3);
}
.g-item img{
  width:100%; height:100%; display:block; object-fit:cover;
  transition:transform 1s var(--ease-out), filter .5s; filter:saturate(1.1) brightness(1.04);
}
.g-item:hover img{ transform:scale(1.07); filter:saturate(1.18) brightness(1.06); }
.g-item::after{
  content:attr(data-caption);
  position:absolute; left:0; right:0; bottom:0; padding:16px;
  background:linear-gradient(0deg, rgba(6,6,6,.85), transparent);
  opacity:0; transform:translateY(10px); transition:opacity .4s var(--ease-out), transform .4s var(--ease-out);
  font-family:var(--f-mono); font-size:10.5px; letter-spacing:.1em; text-transform:uppercase; color:var(--warm-white);
  pointer-events:none;
}
.g-item:hover::after{ opacity:1; transform:translateY(0); }

.lightbox{
  position:fixed; inset:0; z-index:500; background:rgba(6,6,6,.95); backdrop-filter:blur(10px);
  display:flex; align-items:center; justify-content:center; opacity:0; pointer-events:none;
  transition:opacity .4s var(--ease-out);
}
.lightbox.is-open{ opacity:1; pointer-events:auto; }
.lightbox img{ max-width:88vw; max-height:82vh; object-fit:contain; border-radius:var(--radius); transform:scale(.94); transition:transform .4s var(--ease-out); }
.lightbox.is-open img{ transform:scale(1); }
.lightbox-close{
  position:absolute; top:28px; right:var(--edge); width:44px; height:44px; border:1px solid var(--warm-white-14);
  border-radius:50%; display:flex; align-items:center; justify-content:center; color:var(--warm-white);
  transition:border-color .3s, transform .3s;
}
.lightbox-close:hover{ border-color:var(--gold); transform:rotate(90deg); }
.lightbox-cap{ position:absolute; bottom:36px; left:50%; transform:translateX(-50%); font-family:var(--f-mono); font-size:11px; letter-spacing:.12em; color:var(--warm-white-35); text-transform:uppercase; }
.lightbox-nav{
  position:absolute; top:50%; transform:translateY(-50%); width:52px; height:52px; border-radius:50%;
  border:1px solid var(--warm-white-14); display:flex; align-items:center; justify-content:center; color:var(--warm-white);
  transition:border-color .3s, background .3s, transform .3s;
}
.lightbox-nav:hover{ border-color:var(--gold); background:rgba(198,163,85,.1); }
.lightbox-nav.prev{ left:var(--edge); }
.lightbox-nav.next{ right:var(--edge); }
.lightbox-nav svg{ width:20px; height:20px; }
@media (max-width:700px){
  .lightbox-nav{ width:40px; height:40px; }
  .lightbox-nav.prev{ left:12px; }
  .lightbox-nav.next{ right:12px; }
}

/* ==========================================================================
   PROMISE (client experience, honest reframe)
   ========================================================================== */
#promise h2{ color:var(--ink); }
#promise h2 .italic{ color:var(--gold-deep); }
#promise .lede{ color:var(--ink-60); }
.promise-section{ background:var(--warm-white); position:relative; isolation:isolate; }
.promise-grid{
  display:grid; grid-template-columns:repeat(4,1fr); gap:1px;
  background:rgba(198,163,85,.28); border:1px solid rgba(198,163,85,.28);
  margin-top:64px;
}
@media (max-width:900px){ .promise-grid{ grid-template-columns:repeat(2,1fr); } }
@media (max-width:520px){ .promise-grid{ grid-template-columns:1fr; } }

.promise-item{
  background:#fffdf8; padding:56px 28px; text-align:center;
  display:flex; flex-direction:column; align-items:center;
  transition:background .5s var(--ease-out);
}
.promise-item:hover{ background:rgba(198,163,85,.07); }

.promise-index{
  font-family:var(--f-mono); font-size:11px; letter-spacing:.22em; color:var(--gold-deep);
  margin-bottom:22px; transition:color .4s var(--ease-out);
}
.promise-item:hover .promise-index{ color:var(--gold); }

.promise-icon{
  width:58px; height:58px; border-radius:50%; margin-bottom:26px; flex-shrink:0;
  display:flex; align-items:center; justify-content:center;
  background:linear-gradient(150deg, rgba(198,163,85,.16), transparent 70%);
  border:1px solid var(--gold-deep);
  transition:border-color .4s var(--ease-out), transform .5s var(--ease-out), box-shadow .5s var(--ease-out);
}
.promise-item:hover .promise-icon{ border-color:var(--gold-light); transform:translateY(-5px); box-shadow:0 10px 30px -8px rgba(198,163,85,.4); }
.promise-icon svg{ width:24px; height:24px; stroke:#000; }

.promise-item h3{
  font-size:19px; font-weight:700; color:var(--ink); margin-bottom:12px;
  transition:color .4s var(--ease-out);
}
.promise-item:hover h3{ color:var(--gold-deep); }
.promise-item p{
  font-family:var(--f-body); font-size:15px; font-weight:500; line-height:1.75; color:var(--ink-60); max-width:24ch;
}

/* ==========================================================================
   CTA — split-screen luxury editorial
   ========================================================================== */
.cta-section{
  position:relative; overflow:hidden; isolation:isolate;
  padding:clamp(90px,12vw,160px) var(--edge) 0;
  text-align:left; background:var(--warm-white);
}
.cta-bg{ position:absolute; inset:0; z-index:0; }
.cta-bg img{
  position:absolute; inset:0; width:100%; height:100%; object-fit:cover;
  filter:saturate(1.1) brightness(1.08) contrast(1.02);
  transform:scale(1.04);
}
.cta-vignette{
  position:absolute; inset:0; z-index:1;
  background:
    radial-gradient(ellipse 560px 440px at 76% 42%, rgba(255,204,120,.2), transparent 68%),
    linear-gradient(100deg, rgba(250,246,236,.94) 0%, rgba(250,246,236,.68) 34%, rgba(250,246,236,.3) 58%, rgba(250,246,236,.55) 100%);
}
.cta-rays{ display:none; }
.cta-glow{
  position:absolute; z-index:1; width:56vw; height:56vw; max-width:820px; max-height:820px; border-radius:50%;
  background:radial-gradient(circle, rgba(198,163,85,.14), transparent 70%);
  top:-18%; right:-8%; pointer-events:none; animation:glowMove 12s ease-in-out infinite alternate, glowPulse 6s ease-in-out infinite;
}
@keyframes glowMove{ from{ transform:translate(0,0) scale(1); } to{ transform:translate(-6%,6%) scale(1.15); } }
@keyframes glowPulse{ 0%,100%{ opacity:1; } 50%{ opacity:.6; } }
.cta-glow-2{
  position:absolute; z-index:1; width:30vw; height:30vw; max-width:440px; max-height:440px; border-radius:50%;
  background:radial-gradient(circle, rgba(198,163,85,.12), transparent 70%);
  bottom:-14%; left:-6%; pointer-events:none; animation:glowMove2 15s ease-in-out infinite alternate;
}
@keyframes glowMove2{ from{ transform:translate(0,0) scale(1); } to{ transform:translate(8%,-8%) scale(1.2); } }
.cta-diagonal{
  position:absolute; z-index:1; top:0; left:38%; width:1px; height:100%; pointer-events:none;
  background:linear-gradient(180deg, transparent 0%, rgba(198,163,85,.5) 30%, rgba(129,97,38,.6) 50%, rgba(198,163,85,.5) 70%, transparent 100%);
  transform:rotate(9deg) scaleY(1.1); filter:drop-shadow(0 0 8px rgba(198,163,85,.3));
}
@media (max-width:980px){ .cta-diagonal{ display:none; } }
.cta-sweep{ display:none; }
.cta-particles{ position:absolute; inset:0; z-index:1; pointer-events:none; }
.cta-particles .particle{ background:var(--gold-deep); mix-blend-mode:multiply; }
.cta-ghost{ display:none; }
@media (prefers-reduced-motion:reduce){ .cta-glow{ animation:none; } }

.cta-grid{
  position:relative; z-index:2; display:grid; grid-template-columns:1.15fr .85fr; gap:6vw; align-items:center;
  padding-bottom:clamp(70px,9vw,120px);
}
@media (max-width:980px){ .cta-grid{ grid-template-columns:1fr; gap:64px; } }

.cta-left{ max-width:640px; }
.cta-left h2{ font-size:clamp(38px,6vw,80px); margin:22px 0 26px; color:var(--ink); text-shadow:0 2px 20px rgba(255,255,255,.5); }
.cta-left h2 .italic{ color:var(--gold-deep); }
.cta-lede{ font-size:17px; font-weight:500; line-height:1.85; color:var(--ink-60); max-width:50ch; margin-bottom:22px; }
.cta-tagline{
  font-family:var(--f-mono); font-size:13px; letter-spacing:.16em; text-transform:uppercase; color:var(--gold-deep);
  display:flex; gap:10px; align-items:center; margin-bottom:48px; padding-bottom:22px; border-bottom:1px solid rgba(198,163,85,.35);
}
.cta-tagline span:first-child{ color:var(--ink); }

.cta-highlights{ display:flex; align-items:flex-start; gap:26px; flex-wrap:wrap; }
.cta-highlight{ display:flex; gap:14px; align-items:flex-start; flex:1 1 160px; min-width:150px; }
.cta-highlight svg{ width:24px; height:24px; stroke:var(--gold-deep); flex-shrink:0; margin-top:2px; }
.cta-highlight h4{ font-family:var(--f-display); font-size:17px; color:var(--ink); font-weight:700; margin-bottom:6px; }
.cta-highlight p{ font-size:14.5px; font-weight:500; line-height:1.6; color:var(--ink-60); }
.cta-divider-v{ width:1px; align-self:stretch; background:linear-gradient(180deg, transparent, var(--gold-deep), transparent); min-height:56px; }
@media (max-width:700px){ .cta-divider-v{ display:none; } .cta-highlights{ flex-direction:column; gap:24px; } }

.cta-right{ display:flex; justify-content:center; }
.cta-card-wrap{
  position:relative; width:100%; max-width:380px; padding-top:36px;
  transition:transform .5s var(--ease-out);
}
.cta-card-wrap:hover{ transform:translateY(-8px); }
.cta-card-logo{
  position:absolute; top:0; left:50%; transform:translateX(-50%); z-index:3;
  width:64px; height:64px; object-fit:contain;
  filter:drop-shadow(0 8px 24px rgba(198,163,85,.5));
}
.cta-card{
  position:relative; z-index:2; margin-top:20px; padding:56px 34px 34px;
  background:rgba(255,255,255,.92); backdrop-filter:blur(22px) saturate(160%);
  border-radius:20px; border:1px solid rgba(198,163,85,.4);
  text-align:center; overflow:hidden;
  box-shadow:0 30px 80px -30px rgba(120,90,40,.32);
  transition:box-shadow .5s var(--ease-out), border-color .5s var(--ease-out);
}
.cta-card-wrap:hover .cta-card{ border-color:var(--gold); box-shadow:0 40px 90px -24px rgba(120,90,40,.36), 0 0 50px -12px rgba(198,163,85,.3); }
.cta-card::before{
  content:''; position:absolute; inset:0; z-index:0;
  background:radial-gradient(circle at 50% -10%, rgba(198,163,85,.14), transparent 60%);
}
.cta-card-sheen{
  position:absolute; inset:0; z-index:1; overflow:hidden; pointer-events:none;
}
.cta-card-sheen::before{
  content:''; position:absolute; top:-40%; left:-60%; width:60%; height:220%;
  background:linear-gradient(75deg, transparent 40%, rgba(198,163,85,.22) 50%, transparent 60%);
  transform:rotate(15deg) translateX(-40%); transition:transform 1.1s var(--ease-out);
}
.cta-card-wrap:hover .cta-card-sheen::before{ transform:rotate(15deg) translateX(220%); }
.cta-card .eyebrow{ position:relative; z-index:2; justify-content:center; }
.cta-card h3{ position:relative; z-index:2; font-size:28px; margin:16px 0 12px; color:var(--ink); }
.cta-card p{ position:relative; z-index:2; font-size:15.5px; font-weight:500; line-height:1.75; color:var(--ink-60); margin-bottom:30px; }
.cta-card-actions{ position:relative; z-index:2; display:flex; flex-direction:column; gap:14px; }
.cta-card-actions .btn{ width:100%; justify-content:center; }
.cta-card-actions .magnetic{ display:block; }
.cta-card-actions .btn-glass{
  background:rgba(198,163,85,.08); border:1px solid var(--gold-deep); color:var(--ink);
}
.cta-card-actions .btn-glass:hover{ border-color:var(--gold); background:rgba(198,163,85,.14); }
@media (max-width:980px){ .cta-card-wrap{ margin:0 auto; } }

.cta-infobar{
  position:relative; z-index:2; display:flex; flex-wrap:wrap; align-items:center; justify-content:center; gap:0;
  border-top:1px solid rgba(198,163,85,.35); padding:26px var(--edge);
  margin:0 calc(var(--edge) * -1);
}
.cta-info-item{ display:flex; align-items:baseline; gap:10px; padding:8px 28px; }
.cta-info-item .label{ font-family:var(--f-mono); font-size:10px; letter-spacing:.14em; text-transform:uppercase; color:var(--gold-deep); }
.cta-info-item a, .cta-info-item span:not(.label){ font-family:var(--f-body); font-size:15px; font-weight:600; color:var(--ink); text-shadow:0 1px 10px rgba(255,255,255,.6); }
.cta-info-divider{ width:1px; height:18px; background:rgba(198,163,85,.35); }
@media (max-width:700px){
  .cta-infobar{ flex-direction:column; gap:14px; }
  .cta-info-divider{ display:none; }
}

/* ==========================================================================
   FOOTER
   ========================================================================== */
footer{
  position:relative; overflow:hidden; isolation:isolate; padding:80px var(--edge) 32px;
  background:
    radial-gradient(ellipse 60% 55% at 15% 0%, rgba(198,163,85,.10), transparent 60%),
    radial-gradient(ellipse 45% 45% at 100% 100%, rgba(198,163,85,.07), transparent 60%),
    linear-gradient(180deg, var(--charcoal) 0%, var(--black) 100%);
  --ink: var(--warm-white);
  --ink-60: rgba(247,243,234,.72);
  --ink-35: rgba(247,243,234,.46);
}
footer::before{
  content:''; position:absolute; top:0; left:0; right:0; height:1px;
  background:linear-gradient(90deg, transparent, var(--gold-deep), var(--gold-light), var(--gold-deep), transparent);
}
.footer-ghost{ display:none; }
.footer-top{ position:relative; z-index:1; display:grid; grid-template-columns:1.4fr 1fr 1fr; gap:50px; padding-bottom:60px; }
@media (max-width:860px){ .footer-top{ grid-template-columns:1fr 1fr; } }
@media (max-width:560px){ .footer-top{ grid-template-columns:1fr; } }
.footer-brand{ display:flex; align-items:center; gap:14px; margin-bottom:20px; }
.footer-brand img{ filter:drop-shadow(0 0 18px rgba(198,163,85,.25)); }

.footer-brand b{ font-family:var(--f-display); font-size:21px; color:var(--ink); font-weight:700; }
.footer-tagline{ font-family:var(--f-mono); font-size:11px; letter-spacing:.14em; color:var(--gold-light); text-transform:uppercase; margin-bottom:22px; font-weight:700; }
footer h4{ font-family:var(--f-mono); font-size:12px; letter-spacing:.12em; text-transform:uppercase; color:var(--gold-light); margin-bottom:20px; font-weight:700; }
.footer-links{ display:flex; flex-direction:column; gap:12px; }
.footer-links a{ font-size:16px; font-weight:500; color:var(--ink-60); transition:color .3s, padding-left .3s; }
.footer-links a:hover{ color:var(--gold-light); padding-left:6px; }
.footer-address{ font-style:normal; font-size:16px; font-weight:500; line-height:1.7; color:var(--ink-60); }
.footer-blurb{ max-width:34ch; font-size:15.5px; font-weight:500; line-height:1.8; color:var(--ink-60); }
.nav-side-label{ font-family:var(--f-mono); font-size:11px; letter-spacing:.14em; color:var(--warm-white-35); text-transform:uppercase; margin-bottom:16px; font-weight:700; }
.nav-contact .nav-side-label{ margin-bottom:4px; }
.footer-bottom{
  position:relative; z-index:1;
  display:flex; justify-content:space-between; align-items:center; flex-wrap:wrap; gap:14px;
  padding-top:26px; border-top:1px solid rgba(198,163,85,.22);
  font-family:var(--f-mono); font-size:11px; letter-spacing:.06em; color:var(--ink-35);
}
.footer-bottom a{ color:var(--ink-35); }
.footer-bottom a:hover{ color:var(--gold-light); }

/* ==========================================================================
   MISC
   ========================================================================== */
.marquee{
  overflow:hidden; white-space:nowrap; border-top:1px solid var(--ink-14); border-bottom:1px solid #000;
  padding:22px 0; background:var(--warm-white);
}
.marquee-track{ display:inline-flex; animation:marquee 34s linear infinite; }
.marquee-track span{
  font-family:var(--f-display); font-style:italic; font-size:22px; color:#000; padding:0 34px;
  display:inline-flex; align-items:center; gap:34px;
}
.marquee-track span::after{ content:'✦'; color:var(--gold-deep); font-style:normal; font-size:14px; }
@keyframes marquee{ to{ transform:translateX(-50%); } }