/* Sunaria precision pass. The original identity and layout remain the base layer. */
:root {
  --bg: #080a0b;
  --surface: #101312;
  --ink: #f3efe7;
  --muted: #b3b5b1;
  --accent: #e0b67c;
  --accent-strong: #f2d7a8;
  --cool: #87c8c7;
  --violet: #b3a5df;
  --moss: #a9c399;
  --line: rgba(227, 207, 174, .18);
}
body {
  background:
    radial-gradient(ellipse 60% 24% at 89% 32%, rgba(93, 151, 149, .055), transparent),
    radial-gradient(ellipse 54% 22% at 12% 66%, rgba(131, 118, 173, .055), transparent),
    #080a0b;
}
html { scroll-padding-top: 88px; }
.site-header {
  background: rgba(8, 10, 11, .90);
  border-bottom-color: rgba(218, 195, 158, .15);
}
.desktop-nav a { transition: color .2s ease; }
.desktop-nav a:hover, .desktop-nav a[aria-current="location"] { color: var(--accent-strong); }
.header-status { color: #b5ab9a; }

/* The page leads with substantial work; figures support it without taking over. */
.metrics-section { padding-block: 46px 56px; }
.metrics-heading { margin-bottom: 20px; }
.metrics-grid { gap: 9px; }
.metric-card { min-height: 122px; padding: 17px 19px; }
.metric-card strong { font-size: clamp(32px, 3vw, 44px); margin-top: 25px; }
.metric-card>span:not(.metric-index) { color: #b7a998; font-size: 10px; }
.metrics-note { color: #a69a8a; font-size: 10px; }
.section-heading>p { color: #b8b5ae; }
.eyebrow { color: #b2a697; font-size: 10px; }
.project-proof { font-size: 9px; color: #aea69b; }
.project-proof b { color: #e8c996; }
.filter, .atlas-filters button { font-size: 10px; }
.technologies, .project-meta, .project-status { font-variant-numeric: tabular-nums; }
.project-description { color: #c0c0ba; }

/* Typography follows the material: editorial framing, engineering bodies, exact labels. */
.section-heading h2, .hero-core h1, .hero-manifesto,
.featured h3, .research-entry h3, .about-section h2,
.contact-section h2 { font-family: var(--serif); }
.project:not(.featured) h3, .atlas-card h4, .capability-grid h3 {
  font-family: var(--sans);
  font-weight: 550;
  letter-spacing: -.035em;
}
.project:not(.featured) h3 { font-size: clamp(22px, 2vw, 27px); }
.atlas-card h4 { font-size: 18px; line-height: 1.3; }
.capability-grid h3 { font-size: 17px; min-height: 48px; }
.research-entry h3 { font-size: clamp(23px, 2.15vw, 31px); line-height: 1.18; }
.research-method dt, .research-method dd { font-size: 12px; }
.research-method dt { font-family: var(--mono); font-size: 10px; letter-spacing: .025em; }
.research-method dd { color: #bec1ba; }
.architecture-figure, .project, .activity-section { backdrop-filter: none; }
.project { position: relative; --domain-color: var(--accent); }
.project[data-categories*="Distributed Systems"] { --domain-color: var(--cool); }
.project[data-categories*="Quantum"] { --domain-color: var(--violet); }
.project[data-categories*="Security"] { --domain-color: #94bbdf; }
.project.featured { --domain-color: var(--accent); }
.project:not(.featured)::before {
  content: "";
  position: absolute;
  top: -1px;
  left: -1px;
  width: 68px;
  height: 1px;
  background: linear-gradient(90deg, var(--domain-color), transparent);
  opacity: .7;
  pointer-events: none;
}
.project:not(.featured) .project-category { color: var(--domain-color); }
.project:not(.featured):hover { border-color: color-mix(in srgb, var(--domain-color) 42%, transparent); }
.project:not(.featured) .project-links a:hover { color: var(--domain-color); }
.featured { background: linear-gradient(135deg, rgba(24, 22, 18, .95), rgba(9, 12, 12, .98) 70%); }
.featured .project-description { font-size: 15px; }

/* Three schematic motifs: causal partial order, a 3/4 quorum, and state phase. */
.research-section {
  background:
    radial-gradient(ellipse 48% 48% at 80% 20%, rgba(109, 100, 157, .075), transparent),
    linear-gradient(180deg, rgba(11, 14, 15, .96), rgba(9, 11, 13, .96));
  border-color: rgba(146, 188, 190, .15);
}
.research-instruments {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  border-block: 1px solid rgba(155, 194, 196, .17);
  margin: -7px 0 22px;
}
.instrument {
  min-width: 0;
  padding: 18px 22px 17px;
  border-right: 1px solid rgba(155, 194, 196, .14);
  background: linear-gradient(160deg, rgba(55, 83, 86, .07), transparent 64%);
}
.instrument:last-child { border-right: 0; }
.instrument>span, .instrument>small {
  display: block;
  font: 9px/1.5 var(--mono);
  letter-spacing: .08em;
  color: #b5c9ca;
}
.instrument>small { color: #8faaa9; letter-spacing: .025em; }
.instrument svg { width: 100%; height: 67px; margin: 4px 0 0; overflow: visible; }
.instrument svg path, .instrument svg ellipse, .instrument svg circle {
  vector-effect: non-scaling-stroke;
}
.signal-path path {
  fill: none;
  stroke: rgba(134, 199, 192, .35);
  stroke-width: 1.15;
}
.signal-node circle { fill: #11191a; stroke: #95c6bc; stroke-width: 1.25; }
.signal-node circle:nth-child(3) { fill: #96cbbb; }
.signal-flow path {
  fill: none;
  stroke: #a6d4c7;
  stroke-width: 1.3;
  stroke-dasharray: 4 240;
}
.instrument-causal.motion-visible .signal-flow path {
  stroke: #a6d4c7;
  animation: causal-pulse 6s linear infinite;
}
.instrument-causal.motion-visible .signal-flow path:nth-child(2) { animation-delay: -3s; }
.instrument-quorum .signal-path { fill: none; stroke: rgba(206, 176, 129, .35); stroke-width: 1.2; }
.quorum-nodes circle { fill: #121615; stroke: #d7b98a; stroke-width: 1.3; }
.quorum-nodes circle:nth-child(-n+3) { fill: rgba(227, 191, 137, .52); }
.quorum-nodes circle:nth-child(4) { stroke: #86918c; }
.quorum-gate { stroke: #e8cf9b; stroke-width: 1; stroke-dasharray: 3 3; }
.instrument-quorum.motion-visible .quorum-nodes circle:nth-child(-n+3) {
  animation: quorum-glow 4.5s ease-in-out infinite;
}
.instrument-quorum.motion-visible .quorum-nodes circle:nth-child(2) { animation-delay: -.35s; }
.instrument-quorum.motion-visible .quorum-nodes circle:nth-child(3) { animation-delay: -.7s; }
.instrument-state .state-orbit { fill: none; stroke: rgba(181, 164, 222, .5); stroke-width: 1.2; }
.instrument-state .state-axis { fill: none; stroke: rgba(181, 164, 222, .24); stroke-width: 1; }
.state-vector { transform-origin: 120px 37px; }
.state-vector path { stroke: #c4b7e6; stroke-width: 1.5; fill: none; }
.state-vector circle { fill: #d4c8ed; }
.state-origin { fill: #b8aae1; }
.instrument-state.motion-visible .state-vector {
  animation: phase-sweep 8s ease-in-out infinite alternate;
}
.research-list { border-top: 0; }
.research-entry { transition: background .25s ease; }
.research-entry:hover { background: rgba(123, 160, 178, .035); }
.research-entry .eyebrow { color: #a9a0d4; }
.research-entry>a { color: #b9a9dd; border-color: rgba(181, 164, 222, .22); }
.research-entry>a:hover { background: rgba(181, 164, 222, .12); }

/* The published atlas stays complete, but comes after the editorial evidence. */
.capability-number { color: var(--cool); }
.capability-grid article:nth-child(3) .capability-number { color: var(--violet); }
.capability-grid article:nth-child(4) .capability-number { color: var(--moss); }
.atlas-section { border-top: 1px solid rgba(151, 193, 186, .16); }
.atlas-card>p { color: #b7c0bd; }
.atlas-card h4 { color: #e5eae7; }
.atlas-card-private { opacity: .84; }
.activity-section { margin-block: 50px 0; border-color: rgba(125, 180, 173, .25); }
.activity-intro .eyebrow { color: var(--cool); }
.activity-row a:hover { color: var(--cool); }
.about-section { border-top: 1px solid rgba(227, 207, 174, .14); }
dialog p:not(.eyebrow) {
  font-family: "Noto Sans Arabic", "Vazirmatn", Tahoma, Arial, sans-serif;
  line-height: 2;
}

/* Animate only paths that carry meaning. Static geometry remains readable. */
.architecture-figure svg g[marker-end] path {
  stroke-dasharray: 5 9;
}
.featured.motion-visible .architecture-figure svg g[marker-end] path {
  animation: verification-flow 8s linear infinite;
}
.featured.motion-visible .architecture-figure svg g[marker-end] path:nth-child(2n) {
  animation-delay: -4s;
}
@keyframes verification-flow { to { stroke-dashoffset: -112; } }
@keyframes causal-pulse { to { stroke-dashoffset: -244; } }
@keyframes quorum-glow { 50% { fill: #f1d19c; filter: drop-shadow(0 0 5px rgba(224, 182, 124, .45)); } }
@keyframes phase-sweep { to { transform: rotate(64deg); } }

@media (max-width: 820px) {
  .research-instruments { margin-top: 0; }
  .instrument { padding-inline: 14px; }
  .instrument>span { font-size: 8px; }
  .metric-card { min-height: 116px; }
}
@media (max-width: 600px) {
  .metrics-section { padding-block: 39px 48px; }
  .metric-card { min-height: 108px; }
  .research-instruments {
    display: flex;
    overflow-x: auto;
    scroll-snap-type: x proximity;
    scrollbar-width: thin;
    scrollbar-color: rgba(154, 190, 186, .5) transparent;
    margin-inline: calc(-1 * var(--gutter));
    padding-inline: var(--gutter);
  }
  .instrument { flex: 0 0 min(70vw, 250px); scroll-snap-align: start; }
  .instrument:last-child { border-right: 1px solid rgba(155, 194, 196, .14); }
  .research-entry h3 { font-size: 26px; }
  .atlas-card h4 { font-size: 19px; }
  .activity-section { margin-block: 24px 0; }
}
@media (prefers-reduced-motion: reduce) {
  .instrument *, .architecture-figure svg * { animation: none !important; }
}
@media print {
  .research-instruments { display: none; }
  .project, .featured { background: #fff; }
}