.youtube-embed-container{width:100%;margin:2rem 0}.youtube-wrapper{background:var(--card-bg,#1a1a1a);border-radius:12px;width:100%;height:0;padding-bottom:56.25%;position:relative;overflow:hidden;box-shadow:0 10px 40px #00000026}.youtube-wrapper iframe{border-radius:12px;width:100%;height:100%;position:absolute;top:0;left:0}@media (max-width:768px){.youtube-embed-container{margin:1.5rem 0}.youtube-wrapper{border-radius:8px}}
.project-detail-container{color:#e0e0e0;scroll-behavior:smooth;background-color:#020202;min-height:100vh;font-family:Inter,sans-serif;line-height:1.6}.breadcrumb-nav{color:#888;max-width:1400px;margin:0 auto;padding:140px 40px 20px;font-size:1.1rem}.breadcrumb-nav a{color:#aaa;text-decoration:none;transition:color .3s}.breadcrumb-nav a:hover{color:var(--color-light-purple)}.breadcrumb-separator{margin:0 10px}.breadcrumb-current{color:#fff}.detail-header{justify-content:space-between;align-items:flex-end;gap:40px;max-width:1400px;margin:0 auto;padding:140px 40px 40px;display:flex}.header-left{flex:1}.metadata-badges{gap:15px;margin-bottom:20px;display:flex}.meta-badge{color:#fff;background:#ffffff14;border:1px solid #ffffff26;border-radius:12px;align-items:center;gap:12px;padding:8px 20px;font-size:1.7rem;font-weight:500;display:flex}.meta-badge strong{color:var(--color-light-purple)}.project-large-title{background:linear-gradient(#fff,#999);-webkit-text-fill-color:transparent;-webkit-background-clip:text;background-clip:text;margin:0 0 15px;font-size:clamp(2.5rem,5vw,4.5rem);font-weight:800;line-height:1.1}.project-one-liner{color:#bbb;max-width:800px;margin:0;font-size:1.5rem}.header-right{gap:15px;padding-bottom:10px;display:flex}.action-button{border-radius:14px;align-items:center;gap:10px;padding:16px 32px;font-size:1.2rem;font-weight:700;text-decoration:none;transition:all .3s cubic-bezier(.23,1,.32,1);display:flex}.visit-btn{color:#000;background:#fff}.github-link{color:#fff;background:#ffffff0d;border:1px solid #ffffff1a}.youtube-btn{color:#ff6b6b;background:linear-gradient(135deg,#f003,#ff45001a);border:1px solid #ff00004d}.action-button:hover{transform:translateY(-5px);box-shadow:0 10px 20px #0006}.detail-main-layout{grid-template-columns:1fr 320px;gap:80px;max-width:1400px;margin:0 auto;padding:60px 40px 100px;display:grid}.detail-content-side{flex-direction:column;gap:100px;display:flex}.project-main-visual{aspect-ratio:16/9;cursor:pointer;background:#111;border:1px solid #ffffff0d;border-radius:30px;width:100%;transition:transform .3s;position:relative;overflow:hidden;box-shadow:0 40px 80px #0009}.project-main-visual:hover{transform:scale(1.01)}.lightbox-overlay{z-index:1000;cursor:zoom-out;background:#000000f2;justify-content:center;align-items:center;padding:40px;display:flex;position:fixed;inset:0}.lightbox-content{max-width:100%;max-height:100%;position:relative}.detail-section-title{color:#fff;letter-spacing:-.02em;margin-bottom:45px;font-size:3.5rem;font-weight:900}.detail-text{color:#e0e0e0;font-size:2rem;line-height:1.9}.arch-grid{gap:30px;display:grid}.arch-card{border:1px solid #ffffff0d;border-left:5px solid var(--color-light-purple);background:#ffffff05;border-radius:20px;padding:30px}.arch-card h4{color:var(--color-light-purple);text-transform:uppercase;letter-spacing:.2em;margin:0 0 15px;font-size:1.5rem;font-weight:800}.arch-card p{color:#fff;margin:0;font-size:2rem;line-height:1.7}.roadmap-items{flex-direction:column;gap:15px;display:flex}.roadmap-step{background:#a855f70d;border:1px solid #a855f71a;border-radius:16px;align-items:center;gap:15px;padding:20px 30px;font-size:2rem;display:flex}.roadmap-step:before{content:"●";color:var(--color-light-purple);font-size:.8rem}.detail-sidebar{position:relative}.on-this-page-card{border-left:1px solid #ffffff1a;padding:10px 0 10px 25px;position:sticky;top:140px}.nav-title{letter-spacing:.15em;color:#888;text-transform:uppercase;margin-bottom:30px;margin-left:-5px;font-size:3rem;font-weight:900}.side-nav-links{flex-direction:column;gap:22px;display:flex}.side-link{color:#888;font-size:1.7rem;font-weight:600;text-decoration:none;transition:all .3s;position:relative}.side-link:hover{color:#aaa}.side-link.active{color:#fff;font-weight:700}.side-link.active:before{content:"";background:var(--color-light-purple);width:2px;height:100%;box-shadow:0 0 10px var(--color-light-purple);position:absolute;top:50%;left:-26px;transform:translateY(-50%)}.highlight-icon{font-size:3rem}.highlight-title{color:#fff;margin:0;font-size:2.2rem;font-weight:800}.standout-grid{grid-template-columns:repeat(2,1fr);gap:30px;display:grid}.standout-card{background:linear-gradient(135deg,#a855f71a 0%,#0000 100%);border-radius:24px;padding:40px}.challenges-list{flex-direction:column;gap:25px;display:flex}.challenge-card{background:#ffffff08;border:1px solid #ffffff1a;border-radius:16px;padding:30px}.challenge-problem{color:#ff6b6b;border-bottom:1px solid #ffffff14;margin-bottom:15px;padding-bottom:15px;font-size:1.6rem}.challenge-solution{color:#69db7c;font-size:1.6rem}.challenge-problem strong,.challenge-solution strong{color:#fff;margin-right:8px}.structure-list{background:#0000004d;border-radius:12px;flex-direction:column;gap:12px;padding:25px 30px;font-family:Fira Code,Monaco,monospace;display:flex}.structure-item{color:#a5d6ff;border-bottom:1px solid #ffffff0d;padding:8px 0;font-size:1.4rem}.structure-item:last-child{border-bottom:none}.mobile-action-bar{-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);z-index:900;background:#0a0a0acc;border-top:1px solid #ffffff1a;gap:15px;padding:15px 20px;display:none;position:fixed;bottom:0;left:0;right:0}@media screen and (max-width:1200px){.detail-main-layout{grid-template-columns:1fr}.detail-sidebar{display:none}}@media screen and (max-width:768px){.detail-header{flex-direction:column;align-items:flex-start;padding:100px 20px 20px}.header-right{display:none}.mobile-action-bar{display:flex}.detail-main-layout{gap:40px;padding:0 20px 100px}.breadcrumb-nav{padding:120px 20px 15px;font-size:1rem}.project-large-title{font-size:clamp(2rem,8vw,3.5rem)}.project-one-liner{font-size:1.3rem}.detail-section-title{text-align:center;margin-bottom:25px;font-size:2.5rem}.detail-text{font-size:1.6rem;line-height:1.7}.arch-card{border-radius:14px;padding:20px}.arch-card h4{font-size:1.3rem}.arch-card p{font-size:1.6rem}.standout-grid{grid-template-columns:1fr;gap:20px}.standout-card{padding:25px}.highlight-title{font-size:1.8rem}.highlight-icon{font-size:2.5rem}.roadmap-step{padding:15px 20px;font-size:1.6rem}.challenge-card{padding:20px}.challenge-problem,.challenge-solution{font-size:1.4rem}.structure-list{padding:15px 20px}.structure-item{font-size:1.2rem}.detail-content-side{gap:60px}.meta-badge{padding:6px 14px;font-size:1.3rem}.metadata-badges{flex-wrap:wrap;gap:10px}.project-main-visual{border-radius:20px}.lightbox-overlay{padding:15px}.action-button{padding:12px 24px;font-size:1.1rem}.mobile-action-bar{gap:10px;padding:12px 15px}.mobile-action-bar .action-button{flex:1;justify-content:center;padding:12px 16px;font-size:1rem}}@media screen and (max-width:480px){.detail-header{padding:15px}.project-large-title{font-size:clamp(1.8rem,7vw,2.5rem)}.project-one-liner{font-size:1.1rem}.detail-main-layout{gap:30px;padding:0 15px 100px}.breadcrumb-nav{padding:110px 15px 10px;font-size:.9rem}.detail-section-title{margin-bottom:20px;font-size:2rem}.detail-text,.arch-card p{font-size:1.4rem}.highlight-title{font-size:1.5rem}.roadmap-step{padding:12px 15px;font-size:1.4rem}.challenge-problem,.challenge-solution{font-size:1.2rem}.detail-content-side{gap:40px}.meta-badge{gap:8px;padding:5px 10px;font-size:1.1rem}.standout-card{padding:20px}}.hackathon-meta-badge{animation:2.5s ease-in-out infinite alternate hackathon-badge-pulse;background:linear-gradient(135deg,#fbbf2433,#f59e0b26)!important;border-color:#fbbf2466!important}.hackathon-meta-badge strong{text-shadow:0 0 10px #fbbf244d;color:#fbbf24!important}@keyframes hackathon-badge-pulse{0%{box-shadow:0 0 10px #fbbf241a}to{box-shadow:0 0 25px #fbbf2440}}.hackathon-achievement-card{background:linear-gradient(135deg,#fbbf240f 0%,#a855f70a 50%,#0000004d 100%);border:1px solid #fbbf2433;border-radius:24px;flex-direction:column;gap:35px;padding:40px;display:flex}.hackathon-trophy-header{align-items:center;gap:25px;display:flex}.trophy-icon{filter:drop-shadow(0 0 20px #fbbf2466);font-size:5rem;animation:3s ease-in-out infinite trophy-bounce}@keyframes trophy-bounce{0%,to{transform:translateY(0)rotate(0)}25%{transform:translateY(-5px)rotate(-3deg)}75%{transform:translateY(-3px)rotate(3deg)}}.hackathon-achievement-title{background:linear-gradient(135deg,#fbbf24,#f59e0b,#fde68a);-webkit-text-fill-color:transparent;letter-spacing:-.01em;-webkit-background-clip:text;background-clip:text;margin:0;font-size:2.8rem;font-weight:900}.hackathon-event-name{color:#fff9;margin:8px 0 0;font-size:1.6rem}.hackathon-meta-grid{grid-template-columns:repeat(3,1fr);gap:20px;display:grid}.hackathon-meta-item{text-align:center;background:#ffffff0a;border:1px solid #ffffff14;border-radius:16px;flex-direction:column;gap:8px;padding:20px;display:flex}.hackathon-meta-label{color:#fff6;text-transform:uppercase;letter-spacing:.15em;font-size:1.1rem;font-weight:700}.hackathon-meta-value{color:#fff;font-size:1.6rem;font-weight:700}.hackathon-subtitle{color:#fff;margin:0 0 20px;font-size:2rem;font-weight:800}.team-members-grid{grid-template-columns:repeat(2,1fr);gap:16px;display:grid}.team-member-card{background:#ffffff08;border:1px solid #ffffff14;border-radius:16px;flex-direction:column;gap:6px;padding:20px;transition:all .3s;display:flex}.team-member-card:hover{background:#ffffff0d;border-color:#ffffff26}.team-member-highlight{position:relative;background:linear-gradient(135deg,#fbbf2414,#a855f714)!important;border-color:#fbbf244d!important}.team-member-highlight:after{content:"me";color:#000;letter-spacing:.05em;background:linear-gradient(135deg,#fbbf24,#f59e0b);border-radius:100px;padding:4px 12px;font-size:.9rem;font-weight:800;position:absolute;top:12px;right:12px}.team-member-name{color:#fff;font-size:1.6rem;font-weight:700}.team-member-role{color:#ffffff80;font-size:1.3rem}.hackathon-mentors,.hackathon-learnings{border-top:1px solid #ffffff0f;padding-top:10px}.hackathon-learnings-list{flex-direction:column;gap:12px;margin:0;padding:0;list-style:none;display:flex}.hackathon-learning-item{color:#e0e0e0;background:#a855f70d;border:1px solid #a855f71a;border-radius:12px;padding:14px 20px 14px 40px;font-size:1.6rem;position:relative}.hackathon-learning-item:before{content:"✨";position:absolute;top:50%;left:14px;transform:translateY(-50%)}.marketplace-btn{color:#4fc3f7;background:linear-gradient(135deg,#0078d433,#0078d41a);border:1px solid #0078d44d}.marketplace-btn:hover{background:linear-gradient(135deg,#0078d44d,#0078d433);border-color:#0078d480}@media screen and (max-width:768px){.hackathon-achievement-card{gap:25px;padding:25px}.trophy-icon{font-size:3.5rem}.hackathon-achievement-title{font-size:2rem}.hackathon-event-name{font-size:1.3rem}.hackathon-meta-grid,.team-members-grid{grid-template-columns:1fr;gap:12px}.hackathon-subtitle{font-size:1.6rem}.hackathon-learning-item{padding:12px 16px 12px 36px;font-size:1.4rem}.team-member-name{font-size:1.4rem}.team-member-role{font-size:1.2rem}.hackathon-meta-value{font-size:1.4rem}}@media screen and (max-width:480px){.hackathon-achievement-card{gap:20px;padding:20px}.hackathon-trophy-header{text-align:center;flex-direction:column;gap:15px}.trophy-icon{font-size:3rem}.hackathon-achievement-title{font-size:1.8rem}.hackathon-event-name,.hackathon-learning-item{font-size:1.2rem}}
