/* ============================================================
   Layout components: header, footer, sections, pages
   ============================================================ */

/* ---- Section heading ---- */
.sec-head { max-width: 760px; }
.sec-head.center { margin-inline: auto; text-align: center; }
.sec-title { font-size: clamp(2rem, 4.4vw, 3.4rem); margin: 18px 0 0; }
.sec-title .line { display: block; }
.sec-lead { margin-top: 20px; }
.sec-head.on-ink .sec-title { color: var(--cream); }
.sec-head.on-ink .sec-lead { color: rgba(246,241,231,.66); }

/* ---- Stat ---- */
.stat-n {
  font-family: var(--serif);
  font-weight: 600;
  font-size: clamp(2.4rem, 5vw, 3.4rem);
  line-height: 1;
  letter-spacing: -.01em;
  color: var(--gold-deep);
  background: none;
  -webkit-text-fill-color: var(--gold-deep);
  font-variant-numeric: lining-nums tabular-nums;
  font-feature-settings: "lnum" 1, "tnum" 1;
  display: inline-block;
}
.stat.on-ink .stat-n { color: var(--gold-bright); -webkit-text-fill-color: var(--gold-bright); }
.stat { text-align: center; }
.stat-l { margin-top: 10px; font-size: .9rem; color: var(--muted); letter-spacing: .01em; font-feature-settings: "lnum" 1, "tnum" 1; }
.stat.on-ink .stat-l { color: rgba(246,241,231,.62); }

/* ============================================================
   Header
   ============================================================ */
.hdr { position: sticky; top: 0; z-index: 90; }

