/* The original factory mark sets the grammar: narrow type, hard ink planes,
   grouped windows and a shallow, unblurred edge. */
@font-face {
  font-family: 'House Gothic Campus';
  src: url('assets/fonts/house-gothic-industrial.woff') format('woff');
  font-style: normal;
  font-weight: 400;
  font-display: swap;
}
@font-face {
  font-family: 'Neutraface Campus Label';
  src: url('assets/fonts/neutra-condensed-medium.woff') format('woff');
  font-style: normal;
  font-weight: 600;
  font-display: swap;
}
:root {
  --font-display: 'House Gothic Campus', 'Arial Narrow', sans-serif;
  --font-label: 'Neutraface Campus Label', 'Arial Narrow', sans-serif;
  --werk-edge: var(--ink);
  font-synthesis: none;
}
h1, h2, h3, h4, h5, h6,
.brand-original span, .world-heading h3, .network-core strong,
.chapter-toggle strong, .places-grid strong, .space-rail strong {
  font-family: var(--font-display);
  font-weight: 400;
  letter-spacing: .015em;
}
.brand-original span { font-size: 26px; line-height: 1.02; }
.site-header .brand-original img { width: 58px; height: 72px; object-fit: contain; }
.site-header { border-bottom: 2px solid var(--brand-green); }
.site-header .menu-toggle { font-weight: 600; letter-spacing: .08em; }

/* A title block with the same solid face and dark side as the logo. */
.front-page .journal-dateline {
  padding: 12px 16px;
  border: 1.5px solid var(--ink);
  background: var(--forest);
  color: var(--brand-green);
  box-shadow: 3px 3px 0 var(--ink);
  font-size: 1.0625rem;
  line-height: 1.25;
  letter-spacing: .075em;
}
.front-page .cover-editorial { position: relative; border-left: 4px solid var(--forest); padding-left: 22px; }
.front-page .cover-kicker { font-size: 1.0625rem; letter-spacing: .14em; }
.front-page .journal-masthead #hero-title {
  font: 600 clamp(4.5rem, 7.5vw, 8rem)/.98 var(--font-display);
  letter-spacing: .01em;
  max-width: none;
}
.front-page .cover-editorial::after {
  content: '';
  display: block;
  width: 154px;
  height: 26px;
  margin-top: 26px;
  background: var(--forest);
  -webkit-mask: url('assets/brand/werk-facade.svg') center / contain no-repeat;
  mask: url('assets/brand/werk-facade.svg') center / contain no-repeat;
}
.front-page .cover-art {
  position: relative;
  padding: 8px 8px 0;
  background: var(--paper);
  border: 1.5px solid var(--ink);
  box-shadow: 3px 3px 0 var(--ink);
}
.front-page .cover-art figcaption {
  border-top: 1px solid var(--ink);
  margin-top: 8px;
  font-size: .9375rem;
  color: var(--forest);
}
.front-page .cover-art figcaption::before {
  content: '01';
  align-self: center;
  padding: 2px 5px;
  border: 1px solid currentColor;
  font-weight: 600;
  line-height: 1.1;
}
.front-page .cover-film [data-film-toggle] { font-weight: 600; }
.front-page .cover-links.cover-entries { gap: 12px; border: 0; padding-top: 12px; }
.front-page .cover-entries a,
.front-page .cover-entries a:last-child,
#campus .world-links a {
  min-height: 48px;
  padding: 10px 14px;
  border: 1.5px solid currentColor;
  background: var(--paper);
  color: var(--forest);
  box-shadow: 3px 3px 0 var(--werk-edge);
  font: 600 1rem/1.3 var(--font-label);
  letter-spacing: .04em;
  text-decoration: none;
}
.front-page .cover-entries .cover-main-link,
.front-page .cover-entries a:last-child {
  background: var(--forest);
  border-color: var(--forest);
  color: var(--brand-green);
}

/* Real fabric of the site. These two explicitly labelled details link to
   complete current photographs; archive images keep their complete framing. */
