.csv2-main { padding: 78px 0 96px; }
.csv2-filter { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 34px; }
.csv2-filter button { min-height: 36px; padding: 7px 13px; border: 1px solid var(--border-subtle); border-radius: 5px; color: var(--slate-600); background: #fff; font-size: 0.72rem; font-weight: 700; }
.csv2-filter button.active { color: #fff; border-color: var(--blue); background: var(--blue); }
.csv2-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 28px; }
.csv2-item { display: grid; grid-template-rows: 250px 1fr; min-width: 0; border: 1px solid #d3dae4; border-radius: 8px; overflow: hidden; background: #fff; }
.csv2-item--featured { grid-column: 1 / -1; grid-template-columns: 1.15fr 0.85fr; grid-template-rows: minmax(390px, auto); }
.csv2-visual { position: relative; min-width: 0; overflow: hidden; background: var(--surface-secondary); }
.csv2-visual img { width: 100%; height: 100%; display: block; object-fit: cover; object-position: top left; transition: transform 350ms var(--ease-out); }
.csv2-visual > span { position: absolute; left: 16px; top: 16px; padding: 6px 9px; border-radius: 4px; color: #fff; background: rgba(7,19,38,0.84); font-size: 0.62rem; font-weight: 700; }
.csv2-sorbee { height: 100%; display: grid; align-content: center; gap: 10px; padding: 64px 34px 28px; background: var(--surface-secondary); }
.csv2-sorbee > div { display: grid; grid-template-columns: 38px 1fr; align-items: center; gap: 11px; padding: 13px; border: 1px solid #d3dae4; border-radius: 5px; background: #fff; }
.csv2-sorbee > div > i { width: 34px; height: 34px; display: grid; place-items: center; border-radius: 4px; color: var(--blue); background: var(--brand-blue-soft); }
.csv2-sorbee span { display: flex; flex-direction: column; }
.csv2-sorbee strong { color: var(--navy); font-size: 0.72rem; }
.csv2-sorbee small { color: var(--slate-500); font-size: 0.62rem; }
@media (hover: hover) and (pointer: fine) { .csv2-item:hover .csv2-visual img { transform: scale(1.015); } }
.csv2-copy { display: flex; flex-direction: column; align-items: flex-start; padding: 30px; }
.csv2-domain { color: var(--blue); font-size: 0.66rem; font-weight: 750; text-transform: uppercase; }
.csv2-copy h2 { margin: 14px 0 26px; color: var(--navy); font-size: 1.55rem; font-weight: 680; line-height: 1.15; }
.csv2-item--featured .csv2-copy { justify-content: center; padding: 48px; }
.csv2-item--featured .csv2-copy h2 { font-size: 2.6rem; }
.csv2-copy h2 a { color: inherit; }
.csv2-outcome { width: 100%; margin-bottom: 28px; padding: 20px 0; border-top: 1px solid var(--border-subtle); border-bottom: 1px solid var(--border-subtle); }
.csv2-outcome strong { display: block; margin-bottom: 5px; color: var(--blue); font-size: 2.3rem; font-weight: 680; line-height: 1; }
.csv2-outcome p { margin: 0; color: var(--slate-600); font-size: 0.84rem; line-height: 1.5; }
.csv2-copy .ip-link { margin-top: auto; }
@media (max-width: 991.98px) { .csv2-item--featured { grid-template-columns: 1fr; grid-template-rows: 320px auto; } }
@media (max-width: 767.98px) { .csv2-main { padding: 58px 0 72px; } .csv2-grid { grid-template-columns: 1fr; } .csv2-item--featured { grid-column: auto; grid-template-rows: 250px auto; } .csv2-item--featured .csv2-copy { padding: 30px; } .csv2-item--featured .csv2-copy h2 { font-size: 1.8rem; } }
