/* Retro computing, modern reading surface. */
:root { --bg:#080b09; --panel:#111713; --ink:#eeeee4; --muted:#abb2a7; --accent:#b8ef9f; --blue:#d3c38f; --line:#a7baa32c; --mono:Consolas,'Courier New',monospace; }
body { background:var(--bg); }
body, .button, .header, .capability, .education-card, .timeline-item { -webkit-font-smoothing:antialiased; }
.ambient-stage { position:fixed; inset:0; z-index:0; pointer-events:none; overflow:hidden; background:radial-gradient(ellipse at 72% 25%,#32503320,transparent 52%),#080b09; }
.scene-grid { position:absolute; inset:-10%; background-image:linear-gradient(#94b58e0d 1px,transparent 1px),linear-gradient(90deg,#94b58e0d 1px,transparent 1px); background-size:64px 64px; transform:translate3d(var(--far-x,0px),var(--far-y,0px),0); mask-image:linear-gradient(transparent,#000 40%,transparent); }
#ambient-canvas { position:absolute; inset:0; width:100%; height:100%; opacity:.45; }
.ambient-grain { position:absolute; inset:0; opacity:.07; background-image:radial-gradient(#d9e8d9 .5px,transparent .5px); background-size:3px 3px; }
.scene-terminal { position:absolute; width:255px; padding:15px 18px; border:1px solid #a7baa329; background:#0c120db3; box-shadow:0 18px 60px #0005; border-radius:5px; font:12px/1.8 var(--mono); color:#a9c8a34a; transform:translate3d(var(--mid-x,0px),var(--mid-y,0px),0) rotate(-8deg); }
.scene-terminal b { display:block; font-weight:400; color:#d5cfaf60; padding-bottom:9px; margin-bottom:9px; border-bottom:1px solid #a7baa321; }
.scene-terminal-one { top:20%; right:-55px; }
.scene-terminal-two { top:65%; left:-90px; transform:translate3d(var(--far-x,0px),var(--mid-y,0px),0) rotate(8deg); }
.scene-floppy { position:absolute; right:-70px; top:66%; width:260px; opacity:.35; mix-blend-mode:lighten; transform:translate3d(var(--near-x,0px),var(--near-y,0px),0) rotate(15deg); }
.scene-bokeh { position:absolute; width:12px; height:12px; left:6%; top:40%; background:#d7c98f40; border-radius:50%; filter:blur(4px); transform:translate3d(var(--near-x,0px),var(--near-y,0px),0); }
main,.header,.footer { position:relative; z-index:1; }
.header { height:66px; background:#080b09bc; border-color:var(--line); backdrop-filter:blur(14px); }
.wordmark { color:var(--ink); }
.header nav>a { color:#c3c7bc; }
.nav-contact { border-radius:4px; border-color:#a8b99c50; padding:8px 15px; }
.hero { min-height:470px; padding-block:40px; border-color:var(--line); background:linear-gradient(90deg,#080b09ce,transparent); }
.hero-copy { width:54%; max-width:600px; }
.hero h1 { font-size:clamp(42px,4.55vw,66px); letter-spacing:-.045em; }
.hero .eyebrow { font:12px/1.5 var(--mono); letter-spacing:.6px; margin-bottom:20px; }
.hero-intro { max-width:440px; font-size:17px; line-height:1.65; color:var(--muted); }
.text-shimmer { color:var(--accent); background:none; animation:none; }
.hero-actions { margin-block:24px 18px; }
.button { border-radius:4px; min-height:46px; font-size:14px; translate:var(--mag-x,0px) var(--mag-y,0px); }
.button-primary { color:#131d10; background:#c7e9a9; box-shadow:0 3px 0 #677a5766; }
.button-primary:hover { background:#dbeebf; box-shadow:0 6px 24px #b8ef9f15; }
.button-quiet { background:#11171190; border-color:var(--line); }
.hero-location { color:#919d8b; }
.hero-art { width:53%; max-width:710px; aspect-ratio:1.5; right:-1%; top:49%; transform:translateY(-50%) perspective(1100px) rotateX(var(--crt-rx,0deg)) rotateY(var(--crt-ry,0deg)); translate:var(--crt-x,0px) var(--crt-y,0px); opacity:1; z-index:2; }
.crt-hardware { display:block; width:100%; height:auto; pointer-events:none; user-select:none; mix-blend-mode:lighten; }
.crt-screen { position:absolute; left:22%; top:17%; width:56%; height:47%; padding:5% 5%; overflow:hidden; border-radius:7% / 9%; background:radial-gradient(ellipse,#142217,#050a06 85%); color:#b8ee99; font-family:var(--mono); text-shadow:0 0 6px #9fef7845; box-shadow:inset 0 0 30px #000; }
.crt-screen:before { content:''; position:absolute; inset:0; pointer-events:none; z-index:4; background:repeating-linear-gradient(transparent 0px,transparent 2px,#0003 3px,#0003 4px); opacity:.45; }
.crt-screen:after { content:''; position:absolute; inset:0; pointer-events:none; z-index:5; background:linear-gradient(135deg,#fff0 15%,#faffeb07 35%,#fff0 52%); border-radius:inherit; box-shadow:inset 0 0 18px #000b; }
.crt-screen pre { position:relative; z-index:2; white-space:pre; font:clamp(9px,1.05vw,15px)/1.55 var(--mono); margin:0; letter-spacing:0; text-shadow:-.3px 0 #edbf7850,.3px 0 #72ed9850,0 0 5px #b7e79b30; }
.crt-screen .crt-video { display:none; position:absolute; inset:0; width:100%; height:100%; object-fit:cover; filter:sepia(.3) saturate(.65) contrast(1.1); }
.crt-screen.has-video .crt-video { display:block; }
.crt-screen.has-video pre { display:none; }
.crt-screen.is-glitch { animation:crt-flicker .18s steps(2) 1; }
.crt-controls { display:flex; justify-content:center; gap:10px; position:absolute; bottom:-3%; left:0; right:0; }
.crt-controls button { padding:5px 10px; border:1px solid var(--line); border-radius:3px; background:#101710c9; color:#b3baa9; font:12px var(--mono); cursor:pointer; }
.crt-controls button:hover { color:var(--accent); border-color:#b5d59e90; }
.section { padding-block:34px; background:#080b09b5; }
.section-kicker { margin-bottom:20px; padding-bottom:11px; border-color:var(--line); }
.section-kicker>span { color:#aebba6; font-family:var(--mono); letter-spacing:.8px; }
.section-kicker:after { background:linear-gradient(90deg,transparent,var(--accent),transparent); animation-duration:18s; }
.section-heading h2,.about-copy h2 { font-size:clamp(28px,2.6vw,38px); }
.section-heading h2 em,.about-copy h2 em { color:#b4c39f; }
.about-grid { grid-template-columns:215px minmax(0,1fr); gap:32px; max-width:none; padding:22px; border:1px solid var(--line); border-radius:5px; background:#0e150ef0; box-shadow:inset 0 3px 0 #d2d6b611; }
.portrait-block { max-width:215px; }
.portrait-frame { border-radius:3px; border:1px solid #c3c7b645; filter:saturate(.85); }
.portrait-caption { background:linear-gradient(transparent,#080b0990); }
.portrait-caption small { color:#c7d4bb; }
.about-copy>p { font-size:16px; color:var(--muted); line-height:1.65; }
.about-facts { padding-top:12px; margin-top:15px; border-color:var(--line); }
.about-facts strong { color:#d7dfc8; }
.about-facts span { color:#a8b29e; }
.capabilities { gap:13px; }
.capability { padding:0 19px 19px; border-radius:5px; border:1px solid #7f96754b; background:#10170fe8; overflow:hidden; }
.capability:before { background:radial-gradient(350px circle at var(--mx) var(--my),#cce9a810,transparent 75%); }
.capability:after,.education-card:after { display:none; }
.window-title { display:flex; align-items:center; justify-content:space-between; gap:10px; padding:9px 12px; margin:0 -19px 18px; border-bottom:1px solid #a3b38b30; background:linear-gradient(90deg,#2a3523,#182315); font:12px/1.3 var(--mono); color:#c1cfb4; }
.window-title span:last-child { color:#778b6d; letter-spacing:4px; }
.capability-top { margin-bottom:10px; }
.capability-symbol { color:#d0c48d; font-size:25px; }
.capability h3 { font-size:22px; margin-bottom:10px; }
.capability p { color:var(--muted); margin-bottom:13px; font-size:16px; }
.capability:hover { transform:perspective(1000px) rotateX(var(--tilt-x,0deg)) rotateY(var(--tilt-y,0deg)) translateY(-4px); border-color:#b9d69b90; box-shadow:0 10px 25px #0004; }
.card-tags>span,.tool-chips>span { color:#b4c2a8; background:#cedab708; border-color:#adbca02c; border-radius:3px; }
.process-disclosure { margin-top:17px; border-color:var(--line); }
.process-disclosure>summary { padding-block:14px; }
.process-preview,.workflow-intro .eyebrow { color:#a0b190; }
.workflow-tabs button { color:#a1ae99; }
.workflow-tabs button[aria-selected=true] { color:#dceccd; }
.workflow-tabs button span { background:#111b10; border-color:#718268; }
.workflow-tabs:after { background:var(--accent); box-shadow:none; }
.panel-number { color:#718367; }
.toolkit { border:1px solid var(--line); border-radius:4px; margin-top:20px; background:#0a110bec; padding:0; overflow:hidden; }
.toolkit-heading { padding:11px 16px; margin:0; background:#202a1c; border-bottom:1px solid var(--line); display:flex; align-items:center; flex-wrap:wrap; gap:15px; }
.toolkit-heading h3 { font:14px var(--mono); color:#d1ddc4; margin:0; }
.explorer-path { font:12px var(--mono); color:#95a487; }
.toolkit-grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:0; }
.toolkit details { border:0; border-right:1px solid var(--line); border-radius:0; background:transparent; }
.toolkit details:last-child { border-right:0; }
.toolkit summary { padding:15px 12px; min-height:77px; font-size:14px; color:#c5cfb9; }
.toolkit summary:before { content:'▰'; color:#cabb85; font-size:18px; margin-right:6px; }
.toolkit summary>span { font-size:19px; color:#a2bc8d; }
.toolkit details[open] { background:#192214a0; }
.toolkit .tool-chips { padding:0 12px 15px; }
.timeline { gap:13px; position:relative; }
.timeline-item { padding:20px; background:#0d140ee8; border-radius:4px; border:1px solid var(--line); border-left:3px solid #a5c788; }
.timeline-item:after { background:linear-gradient(90deg,transparent,#aec48655,transparent); }
.timeline-date { font-family:var(--mono); color:#a8bda0; }
.company-heading h3 { font-size:27px; }
.timeline-content h4 { color:#d3d8c8; }
.timeline-content>p:not(.company-note) { color:var(--muted); font-size:16px; line-height:1.6; }
.company-note { color:#94a088!important; }
.education-card { padding:15px 18px; border:1px solid var(--line); border-radius:4px; background:#10170de8; }
.education-meta { color:#adbba0; font-family:var(--mono); }
.education-card h3 { font-size:18px; }
.education-card p { color:#9eae94; }
.contact-section { padding-block:28px; border-color:var(--line); background:linear-gradient(110deg,#1a2515c9,#080b09d9); }
.contact-grid { opacity:.13; }
.contact-content h2 { font-size:34px; }
.contact-email { color:#c3cdb7; }
.contact-email>span:first-child { color:#97a58e; }
.footer { background:#080b09e6; padding-block:18px; padding-right:100px; color:#919d87; border-color:var(--line); }
.footer-links a,.motion-toggle { color:#a5b49c; }
.intro-scene:before,.intro-scene:after { background:#080b09; border-color:#d6e3ad33; }
.intro-monogram,.intro-caption { color:#cbe6af; }
.intro-caption { font-family:var(--mono); }
.intro-light { background:#cde5aa; box-shadow:0 0 20px #cde5aa44; }
.terminal-launcher { position:fixed; z-index:80; right:22px; bottom:20px; width:49px; height:45px; border:1px solid #a4b59170; border-radius:5px; background:#182113e8; backdrop-filter:blur(12px); color:#d0eabc; font:700 18px var(--mono); cursor:pointer; box-shadow:0 6px 25px #0006; }
.terminal-launcher:hover { background:#25301e; box-shadow:0 0 23px #c3ed9515; }
.retro-dialog { padding:0; width:min(680px,calc(100vw - 28px)); max-height:min(580px,85dvh); border:1px solid #aab79b80; border-radius:7px; background:#0b110c; color:#c0d6b0; box-shadow:0 25px 90px #000c; }
.retro-dialog::backdrop { background:#030703aa; backdrop-filter:blur(6px); }
.terminal-bar { display:flex; align-items:center; justify-content:space-between; gap:15px; padding:10px 16px; background:#2a3422; border-bottom:1px solid var(--line); }
.terminal-bar h2 { font:14px var(--mono); margin:0; }
.terminal-close { border:0; background:none; color:#d0ddc3; cursor:pointer; font-size:23px; width:34px; height:30px; }
.terminal-output { padding:16px 19px 4px; height:320px; max-height:48dvh; overflow:auto; scrollbar-color:#506243 #0b110c; font:14px/1.6 var(--mono); }
.terminal-output p { white-space:pre-wrap; overflow-wrap:anywhere; margin:0 0 12px; }
.terminal-output .command-line { color:#e0c78c; }
.terminal-output a { color:#cbeead; text-decoration:underline; }
.terminal-form { display:flex; align-items:center; gap:10px; padding:13px 18px 18px; font:14px var(--mono); }
.terminal-form label { color:#dbc18b; flex-shrink:0; }
.terminal-form input { min-width:0; flex:1; padding:7px 0; border:0; background:none; color:#d4e9c4; font:16px var(--mono); outline-offset:3px; }
.terminal-form button { padding:7px 10px; border:1px solid #66775c; background:#172012; color:#c8dbb9; border-radius:3px; cursor:pointer; }
.terminal-footer { margin:0; padding:0 18px 14px; font:12px var(--mono); color:#788970; }
.custom-cursor { position:fixed; left:0; top:0; width:18px; height:18px; border:1px solid #c8dca889; border-radius:50%; pointer-events:none; z-index:120; opacity:0; transform:translate(-50%,-50%); transition:width .15s,height .15s; }
.cursor-on .custom-cursor { opacity:1; }
.custom-cursor.is-link { width:30px; height:30px; border-color:#c7e6a7; }
.sr-only { position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0; }
@keyframes crt-flicker { 0%,100% { opacity:1; } 30% { opacity:.91; } 65% { opacity:.97; } }
@media(min-width:1550px) { .hero { min-height:510px; } }
@media(max-width:1050px) { .hero-art { width:52%; right:-5%; } .hero-copy { width:61%; } .hero h1 { font-size:clamp(42px,5vw,57px); } }
@media(max-width:800px) { .toolkit-grid { grid-template-columns:1fr 1fr; } .toolkit details:nth-child(2) { border-right:0; } .toolkit details:nth-child(-n+2) { border-bottom:1px solid var(--line); } .about-grid { grid-template-columns:185px minmax(0,1fr); gap:24px; padding:19px; } .capability h3 { font-size:20px; } .scene-terminal { opacity:.5; } }
@media(max-width:700px) {
 .header { height:62px; } .header nav>a:not(.nav-contact) { display:none; }
 .hero { display:flex; flex-direction:column; align-items:stretch; padding-top:28px; padding-bottom:25px; min-height:0; }
 .hero-copy { width:100%; } .hero h1 { font-size:clamp(41px,10vw,57px); margin-bottom:17px; }
 .hero .eyebrow { font-size:12px; letter-spacing:0; } .hero-intro { font-size:16px; }
 .hero-art { position:relative; width:100%; max-width:410px; right:auto; left:auto; top:auto; transform:perspective(1100px) rotateX(var(--crt-rx,0deg)) rotateY(var(--crt-ry,0deg)); margin:8px auto 18px; opacity:1; z-index:2; }
 .crt-screen pre { font-size:clamp(9px,2.35vw,12px); } .crt-controls { bottom:-5%; }
 .scene-terminal,.scene-floppy,.scene-bokeh { display:none; } .scene-grid { opacity:.4; }
 .hero-actions .button { font-size:14px; }
 .about-grid { grid-template-columns:125px minmax(0,1fr); gap:17px; padding:16px; }
 .portrait-block { max-width:none; } .about-copy h2 { font-size:25px; } .about-facts { margin:0; }
 .section { padding-block:28px; } .capability { grid-template-columns:30px minmax(0,1fr); padding:0 16px 16px; }
 .window-title { grid-column:1/-1; margin:0 -16px 16px; } .capability-top { grid-row:2 / span 3; }
 .capability h3 { font-size:21px; } .toolkit summary { min-height:78px; }
 .footer { padding-right:var(--gutter); padding-bottom:80px; } .terminal-launcher { right:16px; bottom:15px; }
 .custom-cursor { display:none; }
 .intro-running .hero-art { animation:none; }
}
@media(max-width:380px) { .about-grid { grid-template-columns:105px minmax(0,1fr); gap:14px; } .about-copy h2 { font-size:23px; } .toolkit-grid { grid-template-columns:1fr; } .toolkit details { border-right:0; border-bottom:1px solid var(--line); } .hero .eyebrow { font-size:12px; } .terminal-form label { font-size:12px; } }
.motion-paused *, .motion-paused *:before, .motion-paused *:after, .motion-hidden *, .motion-hidden *:before, .motion-hidden *:after { animation-play-state:paused!important; }
.motion-paused .button { translate:none; }
.motion-paused .custom-cursor { display:none; }
@media(prefers-reduced-motion:reduce) { html { scroll-behavior:auto; } *,*:before,*:after { animation:none!important; transition:none!important; } .custom-cursor { display:none; } }
.crt-screen { left:29.1667%; top:12.8906%; width:41.4714%; height:41.6016%; padding:3.2% 3%; } .crt-screen pre { font-size:clamp(8px,.83vw,12px); } @media(max-width:700px) { .crt-screen pre { font-size:clamp(7.5px,1.95vw,10px); } }
.crt-screen pre { line-height:1.3; } @media(max-width:700px) { .hero-art { width:min(120%,500px); max-width:none; left:50%; margin:8px 0 18px; translate:calc(-50% + var(--crt-x,0px)) var(--crt-y,0px); } .crt-screen pre { font-size:clamp(7px,1.95vw,10px); } }
/* Pausing ambient motion must never hide newly opened content. */
.motion-paused .reveal, .motion-paused .tool-chips, .motion-paused [role=tabpanel]:not([hidden]) { animation:none!important; opacity:1!important; transform:none!important; filter:none!important; }
.motion-paused .capability:hover { transform:none; }