html,body,#root{height:100%;margin:0;scroll-behavior:smooth}*{margin:0;padding:0;box-sizing:border-box}:root{--page-bg: radial-gradient( 125% 125% at 50% 10%, #000 50%, #0063ff 100% );--text-color: #ffffff;--heading-color: #ffffff;--section-title-color: #ffffff;--muted-text: #c5d4e3;--secondary-text: #c5d4e3;--location-color: #9ca3af;--card-bg: rgba(255, 255, 255, .08);--card-border: rgba(255, 255, 255, .12);--shadow: rgba(0, 0, 0, .5);--card-shadow: 0 15px 30px rgba(0, 0, 0, .5);--card-shadow-hover: 0 25px 50px rgba(0, 0, 0, .6);--border-color: #e5e7eb;--accent-color: #8b7cf6;--accent-hover: #7565ed;--period-bg: #e0f7ef;--period-text: #007f5f;--resume-bg: rgb(36, 31, 42);--button-bg: #0063ff;--button-bg-hover: #053d79;--button-text: #ffffff;--button-shadow: 0 3px 6px rgba(0, 0, 0, .1);--button-shadow-hover: 0 5px 12px rgba(0, 0, 0, .15);--contact-bg: rgba(0, 0, 0, .35);--contact-card-bg: rgba(255, 255, 255, .08);--contact-border: rgba(255, 255, 255, .12);--contact-secondary-text: #c5d4e3;--contact-muted-text: #9ca3af;--contact-line: rgba(255, 255, 255, .3);--project-button-primary: #2563eb;--project-button-primary-hover: #1d4ed8;--project-button-secondary-bg: rgba(255, 255, 255, .05);--project-button-secondary-border: rgba(255, 255, 255, .2);--project-button-secondary-text: #ffffff;--project-tag-bg: rgba(255, 255, 255, .08);--project-tag-border: rgba(255, 255, 255, .12);--project-tag-text: #ffffff;--project-card-bg: rgba(255, 255, 255, .06);--project-card-border: rgba(255, 255, 255, .08);--project-image-card-bg: #122236;--project-insight-bg: rgb(29, 29, 29);--project-insight-text: #f5f5f5;--project-highlight-bg: rgba(255, 255, 255, .08);--project-highlight-border: rgba(255, 255, 255, .1);--project-highlight-text: #dbeafe;--project-link-color: #60a5fa;--project-link-hover: #93c5fd;--project-shadow: rgba(0, 0, 0, .4)}[data-theme=light]{--page-bg: radial-gradient( 125% 125% at 50% 10%, #ffffff 50%, #dceaff 100% );--text-color: #111111;--heading-color: #ffffff;--heading-color-light: rgb(0, 0, 0);--section-title-color: #111111;--muted-text: #4b5563;--secondary-text: #4b5563;--location-color: #6b7280;--card-bg: rgba(255, 255, 255, .7);--card-border: rgba(0, 0, 0, .08);--shadow: rgba(0, 0, 0, .1);--card-shadow: 0 15px 30px rgba(0, 0, 0, .08);--card-shadow-hover: 0 25px 50px rgba(0, 0, 0, .14);--border-color: #d1d5db;--accent-color: #2563eb;--accent-hover: #1d4ed8;--period-bg: #e0f7ef;--period-text: #007f5f;--resume-bg: rgba(255, 255, 255, .7);--button-bg: #0063ff;--button-bg-hover: #1d4ed8;--button-text: #ffffff;--button-shadow: 0 3px 6px rgba(0, 0, 0, .1);--button-shadow-hover: 0 5px 12px rgba(0, 99, 255, .2);--contact-bg: rgba(255, 255, 255, .35);--contact-card-bg: rgba(255, 255, 255, .7);--contact-border: rgba(0, 0, 0, .08);--contact-secondary-text: #4b5563;--contact-muted-text: #6b7280;--contact-line: rgba(0, 0, 0, .2);--project-button-primary: #2563eb;--project-button-primary-hover: #1d4ed8;--project-button-secondary-bg: rgba(255, 255, 255, .8);--project-button-secondary-border: #2563eb;--project-button-secondary-text: #1e40af;--project-tag-bg: rgba(37, 99, 235, .08);--project-tag-border: rgba(37, 99, 235, .18);--project-tag-text: #1e3a8a;--project-card-bg: rgba(255, 255, 255, .7);--project-card-border: rgba(37, 99, 235, .12);--project-image-card-bg: #eef4ff;--project-insight-bg: rgba(239, 246, 255, .9);--project-insight-text: #1f2937;--project-highlight-bg: rgba(37, 99, 235, .08);--project-highlight-border: rgba(37, 99, 235, .15);--project-highlight-text: #1e40af;--project-link-color: #2563eb;--project-link-hover: #1d4ed8;--project-shadow: rgba(15, 23, 42, .15)}.app-container{min-height:100%;display:flex;flex-direction:column}.section-title{font-size:3rem;font-weight:800;margin-top:4rem;color:var(--section-title-color);transition:color .3s ease}.page-container{max-width:1200px;width:100%;margin:0 auto;padding:0 10px;flex:1;display:flex;flex-direction:column}.container{max-width:1200px;width:100%;padding-top:2rem}.about-description{line-height:1.7;max-width:1000px;color:var(--text-color);transition:color .3s ease}.para-container{display:grid;grid-template-columns:repeat(3,1fr);gap:2rem;margin-top:2rem}.about-card{margin-top:1rem;background:var(--card-bg);border:1px solid var(--card-border);padding:2rem;border-radius:20px;box-shadow:0 15px 30px var(--shadow);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);transition:transform .3s ease,box-shadow .3s ease,background .3s ease,border-color .3s ease}.about-card:hover{transform:translateY(-5px);box-shadow:0 25px 50px var(--shadow)}.about-card p{margin-top:1rem;color:var(--secondary-text);line-height:1.6}.education{margin-top:4rem;position:relative}.education-title{font-size:2.5rem;color:var(--heading-color);margin-bottom:1.5rem}.education-item{position:relative;background:var(--card-bg);border:1px solid var(--card-border);margin-top:1rem;margin-bottom:2rem;padding:2rem 2rem 2rem 1.5rem;border-left:3px solid var(--accent-color);border-radius:0 16px 16px 0;box-shadow:0 10px 25px var(--shadow);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);transition:background .3s ease,border-color .3s ease,box-shadow .3s ease}.education-header{display:flex;justify-content:space-between;align-items:center;gap:1rem;font-size:1.5rem;color:var(--heading-color)}.education-period{flex-shrink:0;background:var(--period-bg);color:var(--period-text);font-size:.9rem;font-weight:600;border-radius:999px;padding:.35rem .8rem}.education-location{margin-top:.6rem;color:var(--location-color);font-size:.95rem;font-weight:500}.education-description{margin-top:.7rem;color:var(--secondary-text);line-height:1.6}.resume-section{margin-top:4rem;background:var(--resume-bg);padding:3rem 2rem;border-radius:20px;border:1px solid var(--card-border);text-align:center;transition:background .3s ease,border-color .3s ease}.resume-title{font-size:3rem;margin-bottom:1rem;color:var(--heading-color)}.resume-para{font-size:1.2rem;color:var(--secondary-text)}.cv-button{display:inline-block;background:var(--accent-color);color:#fff;text-decoration:none;padding:.8rem 2.6rem;border-radius:2rem;font-weight:600;margin-top:1rem;transition:background .3s ease,transform .3s ease,box-shadow .3s ease;box-shadow:0 5px 15px #0063ff40}.cv-button:hover{background:var(--accent-hover);transform:translateY(-2px);box-shadow:0 8px 20px #0063ff4d}body{font-family:Outfit,sans-serif;background:var(--page-bg);background-attachment:fixed;min-height:100vh;width:100%;color:var(--text-color);transition:background .3s ease,color .3s ease}@media screen and (max-width: 1000px){.para-container{grid-template-columns:1fr}}@media screen and (max-width: 768px){.page-container{flex:1;padding:0 12px;margin:1rem}.section-title{padding-bottom:1rem;font-size:2.5rem}.container{padding-top:1rem}.education-header{align-items:flex-start;flex-direction:column}.education-period{align-self:flex-start}.resume-title{font-size:2.5rem}}@media screen and (max-width: 650px){.about{margin-right:0}.para-container{grid-template-columns:1fr;gap:1rem}.about-card{padding:1.5rem}.education{margin-top:3rem}.education-title{font-size:2rem}.education-item{padding:1.5rem 1.5rem 1.5rem 1.2rem}.education-header{font-size:1.2rem}.resume-section{padding:2rem 1.5rem}.resume-title{font-size:2rem}.resume-para{font-size:1rem}}nav{position:fixed;top:0;left:0;right:0;display:flex;justify-content:space-between;align-items:center;padding:1rem 2rem;border-bottom:1px solid rgb(53,51,51);background-color:#000000b0;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);z-index:1000}.nav-container{width:100%;display:flex;justify-content:space-between;align-items:center}.logo-link{font-weight:700;display:flex;font-size:1.6rem;text-decoration:none;width:13%;color:#fff;letter-spacing:1px;transition:color .3s ease}.logo-link:hover{color:#04d3ee}.nav-links{display:flex;gap:2rem;list-style:none}.nav-link{position:relative;color:#fff;font-weight:500;cursor:pointer;padding:.5rem 0;transition:all .3s ease}.nav-link:after{content:"";position:absolute;left:0;bottom:-4px;width:0%;height:2px;background-color:#04d3ee;transition:width .3s ease}.nav-link:hover:after{width:100%}.nav-link.active{color:#04d3ee}.menu{display:none;flex-direction:column;justify-content:space-between;width:2.25rem;height:2rem;cursor:pointer}.menu span{display:block;height:.4rem;width:100%;background-color:#fff;border-radius:.2rem;transition:all .3s ease}.logo-navbar{width:3.5rem}.language-switcher{display:flex;align-items:center;gap:.4rem;padding:.3rem;border-radius:50px;background:#ffffff14;border:1px solid rgba(255,255,255,.12);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px)}.language-switcher button{border:none;background:transparent;color:var(--muted-text);padding:.45rem .8rem;border-radius:30px;font-family:inherit;font-size:.9rem;font-weight:500;cursor:pointer;transition:background-color .3s ease,color .3s ease,transform .2s ease}.language-switcher button:hover{color:var(--text-color)}.language-switcher .language-active{background:var(--accent-color);color:#fff;font-weight:600}.language-switcher .language-active:hover{color:#fff;transform:translateY(-1px)}[data-theme=light] .language-switcher{background:#0000000d;border-color:#0000001a}@media screen and (max-width: 650px){.language-switcher{gap:.2rem;padding:.2rem}.language-switcher button{padding:.4rem .65rem;font-size:.8rem}}@media screen and (max-width: 750px){.logo-navbar{width:4rem}.menu{display:flex;float:right}.nav-links{position:absolute;top:100%;left:0;right:0;display:none;flex-direction:column;align-items:center;gap:1.5rem;padding:1rem 0;background-color:#0d1121fc;animation:slideDown .3s ease forwards}.nav-links.open{display:flex}@keyframes slideDown{0%{opacity:0;transform:translateY(-10px)}to{opacity:1;transform:translateY(0)}}}.theme-toggle{border:none;outline:none;background:#0063ff;color:#e2aaaa;width:42px;height:42px;border-radius:100%;display:flex;align-items:center;justify-content:center;cursor:pointer;transition:background .3s ease,color .3s ease}[data-theme=light] .theme-toggle{background:#facc15;color:#fff}.theme-toggle:hover{transform:scale(1.05)}.footer{background:linear-gradient(135deg,#1d1c2a,#1e253a,#181329);text-align:center;display:flex;justify-content:center;padding:2rem;color:#fff;width:100%}.footer p{color:#fff;font-size:1rem}.contact-container{display:grid;grid-template-columns:repeat(3,1fr);gap:2rem;margin-bottom:1rem}.contacts{margin-top:1rem;position:relative;border:1px solid transparent;border-radius:20px;padding:1rem;display:flex;text-align:center;flex-direction:column}.contactLogo{display:flex;justify-content:center;align-items:center;text-align:center;width:20%;flex-direction:column;cursor:pointer;margin:0 auto;transition:transform 2s}.contactLogo:hover{transform:rotate(180deg)}.targetContact{cursor:pointer}.contactTitle{margin-top:0}.footer-heading{color:#198ffd}.footer-content{color:#fcfeff;text-decoration:none;cursor:pointer}.footer-content:hover{color:#3cb4f0}@media screen and (max-width: 1000px){.contact-container{display:grid;grid-template-columns:repeat(1,1fr)}}:root{--page-padding: 5rem;--gap: 3rem;--text-max-width: 60ch;--home-accent: #09caff;--home-button-gradient-primary: linear-gradient( 240deg, #00addd -5.09%, #c50ddd 106.2% );--home-button-gradient-secondary: linear-gradient( 240deg, #3690f7 -5.09%, #0e4dba 106.2% )}.home-container{display:flex;justify-content:space-between;align-items:center;width:100%;min-height:70vh;padding:var(--page-padding) 0;gap:var(--gap)}.main-text{flex:1 1 500px;max-width:var(--text-max-width)}.main-text h1{font-size:2.5rem;font-weight:600;color:var(--heading-color-light)}.main-text h2{font-size:4.5rem;font-weight:600;margin-top:1rem;color:var(--heading-color-light)}.main-text p{margin:1rem 0;font-size:1.25rem;color:var(--text-color)}.words-container{display:flex;align-items:center;margin-top:1rem;position:relative}.text{position:relative;font-size:1.575rem;font-weight:700}.text.first-text{color:var(--text-color)}.text.sec-text{color:var(--home-accent)}.profile-container{flex:1 1 400px;display:flex;justify-content:center;align-items:center}.profile-container img{width:100%;max-width:500px;padding-top:2rem;border-radius:50%;object-fit:cover}.btn-action{display:flex;margin-top:2rem;gap:1.5rem;flex-wrap:wrap}.btn-work,.btn-link{display:flex;align-items:center;justify-content:center;cursor:pointer;text-decoration:none;padding:1rem 2.5rem;border-radius:50px;position:relative;font-weight:500;color:#fff;transition:transform .3s ease,box-shadow .3s ease}.btn-work{background-color:var(--button-bg)}.btn-work:after{content:"";position:absolute;height:107%;width:102%;border-radius:50px;background-image:var(--home-button-gradient-primary);z-index:-1}.btn-link{background-color:var(--button-bg)}.btn-link:after{content:"";position:absolute;height:107%;width:102%;border-radius:50px;background-image:var(--home-button-gradient-secondary);z-index:-1}.btn-work:hover,.btn-link:hover{z-index:0;transform:translateY(-2px);box-shadow:0 10px 30px #00addd59}@media screen and (max-width: 1200px){.profile-container img{max-width:350px}.btn-action{flex-direction:column;align-items:flex-start}.btn-work,.btn-link{max-width:250px;width:100%}}@media screen and (max-width: 750px){.home-container{flex-direction:column;padding:2rem 1rem;gap:2rem}.main-text h1{font-size:1.5rem}.main-text h2{font-size:2rem}.main-text{order:2;text-align:left;margin:0 auto}.profile-container{order:1;margin-top:2rem}.text{font-size:1rem}.text.sec-text{padding-left:.25rem}}@media screen and (max-width: 650px){.home-container{flex-direction:column;padding:2rem 1rem;gap:2rem}.main-text h1{font-size:1.5rem}.main-text h2{font-size:2rem}.main-text{order:2;text-align:left;margin:0 auto}.profile-container{order:1;margin-top:2rem}.text{font-size:1rem}.text.sec-text{padding-left:.25rem}}.container{max-width:1200px;padding-top:2rem}.para-container{display:grid;grid-template-columns:repeat(3,1fr);gap:2rem;margin-top:1rem}.about-card{margin-top:1rem;background:#ffffff14;padding:2rem;border-radius:20px;box-shadow:0 15px 30px #00000080;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}.about-card p{margin-top:1rem;color:var(--contact-secondary-text)}.about-card:hover{box-shadow:0 25px 50px #0009}.about-description{line-height:1.6;max-width:1000px}.education{margin-top:3rem;position:relative}.education-title{font-size:2.5rem}.education-item{background:#ffffff14;margin-top:1rem;position:relative;margin-bottom:2rem;padding:2rem 2rem 2rem 1.5rem;border-left:2px solid #e5e7eb;border-bottom:2px solid #e5e7eb}.education-header{display:flex;justify-content:space-between;align-items:center;font-size:1.5rem}.education-item,.education-header,.education-location,.education-description{text-align:left}.resume-section{background-color:#241f2a;padding:1rem}.cv-download{margin-top:2rem;text-align:center}.resume-title{font-size:3rem;margin-bottom:1rem}.resume-para{font-size:1.2rem}.cv-button{display:inline-block;background-color:#09399b;color:#fff;text-decoration:none;padding:.8rem 2.6rem;border-radius:2rem;font-weight:600;margin-top:1rem;transition:all .3s ease;box-shadow:0 3px 6px #0000001a}.cv-button:hover{background-color:#053d79;transform:translateY(-1px);box-shadow:0 5px 12px #00000026}@media screen and (max-width: 650px){.about{margin-right:2rem}.para-container{display:grid;grid-template-rows:repeat(1,1fr);gap:2rem;margin-top:1rem}}@media screen and (max-width: 1000px){.para-container{display:grid;grid-template-columns:repeat(1,1fr)}}.skill-content{display:grid;grid-template-rows:repeat(3,1fr);gap:2rem;margin-top:1rem}.skill-card{margin-top:1rem;position:relative;background:#ffffff0d;border:1px solid transparent;border-color:#243386;border-radius:20px;padding:1rem;box-shadow:0 15px 30px #0006}.skillicon-container{display:flex;flex-direction:rows;margin-bottom:1rem}.skillicon-container p{margin-left:1rem}.rating{width:50px;height:20px;color:#00f}.skills-container{color:#fff;text-align:center;margin-bottom:2.5rem;display:grid;grid-template-columns:repeat(2,1fr);gap:3rem}.skills-title{font-size:2.5rem;color:#eefbff}.skills-title span{color:#2492ff}.skills-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:2rem;margin-bottom:2rem}.skill-item img{max-width:60px}.skill-item p{font-size:1rem;margin-top:.5rem}.css,.html{width:98%}.react{width:76%}.nodeJS,.express,.docker,.javascript{width:56%}.mongoDB{width:66%}.figma,.vsCode,.terminal{width:96%}@media screen and (max-width: 1000px){.skills-section{flex-direction:column;justify-content:center;margin:0 auto;padding-right:2px}.skills-container{grid-template-columns:1fr;width:80%}.skill-title{text-align:center}.skill-card{display:flex;flex-direction:column;width:100%}}@media screen and (max-width: 650px){.skills-grid{display:grid;grid-template-columns:repeat(1,1fr)}}.project-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:2rem;align-items:stretch;width:100%}.project-card{display:flex;flex-direction:column;justify-content:space-between;height:100%;margin-top:1rem;border:3px solid transparent;border-radius:20px;padding:1rem;background:linear-gradient(#17233d,#263555) padding-box,linear-gradient(#0d6ea2,#a813a8) border-box;transition:all .3s ease}.column-project p{margin-bottom:1rem;line-height:1.6}.project-content{margin-top:2rem}.project-card:hover{transform:translateY(-8px) scale(1.02);box-shadow:0 25px 40px #4d479d66;background:linear-gradient(#17233d,#17233d) padding-box,linear-gradient(#14adff,#fb1be1) border-box}.project-img img{position:relative;display:flex;align-items:center;margin:0 auto;justify-content:center;border-radius:20px;width:100%;aspect-ratio:19/9;object-fit:cover;border:1px solid rgb(138,138,138)}.project-section{display:flex;flex-direction:column;padding-top:2rem}.project-container{display:flex;flex-direction:column;flex-grow:1}.project-title{color:#fff;font-size:2rem;padding-bottom:1rem}.role{font-size:1rem;color:#86c4fe}.project-content{display:flex;flex-direction:column;flex-grow:1}.project-content p{color:#fff;line-height:1.6}.project-tags span{display:inline-block;padding:.4rem 1rem;margin:10px 10px 10px 0;background:#384862;color:#fcfeff;border-radius:5px;font-size:.85rem}.desc-link{display:flex;justify-content:space-between;gap:2rem;margin-top:1.5rem}.desc-link a{text-decoration:none;border-radius:20px;padding:.5rem 1.2rem;font-size:15px;display:flex;align-items:center;transition:.3s}.arrow{width:6px;height:6px;border-right:2px solid rgb(255,255,255);border-bottom:2px solid rgb(255,255,255);transform:rotate(-45deg);margin-left:6px;transition:all .3s ease}.desc-link a:hover .arrow{transform:rotate(-45deg) translate(4px,4px)}.category-buttons button{padding:7px 12px;border:none;background:#aedeff;cursor:pointer;border-radius:20px;margin:10px;font-size:16px;font-weight:700}.type-category{background-color:#6181a399;padding:1px 10px;border-radius:5px}.btn-readMore,.category-buttons button.active{background-color:#1689ed;color:#fff}.badge-container{display:flex;justify-content:space-between;align-items:center;margin-bottom:1rem}.status-badge{display:flex;align-items:center;justify-content:center;padding:4px 12px;color:#fff;background-color:#0009;box-shadow:0 2px 6px #0000004d;font-size:12px;font-weight:500;border-radius:20px}.link-container{text-decoration:none;color:#fff}.status-badge.finished{background-color:#09992a}.status-badge.progress{background-color:#e08609}@media screen and (max-width: 900px){.project-grid{display:flex;justify-content:center;flex-direction:column;margin:0 auto}.desc-link{gap:20px}.project-img img{width:100%;height:100%}}@media screen and (max-width: 650px){.project-grid{display:flex;justify-content:center;flex-direction:column;width:100%;margin:0 auto}.project-img{width:100%;object-fit:cover;height:auto}.project-section{margin-top:2rem}}@media screen and (max-width: 1200px){.project-img img{aspect-ratio:19/10}.project-card{padding:2rem;border-radius:25px}.desc-link{justify-content:center;flex-wrap:wrap}.work-section{align-items:center;text-align:center;display:flex;flex-direction:column}.work-para{padding:20px;width:6%;display:flex;justify-content:center;flex-direction:column;align-items:center}.desc-link .demo,.desc-link .readMore{font-size:14px;padding:8px 16px}}#contact{padding:80px 20px;background:var(--contact-bg);color:var(--text-color);margin-bottom:2rem;transition:background .3s ease,color .3s ease}.container{max-width:1100px;margin:0 auto;text-align:center}.section-title{font-size:2.5rem;margin-bottom:10px;font-weight:700;color:var(--section-title-color)}hr{width:80px;margin:10px auto 40px;border:0;border-top:1px solid var(--contact-line)}.contact-container{display:flex;justify-content:center;gap:60px;flex-wrap:wrap}.contact-item{display:flex;flex-direction:column;align-items:center;gap:10px;padding:25px;min-width:200px;background:var(--contact-card-bg);border:1px solid var(--contact-border);border-radius:16px;backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);transition:transform .3s ease,box-shadow .3s ease,background .3s ease,border-color .3s ease}.contact-item:hover{transform:translateY(-6px);box-shadow:0 10px 25px #0003}.contact-icon{width:40px;height:40px;object-fit:contain;transition:transform .3s ease}.contact-item:hover .contact-icon{transform:scale(1.1)}.contact-heading{font-size:1.1rem;font-weight:600;margin:0;color:var(--heading-color)}.contact-text{color:var(--contact-secondary-text);text-decoration:none;font-size:.95rem;transition:color .3s ease}.contact-text:hover{color:var(--heading-color)}.footer-copy{margin-top:60px;font-size:.9rem;color:var(--contact-muted-text)}@media screen and (max-width: 650px){#contact{padding:60px 20px}.contact-container{gap:20px}.contact-item{width:100%;max-width:300px;min-width:unset}.section-title{font-size:2rem}}.project-container-wrap{display:flex;flex-direction:column}.project-detail a.readMore,.project-detail a.demo{padding:.7rem 1.2rem;border-radius:10px;font-weight:500;display:inline-flex;align-items:center;gap:8px;text-decoration:none;transition:transform .25s ease,background .25s ease,color .25s ease,border-color .25s ease,box-shadow .25s ease}.project-detail a.readMore{background:linear-gradient(135deg,var(--project-button-primary),#4f46e5);color:#fff}.project-detail a.readMore:hover{transform:translateY(-3px);background:linear-gradient(135deg,var(--project-button-primary-hover),#4338ca);box-shadow:0 8px 20px var(--project-shadow)}.project-detail a.demo{background:var(--project-button-secondary-bg);border:1px solid var(--project-button-secondary-border);color:var(--project-button-secondary-text)}.project-detail a.demo:hover{background:var(--project-button-primary);border-color:var(--project-button-primary);color:#fff;transform:translateY(-3px);box-shadow:0 8px 20px var(--project-shadow)}.arrow{width:6px;height:6px;transform:rotate(-45deg);margin-left:8px;transition:transform .2s ease}.project-detail a:hover .arrow{transform:rotate(-45deg) translate(3px,3px)}.back-btn{display:inline-flex;align-items:center;gap:7px;line-height:1.5rem;margin-top:2rem;margin-bottom:2rem;text-decoration:none;color:var(--project-link-color);font-weight:500;transition:color .2s ease,transform .2s ease}.back-btn:before{content:"←";font-weight:700;font-size:1.5em}.back-btn:hover{color:var(--project-link-hover);transform:translate(-4px)}.project-detail{padding-top:80px;margin:0 auto;max-width:1100px;padding-left:1rem;padding-right:1rem;color:var(--text-color);transition:color .3s ease}.project-detail h1{font-size:3rem;margin-bottom:1rem;letter-spacing:-.02em;color:var(--heading-color-light)}.project-tags{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:1.5rem}.project-tags span{background:var(--project-tag-bg);border:1px solid var(--project-tag-border);color:var(--project-tag-text);padding:6px 12px;border-radius:999px;font-size:.85rem;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px)}.desc-link{display:flex;gap:12px;flex-wrap:wrap;margin-bottom:2rem}.project-description{font-size:1.1rem;line-height:1.8;color:var(--text-color);opacity:.9;margin-bottom:2rem}.wrapp-video{width:100%;max-width:800px;margin:2rem auto}video{width:100%;border-radius:16px;box-shadow:0 20px 40px var(--project-shadow)}.project-section{margin-top:2.5rem}.project-section h2{font-size:1.5rem;margin-bottom:1rem;color:var(--heading-color)}.process-title{padding-bottom:2rem}.role-container{background:var(--project-card-bg);border:1px solid var(--project-card-border);padding:2rem;border-radius:16px;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);transition:background .3s ease,border-color .3s ease}.process-container{margin-top:3rem}.process-step{display:grid;grid-template-columns:50px 1fr;gap:1rem;margin-bottom:2.5rem}.step-number{font-size:1.9rem;color:var(--project-button-primary)}.step-content h3{margin-bottom:.5rem;color:var(--heading-color)}.process-image-group{display:grid;grid-template-columns:repeat(2,1fr);gap:15px;margin-top:1rem}.process-image-group img{width:100%;border-radius:12px;transition:transform .2s ease;max-width:1100px}.process-image-group img:hover{transform:scale(1.02)}.process-image-item{display:flex;flex-direction:column;margin-bottom:2rem;margin-top:2rem;background-color:var(--project-image-card-bg);border-radius:10px;padding:5px;justify-content:center;transition:background-color .3s ease}.image-caption{font-size:14px;color:var(--muted-text);line-height:1.4;padding-left:2rem}.new-version-image img{display:flex;flex-direction:column;max-width:900px;justify-content:center}.project-cover-image{width:100%}.project-cover-image img{width:100%;border-radius:20px;object-fit:cover;display:block}.key-insight-list{margin-top:1rem;padding:1.2rem 1.5rem;background:var(--project-insight-bg);border-radius:12px;list-style:none;display:flex;flex-direction:column;gap:10px;color:var(--project-insight-text)}.key-insight-list li{position:relative;padding-left:1rem;line-height:1.6;opacity:.95}.key-insight-list li:before{content:"•";color:var(--project-link-color);position:absolute;left:0}.step-highlights{display:flex;flex-wrap:wrap;gap:10px;margin-top:1rem}.step-highlights span{padding:6px 12px;border-radius:999px;background:var(--project-highlight-bg);border:1px solid var(--project-highlight-border);font-size:.85rem;color:var(--project-highlight-text)}@media screen and (max-width: 1200px){.project-detail{max-width:1000px}.wrapp-video{max-width:60rem}}@media screen and (max-width: 650px){.process-image-group{grid-template-columns:1fr}.project-detail h1{font-size:2.3rem}}