/* JIGSAW INVEST — dealing room at night. Dark baize, brass quote frames, cream ledgers. */

:root {
  --felt:#1E2420;
  --quoted:#EFE8D6;
  --brass:#C9A24B;
  --slate:#2E3630;
  --cream:#F5F0E1;
  --claret:#7A3038;
  --floor:#151A16;
}

*, *::before, *::after { box-sizing:border-box; }

html, body { margin:0; padding:0; }

body {
  font-size:16px;
  line-height:1.6;
  background-color:var(--felt);
  color:var(--quoted);
  font-family:Georgia, Times, "Times New Roman", serif;
  min-height:100vh;
  overflow-x:hidden;
}

img { max-width:100%; }
a { color:inherit; text-decoration:none; }
h1, h2, h3 { font-weight:normal; }

.site-body {
  display:flex;
  flex-direction:column;
  min-height:100vh;
}
.site-body main { flex:1 1 auto; }

.no-js .js-reveal { opacity:1 !important; transform:none !important; }

/* ============ NAVIGATION — LOT LOCKET ============ */
.lotlocket {
  position:sticky;
  top:0;
  z-index:50;
  background-color:var(--felt);
  border-bottom:1px solid var(--floor);
}

.lotlocket-bar {
  position:relative;
  z-index:1;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:20px;
  max-width:1200px;
  margin:0 auto;
  padding:14px 24px;
}

.brand-plate {
  display:inline-flex;
  align-items:center;
  gap:12px;
  background-color:var(--brass);
  color:var(--floor);
  padding:8px 18px;
  border-radius:4px;
  letter-spacing:1px;
}
.brand-name { font-size:18px; font-weight:bold; font-family:Arial, Helvetica, sans-serif; }

.keystone-glyph {
  width:20px;
  height:22px;
  background-color:var(--floor);
  border-radius:3px;
  position:relative;
}
.keystone-glyph::after {
  content:"";
  position:absolute;
  right:4px;
  top:9px;
  width:7px;
  height:9px;
  background-color:var(--brass);
  border-radius:0 3px 0 0;
}

.locket-nav {
  display:flex;
  align-items:center;
  gap:26px;
}

.locket-tag {
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-width:84px;
  padding:7px 16px;
  background-color:var(--cream);
  color:var(--floor);
  border:2px solid var(--brass);
  border-radius:999px;
  font-family:Arial, Helvetica, sans-serif;
  font-size:14px;
  letter-spacing:0.5px;
  position:relative;
}
.locket-tag::before {
  content:"";
  position:absolute;
  top:-9px;
  left:50%;
  transform:translateX(-50%);
  width:2px;
  height:8px;
  background-color:var(--brass);
}
.tag-services, .tag-services::before { transform:none; margin-top:6px; }
.tag-contact { margin-top:10px; }

.chip-cta {
  display:inline-flex;
  align-items:center;
  background-color:var(--brass);
  color:var(--floor);
  padding:9px 18px;
  border-radius:4px;
  font-family:Arial, Helvetica, sans-serif;
  font-weight:bold;
  font-size:14px;
}

.bar-rail {
  height:5px;
  background-color:var(--brass);
  display:flex;
  align-items:center;
  justify-content:flex-end;
  gap:14px;
  padding:0 26px;
}
.rail-notch {
  width:8px;
  height:8px;
  background-color:var(--felt);
  border:2px solid var(--brass);
  border-radius:50%;
  margin-top:-3px;
}

.nav-toggle {
  display:none;
  flex-direction:column;
  justify-content:center;
  gap:5px;
  width:44px;
  height:40px;
  background:transparent;
  border:none;
  cursor:pointer;
  padding:0 8px;
}
.nav-toggle span {
  display:block;
  height:3px;
  background-color:var(--brass);
  border-radius:3px;
}

/* ============ HERO — BAIZE TABLE ============ */
.baizetable {
  max-width:1200px;
  margin:0 auto;
  padding:0 24px;
}

