@import url('https://fonts.googleapis.com/css2?family=DM+Mono:wght@400;500&family=Space+Grotesk:wght@400;500;600;700&display=swap');

:root { --ink:#171715; --paper:#f3f0e8; --acid:#d7ff3f; --orange:#ff7048; --line:rgba(23,23,21,.18); --muted:#77756e; }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { margin:0; color:var(--ink); background:var(--paper); font-family:'Space Grotesk',Arial,sans-serif; overflow-x:hidden; }
body:has(.button:hover) .cursor-orb { transform:scale(2.6); }
a { color:inherit; text-decoration:none; }
.noise { position:fixed; inset:0; z-index:10; pointer-events:none; opacity:.06; 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='.45'/%3E%3C/svg%3E"); }
.cursor-orb { position:fixed; width:16px; height:16px; border-radius:50%; background:var(--orange); z-index:20; pointer-events:none; mix-blend-mode:multiply; transition:transform .25s ease; transform:translate(-50%,-50%); }
.site-header,.site-footer { display:flex; align-items:center; justify-content:space-between; padding:26px 4vw; font:12px 'DM Mono',monospace; position:relative; z-index:2; }
.site-header { border-bottom:1px solid var(--line); }
.wordmark { font:700 25px 'Space Grotesk',sans-serif; letter-spacing:-1.8px; }.wordmark i { color:var(--orange); font-style:normal; }.wordmark b { font:8px 'DM Mono',monospace; vertical-align:top; margin-left:3px; }.wordmark .logo-e { font:inherit; background:linear-gradient(135deg,var(--orange) 0 48%,var(--ink) 49% 100%); -webkit-background-clip:text; background-clip:text; -webkit-text-fill-color:transparent; }
.header-center { display:flex; flex-direction:column; align-items:center; gap:12px; }.header-note { color:var(--muted); text-transform:uppercase; letter-spacing:.06em; }.pill-link { border:1px solid var(--ink); border-radius:100px; padding:12px 18px; font-size:15px; font-weight:600; letter-spacing:-.03em; }.pill-link span,.button span { margin-left:12px; font-size:17px; }
.header-actions { display:flex; align-items:center; gap:18px; }.portfolio-link { font:11px 'DM Mono',monospace; text-transform:uppercase; letter-spacing:.06em; border-bottom:1px solid var(--ink); padding-bottom:4px; }.portfolio-link span { margin-left:7px; color:var(--orange); }
.mode-switch { display:flex; align-items:center; justify-content:center; gap:8px; padding:0; font:10px 'DM Mono',monospace; text-transform:uppercase; letter-spacing:.06em; }.mode-switch > span { margin-right:7px; color:var(--muted); }.mode-button { border:1px solid var(--line); border-radius:100px; background:transparent; color:var(--muted); padding:8px 12px; cursor:pointer; font:inherit; text-transform:inherit; letter-spacing:inherit; transition:all .2s ease; }.mode-button:hover,.mode-button.is-active { background:var(--ink); color:var(--paper); border-color:var(--ink); }
.theme-switch { display:flex; align-items:center; gap:6px; font:10px 'DM Mono',monospace; text-transform:uppercase; letter-spacing:.06em; }.theme-switch > span { color:var(--muted); margin-right:3px; }.theme-button { border:0; border-bottom:1px solid transparent; background:transparent; color:var(--muted); padding:3px 0; cursor:pointer; font:inherit; text-transform:inherit; letter-spacing:inherit; }.theme-button:hover,.theme-button.is-active { color:var(--ink); border-color:var(--orange); }
.section-pad { padding:8vw 8vw; }.hero { min-height:calc(100vh - 78px); display:grid; grid-template-columns:1.12fr .88fr; align-items:center; position:relative; padding-top:5vw; }
.eyebrow,.section-label,.card-number { font:11px 'DM Mono',monospace; text-transform:uppercase; letter-spacing:.12em; }.eyebrow { display:flex; gap:9px; align-items:center; }.status-dot { width:8px; height:8px; background:var(--orange); border-radius:50%; display:inline-block; box-shadow:0 0 0 5px rgba(255,112,72,.14); }
h1,h2,h3,p { margin-top:0; }.hero h1 { font-size:clamp(58px,9.4vw,156px); line-height:.88; letter-spacing:-.085em; margin:32px 0; font-weight:600; }.hero h1 em,h2 em { color:var(--orange); font-style:normal; }.hero-intro { max-width:420px; font-size:17px; line-height:1.45; }.hero-actions { display:flex; gap:26px; align-items:center; margin-top:38px; }.button { display:inline-flex; align-items:center; padding:16px 20px; font:11px 'DM Mono',monospace; text-transform:uppercase; letter-spacing:.05em; }.button-dark { background:var(--ink); color:var(--paper); }.button-acid { background:var(--acid); }.text-link { border-bottom:1px solid var(--ink); padding-bottom:5px; font:11px 'DM Mono',monospace; text-transform:uppercase; }.text-link span { margin-left:9px; }
.hero-art { min-height:530px; position:relative; display:grid; place-items:center; }.orbit { position:absolute; width:74%; aspect-ratio:1; border:1px solid var(--line); border-radius:50%; animation:spin 22s linear infinite; }.orbit:after { content:''; display:block; width:8px; height:8px; border-radius:50%; background:var(--orange); position:absolute; left:12%; top:13%; }.orbit-two { width:54%; animation-duration:15s; animation-direction:reverse; transform:rotate(42deg); }.orbit-two:after { background:var(--acid); top:auto; left:auto; right:7%; bottom:20%; }.orbit-three { width:34%; animation-duration:9s; }.core { display:grid; place-items:center; width:155px; aspect-ratio:1; border-radius:50%; background:var(--ink); color:var(--acid); font-size:80px; font-weight:700; letter-spacing:-.1em; box-shadow:16px 16px 0 var(--orange); }.core span { transform:rotate(-12deg); }.satellite { position:absolute; font:11px 'DM Mono',monospace; text-transform:uppercase; border:1px solid var(--ink); padding:8px 10px; background:var(--paper); }.sat-one { top:18%; right:7%; }.sat-two { bottom:21%; left:2%; }.sat-three { bottom:8%; right:14%; }.art-caption { position:absolute; left:10%; top:8%; font:500 15px 'DM Mono',monospace; line-height:1.15; letter-spacing:-.04em; color:var(--ink); }.scroll-cue { position:absolute; bottom:3vw; left:8vw; display:flex; gap:14px; align-items:center; font:10px 'DM Mono',monospace; text-transform:uppercase; }.scroll-cue i { font-size:20px; font-style:normal; animation:bob 1.5s ease-in-out infinite; }
.marquee { border-top:1px solid var(--ink); border-bottom:1px solid var(--ink); overflow:hidden; background:var(--orange); padding:15px 0; transform:rotate(-1.2deg) scale(1.03); }.marquee-track { display:flex; width:max-content; gap:50px; align-items:center; animation:marquee 18s linear infinite; font-size:clamp(25px,3.4vw,52px); font-weight:600; letter-spacing:-.06em; }.marquee-track b { font-size:30px; }
.section-label { display:flex; justify-content:space-between; border-top:1px solid var(--line); padding-top:13px; color:var(--muted); }.manifesto-grid { display:grid; grid-template-columns:1.1fr .9fr; gap:8vw; padding:9vw 0 7vw; }.manifesto h2,.offer-heading h2,.closing h2 { font-size:clamp(46px,7vw,104px); line-height:.9; letter-spacing:-.08em; margin:0; }.manifesto h2 span { color:var(--muted); }.manifesto-copy { font-size:19px; line-height:1.4; max-width:470px; }.manifesto-copy p + p { margin-top:28px; }.hand-note { color:var(--orange); font:16px 'DM Mono',monospace; transform:rotate(-4deg); margin-top:45px!important; }.quote-card { margin-left:auto; max-width:550px; padding:38px; background:var(--acid); position:relative; transform:rotate(2deg); }.quote-mark { position:absolute; top:8px; left:18px; font-size:90px; line-height:1; }.quote-card p { font-size:39px; line-height:.98; letter-spacing:-.06em; margin:20px 0 30px; }.quote-card strong { color:var(--orange); }.quote-by { font:10px 'DM Mono',monospace; text-transform:uppercase; }
.offer { background:var(--orange); }.offer-heading { display:flex; justify-content:space-between; align-items:end; gap:30px; padding:8vw 0 5vw; }.offer-heading p { font:14px 'DM Mono',monospace; max-width:220px; margin:0; }.offer-grid { display:grid; grid-template-columns:1.25fr 1fr 1fr; gap:14px; }.offer-card { min-height:370px; background:var(--paper); padding:25px; display:flex; flex-direction:column; position:relative; }.offer-card-main { background:var(--ink); color:var(--paper); }.offer-card h3 { font-size:34px; line-height:.95; letter-spacing:-.06em; margin:auto 0 18px; }.offer-card h3 em { color:var(--orange); font-style:normal; }.offer-card p { font-size:14px; line-height:1.4; max-width:260px; }.card-arrow { position:absolute; bottom:20px; right:24px; font-size:34px; }.offer-card-main .card-arrow { color:var(--acid); }
.stack { background:var(--ink); color:var(--paper); min-height:760px; position:relative; overflow:hidden; }.stack-inner { position:relative; z-index:1; max-width:800px; }.section-label.light { color:rgba(243,240,232,.55); border-color:rgba(243,240,232,.25); }.stack h2 { font-size:clamp(60px,10vw,150px); line-height:.83; letter-spacing:-.1em; margin:10vw 0 35px; }.stack h2 span { color:var(--paper); }.stack h2 em { color:var(--acid); }.stack-blurb { max-width:360px; line-height:1.4; color:rgba(243,240,232,.65); }.tags { display:flex; flex-wrap:wrap; gap:8px; margin-top:45px; }.tags span { border:1px solid rgba(243,240,232,.35); border-radius:100px; padding:9px 13px; font:11px 'DM Mono',monospace; }.tags span:last-child { color:var(--acid); border-color:var(--acid); }.stack-stamp { position:absolute; right:-1vw; bottom:5vw; color:var(--orange); font-size:clamp(80px,15vw,220px); font-weight:700; line-height:.75; letter-spacing:-.1em; text-align:right; transform:rotate(-8deg); opacity:.9; }
.closing { min-height:750px; display:flex; flex-direction:column; justify-content:center; align-items:flex-start; }.closing h2 { margin:40px 0; }.closing .button-acid { color:var(--ink); }.closing-foot { margin-top:45px; font:11px 'DM Mono',monospace; color:var(--muted); }.contact-dock { display:flex; align-items:center; gap:20px; margin-top:50px; padding-top:18px; border-top:1px solid var(--line); font:11px 'DM Mono',monospace; text-transform:uppercase; }.contact-dock > span { color:var(--muted); }.contact-dock a { color:inherit; font-size:15px; letter-spacing:-.03em; text-transform:none; }.contact-dock b { color:var(--orange); margin-left:7px; }.site-footer { border-top:1px solid var(--line); color:var(--muted); }.site-footer a { color:var(--ink); }
.resume-link { display:inline-flex; align-items:center; gap:14px; margin-top:22px; padding:13px 16px; border:1px solid currentColor; font:11px 'DM Mono',monospace; text-transform:uppercase; letter-spacing:.05em; transition:background .2s ease,color .2s ease; }.resume-link span { font-size:18px; }.resume-link:hover { background:var(--ink); color:var(--paper); }
.reveal { opacity:0; transform:translateY(25px); transition:opacity .8s ease,transform .8s ease; }.reveal.visible { opacity:1; transform:none; }.reveal-delay { transition-delay:.15s; }.reveal-delay-2 { transition-delay:.3s; }
@keyframes spin { to { transform:rotate(360deg); } } @keyframes marquee { to { transform:translateX(-33.333%); } } @keyframes bob { 50% { transform:translateY(6px); } }
@media (max-width:800px) { .site-header,.site-footer { padding:19px 5vw; }.site-header { flex-wrap:wrap; }.wordmark { font-size:22px; }.header-actions { gap:12px; }.portfolio-link { font-size:10px; }.pill-link { font-size:14px; padding:10px 14px; }.header-center { width:100%; order:3; margin-top:14px; }.header-note { font-size:9px; text-align:center; }.mode-switch { width:100%; justify-content:center; flex-wrap:wrap; }.mode-switch > span { width:100%; margin:0 0 3px; text-align:center; }.section-pad { padding:18vw 6vw; }.hero { display:block; min-height:auto; padding-top:16vw; }.hero h1 { font-size:18vw; }.hero-art { min-height:370px; margin-top:50px; }.core { width:115px; font-size:60px; }.art-caption { font-size:14px; left:4%; top:5%; }.scroll-cue { position:static; margin-top:30px; }.manifesto-grid,.offer-grid { grid-template-columns:1fr; }.manifesto-grid { gap:50px; }.quote-card { margin:20px 0 0; }.offer-heading { display:block; }.offer-heading p { margin-top:25px; }.offer-card { min-height:300px; }.stack { min-height:720px; }.stack-stamp { right:-3vw; bottom:12vw; font-size:25vw; }.closing { min-height:650px; }.contact-dock { flex-direction:column; align-items:flex-start; gap:8px; }.site-footer { flex-wrap:wrap; gap:12px; }.cursor-orb { display:none; } }

/* Professional mode: a quieter editorial system, not a resume template. */
body[data-mode="professional"] { --paper:#f7f6f1; --ink:#1c1c1a; --acid:#dedbd0; --orange:#d87352; --line:rgba(28,28,26,.2); }
body[data-mode="professional"] .header-center { gap:9px; }
body[data-mode="professional"] .mode-button.is-active { background:var(--orange); border-color:var(--orange); color:var(--paper); }
body[data-mode="professional"] .hero { background:linear-gradient(135deg,transparent 0 62%,rgba(222,219,208,.35) 62%); }
body[data-mode="professional"] .hero-art { min-height:500px; }
body[data-mode="professional"] .orbit { animation:none; border-color:rgba(28,28,26,.28); }
body[data-mode="professional"] .orbit-one { width:72%; border-radius:18% 50% 42% 55%; transform:rotate(-18deg); }
body[data-mode="professional"] .orbit-two { width:53%; border-radius:50% 18% 50% 30%; transform:rotate(22deg); }
body[data-mode="professional"] .orbit-three { width:34%; border-radius:50%; transform:rotate(45deg); }
body[data-mode="professional"] .orbit:after { width:5px; height:5px; }
body[data-mode="professional"] .core { width:166px; border-radius:16px; background:var(--paper); color:var(--ink); border:1px solid var(--ink); box-shadow:12px 12px 0 var(--acid); font-size:68px; }
body[data-mode="professional"] .satellite { border:0; border-bottom:1px solid var(--ink); padding:7px 0; background:transparent; }
body[data-mode="professional"] .art-caption { color:var(--ink); font-size:13px; }
body[data-mode="professional"] .marquee { background:transparent; transform:none; padding:27px 0; }
body[data-mode="professional"] .marquee-track { animation:none; font-size:clamp(18px,2.5vw,34px); text-transform:uppercase; letter-spacing:.02em; }
body[data-mode="professional"] .manifesto { background:#eceae3; }
body[data-mode="professional"] .quote-card { background:var(--paper); border:1px solid var(--ink); transform:rotate(-1deg); }
body[data-mode="professional"] .quote-card strong { color:var(--orange); }
body[data-mode="professional"] .offer { background:var(--paper); border-top:1px solid var(--ink); }
body[data-mode="professional"] .offer-grid { gap:0; }
body[data-mode="professional"] .offer-card { border:1px solid var(--line); margin-left:-1px; background:transparent; }
body[data-mode="professional"] .offer-card-main { color:var(--ink); background:var(--acid); }
body[data-mode="professional"] .offer-card-main .card-arrow { color:var(--orange); }
body[data-mode="professional"] .stack { background:var(--paper); color:var(--ink); border-top:1px solid var(--ink); }
body[data-mode="professional"] .stack h2 em { color:var(--orange); }
body[data-mode="professional"] .stack-blurb { color:var(--muted); }
body[data-mode="professional"] .tags span { border-color:var(--line); }
body[data-mode="professional"] .tags span:last-child { color:var(--orange); border-color:var(--orange); }
body[data-mode="professional"] .stack-stamp { color:transparent; -webkit-text-stroke:1px var(--orange); opacity:.75; }
body[data-mode="professional"] .closing { background:var(--ink); color:var(--paper); }
body[data-mode="professional"] .closing .eyebrow { color:rgba(247,246,241,.65); }
body[data-mode="professional"] .closing .status-dot { background:var(--orange); }
body[data-mode="professional"] .closing-foot { color:rgba(247,246,241,.55); } body[data-mode="professional"] .contact-dock { border-color:rgba(247,246,241,.25); } body[data-mode="professional"] .contact-dock > span { color:rgba(247,246,241,.55); } body[data-mode="professional"] .contact-dock a { color:var(--paper); }

/* Dark themes are authored separately for each mode rather than inverted. */
body[data-theme="dark"] { --paper:#121416; --ink:#f3f1e9; --acid:#c8ed4d; --orange:#ff805c; --line:rgba(243,241,233,.2); --muted:#a7a69f; }
body[data-theme="dark"] .noise { opacity:.035; }
body[data-theme="dark"] .mode-button:hover,body[data-theme="dark"] .mode-button.is-active { background:var(--ink); color:var(--paper); border-color:var(--ink); }
body[data-theme="dark"] .theme-button:hover,body[data-theme="dark"] .theme-button.is-active { color:var(--ink); }
body[data-theme="dark"] .hero { background:radial-gradient(circle at 78% 25%,rgba(200,237,77,.08),transparent 24%); }
body[data-theme="dark"] .orbit { border-color:rgba(243,241,233,.2); }
body[data-theme="dark"] .satellite { background:var(--paper); color:var(--ink); }
body[data-theme="dark"] .marquee { color:var(--ink); }
body[data-theme="dark"] .offer { background:#1a1d20; }
body[data-theme="dark"] .offer-card { background:#23272a; color:var(--ink); }
body[data-theme="dark"] .offer-card-main { background:var(--acid); color:#121416; }
body[data-theme="dark"] .offer-card-main .card-arrow { color:#121416; }
body[data-theme="dark"] .quote-card { color:#121416; }
body[data-theme="dark"] .stack { background:#0b0d0f; color:var(--ink); }
body[data-theme="dark"]:not([data-mode="professional"]) .stack .tags span { color:var(--ink); }
body[data-theme="dark"]:not([data-mode="professional"]) .stack .tags span:last-child { color:var(--acid); }
body[data-theme="dark"]:not([data-mode="professional"]) .closing .button-acid { color:#121416; }
body[data-theme="dark"] .closing { background:#090a0c; }
body[data-theme="dark"] .site-footer { background:#090a0c; color:rgba(243,241,233,.6); }
body[data-theme="dark"] .site-footer a { color:var(--ink); }

body[data-mode="professional"][data-theme="dark"] { --paper:#171a1d; --ink:#eef0e8; --acid:#303a34; --orange:#e27a5b; --line:rgba(238,240,232,.19); --muted:#9da49f; }
body[data-mode="professional"][data-theme="dark"] .hero { background:linear-gradient(135deg,transparent 0 62%,rgba(48,58,52,.35) 62%); }
body[data-mode="professional"][data-theme="dark"] .core { background:var(--paper); color:var(--ink); box-shadow:12px 12px 0 var(--acid); }
body[data-mode="professional"][data-theme="dark"] .satellite { background:transparent; color:var(--ink); }
body[data-mode="professional"][data-theme="dark"] .marquee { color:var(--ink); }
body[data-mode="professional"][data-theme="dark"] .manifesto { background:#202427; }
body[data-mode="professional"][data-theme="dark"] .quote-card { background:#272c2f; color:var(--ink); border-color:var(--line); }
body[data-mode="professional"][data-theme="dark"] .offer { background:var(--paper); }
body[data-mode="professional"][data-theme="dark"] .offer-card { background:transparent; color:var(--ink); }
body[data-mode="professional"][data-theme="dark"] .offer-card-main { background:var(--acid); color:var(--ink); }
body[data-mode="professional"][data-theme="dark"] .stack { background:#101315; color:var(--ink); }
body[data-mode="professional"][data-theme="dark"] .closing { background:#080a0b; color:var(--ink); }
body[data-mode="professional"][data-theme="dark"] .closing .contact-dock a { color:var(--ink); }
body[data-mode="professional"][data-theme="dark"] .closing .resume-link { color:var(--ink); border-color:rgba(238,240,232,.65); }
body[data-mode="professional"][data-theme="dark"] .closing-foot { color:var(--muted); }
body[data-mode="professional"][data-theme="dark"] .site-footer { background:#080a0b; }
body[data-mode="professional"] .resume-link { color:var(--paper); border-color:rgba(247,246,241,.55); }.resume-link:hover { background:var(--orange); color:var(--paper); border-color:var(--orange); }
@media (prefers-reduced-motion:reduce) { *,*::before,*::after { animation-duration:.001ms!important; transition-duration:.001ms!important; scroll-behavior:auto!important; } }
