@media only screen and (min-width: 0rem) {#projects-index {padding: var(--sectionPadding);}#projects-index .cs-container {width: 100%;max-width: 80rem;margin: auto;display: flex;flex-direction: column;gap: 3.75rem;}.projects-category-group {display: flex;flex-direction: column;gap: 2rem;}.projects-category-header {display: flex;align-items: center;justify-content: space-between;flex-wrap: wrap;gap: 0.75rem;padding-bottom: 1rem;border-bottom: 2px solid var(--primary);}.projects-category-header .cs-title {margin: 0;font-size: clamp(1.5rem, 3vw, 2rem);}.cs-card-group {margin: 0;padding: 0;width: 100%;display: grid;grid-template-columns: 1fr;gap: 1.5rem;list-style: none;}.cs-item {list-style: none;border-radius: 0.5rem;overflow: hidden;box-shadow: 0px 4px 24px rgba(26, 26, 26, 0.08);background-color: #fff;transition: transform 0.3s, box-shadow 0.3s;}.cs-item:hover {transform: translateY(-0.25rem);box-shadow: 0px 12px 40px rgba(26, 26, 26, 0.14);}.cs-link {text-decoration: none;display: flex;flex-direction: column;height: 100%;}.cs-picture {position: relative;display: block;width: 100%;height: 13.75rem;overflow: hidden;flex-shrink: 0;}.cs-picture img {position: absolute;top: 0;left: 0;width: 100%;height: 100%;object-fit: cover;transition: transform 0.5s;}.cs-item:hover .cs-picture img {transform: scale(1.04);}.cs-flex {padding: 1.5rem;display: flex;flex-direction: column;flex: 1;}.cs-date {display: inline-flex;align-items: center;gap: 0.375rem;font-size: 0.8125rem;font-weight: 700;text-transform: uppercase;letter-spacing: 0.06em;color: var(--primary);margin-bottom: 0.5rem;}.cs-date:before {content: "";display: inline-block;width: 1rem;height: 2px;background-color: var(--primary);flex-shrink: 0;}.cs-h3 {margin: 0 0 0.5rem;font-size: 1.125rem;line-height: 1.3em;font-weight: 700;color: var(--headerColor);}.cs-item-text {margin: 0;font-size: 0.9375rem;line-height: 1.6em;color: var(--bodyTextColor);}}@media only screen and (min-width: 48rem) {.cs-card-group {grid-template-columns: repeat(2, 1fr);}}@media only screen and (min-width: 64rem) {.cs-card-group {grid-template-columns: repeat(3, 1fr);}}@media only screen and (min-width: 0rem) {body.dark-mode .cs-item {background-color: rgba(255, 255, 255, 0.05);}body.dark-mode .cs-h3 {color: #f7f7f7;}body.dark-mode .cs-item-text {color: rgba(255, 255, 255, 0.7);}}