/* Equity Carry Exchange, shared stylesheet.
   Palette matched to equitycarrygroup.com: brand-black #0B0B0F, accent purple
   #60409B, brand-gray #CFCFD6.

   One deliberate departure. ECG's #60409B measures 2.53:1 against the near-black
   ground, which fails even the large-text threshold, so it cannot carry type.
   It is used for fills, borders and glows, where it is the real brand colour,
   and lightened tints carry the text: #9B84D0 (6.18:1) for figures and
   #8A6FC4 (4.82:1) for small labels. Buttons are solid #60409B with white
   text, 7.77:1. */
:root {
  --navy:      #0B0B0F;
  --navy-2:    #1C1C21;
  --navy-3:    #141418;
  --gold:      #9B84D0;
  --gold-dim:  #8A6FC4;
  --gold-deep: #60409B;
  --cream:     #FFFFFF;
  --muted:     #9A9AA6;
  --line:      rgba(96,64,155,.42);
  --green:     #5FBF8A;
  --amber:     #E3A93C;
  --err:       #E8735F;
  --serif: 'Playfair Display', Georgia, serif;
  --sans: 'Inter', system-ui, -apple-system, sans-serif;
  /* Nav face, matched to equitycarrygroup.com. Only the masthead uses it: the
     serif headings elsewhere are a deliberate difference (section 24). */
  --nav: 'Outfit', ui-sans-serif, system-ui, sans-serif;
}
* { box-sizing:border-box; }
html, body { max-width:100%; overflow-x:hidden; }
body {
  margin:0; background:var(--navy); color:var(--cream);
  font-family:var(--sans); font-size:16.5px; line-height:1.62;
  -webkit-font-smoothing:antialiased; -webkit-text-size-adjust:100%;
}
img { max-width:100%; display:block; }
a { color:var(--gold); }
a:focus-visible, button:focus-visible, input:focus-visible {
  outline:2px solid var(--gold); outline-offset:3px;
}
.wrap { max-width:760px; margin:0 auto; padding:0 22px; }
.wrap.narrow { max-width:640px; }
.wrap.wide { max-width:1040px; }

/* ---------- masthead ---------- */
/* Matched to equitycarrygroup.com's nav: same ground, same hairline border,
   same blur, same Outfit / 11px / heavy / uppercase / .5em link treatment.
   Left relative rather than fixed, see the note on masthead() in build-site.mjs. */
