.portfolio-page{min-height:100vh}.portfolio-hero{position:relative;padding:160px 0 100px;overflow:hidden}.portfolio-hero-bg{position:absolute;inset:0;z-index:0}.portfolio-hero-gradient{position:absolute;inset:0;background:var(--gradient-primary);opacity:.95}.portfolio-hero-pattern{position:absolute;inset:0;background-image:url("data:image/svg+xml,%3Csvg width='60' height='60' viewBox='0 0 60 60' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M30 5c0 5.523-4.477 10-10 10h-5v10h-5c-5.523 0-10 4.477-10 10s4.477 10 10 10h5v10h5c5.523 0 10-4.477 10-10s4.477-10 10-10h5V25h5c5.523 0 10-4.477 10-10s-4.477-10-10-10h-5V-5h-5c-5.523 0-10 4.477-10 10z' fill='%23ffffff' fill-opacity='0.05' fill-rule='evenodd'/%3E%3C/svg%3E")}.portfolio-hero-content{position:relative;z-index:1;text-align:center;max-width:800px;margin:0 auto}.portfolio-badge{display:inline-flex;align-items:center;gap:8px;padding:8px 20px;background:#ffffff26;backdrop-filter:blur(10px);border-radius:50px;font-size:.875rem;font-weight:600;color:var(--white);margin-bottom:24px}.portfolio-hero-content h1{color:var(--white);margin-bottom:24px}.portfolio-hero-content p{color:#ffffffe6;font-size:1.125rem;line-height:1.8}.featured-projects-section{padding:100px 0}.featured-projects-grid{display:grid;grid-template-columns:1fr;gap:60px;margin-top:60px}.featured-project-card{display:grid;grid-template-columns:1fr 1fr;gap:48px;background:var(--white);border-radius:var(--border-radius-lg);overflow:hidden;box-shadow:var(--shadow-md);transition:all var(--transition-base)}.featured-project-card:hover{transform:translateY(-4px);box-shadow:var(--shadow-lg)}.featured-project-image{position:relative;overflow:hidden}.featured-project-image img{width:100%;height:100%;object-fit:cover}.featured-badge{position:absolute;top:24px;right:24px;padding:8px 16px;background:var(--ocean-blue);color:var(--white);border-radius:50px;font-size:.875rem;font-weight:600}.featured-project-content{padding:48px;display:flex;flex-direction:column;gap:24px}.project-meta{display:flex;gap:16px;flex-wrap:wrap}.project-category,.project-industry{display:inline-flex;align-items:center;gap:6px;padding:6px 12px;background:var(--ocean-blue-light);color:var(--primary-blue);border-radius:20px;font-size:.875rem;font-weight:500}.featured-project-content h3{font-size:2rem;margin:0}.project-client{color:var(--ocean-blue);font-weight:600;margin:0}.project-description{color:var(--text-grey);line-height:1.8;margin:0}.project-technologies{margin-top:8px}.project-technologies strong{display:block;margin-bottom:12px;color:var(--primary-blue)}.tech-tags{display:flex;flex-wrap:wrap;gap:8px}.tech-tag{padding:6px 12px;background:var(--bg-grey-light);color:var(--primary-blue);border-radius:20px;font-size:.875rem;font-weight:500}.project-results{margin-top:8px}.project-results strong{display:block;margin-bottom:12px;color:var(--primary-blue)}.project-results ul{list-style:none;padding:0;margin:0;display:flex;flex-direction:column;gap:8px}.project-results li{display:flex;align-items:center;gap:8px;color:var(--text-grey)}.project-results li:before{content:"✓";color:var(--ocean-blue);font-weight:700}.all-projects-section{padding:100px 0}.projects-header{margin-bottom:48px}.portfolio-filters{display:flex;align-items:center;gap:16px;flex-wrap:wrap;margin-top:32px}.filter-btn{display:inline-flex;align-items:center;gap:8px;padding:10px 20px;background:var(--white);color:var(--text-grey);border:2px solid transparent;border-radius:50px;font-size:.9375rem;font-weight:500;cursor:pointer;transition:all var(--transition-fast)}.filter-btn:hover{color:var(--primary-blue);border-color:var(--ocean-blue-light)}.filter-btn.active{background:var(--gradient-primary);color:var(--white);border-color:transparent}.projects-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:32px;margin-top:48px}.project-card{background:var(--white);border-radius:var(--border-radius-lg);overflow:hidden;box-shadow:var(--shadow-sm);transition:all var(--transition-base)}.project-card:hover{transform:translateY(-4px);box-shadow:var(--shadow-md)}.project-image{position:relative;width:100%;height:240px;overflow:hidden}.project-image img{width:100%;height:100%;object-fit:cover;transition:transform var(--transition-base)}.project-card:hover .project-image img{transform:scale(1.05)}.project-featured-badge{position:absolute;top:12px;right:12px;padding:4px 12px;background:var(--ocean-blue);color:var(--white);border-radius:20px;font-size:.75rem;font-weight:600}.project-content{padding:24px}.project-meta-small{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:12px}.project-category-small,.project-industry-small{display:inline-flex;align-items:center;gap:4px;padding:4px 10px;background:var(--ocean-blue-light);color:var(--primary-blue);border-radius:16px;font-size:.75rem;font-weight:500}.project-content h3{font-size:1.25rem;margin:0 0 8px}.project-client-small{color:var(--ocean-blue);font-size:.875rem;font-weight:600;margin:0 0 12px}.project-description-small{color:var(--text-grey);font-size:.9375rem;line-height:1.6;margin:0 0 16px;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}.project-technologies-small{display:flex;flex-wrap:wrap;gap:6px}.tech-tag-small{padding:4px 10px;background:var(--bg-grey-light);color:var(--primary-blue);border-radius:16px;font-size:.75rem;font-weight:500}.portfolio-cta{padding:100px 0;background:var(--gradient-primary);color:var(--white);text-align:center}.portfolio-cta-content{max-width:700px;margin:0 auto}.portfolio-cta-content h2{color:var(--white);margin-bottom:24px}.portfolio-cta-content p{color:#ffffffe6;font-size:1.125rem;margin-bottom:40px}.portfolio-cta-actions{display:flex;gap:16px;justify-content:center;flex-wrap:wrap}@media(max-width:1024px){.featured-project-card{grid-template-columns:1fr}.projects-grid{grid-template-columns:repeat(2,1fr)}}@media(max-width:768px){.portfolio-hero{padding:80px 0 48px}.featured-projects-section,.all-projects-section{padding:60px 0}.featured-project-content{padding:32px}.projects-grid{grid-template-columns:1fr}.portfolio-filters{justify-content:center}.portfolio-cta-actions{flex-direction:column}.portfolio-cta-actions .btn{width:100%}}@media(max-width:480px){.portfolio-hero{padding:60px 0 36px}}
