/* case/index.html styles */

.categories-section{padding:2.5rem 1rem}
.categories-section h2{text-align:center;font-size:1.2rem;margin-bottom:1.5rem}
.category-list{display:flex;flex-direction:column;gap:0;max-width:600px;margin:0 auto}
.category-row{display:flex;justify-content:space-between;align-items:center;padding:1rem;border-bottom:1px solid var(--border);text-decoration:none;color:var(--text-primary);transition:background 0.2s}
.category-row:hover{background:var(--bg-section)}
.category-row.disabled{color:var(--text-muted);cursor:default}
.category-row.disabled:hover{background:transparent}
.cat-name{font-weight:500}
.cat-count{color:var(--primary);font-weight:600;font-size:0.9rem}
.cat-badge{font-size:0.75rem;color:var(--text-muted);background:var(--bg-section);padding:0.25rem 0.5rem;border-radius:4px}

.recent-section{padding:2.5rem 1rem;background:var(--bg-section)}
.recent-section h2{text-align:center;font-size:1.2rem;margin-bottom:1.5rem}
.photo-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:0.75rem;max-width:900px;margin:0 auto}
.photo-item{position:relative;border-radius:8px;overflow:hidden;aspect-ratio:1}
.photo-item img{width:100%;height:100%;object-fit:cover}
.photo-area{position:absolute;bottom:0.5rem;left:0.5rem;background:rgba(0,0,0,0.7);color:#fff;padding:0.25rem 0.5rem;border-radius:4px;font-size:0.7rem}

.cta-section{background:var(--primary);padding:3rem 1.5rem;text-align:center}
.cta-section h2{color:#1c1917;font-size:1.3rem;margin-bottom:0.5rem}
.cta-section p{color:#1c1917;opacity:0.8;margin-bottom:1.5rem}
.cta-buttons{display:flex;gap:0.75rem;justify-content:center;flex-wrap:wrap}
.cta-buttons .btn{padding:0.875rem 1.5rem;border-radius:8px;font-weight:600;text-decoration:none;font-size:0.9rem}



@media (min-width:640px){.photo-grid{grid-template-columns:repeat(3,1fr)}}
@media (prefers-color-scheme:dark){
.category-row{border-color:var(--border)}
.category-row:hover{background:var(--bg-elevated)}
.cat-badge{background:var(--bg-elevated)}
.recent-section{background:var(--bg-dark-soft)}
}


/* case/general styles */






.cases-section{padding:2rem 1rem}
.cases-list{display:flex;flex-direction:column;gap:1rem;max-width:800px;margin:0 auto}
.case-item{display:flex;gap:1rem;padding:1rem;background:var(--bg-card);border:1px solid var(--border);border-radius:8px;text-decoration:none;color:var(--text-primary);transition:box-shadow 0.2s,transform 0.2s}
.case-item:hover{box-shadow:0 4px 12px rgba(0,0,0,0.15);transform:translateY(-2px)}
.case-item img{width:100px;height:75px;object-fit:cover;border-radius:6px;flex-shrink:0}
.case-info{flex:1;min-width:0}
.case-badge-sm{display:inline-block;font-size:0.7rem;background:var(--primary);color:#fff;padding:0.15rem 0.4rem;border-radius:3px;margin-bottom:0.25rem}
.case-info h3{font-size:0.95rem;margin:0 0 0.25rem;line-height:1.3}
.case-meta-sm{font-size:0.75rem;color:var(--text-muted)}

.pagination{display:flex;justify-content:center;gap:0.5rem;margin-top:1.5rem}
.pagination button{padding:0.5rem 1rem;border:1px solid var(--border);background:var(--bg-card);border-radius:4px;cursor:pointer;font-size:0.9rem;color:var(--text-primary)}
.pagination button.active{background:var(--primary);color:#fff;border-color:var(--primary)}
.pagination button:hover:not(.active){background:var(--bg-section)}

.cta-section{background:var(--primary);padding:3rem 1.5rem;text-align:center}
.cta-section h2{color:#1c1917;font-size:1.3rem;margin-bottom:0.5rem}
.cta-section p{color:#1c1917;opacity:0.8;margin-bottom:1.5rem}
.cta-buttons{display:flex;gap:0.75rem;justify-content:center;flex-wrap:wrap}
.cta-buttons .btn{padding:0.875rem 1.5rem;border-radius:8px;font-weight:600;text-decoration:none;font-size:0.9rem}


.cta-note{font-size:0.8rem;color:#1c1917;opacity:0.7;margin-top:1rem}

.back-section{padding:2rem 1rem;text-align:center}
.back-link{color:var(--primary);text-decoration:none;font-size:0.9rem}
.back-link:hover{text-decoration:underline}

@media (prefers-color-scheme:dark){
.case-item{background:var(--bg-elevated);border-color:var(--border)}
.pagination button{background:var(--bg-elevated);border-color:var(--border)}
.pagination button:hover:not(.active){background:var(--bg-dark-soft)}
}



/* case/ebike styles */

.cases-list{display:flex;flex-direction:column;gap:1rem}
.case-item{display:flex;gap:1rem;padding:1rem;background:#fff;border-radius:8px;box-shadow:0 1px 3px rgba(0,0,0,.1);text-decoration:none;color:var(--text-primary);transition:box-shadow .2s}
.case-item:hover{box-shadow:0 4px 12px rgba(0,0,0,.15)}
.case-item img{width:100px;height:75px;object-fit:cover;border-radius:6px;flex-shrink:0}
.case-info{flex:1;min-width:0}
.case-badge-sm{display:inline-block;font-size:.7rem;background:#d97706;color:#fff;padding:.15rem .4rem;border-radius:3px;margin-bottom:.25rem}
.case-info h3{font-size:.95rem;margin:0 0 .25rem;line-height:1.3}
.case-meta-sm{font-size:.75rem;color:var(--text-muted)}
.pagination{display:flex;justify-content:center;gap:.5rem;margin-top:1.5rem}
.pagination button{padding:.5rem 1rem;border:1px solid #ddd;background:#fff;border-radius:4px;cursor:pointer;font-size:.9rem}
.pagination button.active{background:#d97706;color:#fff;border-color:var(--primary)}
.pagination button:hover:not(.active){background:var(--bg-section)}
.brands-text{font-size:.85rem;color:var(--text-muted);margin-top:.5rem}
@media (prefers-color-scheme:dark){.case-item{background:var(--bg-dark-soft);color:var(--text-primary)}.case-meta-sm{color:var(--text-muted)}.pagination button{background:var(--bg-dark-soft);border-color:var(--border);color:var(--text-primary)}.pagination button:hover:not(.active){background:var(--bg-elevated)}}