.masthead {
  position:relative; z-index:5; border-bottom:1px solid rgba(255,255,255,.1);
  padding:12px 0; background:rgba(11,11,15,.9);
  backdrop-filter:blur(24px); -webkit-backdrop-filter:blur(24px);
  box-shadow:0 18px 40px -22px rgba(0,0,0,.9);
}
.mast-in { display:flex; align-items:center; justify-content:space-between; gap:16px; }
.wordmark { display:flex; align-items:center; gap:13px; text-decoration:none; min-width:0; }
.wordmark img { height:38px; width:auto; display:block; flex:none; }
.wordmark span {
  font-family:var(--nav); font-size:10px; font-weight:700;
  letter-spacing:.3em; text-transform:uppercase; color:var(--gold);
  padding-left:13px; border-left:1px solid rgba(255,255,255,.18); white-space:nowrap;
}
.mast-nav { display:flex; align-items:center; gap:46px; }
.mast-nav a {
  font-family:var(--nav); font-size:11px; font-weight:900;
  letter-spacing:.5em; text-transform:uppercase;
  color:rgba(255,255,255,.8); text-decoration:none; transition:color .15s ease;
  white-space:nowrap;
}
.mast-nav a:hover, .mast-nav a[aria-current] { color:#FFFFFF; }
.masthead.center .mast-in { justify-content:center; }

/* Two links only, so no hamburger. They tighten instead, and the longer of the
   two drops away before it can push the logo off the screen. */
@media (max-width:900px) {
  .mast-nav { gap:26px; }
  .mast-nav a { font-size:10px; letter-spacing:.3em; }
}
@media (max-width:640px) {
  .wordmark img { height:30px; }
  .wordmark span { font-size:9px; letter-spacing:.22em; padding-left:10px; }
  .mast-nav a:not([href="/"]) { display:none; }
}

/* ---------- type ---------- */
h1 { font-family:var(--serif); font-weight:600; letter-spacing:-.015em; text-wrap:balance; margin:0 0 18px; }
h2 { font-family:var(--serif); font-weight:600; font-size:clamp(24px,5.6vw,33px); line-height:1.2; margin:0 0 8px; text-wrap:balance; }
p { margin:0 0 16px; }
.muted { color:var(--muted); }
.kicker {
  font-size:11px; font-weight:600; letter-spacing:.18em; text-transform:uppercase;
  color:var(--gold-dim); margin:0 0 14px;
}
.eyebrow {
  display:inline-flex; align-items:center; gap:8px;
  font-size:11px; font-weight:600; letter-spacing:.18em; text-transform:uppercase;
  color:var(--gold); border:1px solid var(--line); border-radius:100px;
  padding:7px 15px; margin-bottom:20px; background:rgba(11,11,15,.55);
}
.dot { width:6px; height:6px; border-radius:50%; background:var(--gold); }

/* ---------- hero, 3D scroll motion ---------- */
.hero {
  position:relative; min-height:86vh; min-height:86svh;
  display:flex; align-items:flex-end; overflow:hidden;
  perspective:1100px; perspective-origin:50% 30%;
}
.hero-media { position:absolute; inset:-10% -5% -14%; z-index:0; will-change:transform; transform-origin:50% 40%; }
.hero-media img { width:100%; height:100%; object-fit:cover; }
.hero-scrim {
  position:absolute; inset:0; z-index:1;
  background:
    linear-gradient(180deg, rgba(11,11,15,.88) 0%, rgba(11,11,15,.52) 34%, rgba(11,11,15,.92) 78%, var(--navy) 100%),
    radial-gradient(130% 90% at 15% 85%, rgba(11,11,15,.85) 0%, transparent 66%);
}
.hero-inner { position:relative; z-index:2; width:100%; padding:110px 0 46px; will-change:transform,opacity; transform-style:preserve-3d; }
.hero h1 { font-size:clamp(31px,7.2vw,50px); line-height:1.12; text-shadow:0 2px 30px rgba(11,11,15,.65); }
.hero h1 em { font-style:italic; color:var(--gold); }
.lede { font-size:clamp(16.5px,4.2vw,19px); color:#E4E4EA; margin:0 0 28px; max-width:60ch; text-shadow:0 1px 18px rgba(11,11,15,.7); }

/* ---------- metric tiles ---------- */
.metrics {
  display:grid; grid-template-columns:repeat(2,1fr); gap:1px;
  background:var(--line); border:1px solid var(--line);
  border-radius:12px; overflow:hidden; margin-bottom:16px;
}
.metric { background:rgba(20,20,24,.92); padding:19px 17px; }
.metric .v { font-family:var(--serif); font-size:clamp(22px,6vw,30px); color:var(--gold); line-height:1.1; display:block; font-variant-numeric:tabular-nums; }
.metric .k { font-size:10.5px; font-weight:600; letter-spacing:.13em; text-transform:uppercase; color:var(--muted); margin-top:8px; display:block; }

/* ---------- the veil: locked figures ----------
   The real numbers are NOT in the markup. These are literal masks, because a
   CSS blur over live text is defeated by view-source. */
.veil { display:inline-flex; align-items:center; gap:7px; vertical-align:baseline; }
.veil-x { filter:blur(5px); opacity:.72; user-select:none; -webkit-user-select:none; }
.metric .veil-x { filter:blur(7px); }
.veil svg { flex:none; color:var(--gold); opacity:.9; }
.veil-note { display:flex; align-items:center; gap:8px; font-size:12.5px; color:var(--muted); margin:0 0 26px; }
.veil-note svg { flex:none; color:var(--gold); }

/* ---------- illustrative image disclosure ----------
   Rides on the image itself, because the caption that matters is the one nobody
   has to go looking for. On the hero it sits in the 46px gutter that
   .hero-inner's bottom padding already reserves, so it can never collide with
   the CTA above it. */
.illus {
  position:absolute; z-index:3; margin:0;
  display:inline-flex; align-items:center; gap:7px;
  font-size:11px; font-weight:500; line-height:1.3; color:var(--muted);
  background:rgba(11,11,15,.74); border:1px solid var(--line);
  border-radius:100px; padding:6px 13px;
  backdrop-filter:blur(7px); -webkit-backdrop-filter:blur(7px);
  pointer-events:none;
}
.illus svg { flex:none; color:var(--gold-dim); }

/* Top of the hero, not the bottom. The hero grows past the fold on a laptop,
   so a bottom-anchored note is a disclosure nobody reads. The masthead is in
   normal flow and .hero-inner reserves 110px of top padding, so this band is
   empty image at every width. */
.hero .illus { top:14px; right:18px; max-width:min(700px,calc(100% - 36px)); }

.card-img .illus {
  left:12px; bottom:11px;
  font-size:9.5px; font-weight:600; letter-spacing:.12em; text-transform:uppercase;
  padding:5px 11px;
}

@media (max-width:820px) {
  .hero .illus {
    left:16px; right:16px; top:12px;
    justify-content:center; text-align:center;
    font-size:10px; line-height:1.35; padding:6px 12px; border-radius:12px;
  }
}

/* ---------- already signed ----------
   Sits above the agreement on the NDA page. A returning signer needs this
   before they start filling in a form they do not need to fill in. */
.already {
  display:flex; align-items:center; justify-content:space-between;
  gap:16px; flex-wrap:wrap;
  border:1px solid var(--gold-deep); border-radius:12px;
  background:rgba(96,64,155,.13);
  padding:15px 18px; margin:0 0 24px;
}
.already strong { display:block; font-size:15px; color:#E4E4EA; }
.already span { display:block; font-size:13.5px; color:var(--muted); margin-top:3px; }
.already a {
  flex:none; white-space:nowrap;
  background:var(--gold-deep); color:#FFFFFF; text-decoration:none;
  font-size:14px; font-weight:600; border-radius:8px; padding:11px 18px;
}
.already a:hover { background:#6D4BAF; }
@media (max-width:560px) {
  .already { flex-direction:column; align-items:stretch; }
  .already a { text-align:center; }
}

/* ---------- signing capacity ----------
   Only rendered for agreement versions whose clauses require it. A radio group,
   because a single checkbox covering three different capacities is wide enough
   that everyone can tick it honestly. */
.capacity { border:1px solid var(--line); border-radius:12px; padding:16px 16px 6px; margin:0 0 18px; }
.capacity legend {
  padding:0 8px; font-size:11px; font-weight:700; letter-spacing:.12em;
  text-transform:uppercase; color:var(--gold-dim);
}
.cap-opt {
  display:flex; gap:11px; align-items:flex-start;
  padding:11px 12px; margin-bottom:8px; cursor:pointer;
  border:1px solid var(--line); border-radius:10px; background:rgba(20,20,24,.6);
}
.cap-opt:hover { border-color:var(--gold-deep); }
.cap-opt input { margin-top:3px; flex:none; accent-color:var(--gold-deep); }
.cap-opt strong { display:block; font-size:14px; font-weight:600; color:#E4E4EA; }
.cap-opt em { display:block; font-style:normal; font-size:12.5px; color:var(--muted); margin-top:3px; }
.cap-opt:has(input:checked) { border-color:var(--gold-deep); background:rgba(96,64,155,.14); }
.cap-named { margin:0 0 10px; padding:0 12px; }
.cap-named .fl { display:block; }
.capacity .hint { margin:2px 2px 10px; }

/* ---------- cta ---------- */
.cta {
  display:block; background:linear-gradient(180deg,#6D4BAF 0%,var(--gold-deep) 100%);
  color:#FFFFFF; font-family:inherit; font-weight:700; font-size:17px;
  text-align:center; text-decoration:none; border:0; padding:19px 24px; border-radius:10px;
  box-shadow:0 0 25px -5px rgba(96,64,155,.6); cursor:pointer;
  transition:transform .18s ease, box-shadow .18s ease;
}
.cta:hover:not(:disabled), .cta:focus-visible { transform:translateY(-2px); box-shadow:0 0 34px -3px rgba(96,64,155,.85); }
.cta:disabled { opacity:.55; cursor:default; transform:none; }
.cta small { display:block; font-weight:500; font-size:12.5px; opacity:.74; margin-top:4px; }
.cta-note { text-align:center; font-size:13px; color:var(--muted); margin-top:13px; }

/* ---------- sections + 3D scroll reveal ---------- */
section { padding:44px 0; border-top:1px solid rgba(255,255,255,.07); }
.reveal {
  opacity:0; transform:translate3d(0,30px,-60px) rotateX(7deg); transform-origin:50% 0%;
  transition:opacity .7s cubic-bezier(.22,.7,.3,1), transform .7s cubic-bezier(.22,.7,.3,1);
}
.reveal.in { opacity:1; transform:none; }

.panel {
  background:linear-gradient(160deg,var(--navy-2) 0%,var(--navy-3) 100%);
  border:1px solid var(--line); border-radius:14px; padding:26px 22px;
}
.panel h3 { font-family:var(--serif); font-weight:600; font-size:22px; margin:0 0 10px; color:var(--gold); }
.panel p:last-child { margin-bottom:0; }

/* ---------- spec table ---------- */
.spec-wrap { overflow-x:auto; }
.spec { width:100%; border-collapse:collapse; }
.spec tr { border-bottom:1px solid rgba(255,255,255,.08); }
.spec tr:last-child { border-bottom:0; }
.spec tr.open td { color:var(--gold); }
.spec th { text-align:left; font-weight:500; color:var(--muted); font-size:14px; padding:13px 0; width:47%; vertical-align:top; }
.spec td { text-align:right; font-weight:600; font-size:15px; padding:13px 0; vertical-align:top; font-variant-numeric:tabular-nums; }
.spec td .sub { display:block; font-weight:400; font-size:12.5px; color:var(--muted); margin-top:2px; }
.spec td .veil { justify-content:flex-end; }

/* ---------- upside list ---------- */
.upside { list-style:none; margin:0; padding:0; }
.upside li { padding:16px 0 16px 34px; border-bottom:1px solid rgba(255,255,255,.07); position:relative; }
.upside li:last-child { border-bottom:0; }
.upside li::before { content:""; position:absolute; left:4px; top:25px; width:15px; height:1px; background:var(--gold); }
.upside strong { display:block; font-weight:600; margin-bottom:3px; }
.upside span { color:var(--muted); font-size:15px; }

.fit { display:grid; gap:12px; }
.fit div { border:1px solid rgba(255,255,255,.1); border-radius:10px; padding:15px 17px; font-size:15.5px; }
.fit b { color:var(--gold); font-weight:600; }

.close-block { text-align:center; padding:52px 0 44px; }
.close-block h2 { margin-bottom:14px; }
.close-block p { max-width:50ch; margin-left:auto; margin-right:auto; }

footer { border-top:1px solid var(--line); padding:26px 0 40px; font-size:12.5px; color:var(--muted); line-height:1.6; }
footer p { margin:0 0 10px; }
footer .rule { color:#7C7C88; font-size:11.5px; }

/* ---------- deals index ---------- */
.idx-head { padding:56px 0 12px; }
.idx-head h1 { font-size:clamp(32px,6.6vw,48px); line-height:1.12; }
.idx-head .lede { text-shadow:none; }

.filters { display:flex; flex-wrap:wrap; gap:9px; padding:8px 0 30px; }
.filters button {
  font-family:inherit; font-size:12.5px; font-weight:600; letter-spacing:.06em;
  color:var(--muted); background:transparent; border:1px solid rgba(255,255,255,.15);
  border-radius:100px; padding:9px 16px; cursor:pointer; transition:all .15s ease;
}
.filters button:hover { color:var(--cream); border-color:var(--line); }
.filters button[aria-pressed="true"] { color:#FFFFFF; background:var(--gold-deep); border-color:var(--gold-deep); }

.deal-grid { display:grid; gap:18px; padding-bottom:20px; }
@media (min-width:760px) { .deal-grid { grid-template-columns:1fr 1fr; } }

.card {
  display:flex; flex-direction:column; overflow:hidden; text-decoration:none; color:inherit;
  border:1px solid rgba(255,255,255,.11); border-radius:14px; background:var(--navy-3);
  transition:transform .2s ease, border-color .2s ease;
}
.card:hover { transform:translateY(-3px); border-color:var(--line); }
.card-img { position:relative; aspect-ratio:16/9; background:var(--navy-2); overflow:hidden; }
.card-img img { width:100%; height:100%; object-fit:cover; }
.card-img::after { content:""; position:absolute; inset:0; background:linear-gradient(180deg,transparent 40%,rgba(11,11,15,.9) 100%); }
.card-body { padding:18px 19px 20px; display:flex; flex-direction:column; flex:1; }
.card h3 { font-family:var(--serif); font-weight:600; font-size:21px; line-height:1.24; margin:0 0 7px; }
.card .where { font-size:12px; font-weight:600; letter-spacing:.11em; text-transform:uppercase; color:var(--gold-dim); margin:0 0 10px; }
.card .blurb { font-size:14.5px; color:var(--muted); margin:0 0 16px; flex:1; }
.card-stats { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px 16px;
  border-top:1px solid rgba(255,255,255,.08); padding-top:13px; }
@media (min-width:760px) { .card-stats { grid-template-columns:repeat(4,minmax(0,auto)); justify-content:start; gap:0 20px; } }
.card-stats div span { display:block; }
.card-stats .v { font-family:var(--serif); font-size:17px; color:var(--gold); font-variant-numeric:tabular-nums; }
.card-stats .k { font-size:9.5px; font-weight:600; letter-spacing:.12em; text-transform:uppercase; color:var(--muted); margin-top:3px; }

.badge {
  position:absolute; top:12px; left:12px; z-index:2;
  font-size:10.5px; font-weight:700; letter-spacing:.14em; text-transform:uppercase;
  border-radius:100px; padding:6px 13px;
}
.badge.available { background:var(--gold-deep); color:#FFFFFF; }
.badge.under_contract { background:rgba(227,169,60,.16); color:var(--amber); border:1px solid rgba(227,169,60,.45); }
.badge.sold { background:rgba(95,191,138,.15); color:var(--green); border:1px solid rgba(95,191,138,.45); }

.card.is-sold .card-img img { filter:grayscale(1) brightness(.6); }
.card.is-sold h3 { color:var(--muted); }

.empty { border:1px dashed rgba(255,255,255,.15); border-radius:12px; padding:34px 22px; text-align:center; color:var(--muted); font-size:14.5px; }

@media (min-width:620px) {
  .metrics { grid-template-columns:repeat(4,1fr); }
  .fit { grid-template-columns:1fr 1fr; }
  .hero-inner { padding:150px 0 56px; }
}
@media (prefers-reduced-motion: reduce) {
  .reveal { opacity:1; transform:none; transition:none; }
  .hero-media, .hero-inner { transform:none !important; opacity:1 !important; }
  .cta, .card { transition:none; }
}

/* ---------- NDA page ---------- */
.step { font-size:11px; font-weight:600; letter-spacing:.18em; text-transform:uppercase; color:var(--gold); margin:0 0 12px; }
.nda-top { padding:34px 0 8px; }
.nda-top h1 { font-size:clamp(27px,6.6vw,36px); line-height:1.18; margin-bottom:12px; }
.sub { color:#E4E4EA; margin:0 0 24px; }
.doc {
  background:var(--navy-3); border:1px solid var(--line); border-radius:12px;
  padding:20px 18px; max-height:340px; overflow-y:auto;
  font-size:14px; line-height:1.62; color:#CFCFD6; -webkit-overflow-scrolling:touch;
}
.doc h2 { font-family:var(--serif); font-size:18px; color:var(--cream); margin:0 0 4px; font-weight:600; }
.doc .ver { font-size:11.5px; color:var(--muted); margin:0 0 16px; letter-spacing:.04em; }
.doc h3 { font-size:13px; font-weight:700; color:var(--gold); margin:18px 0 5px; }
.doc p { margin:0 0 10px; }
.doc .witness { margin-top:16px; color:var(--cream); }
.scrollnote { font-size:12.5px; color:var(--muted); margin:9px 0 26px; text-align:center; }

.row { display:grid; gap:13px; margin-bottom:13px; }
@media (min-width:520px) { .row.two { grid-template-columns:1fr 1fr; } }
.fl { display:block; font-size:12px; font-weight:600; letter-spacing:.1em; text-transform:uppercase; color:var(--muted); margin-bottom:6px; }
input[type=text], input[type=email], input[type=tel] {
  width:100%; background:var(--navy-2); color:var(--cream);
  border:1px solid rgba(255,255,255,.14); border-radius:9px;
  padding:14px; font-family:inherit; font-size:16px; /* 16px stops iOS zoom */
  transition:border-color .15s ease;
}
input:focus { outline:none; border-color:var(--gold); }
input::placeholder { color:#6A6A76; }
.sig input { font-family:var(--serif); font-size:21px; }
.hint { font-size:12.5px; color:var(--muted); margin:7px 0 0; }
/* .consent is a <label> too, so reset the uppercase field-label type or the
   agreement text renders in all caps. */
.consent {
  display:flex; gap:12px; align-items:flex-start;
  border:1px solid rgba(255,255,255,.13); border-radius:10px;
  padding:15px 16px; margin:20px 0 8px; cursor:pointer;
  text-transform:none; letter-spacing:normal; font-weight:400; font-size:inherit; color:inherit;
}
.consent input { flex:none; width:20px; height:20px; margin:1px 0 0; accent-color:var(--gold); }
.consent span { font-size:14px; line-height:1.55; color:#E4E4EA; }
.err { display:none; border:1px solid rgba(232,115,95,.4); background:rgba(232,115,95,.1);
       color:#F2B5A9; border-radius:9px; padding:12px 14px; font-size:14px; margin:16px 0 0; }
.err.show { display:block; }
.foot { font-size:12px; color:#7C7C88; line-height:1.6; margin:22px 0 44px; }

/* ---------- room ---------- */
.state { padding:70px 0; text-align:center; color:var(--muted); }
.state h1 { font-family:var(--serif); font-size:27px; color:var(--cream); margin:0 0 10px; font-weight:600; }
.granted {
  display:inline-flex; align-items:center; gap:9px;
  border:1px solid rgba(95,191,138,.34); background:rgba(95,191,138,.09);
  color:#A8DEC1; border-radius:100px; padding:8px 16px;
  font-size:12px; font-weight:600; letter-spacing:.11em; text-transform:uppercase; margin-bottom:22px;
}
.granted svg { color:var(--green); }
.room-head { padding:38px 0 6px; }
h1.deal { font-size:clamp(29px,6.8vw,42px); line-height:1.14; margin:0 0 8px; }
.addr { color:var(--muted); margin:0 0 4px; font-size:15.5px; }
.figs { width:100%; border-collapse:collapse; }
.figs tr { border-bottom:1px solid rgba(255,255,255,.08); }
.figs tr:last-child { border-bottom:0; }
.figs th { text-align:left; font-weight:500; color:var(--muted); font-size:14px; padding:13px 0; width:50%; vertical-align:top; }
.figs td { text-align:right; font-weight:600; font-size:16px; color:var(--gold); padding:13px 0; vertical-align:top; font-variant-numeric:tabular-nums; }
.figs td .sub { display:block; font-weight:400; font-size:12.5px; color:var(--muted); margin-top:2px; }
.docs { list-style:none; margin:0; padding:0; display:grid; gap:11px; }
.docs li { display:flex; align-items:center; gap:14px; border:1px solid rgba(255,255,255,.11); border-radius:10px; padding:15px 16px; }
.docs .ico { flex:none; color:var(--gold); opacity:.75; }
.docs .t { flex:1 1 auto; min-width:0; }
.docs .t strong { display:block; font-weight:600; font-size:15.5px; }
.docs .t span { color:var(--muted); font-size:13px; }
.docs .pend { flex:none; font-size:11px; font-weight:600; letter-spacing:.1em; text-transform:uppercase;
              color:var(--muted); border:1px solid rgba(255,255,255,.15); border-radius:100px; padding:5px 11px; }
.pdf {
  display:inline-flex; align-items:center; gap:10px;
  background:linear-gradient(180deg,#6D4BAF 0%,var(--gold-deep) 100%);
  color:#FFFFFF; font-weight:700; font-size:15.5px; text-decoration:none;
  border-radius:10px; padding:15px 20px; box-shadow:0 5px 22px rgba(96,64,155,.2);
  transition:transform .16s ease;
}
.pdf:hover, .pdf:focus-visible { transform:translateY(-2px); }
.wm { border:1px solid var(--line); background:var(--navy-3); border-radius:11px;
      padding:16px 17px; font-size:13.5px; color:#CFCFD6; display:flex; gap:12px; align-items:flex-start; }
.wm svg { flex:none; margin-top:2px; color:var(--gold); }
.wm strong { color:var(--cream); }

/* document rows that are real links, not placeholders */
.docs a.doclink {
  display:flex; align-items:center; gap:14px; width:100%;
  text-decoration:none; color:inherit;
}
.docs li:has(a.doclink) { padding:0; }
.docs a.doclink { padding:15px 16px; border-radius:10px; transition:background .15s ease; }
.docs a.doclink:hover, .docs a.doclink:focus-visible { background:rgba(96,64,155,.07); }
.pend.open { color:#FFFFFF; background:var(--gold-deep); border-color:var(--gold-deep); font-weight:700; }
.pend.restricted { color:#A8DEC1; border-color:rgba(95,191,138,.45); background:rgba(95,191,138,.1); margin-right:8px; }

/* ---------- next step: qualification then booking ---------- */
.paths { display:grid; gap:12px; margin-bottom:20px; }
@media (min-width:640px) { .paths { grid-template-columns:1fr 1fr; } }
.paths .path {
  display:block; text-align:left; font-family:inherit; cursor:pointer;
  background:var(--navy-3); border:1px solid rgba(255,255,255,.13);
  border-radius:12px; padding:18px 19px; color:var(--cream);
  transition:border-color .16s ease, transform .16s ease;
}
.paths .path:hover { border-color:var(--line); transform:translateY(-2px); }
.paths .path[aria-pressed="true"] { border-color:var(--gold); background:linear-gradient(160deg,var(--navy-2),var(--navy-3)); }
.paths .path strong { display:block; font-family:var(--serif); font-size:19px; font-weight:600; margin-bottom:6px; }
.paths .path span { display:block; color:var(--muted); font-size:14px; line-height:1.5; }

.qbox { border:1px solid var(--line); background:var(--navy-3); border-radius:12px; padding:22px 20px; }
.qrow { padding-bottom:18px; margin-bottom:18px; border-bottom:1px solid rgba(255,255,255,.07); }
.qrow:last-of-type { border-bottom:0; }
.qq { font-size:15.5px; font-weight:600; margin:0 0 11px; }
.qopts { display:flex; flex-wrap:wrap; gap:8px; }
.qopt {
  font-family:inherit; font-size:14px; cursor:pointer;
  background:transparent; color:#E4E4EA; border:1px solid rgba(255,255,255,.16);
  border-radius:100px; padding:9px 15px; transition:all .14s ease;
}
.qopt:hover { border-color:var(--line); color:var(--cream); }
.qopt[aria-pressed="true"] { background:var(--gold-deep); color:#FFFFFF; border-color:var(--gold-deep); font-weight:600; }
.qbox .cta { margin-top:4px; }
.bookh { font-family:var(--serif); font-size:22px; font-weight:600; color:var(--gold); margin:0 0 8px; }
#actingfor {
  width:100%; background:var(--navy-2); color:var(--cream); font-family:inherit; font-size:16px;
  border:1px solid rgba(255,255,255,.14); border-radius:9px; padding:13px;
}

/* ---------- returning signer bar ---------- */
.access-bar {
  display:flex; align-items:center; gap:11px; flex-wrap:wrap;
  background:rgba(95,191,138,.09); border-bottom:1px solid rgba(95,191,138,.3);
  padding:11px 22px; font-size:13.5px; color:#A8DEC1;
}
.access-bar .ab-dot { width:7px; height:7px; border-radius:50%; background:var(--green); flex:none; }
.access-bar .ab-text { flex:1 1 auto; min-width:0; }
.access-bar strong { color:var(--cream); }
.access-bar .ab-out {
  flex:none; font-family:inherit; font-size:12px; color:var(--muted); cursor:pointer;
  background:transparent; border:1px solid rgba(255,255,255,.18); border-radius:100px; padding:5px 12px;
}
.access-bar .ab-out:hover { color:var(--cream); border-color:var(--line); }

/* ---------- next step, the room's primary action ----------
   Deliberately the loudest thing on the page: gold rule, lifted panel and a
   warm ground, so it reads as an action rather than another content section. */
.nextstep {
  border-top:0; margin:26px 0 8px; padding:26px 24px 24px;
  background:
    radial-gradient(120% 140% at 0% 0%, rgba(96,64,155,.14) 0%, transparent 60%),
    linear-gradient(160deg, var(--navy-2) 0%, var(--navy-3) 100%);
  border:1px solid rgba(96,64,155,.42);
  border-radius:16px;
  box-shadow:0 10px 40px rgba(0,0,0,.35), inset 0 1px 0 rgba(96,64,155,.18);
  position:relative; overflow:hidden;
}
.nextstep::before {
  content:""; position:absolute; top:0; left:0; right:0; height:3px;
  background:linear-gradient(90deg, var(--gold) 0%, var(--gold-dim) 45%, transparent 100%);
}
.nextstep h2 { color:var(--cream); }
.nextstep .paths .path {
  background:rgba(11,11,15,.55);
  border:1px solid rgba(96,64,155,.3);
}
.nextstep .paths .path:hover { border-color:var(--gold); background:rgba(11,11,15,.8); }
.nextstep .paths .path strong { color:var(--gold); }
.nextstep .paths .path[aria-pressed="true"] {
  border-color:var(--gold); background:rgba(96,64,155,.12);
}
.nextstep .paths .path[aria-pressed="true"] strong { color:var(--cream); }
.nextstep .qbox { background:rgba(11,11,15,.6); border-color:rgba(96,64,155,.3); }