/* Shared layout. All dimensions can be edited here; no build step is required. */
* { box-sizing: border-box; }
html { background: #fff; color: #000; }
body { margin: 0; font-family: Helvetica, Arial, sans-serif; font-size: 12px; line-height: 1.25; }

a {
  color: inherit;
  text-decoration: none;
  font-size: 12px;
  line-height: 13px;
}


a:hover {
  color: #000;
  font-weight: bold;
  text-decoration: none;
}

a:focus-visible { outline: 2px solid currentColor; outline-offset: 4px; }
.site-grid { display: grid; grid-template-columns: 181px 181px minmax(0, 825px); column-gap: 24px; align-items: start; margin: 37px 36px 64px; }
#container-main_nav { grid-column: 1; grid-row: 1; padding-top: 75px; }
.site-name {
  display: block;
  font-weight: bold;
  line-height: 14px;
  margin-bottom: 0;
}
#container-sub_nav { grid-column: 2; grid-row: 1; overflow-wrap: anywhere; }
#main { grid-column: 3; grid-row: 1; min-width: 0; }
#container-content_txt { font-size: 23px; line-height: 1.05; overflow-wrap: anywhere; }
#container-content_picture { margin-top: 36px; overflow-wrap: anywhere; }
#container-content_txt:empty { display: none; }
.section-news #container-content_picture { margin-top: 0; }
.section-contact #container-content_txt, .section-links #container-content_txt { font-size: 12px; line-height: 1.3; }


.txt {
  font-size: 12px;
  line-height: 14px;
}

.txt_big {
  font-size: 23px;
  line-height: 22px;
}

.link_big {
  font-size: 23px;
  line-height: 24px;
}

.page-home .site-name {
  font-size: 23px;
  line-height: 22px;
}

.txt_small { font-size: 11px; line-height: 1.2; }
#main img { max-width: 100%; height: auto; }
#main table { max-width: 100%; border-collapse: collapse; }
#main td { overflow-wrap: anywhere; }
#main iframe, #main video { max-width: 100%; }
#main iframe[src*="vimeo.com"],
#main iframe[src*="youtube.com"] {
  max-width: 100%;
}

#main iframe[src*="180339052"] {
  width: 667px;
  max-width: 100%;
  height: auto;
  aspect-ratio: 5 / 4;
}

.visually-hidden, .skip-link:not(:focus) { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
.skip-link:focus { position: fixed; top: 8px; left: 8px; padding: 12px; background: #fff; z-index: 10; }
@media (max-width: 1050px) and (min-width: 701px) {
 .site-grid { grid-template-columns: 160px 160px minmax(0, 1fr); gap: 20px; margin-inline: 24px; }
}
@media (max-width: 700px) {
 body { font-size: 14px; line-height: 1.4; }
 .site-grid { display: flex; flex-direction: column; gap: 28px; margin: 28px 20px 48px; }
 #container-main_nav, #container-sub_nav, #main { width: 100%; padding: 0; }
 .site-name { font-size: 23px; line-height: 1.15; margin-bottom: 16px; }
 #container-main_nav nav { display: flex; flex-wrap: wrap; gap: 4px 18px; }
 #container-main_nav nav > br { display: none; }
 #container-main_nav nav > a, #container-main_nav nav > span { display: inline-flex; align-items: center; min-height: 44px; font-size: 14px; line-height: 1.25; }
 #container-sub_nav a, #container-sub_nav > span { display: inline-block; padding: 10px 0; font-size: 16px; line-height: 1.3; }
 .page-section #container-sub_nav a, .page-section #container-sub_nav > span { font-size: 23px; }
 #container-content_txt { font-size: 22px; line-height: 1.15; }
 #container-content_picture { margin-top: 28px; }
 .txt, .section-contact #container-content_txt, .section-links #container-content_txt { font-size: 14px; line-height: 1.4; }
 #main table { width: 100%; }
 #main p[align="justify"] { text-align: left; }
 .page-home #main, .page-section #main { height: 0; }
}
.project-toggle { font: inherit; color: inherit; background: transparent; border: 1px solid #ccc; padding: 12px 14px; text-align: left; width: 100%; cursor: pointer; }
.project-toggle::after { content: ' +'; }
.project-toggle[aria-expanded="true"]::after { content: ' −'; }
[hidden] { display: none !important; }
@media (max-width: 700px) {
 #project-links a, #project-links > span { display: inline-block; padding: 10px 0; font-size: 16px; line-height: 1.3; }
 .page-section #project-links a, .page-section #project-links > span { font-size: 23px; }
}

/* Desktop section pages */
@media screen and (min-width: 701px) {
  .site-name {
    white-space: nowrap;
  }

  body.page-section .site-grid {
    grid-template-columns: 181px minmax(0, 825px);
    column-gap: 24px;
  }

  body.page-section #container-main_nav {
    grid-column: 1;
    grid-row: 1;
  }

  body.page-section #container-sub_nav {
    grid-column: 2;
    grid-row: 1;
    width: 825px;
    max-width: calc(100vw - 265px);
    overflow-wrap: normal;
  }

  body.page-section #project-links {
    width: 100%;
  }

  body.page-section #project-links a,
  body.page-section #project-links > span {
    white-space: nowrap;
  }

  body.page-section #main {
    grid-column: 2;
    grid-row: 2;
  }
}