.werk-materials {
  display: grid;
  grid-template-columns: minmax(0, .6fr) repeat(2, minmax(0, 1fr));
  align-items: start;
  gap: 16px 24px;
  padding-block: 20px 24px;
  border-top: 2px solid var(--forest);
  color: var(--forest);
}
.werk-materials > p { margin: 0; font: 600 1rem/1.25 var(--font-label); letter-spacing: .1em; }
.werk-materials > p strong { display: block; margin-top: 10px; font-size: 1.75rem; line-height: 1.05; letter-spacing: .025em; }
.werk-materials figure { min-width: 0; margin: 0; }
.werk-materials figure > a { display: block; overflow: hidden; border: 1px solid var(--forest); padding: 4px; background: var(--paper); box-shadow: 3px 3px 0 var(--forest); }
.werk-materials img { display: block; width: 100%; height: clamp(100px, 9vw, 150px); object-fit: cover; }
.werk-materials .werk-window-detail { object-position: 100% 45%; transform: scale(2.6); transform-origin: 100% 42%; }
.werk-materials .werk-hall-detail { object-position: 50% 65%; transform: scale(1.25); transform-origin: 50% 45%; }
.werk-materials figcaption { display: grid; gap: 2px; padding-top: 10px; font: 600 1rem/1.3 var(--font-label); letter-spacing: .035em; }
.werk-materials figcaption small { font: 400 .75rem/1.4 var(--font-body); letter-spacing: 0; }

/* Chapter signs take the position of a title plate, not the place of copy. */
.intro-title > .micro,
.history-heading > div > .micro,
.history-heading > .micro,
.campus-head > .micro,
.spaces-head > div > .micro,
.future-title > .micro,
.gallery-title .micro,
.legend-editorial-head > .micro,
.contact > .micro,
.transformation-label > .micro {
  display: inline-flex;
  width: fit-content;
  max-width: 100%;
  min-height: 28px;
  align-items: center;
  padding: 5px 10px;
  border: 1px solid var(--forest);
  background: var(--brand-green);
  color: var(--ink);
  box-shadow: 3px 3px 0 var(--forest);
  font: 600 1rem/1.3 var(--font-label);
  letter-spacing: .09em;
}
.intro-title > .micro::before,
.history-heading .micro::before,
.campus-head > .micro::before,
.spaces-head .micro::before,
.future-title > .micro::before,
.gallery-title .micro::before,
.legend-editorial-head > .micro::before,
.contact > .micro::before,
.transformation-label > .micro::before { display: none; }
.history-heading .micro, .gallery-title .micro { border-color: var(--brand-green); box-shadow: 3px 3px 0 var(--ink); }
#campus .world-heading h3 { font-weight: 600; font-size: 1.625rem; letter-spacing: .055em; }
#campus .campus-world > .world-standfirst { font-family: var(--font-display); font-weight: 600; font-size: clamp(2.75rem, 4.1vw, 4.5rem); line-height: 1.02; }
#campus .world-number { display: inline-block; padding: 4px 8px; border: 1px solid currentColor; font-size: .9375rem; }
#campus .network { counter-reset: werk-bild 1; }
#campus .world-photo { counter-increment: werk-bild; border: 1px solid var(--world-text); padding: 6px 6px 0; box-shadow: 3px 3px 0 var(--world-accent); }
#campus .world-photo figcaption { display: flex; align-items: center; gap: 10px; font-size: .9375rem; color: var(--world-text); border-bottom: 0; }
#campus .world-photo figcaption::before { content: counter(werk-bild, decimal-leading-zero); border: 1px solid currentColor; padding: 2px 5px; font-weight: 600; line-height: 1.1; }
#campus .world-work { --werk-edge: var(--ink); border: 1px solid var(--ink); box-shadow: 3px 3px 0 var(--ink); }
#campus .world-links a { color: var(--world-text); background: var(--world-surface); border-color: var(--world-accent); }
#campus .world-links a:hover { color: var(--world-surface); background: var(--world-accent); }
#campus .world-topics { border-top-width: 2px; }

.archive-controls button,
.editorial-rail-controls button,
.gallery-scroll-controls button {
  border: 1.5px solid currentColor;
  box-shadow: 3px 3px 0 currentColor;
  background: transparent;
}
.chapter-toggle-mark { border: 1px solid currentColor; box-shadow: 2px 2px 0 currentColor; }
.chapter-toggle strong { font-size: 1.5rem; letter-spacing: .03em; }
.campus-finder, .front-page .campus-weather { border-top: 2px solid var(--forest); }
.campus-finder > summary, .front-page .campus-weather > summary { padding-inline: 10px; }
.campus-weather .weather-mark { background: var(--forest); color: var(--brand-green); border-color: var(--ink); box-shadow: 3px 3px 0 var(--ink); }
.campus-finder > summary strong { font-weight: 600; font-size: 1.75rem; }