.baize-deck {
  height:360px;
  background-color:var(--felt);
  border:2px solid var(--floor);
  border-radius:10px;
  margin-top:30px;
  position:relative;
  display:flex;
  align-items:center;
  justify-content:center;
  gap:40px;
  overflow:hidden;
  box-shadow:inset 0 0 0 6px var(--slate);
}

.quote-board {
  display:flex;
  gap:18px;
  padding:20px;
  background-color:var(--slate);
  border:4px solid var(--brass);
  border-radius:8px;
}
.quote-tile {
  display:flex;
  flex-direction:column;
  align-items:center;
  gap:6px;
  width:120px;
  padding:16px 10px;
  background-color:var(--cream);
  color:var(--floor);
  border:2px solid var(--brass);
  border-radius:6px;
}
.tile-ticker { font-family:Arial, Helvetica, sans-serif; font-weight:bold; }
.tile-mark { font-size:22px; color:#2E6B3F; }
.tile-mark.red { color:var(--claret); }
.tile-value { font-size:12px; font-family:Arial, Helvetica, sans-serif; }

.tape-slot {
  position:absolute;
  left:-14px;
  top:26px;
  width:180px;
  transform:rotate(-8deg);
}
.ticker-tape {
  background-color:var(--cream);
  color:var(--claret);
  border:2px solid var(--brass);
  border-radius:4px;
  padding:6px 10px;
  font-family:Arial, Helvetica, sans-serif;
  font-size:12px;
  letter-spacing:1px;
  white-space:nowrap;
}

.lamp-base {
  position:absolute;
  right:30px;
  top:24px;
  width:14px;
  height:110px;
  background-color:var(--brass);
  border-radius:4px 4px 0 0;
}
.lamp-base::before {
  content:"";
  position:absolute;
  top:-8px;
  left:50%;
  transform:translateX(-50%);
  width:34px;
  height:12px;
  background-color:var(--brass);
  border-radius:6px;
}
.lamp-light {
  position:absolute;
  right:-8px;
  top:110px;
  width:120px;
  height:60px;
  background-color:#C8C081;
  opacity:1;
  clip-path:polygon(50% 0, 100% 100%, 0 100%);
}

.review-desk {
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:30px;
  background-color:var(--slate);
  border-radius:8px;
  padding:46px 48px;
  margin-top:26px;
  position:relative;
}
.desk-block { max-width:760px; }

.eyebrow {
  margin:0 0 8px;
  font-family:Arial, Helvetica, sans-serif;
  font-size:14px;
  letter-spacing:4px;
  color:var(--brass);
  text-transform:uppercase;
}

.held-title {
  display:flex;
  align-items:center;
  gap:18px;
  margin:0 0 16px;
  font-size:42px;
  line-height:1.15;
  color:var(--quoted);
  text-align:center;
  font-weight:bold;
}
.held-title.legaltitle { text-align:center; justify-content:center; }

.seal-mark {
  display:inline-block;
  width:54px;
  height:54px;
  background-color:var(--brass);
  border-radius:50%;
  position:relative;
  flex:0 0 auto;
}
.seal-mark::after {
  content:"";
  position:absolute;
  inset:10px;
  border:3px solid var(--floor);
  border-radius:50%;
  background:repeating-linear-gradient(45deg,var(--floor) 0 3px,transparent 3px 7px);
}

.lead-copy {
  margin:0;
  font-size:19px;
  color:#E7E2D4;
}

.desk-actions {
  display:flex;
  gap:16px;
  margin-top:26px;
  justify-content:center;
}
.btn-solid {
  display:inline-block;
  background-color:var(--brass);
  color:var(--floor);
  padding:12px 24px;
  border-radius:4px;
  font-family:Arial, Helvetica, sans-serif;
  font-weight:bold;
}
.btn-line {
  display:inline-block;
  background-color:transparent;
  color:var(--cream);
  border:2px solid var(--cream);
  padding:10px 22px;
  border-radius:4px;
  font-family:Arial, Helvetica, sans-serif;
  font-weight:bold;
}

.statement-stack {
  position:relative;
  width:150px;
  height:120px;
  flex:0 0 auto;
}
.statement-stack .sheet {
  position:absolute;
  display:block;
  background-color:var(--cream);
  color:var(--floor);
  font-family:Arial, Helvetica, sans-serif;
  font-size:11px;
  letter-spacing:1px;
  padding:12px;
  border:2px solid var(--brass);
  border-radius:3px;
  width:120px;
  height:58px;
}
.sheet-a { top:0; left:4px; transform:rotate(-6deg); }
.sheet-b { top:28px; left:18px; transform:rotate(2deg); }
.sheet-c { top:56px; left:2px; transform:rotate(-2deg); }

.kick-strip {
  display:flex;
  align-items:center;
  justify-content:center;
  gap:0;
  background-color:var(--floor);
  border-radius:6px;
  margin-top:26px;
  padding:18px 0;
  text-align:center;
}
.stat-inline { flex:1; }
.stat-inline strong {
  display:block;
  font-family:Arial, Helvetica, sans-serif;
  font-size:34px;
  color:var(--cream);
}
.stat-inline span { color:#C9BFA6; font-size:14px; }
.stat-sep {
  width:2px;
  height:44px;
  background-color:#C9A24B;
  opacity:1;
}

/* shared band used as full-width darker slabs */
.statement-bank {
  margin:60px auto 30px;
  max-width:1200px;
  padding:40px 24px;
  text-align:center;
}
.bank-figure {
  margin:0;
  font-family:Arial, Helvetica, sans-serif;
  font-size:88px;
  color:var(--brass);
  line-height:1;
}
.bank-line {
  margin:10px 0 6px;
  font-size:30px;
  color:var(--quoted);
  font-family:Arial, Helvetica, sans-serif;
}
.bank-pledge {
  margin:16px auto 0;
  max-width:820px;
  font-size:19px;
  color:#D9D6C6;
}

/* ============ POSITION ROWS ============ */
.positionrows {
  max-width:1200px;
  margin:0 auto;
  padding:0 24px;
}

.position-sheet {
  display:flex;
  align-items:center;
  gap:22px;
  background-color:var(--cream);
  color:var(--floor);
  border-radius:4px;
  padding:26px 26px 26px 30px;
  margin-bottom:22px;
  position:relative;
  border:1px solid #0F1311;
}
.pos-off-a { margin-left:0; margin-right:40px; }
.pos-off-b { margin-left:40px; margin-right:0; }

.corner-clip {
  position:absolute;
  top:-6px;
  width:20px;
  height:14px;
  background-color:var(--brass);
  border-radius:2px;
}
.corner-clip.left { left:14px; }
.corner-clip.right { right:14px; }

.pos-tag {
  flex:0 0 auto;
  width:74px;
  text-align:center;
  background-color:var(--brass);
  color:var(--floor);
  font-family:Arial, Helvetica, sans-serif;
  font-weight:bold;
  font-size:13px;
  padding:8px 4px;
  border-radius:4px;
}

.pos-body { flex:1 1 auto; }
.pos-body h2 {
  margin:0 0 8px;
  font-size:24px;
  font-weight:bold;
  color:var(--floor);
}
.pos-body p { margin:0 0 12px; color:#3A3323; }
.details-link {
  display:inline-block;
  color:var(--slate);
  font-family:Arial, Helvetica, sans-serif;
  font-size:13px;
  border-bottom:2px solid var(--brass);
  padding-bottom:2px;
}
.details-link:hover { color:var(--floor); }

.hold-chip {
  flex:0 0 auto;
  background-color:var(--slate);
  color:var(--cream);
  font-family:Arial, Helvetica, sans-serif;
  font-size:13px;
  letter-spacing:1px;
  padding:8px 16px;
  border-radius:999px;
}
.hold-chip.down-tick { background-color:var(--claret); color:#F7E7E0; }
.hold-chip.chip-fund { background-color:var(--floor); color:var(--brass); }
.hold-chip.chip-cash { border:2px solid var(--brass); background-color:transparent; color:var(--floor); }

/* ============ SETTLEMENT FLOW ============ */
.settlementflow {
  max-width:1200px;
  margin:30px auto 0;
  padding:36px 24px;
}
.flow-caption {
  text-align:center;
  font-family:Arial, Helvetica, sans-serif;
  letter-spacing:3px;
  color:var(--brass);
  text-transform:uppercase;
  font-size:15px;
  margin:0 0 30px;
}
.flow-track {
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:14px;
  position:relative;
  background-color:#1A201B;
  border-radius:8px;
  padding:34px 26px;
}
.flow-track::before {
  content:"";
  position:absolute;
  top:70px;
  left:8%;
  right:8%;
  height:3px;
  background-color:#B4A277;
  border-top:2px dashed #8A7A4A;
}
.flow-station {
  position:relative;
  z-index:1;
  flex:1;
  display:flex;
  flex-direction:column;
  align-items:center;
  text-align:center;
}
.seal-disc {
  width:90px;
  height:90px;
  border-radius:50%;
  background-color:var(--brass);
  color:var(--floor);
  display:flex;
  align-items:center;
  justify-content:center;
  font-family:Arial, Helvetica, sans-serif;
  font-weight:bold;
  border:3px solid #8A7A4A;
  margin-bottom:14px;
}
.seal-disc.final { background-color:var(--brass); box-shadow:0 0 0 4px var(--slate) inset; }
.flow-station p { margin:0; font-size:14px; color:#D9D2BC; }

.bell-post {
  display:flex;
  flex-direction:column;
  align-items:center;
  margin-top:8px;
  gap:6px;
}
.bell-sphere {
  width:22px;
  height:22px;
  border-radius:50%;
  background-color:var(--brass);
  position:relative;
}
.bell-caption { font-family:Arial, Helvetica, sans-serif; font-size:12px; color:var(--brass); letter-spacing:2px; }

/* ============ ACCENT STRIP ============ */
.accent-strip {
  max-width:1200px;
  margin:36px auto 0;
  background-color:var(--brass);
  color:var(--floor);
  border-radius:6px;
  padding:36px 30px;
  text-align:center;
}
.cycle-mark {
  display:inline-block;
  margin-bottom:12px;
  border:2px solid var(--floor);
  border-radius:4px;
  padding:6px 14px;
  font-family:Arial, Helvetica, sans-serif;
  font-weight:bold;
  font-size:13px;
  letter-spacing:2px;
}
.accent-line {
  font-size:20px;
  max-width:820px;
  margin:0 auto 20px;
  color:var(--floor);
}
.btn-inverse-dark {
  display:inline-block;
  background-color:var(--floor);
  color:var(--brass);
  padding:12px 26px;
  border-radius:4px;
  font-family:Arial, Helvetica, sans-serif;
  font-weight:bold;
}
.btn-inverse-dark:hover { color:var(--cream); }

/* ============ FOOTER — LEDGER DRAWER ============ */
.ledgerdrawer {
  background-color:var(--floor);
  margin-top:70px;
  position:relative;
}
.drawer-band {
  max-width:1200px;
  margin:0 auto;
  padding:26px 24px 6px;
  display:flex;
  align-items:flex-end;
  gap:36px;
  position:relative;
  z-index:1;
}
.drawer {
  display:inline-flex;
  align-items:center;
  justify-content:center;
  background-color:var(--slate);
  border:3px solid var(--brass);
  border-bottom:none;
  border-radius:6px 6px 0 0;
  padding:14px 20px;
  min-width:130px;
  position:relative;
}
.drawer-label {
  font-family:Arial, Helvetica, sans-serif;
  font-size:12px;
  letter-spacing:1px;
  color:var(--cream);
}
.ring-pull {
  position:absolute;
  top:-12px;
  left:50%;
  transform:translateX(-50%);
  width:18px;
  height:14px;
  border:2px solid var(--brass);
  border-bottom:none;
  border-radius:10px 10px 0 0;
}
.motto {
  margin:0 0 6px auto;
  font-family:Arial, Helvetica, sans-serif;
  letter-spacing:4px;
  color:var(--brass);
  font-size:15px;
}

.link-cols {
  max-width:1200px;
  margin:0 auto;
  padding:20px 24px;
  display:grid;
  grid-template-columns:repeat(3, 1fr);
  gap:20px;
  position:relative;
  z-index:1;
}
.foot-col { display:flex; flex-direction:column; gap:8px; }
.col-title {
  margin:0 0 6px;
  font-family:Arial, Helvetica, sans-serif;
  font-size:13px;
  letter-spacing:2px;
  color:var(--brass);
  text-transform:uppercase;
}
.foot-col a { color:#DEDBD2; font-size:15px; }
.foot-col a:hover { color:var(--brass); }
.link-cols.legalcols { max-width:820px; }

.base-plate {
  background-color:var(--cream);
  color:var(--floor);
  border-radius:8px 8px 0 0;
  margin:0 24px;
  padding:20px 24px;
  text-align:center;
  position:relative;
  z-index:1;
}
.co-line {
  margin:0 0 4px;
  font-family:Arial, Helvetica, sans-serif;
  font-weight:bold;
  font-size:18px;
  letter-spacing:1px;
}
.co-addr { margin:0; font-size:15px; color:#3A3323; }
.co-contact { margin:6px 0; font-size:15px; }
.co-contact a { color:#2E3630; text-decoration:underline; }
.copyright {
  margin:8px 0 0;
  color:#8A7A4A;
  font-size:13px;
}
.copyright.brass { color:var(--brass); }

/* ============ NO-JS SAFE REVEAL ============ */
.js-reveal { opacity:1; transform:none; }
body.js-enabled .js-reveal {
  opacity:0;
  transform:translateY(18px);
  transition:opacity .7s ease, transform .7s ease;
}
body.js-enabled .js-reveal.in-view, body.js-enabled .js-reveal.force-view {
  opacity:1;
  transform:none;
}

/* ============ SERVICES PAGE ============ */
.services-head {
  max-width:900px;
  margin:0 auto;
  padding:70px 24px 10px;
  text-align:center;
}
.services-main .held-title { justify-content:center; margin-bottom:12px; }

.service-list {
  max-width:1100px;
  margin:20px auto 0;
  padding:0 24px;
}
.service-row {
  display:flex;
  gap:28px;
  background-color:var(--cream);
  color:var(--floor);
  border-radius:6px;
  padding:34px 34px 30px 0;
  margin-bottom:24px;
  position:relative;
  border:1px solid #0F1311;
}
.service-index {
  flex:0 0 120px;
  display:flex;
  align-items:center;
  justify-content:center;
  font-family:Arial, Helvetica, sans-serif;
  font-size:52px;
  background-color:var(--brass);
  color:var(--floor);
  border-radius:6px 0 0 6px;
  margin-right:0;
  position:relative;
}
.service-copy { flex:1 1 auto; padding-right:18px; }
.service-copy h2 {
  margin:0 0 14px;
  font-size:28px;
  font-weight:bold;
  color:var(--floor);
}
.service-copy p {
  color:#3A3323;
  font-size:16.5px;
  margin:0 0 14px;
}
.service-copy p:last-child { margin-bottom:0; }

.process-overview {
  max-width:1200px;
  margin:40px auto 0;
  padding:36px 24px;
}
.bell-post.pb { align-items:center; }

/* ============ CONTACT PAGE ============ */
.contact-head {
  max-width:820px;
  margin:0 auto;
  padding:70px 24px 16px;
  text-align:center;
}

.contact-grid {
  max-width:1080px;
  margin:0 auto;
  padding:0 24px;
  display:grid;
  grid-template-columns:1.5fr 1fr;
  gap:34px;
}

.contact-form-panel {
  background-color:var(--cream);
  color:var(--floor);
  border-radius:8px;
  padding:36px;
  border:1px solid #0F1311;
}
.contact-form-panel h2 { margin:0 0 22px; font-size:28px; font-weight:bold; color:var(--floor); }

.contact-form { display:flex; flex-direction:column; }
.contact-form label {
  font-family:Arial, Helvetica, sans-serif;
  font-size:14px;
  color:var(--slate);
  margin:0 0 6px;
}
.field-input, .field-textarea {
  width:100%;
  margin-bottom:18px;
  padding:12px 14px;
  border:2px solid #B4A989;
  border-radius:4px;
  background-color:#FDFBF3;
  color:var(--floor);
  font-size:16px;
  font-family:Arial, Helvetica, sans-serif;
  box-sizing:border-box;
}
.field-input:focus, .field-textarea:focus { outline:none; border-color:var(--brass); }
.btn-fieldsend { align-self:flex-start; border:none; cursor:pointer; font-size:16px; }
.form-note { margin:14px 0 0; font-size:15px; color:#3A3323; min-height:20px; }

.contact-side { display:flex; flex-direction:column; gap:22px; }
.co-card {
  background-color:var(--slate);
  border:2px solid var(--brass);
  border-radius:8px;
  padding:20px 22px;
}
.co-card .col-title { margin:0 0 10px; }
.co-strong {
  margin:0 0 6px;
  font-family:Arial, Helvetica, sans-serif;
  font-weight:bold;
  font-size:17px;
  color:var(--quoted);
}
.co-detail { margin:4px 0; color:#DEDBD2; }
.co-detail a { color:var(--brass); text-decoration:underline; }

.faq-panel {
  max-width:820px;
  margin:50px auto 0;
  padding:0 24px;
}
.faq-item {
  background-color:#1B211C;
  border:2px solid var(--slate);
  border-radius:6px;
  padding:20px 24px;
  margin-bottom:14px;
}
.faq-item h3 {
  margin:0 0 8px;
  font-family:Arial, Helvetica, sans-serif;
  color:var(--brass);
  font-size:18px;
}
.faq-item p { margin:0; color:#E2DED2; }

/* contact / legal shared inner content */
.content-window {
  max-width:1200px;
  margin:0 auto;
  padding:0 24px;
}

/* ============ MOBILE ============ */
@media (max-width: 920px) {
  .nav-toggle { display:flex; }
  .locket-nav {
    position:absolute;
    left:0;
    right:0;
    top:100%;
    flex-direction:column;
    align-items:stretch;
    gap:14px;
    background-color:var(--floor);
    border:2px solid var(--brass);
    border-radius:0 0 8px 8px;
    padding:20px;
    display:none;
  }
  body.js-enabled .locket-nav.open, .locket-nav.open { display:flex; }
  .locket-tag, .chip-cta { align-self:center; width:70%; text-align:center; }
  .locket-tag::before { display:none; }
  .tag-services, .tag-contact { margin-top:0; }

  .baize-deck { height:auto; flex-direction:column; padding:30px 18px; gap:20px; }
  .quote-board { flex-wrap:wrap; justify-content:center; }
  .tape-slot, .lamp-base { display:none; }
  .review-desk, .statement-stack { flex-direction:column; }
  .review-desk { padding:34px 26px; text-align:center; }
  .held-title { flex-direction:column; }
  .seal-mark { order:-1; }
  .statement-stack { display:none; }

  .position-sheet { flex-direction:column; align-items:flex-start; gap:14px; }
  .pos-off-a, .pos-off-b { margin-left:0; margin-right:0; }
  .hold-chip { align-self:flex-start; }

  .kick-strip { flex-direction:column; gap:12px; }
  .stat-sep { width:60%; height:2px; }

  .flow-track { flex-direction:column; gap:26px; }
  .flow-track::before { display:none; }
  .flow-station { flex-direction:row; justify-content:flex-start; text-align:left; gap:18px; }
  .seal-disc { margin-bottom:0; width:64px; height:64px; }

  .link-cols { grid-template-columns:1fr; }
  .contact-grid { grid-template-columns:1fr; }
  .service-row { flex-direction:column; gap:0; padding:0 0 26px; }
  .service-index { flex:0 0 auto; width:100%; padding:20px 0; border-radius:6px 6px 0 0; }
  .service-copy { padding:24px 22px 0; }
  .drawer-band { flex-wrap:wrap; align-items:center; justify-content:center; }
  .motto { margin:0 auto; }
}