/* Official 2026-10-06 C3 identity. Logo SVG geometry/gradients stay untouched.
   Base composition/motion lives in portfolio.css; this layer replaces its provisional palette. */
:root {
  --brand-carbon: #303B36;
  --brand-lime: #8EAE26;
  --brand-carbon-top: #59625E;
  --brand-carbon-bottom: #29322E;
  --brand-lime-top: #A5BE51;
  --brand-lime-bottom: #799420;
  --brand-cloud: #F0F2F1;
  --brand-mist: #F6FAE8;
  --brand-muted: #59625E;
  --brand-line: #D5DAD7;
  /* Dark lime for small text; the exact primary lime is decorative, not white text. */
  --brand-link: #526718;
  --brand-focus: #799420;
  --paper: #FFFFFF;
  --ink: var(--brand-carbon);
  --muted: var(--brand-muted);
  --line: var(--brand-line);
  --accent: var(--brand-link);
}
.brand-logo {
  display: block;
  width: 240px;
  height: auto;
  object-fit: contain;
  filter: none;
  transform: none;
}
picture.brand-artwork { display: block; flex-shrink: 0; }
.site-header {
  height: 108px;
  background: #FFFFFF;
  color: var(--brand-carbon);
  border-bottom: 1px solid var(--brand-line);
}
.site-header .wordmark { gap: 0; }
.site-header nav a::after { background: var(--brand-lime); }
.site-header .language-toggle { border-color: var(--brand-line); }
.site-header .language-toggle:hover { background: var(--brand-mist); }
.site-header :focus-visible { outline-color: var(--brand-focus); }
.hero { background: #FFFFFF; }
.hero .role { color: var(--brand-carbon); }
.hero .builder .role { color: var(--brand-link); }
.portrait-label { background: #FFFFFF; color: var(--brand-muted); }
.colour-block { background: var(--brand-lime); opacity: .22; }
.outline-orbit { border-color: var(--brand-carbon-top); }
.technical-marks { color: var(--brand-carbon); }
.hero-controls input { accent-color: var(--brand-link); }
.hero-controls button:hover { color: var(--brand-link); }
.work-section { background: var(--brand-cloud); }
.work-image { background: var(--brand-cloud); }
.work-image::after { border-color: #303B3626; }
.image-index { color: var(--brand-carbon); background: #FFFFFFED; }
.work-peek { background: var(--brand-carbon); color: #FFFFFF; }
.work-image .detail-overlay { border-color: #FFFFFF; box-shadow: 0 16px 22px #303B3625; }
.about-section {
  background: var(--brand-mist);
  border-color: var(--brand-line);
}
.personal-photo { background: #FFFFFF; box-shadow: 0 20px 30px #303B3610; }
.photo-tape { background: #A5BE5180; }
.about-copy > p:not(.eyebrow):not(.intro) { color: var(--brand-muted); }
.interest-list { border-color: var(--brand-line); }
.interest-list p::before { color: var(--brand-link); }
.writing-section { background: #FFFFFF; }
.contact-section { background: var(--brand-carbon); color: #FFFFFF; }
.contact-inner .eyebrow { color: #D5DAD7; }
.email-link { border-color: var(--brand-lime); }
.email-link:hover { color: #C5D88C; }
.contact-inner > p:last-child { color: #D5DAD7; }
.site-footer { background: var(--brand-carbon); color: #FFFFFF; border-top: 1px solid #59625E; }
.site-footer .preview-note { color: #D5DAD7; }
.site-footer a:focus-visible { outline-color: var(--brand-lime-top); }
@media (max-width: 760px) {
  .brand-logo--header { width: 48px; height: 48px; }
  .site-header { height: 80px; }
  .site-header nav { top: 80px; background: #FFFFFF; border-color: var(--brand-line); }
  .site-footer { gap: 12px 24px; }
  .site-footer .brand-logo { width: 240px; }
}