:root {
  color-scheme: dark;
  --ink: #f4f2ea;
  --muted: #b0bbc5;
  --olive: #d8bc82;
  --deep: #dcc28f;
  --paper: #09131f;
  --sage: #182838;
  --line: #2b3c4a;
  --white: #101e2c;
  --sand: #8d7c5d;
}
body { background: var(--paper); }
::selection { background: #dcc28f; color: #09131f; }
.site-header { background: #09131ff2; }
.brand-mark { filter: invert(1); mix-blend-mode: screen; }
.brand-dot { color: #d8bc82; }
.button { background: #dcc28f; border-color: #dcc28f; color: #101923; }
.button:hover { background: #efdab0; border-color: #efdab0; }
.text-link { border-color: #766951; }
button:focus-visible, a:focus-visible, summary:focus-visible, [tabindex]:focus-visible {
  outline-color: #e1c796;
}
.skip-link { color: #09131f; background: #dcc28f; }
.hero { padding-block: 88px 80px; gap: 64px; }
.hero h1 { font-size: clamp(54px, 5.4vw, 80px); }
.hero .eyebrow { color: #cfb780; }
.hero-description { color: #b8c3cd; }
.hero-note { color: #9eacb9; }
.hero .olive-text {
  color: #e0c48d;
}
.brand-visual {
  background: #111f2d;
  border-color: #314150;
  box-shadow: 0 24px 60px #00000035;
  border-radius: 6px;
}
.brand-film { aspect-ratio: 16 / 10; background: #081422; }
.brand-workflow { border-top: 1px solid #2d3c49; }
.brand-workflow h3 { color: #f2efe6; }
.brand-flow { border-color: #324452; }
.brand-flow small { color: #a8b5c1; }
.motion-toggle { border-color: #7891a2; background: #0c1a29ed; }
.motion-toggle:hover { background: #273d50; }
.principles { border-color: #2b3c4a; }
.workflow-demo { background: #10202e; border-color: #334553; }
.workflow-tabs button[aria-selected=true] { background: #1a2c3b; }
.workflow-tabs button:hover { background: #1b2d3c; }
.workflow-tabs button[aria-selected=true]:before { background: #dcc28f; }
.workflow-tabs small { color: #aebdca; }
.workflow-panel { background: linear-gradient(130deg,#142534,#10202e); }
.workflow-approval { background: #20312f; border-color: #3a5349; }
.workflow-approval .step-label, .approval-icon { color: #c4d5af; }
.sample-tag { border-color: #425463; color: #c2cdd6; }
.services-section { background: #101d29; border-color: #2c3b49; }
.service-card { background: #122332; border-color: #354857; }
.service-card:nth-child(2) { background: #152430; }
.service-symbol { color: #dbc28e; }
.service-bottom { border-color: #384958; }
.services-note { color: #b9c4cc; }
.process-grid article { border-color: #45505a; }
.process-number { color: #e0c690; }
.process-result { color: #d8bd86; }
.founder-section { background: #142430; border-block: 1px solid #2b3c4a; }
.founder-copy>p:not(.eyebrow) { color: #bac5ce; }
.founder-monogram { background: #293a47; color: #e5cb93; border: 1px solid #485764; }
.founder-image .image-caption { text-shadow: 0 2px 18px #06111fe6; }
.controls-intro>p:not(.eyebrow), details p { color: #b7c3cd; }
.closing-section {
  color: #f4f2ea;
  border-block: 1px solid #314454;
  background-image: linear-gradient(rgba(7,20,34,.39),rgba(7,20,34,.39)),url('assets/mycel-horizon.webp');
}
.closing-inner { padding-block: 90px 115px; }
.closing-inner .eyebrow { color: #d8bd86; }
.closing-inner p:not(.eyebrow), .closing-action>span { color: #c6d0d8; }
.button-light { background: #e2c99a; color: #111c28; border-color: #e2c99a; }
.button-light:hover { background: #f0ddb7; color: #111c28; }
.prototype-notice { background: #0c1926; color: #99a8b5; border-color: #2b3c4a; }
@media (max-width:1150px) {
  .hero { gap: 32px; padding-block: 65px; }
  .hero h1 { font-size: 62px; }
}
@media (max-width:900px) {
  .hero { gap: 30px; padding-block: 58px; }
  .hero h1 { font-size: 53px; }
}
@media (max-width:700px) {
  .header-inner nav { background: #101e2c; box-shadow: 0 12px 20px #00000030; }
  .hero { gap: 38px; padding-block: 42px 36px; }
  .hero h1 { font-size: clamp(50px,12.3vw,78px); }
  .brand-visual { box-shadow: 0 14px 30px #00000020; }
  .closing-inner { padding-block: 52px 86px; }
}
@media (max-width:360px) {
  .hero h1 { font-size: 47px; }
}
@media print {
  :root { --ink:#142330; --muted:#43515e; --olive:#655331; --paper:#fff; --line:#bbb; }
  body,.service-card,.services-section,.workflow-demo,.workflow-panel,.founder-section,.brand-visual { background:white; color:#142330; }
  .closing-section { color:#142330; background:white; }
  .brand-mark { filter:none; mix-blend-mode:multiply; }
}
