:root {
  color-scheme: dark;
  --night: #061119;
  --night-deep: #030a10;
  --ocean: #0d2734;
  --panel: rgba(9, 27, 36, 0.82);
  --panel-solid: #0b202b;
  --ice: #eefbfa;
  --mist: #98afb8;
  --faint: #6d8b97;
  --line: rgba(159, 211, 218, 0.16);
  --line-bright: rgba(160, 226, 232, 0.36);
  --aqua: #83e4e3;
  --aqua-bright: #c3ffff;
  --amber: #ffb45b;
  --amber-pale: #ffd8a7;
  --violet: #9c88e8;
  /* The shared switcher kit reads --color-accent; point it at travel's amber. */
  --color-accent: #ffb45b;
  --font-display: Iowan Old Style, Baskerville, "Times New Roman", serif;
  --font-sans: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  --font-mono: "SFMono-Regular", Consolas, "Liberation Mono", Menlo, monospace;
}

* { box-sizing: border-box; }

html {
  min-width: 320px;
  scroll-behavior: smooth;
  scroll-padding-top: 6rem;
  background: var(--night-deep);
}

body {
  margin: 0;
  overflow-x: hidden;
  color: var(--ice);
  background:
    radial-gradient(circle at 88% 8%, rgba(52, 133, 153, 0.12), transparent 32rem),
    linear-gradient(180deg, var(--night) 0, var(--night-deep) 85rem);
  font-family: var(--font-sans);
  line-height: 1.55;
  -webkit-font-smoothing: antialiased;
}

a { color: inherit; }
button, a { -webkit-tap-highlight-color: transparent; }
button { color: inherit; font: inherit; }
img { max-width: 100%; }
::selection { color: #071116; background: var(--amber-pale); }
:focus-visible { outline: 2px solid var(--aqua-bright); outline-offset: 4px; }

.sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}

.skip-link {
  position: fixed;
  top: 0.75rem;
  left: 0.75rem;
  z-index: 200;
  padding: 0.7rem 1rem;
  color: #041116;
  background: var(--aqua-bright);
  font-family: var(--font-mono);
  font-size: 0.72rem;
  font-weight: 700;
  text-decoration: none;
  transform: translateY(-160%);
  transition: transform 160ms ease;
}
.skip-link:focus { transform: translateY(0); }

