:root {
  color-scheme: dark;
  --bg: #101412;
  --surface: #151a17;
  --surface-2: #1a211c;
  --surface-3: #253027;
  --text: #edf1ea;
  --muted: #adb7ad;
  --muted-2: #8f9c91;
  --line: #344138;
  --accent: #b4e87b;
  --accent-strong: #c8f599;
  --accent-soft: #263522;
  --on-accent: #172012;
  --green: var(--accent);
  --green-soft: var(--accent-soft);
  --shadow: none;
  --shadow-soft: none;
  --radius: 4px;
  --mono: "IBM Plex Mono", SFMono-Regular, Consolas, monospace;
  --sans: "DM Sans", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}
[data-theme="light"] {
  color-scheme: light;
  --bg: #f5f1e8;
  --surface: #faf7f0;
  --surface-2: #ede8dd;
  --surface-3: #e2dfd1;
  --text: #222a23;
  --muted: #555e52;
  --muted-2: #646c5f;
  --line: #cccdbd;
  --accent: #386044;
  --accent-strong: #254b31;
  --accent-soft: #e0e8d6;
  --on-accent: #faf7f0;
}
*, *::before, *::after { box-sizing: border-box; }
html { font-size: 62.5%; scroll-behavior: smooth; scroll-padding-top: 10rem; }
body { margin: 0; min-width: 320px; background: var(--bg); color: var(--text); font: 1.6rem/1.65 var(--sans); }
::selection { background: var(--accent); color: var(--on-accent); }
img { display: block; max-width: 100%; }
svg { max-width: 100%; }
a { color: inherit; text-decoration: none; }
button, input, textarea { font: inherit; }
button { cursor: pointer; }
a, button, input, textarea { -webkit-tap-highlight-color: transparent; }
:focus-visible { outline: 2px solid var(--accent); outline-offset: 5px; }
.container { width: min(132rem, calc(100% - 9.6rem)); margin-inline: auto; }
.skip-link { position: fixed; top: 1.2rem; left: 1.2rem; z-index: 2000; transform: translateY(-180%); padding: 1rem 1.4rem; background: var(--accent); color: var(--on-accent); font-weight: 700; }
.skip-link:focus { transform: translateY(0); }
.site-header { position: sticky; top: 0; z-index: 100; border-bottom: 1px solid var(--line); background: color-mix(in srgb, var(--bg) 94%, transparent); backdrop-filter: blur(16px); }
.nav-shell { min-height: 8rem; display: flex; align-items: center; justify-content: space-between; gap: 3rem; }
.brand { display: inline-flex; align-items: center; gap: 1.4rem; flex-shrink: 0; }
.brand-mark { display: inline-flex; align-items: center; gap: 1.3rem; color: var(--text); font: 500 2.2rem var(--sans); letter-spacing: -.05em; }
.brand-mark > span { color: var(--accent); font: 1.9rem var(--mono); }
.brand-copy { display: grid; gap: .3rem; line-height: 1.2; }
.brand-copy strong { font: 400 1.2rem var(--mono); letter-spacing: .08em; text-transform: uppercase; }
.brand-copy small { color: var(--muted-2); font: .95rem var(--mono); letter-spacing: .03em; }
.site-nav { display: flex; align-items: center; gap: 2.6rem; margin-left: auto; }
.site-nav a, .footer-links a { display: inline-flex; align-items: center; min-height: 4.4rem; color: var(--muted); font: 1.1rem var(--mono); }
.site-nav a:hover, .footer-links a:hover, .hero-links a:hover { color: var(--accent); }
.nav-actions { display: none; align-items: center; gap: 1.5rem; }
[data-js="true"] .nav-actions { display: flex; }
.theme-toggle { display: inline-flex; align-items: center; gap: .9rem; min-height: 4.4rem; padding: 0; border: 0; color: var(--muted); background: transparent; font: 1.05rem var(--mono); white-space: nowrap; }
.theme-toggle__track { display: flex; align-items: center; width: 3.4rem; height: 1.9rem; padding: .3rem; border: 1px solid var(--line); border-radius: 99px; }
.theme-toggle__thumb { width: 1.1rem; height: 1.1rem; border-radius: 50%; background: var(--accent); transition: transform .2s ease; }
[aria-pressed="true"] .theme-toggle__thumb { transform: translateX(1.3rem); }
.menu-toggle { display: none; width: 4.4rem; height: 4.4rem; padding: 1.1rem; border: 1px solid var(--line); border-radius: var(--radius); background: transparent; }
.menu-toggle span { display: block; height: 1px; margin: .6rem 0; background: var(--text); }
.mobile-menu { display: none; }
.hero { padding: 6rem 0 0; background-image: linear-gradient(color-mix(in srgb, var(--line) 15%, transparent) 1px, transparent 1px), linear-gradient(90deg, color-mix(in srgb, var(--line) 15%, transparent) 1px, transparent 1px); background-size: 4rem 4rem; }
.hero-grid { display: grid; grid-template-columns: 1.12fr 1fr; align-items: center; gap: 4rem; padding-bottom: 5rem; min-height: 51rem; }
.hero-copy { padding-block: 2rem; }
.eyebrow, .section-index, .project-card__meta, .publication-card__top, .blog-card__meta, .experience-item__date, .experience-tag, .skills-band > span, .research-thread__label { color: var(--muted-2); font: 400 1.05rem/1.6 var(--mono); letter-spacing: .065em; text-transform: uppercase; }
.eyebrow { display: flex; align-items: center; gap: 1.2rem; margin: 0 0 2.8rem; color: var(--muted); }
.status-dot { width: .6rem; height: .6rem; flex-shrink: 0; background: var(--accent); box-shadow: 0 0 0 4px var(--accent-soft); border-radius: 50%; }
.hero h1 { margin: 0; font-size: clamp(4rem, 4.5vw, 6.8rem); line-height: 1.06; font-weight: 500; letter-spacing: -.065em; }
.hero h1 > span { color: var(--muted); }
.hero-lede { max-width: 53rem; margin: 2.6rem 0 0; color: var(--muted); font-size: 1.7rem; line-height: 1.8; }
.hero-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 1.2rem; margin-top: 3.2rem; }
.button { display: inline-flex; justify-content: center; align-items: center; gap: 2.2rem; min-height: 4.8rem; padding: 1.2rem 2rem; border: 1px solid var(--line); border-radius: var(--radius); font: 500 1.2rem var(--mono); transition: background .2s ease, border-color .2s ease; }
.button--primary { border-color: var(--accent); background: var(--accent); color: var(--on-accent); }
.button--primary:hover { background: var(--accent-strong); border-color: var(--accent-strong); }
.button--quiet { background: transparent; color: var(--text); }
.button--quiet:hover { border-color: var(--accent); background: var(--accent-soft); }
.hero-links { display: flex; flex-wrap: wrap; gap: 2.4rem; margin-top: 2.4rem; }
.hero-links a { display: inline-flex; align-items: center; gap: .8rem; min-height: 4.4rem; color: var(--muted-2); font: 1.1rem var(--mono); }
.hero-links span { color: var(--accent); }
.swarm-visual { min-width: 0; align-self: stretch; display: flex; flex-direction: column; justify-content: center; padding-top: 1rem; }
.diagram-heading { display: flex; justify-content: space-between; color: var(--muted-2); font: .85rem var(--mono); letter-spacing: .08em; }
.swarm-diagram { width: 100%; height: auto; overflow: visible; }
.diagram-floor { color: var(--line); stroke: var(--line); stroke-width: .6; opacity: .75; }
.diagram-axes { stroke: var(--muted-2); stroke-width: .7; }
.diagram-axes text { stroke: none; fill: var(--muted-2); font: 10px var(--mono); }
.diagram-guides { stroke: var(--muted-2); stroke-width: .65; stroke-dasharray: 3 6; opacity: .65; }
.flight-path { stroke: var(--accent); stroke-width: 1.2; stroke-dasharray: 4 5; }
.flight-path--secondary { opacity: .55; }
.drone-nodes, .art-drone { color: var(--text); }
.diagram-labels { fill: var(--muted); font: 9px var(--mono); }
.path-nodes { fill: var(--accent); }
.diagram-caption { display: flex; align-items: center; justify-content: center; gap: 2.3rem; padding: 1.4rem; border: 1px solid var(--line); color: var(--muted); font: .95rem var(--mono); letter-spacing: .05em; align-self: flex-end; }
.diagram-arrow { color: var(--accent); }
.hero-strip { display: flex; align-items: center; flex-wrap: wrap; gap: 1.6rem; padding-block: 2.1rem; border-top: 1px solid var(--line); color: var(--muted-2); font: .95rem/1.6 var(--mono); }
.hero-strip strong { color: var(--text); font-weight: 400; }
.hero-strip__divider { height: 1.4rem; border-left: 1px solid var(--line); }
.hero-strip a { margin-left: auto; color: var(--muted); }
.hero-strip a span { color: var(--accent); margin-left: 1rem; }
.section { padding: 9rem 0; border-top: 1px solid var(--line); }
.section--tint { background: var(--surface); }
.section-index { color: var(--accent); margin: 0 0 1.2rem; }
.section h2 { margin: 0; font-weight: 500; font-size: clamp(3rem, 3.5vw, 4.8rem); line-height: 1.12; letter-spacing: -.045em; }
.section-heading { display: flex; align-items: end; justify-content: space-between; gap: 3rem; margin-bottom: 3.6rem; }
.section-heading__note { max-width: 30rem; margin: 0; color: var(--muted); font-size: 1.4rem; text-align: right; }
.text-link { display: inline-flex; align-items: center; gap: 1.1rem; min-height: 4.4rem; max-width: 100%; color: var(--accent); font: 500 1.15rem/1.5 var(--mono); text-decoration-thickness: 1px; text-underline-offset: .5rem; }
.text-link:hover { text-decoration-line: underline; }
.featured-section { padding-top: 5rem; }
.featured-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 2.4rem; }
.featured-card { display: flex; flex-direction: column; min-width: 0; border: 1px solid var(--line); border-radius: var(--radius); background: var(--surface); }
.featured-card__heading { display: flex; align-items: center; justify-content: space-between; gap: 2rem; padding: 2.5rem 2.8rem 2rem; }
.featured-card__heading .project-card__meta { margin: 0 0 1.4rem; font-size: .9rem; }
.featured-card h3 { margin: 0; font-size: 2.8rem; font-weight: 500; line-height: 1.2; letter-spacing: -.04em; }
.featured-card__subtitle { margin: .5rem 0 0; color: var(--muted); font: 1.15rem/1.6 var(--mono); }
.featured-card__arrow { color: var(--accent); font: 2.4rem var(--mono); }
.featured-art { position: relative; display: flex; align-items: center; justify-content: center; height: 24rem; margin: 0 1.2rem; overflow: hidden; border: 1px solid var(--line); background-color: var(--bg); background-image: linear-gradient(color-mix(in srgb, var(--line) 25%, transparent) 1px, transparent 1px), linear-gradient(90deg, color-mix(in srgb, var(--line) 25%, transparent) 1px, transparent 1px); background-size: 2.4rem 2.4rem; }
.swarm-art svg { width: 100%; }
.terrain-lines { color: var(--line); opacity: .5; stroke-width: .6; }
.art-trajectory { stroke: var(--accent); stroke-width: 1.3; stroke-dasharray: 4 5; }
.art-trajectory.secondary { opacity: .45; }
.art-caption { position: absolute; bottom: 1.4rem; left: 1.6rem; color: var(--muted-2); font: .8rem var(--mono); letter-spacing: .05em; }
.compiler-art { flex-direction: column; gap: 2rem; padding: 2.4rem 1.2rem 4rem; }
.compiler-art img { width: 8rem; height: 8rem; object-fit: contain; }
.compiler-flow { display: flex; align-items: center; justify-content: center; gap: .8rem; width: 100%; }
.compiler-flow span { padding: .8rem 1rem; border: 1px solid var(--line); background: var(--surface); color: var(--muted); font: .9rem var(--mono); }
.compiler-flow b { color: var(--accent); font-size: 1.1rem; font-weight: 400; }
.featured-card__body { display: flex; flex-direction: column; flex: 1; padding: 2.3rem 2.8rem; }
.featured-card__body > p { margin: 0 0 2.4rem; max-width: 58rem; color: var(--muted); font-size: 1.4rem; line-height: 1.8; }
.featured-card__footer { display: flex; align-items: center; justify-content: space-between; gap: 1rem; margin-top: auto; padding-top: 1.2rem; border-top: 1px solid var(--line); }
.featured-card__footer > span { color: var(--muted-2); font: 1rem var(--mono); }
.about-layout { display: grid; grid-template-columns: .8fr 1.2fr; gap: 8rem; }
.section-intro h2 { max-width: 45rem; }
.about-copy > p { margin: 0 0 1.8rem; color: var(--muted); font-size: 1.65rem; line-height: 1.8; }
.about-copy em { color: var(--text); font-style: normal; }
.principles { display: grid; grid-template-columns: repeat(3, 1fr); gap: 2rem; margin-top: 3.5rem; }
.principles > div { display: grid; gap: .8rem; padding-top: 1.4rem; border-top: 1px solid var(--line); }
.principles span { color: var(--accent); font: 1rem var(--mono); }
.principles strong { font-size: 1.3rem; font-weight: 500; line-height: 1.4; }
.principles small { color: var(--muted); font-size: 1.15rem; line-height: 1.6; }
.experience-list { border-top: 1px solid var(--line); }
.experience-item { display: grid; grid-template-columns: 18rem 1fr; gap: 4rem; padding: 3rem 0; border-bottom: 1px solid var(--line); }
.experience-item__date { padding-top: .3rem; font-size: 1rem; }
.experience-item__marker { display: none; }
.experience-item__body { min-width: 0; }
.experience-item__top { display: flex; align-items: start; justify-content: space-between; gap: 2rem; }
.experience-item h3 { margin: 0; font-size: 1.9rem; font-weight: 500; letter-spacing: -.025em; line-height: 1.4; }
.experience-item p { margin: .4rem 0 0; color: var(--muted); font-size: 1.35rem; }
.experience-item p span { color: var(--accent); }
.experience-item ul { display: grid; gap: .7rem; margin: 1.6rem 0 0; padding-left: 1.6rem; color: var(--muted); font-size: 1.35rem; line-height: 1.75; }
.experience-item li::marker { color: var(--muted-2); }
.experience-item--current .experience-item__date { color: var(--accent); }
.experience-tag { flex-shrink: 0; padding: .4rem .8rem; border: 1px solid var(--line); color: var(--accent); font-size: .85rem; }
.skills-band { display: grid; grid-template-columns: 18rem 1fr; gap: 4rem; margin-top: 3rem; align-items: center; }
.skill-list { display: flex; flex-wrap: wrap; gap: .7rem; }
.skill-list span { padding: .6rem .9rem; border: 1px solid var(--line); color: var(--muted); font: 1rem var(--mono); }
.project-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 2rem; }
.project-card { display: grid; grid-template-columns: 15rem 1fr; min-width: 0; overflow: hidden; border: 1px solid var(--line); border-radius: var(--radius); background: var(--bg); }
.project-card__visual { position: relative; display: grid; place-items: center; min-height: 19rem; padding: 2rem; overflow: hidden; background: var(--surface-2); border-right: 1px solid var(--line); }
.project-card__visual img { width: 100%; max-height: 13rem; object-fit: contain; }
.project-card__number { position: absolute; top: 1rem; left: 1.2rem; color: var(--muted-2); font: .9rem var(--mono); }
.project-card__body { min-width: 0; padding: 2.4rem; }
.project-card__links { display: flex; flex-wrap: wrap; gap: .5rem 1.8rem; }
.project-card__meta { display: flex; justify-content: space-between; flex-wrap: wrap; gap: .5rem 1rem; font-size: .85rem; }
.project-card h3 { margin: 1rem 0 .7rem; font-size: 1.9rem; font-weight: 500; line-height: 1.25; letter-spacing: -.03em; }
.project-card p { margin: 0 0 1rem; color: var(--muted); font-size: 1.3rem; line-height: 1.7; }
.research-overview { display: grid; grid-template-columns: 1fr 1fr; align-items: center; gap: 6rem; margin-bottom: 3.5rem; }
.research-overview > div:first-child p { max-width: 58rem; margin: 0; color: var(--muted); font-size: 1.65rem; }
.metrics { display: flex; justify-content: end; gap: 3rem; }
.metrics div { display: grid; gap: .5rem; padding-left: 2rem; border-left: 1px solid var(--line); }
.metrics strong { font-size: 3.6rem; font-weight: 400; line-height: 1; letter-spacing: -.05em; }
.metrics span { color: var(--muted-2); font: .9rem var(--mono); text-transform: uppercase; }
.publication-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 1.6rem; }
.publication-card { display: flex; flex-direction: column; min-width: 0; padding: 2.8rem; border: 1px solid var(--line); border-radius: var(--radius); background: var(--surface); }
.publication-card--featured { border-top: 2px solid var(--accent); }
.publication-card__top { display: flex; justify-content: space-between; gap: 1.5rem; font-size: .9rem; }
.citation-count { color: var(--accent); flex-shrink: 0; }
.publication-card h3 { margin: 2rem 0 1rem; font-size: 2rem; font-weight: 500; letter-spacing: -.03em; line-height: 1.4; }
.publication-card p { margin: 0 0 2rem; color: var(--muted); font-size: 1.35rem; line-height: 1.8; }
.publication-card .text-link { margin-top: auto; align-self: flex-start; }
.research-thread { display: grid; grid-template-columns: 13rem 1fr auto; align-items: center; gap: 3rem; padding: 2.5rem 0 0; margin-top: 3rem; border-top: 1px solid var(--line); }
.research-thread__label { color: var(--accent); }
.research-thread h3 { margin: 0; font-size: 1.8rem; font-weight: 500; }
.research-thread p { margin: .5rem 0 0; color: var(--muted); font-size: 1.3rem; }
.blog-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 2rem; }
.blog-card { display: flex; flex-direction: column; min-width: 0; padding: 2.4rem; border: 1px solid var(--line); border-radius: var(--radius); background: var(--bg); }
.blog-card--accent { background: var(--accent-soft); }
.blog-card__meta { display: flex; flex-wrap: wrap; justify-content: space-between; gap: .5rem 1rem; font-size: .85rem; }
.blog-card h3 { margin: 2.5rem 0 1rem; font-size: 2.1rem; font-weight: 500; letter-spacing: -.03em; line-height: 1.3; }
.blog-card p { margin: 0 0 2rem; color: var(--muted); font-size: 1.35rem; line-height: 1.75; }
.blog-card .text-link { margin-top: auto; }
.blog-hero .heading-primary { max-width: 80rem; }
.blog-articles { display: grid; gap: 3rem; max-width: 92rem; }
.blog-article { padding: 4rem clamp(2rem, 5vw, 6rem); border: 1px solid var(--line); border-radius: var(--radius); background: var(--bg); }
.blog-article__meta { display: flex; flex-wrap: wrap; gap: 1rem 3rem; color: var(--accent); font: 1rem var(--mono); text-transform: uppercase; }
.blog-article h2 { margin: 2rem 0 1.5rem; }
.blog-article__dek { max-width: 68rem; margin: 0 0 3rem; color: var(--muted); font-size: 1.75rem; }
.blog-article__body { max-width: 68rem; color: var(--muted); font-size: 1.6rem; line-height: 1.85; }
.blog-article__body p { margin: 0 0 1.8rem; }
.blog-article__body blockquote { margin: 2.8rem 0; padding: 1rem 2rem; border-left: 2px solid var(--accent); color: var(--text); font-size: 1.8rem; }
.contact-section { background: var(--surface-2); }
.contact-grid { display: grid; grid-template-columns: 1fr .8fr; gap: 10rem; align-items: start; }
.contact-grid h2 { max-width: 52rem; }
.contact-lede { max-width: 44rem; margin: 2.5rem 0 2.3rem; color: var(--muted); font-size: 1.6rem; }
.contact-email { display: inline-flex; flex-wrap: wrap; align-items: center; gap: 1.5rem; min-height: 4.4rem; color: var(--accent); font: clamp(1.5rem, 2vw, 2rem) var(--mono); }
.contact-form { display: grid; gap: .8rem; padding: 2.8rem; border: 1px solid var(--line); border-radius: var(--radius); background: var(--bg); }
.contact-form label { margin-top: .8rem; color: var(--muted); font: 1rem var(--mono); text-transform: uppercase; }
.contact-form input, .contact-form textarea { width: 100%; min-width: 0; padding: 1.1rem 1.2rem; border: 1px solid var(--line); border-radius: 2px; resize: vertical; background: var(--surface); color: var(--text); font-size: 1.6rem; }
.contact-form input::placeholder, .contact-form textarea::placeholder { color: var(--muted-2); }
.contact-form .button { justify-self: start; margin-top: 1rem; }
.site-footer { padding: 4rem 0 2rem; border-top: 1px solid var(--line); }
.site-footer__inner { display: flex; justify-content: space-between; gap: 4rem; }
.brand--footer { margin-bottom: 1.5rem; }
.site-footer__inner p { max-width: 36rem; margin: 0; color: var(--muted); font-size: 1.25rem; }
.footer-links { display: flex; align-items: start; flex-wrap: wrap; gap: 2rem; }
.site-footer__bottom { display: flex; justify-content: space-between; flex-wrap: wrap; gap: 1rem 2rem; margin-top: 4rem; padding-top: 1.6rem; border-top: 1px solid var(--line); color: var(--muted-2); font: .95rem/1.6 var(--mono); }
/* Compatibility styles for the older case-study pages kept in this repository. */
.header { position: sticky; top: 0; z-index: 1000; background: var(--bg); border-bottom: 1px solid var(--line); }
.header__content { display: flex; align-items: center; justify-content: space-between; width: min(118rem, calc(100% - 5.6rem)); min-height: 7.6rem; margin: 0 auto; }
.header__logo-container { display: flex; align-items: center; gap: 1.2rem; color: var(--text); }
.header__logo-img-cont { width: 3.8rem; height: 3.8rem; overflow: hidden; border-radius: 1.1rem; }
.header__logo-img { display: block; width: 100%; height: 100%; object-fit: cover; }
.header__logo-sub { font-weight: 700; }
.header__links { display: flex; gap: 2rem; margin: 0; padding: 0; list-style: none; }
.header__link { color: var(--muted); font-size: 1.3rem; font-weight: 600; }
.header__main-ham-menu-cont, .header__sm-menu { display: none; }
.main-container { width: min(118rem, calc(100% - 5.6rem)); margin: 0 auto; }
.heading-primary { margin: 0; font-size: clamp(4rem, 6vw, 7rem); letter-spacing: -.06em; line-height: 1; }
.heading-sm { font-size: 1.5rem; }
.text-primary { color: var(--muted); font-size: 1.8rem; }
.project-cs-hero { padding: 14rem 0 10rem; background: var(--surface-2); color: var(--text); }
.project-cs-hero__content { width: min(90rem, calc(100% - 5.6rem)); margin: 0 auto; text-align: center; }
.project-cs-hero__info { max-width: 65rem; margin: 2rem auto 0; }
.project-cs-hero__cta { margin-top: 3rem; }
.project-details { padding: 8rem 0; }
.project-details__content { max-width: 90rem; margin: 0 auto; }
.project-details__showcase-img-cont { margin-bottom: 5rem; }
.project-details__showcase-img { display: block; width: 100%; border-radius: 1.5rem; }
.project-details__content-main { max-width: 72rem; margin: 0 auto; }
.project-details__content-title { margin: 0 0 1.6rem; font-size: 2rem; }
.project-details__desc { margin-bottom: 5rem; }
.project-details__desc-para { color: var(--muted); font-size: 1.6rem; }
.project-details__tools-used { margin-bottom: 5rem; }
.skills { display: flex; flex-wrap: wrap; gap: .7rem; }
.skills__skill { padding: .7rem 1rem; border: 1px solid var(--line); border-radius: .7rem; color: var(--muted); background: var(--surface); font: 1.1rem var(--mono); }
.project-details__links-btn { margin-right: 1rem; }
.main-footer { padding: 5rem 0 2rem; background: var(--text); color: var(--bg); }
.main-footer__upper { display: flex; justify-content: space-between; gap: 4rem; }
.main-footer__row-2 { max-width: 38rem; }
.main-footer__short-desc { color: var(--muted); font-size: 1.3rem; }
.main-footer__social-cont { display: flex; gap: 1rem; margin-top: 1.5rem; }
.main-footer__icon { width: 2.4rem; height: 2.4rem; object-fit: contain; }
.main-footer__lower { margin-top: 3rem; padding-top: 1.5rem; border-top: 1px solid var(--line); color: var(--muted); font-size: 1.1rem; }

