@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700;800;900&display=swap');

:root{color-scheme:dark;--bg:#090909;--surface:#111111;--line:#292929;--text:#ffffff;--muted:#aaaaaa;--green:#d7ff43;--font:'Inter',system-ui,sans-serif}
*{box-sizing:border-box}
body{margin:0;background:var(--bg);color:var(--text);font-family:var(--font);-webkit-font-smoothing:antialiased;min-width:320px;background-image:none}

a{color:inherit;text-decoration:none;-webkit-tap-highlight-color:transparent}
a:focus-visible{outline:3px solid var(--green);outline-offset:5px}
.skip-link{position:fixed;left:20px;top:12px;z-index:10;background:var(--green);color:var(--bg);padding:12px 18px;border-radius:6px;transform:translateY(-180%);font-size:14px;font-weight:700}
.skip-link:focus-visible{transform:translateY(0)}
svg{width:24px;height:24px;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round;flex-shrink:0}
.icon-library{position:absolute;width:0;height:0;overflow:hidden}
.page-shell{position:relative;max-width:1000px;margin:auto;padding:0 32px}
.masthead{height:86px;border-bottom:1px solid #ffffff16;display:flex;align-items:center;justify-content:space-between}
.wordmark{display:flex;align-items:center;gap:9px;font-family:'Inter',var(--font);font-size:21px;font-weight:800;letter-spacing:-1px}
.wordmark img{object-fit:contain}.wordmark-dev{font-weight:500}.brand-dot{color:var(--green)}
.masthead-label{font-size:10px;letter-spacing:2px;color:#888888}
main{max-width:520px;margin:0 auto}
.profile{text-align:center}
.portrait-scene{position:relative;width:100%;height:290px;overflow:hidden;margin:18px auto 0;isolation:isolate}
.portrait-scene::after{content:'';position:absolute;inset:0;background:linear-gradient(transparent 65%,var(--bg) 100%);z-index:3;pointer-events:none}
.hero-name{position:absolute;top:0;left:0;right:0;color:var(--green);font-size:clamp(60px,20vw,100px);line-height:1.2;font-weight:900;letter-spacing:-6px;z-index:1}
.portrait{position:absolute;width:290px;height:auto;max-width:none;top:53px;left:50%;transform:translateX(-50%);z-index:2}
.intro{position:relative;margin-top:-1px;z-index:4}
.eyebrow{font-size:10px;font-weight:600;letter-spacing:1.5px;color:#bbbbbb;margin:0 0 14px;display:flex;align-items:center;justify-content:center;gap:7px}
.eyebrow span{width:5px;height:5px;border-radius:50%;background:var(--green);box-shadow:0 0 10px #d7ff4340}
h1{font-family:'Inter',var(--font);font-size:36px;font-weight:900;line-height:1.2;letter-spacing:-1.8px;margin:0}h1 span{font-weight:900;color:var(--green)}
.bio{font-size:14px;line-height:1.7;color:var(--muted);margin:15px 0 32px}
.services{display:table;margin:-15px auto 28px;padding:9px 14px;border:1px solid #292929;border-radius:999px;font-size:11px;line-height:1.5;letter-spacing:.4px;color:#d0d0d0;background:#111111}
.story-link{display:flex;align-items:center;justify-content:center;gap:8px;width:fit-content;min-height:44px;margin:12px auto 0;font-size:12px;color:#bbbbbb}
.story-link svg{width:14px;height:14px;color:var(--green)}
.story-link:hover{color:var(--text)}
h2{font-size:12px;font-weight:500;margin:0 0 10px;color:#999999}
.products{margin-top:28px}
.product-list{display:grid;grid-template-columns:1fr 1fr;gap:24px}
.product-link{display:flex;align-items:center;justify-content:space-between;gap:10px;border-top:1px solid #252525;padding:16px 0;color:#bbbbbb}
.product-summary{display:grid;gap:5px;min-width:0;flex:1}
.product-logo{width:36px;height:36px;object-fit:contain;flex-shrink:0;border-radius:8px}
.product-jarvis{--app-color:#d8ff9c}
.product-anotacred{--app-color:#ff5100}
.product-link strong,.product-link>svg{color:var(--app-color)}
.product-link:hover{border-color:var(--app-color)}
.product-summary strong{font-size:14px;font-weight:500}
.product-summary>span{font-size:11px;line-height:1.5;color:#999999}
.product-link>svg{width:14px;height:14px;color:#777777}
.product-link:hover strong{color:var(--text)}
@media(max-width:560px){.product-list{gap:16px}.product-link{gap:7px}.product-logo{width:28px;height:28px;border-radius:6px}.product-summary strong{font-size:13px}.product-summary>span{font-size:10px}.product-link>svg{width:12px;height:12px}}
.links{display:grid;gap:11px;margin-top:23px}
.link-row{display:flex;align-items:center;gap:14px;min-height:78px;padding:17px 20px;border:1px solid var(--line);border-radius:8px;transition:transform .2s,border-color .2s,background .2s}
.whatsapp{background:var(--green);color:#090909;border-color:var(--green);box-shadow:0 4px 25px #d7ff4308}
.link-icon{display:grid;place-items:center;flex-shrink:0}.link-icon svg{width:25px;height:25px}
.link-copy{display:grid;gap:6px;min-width:0}.link-copy strong{font-size:15px;font-weight:700;letter-spacing:-.1px}.link-copy>span{font-size:12px;line-height:1.5;color:#333333}
.link-arrow{margin-left:auto;width:19px;height:19px}.portfolio{background:#111111}.portfolio .link-copy>span{color:#999999}.portfolio .link-icon{color:#d7ff43}.portfolio .link-arrow{color:#aaaaaa}
.social-grid{display:grid;grid-template-columns:1fr 1fr;gap:11px}
.social-link{padding:18px;border:1px solid var(--line);border-radius:8px;display:flex;align-items:center;gap:12px;background:#111111;transition:transform .2s,border-color .2s,background .2s;font-size:14px;font-weight:500}
.social-link>svg:first-child{width:19px;height:19px;color:#d7ff43}.social-arrow{width:15px;height:15px;margin-left:auto;color:#999999}
.email-links{display:grid;gap:2px;padding:8px 0 0}
.email-link{display:flex;align-items:center;gap:12px;min-height:44px;padding:8px 4px;color:#bbbbbb;font-size:13px}
.email-link>svg:first-child{width:18px;height:18px;color:var(--green)}
.email-link>span{overflow-wrap:anywhere;min-width:0}
.email-link:hover{color:var(--text)}
.closing{text-align:center;font-size:11px;color:#999999;margin:30px 0 37px}.closing span{color:var(--green)}
footer{border-top:1px solid #ffffff16;min-height:62px;display:flex;align-items:center;justify-content:space-between;color:#888888;font-size:10px}footer>span:last-child{display:flex;align-items:center;gap:8px;font-size:8px;letter-spacing:1.5px}footer svg{width:15px;height:15px;color:#d7ff43}
@media(hover:hover){.portfolio:hover,.social-link:hover{transform:translateY(-3px);border-color:#d7ff43;background-color:#181818}.whatsapp:hover{background:#e1ff75;transform:translateY(-2px)}}
@media(min-width:900px){.page-shell{max-width:940px}.masthead{height:80px}.portrait-scene{margin-top:23px;height:290px}}
@media(max-width:560px){.page-shell{padding:0 22px}.masthead{height:64px}.wordmark{font-size:19px}.wordmark img{width:25px;height:27px}.masthead-label{font-size:9px;letter-spacing:.6px}.portrait-scene{height:230px;margin-top:18px}.portrait{width:250px;top:35px}h1{font-size:32px;letter-spacing:-1.5px}.eyebrow{font-size:9px;letter-spacing:1px}.bio{font-size:13px;margin:12px 0 28px}.link-row{padding:17px 16px}.link-copy strong{font-size:14px}.link-copy>span{font-size:12px}.links{margin-top:18px}.closing{margin:27px 0 30px}}
@media(max-width:360px){.page-shell{padding:0 16px}h1{font-size:29px}.link-row{gap:12px}.link-copy>span{font-size:11px}.social-link{padding:17px 12px;gap:10px}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{transition:none!important;scroll-behavior:auto!important}}