/* An event reads as an announcement posted at the works. */
.front-page .journal-masthead .campus-event-note {
  display: grid;
  grid-template-columns: minmax(180px, .42fr) minmax(0, 1fr);
  gap: 20px 36px;
  align-items: start;
  padding-block: 32px;
  border-block: 2px solid var(--forest);
}
.front-page .campus-event-note .event-date {
  grid-column: 1;
  grid-row: 1;
  padding: 20px;
  border: 1.5px solid var(--ink);
  background: var(--forest);
  color: var(--brand-green);
  box-shadow: 3px 3px 0 var(--ink);
}
.front-page .campus-event-note .event-date strong { font: 600 clamp(1.75rem, 2.6vw, 2.75rem)/1.1 var(--font-display); white-space: normal; }
.front-page .campus-event-note .event-date > span { font-size: 1rem; }
.front-page .campus-event-note .christmas-tree { grid-column: 1; grid-row: 2; width: 90px; height: auto; margin: 0 0 0 16px; }
.front-page .campus-event-note .event-copy { grid-column: 2; grid-row: 1 / span 2; }
.front-page .journal-masthead .campus-event-note h2 { font-weight: 600; font-size: clamp(2.75rem, 4.4vw, 4.75rem); line-height: 1.04; }
.front-page .campus-event-note .journal-label { letter-spacing: .1em; }
.site-directory-footer .footer-title { border-top: 3px solid var(--brand-green); padding-top: 28px; }

@media (max-width: 1200px) {
  .reading-index { border-bottom: 2px solid var(--forest); }
  .reading-chapters > a { border-right: 1px solid var(--forest); font: 600 1.125rem/1 var(--font-label); color: var(--forest); }
  .reading-chapters > a:first-child { border-left: 1px solid var(--forest); }
  .reading-chapters > a[aria-current='location'] { color: var(--brand-green); background: var(--forest); box-shadow: none; }
}
@media (max-width: 900px) {
  .site-header .brand-original img { width: 50px; height: 62px; }
  .brand-original span { font-size: 23px; }
  .mobile-pages-ready .reading-index .reading-chapters > a {
    border: 0;
    border-right: 1px solid var(--forest);
    color: var(--forest);
    background: var(--paper);
    font: 600 1.125rem/1 var(--font-label);
  }
  .mobile-pages-ready .reading-index .reading-chapters > a:first-child { border-left: 1px solid var(--forest); }
  .mobile-pages-ready .reading-index .reading-chapters > a[aria-current='location'] { background: var(--forest); color: var(--brand-green); box-shadow: none; }
  .mobile-pages-ready .front-page .journal-dateline { padding: 10px 12px; font-size: .9375rem; gap: 16px; }
  .front-page .cover-editorial { padding-left: 14px; }
  .mobile-pages-ready .front-page .journal-masthead #hero-title { font-size: clamp(3.75rem, 19vw, 5.25rem); line-height: .98; }
  .front-page .cover-editorial::after { margin-top: 16px; width: 122px; height: 22px; }
  .mobile-pages-ready .front-page .cover-deck { font-size: 1rem; line-height: 1.45; }
  .mobile-pages-ready .front-page .cover-art figcaption { display: flex; padding: 8px 0; font-size: .875rem; }
  .front-page .cover-links.cover-entries { display: grid; grid-template-columns: 1fr; gap: 10px; width: calc(100% - 3px); }
  .front-page .cover-entries a { padding: 11px 14px; font-size: 1rem; }
  .front-page .cover-entries a:last-child { margin: 0; }
  .werk-materials { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; padding-block: 20px; }
  .werk-materials > p { grid-column: 1 / -1; display: flex; justify-content: space-between; gap: 16px; align-items: baseline; font-size: .9375rem; }
  .werk-materials > p strong { margin: 0; font-size: 1.375rem; }
  .werk-materials img { height: 110px; }
  .werk-materials figcaption { font-size: .9375rem; }
  .werk-materials figcaption small { font-size: .6875rem; }
  .mobile-pages-ready main h2 { font-size: clamp(2.5rem, 11.5vw, 4rem) !important; line-height: 1.05; }
  .mobile-pages-ready #campus .campus-world > .world-standfirst { font-size: clamp(2.6rem, 11.5vw, 3.5rem); line-height: 1.04; }
  .mobile-pages-ready #campus .world-heading h3 { font-size: 1.5rem; }
  .mobile-pages-ready #campus .world-links { gap: 10px; }
  .mobile-pages-ready #campus .world-links a { padding: 10px 12px; font-size: 1rem; }
  .mobile-pages-ready .chapter-toggle-mark { border: 1px solid currentColor; }
  .front-page .journal-masthead .campus-event-note { grid-template-columns: minmax(0, 1fr) 72px; gap: 24px 16px; padding-block: 24px; }
  .mobile-pages-ready .front-page .campus-event-note .event-date { padding: 14px 12px; grid-column: 1; grid-row: 1; }
  .mobile-pages-ready .front-page .campus-event-note .event-date strong { font-size: clamp(1.5rem, 6.6vw, 2rem); line-height: 1.1; }
  .mobile-pages-ready .front-page .campus-event-note .event-date > span { font-size: .9375rem; }
  .mobile-pages-ready .front-page .campus-event-note .christmas-tree { width: 64px; height: auto; grid-column: 2; grid-row: 1; margin: 0; }
  .front-page .campus-event-note .event-copy { grid-column: 1 / -1; grid-row: 2; }
  .mobile-pages-ready .front-page .journal-masthead .campus-event-note h2 { font-size: clamp(2.65rem, 11.5vw, 4rem) !important; line-height: 1.04; }
}
@media (max-width: 360px) {
  .brand-original span { font-size: 21px; }
  .site-header .brand-original img { width: 42px; height: 54px; }
  .front-page .journal-dateline { letter-spacing: .035em; }
  .werk-materials > p { display: block; }
  .werk-materials > p strong { margin-top: 6px; }
  .werk-materials img { height: 94px; }
}
@media (prefers-reduced-motion: no-preference) {
  .front-page .cover-entries a, #campus .world-links a { transition: translate .16s ease-out, box-shadow .16s ease-out; }
  .front-page .cover-entries a:active, #campus .world-links a:active { translate: 2px 2px; box-shadow: 1px 1px 0 var(--werk-edge); }
}

