:root{--paper:#f6f5ef;--ink:#162f30;--muted:#526365;--line:#d5dcd4;--accent:#ccea81;--surface:#e8ede5;color-scheme:light dark;--strong-surface:#162f30;--strong-text:#f6f5ef;--strong-muted:#d4dfd9;--strong-line:#53706b;--accent-text:#162f30;--primary-bg:#162f30;--primary-text:#ffffff;--primary-hover:#285151;--focus:#39707e;--project-line:#c8d2c8;--tag-line:#bbc9bd}*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:30px}body{margin:0;background:var(--paper);color:var(--ink);font:16px/1.65 system-ui,-apple-system,sans-serif}a{color:inherit;text-underline-offset:5px}button{font:inherit}a:focus-visible,button:focus-visible,summary:focus-visible{outline:3px solid var(--focus);outline-offset:6px}.wrap{max-width:1160px;margin:auto;padding:0 40px}.preview{background:var(--strong-surface);color:var(--strong-text);font-size:12px;padding:9px 20px;text-align:center;letter-spacing:.06em}.preview a{margin-left:16px}header{display:flex;align-items:center;justify-content:space-between;gap:30px;padding:27px 0;border-bottom:1px solid var(--line)}.brand{font-weight:750;font-size:19px;text-decoration:none;letter-spacing:-.7px}.brand span{display:inline-grid;place-items:center;background:var(--strong-surface);color:var(--accent);width:34px;height:34px;margin-right:10px;font-size:12px;letter-spacing:0}nav{display:flex;gap:27px;font-size:13px}nav a{text-decoration:none}nav a:last-child{font-weight:750}.hero{display:grid;grid-template-columns:1.55fr 1fr;align-items:center;gap:70px;padding:88px 0 66px}.eyebrow{text-transform:uppercase;letter-spacing:.16em;font-size:11px;font-weight:700;margin:0 0 25px;display:flex;align-items:center;gap:10px}.eyebrow:before{content:"";width:24px;height:2px;background:currentColor}h1{font:500 clamp(42px,5.2vw,68px)/1.06 Georgia,serif;letter-spacing:-2.5px;margin:0 0 25px}h1 em{font-weight:400}p{margin:0 0 20px}.intro{font-size:17px;max-width:510px;color:var(--muted)}.actions{display:flex;flex-wrap:wrap;gap:14px;margin-top:31px}.button{display:inline-flex;align-items:center;gap:24px;padding:13px 19px;border:1px solid var(--ink);text-decoration:none;font-weight:650;font-size:13px}.primary{background:var(--primary-bg);color:var(--primary-text);border-color:var(--primary-bg)}.primary:hover{background:var(--primary-hover);border-color:var(--primary-hover)}.portrait{position:relative;background:var(--surface);padding:35px 30px 25px;border-radius:160px 160px 4px 4px;text-align:center}.portrait img{width:220px;height:220px;max-width:100%;object-fit:cover;border-radius:50%;filter:grayscale(1);margin:5px auto 20px}.portrait strong{display:block;font:28px Georgia,serif}.portrait p{font-size:12px;color:var(--muted);margin:7px 0 13px}.portrait .badge{display:inline-block;background:var(--accent);color:var(--accent-text);padding:6px 12px;font-size:11px;font-weight:700}.proof{border-block:1px solid var(--line);padding:21px 0;display:flex;align-items:center;justify-content:space-between;gap:25px;font-size:14px;font-weight:650}.proof small{max-width:145px;font-size:10px;letter-spacing:.13em;font-weight:500;text-transform:uppercase;color:var(--muted)}section{padding:72px 0}.section-head{display:flex;align-items:end;justify-content:space-between;gap:40px;margin-bottom:32px}h2{font:400 39px/1.15 Georgia,serif;letter-spacing:-1.1px;margin:0}.section-head p{max-width:340px;font-size:14px;color:var(--muted);margin:0}.services{display:grid;grid-template-columns:repeat(3,1fr);gap:34px}.service{border-top:1px solid var(--ink);padding-top:20px}.number{font:12px ui-monospace,monospace;color:var(--muted)}h3{font-size:19px;line-height:1.35;margin:22px 0 14px}.service p,.project p{font-size:14px;color:var(--muted)}.projects{background:var(--surface)}.project{display:grid;grid-template-columns:130px 1fr 1fr;gap:35px;padding:30px 0;border-top:1px solid var(--project-line)}.project h3{margin:0 0 10px;font-size:22px}.project .period{font-size:11px;color:var(--muted)}.project p{margin:0}.tag{display:inline-block;font:10px ui-monospace,monospace;border:1px solid var(--tag-line);padding:4px 7px;margin:13px 3px 0 0}.about{display:grid;grid-template-columns:1fr 1fr;gap:80px}.about p{color:var(--muted)}.about a{font-size:13px;font-weight:650}.contact{background:var(--strong-surface);color:var(--strong-text);padding:50px;display:grid;grid-template-columns:1.4fr 1fr;gap:60px;margin-bottom:70px}.contact h2{font-size:38px}.contact p{font-size:14px;margin:22px 0;color:var(--strong-muted)}.contact .button{background:var(--accent);border-color:var(--accent);color:var(--accent-text)}.contact aside{border-left:1px solid var(--strong-line);padding-left:30px;font-size:13px}.contact aside strong{font-size:11px;text-transform:uppercase;letter-spacing:.1em}.contact aside p{font-size:13px}footer{padding:22px 0 35px;border-top:1px solid var(--line);display:flex;justify-content:space-between;gap:20px;font-size:11px;color:var(--muted)}footer div{display:flex;gap:20px}.note{font-size:11px!important;margin-bottom:0!important}.skip{position:absolute;top:-80px;background:var(--paper);color:var(--ink);padding:10px}.skip:focus{top:0;z-index:5}@media(max-width:740px){.wrap{padding:0 22px}header{align-items:start;gap:14px}nav{gap:13px;flex-wrap:wrap;justify-content:end;font-size:11px}.brand{font-size:14px;white-space:nowrap}.brand span{display:none}.hero{grid-template-columns:1fr;padding:48px 0;gap:38px}h1{font-size:49px}.portrait{max-width:320px;width:100%;justify-self:center}.proof{flex-wrap:wrap;justify-content:start;gap:16px 23px}.proof small{max-width:none;width:100%}.section-head{display:block}.section-head p{margin-top:20px}.services,.about,.contact{grid-template-columns:1fr;gap:28px}section{padding:48px 0}.project{grid-template-columns:1fr;gap:12px}.contact{padding:28px;margin-bottom:40px}.contact aside{border-left:0;border-top:1px solid var(--strong-line);padding:20px 0 0}h2{font-size:34px}footer{flex-wrap:wrap}.preview{font-size:10px}.preview a{display:inline-block}}@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}}

/* Follow the browser/system preference, including changes while the page is open. */
@media (prefers-color-scheme: dark) {
  :root {
    --paper:#101c1d;
    --ink:#edf2e9;
    --muted:#b3c2bc;
    --line:#354847;
    --surface:#1b2b2b;
    --strong-surface:#233b3a;
    --strong-text:#edf2e9;
    --strong-muted:#c5d3cb;
    --strong-line:#68847b;
    --primary-bg:#ccea81;
    --primary-text:#162f30;
    --primary-hover:#ddf3ab;
    --focus:#ccea81;
    --project-line:#3e5551;
    --tag-line:#607770;
  }
}
.rev{unicode-bidi:bidi-override;direction:rtl;display:inline-block}.legal{padding-top:32px;padding-bottom:48px;overflow-wrap:anywhere}.legal p{max-width:78ch}.legal h3{margin-top:28px}header.wrap{padding-top:24px;padding-bottom:24px}

/* Editorial typography meets a restrained developer aesthetic. */
:root{--code-keyword:#35624b;--code-comment:#526365}
@media(prefers-color-scheme:dark){:root{--code-keyword:#ccea81;--code-comment:#b3c2bc}}
.hero{position:relative;gap:54px}
.hero::before{content:"";position:absolute;inset:20px -20px;z-index:-1;pointer-events:none;background-image:radial-gradient(var(--line) 1px,transparent 1px);background-size:22px 22px;mask-image:linear-gradient(90deg,transparent 30%,#000);opacity:.5}
.hero-profile{min-width:0;position:relative}
.portrait{padding-top:24px;border-radius:130px 130px 4px 4px}
.portrait img{width:174px;height:174px}
.code-card{position:relative;margin:-5px -14px 0 18px;background:var(--paper);border:1px solid var(--line);border-radius:10px;box-shadow:0 14px 35px #0000000d;overflow:hidden;transform:rotate(-2deg)}
.code-title,.code-foot{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:11px 16px;font:10px ui-monospace,SFMono-Regular,Consolas,monospace;color:var(--muted)}
.code-title{border-bottom:1px solid var(--line)}.code-dots{color:var(--code-keyword);letter-spacing:3px}
.code-card pre{margin:0;padding:18px 20px;font:12px/1.85 ui-monospace,SFMono-Regular,Consolas,monospace;white-space:pre-wrap;overflow-wrap:anywhere;color:var(--ink)}
.code-keyword{color:var(--code-keyword);font-weight:700}.code-comment{color:var(--code-comment)}
.code-foot{border-top:1px solid var(--line);background:var(--surface)}
.eyebrow,.number{font-family:ui-monospace,SFMono-Regular,Consolas,monospace}
.eyebrow::before{content:"//";background:none;width:auto;height:auto;letter-spacing:-2px;font-size:14px}
nav a{position:relative}nav a::after{content:"";position:absolute;bottom:-5px;left:0;width:100%;height:1px;background:currentColor;transform:scaleX(0);transform-origin:left}
nav a:hover::after,nav a:focus-visible::after{transform:scaleX(1)}
.service{position:relative;padding:22px 14px 12px}.service::after{content:"}";position:absolute;right:12px;top:13px;font:26px ui-monospace,monospace;color:var(--muted);opacity:.45}
.contact{border-radius:5px;position:relative}.contact::before{content:"/* let's build something reliable */";grid-column:1/-1;font:11px ui-monospace,monospace;color:var(--strong-muted);margin-bottom:-30px;overflow-wrap:anywhere}
@media(prefers-reduced-motion:no-preference){
 .hero h1{animation:enter 650ms ease-out both}.hero .intro{animation:enter 750ms ease-out both}.hero .actions{animation:enter 850ms ease-out both}.hero-profile{animation:enter 900ms ease-out both}
 .button,.service,.code-card{transition:transform 220ms ease,background-color 220ms ease,box-shadow 220ms ease}.button span{transition:transform 220ms ease}nav a::after{transition:transform 220ms ease}
 @media(hover:hover){.button:hover{transform:translateY(-3px);box-shadow:0 7px 18px #00000012}.button:hover span{transform:translate(2px,-2px)}.service:hover{background:var(--surface);transform:translateY(-4px)}.code-card:hover{transform:rotate(0deg) translateY(-3px)}}
 @keyframes enter{from{opacity:.4;transform:translateY(12px)}to{opacity:1;transform:translateY(0)}}
}
@media(max-width:740px){.hero-profile{max-width:350px;width:100%;justify-self:center}.portrait{max-width:none}.code-card{margin:-5px 0 0 12px}.hero::before{inset:0}.contact::before{margin-bottom:0}.hero{gap:38px}}

.mail-reveal{font:inherit;cursor:pointer;background:var(--surface);color:var(--ink);border:1px solid var(--line);padding:10px 14px;border-radius:3px}
.mail-reveal[hidden],.mail-result[hidden]{display:none}
.mail-result{display:block;margin-top:12px;overflow-wrap:anywhere}
.mail-result a{font-weight:650;text-decoration:underline}
.mail-reveal:focus-visible{outline:3px solid var(--focus);outline-offset:5px}

.private-contact{display:inline-block;max-width:100%;padding:4px 0}
.private-contact[hidden],.private-result[hidden]{display:none}
.private-result{display:block;white-space:pre-line;margin-top:8px;overflow-wrap:anywhere}

:root{--paper:#edf1ed;--ink:#112f32;--surface:#dfe8e3;--accent:#e4b25c;--accent-text:#182e30;--primary-bg:#183d40;--primary-text:#fff;--primary-hover:#285457;--line:#bbccc5;--muted:#425e59}
@media(prefers-color-scheme:dark){:root{--paper:#0a2023;--ink:#e7eee7;--surface:#153438;--accent:#e4b25c;--primary-bg:#e4b25c;--primary-text:#162c2e;--primary-hover:#f2c780;--line:#345356;--muted:#b0c6bf;--strong-surface:#1a3d40;--focus:#e4b25c;--code-keyword:#e4b25c}}
body{background-image:linear-gradient(90deg,transparent calc(100% - 1px),var(--line) 1px);background-size:25% 100%}
.wrap{max-width:1240px;background:var(--paper)}
.variant-note{padding:9px 24px;background:var(--strong-surface);color:var(--strong-text);font:10px/1.6 ui-monospace,monospace;letter-spacing:.12em;display:flex;justify-content:space-between;gap:20px}
header.wrap{border-bottom:1px solid var(--line);padding-top:25px;padding-bottom:25px}
.brand{letter-spacing:-.8px}.brand span{border-radius:50%;background:var(--accent);color:var(--accent-text)}
h1,h2,.portrait strong{font-family:system-ui,-apple-system,sans-serif;font-weight:750;letter-spacing:-.055em}h1{font-size:clamp(42px,5.8vw,76px);line-height:1.02}h1 em{font-style:normal;font-weight:750;color:var(--code-keyword)}h2{font-size:clamp(30px,3.5vw,45px)}
.hero{padding:75px 0 70px;gap:50px;grid-template-columns:1.45fr 1fr}.hero::before{display:none}.hero-profile{padding:18px 0 0}
.portrait{border-radius:4px;padding:30px;text-align:left;border:1px solid var(--line);position:relative}.portrait img{width:150px;height:150px;border-radius:3px;margin:0 0 22px}.portrait strong{font-size:27px}.portrait .badge{font:10px/1.6 ui-monospace,monospace;background:transparent;padding:0;color:var(--muted)}
.code-card{transform:none;margin:18px 0 0;border-radius:4px;box-shadow:none}.code-title{background:var(--surface)}.code-card pre{font-size:13px}.code-foot{background:var(--paper)}
.proof{padding:25px 0}.services{gap:0;border-bottom:1px solid var(--line)}.service{padding:28px 25px;border-top:1px solid var(--line);border-right:1px solid var(--line)}.service:first-child{padding-left:0}.service:last-child{border-right:0}.service h3{max-width:230px}.service::after{content:"+";font-size:20px}
.projects{background:var(--surface);padding:65px 0}.projects .wrap{background:transparent}.project{grid-template-columns:145px 1.1fr 1fr;gap:26px;padding:32px 0}.project h3{font-size:24px;letter-spacing:-.035em}.tag{border-radius:3px;font-size:11px;line-height:1.6;max-width:100%;overflow-wrap:anywhere}
.button{border-radius:3px;font-family:ui-monospace,monospace;font-size:12px;line-height:1.7}.contact{border-top:3px solid var(--accent);border-radius:3px}.contact h2{font-size:clamp(29px,3.5vw,43px)}
.contact-reveal{display:inline-block;max-width:100%;padding:5px 0}.reveal-trigger{cursor:pointer;background:var(--surface);color:var(--ink)}.contact .reveal-trigger{background:var(--accent);color:var(--accent-text)}.reveal-trigger:disabled{cursor:wait;opacity:.65}.reveal-result{display:block;white-space:pre-line;margin-top:12px;overflow-wrap:anywhere}.reveal-result[hidden]{display:none}.reveal-result a{font-weight:650;text-decoration:underline}.reveal-trigger:focus-visible{outline:3px solid var(--focus);outline-offset:4px}
@media(max-width:740px){.hero{grid-template-columns:1fr;padding-top:44px}.hero-profile{max-width:100%;display:grid;grid-template-columns:1fr;gap:14px}.code-card{margin:0}.services{display:block}.service,.service:first-child{padding:24px 0;border-right:0}.project{grid-template-columns:1fr}.variant-note{font-size:9px}.portrait{padding:24px}.contact{padding:25px}}

/* Stable contact tiles: reveal content never changes document geometry. */
.contact-reveal{display:inline-flex;flex-direction:column;vertical-align:top;width:320px;max-width:100%;padding:0;margin:8px 0;border:1px solid var(--line);border-radius:12px;background:var(--surface);overflow:hidden;color:var(--ink)}
.reveal-trigger,.contact .reveal-trigger{display:flex;align-items:center;gap:12px;width:100%;padding:16px 18px;border:0;border-radius:0;background:transparent;color:inherit;cursor:pointer;font:600 14px/1.4 system-ui,sans-serif;text-align:left;box-shadow:none;transform:none}
.reveal-trigger svg{flex:none;color:var(--code-keyword)}.reveal-plus{margin-left:auto;font-size:21px;font-weight:400;color:var(--muted)}
.reveal-slot{display:block;position:relative;height:4.5em;margin:0 18px;font:14px/1.65 system-ui,sans-serif}
[data-contact="address"] .reveal-slot{height:6.5em}
.reveal-hint,.reveal-result{position:absolute;inset:0;margin:0;padding:4px 0 12px;overflow:auto;overflow-wrap:anywhere}
.reveal-hint{color:var(--muted);font-size:12px}
.reveal-result[hidden]{display:block;visibility:hidden;pointer-events:none}
.contact-reveal.is-open .reveal-hint{visibility:hidden}
.reveal-result a{font-weight:500;text-decoration-thickness:1px;text-underline-offset:4px}
.reveal-trigger:focus-visible{outline:2px solid var(--focus);outline-offset:-4px;border-radius:10px}
.contact .contact-reveal{background:var(--strong-surface);border-color:var(--strong-line);color:var(--strong-text)}
.contact .reveal-hint,.contact .reveal-plus{color:var(--strong-muted)}
.contact .reveal-trigger svg{color:var(--accent)}
@media(prefers-reduced-motion:no-preference){.reveal-plus{transition:transform .18s ease}.is-open .reveal-plus{transform:rotate(45deg)}.contact-reveal{transition:border-color .18s ease}.contact-reveal:hover{border-color:var(--code-keyword)}}
