/* Optional presentation layer. Brand colors and contact behavior stay unchanged. */
.theme-toggle {
  display: inline-grid;
  place-items: center;
  flex: 0 0 44px;
  inline-size: 44px;
  block-size: 44px;
  padding: 10px;
  border: 1px solid #5C896166;
  border-radius: 50%;
  background: transparent;
  color: var(--forest);
  line-height: 1;
  cursor: pointer;
  transition: background-color 180ms ease, border-color 180ms ease, color 180ms ease;
}

.theme-toggle svg {
  grid-area: 1 / 1;
  inline-size: 20px;
  block-size: 20px;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.65;
  stroke-linecap: round;
  stroke-linejoin: round;
  pointer-events: none;
  transition: opacity 180ms ease, transform 220ms ease;
}

.theme-toggle .theme-icon-moon { opacity: 1; transform: none; }
.theme-toggle .theme-icon-sun { opacity: 0; transform: rotate(-60deg) scale(.8); }
.theme-toggle:focus-visible { outline: 3px solid var(--arandano); outline-offset: 4px; }

@media (hover: hover) and (pointer: fine) {
  .theme-toggle:hover { background: #B6E2C133; border-color: var(--prado); }
}

/* Semantic surfaces are separate from --forest, --perla and other brand inks. */
html[data-theme="dark"] {
  color-scheme: dark;
  --theme-bg: #111D17;
  --theme-panel: #182A20;
  --theme-section: #14251B;
  --theme-text: #F0EFEB;
  --theme-muted: #A8BBB0;
  --theme-line: #3E594B;
  --theme-error: #FFB4AB;
  --theme-error-surface: #382721;
  --paper: var(--theme-bg);
  --ink: var(--theme-text);
  --muted: var(--theme-muted);
  --line: var(--theme-line);
  --editorial-line: var(--theme-line);
  background: var(--theme-bg);
}

html[data-theme="dark"] body { background: var(--theme-bg); color: var(--theme-text); }
html[data-theme="dark"] ::selection { background: var(--menta); color: var(--forest); }
html[data-theme="dark"] :focus-visible { outline-color: var(--menta); }

/* Navigation and the theme control retain the existing menu disclosure. */
html[data-theme="dark"] .site-header {
  background: var(--theme-bg);
  border-bottom-color: var(--theme-line);
}
html[data-theme="dark"] .brand { color: var(--menta); }
html[data-theme="dark"] .main-nav { color: var(--theme-text); }
html[data-theme="dark"] .main-nav > a { border-bottom-color: var(--theme-line); }
html[data-theme="dark"] .main-nav > a::after { background: var(--menta); }
html[data-theme="dark"] .nav-toggle { border-color: var(--prado); color: var(--menta); }
html[data-theme="dark"] .nav-toggle > span { background: var(--menta); }
html[data-theme="dark"] .theme-toggle {
  background: var(--theme-panel);
  border-color: var(--prado);
  color: var(--menta);
}
html[data-theme="dark"] .theme-toggle .theme-icon-moon { opacity: 0; transform: rotate(60deg) scale(.8); }
html[data-theme="dark"] .theme-toggle .theme-icon-sun { opacity: 1; transform: none; }
html[data-theme="dark"] .theme-toggle:focus-visible { outline-color: var(--menta); }

/* Shared text and controls, including the non-enhanced HTML fallback. */
html[data-theme="dark"] :is(.section-label, .overline, .eyebrow, .story-kicker,
  .hero-subtitle, .project-copy .overline, .timeline-kicker, .step-number) { color: var(--menta); }
html[data-theme="dark"] :is(.hero-description, .hero-footnote, .small-note,
  .capability-strip, .image-coordinate, .image-note, .contact-signature) { color: var(--theme-muted); }
html[data-theme="dark"] :is(.mini-line, .status-dot, .notice-dot) { background: var(--menta); }
html[data-theme="dark"] .capability-strip { border-color: var(--theme-line); }
html[data-theme="dark"] .capability-strip span::before { color: var(--menta); }
html[data-theme="dark"] .text-link { color: var(--theme-text); }
html[data-theme="dark"] .text-link:hover { color: var(--menta); }
html[data-theme="dark"] .button,
html[data-theme="dark"] .hero-actions .button {
  background: var(--menta);
  border-color: var(--menta);
  color: var(--forest);
}
html[data-theme="dark"] .button:hover,
html[data-theme="dark"] .hero-actions .button:hover {
  background: #D2EDD8;
  border-color: #D2EDD8;
  color: var(--forest);
}
html[data-theme="dark"] .nav-cta { background: var(--arandano); border-color: var(--arandano); color: var(--perla); }
html[data-theme="dark"] .nav-cta:hover { background: var(--acero); border-color: var(--prado); color: var(--perla); }
html[data-theme="dark"] .skip-link { background: var(--menta); color: var(--forest); }
html[data-theme="dark"] :is(.icon-button, .motion-toggle) { border-color: var(--prado); color: var(--menta); }
html[data-theme="dark"] .icon-button:hover:not(:disabled) { background: var(--forest); }
html[data-theme="dark"] .motion-toggle[aria-pressed="true"] { background: var(--forest); color: var(--menta); }
html[data-theme="dark"] .motion-toggle:focus-visible { outline-color: var(--menta); }

/* The photographs keep their original colors; only supporting surfaces change. */
html[data-theme="dark"] .hero {
  background: radial-gradient(ellipse at 95% 10%, #B6E2C10D, transparent 55%), var(--theme-bg);
}
html[data-theme="dark"] .hero::before { opacity: .12; }
html[data-theme="dark"] .hero h1 em { color: var(--menta); }
html[data-theme="dark"] .hero-image-label { background: #14251BF2; color: var(--perla); border-color: #B6E2C166; }
html[data-theme="dark"] .hero-axis { background: #14251BF2; color: var(--menta); border-color: #B6E2C166; }
html[data-theme="dark"] .connection-card { background: var(--menta); color: var(--forest); border-color: var(--theme-bg); }

/* Services: preserve the forest lead card and the blue partner card. */
html[data-theme="dark"] .solutions { background: var(--theme-section); }
html[data-theme="dark"] .solution-card { background: var(--theme-panel); border-color: var(--theme-line); color: var(--theme-text); }
html[data-theme="dark"] .solution-card > p { color: var(--theme-muted); }
html[data-theme="dark"] .solution-card :is(.card-top > span, .icon) { color: var(--menta); }
html[data-theme="dark"] .solution-card .tags span { background: #B6E2C112; color: var(--menta); }
html[data-theme="dark"] .solution-card:nth-child(1) { background: var(--forest); color: var(--perla); }
html[data-theme="dark"] .solution-card:nth-child(1) > p { color: #D0DACC; }
html[data-theme="dark"] .solution-accent { background: var(--arandano); border-color: var(--arandano); color: var(--perla); }
html[data-theme="dark"] .solution-accent > p { color: #E0E8EF; }
html[data-theme="dark"] .solution-accent .tags span { background: #111D1740; color: var(--perla); }
html[data-theme="dark"] .solution-card::before { opacity: .22; }
html[data-theme="dark"] .solution-card:nth-child(1)::before { opacity: .18; }
html[data-theme="dark"] .solution-accent::before { opacity: .35; }

@media (hover: hover) and (pointer: fine) {
  html[data-theme="dark"] .theme-toggle:hover { background: var(--forest); border-color: var(--menta); }
  html[data-theme="dark"] .solution-card:hover { background: #20362A; box-shadow: 0 14px 28px #00000024; }
  html[data-theme="dark"] .solution-card:nth-child(1):hover { background: var(--forest); }
  html[data-theme="dark"] .solution-accent:hover { background: var(--arandano); }
  html[data-theme="dark"].motion-interactive:not(.motion-paused) .solution-card:hover { box-shadow: 0 14px 28px #00000024; }
  html[data-theme="dark"].motion-interactive:not(.motion-paused) .solution-card:hover .tags span { background: var(--menta); color: var(--forest); }
}

/* Application tabs and technology remain readable in every selected state. */
html[data-theme="dark"] .industries { background: var(--theme-bg); }
html[data-theme="dark"] .industries::before { opacity: .16; }
html[data-theme="dark"] .industry-tabs { border-color: var(--theme-line); }
html[data-theme="dark"] .industry-tabs > button { color: var(--theme-text); border-color: var(--theme-line); }
html[data-theme="dark"] .industry-tabs > button > span { color: var(--menta); }
html[data-theme="dark"] .industry-tabs > button[aria-selected="true"] { background: var(--forest); border-color: var(--prado); color: var(--menta); }
html[data-theme="dark"] .industry-tabs > button:hover:not([aria-selected="true"]) { background: var(--theme-panel); }
html[data-theme="dark"] .industry-panel { background: var(--forest); color: var(--perla); }
html[data-theme="dark"] .industry-panel :is(p, .overline, .text-link) { color: var(--perla); }
html[data-theme="dark"] .industry-panel::after { background: linear-gradient(0deg, #0A201BF5 0%, #0A201B80 55%, transparent 85%); }
html[data-theme="dark"] .technology { background: var(--acero); color: var(--perla); }
html[data-theme="dark"] .technology-copy > p { color: #D0DACC; }
html[data-theme="dark"] .technology-bottom { color: #D0DACC; border-color: #B6E2C140; }
html[data-theme="dark"] .eco-node { background: var(--acero); color: var(--perla); border-color: #B6E2C14D; }
html[data-theme="dark"] .eco-node[aria-pressed="true"] { background: var(--forest); border-color: var(--menta); color: var(--menta); }
html[data-theme="dark"] .eco-node:hover { border-color: var(--menta); }
html[data-theme="dark"] .eco-center { color: var(--menta); }
html[data-theme="dark"] .ecosystem-detail { background: #111D173B; border-color: #B6E2C14D; }
html[data-theme="dark"] .ecosystem-detail p { color: #D0DACC; }
html[data-theme="dark"] .ecosystem figcaption { color: #D0DACC; }

/* Founder, methodology, and every automatic/manual timeline state. */
html[data-theme="dark"] .about { background: var(--theme-section); }
html[data-theme="dark"] .about::before { opacity: .13; }
html[data-theme="dark"] .about-story .lead-copy { color: var(--theme-text); }
html[data-theme="dark"] .principles > span { color: var(--menta); border-color: var(--theme-line); }
html[data-theme="dark"] .principles > span::before { color: var(--menta); }
html[data-theme="dark"] .founder-card { background: var(--theme-panel); }
html[data-theme="dark"] .founder-details { border-color: var(--theme-line); }
html[data-theme="dark"] .founder-details summary { color: var(--theme-text); }
html[data-theme="dark"] .founder-highlights { color: var(--theme-muted); }
html[data-theme="dark"] .methodology { background: var(--theme-bg); border-color: var(--theme-line); }
html[data-theme="dark"] .methodology::before { opacity: .13; }
html[data-theme="dark"] .method-timeline { --timeline-line: var(--theme-line); }
html[data-theme="dark"] .timeline-toolbar > p { color: var(--menta); }
html[data-theme="dark"] .timeline-toolbar > p > span { color: var(--theme-text); }
html[data-theme="dark"] .timeline-toolbar > p > .status-dot { background: var(--menta); }
html[data-theme="dark"] .timeline-controls :is(.icon-button, .timeline-play) { background: var(--theme-panel); border-color: var(--prado); color: var(--menta); }
html[data-theme="dark"] .timeline-controls :is(.icon-button, .timeline-play):hover:not(:disabled) { background: var(--forest); }
html[data-theme="dark"] .timeline-play-mark { border-left-color: var(--menta); }
html[data-theme="dark"] .is-playing .timeline-play-mark { border-left-color: var(--menta); border-right-color: var(--menta); }
html[data-theme="dark"] .method-timeline :is(button, .process):focus-visible { outline-color: var(--menta); }
html[data-theme="dark"] .method-timeline.is-ready .timeline-stage { background: var(--theme-panel); border-color: var(--theme-line); }
html[data-theme="dark"] .method-timeline.is-ready .timeline-kicker { color: var(--menta); }
html[data-theme="dark"] .method-timeline.is-ready .process p { color: var(--theme-muted); }
html[data-theme="dark"] .process > li + li { border-color: var(--theme-line); }
html[data-theme="dark"] .process-bottom { border-color: var(--theme-line); }
html[data-theme="dark"] .process-bottom p { color: var(--theme-text); }
html[data-theme="dark"] .timeline-route .route-base { stroke: var(--prado); }
html[data-theme="dark"] .timeline-route :is(.route-pulse, text) { stroke: var(--menta); }
html[data-theme="dark"] .timeline-route text { fill: var(--menta); stroke: none; }
html[data-theme="dark"] .timeline-route .route-halo { stroke: #B6E2C119; }
html[data-theme="dark"] .timeline-route [data-station] { fill: var(--theme-panel); stroke: var(--prado); }
html[data-theme="dark"] .timeline-route [data-station].is-complete { fill: var(--menta); stroke: var(--menta); }
html[data-theme="dark"] .timeline-route [data-station].is-active { fill: var(--forest); stroke: var(--menta); }
html[data-theme="dark"] .timeline-route .route-signal-dot { fill: var(--menta); stroke: var(--theme-bg); }
html[data-theme="dark"] .timeline-progress { background: var(--theme-line); }
html[data-theme="dark"] .timeline-progress-fill { background: var(--menta); }
html[data-theme="dark"] .timeline-navigation > button { color: var(--theme-text); }
html[data-theme="dark"] .timeline-navigation > button::before { border-color: var(--theme-line); }
html[data-theme="dark"] .timeline-navigation > button > span:first-child { background: var(--theme-panel); border-color: var(--prado); color: var(--theme-text); }
html[data-theme="dark"] .timeline-navigation > button.is-complete > span:first-child { background: #294436; color: var(--menta); border-color: var(--prado); }
html[data-theme="dark"] .timeline-navigation > button[aria-current="step"] > span:first-child { background: var(--menta); color: var(--forest); border-color: var(--menta); box-shadow: 0 0 0 5px #B6E2C115; }
html[data-theme="dark"] .timeline-navigation > button:hover > span:first-child { border-color: var(--menta); }

/* Outcomes and reference gallery retain their distinction from surrounding panels. */
html[data-theme="dark"] .impact { background: var(--forest); color: var(--perla); }
html[data-theme="dark"] .impact :is(.impact-note, .impact-grid > div > p, .impact-outcomes p) { color: #D0DACC; }
html[data-theme="dark"] .impact :is(.impact-outcomes, .impact-outcomes article) { border-color: #B6E2C140; }
html[data-theme="dark"] .impact-note { border-color: var(--menta); }
html[data-theme="dark"] .impact-outcomes :is(article > span, .icon) { color: var(--menta); }
html[data-theme="dark"] .projects { background: var(--theme-section); }
html[data-theme="dark"] .projects::before { opacity: .13; }
html[data-theme="dark"] .project-card { background: var(--theme-panel); color: var(--theme-text); }
html[data-theme="dark"] .project-image { background: var(--forest); }
html[data-theme="dark"] .project-carousel { scrollbar-color: var(--prado) var(--theme-panel); }

/* Only presentation changes: fields, submission attributes and messages are untouched. */
html[data-theme="dark"] .contact { background: var(--theme-bg); }
html[data-theme="dark"] .contact::before { opacity: .14; }
html[data-theme="dark"] .contact-note { border-color: var(--theme-line); }
html[data-theme="dark"] :is(.contact-note .icon, .contact-note p strong, .contact-signature strong) { color: var(--menta); }
html[data-theme="dark"] .form-wrap { background: var(--theme-panel); border-color: var(--theme-line); }
html[data-theme="dark"] .form-notice { background: var(--forest); border-color: var(--theme-line); }
html[data-theme="dark"] .form-notice p { color: #D0DACC; }
html[data-theme="dark"] .form-notice strong { color: var(--menta); }
html[data-theme="dark"] .form-field label { color: var(--theme-text); }
html[data-theme="dark"] .form-field label > span { color: var(--menta); }
html[data-theme="dark"] .form-field :is(input, select, textarea) {
  background: var(--theme-bg);
  color: var(--theme-text);
  border-color: var(--prado);
  caret-color: var(--menta);
  color-scheme: dark;
}
html[data-theme="dark"] .form-field :is(input, textarea)::placeholder { color: var(--theme-muted); opacity: 1; }
html[data-theme="dark"] .form-field select option { background: var(--theme-bg); color: var(--theme-text); }
html[data-theme="dark"] .form-field :is(input, select, textarea):focus { border-color: var(--menta); }
html[data-theme="dark"] .form-field small { color: var(--theme-muted); }
html[data-theme="dark"] .required-note { color: var(--theme-muted); }
html[data-theme="dark"] .form-field [aria-invalid="true"] { border-color: var(--theme-error); background: var(--theme-error-surface); }
html[data-theme="dark"] .form-field [aria-invalid="true"]:focus { border-color: var(--theme-error); }
html[data-theme="dark"] .form-field .field-error { color: var(--theme-error); }
html[data-theme="dark"] .form-feedback:not(:empty) { color: var(--menta); border-color: var(--menta); }
html[data-theme="dark"] .form-feedback.error { color: var(--theme-error); border-color: var(--theme-error); }
html[data-theme="dark"] .noscript-notice { color: var(--theme-error); }

/* Closing surface and control states. */
html[data-theme="dark"] .site-footer { background: var(--acero); color: var(--perla); }
html[data-theme="dark"] .site-footer .brand { color: var(--menta); }
html[data-theme="dark"] :is(.footer-top, .footer-bottom) { border-color: #B6E2C140; }
html[data-theme="dark"] .footer-top > p { color: var(--perla); }
html[data-theme="dark"] :is(.footer-top > p > span, .footer-label, .footer-bottom) { color: #D0DACC; }
html[data-theme="dark"] .footer-grid > div > p { color: #D0DACC; }
html[data-theme="dark"] .footer-up:hover,
html[data-theme="dark"] .footer-grid a:hover { color: var(--menta); }

/* Make room for the new 44px control without removing contact or navigation. */
@media (min-width: 761px) {
  .site-header .main-nav { margin-left: auto; }
}
@media (min-width: 761px) and (max-width: 1100px) {
  .site-header .nav-shell { column-gap: 12px; }
  .site-header .main-nav { column-gap: 14px; }
}
@media (min-width: 761px) and (max-width: 950px) {
  .site-header .nav-shell { column-gap: 8px; }
  .site-header .main-nav { column-gap: 12px; }
  .site-header .nav-cta { gap: 12px; padding-inline: 13px; }
}
@media (max-width: 760px) {
  .site-header .nav-shell { column-gap: 8px; }
  .site-header .nav-cta { order: 1; }
  .site-header .theme-toggle { order: 2; }
  html[data-theme="dark"] .main-nav.open { background: var(--theme-bg); }
}
@media (max-width: 360px) {
  .site-header .brand-copy strong { font-size: 22px; }
  .site-header .nav-cta { gap: 0; padding-inline: 6px; font-size: 11px; }
  .site-header .nav-cta > span[aria-hidden="true"] { display: none; }
}

/* Theme feedback follows the same motion preferences as the existing landing. */
html.motion-paused .theme-toggle,
html.motion-paused .theme-toggle svg,
body.motion-reduced .theme-toggle,
body.motion-reduced .theme-toggle svg { transition: none; }
@media (prefers-reduced-motion: reduce) {
  .theme-toggle, .theme-toggle svg { transition: none; }
}

@media (forced-colors: active) {
  .theme-toggle { border-color: ButtonText; color: ButtonText; background: ButtonFace; }
  html[data-theme="dark"] .theme-toggle { border-color: ButtonText; color: ButtonText; background: ButtonFace; }
  .theme-toggle:focus-visible,
  html[data-theme="dark"] .theme-toggle:focus-visible { outline-color: Highlight; }
}