/* Stronger factory architecture: the logo's coal face, light lettering and
   actual window contours now carry the main compositions. */
.front-page .journal-dateline {
  border: 3px solid var(--ink);
  background: var(--brand-green);
  color: var(--ink);
  box-shadow: 6px 6px 0 var(--forest);
}
.front-page .cover-layout {
  background: var(--ink);
  border: 3px solid var(--ink);
  padding: 28px;
  margin-block: 18px 28px;
  box-shadow: 8px 8px 0 var(--forest);
  gap: 28px;
}
.front-page .cover-editorial { border: 0; padding: 0; color: var(--paper); }
.werk-signhead { display: flex; align-items: center; justify-content: space-between; gap: 20px; margin-bottom: 20px; }
.werk-signhead > img { display: block; width: 80px; height: 100px; object-fit: contain; flex: none; }
.front-page .werk-signhead .cover-kicker { color: var(--brand-green); max-width: 17ch; margin: 0; line-height: 1.3; }
.front-page .journal-masthead #hero-title { color: var(--paper); text-transform: uppercase; }
.front-page .journal-masthead #hero-title > span:last-child { color: var(--brand-green); }
.front-page .cover-deck { color: var(--paper); padding-right: 88px; max-width: none; }
.front-page .cover-editorial::after {
  position: absolute;
  right: 0;
  bottom: 0;
  width: 76px;
  height: 66px;
  margin: 0;
  background: var(--brand-green);
  -webkit-mask-image: url('assets/brand/werk-fenster-original.svg');
  mask-image: url('assets/brand/werk-fenster-original.svg');
  pointer-events: none;
}
.front-page .cover-art { border: 3px solid var(--brand-green); box-shadow: none; padding: 6px 6px 0; }
.front-page .cover-links.cover-entries { border-top: 2px solid var(--brand-green); padding-top: 20px; width: calc(100% - 5px); }
.front-page .cover-entries a,
.front-page .cover-entries a:last-child,
.front-page .cover-entries .cover-main-link {
  background: var(--brand-green);
  color: var(--ink);
  border: 2px solid var(--brand-green);
  box-shadow: 5px 5px 0 var(--forest);
  min-height: 52px;
}

