@media only screen and (min-width:0rem){#portfolio{background-color:var(--lightBG2);overflow:hidden;padding:var(--sectionPadding);padding-bottom:0;padding-top:0;position:relative}#portfolio:before{animation:float 20s ease-in-out infinite;background:radial-gradient(circle,rgba(155,7,7,.15) 0,rgba(155,7,7,.08) 40%,transparent 70%);box-shadow:0 0 80px rgba(155,7,7,.25),0 0 120px rgba(155,7,7,.15),0 0 180px rgba(155,7,7,.08);left:-200px;top:-250px}#portfolio:after,#portfolio:before{border-radius:50%;content:"";height:500px;pointer-events:none;position:absolute;width:500px;z-index:-1}#portfolio:after{animation:float 20s ease-in-out infinite reverse;background:radial-gradient(circle,rgba(155,7,7,.35) 0,rgba(155,7,7,.18) 40%,transparent 70%);bottom:-250px;box-shadow:0 0 80px rgba(155,7,7,.5),0 0 120px rgba(155,7,7,.35),0 0 180px rgba(155,7,7,.18);right:-200px}#portfolio .cs-container{margin:auto;max-width:80rem;padding:0 1rem;text-align:center;width:100%}#portfolio .cs-topper{display:block;margin-bottom:.5rem}#portfolio .cs-title{margin-bottom:clamp(3rem,6vw,4rem);max-width:100%}#portfolio .tech-stack{display:flex;flex-wrap:wrap;gap:.75rem;justify-content:center;margin-bottom:clamp(3rem,6vw,4rem)}#portfolio .tech-badge{background:linear-gradient(135deg,var(--primary),#c60a0a);border-radius:1.25rem;box-shadow:0 4px 12px rgba(155,7,7,.3);color:#fff;display:inline-block;font-size:.875rem;font-weight:600;padding:.5rem 1.25rem;transition:transform .3s ease,box-shadow .3s ease}#portfolio .tech-badge:hover{box-shadow:0 6px 20px rgba(155,7,7,.4);transform:translateY(-2px)}#portfolio .case-study-item{animation:fadeInUp .6s ease forwards;background-color:#fff;border-radius:.75rem;box-shadow:0 20px 39px 0 rgba(0,0,0,.08);display:flex;flex-direction:column;gap:clamp(1.5rem,4vw,2.5rem);margin-bottom:clamp(3rem,8vw,5rem);opacity:0;padding:clamp(1.5rem,4vw,2.5rem);transform:translateY(30px);transition:transform .3s ease,box-shadow .3s ease}#portfolio .case-study-item:hover{box-shadow:0 30px 60px 0 rgba(0,0,0,.15);transform:translateY(-8px)}#portfolio .case-study-item:nth-child(3){animation-delay:.1s}#portfolio .case-study-item:nth-child(4){animation-delay:.2s}#portfolio .case-study-item:nth-child(5){animation-delay:.3s}#portfolio .case-study-item:nth-child(6){animation-delay:.4s}#portfolio .cs-content{flex:1;text-align:left}#portfolio .cs-content .icon-title-wrapper{align-items:center;display:flex;gap:1rem;margin-bottom:1.5rem}#portfolio .cs-content .case-icon{fill:var(--primary);flex-shrink:0;height:clamp(2rem,4vw,2.5rem);opacity:.9;width:clamp(2rem,4vw,2.5rem)}#portfolio .cs-content h3{color:var(--headerColor);font-size:clamp(1.5625rem,2.5vw,2rem);font-weight:700;margin-bottom:0}#portfolio .cs-content .problem-solution{display:flex;flex-direction:column;gap:1.25rem}#portfolio .cs-content .problem,#portfolio .cs-content .solution{border-left:3px solid transparent;padding-left:1.25rem;position:relative;transition:border-color .3s ease}#portfolio .cs-content .problem{border-left-color:rgba(155,7,7,.3)}#portfolio .cs-content .problem:hover{border-left-color:rgba(155,7,7,.6)}#portfolio .cs-content .solution{border-left-color:rgba(46,204,113,.4)}#portfolio .cs-content .solution:hover{border-left-color:rgba(46,204,113,.7)}#portfolio .cs-content .label{border-radius:.25rem;display:inline-block;font-size:.75rem;font-weight:700;letter-spacing:.05em;margin-bottom:.5rem;padding:.25rem .75rem;text-transform:uppercase}#portfolio .cs-content .problem .label{background-color:rgba(155,7,7,.1);color:var(--primary)}#portfolio .cs-content .solution .label{background-color:rgba(46,204,113,.15);color:#27ae60}#portfolio .cs-content .cs-text{margin-bottom:1rem;opacity:.9}#portfolio .cs-content .cs-text:last-of-type{margin-bottom:0}#portfolio .cs-image-group{flex:1;position:relative}#portfolio .cs-image-group .cs-picture{border-radius:.5rem;display:block;overflow:hidden;position:relative;width:100%}#portfolio .cs-image-group .cs-picture img{border-radius:.5rem;box-shadow:0 20px 39px 0 rgba(0,0,0,.1);height:auto;-o-object-fit:cover;object-fit:cover;transition:transform .5s ease,box-shadow .3s ease;width:100%}#portfolio .cs-image-group .cs-picture .image-overlay{align-items:flex-end;background:linear-gradient(180deg,transparent 0,rgba(0,0,0,.7));border-radius:.5rem;color:#fff;cursor:pointer;display:flex;font-size:1.125rem;font-weight:600;height:100%;justify-content:center;left:0;opacity:0;padding:1.25rem;position:absolute;top:0;transition:opacity .3s ease;width:100%}#portfolio .cs-image-group .cs-picture:hover img{box-shadow:0 30px 50px 0 rgba(0,0,0,.15);transform:scale(1.05)}#portfolio .cs-image-group .cs-picture:hover .image-overlay{opacity:1}#portfolio .cs-button-solid{margin-top:clamp(2rem,5vw,3rem)}#portfolio .enhancements-section{background:linear-gradient(135deg,rgba(155,7,7,.05),rgba(155,7,7,.1));border-left:4px solid var(--primary);border-radius:.75rem;margin:clamp(4rem,8vw,6rem) 0 clamp(3rem,6vw,4rem);padding:clamp(2rem,4vw,3rem)}#portfolio .enhancements-section h3{color:var(--headerColor);font-size:clamp(1.5rem,2.5vw,1.875rem);font-weight:700;margin-bottom:1.5rem;text-align:left}#portfolio .enhancements-section .enhancements-list{display:flex;flex-direction:column;gap:1rem;list-style:none;margin:0;padding:0}#portfolio .enhancements-section .enhancements-list li{align-items:flex-start;display:flex;font-size:1rem;gap:.75rem;line-height:1.6;text-align:left}#portfolio .enhancements-section .enhancements-list .enhancement-icon{fill:var(--primary);flex-shrink:0;height:1.25rem;margin-top:.125rem;width:1.25rem}#portfolio .outcomes-section{margin:clamp(3rem,6vw,4rem) 0;text-align:center}#portfolio .outcomes-section h3{color:var(--headerColor);font-size:clamp(1.75rem,3vw,2.25rem);font-weight:700;margin-bottom:clamp(2rem,4vw,3rem)}#portfolio .metrics-grid{display:grid;gap:clamp(1rem,3vw,1.5rem);grid-template-columns:1fr}#portfolio .metric-card{animation:fadeInUp .6s ease forwards;background-color:#fff;border-radius:.75rem;box-shadow:0 20px 39px 0 rgba(0,0,0,.08);opacity:0;padding:clamp(1.5rem,3vw,2rem);text-align:center;transform:translateY(30px);transition:transform .3s ease,box-shadow .3s ease,background-color .3s ease}#portfolio .metric-card:first-child{animation-delay:.1s}#portfolio .metric-card:nth-child(2){animation-delay:.2s}#portfolio .metric-card:nth-child(3){animation-delay:.3s}#portfolio .metric-card:nth-child(4){animation-delay:.4s}#portfolio .metric-card:nth-child(5){animation-delay:.5s}#portfolio .metric-card:nth-child(6){animation-delay:.6s}#portfolio .metric-card:hover{background-color:var(--lightModeAccent);box-shadow:0 30px 60px 0 rgba(0,0,0,.15);transform:translateY(-8px)}#portfolio .metric-card:hover .metric-icon{fill:var(--primary);transform:scale(1.1) rotate(5deg)}#portfolio .metric-card .metric-icon{fill:var(--primary);height:clamp(2.5rem,5vw,3rem);margin:0 auto 1rem;opacity:.9;transition:transform .3s ease,fill .3s ease;width:clamp(2.5rem,5vw,3rem)}#portfolio .metric-card h4{color:var(--headerColor);font-size:clamp(1.125rem,2vw,1.375rem);font-weight:700;margin-bottom:.5rem}#portfolio .metric-card p{color:var(--bodyTextColor);font-size:.875rem;margin:0;opacity:.85}}@media only screen and (min-width:48rem){#portfolio .case-study-item{align-items:center;flex-direction:row;gap:clamp(2rem,5vw,4rem)}#portfolio .case-study-item .cs-content{order:1}#portfolio .case-study-item .cs-image-group{order:2}#portfolio .case-study-item.reverse .cs-content{order:2}#portfolio .case-study-item.reverse .cs-image-group{order:1}#portfolio .metrics-grid{grid-template-columns:repeat(2,1fr)}}@media only screen and (min-width:64rem){#portfolio .metrics-grid{grid-template-columns:repeat(3,1fr)}}@media only screen and (min-width:0rem){body.dark-mode #portfolio{background-color:var(--dark)}body.dark-mode #portfolio .cs-topper{color:var(--primaryLight)}body.dark-mode #portfolio .cs-title{color:var(--bodyTextColorWhite)}body.dark-mode #portfolio .case-study-item{background-color:var(--accent)}body.dark-mode #portfolio .case-study-item:hover{background-color:rgba(0,0,0,.5)}body.dark-mode #portfolio .cs-content .cs-text,body.dark-mode #portfolio .cs-content h3{color:var(--bodyTextColorWhite)}body.dark-mode #portfolio .cs-content .problem .label{background-color:rgba(155,7,7,.3);color:var(--primaryLight)}body.dark-mode #portfolio .cs-content .solution .label{background-color:rgba(46,204,113,.25);color:#2ecc71}body.dark-mode #portfolio .enhancements-section{background:linear-gradient(135deg,rgba(155,7,7,.15),rgba(155,7,7,.25))}body.dark-mode #portfolio .enhancements-section .enhancements-list li,body.dark-mode #portfolio .enhancements-section h3,body.dark-mode #portfolio .outcomes-section h3{color:var(--bodyTextColorWhite)}body.dark-mode #portfolio .metric-card{background-color:var(--accent)}body.dark-mode #portfolio .metric-card:hover{background-color:rgba(0,0,0,.5)}body.dark-mode #portfolio .metric-card h4,body.dark-mode #portfolio .metric-card p{color:var(--bodyTextColorWhite)}}.lightbox{align-items:center;animation:fadeIn .3s ease;background-color:rgba(0,0,0,.95);display:none;height:100%;justify-content:center;left:0;overflow:auto;padding:clamp(1rem,3vw,3rem);position:fixed;top:0;width:100%;z-index:9999}.lightbox-content{animation:zoomIn .3s ease;border-radius:.5rem;box-shadow:0 0 50px rgba(0,0,0,.8);display:block;height:auto;margin:auto;max-height:min(85vh,800px);max-width:min(90vw,1200px);-o-object-fit:contain;object-fit:contain;width:auto}.lightbox-close{color:#fff;cursor:pointer;font-size:clamp(32px,6vw,48px);font-weight:700;line-height:1;padding:.5rem;position:absolute;right:clamp(20px,4vw,40px);top:clamp(10px,2vw,20px);transition:color .3s ease,transform .3s ease;z-index:10000}.lightbox-close:hover{color:var(--primary);transform:scale(1.1) rotate(90deg)}.lightbox-caption{color:#fff;display:block;font-size:clamp(14px,2vw,16px);margin:1rem auto 0;max-width:700px;padding:.75rem;text-align:center;width:80%}@media only screen and (max-width:48rem){.lightbox{padding:1rem}.lightbox-content{max-height:80vh;max-width:95vw}.lightbox-close{font-size:36px;right:15px;top:10px}}@media only screen and (min-width:48rem) and (max-width:64rem){.lightbox-content{max-height:82vh;max-width:85vw}}@keyframes zoomIn{0%{opacity:0;transform:scale(.8)}to{opacity:1;transform:scale(1)}}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}body.dark-mode .lightbox-close:hover{color:var(--primaryLight)}