/* Semantic surfaces share the website's existing neutral palette. */
:root { color-scheme: light; }
:root[data-theme="dark"] {
  color-scheme: dark;
  /* Compatibility aliases for the original Webflow components. New components use rw tokens. */
  --white: var(--rw-surface-bg);
  --black: var(--rw-text-strong);
  --graytrue25: var(--rw-page-bg);
  --graytrue50: var(--rw-surface-subtle);
  --graytrue100: var(--rw-surface-hover);
  --graytrue200: var(--rw-border-subtle);
  --graytrue300: var(--rw-border);
  --graytrue400: var(--rw-text-muted);
  --graytrue500: var(--rw-text-muted);
  --graytrue600: var(--rw-text-secondary);
  --graytrue700: var(--rw-text-secondary);
  --graytrue800: var(--rw-text-primary);
  --graytrue900: var(--rw-text-strong);
  --light-grey: var(--rw-surface-hover);
}
body, body.body-2 { background-color:var(--rw-page-bg); color:var(--rw-text-primary); }
.rw-theme-toggle {
  position:fixed;top:calc(16px + env(safe-area-inset-top));right:calc(16px + env(safe-area-inset-right));z-index:10000;
  display:grid;place-items:center;width:var(--rw-theme-toggle-size);height:var(--rw-theme-toggle-size);padding:0;
  color:var(--rw-text-secondary);background:transparent;border:0;border-radius:var(--rw-theme-toggle-radius);cursor:pointer;
  box-shadow:none;-webkit-tap-highlight-color:transparent;
}
.rw-theme-toggle[hidden] { display:none; }
.rw-theme-toggle:hover { background:transparent;color:var(--rw-text-strong); }
.rw-theme-toggle:active { transform:scale(.94); }
.rw-theme-toggle:focus-visible { outline:var(--rw-card-focus-width) solid var(--rw-card-focus-color);outline-offset:4px; }
.rw-theme-toggle svg { grid-area:1 / 1;width:var(--rw-theme-toggle-icon-size);height:var(--rw-theme-toggle-icon-size);pointer-events:none;transform-origin:center; }
.rw-theme-toggle__sun { opacity:0;transform:rotate(-90deg) scale(.6); }
.rw-theme-toggle__moon { opacity:1;transform:rotate(0) scale(1); }
[data-theme="dark"] .rw-theme-toggle__sun { opacity:1;transform:rotate(0) scale(1); }
[data-theme="dark"] .rw-theme-toggle__moon { opacity:0;transform:rotate(90deg) scale(.6); }
[data-theme-ready] .rw-theme-toggle,[data-theme-ready] .rw-theme-toggle svg { transition:background-color var(--rw-theme-duration) ease-out,color var(--rw-theme-duration) ease-out,border-color var(--rw-theme-duration) ease-out,transform var(--rw-theme-duration) ease-out,opacity var(--rw-theme-duration) ease-out; }
/* Limit transitions to colours; keep layout and the original page interactions intact. */
[data-theme-ready] body,[data-theme-ready] .project-navigation,[data-theme-ready] .sidebar4_container,[data-theme-ready] .navigation-main,[data-theme-ready] .rw-project-card,[data-theme-ready] .rw-project-card__tag,[data-theme-ready] .review-bar,[data-theme-ready] .staging-context,[data-theme-ready] .case-cover,[data-theme-ready] .footer-cta { transition:background-color var(--rw-theme-duration) ease-out,color var(--rw-theme-duration) ease-out,border-color var(--rw-theme-duration) ease-out; }
/* Keep the staging affordance beside, rather than underneath, the theme control. */
.staging-context,.preview-context { right:72px!important;max-width:calc(100vw - 96px);background:var(--rw-surface-bg)!important;color:var(--rw-text-secondary)!important;border-color:var(--rw-border-subtle)!important; }
.review-bar { padding-right:80px;min-height:68px;background:var(--rw-surface-subtle);border-color:var(--rw-border-subtle); }
.review-bar a,.review-bar span { color:var(--rw-text-secondary); }
.work-toolbar { display:none; }
/* Focused work pages omit the theme toggle, giving the menu its own full-width header. */
@media(max-width:991px) {
  .project-navigation.w-nav { margin-top:0;min-height:68px;padding-left:24px;padding-right:24px; }
  .project-navigation.w-nav .sidebar4_menu { top:68px;max-height:calc(100dvh - 68px); }
  .project-navigation .sidebar4_close-tablet { top:12px;right:24px;z-index:100; }
  .sidebar4_menu-button,.sidebar4_menu-button-close { width:44px;height:44px;padding:10px; }
  .work-toolbar { display:flex;position:sticky;top:0;z-index:13;align-items:center;justify-content:space-between;gap:16px;min-height:72px;padding:12px 24px;background:var(--rw-surface-bg); }
  .work-toolbar .review-work-toggle { min-height:44px;color:var(--rw-text-secondary);background:var(--rw-surface-bg);border-color:var(--rw-border-subtle); }
}
.stack-card.stack-awards { background-color:var(--rw-surface-bg);background-image:none; }
/* Software marks fit the same box without clipping wide or non-square artwork. */
.stack-card.stack-software .product-image { width:100%;height:100%;object-fit:contain; }
/* Both Drafts thumbnails have one fixed crop, independent of source dimensions. */
.featured-card-challenge .cover-wrapper { aspect-ratio:4 / 3;overflow:hidden; }
.featured-card-challenge .project-cover { width:100%;height:100%;max-height:none;aspect-ratio:4 / 3;object-fit:cover;object-position:center; }
/* Match the established 16px cover radius across all artwork and its viewer. */
.project-cover,.draft-image,.screen-preview,.fs-slider_image,.w-lightbox-image,
.text-rich-text figure img,.case-study .image-open img,.case-study dialog img { border-radius:16px; }
.cover-wrapper,.fs-slider_mask,.project-cover-motion { border-radius:16px;overflow:hidden; }
/* Carousel controls use semantic contrast in both themes, including generated Webflow dots. */
.fs-slider_slider :is(.fs-slider_arrow-left,.fs-slider_arrow-right) { width:44px;height:44px;background:var(--rw-control-bg);color:var(--rw-control-text);border:1px solid var(--rw-border); }
.fs-slider_slider .slider-arrow-icon { color:var(--rw-control-text); }
.fs-slider_slider :is(.fs-slider_arrow-left,.fs-slider_arrow-right):hover { background:var(--rw-text-secondary); }
.fs-slider_slider :is(.fs-slider_arrow-left,.fs-slider_arrow-right,.w-slider-dot):focus-visible { outline:2px solid var(--rw-card-focus-color);outline-offset:4px; }
.fs-slider_slider .w-slider-dot { width:10px;height:10px;background:transparent;border:1px solid var(--rw-text-muted);opacity:1; }
.fs-slider_slider .w-slider-dot.w-active { background:var(--rw-text-strong);border-color:var(--rw-text-strong); }
.fs-slider_slider .fs-slider_mask { border:1px solid var(--rw-border);background:var(--rw-surface-bg); }
@media(min-width:992px) { .fs-slider_slider :is(.fs-slider_arrow-left,.fs-slider_arrow-right) { display:grid;place-items:center; } }
/* Experience reads role first, with a stable, right-aligned date column. */
.rw-experience .summary-item { display:grid;grid-template-columns:minmax(0,1fr) auto;gap:16px 24px;align-items:start; }
.text-rich-text details > summary { display:list-item;cursor:pointer; }
.rw-experience .section-label-wrapper.wide { width:auto;justify-self:end;white-space:nowrap; }
.rw-experience .section-label-wrapper .text-style-label { text-align:right; }
@media(max-width:600px) { .review-bar { padding-right:76px;flex-wrap:wrap;gap:8px; } .review-bar span { text-align:left; } }
/* Legacy literal colours, kept local to the matching components. Artwork is never inverted. */
[data-theme="dark"] .navigation-main.is-collapsed,[data-theme="dark"] .sidebar-menu,[data-theme="dark"] .project-navigation.shadow-small,[data-theme="dark"] .case-study .review-work-navigation { background:var(--rw-surface-bg); }
[data-theme="dark"] .sidebar1_link.w--current,[data-theme="dark"] .sidebar1_link.current { -webkit-text-fill-color:var(--rw-control-text);color:var(--rw-control-text); }
[data-theme="dark"] .button:not(.is-link),[data-theme="dark"] .close-image { color:var(--rw-control-text);background:var(--rw-control-bg);border-color:var(--rw-border); }
[data-theme="dark"] .button.is-secondary,[data-theme="dark"] .button.is-tertiary { background:var(--rw-surface-bg);color:var(--rw-text-primary); }
[data-theme="dark"] .button:not(.is-link):hover { opacity:.85; }
[data-theme="dark"] .featured-card-project.shadow-medium { background-image:none; }
[data-theme="dark"] .tag,[data-theme="dark"] .case-study dialog,[data-theme="dark"] .review-work-toggle,[data-theme="dark"] .status { background:var(--rw-surface-bg);color:var(--rw-text-secondary);border-color:var(--rw-border); }
[data-theme="dark"] .text,[data-theme="dark"] .text-12,[data-theme="dark"] .text-sm-regular,[data-theme="dark"] .case-eyebrow,[data-theme="dark"] .case-study figcaption,[data-theme="dark"] .case-study .figure-note,[data-theme="dark"] .case-study .evidence p,[data-theme="dark"] .meta { color:var(--rw-text-muted); }
[data-theme="dark"] .text-xs-regular,[data-theme="dark"] .case-lead,[data-theme="dark"] .tilt-projects p,[data-theme="dark"] .intro { color:var(--rw-text-secondary); }
[data-theme="dark"] .text-md-medium,[data-theme="dark"] .case-study .next-case a,[data-theme="dark"] .tilt-projects a { color:var(--rw-text-strong); }
[data-theme="dark"] .case-study .case-cover { background:var(--rw-surface-bg); }
[data-theme="dark"] .case-study .case-section,[data-theme="dark"] .case-study .evidence,[data-theme="dark"] .case-study .next-case,[data-theme="dark"] .tilt-projects article,[data-theme="dark"] article,[data-theme="dark"] .workflow { border-color:var(--rw-border-subtle); }
[data-theme="dark"] .case-study button:focus-visible,[data-theme="dark"] .case-study a:focus-visible,[data-theme="dark"] .case-study summary:focus-visible { outline-color:var(--rw-card-focus-color); }
[data-theme="dark"] .form-input { background:var(--rw-surface-bg);color:var(--rw-text-primary); }
[data-theme="dark"] .form-input::placeholder { color:var(--rw-text-muted); }
[data-theme="dark"] .ovelay { background-image:linear-gradient(transparent,var(--rw-surface-bg)); }
[data-theme="dark"] .ovelay.top { background-image:linear-gradient(var(--rw-surface-bg),transparent); }
@media(prefers-reduced-motion:reduce) {
  [data-theme-ready] .rw-theme-toggle,[data-theme-ready] .rw-theme-toggle svg,[data-theme-ready] body,[data-theme-ready] .project-navigation,[data-theme-ready] .sidebar4_container,[data-theme-ready] .navigation-main,[data-theme-ready] .rw-project-card,[data-theme-ready] .rw-project-card__tag,[data-theme-ready] .review-bar,[data-theme-ready] .staging-context,[data-theme-ready] .case-cover,[data-theme-ready] .footer-cta { transition:none; }
  .rw-theme-toggle:active { transform:none; }
}