/* A quiet, shared surface system. Navigation geometry stays in its own layer. */
html body.visual-refresh {
  --paper: #0c0e12;
  --paper-2: #101319;
  --paper-3: #191d24;
  --surface: #15181e;
  --surface-2: #1b1f27;
  --surface-3: #252a34;
  --ink: #f3f2ed;
  --ink-2: #c9ccd2;
  --muted: #9da3af;
  --line: rgb(255 255 255 / .10);
  --line-strong: rgb(255 255 255 / .20);
  --ui-panel: var(--surface);
  --ui-panel-soft: var(--surface);
  --ui-clay: var(--surface);
  --ui-line: var(--line);
  --ui-shadow: none;
  --ui-shadow-soft: none;
  --clay-shadow: none;
  --clay-shadow-soft: none;
  --clay-pressed: none;
  --clay-inner: none;
  --refresh-radius: 16px;
  background: var(--paper) !important;
  color: var(--ink);
  -webkit-font-smoothing: antialiased;
}

html[data-theme="light"] body.visual-refresh {
  --paper: #f7f6f2;
  --paper-2: #efeee9;
  --paper-3: #e8e7e1;
  --surface: #fff;
  --surface-2: #efeee8;
  --surface-3: #e5e4de;
  --ink: #22252b;
  --ink-2: #484c55;
  --muted: #686d77;
  --line: rgb(25 30 40 / .12);
  --line-strong: rgb(25 30 40 / .23);
}

/* One static accent wash replaces the stacked glows, grid and moving stars. */
html body.visual-refresh .fixed-background {
  background: radial-gradient(ellipse at 90% 10%, color-mix(in srgb, var(--accent) 7%, transparent), transparent 48%), var(--paper) !important;
}
html body.visual-refresh .fixed-background::before,
html body.visual-refresh .fixed-background::after,
html body.visual-refresh .fixed-background > * {
  display: none !important;
}
html body.visual-refresh :is(.hero-motion, .hero-field, .chapter-weave, .about76__method-path) {
  display: none !important;
}
html body.visual-refresh :is(.title-panel, .contact-panel, .about76) {
  background: transparent !important;
}
html body.visual-refresh :is(.contact-email, .contact-links a, .review-card, .about76)::before,
html body.visual-refresh :is(.contact-email, .contact-links a, .about76)::after,
html body.visual-refresh .about76__method-row article::before,
html body.visual-refresh .about76__method-row article::after {
  display: none !important;
}

/* Flat, opaque chrome keeps labels crisp without costly backdrop compositing. */
html body.visual-refresh :is(.sidebar, .sidebar-utility button, .sidebar-nav, .minimal-footer, .floating-controls > button, .ambient-volume, .colour-studio, .accessibility-panel, .catalog-dialog, .case-study-bar, .case-study-rail, .case76-topbar, .case76-rail, .case76-mobile-actions, .cv-back-top) {
  background: var(--paper) !important;
  border-color: var(--line) !important;
  box-shadow: none !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
}
html body.visual-refresh :is(.sidebar-utility button, .floating-controls > button, .colour-studio, .accessibility-panel, .catalog-dialog, .case-study-rail, .case76-rail) {
  border-radius: var(--refresh-radius) !important;
}
html body.visual-refresh .sidebar-nav > button {
  border-radius: 10px !important;
  box-shadow: none !important;
}
html body.visual-refresh .sidebar-nav > button.is-active {
  background: color-mix(in srgb, var(--accent) 12%, var(--paper)) !important;
  color: var(--accent-readable, var(--accent)) !important;
}
html body.visual-refresh :is(.sidebar-utility button, .floating-controls > button):hover {
  background: var(--surface-2) !important;
  box-shadow: none !important;
}

