.SzzWJq_pageContainer{padding:var(--space-8) 0 var(--space-20);background:radial-gradient(circle at 50% -10%, #1d4ed80d 0%, #f8fafc00 65%), var(--bg-canvas);min-height:85vh}.SzzWJq_breadcrumbNav{align-items:center;gap:var(--space-3);margin-bottom:var(--space-6);font-size:var(--text-sm);flex-wrap:wrap;display:flex}.SzzWJq_backLink{align-items:center;gap:var(--space-2);font-weight:var(--font-weight-medium);color:var(--text-secondary);transition:color var(--transition-fast);text-decoration:none;display:inline-flex}.SzzWJq_backLink:hover{color:var(--brand-primary)}.SzzWJq_arrowLeft{transition:transform var(--transition-fast)}.SzzWJq_backLink:hover .SzzWJq_arrowLeft{transform:translate(-3px)}.SzzWJq_breadcrumbDivider{color:var(--text-muted)}.SzzWJq_breadcrumbCategory{color:var(--brand-primary);font-weight:var(--font-weight-medium);text-decoration:none}.SzzWJq_breadcrumbCategory:hover{text-decoration:underline}@keyframes SzzWJq_caseStudyFadeIn{0%{opacity:0;transform:translateY(18px)}to{opacity:1;transform:translateY(0)}}.SzzWJq_caseStudyArticle{background:var(--bg-surface);border:1px solid var(--border-default);border-radius:var(--radius-2xl);padding:var(--space-10) var(--space-12);max-width:1040px;margin:0 auto;animation:.7s cubic-bezier(.16,1,.3,1) both SzzWJq_caseStudyFadeIn;box-shadow:0 4px 20px #0f172a0a}.SzzWJq_heroHeader{margin-bottom:var(--space-10);padding-bottom:var(--space-8);border-bottom:1px solid var(--border-subtle)}.SzzWJq_metaRow{justify-content:space-between;align-items:center;gap:var(--space-3);margin-bottom:var(--space-4);flex-wrap:wrap;display:flex}.SzzWJq_badgeGroup{align-items:center;gap:var(--space-3);flex-wrap:wrap;display:flex}.SzzWJq_badgeContent{align-items:center;gap:6px;display:inline-flex}.SzzWJq_liveStatusPill{font-family:var(--font-mono);font-size:.6875rem;font-weight:var(--font-weight-medium);letter-spacing:.02em;color:#059669;border-radius:var(--radius-xs);background:#05966914;border:1px solid #05966940;align-items:center;gap:6px;padding:3px 8px;display:inline-flex}.SzzWJq_pulseDot{background:#059669;border-radius:50%;width:7px;height:7px;box-shadow:0 0 6px #059669cc}.SzzWJq_contextPill{font-size:var(--text-xs);color:var(--text-muted);font-family:var(--font-mono);background:var(--bg-canvas-subtle);border-radius:var(--radius-sm);border:1px solid var(--border-subtle);padding:3px 10px}.SzzWJq_projectTitle{font-size:var(--text-3xl);font-weight:var(--font-weight-bold);color:var(--text-primary);line-height:var(--line-height-tight);margin-bottom:var(--space-4);letter-spacing:var(--letter-spacing-tight)}.SzzWJq_projectSummary{font-size:var(--text-lg);color:var(--text-secondary);line-height:var(--line-height-relaxed);margin-bottom:var(--space-6);max-width:860px}.SzzWJq_heroActions{align-items:center;gap:var(--space-4);margin-bottom:var(--space-8);flex-wrap:wrap;display:flex}.SzzWJq_liveSiteActionBtn{font-size:var(--text-sm);font-weight:var(--font-weight-semibold);color:#059669;border-radius:var(--radius-md);transition:all var(--transition-fast);background:#05966914;border:1px solid #05966940;align-items:center;gap:8px;padding:9px 16px;text-decoration:none;display:inline-flex}.SzzWJq_liveSiteActionBtn:hover{color:#fff;background:#059669;box-shadow:0 4px 12px #05966940}.SzzWJq_heroVisualFrame{border:1px solid var(--glass-border);border-radius:var(--radius-xl);background:#0f172a;overflow:hidden;box-shadow:0 10px 30px #0f172a14}.SzzWJq_browserHeaderBar{background:#0f172a;border-bottom:1px solid #ffffff14;align-items:center;gap:14px;height:36px;padding:0 14px;display:flex}.SzzWJq_browserControls{gap:6px;display:flex}.SzzWJq_browserDot{border-radius:50%;width:10px;height:10px}.SzzWJq_browserDot:first-child{background:#ef4444}.SzzWJq_browserDot:nth-child(2){background:#f59e0b}.SzzWJq_browserDot:nth-child(3){background:#10b981}.SzzWJq_browserUrl{font-family:var(--font-mono);color:#94a3b8;border-radius:var(--radius-sm);text-align:center;white-space:nowrap;text-overflow:ellipsis;background:#ffffff12;flex:1;padding:3px 12px;font-size:.6875rem;overflow:hidden}.SzzWJq_browserStatus{font-size:.625rem;font-weight:var(--font-weight-bold);color:#10b981;text-transform:uppercase;letter-spacing:.05em}.SzzWJq_heroImageContainer{aspect-ratio:16/10;background:#0b1120;width:100%;position:relative}.SzzWJq_heroImg{object-fit:cover;object-position:top center}.SzzWJq_quickMatrixSection{gap:var(--space-4);margin-bottom:var(--space-10);background:var(--bg-canvas-subtle);border:1px solid var(--border-subtle);border-radius:var(--radius-lg);padding:var(--space-4);grid-template-columns:repeat(4,1fr);display:grid}.SzzWJq_matrixCard{padding:var(--space-2) var(--space-3);border-right:1px solid var(--border-subtle);transition:background-color var(--transition-fast), transform var(--transition-fast);border-radius:var(--radius-sm);flex-direction:column;gap:4px;display:flex}.SzzWJq_matrixCard:hover{background:#ffffffd9;transform:translateY(-2px)}.SzzWJq_matrixCard:last-child{border-right:none}.SzzWJq_matrixLabel{font-size:.6875rem;font-weight:var(--font-weight-bold);text-transform:uppercase;letter-spacing:var(--letter-spacing-wide);color:var(--text-muted)}.SzzWJq_matrixValue{font-size:var(--text-xs);font-weight:var(--font-weight-semibold);color:var(--text-primary);line-height:var(--line-height-snug)}.SzzWJq_comparisonSection{margin-bottom:var(--space-10)}.SzzWJq_comparisonGrid{gap:var(--space-6);grid-template-columns:repeat(2,1fr);display:grid}.SzzWJq_problemCard,.SzzWJq_solutionCard{border-radius:var(--radius-xl);padding:var(--space-6);flex-direction:column;transition:transform .35s cubic-bezier(.16,1,.3,1),box-shadow .35s cubic-bezier(.16,1,.3,1),border-color .3s;display:flex}.SzzWJq_problemCard{background:#fef2f266;border:1px solid #ef44442e}.SzzWJq_problemCard:hover{border-color:#ef444459;transform:translateY(-4px);box-shadow:0 14px 28px -6px #ef44441f}.SzzWJq_solutionCard{background:#f0fdf480;border:1px solid #10b98138}.SzzWJq_solutionCard:hover{border-color:#10b98166;transform:translateY(-4px);box-shadow:0 14px 28px -6px #10b98124}.SzzWJq_cardHeader{align-items:center;gap:var(--space-3);margin-bottom:var(--space-3);display:flex}.SzzWJq_cardIconCircleProblem{border-radius:var(--radius-md);background:#ef44441a;justify-content:center;align-items:center;width:40px;height:40px;display:flex}.SzzWJq_problemIcon{color:#dc2626}.SzzWJq_cardIconCircleSolution{border-radius:var(--radius-md);background:#10b9811a;justify-content:center;align-items:center;width:40px;height:40px;display:flex}.SzzWJq_solutionIcon{color:#059669}.SzzWJq_cardEyebrow{font-size:.6875rem;font-weight:var(--font-weight-bold);text-transform:uppercase;letter-spacing:var(--letter-spacing-wide);color:var(--text-muted);display:block}.SzzWJq_cardTitle{font-size:var(--text-base);font-weight:var(--font-weight-bold);color:var(--text-primary)}.SzzWJq_cardBodyText{font-size:var(--text-sm);color:var(--text-secondary);line-height:var(--line-height-relaxed)}.SzzWJq_sectionBlock{margin-bottom:var(--space-12)}.SzzWJq_sectionHeaderRow{align-items:flex-start;gap:var(--space-3);margin-bottom:var(--space-6);display:flex}.SzzWJq_sectionIcon{color:var(--brand-primary);flex-shrink:0;margin-top:3px}.SzzWJq_sectionTitle{font-size:var(--text-xl);font-weight:var(--font-weight-bold);color:var(--text-primary);margin-bottom:var(--space-1);letter-spacing:var(--letter-spacing-tight)}.SzzWJq_sectionSubtitle{font-size:var(--text-sm);color:var(--text-secondary);line-height:var(--line-height-relaxed);max-width:780px}.SzzWJq_workflowGrid{gap:var(--space-4);grid-template-columns:repeat(4,1fr);display:grid}.SzzWJq_workflowCard{background:var(--bg-canvas-subtle);border:1px solid var(--border-subtle);border-radius:var(--radius-lg);padding:var(--space-5);flex-direction:column;transition:transform .35s cubic-bezier(.16,1,.3,1),box-shadow .35s cubic-bezier(.16,1,.3,1),border-color .3s;display:flex;position:relative}.SzzWJq_workflowCard:hover{border-color:#1d4ed866;transform:translateY(-4px);box-shadow:0 12px 24px -6px #0f172a14}.SzzWJq_stepBadge{font-family:var(--font-mono);font-size:.6875rem;font-weight:var(--font-weight-bold);color:var(--brand-primary);background:var(--brand-primary-subtle);border-radius:var(--radius-xs);margin-bottom:var(--space-3);width:fit-content;transition:transform var(--transition-fast);border:1px solid #1d4ed826;padding:2px 8px;display:inline-block}.SzzWJq_workflowCard:hover .SzzWJq_stepBadge{transform:scale(1.05)}.SzzWJq_stepTitle{font-size:var(--text-sm);font-weight:var(--font-weight-bold);color:var(--text-primary);margin-bottom:var(--space-2);line-height:var(--line-height-snug)}.SzzWJq_stepDesc{font-size:var(--text-xs);color:var(--text-secondary);line-height:var(--line-height-relaxed)}.SzzWJq_featuresGrid{gap:var(--space-5);grid-template-columns:repeat(2,1fr);display:grid}.SzzWJq_featureCard{background:var(--bg-canvas-subtle);border:1px solid var(--border-subtle);border-radius:var(--radius-lg);padding:var(--space-5);flex-direction:column;transition:transform .35s cubic-bezier(.16,1,.3,1),box-shadow .35s cubic-bezier(.16,1,.3,1),border-color .3s;display:flex}.SzzWJq_featureCard:hover{border-color:#1d4ed859;transform:translateY(-4px);box-shadow:0 12px 24px -6px #0f172a14}.SzzWJq_featureTitle{font-size:var(--text-base);font-weight:var(--font-weight-bold);color:var(--text-primary);margin-bottom:var(--space-2)}.SzzWJq_featureDesc{font-size:var(--text-sm);color:var(--text-secondary);line-height:var(--line-height-relaxed);margin-bottom:var(--space-4)}.SzzWJq_featureHighlightsList{border-top:1px dashed var(--border-subtle);padding:0;padding-top:var(--space-3);flex-direction:column;gap:6px;margin:auto 0 0;list-style:none;display:flex}.SzzWJq_featureHighlightItem{font-size:var(--text-xs);color:var(--text-secondary);align-items:flex-start;gap:8px;display:flex}.SzzWJq_checkIcon{color:#059669;flex-shrink:0;margin-top:1px}.SzzWJq_galleryGrid{gap:var(--space-6);grid-template-columns:repeat(2,1fr);display:grid}.SzzWJq_galleryFigure{background:var(--bg-canvas-subtle);border:1px solid var(--border-default);border-radius:var(--radius-lg);flex-direction:column;margin:0;transition:transform .35s cubic-bezier(.16,1,.3,1),box-shadow .35s cubic-bezier(.16,1,.3,1),border-color .3s;display:flex;overflow:hidden;box-shadow:0 4px 12px #0f172a08}.SzzWJq_galleryFigure:hover{border-color:#1d4ed859;transform:translateY(-4px);box-shadow:0 16px 32px -8px #0f172a1a,0 4px 12px -2px #1d4ed814}.SzzWJq_galleryImageContainer{aspect-ratio:16/10;cursor:pointer;background:#0f172a;width:100%;text-decoration:none;display:block;position:relative;overflow:hidden}.SzzWJq_galleryImg{object-fit:cover;object-position:center;transition:transform .6s cubic-bezier(.16,1,.3,1)}.SzzWJq_galleryImageContainer:hover .SzzWJq_galleryImg,.SzzWJq_galleryFigure:hover .SzzWJq_galleryImg{transform:scale(1.05)}.SzzWJq_galleryTypeTag{font-family:var(--font-mono);font-size:.625rem;font-weight:var(--font-weight-bold);text-transform:uppercase;letter-spacing:.05em;color:#fff;border-radius:var(--radius-xs);-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);z-index:2;background:#0f172ad9;border:1px solid #ffffff26;padding:3px 8px;position:absolute;top:10px;left:10px}.SzzWJq_zoomPrompt{font-family:var(--font-mono);font-size:.625rem;font-weight:var(--font-weight-medium);color:#94a3b8;border-radius:var(--radius-xs);-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);transition:all var(--transition-fast);z-index:2;background:#0f172ad9;border:1px solid #ffffff1f;align-items:center;gap:4px;padding:3px 8px;display:inline-flex;position:absolute;bottom:10px;right:10px}.SzzWJq_galleryImageContainer:hover .SzzWJq_zoomPrompt{color:#fff;background:#0f172af2;border-color:#ffffff59}.SzzWJq_galleryCaption{padding:var(--space-3) var(--space-4);font-size:var(--text-xs);color:var(--text-secondary);line-height:var(--line-height-normal);background:var(--bg-surface);border-top:1px solid var(--border-subtle)}.SzzWJq_techStackDetailedGrid{gap:var(--space-4);grid-template-columns:repeat(3,1fr);display:grid}.SzzWJq_techStackGroupCard{background:var(--bg-canvas-subtle);border:1px solid var(--border-subtle);border-radius:var(--radius-md);padding:var(--space-4)}.SzzWJq_techStackGroupTitle{font-size:.6875rem;font-weight:var(--font-weight-bold);text-transform:uppercase;letter-spacing:var(--letter-spacing-wide);color:var(--text-muted);margin-bottom:var(--space-3);border-bottom:1px solid var(--border-subtle);padding-bottom:var(--space-2)}.SzzWJq_techBadgeGroup{flex-wrap:wrap;gap:6px;display:flex}.SzzWJq_techBadge{font-family:var(--font-mono);font-size:var(--text-xs);background:var(--bg-surface);border:1px solid var(--border-default);border-radius:var(--radius-sm);color:var(--text-primary);padding:3px 8px}.SzzWJq_twoColumnSection{gap:var(--space-6);grid-template-columns:repeat(2,1fr);display:grid}.SzzWJq_evidenceColumn{background:var(--bg-canvas-subtle);border:1px solid var(--border-subtle);border-radius:var(--radius-lg);padding:var(--space-6)}.SzzWJq_columnHeader{align-items:center;gap:var(--space-2);margin-bottom:var(--space-4);border-bottom:1px solid var(--border-subtle);padding-bottom:var(--space-3);display:flex}.SzzWJq_columnIcon{color:var(--brand-primary)}.SzzWJq_columnTitle{font-size:var(--text-base);font-weight:var(--font-weight-bold);color:var(--text-primary)}.SzzWJq_evidenceList{gap:var(--space-3);flex-direction:column;margin:0;padding:0;list-style:none;display:flex}.SzzWJq_evidenceItem{font-size:var(--text-sm);color:var(--text-secondary);line-height:var(--line-height-normal);align-items:flex-start;gap:10px;display:flex}.SzzWJq_evidenceCheck{color:#059669;flex-shrink:0;margin-top:2px}.SzzWJq_limitationsBox{margin-bottom:var(--space-10);border:1px dashed var(--border-default);border-radius:var(--radius-lg);padding:var(--space-6);background:#f8fafce6}.SzzWJq_limitationsHeader{margin-bottom:var(--space-2);align-items:center;gap:8px;display:flex}.SzzWJq_limitationsIcon{color:var(--brand-accent)}.SzzWJq_limitationsTitle{font-size:var(--text-sm);font-weight:var(--font-weight-bold);color:var(--text-primary);text-transform:uppercase;letter-spacing:var(--letter-spacing-wide)}.SzzWJq_limitationsNotice{font-size:var(--text-xs);color:var(--text-muted);line-height:var(--line-height-relaxed);margin-bottom:var(--space-4)}.SzzWJq_limitationsList{padding-left:var(--space-5);flex-direction:column;gap:6px;margin:0;list-style:square;display:flex}.SzzWJq_limitationsItem{font-size:var(--text-xs);color:var(--text-secondary);line-height:var(--line-height-relaxed)}.SzzWJq_actionsCard{margin-top:var(--space-10);padding:var(--space-8);border:1px solid var(--border-default);border-radius:var(--radius-xl);justify-content:space-between;align-items:center;gap:var(--space-6);background:linear-gradient(#f1f5f9cc 0%,#ffffff80 100%);flex-wrap:wrap;display:flex}.SzzWJq_actionsText{gap:var(--space-1);flex-direction:column;max-width:580px;display:flex}.SzzWJq_actionsTitle{font-size:var(--text-lg);font-weight:var(--font-weight-bold);color:var(--text-primary)}.SzzWJq_actionsDesc{font-size:var(--text-sm);color:var(--text-secondary);line-height:var(--line-height-relaxed);margin:0}.SzzWJq_btnGroup{align-items:center;gap:var(--space-3);flex-wrap:wrap;display:flex}.SzzWJq_relatedSection{max-width:1040px;margin:var(--space-14) auto 0}.SzzWJq_relatedTitle{font-size:var(--text-2xl);font-weight:var(--font-weight-bold);color:var(--text-primary);margin-bottom:var(--space-6);letter-spacing:var(--letter-spacing-tight)}.SzzWJq_relatedGrid{gap:var(--space-6);grid-template-columns:repeat(2,1fr);display:grid}.SzzWJq_relatedCard{background:var(--bg-surface);border:1px solid var(--border-default);border-radius:var(--radius-xl);transition:transform var(--transition-fast), box-shadow var(--transition-fast);flex-direction:column;display:flex;overflow:hidden;box-shadow:0 4px 16px #0f172a08}.SzzWJq_relatedCard:hover{border-color:#1d4ed84d;transform:translateY(-3px);box-shadow:0 10px 25px #0f172a14}.SzzWJq_relatedImageLink{aspect-ratio:16/9;background:#0f172a;width:100%;position:relative}.SzzWJq_relatedImg{object-fit:cover;object-position:top center}.SzzWJq_relatedBody{padding:var(--space-5);flex-direction:column;flex:1;display:flex}.SzzWJq_relatedCategory{font-size:.6875rem;font-weight:var(--font-weight-bold);text-transform:uppercase;letter-spacing:var(--letter-spacing-wide);color:var(--brand-primary);margin-bottom:var(--space-1)}.SzzWJq_relatedProjectTitle{font-size:var(--text-base);font-weight:var(--font-weight-bold);margin-bottom:var(--space-2)}.SzzWJq_relatedTitleLink{color:var(--text-primary);text-decoration:none}.SzzWJq_relatedTitleLink:hover{color:var(--brand-primary)}.SzzWJq_relatedSummary{font-size:var(--text-xs);color:var(--text-secondary);line-height:var(--line-height-relaxed);margin-bottom:var(--space-4);-webkit-line-clamp:2;-webkit-box-orient:vertical;display:-webkit-box;overflow:hidden}.SzzWJq_relatedActionLink{font-size:var(--text-xs);font-weight:var(--font-weight-semibold);color:var(--brand-primary);align-items:center;gap:6px;margin-top:auto;text-decoration:none;display:inline-flex}.SzzWJq_relatedActionLink:hover{text-decoration:underline}@media (max-width:1024px){.SzzWJq_caseStudyArticle{padding:var(--space-8)}.SzzWJq_quickMatrixSection{grid-template-columns:repeat(2,1fr)}.SzzWJq_matrixCard:nth-child(2){border-right:none}.SzzWJq_workflowGrid,.SzzWJq_techStackDetailedGrid{grid-template-columns:repeat(2,1fr)}}@media (max-width:768px){.SzzWJq_caseStudyArticle{padding:var(--space-6) var(--space-4)}.SzzWJq_projectTitle{font-size:var(--text-2xl)}.SzzWJq_projectSummary{font-size:var(--text-base)}.SzzWJq_quickMatrixSection{grid-template-columns:1fr}.SzzWJq_matrixCard{border-right:none;border-bottom:1px solid var(--border-subtle)}.SzzWJq_matrixCard:last-child{border-bottom:none}.SzzWJq_comparisonGrid,.SzzWJq_workflowGrid,.SzzWJq_featuresGrid,.SzzWJq_galleryGrid,.SzzWJq_techStackDetailedGrid,.SzzWJq_twoColumnSection,.SzzWJq_relatedGrid{grid-template-columns:1fr}.SzzWJq_actionsCard{flex-direction:column;align-items:stretch}.SzzWJq_btnGroup{flex-direction:column;width:100%}.SzzWJq_btnGroup a,.SzzWJq_btnGroup button{justify-content:center;width:100%}}
