/* Coherence by DocuLedger — shared site chrome */
:root {
  --bg: #0e0d0b; --bg-2: #14120f; --bg-3: #1a1714;
  --panel: #15130f; --panel-2: #1c1814; --rule: #2a241c; --rule-2: #3a3226;
  --ink: #f0e8d4; --ink-2: #c8bda0; --ink-3: #8a8068; --ink-4: #5d5544;
  --paper: #f4efe6; --paper-2: #ede5d5; --paper-ink: #16130d; --paper-ink-2:#524736; --paper-rule:#d4c8ad;
  --amber: #d89a3a; --amber-2: #e8ac4d; --amber-ink: #b57a1c; --amber-deep:#8a5a12;
  --amber-wash:rgba(216,154,58,.12);
  --validated: #7da96b; --uploaded: #6e89c4; --pending: #c78a4a; --overdue: #b9593e; --waived: #8a8578;
  --display: "Instrument Serif", "Cormorant Garamond", Georgia, serif;
  --ui: "Inter", -apple-system, BlinkMacSystemFont, "Helvetica Neue", Helvetica, Arial, sans-serif;
  --mono: "JetBrains Mono", ui-monospace, "SF Mono", Consolas, monospace;
  --maxw: 1280px; --gutter: clamp(20px, 4vw, 64px);
}
* { box-sizing: border-box; }
html, body { margin: 0; padding: 0; }
html { -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; scroll-behavior: smooth; }
body { font-family: var(--ui); font-size: 16px; line-height: 1.55; color: var(--ink); background: var(--bg); text-rendering: optimizeLegibility; }
::selection { background: var(--amber); color: #1a1306; }
body::before {
  content: ""; position: fixed; inset: 0; pointer-events: none; z-index: 1;
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='200' height='200'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2' stitchTiles='stitch'/><feColorMatrix values='0 0 0 0 0.95 0 0 0 0 0.85 0 0 0 0 0.65 0 0 0 .04 0'/></filter><rect width='100%25' height='100%25' filter='url(%23n)'/></svg>");
  mix-blend-mode: overlay;
}
main, header, footer { position: relative; z-index: 2; }

/* Skip-to-content — hidden until keyboard focus */
.skip { position: absolute; left: -9999px; top: auto; width: 1px; height: 1px; overflow: hidden; z-index: 100; }
.skip:focus { left: 16px; top: 16px; width: auto; height: auto; padding: 12px 18px; background: var(--amber); color: #1a1306; font-family: var(--ui); font-size: 14px; font-weight: 500; border-radius: 2px; outline: 2px solid var(--ink); outline-offset: 2px; }
h1, h2, h3, h4 { font-family: var(--display); font-weight: 400; letter-spacing: -0.018em; margin: 0; color: var(--ink); }
h1 { font-size: clamp(56px, 8vw, 128px); line-height: 0.94; letter-spacing: -0.03em; }
h2 { font-size: clamp(40px, 5.5vw, 84px); line-height: 1.0; letter-spacing: -0.025em; }
h3 { font-size: clamp(26px, 2.6vw, 38px); line-height: 1.15; }
h4 { font-size: 22px; line-height: 1.2; }
p { margin: 0 0 1em; }
a { color: inherit; text-decoration: none; }
em { font-style: italic; }
.eyebrow { font-family: var(--mono); font-size: 11px; font-weight: 500; letter-spacing: 0.18em; text-transform: uppercase; color: var(--ink-3); }
.eyebrow .dot { display: inline-block; width: 5px; height: 5px; border-radius: 50%; background: var(--amber); margin-right: 12px; vertical-align: 2px; }
.container { max-width: var(--maxw); margin: 0 auto; padding: 0 var(--gutter); }
section { padding: clamp(80px, 11vw, 160px) 0; position: relative; }
section.tight { padding: clamp(48px, 6vw, 88px) 0; }

/* Header */
header.site { position: sticky; top: 0; z-index: 50; background: rgba(14,13,11,.78); backdrop-filter: saturate(120%) blur(14px); -webkit-backdrop-filter: saturate(120%) blur(14px); border-bottom: 1px solid transparent; transition: border-color .3s ease, background .3s ease; }
header.site.scrolled { border-bottom-color: var(--rule); background: rgba(14,13,11,.92); }
header.site .inner { max-width: var(--maxw); margin: 0 auto; padding: 18px var(--gutter); display: flex; align-items: center; gap: 40px; }
.brand { display: flex; flex-direction: column; gap: 3px; flex-shrink: 0; line-height: 1; }
.brand .wordmark { font-family: var(--display); font-size: 26px; line-height: 1; letter-spacing: -0.022em; color: var(--ink); }
.brand .by { font-family: var(--mono); font-size: 9px; letter-spacing: 0.18em; color: var(--ink-3); text-transform: uppercase; }
nav.primary { display: flex; gap: 32px; margin-left: 16px; }
nav.primary a { font-size: 14px; color: var(--ink-2); position: relative; padding: 4px 0; transition: color .2s ease; }
nav.primary a:hover, nav.primary a.active { color: var(--ink); }
nav.primary a::after { content: ""; position: absolute; left: 0; right: 0; bottom: -4px; height: 1px; background: var(--amber); transform: scaleX(0); transform-origin: left; transition: transform .2s ease; }
nav.primary a:hover::after, nav.primary a.active::after { transform: scaleX(1); }
.header-right { margin-left: auto; display: flex; align-items: center; gap: 22px; }
.signin { font-size: 14px; color: var(--ink-2); }
.signin:hover { color: var(--ink); }
.btn { display: inline-flex; align-items: center; gap: 10px; font-size: 14px; font-weight: 500; padding: 12px 20px; border-radius: 2px; border: 1px solid transparent; cursor: pointer; transition: all .18s ease; white-space: nowrap; font-family: var(--ui); }
.btn-primary { background: var(--amber); color: #1a1306; border-color: var(--amber); }
.btn-primary:hover { background: var(--amber-2); border-color: var(--amber-2); }
.btn-primary .arrow { transition: transform .2s ease; }
.btn-primary:hover .arrow { transform: translateX(3px); }
.btn-ghost { background: transparent; color: var(--ink-2); border-color: var(--rule-2); }
.btn-ghost:hover { color: var(--ink); border-color: var(--ink-2); }
.btn-paper { background: var(--paper-ink); color: var(--paper); border-color: var(--paper-ink); }
.btn-paper:hover { background: #000; }
@media (max-width: 880px) { nav.primary { display: none; } .signin { display: none; } }

/* Page hero (common) */
.phero { padding: clamp(72px, 12vw, 160px) 0 clamp(48px, 6vw, 88px); position: relative; overflow: hidden; }
.phero::after { content: ""; position: absolute; inset: -20% 30% 0 -20%; background: radial-gradient(ellipse at 30% 30%, rgba(216,154,58,.14), rgba(216,154,58,.04) 40%, transparent 60%); pointer-events: none; z-index: 0; }
.phero .container { position: relative; z-index: 1; }
.phero .eyebrow-row { margin-bottom: 36px; display: flex; align-items: center; gap: 16px; }
.phero .eyebrow-row .line { height: 1px; flex: 1; max-width: 140px; background: var(--rule-2); }
.phero h1 { margin-bottom: 40px; max-width: 18ch; }
.phero h1 .accent { color: var(--amber); font-style: italic; }
.phero-lede { font-size: clamp(17px, 1.5vw, 20px); line-height: 1.55; color: var(--ink-2); max-width: 56ch; }
.phero-lede strong { color: var(--ink); font-weight: 400; }

/* CTA trio (close sections) */
.close-ctas { text-align: center; padding: clamp(90px, 14vw, 180px) 0; position: relative; overflow: hidden; }
.close-ctas::before { content: ""; position: absolute; inset: 0; background: radial-gradient(ellipse at center, rgba(216,154,58,.1), transparent 55%); pointer-events: none; }
.close-ctas .container { position: relative; }
.close-ctas h2 { max-width: 20ch; margin: 0 auto 36px; }
.close-ctas .ctas { display: inline-flex; gap: 14px; flex-wrap: wrap; justify-content: center; }

/* Footer */
footer.site { background: #0a0907; color: var(--ink-2); padding: 80px 0 28px; position: relative; border-top: 1px solid var(--rule); }
.foot-top { display: grid; grid-template-columns: 1.6fr 1fr 1fr 1fr 1fr; gap: 40px; padding-bottom: 56px; border-bottom: 1px solid var(--rule); }
.foot-brand .wordmark { font-family: var(--display); font-size: 44px; color: var(--ink); line-height: 1; letter-spacing: -0.022em; }
.foot-brand .by { font-family: var(--mono); font-size: 11px; color: var(--ink-3); letter-spacing: 0.14em; text-transform: uppercase; margin-top: 6px; }
.foot-brand .tagline-small { font-family: var(--display); font-style: italic; color: var(--amber); margin-top: 18px; font-size: 17px; }
.foot-brand .tagline-small .sep { color: var(--ink-4); font-style: normal; font-family: var(--ui); font-size: 0.7em; }
.foot-brand p { max-width: 36ch; margin-top: 20px; color: var(--ink-3); font-size: 13px; line-height: 1.6; }
.foot-col h5 { font-family: var(--mono); font-size: 10px; letter-spacing: 0.16em; text-transform: uppercase; color: var(--ink-4); margin: 0 0 18px; font-weight: 500; }
.foot-col ul { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 12px; }
.foot-col a { font-size: 14px; color: var(--ink-2); transition: color .15s ease; }
.foot-col a:hover { color: var(--amber); }
.foot-bottom { padding-top: 24px; display: flex; justify-content: space-between; gap: 20px; flex-wrap: wrap; font-family: var(--mono); font-size: 11px; color: var(--ink-4); letter-spacing: 0.08em; }
.foot-bottom a { color: var(--ink-3); transition: color .15s ease; }
.foot-bottom a:hover { color: var(--amber); }
@media (max-width: 980px) { .foot-top { grid-template-columns: 1fr 1fr; } }
@media (max-width: 520px) { .foot-top { grid-template-columns: 1fr; } }

/* Reveal on scroll */
.reveal-anim { opacity: 0; transform: translateY(24px); transition: opacity .9s ease, transform .9s ease; }
.reveal-anim.in { opacity: 1; transform: translateY(0); }
.reveal-anim.in-instant { opacity: 1 !important; transform: none !important; transition: none !important; }
@media (prefers-reduced-motion: reduce) { .reveal-anim { opacity: 1; transform: none; transition: none; } }