@import "https://fonts.googleapis.com/css2?family=Outfit:wght@300;400;600;800&display=swap";
:root{--background:#000;--foreground:#fff;--accent:#0070f3;--accent-rgb:0,112,243;--card-bg:#ffffff05;--card-border:#ffffff14;--glass:#000000b3;--glow:#0070f333}body:after{content:"";pointer-events:none;z-index:1;background-image:linear-gradient(#ffffff05 1px,#0000 1px),linear-gradient(90deg,#ffffff05 1px,#0000 1px);background-size:50px 50px;position:absolute;inset:0}*{box-sizing:border-box;margin:0;padding:0}body{background:radial-gradient(circle at 50% 50%,#0070f30d 0%,transparent 50%),var(--background);color:var(--foreground);justify-content:center;align-items:center;width:100vw;height:100vh;font-family:Outfit,sans-serif;display:flex;position:relative;overflow:hidden}body:before{content:"";opacity:.03;pointer-events:none;z-index:1;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 200 200' xmlns='http://www.w3.org/2000/svg'%3e%3cfilter id='noiseFilter'%3e%3cturbulence type='fractalNoise' baseFrequency='0.65' numOctaves='3' stitchTiles='stitch'/%3e%3c/filter%3e%3crect width='100%25' height='100%25' filter='url(%23noiseFilter)'/%3e%3c/svg%3e");position:absolute;inset:0}.main-container{grid-template-rows:repeat(2,1fr);grid-template-columns:repeat(4,1fr);gap:20px;width:90%;max-width:1400px;height:80vh;display:grid}@keyframes fadeInUp{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}.card{background:var(--card-bg);border:1px solid var(--card-border);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);opacity:0;border-radius:24px;transition:all .4s cubic-bezier(.4,0,.2,1);animation:.8s cubic-bezier(.4,0,.2,1) forwards fadeInUp;position:relative;overflow:hidden}.dev-card{animation-delay:.1s}.travel-card{animation-delay:.2s}.family-card{animation-delay:.3s}.contact-card{animation-delay:.4s}.card:hover{border-color:var(--accent);box-shadow:0 20px 40px #0006,0 0 20px var(--glow);transform:translateY(-5px)}.card-image-bg{object-fit:cover;opacity:.4;filter:grayscale(40%);width:100%;height:100%;transition:all .6s;position:absolute;inset:0}.card:hover .card-image-bg{opacity:.7;filter:grayscale(0%);transform:scale(1.05)}@keyframes pulseHeart{0%{transform:scale(1)}50%{transform:scale(1.05)}to{transform:scale(1)}}@keyframes pulseHeartHover{0%{transform:scale(1.05)}50%{transform:scale(1.12)}to{transform:scale(1.05)}}.heartbeat-animation{transform-origin:50%;animation:3s ease-in-out infinite pulseHeart}.card:hover .heartbeat-animation{opacity:.8;filter:grayscale(0%);animation:1s ease-in-out infinite pulseHeartHover;transform:none}.spotify-widget{-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);background:#0006;border:1px solid #ffffff1a;border-radius:20px;align-items:center;gap:12px;max-width:350px;height:36px;padding:6px 12px;display:flex;overflow:hidden}.spotify-icon-container{color:#1db954;flex-shrink:0;align-items:center;display:flex}.spotify-logo{width:18px;height:18px}.spotify-content{align-items:center;gap:8px;display:flex;position:relative;overflow:hidden;-webkit-mask-image:linear-gradient(90deg,#0000,#000 10% 90%,#0000);mask-image:linear-gradient(90deg,#0000,#000 10% 90%,#0000)}.equalizer{align-items:flex-end;gap:2px;height:12px;margin-bottom:2px;display:flex}.bar{background:#1db954;width:2px;animation:1s ease-in-out infinite equalize}.bar:first-child{height:60%;animation-delay:-.4s}.bar:nth-child(2){height:100%;animation-delay:-.2s}.bar:nth-child(3){height:80%;animation-delay:-.6s}@keyframes equalize{0%,to{height:40%}50%{height:100%}}.track-info-scroller{white-space:nowrap;gap:6px;animation:10s linear infinite scrollText;display:flex}.track-info{align-items:center;gap:6px;display:flex}.track-name{color:#e0e0e0;font-size:.7rem;font-weight:600}.track-divider{color:#fff6;font-size:.6rem}@keyframes scrollText{0%{transform:translate(0)}to{transform:translate(-50%)}}@media (max-width:640px){.spotify-widget{z-index:101;width:fit-content;max-width:90vw;margin-inline:auto;padding:4px 8px;display:flex;position:absolute;top:60px;left:0;right:0}.social-links{gap:16px}.main-container{margin-top:60px}}.card-overlay{z-index:2;background:linear-gradient(#0000 30%,#000000e6 100%);flex-direction:column;justify-content:flex-end;padding:40px;display:flex;position:absolute;inset:0}.card-title{letter-spacing:-.03em;margin-bottom:12px;font-size:3rem;font-weight:800;line-height:1}.card-desc{opacity:.7;max-width:85%;font-size:1.2rem;font-weight:300;line-height:1.4}.dev-card{grid-area:span 2/span 2}.travel-card{grid-area:span 1/span 2}.family-card{grid-area:span 1/span 1}.tech-marquee-container{z-index:1;width:100%;position:absolute;top:40px;left:0;overflow:hidden}.tech-marquee{white-space:nowrap;gap:30px;width:max-content;animation:20s linear infinite scroll;display:flex}@keyframes scroll{0%{transform:translate(0)}to{transform:translate(-50%)}}.tech-item{opacity:.15;flex-direction:column;transition:opacity .3s;display:flex}.card:hover .tech-item{opacity:.5}.tech-name{font-size:2.5rem;font-weight:800;line-height:1}.tech-level{text-transform:uppercase;letter-spacing:.1em;font-size:.8rem;font-weight:400}.dev-identity{z-index:5;transition:all .5s cubic-bezier(.4,0,.2,1);position:absolute;top:40px;right:40px}.identity-avatar-wrapper{background:linear-gradient(135deg,var(--accent),transparent);border:1px solid #ffffff1a;border-radius:20px;width:80px;height:80px;padding:3px;transition:all .5s;transform:rotate(5deg)}.dev-card:hover .identity-avatar-wrapper{transform:rotate(0)scale(1.1);box-shadow:0 10px 30px #0070f34d}.identity-avatar{object-fit:cover;border-radius:17px;width:100%;height:100%}.github-stats-bar{z-index:5;opacity:.6;gap:20px;transition:opacity .3s;display:flex;position:absolute;top:140px;left:40px}.dev-card:hover .github-stats-bar{opacity:1}.stat-pill{flex-direction:column;gap:2px;display:flex}.stat-value{color:#fff;font-size:1.5rem;font-weight:800;line-height:1}.stat-label{letter-spacing:.1em;opacity:.4;font-size:.6rem;font-weight:700}.language-badge{background:rgba(var(--accent-rgb),.1);color:var(--accent);border:1px solid rgba(var(--accent-rgb),.2);border-radius:4px;margin-left:4px;padding:2px 6px;font-size:.6rem;font-weight:700}.projects-overlay{z-index:5;opacity:0;pointer-events:none;width:350px;transition:all .6s cubic-bezier(.4,0,.2,1);position:absolute;top:220px;right:40px;transform:translate(20px)}.dev-card:hover .projects-overlay{opacity:1;pointer-events:auto;transform:translate(0)}.projects-header{align-items:center;gap:15px;margin-bottom:25px;display:flex}.projects-label{letter-spacing:.2em;color:var(--accent);white-space:nowrap;font-size:.7rem;font-weight:800}.projects-line{background:linear-gradient(to right,var(--accent),transparent);flex:1;height:1px}.projects-list{flex-direction:column;gap:15px;display:flex}.project-item{opacity:0;cursor:pointer;border-bottom:1px solid #ffffff0d;justify-content:space-between;align-items:flex-start;padding-bottom:12px;transition:all .3s;display:flex;transform:translateY(10px)}.dev-card:hover .project-item{opacity:1;animation:.5s forwards fadeInUp;transform:translateY(0)}.project-info{flex-direction:column;gap:4px;display:flex}.project-name-row{align-items:center;gap:8px;display:flex}.status-dot{border-radius:50%;width:6px;height:6px;position:relative}.status-dot.live{background:#0f8;box-shadow:0 0 10px #0f8}.status-dot.live:after{content:"";border:1px solid #0f8;border-radius:50%;animation:2s infinite pulse-green;position:absolute;inset:-2px}.status-dot.dev{background:#ff9500;box-shadow:0 0 10px #ff9500}@keyframes pulse-green{0%{opacity:1;transform:scale(1)}to{opacity:0;transform:scale(3)}}.project-name{color:#fff;font-size:1.1rem;font-weight:700}.project-type{opacity:.5;text-transform:none;letter-spacing:.02em;-webkit-line-clamp:2;line-clamp:2;-webkit-box-orient:vertical;max-width:280px;font-size:.7rem;font-weight:400;display:-webkit-box;overflow:hidden}.project-tech{color:var(--accent);background:#ffffff0d;border:1px solid #ffffff1a;border-radius:6px;padding:4px 10px;font-size:.65rem;font-weight:600}.project-item:hover{border-bottom-color:var(--accent)}.project-item:hover .project-name{color:var(--accent)}@media (max-width:1400px){.projects-overlay{width:280px;right:30px}}@media (max-width:1024px){.projects-overlay{opacity:1;pointer-events:auto;width:100%;margin-top:40px;padding:0 40px;position:relative;top:0;right:0;transform:none}.projects-list{grid-template-columns:1fr 1fr;gap:20px;display:grid}}@media (max-width:640px){.projects-list{grid-template-columns:1fr}.projects-overlay{padding:0 20px}}.card-badge{-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);letter-spacing:.05em;z-index:5;background:#ffffff1a;border:1px solid #ffffff1a;border-radius:100px;padding:6px 14px;font-size:.7rem;font-weight:700;position:absolute;top:30px;right:30px}.travel-stats-overlay{z-index:5;flex-direction:column;align-items:flex-end;gap:30px;display:flex;position:absolute;top:40px;right:40px}.progress-ring-container{justify-content:center;align-items:center;width:120px;height:120px;display:flex;position:relative}.progress-ring-bg{fill:none;stroke:#ffffff0d;stroke-width:6px}.progress-ring-fill{fill:none;stroke:#ff9500;stroke-width:6px;stroke-linecap:round;stroke-dasharray:339;stroke-dashoffset:268px;transform-origin:50%;filter:drop-shadow(0 0 8px #ff950080);transition:stroke-dashoffset 1.5s cubic-bezier(.4,0,.2,1);transform:rotate(-90deg)}.card:hover .progress-ring-fill{stroke-dashoffset:268px}.progress-text{flex-direction:column;align-items:center;line-height:1;display:flex;position:absolute}.progress-text .count{color:#fff;font-size:2rem;font-weight:800}.progress-text .label{letter-spacing:.1em;opacity:.5;font-size:.6rem;font-weight:700}.travel-meta{text-align:right;flex-direction:column;gap:15px;display:flex}.meta-item{flex-direction:column;display:flex}.meta-label{letter-spacing:.1em;opacity:.4;margin-bottom:4px;font-size:.65rem;font-weight:800}.meta-value{color:#fff;font-size:1.1rem;font-weight:700}.meta-divider{background:#ffffff1a;align-self:flex-end;width:40px;height:1px}.pulse-text{color:#ff9500;animation:2s infinite textPulse}@keyframes textPulse{0%{opacity:1}50%{opacity:.6}to{opacity:1}}.contact-card-flip{perspective:1000px;cursor:pointer;grid-area:span 1/span 1;-webkit-backdrop-filter:none!important;backdrop-filter:none!important;background:0 0!important;border:none!important;padding:0!important;display:block!important}.card-face{backface-visibility:hidden;border-radius:24px;flex-direction:column;justify-content:center;align-items:center;width:100%;height:100%;transition:transform .8s cubic-bezier(.4,0,.2,1);display:flex;position:absolute;inset:0}.card-front{color:#fff;z-index:2;background:#000;position:relative;overflow:hidden}.card-overlay-gradient{z-index:1;background:linear-gradient(#0000,#000c);position:absolute;inset:0}.contact-text{z-index:5;text-shadow:0 2px 10px #00000080;position:relative}.card-back{-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);border:1px solid var(--card-border);z-index:1;background:#ffffff0d;padding:20px;transform:rotateY(180deg)}.contact-card-flip.flipped .card-front{transform:rotateY(180deg)}.contact-card-flip.flipped .card-back{transform:rotateY(360deg)}.back-links{flex-direction:column;gap:12px;width:100%;display:flex}.back-link{color:#fff;text-align:center;background:#ffffff1a;border:1px solid #ffffff1a;border-radius:12px;padding:14px;font-size:.9rem;font-weight:600;text-decoration:none;transition:all .3s}.back-link:hover{background:var(--accent);border-color:var(--accent);transform:translateY(-2px)}.email-link{background:0 0;border-color:#fff3}.flip-back-btn{color:#fff6;letter-spacing:.1em;cursor:pointer;background:0 0;border:none;margin-top:20px;font-size:.7rem;font-weight:700;transition:color .3s}.flip-back-btn:hover{color:#fff}header{z-index:100;justify-content:space-between;align-items:center;display:flex;position:absolute;top:30px;left:5%;right:5%}.logo{letter-spacing:.15em;text-transform:uppercase;opacity:.9;cursor:default;white-space:nowrap;flex-shrink:0;gap:.6em;font-size:1.2rem;font-weight:800;line-height:1;display:flex}.logo-line{white-space:nowrap;display:inline-block}@media (max-width:640px){header{align-items:flex-start;top:20px}.logo{flex-direction:column;gap:2px;margin-top:2px;line-height:1}.logo-line{white-space:nowrap;display:block}}.logo span{opacity:0;animation:.5s cubic-bezier(.4,0,.2,1) forwards logoReveal;display:inline-block;transform:translateY(10px)}@keyframes logoReveal{to{opacity:1;transform:translateY(0)}}.logo:hover{text-shadow:.05em 0 #ff0000bf,-.025em -.05em #00ff00bf,.025em .05em #0000ffbf;animation:.5s infinite glitch}@keyframes glitch{0%{text-shadow:.05em 0 #ff0000bf,-.05em -.025em #00ff00bf,-.025em .05em #0000ffbf}14%{text-shadow:.05em 0 #ff0000bf,-.05em -.025em #00ff00bf,-.025em .05em #0000ffbf}15%{text-shadow:-.05em -.025em #ff0000bf,.025em .025em #00ff00bf,-.05em -.05em #0000ffbf}49%{text-shadow:-.05em -.025em #ff0000bf,.025em .025em #00ff00bf,-.05em -.05em #0000ffbf}50%{text-shadow:.025em .05em #ff0000bf,.05em 0 #00ff00bf,0 -.05em #0000ffbf}99%{text-shadow:.025em .05em #ff0000bf,.05em 0 #00ff00bf,0 -.05em #0000ffbf}to{text-shadow:-.025em 0 #ff0000bf,-.025em -.025em #00ff00bf,-.025em -.05em #0000ffbf}}.social-links{align-items:center;gap:24px;display:flex}.social-link{letter-spacing:.15em;text-transform:uppercase;color:#fff;opacity:.5;font-size:.85rem;font-weight:300;text-decoration:none;transition:opacity .3s}.social-link:hover{opacity:1}.contact-text{letter-spacing:-.02em;font-size:1.8rem;font-weight:800}.travel-location-ticker{width:100%;margin-bottom:12px;overflow:hidden;-webkit-mask-image:linear-gradient(90deg,#0000,#000 10% 90%,#0000);mask-image:linear-gradient(90deg,#0000,#000 10% 90%,#0000)}.ticker-track{white-space:nowrap;gap:10px;animation:30s linear infinite tickerScroll;display:flex}.ticker-track span{letter-spacing:.2em;opacity:.4;text-transform:uppercase;font-size:.7rem;font-weight:700}@keyframes tickerScroll{0%{transform:translate(0)}to{transform:translate(-50%)}}.family-overlay-content{z-index:5;flex-direction:column;gap:20px;display:flex;position:absolute;top:40px;left:40px;right:40px}.roots-badge{background:#ff1e501a;border:1px solid #ff1e5033;border-radius:14px;flex-direction:column;width:fit-content;padding:10px 16px;display:flex;position:relative}.roots-label{color:#ff1e50;letter-spacing:.1em;margin-bottom:2px;font-size:.55rem;font-weight:800}.roots-coords{color:#fff;opacity:.9;font-size:.8rem;font-weight:600}.pulse-circle{background:#ff1e50;border-radius:50%;width:5px;height:5px;animation:2s infinite pulse-red;position:absolute;top:10px;right:10px;box-shadow:0 0 10px #ff1e50}@keyframes pulse-red{0%{opacity:1;transform:scale(1)}50%{opacity:.5;transform:scale(1.5)}to{opacity:1;transform:scale(1)}}.heartbeat-container{opacity:.3;width:70px;position:absolute;top:10px;right:10px}.heartbeat-path{fill:none;stroke:#ff1e50;stroke-width:2px;stroke-dasharray:200;stroke-dashoffset:200px;animation:4s linear infinite heartbeat-draw}@keyframes heartbeat-draw{0%{stroke-dashoffset:200px}50%{stroke-dashoffset:0}to{stroke-dashoffset:-200px}}.culture-fusion-container{z-index:10;width:auto;display:flex;position:absolute;top:25px;right:25px}.family-overlay-content{width:100%;height:100%;position:static}.fusion-visual{justify-content:center;align-items:center;width:50px;height:32px;display:flex;position:relative}.culture-circle{border:2px solid #fff3;border-radius:50%;width:30px;height:30px;transition:transform .3s;position:absolute;overflow:hidden;box-shadow:0 4px 8px #0000004d}.cameroon-real-flag{z-index:2;background:linear-gradient(90deg,#007a5e 33.33%,#ce1126 33.33% 66.66%,#fcd116 66.66%);animation:4s ease-in-out infinite alternate floatLeft;left:0}.germany-real-flag{z-index:1;background:linear-gradient(#000 33.33%,#d00 33.33% 66.66%,#ffce00 66.66%);animation:4s ease-in-out infinite alternate floatRight;right:0}.flag-star{color:#fcd116;z-index:5;text-shadow:0 0 2px #00000080;font-size:8px;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}@keyframes floatLeft{0%{transform:translateY(-2px)translate(0)}to{transform:translateY(2px)translate(2px)}}@keyframes floatRight{0%{transform:translateY(2px)translate(0)}to{transform:translateY(-2px)translate(-2px)}}.lifeline-container{opacity:.3;pointer-events:none;z-index:1;width:100%;height:60px;position:absolute;bottom:100px;left:0}.lifeline-svg{width:100%;height:100%;overflow:visible}.lifeline-path{fill:none;stroke:var(--accent);stroke-width:1px;filter:drop-shadow(0 0 5px #ff1e5080)}.lifeline-dot{fill:#fff;filter:drop-shadow(0 0 4px #fff)}.creative-family-card .card-overlay{z-index:5;background:linear-gradient(#0000,#0006 40%,#000000e6 90%)}.creative-family-card .card-title{margin-bottom:8px}.creative-family-card .card-desc{opacity:.9;font-size:.95rem;line-height:1.5}@media (max-width:640px){.lifeline-container{display:none}.fusion-visual{width:50px;height:30px}}@media (max-width:1024px){body{height:auto;padding:100px 0;overflow-y:auto}.main-container{grid-template-rows:auto;grid-template-columns:1fr;width:95%;height:auto;padding-bottom:120px}.dev-card,.travel-card,.family-card,.contact-card-flip{min-height:400px;grid-area:span 1/span 1!important}.contact-card-flip{height:200px;min-height:unset;margin-top:10px}.globe-wrapper{opacity:.3!important;max-width:100%!important}}@media (max-width:640px){.card-title{font-size:2rem}.card-desc{max-width:100%;font-size:1rem}.progress-ring-container{width:80px;height:80px}.progress-ring,.progress-ring circle{r:34;cx:40;cy:40}.progress-ring{width:80px;height:80px}.progress-ring-fill{stroke-dasharray:213;stroke-dashoffset:168px}.progress-text .count{font-size:1.2rem}.travel-meta{gap:8px}.meta-label,.travel-location-ticker{display:none}.meta-value{font-size:.9rem}}