:root {
  --ink: #151710;
  --paper: #f2f0e9;
  --acid: #d8ff3e;
  --line: rgba(21, 23, 16, 0.2);
  --font-geist-sans: Arial;
  --font-geist-mono: "Courier New";
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }

body {
  margin: 0;
  background: var(--paper);
  color: var(--ink);
  font-family: var(--font-geist-sans), Arial, sans-serif;
  text-rendering: optimizeLegibility;
}

::selection { background: var(--acid); color: var(--ink); }
a { color: inherit; text-decoration: none; }
main { overflow: hidden; }

.nav {
  min-height: 84px;
  padding: 0 3.2vw;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 2rem;
  border-bottom: 1px solid var(--line);
}

.header-curiosity { font-size: 1.25rem; font-weight: 700; letter-spacing: -0.05em; }

.status {
  display: flex;
  align-items: center;
  gap: 0.55rem;
  font: 500 0.68rem/1 var(--font-geist-mono), monospace;
  text-transform: uppercase;
  letter-spacing: 0.08em;
}

.status i { width: 7px; height: 7px; background: #6d7900; border-radius: 50%; box-shadow: 0 0 0 5px rgba(109, 121, 0, .1); }
.status i.is-blinking { animation: status-blink .5s ease-in-out 1; }
@keyframes status-blink {
  0%, 100% { opacity: 1; transform: scale(1); }
  50% { opacity: .15; transform: scale(.75); }
}

.hero {
  min-height: calc(100vh - 84px);
  padding: 6vh 3.2vw 5vh;
  position: relative;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  border-bottom: 1px solid var(--line);
}

.hero h1 {
  position: relative;
  z-index: 1;
  max-width: 1100px;
  margin: 6vh 0;
  font-size: clamp(4.5rem, 10.8vw, 10rem);
  line-height: 0.78;
  letter-spacing: -0.085em;
  font-weight: 650;
}

.hero h1 em, blockquote em { font-family: Georgia, "Times New Roman", serif; font-weight: 400; }
.hero h1 em { color: transparent; -webkit-text-stroke: 1.5px var(--ink); }

.hero-bottom {
  position: relative;
  z-index: 2;
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 2rem;
}

.hero-bottom p { max-width: 390px; margin: 0; font-size: clamp(1.05rem, 1.35vw, 1.35rem); line-height: 1.35; letter-spacing: -0.03em; }

.primary-link {
  min-width: 290px;
  padding: 1.2rem 1.3rem;
  display: flex;
  justify-content: space-between;
  background: #f97316;
  border: 1px solid var(--ink);
  font: 600 0.78rem/1 var(--font-geist-mono), monospace;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  transition: background .2s ease, transform .2s ease, box-shadow .2s ease;
}

.primary-link:hover,
.primary-link:focus-visible {
  background: #ea580c;
  transform: translate(-4px, -4px);
  box-shadow: 4px 4px 0 var(--ink);
}

.orbit {
  position: absolute;
  right: 8vw;
  top: 16vh;
  width: clamp(200px, 29vw, 430px);
  aspect-ratio: 1;
  border: 1px solid var(--line);
  border-radius: 50%;
  animation: drift 9s ease-in-out infinite;
}

.orbit::before { content: ""; position: absolute; inset: 15%; border: 1px solid var(--line); border-radius: 50%; }
.orbit-label { position: absolute; top: 48%; left: -8%; z-index: 1; font: 700 clamp(.65rem, 1vw, .8rem)/1 var(--font-geist-mono), monospace; letter-spacing: .22em; }
.orbit-core {
  position: absolute;
  inset: 34%;
  z-index: 2;
  display: grid;
  place-items: center;
  background: #f97316;
  border: 1px solid var(--ink);
  border-radius: 50%;
  font-size: clamp(.8rem, 1.2vw, 1rem);
  animation: profile-pulse 4.8s ease-in-out infinite;
  transition: background .2s ease, transform .2s ease, box-shadow .2s ease;
}
.orbit-core:hover, .orbit-core:focus-visible { background: #ea580c; transform: scale(1.12); box-shadow: 0 0 0 8px rgba(249, 115, 22, .22); outline: none; }
@keyframes drift { 50% { transform: translateY(18px) rotate(4deg); } }
@keyframes profile-pulse {
  0%, 100% { box-shadow: 0 0 0 0 rgba(249, 115, 22, 0); }
  50% { box-shadow: 0 0 0 7px rgba(249, 115, 22, .16); }
}

.statement {
  padding: 14vh 10vw 12vh;
  border-bottom: 1px solid var(--line);
}

blockquote { margin: 0 auto; max-width: 1120px; font-size: clamp(3rem, 6.1vw, 6.8rem); line-height: .96; letter-spacing: -.07em; }
.statement .primary-link { width: max-content; margin: clamp(3rem, 6vh, 5rem) 0 0 auto; }

footer {
  padding: 2.2rem 3.2vw;
  display: flex;
  justify-content: center;
  text-align: center;
  font: 400 .78rem/1.3 var(--font-geist-mono), monospace;
  letter-spacing: .02em;
}

footer p { margin: 0; }
footer strong { font-weight: 700; }

@media (max-width: 800px) {
  .nav { min-height: 70px; }
  .header-curiosity { max-width: 55%; font-size: 1rem; line-height: 1.05; }
  .status { max-width: 42%; justify-content: flex-end; text-align: right; line-height: 1.25; }
  .hero { min-height: calc(100svh - 70px); padding-top: 4vh; }
  .hero h1 { font-size: clamp(4rem, 19vw, 7rem); margin: auto 0; }
  .hero-bottom { align-items: stretch; flex-direction: column; }
  .primary-link { min-width: 0; width: 100%; }
  .orbit { width: 52vw; top: 24%; right: -7vw; }
  .statement { padding: 10vh 5vw; display: block; }
  blockquote { margin-top: 3rem; font-size: clamp(3.1rem, 12vw, 5rem); }
  .statement .primary-link { width: 100%; }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  .orbit, .status i, .orbit-core { animation: none; }
  .primary-link { transition: none; }
}