html,body{width:100%;height:auto;background-color:#0e0000;font-family:Inter,sans-serif;font-weight:400;font-size:1rem}html.app-background,body.app-background{background-image:url(https://images.unsplash.com/photo-1633259584604-afdc243122ea?q=80&w=1740&auto=format&fit=crop);background-size:cover;background-repeat:no-repeat;background-position:center}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border-width:0}a{text-decoration:none;color:#0e0000}button{background:none;border:none;display:block}::selection{background-color:#001797;color:#f9f6ee}::-moz-selection{background-color:#001797;color:#f9f6ee}@font-face{font-family:Sok Brubah;src:url(/fonts/sok_brubah/Sok_Brubah.woff2) format("woff2")}@font-face{font-family:Inter;src:url(/fonts/inter/Inter_18pt-Regular.woff2) format("woff2");font-weight:400;font-style:normal}@font-face{font-family:Inter;src:url(/fonts/inter/Inter_18pt-Light.woff2) format("woff2");font-weight:300;font-style:normal}@font-face{font-family:Inter;src:url(/fonts/inter/Inter_18pt-Italic.woff2) format("woff2");font-weight:500;font-style:italic}@font-face{font-family:Inter;src:url(/fonts/inter/Inter_18pt-Bold.woff2) format("woff2");font-weight:700;font-style:normal}*{margin:0;padding:0;box-sizing:border-box}h1{font-family:Sok Brubah,serif;font-size:4rem;letter-spacing:.2rem;line-height:1.5}h2{font-family:Sok Brubah,serif;font-size:1.25rem;letter-spacing:.05rem;line-height:1.5}h3{font-family:Inter,sans-serif;font-size:1rem;letter-spacing:.05rem}p{color:#444;font-size:18px;line-height:28px}@media(min-width:1280px){p{font-size:16px;line-height:24px}}.sidebar{position:fixed;inset:auto 16px 16px;z-index:3;display:flex;flex-direction:row;justify-content:space-between;align-items:center;flex-wrap:nowrap;margin:0 auto;padding:8px 10px;max-width:480px;height:64px;border-radius:100px;background-color:#faf9f6;box-shadow:0 10px 30px #000c;border:1px solid rgba(0,0,0,.05)}.sidebar__wrapper{display:flex;flex-direction:row;justify-content:space-evenly;align-items:center;flex-wrap:nowrap;flex:1}.sidebar__item{display:flex;flex-direction:row;justify-content:center;align-items:center;flex-wrap:nowrap;padding:10px;height:100%;border-radius:50%;aspect-ratio:1/1;transition:color .2s ease-in-out;cursor:pointer}.sidebar__item:hover{color:#0e0000;background-color:#00179733}.sidebar__item--active{color:#faf9f6;background-color:#001797}.sidebar__profile--wrapper{position:relative;height:100%}.sidebar__profile--wrapper img{height:100%;aspect-ratio:1/1;object-fit:cover;border-radius:50%;cursor:pointer;border:solid 1px #FAF9F6}.sidebar__profile--wrapper img:hover{border:solid 1px #BFB5F2}.sidebar__popup{position:absolute;bottom:calc(100% + 16px);right:0;display:flex;flex-direction:column;justify-content:center;align-items:stretch;flex-wrap:nowrap;gap:8px;padding:12px;width:max-content;background-color:#faf9f6;border-radius:20px;box-shadow:0 10px 30px #00000026,0 2px 8px #00000014;border:1px solid rgba(0,0,0,.06);opacity:0;pointer-events:none;transform:translateY(6px);transition:opacity .2s ease,transform .2s ease}.sidebar__popup--visible{opacity:1;pointer-events:all;transform:translateY(0)}.sidebar__popup-link{display:flex;flex-direction:row;justify-content:flex-start;align-items:center;flex-wrap:nowrap;gap:12px;padding:10px 14px;border-radius:12px;text-decoration:none;color:#0e0000;font-size:14px;font-weight:500;transition:background-color .15s ease,color .15s ease}.sidebar__popup-link svg{width:18px;height:18px;flex-shrink:0;color:#001797}.sidebar__popup-link:hover{background-color:#00179733;color:#001797}.sidebar__name{display:none}@media screen and (min-width:1024px){.sidebar{position:sticky;top:24px;height:100%;display:flex;flex-direction:column;padding:10px 8px;border-radius:50px}.sidebar__wrapper{display:flex;flex-direction:column;gap:32px;align-items:center;flex:0 0 auto;width:100%}.sidebar__item{width:100%;height:auto;aspect-ratio:1/1}.sidebar__item--home{margin-bottom:32px}.sidebar__profile--wrapper{display:flex;flex-direction:column;align-items:center;gap:12px;flex-shrink:0;width:100%;height:auto;margin-top:auto}.sidebar__popup{position:absolute;bottom:0;left:calc(100% + 24px);box-shadow:0 20px 60px #00000059,0 4px 16px #00000026,0 0 0 1px #0000000f}.sidebar__profile--wrapper img{width:100%;height:auto;aspect-ratio:1/1;object-fit:cover;border-radius:50%}.sidebar__name{display:block;writing-mode:vertical-rl;text-orientation:mixed;transform:rotate(180deg);font-size:12px;letter-spacing:.15em;text-transform:uppercase;font-weight:600}}.about .header{display:flex;flex-direction:column;justify-content:center;align-items:center;flex-wrap:nowrap}.about .header__title{font-size:34px;text-align:center}.about .header__location{display:flex;flex-direction:row;justify-content:flex-start;align-items:center;flex-wrap:nowrap;gap:8px;font-weight:300}.about .header__location svg{width:16px}.about .header:before{content:"";position:absolute;right:-60px;bottom:-60px;width:200px;aspect-ratio:1/1;border-radius:50%;background:radial-gradient(circle at center,#1302ff1a,#8000ff1a,#e347ff1a);filter:blur(50px);pointer-events:none;z-index:0}.about .intro{display:flex;flex-direction:column;justify-content:flex-start;align-items:center;flex-wrap:nowrap;gap:16px}.about .intro__subtitle{font-size:24px}.about .intro__text span{font-weight:700}.about .intro:before{content:"";position:absolute;top:-60px;right:-60px;width:200px;aspect-ratio:1/1;border-radius:50%;background:radial-gradient(circle at center,#1302ff1a,#8000ff1a,#e347ff1a);filter:blur(50px);pointer-events:none;z-index:0}.about .intro:after{content:"";position:absolute;bottom:-60px;left:-60px;width:200px;aspect-ratio:1/1;border-radius:50%;background:radial-gradient(circle at center,#1302ff1a,#8000ff1a,#e347ff1a);filter:blur(50px);pointer-events:none;z-index:0}.about .timeline__item{display:flex;flex-direction:row;justify-content:flex-start;align-items:stretch;flex-wrap:nowrap;gap:8px;width:100%}.about .timeline__marker{display:flex;flex-direction:column;justify-content:flex-start;align-items:center;flex-wrap:nowrap}.about .timeline__icon{display:flex;flex-direction:row;justify-content:center;align-items:center;flex-wrap:nowrap;--size: 16px;width:var(--size);height:var(--size);margin:3px;flex-shrink:0;border-radius:50%}.about .timeline .dot{--size: 10px;width:var(--size);height:var(--size);margin:5px;background-color:#0e0000}.about .timeline__line{flex-grow:1;margin:8px 0;width:2px;background-color:#0e0000}.about .timeline__content{display:flex;flex-direction:column;justify-content:flex-start;align-items:stretch;flex-wrap:nowrap;gap:16px;margin-bottom:2rem}.about .timeline__title{font-size:18px;font-weight:600;text-transform:uppercase}.about .timeline__date{font-size:14px;font-weight:300}.about .timeline__place{font-style:italic}.about .timeline__description{line-height:1.6}.about .experiences:before{content:"";position:absolute;top:-60px;left:-60px;width:200px;aspect-ratio:1/1;border-radius:50%;background:radial-gradient(circle at center,#1302ff1a,#8000ff1a,#e347ff1a);filter:blur(50px);pointer-events:none;z-index:0}.about .education:after{content:"";position:absolute;right:-60px;bottom:-60px;width:200px;aspect-ratio:1/1;border-radius:50%;background:radial-gradient(circle at center,#1302ff1a,#8000ff1a,#e347ff1a);filter:blur(50px);pointer-events:none;z-index:0}.about .contact{position:relative;display:flex;flex-direction:column;justify-content:flex-start;align-items:center;flex-wrap:nowrap;text-align:center;padding:2rem 0}.about .contact__subtitle{font-size:18px;margin-bottom:32px;color:#666}.about .contact__cta-wrapper{display:flex;flex-direction:column;justify-content:flex-start;align-items:stretch;flex-wrap:nowrap;gap:16px;width:100%;max-width:400px}.about .contact__cta{display:flex;flex-direction:row;justify-content:center;align-items:center;flex-wrap:nowrap;gap:12px;padding:16px 32px;border-radius:12px;font-weight:600;font-size:16px;text-decoration:none;transition:all .3s ease;position:relative;overflow:hidden}.about .contact__cta--primary{background:linear-gradient(135deg,#1302ffe6,#8000ffe6);color:#fff;box-shadow:0 4px 15px #1302ff33}.about .contact__cta--primary:hover{background:linear-gradient(45deg,#1302ffe6,#8000ffe6);box-shadow:0 6px 20px #1302ff4d}.about .contact__cta--secondary{background:#fff;color:#0e0000;border:1px solid #0E0000}.about .contact__cta--secondary:hover{background:#0e0000;color:#fff;transform:translateY(-2px);box-shadow:0 4px 15px #0003}.about .contact__cta--secondary:active{transform:translateY(0)}.about .contact:before{content:"";position:absolute;top:-60px;right:-60px;width:200px;aspect-ratio:1/1;border-radius:50%;background:radial-gradient(circle at center,#1302ff1a,#8000ff1a,#e347ff1a);filter:blur(50px);pointer-events:none;z-index:0}.about .contact:after{content:"";position:absolute;bottom:-60px;left:-60px;width:200px;aspect-ratio:1/1;border-radius:50%;background:radial-gradient(circle at center,#1302ff1a,#8000ff1a,#e347ff1a);filter:blur(50px);pointer-events:none;z-index:0}@media(min-width:768px){.contact__cta-wrapper{flex-direction:row;max-width:600px}.contact__cta{flex:1}}@media(min-width:1280px){.app .page.about{display:grid;grid-template-columns:1.2fr .5fr 1.2fr;grid-template-rows:auto auto 1fr 1fr;gap:16px;width:100%;height:100%}.app .page.about .header{grid-column:1/2;grid-row:1/2}.app .page.about .header:before{content:"";position:absolute;top:-60px;right:-60px;width:200px;aspect-ratio:1/1;border-radius:50%;background:radial-gradient(circle at center,#1302ff1a,#8000ff1a,#e347ff1a);filter:blur(50px);pointer-events:none;z-index:0}.app .page.about .intro{grid-column:1/2;grid-row:2/4;display:flex;flex-direction:column;justify-content:flex-start;align-items:center;flex-wrap:nowrap;gap:8px;overflow-y:auto;min-height:0}.app .page.about .intro:before,.app .page.about .intro:after{content:none}.app .page.about .timeline{overflow-y:auto;min-height:0}.app .page.about .timeline__content{display:flex;flex-direction:column;justify-content:flex-start;align-items:stretch;flex-wrap:nowrap;gap:8px}.app .page.about .timeline__title{font-size:16px}.app .page.about .experiences{grid-column:2/4;grid-row:1/4;overflow-y:auto;min-height:0}.app .page.about .experiences:after{content:none}.app .page.about .education{grid-column:1/3;grid-row:4/5;overflow-y:auto;min-height:0}.app .page.about .education:after{content:"";position:absolute;top:-60px;left:-60px;width:200px;aspect-ratio:1/1;border-radius:50%;background:radial-gradient(circle at center,#1302ff1a,#8000ff1a,#e347ff1a);filter:blur(50px);pointer-events:none;z-index:0}.app .page.about .contact{grid-column:3/4;grid-row:4/5;justify-content:center}.app .page.about .contact__subtitle{font-size:14px;margin-bottom:16px}.app .page.about .contact__cta-wrapper{gap:12px}.app .page.about .contact__cta{font-size:14px;padding:12px 16px}.app .page.about .contact__cta svg{width:18px;height:18px}.app .page.about .contact:after{content:none}}.app{display:flex;flex-direction:row;justify-content:flex-start;align-items:stretch;flex-wrap:nowrap;justify-content:center;padding-bottom:74px}.app__content{flex:1;margin:24px;max-width:640px}.app .page{display:flex;flex-direction:column;justify-content:flex-start;align-items:stretch;flex-wrap:nowrap;gap:16px}.app .section{position:relative;background-color:#faf9f6;border-radius:24px;padding:24px;overflow:hidden;border:solid 1px #FAF9F6}.app .section__title-container{display:flex;flex-direction:row;justify-content:center;align-items:center;flex-wrap:nowrap;gap:8px;margin-bottom:32px;text-align:center}.app .section__title-container .icon{width:16px}.app .section__title{text-transform:uppercase;font-size:18px}@media screen and (min-width:1024px){body{height:100%;overflow:hidden}.app{display:grid;grid-template-columns:80px 1fr;gap:16px;align-items:start;padding:24px;height:100dvh;width:100%;max-width:1536px;overflow:hidden}.app__sidebar{position:relative;height:100%}.app__content{height:100%;margin:0;max-width:none;overflow-y:auto;overflow-x:hidden}}@media screen and (min-width:1280px){.app{height:min(100dvh,900px);margin:auto}.app-content{min-height:0}.app__sidebar{height:100%}.app .page{min-height:0;gap:0}.app .section__title-container{margin-bottom:24px}}.home{position:relative;display:flex;flex-direction:row;justify-content:flex-start;align-items:stretch;flex-wrap:nowrap;width:100%;height:100dvh;overflow:hidden;color:#faf9f6;user-select:none}.home p{color:#faf9f6}.home__background{position:absolute;inset:0;width:100%;height:100%}.home__content{position:relative;flex:1;margin:32px 24px}.home__wrapper{display:flex;flex-direction:column;justify-content:space-between;align-items:stretch;flex-wrap:nowrap;height:100%}.home__subtitle{display:flex;flex-direction:column;justify-content:flex-start;align-items:stretch;flex-wrap:nowrap;gap:8px;text-transform:uppercase;letter-spacing:1.2px;font-size:12px}.home__subtitle .home__icon{width:10px;height:auto;flex-shrink:0}.home__subtitle .home__icon--desktop{display:none}.home__subtitle .home__icon--mobile{display:block}.home__meta--item{display:flex;flex-direction:row;justify-content:center;align-items:center;flex-wrap:nowrap;gap:8px}.home__meta{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.home__main{display:flex;flex-direction:column;justify-content:center;align-items:stretch;flex-wrap:nowrap;gap:16px;text-align:center}.home__title{font-size:clamp(3rem,12vw,6rem);letter-spacing:clamp(2px,1.5vw,8px)}.home__description{font-weight:300;letter-spacing:1.5px}.home__cta{position:absolute;bottom:0;right:0;display:flex;flex-direction:row;justify-content:center;align-items:stretch;flex-wrap:nowrap;padding:1.5rem;background-color:#faf9f6;border-radius:50%;color:#001797;box-shadow:#00000040 0 25px 50px -12px}.home__cta--icon{width:26px;transition:transform .2s ease}.home__cta:hover .home__cta--icon{transform:rotate(45deg)}.home__socials{display:flex;flex-direction:row;justify-content:flex-start;align-items:center;flex-wrap:nowrap;gap:20px}.home__socials .socials__link{display:flex;flex-direction:row;justify-content:flex-start;align-items:stretch;flex-wrap:nowrap;padding:10px;border-radius:50px}.home__socials .socials__icon{width:24px;height:auto;color:#faf9f6;stroke-width:1px}@media screen and (min-width:640px){.home__subtitle{display:flex;flex-direction:row;justify-content:space-between;align-items:center;flex-wrap:nowrap;font-size:16px}.home__subtitle .home__icon{width:12px}.home__subtitle .home__icon--mobile{display:none}.home__subtitle .home__icon--desktop{display:block}.home__meta--item{gap:15px}}@media screen and (min-width:768px){.home__content{margin:40px auto;padding:0 40px;max-width:1536px}.home__subtitle{font-size:18px}.home__subtitle .home__icon{width:16px}.home__meta--item{gap:20px}.home__main{gap:24px}.home__title{font-size:104px;letter-spacing:8px}.home__description{font-size:24px}.home__cta{right:40px;padding:1.8rem}.home__cta--icon{width:32px}.home__socials{gap:40px}.home__socials .socials__icon{width:32px}}.projects{min-height:100dvh}.projects .header{display:flex;flex-direction:column;justify-content:flex-start;align-items:center;flex-wrap:nowrap}.projects .header__title--wrapper{display:flex;flex-direction:row;justify-content:flex-start;align-items:center;flex-wrap:nowrap;gap:16px}.projects .header__title{font-size:34px}.projects .header__subtitle{font-weight:300}.projects .header .icon{width:18px}.projects .header:before{content:"";position:absolute;right:-60px;bottom:-60px;width:200px;aspect-ratio:1/1;border-radius:50%;background:radial-gradient(circle at center,#1302ff1a,#8000ff1a,#e347ff1a);filter:blur(50px);pointer-events:none;z-index:0}.projects .section__title-container{display:none}.projects .filters__list{display:flex;flex-direction:row;justify-content:flex-start;align-items:stretch;flex-wrap:wrap;gap:16px;max-width:520px;margin:0 auto}.projects .filters:before{content:"";position:absolute;top:-60px;right:-60px;width:200px;aspect-ratio:1/1;border-radius:50%;background:radial-gradient(circle at center,#1302ff1a,#8000ff1a,#e347ff1a);filter:blur(50px);pointer-events:none;z-index:0}.projects .filter-btn{padding:8px 20px;border-radius:50px;border:1px solid #0E0000;background:transparent;font-size:12px;font-weight:500;cursor:pointer;transition:all .3s ease;color:#0e0000}.projects .filter-btn:hover{background:#0000000d}.projects .filter-btn--active{background:#0e0000;color:#fff}.projects .filter-btn--active:hover{background-color:#000;box-shadow:0 6px 16px #00000040}.projects .loading,.projects .error,.projects .empty{text-align:center;padding:40px 20px;font-size:16px}.projects .projects-grid{display:grid;grid-template-columns:1fr;gap:16px}.projects .project-card{position:relative;background:#faf9f6;border-radius:24px;overflow:hidden;border:1px solid #FAF9F6;transition:transform .3s ease,box-shadow .3s ease;cursor:pointer}.projects .project-card:hover .project-card__cta svg{transform:rotate(45deg)}.projects .project-card__image-wrapper{position:relative;width:100%;height:200px;overflow:hidden}.projects .project-card__image{width:100%;height:100%;object-fit:cover;transition:transform .5s ease}.projects .project-card__content{display:flex;flex-direction:column;justify-content:flex-start;align-items:stretch;flex-wrap:nowrap;gap:12px;padding:24px}.projects .project-card__cta{position:absolute;inset:0 0 auto auto;display:flex;flex-direction:row;justify-content:center;align-items:center;flex-wrap:nowrap;margin:8px;width:50px;aspect-ratio:1/1;border-radius:50%;background:#faf9f6}.projects .project-card__cta svg{color:#0e0000;width:16px;transition:transform .2s ease}.projects .project-card__skills{display:flex;flex-direction:row;justify-content:flex-start;align-items:stretch;flex-wrap:wrap;gap:8px}.projects .project-card__skills span{display:inline-block;padding:4px 12px;background:linear-gradient(135deg,#1302ff1a,#8000ff1a);color:#1302ff;font-size:12px;font-weight:600;border-radius:50px;text-transform:uppercase}.projects .project-card__title{font-size:20px;font-weight:700;line-height:1.3}.projects .project-card__date{font-size:14px;font-weight:300;color:#666}.projects .project-card__description{font-size:15px;line-height:1.6;color:#444}@media(min-width:640px){.projects .filter-btn{font-size:14px}.projects .projects-grid{grid-template-columns:repeat(2,1fr)}.projects .project-card__image-wrapper{height:220px}}@media(min-width:1024px){.projects .projects-grid{grid-template-columns:repeat(3,1fr)}.projects .project-card__image-wrapper{height:240px}}@media(min-width:1280px){.app .page.projects{display:grid;grid-template-columns:1.2fr .5fr 1.2fr;grid-template-rows:auto auto 1fr;gap:16px;width:100%;height:100%;min-height:0;overflow:hidden}.app .page.projects .header{grid-column:1/2;grid-row:1/2}.app .page.projects .section__title-container{display:flex;margin-block-end:0}.app .page.projects .filters{grid-column:2/4;grid-row:1/2;display:flex;flex-direction:column;justify-content:space-between;align-items:center}.app .page.projects .filters__list{max-width:100%;justify-content:flex-start;align-items:center;gap:24px;max-width:none;margin:0}.app .page.projects .loading{grid-column:1/4;grid-row:2/4}.app .page.projects .projects-container{grid-column:1/4;grid-row:2/4;overflow-y:auto;overflow-x:hidden;min-height:0;max-height:100%}.app .page.projects .projects-grid{grid-template-columns:repeat(3,1fr);gap:20px}.app .page.projects .project-card{background:#fff;border:1px solid #0E0000;border-radius:16px;transition:all .3s ease}.app .page.projects .project-card__image-wrapper{height:200px}.app .page.projects .project-card__content{background:#fff}.app .page.projects .project-card__cta{background:#faf9f6;box-shadow:0 2px 8px #0017971a}.app .page.projects .project-card__cta svg{color:#001797}.app .page.projects .project-card__skills span{background:linear-gradient(135deg,#1302ff0d,#8000ff0d);border:1px solid rgba(19,2,255,.1);color:#001797}.app .page.projects .project-card__skills span:hover{background:linear-gradient(135deg,#1302ff1a,#8000ff1a);border-color:#1302ff33}.app .page.projects .project-card__title{color:#1f2937}.app .page.projects .project-card__date{color:#666}.app .page.projects .project-card:hover{border-color:#1302ff4d;box-shadow:0 8px 24px #1302ff1f}}.project-detail{position:relative;min-height:100dvh}.project-detail .loading,.project-detail .error{text-align:center;padding:60px 20px;font-size:16px;color:#666}.project-detail .error{color:#e74c3c}.project-content{display:flex;flex-direction:column;justify-content:center;align-items:stretch;flex-wrap:nowrap;gap:16px}.project-content .nav-buttons{display:flex;flex-direction:row;justify-content:space-between;align-items:center;flex-wrap:nowrap;gap:16px}.project-content .back-btn{display:flex;flex-direction:row;justify-content:flex-start;align-items:center;flex-wrap:nowrap;gap:8px}.project-content .open-btn{display:flex;flex-direction:row;justify-content:flex-end;align-items:center;flex-wrap:nowrap;gap:8px}.project-content .back-btn,.project-content .open-btn{flex:1;padding:12px 20px;border-radius:50px;border:1px solid #FAF9F6;background:transparent;font-size:14px;font-weight:500;cursor:pointer;transition:all .3s ease;color:#faf9f6;text-decoration:none}.project-content .back-btn .icon,.project-content .open-btn .icon{width:18px;height:18px;transition:transform .2s ease}.project-content .back-btn:hover,.project-content .open-btn:hover{background:#faf9f6;color:#0e0000}.project-content .back-btn:hover .icon{transform:translate(-4px)}.project-content .open-btn:hover .icon{transform:rotate(45deg)}.project-header{display:flex;flex-direction:column;justify-content:center;align-items:center;flex-wrap:nowrap;gap:32px;background:#faf9f6;border-radius:24px;padding:24px;border:1px solid #FAF9F6}.project-header__title{font-size:32px;line-height:1.3;text-align:center}.project-header__meta{display:flex;flex-direction:row;justify-content:center;align-items:center;flex-wrap:wrap;gap:12px}.project-header__date,.project-header__category{font-size:14px;font-weight:300;color:#666;padding:6px 16px;background:#0000000d;border-radius:50px}.project-title__wrapper{display:flex;flex-direction:row;justify-content:center;align-items:center;flex-wrap:nowrap;gap:16px}.project-title__wrapper svg{width:16px}.project-title__wrapper h3{font-family:Inter,sans-serif;font-size:18px;font-weight:700;text-transform:uppercase}.project-skills{display:flex;flex-direction:column;justify-content:stretch;align-items:stretch;flex-wrap:nowrap;gap:32px;background:#faf9f6;border-radius:24px;padding:24px;border:1px solid #FAF9F6}.project-skills__list{display:flex;flex-direction:row;justify-content:flex-start;align-items:stretch;flex-wrap:wrap;gap:8px}.project-skills__list .skill-tag{display:inline-block;padding:8px 16px;background:linear-gradient(135deg,#1302ff1a,#8000ff1a);color:#1302ff;font-size:12px;font-weight:600;border-radius:50px;text-transform:uppercase}.project-description{display:flex;flex-direction:column;justify-content:stretch;align-items:stretch;flex-wrap:nowrap;gap:32px;background:#faf9f6;border-radius:24px;padding:24px;border:1px solid #FAF9F6}.project-images{border-radius:24px;overflow:hidden}.project-images__preview{position:relative;width:100%;height:100%;aspect-ratio:16/9;background:#0e0000;border-radius:16px;overflow:hidden;cursor:pointer}.project-images__main{width:100%;height:100%;object-fit:cover;display:block}.project-images__zoom-btn{position:absolute;top:12px;right:12px;z-index:2;width:40px;height:40px;border-radius:50%;border:none;background:#0009;backdrop-filter:blur(8px);cursor:pointer;transition:all .3s ease}.project-images__zoom-btn .icon{width:20px;height:20px;color:#faf9f6}.project-images__zoom-btn:hover{background:#000c}.project-images__count{position:absolute;bottom:12px;left:50%;transform:translate(-50%);padding:8px 16px;background:#0009;backdrop-filter:blur(8px);border-radius:50px;color:#fff}@media(min-width:640px){.project-content .back-btn,.project-content .open-btn{flex:0 1 auto;min-width:200px;justify-content:center}.project-skills__list{justify-content:center}}@media(min-width:1280px){.app .page.project-detail{height:100%;min-height:0;overflow:hidden}.app .page.project-detail .project-content{display:grid;grid-template-columns:.6fr .6fr 1fr 1fr;grid-template-rows:44px 1fr .8fr .5fr 1fr;gap:16px;height:100%}.app .page.project-detail .project-content .nav-buttons{grid-column:1/3;grid-row:1/2}.app .page.project-detail .project-content .back-btn,.app .page.project-detail .project-content .open-btn{flex:1}.app .page.project-detail .project-header{grid-column:1/3;grid-row:2/3;min-height:0;gap:16px}.app .page.project-detail .project-skills{grid-column:1/3;grid-row:3/4;min-height:0;overflow:hidden}.app .page.project-detail .project-context{grid-column:1/3;grid-row:4/6;overflow-y:auto;min-height:0}.app .page.project-detail .project-works{grid-column:3/5;grid-row:4/6;overflow-y:auto;min-height:0}.app .page.project-detail .project-images{grid-column:3/5;grid-row:1/4;min-height:0}}.skills .header{display:flex;flex-direction:column;justify-content:flex-start;align-items:center;flex-wrap:nowrap;text-align:center}.skills .header__title--wrapper{display:flex;flex-direction:row;justify-content:flex-start;align-items:center;flex-wrap:nowrap;gap:8px}.skills .header__title--wrapper .icon{width:16px}.skills .header__title{font-size:34px}.skills .header__subtitle{max-width:600px}.skills .header:before{content:"";position:absolute;right:-60px;bottom:-60px;width:200px;aspect-ratio:1/1;border-radius:50%;background:radial-gradient(circle at center,#1302ff1a,#8000ff1a,#e347ff1a);filter:blur(50px);pointer-events:none;z-index:0}.skills .skill-category:nth-child(2):before{content:"";position:absolute;top:-60px;right:-60px;width:200px;aspect-ratio:1/1;border-radius:50%;background:radial-gradient(circle at center,#1302ff1a,#8000ff1a,#e347ff1a);filter:blur(50px);pointer-events:none;z-index:0}.skills .skill-category:nth-child(4):after{content:"";position:absolute;right:-60px;bottom:-60px;width:200px;aspect-ratio:1/1;border-radius:50%;background:radial-gradient(circle at center,#1302ff1a,#8000ff1a,#e347ff1a);filter:blur(50px);pointer-events:none;z-index:0}.skills .skill-category:nth-child(5):after{content:"";position:absolute;top:-60px;right:-60px;width:200px;aspect-ratio:1/1;border-radius:50%;background:radial-gradient(circle at center,#1302ff1a,#8000ff1a,#e347ff1a);filter:blur(50px);pointer-events:none;z-index:0}.skills .skill-category:nth-child(7):before{content:"";position:absolute;right:-60px;bottom:-60px;width:200px;aspect-ratio:1/1;border-radius:50%;background:radial-gradient(circle at center,#1302ff1a,#8000ff1a,#e347ff1a);filter:blur(50px);pointer-events:none;z-index:0}.skills .skill-card{display:flex;flex-direction:column;justify-content:flex-start;align-items:center;flex-wrap:nowrap;gap:12px;padding:20px 16px;background:#fff;border:1px solid #e5e7eb;border-radius:16px;transition:all .3s ease;cursor:default}.skills .skill-card:hover{border-color:#1302ff4d;transform:translateY(-4px);box-shadow:0 8px 24px #1302ff1f}.skills .skill-card__logo{width:48px;height:48px;object-fit:contain}.skills .skill-card__name{font-size:14px;font-weight:500;text-align:center;color:#1f2937}.skills .skills-grid{position:relative;z-index:1;display:grid;grid-template-columns:repeat(2,1fr);gap:12px}.skills .skill-tag{display:flex;flex-direction:row;justify-content:center;align-items:center;flex-wrap:nowrap;padding:12px 16px;background:linear-gradient(135deg,#1302ff0d,#8000ff0d);border:1px solid rgba(19,2,255,.1);border-radius:12px;font-size:14px;font-weight:500;text-align:center;transition:all .3s ease}.skills .skill-tag:hover{background:linear-gradient(135deg,#1302ff1a,#8000ff1a);border-color:#1302ff33;transform:translateY(-2px);box-shadow:0 4px 12px #1302ff1a}@media(min-width:640px){.skills .skills-grid{grid-template-columns:repeat(3,1fr)}.skills .skill-card{padding:24px 20px}.skills .skill-card__logo{width:40px;aspect-ratio:1/1}.skills .skill-card__name{font-size:16px}}@media(min-width:1024px){.skills .header__title{font-size:34px}.skills .skills-grid--cards{grid-template-columns:repeat(auto-fill,minmax(160px,1fr));gap:20px}.skills .skill-card{padding:28px 24px}.skills .skill-card__logo{width:64px;height:64px}.skills .skill-card__name{font-size:16px}}@media(min-width:1280px){.app .page.skills{display:grid;grid-template-columns:1.2fr .85fr .85fr;grid-template-rows:auto repeat(8,minmax(0,1fr));gap:16px;height:100%}.app .page.skills .skill-header{grid-column:1/2;grid-row:1}.app .page.skills .skill-header:before{content:"";position:absolute;bottom:-60px;left:-60px;width:200px;aspect-ratio:1/1;border-radius:50%;background:radial-gradient(circle at center,#1302ff1a,#8000ff1a,#e347ff1a);filter:blur(50px);pointer-events:none;z-index:0}.app .page.skills .skill-card--technical,.app .page.skills .skill-category{overflow-y:auto;min-height:0}.app .page.skills .skill-category--frontend{grid-column:1;grid-row:2/7}.app .page.skills .skill-category--frontend:before{content:"";position:absolute;top:-60px;left:-60px;width:200px;aspect-ratio:1/1;border-radius:50%;background:radial-gradient(circle at center,#1302ff1a,#8000ff1a,#e347ff1a);filter:blur(50px);pointer-events:none;z-index:0}.app .page.skills .skill-category--outils-et-workflow{grid-column:2;grid-row:1/5}.app .page.skills .skill-category--soft-skills{grid-column:2;grid-row:5/10}.app .page.skills .skill-category--soft-skills:after{content:none}.app .page.skills .skill-category--soft-skills:before{content:"";position:absolute;bottom:-60px;left:-60px;width:200px;aspect-ratio:1/1;border-radius:50%;background:radial-gradient(circle at center,#1302ff1a,#8000ff1a,#e347ff1a);filter:blur(50px);pointer-events:none;z-index:0}.app .page.skills .skill-category--e-commerce{grid-column:1;grid-row:7/10}.app .page.skills .skill-category--backend{grid-column:3;grid-row:5/10}.app .page.skills .skill-category--backend:before{content:"";position:absolute;top:-60px;right:-60px;width:200px;aspect-ratio:1/1;border-radius:50%;background:radial-gradient(circle at center,#1302ff1a,#8000ff1a,#e347ff1a);filter:blur(50px);pointer-events:none;z-index:0}.app .page.skills .skill-category--design{grid-column:3;grid-row:1/5}.app .page.skills .skill-category--design:before{content:"";position:absolute;top:-60px;left:-60px;width:200px;aspect-ratio:1/1;border-radius:50%;background:radial-gradient(circle at center,#1302ff1a,#8000ff1a,#e347ff1a);filter:blur(50px);pointer-events:none;z-index:0}.app .page.skills .skill-category--design:after{content:"";position:absolute;right:-60px;bottom:-60px;width:200px;aspect-ratio:1/1;border-radius:50%;background:radial-gradient(circle at center,#1302ff1a,#8000ff1a,#e347ff1a);filter:blur(50px);pointer-events:none;z-index:0}.app .page.skills .skills-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(100px,1fr));grid-auto-rows:1fr;gap:8px;align-items:stretch}.app .page.skills .skill-card{padding:22px 16px}.app .page.skills .skill-card__logo{width:28px;height:28px}.app .page.skills .skill-card__name{font-size:14px}}
