@import"https://fonts.googleapis.com/css2?family=Fraunces:ital,opsz,wght@0,9..144,100..900;1,9..144,100..900&family=Inter:ital,opsz,wght@0,14..32,100..900;1,14..32,100..900&display=swap";:root{font-family:system-ui,Avenir,Helvetica,Arial,sans-serif;line-height:1.5;font-weight:400;color-scheme:light dark;color:#ffffffde;background-color:#242424;font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}a{font-weight:500;color:#646cff;text-decoration:inherit}a:hover{color:#535bf2}body{margin:0;display:flex;place-items:center;min-width:320px;min-height:100vh}h1{font-size:3.2em;line-height:1.1}button{border-radius:8px;border:1px solid transparent;padding:.6em 1.2em;font-size:1em;font-weight:500;font-family:inherit;background-color:#1a1a1a;cursor:pointer;transition:border-color .25s}button:hover{border-color:#646cff}button:focus,button:focus-visible{outline:4px auto -webkit-focus-ring-color}@media(prefers-color-scheme:light){:root{color:#213547;background-color:#fff}a:hover{color:#747bff}button{background-color:#f9f9f9}}.hero{display:flex;flex-direction:column;align-items:center;justify-content:center;width:100%;height:100vh;max-width:100%;padding:0 4rem;gap:2rem;font-size:clamp(1.5rem,calc(4vw + 1rem),4rem);line-height:clamp(1.5rem,calc(4vw + 1rem),4rem);text-align:center;font-weight:200;background:linear-gradient(to bottom,var(--cream),var(--manilla));position:relative;z-index:1}.hero .hero-intro{animation:fadeIn 1.5s ease-in-out}.hero .hero-intro .emphasis{font-family:Fraunces,serif;font-weight:900;font-style:italic;line-height:clamp(1.5rem,calc(4vw + 1rem),4rem);color:var(--hot-magenta)}.hero .hero-intro .hero-description{font-size:1.5rem;line-height:1.75rem;font-weight:400;margin-top:2rem;color:var(--armada-blue)}@keyframes fadeIn{0%{filter:blur(5px);opacity:0;transform:translateY(20px)}to{filter:blur(0px);opacity:1;transform:translateY(0)}}@keyframes cardIn{0%{transform:translateY(20px);opacity:0}to{transform:translateY(0);opacity:1}}.role-cards-viewport{width:100%;margin-top:clamp(.5rem,2vw,1rem);overflow:hidden;flex:1;min-height:0;padding-bottom:clamp(1rem,3vw,2rem);display:flex;flex-direction:column}.role-cards{display:flex;flex-direction:row;flex-wrap:nowrap;width:max-content;align-items:flex-end;flex:1;min-height:0}.role-cards-spacer{flex-shrink:0;min-height:0;height:100%}.role-card-slot{flex-shrink:0;box-sizing:border-box;display:flex;flex-direction:column;justify-content:flex-end}.role-cards-viewport .role-card-slot .card{width:100%;max-width:none;min-width:unset;box-sizing:border-box;height:100%;min-height:0}@media(max-width:767px){.role-cards-viewport{margin-top:clamp(.2rem,1vw,.4rem)}.role-cards{align-items:center}.role-card-slot{max-height:min(72vh,480px)}}.timeline-bar-container{width:100%;padding:clamp(.5rem,calc(2vw + 1rem),1rem) 0;display:flex;flex-direction:column;gap:clamp(.25rem,calc(1vw + 1rem),.5rem)}.timeline-bar-wrapper{display:flex;align-items:center;gap:clamp(1rem,calc(2vw + 1rem),1.5rem)}.timeline-icon{font-size:clamp(1.5rem,calc(4vw + 1rem),2rem);color:var(--teal-green);flex-shrink:0;z-index:3;margin-right:clamp(1.5rem,calc(4vw + 1rem),2rem)}.timeline-bar-track+.timeline-label{margin-left:clamp(-.5rem,-1vw - .5rem,-.75rem)}.timeline-bar-track{position:relative;width:clamp(180px,calc(30vw + 1rem),250px);height:clamp(8px,calc(2vw + 1rem),12px);background:#7ed95733;border-radius:20px;overflow:visible;flex-shrink:0}.timeline-bar-fill{position:absolute;top:0;left:0;height:100%;width:100%;background:linear-gradient(90deg,var(--teal-green),var(--armada-blue));border-radius:20px;transform-origin:left;box-shadow:0 0 15px #2ee6d666}.timeline-marker{position:absolute;top:50%;font-size:clamp(.85rem,calc(2vw + 1rem),1rem);font-weight:700;color:var(--cream);white-space:nowrap;background:var(--dark-indigo);padding:clamp(.2rem,calc(1vw + 1rem),.35rem) clamp(.5rem,calc(1.5vw + 1rem),.65rem);border-radius:6px;border:2px solid var(--teal-green);z-index:2;min-width:clamp(50px,calc(12vw + 1rem),70px);text-align:center}.timeline-marker-start{left:0%;transform:translate(-50%,-50%)}.timeline-marker-end{left:0%;transform:translate(-50%,-50%);transition:none;opacity:0}.timeline-label{font-size:clamp(.9rem,calc(2.5vw + 1rem),1.1rem);font-weight:700;color:var(--teal-green);white-space:nowrap;opacity:0;flex-shrink:0}.company-section{height:100vh;max-width:100%;display:flex;flex-direction:column;align-items:flex-start;justify-content:flex-start;gap:clamp(.5rem,2vw,1rem);background:linear-gradient(to bottom,var(--dark-indigo),var(--armada-blue));padding:clamp(1rem,3vw,2rem);color:var(--cream);margin:0;position:relative;z-index:1}.company-section .role-info{width:100%;flex:1;display:flex;flex-direction:column;min-height:0}.company-section .role-info .role-title{margin-bottom:clamp(.25rem,1vw,.5rem)}.company-section .company-info{flex-shrink:0;padding-bottom:clamp(.25rem,1vw,.5rem)}.company-section .company-title{font-family:Fraunces,serif;font-size:clamp(1.5rem,4vw,2rem);font-weight:700;color:var(--hot-magenta)}.company-section .role-title{font-family:Fraunces,serif;font-size:clamp(1.2rem,3vw,1.5rem);font-weight:600;color:var(--cream);margin:0}@media(max-width:767px){.company-section .role-info .role-title{margin-bottom:.15rem}}.card{position:relative;display:flex;flex-direction:column;align-items:flex-start;justify-content:flex-start;min-width:250px;max-width:30%;background:var(--cream);color:var(--dark-indigo);text-align:left;border-radius:15px;padding:clamp(1.5rem,4vw,2rem);box-shadow:0 4px 12px #00000026;overflow:hidden}.card .card-number{position:absolute;top:clamp(.5rem,2vw,1rem);right:clamp(.5rem,2vw,1rem);font-family:Fraunces,serif;font-size:clamp(4rem,10vw,6rem);font-weight:900;color:#2b1c0d14;line-height:1;pointer-events:none;-webkit-user-select:none;user-select:none;z-index:0}.card .card-content{position:relative;z-index:1;width:100%;min-height:clamp(150px,30vw,200px);display:flex;flex-direction:column;gap:clamp(.75rem,2vw,1rem)}.card .card-heading{font-family:Fraunces,serif;font-size:clamp(1.3rem,3.5vw,1.6rem);line-height:clamp(1.4rem,3.7vw,1.7rem);font-weight:700;color:var(--dark-indigo);margin:0;max-width:70%;min-height:70px}.card .card-text{font-size:clamp(1rem,2.8vw,1.35rem);line-height:clamp(1.35rem,3.5vw,1.65rem);font-weight:400;color:var(--armada-blue);margin:0;padding:clamp(.75rem,2vw,1.25rem) clamp(.25rem,1vw,.5rem) 0 0;max-width:100%;overflow-wrap:break-word;word-break:break-word}.role-cards-viewport .role-card-slot .card{max-width:none;min-width:unset;height:100%;min-height:0}.role-cards-viewport .role-card-slot .card .card-content{min-height:0;overflow:hidden}.role-cards-viewport .role-card-slot .card .card-heading{min-height:0;flex-shrink:0}@media(max-width:767px){.role-cards-viewport .role-card-slot .card{padding:clamp(1rem,3vw,1.5rem) clamp(1.25rem,4vw,1.75rem)}.role-cards-viewport .role-card-slot .card .card-content{min-height:0}.role-cards-viewport .role-card-slot .card .card-heading{min-height:0;font-size:clamp(1.25rem,4vw,1.5rem);line-height:clamp(1.3rem,4.2vw,1.55rem)}.role-cards-viewport .role-card-slot .card .card-text{padding-top:clamp(.5rem,1.5vw,.75rem);font-size:clamp(1.05rem,3.2vw,1.25rem);line-height:clamp(1.4rem,4vw,1.5rem)}}@media(max-height:600px){.role-cards-viewport .role-card-slot .card .card-number{left:clamp(.35rem,1.5vw,.75rem);right:auto;top:clamp(.35rem,1.5vw,.5rem);font-size:clamp(2rem,8vw,2.5rem)}.role-cards-viewport .role-card-slot .card .card-content{overflow-y:auto;min-height:0;gap:.2rem;padding-left:clamp(.75rem,10vw,1rem);-webkit-overflow-scrolling:touch}.role-cards-viewport .role-card-slot .card .card-heading{font-size:clamp(1.1rem,3vw,1.35rem);line-height:clamp(1.2rem,3.2vw,1.45rem);min-height:24px}.role-cards-viewport .role-card-slot .card .card-text{font-size:clamp(.9rem,2.5vw,1.1rem);line-height:clamp(1.2rem,3.2vw,1.4rem);padding-top:0}}.technical-skills{min-height:100vh;width:100%;display:flex;flex-direction:column;align-items:center;justify-content:center;background:linear-gradient(to bottom,var(--manilla),var(--cream));padding:clamp(2rem,5vw,4rem) clamp(1rem,3vw,2rem);gap:clamp(2rem,4vw,3rem);position:relative;z-index:1}.skills-header{text-align:center}.skills-title{font-family:Fraunces,serif;font-size:clamp(2rem,5vw,3rem);font-weight:700;color:var(--dark-indigo)}.skills-content{display:flex;flex-direction:column;gap:clamp(2rem,5vw,4rem);max-width:1200px;width:100%}.skills-subtitle{font-family:Fraunces,serif;font-size:clamp(1.3rem,3vw,1.8rem);font-weight:600;color:var(--armada-blue);margin-bottom:clamp(1rem,3vw,2rem);text-align:center}.core-skills{display:flex;flex-direction:column;align-items:center}.skills-icons{display:flex;flex-wrap:wrap;gap:clamp(1.5rem,4vw,3rem);justify-content:center;align-items:center}.skill-item{display:flex;flex-direction:column;align-items:center;gap:clamp(.5rem,1.5vw,.75rem);transition:transform .3s ease}.skill-item:hover{transform:translateY(-8px)}.skill-item i{font-size:clamp(2.5rem,6vw,4rem);color:var(--hot-magenta);transition:color .3s ease}.skill-item:hover i{color:var(--burnt-orange)}.skill-icon-svg{width:clamp(2.5rem,6vw,4rem);height:clamp(2.5rem,6vw,4rem);transform:scale(.92);transition:all .3s ease}.skill-icon-svg .ts-background{fill:var(--hot-magenta);transition:fill .3s ease}.skill-icon-svg .ts-text-mask{transform:scale(.85);transform-origin:80% 80%}.skill-item:hover .skill-icon-svg .ts-background{fill:var(--burnt-orange)}.skill-name{font-size:clamp(.85rem,2vw,1rem);font-weight:600;color:var(--dark-indigo);text-align:center}.additional-skills{display:flex;flex-direction:column;align-items:center}.skills-tags{display:flex;flex-wrap:wrap;gap:clamp(.5rem,2vw,1rem);justify-content:center;max-width:900px}.skill-tag{padding:clamp(.5rem,1.5vw,.75rem) clamp(1rem,3vw,1.5rem);background-color:var(--dark-indigo);color:var(--cream);border-radius:clamp(15px,4vw,25px);font-size:clamp(.85rem,2vw,1rem);font-weight:500;transition:all .3s ease;border:2px solid var(--hot-magenta)}.skill-tag:hover{background-color:var(--hot-magenta);transform:scale(1.05);box-shadow:0 4px 12px #ff2e634d}.menu-bar{position:fixed;bottom:20px;left:50%;transform:translate(-50%);z-index:2000;opacity:0;pointer-events:all}.menu-container{display:flex;align-items:center;gap:1.5rem;padding:1rem 2rem;background:#0b1c2d80;-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px);border-radius:50px;box-shadow:0 8px 32px #0006,0 0 0 1px #ff2e6333;border:1px solid rgba(255,255,255,.1)}.menu-item{position:relative;display:flex;align-items:center;justify-content:center;cursor:pointer;transition:transform .3s ease}.menu-item:hover{transform:translateY(-4px)}.marker-circle{width:15px;height:15px;border-radius:50%;background:var(--teal-green);transition:all .3s ease;box-shadow:0 2px 8px #2ee6d64d}.menu-item:hover .marker-circle{background:var(--hot-magenta);box-shadow:0 4px 16px #ff2e6399;transform:scale(1.2)}.menu-icon{font-size:1.5rem;color:var(--teal-green);transition:color .3s ease}.menu-item:hover .menu-icon{color:var(--hot-magenta)}.social-link{text-decoration:none}.menu-divider{width:1px;height:24px;background:linear-gradient(to bottom,transparent,var(--hot-magenta),transparent);margin:0 .5rem}.tooltip{position:absolute;bottom:calc(100% + 12px);left:50%;transform:translate(-50%) scale(.8);padding:.5rem 1rem;background:var(--dark-indigo);color:var(--cream);font-size:.85rem;font-weight:500;white-space:nowrap;border-radius:8px;pointer-events:none;opacity:0;transition:all .3s ease;box-shadow:0 4px 12px #0000004d;border:1px solid var(--hot-magenta)}.tooltip:after{content:"";position:absolute;top:100%;left:50%;transform:translate(-50%);border:6px solid transparent;border-top-color:var(--hot-magenta)}.menu-item:hover .tooltip{opacity:1;transform:translate(-50%) scale(1)}:root{--color-primary: #13133F;--color-secondary: #2e4482;--color-accent: #c13955;--color-accent-transparent: #FF073A33;--color-text: #fcf3ee;--color-text-accent: #FF073A;--dark-indigo: #0b1C2D;--armada-blue: #243A52;--hot-magenta: #FF2E63;--teal-green: #2EE6D6;--cool-gray: #C7D3DD;--cream: #F5EBDD;--muted-olive: #7A6F4B;--dark-mocha: #2F2A28;--manilla: #E6C9A8;--burnt-orange: #C65A3A}*{box-sizing:border-box}body{font-family:Inter,sans-serif;color:var(--dark-indigo);margin:0;overflow-x:hidden;background:var(--dark-indigo)}#root{display:flex;flex-direction:column;align-items:stretch;width:100%;min-height:100vh;background:var(--dark-indigo)}h1,h2,h3,h4,h5,h6,p{margin:0}
