/* Ariamehr AI / ink, lime, cobalt, and daylight */
:root {
  --ink: #171914;
  --cream: #f8f7f0;
  --paper: #eaf0fb;
  --muted: #5d665b;
  --line: #cbd0c4;
  --acid: #d8fd55;
  --red: #2849e7;
  --blue: #2849e7;
  --lime: #d8fd55;
}

body { background: var(--cream); }
::selection { background: var(--lime); color: var(--ink); }
button:focus-visible, a:focus-visible { outline-color: var(--blue); }
.skip-link { background: var(--blue); color: #fff; }

/* The light hero lets the orbit belong to the page, rather than to a tile. */
.site-header { background: var(--cream); border-bottom-color: var(--line); }
.brand-mark { border-color: var(--ink); color: var(--ink); }
.brand-mark i { background: var(--blue); }
.brand-wordmark span { color: var(--blue); }
.desktop-nav a:hover { color: var(--blue); opacity: 1; }
.header-contact { border-color: var(--blue); color: var(--blue); }
.header-contact:hover { background: var(--blue); color: #fff; }
.mobile-menu { background: var(--cream); border-bottom-color: var(--blue); }

.hero {
  background: var(--cream);
  color: var(--ink);
  min-height: min(850px, calc(100svh - 84px));
  overflow: hidden;
}
.hero-grid {
  background-image: linear-gradient(to right, rgba(40,73,231,.07) 1px, transparent 1px), linear-gradient(to bottom, rgba(40,73,231,.07) 1px, transparent 1px);
  mask-image: linear-gradient(90deg, transparent 8%, #000 82%);
}
.hero-topline, .hero-footer { color: #535f55; }
.status-dot { background: var(--blue); box-shadow: 0 0 0 5px rgba(40,73,231,.12); }
.hero-layout { grid-template-columns: minmax(0,1.12fr) minmax(390px,.88fr); gap: 0; }
.hero h1 { font-size: clamp(67px, 8.3vw, 150px); }
.hero h1 em { color: var(--blue); }
.hero-period { color: var(--ink); }
.hero-copy p { color: #3f4b43; max-width: 490px; }
.button-accent { background: var(--blue); color: #fff; }
.button:hover, .button-accent:hover { background: #173aca; color: #fff; }
.light-link { color: var(--ink); }
.hero-art {
  width: min(100%, 610px);
  aspect-ratio: 1;
  transform: translate(5%,0);
  background: transparent;
  color: var(--ink);
  box-shadow: none;
}
.hero-art::before, .hero-art::after { content: none; }
.orbit { z-index: 1; border-color: rgba(40,73,231,.42); box-shadow: none; }
.orbit-one { border-color: rgba(23,25,20,.82); }
.orbit-two { border-color: rgba(40,73,231,.8); animation-duration: 43s; opacity: .8; }
.orbit-two::after {
  content: '';
  position: absolute;
  top: 14%; right: 11%;
  width: 8px; height: 8px;
  border-radius: 50%;
  background: var(--blue);
  box-shadow: 0 0 0 5px var(--cream);
}
.orbit-three {
  border-top-color: transparent;
  border-bottom-color: rgba(40,73,231,.28);
  opacity: .8;
  animation: orbit-reverse 76s linear infinite;
}
.orbit-three:before, .orbit-four:after { background: var(--blue); box-shadow: 0 0 0 4px var(--cream); }
.orbit-four { border-color: rgba(40,73,231,.4); opacity: .36; }
.orbit-five {
  width: 96%; height: 96%;
  border: 1px solid transparent;
  border-top-color: rgba(23,25,20,.65);
  border-left-color: rgba(40,73,231,.25);
  opacity: .75;
  animation: rotate 31s linear infinite;
}
.orbit-ticks {
  position: absolute;
  left: 50%; top: 50%;
  width: 112%; aspect-ratio: 1;
  border-radius: 50%;
  z-index: 1;
  opacity: .23;
  background: repeating-conic-gradient(from 0deg, var(--blue) 0 1deg, transparent 1deg 15deg);
  -webkit-mask: radial-gradient(closest-side, transparent calc(100% - 2px), #000 calc(100% - 1px));
  mask: radial-gradient(closest-side, transparent calc(100% - 2px), #000 calc(100% - 1px));
  animation: orbit-reverse 100s linear infinite;
}
.orbit-sweep {
  position: absolute;
  left: 50%; top: 50%;
  width: 82%; aspect-ratio: 1;
  z-index: 1;
  border-radius: 50%;
  opacity: .38;
  background: conic-gradient(from 20deg, transparent 0deg, rgba(40,73,231,.15) 30deg, transparent 66deg 360deg);
  animation: rotate 22s linear infinite;
}
.axis { z-index: 1; background: rgba(40,73,231,.22); }
.orbit-core {
  z-index: 3;
  background: var(--lime);
  box-shadow: 0 0 0 9px rgba(216,253,85,.18), 0 0 68px rgba(216,253,85,.24);
  animation: core-breathe 6s ease-in-out infinite;
}
.core-a { color: var(--ink); }
.core-dot { background: var(--blue); }
.art-label, .art-coordinate { z-index: 4; background: var(--cream); }
.art-label { color: var(--ink); }
.art-coordinate { color: #56635d; }
.art-label-top { top: 11%; right: 1%; }
.art-label-bottom { bottom: 7%; left: 5%; }
.coordinate-one { left: 12%; top: 27%; }
.coordinate-two { right: 1%; bottom: 29%; }
@keyframes orbit-reverse { to { transform: translate(-50%, -50%) rotate(-360deg); } }
@keyframes core-breathe { 50% { box-shadow: 0 0 0 15px rgba(216,253,85,.11), 0 0 84px rgba(216,253,85,.33); } }
.hero-footer { border-top-color: var(--line); }
.scroll-line { background: var(--blue); }

/* Restrained color in the reading sections; strong color at decisions. */
.mini-square { background: var(--blue); }
h2 em { color: var(--blue); }
.intro { background: var(--cream); }
.service { border-bottom-color: var(--line); }
.service:hover { background: #eef1e4; }
.service-number { color: var(--blue); }
.service p { color: #4e584f; }
.work { background: var(--paper); }
.work-intro h2 em { color: var(--blue); }
.work-note { color: #586258; }
.project-list { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 28px; }
.project-visual { height: clamp(310px, 29vw, 410px); }
.project-type { color: var(--blue); }
.project-visual { background: var(--blue); }
.project-visual:after { border-color: rgba(23,35,63,.12); }

.research-visual { background: #dbe4ff; color: var(--ink); }
.research-visual:before, .speech-visual:before {
  background-image: linear-gradient(90deg, rgba(40,73,231,.1) 1px, transparent 1px), linear-gradient(rgba(40,73,231,.1) 1px, transparent 1px);
  opacity: 1;
}
.market-board {
  width: 85%;
  min-height: 57%;
  background: var(--cream);
  border: 2px solid var(--blue);
  box-shadow: 12px 12px 0 var(--lime);
}
.market-board-head { border-bottom-color: var(--blue); color: var(--blue); padding: 12px 14px; font-size: 7px; }
.market-board-main { padding: 22px 18px 12px; }
.market-board-label { color: #5e6b88; }
.market-board strong { color: var(--ink); font-size: clamp(43px, 4.6vw, 70px); }
.market-board strong span { color: var(--blue); }
.market-board-steps { border-top-color: var(--blue); padding: 13px 12px; gap: 7px; font-size: 8px; }
.market-board-steps span { gap: 4px; }
.market-board-steps b { color: var(--blue); }
.voice-visual { background: var(--ink); color: #fff; }
.voice-visual:before {
  background-image: linear-gradient(90deg, rgba(255,255,255,.14) 1px, transparent 1px), linear-gradient(rgba(255,255,255,.14) 1px, transparent 1px);
}
.waveform:before, .waveform:after { background: rgba(255,255,255,.35); }
.waveform i { background: var(--lime); box-shadow: none; }
.speech-visual { background: #dcefc9; color: var(--ink); }
.speech-form { font-family: var(--display); font-weight: 700; }
.speech-dash { color: var(--blue); }

.manifesto { background: var(--lime); color: var(--ink); }
.manifesto-mark span { color: var(--blue); }
.about { background: var(--cream); }
.about-display { background: var(--ink); color: var(--cream); }
.about-display:before { border-color: rgba(216,253,85,.5); }
.about-display:after { border-color: rgba(216,253,85,.27); }
.about-monogram-dot { color: var(--lime); }
.about-copy p { color: #465147; }
.about-copy p { font-size: clamp(15px, 1.2vw, 18px); line-height: 1.58; margin-bottom: 18px; }
.about-copy h2 { margin-bottom: 30px; }
.about-links { margin-top: 32px; }

.contact { background: var(--ink); color: var(--cream); }
.contact-top { color: var(--lime); }
.contact h2 em { color: var(--lime); }
.contact p { color: #c7cfc0; }
.contact-link { color: var(--lime); border-bottom-color: var(--lime); }
.footer { color: #aeb8a9; }
.footer-brand span { color: var(--lime); }

@media (max-width: 1120px) {
  .hero-layout { grid-template-columns: minmax(0,1.12fr) minmax(320px,.88fr); }
  .hero-art { transform: translate(7%,0); }
  .project-list { gap: 20px; }
  .market-board { width: 88%; }
  .market-board strong { font-size: clamp(42px, 4.6vw, 62px); }
}
@media (max-width: 800px) {
  .hero { min-height: 0; }
  .hero-layout { grid-template-columns: 1fr; }
  .hero-art { width: min(68vw, 420px); margin: 18px auto 35px; transform: none; }
  .project-list { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 650px) {
  .hero { min-height: calc(100svh - 72px); }
  .hero h1 { font-size: clamp(49px, 12.4vw, 79px); }
  .hero-art { width: min(76vw, 340px); margin: 26px auto 30px; transform: none; }
  .project-list { grid-template-columns: 1fr; }
  .project-visual { height: 330px; }
  .market-board { width: 79%; min-height: 62%; box-shadow: 10px 10px 0 var(--lime); }
  .market-board strong { font-size: clamp(48px, 12vw, 66px); }
  .about-copy p { font-size: 16px; }
}