.capability-showcase { background: #eef3f9; }
.capability-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; }
.capability-card { min-height: 355px; overflow: hidden; display: flex; flex-direction: column; border: 1px solid var(--line); border-radius: 19px; background: #fff; transition: transform .3s, box-shadow .3s, border-color .3s; }.capability-card:hover { transform: translateY(-6px); border-color: transparent; box-shadow: 0 24px 55px rgba(6,20,36,.14); }.capability-media { height: 175px; flex: 0 0 auto; background-image: url("../../images/capabilities-sheet.webp"); background-repeat: no-repeat; background-size: 300% 200%; transition: transform .5s ease, filter .3s; }.capability-card:hover .capability-media { transform: scale(1.03); filter: saturate(1.08) contrast(1.03); }.media-capture { background-position: 0 0; }.media-protocol { background-position: 50% 0; }.media-archive { background-position: 100% 0; }.media-metadata { background-position: 0 100%; }.media-integrity { background-position: 50% 100%; }.media-availability { background-position: 100% 100%; }
.capability-body { position: relative; z-index: 2; flex: 1; padding: 22px 24px 25px; background: #fff; }.capability-index { color: var(--blue-600); font-size: 9px; font-weight: 900; letter-spacing: .08em; }.capability-card h3 { margin: 14px 0 9px; color: var(--navy-900); font-size: 18px; }.capability-card p { margin: 0; color: var(--muted); font-size: 10px; line-height: 1.7; }
.result-panel { display: grid; grid-template-columns: .82fr 1.18fr; overflow: hidden; border-radius: var(--radius-lg); background: #fff; box-shadow: var(--shadow-sm); }.result-panel-copy { padding: 50px; }.result-list { margin-top: 30px; display: grid; gap: 13px; list-style: none; }.result-list li { display: flex; gap: 12px; color: #43566c; font-size: 12px; }.result-list i { color: var(--success); font-style: normal; font-weight: 900; }.result-visual { min-height: 420px; position: relative; display: grid; place-items: center; overflow: hidden; background: linear-gradient(135deg, var(--navy-900), var(--blue-700)); }.protocol-sheet { width: 63%; padding: 25px; border-radius: 18px; background: #fff; box-shadow: 0 30px 70px rgba(0,0,0,.3); transform: rotate(3deg); }.protocol-sheet span { height: 8px; display: block; margin-bottom: 10px; border-radius: 5px; background: #dbe4ed; }.protocol-sheet span:first-child { width: 58%; height: 17px; background: var(--blue-600); }.protocol-sheet span:nth-child(3) { width: 80%; }.protocol-sheet span:nth-child(5) { width: 66%; }
@media (max-width: 1050px) { .capability-grid { grid-template-columns: repeat(2,1fr); }.capability-media { height: 200px; } }
@media (max-width: 760px) { .capability-grid, .result-panel { grid-template-columns: 1fr; }.capability-card { min-height: 0; }.capability-media { height: 220px; }.result-panel-copy { padding: 32px; }.result-visual { min-height: 330px; } }
@media (max-width: 430px) { .capability-media { height: 185px; }.capability-body { padding: 20px; } }