@import "https://fonts.googleapis.com/css2?family=Inter:wght@400;600;700;800&family=Space+Grotesk:wght@500;600;700&display=swap";
:root{--space-1:8px;--space-2:12px;--space-3:16px;--space-4:24px;--space-5:32px;--space-6:48px;--dur:.16s;--ease:cubic-bezier(.2, .7, .2, 1)}.App[data-theme=light]{--bg:#f8fafc;--panel:#fff;--panel-hover:#f3f4f6;--line:#d1d5db;--line-2:#9ca3af;--text:#0f172a;--text-2:#334155;--muted:#64748b;--accent:#0ea5e9}.App[data-theme=dark]{--bg:#0b0f14;--panel:#0e1319;--panel-hover:#0f161c;--line:#2a2f3a;--line-2:#374151;--text:#e5e7eb;--text-2:#cbd5e1;--muted:#9ca3af;--accent:#10b981}*{box-sizing:border-box}.App{background:var(--bg);min-height:100vh;color:var(--text);font-family:Inter,system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif}a,.menu a,.menu a:before,.pill-toggle{transition-duration:var(--dur);transition-timing-function:var(--ease)}.layout{max-width:1040px;padding:var(--space-6) var(--space-3);gap:var(--space-4);grid-template-columns:1fr;margin:0 auto;display:grid}@media (min-width:900px){.layout{gap:var(--space-5);grid-template-columns:1fr 2fr}}.sidebar{align-self:start}@media (min-width:900px){.sidebar{top:var(--space-6);position:sticky}}.title{letter-spacing:-.01em;margin:0 0 var(--space-2) 0;white-space:nowrap;max-width:100%;font-family:Space Grotesk,Inter,system-ui,sans-serif;font-size:clamp(24px,6vw,44px);font-weight:700;line-height:1.02;overflow:hidden}@media (max-width:380px){.title{font-size:20px}}.subtitle{margin:0 0 var(--space-3) 0;color:var(--muted);font-weight:600}.subtitle .sep{opacity:.6}.bio{margin-top:var(--space-3);color:var(--text-2);line-height:1.65}.sidebar-actions{margin-top:var(--space-4);gap:var(--space-2);flex-wrap:wrap;align-items:center;display:flex}.pill-toggle{border:1px solid var(--line);color:var(--text);cursor:pointer;background:0 0;border-radius:9999px;padding:6px 12px;font-size:14px;transform:translateZ(0)}.pill-toggle:hover{border-color:var(--line-2);transform:translateY(-1px)scale(1.02)}.pill-toggle:active{transform:translateY(0)scale(.99)}.pill-toggle:focus-visible{outline:2px solid var(--accent);outline-offset:2px}.menu{margin-top:var(--space-4);gap:var(--space-2);flex-direction:column;align-items:flex-start;display:flex}.menu a{color:var(--text);padding:8px 10px 8px 28px;font-size:15px;font-weight:600;text-decoration:none;transition-property:padding-left,transform,color;display:block;position:relative;transform:translate(0)scale(1)}.menu a:before{content:"";background:var(--line);width:18px;height:2px;transition-property:width,background-color;position:absolute;top:50%;left:0;transform:translateY(-50%)}.menu a:hover{color:color-mix(in oklab, var(--text) 90%, var(--accent) 10%);padding-left:36px;transform:translate(2px)scale(1.01)}.menu a:hover:before{background:var(--line-2);width:28px}.menu a.is-active{color:color-mix(in oklab, var(--text) 80%, var(--accent) 20%);padding-left:44px;transform:translate(3px)scale(1.02)}.menu a.is-active:before{background:var(--accent);width:36px}.menu a:focus-visible{outline:2px solid var(--accent);outline-offset:2px}.content{min-height:40vh}.anchor-spacer{scroll-margin-top:calc(var(--space-6) + 48px)}.panel{padding-left:var(--space-3);transition:border-color var(--dur) var(--ease);border-left:1px solid #0000}.exp-card,.project-card,.service-card{border:1px solid color-mix(in oklab, var(--text) 8%, transparent);background:var(--panel);transition:border-color var(--dur) var(--ease), background-color var(--dur) var(--ease), transform var(--dur) var(--ease), box-shadow var(--dur) var(--ease);border-radius:12px;box-shadow:0 0 #0000}.exp-card:hover,.project-card:hover,.service-card:hover{border-color:var(--accent);background-color:var(--panel-hover);transform:translateY(-2px);box-shadow:0 6px 16px #00000040}.exp-card:active,.project-card:active,.service-card:active{transform:translateY(0);box-shadow:0 2px 8px #00000059}.exp-card,.service-card{padding:var(--space-3) calc(var(--space-3) + 2px)}.exp-list{gap:var(--space-3);display:grid}.exp-card:focus-within{outline:2px solid var(--accent);outline-offset:3px}.exp-title{margin:0 0 var(--space-2) 0;letter-spacing:-.01em;font-family:Space Grotesk,Inter,system-ui,sans-serif;font-size:18px;font-weight:700}.exp-subtitle{color:var(--text-2);margin:0;font-size:14px;line-height:1.7}.project-card{align-items:stretch;gap:var(--space-3);padding:var(--space-3);color:inherit;cursor:pointer;text-decoration:none;display:flex}.project-card+.project-card{margin-top:var(--space-3)}.project-card:focus-visible{outline:2px solid var(--accent);outline-offset:4px}.project-thumb{border:1px solid color-mix(in oklab, var(--text) 10%, transparent);background:color-mix(in oklab, var(--panel) 70%, black 30%);border-radius:8px;flex:0 0 132px;align-self:stretch;display:flex;overflow:hidden}.project-thumb img{object-fit:cover;width:100%;height:100%}.project-meta{flex:auto}.project-title{margin:0 0 var(--space-3) 0;letter-spacing:-.01em;font-family:Space Grotesk,Inter,system-ui,sans-serif;font-size:18px;font-weight:700}.project-desc{color:var(--text-2);margin:0;font-size:14px;line-height:1.7}.services-list{gap:var(--space-3);display:grid}.service-title{margin:0 0 var(--space-2) 0;letter-spacing:-.01em;font-family:Space Grotesk,Inter,system-ui,sans-serif;font-size:18px;font-weight:700}.service-desc{color:var(--text-2);margin:0;font-size:14px;line-height:1.7}.services-cta-wrap{margin-top:var(--space-4);justify-content:flex-start;display:flex}.services-cta{border:1px solid var(--accent);background:color-mix(in oklab, var(--accent) 14%, transparent);min-height:42px;color:var(--text);transition:border-color var(--dur) var(--ease), background-color var(--dur) var(--ease), transform var(--dur) var(--ease), box-shadow var(--dur) var(--ease);border-radius:9999px;justify-content:center;align-items:center;padding:10px 18px;font-weight:700;text-decoration:none;display:inline-flex;transform:translateZ(0)}.services-cta:hover{background:color-mix(in oklab, var(--accent) 24%, transparent);transform:translateY(-1px);box-shadow:0 6px 16px #0003}.services-cta:active{transform:translateY(0);box-shadow:0 2px 8px #00000040}.services-cta:focus-visible{outline:2px solid var(--accent);outline-offset:4px}@media (max-width:480px){.project-thumb{flex-basis:100px}}.App ::selection{background:var(--accent);color:color-mix(in oklab, var(--bg) 60%, white 40%)}@media (prefers-reduced-motion:reduce){a,.exp-card,.project-card,.service-card,.menu a,.menu a:before,.pill-toggle{transition:none!important}}@media (min-width:900px){.sidebar{flex-direction:column;display:flex}.sidebar-footer{padding-top:var(--space-4);margin-top:auto}}.sidebar-footer{margin-top:var(--space-4)}.social{gap:var(--space-2);align-items:center;display:flex}.social-link{border:1px solid var(--line);width:36px;height:36px;color:var(--muted);transition:border-color var(--dur) var(--ease), color var(--dur) var(--ease), transform var(--dur) var(--ease);background:0 0;border-radius:10px;place-items:center;text-decoration:none;display:grid;transform:translateZ(0)}.social-link:hover{border-color:var(--accent);color:var(--text);transform:translateY(-1px)}.social-link:active{transform:translateY(0)}.social-link:focus-visible{outline:2px solid var(--accent);outline-offset:2px}.social-link svg{width:18px;height:18px;display:block}body{margin:0}.lang-es,.App[data-language=es] .lang-en{display:none}.App[data-language=es] .lang-es{display:inline}.section-panel{display:none}.App[data-active=experience] #experience,.App[data-active=projects] #projects,.App[data-active=services] #services{border-left-color:var(--accent);display:block}.sr-only{clip:rect(0, 0, 0, 0);white-space:nowrap;border:0;width:1px;height:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}