/* Retain the portrait and typographic signature, with a simpler nameplate. */
html body.visual-refresh #top :is(.dp-hero-v6__label, .dp-hero-v6__nameplate) {
  background: var(--paper) !important;
  border: 1px solid var(--line) !important;
  box-shadow: none !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
  animation: none !important;
  will-change: auto !important;
}
html body.visual-refresh #top .dp-hero-v6__nameplate {
  border-radius: 12px !important;
}
html body.visual-refresh #top .dp-hero-v6__name-dot {
  background: var(--accent) !important;
  box-shadow: none !important;
}
html body.visual-refresh #top .dp-hero-v6__aura {
  display: none !important;
}
html body.visual-refresh #top .dp-hero-v6__image-wrap img {
  filter: none !important;
}
html body.visual-refresh #top .dp-hero-v6__label::after {
  box-shadow: none !important;
}
html body.visual-refresh.horizontal-snap .hero-scroll-cue {
  width: 44px !important;
  height: 44px !important;
  min-height: 44px !important;
  padding: 0 !important;
  display: grid !important;
  place-items: center !important;
  border: 1px solid var(--line) !important;
  border-radius: 12px !important;
  background: var(--paper) !important;
  box-shadow: none !important;
  animation: none !important;
}
html body.visual-refresh.horizontal-snap .hero-scroll-cue::before,
html body.visual-refresh.horizontal-snap .hero-scroll-cue::after {
  display: none !important;
}
html body.visual-refresh.horizontal-snap .hero-scroll-cue svg {
  display: block !important;
  width: 20px !important;
  height: 20px !important;
  margin: 0 !important;
  color: var(--ink) !important;
  animation: none !important;
}
html body.visual-refresh.horizontal-snap:is(.project-open, .cv-open) .hero-scroll-cue {
  visibility: hidden !important;
  pointer-events: none !important;
}
html body.visual-refresh :is(.chapter-keywords span, .chapter-label)::before {
  box-shadow: none !important;
}

/* A single card language across projects, archive, reviews and contact. */
html body.visual-refresh :is(.project-copy, .project-visual, .archive-feature, .archive-meta, .review-card, .contact-email, .contact-links a, .landmark-story, .case76-video, .case76-doc, .case76-pager :is(a, button)) {
  border: 1px solid var(--line) !important;
  border-radius: var(--refresh-radius) !important;
  box-shadow: none !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
}
html body.visual-refresh :is(.project-copy, .archive-meta, .review-card, .contact-links a, .landmark-story, .case76-doc, .case76-pager :is(a, button)) {
  background: var(--surface) !important;
}
html body.visual-refresh :is(.project-tabs button, .archive-tabs button, .review-tabs button, .project-step, .archive-arrow, .archive-catalog-button, .project-actions a, .about76__actions a, .cv-contact-grid a, .cv-download) {
  border-radius: 10px !important;
  box-shadow: none !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
  animation: none !important;
  will-change: auto !important;
}
html body.visual-refresh :is(.project-tabs button, .archive-tabs button, .review-tabs button, .project-step, .archive-arrow, .about76__actions a) {
  background: var(--surface) !important;
  border-color: var(--line) !important;
}
html body.visual-refresh :is(.project-tabs button, .archive-tabs button, .review-tabs button).is-active {
  background: color-mix(in srgb, var(--accent) 10%, var(--surface)) !important;
  border-color: color-mix(in srgb, var(--accent) 60%, var(--line)) !important;
  box-shadow: none !important;
}
html body.visual-refresh :is(.project-tags span, .case76-tags span) {
  border-radius: 4px !important;
  box-shadow: none !important;
}
html body.visual-refresh .project-copy blockquote {
  font-style: normal;
  line-height: 1.65 !important;
  color: var(--ink-2);
}
html body.visual-refresh .about76__note {
  line-height: 1.7 !important;
  color: var(--ink-2) !important;
}
html body.visual-refresh #about .about76 {
  background: transparent !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
}
html body.visual-refresh.horizontal-snap #contact .contact-layout {
  width: min(1160px, 100%) !important;
  grid-template-columns: minmax(0, .95fr) minmax(0, 1.05fr) !important;
  gap: clamp(32px, 4vw, 64px) !important;
}
html body.visual-refresh .about76__method-row article {
  border-top: 1px solid var(--line);
}
html body.visual-refresh .contact-email {
  background: color-mix(in srgb, var(--accent) 8%, var(--surface)) !important;
  border-color: color-mix(in srgb, var(--accent) 35%, var(--line)) !important;
}
html body.visual-refresh :is(.contact-email, .contact-links a) {
  animation: none !important;
  will-change: auto !important;
  transition: background .16s ease, border-color .16s ease !important;
}
html body.visual-refresh :is(.contact-email, .contact-links a):hover {
  transform: none !important;
  background: color-mix(in srgb, var(--accent) 12%, var(--surface)) !important;
  border-color: var(--accent) !important;
}