/* Shared legacy pages retain their layout while inheriting the new palette. */
.main-footer { background: var(--surface-2); color: var(--text); }
.btn { display: inline-flex; align-items: center; min-height: 4.4rem; padding: 1rem 1.5rem; border: 1px solid var(--accent); border-radius: var(--radius); color: var(--accent); }
@media (max-width: 1100px) {
  .container { width: calc(100% - 6.4rem); }
  .nav-shell { gap: 2rem; }
  .site-nav { gap: 1.7rem; }
  .brand-copy small { display: none; }
  .hero-grid { gap: 2rem; }
  .hero h1 { font-size: clamp(4rem, 4.6vw, 5.5rem); }
  .hero-lede { font-size: 1.55rem; }
  .project-card { grid-template-columns: 11rem 1fr; }
  .project-card__body { padding: 2rem; }
  .contact-grid { gap: 5rem; }
  .about-layout { gap: 5rem; }
  .hero-strip a { margin-left: 0; }
}
@media (max-width: 900px) {
  [data-js="true"] .site-nav { display: none; }
  .site-nav { flex-wrap: wrap; gap: 0 1.8rem; }
  .menu-toggle { display: block; }
  .mobile-menu.is-open { display: grid; padding: 1rem 3.2rem 2rem; max-height: calc(100dvh - 8rem); overflow-y: auto; border-top: 1px solid var(--line); }
  .mobile-menu a { padding: 1.2rem 0; border-bottom: 1px solid var(--line); color: var(--muted); font: 1.2rem var(--mono); }
  .mobile-menu a:last-child { color: var(--accent); }
  .hero { padding-top: 3rem; }
  .hero-grid { grid-template-columns: 1fr; gap: 3rem; padding-bottom: 3rem; }
  .hero-copy { max-width: 70rem; }
  .hero h1 { font-size: clamp(4.2rem, 7.7vw, 6.4rem); }
  .hero-lede { max-width: 59rem; font-size: 1.7rem; }
  .swarm-visual { width: min(100%, 59rem); margin-inline: auto; }
  .swarm-diagram { max-height: 36rem; }
  .diagram-caption { align-self: center; }
  .featured-grid { gap: 1.6rem; }
  .featured-card__heading, .featured-card__body { padding: 2rem; }
  .featured-card h3 { font-size: 2.4rem; }
  .featured-card__footer { align-items: start; flex-direction: column; }
  .compiler-flow { gap: .4rem; }
  .compiler-flow span { padding: .6rem .5rem; font-size: .8rem; }
  .about-layout, .research-overview, .contact-grid { grid-template-columns: 1fr; gap: 3rem; }
  .section-intro h2 { max-width: 65rem; }
  .metrics { justify-content: start; }
  .project-grid { grid-template-columns: 1fr; }
  .project-card { grid-template-columns: 17rem 1fr; }
  .experience-item, .skills-band { grid-template-columns: 15rem 1fr; gap: 2rem; }
  .blog-grid { grid-template-columns: 1fr; }
  .blog-card { padding: 2.5rem; }
  .blog-card h3 { margin-top: 1.8rem; }
  .research-thread { grid-template-columns: 1fr; gap: 1.2rem; }
  .research-thread .button { justify-self: start; margin-top: 1rem; }
  .publication-card__top { flex-wrap: wrap; }
}
@media (max-width: 600px) {
  .container, .main-container, .header__content { width: calc(100% - 3.6rem); }
  .nav-shell { min-height: 7.2rem; gap: 1rem; }
  .brand { gap: 1rem; }
  .brand-mark { font-size: 1.9rem; gap: .9rem; }
  .brand-copy strong { font-size: 1rem; letter-spacing: .03em; }
  .nav-actions { gap: .8rem; }
  .theme-toggle { gap: 0; }
  #theme-label { display: none; }
  .theme-toggle { min-width: 4.4rem; justify-content: center; }
  .site-nav { font-size: 1rem; gap: 0 1rem; }
  html:not([data-js="true"]) .nav-shell { flex-wrap: wrap; padding-block: 1rem; }
  html:not([data-js="true"]) .site-nav { margin-left: 0; }
  .mobile-menu.is-open { padding-inline: 1.8rem; }
  .hero-copy { padding-top: 1.2rem; }
  .eyebrow { font-size: .85rem; margin-bottom: 2rem; }
  .hero h1 { font-size: clamp(3.2rem, 8.6vw, 5.2rem); letter-spacing: -.06em; }
  .hero-lede { font-size: 1.5rem; line-height: 1.8; margin-top: 2rem; }
  .hero-actions { margin-top: 2.4rem; }
  .button { padding-inline: 1.5rem; gap: 1.5rem; font-size: 1.05rem; }
  .hero-links { margin-top: 1.5rem; gap: 2.4rem; }
  .hero-grid { gap: 1.2rem; }
  .diagram-heading { font-size: .75rem; }
  .diagram-caption { width: 100%; gap: 1.5rem; font-size: .8rem; }
  .hero-strip { gap: .8rem 1rem; font-size: .85rem; }
  .hero-strip__divider { display: none; }
  .hero-strip > span:nth-last-child(2) { flex-basis: 100%; }
  .section { padding: 5.6rem 0; }
  .featured-section { padding-top: 3.6rem; }
  .section-heading { align-items: start; flex-direction: column; gap: 1.2rem; margin-bottom: 2.5rem; }
  .section-heading__note { text-align: left; }
  .section h2 { font-size: 3.3rem; }
  .featured-grid, .publication-grid { grid-template-columns: 1fr; }
  .featured-art { height: 21rem; }
  .featured-card__footer { flex-direction: row; flex-wrap: wrap; align-items: center; }
  .compiler-flow { gap: .7rem; }
  .compiler-flow span { padding: .7rem; font-size: .85rem; }
  .principles { grid-template-columns: 1fr; gap: 2rem; }
  .principles strong { font-size: 1.45rem; }
  .principles small { font-size: 1.3rem; }
  .experience-item { grid-template-columns: 1fr; gap: 1rem; padding-block: 2.5rem; }
  .experience-item__top { flex-wrap: wrap; gap: 1rem; }
  .experience-item h3 { font-size: 1.8rem; }
  .skills-band { grid-template-columns: 1fr; gap: 1.5rem; }
  .project-card { grid-template-columns: 10rem 1fr; }
  .project-card__visual { min-height: 16rem; padding: 1.2rem; }
  .project-card__body { padding: 1.6rem; }
  .project-card h3 { font-size: 1.8rem; }
  .metrics { gap: 2rem; }
  .metrics div { padding-left: 1.5rem; }
  .metrics strong { font-size: 3rem; }
  .metrics span { font-size: .8rem; }
  .publication-card { padding: 2.2rem; }
  .contact-form { padding: 2rem; }
  .contact-form .button { width: 100%; }
  .site-footer__inner { flex-direction: column; gap: 2rem; }
  .site-footer__bottom { margin-top: 2rem; }
  .header__links { flex-wrap: wrap; gap: .8rem 1.3rem; }
  .header__content { flex-wrap: wrap; gap: 1.2rem; padding-block: 1rem; }
  .header__logo-sub { font-size: 1.3rem; }
  .main-footer__upper { display: block; }
  .main-footer__row-1 { margin-top: 3rem; }
  .project-cs-hero { padding-block: 7rem; }
}
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { animation: none !important; transition: none !important; }
}