/* Two columns: CV / vertically scrollable images. */
html:has(body.cv-site) { scrollbar-width: none; scroll-padding-block: 64px; }
html:has(body.cv-site)::-webkit-scrollbar, body.cv-site::-webkit-scrollbar { display: none; }
body.cv-site {
  --color-bg: #fff;
  --color-text: #111;
  --cv-gap: 16px;
  background: var(--color-bg);
  color: var(--color-text);
  padding: 0;
  font-size: 15px;
  line-height: 1.65;
  letter-spacing: 0;
  word-break: keep-all;
  overflow-wrap: anywhere;
  scrollbar-width: none;
}
.cv-site p, .cv-site h1, .cv-site h2, .cv-site h3 { font-size: 15px; }
.cv-header, .cv-footer {
  position: fixed;
  inset-inline: 0;
  z-index: 100;
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: var(--cv-gap);
  align-items: baseline;
  padding: 4px 8px;
  background: var(--color-bg);
}
.cv-header { top: 0; }
.cv-footer { bottom: 0; padding-bottom: calc(4px + env(safe-area-inset-bottom)); }
body.admin-bar .cv-header { top: var(--wp-admin--admin-bar--height, 32px); }
.cv-page-nav, .cv-language-switch { display: flex; align-items: baseline; gap: 4px; }
.cv-page-nav { flex-wrap: wrap; }
.cv-language-switch button {
  border: 0;
  border-radius: 0;
  padding: 2px 0;
  line-height: inherit;
  font-size: 15px;
}
.cv-language-switch button[aria-pressed="true"],
.cv-page-nav a[aria-current="page"],
.cv-site a:focus-visible, .cv-site button:focus-visible {
  font-weight: 600;
}
.cv-header a:hover, .cv-contact:hover { text-decoration: underline; text-underline-offset: 3px; }
.cv-main { padding: 60px 8px; }
.cv-layout {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 16px;
  align-items: start;
}
.cv-copy { min-width: 0; }
.cv-section { margin-bottom: 24px; }
.cv-year-group + .cv-year-group { margin-top: 32px; }
.cv-year { font-variant-numeric: tabular-nums; }
.cv-year-group li + li { margin-top: 0; }
.cv-content li + li { margin-top: 4px; }
.cv-images {
  position: fixed;
  top: var(--wp-admin--admin-bar--height, 0px);
  bottom: 0;
  right: 8px;
  width: calc(50% - 16px);
  max-height: none;
  padding: 0;
  margin: 0;
  overflow-y: auto;
  scrollbar-width: none;
  display: grid;
  gap: 0;
}
.cv-images::-webkit-scrollbar { display: none; }
.cv-image {
  margin: 0;
}
.cv-image-file {
  display: block;
  width: 100%;
  height: auto;
}
.cv-image-placeholder {
  display: flex;
  align-items: center;
  justify-content: center;
  aspect-ratio: 4 / 3;
  flex-shrink: 0;
  background: #bfbfbf;
  color: #111;
}
@media (max-width: 800px) {
  .cv-layout { grid-template-columns: minmax(0, 1fr); gap: 20px; }
  .cv-section { margin-bottom: 20px; }
  .cv-images { position: static; width: auto; max-height: none; overflow: visible; }
}

.cv-name { font-weight: 400; }
.cv-year { font-weight: 700; margin-bottom: 0; }
.cv-timeline { padding-bottom: 64px; }
.cv-copyright { margin: 0; }

.cv-project-part:hover { text-decoration: underline; text-underline-offset: 3px; font-style: italic; }

