:root {
  --ink: #102022;
  --ink-soft: #506063;
  --night: #0d1718;
  --night-soft: #172426;
  --paper: #f3efe4;
  --paper-bright: #fbfaf4;
  --line: rgba(16, 32, 34, .16);
  --coral: #f26b4d;
  --gold: #e8b44f;
  --aqua: #79c8bc;
  --sky: #8ebee5;
  --max: 1200px;
  --serif: Iowan Old Style, Baskerville, "Times New Roman", serif;
  --sans: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  --mono: "SFMono-Regular", Consolas, "Liberation Mono", monospace;
}

* { box-sizing: border-box; }

html { scroll-behavior: smooth; }

body {
  margin: 0;
  background: var(--paper);
  color: var(--ink);
  font-family: var(--sans);
  font-size: 16px;
  line-height: 1.6;
  -webkit-font-smoothing: antialiased;
}

body::before {
  content: "";
  position: fixed;
  inset: 0;
  pointer-events: none;
  z-index: 99;
  opacity: .045;
  background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 160 160' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.8'/%3E%3C/svg%3E");
}

a { color: inherit; }
button, a { -webkit-tap-highlight-color: transparent; }
button { font: inherit; }

.skip-link {
  position: fixed;
  left: 16px;
  top: -80px;
  z-index: 200;
  padding: 12px 16px;
  background: var(--paper-bright);
  color: var(--night);
  border-radius: 999px;
  transition: top .2s ease;
}

.skip-link:focus { top: 16px; }

:focus-visible {
  outline: 3px solid var(--gold);
  outline-offset: 4px;
}

.site-header {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  z-index: 20;
  display: flex;
  align-items: center;
  justify-content: space-between;
  width: min(calc(100% - 48px), var(--max));
  margin: 0 auto;
  padding: 24px 0;
  color: var(--paper-bright);
  border-bottom: 1px solid rgba(255,255,255,.16);
}

.wordmark {
  display: inline-flex;
  align-items: center;
  gap: 12px;
  text-decoration: none;
  font-size: 13px;
  font-weight: 700;
  letter-spacing: .08em;
  text-transform: uppercase;
}

.wordmark-mark {
  display: grid;
  place-items: center;
  width: 32px;
  height: 32px;
  border: 1px solid rgba(255,255,255,.48);
  border-radius: 50%;
  font-family: var(--serif);
  font-style: italic;
  letter-spacing: 0;
}

