:root {
  --color-bg-dark: #050816;
  --color-surface-dark: #0b1224;
  --color-surface-dark-2: #111a32;
  --color-bg-light: #f5f7fb;
  --color-surface-light: #ffffff;
  --color-ink: #0d1424;
  --color-text-on-dark: #f7f9fc;
  --color-muted-dark: #98a2b5;
  --color-muted-light: #626b7b;
  --color-purple: #4f46e5;
  --color-blue: #2563eb;
  --color-cyan: #818cf8;
  --gradient-brand: linear-gradient(120deg, #2563eb, #4f46e5 58%, #818cf8);
  --font-heading: "Avenir Next", Avenir, "Segoe UI", sans-serif;
  --font-body: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  --step--1: clamp(0.82rem, 0.79rem + 0.14vw, 0.9rem);
  --step-0: clamp(1rem, 0.94rem + 0.25vw, 1.125rem);
  --step-1: clamp(1.25rem, 1.08rem + 0.7vw, 1.65rem);
  --step-2: clamp(1.7rem, 1.28rem + 1.65vw, 2.6rem);
  --step-3: clamp(2.25rem, 1.45rem + 3.2vw, 4.5rem);
  --step-4: clamp(3rem, 1.55rem + 5.75vw, 6.75rem);
  --space-1: clamp(0.5rem, 0.42rem + 0.32vw, 0.75rem);
  --space-2: clamp(0.8rem, 0.66rem + 0.55vw, 1.2rem);
  --space-3: clamp(1.25rem, 1rem + 1vw, 2rem);
  --space-4: clamp(2rem, 1.45rem + 2.2vw, 3.75rem);
  --space-5: clamp(3.5rem, 2.5rem + 4vw, 7rem);
  --shell: 78rem;
  --content: 48rem;
  --radius-sm: 0.7rem;
  --radius-md: 1.25rem;
  --radius-lg: 2rem;
  --border-dark: rgba(129, 140, 248, 0.24);
  --border-light: #dbe2ee;
  --shadow-card: 0 18px 50px rgba(13, 20, 36, 0.1);
  --motion-fast: 180ms;
  --motion-section: 420ms;
}

*, *::before, *::after { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
  margin: 0;
  background: var(--color-bg-light);
  color: var(--color-ink);
  font-family: var(--font-body);
  font-size: var(--step-0);
  line-height: 1.7;
  overflow-x: hidden;
}
body.admin-bar .site-header { top: 32px; }
img { display: block; max-width: 100%; height: auto; }
a { color: inherit; }
button, input, select, textarea { font: inherit; }
:focus-visible { outline: 3px solid var(--color-cyan); outline-offset: 4px; }
.screen-reader-text {
  clip: rect(1px, 1px, 1px, 1px);
  clip-path: inset(50%);
  height: 1px;
  overflow: hidden;
  position: absolute !important;
  width: 1px;
  word-wrap: normal !important;
}
.screen-reader-text:focus {
  clip: auto !important;
  clip-path: none;
  height: auto;
  left: 1rem;
  padding: 0.75rem 1rem;
  top: 1rem;
  width: auto;
  z-index: 100000;
  background: var(--color-surface-light);
  color: var(--color-ink);
}
.shell { width: min(calc(100% - 2rem), var(--shell)); margin-inline: auto; }
.eyebrow {
  margin: 0 0 var(--space-1);
  color: var(--color-blue);
  font-size: var(--step--1);
  font-weight: 800;
  letter-spacing: 0.16em;
  text-transform: uppercase;
}
.eyebrow--on-dark { color: var(--color-cyan); }
.section-title { margin: 0; font: 750 var(--step-3)/1.05 var(--font-heading); letter-spacing: -0.045em; }
.section-intro { max-width: 42rem; color: var(--color-muted-light); }
.section-intro--on-dark { color: var(--color-muted-dark); }
.button-link {
  align-items: center;
  border: 1px solid transparent;
  border-radius: 999px;
  display: inline-flex;
  font-weight: 750;
  gap: 0.55rem;
  min-height: 2.9rem;
  padding: 0.7rem 1.2rem;
  text-decoration: none;
  transition: transform var(--motion-fast) ease, border-color var(--motion-fast) ease, background var(--motion-fast) ease;
}
.button-link:hover { transform: translateY(-2px); }
.button-link--primary { background: var(--gradient-brand); color: #fff; }
.button-link--ghost { border-color: rgba(255,255,255,0.25); color: var(--color-text-on-dark); }

.site-header {
  background: rgba(5, 8, 22, 0.92);
  color: var(--color-text-on-dark);
  left: 0;
  position: sticky;
  right: 0;
  top: 0;
  z-index: 1000;
  backdrop-filter: blur(16px);
  margin: 0 !important;
  max-width: none !important;
  padding: 0 !important;
  width: 100% !important;
}
.site-header__inner { align-items: center; display: flex; gap: var(--space-3); justify-content: space-between; min-height: 4.75rem; }
.local-review-banner { background: #fff2c2; color: #3f3210; font-size: var(--step--1); font-weight: 700; padding: 0.45rem 1rem; text-align: center; }
.site-brand { align-items: center; display: inline-flex; font: 850 var(--step-1)/1 var(--font-heading); letter-spacing: -0.06em; min-height: 2.75rem; text-decoration: none; }
.site-brand .custom-logo { height: 2.75rem; width: auto; }
.site-nav__list { align-items: center; display: flex; gap: clamp(1rem, 2.4vw, 2rem); list-style: none; margin: 0; padding: 0; }
.site-nav a { color: var(--color-text-on-dark); font-size: var(--step--1); font-weight: 750; letter-spacing: 0.06em; text-decoration: none; text-transform: uppercase; }
.site-nav a:hover { color: var(--color-cyan); }
.header-cta { border: 1px solid rgba(56,189,248,0.55); border-radius: 0.45rem; color: var(--color-text-on-dark); font-size: var(--step--1); font-weight: 800; padding: 0.55rem 0.85rem; text-decoration: none; text-transform: uppercase; }
.header-cta:hover { background: rgba(47,128,255,0.12); border-color: var(--color-purple); }
.site-nav__toggle { display: none; background: transparent; border: 0; color: inherit; height: 2.75rem; padding: 0.6rem; width: 2.75rem; }
.site-nav__toggle-line { background: currentColor; display: block; height: 2px; margin: 0.35rem 0; transition: transform var(--motion-fast) ease; }

.home-hero {
  background: var(--color-bg-dark);
  color: var(--color-text-on-dark);
  min-height: min(52rem, calc(100svh - 4.75rem));
  overflow: hidden;
  padding-block: var(--space-5);
  position: relative;
}
.home-hero::before {
  background: linear-gradient(115deg, transparent 0 49.9%, rgba(79,70,229,0.12) 50% 50.15%, transparent 50.2%), radial-gradient(circle at 35% 35%, rgba(79,70,229,0.24), transparent 38%), radial-gradient(circle at 78% 62%, rgba(129,140,248,0.18), transparent 36%);
  content: "";
  inset: 0;
  pointer-events: none;
  position: absolute;
  z-index: 0;
}
.home-hero::after { background-image: linear-gradient(rgba(93,116,214,0.24) 1px, transparent 1px), linear-gradient(90deg, rgba(75,137,235,0.24) 1px, transparent 1px); background-position: center; background-size: 7rem 7rem; content: ""; inset: 0; -webkit-mask-image: radial-gradient(ellipse 76% 88% at 69% 44%, #000 0%, rgba(0,0,0,0.92) 58%, transparent 100%); mask-image: radial-gradient(ellipse 76% 88% at 69% 44%, #000 0%, rgba(0,0,0,0.92) 58%, transparent 100%); opacity: 0.3; pointer-events: none; position: absolute; z-index: 0; }
.home-hero__grid { align-items: center; display: grid; gap: var(--space-4); grid-template-columns: minmax(0, 1.05fr) minmax(20rem, 0.95fr); position: relative; z-index: 1; }
.home-hero__copy { align-self: start; padding-block: clamp(2rem, 5vw, 4.5rem) var(--space-3); }
.home-hero__hello { color: #d8dfec; font-size: var(--step--1); font-weight: 800; letter-spacing: 0.16em; margin: 0 0 var(--space-1); text-transform: uppercase; }
.home-hero h1 { font: 850 clamp(4rem, 6.3vw, 6.25rem)/0.89 var(--font-heading); letter-spacing: -0.07em; margin: 0; max-width: 9ch; text-transform: uppercase; }
.home-hero h1 span { background: none; color: inherit; display: block; -webkit-text-fill-color: currentColor; }
.home-hero__role { color: var(--color-text-on-dark); font-size: var(--step-0); font-weight: 800; letter-spacing: 0.03em; margin: var(--space-2) 0 0; text-transform: uppercase; }
.home-hero__lead { color: #b3bdcd; font-size: var(--step-0); max-width: 31rem; }
.home-hero__actions { display: flex; flex-wrap: wrap; gap: 0.8rem; margin-top: var(--space-3); }
.home-hero__visual { align-items: end; aspect-ratio: 4 / 5; background: radial-gradient(circle at 63% 31%, rgba(124,58,237,0.12), transparent 36%), radial-gradient(circle at 54% 46%, rgba(37,99,235,0.32), rgba(79,70,229,0.18) 34%, transparent 61%); border: 0; border-radius: 0; display: flex; isolation: isolate; justify-content: center; margin-right: 1rem; overflow: visible; padding: clamp(0.8rem, 2vw, 1.6rem) clamp(0.65rem, 1.7vw, 1.25rem) 0; position: relative; }
.home-hero__visual::before { background: conic-gradient(from 214deg, rgba(79,70,229,0.14), rgba(37,99,235,0.82), rgba(129,140,248,0.42), rgba(79,70,229,0.84), rgba(79,70,229,0.14)); clip-path: polygon(50% 0, 82% 28%, 100% 73%, 58% 100%, 8% 75%, 0 24%); content: ""; filter: drop-shadow(0 0 24px rgba(37,99,235,0.4)) drop-shadow(0 0 42px rgba(79,70,229,0.24)); height: 65%; left: 17%; opacity: 0.68; pointer-events: none; position: absolute; top: 18%; transform: rotate(13deg); width: 69%; z-index: 0; }
.home-hero__visual::after { background: linear-gradient(145deg, rgba(79,70,229,0.84), rgba(59,130,246,0.72) 62%, rgba(37,99,235,0.22) 63%); clip-path: polygon(50% 0, 100% 100%, 0 74%); content: ""; filter: drop-shadow(0 0 11px rgba(79,70,229,0.58)) drop-shadow(0 0 23px rgba(37,99,235,0.42)); height: 13%; pointer-events: none; position: absolute; right: 6%; top: 13%; transform: rotate(17deg); width: 13%; z-index: 1; }
.home-hero__backdrop { background: transparent; inset: 8% 2% 3%; pointer-events: none; position: absolute; transform: translateX(-1.35rem); -webkit-mask-image: radial-gradient(ellipse 72% 76% at 43% 48%, #000 0%, #000 54%, rgba(0,0,0,0.76) 68%, rgba(0,0,0,0.28) 82%, transparent 100%); mask-image: radial-gradient(ellipse 72% 76% at 43% 48%, #000 0%, #000 54%, rgba(0,0,0,0.76) 68%, rgba(0,0,0,0.28) 82%, transparent 100%); z-index: 0; }
.home-hero__backdrop::before { background: linear-gradient(145deg, rgba(59,130,246,0.7), rgba(79,70,229,0.86)); clip-path: polygon(50% 0, 100% 38%, 78% 100%, 8% 78%, 0 20%); content: ""; filter: drop-shadow(0 0 14px rgba(37,99,235,0.58)) drop-shadow(0 0 26px rgba(79,70,229,0.38)); height: 14%; left: 2%; opacity: 0.82; position: absolute; top: 50%; transform: rotate(-16deg); width: 14%; }
.home-hero__backdrop::after { background-image: linear-gradient(rgba(104,135,255,0.27) 1px, transparent 1px), linear-gradient(90deg, rgba(104,135,255,0.27) 1px, transparent 1px); background-size: 2.8rem 2.8rem; content: ""; inset: 3% 0 0; -webkit-mask-image: radial-gradient(circle at 52% 47%, #000 0, transparent 72%); mask-image: radial-gradient(circle at 52% 47%, #000 0, transparent 72%); opacity: 0.68; position: absolute; }
.home-hero__orbit { border: 2px solid rgba(74,124,255,0.78); border-radius: 50%; left: 50%; position: absolute; top: 48%; transform: translate(-50%, -50%) rotate(-13deg); }
.home-hero__orbit--outer { box-shadow: 0 0 14px rgba(44,111,255,0.72), 0 0 42px rgba(49,88,255,0.4), inset 0 0 22px rgba(52,117,255,0.22); height: 78%; width: 82%; }
.home-hero__orbit--middle { border-color: rgba(99,102,241,0.92); box-shadow: 0 0 16px rgba(79,70,229,0.7), inset 0 0 14px rgba(99,102,241,0.34); height: 60%; width: 63%; }
.home-hero__orbit--inner { border-color: rgba(55,203,255,0.84); box-shadow: 0 0 15px rgba(41,177,255,0.62); height: 42%; width: 44%; }
.home-hero__node { background: #818cf8; border: 2px solid rgba(255,255,255,0.94); border-radius: 50%; box-shadow: 0 0 10px rgba(255,255,255,0.75), 0 0 24px rgba(79,70,229,1); height: 0.62rem; position: absolute; width: 0.62rem; }
.home-hero__node--one { left: 12%; top: 30%; }
.home-hero__node--two { background: #32c9ff; box-shadow: 0 0 10px rgba(255,255,255,0.75), 0 0 26px rgba(42,188,255,1); right: 7%; top: 47%; }
.home-hero__node--three { bottom: 18%; left: 22%; }
.home-hero__visual img { filter: drop-shadow(0 1.35rem 1.9rem rgba(0,0,0,0.34)) drop-shadow(0 0 1.7rem rgba(37,99,235,0.13)); height: 100%; max-height: 100%; max-width: 100%; object-fit: contain; object-position: center bottom; position: relative; transform: translateX(-1.25rem) scale(1.1); transform-origin: center bottom; width: 100%; -webkit-mask-image: linear-gradient(to bottom, #000 0%, #000 74%, rgba(0,0,0,0.94) 81%, rgba(0,0,0,0.62) 89%, rgba(0,0,0,0.22) 96%, transparent 100%), linear-gradient(to left, transparent 0%, rgba(0,0,0,0.3) 4%, #000 11%, #000 100%); -webkit-mask-composite: source-in; mask-image: linear-gradient(to bottom, #000 0%, #000 74%, rgba(0,0,0,0.94) 81%, rgba(0,0,0,0.62) 89%, rgba(0,0,0,0.22) 96%, transparent 100%), linear-gradient(to left, transparent 0%, rgba(0,0,0,0.3) 4%, #000 11%, #000 100%); mask-composite: intersect; z-index: 2; }
.home-hero__monogram { color: rgba(255,255,255,0.92); font: 850 clamp(4rem, 10vw, 8.5rem)/1 var(--font-heading); letter-spacing: -0.08em; position: relative; text-shadow: 0 0 45px rgba(54,150,255,0.55); z-index: 1; }
.home-hero__disciplines { background: rgba(8,14,29,0.9); border: 1px solid var(--border-dark); border-radius: var(--radius-sm); display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); margin-top: calc(-1 * var(--space-3)); padding: 1.1rem; position: relative; z-index: 2; }
.home-hero__disciplines span { align-items: center; color: #d6ddeb; display: flex; font-size: var(--step--1); font-weight: 750; justify-content: center; min-height: 2.5rem; padding-inline: 0.75rem; text-align: center; }
.home-hero__disciplines span + span { border-left: 1px solid var(--border-dark); }

.cv-section { background: linear-gradient(145deg, #070b1a, #0b1224 55%, #111a32); color: var(--color-text-on-dark); overflow: hidden; padding-block: var(--space-5); position: relative; }
.cv-section::before { background: radial-gradient(circle, rgba(129,140,248,0.16) 0 1px, transparent 1.5px); background-size: 2.4rem 2.4rem; content: ""; inset: 0; opacity: 0.45; pointer-events: none; position: absolute; }
.cv-section .shell { position: relative; z-index: 1; }
.cv-section__heading { align-items: end; display: grid; gap: var(--space-4); grid-template-columns: minmax(0, 1fr) minmax(18rem, 0.7fr); margin-bottom: var(--space-4); }
.cv-section__heading > p { color: #aeb8ca; margin: 0; max-width: 38rem; }
.cv-infographic { display: grid; gap: var(--space-3); grid-template-columns: minmax(18rem, 0.72fr) minmax(0, 1.28fr); }
.cv-profile-card { background: linear-gradient(160deg, rgba(37,99,235,0.95), rgba(79,70,229,0.88) 54%, rgba(17,26,50,0.98)); border: 1px solid rgba(255,255,255,0.18); border-radius: var(--radius-md); box-shadow: 0 1.8rem 4rem rgba(0,0,0,0.28); min-width: 0; overflow: hidden; padding: var(--space-3); }
.cv-profile-card__portrait { align-items: end; aspect-ratio: 5 / 4; background: radial-gradient(circle at 50% 42%, rgba(255,255,255,0.22), rgba(255,255,255,0.03) 56%, transparent 72%); border-bottom: 1px solid rgba(255,255,255,0.2); display: flex; justify-content: center; margin: calc(-1 * var(--space-3)) calc(-1 * var(--space-3)) var(--space-3); overflow: hidden; }
.cv-profile-card__portrait img { filter: drop-shadow(0 1rem 1.3rem rgba(0,0,0,0.24)); height: 108%; object-fit: contain; object-position: center bottom; width: 100%; }
.cv-profile-card__portrait > span { font: 800 clamp(4rem, 9vw, 7rem)/1 var(--font-heading); padding-bottom: 2rem; }
.cv-card__kicker { color: #b9c5ff; font-size: 0.72rem; font-weight: 850; letter-spacing: 0.14em; margin: 0 0 0.55rem; text-transform: uppercase; }
.cv-profile-card h3 { font: 600 var(--step-2)/1.05 var(--font-heading); letter-spacing: -0.04em; margin: 0; }
.cv-profile-card__role { color: #e4e8ff; font-size: var(--step--1); font-weight: 750; margin: 0.65rem 0 var(--space-3); text-transform: uppercase; }
.cv-identity { border-top: 1px solid rgba(255,255,255,0.2); display: grid; gap: var(--space-2); margin: 0; padding-top: var(--space-2); }
.cv-identity div { display: grid; gap: 0.2rem; }
.cv-identity dt { color: #c5cdfa; font-size: 0.7rem; font-weight: 850; letter-spacing: 0.1em; text-transform: uppercase; }
.cv-identity dd { font-size: var(--step--1); line-height: 1.45; margin: 0; }
.cv-details { display: grid; gap: var(--space-3); grid-template-columns: repeat(2, minmax(0, 1fr)); }
.cv-card { background: rgba(255,255,255,0.055); border: 1px solid rgba(129,140,248,0.25); border-radius: var(--radius-md); min-width: 0; padding: var(--space-3); position: relative; }
.cv-card::after { background: var(--gradient-brand); border-radius: 999px; bottom: 0; content: ""; height: 3px; left: var(--space-3); opacity: 0.65; position: absolute; right: var(--space-3); }
.cv-card__number { color: rgba(197,205,250,0.32); font: 700 var(--step-2)/1 var(--font-heading); position: absolute; right: var(--space-3); top: var(--space-3); }
.cv-card h3 { font: 600 var(--step-1)/1.22 var(--font-heading); letter-spacing: -0.025em; margin: 0; max-width: 20ch; }
.cv-card > p:last-child { color: #aeb8ca; font-size: var(--step--1); margin: 0.65rem 0 0; }
.cv-card--wide { grid-column: 1 / -1; }
.cv-fact-grid { display: grid; gap: 0.55rem; grid-template-columns: repeat(3, minmax(0, 1fr)); margin: 1rem 0 0; }
.cv-fact-grid div { background: rgba(79,70,229,0.15); border: 1px solid rgba(129,140,248,0.25); border-radius: 0.6rem; padding: 0.65rem; }
.cv-fact-grid dt { color: #b9c5ff; font-size: 0.66rem; font-weight: 850; letter-spacing: 0.08em; text-transform: uppercase; }
.cv-fact-grid dd { color: #fff; font: 650 var(--step-0)/1.15 var(--font-heading); margin: 0.18rem 0 0; }
.cv-highlight-list { display: grid; gap: 0.65rem; list-style: none; margin: 0.85rem 0 0; padding: 0; }
.cv-highlight-list li { border-left: 2px solid var(--color-cyan); display: grid; line-height: 1.35; padding-left: 0.75rem; }
.cv-highlight-list strong { font-size: var(--step--1); font-weight: 750; }
.cv-highlight-list span { color: #aeb8ca; font-size: 0.72rem; margin-top: 0.14rem; }
.cv-skill-list { display: grid; gap: 0.35rem; list-style: none; margin: 0.85rem 0 0; padding: 0; }
.cv-skill-list li { color: #dce2ee; font-size: var(--step--1); padding-left: 1.1rem; position: relative; }
.cv-skill-list li::before { background: var(--color-cyan); border-radius: 50%; content: ""; height: 0.38rem; left: 0; position: absolute; top: 0.66rem; width: 0.38rem; }
.cv-tool-chips { display: flex; flex-wrap: wrap; gap: 0.55rem; list-style: none; margin: 1rem 0 0; padding: 0; }
.cv-tool-chips li { background: rgba(79,70,229,0.18); border: 1px solid rgba(129,140,248,0.35); border-radius: 999px; color: #e5e9ff; font-size: 0.76rem; font-weight: 750; padding: 0.45rem 0.8rem; }
.cv-card--experience { background: linear-gradient(120deg, rgba(37,99,235,0.12), rgba(79,70,229,0.1)); }
.cv-card .cv-experience-meta { color: #dce2ee; font-size: 0.76rem; font-weight: 750; margin: 0.65rem 0 0; text-transform: uppercase; }

.home-section { padding-block: var(--space-5); }
.home-section--light { background: var(--color-bg-light); }
.home-section--white { background: var(--color-surface-light); }
.home-section--dark { background: var(--color-surface-dark); color: var(--color-text-on-dark); }
.section-heading-row { align-items: end; display: flex; gap: var(--space-3); justify-content: space-between; margin-bottom: var(--space-4); }
.home-work-filters { display: flex; flex-wrap: wrap; gap: 0.45rem; margin: calc(-1 * var(--space-2)) 0 var(--space-3); }
.home-work-filters a { align-items: center; border: 1px solid var(--border-light); border-radius: 999px; color: var(--color-muted-light); display: inline-flex; font-size: 0.72rem; font-weight: 800; letter-spacing: 0.05em; min-height: 2.75rem; padding: 0.42rem 0.75rem; text-decoration: none; text-transform: uppercase; }
.home-work-filters a:hover, .home-work-filters .is-current { background: var(--gradient-brand); border-color: transparent; color: #fff; }
.project-grid { display: grid; gap: var(--space-3); grid-template-columns: repeat(3, minmax(0, 1fr)); }
.project-card { background: var(--color-surface-light); border: 1px solid var(--border-light); border-radius: var(--radius-sm); box-shadow: 0 12px 35px rgba(13,20,36,0.07); overflow: hidden; transition: transform var(--motion-fast) ease, box-shadow var(--motion-fast) ease; }
.project-card:hover, .project-card:focus-within { box-shadow: var(--shadow-card); transform: translateY(-3px); }
.project-card__media { aspect-ratio: 4 / 3; background: linear-gradient(135deg, #dde4f4, #f7f8fc); display: block; overflow: hidden; }
.project-card__media img { height: 100%; object-fit: cover; transition: transform var(--motion-section) ease; width: 100%; }
.project-card:hover .project-card__media img, .project-card:focus-within .project-card__media img { transform: scale(1.035); }
.project-card__placeholder { align-items: center; color: var(--color-muted-light); display: flex; height: 100%; justify-content: center; padding: 1rem; text-align: center; }
.project-card__body { padding: var(--space-2); }
.project-card__meta { color: var(--color-muted-light); display: flex; flex-wrap: wrap; font-size: var(--step--1); gap: 0.45rem; margin-bottom: 0.3rem; }
.project-card h3 { font: 750 var(--step-1)/1.2 var(--font-heading); margin: 0; }
.project-card h3 a { text-decoration: none; }
.project-card h3 a:hover { color: var(--color-blue); }
.empty-state { border: 1px dashed #bec7d6; border-radius: var(--radius-md); color: var(--color-muted-light); grid-column: 1 / -1; padding: var(--space-4); text-align: center; }
.home-works__footer { display: flex; justify-content: center; margin-top: var(--space-4); }
.button-link--outline { border-color: var(--color-purple); color: #3730a3; }
.about-grid, .toolkit-grid { display: grid; gap: var(--space-4); grid-template-columns: minmax(0, 0.9fr) minmax(0, 1.1fr); }
.about-grid { border-top: 1px solid var(--border-light); }
.about-grid > * { padding-top: var(--space-4); }
.home-section--toolkit { padding-top: var(--space-3); }
.tool-list { display: grid; gap: 0.8rem; grid-template-columns: repeat(2, minmax(0, 1fr)); list-style: none; margin: 0; padding: 0; }
.tool-list li { align-items: center; background: var(--color-bg-light); border: 1px solid var(--border-light); border-radius: var(--radius-sm); display: flex; gap: 0.85rem; padding: 0.9rem; }
.tool-list__mark { background: var(--color-bg-dark); border: 1px solid rgba(56,189,248,0.42); border-radius: 0.45rem; color: var(--color-cyan); display: grid; flex: 0 0 2.75rem; font-weight: 850; height: 2.75rem; place-items: center; }
.tool-list strong, .tool-list small { display: block; }
.tool-list small { color: var(--color-muted-light); font-size: 0.75rem; line-height: 1.35; }
.journey-list { display: grid; gap: var(--space-3); grid-template-columns: repeat(3, minmax(0, 1fr)); list-style: none; margin: var(--space-4) 0 0; padding: 0; position: relative; }
.journey-list::before { background: linear-gradient(90deg, rgba(129,140,248,0.42), rgba(79,70,229,0.72)); content: ""; height: 1px; left: 2rem; position: absolute; right: 2rem; top: 1.6rem; }
.journey-list li { padding-top: 4.1rem; position: relative; }
.journey-list__number { background: var(--color-surface-dark); border: 1px solid rgba(56,189,248,0.65); border-radius: 50%; color: var(--color-cyan); display: grid; font-size: 0.72rem; font-weight: 850; height: 3.2rem; left: 0; place-items: center; position: absolute; top: 0; width: 3.2rem; z-index: 1; }
.journey-list__next .journey-list__number { background: var(--gradient-brand); border-color: transparent; color: #fff; box-shadow: 0 0 28px rgba(79,70,229,0.54); }
.journey-list h3 { font: 750 var(--step-1)/1.2 var(--font-heading); margin: 0; }
.journey-list p { color: var(--color-muted-dark); margin: 0.5rem 0 0; }
.home-cta { background: linear-gradient(105deg, #0b1742, #151b55 50%, #07142f); color: var(--color-text-on-dark); overflow: hidden; padding-block: var(--space-5); position: relative; text-align: center; }
.home-cta::before { background: conic-gradient(from 215deg, transparent, rgba(129,140,248,0.62), rgba(79,70,229,0.94), transparent 68%); clip-path: polygon(50% 0, 100% 35%, 74% 100%, 10% 82%, 0 24%); content: ""; height: 26rem; opacity: 0.5; position: absolute; right: -4rem; top: -8rem; transform: rotate(18deg); width: 29rem; }
.home-cta .shell { position: relative; z-index: 1; }
.home-cta h2 { font: 800 var(--step-3)/1.05 var(--font-heading); letter-spacing: -0.045em; margin: 0 auto var(--space-2); max-width: 16ch; }
.home-cta p { color: var(--color-muted-dark); margin: 0 auto var(--space-3); max-width: 40rem; }

.site-main { min-height: 55vh; }
.content-surface { padding-block: var(--space-5); }
.prose { max-width: var(--content); }
.prose h1, .archive-hero h1, .project-hero h1 { font: 800 var(--step-3)/1.03 var(--font-heading); letter-spacing: -0.05em; }
.archive-hero { background: var(--color-bg-dark); color: var(--color-text-on-dark); padding-block: var(--space-5) var(--space-4); }
.archive-hero p { color: var(--color-muted-dark); max-width: 40rem; }
.archive-content { padding-block: var(--space-4) var(--space-5); }
.filter-form { align-items: end; display: flex; flex-wrap: wrap; gap: 0.8rem; margin-bottom: var(--space-4); }
.filter-form label { display: grid; font-size: var(--step--1); font-weight: 750; gap: 0.3rem; }
.filter-form select { background: #fff; border: 1px solid #cbd2df; border-radius: 999px; min-height: 2.9rem; padding: 0.55rem 2.5rem 0.55rem 1rem; }
.filter-form button { background: var(--color-ink); border: 0; border-radius: 999px; color: #fff; cursor: pointer; min-height: 2.9rem; padding: 0.55rem 1.1rem; }
.pagination { margin-top: var(--space-4); }
.pagination .nav-links { display: flex; flex-wrap: wrap; gap: 0.5rem; }
.pagination a, .pagination span { border: 1px solid #ccd4e1; border-radius: 999px; min-width: 2.7rem; padding: 0.45rem 0.8rem; text-align: center; text-decoration: none; }
.pagination .current { background: var(--color-ink); color: #fff; }

.project-hero { background: var(--color-bg-dark); color: var(--color-text-on-dark); padding-block: var(--space-4); }
.project-hero__meta { color: var(--color-muted-dark); display: flex; flex-wrap: wrap; gap: 0.6rem; }
.project-hero__image { border-radius: var(--radius-md); margin-top: var(--space-3); overflow: hidden; }
.project-body { padding-block: var(--space-5); }
.project-body__intro { display: grid; gap: var(--space-4); grid-template-columns: 0.7fr 1.3fr; margin-bottom: var(--space-5); }
.project-facts { background: var(--color-surface-light); border-radius: var(--radius-md); box-shadow: var(--shadow-card); height: fit-content; padding: var(--space-3); }
.project-facts dt { color: var(--color-muted-light); font-size: var(--step--1); font-weight: 750; text-transform: uppercase; }
.project-facts dd { margin: 0 0 1rem; }
.case-section { border-top: 1px solid #dce2ec; display: grid; gap: var(--space-3); grid-template-columns: minmax(12rem, 0.65fr) minmax(0, 1.35fr); padding-block: var(--space-4); }
.case-section h2 { font: 750 var(--step-2)/1.1 var(--font-heading); margin: 0; }
.case-section__content > :first-child { margin-top: 0; }
.attachment-grid { display: grid; gap: var(--space-2); grid-template-columns: repeat(2, minmax(0, 1fr)); }
.attachment-grid figure { margin: 0; }
.video-embed { aspect-ratio: 16 / 9; background: #000; border: 0; width: 100%; }
.project-video { aspect-ratio: 16 / 9; background: #000; border-radius: var(--radius-sm); display: block; height: auto; max-height: 80vh; width: 100%; }
.project-navigation { border-top: 1px solid #dce2ec; display: grid; gap: var(--space-2); grid-template-columns: repeat(2, 1fr); padding-top: var(--space-4); }
.project-navigation a { background: #fff; border-radius: var(--radius-sm); padding: var(--space-2); text-decoration: none; }
.project-navigation a:last-child { text-align: right; }

.site-footer { background: #030615; border-top: 1px solid var(--border-dark); color: var(--color-text-on-dark); margin: 0 !important; max-width: none !important; padding-block: var(--space-5) var(--space-3); width: 100% !important; }
.site-footer__grid { display: grid; gap: var(--space-3); grid-template-columns: 1.5fr 1fr 1fr 1fr; }
.site-footer p { color: var(--color-muted-dark); max-width: 28rem; }
.site-footer__heading { font: 750 var(--step-0)/1.2 var(--font-heading); margin: 0 0 1rem; }
h2, .section-title, .home-cta h2, .case-section h2 { font-weight: 400; }
h3, .project-card h3, .journey-list h3 { font-weight: 400; }
h1, .home-hero h1, .prose h1, .archive-hero h1, .project-hero h1 { font-weight: 400; }
.home-hero h1 { font-weight: 500; }
.site-footer__links { list-style: none; margin: 0; padding: 0; }
.site-footer__links a { align-items: center; color: var(--color-muted-dark); display: inline-flex; font-size: var(--step--1); min-height: 2.75rem; text-decoration: none; }
.site-footer__links a:hover { color: var(--color-cyan); }
.site-footer__legal { border-top: 1px solid rgba(255,255,255,0.12); margin-top: var(--space-4); padding-top: var(--space-2); }

@media (max-width: 1024px) {
  .project-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .site-footer__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .header-cta { display: none; }
}

@media (max-width: 768px) {
  body.admin-bar .site-header { top: 46px; }
  .site-nav__toggle { display: block; }
  .site-nav { background: var(--color-bg-dark); display: none; inset: 4.75rem 0 auto; padding: 1rem; position: absolute; }
  .is-nav-open .site-nav { display: block; }
  .site-nav__list { align-items: stretch; flex-direction: column; gap: 0; }
  .site-nav a { display: flex; min-height: 2.75rem; padding: 0.7rem 0; }
  .is-nav-open .site-nav__toggle-line:first-of-type { transform: translateY(4px) rotate(45deg); }
  .is-nav-open .site-nav__toggle-line:last-of-type { transform: translateY(-4px) rotate(-45deg); }
  .home-hero__grid, .cv-section__heading, .cv-infographic, .about-grid, .toolkit-grid, .project-body__intro, .case-section { grid-template-columns: 1fr; }
  .home-hero { min-height: 0; padding-block: 1.1rem 2rem; }
  .home-hero::after { background-size: 4.5rem 4.5rem; -webkit-mask-image: radial-gradient(ellipse 92% 82% at 65% 38%, #000 0%, rgba(0,0,0,0.9) 64%, transparent 100%); mask-image: radial-gradient(ellipse 92% 82% at 65% 38%, #000 0%, rgba(0,0,0,0.9) 64%, transparent 100%); opacity: 0.28; }
  .home-hero__grid { align-items: start; display: grid; min-height: clamp(33rem, 108vw, 42rem); position: relative; }
  .home-hero__copy { grid-area: 1 / 1; isolation: isolate; padding: 1rem 0 0; position: relative; width: min(62%, 23rem); z-index: 4; }
  .home-hero__hello { font-size: 0.72rem; margin-bottom: 0.65rem; }
  .home-hero h1 { font-size: clamp(2.85rem, 10.6vw, 4.45rem); line-height: 0.88; max-width: 6.5ch; text-shadow: 0 0.2rem 1.2rem rgba(5,8,22,0.5); }
  .home-hero h1 span { background: none; color: inherit; filter: none; -webkit-text-fill-color: currentColor; }
  .home-hero__role { font-size: clamp(0.72rem, 2vw, 0.86rem); line-height: 1.35; max-width: 17ch; }
  .home-hero__lead { font-size: 0.75rem; line-height: 1.5; max-width: 22ch; }
  .home-hero__actions { gap: 0.55rem; margin-top: 1.15rem; }
  .home-hero__actions .button-link { font-size: 0.72rem; min-height: 2.6rem; padding: 0.55rem 0.85rem; }
  .home-hero__actions .button-link--ghost { display: none; }
  .home-hero__visual { aspect-ratio: 4 / 5; grid-area: 1 / 1; justify-self: end; margin-right: 0.75rem; margin-top: 1.35rem; max-height: none; overflow: visible; padding: 0.7rem 0.9rem 0; width: 80%; z-index: 1; }
  .home-hero__backdrop { inset: 4% 3% 1%; transform: translateX(-0.8rem); -webkit-mask-image: radial-gradient(ellipse 74% 78% at 43% 47%, #000 0%, #000 52%, rgba(0,0,0,0.72) 67%, rgba(0,0,0,0.25) 82%, transparent 100%); mask-image: radial-gradient(ellipse 74% 78% at 43% 47%, #000 0%, #000 52%, rgba(0,0,0,0.72) 67%, rgba(0,0,0,0.25) 82%, transparent 100%); }
  .home-hero__visual img { height: 100%; margin: 0; object-position: center bottom; transform: scale(1.1); transform-origin: center bottom; width: 100%; -webkit-mask-image: linear-gradient(to bottom, #000 0%, #000 76%, rgba(0,0,0,0.9) 83%, rgba(0,0,0,0.52) 90%, rgba(0,0,0,0.15) 96%, transparent 100%), linear-gradient(to left, transparent 0%, rgba(0,0,0,0.35) 5%, #000 13%, #000 100%); -webkit-mask-composite: source-in; mask-image: linear-gradient(to bottom, #000 0%, #000 76%, rgba(0,0,0,0.9) 83%, rgba(0,0,0,0.52) 90%, rgba(0,0,0,0.15) 96%, transparent 100%), linear-gradient(to left, transparent 0%, rgba(0,0,0,0.35) 5%, #000 13%, #000 100%); mask-composite: intersect; }
  .home-hero__disciplines { background: linear-gradient(145deg, rgba(11,18,36,0.98), rgba(17,26,50,0.94)); border-color: rgba(129,140,248,0.32); box-shadow: 0 1.2rem 2.5rem rgba(0,0,0,0.32), 0 0 2rem rgba(37,99,235,0.12); grid-template-columns: 1fr; margin-top: -5.4rem; width: min(calc(100% - 2rem), 31rem); }
  .home-hero__disciplines span { justify-content: flex-start; padding-inline: 1rem; }
  .home-hero__disciplines span + span { border-left: 0; border-top: 1px solid var(--border-dark); }
  .cv-profile-card { display: grid; gap: 0 var(--space-3); grid-template-columns: minmax(10rem, 0.72fr) minmax(0, 1.28fr); }
  .cv-profile-card__portrait { grid-row: 1 / span 5; margin: calc(-1 * var(--space-3)) 0 calc(-1 * var(--space-3)) calc(-1 * var(--space-3)); }
  .cv-profile-card .cv-card__kicker { align-self: end; margin-top: 0; }
  .journey-list { grid-template-columns: 1fr; }
  .journey-list::before { bottom: 1rem; height: auto; left: 1.6rem; right: auto; top: 1rem; width: 1px; }
  .journey-list li { padding: 0 0 var(--space-3) 4.6rem; }
  .section-heading-row { align-items: flex-start; flex-direction: column; }
  .attachment-grid { grid-template-columns: 1fr; }
}

@media (max-width: 520px) {
  .shell { width: min(calc(100% - 1.25rem), var(--shell)); }
  .home-hero__grid { min-height: clamp(31rem, 139vw, 36rem); }
  .home-hero__copy { padding-top: 0.7rem; width: 60%; }
  .home-hero h1 { font-size: clamp(2.45rem, 10.2vw, 3.25rem); }
  .home-hero__lead { font-size: 0.72rem; max-width: 22ch; }
  .home-hero__visual { margin-right: 0.5rem; margin-top: 2rem; width: 73%; }
  .home-hero__visual img { transform: scale(1.03); }
  .home-hero__disciplines { margin-top: -4.6rem; width: calc(100% - 1.25rem); }
  .cv-profile-card, .cv-details, .project-grid, .site-footer__grid, .project-navigation, .tool-list { grid-template-columns: 1fr; }
  .cv-profile-card__portrait { aspect-ratio: 16 / 10; grid-row: auto; margin: calc(-1 * var(--space-3)) calc(-1 * var(--space-3)) var(--space-3); }
  .cv-card--wide { grid-column: auto; }
  .home-work-filters { flex-wrap: nowrap; margin-inline: -0.625rem; overflow-x: auto; padding: 0.15rem 0.625rem 0.6rem; scrollbar-width: thin; }
  .home-work-filters a { flex: 0 0 auto; }
  .project-navigation a:last-child { text-align: left; }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { animation-duration: 0.01ms !important; animation-iteration-count: 1 !important; scroll-behavior: auto !important; transition-duration: 0.01ms !important; }
}