.case-study{padding:5rem 0}.back-link{display:inline-block;font-size:.875rem;color:var(--color-text-muted);margin-bottom:2.5rem;text-decoration:none;transition:color .2s ease}.back-link:hover{color:var(--color-text)}.cs-header{margin-bottom:3.5rem;max-width:760px}.cs-header h1{margin-bottom:1rem}.cs-subtitle{font-size:1.1875rem;color:var(--color-text-muted);line-height:1.6;margin-bottom:1.5rem}.cs-tags{display:flex;flex-wrap:wrap;gap:.5rem}.cs-tag{font-family:var(--font-mono);font-size:.75rem;padding:.3rem .7rem;background:var(--color-bg-elevated);border:1px solid var(--color-border);border-radius:6px;color:var(--color-text-muted)}.cs-body{max-width:760px}.cs-body h2{font-size:1.5rem;margin-top:3rem;margin-bottom:1rem;padding-top:2rem;border-top:1px solid var(--color-border)}.cs-body h2:first-child{border-top:none;padding-top:0;margin-top:0}.cs-body h3{font-size:1.125rem;margin-top:2rem;margin-bottom:.75rem;color:var(--color-accent)}.cs-body p{color:var(--color-text-muted);font-size:1rem;line-height:1.8;margin-bottom:1rem}.cs-body ul{list-style:none;padding:0;margin-bottom:1.25rem;display:flex;flex-direction:column;gap:.5rem}.cs-body ul li{color:var(--color-text-muted);font-size:1rem;line-height:1.6;padding-left:1.25rem;position:relative}.cs-body ul li:before{content:"—";position:absolute;left:0;color:var(--color-border)}.cs-body .arch-flow{font-family:var(--font-mono);font-size:.875rem;color:var(--color-accent);background:var(--color-bg-elevated);border:1px solid var(--color-border);border-radius:8px;padding:1.25rem 1.5rem;margin:1.5rem 0;line-height:1.8;overflow-x:auto}.cs-notice{margin-top:3.5rem;padding:1.25rem 1.5rem;background:var(--color-bg-elevated);border:1px solid var(--color-border);border-radius:8px;max-width:760px}.cs-notice p{font-size:.8125rem;color:var(--color-text-muted);line-height:1.7;margin:0}.arch-diagram{display:flex;flex-direction:column;align-items:center;margin:2rem 0 1rem;padding:2.5rem 2rem;background:var(--color-bg-elevated);border:1px solid var(--color-border);border-radius:12px;overflow-x:auto}.arch-layer{display:flex;justify-content:center;gap:1rem;width:100%;max-width:520px}.arch-layer--top{max-width:400px}.arch-layer--split{max-width:520px}.arch-box{flex:1;text-align:center;font-family:var(--font-mono);font-size:.8125rem;color:var(--color-text);padding:.75rem 1rem;background:var(--color-bg);border:1px solid var(--color-border);border-radius:8px;line-height:1.4}.arch-box--wide{max-width:360px;width:100%}.arch-box--full{max-width:520px;width:100%;padding:1rem 1.25rem 1.25rem}.arch-sub{display:block;font-size:.6875rem;color:var(--color-text-muted);margin-top:.125rem}.arch-box-title{display:block;font-size:.8125rem;color:var(--color-accent);margin-bottom:.75rem}.arch-grid-2x2{display:grid;grid-template-columns:1fr 1fr;gap:.5rem}.arch-inner-box{font-family:var(--font-mono);font-size:.75rem;color:var(--color-text-muted);padding:.5rem .625rem;background:var(--color-bg-card);border:1px solid var(--color-border);border-radius:6px;text-align:center}.arch-connector{width:1px;height:1.25rem;background:var(--color-border)}.arch-connector--split{width:40%;height:0;border-top:1px solid var(--color-border);margin:1rem 0}.arch-inner-row{display:flex;gap:.5rem;justify-content:center}.arch-inner-row .arch-inner-box{flex:1;max-width:140px}.arch-box--compact{flex:none;font-family:var(--font-mono);font-size:.75rem;color:var(--color-text-muted);padding:.5rem .75rem;background:var(--color-bg);border:1px solid var(--color-border);border-radius:6px;text-align:center;white-space:nowrap}.arch-base-group{width:100%;max-width:520px;margin-top:1.5rem;padding-top:1.5rem;border-top:2px solid var(--color-border)}.arch-base-label{font-family:var(--font-mono);font-size:.75rem;letter-spacing:.05em;text-transform:uppercase;color:var(--color-accent);text-align:center;margin-bottom:1rem}.arch-base-flow{display:flex;align-items:center;justify-content:center;gap:.625rem;flex-wrap:wrap}.arch-base-arrow{font-family:var(--font-mono);font-size:.875rem;color:var(--color-border)}.arch-layer--split-3{max-width:520px;gap:.75rem}.arch-layer--split-3 .arch-box{font-size:.75rem;padding:.625rem .5rem}.arch-base{width:100%;max-width:520px;text-align:center;font-family:var(--font-mono);font-size:.75rem;letter-spacing:.05em;text-transform:uppercase;color:var(--color-accent);padding:.75rem 1rem;margin-top:1.25rem;border-top:2px solid var(--color-border);border-bottom:2px solid var(--color-border)}@media(max-width:768px){.case-study{padding:3rem 0}.cs-body h2{font-size:1.25rem;margin-top:2rem;padding-top:1.5rem}.arch-diagram{padding:1.5rem 1rem}.arch-layer--split,.arch-layer--split-3{flex-direction:column;align-items:center}.arch-layer--split .arch-box,.arch-layer--split-3 .arch-box{width:100%;max-width:260px}.arch-connector--split{width:1px;height:1.25rem;border-top:none;border-left:1px solid var(--color-border);margin:0}}
