:root{
    --charcoal: #1b1917;
    --charcoal-deep: #121110;
    --charcoal-raise: #232019;
    --gold: #c99a3f;
    --gold-bright: #e3b656;
    --gold-pale: #e8d9ae;
    --gold-dark: #7a5a22;
    --ivory: #f2ece0;
    --ivory-dim: #a89e8d;
    --hairline: rgba(201,154,63,0.28);
    --hairline-faint: rgba(201,154,63,0.14);
    --ease: cubic-bezier(.22,.61,.36,1);
  }

  *{ margin:0; padding:0; box-sizing:border-box; }

  html{ scroll-behavior:smooth; overflow-x:hidden; width:100%; }

  body{
    background: var(--charcoal);
    color: var(--ivory);
    font-family:'Jost', sans-serif;
    font-weight:300;
    line-height:1.6;
    overflow-x:hidden;
  }

  h1,h2,h3,.serif{
    font-family:'Cormorant Garamond', serif;
    font-weight:500;
    letter-spacing:.02em;
  }

  .eyebrow{
    font-family:'Jost',sans-serif;
    font-size:.72rem;
    letter-spacing:.32em;
    text-transform:uppercase;
    color:var(--gold);
    font-weight:500;
  }

  a{ color:inherit; text-decoration:none; }
  img{ max-width:100%; display:block; }

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

  /* ---------- reveal-on-scroll ---------- */
  .reveal{
    opacity:0;
    transform:translateY(28px);
    transition:opacity 1s var(--ease), transform 1s var(--ease);
  }
  .reveal.is-visible{ opacity:1; transform:translateY(0); }

  @media (prefers-reduced-motion: reduce){
    *{ animation:none !important; transition:none !important; }
    .reveal{ opacity:1; transform:none; }
  }

  /* ---------- nav ---------- */
  nav{
    position:fixed; top:0; left:0; right:0; z-index:100;
    display:flex; align-items:center; justify-content:space-between;
    padding:22px 5vw;
    background:transparent;
    transition:background .5s var(--ease), padding .5s var(--ease), border-color .5s var(--ease);
    border-bottom:1px solid transparent;
    overflow:hidden;
  }
  nav.scrolled{
    background:rgba(18,17,16,.86);
    backdrop-filter:blur(10px);
    padding:14px 5vw;
    border-bottom:1px solid var(--hairline-faint);
  }
  .nav-brand{ display:flex; align-items:center; gap:12px; min-width:0; flex:1 1 auto; overflow:hidden; margin-right:16px; }
  .nav-brand img{ height:34px; width:auto; flex-shrink:0; transition:height .5s var(--ease); }
  nav.scrolled .nav-brand img{ height:26px; }
  .nav-brand span{
    font-family:'Cormorant Garamond',serif;
    font-size:1.15rem;
    letter-spacing:.18em;
    color:var(--gold-pale);
    white-space:nowrap;
    overflow:hidden;
    text-overflow:ellipsis;
    min-width:0;
  }
  .nav-links{ display:flex; gap:2.2rem; margin-right:2.8rem; }
  .nav-links a{
    font-size:.72rem;
    letter-spacing:.14em;
    text-transform:uppercase;
    color:var(--ivory-dim);
    position:relative;
    padding-bottom:4px;
  }
  .nav-links a::after{
    content:''; position:absolute; left:0; bottom:0; height:1px; width:0;
    background:var(--gold); transition:width .4s var(--ease);
  }
  .nav-links a:hover{ color:var(--gold-pale); }
  .nav-links a:hover::after{ width:100%; }
  .nav-cta{
    font-size:.75rem; letter-spacing:.16em; text-transform:uppercase;
    border:1px solid var(--hairline); padding:9px 20px;
    color:var(--gold-pale); transition:all .35s var(--ease);
    flex-shrink:0;
  }
  .nav-cta:hover{ background:var(--gold); color:var(--charcoal-deep); border-color:var(--gold); }
  .nav-toggle{ display:none; }

  /* ---------- hero ---------- */
  .hero{
    min-height:100svh;
    display:flex; flex-direction:column; align-items:center; justify-content:center;
    text-align:center;
    position:relative;
    padding:120px 6vw 80px;
    overflow:hidden;
  }
  .hero-mark{
    width:150px; height:auto;
    margin-bottom:18px;
    opacity:0;
    animation:markIn 1.4s var(--ease) .2s forwards;
  }
  .hero-word{
    font-size:clamp(2.6rem, 7vw, 5.2rem);
    letter-spacing:.16em;
    line-height:1.05;
    background:linear-gradient(100deg, var(--gold-dark) 0%, var(--gold-bright) 32%, var(--gold-pale) 55%, var(--gold) 78%, var(--gold-dark) 100%);
    -webkit-background-clip:text; background-clip:text; color:transparent;
    opacity:0;
    animation:markIn 1.4s var(--ease) .5s forwards;
  }
  .hero-word small{
    display:block;
    font-size:.34em;
    letter-spacing:.5em;
    margin-top:.4em;
    color:var(--gold-pale);
    -webkit-text-fill-color:var(--gold-pale);
  }
  @keyframes markIn{ from{ opacity:0; transform:translateY(16px);} to{opacity:1; transform:translateY(0);} }

  .hero-tagline{
    max-width:540px;
    margin:32px auto 0;
    font-size:1.05rem;
    color:var(--ivory-dim);
    font-weight:300;
    letter-spacing:.02em;
    opacity:0;
    animation:markIn 1.4s var(--ease) .9s forwards;
  }
  .hero-scroll{
    position:absolute; bottom:38px; left:0; right:0;
    display:flex; flex-direction:column; align-items:center; gap:10px;
    opacity:0;
    animation:markIn 1.4s var(--ease) 1.3s forwards;
  }
  .hero-scroll span{
    font-size:.65rem; letter-spacing:.28em; text-transform:uppercase; color:var(--ivory-dim);
    margin-right:-.28em; /* offsets trailing letter-spacing so the text sits visually centered */
  }
  .hero-scroll i{
    width:1px; height:34px;
    background:linear-gradient(var(--gold), transparent);
    display:block;
    animation:scrollLine 2.2s ease-in-out infinite;
  }
  @keyframes scrollLine{ 0%,100%{ opacity:.3; } 50%{ opacity:1; } }

  section{ position:relative; padding:130px 6vw; }
  .section-inner{ max-width:1180px; margin:0 auto; }

  .section-head{ text-align:center; max-width:640px; margin:0 auto 72px; }
  .section-head h2{ font-size:clamp(2rem,4vw,2.9rem); color:var(--gold-pale); margin-top:14px; }
  .section-head p{ margin-top:20px; color:var(--ivory-dim); font-size:1rem; }

  hr.hair{ border:none; height:1px; background:var(--hairline); width:64px; margin:0 auto; }

  /* ---------- collection ---------- */
  .collection{ background:var(--charcoal); }
  .reserve-rail{
    position:relative;
    max-width:1180px; margin:0 auto 10px;
    height:2px;
  }
  .rail-line{
    position:absolute; top:0; left:0; height:1px; width:100%;
    background:var(--hairline-faint);
  }
  .rail-line-fill{
    position:absolute; top:0; left:0; height:1px; width:0%;
    background:linear-gradient(90deg, var(--gold-dark), var(--gold-bright));
    transition:width 1.6s var(--ease);
  }
  .rail-line-fill.is-visible{ width:100%; }

  .collection-grid{
    display:grid;
    grid-template-columns:repeat(auto-fit, minmax(240px, 300px));
    justify-content:center;
    gap:26px;
    margin-top:46px;
    max-width:1180px;
    margin-left:auto; margin-right:auto;
  }
  .piece{
    display:flex; flex-direction:column;
    border:1px solid var(--hairline-faint);
    transition:border-color .4s var(--ease), transform .4s var(--ease);
    background:linear-gradient(180deg, rgba(201,154,63,.03), transparent 30%);
  }
  .piece:hover{ border-color:var(--hairline); transform:translateY(-6px); }

  .piece-frame{
    aspect-ratio:1/1;
    position:relative;
    display:flex; align-items:center; justify-content:center;
    background:radial-gradient(circle at 50% 40%, rgba(201,154,63,.10), rgba(0,0,0,0) 70%), var(--charcoal-raise);
    border-bottom:1px solid var(--hairline-faint);
    overflow:hidden;
  }
  .piece-frame img{ width:100%; height:100%; object-fit:cover; }
  .piece-glyph{
    width:38%; opacity:.55;
  }
  .piece-pending{
    position:absolute; bottom:14px; left:0; right:0; text-align:center;
    font-size:.58rem; letter-spacing:.24em; text-transform:uppercase; color:var(--ivory-dim);
  }
  .piece-ref{
    position:absolute; top:14px; left:14px;
    font-family:'Cormorant Garamond',serif; font-style:italic; font-size:.95rem; color:var(--gold-pale);
    letter-spacing:.06em;
  }
  .piece-body{ padding:22px 18px 26px; text-align:center; }
  .piece-body h3{ font-size:1.3rem; color:var(--ivory); margin-bottom:6px; }
  .piece-meta{ font-size:.68rem; letter-spacing:.14em; text-transform:uppercase; color:var(--gold); margin-bottom:12px; }
  .piece-desc{ font-size:.86rem; color:var(--ivory-dim); font-style:italic; line-height:1.55; }

  /* ---------- recently placed ---------- */
  .recently-placed{ background:var(--charcoal); border-top:1px solid var(--hairline-faint); }
  .placed-grid{
    display:grid;
    grid-template-columns:repeat(auto-fit, minmax(240px, 300px));
    justify-content:center;
    gap:26px;
    margin-top:46px;
    max-width:700px;
    margin-left:auto; margin-right:auto;
  }
  .piece-badge{
    position:absolute; top:14px; right:14px;
    font-size:.58rem; letter-spacing:.18em; text-transform:uppercase;
    color:var(--gold-pale);
    border:1px solid var(--hairline);
    padding:4px 10px;
    background:rgba(18,17,16,.6);
    backdrop-filter:blur(4px);
  }
  .piece.is-placed .piece-frame img{ filter:grayscale(30%); opacity:.9; }

  /* ---------- philosophy ---------- */
  .philosophy{ background:var(--charcoal-deep); }
  .philo-grid{
    display:grid; grid-template-columns:1.1fr 1fr; gap:70px; align-items:center;
  }
  .philo-quote{
    font-family:'Cormorant Garamond',serif;
    font-style:italic; font-weight:400;
    font-size:clamp(1.6rem,2.6vw,2.3rem);
    line-height:1.4;
    color:var(--gold-pale);
    border-left:1px solid var(--hairline);
    padding-left:34px;
  }
  .philo-text p{ color:var(--ivory-dim); margin-bottom:20px; font-size:.98rem; }
  .philo-text p:last-child{ margin-bottom:0; }
  @media (max-width:860px){ .philo-grid{ grid-template-columns:1fr; gap:44px; } .philo-quote{ border-left:none; border-top:1px solid var(--hairline); padding-left:0; padding-top:26px; } }

  /* ---------- provenance strip ---------- */
  .provenance{ background:var(--charcoal); border-top:1px solid var(--hairline-faint); border-bottom:1px solid var(--hairline-faint); }
  .prov-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:50px; }
  .prov-item{ text-align:center; }
  .prov-dot{
    width:8px; height:8px; border-radius:50%;
    background:radial-gradient(circle at 30% 30%, var(--gold-bright), var(--gold-dark));
    margin:0 auto 20px;
  }
  .prov-item h3{ font-size:1.25rem; color:var(--gold-pale); margin-bottom:12px; letter-spacing:.03em; }
  .prov-item p{ color:var(--ivory-dim); font-size:.9rem; max-width:280px; margin:0 auto; }
  @media (max-width:760px){ .prov-grid{ grid-template-columns:1fr; gap:44px; } }

  /* ---------- inquire ---------- */
  .inquire{ background:var(--charcoal-deep); text-align:center; }
  .inquire .section-head{ margin-bottom:44px; }
  .inquire-actions{ display:flex; gap:22px; justify-content:center; flex-wrap:wrap; }
  .btn{
    display:inline-block; padding:16px 38px;
    font-size:.78rem; letter-spacing:.2em; text-transform:uppercase;
    transition:all .4s var(--ease);
  }
  .btn-primary{ background:var(--gold); color:var(--charcoal-deep); border:1px solid var(--gold); }
  .btn-primary:hover{ background:var(--gold-bright); border-color:var(--gold-bright); }
  .btn-ghost{ border:1px solid var(--hairline); color:var(--gold-pale); }
  .btn-ghost:hover{ border-color:var(--gold); background:rgba(201,154,63,.08); }
  .inquire-meta{ margin-top:38px; color:var(--ivory-dim); font-size:.85rem; letter-spacing:.03em; }
  .inquire-meta a{ color:var(--gold-pale); border-bottom:1px solid var(--hairline-faint); }

  /* ---------- footer ---------- */
  footer{
    padding:50px 6vw 40px;
    border-top:1px solid var(--hairline-faint);
    display:flex; flex-direction:column; gap:28px;
  }
  .foot-row{
    display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap; gap:20px;
  }
  .foot-brand{ display:flex; align-items:center; gap:12px; }
  .foot-brand img{ height:24px; }
  .foot-brand span{ font-family:'Cormorant Garamond',serif; letter-spacing:.14em; color:var(--ivory-dim); font-size:.95rem; }
  footer .copy{ font-size:.75rem; color:var(--ivory-dim); letter-spacing:.03em; }
  footer .foot-links{ display:flex; flex-wrap:wrap; gap:14px 26px; }
  footer .foot-links a{ font-size:.72rem; letter-spacing:.1em; text-transform:uppercase; color:var(--ivory-dim); }
  footer .foot-links a:hover{ color:var(--gold-pale); }

  .foot-social{
    display:flex; justify-content:center; flex-wrap:wrap;
    gap:20px;
    padding-top:24px;
    border-top:1px solid var(--hairline-faint);
  }
  .foot-social a{
    display:flex; align-items:center; justify-content:center;
    width:34px; height:34px;
    color:var(--ivory-dim);
    transition:color .3s var(--ease), transform .3s var(--ease);
  }
  .foot-social a svg{ width:17px; height:17px; }
  .foot-social a:hover{ color:var(--gold-pale); transform:translateY(-2px); }

  @media (max-width:700px){
    footer{ padding:44px 6vw 36px; }
    .foot-row{ flex-direction:column; align-items:center; text-align:center; gap:22px; }
    .foot-links{ justify-content:center; gap:12px 20px; }
  }

  @media (max-width:820px){
    .nav-links{ display:none; }
    section{ padding:90px 6vw; }
  }

  @media (max-width:600px){
    nav{ padding:14px 4vw; }
    .nav-brand{ gap:8px; }
    .nav-brand img{ height:24px; }
    .nav-brand span{ font-size:.78rem; letter-spacing:.06em; }
    .nav-cta{ padding:9px 16px; font-size:.7rem; letter-spacing:.1em; }
  }

/* ---------- legal / content pages ---------- */
.legal-page{ padding-top:150px; }
.legal-page .section-inner{ max-width:760px; }
.legal-page h1{
  font-size:clamp(2.2rem,4.5vw,3rem);
  color:var(--gold-pale);
  margin-bottom:10px;
}
.legal-updated{
  font-size:.8rem; letter-spacing:.08em; color:var(--ivory-dim);
  margin-bottom:56px; text-transform:uppercase;
}
.legal-page h2{
  font-size:1.5rem; color:var(--gold-pale);
  margin-top:48px; margin-bottom:16px;
}
.legal-page p, .legal-page li{
  color:var(--ivory-dim); font-size:.96rem; margin-bottom:16px;
}
.legal-page ul{ padding-left:22px; margin-bottom:16px; }
.legal-page a.inline-link{ color:var(--gold-pale); border-bottom:1px solid var(--hairline); }
.legal-page a.inline-link:hover{ color:var(--gold-bright); }
.legal-note{
  border:1px solid var(--hairline-faint);
  background:rgba(201,154,63,.04);
  padding:20px 24px;
  font-size:.85rem;
  color:var(--ivory-dim);
  margin-bottom:48px;
}