.portfolio-page{background-color:var(--color-background);min-height:100vh;color:var(--color-text-primary);font-family:var(--font-poppins),sans-serif;padding-bottom:80px}.portfolio-hero{text-align:center;background:radial-gradient(circle at top center,var(--color-primary-50)0%,transparent 70%);padding:120px 0 60px}[data-theme=dark] .portfolio-hero{background:radial-gradient(circle at top,#0ea5e91a 0%,#0000 70%)}.hero-eyebrow{font-family:var(--font-montserrat),sans-serif;color:var(--color-primary-600);background:var(--color-primary-50);border:1px solid var(--color-primary-100);border-radius:20px;margin-bottom:24px;padding:8px 16px;font-size:.9rem;font-weight:600;display:inline-block}[data-theme=dark] .hero-eyebrow{color:var(--color-primary-400);background:#0ea5e91a;border-color:#0ea5e933}.hero-headline{font-family:var(--font-montserrat),sans-serif;color:var(--color-text-primary);letter-spacing:-1px;margin-bottom:24px;font-size:clamp(2.5rem,5vw,4rem);font-weight:800;line-height:1.1}.hero-subtext{color:var(--color-text-secondary);max-width:600px;margin:0 auto 48px;font-size:1.125rem;line-height:1.6}.hero-trust-text{color:var(--color-text-tertiary);margin-top:12px;font-size:.95rem;font-weight:500;display:block}.filter-tabs-container{justify-content:center;margin-bottom:40px;padding:0 20px;display:flex;overflow-x:auto}.filter-tabs{background:var(--color-surface);border:1px solid var(--color-border-light);box-shadow:var(--shadow-sm);border-radius:50px;gap:4px;padding:6px;display:flex}.filter-tab{color:var(--color-text-secondary);cursor:pointer;white-space:nowrap;z-index:1;background:0 0;border:none;border-radius:40px;padding:10px 20px;font-size:.95rem;font-weight:500;transition:color .3s;position:relative}.filter-tab.active{color:var(--color-primary-700);font-weight:600}[data-theme=dark] .filter-tab.active{color:#fff}.active-indicator{background-color:var(--color-primary-100);z-index:-1;border-radius:40px;position:absolute;inset:0}[data-theme=dark] .active-indicator{background-color:var(--color-primary-600)}.portfolio-grid-section{padding:40px 0 80px;overflow:hidden}.projects-grid{scroll-behavior:smooth;-webkit-overflow-scrolling:touch;scrollbar-width:thin;scrollbar-color:var(--color-primary-200)transparent;gap:30px;margin:0 -20px;padding:20px 20px 40px;display:flex;overflow-x:auto}.projects-grid::-webkit-scrollbar{height:8px}.projects-grid::-webkit-scrollbar-track{background:0 0}.projects-grid::-webkit-scrollbar-thumb{background-color:var(--color-primary-200);border-radius:20px}[data-theme=dark] .projects-grid::-webkit-scrollbar-thumb{background-color:var(--color-primary-800)}.project-card{background:var(--color-surface);border:1px solid var(--color-border-light);cursor:pointer;border-radius:16px;flex-direction:column;flex:0 0 380px;transition:border-color .3s,box-shadow .3s,transform .3s;display:flex;overflow:hidden}@media (max-width:768px){.project-card{flex:0 0 300px}}.project-card:hover{border-color:var(--color-primary-300);box-shadow:var(--shadow-lg)}.card-in-house{border-color:var(--color-primary-200)}.card-in-house:hover{border-color:var(--color-primary-400);box-shadow:0 10px 30px #0ea5e926}[data-theme=dark] .card-in-house{border-color:#0ea5e933}.card-image-wrapper{justify-content:center;align-items:center;height:220px;display:flex;position:relative;overflow:hidden}.project-icon-placeholder{color:#fffc;filter:drop-shadow(0 4px 6px #0000001a)}.card-overlay{opacity:0;-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px);background:#0006;justify-content:center;align-items:center;width:100%;height:100%;transition:opacity .3s;display:flex;position:absolute;top:0;left:0}.project-card:hover .card-overlay{opacity:1}.view-case-study{color:#fff;align-items:center;gap:8px;font-size:1rem;font-weight:600;transition:transform .3s;display:flex;transform:translateY(10px)}.project-card:hover .view-case-study{transform:translateY(0)}.card-content{flex-direction:column;flex:1;padding:24px;display:flex}.card-header{justify-content:space-between;align-items:center;margin-bottom:12px;display:flex}.category-tag{text-transform:uppercase;letter-spacing:.5px;border-radius:4px;padding:4px 8px;font-size:.75rem;font-weight:700}.category-tag.client{background:var(--color-secondary-50);color:var(--color-secondary-700)}.category-tag.in-house{background:var(--color-primary-50);color:var(--color-primary-700);border:1px solid var(--color-primary-100)}[data-theme=dark] .category-tag.client{color:var(--color-secondary-300);background:#c026d31a}[data-theme=dark] .category-tag.in-house{color:var(--color-primary-300);background:#0ea5e91a;border-color:#0ea5e94d}.type-tag{color:var(--color-text-tertiary);font-size:.8rem;font-weight:500}.project-title{font-family:var(--font-montserrat),sans-serif;color:var(--color-text-primary);margin-bottom:8px;font-size:1.25rem;font-weight:700}.project-desc{color:var(--color-text-secondary);flex-grow:1;margin-bottom:20px;font-size:.95rem;line-height:1.5}.tech-stack{border-top:1px solid var(--color-border-light);gap:12px;padding-top:16px;display:flex}.tech-icon-small{color:var(--color-text-tertiary);font-size:1.1rem;transition:color .2s}.project-card:hover .tech-icon-small{color:var(--color-primary-600)}.grid-footer{text-align:center;margin-top:40px}.nda-disclaimer{color:var(--color-text-tertiary);background:var(--color-surface);border:1px solid var(--color-border-light);border-radius:20px;align-items:center;gap:8px;padding:8px 16px;font-size:.9rem;display:inline-flex}.inline-icon{color:var(--color-text-tertiary)}.technologies-section{background:var(--color-surface-alt);padding:60px 0;overflow:hidden}.tech-heading{text-align:center;font-family:var(--font-montserrat),sans-serif;text-transform:uppercase;letter-spacing:1px;color:var(--color-text-tertiary);margin-bottom:40px;font-size:.9rem}.tech-list{flex-wrap:wrap;justify-content:center;gap:40px;max-width:900px;margin:0 auto;display:flex}.tech-item{color:var(--color-text-secondary);flex-direction:column;align-items:center;gap:8px;font-size:2rem;transition:all .3s;display:flex}.tech-item span{opacity:0;font-size:.8rem;font-weight:500;transition:all .3s;transform:translateY(-5px)}.tech-item:hover{color:var(--color-primary-600);transform:translateY(-5px)}.tech-item:hover span{opacity:1;transform:translateY(0)}.portfolio-cta{padding:100px 0}.cta-card{background:var(--color-surface);border:1px solid var(--color-border-light);text-align:center;max-width:800px;box-shadow:var(--shadow-lg);border-radius:24px;margin:0 auto;padding:60px 40px;position:relative;overflow:hidden}.cta-card:before{content:"";background:linear-gradient(90deg,var(--color-primary-400),var(--color-secondary-400));width:100%;height:6px;position:absolute;top:0;left:0}.cta-card h2{font-family:var(--font-montserrat),sans-serif;color:var(--color-text-primary);margin-bottom:16px;font-size:2rem;font-weight:700}.cta-card p{color:var(--color-text-secondary);margin-bottom:32px;font-size:1.1rem}.cta-actions{flex-direction:column;align-items:center;gap:16px;display:flex}.cta-button-large{background:var(--color-primary-600);color:#fff;cursor:pointer;border:none;border-radius:50px;align-items:center;gap:12px;padding:16px 40px;font-size:1.1rem;font-weight:600;transition:all .3s;display:inline-flex;box-shadow:0 4px 14px #0ea5e966}.cta-button-large:hover{background:var(--color-primary-700);transform:translateY(-2px);box-shadow:0 6px 20px #0ea5e999}.cta-trust-text{color:var(--color-text-tertiary);font-size:.9rem;font-weight:500}.modal-overlay{-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);z-index:1000;background:#0009;justify-content:center;align-items:center;width:100%;height:100%;padding:20px;display:flex;position:fixed;top:0;left:0}.modal-content{background:var(--color-surface);width:100%;max-width:900px;max-height:90vh;box-shadow:var(--shadow-xl);border-radius:20px;position:relative;overflow-y:auto}.close-modal{color:#fff;cursor:pointer;z-index:10;background:#0003;border:none;border-radius:50%;justify-content:center;align-items:center;width:40px;height:40px;font-size:1.5rem;transition:background .3s;display:flex;position:absolute;top:20px;right:20px}.close-modal:hover{background:#0006}.modal-header{color:#fff;padding:60px 40px 40px;position:relative}.modal-badges{align-items:center;gap:12px;margin-bottom:12px;display:flex}.modal-category{text-transform:uppercase;opacity:.9;letter-spacing:1px;font-size:.8rem;font-weight:700}.modal-year{background:#fff3;border-radius:4px;padding:2px 8px;font-size:.8rem;font-weight:600}.modal-header h2{font-family:var(--font-montserrat),sans-serif;margin-bottom:16px;font-size:2.5rem;font-weight:800;line-height:1.1}.modal-role{opacity:.9;align-items:center;gap:8px;font-size:1rem;font-weight:500;display:flex}.modal-body{padding:40px}.modal-grid{grid-template-columns:2fr 1fr;gap:40px;display:grid}.modal-section{margin-bottom:32px}.modal-section h3{font-family:var(--font-montserrat),sans-serif;color:var(--color-text-primary);align-items:center;gap:8px;margin-bottom:12px;font-size:1.1rem;font-weight:700;display:flex}.modal-section p{color:var(--color-text-secondary);line-height:1.7}.technical-decisions{background:var(--color-surface-alt);border-left:4px solid var(--color-primary-500);border-radius:12px;padding:24px}.impact-section p{color:var(--color-text-primary);font-size:1.1rem;font-weight:600;line-height:1.5}.modal-tech-stack{flex-wrap:wrap;gap:12px;display:flex}.modal-tech-item{color:var(--color-primary-600);background:var(--color-primary-50);border:1px solid var(--color-primary-100);border-radius:12px;justify-content:center;align-items:center;width:48px;height:48px;font-size:1.5rem;display:flex}[data-theme=dark] .modal-tech-item{background:#0ea5e91a;border-color:#0ea5e933}.modal-actions{margin-top:24px}.primary-btn{background:var(--color-primary-600);color:#fff;cursor:pointer;border:none;border-radius:8px;justify-content:center;align-items:center;gap:8px;width:100%;padding:12px 24px;font-weight:600;transition:background .3s;display:inline-flex}.primary-btn:hover{background:var(--color-primary-700)}@media (max-width:900px){.modal-grid{grid-template-columns:1fr;gap:30px}.modal-sidebar{order:-1;grid-template-columns:1fr 1fr;gap:20px;display:grid}.impact-section,.modal-tech-stack{margin-bottom:0}}@media (max-width:768px){.filter-tabs-container{justify-content:flex-start}.modal-sidebar{grid-template-columns:1fr}.modal-header h2{font-size:1.8rem}}
