/* Shared font faces and component roles. Palette/scale: src/design-system.json. */
@font-face {
  font-family: 'Archivo';
  font-style: italic;
  font-weight: 100 900;
  font-stretch: 62% 125%;
  font-display: swap;
  src: url('/fonts/Archivo-Italic-LatinExt.woff2') format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: 'Archivo';
  font-style: italic;
  font-weight: 100 900;
  font-stretch: 62% 125%;
  font-display: swap;
  src: url('/fonts/Archivo-Italic.woff2') format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: 'Archivo';
  font-style: normal;
  font-weight: 100 900;
  font-stretch: 62% 125%;
  font-display: swap;
  src: url('/fonts/Archivo-LatinExt.woff2') format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: 'Archivo';
  font-style: normal;
  font-weight: 100 900;
  font-stretch: 62% 125%;
  font-display: swap;
  src: url('/fonts/Archivo.woff2') format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: 'Source Serif 4';
  font-style: italic;
  font-weight: 200 900;
  font-display: swap;
  src: url('/fonts/SourceSerif4-Italic-LatinExt.woff2') format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: 'Source Serif 4';
  font-style: italic;
  font-weight: 200 900;
  font-display: swap;
  src: url('/fonts/SourceSerif4-Italic.woff2') format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: 'Source Serif 4';
  font-style: normal;
  font-weight: 200 900;
  font-display: swap;
  src: url('/fonts/SourceSerif4-LatinExt.woff2') format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: 'Source Serif 4';
  font-style: normal;
  font-weight: 200 900;
  font-display: swap;
  src: url('/fonts/SourceSerif4.woff2') format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

:root {
  --sans: 'Archivo', 'Helvetica Neue', Arial, sans-serif;
  --serif: 'Source Serif 4', Georgia, 'Times New Roman', serif;
  --mono: var(--sans);
  --pad: max(28px, calc((100vw - 1280px) / 2));
  --shadow: rgb(36 36 36 / 10%);
  --scrim: rgb(36 36 36 / 60%);
  color-scheme: light;
  font-synthesis: none;
  font-optical-sizing: auto;
}

body { font-family: var(--sans); font-size: var(--type-body); font-weight: 400; font-variant-numeric: lining-nums; }

/* Soft graphitic sheets drift across the margins; the reading surface stays white.
   Decorative pseudo-elements add no markup, input handlers or layout movement. */
body { position: relative; isolation: isolate; }
body::before, body::after {
  content: '';
  position: fixed;
  inset: -90px;
  z-index: -1;
  pointer-events: none;
  background: url('/carbon-lattice.svg') repeat;
  background-size: 162px 93.531px;
  mask-image: radial-gradient(ellipse at 100% 15%, black, transparent 64%), radial-gradient(ellipse at 0% 85%, black, transparent 54%);
  opacity: .12;
}
body::after {
  background-size: 216px 124.708px;
  mask-image: radial-gradient(ellipse at 95% 85%, black, transparent 58%);
  opacity: .06;
  transform: translate3d(18px, -12px, 0);
}
@media (prefers-reduced-motion: no-preference) {
  body::before { animation: carbon-drift 28s ease-in-out infinite alternate; }
  body::after { animation: carbon-drift 36s ease-in-out -18s infinite alternate-reverse; }
}
@keyframes carbon-drift {
  from { transform: translate3d(0, 0, 0); }
  to { transform: translate3d(24px, -18px, 0); }
}

h1, h2, h3 { overflow-wrap: anywhere; }
.hero-surname { max-width: 100%; }
button, input, textarea { font-family: var(--sans); }
::selection { background: var(--accent-soft); color: var(--text); }
:focus-visible { outline: 3px solid var(--accent); outline-offset: 4px; }
.publications :focus-visible, .footer :focus-visible, .enquiry :focus-visible { outline-color: var(--accent); }
.paper-result :focus-visible { outline-color: var(--accent); }
.micro, .eyebrow, dt { font-family: var(--sans); font-size: var(--type-label); font-weight: 500; letter-spacing: .075em; line-height: 1.6; }
.section-index, .eyebrow, .section-label .micro, .hero-role { color: var(--text-secondary); }
.publications .section-index, .footer .section-index { color: var(--text-secondary); }
.hero-role { font-size: var(--type-label); letter-spacing: .06em; }
.profile h2 em { color: var(--text); }
.paper-kicker { color: var(--text-secondary); }
.prose p.micro { color: var(--text-secondary); }
.prose p, .prose li, .profile-prose p { font-size: var(--type-reading); line-height: 1.8; }
.prose .source-note { font-size: var(--type-small); }
.paper-deck, .hero-line, .lede { font-size: var(--type-lead); }
.visual-note, .paper-structures figcaption > span, .paper-structures figcaption strong { font-size: var(--type-caption); line-height: 1.7; }
.paper-citation, .paper-full-citation, .paper-license, .paper-summary-note { font-size: var(--type-small); line-height: 1.7; }
.profile-tag, .role-date, .footer-foot, .site-footer .micro, .hero-facts dt, .breadcrumb { font-size: var(--type-label); }
.paper-notes summary .micro, .experience-head > p { font-size: var(--type-label); letter-spacing: .06em; }
.role-body p { font-size: var(--type-body); }
.role-body .role-tags { font-size: var(--type-label); }
.hero-meta p, .hero-facts dd, .role-org { font-size: var(--type-small); }
.hero-meta .text-link, .text-link, .copy-button, .button-primary, .paper-action, .work-more, .diagram-link, .footer-links a { font-size: var(--type-control); font-weight: 500; }
.button-primary, .paper-action:not(.paper-action--ghost) { font-weight: 600; }
.text-link, .work-more, .diagram-link { color: var(--accent); border-bottom-color: var(--accent); }
.text-link:hover, .work-more:hover, .diagram-link:hover { color: var(--accent-hover); border-bottom-color: var(--accent-hover); }
.text-link--quiet { color: var(--text-secondary); border-bottom-color: var(--border-strong); }
.paper-full-citation .micro, .paper-license .micro { font-size: var(--type-label); }
time, .role-date, .hero-facts dd { font-variant-numeric: lining-nums tabular-nums; }

/* One masthead across the homepage, archive and detail pages. */
.site-header { min-height: 80px; height: auto; gap: 24px; }
.brand { gap: 13px; font-size: var(--type-control); font-weight: 600; letter-spacing: 0; }
.brand-name { font-size: inherit; font-weight: inherit; }
.site-nav { gap: 28px; }
.site-nav a { gap: 10px; min-height: 44px; font-size: var(--type-control); font-weight: 500; }
.site-nav a:last-child { padding-inline: 18px; border: 1px solid var(--border-strong); border-radius: 24px; }
.site-nav a[aria-current='page'] { font-weight: 600; }
.site-nav a:last-child:hover { border-color: var(--text); background: var(--surface-muted); }
.site-nav a:last-child::after { display: none; }

@media (max-width: 1000px) {
  .hero { grid-template-columns: minmax(0, 1.15fr) minmax(0, 1fr); }
  .hero-meta { flex-wrap: wrap; }
  .hero-meta p { flex: 1 1 100%; }
  .hero-meta .text-link { flex: 1 1 auto; }
  .hero-role { max-width: 36ch; }
}
@media (max-width: 720px) {
  /* Keep the closer-spaced mobile reading column a little quieter. */
  body::before { opacity: .10; }
  body::after { opacity: .05; }
  :root { --pad: 20px; }
  .site-header { min-height: 96px; }
  .brand { min-height: 49px; }
  .site-nav { min-height: 46px; height: auto; gap: 10px; flex-wrap: wrap; }
  .site-nav a { font-size: var(--type-small); }
  .site-nav a:last-child { border: 0; padding: 0; border-radius: 0; }
  .site-nav a:last-child:hover { background: transparent; }
  .hero { grid-template-columns: 1fr; }
  .hero-role { max-width: none; }
  .hero-meta { display: grid; }
  .hero-actions { gap: 12px 22px; }
  .paper-label { flex-wrap: wrap; gap: 8px 20px; }
  .paper-label > span:last-child { margin-left: auto; }
  .prose p, .prose li, .profile-prose p { font-size: var(--type-body); }
  .paper-notes summary { padding-block: 17px; }
  .hero-facts { grid-template-columns: 1fr 1fr; }
  .footer-foot { gap: 20px; }
  .profile-links a { grid-template-columns: minmax(0, 1fr) 32px; gap: 4px 14px; }
  .profile-tag { grid-column: 1; grid-row: 2; }
  .profile-links a > span:last-child { grid-column: 2; grid-row: 1/3; }
}
@media (max-width: 380px) {
  .site-nav { gap: 7px; }
  .site-nav a { font-size: var(--type-caption); }
  .hero-role { letter-spacing: .03em; }
  .hero-facts { grid-template-columns: 1fr; }
  .hero-facts div { border-bottom: 1px solid var(--border); }
  .hero-facts div:last-child { border-bottom: 0; }
}
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation: none !important; transition: none !important; }
}
@media print {
  body::before, body::after { display: none; }
  body, .publications, .footer, .enquiry { color: black; background: white; }
  .prose p, .prose li { font-size: 11pt; }
}