/* Compact left menu on internal pages only */
@media screen and (min-width: 701px) {
  body:not(.page-home) #container-main_nav nav,
  body:not(.page-home) #container-main_nav nav a,
  body:not(.page-home) #container-main_nav nav span {
    font-size: 12px;
    line-height: 13px;
  }
}
	#container-main_nav nav a,
#container-main_nav nav span {
  white-space: nowrap;
}

/* Refined mobile layout */
@media screen and (max-width: 700px) {

  /* Tighter overall layout */
  .site-grid {
    gap: 20px;
    margin: 24px 20px 40px;
  }

  /* Small artist name on internal pages */
  .site-name {
    font-size: 14px;
    line-height: 14px;
    margin-bottom: 10px;
  }

  /* Compact main navigation */
  #container-main_nav nav {
    gap: 2px 16px;
  }

  #container-main_nav nav > a,
  #container-main_nav nav > span {
    min-height: 28px;
    font-size: 14px;
    line-height: 16px;
  }

  /* Project lists retain the desktop typography */
  .page-section #container-sub_nav a,
  .page-section #container-sub_nav > span,
  #project-links a,
  #project-links > span {
    display: inline;
    padding: 0;
    font-size: 23px;
    line-height: 24px;
  }

  /* Simpler project browser control */
  .project-toggle {
    width: auto;
    border: 0;
    padding: 0;
    margin: 0 0 8px;
    font-size: 14px;
    line-height: 18px;
    background: transparent;
  }

  /* Slightly smaller artwork information */
  #container-content_txt {
    font-size: 20px;
    line-height: 1.15;
  }

  #container-content_picture {
    margin-top: 22px;
  }

  /* Homepage retains its original large typography */
  .page-home .site-name {
    font-size: 23px;
    line-height: 22px;
    margin-bottom: 0;
  }

  .page-home #container-main_nav nav {
    display: block;
  }

  .page-home #container-main_nav nav > a,
  .page-home #container-main_nav nav > span {
    display: inline;
    min-height: 0;
    font-size: 23px;
    line-height: 24px;
  }

  .page-home #container-main_nav nav > br {
    display: block;
  }
}

/* Compact project list on desktop artwork pages */
@media screen and (min-width: 701px) {
  body.page-content #project-links {
    font-size: 12px;
    line-height: 13px;
  }
}

/* Consistent spacing between text and embedded media across all sections */
#container-content_picture br:has(+ iframe),
#container-content_picture br:has(+ br + iframe) {
  display: none;
}

#container-content_picture iframe {
  display: block;
  margin-top: 18px;
}

/* Make artwork descriptions responsive in every section */
@media screen and (max-width: 1050px) {
  #container-content_picture table {
    width: 100% !important;
    max-width: 100%;
    table-layout: fixed;
  }

  #container-content_picture td {
    width: auto !important;
    max-width: 100%;
    white-space: normal;
    overflow-wrap: anywhere;
  }
}