:root {
  --bg: #f0eee8;
  --ink: #181817;
  --muted: #6a6963;
  --line: #cac8c1;
  --paper: #e5e2da;
  --accent: #ee5635;
  --invert: #f0eee8;
  --selection: #ee5635;
}

[data-theme="dark"] {
  --bg: #151514;
  --ink: #eeece6;
  --muted: #a5a39b;
  --line: #4b4a46;
  --paper: #222220;
  --accent: #ff714f;
  --invert: #151514;
  --selection: #ff714f;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
  margin: 0;
  overflow-x: hidden;
  color: var(--ink);
  background: var(--bg);
  font-family: "DM Sans", Arial, sans-serif;
  -webkit-font-smoothing: antialiased;
  transition: background-color .35s ease, color .35s ease;
}
body.intro-active { overflow: hidden; }
::selection { background: var(--selection); color: white; }
a { color: inherit; text-decoration: none; }
button { color: inherit; font: inherit; }

.noise { position: fixed; z-index: 20; inset: 0; pointer-events: none; opacity: .035; background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.7'/%3E%3C/svg%3E"); }
.cursor-glow { position: fixed; z-index: 0; width: 380px; height: 380px; border-radius: 50%; pointer-events: none; background: radial-gradient(circle, color-mix(in srgb, var(--accent) 6%, transparent), transparent 68%); transform: translate(-50%, -50%); opacity: 0; transition: opacity .4s; }
body:has(.site-header:hover) .cursor-glow { opacity: 1; }
.site-intro { position:fixed; z-index:100; inset:0; display:grid; padding:clamp(20px,3vw,44px); grid-template-rows:auto 1fr auto; color:var(--ink); background:var(--bg); opacity:1; transition:opacity .24s ease, visibility .24s ease; }.site-intro::before { position:absolute; top:50%; right:clamp(20px,3vw,44px); left:clamp(20px,3vw,44px); height:1px; content:""; background:var(--line); transform:scaleX(0); transform-origin:left; transition:transform .28s cubic-bezier(.2,.7,.2,1) .03s; }.site-intro.is-ready::before { transform:scaleX(1); }.site-intro.is-hidden { visibility:hidden; pointer-events:none; opacity:0; }.intro-meta,.intro-foot { position:relative; z-index:1; display:flex; justify-content:space-between; font-family:"DM Mono",monospace; font-size:10px; letter-spacing:.06em; }.intro-center { z-index:1; display:flex; align-items:center; justify-content:center; flex-direction:column; align-self:center; gap:17px; opacity:0; transform:translateY(7px); transition:opacity .22s ease .05s,transform .22s cubic-bezier(.2,.7,.2,1) .05s; }.site-intro.is-ready .intro-center { opacity:1; transform:translateY(0); }.intro-monogram { display:grid; width:clamp(70px,8vw,106px); height:clamp(70px,8vw,106px); grid-template-columns:1fr 1fr; border:1px solid var(--ink); border-radius:50%; overflow:hidden; font-family:"DM Mono",monospace; font-size:clamp(17px,1.7vw,24px); line-height:clamp(68px,8vw,104px); text-align:center; }.intro-monogram span + span { border-left:1px solid var(--ink); }.intro-center p { margin:0; font-family:"DM Mono",monospace; font-size:10px; letter-spacing:.11em; }
.section-shell { position: relative; z-index: 1; width: min(1440px, 100%); margin-inline: auto; padding-inline: 44px; }

.site-header { position: absolute; z-index: 10; top: 0; left: 50%; display: flex; align-items: center; justify-content: space-between; width: min(1440px, 100%); min-height: 104px; padding: 25px 44px; transform: translateX(-50%); }
.monogram { display: grid; grid-template-columns: 1fr 1fr; width: 45px; height: 45px; border: 1px solid var(--ink); border-radius: 50%; overflow: hidden; font-family: "DM Mono", monospace; font-size: 12px; line-height: 43px; text-align: center; transition: background .25s, color .25s, transform .25s; }
.monogram span + span { border-left: 1px solid var(--ink); }
.monogram:hover { color: var(--bg); background: var(--ink); transform: rotate(12deg); }
.monogram:hover span + span { border-color: var(--bg); }
.main-nav { display: flex; gap: clamp(24px, 4vw, 62px); margin-left: 90px; font-family: "DM Mono", monospace; font-size: 11px; letter-spacing: .04em; }
.main-nav a, .header-tools button { position: relative; }
.main-nav a::after { position: absolute; right: 0; bottom: -5px; left: 0; height: 1px; content: ""; background: var(--ink); transform: scaleX(0); transform-origin: right; transition: transform .25s; }
.main-nav a:hover::after { transform: scaleX(1); transform-origin: left; }
.header-tools { display: flex; align-items: center; gap: 16px; font-family: "DM Mono", monospace; font-size: 11px; }
.header-tools button { border: 0; background: transparent; cursor: pointer; padding: 5px; }
.language-option { padding-bottom: 2px; border-bottom: 1px solid transparent; }
.language-option.is-active { border-color: var(--ink); }
.language-separator { margin: 0 3px; color: var(--muted); }
.theme-toggle { width: 30px; height: 30px; padding: 0 !important; border: 1px solid var(--line) !important; border-radius: 50% !important; font-size: 14px; transition: transform .35s, border-color .25s; }
.theme-toggle:hover { border-color: var(--ink) !important; transform: rotate(180deg); }
.theme-symbol-dark { display: none; }
[data-theme="dark"] .theme-symbol-light { display: none; }
[data-theme="dark"] .theme-symbol-dark { display: inline; }
.menu-toggle, .mobile-menu { display: none; }

.hero { display: flex; min-height: 100svh; padding-top: 136px; padding-bottom: 26px; flex-direction: column; }
.hero-meta, .hero-foot, .section-heading, .contact-top { display: flex; align-items: center; justify-content: space-between; }
.eyebrow, .hero-index, .hero-foot, .visual-label, .project-number, .contact-bottom { font-family: "DM Mono", monospace; font-size: 10px; letter-spacing: .06em; }
.eyebrow { display: flex; align-items: center; gap: 7px; margin: 0; }
.pulse-dot { width: 7px; height: 7px; border-radius: 50%; background: var(--accent); box-shadow: 0 0 0 0 color-mix(in srgb, var(--accent) 55%, transparent); animation: pulse 2.5s infinite; }
@keyframes pulse { 70% { box-shadow: 0 0 0 7px transparent; } 100% { box-shadow: 0 0 0 0 transparent; } }
.hero-index { margin: 0; color: var(--muted); }
.hero-main { display: grid; grid-template-columns: minmax(0, 1fr) 205px; align-items: end; gap: 34px; margin-top: auto; }
.hero-title { max-width: 1070px; margin: 0; font-size: clamp(56px, 8.25vw, 126px); font-weight: 500; letter-spacing: -.07em; line-height: .89; }
.hero-title span, .hero-title em { display: block; }
.hero-title em { margin-left: clamp(30px, 9vw, 155px); font-family: "Playfair Display", serif; font-weight: 500; letter-spacing: -.075em; }
.hero-side { padding-bottom: 8px; }
.hero-side p, .section-heading > p, .about-copy p, .contact-top > p { margin: 0; color: var(--muted); font-size: 14px; line-height: 1.48; }
.text-link { display: inline-flex; align-items: center; gap: 13px; margin-top: 29px; font-family: "DM Mono", monospace; font-size: 10px; letter-spacing: .04em; }
.text-link b { display: grid; width: 25px; height: 25px; place-items: center; border: 1px solid var(--ink); border-radius: 50%; font-size: 13px; font-weight: 400; transition: transform .25s, background .25s, color .25s; }
.text-link:hover b { color: var(--bg); background: var(--ink); transform: rotate(-45deg); }
.hero-graphic { width: min(850px, 76%); margin-top: clamp(42px, 6vw, 88px); margin-left: auto; }
.hero-graphic svg { display: block; width: 100%; overflow: visible; }
.graph-line { stroke: var(--ink); stroke-width: 2; }
.graph-line--thin { stroke-width: 1; opacity: .38; }
.graph-point { fill: var(--bg); stroke: var(--ink); stroke-width: 2; }
.graph-point--accent { fill: var(--accent); stroke: var(--accent); }
.graph-corner { stroke: var(--ink); stroke-width: 1; }
.graph-text { fill: var(--muted); font-family: "DM Mono", monospace; font-size: 10px; letter-spacing: 1px; }
.hero-foot { margin-top: auto; padding-top: 22px; color: var(--muted); border-top: 1px solid var(--line); }
.hero-foot p { margin: 0; }
.scroll-cue { display: flex; align-items: center; gap: 9px; }
.scroll-cue span:first-child { color: var(--ink); font-size: 15px; animation: nudge 1.5s ease-in-out infinite; }
@keyframes nudge { 50% { transform: translateY(4px); } }

.now { padding-top:clamp(100px,11vw,165px); padding-bottom:clamp(100px,11vw,165px); border-top:1px solid var(--line); }
.now-meta { display:flex; align-items:center; justify-content:space-between; }.now-status { margin:0; color:var(--accent); font-family:"DM Mono",monospace; font-size:10px; letter-spacing:.06em; }
.now-main { display:grid; margin-top:clamp(66px,8vw,120px); grid-template-columns:1.35fr .62fr; gap:14%; }.now-main h2 { max-width:810px; margin:0; font-size:clamp(42px,5.5vw,83px); font-weight:500; letter-spacing:-.07em; line-height:.9; }.now-main h2 i { color:var(--accent); font-family:"Playfair Display",serif; font-weight:500; }.now-copy { max-width:375px; }.now-copy > p { margin:0; color:var(--muted); font-size:16px; line-height:1.48; }.now-points { display:grid; margin-top:31px; border-top:1px solid var(--ink); }.now-points span { padding:10px 0; border-bottom:1px solid var(--line); font-family:"DM Mono",monospace; font-size:10px; letter-spacing:.04em; }.now-points span::before { margin-right:9px; color:var(--accent); content:"↗"; }

.selected { padding-top: clamp(140px, 15vw, 230px); padding-bottom: clamp(110px, 12vw, 180px); }
.section-heading { display: grid; grid-template-columns: 1fr 1.2fr .55fr; align-items: start; padding-bottom: 70px; }
.section-heading h2, .about-body h2 { margin: 0; font-size: clamp(34px, 4vw, 65px); font-weight: 500; letter-spacing: -.06em; line-height: .98; }
.section-heading > p { padding-top: 5px; }
.project-list { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 20px; }
.project { position: relative; }
.project a { display: block; }
.project-number { position: absolute; z-index: 2; top: 16px; left: 17px; color: var(--muted); }
.project-status { position: absolute; z-index: 2; top: 16px; right: 17px; color: #c0beb7; font-family: "DM Mono", monospace; font-size: 9px; letter-spacing: .08em; }
.project-visual { position: relative; overflow: hidden; aspect-ratio: 16 / 9; min-height: 0; background: #151514; transition: transform .45s cubic-bezier(.2,.7,.2,1); }
.project-image { display: block; width: 100%; height: 100%; object-fit: contain; }
.project:hover .project-visual { transform: translateY(-7px); }
.assistant-visual { color: #eeece6; background: #181817; }
.assistant-rail { position: absolute; width: 86%; height: 1px; background: linear-gradient(90deg, transparent, #6c6b66 15%, #6c6b66 85%, transparent); }.assistant-rail--left { top: 31%; left: -17%; transform: rotate(24deg); }.assistant-rail--right { right: -17%; bottom: 28%; transform: rotate(-24deg); }
.assistant-orbit { position: absolute; top: 50%; left: 50%; border: 1px solid #4d4c47; border-radius: 50%; transform: translate(-50%, -50%); }.assistant-orbit--one { width: 225px; height: 225px; }.assistant-orbit--two { width: 390px; height: 390px; border-color: #33322f; }
.assistant-core { position: absolute; top: 50%; left: 50%; display: grid; width: 96px; height: 96px; place-items: center; border: 1px solid #eeece6; border-radius: 50%; background: var(--accent); box-shadow: 0 0 0 11px #181817; color: #181817; font-size: 27px; font-weight: 700; letter-spacing: -.08em; transform: translate(-50%, -50%); }.assistant-core i { position: absolute; right: 7px; bottom: 10px; color: #eeece6; font-size: 20px; font-style: normal; }
.channel-label { position: absolute; z-index: 1; padding: 4px 7px; border: 1px solid #484741; color: #afada6; background: #222220; font-family: "DM Mono", monospace; font-size: 9px; letter-spacing: .06em; }.channel-label--one { top: 23%; left: 12%; }.channel-label--two { top: 47%; right: 7%; }.channel-label--three { bottom: 17%; left: 19%; }
.core-visual { color: #f1eee7; background: #272725; }
.core-grid { position: absolute; inset: 0; opacity: .18; background-image: linear-gradient(#e6e1d8 1px, transparent 1px), linear-gradient(90deg, #e6e1d8 1px, transparent 1px); background-size: 43px 43px; mask-image: linear-gradient(90deg, transparent, black 23%, black 80%, transparent); }
.core-word { position: absolute; top: 50%; left: 50%; font-size: clamp(66px, 9vw, 140px); font-weight: 600; letter-spacing: -.11em; line-height: .72; text-align: center; transform: translate(-50%, -50%); }
.core-word i { color: var(--accent); font-family: "Playfair Display", serif; font-weight: 500; }
.cross { position: absolute; color: var(--accent); font-size: 26px; font-weight: 400; }.cross--one { top: 18%; left: 17%; }.cross--two { right: 15%; bottom: 18%; color: #f1eee7; }
.visual-label { position: absolute; right: 18px; bottom: 16px; color: #a3a19d; }
.quant-visual { color:#eeece6; background:#111210; }.quant-grid { position:absolute; inset:0; opacity:.26; background-image:linear-gradient(#585952 1px,transparent 1px),linear-gradient(90deg,#585952 1px,transparent 1px); background-size:54px 54px; mask-image:linear-gradient(to bottom,transparent,black 24%,black); }.quant-visual svg { position:absolute; right:0; bottom:23px; left:0; width:100%; height:auto; }.quant-visual path { fill:none; stroke:var(--accent); stroke-width:2.1; vector-effect:non-scaling-stroke; }.quant-visual .quant-line--muted { stroke:#8f9089; stroke-width:1; opacity:.58; }.quant-word { position:absolute; top:18%; left:9%; font-family:"DM Mono",monospace; font-size:clamp(26px,3.6vw,54px); letter-spacing:-.08em; }.quant-word span { display:block; margin-left:clamp(32px,5vw,76px); color:var(--accent); font-family:"Playfair Display",serif; font-style:italic; }.quant-axis { position:absolute; bottom:18px; left:18px; color:#8f9089; font-family:"DM Mono",monospace; font-size:9px; letter-spacing:.08em; }.project-status--quant { color:#a6a59f; }
.eco-visual { color: #19231c; background: #d5d2c5; }
.eco-sun { position: absolute; top: 15%; right: 16%; width: 95px; height: 95px; border: 1px solid #2c3a30; border-radius: 50%; background: #dc6e45; }.eco-slope { position: absolute; width: 135%; height: 75%; background: #5e7764; transform: rotate(-17deg); transform-origin: 0 100%; }.eco-slope--back { top: 43%; left: -15%; background: #a5b195; }.eco-slope--front { top: 63%; left: -28%; background: #314b3c; }
.eco-title { position: absolute; z-index: 2; top: 49%; left: 11%; color: #f4f0e5; font-size: clamp(62px, 7vw, 103px); font-weight: 600; letter-spacing: -.11em; line-height: .68; }.eco-title i { color: #d7b259; font-family: "Playfair Display", serif; font-weight: 500; }
.eco-coordinate { position: absolute; z-index: 2; bottom: 17%; left: 11%; color: #d8ded0; font-family: "DM Mono", monospace; font-size: 9px; letter-spacing: .07em; }
.perspective-visual { background: #c9c6bd; }
[data-theme="dark"] .perspective-visual { background: #9d9b94; }
.plane { position: absolute; display: block; width: 150%; height: 65%; background: #171716; transform: rotate(-28deg) skewX(-21deg); transform-origin: 0 0; }.plane--a { top: 20%; left: -22%; }.plane--b { top: 57%; left: 25%; background: var(--accent); }.plane--c { top: -10%; left: 67%; background: #e9e7df; }
.perspective-copy { position: absolute; top: 43%; left: 50%; z-index: 2; color: #f0eee8; font-size: clamp(34px, 4vw, 59px); font-weight: 600; letter-spacing: -.09em; line-height: .78; transform: translate(-50%, -50%) rotate(-4deg); }.perspective-copy i { color: var(--accent); font-family: "Playfair Display", serif; font-weight: 500; }
.project-caption { display: grid; grid-template-columns: 1.15fr 1fr 25px; gap: 20px; padding: 19px 3px 0; }.project-caption h3 { margin: 0 0 4px; font-size: 16px; font-weight: 600; letter-spacing: -.03em; }.project-caption p { margin: 0; color: var(--muted); font-family: "DM Mono", monospace; font-size: 10px; line-height: 1.4; }.project-caption .project-description { font-family: "DM Sans", sans-serif; font-size: 13px; }.arrow-link { display: grid; width: 25px; height: 25px; place-items: center; border: 1px solid var(--line); border-radius: 50%; font-size: 14px; transition: color .25s, background .25s, border-color .25s; }.project:hover .arrow-link { color: var(--bg); border-color: var(--ink); background: var(--ink); }
.project--github { grid-column:1 / -1; }.project--github .project-visual { aspect-ratio:2171 / 724; min-height:0; }.project--github .project-caption { grid-template-columns:1.15fr 1.45fr 25px; }

.stack { padding-top:clamp(100px,11vw,165px); padding-bottom:clamp(110px,12vw,180px); color:#eeece6; background:#151514; }.stack-heading { display:grid; grid-template-columns:1fr 1.2fr .55fr; align-items:start; padding-bottom:clamp(55px,7vw,90px); }.stack-heading .eyebrow { color:#a5a39b; }.stack-heading h2 { margin:0; font-size:clamp(34px,4vw,65px); font-weight:500; letter-spacing:-.06em; line-height:.98; }.stack-heading h2 i { color:var(--accent); font-family:"Playfair Display",serif; font-weight:500; }.stack-heading > p { max-width:300px; margin:5px 0 0; color:#a5a39b; font-size:14px; line-height:1.48; }.tech-grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); border-top:1px solid #454540; border-left:1px solid #454540; }.tech-card { display:grid; min-height:190px; padding:31px 28px 24px; align-content:space-between; border-right:1px solid #454540; border-bottom:1px solid #454540; }.tech-icon { position:relative; display:grid; width:48px; height:48px; place-items:center; color:#8f8e89; font-family:"DM Mono",monospace; font-size:12px; }.tech-icon img { position:absolute; inset:6px; width:36px; height:36px; object-fit:contain; filter:grayscale(1) invert(.64); opacity:.78; transition:filter .28s ease,opacity .28s ease; }.tech-card:hover .tech-icon img { filter:grayscale(.28) saturate(.62) brightness(.92); opacity:.9; }.tech-card:nth-child(5):hover .tech-icon img { filter:grayscale(1) invert(.72); }.tech-card h3 { margin:30px 0 4px; font-size:14px; font-weight:600; letter-spacing:-.025em; }.tech-card p { margin:0; color:#8f8e89; font-family:"DM Mono",monospace; font-size:9px; letter-spacing:.04em; }

.about { padding-top: clamp(105px, 11vw, 165px); padding-bottom: clamp(110px, 12vw, 170px); border-top: 1px solid var(--line); }
.about-top { display: flex; justify-content: space-between; }.about-signature { margin: -14px 2% 0 0; color: var(--accent); font-family: "Playfair Display", serif; font-size: 39px; font-style: italic; transform: rotate(-12deg); }
.about-body { display: grid; grid-template-columns: 1.35fr .63fr; gap: 14%; margin-top: 104px; }.about-body h2 { max-width: 690px; }.about-copy { max-width: 370px; }.about-copy p + p { margin-top: 22px; }
.principles { display: grid; grid-template-columns: repeat(3, 1fr); gap: 25px; margin-top: clamp(100px, 12vw, 175px); }.principles > div { padding-top: 12px; border-top: 1px solid var(--ink); }.principles span { color: var(--muted); font-family: "DM Mono", monospace; font-size: 10px; }.principles p { margin: 38px 0 0; font-size: clamp(18px, 2vw, 27px); letter-spacing: -.045em; line-height: 1.04; }

.journey { display:grid; padding-top:clamp(105px,11vw,165px); padding-bottom:clamp(115px,13vw,190px); grid-template-columns:minmax(280px,.78fr) minmax(0,1.22fr); align-items:start; gap:clamp(65px,10vw,155px); border-top:1px solid var(--line); }.journey-heading { position:sticky; top:54px; }.journey-heading h2 { max-width:590px; margin:clamp(55px,7vw,92px) 0 0; font-size:clamp(38px,4.8vw,70px); font-weight:500; letter-spacing:-.07em; line-height:.94; }.journey-heading h2 i { color:var(--accent); font-family:"Playfair Display",serif; font-weight:500; }.journey-intro { max-width:320px; margin:30px 0 0; color:var(--muted); font-size:14px; line-height:1.5; }.journey-list { position:relative; margin:0; padding:0; list-style:none; }.journey-list::before { position:absolute; top:17px; bottom:17px; left:16px; width:1px; content:""; background:var(--line); }.journey-list li { position:relative; display:grid; padding:0 0 clamp(45px,6vw,76px); grid-template-columns:34px minmax(0,1fr); gap:clamp(24px,3vw,42px); }.journey-list li:last-child { padding-bottom:0; }.journey-marker { position:relative; z-index:1; display:grid; width:34px; height:34px; place-items:center; border:1px solid var(--ink); border-radius:50%; color:var(--ink); background:var(--bg); font-family:"DM Mono",monospace; font-size:9px; transition:color .25s,background .25s; }.journey-list li:hover .journey-marker { color:var(--bg); background:var(--ink); }.journey-list li>div { padding:1px 0 clamp(32px,4vw,52px); border-bottom:1px solid var(--line); }.journey-list li:last-child>div { padding-bottom:0; border-bottom:0; }.journey-age { display:block; margin-bottom:14px; color:var(--accent); font-family:"DM Mono",monospace; font-size:10px; letter-spacing:.06em; }.journey-list h3 { margin:0; font-size:clamp(23px,2.5vw,36px); font-weight:500; letter-spacing:-.05em; }.journey-list p { max-width:620px; margin:17px 0 0; color:var(--muted); font-size:15px; line-height:1.55; }

.statement { padding-top: clamp(100px, 11vw, 160px); padding-bottom: clamp(110px, 13vw, 190px); color: var(--bg); background: var(--ink); }.statement::before { position: absolute; top: 0; right: 44px; left: 44px; height: 1px; content: ""; background: color-mix(in srgb, var(--bg) 25%, transparent); }.statement-mark { margin: 0 0 28px; color: var(--accent); font-family: "Playfair Display", serif; font-size: 50px; line-height: .5; }.statement blockquote { max-width: 1160px; margin: 0; font-size: clamp(37px, 5vw, 78px); font-weight: 500; letter-spacing: -.065em; line-height: .98; }.statement-author { margin: 34px 0 0; color: color-mix(in srgb, var(--bg) 55%, transparent); font-family: "DM Mono", monospace; font-size: 10px; }

.contact { padding-top: 84px; padding-bottom: 36px; }.contact-top { align-items: start; }.contact-top > p { max-width: 278px; }.contact-mail { display: flex; flex-wrap: wrap; align-items: baseline; gap: 0 16px; width: max-content; max-width: 100%; margin: clamp(80px, 10vw, 140px) 0; border-bottom: 2px solid var(--ink); font-size: clamp(31px, 5.8vw, 82px); font-weight: 500; letter-spacing: -.085em; line-height: .9; overflow-wrap: anywhere; transition: color .25s, border-color .25s; }.contact-mail i { font-family: "Playfair Display", serif; font-weight: 500; }.contact-mail span { font-family: "DM Sans", sans-serif; font-size: .42em; letter-spacing: 0; }.contact-mail:hover { color: var(--accent); border-color: var(--accent); }.contact-bottom { display: grid; grid-template-columns: repeat(4, 1fr) auto; gap: 20px; padding-top: 20px; border-top: 1px solid var(--line); }.contact-bottom p { margin: 0 0 6px; color: var(--muted); }.contact-bottom span, .contact-bottom a { font-size: 11px; }.contact-bottom a:hover { color: var(--accent); }.back-top { display: grid; width: 31px; height: 31px; place-items: center; border: 1px solid var(--ink); border-radius: 50%; font-size: 16px !important; transition: color .25s, background .25s, transform .25s; }.back-top:hover { color: var(--bg) !important; background: var(--ink); transform: translateY(-3px); }

.reveal { opacity: 0; transform: translateY(20px); transition: opacity .75s ease, transform .75s cubic-bezier(.2,.7,.2,1); }.reveal.is-visible { opacity: 1; transform: translateY(0); }.hero .reveal:nth-child(2) { transition-delay: .12s; }.hero .reveal:nth-child(3) { transition-delay: .22s; }

@media (max-width:760px) { .site-intro { padding:20px; }.site-intro::before { right:20px; left:20px; }.intro-meta,.intro-foot,.intro-center p { font-size:8px; }.intro-center { gap:13px; } }

@media (max-width:1000px) and (min-width:761px) { .main-nav { margin-left:20px; gap:18px; }.tech-grid { grid-template-columns:repeat(3,minmax(0,1fr)); }.stack-heading { grid-template-columns:.8fr 1.25fr .65fr; gap:24px; }.journey { grid-template-columns:minmax(240px,.7fr) minmax(0,1.3fr); gap:50px; } }

@media (max-width: 760px) {
  .section-shell { padding-inline: 20px; }.site-header { min-height: 82px; padding: 18px 20px; }.main-nav { display: none; }.header-tools { gap: 8px; }.language-toggle { margin-right: 1px; }.menu-toggle { display: flex; width: 30px; height: 30px; flex-direction: column; justify-content: center; gap: 6px; padding: 6px !important; }.menu-toggle i { display: block; width: 18px; height: 1px; background: var(--ink); transition: transform .25s; }.menu-toggle.is-open i:first-child { transform: translateY(3.5px) rotate(45deg); }.menu-toggle.is-open i:last-child { transform: translateY(-3.5px) rotate(-45deg); }.mobile-menu { position: fixed; z-index: 8; top: 70px; right: 20px; left: 20px; display: flex; visibility: hidden; padding: 25px; flex-direction: column; gap: 18px; border: 1px solid var(--line); background: var(--bg); box-shadow: 0 16px 30px rgba(0,0,0,.06); font-family: "DM Mono", monospace; font-size: 12px; opacity: 0; transform: translateY(-12px); transition: .25s; }.mobile-menu.is-open { visibility: visible; opacity: 1; transform: translateY(0); }.hero { min-height: 780px; padding-top: 113px; }.hero-meta { justify-content: flex-start; align-items: flex-start; gap: 10px; }.hero-meta .eyebrow, .hero-meta .hero-index { font-size: 9px; white-space: nowrap; }.hero-main { grid-template-columns: 1fr; margin-top: auto; gap: 27px; }.hero-title { font-size: clamp(45px, 12.1vw, 64px); }.hero-title em { margin-left: 26px; }.hero-side { display: grid; grid-template-columns: 1fr 1fr; gap: 20px; padding-right: 4px; }.text-link { justify-self: end; margin-top: 0; align-self: end; }.text-link span { display: none; }.hero-graphic { width: 100%; margin-top: 41px; }.hero-graphic svg { min-height: 105px; }.hero-foot { font-size: 8px; }.hero-foot > p:first-child { max-width: 85px; }.now { padding-top:80px; padding-bottom:80px; }.now-main { margin-top:54px; grid-template-columns:1fr; gap:34px; }.now-main h2 { font-size:48px; }.now-copy { max-width:430px; }.now .text-link { justify-self:start; margin-top:26px; }.now .text-link span { display:inline; }.selected { padding-top: 119px; }.section-heading { grid-template-columns: 1fr; gap: 25px; padding-bottom: 47px; }.section-heading > p { max-width: 305px; }.project-list { grid-template-columns: 1fr; gap: 52px; }.project--github { grid-column:auto; }.project--github .project-caption { grid-template-columns:1fr 1.2fr 25px; }.project-visual { min-height: 330px; }.assistant-orbit--two { width: 340px; height: 340px; }.project-caption { grid-template-columns: 1fr 1.2fr 25px; }.project-caption .project-description { font-size: 12px; }.stack { padding-top:80px; padding-bottom:90px; }.stack-heading { grid-template-columns:1fr; gap:27px; padding-bottom:50px; }.stack-heading>p { max-width:330px; }.tech-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }.tech-card { min-height:160px; padding:23px 18px 18px; }.tech-card h3 { margin-top:24px; }.about { padding-top: 80px; }.about-body { grid-template-columns: 1fr; gap: 34px; margin-top: 75px; }.about-copy { max-width: 440px; }.principles { grid-template-columns: 1fr; gap: 36px; margin-top: 83px; }.principles p { margin-top: 17px; font-size: 25px; }.journey { display:block; padding-top:80px; padding-bottom:100px; }.journey-heading { position:static; }.journey-heading h2 { margin-top:45px; font-size:45px; }.journey-intro { margin-top:22px; }.journey-list { margin-top:62px; }.journey-list li { grid-template-columns:34px 1fr; gap:18px; padding-bottom:45px; }.journey-list li>div { padding-bottom:32px; }.journey-list h3 { font-size:26px; }.journey-list p { margin-top:13px; font-size:14px; }.statement { padding-top: 89px; padding-bottom: 100px; }.statement::before { right: 20px; left: 20px; }.contact { padding-top: 65px; }.contact-top { display: grid; grid-template-columns: 1fr 1fr; gap: 20px; }.contact-mail { margin: 85px 0 80px; padding-bottom: 4px; font-size: 25px; line-height: 1; }.contact-bottom { grid-template-columns: 1fr 1fr auto; row-gap: 30px; }.contact-bottom>div { min-width:0; }.contact-bottom>div a { overflow-wrap:anywhere; }.contact-bottom > div:last-of-type { grid-column: 1 / 2; }.back-top { grid-column: 3; grid-row: 1; }
}

@media (max-width: 760px) {
  .project-visual { min-height: 0; }
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { scroll-behavior: auto !important; animation-duration: .01ms !important; transition-duration: .01ms !important; }
}