:root{
  --bg:#f4f1ea; --paper:#fbfaf6; --ink:#151515; --muted:#6f6d67;
  --line:#d8d4ca; --accent:#c8ff4d; --dark:#181a17; --max:1180px;
}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;background:var(--bg);color:var(--ink);line-height:1.55;overflow-x:hidden}
a{color:inherit;text-decoration:none}
.container{width:min(calc(100% - 48px),var(--max));margin:auto}
.progress{position:fixed;z-index:1000;top:0;left:0;height:3px;background:var(--accent);width:0}
.nav-wrap{position:fixed;top:0;left:0;right:0;z-index:100;background:rgba(244,241,234,.82);backdrop-filter:blur(18px);border-bottom:1px solid rgba(216,212,202,.7)}
.nav{height:76px;display:flex;align-items:center;gap:32px}
.brand{font-size:24px;font-weight:900;letter-spacing:-2px;margin-right:auto}.brand span{color:#6d8e17}
.nav-links{display:flex;gap:30px;font-size:13px;font-weight:700;color:#555}
.nav-links a{transition:.2s}.nav-links a:hover{color:#000}
.nav-cta{font-size:13px;font-weight:800;border:1px solid var(--ink);padding:10px 16px;border-radius:100px}
.menu-btn{display:none;border:0;background:none;font-size:25px}
.hero{min-height:820px;padding-top:150px;display:grid;grid-template-columns:1.1fr .9fr;align-items:center;gap:60px}
.eyebrow,.section-label{font-size:11px;text-transform:uppercase;letter-spacing:2px;font-weight:800;color:#777}
.eyebrow{display:flex;align-items:center;gap:9px;margin-bottom:25px}.dot,.status-dot{width:7px;height:7px;border-radius:50%;background:#8baa22;display:inline-block;box-shadow:0 0 0 5px rgba(139,170,34,.12)}
h1{font-size:clamp(54px,7vw,100px);line-height:.92;letter-spacing:-6px;max-width:800px}
h1 em,h2 span{font-family:Georgia,serif;font-weight:400}
h1 em{color:#666;font-style:italic}
.hero-text{max-width:630px;color:var(--muted);font-size:18px;margin:30px 0}
.hero-actions,.contact-actions{display:flex;gap:12px;flex-wrap:wrap}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:18px;padding:14px 20px;border-radius:100px;font-size:13px;font-weight:800;transition:.25s}
.btn-primary{background:var(--ink);color:white}.btn-primary:hover{transform:translateY(-3px);background:#30312c}
.btn-ghost{border:1px solid #aaa}.btn-ghost:hover{border-color:#111;transform:translateY(-3px)}
.hero-meta{display:flex;gap:20px;flex-wrap:wrap;margin-top:28px;color:#85827a;font-size:11px;text-transform:uppercase;letter-spacing:1px}
.hero-visual{height:500px;position:relative;display:grid;place-items:center}
.orb{position:absolute;border-radius:50%;filter:blur(1px)}.orb-a{width:360px;height:360px;background:#dce5ca;right:15px;top:20px}.orb-b{width:170px;height:170px;background:#c8ff4d;left:10px;bottom:25px}
.code-card{position:relative;z-index:2;width:min(100%,470px);background:#1a1c18;color:#e7e9df;border-radius:20px;box-shadow:0 30px 80px rgba(0,0,0,.18);transform:rotate(2deg);overflow:hidden}
.code-top{height:48px;display:flex;align-items:center;gap:7px;padding:0 18px;border-bottom:1px solid #34362f}.code-top span{width:8px;height:8px;border-radius:50%;background:#575b51}.code-top small{margin-left:auto;color:#81857b;font-size:10px}
pre{padding:28px 26px;font-size:13px;line-height:2;overflow:auto}code i{color:#b6cf70;font-style:normal}code b{color:#fff}code strong{color:#d8dcae}code u{text-decoration:none;color:#a9b2ff}
.code-status{padding:13px 18px;border-top:1px solid #34362f;color:#8b9084;font-size:10px}.status-dot{width:6px;height:6px;margin-right:8px}
.marquee{overflow:hidden;border-block:1px solid var(--line);background:var(--dark);color:#eee}.marquee-track{width:max-content;display:flex;align-items:center;gap:35px;padding:18px 0;font-size:11px;letter-spacing:2px;font-weight:800;animation:scroll 24s linear infinite}.marquee b{color:var(--accent)}
@keyframes scroll{to{transform:translateX(-50%)}}
.section{padding:130px 0}.section-label{margin-bottom:45px}
.about-grid{display:grid;grid-template-columns:1fr 1fr;gap:100px}.about-grid h2,.section-heading h2,.stack-intro h2,.learning-grid h2{font-size:clamp(42px,5vw,70px);line-height:1;letter-spacing:-3px}.about-copy{font-size:17px;color:var(--muted);max-width:560px}.about-copy p+p{margin-top:20px}.quote{margin-top:35px;padding:24px 0;border-top:1px solid var(--line);border-bottom:1px solid var(--line);font-family:Georgia,serif;font-style:italic;font-size:20px;color:#333}
.work-section{background:var(--dark);color:#f5f4ed}.work-section .section-label{color:#8e9188}.section-heading{display:flex;justify-content:space-between;align-items:end;margin-bottom:55px}.section-heading a{font-size:12px;text-decoration:underline;text-underline-offset:5px}
.projects{display:grid;grid-template-columns:1fr 1fr;gap:1px;background:#373a34;border:1px solid #373a34}.project{background:var(--dark);min-height:370px;padding:35px;display:flex;flex-direction:column;transition:.3s}.project:hover{background:#22251f}.project.featured{grid-column:span 2;min-height:310px}.project-number{font-size:11px;color:#777b70}.project-body{margin-top:auto}.project-tag{font-size:10px;text-transform:uppercase;letter-spacing:2px;color:#9eaa83;margin-bottom:10px}.project h3{font-size:31px;letter-spacing:-1px}.project p{max-width:650px;color:#a6a99e;margin:10px 0 18px;font-size:14px}.chips{display:flex;gap:7px;flex-wrap:wrap;margin-bottom:20px}.chips span{font-size:10px;border:1px solid #454940;border-radius:100px;padding:5px 9px;color:#aaa}.project a{font-size:11px;font-weight:800;text-decoration:underline;text-underline-offset:4px}
.stack-grid{display:grid;grid-template-columns:.8fr 1.2fr;gap:100px}.stack-intro p{color:var(--muted);max-width:370px;margin-top:25px}.stack-list{border-top:1px solid var(--line)}.stack-row{display:grid;grid-template-columns:45px 150px 1fr;gap:20px;padding:22px 0;border-bottom:1px solid var(--line);align-items:center}.stack-row span{font-size:10px;color:#aaa}.stack-row strong{font-size:13px}.stack-row div{font-size:13px;color:var(--muted)}
.learning-section{background:#dfe8d2}.learning-grid{display:grid;grid-template-columns:.8fr 1.2fr;gap:100px}.learning-grid p{max-width:360px;color:#666;margin-top:25px}.learning-cards{display:grid;grid-template-columns:1fr 1fr;gap:12px}.learning-cards>div{background:rgba(255,255,255,.48);border:1px solid rgba(0,0,0,.08);padding:25px;min-height:150px;display:flex;flex-direction:column;justify-content:space-between}.learning-cards b{font-size:10px;color:#888}.learning-cards strong{font-size:18px}.learning-cards span{font-size:11px;color:#777}
.contact{padding:110px 0}.contact-card{background:var(--accent);padding:70px;border-radius:28px}.contact-card .section-label{color:#4d5d27}.contact-card h2{font-size:clamp(44px,6vw,78px);line-height:.98;letter-spacing:-4px;margin:30px 0 20px}.contact-card h2 em{font-family:Georgia,serif;font-weight:400}.contact-card p{max-width:560px;color:#566032;margin-bottom:28px}.dark-btn{border-color:#68773d}
.footer{border-top:1px solid var(--line);padding:28px 0 40px;display:flex;justify-content:space-between;color:#777;font-size:11px}.footer a{text-decoration:underline}
.reveal{opacity:0;transform:translateY(25px);transition:opacity .7s ease,transform .7s ease}.reveal.visible{opacity:1;transform:none}
@media(max-width:800px){
  .container{width:min(calc(100% - 32px),var(--max))}
  .nav-links,.nav-cta{display:none}.menu-btn{display:block}.nav-links.open{position:absolute;top:76px;left:0;right:0;background:var(--paper);display:flex;flex-direction:column;padding:22px 24px;border-bottom:1px solid var(--line)}
  .hero{grid-template-columns:1fr;padding-top:125px;min-height:auto;padding-bottom:90px}.hero-visual{height:390px}.code-card{transform:none}.orb-a{width:280px;height:280px}
  .about-grid,.stack-grid,.learning-grid{grid-template-columns:1fr;gap:45px}.section{padding:90px 0}
  .projects{grid-template-columns:1fr}.project.featured{grid-column:auto}.project{min-height:320px}
  .learning-cards{grid-template-columns:1fr 1fr}.contact-card{padding:40px 25px}.footer{flex-direction:column;gap:10px}
}
@media(max-width:500px){
  h1{letter-spacing:-3px}.hero-text{font-size:16px}.stack-row{grid-template-columns:30px 1fr}.stack-row div{grid-column:2}.learning-cards{grid-template-columns:1fr}.section-heading{align-items:start;gap:20px;flex-direction:column}
}