/* Yunlue Color System
   Warm paper, Yunlue blue, quiet teal and one restrained copper accent
   This layer keeps the existing motion and page structure intact. */
:root {
  --paper: #f2efe9;
  --warm: #e8e3d9;
  --ink: #1c2326;
  --muted: #66706b;
  --brand: #064b6a;
  --line: #cbd0c7;
  --dark: #073944;
  --yun-teal: #2f6b73;
  --yun-sage: #8fa9a1;
  --yun-copper: #b7835e;
  --yun-mist: #e6ece7;
  --yun-sand: #f8f6f0;
  --yun-deep: #052f3b;
}

html { background: var(--paper); }
body {
  background: var(--paper);
  color: var(--ink);
  text-rendering: optimizeLegibility;
}

h1, h2, h3 { color: var(--ink); font-weight: 400; }
p { color: var(--muted); }
a, .text-link { color: var(--brand); }

.nav-shell {
  background: rgba(242, 239, 233, .94);
  border-bottom: 1px solid rgba(6, 75, 106, .09);
  box-shadow: 0 8px 24px -22px rgba(7, 57, 68, .55);
}
.nav-links { border-top-color: rgba(47, 107, 115, .36); }
.nav-links a { color: #334248; }
.nav-links a:hover,
.nav-links a[aria-current="location"] { color: var(--brand); }
.nav-follow-indicator { background: var(--brand); }

.hero { background: var(--yun-deep); }
.hero-shade {
  background: linear-gradient(112deg, rgba(5, 38, 49, .68) 0%, rgba(6, 52, 61, .37) 52%, rgba(6, 52, 61, .12) 100%);
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
}
.hero-shade:after { opacity: .07; }
.hero .label { color: #e7eee8; }
.hero h1 { color: #f5f2eb; }
.hero .intro { color: #f5f2eb; }
.scroll-cue {
  background: rgba(242, 239, 233, .94);
  color: var(--brand);
  border: 1px solid rgba(255, 255, 255, .28);
}

.clients-section {
  background: var(--yun-sand);
  border-top: 1px solid rgba(47, 107, 115, .08);
}
.clients-section:before {
  background: linear-gradient(rgba(47, 107, 115, .08), transparent);
}
.trust-heading .label { color: var(--yun-teal); }
.trust-heading h2 { color: var(--ink); }
.trust-heading > p { color: #6d7771; }
.client-filters {
  border-bottom-color: rgba(47, 107, 115, .28);
  border-top-color: rgba(47, 107, 115, .14);
}
.client-filters button { color: #737e77; }
.client-filters button[aria-pressed="true"] {
  color: var(--brand);
  border-color: var(--brand);
}
.client-grid {
  background: #d7ded7;
  border-color: #d7ded7;
}
.client-mark {
  background: rgba(255, 255, 255, .78);
  border-bottom-color: rgba(47, 107, 115, .17);
}
.client-mark:hover { background: #fffdf8; }
.client-mark span { color: #61706a; }
.client-toggle { color: var(--brand); }

.history-section {
  background: var(--warm);
  border-top-color: rgba(255, 255, 255, .8);
  border-bottom-color: rgba(47, 107, 115, .16);
}
.history-section:before {
  background: radial-gradient(ellipse at 74% 12%, rgba(255, 255, 255, .56), transparent 68%);
}
.history-rail { border-bottom-color: rgba(47, 107, 115, .35); }
.history-stem { background: rgba(47, 107, 115, .19); }
.history-event-0 { --event: #78958a; }
.history-event-1 { --event: #2f6b73; }
.history-event-2 { --event: #1c5b70; }
.history-event-3 { --event: #064b6a; }
.history-card {
  box-shadow: 0 3px 8px rgba(7, 57, 68, .08), 0 20px 42px -24px rgba(7, 57, 68, .35);
}
.history-event.is-expanded .history-card {
  box-shadow: 0 5px 12px rgba(7, 57, 68, .12), 0 27px 48px -22px rgba(7, 57, 68, .43);
}
.history-hint { color: #76877d; }

.team-section {
  background: #dfe9e1;
  border-top: 1px solid rgba(255, 255, 255, .62);
}
.team-number { color: var(--brand); }
.team-domains { border-top-color: rgba(47, 107, 115, .27); color: #4c716d; }
.team-roles article { border-top-color: rgba(47, 107, 115, .23); }
.team-roles article > span {
  border-color: rgba(47, 107, 115, .42);
  color: var(--yun-teal);
}
.team-roles h3 { color: var(--ink); }

.scroll-chapter.consulting { background: #f4f1ea; }
.scroll-chapter.consulting:nth-of-type(odd) { background: #ece8df; }
.consulting .chapter-line { border-bottom-color: rgba(47, 107, 115, .26); }
.consulting .chapter-line span:first-child { color: var(--yun-teal); }
.consulting .chapter-content h2 { color: var(--ink); }
.consulting .chapter-content .outputs {
  background: linear-gradient(100deg, rgba(255, 253, 248, .82), transparent 90%);
  border-left-color: rgba(143, 169, 161, .86);
}
.consulting .chapter-content .outputs:before { background: var(--brand); }

.ai-graph-section {
  background: var(--dark);
  box-shadow: inset 0 1px rgba(255, 255, 255, .12), inset 0 34px 72px -55px rgba(0, 0, 0, .55);
}
.ai-graph-heading h2 { color: #f4f2eb; }
.ai-graph-heading .label { color: #b7cfca; }
.ai-graph-heading > p { color: #c2d3d0; }
.graph-toolbar { border-color: rgba(143, 169, 161, .42); }
.graph-toolbar button { color: #a7c1c0; }
.graph-toolbar button[aria-pressed="true"] { color: #f4f2eb; border-color: #d9dfd5; }
.relationship-graph {
  background: #f1f0e9;
  box-shadow: 0 2px 0 rgba(255, 255, 255, .45), 0 24px 48px -26px rgba(0, 27, 33, .62);
}
.ontology-node circle { fill: #e3e9e2; stroke: #83988e; }
.ontology-node.person circle { fill: var(--brand); stroke: var(--brand); }
.ontology-node.peer circle { fill: #c7dad5; }
.ontology-node.question circle { fill: #eee5d5; }
.ontology-node:hover circle,
.ontology-node:focus circle,
.ontology-node[aria-pressed="true"] circle { stroke: var(--yun-teal); }
.graph-explanation { color: #c4d4d1; }
.graph-value { border-color: rgba(143, 169, 161, .42); }
.graph-value h3 { color: #eff2ea; }
.graph-value p, .graph-disclosure { color: #b5cdca; }

.scroll-chapter.onsite { background: #e6ede5; }
.scroll-chapter.onsite:nth-of-type(odd) { background: #edf0e8; }
.onsite .chapter-line { border-bottom-color: rgba(47, 107, 115, .24); }
.onsite .chapter-line span:first-child { color: var(--yun-teal); }
.onsite .chapter-content .outputs {
  background: rgba(249, 250, 243, .72);
  border-left-color: rgba(120, 149, 138, .88);
  box-shadow: inset 1px 0 rgba(255, 255, 255, .85), 16px 0 38px -32px rgba(47, 107, 115, .48);
}
.onsite .chapter-content .outputs:after { background: linear-gradient(var(--yun-sage), transparent); }

.scroll-method { background: #f4f0e8; }
.scroll-method .method-steps article { border-top-color: rgba(47, 107, 115, .3); }
.scroll-method .method-steps article:before { background: var(--yun-teal); }
.scroll-method .method-steps span { color: var(--brand); }

.case-gallery {
  background: var(--warm);
  border-top: 1px solid rgba(255, 255, 255, .72);
}
.case-sidebar .section-title { color: var(--ink); }
.case-index { border-color: rgba(47, 107, 115, .26); }
.case-index a { border-color: rgba(47, 107, 115, .22); color: #718078; }
.case-index a[aria-current="true"] {
  background: linear-gradient(90deg, rgba(255, 253, 248, .76), transparent);
  color: var(--brand);
}
.case-deck:before { background: #ebe5d9; border-color: rgba(183, 131, 94, .34); }
.case-deck:after { background: #e1d8cc; border-color: rgba(183, 131, 94, .24); }
.case-deck .case-slide {
  background: #faf8f2;
  border-color: rgba(47, 107, 115, .23);
  border-left-color: rgba(120, 149, 138, .72);
  box-shadow: 0 20px 44px -26px rgba(7, 57, 68, .28);
}
.case-deck .case-slide:nth-child(even) {
  background: #eef3ed;
  box-shadow: 0 20px 44px -26px rgba(47, 107, 115, .25);
}
.case-deck .case-slide:before {
  background: linear-gradient(90deg, var(--yun-teal), var(--yun-copper) 72%, transparent);
}
.case-slide-top { border-color: rgba(47, 107, 115, .27); color: #64736c; }
.case-slide-top span:last-child { color: var(--brand); }
.case-deck .case-slide h3 { color: var(--ink); }
.case-story h4 { color: var(--brand); }
.case-outcome { border-color: rgba(47, 107, 115, .27); }
.case-note { color: #707b74; }
.case-arrows button { border-color: rgba(47, 107, 115, .45); color: var(--brand); }
.case-arrows button:not(:disabled):hover { background: var(--brand); color: #fff; }

.samples { background: #f3f0e8; }
.switch button { color: #77817a; }
.switch button[aria-pressed="true"] { color: var(--brand); border-color: var(--brand); }
.report { box-shadow: 0 4px 7px rgba(7, 57, 68, .08), 0 26px 52px -25px rgba(7, 57, 68, .34); }

.offices-section { background: #f0eee6; }
.office-map-wrap {
  background: #d8eaee;
  border-color: rgba(255, 255, 255, .78);
  box-shadow: 0 24px 48px -29px rgba(7, 57, 68, .38);
}
.office-details {
  background: rgba(250, 248, 242, .9);
  border-color: rgba(255, 255, 255, .78);
  box-shadow: 0 18px 42px -32px rgba(7, 57, 68, .3);
}
.office-tabs { border-bottom-color: rgba(47, 107, 115, .28); }
.office-tabs button { color: #74827b; }
.office-tabs button[aria-pressed="true"] { color: var(--brand); border-color: var(--brand); }
.office-card > span, .office-phone > span { color: #75847b; }
.office-card h3 { color: var(--ink); }
.office-card #office-company { color: #304841; }
.office-phone { border-top-color: rgba(47, 107, 115, .25); }
.office-phone > a { color: var(--brand); }

footer { background: #dfe7df; border-top-color: rgba(255, 255, 255, .72); }
footer, footer .foot-note { color: #68766e; }
footer .foot-note { border-top-color: rgba(47, 107, 115, .2); }

dialog { background: #faf8f2; }
.close { background: #e4ebe4; color: var(--brand); }

@media (max-width: 680px) {
  .nav-links { background: rgba(242, 239, 233, .98); border-color: rgba(47, 107, 115, .2); }
  .client-mark { background: rgba(255, 255, 255, .84); }
  .case-deck .case-slide { border-left-color: rgba(120, 149, 138, .75); }
}

@media (prefers-reduced-motion: reduce) {
  .hero-shade { backdrop-filter: none !important; -webkit-backdrop-filter: none !important; }
}