.law-list { display: flex; flex-direction: column; gap: 10px; }
.law-card {
    display: block; /* Clickable area */
    text-decoration: none;
    background: rgba(255, 255, 255, 0.1);
    padding: 16px;
    border-radius: 12px;
    border: 1px solid var(--border);
    transition: all 0.2s cubic-bezier(0.25, 0.46, 0.45, 0.94);
    position: relative;
    overflow: hidden;
}
.law-card:hover { transform: translateY(-2px); background: rgba(255, 255, 255, 0.2); box-shadow: 0 10px 20px rgba(0,0,0,0.05); }
.law-card:active { transform: scale(0.98); background: rgba(255, 255, 255, 0.15); }

.law-header { display: flex; justify-content: space-between; align-items: center; margin-bottom: 6px; }
.law-title { font-weight: 800; color: var(--text); font-size: 1rem; }
.law-arrow { font-size: 1rem; opacity: 0.3; transform: translateX(0); transition: transform 0.2s; }
.law-card:hover .law-arrow { transform: translateX(4px); opacity: 1; color: var(--primary); }

.law-desc { display: block; font-size: 0.85rem; opacity: 0.7; color: var(--text); line-height: 1.4; }
.law-number { 
    position: absolute; right: -10px; top: -10px; 
    font-size: 3rem; font-weight: 900; opacity: 0.05; 
    color: var(--text); pointer-events: none; 
}