/* Only the new project opts into these styles. The portfolio's grid and tokens
   remain the shared source of spacing, fonts, colours and breakpoints. */
.wycinanka-layout {
  align-items: start;
  padding-top: clamp(42px, 21.94px + 5.1429vw, 96px);
  padding-bottom: clamp(80px, 10vw, 144px);
}
.wycinanka-metadata span { display: block; }
.wycinanka-study { grid-area: 2 / 2 / auto / 5; min-width: 0; }
.wycinanka-stage { padding-block: 80px 110px; min-height: calc(clamp(88px, 11.12vw, 160px) * 1.04 + 190px); display: flex; align-items: center; }
.wycinanka-word { position: relative; display: inline-block; max-width: 100%; color: var(--project-text); font: 400 clamp(88px, 11.12vw, 160px) / 1.04 var(--display-font); }
.wycinanka-word > .label { display: inline-block; min-width: .2em; white-space: pre; outline: none; cursor: text; caret-color: var(--project-text); }
.wycinanka-word > .label:empty::before { content: attr(data-placeholder); }
.wycinanka-word > .label::selection { background: #28282824; }
.wycinanka-word > .growth { position: absolute; left: 0; top: 0; display: block; pointer-events: none; color: inherit; line-height: 0; }
.wycinanka-word > .growth svg { display: block; overflow: visible; }
.wycinanka-word .safe-box, .wycinanka-word .ink-outline { display: none; }
html.is-page-transitioning .wycinanka-word .growth, html.initial-intro-pending .wycinanka-word .growth { visibility: hidden !important; }
.wycinanka-controls { display: flex; align-items: center; flex-wrap: wrap; gap: 14px; color: var(--project-text); }
.wycinanka-control { box-sizing: border-box; display: inline-flex; align-items: center; justify-content: center; gap: 8px; min-height: 26px; padding: 2px 7px; margin: 0; border: 1px solid currentColor; border-radius: 2px; background: transparent; color: inherit; font: 400 16px / 1.15 var(--body-font); user-select: none; -webkit-tap-highlight-color: transparent; }
.wycinanka-seed { cursor: pointer; transition: background-color .12s, color .12s; }
@media (hover: hover) and (pointer: fine) {
  .wycinanka-seed:hover { background: #28282828; }
  .wycinanka-hover:hover input:not(:checked) + .wycinanka-checkbox { background: var(--project-muted); }
}
.wycinanka-seed:active { background: var(--project-text); color: var(--project-background); border-color: var(--project-text); }
.wycinanka-control:focus-visible, .wycinanka-control:has(:focus-visible) { outline: 1px solid var(--project-text); outline-offset: 4px; }
.wycinanka-density input { appearance: none; -webkit-appearance: none; width: 76px; height: 18px; padding: 0; margin: 0; background: transparent; color: inherit; cursor: ew-resize; outline: none; }
.wycinanka-density input::-webkit-slider-runnable-track { height: 1px; background: currentColor; }
.wycinanka-density input::-moz-range-track { height: 1px; background: currentColor; }
.wycinanka-density input::-webkit-slider-thumb { appearance: none; -webkit-appearance: none; width: 7px; height: 7px; margin-top: -3px; border: 0; border-radius: 50%; background: currentColor; transition: transform .12s; }
.wycinanka-density input::-moz-range-thumb { width: 7px; height: 7px; border: 0; border-radius: 50%; background: currentColor; transition: transform .12s; }
.wycinanka-density:has(input:hover) input::-webkit-slider-thumb, .wycinanka-density.is-dragging input::-webkit-slider-thumb, .wycinanka-density:has(input:focus-visible) input::-webkit-slider-thumb { transform: scale(1.6); }
.wycinanka-density:has(input:hover) input::-moz-range-thumb, .wycinanka-density.is-dragging input::-moz-range-thumb, .wycinanka-density:has(input:focus-visible) input::-moz-range-thumb { transform: scale(1.6); }
.wycinanka-hover { position: relative; cursor: pointer; }
.wycinanka-hover input { position: absolute; opacity: 0; width: 100%; height: 100%; margin: 0; inset: 0; cursor: pointer; }
.wycinanka-checkbox { width: 11px; height: 11px; box-sizing: border-box; border: 1px solid currentColor; border-radius: 2px; background: transparent; transition: background-color .12s; }
.wycinanka-hover input:checked + .wycinanka-checkbox { background: var(--project-text); }
.wycinanka-introduction { max-width: none; margin: 32px 0 0; color: var(--project-text); font-size: var(--description-size); line-height: 1.08; }
/* Atomic UI snapshots join the same initial, exit, entry and scroll animations. */
html.reveal-enabled main [data-transition-object] { opacity: 0; filter: blur(var(--reveal-blur)); transform: translateY(var(--reveal-distance)); }
html.reveal-enabled main [data-transition-object].is-revealed { opacity: 1; filter: none; transform: none; }
html.reveal-enabled main [data-transition-object]:is(.reveal-immediate,.reveal-complete) { opacity: 1; filter: none; transform: none; }
html.reveal-enabled main [data-transition-object]:not(.is-revealed), html.reveal-enabled main [data-transition-object].scroll-reveal-running { transition: none !important; }
html.initial-intro-pending:not(.initial-intro-measuring):not(.initial-intro-running) main [data-transition-object], html.page-transition-preparing-destination main [data-transition-object] { opacity: 0 !important; filter: none !important; }
html.page-transition-measuring main [data-transition-object] { opacity: 1 !important; filter: none !important; transform: none !important; }
@media (width >= 641px) and (width <= 1100px) {
  .wycinanka-layout { column-gap: clamp(0px, calc((100vw - 640px) * .04978), var(--gutter)); grid-template-columns: minmax(0,clamp(0px,40.435vw - 258.784px,186px)) repeat(4,minmax(0,1fr)); }
}
@media (width <= 640px) {
  .wycinanka-layout { padding-top: 42px; }
  .wycinanka-layout .bureau-title { grid-area: 1 / 1 / auto / -1; }
  .wycinanka-metadata { grid-area: 2 / 1 / auto / -1; margin-top: var(--title-metadata-gap); }
  .wycinanka-metadata span { display: inline; }
  .wycinanka-metadata span + span::before { content: ' '; }
  .wycinanka-study { grid-area: 3 / 1 / auto / -1; }
  .wycinanka-stage { min-height: 251px; padding: 88px 38px 88px; }
  .wycinanka-word { font-size: 72px; }
  .wycinanka-controls { gap: 12px; }
  .wycinanka-introduction { max-width: none; margin-top: 28px; font-size: 16px; line-height: 1.08; }
  .project--wycinanka .project-title { grid-row: 1; }
  .project--wycinanka .project-category { grid-row: 2; }
  .project--wycinanka .project-description { grid-row: 3; }
}
@media (hover: none), (pointer: coarse), (width <= 640px) { .wycinanka-hover { display: none; } }
@media (prefers-reduced-motion: reduce) {
  html.reveal-enabled main [data-transition-object] { opacity: 1 !important; filter: none !important; transform: none !important; }
  .wycinanka-control, .wycinanka-checkbox { transition: none; }
}

/* Project story: the same three-column body, captions and image-strip behaviour
   used by the portfolio's other project pages. */
.wycinanka-autonomous-section, .wycinanka-illustrations { grid-column: 2 / 5; min-width: 0; }
.wycinanka-autonomous-section { grid-row: 3; margin-top: 28px; }
.wycinanka-section-copy { max-width: none; color: var(--project-text); font-size: var(--description-size); line-height: 1.08; margin: 0; }
.wycinanka-autonomous-figure { margin: 80px 0 0; }
.wycinanka-autonomous { width: min(100%,360px); aspect-ratio: 1; color: var(--project-text); line-height: 0; }
.wycinanka-autonomous svg { display: block; width: 100%; height: 100%; }
.wycinanka-illustrations { grid-row: 4; margin-top: 80px; }
.wycinanka-illustration-strip { --strip-gap: var(--gutter); --strip-image-height: auto; }
.wycinanka-illustration-strip .project-image-strip-item { width: calc((100% - 2 * var(--gutter)) / 3); }
.wycinanka-illustration-strip img { width: 100%; height: auto; aspect-ratio: 1; }
.wycinanka-illustration-copy { max-width: none; }
@media (width <= 640px) {
  .wycinanka-autonomous-section, .wycinanka-illustrations { grid-column: 1 / -1; }
  .wycinanka-autonomous-section { grid-row: 4; margin-top: 28px; }
  .wycinanka-section-copy { max-width: none; font-size: 16px; line-height: 1; }
  .wycinanka-autonomous-figure { margin-top: 38px; }
  .wycinanka-autonomous { width: min(100%,310px); }
  .wycinanka-illustrations { grid-row: 5; margin-top: 38px; }
  .wycinanka-illustration-strip { --strip-gap: 18.2px; width: 100vw; max-width: none; margin-left: calc(-1 * var(--page-margin)); padding-inline: var(--page-margin); }
  .wycinanka-illustration-strip .project-image-strip-item { width: clamp(250px,76vw,310px); }
  /* Bring the visible SVG silhouettes together without shrinking the artwork.
     The adjacent images overlap only inside their empty viewBox margins. */
  .wycinanka-illustration-strip .project-image-strip-item:not(:last-child) { margin-inline-end: -80px; }
  .wycinanka-illustration-copy { max-width: none; margin-top: 28px; }
}