/* Case studies and CV share the quieter presentation without changing content. */
html body.visual-refresh .case-study-veil {
  background: var(--paper) !important;
}
html body.visual-refresh .case-study-veil::before,
html body.visual-refresh .case-study-veil::after {
  display: none !important;
}
html body.visual-refresh .case-study-rail button.is-active {
  background: color-mix(in srgb, var(--project-tone, var(--accent)) 12%, var(--paper)) !important;
  box-shadow: none !important;
}
html body.visual-refresh.case-study-page::before,
html body.visual-refresh.case-study-page::after,
html body.visual-refresh .case76-chapter::before,
html body.visual-refresh .case76-chapter::after,
html body.visual-refresh :is(.case76-hero-art, .case76-media-card, .case76-heading)::before,
html body.visual-refresh :is(.case76-hero-art, .case76-heading)::after,
html body.visual-refresh .case76-video::before,
html body.visual-refresh .case76-video::after {
  display: none !important;
}
html body.visual-refresh .case76-hero-art img {
  border: 1px solid var(--line) !important;
  border-radius: var(--refresh-radius) !important;
  box-shadow: none !important;
}
html body.visual-refresh .case76-topbar {
  border-bottom: 1px solid var(--line) !important;
}
html body.visual-refresh .case76-play {
  box-shadow: none !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
}
html body.visual-refresh .case76-deck {
  color: var(--ink-2) !important;
  font-weight: 450 !important;
  line-height: 1.6 !important;
}
html body.visual-refresh .cv-contact-grid a {
  background: var(--surface) !important;
  border-color: var(--line) !important;
}
html body.visual-refresh .cv-download {
  background: var(--accent) !important;
  color: var(--accent-on, #151515) !important;
}
html[data-theme="light"] body.visual-refresh .cv-hero h1 em,
html[data-theme="light"] body.visual-refresh .cv-hero-summary > span {
  color: color-mix(in srgb, var(--accent) 65%, #20242a) !important;
}
html[data-theme="light"] body.visual-refresh .case76-hero h1 em {
  color: color-mix(in srgb, var(--project, var(--accent)) 65%, #20242a) !important;
}
html[data-theme="light"] body.visual-refresh .project-evidence dt {
  color: color-mix(in srgb, var(--project, var(--accent)) 55%, #20242a) !important;
}
html[data-theme="light"] body.visual-refresh :is(.case76-meta > span, .case76-heading > span, .case76-context-copy small, .case76-doc small, .case76-flow b) {
  color: color-mix(in srgb, var(--project, var(--accent)) 55%, #20242a) !important;
}
html body.visual-refresh .cv-contact a {
  border-radius: 10px !important;
  background: var(--surface) !important;
  border-color: var(--line) !important;
  box-shadow: none !important;
}
html body.visual-refresh .field {
  display: none !important;
}
html body.visual-refresh .copy {
  background: transparent !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
}
html body.visual-refresh .copy a {
  background: var(--surface) !important;
  border-color: var(--line) !important;
  border-radius: 10px !important;
  box-shadow: none !important;
}
html body.visual-refresh :is(a, button, input, select, textarea):focus-visible {
  outline: 2px solid var(--accent-readable, var(--ink)) !important;
  outline-offset: 4px !important;
}

@media (min-width: 701px) {
  html body.visual-refresh:not(.mobile-continuous) .case-study-layer[data-project-theme="cultureport"] .case-study-rail {
    display: grid !important;
  }
}

@media screen and (max-width: 700px), screen and (max-width: 1000px) and (max-height: 700px) and (pointer: coarse) {
  html body.visual-refresh.mobile-continuous:is(.nav-expanded, :not(.nav-expanded)) .sidebar {
    background: none !important;
  }
  html body.visual-refresh.mobile-continuous .sidebar::before {
    background: var(--paper) !important;
    border-bottom: 1px solid var(--line);
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
  }
  html body.visual-refresh.mobile-continuous:is(.nav-expanded, :not(.nav-expanded)) .sidebar-nav {
    left: 0 !important;
    right: 0 !important;
    bottom: 0 !important;
    height: calc(66px + env(safe-area-inset-bottom)) !important;
    padding: 6px 8px calc(6px + env(safe-area-inset-bottom)) !important;
    border: 0 !important;
    border-top: 1px solid var(--line) !important;
    border-radius: 0 !important;
    background: var(--paper) !important;
    box-shadow: none !important;
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
  }
  html body.visual-refresh.mobile-continuous:is(.nav-expanded, :not(.nav-expanded)) .sidebar-nav > button {
    height: 52px !important;
    gap: 5px !important;
    border-radius: 9px !important;
  }
  html body.visual-refresh.mobile-continuous:is(.nav-expanded, :not(.nav-expanded)) .sidebar-nav > button > b {
    font-size: 10px !important;
    font-weight: 650 !important;
  }
  html body.visual-refresh.mobile-continuous:is(.nav-expanded, :not(.nav-expanded)) .sidebar-nav .nav-number {
    font-size: 9px !important;
    font-weight: 500 !important;
    opacity: .8;
  }
  html body.visual-refresh.mobile-continuous:is(.nav-expanded, :not(.nav-expanded)) .floating-controls > button {
    border: 1px solid var(--line) !important;
    border-radius: 10px !important;
    background: var(--paper) !important;
    box-shadow: none !important;
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
  }
  html body.visual-refresh.mobile-continuous:is(.nav-expanded, :not(.nav-expanded)) #top .dp-hero-v6__nameplate {
    background: var(--paper) !important;
    border-color: var(--line) !important;
    border-radius: 12px !important;
    box-shadow: none !important;
  }
  html body.visual-refresh.mobile-continuous:is(.nav-expanded, :not(.nav-expanded)) #work :is(.project-copy, .project-visual),
  html body.visual-refresh.mobile-continuous:is(.nav-expanded, :not(.nav-expanded)) #archive :is(.archive-feature, .archive-meta),
  html body.visual-refresh.mobile-continuous:is(.nav-expanded, :not(.nav-expanded)) #reviews .review-card,
  html body.visual-refresh.mobile-continuous:is(.nav-expanded, :not(.nav-expanded)) #journey .landmark-story,
  html body.visual-refresh.mobile-continuous:is(.nav-expanded, :not(.nav-expanded)) #contact :is(.contact-email, .contact-links a) {
    border-radius: var(--refresh-radius) !important;
    box-shadow: none !important;
    border-color: var(--line) !important;
    background: var(--surface) !important;
  }
  html body.visual-refresh.mobile-continuous:is(.nav-expanded, :not(.nav-expanded)) #work .project-copy {
    padding: 24px 20px !important;
  }
  html body.visual-refresh.mobile-continuous:is(.nav-expanded, :not(.nav-expanded)) #work .project-copy h3 {
    line-height: 1.08 !important;
    letter-spacing: -.04em !important;
  }
  html body.visual-refresh.mobile-continuous:is(.nav-expanded, :not(.nav-expanded)) #work .project-tabs button {
    border-radius: 10px !important;
    box-shadow: none !important;
  }
  html body.visual-refresh.mobile-continuous:is(.nav-expanded, :not(.nav-expanded)) #about .about76__story {
    padding: 24px 4px !important;
  }
  html body.visual-refresh.mobile-continuous:is(.nav-expanded, :not(.nav-expanded)) #about .about76__lead {
    line-height: 1.35 !important;
  }
  html body.visual-refresh.mobile-continuous:is(.nav-expanded, :not(.nav-expanded)) #about .about76__note {
    line-height: 1.7 !important;
  }
  html body.visual-refresh.mobile-continuous:is(.nav-expanded, :not(.nav-expanded)) #contact .contact-layout {
    gap: 32px !important;
  }
  html body.visual-refresh.mobile-continuous:is(.nav-expanded, :not(.nav-expanded)) #contact .contact-intro,
  html body.visual-refresh.mobile-continuous:is(.nav-expanded, :not(.nav-expanded)) #contact .contact-intro h2 {
    text-align: left !important;
    margin-inline: 0 !important;
  }
  html body.visual-refresh.mobile-continuous:is(.nav-expanded, :not(.nav-expanded)) #contact .contact-intro h2 {
    font-size: clamp(2.6rem, 11.5vw, 4rem) !important;
    line-height: 1 !important;
    letter-spacing: -.055em !important;
  }
  html body.visual-refresh.mobile-continuous:is(.nav-expanded, :not(.nav-expanded)) #contact .contact-email {
    background: color-mix(in srgb, var(--accent) 8%, var(--surface)) !important;
    border-color: color-mix(in srgb, var(--accent) 30%, var(--line)) !important;
  }
  html body.visual-refresh.mobile-continuous:is(.nav-expanded, :not(.nav-expanded)) #contact .contact-links a {
    min-height: 88px !important;
  }
  html body.visual-refresh .case76-mobile-actions {
    border-radius: 12px !important;
    border: 1px solid var(--line) !important;
  }
}

