/* The atlas shares UTHAYA's black, chalk and restrained Eelam accents. */
.diaspora-page {
  --d-red: #ab3e43;
  --d-ink: #171719;
  --d-secondary: #56534f;
  --d-rule: #d4d1ca;
  --d-paper: #f5f3ee;
  --d-cream: #fbfaf7;
  --red: #ab3e43;
  --paper: #f5f3ee;
  --cream: #fbfaf7;
  --ink: #171719;
  background: #f5f3ee;
}
.diaspora-page .topbar { border-bottom-color: #353538; background: #111113; }
.diaspora-page .brand, .diaspora-page .brand small, .diaspora-page .nav-main a, .diaspora-page .menu-mobile summary { color: #f5f3ee; }
.diaspora-page .brand-seal { background: linear-gradient(180deg, #cf514c 0 70%, #bc9b62 70%); }
.diaspora-page .nav-main a:hover, .diaspora-page .nav-main a:focus-visible, .diaspora-page .nav-main a[aria-current="page"] { border-bottom-color: #cf514c; color: #fff; }
.diaspora-page .menu-mobile summary::after { color: #cf514c; }
.diaspora-page .menu-mobile nav { border-bottom-color: #353538; background: #111113; }
.diaspora-page .menu-mobile nav a { border-color: #353538; color: #f5f3ee; }
.diaspora-page .site-crumbs { width: 100%; max-width: none; padding-inline: var(--gutter); border-color: #353538; background: #111113; color: #aaa8a3; }
.diaspora-page .site-crumbs a { color: #c6c3bd; }
.diaspora-page .site-crumbs [aria-current="page"] { color: #f5f3ee; }
.diaspora-page .site-crumbs a:hover { color: #e58c83; }

.diaspora-hero-v2 { grid-template-columns: minmax(0, 1.08fr) minmax(0, .92fr); min-height: max(650px, calc(100svh - 146px)); border-bottom: 0; background: #111113; color: #f5f3ee; }
.diaspora-hero-copy { position: relative; z-index: 2; align-items: flex-start; padding: 70px clamp(36px, 5vw, 88px); background: #111113; }
.diaspora-hero-copy .diaspora-eyebrow { color: #cbb197; font-size: 11px; letter-spacing: .2em; }
.diaspora-page .diaspora-hero-copy h1 { max-width: 840px; margin-top: 55px; color: #f5f3ee; font-size: clamp(78px, 7.9vw, 126px); font-weight: 760; letter-spacing: .02em; line-height: .91; }
.diaspora-hero-copy h1 em { color: #d0524e; font-family: Georgia, serif; font-size: .84em; font-weight: 400; letter-spacing: -.015em; }
.diaspora-hero-copy > p:not(.diaspora-eyebrow) { max-width: 650px; margin-top: 38px; color: #d6d3ce; font-size: clamp(19px, 1.55vw, 23px); line-height: 1.48; }
.diaspora-hero-action { display: inline-flex; flex-direction: row-reverse; align-items: center; gap: 17px; min-width: 0; margin-top: 42px; padding: 0; border: 0; color: #f5f3ee; font-size: 15px; font-weight: 740; }
.diaspora-hero-action span { display: grid; place-items: center; width: 60px; height: 60px; border-radius: 50%; background: #d0524e; color: #111113; font-size: 30px; font-weight: 400; transition: transform .3s ease; }
.diaspora-hero-action:hover { text-decoration: none; }
.diaspora-hero-action:hover span { transform: translateY(5px); }
.diaspora-hero-scenery { position: relative; z-index: 1; justify-content: end; padding: 60px clamp(35px, 4vw, 70px); overflow: hidden; border-left: 1px solid #3a3839; background: #171719; color: #f5f3ee; isolation: isolate; }
.diaspora-hero-scenery::before { position: absolute; z-index: -2; top: -8%; right: -20%; width: 105%; aspect-ratio: 1; border-radius: 50%; background: url('assets/diaspora-globe-poster.webp') center / cover no-repeat; filter: grayscale(1) brightness(.62) contrast(1.17); opacity: .42; content: ''; }
.diaspora-hero-scenery::after { position: absolute; z-index: -1; inset: 0; background: linear-gradient(0deg, #171719 5%, #171719cc 45%, #17171918 100%); content: ''; }
.diaspora-hero-scenery__label { margin-bottom: 8px !important; color: #d0ad87 !important; font-size: 11px !important; letter-spacing: .17em; }
.diaspora-hero-scenery > div { display: block; padding: 20px 0 22px; border-top: 1px solid #ffffff59; }
.diaspora-hero-scenery span { display: block; color: #d2aaa0 !important; font-size: 10px; font-weight: 780; letter-spacing: .15em; }
.diaspora-hero-scenery strong { display: block; margin-top: 9px; color: #f5f3ee; font-size: clamp(25px, 2.7vw, 40px); font-weight: 650; letter-spacing: .012em; line-height: 1.05; }
.diaspora-hero-scenery strong i { color: #d45a55; font-style: normal; font-weight: 400; }

.diaspora-movement { --d-red: #ab3e43; --d-ink: #171719; --d-secondary: #57534f; --d-rule: #cfcbc3; padding-block: clamp(90px, 9vw, 135px); background: #eeece8; }
.diaspora-movement-head { margin-bottom: clamp(45px, 5vw, 75px); }
.diaspora-movement-head .diaspora-eyebrow { color: #94363c; }
.diaspora-movement-head h2 { max-width: 900px; color: #171719; font-size: clamp(58px, 6.5vw, 96px); font-weight: 740; letter-spacing: .022em; line-height: .98; }
.diaspora-movement-head > p:last-child { color: #55514d; }
.diaspora-map-toolbar { border-bottom-color: #c5c1ba; }
.diaspora-period-switch button { color: #4e4b47; }
.diaspora-period-switch button span, .diaspora-period-switch button[aria-pressed="true"] span, .diaspora-period-switch button[aria-pressed="true"] small { color: #a54045; }
.diaspora-period-switch button[aria-pressed="true"] { color: #171719; }
.diaspora-period-switch button[aria-pressed="true"]::after { background: #ac3d43; }
.diaspora-replay { color: #92383e; border-color: #92383e; }
.diaspora-replay:hover { color: #6d292e; }
.diaspora-period-switch button:focus-visible, .diaspora-route-picker button:focus-visible, .diaspora-replay:focus-visible, .diaspora-globe-viewport:focus-visible { outline-color: #d0524e; }

.diaspora-globe-stage { position: relative; grid-template-columns: minmax(300px, .36fr) minmax(0, .64fr); height: 720px; min-height: 720px; overflow: hidden; border: 0; background: #111113; box-shadow: none; isolation: isolate; }
.diaspora-globe-place { position: absolute; z-index: 2; right: 2%; bottom: -3%; color: #ffffff0a; font-size: clamp(110px, 17vw, 275px); font-weight: 790; letter-spacing: -.045em; line-height: 1; white-space: nowrap; pointer-events: none; }
.diaspora-map-caption { position: relative; z-index: 3; justify-content: center; padding: clamp(37px, 4.4vw, 70px); border-right: 0; background: linear-gradient(90deg, #111113 20%, #111113ee 80%, #11111300); color: #f5f3ee; }
.diaspora-map-caption::before { width: 35px; height: 3px; margin-bottom: 28px; background: #c34b49; }
.diaspora-map-caption > span:first-child { color: #d8afa0; font-size: 11px; letter-spacing: .17em; }
.diaspora-map-caption strong { max-width: 430px; color: #f5f3ee; font-size: clamp(50px, 4.4vw, 72px); font-weight: 720; letter-spacing: .02em; line-height: 1.01; }
.diaspora-map-caption > span:nth-child(3) { margin-top: 22px; color: #d3d0c9; font-size: clamp(16px, 1.35vw, 20px); }
.diaspora-map-caption a { border-top-color: #c34b49; color: #e7877c; }
.diaspora-map-caption a:hover { color: #ffb0a5; }
.diaspora-globe-key { color: #bdb9b2; }
.diaspora-globe-key i { border-color: #cda56b; background: #cda56b; }
.diaspora-globe-key span + span i { border-color: #d65d57; background: #d65d57; }
.diaspora-map-caption .diaspora-globe-scale, .diaspora-map-caption small { color: #aba7a1; }
.diaspora-globe-viewport { z-index: 1; background: radial-gradient(circle at 51% 50%, #2a2b2c 0, #17181a 43%, #111113 78%); }
.diaspora-globe-viewport::after { inset: 9% 11%; border-color: #ffffff21; }
.diaspora-globe-kicker, .diaspora-globe-hint { color: #d1cbc2; text-shadow: none; }
.diaspora-globe-hint span { color: #d65d57; }
.diaspora-globe-label { border-color: #777673; background: #17191be8; color: #eeeae1; box-shadow: none; }
.diaspora-globe-label--destination { border-color: #d65d57; color: #ffafa4; }
.diaspora-map-swipe { color: #5d5852; }
.diaspora-route-picker button { border-color: #c8c3bb; }
.diaspora-route-picker button[aria-pressed="true"] { color: #171719; }
.diaspora-route-picker button[aria-pressed="true"]::after, .diaspora-route-story > span, .diaspora-route-story a { color: #a53e43; }
.diaspora-route-story { border-color: #c8c3bb; }
.diaspora-route-story p { color: #41403d; }
.diaspora-work-data { border-color: #aa4448; }
.diaspora-work-bar::after { background: #a9484c; }

@media (max-width: 950px) {
  .diaspora-hero-v2 { grid-template-columns: 1fr; }
  .diaspora-hero-copy { min-height: 580px; padding: 70px var(--gutter); }
  .diaspora-hero-scenery { min-height: 320px; padding: 40px var(--gutter); border-left: 0; border-top: 1px solid #3a3839; }
  .diaspora-hero-scenery::before { top: -75%; right: -3%; width: 60%; }
  .diaspora-hero-scenery > div { padding-block: 12px; }
  .diaspora-hero-scenery strong { font-size: 27px; }
  .diaspora-globe-stage { grid-template-columns: minmax(255px, .4fr) minmax(0, .6fr); height: auto; min-height: 590px; }
  .diaspora-globe-viewport { min-height: 590px; }
}
@media (max-width: 650px) {
  .diaspora-page .site-crumbs { padding-block: 8px; }
  .diaspora-hero-v2 { min-height: 0; }
  .diaspora-hero-copy { min-height: 540px; justify-content: flex-start; padding: 52px var(--gutter) 35px; }
  .diaspora-page .diaspora-hero-copy h1 { margin-top: 48px; font-size: clamp(57px, 13.2vw, 78px); letter-spacing: .012em; }
  .diaspora-hero-copy > p:not(.diaspora-eyebrow) { margin-top: 30px; font-size: 18px; }
  .diaspora-hero-action { margin-top: 30px; font-size: 14px; }
  .diaspora-hero-action span { width: 50px; height: 50px; font-size: 27px; }
  .diaspora-hero-scenery { min-height: 360px; padding-block: 32px; }
  .diaspora-hero-scenery::before { top: -38%; right: -25%; width: 108%; }
  .diaspora-hero-scenery strong { font-size: clamp(22px, 6.5vw, 31px); }
  .diaspora-movement-head h2 { font-size: clamp(46px, 11vw, 66px); }
  .diaspora-globe-stage { display: flex; flex-direction: column; min-height: 0; }
  .diaspora-globe-place { display: none; }
  .diaspora-map-caption { min-height: 0; padding: 35px 25px 30px; border: 0; background: #111113; }
  .diaspora-map-caption::before { margin-bottom: 20px; }
  .diaspora-map-caption strong { font-size: clamp(40px, 10vw, 52px); }
  .diaspora-map-caption .diaspora-globe-scale { margin-top: 10px; }
  .diaspora-globe-viewport { min-height: 420px; }
  .diaspora-globe-viewport::after { inset: 7% 6%; }
}
@media (prefers-reduced-motion: reduce) {
  .diaspora-hero-action span { transition: none; }
}
