*,:before,:after{box-sizing:border-box}html,body{height:100%;margin:0;padding:0}#root{min-height:100%}:root{color:#02090f;background-color:#fcf8f8;font-family:Segoe UI,Trebuchet MS,sans-serif}.header{background-color:#fff;justify-content:space-between;align-items:center;padding:16px 32px;display:flex;box-shadow:0 2px 8px #00000014}.logo{color:#02090f;letter-spacing:1px;font-size:1.5rem;font-weight:700}.nav-btn{color:#02090f;cursor:pointer;background:0 0;border:none;border-radius:6px;padding:8px 16px;font-family:inherit;font-size:1rem;transition:background-color .2s}.nav-btn:hover{background-color:#f0f0f0}.hero{width:100%;height:83.33vh}.hero-video{object-fit:cover;width:100%;height:100%}.about-section{z-index:1;background:linear-gradient(#fff0 0%,#fff 2.2%);min-height:100vh;margin-top:-100px;padding:64px 10%;position:relative}.about-title{color:#fff;letter-spacing:3px;text-transform:uppercase;text-shadow:0 2px 12px #000000e6,0 0 40px #000000b3;border-bottom:4px solid #fff;margin:0 0 24px;padding-bottom:8px;font-size:3.5rem;font-weight:800;display:inline-block}.about-sub{color:#02090f;max-width:800px;margin:0;font-size:1.1rem;font-weight:400;line-height:1.8}.projects-section{margin-top:56px}.projects-title{letter-spacing:.4px;color:#02090f;margin:0 0 20px;font-size:1.7rem}.projects-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:18px;display:grid}@media (width<=1100px){.projects-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}@media (width<=700px){.projects-grid{grid-template-columns:1fr}}.project-card-link{color:inherit;text-decoration:none}.project-card{background:#fff;border:1px solid #ececec;border-radius:14px;padding:20px;transition:transform .2s,box-shadow .2s;box-shadow:0 8px 24px #02090f0f}.project-card:hover{transform:translateY(-4px);box-shadow:0 16px 28px #02090f1f}.project-title{color:#02090f;margin:0 0 12px;font-size:1.2rem}.project-image-container{width:100%;margin-bottom:12px;display:inline-block;position:relative}.platforms-on-image{flex-wrap:wrap;align-items:flex-start;gap:6px;width:auto;max-width:calc(100% - 16px);display:flex;position:absolute;top:8px;left:8px}.platform-icon{cursor:pointer;justify-content:center;align-items:center;transition:transform .2s,filter .2s;display:inline-flex}.platform-icon:hover{filter:brightness(1.2);transform:scale(1.15)}.platform-icon-emoji{font-size:1.5rem;display:inline-block}.platform-icon-img{object-fit:contain;width:36px;height:36px}.project-image{aspect-ratio:16/10;object-fit:cover;border:1px solid #ececec;border-radius:10px;width:100%;margin-bottom:12px}.project-tags{flex-wrap:wrap;gap:8px;margin-bottom:12px;display:flex}.project-tag{color:#2a3340;background:#f1f5f9;border:1px solid #dce4ec;border-radius:999px;padding:5px 10px;font-size:.82rem;font-weight:600}.project-description{color:#2a3340;margin:0;line-height:1.6}.project-page{background:var(--project-page-bg,linear-gradient(to bottom, #f9fbfd 0%, #eef3f8 100%));background-position:50%;background-repeat:no-repeat;background-size:cover;width:100%;min-height:100vh;padding:48px 7%}.project-page-inner{background:var(--project-content-bg,#fff);border:1px solid #e5edf4;border-radius:16px;max-width:920px;margin:0 auto;padding:28px;box-shadow:0 12px 28px #02090f14}.back-link{color:#0057a6;margin-bottom:18px;font-weight:600;text-decoration:none;display:inline-block}.back-link:hover{text-decoration:underline}.project-page-title{color:#02090f;margin:0 0 12px;font-size:2rem}.project-page-image{border:1px solid #e4ebf2;border-radius:12px;width:100%;margin-bottom:14px}.project-page-text{color:#2a3340;margin:0 0 14px;line-height:1.75}.project-detail-block{margin-top:18px}.project-detail-title{color:#0f2133;margin:0 0 10px;font-size:1.18rem}.project-rich-content{color:#2a3340;line-height:1.75}.project-rich-content p,.project-rich-content ul,.project-rich-content ol{margin:0 0 12px}.project-rich-content ul,.project-rich-content ol{padding-left:20px}.project-rich-content a{color:#0057a6}@media (width<=768px){.about-section{padding:48px 7%}.about-title{font-size:2.5rem}.projects-title{font-size:1.4rem}.project-page{padding:36px 5%}.project-page-title{font-size:1.6rem}}