/* Reserve real scroll space above the fixed footer in very short desktop windows. */
@media screen and (max-height: 420px) {
  html body.visual-refresh.horizontal-snap #site-stage .title-panel {
    padding-bottom: calc(var(--footer-height, 42px) + 48px) !important;
  }
}

/* CV labels stay readable at their natural size, including small phone screens. */
@media screen {
  html body.visual-refresh#cvTop .case76-topbar a {
    display: inline-flex !important;
    align-items: center !important;
    min-height: 44px !important;
    font-size: .8125rem !important;
  }
  html body.visual-refresh#cvTop .case76-topbar__brand span {
    font-size: .75rem !important;
  }
  html body.visual-refresh#cvTop .cv-hero h1 em,
  html body.visual-refresh#cvTop .cv-hero-summary > span {
    color: var(--accent-readable, var(--ink)) !important;
  }
  html body.visual-refresh#cvTop .case76-topbar__title,
  html body.visual-refresh#cvTop .cv-hero-title > p,
  html body.visual-refresh#cvTop .cv-profile-tag,
  html body.visual-refresh#cvTop .cv-section-label > span,
  html body.visual-refresh#cvTop .cv-capabilities small {
    font-size: .75rem !important;
    line-height: 1.6 !important;
    letter-spacing: .075em !important;
  }
  html body.visual-refresh#cvTop :is(.cv-profile-tag, .cv-section-label > span, .cv-capabilities small, .cv-timeline time) {
    color: var(--muted) !important;
  }
  html body.visual-refresh#cvTop .cv-profile-tag {
    background: var(--surface) !important;
  }
  html body.visual-refresh#cvTop .cv-contact a:hover {
    color: var(--ink) !important;
  }
  html body.visual-refresh#cvTop .cv-contact a {
    display: inline-flex !important;
    justify-content: center !important;
    align-items: center !important;
    min-height: 44px !important;
    padding: 10px 14px !important;
    font-size: .875rem !important;
    line-height: 1.4 !important;
  }
  html body.visual-refresh#cvTop .cv-download span small {
    opacity: 1 !important;
    font-size: .6875rem !important;
    line-height: 1.5 !important;
    letter-spacing: .07em !important;
  }
  html body.visual-refresh#cvTop .cv-download,
  html body.visual-refresh#cvTop .cv-download:hover {
    background: var(--accent) !important;
  }
  html body.visual-refresh#cvTop .cv-download span strong {
    font-size: .9375rem !important;
    line-height: 1.4 !important;
  }
  html body.visual-refresh#cvTop .cv-timeline time {
    font-size: .8125rem !important;
    line-height: 1.6 !important;
  }
  html body.visual-refresh#cvTop .cv-timeline strong {
    font-size: .875rem !important;
    line-height: 1.6 !important;
  }
  html body.visual-refresh#cvTop :is(.cv-timeline p, .cv-capabilities p) {
    font-size: 1rem !important;
    line-height: 1.75 !important;
  }
  html body.visual-refresh#cvTop .cv-timeline h3 {
    line-height: 1.2 !important;
  }
  html body.visual-refresh#cvTop .cv-tools span {
    font-size: .8125rem !important;
    line-height: 1.5 !important;
  }
  html body.visual-refresh#cvTop .cv-footer,
  html body.visual-refresh#cvTop .cv-footer small {
    font-size: .75rem !important;
    line-height: 1.6 !important;
  }
  html body.visual-refresh.page-not-found .brand {
    font-size: .6875rem !important;
    line-height: 1.5 !important;
  }
  html body.visual-refresh.page-not-found .copy small {
    color: var(--ink-2) !important;
    font-size: .75rem !important;
    line-height: 1.5 !important;
    letter-spacing: .08em !important;
  }
  html body.visual-refresh.page-not-found .copy p {
    font-size: .9375rem !important;
    line-height: 1.7 !important;
  }
  html body.visual-refresh.page-not-found .copy a {
    font-size: .8125rem !important;
    line-height: 1.5 !important;
    letter-spacing: .06em !important;
  }
}
@media screen and (max-width: 700px), screen and (max-width: 1000px) and (max-height: 700px) and (pointer: coarse) {
  html body.visual-refresh#cvTop .cv-page {
    width: calc(100% - 40px) !important;
  }
  html body.visual-refresh#cvTop .case76-topbar {
    padding-inline: 20px !important;
  }
  html body.visual-refresh#cvTop .cv-footer {
    padding: 20px !important;
  }
  /* Keep the return action after the document instead of over reading text. */
  html body.visual-refresh#cvTop .cv-back-top {
    position: relative !important;
    inset: auto !important;
    z-index: auto !important;
    display: grid !important;
    flex: 0 0 auto !important;
    margin: 0 20px max(24px, env(safe-area-inset-bottom)) auto !important;
    box-shadow: none !important;
  }
  html.is-embedded body.visual-refresh#cvTop .cv-back-top {
    display: none !important;
  }
}

