@import "https://fonts.googleapis.com/css2?family=JetBrains+Mono:wght@400;500;600&family=Sora:wght@400;500;600;700;800&display=swap";:root{--bg:#0a0a0f;--surface:#111118;--surface-strong:#15151d;--text:#f0f0f0;--muted:#f0f0f09e;--muted-strong:#f0f0f0c7;--border:#f0f0f01a;--accent:#378add;--accent-soft:#378add1f;--sans:"Sora", system-ui, sans-serif;--mono:"JetBrains Mono", ui-monospace, monospace;color:var(--text);background:var(--bg);font-family:var(--sans);font-synthesis:none;text-rendering:optimizelegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}*{box-sizing:border-box}html{scroll-behavior:smooth;background:var(--bg)}body{background:radial-gradient(circle at top left, #378add1c, transparent 34rem), var(--bg);min-width:320px;margin:0;overflow-x:hidden}#root{min-height:100svh}a{color:inherit;text-decoration:none}h1{color:var(--text);margin:0;font-size:clamp(3.75rem,10vw,5rem);font-weight:800;line-height:.95}h2{color:var(--text);max-width:760px;margin:0;font-size:clamp(2rem,5vw,3rem);font-weight:700;line-height:1.08}p{margin:0}.section-shell{width:min(1120px,100% - 40px);margin:0 auto}.intro{isolation:isolate;text-align:center;align-content:center;place-items:center;gap:22px;min-height:100vh;padding:40px 20px;display:grid;position:relative;overflow:hidden}.intro--minimal{background:radial-gradient(circle at top left, #378add14, transparent 32rem), var(--bg);gap:10px;min-height:100vh}.intro--minimal:before{content:"";z-index:-1;pointer-events:none;background:radial-gradient(circle at 50% 48%,#f0f0f00a,#0000 18%),linear-gradient(#0a0a0f00 72%,#0a0a0f 100%);position:absolute;inset:0}.intro-grid,.hero-grid{z-index:-3;background-image:linear-gradient(#f0f0f00b 1px,#0000 1px),linear-gradient(90deg,#f0f0f00b 1px,#0000 1px);background-size:26px 26px;position:absolute;inset:0;-webkit-mask-image:linear-gradient(#000000e6,#0000 92%);mask-image:linear-gradient(#000000e6,#0000 92%)}.intro--minimal .intro-noise,.intro--minimal .scroll-indicator{display:none}.intro--minimal .intro-grid{opacity:.72;-webkit-mask-image:linear-gradient(#000000c7,#00000080 58%,#0000 100%);mask-image:linear-gradient(#000000c7,#00000080 58%,#0000 100%)}.intro--minimal .intro-glow--primary{opacity:.34;top:20%;right:14%}.intro--minimal .intro-glow--secondary{opacity:.24;bottom:12%;left:10%}.intro-noise{z-index:-1;pointer-events:none;opacity:.13;mix-blend-mode:screen;background-image:radial-gradient(circle at 25% 30%,#ffffff47 0 1px,#0000 1px),radial-gradient(circle at 75% 62%,#ffffff2e 0 1px,#0000 1px);background-size:34px 34px,47px 47px;position:absolute;inset:0}.intro:after{content:"";z-index:-1;pointer-events:none;background:radial-gradient(circle at 50% 42%,#0000 0 28%,#00000061 74%),linear-gradient(#0a0a0f00,#0a0a0f 100%);position:absolute;inset:0}.intro--minimal:after{content:none}.intro-glow,.hero-glow{z-index:-2;pointer-events:none;aspect-ratio:1;filter:blur(34px);opacity:.72;will-change:transform;background:radial-gradient(circle,#378add4d,#0000 66%);border-radius:50%;width:clamp(260px,42vw,560px);position:absolute}.intro-glow--primary{top:18%;right:12%}.intro-glow--secondary{opacity:.5;background:radial-gradient(circle,#61dafb24,#0000 68%);width:clamp(220px,34vw,460px);bottom:9%;left:7%}.intro-copy-stack{z-index:5;will-change:transform;justify-items:center;gap:22px;display:grid;position:relative}.intro-kicker{color:var(--muted);font-family:var(--mono);font-size:.86rem}.intro-title{text-wrap:balance;max-width:960px;font-size:clamp(3.2rem,10vw,7.5rem);line-height:.96}.intro-title span{color:var(--accent);text-shadow:0 0 38px #378add38}.intro-title--minimal{z-index:1;color:#f5f5f5;letter-spacing:0;text-shadow:0 8px 28px #ffffff14;max-width:440px;font-size:clamp(1.35rem,3.2vw,2rem);font-weight:800;line-height:1.18;position:relative}.intro-icons{z-index:1;justify-content:center;align-items:center;gap:6px;margin-bottom:8px;display:flex;position:relative}.intro-icons span{color:#f0f0f0d6;width:25px;height:25px;font-family:var(--mono);background:#f0f0f00f;border:1px solid #f0f0f029;border-radius:999px;place-items:center;font-size:.58rem;line-height:1;display:inline-grid;box-shadow:0 8px 24px #00000059}.intro-url{z-index:1;color:#f0f0f075;min-height:21px;font-family:var(--mono);background:#f0f0f00d;border:1px solid #f0f0f014;border-radius:999px;justify-content:center;align-items:center;margin-top:3px;padding:0 10px;font-size:.54rem;display:inline-flex;position:relative}.intro-copy{max-width:560px;color:var(--muted);font-size:clamp(1rem,2.2vw,1.15rem);line-height:1.7}.intro-button{min-height:48px;color:var(--text);font:inherit;cursor:pointer;will-change:transform, box-shadow;background:#f0f0f00f;border:1px solid #f0f0f02e;border-radius:999px;justify-content:center;align-items:center;margin-top:10px;padding:0 22px;font-weight:600;display:inline-flex}.intro-showcase{z-index:3;opacity:.86;pointer-events:none;will-change:transform;gap:14px;display:flex;position:absolute}.intro-showcase--left{top:19%;left:max(20px,50vw - 560px)}.intro-showcase--right{bottom:18%;right:max(20px,50vw - 560px)}.showcase-chip{-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);background:linear-gradient(135deg,#f0f0f014,#f0f0f005),#111118b3;border:1px solid #f0f0f01a;border-radius:10px;flex-direction:column;justify-content:space-between;width:168px;min-height:92px;padding:14px;display:flex;box-shadow:0 24px 70px #0000004d}.showcase-chip span{color:var(--text);font-weight:700}.showcase-chip small{color:var(--muted);font-family:var(--mono);font-size:.68rem}.showcase-chip--blue{box-shadow:0 24px 70px #0000004d,0 0 40px #378add14}.showcase-chip--cyan{box-shadow:0 24px 70px #0000004d,0 0 40px #61dafb14}.intro-mockup{z-index:2;-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px);pointer-events:none;will-change:transform;background:radial-gradient(circle at 76% 22%,#378add29,#0000 34%),#0c0c12bd;border:1px solid #f0f0f01a;border-radius:12px;width:min(360px,28vw);min-height:210px;position:absolute;bottom:15%;left:max(20px,50vw - 486px);overflow:hidden;box-shadow:0 28px 90px #0000006b}.mockup-nav{min-height:38px;color:var(--muted);font-family:var(--mono);border-bottom:1px solid #f0f0f012;justify-content:space-between;align-items:center;padding:0 14px;font-size:.66rem;display:flex}.mockup-body{text-align:left;grid-template-columns:1.15fr .85fr;gap:18px;padding:22px;display:grid}.mockup-badge{background:#22c55e85;border-radius:999px;width:52px;height:10px;margin-bottom:16px;display:block}.mockup-body strong{color:var(--text);font-size:1.6rem;line-height:1;display:block}.mockup-body p{color:var(--muted);font-family:var(--mono);margin-top:10px;font-size:.66rem}.mockup-card-grid{gap:8px;display:grid}.mockup-card-grid span{background:#f0f0f00d;border:1px solid #f0f0f014;border-radius:8px;min-height:38px}.intro-code-window{z-index:4;pointer-events:none;will-change:transform;width:min(430px,34vw);position:absolute;top:56%;right:max(20px,50vw - 500px)}.intro-code-inner{-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px);font-family:var(--mono);background:#1c202be6;border:1px solid #378add3d;border-radius:12px;overflow:hidden;box-shadow:0 30px 90px #00000080,0 0 90px #378add1a}.intro-code-bar{border-bottom:1px solid #ffffff0f;grid-template-columns:82px 1fr 82px;align-items:center;min-height:42px;padding:0 16px;display:grid}.intro-code-bar p{color:#f0f0f0b8;text-align:center;font-size:.78rem;font-family:var(--sans);font-weight:600}.code-dots{gap:8px;display:flex}.code-dots span{border-radius:50%;width:12px;height:12px}.code-dots span:first-child{background:#ff5f57}.code-dots span:nth-child(2){background:#ffbd2e}.code-dots span:nth-child(3){background:#28c840}.intro-code-window pre{color:#f0f0f0c7;text-align:left;margin:0;padding:20px 22px 24px;font-size:clamp(.72rem,1.1vw,.88rem);line-height:1.7}.intro-code-window code{display:block}.scroll-indicator{border:1px solid #f0f0f033;border-radius:999px;justify-content:center;width:28px;height:44px;padding-top:8px;display:flex;position:absolute;bottom:32px;left:50%;transform:translate(-50%)}.scroll-indicator span{background:var(--text);border-radius:999px;width:4px;height:8px}.main-site{position:relative}.navbar{z-index:100;-webkit-backdrop-filter:none;backdrop-filter:none;pointer-events:auto;background:0 0;border-bottom:1px solid #0000;width:100%;transition:box-shadow .5s ease-out,border-color .5s ease-out;position:fixed;top:20px;left:0}.navbar--scrolled{box-shadow:none;border-color:#0000}.nav-inner{border:1px solid var(--border);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);background:#0d0d0d80;border-radius:999px;justify-content:space-between;align-items:center;gap:24px;width:calc(100% - 120px);min-height:42px;margin:0 auto;padding:0 30px;display:flex;box-shadow:0 18px 50px #0000003d}.nav-logo{font-family:var(--mono);color:var(--text);white-space:nowrap;opacity:.72;letter-spacing:.1em;font-size:.82rem;font-weight:500}.nav-links{font-family:var(--mono);align-items:center;gap:clamp(20px,2.8vw,40px);font-size:.82rem;display:flex}.nav-link{opacity:.6;color:var(--text);padding-bottom:4px;position:relative}.nav-link:after{content:"";background:var(--text);transform-origin:0;width:100%;height:1px;transition:transform .5s ease-out;position:absolute;bottom:0;left:0;transform:scaleX(0)}.nav-link--active{opacity:1}.nav-link--active:after{transform:scaleX(1)}.hero{background:radial-gradient(circle at 82% 30%, #378add1a, transparent 22rem), radial-gradient(circle at 18% 68%, #61dafb14, transparent 18rem), var(--bg);isolation:isolate;border:0;border-radius:0;align-items:center;width:100%;min-height:100vh;padding:86px clamp(24px,3.125vw,60px) 54px clamp(24px,6.25vw,120px);display:flex;position:relative;overflow:hidden}.hero-grid{opacity:.68;inset:0;-webkit-mask-image:none;mask-image:none}.hero-glow--primary{top:18%;right:5%}.hero-glow--secondary{opacity:.48;background:radial-gradient(circle,#61dafb26,#0000 68%);width:clamp(220px,34vw,460px);bottom:8%;left:-12%}.hero-content{z-index:3;flex-direction:column;align-items:flex-start;gap:16px;width:min(600px,100%);margin-left:0;display:flex;position:relative}.availability-line{color:var(--muted);font-family:var(--mono);letter-spacing:.2em;text-transform:uppercase;align-items:center;gap:9px;margin-bottom:4px;font-size:.75rem;display:inline-flex}.status-dot{background:#22c55e;border-radius:50%;width:5px;height:5px;animation:1.8s ease-out infinite pulse}.home-title{letter-spacing:-.03em;flex-direction:column;gap:0;font-size:clamp(2rem,6vw,3.875rem);font-weight:800;line-height:1.05;display:flex}.home-title span:first-child{color:var(--text)}.home-title span:last-child{color:var(--muted)}.hero-fullname{color:var(--muted);font-family:var(--mono);margin-top:0;font-size:.82rem;font-weight:500;line-height:1.4}.typewriter{min-height:1.4em;color:var(--muted-strong);font-family:var(--mono);font-size:.94rem;font-weight:500}.typewriter span{color:var(--text);animation:1s step-end infinite cursorBlink}.hero-description{max-width:460px;color:var(--muted);letter-spacing:.01em;font-size:.875rem;line-height:1.9}.tech-pills,.hero-actions,.contact-pills,.project-actions{flex-wrap:wrap;align-items:center;gap:12px;display:flex}.hero-actions{margin-top:2px}.tech-pill{border:1px solid var(--border);background:var(--surface-strong);min-height:26px;color:var(--muted);font-family:var(--mono);will-change:transform, border-color, background-color;border-radius:999px;align-items:center;padding:5px 9px;font-size:.7rem;display:inline-flex}.button{min-height:34px;font:inherit;font-family:var(--mono);cursor:pointer;will-change:transform, box-shadow;background:0 0;border:1px solid #0000;border-radius:999px;justify-content:center;align-items:center;padding:0 14px;font-size:.72rem;font-weight:500;display:inline-flex}.button--primary{color:#0a0a0f;background:#f0f0f0}.button--secondary{border:1px solid var(--border);color:var(--muted-strong)}.hero-contact-line{color:var(--muted);font-family:var(--mono);flex-direction:column;gap:6px;font-size:.82rem;display:flex}.hero-polaroid{z-index:4;will-change:transform, opacity;pointer-events:auto;width:clamp(170px,15vw,225px);min-height:510px;position:absolute;top:5%;right:clamp(58px,11vw,210px)}.lanyard{z-index:1;color:#f0f0f09e;width:27px;height:280px;font-family:var(--mono);letter-spacing:0;background:linear-gradient(#020202,#141414 58%,#040404);border-radius:16px;flex-direction:column;justify-content:center;align-items:center;gap:22px;font-size:.48rem;display:flex;position:absolute;top:-72px;left:50%;transform:translate(-50%)rotate(3deg);box-shadow:0 20px 70px #00000080}.lanyard:before{content:"";background:#141418e0;border:3px solid #d4d4d4c7;border-radius:999px;width:18px;height:34px;position:absolute;bottom:-20px;left:50%;transform:translate(-50%);box-shadow:0 10px 22px #0000006b}.lanyard:after{content:"";background:linear-gradient(#d9d9d9,#808085);border-radius:4px;width:38px;height:16px;position:absolute;bottom:-38px;left:50%;transform:translate(-50%);box-shadow:0 12px 28px #0000005c}.lanyard span{writing-mode:vertical-rl;text-orientation:mixed}.polaroid-card{z-index:2;aspect-ratio:.73;cursor:grab;touch-action:none;transform-origin:top;-webkit-user-select:none;user-select:none;will-change:transform, box-shadow;background:linear-gradient(145deg,#fff,#dcdcdc);border-radius:7px;width:100%;padding:12px 12px 38px;position:absolute;top:178px;left:6px;box-shadow:0 34px 90px #00000080,0 0 70px #ffffff12}.polaroid-card:before{content:"";background:#0b0b10;border:5px solid #f5f5f5;border-radius:50%;width:21px;height:21px;position:absolute;top:-11px;left:50%;transform:translate(-50%);box-shadow:0 12px 24px #00000047}.polaroid-card:after{content:"ALFONSO";color:#0a0a0f66;font-family:var(--mono);letter-spacing:.08em;font-size:.55rem;position:absolute;bottom:17px;left:18px}.portrait-visual{filter:grayscale();background:radial-gradient(circle at 72% 22%,#ffffff52,#0000 16%),linear-gradient(145deg,#ffffff2b,#0000 34%),linear-gradient(160deg,#050506 0%,#171821 48%,#050506 100%);border-radius:4px;width:100%;height:100%;position:relative;overflow:hidden}.portrait-visual:before{content:"";mix-blend-mode:screen;background:linear-gradient(90deg,#ffffff1f,#0000 28%),radial-gradient(circle at 50% 120%,#ffffff1f,#0000 34%);position:absolute;inset:0}.portrait-light{filter:blur(18px);background:#ffffff24;border-radius:50%;width:42%;height:34%;position:absolute;top:12%;right:12%}.portrait-head{aspect-ratio:.82;background:radial-gradient(circle at 58% 34%,#ffffff57,#0000 18%),linear-gradient(145deg,#d8d8d8,#4a4a50 52%,#101014);border-radius:48% 48% 42% 42%;width:30%;position:absolute;top:23%;left:50%;transform:translate(-50%);box-shadow:0 18px 30px #00000057}.portrait-neck{background:linear-gradient(#9c9c9f,#25252a);border-radius:0 0 999px 999px;width:16%;height:12%;position:absolute;top:51%;left:50%;transform:translate(-50%)}.portrait-shoulders{background:radial-gradient(circle at 50% 0,#ffffff2e,#0000 30%),linear-gradient(145deg,#34343c,#08080a 64%);border-radius:48% 48% 10px 10px;width:76%;height:42%;position:absolute;bottom:-10%;left:50%;transform:translate(-50%);box-shadow:0 -12px 32px #0006}.hero-scroll{color:var(--muted);font-family:var(--mono);letter-spacing:.2em;text-transform:uppercase;font-size:.7rem;position:absolute;bottom:18px;left:50%;transform:translate(-50%)}.content-section{padding:96px 0}.section-heading{margin-bottom:34px}.section-label{color:var(--muted);font-family:var(--mono);text-transform:uppercase;margin-bottom:12px;font-size:.78rem}.skills-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;display:grid}.skill-card,.project-card,.contact-card{border:1px solid var(--border);background:var(--surface);border-radius:10px}.skill-card{will-change:transform, border-color, box-shadow;min-height:118px;padding:16px}.skill-card h3,.project-card h3{color:var(--text);margin:0;font-size:1.02rem;font-weight:700}.skill-card p,.project-tech{color:var(--muted);font-family:var(--mono);margin-top:8px;font-size:.78rem}.projects-list{flex-direction:column;gap:16px;display:flex}.project-card{will-change:transform, border-color, box-shadow;justify-content:space-between;align-items:flex-start;gap:24px;padding:22px;display:flex}.project-description{max-width:720px;color:var(--muted);margin-top:18px;line-height:1.7}.project-actions{flex:none;justify-content:flex-end}.project-actions a{min-height:34px;color:var(--muted-strong);font-family:var(--mono);will-change:transform, border-color, background-color;border:1px solid #f0f0f02e;border-radius:999px;justify-content:center;align-items:center;padding:0 12px;font-size:.74rem;display:inline-flex}.contact-section{padding-bottom:112px}.contact-card{background:radial-gradient(circle at top right, #378add1f, transparent 38%), var(--surface-strong);padding:clamp(24px,5vw,42px)}.contact-card h2{max-width:none}.contact-copy{color:var(--muted);margin-top:16px;line-height:1.7}.contact-pills{margin-top:28px}.contact-pills a{min-height:46px;color:var(--text);font-family:var(--mono);will-change:transform, border-color, background-color;border:1px solid #f0f0f024;border-radius:999px;justify-content:center;align-items:center;padding:0 16px;font-size:.84rem;display:inline-flex}.footer{min-height:82px;color:var(--muted);font-family:var(--mono);border-top:1px solid #f0f0f014;justify-content:space-between;align-items:center;gap:20px;font-size:.76rem;display:flex}@keyframes pulse{0%{box-shadow:0 0 #22c55e6b}70%{box-shadow:0 0 0 8px #22c55e00}to{box-shadow:0 0 #22c55e00}}@keyframes cursorBlink{0%,49%{opacity:1}50%,to{opacity:0}}@media (width<=900px){.intro-showcase{opacity:.42}.intro-showcase--left{top:13%}.intro-showcase--right{bottom:12%}.intro-mockup{display:none}.intro-code-window{width:auto;inset:auto 20px 92px}.skills-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.project-card{flex-direction:column}.project-actions{justify-content:flex-start}.code-float{display:none}.hero-polaroid{opacity:.82;width:150px;top:7%;right:24px}.home-title{font-size:clamp(3rem,7.2vw,4.4rem)}}@media (width<=640px){.section-shell,.nav-inner{width:min(100% - 28px,1120px)}.nav-inner{min-height:34px}.nav-links{gap:12px;font-size:.62rem}.intro{padding-inline:14px;min-height:100svh;padding-bottom:150px}.intro-title{font-size:clamp(3rem,16vw,5rem)}.intro-copy-stack{gap:18px}.intro-showcase{display:none}.intro-code-window{width:auto;bottom:72px;left:14px;right:14px}.intro-code-bar{grid-template-columns:66px 1fr 24px;padding-inline:12px}.intro-code-bar p{font-size:.68rem}.intro-code-window pre{padding:16px 18px 18px;font-size:.68rem}.code-dots span{width:9px;height:9px}.hero{min-height:100svh;padding-top:96px}.hero-content{gap:20px}.hero-polaroid{display:none}.home-title{font-size:clamp(3.1rem,15vw,4.8rem)}.skills-grid{grid-template-columns:1fr}.content-section{padding:72px 0}.contact-pills a{width:100%}.footer{flex-direction:column;justify-content:center;align-items:flex-start;min-height:96px}}@media (width<=430px){.nav-logo{font-size:.78rem}.nav-links{gap:9px;font-size:.68rem}.button,.hero-actions,.intro-button{width:100%}.button{flex:100%}}