/* Case detail content styles — shared by server-rendered /case/:slug pages.
   Relies on tokens + nav/footer/buttons from style.css (link it first). */
.case-main{max-width:1120px;margin:0 auto;padding:calc(var(--nav-h) + 2.5rem) clamp(1.5rem,4vw,3rem) 4rem}

.breadcrumb{display:flex;align-items:center;gap:8px;font-size:.8rem;color:var(--navy-500);margin-bottom:24px;flex-wrap:wrap}
.breadcrumb a{color:var(--navy-500);text-decoration:none;transition:color .3s}
.breadcrumb a:hover{color:var(--orange)}
.breadcrumb .sep{color:var(--slate-400)}

.case-hero{background:var(--navy-900);border-radius:var(--radius-lg);overflow:hidden;margin-bottom:32px}
.case-hero-img{aspect-ratio:21/9;position:relative;overflow:hidden;background:var(--navy-800)}
.case-hero-img img{width:100%;height:100%;object-fit:cover}
.case-hero-overlay{position:absolute;inset:0;background:linear-gradient(to top,rgba(22,29,38,.86) 0%,rgba(22,29,38,.3) 50%,transparent 100%);display:flex;align-items:flex-end;padding:40px}
.case-hero-info{max-width:720px}
.case-status{display:inline-flex;align-items:center;gap:6px;padding:4px 12px;border-radius:100px;font-size:.72rem;font-weight:700;letter-spacing:.04em;margin-bottom:12px}
.case-status.completed{background:rgba(34,197,94,.15);color:#4ade80;border:1px solid rgba(34,197,94,.2)}
.case-status.in-progress{background:rgba(59,130,246,.15);color:#60a5fa;border:1px solid rgba(59,130,246,.2)}
.case-hero-info h1{font-family:var(--font-display);font-weight:800;font-size:clamp(1.6rem,3vw,2.4rem);color:#fff;margin-bottom:8px;letter-spacing:-.02em}
.case-hero-info .sub{color:var(--slate-300);font-size:.9rem}

.case-grid{display:grid;grid-template-columns:1fr 360px;gap:24px;align-items:start}
.case-section{background:#fff;border-radius:var(--radius-lg);border:1px solid var(--slate-200);margin-bottom:20px;overflow:hidden}
.case-section-header{padding:22px 28px;border-bottom:1px solid var(--slate-100)}
.case-section-header h2{font-family:var(--font-display);font-weight:700;font-size:1.05rem;color:var(--navy-900);letter-spacing:-.01em}
.case-section-body{padding:22px 28px;color:var(--navy-700);font-size:.92rem;line-height:1.8}

.gallery-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:12px;padding:0 28px 24px}
.gallery-grid img{width:100%;aspect-ratio:16/10;object-fit:cover;border-radius:var(--radius);cursor:pointer;transition:transform .3s var(--ease)}
.gallery-grid img:hover{transform:scale(1.03)}

.highlight-list{list-style:none;display:flex;flex-direction:column;gap:10px}
.highlight-list li{display:flex;align-items:center;gap:10px;font-size:.92rem;color:var(--navy-700)}
.highlight-list li::before{content:'';width:6px;height:6px;background:var(--orange);border-radius:50%;flex-shrink:0}

.case-sidebar{display:flex;flex-direction:column;gap:20px;position:sticky;top:calc(var(--nav-h) + 1rem)}
.info-card{background:#fff;border-radius:var(--radius-lg);border:1px solid var(--slate-200);overflow:hidden}
.info-card-title{padding:16px 20px;border-bottom:1px solid var(--slate-100);font-family:var(--font-display);font-weight:700;font-size:.9rem;color:var(--navy-900)}
.info-card-body{padding:16px 20px}
.info-row{display:flex;justify-content:space-between;align-items:center;padding:9px 0;border-bottom:1px solid var(--slate-100);font-size:.85rem}
.info-row:last-child{border-bottom:none}
.info-row .label{color:var(--navy-500);font-weight:500}
.info-row .value{color:var(--navy-800);font-weight:600;text-align:right}

.tag{display:inline-flex;align-items:center;padding:4px 10px;border-radius:var(--radius);font-size:.72rem;font-weight:600}
.tag.area{background:#eff6ff;color:#2563eb}
.tag.type{background:var(--orange-50);color:var(--orange)}
.tag.region{background:#eef7f0;color:#16a34a}

.cta-card{background:linear-gradient(135deg,var(--navy-900),var(--navy-800));border-radius:var(--radius-lg);padding:24px;color:#fff}
.cta-card h3{font-family:var(--font-display);font-weight:700;font-size:1rem;margin-bottom:8px;color:#fff}
.cta-card p{font-size:.82rem;color:var(--slate-300);margin-bottom:16px;line-height:1.6}
.cta-card .btn{display:inline-flex;align-items:center;gap:6px;padding:11px 24px;background:var(--orange);color:#fff;border:none;border-radius:var(--radius);font-weight:700;font-size:.85rem;cursor:pointer;text-decoration:none;transition:all .3s}
.cta-card .btn:hover{background:var(--orange-dark)}

.lightbox{position:fixed;inset:0;z-index:2000;background:rgba(22,29,38,.95);display:none;align-items:center;justify-content:center;cursor:pointer}
.lightbox.open{display:flex}
.lightbox img{max-width:90vw;max-height:85vh;border-radius:var(--radius)}
.lightbox-close{position:absolute;top:24px;right:24px;width:40px;height:40px;border-radius:50%;background:rgba(255,255,255,.12);border:none;color:#fff;font-size:1.2rem;cursor:pointer}
.lightbox-nav{position:absolute;top:50%;transform:translateY(-50%);width:44px;height:44px;border-radius:50%;background:rgba(255,255,255,.1);border:none;color:#fff;font-size:1.3rem;cursor:pointer}
.lightbox-nav.prev{left:24px}.lightbox-nav.next{right:24px}

@media(max-width:900px){.case-grid{grid-template-columns:1fr}.case-sidebar{order:-1;position:static}}
@media(max-width:540px){.case-hero-overlay{padding:24px}.gallery-grid{grid-template-columns:1fr 1fr}}