.cv-print-copy { display: none; }

/* Accessibility preferences remain stronger than the presentation palette. */
html body.visual-refresh.a11y-high-contrast {
  --ink: #fff;
  --ink-2: #fff;
  --muted: #e4e4e4;
  --line: rgb(255 255 255 / .45);
}
html[data-theme="light"] body.visual-refresh.a11y-high-contrast {
  --ink: #080808;
  --ink-2: #111;
  --muted: #222;
  --line: rgb(0 0 0 / .45);
}
@media print {
  html:has(body.visual-refresh#cvTop) {
    background: #fff !important;
    color-scheme: light !important;
    height: auto !important;
    min-height: 0 !important;
  }
  html:has(body.visual-refresh.cv-open),
  html body.visual-refresh.cv-open {
    height: auto !important;
    min-height: 0 !important;
    overflow: visible !important;
    background: #fff !important;
    color-scheme: light !important;
  }
  html body.visual-refresh.cv-open > :not([data-cv-layer]),
  html body.visual-refresh.cv-open [data-cv-layer] :is(.case-study-bar, .case-study-veil) {
    display: none !important;
  }
  html body.visual-refresh.cv-open #portfolio-cursor {
    display: none !important;
  }
  html body.visual-refresh.cv-open [data-cv-layer]:not([hidden]),
  html body.visual-refresh.cv-open [data-cv-layer]:not([hidden]) .case-study-scroller {
    display: block !important;
    position: static !important;
    inset: auto !important;
    width: 100% !important;
    height: auto !important;
    min-height: 0 !important;
    max-height: none !important;
    padding: 0 !important;
    margin: 0 !important;
    overflow: visible !important;
    background: #fff !important;
    transform: none !important;
    opacity: 1 !important;
    outline: 0 !important;
  }
  html body.visual-refresh.cv-open [data-cv-frame] {
    display: none !important;
  }
  html body.visual-refresh.cv-open .cv-print-copy {
    display: block !important;
    background: #fff !important;
    color: #111 !important;
    font-family: Arial, Helvetica, sans-serif !important;
    line-height: 1.55 !important;
  }
  html body.visual-refresh {
    --paper: #fff;
    --surface: #fff;
    --ink: #111;
    --ink-2: #222;
    --muted: #444;
  }
  html body.visual-refresh:is(#cvTop, .cv-open) {
    display: block !important;
    height: auto !important;
    min-height: 0 !important;
    background: #fff !important;
    color: #111 !important;
    font-size: 12pt !important;
  }
  html body.visual-refresh:is(#cvTop, .cv-open) * {
    animation: none !important;
    transition: none !important;
    outline: 0 !important;
    box-shadow: none !important;
  }
  html body.visual-refresh:is(#cvTop, .cv-open) :is(h1, h1 em, h2, h3, p, a, a:hover, small, strong, span, time) {
    color: #111 !important;
    opacity: 1 !important;
    text-shadow: none !important;
  }
  html body.visual-refresh:is(#cvTop, .cv-open) :is(.case76-topbar, .cv-atmosphere, .cv-footer, .cv-back-top, .cv-hero-actions) {
    display: none !important;
  }
  html body.visual-refresh:is(#cvTop, .cv-open) .cv-page {
    width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
  }
  html body.visual-refresh:is(#cvTop, .cv-open) .cv-hero {
    display: block !important;
    min-height: 0 !important;
    padding-bottom: 18pt !important;
  }
  html body.visual-refresh:is(#cvTop, .cv-open) .cv-hero h1 {
    margin-block: 12pt !important;
    font-size: 40pt !important;
    line-height: 1.05 !important;
    letter-spacing: -.035em !important;
  }
  html body.visual-refresh:is(#cvTop, .cv-open) .cv-hero h1 em {
    font-family: Georgia, "Times New Roman", serif !important;
  }
  html body.visual-refresh:is(#cvTop, .cv-open) :is(.cv-hero-summary > p, .cv-profile-copy p, .cv-timeline p, .cv-capabilities p) {
    font-size: 12pt !important;
    line-height: 1.55 !important;
  }
  html body.visual-refresh:is(#cvTop, .cv-open) :is(.cv-hero-title > p, .cv-profile-tag, .cv-contact a, .cv-section-label > span, .cv-timeline time, .cv-timeline strong, .cv-capabilities small, .cv-tools span) {
    font-size: 11pt !important;
    line-height: 1.5 !important;
    letter-spacing: normal !important;
  }
  html body.visual-refresh:is(#cvTop, .cv-open) .cv-profile-tag {
    background: #fff !important;
    border-color: #888 !important;
  }
  html body.visual-refresh:is(#cvTop, .cv-open) .cv-profile-tag::before {
    display: none !important;
  }
  html body.visual-refresh:is(#cvTop, .cv-open) .cv-contact {
    display: flex !important;
    flex-wrap: wrap !important;
    gap: 8pt !important;
    margin-top: 12pt !important;
  }
  html body.visual-refresh:is(#cvTop, .cv-open) .cv-contact a {
    background: #fff !important;
    border-color: #888 !important;
    text-decoration: underline !important;
    padding: 4pt 7pt !important;
    border: 1px solid #888 !important;
  }
  html body.visual-refresh:is(#cvTop, .cv-open) .cv-section {
    display: block !important;
    padding-block: 18pt !important;
    break-inside: auto !important;
  }
  html body.visual-refresh:is(#cvTop, .cv-open) .cv-section-label {
    position: static !important;
    margin-bottom: 14pt !important;
    break-after: avoid !important;
    display: flex !important;
    align-items: baseline !important;
    gap: 8pt !important;
  }
  html body.visual-refresh:is(#cvTop, .cv-open) .cv-section-label h2 {
    margin: 0 !important;
    font-size: 22pt !important;
    line-height: 1.2 !important;
  }
  html body.visual-refresh:is(#cvTop, .cv-open) .cv-timeline article {
    display: grid !important;
    grid-template-columns: 80pt minmax(0, 1fr) !important;
    gap: 14pt !important;
    break-inside: avoid !important;
    padding-block: 12pt !important;
  }
  html body.visual-refresh:is(#cvTop, .cv-open) .cv-timeline h3 {
    margin: 0 !important;
    font-size: 15pt !important;
    line-height: 1.2 !important;
  }
  html body.visual-refresh:is(#cvTop, .cv-open) .cv-capabilities article {
    min-height: 0 !important;
    break-inside: avoid !important;
    background: #fff !important;
    padding: 12pt !important;
  }
  html body.visual-refresh:is(#cvTop, .cv-open) :is(.cv-profile-copy, .cv-capabilities) {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 14pt !important;
  }
  html body.visual-refresh:is(#cvTop, .cv-open) .cv-tools {
    display: flex !important;
    flex-wrap: wrap !important;
    gap: 6pt !important;
  }
  html body.visual-refresh:is(#cvTop, .cv-open) .cv-tools span {
    padding: 5pt 7pt !important;
  }
  html body.visual-refresh:is(#cvTop, .cv-open) :is(.cv-profile-copy p, .cv-capabilities p) {
    margin: 0 !important;
  }
  html body.visual-refresh:is(#cvTop, .cv-open) .cv-timeline p {
    margin: 6pt 0 0 !important;
  }
  html body.visual-refresh:is(#cvTop, .cv-open) .cv-timeline strong {
    display: block !important;
    margin-top: 4pt !important;
  }
  html body.visual-refresh:is(#cvTop, .cv-open) .cv-capabilities h3 {
    margin: 0 0 6pt !important;
    font-size: 15pt !important;
    line-height: 1.2 !important;
  }
  html body.visual-refresh:is(#cvTop, .cv-open) .cv-section:has(.cv-tools) {
    break-inside: avoid !important;
  }
}

