/* CODE – EXODOS / Project portal and SYNAPSIS frames / 2026-11-08 / v1.0 */
.exodos-frames {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: clamp(12px, 2vw, 24px);
}
.exodos-frame {
  display: flex;
  flex-direction: column;
  min-width: 0;
  background: var(--ex-card, #fdf9f1);
  color: var(--ex-ink, #24373d);
  border: 1px solid var(--ex-line, #c5b69e);
  text-decoration: none;
}
.exodos-frame img {
  display: block;
  width: 100%;
  height: auto;
  aspect-ratio: 16 / 10;
  object-fit: cover;
}
.exodos-frame-body { display: grid; gap: 6px; padding: clamp(14px, 2vw, 22px); }
.exodos-frame strong {
  font: 500 clamp(1.25rem, 2vw, 1.85rem)/1.14 Georgia, serif;
  overflow-wrap: anywhere;
}
.exodos-frame small, .exodos-eyebrow {
  font: 600 .7rem/1.5 Arial, sans-serif;
  letter-spacing: .13em;
  text-transform: uppercase;
  color: var(--ex-accent, #795322);
}
.exodos-frame-body > span { font-size: .91rem; line-height: 1.5; }
.exodos-frame:hover, .exodos-frame:focus-visible { border-color: var(--ex-accent, #795322); }
.exodos-frame:hover strong { text-decoration: underline; text-underline-offset: .18em; }
@media (max-width: 880px) { .exodos-frames { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 490px) { .exodos-frames { grid-template-columns: minmax(0, 1fr); } }

.exodos-page {
  --ex-bg: #192529;
  --ex-ink: #f0e8d8;
  --ex-muted: #c7c9bf;
  --ex-accent: #e6bd7c;
  --ex-card: #202e33;
  --ex-line: #6d6656;
  margin: 0;
  background: var(--ex-bg);
  color: var(--ex-ink);
  font: 1rem/1.65 system-ui, sans-serif;
}
.exodos-page *, .exodos-page *::before, .exodos-page *::after { box-sizing: border-box; }
.exodos-page :focus-visible { outline: 2px solid var(--ex-accent); outline-offset: 4px; }
.exodos-page a { color: inherit; text-underline-offset: .22em; }
.exodos-page h1, .exodos-page h2, .exodos-page p, .exodos-page figure { margin: 0; }
.exodos-page h1, .exodos-page h2 { font: 400 clamp(2rem, 5vw, 3.6rem)/1.04 Georgia, serif; }
.exodos-wrap { width: min(1180px, calc(100% - 40px)); margin-inline: auto; }
.exodos-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 8px 22px;
  flex-wrap: wrap;
  padding-block: 16px;
  border-bottom: 1px solid var(--ex-line);
  font-size: .84rem;
}
.exodos-header nav { display: flex; flex-wrap: wrap; gap: 8px 22px; }
.exodos-intro {
  display: grid;
  grid-template-columns: 1.1fr .9fr;
  align-items: end;
  gap: 18px 34px;
  padding-block: clamp(34px, 6vw, 78px) clamp(22px, 4vw, 42px);
}
.exodos-intro h1 { margin-top: 9px; font-size: clamp(2.6rem, 6vw, 5.1rem); letter-spacing: -.045em; }
.exodos-intro > p { color: var(--ex-muted); max-width: 36rem; }
.exodos-banner img {
  display: block;
  width: 100%;
  height: auto;
  border: 1px solid var(--ex-line);
}
.exodos-banner figcaption { margin-top: 8px; color: var(--ex-muted); font-size: .74rem; }
.exodos-method {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 18px 34px;
  padding-block: clamp(32px, 7vw, 82px);
  border-bottom: 1px solid var(--ex-line);
}
.exodos-method h2, .exodos-map-heading h2 { margin-top: 8px; }
.exodos-method > div:last-child { align-self: end; color: var(--ex-muted); }
.exodos-method p + p { margin-top: 12px; }
.exodos-map { padding-block: clamp(32px, 6vw, 68px); }
.exodos-map-heading { margin-bottom: 22px; }
.exodos-map-heading > p:last-child { margin-top: 10px; max-width: 52ch; color: var(--ex-muted); }
.exodos-map-grid {
  position: relative;
  display: grid;
  isolation: isolate;
  grid-template-columns: minmax(0, 1fr) minmax(150px, .7fr) minmax(0, 1fr);
  grid-template-areas: "goethe centre rhodos" "aegean centre theatron";
  gap: clamp(12px, 3vw, 34px);
}
.exodos-map-grid svg {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  color: var(--ex-accent);
  opacity: .63;
  z-index: -1;
}
.exodos-map-grid .exodos-centre {
  grid-area: centre;
  align-self: center;
  justify-self: center;
  display: grid;
  gap: 7px;
  width: min(100%, 225px);
  padding: 20px 10px;
  text-align: center;
  background: var(--ex-bg);
  border: 1px solid var(--ex-accent);
}
.exodos-centre strong { font: 1.4rem/1.12 Georgia, serif; }
.exodos-map-grid .exodos-frame { justify-self: stretch; }
.exodos-map-grid .exodos-frame img { aspect-ratio: 2 / 1; }
.exodos-map-grid .exodos-goethe { grid-area: goethe; }
.exodos-map-grid .exodos-rhodos { grid-area: rhodos; }
.exodos-map-grid .exodos-aegean { grid-area: aegean; }
.exodos-map-grid .exodos-theatron { grid-area: theatron; }
.exodos-page .exodos-related { display: flex; flex-wrap: wrap; gap: 8px 20px; margin-block: 20px 52px; }
.exodos-page .syn-network {
  --network-bg: var(--ex-bg);
  --network-card: var(--ex-card);
  --network-text: var(--ex-ink);
  --network-muted: var(--ex-muted);
  --network-line: var(--ex-line);
  --network-accent: var(--ex-accent);
}
.exodos-page .syn-legal-links { padding-bottom: 22px; }
@media (max-width: 720px) {
  .exodos-intro, .exodos-method { grid-template-columns: 1fr; }
  .exodos-map-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    grid-template-areas: "centre centre" "goethe rhodos" "aegean theatron";
  }
  .exodos-map-grid svg { display: none; }
  .exodos-map-grid .exodos-centre { width: 100%; text-align: left; padding: 12px; }
}
@media (max-width: 490px) {
  .exodos-wrap { width: calc(100% - 28px); }
  .exodos-map-grid { grid-template-columns: 1fr; grid-template-areas: "centre" "goethe" "rhodos" "aegean" "theatron"; }
}

/* AEGEAN CODE / two motifs paired with the dossier montage. */
.exodos-dossiers { align-items: center; }
.exodos-dossiers dl { margin: 24px 0 0; }
.exodos-dossiers dt { color: var(--ex-accent); font-weight: 600; }
.exodos-dossiers dd { margin: 5px 0 0; color: var(--ex-muted); max-width: 48ch; }
.exodos-dossiers dd + dt { margin-top: 18px; }