.cv-page-nav a[aria-current="page"] { font-style: italic; }
.cv-lighting-toggle {
  padding: 0;
  border: 0;
  border-radius: 0;
  font: inherit;
  vertical-align: baseline;
}
.cv-footer-text, .cv-lighting-toggle, .cv-project-part {
  text-decoration: underline;
  text-decoration-color: transparent;
  text-underline-offset: 3px;
  transition: text-decoration-color 180ms ease;
}
.cv-footer-text:hover, .cv-lighting-toggle:hover, .cv-lighting-toggle:focus-visible,
.cv-project-part:hover {
  text-decoration-color: currentColor;
  font-style: italic;
}
.cv-lighting-toggle[aria-expanded="true"] { font-weight: 600; font-style: italic; }
.cv-lighting-panel {
  position: absolute;
  left: 8px;
  bottom: calc(100% + 4px);
  width: 200px;
  max-width: calc(100vw - 16px);
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 4px;
  padding: 4px;
  border: 0;
  background: color-mix(in srgb, var(--color-bg) 40%, transparent);
  -webkit-backdrop-filter: blur(12px);
  backdrop-filter: blur(12px);
}
.cv-color-chip {
  background: var(--chip-color);
  color: #111;
  border: 1px solid rgba(0, 0, 0, .2);
  border-radius: 0;
  height: 56px;
  padding: 4px;
  font-size: 15px;
  font-variant-numeric: tabular-nums;
}
.cv-color-chip[aria-pressed="true"] { box-shadow: inset 0 0 0 2px #111; font-weight: 600; }
.cv-color-chip:hover { font-style: italic; text-decoration: underline; }
body.cv-site, .cv-header, .cv-footer, .cv-lighting-panel { transition: background-color 180ms ease; }

.cv-project-role { display: none; }
.cv-language[lang="en"] { word-break: normal; }

/* Works: large title/year index with a fixed hover preview. */
.works-page {
  min-height: calc(100vh - 120px);
  padding-bottom: 40px;
}
.works-list {
  margin: 0;
  padding: 0;
  list-style: none;
}
.works-item { margin: 0 0 2px; }
.works-link {
  display: block;
  width: fit-content;
  max-width: 100%;
  font-size: 64px;
  line-height: 1.08;
  letter-spacing: -.025em;
  text-decoration: none;
  transition: none;
}
.works-link:hover,
.works-link:focus-visible {
  font-weight: 600;
  font-style: italic;
}
.works-year { font-variant-numeric: tabular-nums; }
.works-scroll-status {
  position: fixed;
  top: 0;
  left: 0;
  z-index: 200;
  pointer-events: none;
  font-size: 12px;
  line-height: 1;
  color: var(--color-text);
}
.works-scroll-progress {
  position: fixed;
  left: 0;
  right: 0;
  bottom: var(--works-footer-height, 33px);
  height: 4px;
  z-index: 99;
  pointer-events: none;
  background: var(--color-text);
  transform: scaleX(var(--works-progress, 0));
  transform-origin: left;
}
.works-thumbnail {
  position: fixed;
  top: 48px;
  right: 8px;
  z-index: 90;
  display: block;
  width: min(400px, calc(100vw - 16px));
  pointer-events: none;
  opacity: 0;
  visibility: hidden;
  transform: translateY(-4px);
  transition: opacity 160ms ease, transform 160ms ease, visibility 0s linear 160ms;
}
.works-link:hover .works-thumbnail,
.works-link:focus-visible .works-thumbnail {
  opacity: 1;
  visibility: visible;
  transform: translateY(0);
  transition-delay: 0s;
}
.works-thumbnail img {
  display: block;
  width: 100%;
  height: auto;
  max-height: calc(100vh - 96px);
  object-fit: contain;
  object-position: top right;
}
.works-thumbnail-placeholder {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  aspect-ratio: 4 / 3;
  padding: 16px;
  background: #bfbfbf;
  color: #111;
  font-size: 15px;
  line-height: 1.4;
  font-style: normal;
  font-weight: 400;
  text-align: center;
}
@media (max-width: 800px) {
  .works-thumbnail { width: min(400px, calc(100vw - 16px)); }
}
@media (hover: none) {
  .works-thumbnail { display: none; }
}

.work-back { display: inline-block; margin-bottom: 24px; }
.cv-site .work-single-title { font-size: 64px; line-height: 1.08; font-weight: 400; max-width: 24ch; }
.work-single[lang="en"] .work-single-title { font-style: italic; }
.work-single-year { margin-top: 12px; }
.work-single-information { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 32px; margin-top: 48px; padding-bottom: 64px; }
.work-single-credit { max-width: 65ch; }
.work-single-facts > div { display: grid; grid-template-columns: 100px 1fr; gap: 16px; margin-bottom: 8px; }
.work-single-facts dd { margin: 0; }
@media (max-width: 800px) {
  .cv-site .work-single-title { font-size: clamp(36px, 8vw, 64px); }
  .work-single-information { grid-template-columns: 1fr; gap: 24px; }
}