/* Keep controls and the real monogram visible in system high-contrast palettes. */
@media (forced-colors: active) {
  html body.visual-refresh :is(#portfolioNavigation .sidebar-brand, .case76-topbar__brand, .no-script-brand) {
    position: relative !important;
  }
  html body.visual-refresh :is(#portfolioNavigation .sidebar-brand, .case76-topbar__brand, .no-script-brand) > img {
    visibility: hidden !important;
  }
  html body.visual-refresh :is(#portfolioNavigation .sidebar-brand, .case76-topbar__brand, .no-script-brand)::after {
    content: "" !important;
    position: absolute !important;
    display: block !important;
    inset: 50% auto auto 0 !important;
    width: 32px !important;
    height: 32px !important;
    background: CanvasText !important;
    -webkit-mask: url("../images/brand/monogram.svg?v=4") center / contain no-repeat !important;
    mask: url("../images/brand/monogram.svg?v=4") center / contain no-repeat !important;
    transform: translateY(-50%) !important;
    animation: none !important;
    pointer-events: none;
    forced-color-adjust: none;
  }
  html body.visual-refresh.editorial-v1 #portfolioNavigation .portfolio-preferences > summary {
    min-width: 108px !important;
    min-height: 44px !important;
    padding: 0 10px !important;
    border: 1px solid ButtonText !important;
    border-radius: 6px !important;
    color: ButtonText !important;
  }
  html body.visual-refresh.editorial-v1 #portfolioNavigation .portfolio-preferences > summary .interface-icon {
    display: none !important;
  }
  html body.visual-refresh.editorial-v1 #portfolioNavigation .portfolio-preferences > summary > span {
    display: inline !important;
  }
  html body.visual-refresh .accessibility-options button::before {
    background: Canvas !important;
    border: 1px solid ButtonText !important;
    forced-color-adjust: none;
  }
  html body.visual-refresh .accessibility-options button::after {
    background: ButtonText !important;
    forced-color-adjust: none;
  }
  html body.visual-refresh .accessibility-options button[aria-pressed="true"]::before {
    background: Highlight !important;
    border-color: Highlight !important;
  }
  html body.visual-refresh .accessibility-options button[aria-pressed="true"]::after {
    background: HighlightText !important;
  }
}