/* Summit — design overrides, loaded after the compiled Tailwind CSS (_next/static/css/91d4….css).
   DA: charcoal black, bone white, Playfair Display bold + italic, monochrome, misty mountains + glowing emblem.
   Edit freely; tools/rebrand.py copies this file to /summit.css. */
:root { color-scheme: dark; --summit-bg: #121211; --summit-bone: #ece9e2; }
html { background: var(--summit-bg); }
body {
  background-color: var(--summit-bg);
  background-image:
    radial-gradient(900px 420px at 72% -140px, rgba(236, 233, 226, .10), transparent 70%),
    url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='180' height='180'><filter id='g'><feTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2' stitchTiles='stitch'/><feColorMatrix values='0 0 0 0 0.9  0 0 0 0 0.9  0 0 0 0 0.88  0 0 0 0.05 0'/></filter><rect width='100%' height='100%' filter='url(%23g)'/></svg>");
  background-attachment: fixed, scroll;
}
::selection { background: var(--summit-bone); color: var(--summit-bg); }

/* mountain backdrop behind the top of every page (the banner, minus its headline).
   A pseudo-element, not a node: extra DOM inside <body> would break React hydration. .summit-sky = static build. */
body { position: relative; }
body::before, .summit-sky {
  content: ""; position: absolute; left: 0; right: 0; top: 0; z-index: 0; pointer-events: none;
  height: min(82vh, 780px);
  background:
    linear-gradient(90deg, var(--summit-bg) 0%, rgba(18, 18, 17, .96) 26%, rgba(18, 18, 17, .55) 55%, rgba(18, 18, 17, .18) 100%),
    linear-gradient(180deg, rgba(18, 18, 17, .55) 0%, rgba(18, 18, 17, 0) 30%, rgba(18, 18, 17, .35) 60%, var(--summit-bg) 100%),
    url(/brand/summit-hero.jpg) right top / auto 100% no-repeat;
  opacity: .9;
}
body:has(.summit-sky)::before { display: none; }
@media (max-width: 1023px) {
  body::before, .summit-sky { height: 460px; background-position: 0 0, 0 0, 62% top; opacity: .55; }
}
/* inner pages: quieter sky (home = the page with the market section) */
body:not(:has(#market))::before, body:not(:has(#market)) .summit-sky { opacity: .45; height: min(60vh, 560px); }

/* header: the SUMMIT wordmark is wider than PEAK was */
header a[aria-label="Summit home"] { flex-shrink: 0; }
header a[aria-label="Summit home"] > span { font-size: 22px; letter-spacing: .05em; }
header nav[aria-label="Main"] { gap: 1.15rem; }
header nav[aria-label="Main"] a { font-size: 13.5px; }
.summit-topbar span, body > div > .border-b:first-child span { white-space: nowrap; }
@media (max-width: 420px) { .summit-topbar > div, body > div > .border-b:first-child > div { font-size: 9px; letter-spacing: .1em; } }

/* header / footer emblem (the mark is ~2:1, not square) */
.summit-mark, header a[aria-label="Summit home"] img { height: 26px !important; width: auto !important; display: block; }
.summit-mark-lg, footer img[src="/brand/summit-mark.png"] { height: 30px !important; width: auto !important; }

/* hero */
#main section:first-of-type h1.display { font-weight: 700; letter-spacing: -.02em; text-shadow: 0 2px 24px rgba(0, 0, 0, .55); }
#main section:first-of-type h1.display .italic { font-weight: 700; }
#main section:first-of-type > div:first-child p { text-shadow: 0 1px 12px rgba(0, 0, 0, .6); }

/* collisions created by inverting the palette (accent became bone white) */
.bg-lime-400.text-ink { color: var(--summit-bg); }
.bg-forest-900 .bg-lime-400.text-ink { color: var(--summit-bone); }   /* "fees pay the listing" sticker: black disc, bone text */
header .btn-primary, header .btn-lime { white-space: nowrap; }
.bg-forest-900 .text-lime-400, .bg-forest-900 .hover\:text-lime-400:hover { color: var(--summit-bg); }
.bg-forest-900 .bg-lime-400 { background-color: var(--summit-bg); }
.bg-forest-900 .border-lime-400 { border-color: var(--summit-bg); }
.bg-forest-900 { box-shadow: 0 30px 80px -30px rgba(236, 233, 226, .25), 0 0 0 1px rgba(236, 233, 226, .35); }
.btn-lime { box-shadow: 0 0 0 1px rgba(236, 233, 226, .2), 0 8px 30px -12px rgba(236, 233, 226, .45); }
.btn-lime:hover { box-shadow: 0 0 0 1px rgba(236, 233, 226, .4), 0 10px 36px -10px rgba(236, 233, 226, .6); }
header { background-color: rgba(18, 18, 17, .82) !important; }
img { color-scheme: light; }

/* mobile navigation panel (built by summit.js; the Next.js one was client-rendered) */
.summit-mobile-nav[hidden] { display: none; }
.summit-mobile-nav {
  position: absolute; left: 0; right: 0; top: 100%; display: grid; gap: 0;
  padding: 10px 20px 20px; background: rgba(18, 18, 17, .98); border-bottom: 1px solid var(--line-strong);
}
.summit-mobile-link { display: block; padding: 13px 4px; font-size: 16px; color: var(--summit-bone); border-bottom: 1px solid var(--line); }
.summit-mobile-link:last-of-type { border-bottom: 0; }
.summit-mobile-cta { margin-top: 14px; justify-self: start; }
@media (min-width: 1280px) { .summit-mobile-nav { display: none; } }

/* header buttons: slimmer, in proportion with the 68px bar */
header .btn-primary, header .btn-lime {
  min-height: 34px !important; height: 34px; padding: 0 14px !important;
  font-size: 13px !important; font-weight: 600; line-height: 1; gap: 6px;
  border-radius: 9999px;
}
header .btn-lime { border-radius: 8px; }
header .btn-primary > span:first-child { width: 5px; height: 5px; }
header a[aria-label="Summit on X"] { width: 34px; height: 34px; }
header button[aria-label="Menu"] { width: 38px; height: 38px; }