/* Solid title faces echo the building's stacked, rectilinear masses. */
.intro-title h2,
.transformation-head h2,
.campus-head h2,
.spaces-head h2,
.future-title h2,
.front-page .campus-event-note .event-copy h2 {
  width: fit-content;
  max-width: 100%;
  padding: 14px 18px 18px;
  background: var(--ink);
  color: var(--paper);
  border: 2px solid var(--ink);
  box-shadow: 6px 6px 0 var(--forest);
  text-transform: uppercase;
  letter-spacing: .02em;
}
.intro-title h2 em,
.transformation-head h2 em,
.campus-head h2 em,
.spaces-head h2 em,
.future-title h2 em { color: var(--brand-green); -webkit-text-stroke: 0; }
.intro-title > .micro,
.transformation-label > .micro,
.campus-head > .micro,
.spaces-head > div > .micro,
.future-title > .micro {
  border: 2px solid var(--ink);
  background: var(--ink);
  color: var(--brand-green);
  box-shadow: 4px 4px 0 var(--forest);
}
#campus .campus-world {
  --world-text: var(--paper);
  --world-accent: var(--brand-green);
  --world-rule: #d6efc070;
  --world-surface: var(--ink);
  --werk-edge: var(--forest);
  padding: 24px;
  background: var(--world-surface);
  color: var(--world-text);
  border: 2px solid var(--ink);
  box-shadow: 6px 6px 0 var(--forest);
}
#campus .world-life { gap: 0 32px; }
#campus .world-life .world-photo img { mix-blend-mode: normal; }
#campus .world-heading h3 { color: var(--brand-green); }
#campus .world-number { border-width: 2px; }
#campus .world-photo { border: 2px solid var(--brand-green); box-shadow: 4px 4px 0 var(--forest); }
#campus .world-links a {
  border: 2px solid var(--brand-green);
  background: var(--brand-green);
  color: var(--ink);
  box-shadow: 4px 4px 0 var(--forest);
  min-height: 50px;
}
#campus .world-links a:hover { background: var(--paper); color: var(--ink); }
.front-page .campus-event-note .event-date { background: var(--ink); color: var(--brand-green); border-width: 3px; box-shadow: 6px 6px 0 var(--forest); }
.front-page .journal-masthead .campus-event-note { border-block: 4px solid var(--ink); }
.werk-materials { border-top: 4px solid var(--ink); }
.werk-materials figure > a { border: 2px solid var(--ink); box-shadow: 5px 5px 0 var(--ink); }
.chapter-toggle { border-top-width: 3px; }
.chapter-toggle-mark { background: var(--ink); color: var(--brand-green); border: 2px solid var(--ink); box-shadow: 3px 3px 0 var(--forest); }

@media (max-width: 1200px) {
  .reading-index { border-bottom: 3px solid var(--ink); }
  .reading-chapters > a[aria-current='location'] { background: var(--ink); color: var(--brand-green); }
}
@media (max-width: 900px) {
  .mobile-pages-ready .front-page .cover-page .cover-layout { padding: 18px 14px 20px; gap: 22px; margin-bottom: 24px; }
  .mobile-pages-ready .front-page .cover-editorial { padding: 0; }
  .werk-signhead { margin-bottom: 18px; }
  .werk-signhead > img { width: 64px; height: 80px; }
  .mobile-pages-ready .front-page .journal-masthead #hero-title { font-size: clamp(3.25rem, 18vw, 5rem); }
  .mobile-pages-ready .front-page .cover-deck { padding-right: 70px; }
  .front-page .cover-editorial::after { width: 60px; height: 54px; margin: 0; }
  .front-page .cover-links.cover-entries { gap: 12px; padding-top: 18px; }
  .mobile-pages-ready #campus .campus-world { padding: 18px 16px 22px; }
  .mobile-pages-ready #campus .world-work { padding: 18px 16px 22px; }
  .mobile-pages-ready .intro-title h2,
  .mobile-pages-ready .transformation-head h2,
  .mobile-pages-ready .campus-head h2,
  .mobile-pages-ready .spaces-head h2,
  .mobile-pages-ready .future-title h2,
  .mobile-pages-ready .front-page .campus-event-note .event-copy h2 { padding: 12px 12px 16px; }
  .mobile-pages-ready .reading-index .reading-chapters > a[aria-current='location'] { background: var(--ink); color: var(--brand-green); }
  .mobile-pages-ready .chapter-toggle-mark { background: var(--ink); color: var(--brand-green); border: 2px solid var(--ink); }
}