/* Unified header: topbar and main share the same ink background — one continuous bar */
.hdr { background: #16120B; }
.topbar {
  position: relative;
  background: transparent;
  color: var(--cream);
}
.topbar-in {
  display: grid;
  grid-template-columns: 1fr auto 1fr;
  align-items: center;
  height: 40px;
  gap: 28px;
}
.topbar-item { display: inline-flex; align-items: center; gap: 8px; font-size: 12px; letter-spacing: .045em; color: rgba(246,241,231,.72); font-weight: 500; }
.topbar-item svg { width: 13px; height: 13px; color: var(--gold-bright); flex-shrink: 0; }
.topbar-item a { color: inherit; transition: color .2s; display: inline-flex; align-items: center; gap: 6px; }
.topbar-item a:hover { color: var(--gold-bright); }
.tb-left { justify-self: start; }
.tb-center {
  justify-self: center;
  font-family: var(--caps);
  letter-spacing: .18em;
  text-transform: uppercase;
  font-size: 10.5px;
  color: rgba(231,214,174,.55);
  white-space: nowrap;
  font-weight: 400;
}
.tb-center svg { width: 14px; height: 14px; }
.tb-right { justify-self: end; }
.tb-phone {
  font-weight: 600;
  letter-spacing: .03em;
  font-size: 12.5px;
  color: var(--cream);
  padding: 5px 14px;
  border: 1px solid rgba(231,214,174,.22);
  border-radius: 999px;
  background: rgba(231,214,174,.04);
  transition: color .25s, border-color .25s, background .25s, box-shadow .25s;
}
.tb-phone:hover { color: var(--gold-bright); border-color: rgba(201,162,75,.6); background: rgba(231,214,174,.08); box-shadow: 0 8px 18px -10px rgba(201,162,75,.4); }
.tb-phone svg { color: var(--gold-bright); }

@media (max-width: 1080px) {
  .tb-center { display: none; }
  .topbar-in { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 720px) {
  .tb-left { display: none; }
  .topbar-in { grid-template-columns: 1fr; }
  .tb-right { justify-self: center; gap: 10px; font-size: 12px; }
}
@media (max-width: 480px) {
  .tb-right .tb-sep, .tb-right a:last-child { display: none; }
}

.hdr-main {
  background: transparent;
  border-bottom: none;
  transition: box-shadow .3s, background .3s;
  position: relative;
}
/* subtle hairline between utility row and main row — same family, low contrast */
.hdr-main::before {
  content: "";
  position: absolute; left: var(--gut); right: var(--gut); top: 0; height: 1px;
  background: linear-gradient(90deg, transparent, rgba(231,214,174,.10) 30%, rgba(231,214,174,.14) 50%, rgba(231,214,174,.10) 70%, transparent);
  pointer-events: none;
}
.hdr.scrolled { box-shadow: 0 8px 30px -16px rgba(0,0,0,.6); }
.hdr.scrolled .hdr-main::before { opacity: 0; }
.hdr-row { display: flex; align-items: center; gap: 32px; height: 88px; }
.hdr-actions { gap: 20px; }
@media (max-width: 720px) {
  .hdr-row { height: 76px; gap: 14px; }
  .brand .monogram-img { transform: scale(.85); transform-origin: left center; }
  .wordmark.compact .wm-1 { font-size: .78rem; }
  .wordmark.compact .wm-2 { font-size: .68rem; letter-spacing: .1em; }
}
@media (max-width: 480px) {
  .wordmark.compact { display: none; }
}
.brand { display: flex; align-items: center; gap: 14px; flex-shrink: 0; }
.brand .monogram-img { transition: transform .3s ease; }
.brand:hover .monogram-img { transform: translateY(-1px) scale(1.03); }

.nav-desk { display: flex; align-items: center; gap: 6px; margin-left: 8px; }
.navlink { position: relative; padding: 9px 16px; border-radius: 100px; font-weight: 600; font-size: .95rem; color: rgba(246,241,231,.82); transition: color .25s, background .25s; }
.navlink:hover { color: var(--cream); background: rgba(231,214,174,.1); }
.navlink.active { color: var(--gold-bright); }
.navlink.active::after { content:""; position:absolute; left: 16px; right: 16px; bottom: 2px; height: 2px; background: linear-gradient(135deg,#E9D49A 0%,#C9A24B 30%,#9C7530 55%,#D8BC78 78%,#A9802F 100%); border-radius: 2px; }

.hdr-actions { display: flex; align-items: center; gap: 16px; margin-left: auto; }
.lang { display: inline-flex; align-items: center; gap: 6px; font-family: var(--caps); font-size: .82rem; letter-spacing: .1em; color: rgba(246,241,231,.5); }
.lang button { background: none; border: none; padding: 4px 2px; color: rgba(246,241,231,.5); font: inherit; letter-spacing: inherit; transition: color .2s; }
.lang button.on { color: var(--gold-bright); }
.lang button:hover { color: var(--cream); }
.lang.big { font-size: 1.1rem; }

.hdr-phone { display: inline-flex; align-items: center; gap: 7px; font-weight: 600; font-size: .92rem; color: var(--cream); transition: color .2s; }
.hdr-phone svg { color: var(--gold-bright); }
.hdr-phone:hover { color: var(--gold-bright); }
.hdr-cta { padding: 11px 22px; font-size: .9rem; }

.burger { display: none; width: 42px; height: 42px; border: 1px solid rgba(231,214,174,.28); border-radius: 10px; background: transparent; flex-direction: column; align-items: center; justify-content: center; gap: 5px; }
.burger span { width: 18px; height: 1.8px; background: var(--cream); border-radius: 2px; transition: transform .3s, opacity .3s; }
.burger.x span:nth-child(1) { transform: translateY(6.8px) rotate(45deg); }
.burger.x span:nth-child(2) { opacity: 0; }
.burger.x span:nth-child(3) { transform: translateY(-6.8px) rotate(-45deg); }

.mobile-menu { display: none; }

@media (max-width: 980px) {
  .nav-desk, .hdr-phone, .hdr-cta { display: none; }
  .burger { display: flex; }
  .mobile-menu {
    display: block; overflow: hidden; max-height: 0; background: #16120b;
    border-bottom: 1px solid rgba(231,214,174,.12); transition: max-height .4s ease;
  }
  .mobile-menu.open { max-height: 420px; }
  .m-link { display: block; padding: 16px var(--gut); font-family: var(--serif); font-size: 1.5rem; font-weight: 500; color: var(--cream); border-bottom: 1px solid rgba(231,214,174,.1); }
  .m-link.active { color: var(--gold-bright); }
  .m-foot { display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 18px var(--gut) 26px; flex-wrap: wrap; }
}

/* ============================================================
   Footer — minimal luxury, centered composition
   ============================================================ */
.ftr {
  background-color: #100D08;
  background-image:
    /* very subtle warm side vignettes — left & right edges only */
    radial-gradient(35% 80% at 0% 50%, rgba(201,162,75,.05) 0%, rgba(201,162,75,0) 70%),
    radial-gradient(35% 80% at 100% 50%, rgba(201,162,75,.05) 0%, rgba(201,162,75,0) 70%),
    linear-gradient(180deg, #100D08 0%, #16120B 100%);
  color: var(--cream);
  padding-block: clamp(24px, 3vw, 40px) clamp(16px, 2vw, 22px);
  text-align: center;
  position: relative;
}
.ftr-shell {
  display: flex;
  flex-direction: column;
  align-items: center;
  max-width: 580px;
}

/* Emblem + wordmark stack */
.ftr-mark {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 12px;
  margin-bottom: 18px;
  animation: ftrIn .8s cubic-bezier(.22,1,.36,1) both;
}
.ftr-mark .wordmark .wm-1 { font-size: 1rem; }
.ftr-mark .wordmark .wm-2 { font-size: .92rem; letter-spacing: .14em; }
/* drop-shadow removed for scroll perf */
.ftr-mark .wordmark { align-items: center; }
.ftr-mark .wordmark .wm-1,
.ftr-mark .wordmark .wm-2 { text-align: center; }

/* CTA — a refined serif invitation, gold underline */
.ftr-invite {
  display: inline-flex;
  align-items: center;
  gap: 12px;
  font-family: var(--serif);
  font-style: italic;
  font-size: 1.05rem;
  font-weight: 500;
  color: var(--gold-bright);
  letter-spacing: .005em;
  padding: 2px 4px 4px;
  border-bottom: 1px solid rgba(201,162,75,.4);
  transition: color .3s ease, border-color .3s ease, letter-spacing .3s ease;
  margin-bottom: 20px;
}
.ftr-invite svg { transition: transform .35s cubic-bezier(.22,1,.36,1); }
.ftr-invite:hover {
  color: var(--cream);
  border-color: var(--gold-bright);
  letter-spacing: .02em;
}
.ftr-invite:hover svg { transform: translateX(6px); }

/* Inline nav — Marcellus caps, tracked */
.ftr-nav {
  display: inline-flex;
  align-items: center;
  flex-wrap: wrap;
  justify-content: center;
  gap: 20px;
  font-family: var(--caps);
  text-transform: uppercase;
  letter-spacing: .2em;
  font-size: .72rem;
  margin-bottom: 14px;
}
.ftr-nav a {
  color: rgba(246,241,231,.72);
  transition: color .25s;
  position: relative;
}
.ftr-nav a:hover { color: var(--gold-bright); }
.ftr-nav a + a::before {
  content: "";
  position: absolute; left: -13px; top: 50%;
  width: 3px; height: 3px;
  border-radius: 50%;
  background: rgba(231,214,174,.28);
  transform: translateY(-50%);
}

/* Contact micro-row */
.ftr-contact {
  display: inline-flex;
  align-items: center;
  flex-wrap: wrap;
  justify-content: center;
  gap: 18px;
  font-size: .85rem;
  color: rgba(246,241,231,.6);
  margin-bottom: 22px;
}
.ftr-contact a {
  color: inherit;
  transition: color .2s;
  position: relative;
}
.ftr-contact a:hover { color: var(--gold-bright); }
.ftr-contact > * + *::before {
  content: "";
  position: absolute; left: -13px; top: 50%;
  width: 3px; height: 3px;
  border-radius: 50%;
  background: rgba(231,214,174,.22);
  transform: translateY(-50%);
}
.ftr-contact > * { position: relative; }

/* Copyright — whisper */
.ftr-copy {
  font-size: .68rem;
  color: rgba(246,241,231,.28);
  letter-spacing: .04em;
}

@keyframes ftrIn {
  from { opacity: 0; transform: translateY(12px); }
  to   { opacity: 1; transform: none; }
}

@media (max-width: 640px) {
  .ftr-contact, .ftr-nav { gap: 16px; }
  .ftr-nav a + a::before, .ftr-contact > * + *::before { left: -10px; }
  .ftr-invite { font-size: 1.05rem; margin-bottom: 36px; }
  .ftr-contact { font-size: .82rem; }
}

@media (max-width: 820px) { .ftr-top { grid-template-columns: 1fr 1fr; gap: 36px; } .ftr-brand { grid-column: 1 / -1; } }
@media (max-width: 520px) { .ftr-top { grid-template-columns: 1fr; } }

/* ============================================================
   Float bar
   ============================================================ */
.floatbar { position: fixed; right: 20px; bottom: 20px; z-index: 80; display: flex; flex-direction: column; gap: 10px; opacity: 0; transform: translateY(14px) scale(.9); pointer-events: none; transition: opacity .3s, transform .3s; }
.floatbar.show { opacity: 1; transform: none; pointer-events: auto; }
.fb-call, .fb-top { width: 50px; height: 50px; border-radius: 50%; display: grid; place-items: center; border: none; box-shadow: var(--sh); }
.fb-call { background: linear-gradient(135deg,#E9D49A 0%,#C9A24B 30%,#9C7530 55%,#D8BC78 78%,#A9802F 100%); color: #2a1f08; }
.fb-top { background: var(--ink); color: var(--cream); }
.fb-top .up { transform: rotate(-90deg); }
.fb-call:hover, .fb-top:hover { transform: translateY(-2px); }

@media (max-width: 520px) { .floatbar { right: 14px; bottom: 14px; } }