nav { display: flex; align-items: center; gap: 28px; }
nav a { font-size: 13px; text-decoration: none; color: rgba(255,255,255,.76); }
nav a:hover { color: #fff; }

.header-cta {
  padding: 10px 16px;
  border: 1px solid rgba(255,255,255,.36);
  border-radius: 999px;
}

.hero {
  position: relative;
  min-height: 100svh;
  overflow: hidden;
  display: grid;
  grid-template-columns: minmax(0, 1.12fr) minmax(340px, .88fr);
  gap: clamp(42px, 8vw, 110px);
  align-items: center;
  padding: 130px max(24px, calc((100vw - var(--max)) / 2)) 88px;
  background:
    radial-gradient(circle at 18% 12%, rgba(121,200,188,.11), transparent 33%),
    linear-gradient(135deg, #101e20 0%, #0b1415 58%, #11191a 100%);
  color: var(--paper-bright);
}

.hero::after {
  content: "";
  position: absolute;
  right: -10%;
  bottom: -34%;
  width: 680px;
  height: 680px;
  border: 1px solid rgba(255,255,255,.08);
  border-radius: 50%;
  box-shadow: 0 0 0 80px rgba(255,255,255,.025), 0 0 0 160px rgba(255,255,255,.015);
}

.hero-glow {
  position: absolute;
  width: 220px;
  height: 220px;
  border-radius: 50%;
  filter: blur(80px);
  opacity: .2;
  pointer-events: none;
}

.glow-one { top: 17%; left: 45%; background: var(--coral); }
.glow-two { right: 6%; bottom: 13%; background: var(--aqua); }

.hero-copy, .hero-visual { position: relative; z-index: 2; }

.eyebrow {
  display: flex;
  flex-wrap: wrap;
  gap: 12px 28px;
  margin-bottom: 28px;
  color: rgba(255,255,255,.62);
  font-family: var(--mono);
  font-size: 11px;
  letter-spacing: .14em;
  text-transform: uppercase;
}

.eyebrow span + span::before { content: "•"; margin-right: 28px; color: var(--coral); }
.eyebrow-production { display: inline-flex; align-items: center; gap: 11px; padding: 9px 13px; border: 1px solid rgba(121,200,188,.42); background: rgba(121,200,188,.07); color: var(--aqua); }
.eyebrow-production span + span::before { content: none; }
.eyebrow-production span:last-child { color: var(--paper-bright); }
.eyebrow-divider { opacity: .55; }

h1 {
  display: flex;
  align-items: baseline;
  gap: clamp(8px, 1.3vw, 20px);
  margin: 0 0 30px;
  font-family: var(--serif);
  font-size: clamp(64px, 8.8vw, 134px);
  font-weight: 400;
  line-height: .76;
  letter-spacing: -.07em;
}

h1 span { display: inline-block; }
.title-for { color: var(--gold); font-size: .44em; font-style: italic; letter-spacing: -.02em; }
.title-inspi { color: var(--coral); }

.hero-hook {
  max-width: 650px;
  margin: 0 0 20px;
  font-family: var(--serif);
  font-size: clamp(24px, 2.5vw, 36px);
  line-height: 1.15;
  letter-spacing: -.025em;
}

.hero-byline {
  margin: -10px 0 24px;
  color: rgba(255,255,255,.62);
  font-size: 14px;
  line-height: 1.5;
}

.hero-byline a {
  color: var(--aqua);
  text-decoration-color: rgba(121,200,188,.45);
  text-underline-offset: 3px;
}

.logline {
  max-width: 690px;
  margin: 0;
  color: rgba(255,255,255,.68);
  font-size: clamp(15px, 1.25vw, 18px);
  line-height: 1.7;
}

.hero-actions { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 34px; }

.button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 18px;
  min-height: 51px;
  padding: 0 23px;
  border: 1px solid transparent;
  border-radius: 999px;
  cursor: pointer;
  text-decoration: none;
  font-weight: 650;
  transition: transform .2s ease, background-color .2s ease, border-color .2s ease;
}

.button:hover { transform: translateY(-2px); }
.button-primary { background: var(--coral); color: #161615; }
.button-primary:hover { background: #ff8467; }
.button-secondary { border-color: rgba(255,255,255,.24); background: transparent; color: rgba(255,255,255,.78); }
.button-secondary:hover { border-color: rgba(255,255,255,.7); color: #fff; }

.hero-facts {
  display: flex;
  flex-wrap: wrap;
  gap: 9px;
  margin-top: 38px;
}

.hero-facts span {
  padding: 7px 11px;
  border: 1px solid rgba(255,255,255,.14);
  border-radius: 999px;
  color: rgba(255,255,255,.56);
  font-family: var(--mono);
  font-size: 10px;
  letter-spacing: .06em;
  text-transform: uppercase;
}

.hero-visual { display: grid; place-items: center; min-width: 0; }

.poster-shell {
  position: relative;
  width: min(100%, 405px);
  aspect-ratio: .695;
  padding: 11px;
  border: 1px solid rgba(255,255,255,.16);
  background: rgba(255,255,255,.035);
  box-shadow: 0 40px 90px rgba(0,0,0,.44);
  transform: rotate(1.2deg);
}

.poster, .poster-fallback { width: 100%; height: 100%; object-fit: cover; }
.poster { position: relative; z-index: 2; background: #182426; }

.poster-fallback {
  position: absolute;
  inset: 11px;
  width: auto;
  height: auto;
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  padding: 30px;
  overflow: hidden;
  background:
    radial-gradient(circle at 70% 21%, rgba(232,180,79,.9) 0 2%, transparent 3%),
    radial-gradient(circle at 28% 28%, rgba(121,200,188,.65), transparent 24%),
    radial-gradient(circle at 71% 67%, rgba(242,107,77,.45), transparent 30%),
    #132123;
  font-family: var(--serif);
  line-height: .82;
}

.poster-fallback::before {
  content: "";
  position: absolute;
  inset: 7% 9%;
  border: 1px solid rgba(255,255,255,.18);
  border-radius: 50% 44% 51% 46%;
  transform: rotate(-11deg);
}

.poster-fallback span { font-size: clamp(42px, 6vw, 68px); }
.poster-fallback em { color: var(--gold); font-size: 27px; font-weight: 400; }
.poster-fallback strong { color: var(--coral); font-size: clamp(55px, 7vw, 86px); font-weight: 400; }

.poster-caption {
  position: absolute;
  z-index: 3;
  left: 28px;
  right: 28px;
  bottom: -28px;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  min-height: 52px;
  padding: 8px 18px;
  background: var(--paper-bright);
  color: var(--night);
  box-shadow: 0 18px 36px rgba(0,0,0,.28);
  font-family: var(--mono);
  font-size: 11px;
  letter-spacing: .08em;
  text-transform: uppercase;
}

.poster-caption i { font-family: var(--serif); font-size: 17px; letter-spacing: 0; text-transform: none; color: var(--coral); }

.scroll-cue {
  position: absolute;
  z-index: 3;
  left: max(24px, calc((100vw - var(--max)) / 2));
  bottom: 28px;
  display: flex;
  align-items: center;
  gap: 20px;
  color: rgba(255,255,255,.48);
  font-family: var(--mono);
  font-size: 10px;
  letter-spacing: .13em;
  text-decoration: none;
  text-transform: uppercase;
}

.story-section, .world-section, .project-section {
  padding: clamp(86px, 10vw, 150px) max(24px, calc((100vw - var(--max)) / 2));
}

.section-heading {
  display: grid;
  grid-template-columns: 160px minmax(0, 1.35fr) minmax(250px, .65fr);
  gap: clamp(24px, 5vw, 70px);
  align-items: end;
  margin-bottom: 72px;
}

.section-number, .card-label, .story-kicker, .format-label {
  margin: 0;
  color: var(--ink-soft);
  font-family: var(--mono);
  font-size: 10px;
  font-weight: 600;
  letter-spacing: .12em;
  text-transform: uppercase;
}

.section-heading h2, .contact-panel h2 {
  margin: 0;
  font-family: var(--serif);
  font-size: clamp(44px, 5vw, 76px);
  font-weight: 400;
  line-height: .98;
  letter-spacing: -.045em;
}

.section-heading h2 em { color: var(--coral); font-weight: 400; }
.section-heading > p:last-child { max-width: 390px; margin: 0; color: var(--ink-soft); }

.story-path {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  border-top: 1px solid var(--line);
  border-left: 1px solid var(--line);
  background: var(--paper-bright);
}

.story-beat {
  position: relative;
  min-height: 330px;
  padding: clamp(32px, 4vw, 54px);
  border-right: 1px solid var(--line);
  border-bottom: 1px solid var(--line);
}

.story-beat:nth-child(2), .story-beat:nth-child(3) { background: #eee9dc; }
.story-index { margin: 0 0 44px; color: var(--coral); font-family: var(--serif); font-size: 18px; }
.story-beat h3 { margin: 12px 0 18px; font-family: var(--serif); font-size: clamp(32px, 3.2vw, 48px); font-weight: 400; line-height: 1.04; letter-spacing: -.035em; }
.story-beat > p:last-child { max-width: 490px; margin: 0; color: var(--ink-soft); }

.short-pitch { margin-top: 18px; border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); }
.short-pitch summary { display: flex; align-items: center; justify-content: space-between; padding: 29px 0; cursor: pointer; list-style: none; font-family: var(--serif); font-size: clamp(21px, 2.2vw, 29px); line-height: 1; letter-spacing: -.025em; }
.short-pitch summary::-webkit-details-marker { display: none; }
.short-pitch[open] summary span:last-child { transform: rotate(45deg); }
.short-pitch summary span:last-child { color: var(--coral); font-family: var(--mono); font-size: 22px; font-weight: 400; transition: transform .2s ease; }
.short-pitch-copy { display: grid; grid-template-columns: repeat(3, 1fr); gap: clamp(24px, 4vw, 64px); padding: 4px 0 42px; }
.short-pitch-copy p { margin: 0; color: var(--ink-soft); }

.world-section {
  display: flex;
  min-height: 100svh;
  flex-direction: column;
  justify-content: center;
  padding: clamp(38px, 5vw, 70px) max(24px, calc((100vw - var(--max)) / 2));
  overflow: hidden;
  background:
    radial-gradient(circle at 40% 49%, rgba(121,200,188,.09), transparent 24%),
    radial-gradient(circle at 37% 49%, rgba(242,107,77,.05), transparent 48%),
    #0a1314;
  color: var(--paper-bright);
}

.section-heading-world .section-number { color: rgba(255,255,255,.46); }
.section-heading-world h2 em { color: var(--gold); }
.section-heading-world > p:last-child { color: rgba(255,255,255,.58); }
.section-heading-world { margin-bottom: clamp(22px, 3vw, 42px); }

.world-explorer {
  display: grid;
  grid-template-columns: minmax(0, .92fr) minmax(410px, 1.08fr);
  gap: clamp(32px, 4vw, 64px);
  align-items: center;
}

.world-map {
  --inner-diameter: 12.8rem;
  --middle-diameter: 21.6rem;
  --outer-diameter: 30rem;
  --inner-radius: 6.4rem;
  --middle-radius: 10.8rem;
  --outer-radius: 15rem;
  position: relative;
  width: min(100%, 33rem);
  aspect-ratio: 1;
  margin-inline: auto;
}

.world-orbit {
  position: absolute;
  left: 50%;
  top: 50%;
  border: 1px solid rgba(255,255,255,.12);
  border-radius: 50%;
  transform: translate(-50%, -50%);
}

.world-orbit-inner { width: var(--inner-diameter); height: var(--inner-diameter); }
.world-orbit-middle { width: var(--middle-diameter); height: var(--middle-diameter); }
.world-orbit-outer { width: var(--outer-diameter); height: var(--outer-diameter); }

.world-core {
  position: absolute;
  z-index: 4;
  left: 50%;
  top: 50%;
  display: grid;
  width: 8rem;
  height: 8rem;
  place-items: center;
  transform: translate(-50%, -50%);
  border: 1px solid rgba(255,255,255,.35);
  border-radius: 50%;
  background: rgba(16,32,34,.88);
  color: var(--paper-bright);
  font-family: var(--serif);
  font-size: 17px;
  line-height: .96;
  text-align: center;
}

.core-light {
  position: absolute;
  inset: 19%;
  z-index: -1;
  border-radius: 50%;
  background: var(--coral);
  filter: blur(20px);
  opacity: .48;
  transition: opacity .2s ease, transform .2s ease;
}

.world-core .core-light { opacity: .72; transform: scale(1.1); }

.orbiter {
  position: absolute;
  z-index: 3;
  left: 50%;
  top: 50%;
  width: 0;
  height: 0;
  animation: world-orbit var(--duration) linear infinite;
  animation-delay: var(--delay);
}

.orbiter .world-node {
  position: absolute;
  display: flex;
  align-items: center;
  gap: 9px;
  width: max-content;
  min-height: 32px;
  padding: 4px 8px;
  transform: translateX(var(--radius));
  border: 0;
  background: transparent;
  color: rgba(255,255,255,.7);
  cursor: pointer;
  font-family: var(--mono);
  font-size: 12px;
}

.node-dot {
  flex: 0 0 auto;
  width: 10px;
  height: 10px;
  border-radius: 50%;
  background: var(--node-color);
  box-shadow: 0 0 0 5px color-mix(in srgb, var(--node-color) 14%, transparent), 0 0 18px color-mix(in srgb, var(--node-color) 45%, transparent);
}

.node-label { padding: 2px 5px; background: rgba(10,19,20,.78); }
.orbiter .node-label { animation: counter-orbit var(--duration) linear infinite; animation-delay: var(--delay); }
.world-node:hover, .world-node:focus-visible, .world-node.is-active { color: #fff; }
.world-node:hover .node-dot, .world-node:focus-visible .node-dot, .world-node.is-active .node-dot { transform: scale(1.45); }
.world-map:has(.world-node:hover) .orbiter, .world-map:focus-within .orbiter,
.world-map:has(.world-node:hover) .node-label,
.world-map:focus-within .node-label { animation-play-state: paused; }

.character-panel {
  min-height: 430px;
  padding: clamp(32px, 3.2vw, 48px);
  border-top: 1px solid rgba(255,255,255,.2);
  border-bottom: 1px solid rgba(255,255,255,.2);
}

.character-kind { margin: 0 0 20px; color: var(--aqua); font-family: var(--mono); font-size: 12px; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; }
.character-panel h3 { margin: 0 0 24px; font-family: var(--serif); font-size: clamp(42px, 4.5vw, 67px); font-weight: 400; line-height: 1; letter-spacing: -.045em; }
.character-one-line { margin: 0 0 24px; color: var(--paper-bright); font-family: var(--serif); font-size: 21px; line-height: 1.3; }
.character-panel > p:not(.character-kind):not(.character-one-line):not(.world-instruction) { color: rgba(255,255,255,.62); }
.world-instruction { margin: 36px 0 0; color: rgba(255,255,255,.36); font-family: var(--mono); font-size: 11px; }
.mobile-character-grid { display: none; }

@keyframes world-orbit { to { transform: rotate(360deg); } }
@keyframes counter-orbit { to { transform: rotate(-360deg); } }

.project-section { background: var(--night); color: var(--paper-bright); }
#project { padding-block: 30px; }
.section-heading-light .section-number { color: rgba(255,255,255,.44); }
.section-heading-light h2 em { color: var(--aqua); }
.section-heading-light > p:last-child { color: rgba(255,255,255,.58); }

.format-comparison { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); border-top: 1px solid rgba(255,255,255,.16); border-left: 1px solid rgba(255,255,255,.16); }
.format-card { position: relative; min-height: 520px; padding: clamp(34px, 5vw, 65px); border-right: 1px solid rgba(255,255,255,.16); border-bottom: 1px solid rgba(255,255,255,.16); }
.format-animation { background: rgba(121,200,188,.05); }
.format-live { background: rgba(242,107,77,.045); }
.format-number { position: absolute; top: 42px; right: 45px; margin: 0; color: rgba(255,255,255,.12); font-family: var(--serif); font-size: 68px; line-height: 1; }
.format-card .format-label { color: var(--aqua); font-size: 12px; }
.format-live .format-label { color: var(--coral); }
.format-card h3 { max-width: 490px; margin: 40px 0 22px; font-family: var(--serif); font-size: clamp(35px, 3.5vw, 51px); font-weight: 400; line-height: 1.04; letter-spacing: -.04em; }
.format-card > p:not(.format-number):not(.format-label) { max-width: 520px; margin: 0; color: rgba(255,255,255,.62); }
.format-card ul { margin: 35px 0 0; padding: 0; list-style: none; }
.format-card li { position: relative; padding: 13px 0 13px 25px; border-top: 1px solid rgba(255,255,255,.12); color: rgba(255,255,255,.78); font-size: 14px; }
.format-card li::before { content: "•"; position: absolute; left: 0; color: var(--aqua); }
.format-live li::before { color: var(--coral); }
.format-bridge { grid-column: 1 / -1; margin: 0; padding: 26px 32px; border-right: 1px solid rgba(255,255,255,.16); border-bottom: 1px solid rgba(255,255,255,.16); color: rgba(255,255,255,.64); text-align: center; }
.format-bridge span { margin-right: 14px; color: var(--gold); font-family: var(--mono); font-size: 11px; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; }

.project-grid { display: grid; grid-template-columns: 1.18fr .82fr; gap: 16px; margin-top: 0; }
.project-card { min-height: 270px; padding: 31px; border: 1px solid rgba(255,255,255,.15); background: rgba(255,255,255,.025); }
.project-card-feature { background: var(--coral); color: var(--night); }
.project-card-feature .card-label { color: rgba(13,23,24,.62); }
.project-card blockquote { margin: 38px 0 28px; font-family: var(--serif); font-size: clamp(27px, 2.6vw, 39px); line-height: 1.08; letter-spacing: -.03em; }
.project-card > p:last-child { margin: 0; color: rgba(255,255,255,.58); }
.project-card-feature > p:last-child { color: rgba(13,23,24,.68); }
.project-card .card-label { color: rgba(255,255,255,.4); }
.project-card dl { margin: 24px 0 0; }
.project-card dl div { display: flex; justify-content: space-between; gap: 16px; padding: 10px 0; border-bottom: 1px solid rgba(255,255,255,.12); }
.project-card dt { color: rgba(255,255,255,.45); }
.project-card dd { margin: 0; text-align: right; }
.available { color: var(--aqua); }
.project-card-status { grid-column: 1 / -1; min-height: 0; padding: 19px 24px; }
.project-card-status dl { display: grid; grid-template-columns: repeat(3, 1fr); gap: 0 24px; margin-top: 12px; }
.project-card-status dl div { display: block; }
.project-card-status dd { margin-top: 5px; text-align: left; color: rgba(255,255,255,.84); }
.project-card-wide { grid-column: 1 / -1; display: grid; grid-template-columns: .72fr 1.48fr auto; gap: 30px 48px; align-items: center; min-height: 0; }
.project-card-wide h3 { margin: 8px 0 0; font-family: var(--serif); font-size: 38px; font-weight: 400; }
.project-card-wide > p { max-width: 690px; margin: 0; color: rgba(255,255,255,.64); }
.project-card-wide > p em { color: rgba(255,255,255,.88); }
.project-card-wide a { display: inline-flex; align-items: center; min-height: 38px; padding: 0 14px; border: 1px solid rgba(121,200,188,.65); color: var(--aqua); font-size: 13px; font-weight: 650; text-decoration: none; transition: background .2s ease, color .2s ease; }
.project-card-wide a:hover { background: var(--aqua); color: var(--night); }
.writer-profile { display: flex; align-items: center; gap: 17px; }
.writer-photo { width: 80px; height: 100px; object-fit: cover; object-position: center top; border: 1px solid rgba(255,255,255,.15); }
.writer-links { display: flex; flex-direction: column; gap: 11px; align-items: flex-start; }

.writer-section { padding: clamp(58px, 8vw, 118px) max(24px, calc((100vw - var(--max)) / 2)); background: #eee9dc; color: var(--ink); }
.writer-section-inner { display: grid; grid-template-columns: minmax(220px, .72fr) minmax(0, 1.48fr) auto; gap: 30px 48px; align-items: center; }
.writer-section h2 { margin: 8px 0 0; font-family: var(--serif); font-size: 38px; font-weight: 400; }
.writer-section > .writer-section-inner > p { max-width: 690px; margin: 0; color: var(--ink-soft); }
.writer-section .writer-photo { border-color: rgba(13,23,24,.16); }
.writer-section .card-label { color: var(--ink-soft); }
.writer-section a { display: inline-flex; align-items: center; min-height: 38px; padding: 0 14px; border: 1px solid rgba(23,93,83,.7); color: #175d53; font-size: 13px; font-weight: 650; text-decoration: none; transition: background .2s ease, color .2s ease; }
.writer-section a:hover { background: #175d53; color: var(--paper-bright); }

.contact-panel {
  margin-top: 120px;
  padding: clamp(48px, 8vw, 100px);
  background: var(--paper-bright);
  color: var(--ink);
}
.contact-panel h2 { max-width: 850px; margin-top: 19px; }
.contact-panel > p:not(.section-number) { max-width: 600px; margin: 24px 0 0; color: var(--ink-soft); font-size: 17px; }
.button-light { margin-top: 32px; background: var(--night); color: #fff; }
.button-light:hover { background: #203537; }
.representation { display: grid; grid-template-columns: repeat(2, 1fr); gap: 26px; margin-top: 78px; padding-top: 27px; border-top: 1px solid var(--line); }
.representation div { display: flex; flex-direction: column; gap: 4px; }
.representation span { color: var(--ink-soft); font-family: var(--mono); font-size: 9px; letter-spacing: .08em; text-transform: uppercase; }
.representation strong, .representation a { font-size: 13px; font-weight: 650; text-decoration: none; }

footer { display: flex; justify-content: space-between; gap: 20px; padding: 24px max(24px, calc((100vw - var(--max)) / 2)); background: #071011; color: rgba(255,255,255,.35); font-family: var(--mono); font-size: 9px; letter-spacing: .06em; text-transform: uppercase; }

.request-dialog {
  width: min(860px, calc(100% - 32px));
  max-width: none;
  max-height: calc(100dvh - 32px);
  padding: 0;
  overflow: auto;
  border: 1px solid rgba(255,255,255,.22);
  background: var(--night);
  color: var(--paper-bright);
  box-shadow: 0 36px 110px rgba(0,0,0,.5);
}

.request-dialog::backdrop { background: rgba(3,10,11,.78); backdrop-filter: blur(9px); }
.request-dialog-inner { display: grid; grid-template-columns: minmax(0, .78fr) minmax(0, 1.22fr); min-height: 600px; }
.request-art { position: relative; padding: 38px; background: #080f11 url("assets/looking-for-inspi-poster.jpg") center / contain no-repeat; }
.request-art::after { content: ""; position: absolute; inset: 17px; border: 1px solid rgba(255,255,255,.28); pointer-events: none; }
.request-art-mark { position: relative; z-index: 1; display: grid; place-items: center; width: 38px; height: 38px; border: 1px solid rgba(255,255,255,.6); border-radius: 50%; background: rgba(7,16,17,.78); font: italic 21px var(--serif); }
.request-content { position: relative; padding: clamp(34px, 5vw, 62px); }
.request-close { position: absolute; top: 19px; right: 22px; display: grid; place-items: center; width: 38px; height: 38px; border: 1px solid rgba(255,255,255,.22); border-radius: 50%; background: transparent; color: var(--paper-bright); cursor: pointer; font: 27px/1 var(--serif); }
.request-close:hover { border-color: var(--aqua); color: var(--aqua); }
.request-overline { margin: 0 0 15px; color: var(--aqua); font: 600 10px var(--mono); letter-spacing: .17em; text-transform: uppercase; }
.request-content h2 { margin: 0; font: 400 clamp(52px, 6vw, 76px)/.95 var(--serif); letter-spacing: -.04em; }
.request-content h2 em { color: var(--coral); font-weight: 400; }
.request-content form { margin-top: 32px; }
.request-fields { display: grid; gap: 9px; }
.request-fields label { display: flex; justify-content: space-between; margin-top: 8px; color: rgba(255,255,255,.84); font: 600 11px var(--mono); letter-spacing: .03em; }
.request-fields label > span:not(.request-optional) { color: var(--coral); }
.request-optional { color: rgba(255,255,255,.4); font-weight: 400; }
.request-fields input, .request-fields textarea { width: 100%; min-height: 48px; padding: 11px 14px; border: 1px solid rgba(255,255,255,.2); border-radius: 0; background: rgba(255,255,255,.05); color: var(--paper-bright); font: 14px var(--sans); caret-color: var(--aqua); }
.request-fields textarea { min-height: 90px; resize: vertical; }
.request-fields input:hover, .request-fields textarea:hover { border-color: rgba(255,255,255,.42); }
.request-fields input:focus, .request-fields textarea:focus { border-color: var(--aqua); outline: 2px solid var(--aqua); outline-offset: 2px; }
.request-fields textarea::placeholder { color: rgba(255,255,255,.46); }
.request-honeypot { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); }
.request-status { min-height: 22px; margin: 13px 0 8px; color: #ffb39f; font-size: 12px; line-height: 1.4; }
.request-submit { width: 100%; justify-content: space-between; border-radius: 0; background: var(--coral); color: #161615; }
.request-submit:hover { background: #ff8467; }
.request-submit:disabled { cursor: wait; opacity: .65; transform: none; }
.request-privacy, .request-fallback { margin: 14px 0 0; color: rgba(255,255,255,.56); font-size: 11px; line-height: 1.5; }
.request-fallback a { color: var(--aqua); text-underline-offset: 3px; }
.request-success { margin-top: 80px; padding-top: 22px; border-top: 1px solid rgba(255,255,255,.22); }
.request-success p { margin: 0 0 8px; font: 34px/1.1 var(--serif); }
.request-success span { color: rgba(255,255,255,.65); font-size: 14px; }

.toast {
  position: fixed;
  z-index: 150;
  left: 50%;
  bottom: 24px;
  padding: 11px 16px;
  border-radius: 999px;
  background: var(--paper-bright);
  color: var(--ink);
  box-shadow: 0 15px 50px rgba(0,0,0,.3);
  font-size: 13px;
  opacity: 0;
  pointer-events: none;
  transform: translate(-50%, 12px);
  transition: opacity .2s ease, transform .2s ease;
}
.toast.is-visible { opacity: 1; transform: translate(-50%, 0); }

.reveal { opacity: 0; transform: translateY(18px); transition: opacity .7s ease var(--delay, 0s), transform .7s ease var(--delay, 0s); }
.reveal.is-visible { opacity: 1; transform: translateY(0); }

@media (max-width: 980px) {
  nav > a:not(.header-cta) { display: none; }
  .hero { grid-template-columns: 1fr; min-height: auto; padding-top: 145px; padding-bottom: 120px; }
  .hero-copy { max-width: 780px; }
  .hero-visual { width: min(72vw, 440px); margin: 36px auto 0; }
  .section-heading { grid-template-columns: 120px 1fr; }
  .section-heading > p:last-child { grid-column: 2; }
  .short-pitch-copy { grid-template-columns: 1fr 1fr; }
  .world-explorer { grid-template-columns: 1fr; }
  .world-section { min-height: 0; }
  .world-map { width: min(100%, 33rem); }
  .character-panel { min-height: 0; }
  .project-card-wide { grid-template-columns: 1fr 2fr; }
  .writer-section-inner { grid-template-columns: 1fr 2fr; }
  .writer-section .writer-links { grid-column: 2; }
  .writer-links { grid-column: 2; }
  .representation { grid-template-columns: 1fr 1fr; }
}

@media (max-width: 760px) {
  .world-map {
    --inner-diameter: 8.4rem;
    --middle-diameter: 14.4rem;
    --outer-diameter: 20rem;
    --inner-radius: 4.2rem;
    --middle-radius: 7.2rem;
    --outer-radius: 10rem;
    width: min(100%, 22rem);
  }
  .world-core { width: 5.8rem; height: 5.8rem; font-size: 13px; }
  .orbiter .world-node { gap: 3px; padding: 2px 3px; font-size: 9px; }
  .node-dot { width: 7px; height: 7px; box-shadow: 0 0 0 3px color-mix(in srgb, var(--node-color) 14%, transparent), 0 0 12px color-mix(in srgb, var(--node-color) 45%, transparent); }
  .node-label { padding: 1px 2px; }
  .mobile-character-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; margin-top: 18px; }
  .mobile-character-grid button { min-height: 43px; padding: 8px 12px; border: 1px solid rgba(255,255,255,.17); background: rgba(255,255,255,.035); color: rgba(255,255,255,.72); font: 12px var(--mono); text-align: left; }
  .mobile-character-grid button.is-active { border-color: var(--aqua); color: var(--aqua); background: rgba(121,200,188,.1); }
  .world-instruction { display: none; }
}

@media (max-width: 680px) {
  .request-dialog { width: calc(100% - 20px); max-height: calc(100dvh - 20px); }
  .request-dialog-inner { grid-template-columns: 1fr; }
  .request-art { min-height: 105px; padding: 20px 24px; background-size: cover; background-position: center 43%; }
  .request-art::after { inset: 9px; }
  .request-art-mark { width: 30px; height: 30px; font-size: 17px; }
  .request-content { padding: 28px 26px 32px; }
  .request-close { top: 22px; right: 22px; }
  .request-content h2 { font-size: 52px; }
  .request-content form { margin-top: 24px; }
  .site-header { width: calc(100% - 36px); padding-top: 18px; }
  .wordmark > span:last-child { display: none; }
  .header-cta { padding: 9px 13px; }
  .hero { padding-inline: 18px; }
  h1 { flex-wrap: wrap; font-size: clamp(64px, 22vw, 96px); }
  h1 .title-for { margin-right: auto; }
  .hero-visual { width: min(88vw, 390px); }
  .scroll-cue { left: 18px; }
  .story-section, .world-section, .project-section { padding-inline: 18px; }
  .section-heading, .section-heading-light { grid-template-columns: 1fr; gap: 16px; margin-bottom: 45px; }
  .section-heading > p:last-child { grid-column: 1; }
  .story-path { grid-template-columns: 1fr; }
  .story-beat { min-height: 0; }
  .story-beat:nth-child(2), .story-beat:nth-child(3) { background: var(--paper-bright); }
  .story-beat:nth-child(even) { background: #eee9dc; }
  .short-pitch-copy { grid-template-columns: 1fr; }
  .format-comparison { grid-template-columns: 1fr; }
  .format-card { min-height: 0; }
  .format-bridge { grid-column: 1; text-align: left; }
  .format-bridge span { display: block; margin: 0 0 7px; }
  .project-grid { grid-template-columns: 1fr; }
  .project-card-feature, .project-card-wide { grid-column: auto; }
  .project-card-wide { grid-template-columns: 1fr; }
  .project-card-status dl { grid-template-columns: 1fr 1fr; }
  .writer-section-inner { grid-template-columns: 1fr; }
  .writer-section .writer-links { grid-column: 1; }
  .writer-links { grid-column: 1; }
  .contact-panel { margin-top: 80px; }
  .representation { grid-template-columns: 1fr; margin-top: 54px; }
  footer { flex-direction: column; }
}

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