.home-sky {
  position: absolute;
  inset: 0 0 auto;
  z-index: -1;
  height: min(100svh, 62rem);
  overflow: hidden;
  pointer-events: none;
}
.home-sky::before {
  position: absolute;
  inset: 0;
  content: "";
  opacity: 0.25;
  background-image:
    radial-gradient(circle, rgba(213, 249, 255, 0.85) 0 1px, transparent 1.3px),
    radial-gradient(circle, rgba(213, 249, 255, 0.55) 0 0.8px, transparent 1px);
  background-position: 0 0, 42px 28px;
  background-size: 94px 94px, 137px 137px;
  mask-image: linear-gradient(#000, transparent 86%);
}
.home-sky i {
  position: absolute;
  top: -13rem;
  left: 20%;
  width: 72rem;
  height: 30rem;
  border: 2rem solid rgba(79, 215, 190, 0.055);
  border-radius: 50%;
  filter: blur(28px);
  transform: rotate(-8deg);
}
.home-sky i:nth-child(2) { left: 42%; top: -8rem; border-color: rgba(86, 169, 229, 0.06); transform: rotate(12deg); }
.home-sky i:nth-child(3) { left: 60%; top: -17rem; border-color: rgba(156, 136, 232, 0.045); transform: rotate(-19deg); }

.site-header {
  position: relative;
  z-index: 40;
  display: flex;
  width: min(100% - 3rem, 1500px);
  min-height: 5.8rem;
  margin: 0 auto;
  align-items: center;
  justify-content: space-between;
  border-bottom: 1px solid var(--line);
}
.site-header.compact { min-height: 5rem; }
.brand {
  display: inline-flex;
  align-items: center;
  gap: 0.8rem;
  text-decoration: none;
}
.brand-orbit {
  position: relative;
  display: block;
  width: 2.3rem;
  height: 2.3rem;
  border: 1px solid var(--line-bright);
  border-radius: 50%;
}
.brand-orbit::before {
  position: absolute;
  inset: 0.47rem;
  border-radius: 50%;
  background: radial-gradient(circle at 36% 30%, #4b7b88, #0a2633 72%);
  box-shadow: 0 0 1rem rgba(131, 228, 227, 0.15);
  content: "";
}
.brand-orbit::after {
  position: absolute;
  top: 50%;
  left: -0.16rem;
  width: 2.55rem;
  height: 0.62rem;
  border: 1px solid var(--amber);
  border-top-color: transparent;
  border-radius: 50%;
  content: "";
  transform: translateY(-50%) rotate(-16deg);
}
.brand-orbit i {
  position: absolute;
  top: 0.3rem;
  right: 0.14rem;
  z-index: 1;
  width: 0.28rem;
  height: 0.28rem;
  border-radius: 50%;
  background: var(--amber-pale);
  box-shadow: 0 0 0.6rem var(--amber);
}
.brand strong, .brand small { display: block; }
.brand strong {
  font-family: var(--font-mono);
  font-size: 0.76rem;
  letter-spacing: 0.2em;
  line-height: 1.25;
  text-transform: uppercase;
}
.brand small {
  margin-top: 0.15rem;
  color: var(--faint);
  font-family: var(--font-mono);
  font-size: 0.57rem;
  letter-spacing: 0.17em;
  text-transform: uppercase;
}
.site-header nav { display: flex; align-items: center; gap: 1.7rem; }
.site-header nav a {
  color: var(--mist);
  font-family: var(--font-mono);
  font-size: 0.66rem;
  letter-spacing: 0.12em;
  text-decoration: none;
  text-transform: uppercase;
  transition: color 160ms ease;
}
.site-header nav a:hover { color: var(--ice); }
.site-header .portfolio-link { padding: 0.55rem 0.75rem; border: 1px solid var(--line-bright); }

main { width: min(100% - 3rem, 1500px); margin-inline: auto; }
.eyebrow {
  margin: 0 0 1.1rem;
  color: var(--aqua);
  font-family: var(--font-mono);
  font-size: 0.63rem;
  letter-spacing: 0.2em;
  text-transform: uppercase;
}
h1, h2, h3, p { margin-top: 0; }
em { color: var(--amber-pale); font-family: var(--font-display); font-weight: 400; }

.button {
  display: inline-flex;
  min-height: 2.8rem;
  padding: 0.72rem 1rem;
  align-items: center;
  justify-content: center;
  gap: 0.65rem;
  border: 1px solid var(--line-bright);
  color: var(--ice);
  background: transparent;
  font-family: var(--font-mono);
  font-size: 0.64rem;
  font-weight: 700;
  letter-spacing: 0.09em;
  text-decoration: none;
  text-transform: uppercase;
  transition: border-color 160ms ease, background 160ms ease, color 160ms ease;
}
.button:hover { border-color: var(--aqua); background: rgba(131, 228, 227, 0.08); }
.button-primary { border-color: var(--amber); color: #1a1108; background: var(--amber); }
.button-primary:hover { border-color: var(--amber-pale); background: var(--amber-pale); }
.text-link { color: var(--aqua); font-family: var(--font-mono); font-size: 0.68rem; letter-spacing: 0.05em; text-decoration: none; }

/* Globe landing */
.atlas {
  position: relative;
  display: grid;
  min-height: calc(100svh - 5.8rem);
  padding: clamp(2rem, 4vw, 4rem) 0 2rem;
  grid-template-columns: minmax(19rem, 0.68fr) minmax(35rem, 1.45fr);
  grid-template-rows: 1fr auto;
  align-items: center;
  gap: 0 clamp(1rem, 4vw, 5rem);
}
.atlas-copy { position: relative; z-index: 3; padding-left: clamp(0rem, 2vw, 2rem); }
.atlas-copy h1 {
  max-width: 9ch;
  margin: 0 0 1.5rem;
  font-size: clamp(4rem, 7vw, 7.4rem);
  font-weight: 560;
  letter-spacing: -0.067em;
  line-height: 0.82;
}
.atlas-copy h1 em { display: inline-block; font-size: 0.92em; letter-spacing: -0.045em; }
.atlas-lede { max-width: 33rem; color: var(--mist); font-size: clamp(0.97rem, 1.3vw, 1.12rem); }
.atlas-stats { display: flex; margin-top: 2rem; gap: clamp(1.5rem, 3vw, 3rem); }
.atlas-stats div { display: flex; flex-direction: column; }
.atlas-stats strong { color: var(--amber-pale); font-family: var(--font-display); font-size: 1.8rem; font-weight: 400; line-height: 1; }
.atlas-stats span { margin-top: 0.4rem; color: var(--faint); font-family: var(--font-mono); font-size: 0.57rem; letter-spacing: 0.12em; text-transform: uppercase; }

.globe-stage { position: relative; min-height: min(75vw, 51rem); align-self: stretch; overflow: hidden; }
.globe-stage::after {
  position: absolute;
  inset: 9% 2% 5%;
  z-index: -1;
  border-radius: 50%;
  background: radial-gradient(circle, rgba(45, 129, 144, 0.12), transparent 65%);
  filter: blur(18px);
  content: "";
}
.globe-canvas { position: absolute; inset: 0; cursor: grab; }
.globe-canvas:active { cursor: grabbing; }
.globe-canvas canvas { display: block; width: 100%; height: 100%; }
.globe-poster { position: absolute; inset: 5%; width: 90%; height: 90%; transition: opacity 600ms ease; }
.globe-stage[data-state="ready"] .globe-poster { opacity: 0; pointer-events: none; }
.globe-stage[data-state="fallback"] .globe-canvas, .globe-stage[data-state="fallback"] .globe-loading { display: none; }
.globe-loading {
  position: absolute;
  left: 50%;
  bottom: 12%;
  display: flex;
  align-items: center;
  gap: 0.65rem;
  color: var(--faint);
  font-family: var(--font-mono);
  font-size: 0.58rem;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  transform: translateX(-50%);
}
.globe-loading span { width: 0.35rem; height: 0.35rem; border-radius: 50%; background: var(--amber); box-shadow: 0 0 0.7rem var(--amber); animation: blink 1.2s ease-in-out infinite; }
.globe-stage[data-state="ready"] .globe-loading { display: none; }
.globe-hint {
  position: absolute;
  right: 6%;
  bottom: 4%;
  margin: 0;
  color: var(--faint);
  font-family: var(--font-mono);
  font-size: 0.55rem;
  letter-spacing: 0.12em;
  text-transform: uppercase;
}
.journey-card {
  position: absolute;
  right: 2%;
  bottom: 10%;
  z-index: 5;
  width: min(21rem, 42%);
  padding: 1.2rem 1.25rem;
  border: 1px solid var(--line-bright);
  background: rgba(5, 18, 25, 0.87);
  box-shadow: 0 1.5rem 4rem rgba(0, 0, 0, 0.38);
  backdrop-filter: blur(18px);
  animation: card-in 600ms cubic-bezier(0.2, 0.8, 0.2, 1) both;
}
.journey-card[hidden] { display: none; }
.journey-card .eyebrow { margin-bottom: 1rem; color: var(--mist); }
.country-dot { display: inline-block; width: 0.38rem; height: 0.38rem; margin-right: 0.5rem; border-radius: 50%; background: var(--amber); box-shadow: 0 0 0.6rem var(--amber); }
.journey-close { position: absolute; top: 0.65rem; right: 0.7rem; width: 2rem; height: 2rem; border: 0; color: var(--faint); background: transparent; cursor: pointer; font-size: 1.35rem; }
.journey-date { margin-bottom: 0.35rem; color: var(--trip-accent); font-family: var(--font-mono); font-size: 0.6rem; letter-spacing: 0.09em; text-transform: uppercase; }
.journey-card h2 { margin-bottom: 0.7rem; font-size: 1.45rem; font-weight: 560; letter-spacing: -0.03em; }
.journey-card article > p:not(.journey-date, .route-note) { color: var(--mist); font-size: 0.84rem; }
.journey-card article + article { margin-top: 1rem; padding-top: 1rem; border-top: 1px solid var(--line); }
.journey-card article:not([data-active]) { opacity: .62; }
.journey-card article[data-active] { opacity: 1; }
.route-note { display: flex; align-items: center; gap: 0.5rem; color: var(--faint); font-family: var(--font-mono); font-size: 0.55rem; letter-spacing: 0.05em; text-transform: uppercase; }
.route-note span { width: 1.3rem; height: 1px; background: repeating-linear-gradient(90deg, var(--amber) 0 3px, transparent 3px 6px); }
.journey-actions { display: flex; margin-top: 1.1rem; align-items: center; gap: 1rem; }
.journey-actions .button { min-height: 2.35rem; padding: 0.55rem 0.7rem; font-size: 0.57rem; }
.route-select { padding: .35rem 0; border: 0; color: var(--aqua); background: transparent; cursor: pointer; font-family: var(--font-mono); font-size: .56rem; letter-spacing: .08em; text-transform: uppercase; }

.country-index { grid-column: 1 / -1; width: min(100%, 42rem); margin-left: clamp(0rem, 2vw, 2rem); }
.country-index .eyebrow { margin-bottom: 0.5rem; color: var(--faint); }
.country-index button {
  display: grid;
  width: 100%;
  padding: 0.85rem 0;
  grid-template-columns: 2.2rem 1fr auto;
  align-items: center;
  gap: 1rem;
  border: 0;
  border-top: 1px solid var(--line);
  color: var(--mist);
  background: transparent;
  cursor: pointer;
  text-align: left;
}
.country-index button:hover, .country-index button[data-active] { color: var(--ice); }
.country-number { color: var(--amber); font-family: var(--font-mono); font-size: 0.62rem; }
.country-index strong, .country-index small { display: block; }
.country-index strong { font-size: 0.88rem; font-weight: 600; }
.country-index small { margin-top: 0.18rem; color: var(--faint); font-family: var(--font-mono); font-size: 0.57rem; }
.country-index i { color: var(--aqua); font-style: normal; }

.manifesto {
  display: grid;
  padding: clamp(7rem, 12vw, 12rem) clamp(0rem, 6vw, 7rem);
  grid-template-columns: 0.7fr 1.4fr;
  gap: 3rem;
  border-top: 1px solid var(--line);
}
.manifesto h2 { max-width: 14ch; margin-bottom: 1.8rem; font-size: clamp(2.7rem, 5vw, 5.5rem); font-weight: 500; letter-spacing: -0.055em; line-height: 0.98; }
.manifesto div > p { max-width: 46rem; color: var(--mist); font-size: 1.05rem; }
.featured-journey { display: grid; margin-bottom: clamp(7rem, 11vw, 11rem); grid-template-columns: 1.35fr 0.8fr; background: #0a1c25; }
.featured-art { position: relative; min-height: 36rem; overflow: hidden; }
.featured-art svg { display: block; width: 100%; height: 100%; object-fit: cover; }
.featured-art span { position: absolute; bottom: 1rem; left: 1rem; color: rgba(255,255,255,.6); font-family: var(--font-mono); font-size: 0.57rem; letter-spacing: 0.12em; }
.featured-copy { display: flex; padding: clamp(2rem, 5vw, 5.5rem); flex-direction: column; justify-content: center; }
.featured-copy h2 { margin-bottom: 1rem; font-size: clamp(2.5rem, 4vw, 4.5rem); font-weight: 500; letter-spacing: -0.06em; line-height: 0.95; }
.featured-copy > p:not(.eyebrow) { color: var(--mist); }
.featured-copy dl { margin: 1rem 0 2rem; }
.featured-copy dl div { display: flex; padding: 0.55rem 0; justify-content: space-between; border-top: 1px solid var(--line); gap: 1rem; }
.featured-copy dt { color: var(--faint); font-family: var(--font-mono); font-size: 0.59rem; letter-spacing: .1em; text-transform: uppercase; }
.featured-copy dd { margin: 0; color: var(--mist); font-size: .75rem; text-align: right; }
.featured-copy .button { align-self: flex-start; }

/* Journal and article pages */
.journal, .photo-journal { width: min(100% - 3rem, 1280px); }
.back-link { display: inline-flex; margin-bottom: 3rem; gap: .55rem; color: var(--mist); font-family: var(--font-mono); font-size: .62rem; letter-spacing: .1em; text-decoration: none; text-transform: uppercase; }
.back-link:hover { color: var(--aqua); }
.journal-hero { display: grid; min-height: calc(100svh - 5rem); grid-template-columns: .9fr 1fr; align-items: center; gap: clamp(2rem, 7vw, 8rem); }
.journal-heading h1, .photo-hero h1, .error-page h1 { margin: 0 0 1.8rem; font-size: clamp(4.4rem, 9vw, 9rem); font-weight: 520; letter-spacing: -.075em; line-height: .78; }
.journal-heading > p:not(.eyebrow) { max-width: 36rem; color: var(--mist); font-size: 1.05rem; }
.journal-meta { display: flex; margin-top: 2rem; gap: 1.4rem; color: var(--faint); font-family: var(--font-mono); font-size: .59rem; letter-spacing: .08em; text-transform: uppercase; }
.journal-map { align-self: stretch; min-height: 42rem; }
.journal-map svg { width: 100%; height: 100%; }
.norway-shape { fill: url(#map-fill); stroke: rgba(145,211,220,.45); stroke-width: 2; }
.planned-line { fill: none; stroke: var(--amber); stroke-width: 3; stroke-linecap: round; stroke-dasharray: 2 12; }
.map-stop circle { fill: var(--night); stroke: var(--amber-pale); stroke-width: 3; }
.map-stop text { fill: var(--mist); font-family: var(--font-mono); font-size: 15px; letter-spacing: 2px; text-transform: uppercase; }
.map-stop.anchor circle { fill: var(--amber); filter: drop-shadow(0 0 8px var(--amber)); }
.map-disclaimer { fill: var(--faint); font-family: var(--font-mono); font-size: 9px; letter-spacing: 1.5px; }
.journal-intro { display: grid; padding: clamp(6rem, 10vw, 10rem) clamp(0rem, 5vw, 5rem); grid-template-columns: .55fr 1.45fr; gap: 3rem; border-top: 1px solid var(--line); }
.journal-intro h2 { max-width: 22ch; margin-bottom: 1.6rem; font-size: clamp(2.5rem, 4.5vw, 4.6rem); font-weight: 500; letter-spacing: -.05em; line-height: 1; }
.journal-intro div > p { max-width: 49rem; color: var(--mist); font-size: 1rem; }
.journal-doors { display: grid; margin-bottom: 5rem; grid-template-columns: repeat(2, 1fr); gap: 1px; background: var(--line-bright); border: 1px solid var(--line-bright); }
.journal-door { position: relative; min-height: 23rem; padding: clamp(2rem, 5vw, 5rem); background: var(--panel-solid); text-decoration: none; }
a.journal-door { transition: background 200ms ease; }
a.journal-door:hover { background: #102d3a; }
/* Direct child only: the download buttons carry their own arrow spans. */
.journal-door > span { color: var(--amber); font-family: var(--font-mono); font-size: .59rem; letter-spacing: .12em; text-transform: uppercase; }
.journal-door h2 { margin: 4rem 0 1rem; font-size: clamp(2.2rem, 4vw, 4rem); font-weight: 500; letter-spacing: -.05em; }
.journal-door p:not(.archive-warning) { max-width: 28rem; color: var(--mist); }
.journal-door i { position: absolute; right: 2rem; bottom: 1.7rem; color: var(--aqua); font-size: 1.3rem; font-style: normal; }
.truth-note { display: flex; max-width: 58rem; margin: 0 auto 8rem; padding: 1.5rem; border: 1px solid var(--line); align-items: flex-start; gap: 1rem; background: rgba(13,39,52,.45); }
.truth-note > span { color: var(--aqua); font-size: 1.35rem; }
.truth-note strong { display: block; margin-bottom: .25rem; font-size: .84rem; }
.truth-note p { margin: 0; color: var(--mist); font-size: .79rem; }

.photo-hero h1 { font-size: clamp(4.2rem, 8vw, 8.5rem); }
.download-actions { display: flex; margin-top: 2rem; flex-wrap: wrap; gap: .75rem; }
.archive-warning { margin-top: 1rem; color: var(--faint); font-family: var(--font-mono); font-size: .58rem; letter-spacing: .06em; }

/* Photo edit */
.photo-hero { max-width: 78rem; padding: clamp(6rem, 10vw, 10rem) 0 5rem; }
.photo-hero > p:not(.eyebrow) { max-width: 44rem; color: var(--mist); font-size: 1.04rem; }
.contact-sheet-empty { display: grid; padding: 2rem 0 8rem; grid-template-columns: repeat(4, 1fr); grid-template-rows: auto auto; gap: 1rem; }
.film-frame { position: relative; aspect-ratio: .78; overflow: hidden; border: 1px solid var(--line); background: linear-gradient(145deg, #112f3b, #07131b 70%); }
.film-frame:nth-child(2) { background: linear-gradient(160deg, #39291f, #102630 48%, #07131b); }
.film-frame:nth-child(3) { background: linear-gradient(145deg, #1c4658, #0b202c 58%, #081219); }
.film-frame:nth-child(4) { background: linear-gradient(150deg, #2a493f, #122d38 45%, #081219); }
.film-frame::before, .film-frame::after { position: absolute; top: .6rem; bottom: .6rem; width: .32rem; background: repeating-linear-gradient(180deg, transparent 0 .7rem, rgba(255,255,255,.13) .7rem 1.05rem); content: ""; }
.film-frame::before { left: .5rem; } .film-frame::after { right: .5rem; }
.film-frame i { position: absolute; inset: 18% 14%; border: 1px solid rgba(255,255,255,.07); background: radial-gradient(circle at 50% 30%, rgba(111,213,208,.12), transparent 55%); }
.film-frame span, .film-frame small { position: absolute; z-index: 2; font-family: var(--font-mono); font-size: .53rem; letter-spacing: .08em; }
.film-frame span { top: .9rem; left: 1.2rem; color: var(--amber); }
.film-frame small { bottom: .9rem; left: 1.2rem; color: var(--faint); }
.edit-note { grid-column: 2 / 5; padding: 4rem 0 0 2rem; }
.edit-note h2 { font-size: clamp(2.7rem, 5vw, 5rem); font-weight: 500; letter-spacing: -.06em; line-height: .95; }
.edit-note > p:not(.eyebrow) { max-width: 42rem; color: var(--mist); }
.photo-note { margin-bottom: 8rem; }
.photo-grid { display: grid; padding-bottom: 7rem; grid-template-columns: repeat(12, 1fr); gap: 1rem; }
.photo-grid figure { grid-column: span 4; margin: 0; }
.photo-grid figure.wide { grid-column: span 8; }.photo-grid figure.tall { grid-column: span 4; }
.photo-grid button { display: block; width: 100%; padding: 0; border: 0; background: none; cursor: zoom-in; }
.photo-grid img { display: block; width: 100%; height: auto; }
.photo-grid figcaption { padding: .7rem 0; color: var(--mist); font-size: .72rem; }
.photo-grid figcaption span { display: block; color: var(--amber); font-family: var(--font-mono); font-size: .54rem; letter-spacing: .08em; text-transform: uppercase; }
.lightbox {
  width: min(94vw, 90rem);
  height: min(92svh, 60rem);
  padding: 0;
  border: 1px solid var(--line-bright);
  color: var(--ice);
  background: rgba(3, 10, 16, .97);
  box-shadow: 0 2rem 7rem rgba(0, 0, 0, .7);
}
.lightbox::backdrop { background: rgba(1, 5, 8, .88); backdrop-filter: blur(10px); }
.lightbox[open] { display: grid; grid-template-columns: 4rem 1fr 4rem; align-items: center; }
.lightbox figure { display: flex; height: 100%; margin: 0; padding: 2rem 0; align-items: center; flex-direction: column; justify-content: center; }
.lightbox img { display: block; max-width: 100%; max-height: calc(92svh - 7rem); object-fit: contain; }
.lightbox figcaption { width: 100%; padding-top: .75rem; color: var(--mist); font-size: .72rem; }
.lightbox-close { position: absolute; top: .75rem; right: .75rem; z-index: 2; width: 2.5rem; height: 2.5rem; border: 1px solid var(--line); background: var(--night); cursor: pointer; font-size: 1.3rem; }
.lightbox-step { height: 4rem; border: 0; color: var(--aqua); background: transparent; cursor: pointer; font-size: 1.2rem; }
.lightbox-step:hover, .lightbox-close:hover { color: var(--ice); background: rgba(131, 228, 227, .08); }

.error-page { min-height: calc(100svh - 5rem); padding: clamp(6rem, 14vw, 12rem) 0; }
.error-page h1 { font-size: clamp(4rem, 8vw, 8rem); }
.error-page > p:not(.eyebrow) { color: var(--mist); }

.site-footer {
  display: flex;
  width: min(100% - 3rem, 1500px);
  min-height: 14rem;
  margin: 0 auto;
  padding: 3rem 0;
  align-items: flex-start;
  justify-content: space-between;
  gap: 3rem;
  border-top: 1px solid var(--line);
}
.footer-brand { margin-bottom: 1rem; }
.site-footer p { max-width: 26rem; color: var(--faint); font-size: .75rem; }
.site-footer nav { display: grid; min-width: 16rem; gap: .6rem; }
.site-footer nav a { color: var(--mist); font-family: var(--font-mono); font-size: .61rem; letter-spacing: .08em; text-decoration: none; text-transform: uppercase; }
.site-footer nav a:hover { color: var(--aqua); }

@keyframes blink { 50% { opacity: .25; } }
@keyframes card-in { from { opacity: 0; transform: translateY(14px); } }

@media (max-width: 1000px) {
  .atlas { grid-template-columns: minmax(15rem, .65fr) minmax(28rem, 1.2fr); }
  .atlas-copy h1 { font-size: clamp(3.6rem, 7vw, 5.5rem); }
  .journey-card { width: min(20rem, 55%); }
  .featured-journey { grid-template-columns: 1fr; }
  .featured-art { min-height: 28rem; }
  .journal-hero { grid-template-columns: 1fr 1fr; gap: 2rem; }
}

@media (max-width: 760px) {
  .site-header { width: min(100% - 2rem, 1500px); min-height: 4.8rem; }
  .site-header nav { gap: .75rem; }
  .site-header nav > a:not(.portfolio-link) { display: none; }
  .site-header .portfolio-link { padding: .48rem .62rem; }
  main, .journal, .photo-journal { width: min(100% - 2rem, 1500px); }
  .atlas { display: flex; min-height: auto; padding-top: 3.5rem; flex-direction: column; }
  .atlas-copy { width: 100%; padding: 0; }
  .atlas-copy h1 { font-size: clamp(4rem, 20vw, 6.2rem); }
  .atlas-lede { max-width: 28rem; }
  .globe-stage { width: calc(100% + 2rem); min-height: 34rem; margin-inline: -1rem; }
  .globe-poster { inset: 0; width: 100%; height: 100%; }
  .globe-hint { display: none; }
  .journey-card {
    position: absolute;
    right: 1rem;
    bottom: 1rem;
    left: 1rem;
    width: auto;
    padding: 1rem;
  }
  .journey-card article > p:not(.journey-date, .route-note) { display: none; }
  .journey-card h2 { margin-bottom: .45rem; }
  /* The card goes full width here, putting its actions in the same corner as
     the fixed switcher dial. The dial wins that corner (it is pinned to the
     viewport, so no amount of card padding clears it at every scroll offset),
     so the actions move to the far edge instead. */
  .journey-actions { justify-content: flex-end; }
  .country-index { width: 100%; margin: 1rem 0 3rem; }
  .manifesto { padding: 6rem 0; grid-template-columns: 1fr; gap: 1rem; }
  .manifesto h2 { font-size: clamp(2.8rem, 13vw, 4rem); }
  .featured-journey { margin-inline: -1rem; }
  .featured-art { min-height: 22rem; }
  .featured-copy { padding: 2rem 1rem 3rem; }
  .journal-hero { display: flex; padding-top: 5rem; flex-direction: column; }
  .journal-heading h1, .photo-hero h1, .error-page h1 { font-size: clamp(3.8rem, 19vw, 6rem); }
  .journal-map { width: 100%; min-height: 32rem; }
  .journal-intro { padding: 6rem 0; grid-template-columns: 1fr; gap: 1rem; }
  .journal-doors { grid-template-columns: 1fr; }
  .journal-door { min-height: 19rem; }
  .photo-hero { padding-top: 5rem; }
  .contact-sheet-empty { grid-template-columns: repeat(2, 1fr); }
  .lightbox[open] { grid-template-columns: 2.5rem 1fr 2.5rem; }
  .lightbox figure { padding: 3rem 0 1rem; }
  .edit-note { grid-column: 1 / -1; padding: 3rem 0 0; }
  .site-footer { width: min(100% - 2rem, 1500px); flex-direction: column; }
}

@media (max-width: 430px) {
  .atlas-stats { gap: 1.4rem; }
  .atlas-stats strong { font-size: 1.5rem; }
  .journey-actions { align-items: flex-end; flex-direction: column; gap: .65rem; }
  .journey-card .route-note { display: none; }
  .journal-meta { flex-direction: column; gap: .4rem; }
  .contact-sheet-empty { gap: .6rem; }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { animation-duration: .01ms !important; animation-iteration-count: 1 !important; scroll-behavior: auto !important; transition-duration: .01ms !important; }
}

@media print {
  .site-header, .site-footer, .download-actions, .back-link, .home-sky { display: none !important; }
  body { color: #111; background: #fff; }
  main { width: 100%; }
  .journal-heading h1 { color: #111; }
}
/* Cross-document view transitions for version switching (cinematic switcher).
   This file is identical on every version branch — edit on `content` and
   cherry-pick, like the content contract.

   Browsers without cross-document view transitions ignore all of this and
   navigate normally (progressive enhancement). */

@view-transition {
  navigation: auto;
}

/* Identity anchor: tag the page's "Sean" headline with this class so it
   morphs between layouts. Exactly one element per page. */
.vt-sean-name {
  view-transition-name: sean-name;
}

/* Skip a page's intro animation when arriving via a version switch — the
   transition itself is the intro. The dial's pagereveal handler adds
   .vt-arrived to <html> before first paint. Duration 0 (not `none`) so
   `forwards` fills still land elements in their final state. */
html.vt-arrived .vt-skip-intro,
html.vt-arrived .vt-skip-intro * {
  animation-duration: 0s !important;
  animation-delay: 0s !important;
}

/* Base: gentle zoom cross-fade. */
::view-transition-old(root) {
  animation: vt-leave 240ms cubic-bezier(0.4, 0, 0.2, 1) both;
}
::view-transition-new(root) {
  animation: vt-enter 320ms cubic-bezier(0.2, 0, 0, 1) both;
}

/* Morphing elements glide a touch slower than the root fade. */
::view-transition-group(sean-name),
::view-transition-group(universe-dial) {
  animation-duration: 380ms;
  animation-timing-function: cubic-bezier(0.3, 0, 0, 1);
}

/* Per-version flavor. Types like "to-c-terminal" / "from-b-card" are added
   in the dial's pagereveal handler. */
html:active-view-transition-type(to-c-terminal)::view-transition-new(root) {
  animation: vt-crt-in 400ms ease-out both;
}
html:active-view-transition-type(from-c-terminal)::view-transition-old(root) {
  animation: vt-crt-out 240ms ease-in both;
}
html:active-view-transition-type(to-b-card)::view-transition-new(root) {
  animation: vt-card-in 380ms cubic-bezier(0.2, 0, 0, 1) both;
}
html:active-view-transition-type(to-a-scroll)::view-transition-new(root) {
  animation: vt-scroll-in 360ms cubic-bezier(0.2, 0, 0, 1) both;
}
html:active-view-transition-type(to-d-3d-game)::view-transition-new(root) {
  animation: vt-game-in 420ms cubic-bezier(0.2, 0, 0, 1) both;
}
/* Arriving at the atlas settles in the way the globe does — a slow approach
   out of the dark rather than a snap. */
html:active-view-transition-type(to-g-travel)::view-transition-new(root) {
  animation: vt-travel-in 460ms cubic-bezier(0.2, 0, 0, 1) both;
}

@keyframes vt-travel-in {
  from {
    opacity: 0;
    transform: scale(1.03);
  }
}

@keyframes vt-leave {
  to {
    opacity: 0;
    transform: scale(0.985);
  }
}

@keyframes vt-enter {
  from {
    opacity: 0;
    transform: scale(1.015);
  }
}

/* Terminal: CRT power-on / power-off. */
@keyframes vt-crt-in {
  0% {
    opacity: 0;
    transform: scaleY(0.92);
    filter: brightness(2.4) saturate(0.2);
  }
  60% {
    opacity: 1;
    filter: brightness(1.2) saturate(0.8);
  }
  100% {
    opacity: 1;
    transform: scaleY(1);
    filter: brightness(1) saturate(1);
  }
}

@keyframes vt-crt-out {
  to {
    opacity: 0;
    transform: scaleY(0.9);
    filter: brightness(2.8);
  }
}

/* Card: settles in with a slight 3D tilt. */
@keyframes vt-card-in {
  from {
    opacity: 0;
    transform: perspective(1200px) rotateX(5deg) scale(1.03);
  }
}

/* Scroll: rises into place. */
@keyframes vt-scroll-in {
  from {
    opacity: 0;
    transform: translateY(16px);
  }
}

/* Game: drops in from above under a flash of floodlight. */
@keyframes vt-game-in {
  0% {
    opacity: 0;
    transform: translateY(-14px) scale(1.03);
    filter: brightness(1.5) saturate(0.7);
  }
  60% {
    opacity: 1;
    filter: brightness(1.1) saturate(0.9);
  }
  100% {
    opacity: 1;
    transform: translateY(0) scale(1);
    filter: brightness(1) saturate(1);
  }
}

/* Reduced motion: navigate without theatrics. */
@media (prefers-reduced-motion: reduce) {
  ::view-transition-group(*),
  ::view-transition-image-pair(*),
  ::view-transition-old(*),
  ::view-transition-new(*) {
    animation: none !important;
  }
}
.universe-dial[data-astro-cid-g3bouzgm] {
  position: fixed;
  bottom: 1rem;
  left: 1rem;
  z-index: 50;
  display: flex;
  align-items: center;
  overflow: hidden;
  border: 1px solid var(--line-bright);
  border-radius: 999px;
  background: #061119d1;
  box-shadow: 0 .75rem 2rem #00000073;
  backdrop-filter: blur(12px);
  view-transition-name: universe-dial;
  animation: 3s ease-in-out infinite dial-glow;
}

.dial-core[data-astro-cid-g3bouzgm] {
  position: relative;
  display: flex;
  width: 2.5rem;
  height: 2.5rem;
  flex-shrink: 0;
  align-items: center;
  justify-content: center;
  overflow: hidden;
  border: 0;
  border-radius: 50%;
  background: none;
  cursor: pointer;
}

.dial-glyph[data-astro-cid-g3bouzgm] {
  color: var(--amber);
  font-family: var(--font-mono);
  font-size: .85rem;
}

.dial-ring[data-astro-cid-g3bouzgm] {
  position: absolute;
  inset: .375rem;
  border: 1px dashed #ffb45b80;
  border-radius: 50%;
  animation: 16s linear infinite dial-spin;
}

.dial-pill[data-astro-cid-g3bouzgm] {
  padding: .25rem .6rem;
  border-radius: 999px;
  font-family: var(--font-mono);
  font-size: .6rem;
  letter-spacing: .06em;
  text-decoration: none;
  text-transform: uppercase;
  white-space: nowrap;
}

.dial-pill-glyph[data-astro-cid-g3bouzgm] {
  margin-right: .3rem;
}

.dial-pill-current[data-astro-cid-g3bouzgm] {
  color: #1a1108;
  background: var(--amber);
  cursor: default;
}

.dial-pill-link[data-astro-cid-g3bouzgm] {
  color: var(--mist);
  transition: color .16s, background .16s;
}

.dial-pill-link[data-astro-cid-g3bouzgm]:hover {
  color: var(--ice);
  background: #83e4e31a;
}

.dial-shine[data-astro-cid-g3bouzgm] {
  position: absolute;
  top: -30%;
  left: -70%;
  width: 42%;
  height: 160%;
  background: linear-gradient(100deg, #0000, #ffffffbf, #0000);
  transform: skewX(-18deg);
  pointer-events: none;
  animation: 4s ease-in-out 1s infinite dial-shine;
}

.dial-ping[data-astro-cid-g3bouzgm] {
  position: fixed;
  left: 1rem;
  bottom: 1rem;
  width: 2.5rem;
  height: 2.5rem;
  border-radius: 50%;
  z-index: 40;
  pointer-events: none;
}

.dial-ping[data-astro-cid-g3bouzgm]:before, .dial-ping[data-astro-cid-g3bouzgm]:after {
  content: "";
  position: absolute;
  inset: 0;
  border-radius: 50%;
  border: 2.5px solid var(--color-accent, #6366f1);
  opacity: 0;
}

.dial-ping[data-astro-cid-g3bouzgm].nudge:before {
  animation: 1.9s ease-out 3 dial-ping;
}

.dial-ping[data-astro-cid-g3bouzgm].nudge:after {
  animation: 1.9s ease-out .95s 3 dial-ping;
}

.universe-dial[data-astro-cid-g3bouzgm].nudge .dial-core[data-astro-cid-g3bouzgm] {
  animation: 1.9s ease-in-out 3 dial-nudge;
}

.dial-options[data-astro-cid-g3bouzgm] {
  max-width: 0;
  opacity: 0;
  padding-right: 0;
  transition: max-width .35s cubic-bezier(.2, 0, 0, 1), padding-right .35s cubic-bezier(.2, 0, 0, 1), opacity .25s;
}

.universe-dial[data-astro-cid-g3bouzgm]:hover .dial-options[data-astro-cid-g3bouzgm], .universe-dial[data-astro-cid-g3bouzgm]:focus-within .dial-options[data-astro-cid-g3bouzgm], .universe-dial[data-astro-cid-g3bouzgm].open .dial-options[data-astro-cid-g3bouzgm] {
  max-width: 22rem;
  opacity: 1;
  padding-right: .5rem;
}

@keyframes dial-spin {
  to {
    transform: rotate(360deg);
  }
}

@keyframes dial-glow {
  0%, 100% {
    box-shadow: 0 0 8px #6366f147;
  }

  50% {
    box-shadow: 0 0 22px 3px #6366f199;
  }
}

@keyframes dial-shine {
  0% {
    left: -70%;
  }

  14% {
    left: 130%;
  }

  100% {
    left: 130%;
  }
}

@keyframes dial-ping {
  0% {
    transform: scale(.8);
    opacity: .85;
  }

  100% {
    transform: scale(2.3);
    opacity: 0;
  }
}

@keyframes dial-nudge {
  0%, 100% {
    transform: scale(1);
  }

  30% {
    transform: scale(1.14);
  }

  60% {
    transform: scale(.98);
  }
}

@media (prefers-reduced-motion: reduce) {
  .universe-dial[data-astro-cid-g3bouzgm], .dial-ring[data-astro-cid-g3bouzgm], .dial-shine[data-astro-cid-g3bouzgm], .dial-ping[data-astro-cid-g3bouzgm].nudge:before, .dial-ping[data-astro-cid-g3bouzgm].nudge:after, .universe-dial[data-astro-cid-g3bouzgm].nudge .dial-core[data-astro-cid-g3bouzgm] {
    animation: none;
  }

  .dial-options[data-astro-cid-g3bouzgm] {
    transition: none;
  }
}

.nexus-defs[data-astro-cid-g3bouzgm] {
  position: absolute;
  width: 0;
  height: 0;
  pointer-events: none;
}

.nexus-launcher[data-astro-cid-g3bouzgm] {
  position: fixed;
  left: 1rem;
  bottom: 1rem;
  width: 2.5rem;
  height: 2.5rem;
  z-index: 50;
  pointer-events: none;
  -webkit-tap-highlight-color: transparent;
}

.nexus-goo[data-astro-cid-g3bouzgm] {
  position: absolute;
  left: 50%;
  bottom: .5rem;
  width: 4.5rem;
  height: 7rem;
  margin-left: -2.25rem;
  filter: url("#nexus-goo");
  opacity: 0;
}

.nexus-blob[data-astro-cid-g3bouzgm] {
  position: absolute;
  left: 50%;
  bottom: 0;
  border-radius: 50%;
  background: #818cf8;
  will-change: transform;
}

.nexus-blob-base[data-astro-cid-g3bouzgm] {
  width: 1.9rem;
  height: 1.5rem;
  margin-left: -.95rem;
}

.nexus-blob-drop[data-astro-cid-g3bouzgm] {
  width: 1.55rem;
  height: 1.55rem;
  margin-left: -.775rem;
  transform-origin: 50% 100%;
}

.nexus-portal[data-astro-cid-g3bouzgm] {
  position: absolute;
  left: 50%;
  bottom: 100%;
  width: 2.5rem;
  height: 2.5rem;
  border-radius: 50%;
  overflow: hidden;
  pointer-events: auto;
  opacity: 0;
  transform: translateX(-50%) translateY(-.5rem) scale(.85);
  transition: opacity .3s, transform .3s;
  box-shadow: 0 0 0 1.5px #c7bafdd9, 0 0 16px 2px #7c83ff8c, inset 0 0 12px 2px #03030c99;
}

.nexus-portal-swirl[data-astro-cid-g3bouzgm] {
  position: absolute;
  inset: -35%;
  background: conic-gradient(#7c83ff, #a855f7, #ff9e64, #3ddc84, #6366f1, #7c83ff);
  filter: blur(1px);
}

.nexus-portal-core[data-astro-cid-g3bouzgm] {
  position: absolute;
  inset: 0;
  border-radius: 50%;
  background: radial-gradient(circle at 50% 47%, #fffffff2 0%, #d6deff59 13%, #0a0a1a1f 40%, #05050f99 74%);
}

.nexus-launcher[data-astro-cid-g3bouzgm]:hover .nexus-portal[data-astro-cid-g3bouzgm], .nexus-launcher[data-astro-cid-g3bouzgm]:focus-visible .nexus-portal[data-astro-cid-g3bouzgm] {
  box-shadow: 0 0 0 1.5px #fffffff2, 0 0 24px 4px #7c83ffcc, inset 0 0 12px 2px #03030c80;
}

.nexus-launcher[data-astro-cid-g3bouzgm]:hover .nexus-portal-swirl[data-astro-cid-g3bouzgm] {
  animation-duration: 2.4s;
}

.nexus-launcher[data-astro-cid-g3bouzgm]:focus-visible {
  outline: none;
}

.nexus-launcher[data-astro-cid-g3bouzgm]:focus-visible .nexus-portal[data-astro-cid-g3bouzgm] {
  outline: 2px solid #c4b5fd;
  outline-offset: 3px;
}

.nexus-active[data-astro-cid-g3bouzgm] .nexus-goo[data-astro-cid-g3bouzgm] {
  animation: .72s linear forwards nexus-goo-fade;
}

.nexus-active[data-astro-cid-g3bouzgm] .nexus-blob-base[data-astro-cid-g3bouzgm] {
  animation: .72s cubic-bezier(.5, 0, .2, 1) forwards nexus-base;
}

.nexus-active[data-astro-cid-g3bouzgm] .nexus-blob-drop[data-astro-cid-g3bouzgm] {
  animation: .72s cubic-bezier(.45, 0, .2, 1) forwards nexus-drop;
}

.nexus-active[data-astro-cid-g3bouzgm] .nexus-portal[data-astro-cid-g3bouzgm] {
  animation: .5s cubic-bezier(.3, 0, .2, 1) .18s forwards nexus-portal-in, 4s ease-in-out .75s infinite nexus-portal-bob;
}

.nexus-active[data-astro-cid-g3bouzgm] .nexus-portal-swirl[data-astro-cid-g3bouzgm] {
  animation: 5s linear infinite nexus-portal-spin;
}

.nexus-active[data-astro-cid-g3bouzgm] .nexus-portal-core[data-astro-cid-g3bouzgm] {
  animation: 3s ease-in-out infinite nexus-portal-pulse;
}

@keyframes nexus-drop {
  0% {
    transform: translateY(.1rem) scale(.6);
  }

  18% {
    transform: translateY(-.3rem) scaleX(.72) scaleY(1.55);
  }

  38% {
    transform: translateY(-1.1rem) scaleX(.55) scaleY(2.1);
  }

  58% {
    transform: translateY(-2.7rem) scaleX(.9) scaleY(1.12);
  }

  80% {
    transform: translateY(-4.6rem) scale(1.07);
  }

  100% {
    transform: translateY(-4.2rem) scale(1);
  }
}

@keyframes nexus-base {
  0% {
    transform: scale(1);
    opacity: 1;
  }

  28% {
    transform: scaleX(1.15) scaleY(.82);
    opacity: 1;
  }

  46% {
    transform: scaleX(1) scaleY(.6);
    opacity: .9;
  }

  100% {
    transform: scale(.3);
    opacity: 0;
  }
}

@keyframes nexus-goo-fade {
  0%, 66% {
    opacity: 1;
  }

  100% {
    opacity: 0;
  }
}

@keyframes nexus-portal-in {
  0% {
    opacity: 0;
    transform: translateX(-50%) translateY(-.05rem) scale(.25) rotate(-45deg);
  }

  60% {
    opacity: 1;
    transform: translateX(-50%) translateY(-.6rem) scale(1.1) rotate(8deg);
  }

  100% {
    opacity: 1;
    transform: translateX(-50%) translateY(-.5rem) scale(1) rotate(0);
  }
}

@keyframes nexus-portal-bob {
  0%, 100% {
    transform: translateX(-50%) translateY(-.5rem) scale(1);
  }

  50% {
    transform: translateX(-50%) translateY(-.8rem) scale(1);
  }
}

@keyframes nexus-portal-spin {
  to {
    transform: rotate(360deg);
  }
}

@keyframes nexus-portal-pulse {
  0%, 100% {
    opacity: .82;
    transform: scale(1);
  }

  50% {
    opacity: 1;
    transform: scale(1.07);
  }
}

@media (prefers-reduced-motion: reduce) {
  .nexus-active[data-astro-cid-g3bouzgm] .nexus-goo[data-astro-cid-g3bouzgm], .nexus-active[data-astro-cid-g3bouzgm] .nexus-blob-base[data-astro-cid-g3bouzgm], .nexus-active[data-astro-cid-g3bouzgm] .nexus-blob-drop[data-astro-cid-g3bouzgm] {
    animation: none;
    opacity: 0;
  }

  .nexus-active[data-astro-cid-g3bouzgm] .nexus-portal[data-astro-cid-g3bouzgm] {
    animation: none;
    opacity: 1;
    transform: translateX(-50%) translateY(-.5rem) scale(1);
  }

  .nexus-active[data-astro-cid-g3bouzgm] .nexus-portal-swirl[data-astro-cid-g3bouzgm], .nexus-active[data-astro-cid-g3bouzgm] .nexus-portal-core[data-astro-cid-g3bouzgm] {
    animation: none;
  }
}