:root { --paper:#f4f2eb; --paper-deep:#e9e5da; --ink:#10201c; --muted:#63706c; --line:rgba(16,32,28,.16); --accent:#176b5a; --accent-soft:#cfe5dd; --lime:#d9f275; --night:#0b1714; --white:#fffefa; }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { margin:0; background:var(--paper); color:var(--ink); font-family:Arial,Helvetica,sans-serif; -webkit-font-smoothing:antialiased; }
a { color:inherit; text-decoration:none; }
img { display:block; width:100%; }
.site-header { position:sticky; top:0; z-index:20; display:grid; grid-template-columns:1fr auto 1fr; align-items:center; min-height:76px; padding:0 4vw; border-bottom:1px solid var(--line); background:rgba(244,242,235,.9); backdrop-filter:blur(18px); }
.identity { display:inline-flex; align-items:center; gap:12px; width:fit-content; font-weight:700; letter-spacing:-.02em; }
.identity-mark { display:grid; place-items:center; width:34px; height:34px; border-radius:50%; background:var(--ink); color:var(--paper); font-size:12px; letter-spacing:.04em; }
nav { display:flex; gap:34px; font-size:14px; }
nav a,.social-links a,.text-link,.project-link { transition:opacity 180ms ease; }
nav a:hover,.social-links a:hover,.text-link:hover,.project-link:hover { opacity:.55; }
.nav-cta { justify-self:end; display:flex; gap:8px; align-items:center; font-size:14px; font-weight:700; }
.hero { min-height:calc(100vh - 76px); padding:clamp(72px,10vw,150px) 4vw 56px; display:grid; grid-template-columns:minmax(0,1.55fr) minmax(320px,.65fr); gap:7vw; align-items:end; border-bottom:1px solid var(--line); background-image:linear-gradient(var(--line) 1px,transparent 1px),linear-gradient(90deg,var(--line) 1px,transparent 1px); background-size:64px 64px; background-position:-1px -1px; }
.hero-copy { animation:rise .8s cubic-bezier(.2,.75,.3,1) both; }
.eyebrow { margin:0 0 24px; text-transform:uppercase; letter-spacing:.14em; font-size:12px; font-weight:700; }
.status-dot { display:inline-block; width:8px; height:8px; margin-right:9px; border-radius:50%; background:var(--accent); box-shadow:0 0 0 5px rgba(23,107,90,.12); }
.hero h1 { max-width:990px; margin:0; font-size:clamp(56px,8.2vw,126px); line-height:.89; letter-spacing:-.075em; font-weight:700; }
.hero h1 span { display:block; color:var(--accent); }
.hero-intro { max-width:740px; margin:42px 0 0; font-size:clamp(19px,2vw,27px); line-height:1.42; letter-spacing:-.025em; }
.hero-actions { display:flex; align-items:center; gap:30px; margin-top:42px; flex-wrap:wrap; }
.button { display:inline-flex; align-items:center; justify-content:space-between; gap:34px; min-width:230px; padding:18px 22px; border-radius:4px; font-weight:700; transition:transform 180ms ease,background 180ms ease; }
.button:hover { transform:translateY(-3px); }
.button-primary { background:var(--ink); color:var(--white); }
.text-link { padding-bottom:5px; border-bottom:1px solid var(--ink); font-size:14px; font-weight:700; }
.hero-panel { border:1px solid var(--line); background:rgba(244,242,235,.85); animation:rise .8s .18s cubic-bezier(.2,.75,.3,1) both; }
.signal-card { min-height:145px; padding:22px; display:grid; grid-template-columns:42px 1fr; align-content:end; border-bottom:1px solid var(--line); }
.signal-card:last-child { border-bottom:0; }
.signal-index { grid-row:1/3; font-size:11px; color:var(--muted); }
.signal-card p { margin:0 0 6px; color:var(--muted); font-size:13px; }
.signal-card strong { font-size:18px; letter-spacing:-.02em; }
.accent-card { background:var(--lime); }
.statement { padding:90px 4vw; display:grid; grid-template-columns:1fr 3fr; gap:5vw; background:var(--night); color:var(--white); }
.statement p { margin:8px 0; color:#9aaba5; text-transform:uppercase; letter-spacing:.14em; font-size:11px; }
.statement blockquote { margin:0; max-width:1060px; font-size:clamp(32px,4.6vw,72px); line-height:1.05; letter-spacing:-.055em; }
.section-shell { padding:120px 4vw; border-bottom:1px solid var(--line); }
.section-heading { display:grid; grid-template-columns:2fr 1fr; gap:4vw; align-items:end; margin-bottom:60px; }
.section-heading h2,.about h2,.recognition h2 { margin:0; max-width:850px; font-size:clamp(44px,6vw,86px); line-height:.98; letter-spacing:-.06em; }
.section-note { margin:0; max-width:410px; color:var(--muted); font-size:16px; line-height:1.6; }
.project { overflow:hidden; border:1px solid var(--line); background:var(--white); }
.project-featured { display:grid; grid-template-columns:minmax(0,1.45fr) minmax(360px,.55fr); }
.project-visual { position:relative; overflow:hidden; background:var(--paper-deep); }
.project-visual img { height:100%; min-height:440px; object-fit:cover; transition:transform 600ms cubic-bezier(.2,.7,.2,1); }
.project:hover .project-visual img { transform:scale(1.018); }
.award-chip { position:absolute; left:22px; bottom:22px; padding:11px 14px; border-radius:3px; background:var(--lime); font-size:12px; font-weight:700; }
.project-copy { padding:clamp(28px,4vw,62px); display:flex; flex-direction:column; }
.project-meta { display:flex; justify-content:space-between; gap:20px; padding-bottom:20px; border-bottom:1px solid var(--line); color:var(--muted); text-transform:uppercase; letter-spacing:.1em; font-size:10px; }
.project h3 { margin:52px 0 22px; font-size:clamp(31px,3.5vw,54px); line-height:1; letter-spacing:-.05em; }
.project-copy>p { margin:0; color:var(--muted); line-height:1.68; }
.tag-list { display:flex; flex-wrap:wrap; gap:7px; padding:0; margin:30px 0 42px; list-style:none; }
.tag-list li { padding:8px 10px; border:1px solid var(--line); border-radius:30px; font-size:11px; }
.project-link { width:fit-content; margin-top:auto; padding-bottom:5px; border-bottom:1px solid var(--ink); font-size:13px; font-weight:700; }
.project-grid { display:grid; grid-template-columns:1fr 1fr; gap:20px; margin-top:20px; }
.project-card { display:flex; flex-direction:column; }
.project-card .project-visual,.terminal { height:370px; }
.project-card .project-visual img { min-height:0; height:100%; object-fit:cover; object-position:top left; }
.powerbi-visual { padding:30px; background:#e5e8e7; }
.powerbi-visual img { border-radius:3px; box-shadow:0 14px 45px rgba(16,32,28,.18); }
.project-card .project-copy { min-height:480px; }
.project-card h3 { margin-top:38px; }
.terminal { background:#101614; color:#cde1da; font-family:ui-monospace,SFMono-Regular,Menlo,monospace; }
.terminal-bar { height:54px; padding:0 20px; display:flex; align-items:center; gap:8px; border-bottom:1px solid #29342f; }
.terminal-bar span { width:10px; height:10px; border-radius:50%; background:#56625d; }
.terminal-bar small { margin-left:auto; color:#77837e; }
.terminal-body { padding:42px; font-size:13px; line-height:1.55; }
.terminal-body p { margin:0 0 12px; }
.terminal-body em { color:var(--lime); font-style:normal; }
.terminal-body b { display:inline-block; width:26px; color:#78d7bd; }
.terminal-muted { color:#64716c; padding-bottom:12px; }
.cursor-line { padding-top:14px; color:#a8b7b1; }
.cursor-line i { color:var(--lime); animation:blink 1s steps(1) infinite; }
.about { display:grid; grid-template-columns:1.15fr .85fr; gap:10vw; background:var(--accent-soft); }
.about-copy { padding-top:40px; }
.about-copy p { color:#43534e; font-size:17px; line-height:1.7; }
.about-copy .large-copy { margin-top:0; color:var(--ink); font-size:clamp(25px,2.5vw,36px); line-height:1.3; letter-spacing:-.035em; }
.compact-heading { margin-bottom:48px; }
.tool-list { display:grid; grid-template-columns:repeat(3,1fr); padding:0; margin:0; border-top:1px solid var(--line); list-style:none; }
.tool-list li { display:flex; gap:20px; align-items:center; min-height:76px; border-bottom:1px solid var(--line); font-size:17px; font-weight:700; }
.tool-list li:nth-child(3n+2) { padding-left:24px; padding-right:24px; border-left:1px solid var(--line); border-right:1px solid var(--line); }
.tool-list li:nth-child(3n+3) { padding-left:24px; }
.tool-list span { color:var(--muted); font-size:10px; font-weight:400; }
.recognition { display:grid; grid-template-columns:.8fr 1.2fr; gap:8vw; }
.recognition-title { position:sticky; top:130px; align-self:start; }
.recognition-intro { max-width:500px; margin:30px 0 0; color:var(--muted); font-size:17px; line-height:1.65; }
.recognition-list { border-top:1px solid var(--line); }
.recognition-list article { display:grid; grid-template-columns:90px 1fr; gap:30px; padding:38px 0; border-bottom:1px solid var(--line); }
.recognition-list article>span { color:var(--muted); font-size:11px; text-transform:uppercase; letter-spacing:.12em; }
.recognition-list small { display:block; width:fit-content; margin:0 0 11px; padding:6px 8px; border-radius:2px; background:var(--accent-soft); color:var(--accent); font-size:9px; font-weight:700; text-transform:uppercase; letter-spacing:.12em; }
.recognition-list h3 { margin:0 0 10px; font-size:25px; letter-spacing:-.03em; }
.recognition-list p { margin:0; max-width:620px; color:var(--muted); line-height:1.6; }
.contact { padding-top:110px; padding-bottom:80px; background:var(--accent); color:var(--white); }
.contact h2 { max-width:1150px; margin:0; font-size:clamp(46px,7vw,104px); line-height:.94; letter-spacing:-.065em; }
.contact-row { display:flex; justify-content:space-between; gap:30px; align-items:end; margin-top:70px; }
.button-light { background:var(--white); color:var(--ink); }
.social-links { display:flex; gap:28px; font-size:14px; font-weight:700; }
footer { min-height:110px; padding:26px 4vw; display:grid; grid-template-columns:1fr auto 1fr; align-items:center; background:var(--night); color:var(--white); font-size:12px; }
footer p { margin:0; color:#92a19c; }
footer p:last-child { justify-self:end; }
@keyframes rise { from { opacity:0; transform:translateY(24px); } to { opacity:1; transform:translateY(0); } }
@keyframes blink { 50% { opacity:0; } }
@media (max-width:950px) { .site-header{grid-template-columns:1fr auto}.site-header nav{display:none}.hero{grid-template-columns:1fr;min-height:auto}.hero-panel{display:grid;grid-template-columns:repeat(3,1fr)}.signal-card{min-height:130px;border-bottom:0;border-right:1px solid var(--line)}.signal-card:last-child{border-right:0}.project-featured,.about,.recognition{grid-template-columns:1fr}.recognition-title{position:static}.project-grid{grid-template-columns:1fr}.project-card .project-copy{min-height:auto} }
@media (max-width:680px) { .site-header{min-height:66px}.nav-cta{font-size:0}.nav-cta span{font-size:18px}.hero{padding-top:80px;background-size:40px 40px}.hero h1{font-size:clamp(50px,15vw,74px)}.hero-panel{grid-template-columns:1fr}.signal-card{border-right:0;border-bottom:1px solid var(--line)}.statement,.section-heading{grid-template-columns:1fr}.statement{padding-top:70px;padding-bottom:70px}.section-shell{padding-top:82px;padding-bottom:82px}.project-featured .project-visual img{min-height:300px}.project-card .project-visual,.terminal{height:270px}.powerbi-visual{padding:12px}.terminal-body{padding:26px;font-size:11px}.tool-list{grid-template-columns:1fr}.tool-list li:nth-child(3n+2),.tool-list li:nth-child(3n+3){padding-left:0;padding-right:0;border-left:0;border-right:0}.contact-row{align-items:start;flex-direction:column}footer{grid-template-columns:1fr;gap:20px}footer p:last-child{justify-self:start} }
@media (prefers-reduced-motion:reduce) { html{scroll-behavior:auto}*,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important} }