/* Compliance page */
.co-cards { display: grid; gap: 1.25rem; margin-top: 1.75rem; }
@media (min-width: 900px) { .co-cards { grid-template-columns: 1fr 1fr; } }
.co-card { padding: clamp(1.25rem, 3vw, 1.75rem); background: var(--surface); border: 1px solid var(--line); border-radius: var(--radius-lg); border-top: 3px solid #4fd18b; }
.co-card h3 { font-size: 1.4rem; }
.co-card p { color: var(--ink-2); margin: 0 0 .75rem; }
.co-card__lead { color: var(--ink) !important; }
.co-card__label { margin-top: 1rem !important; margin-bottom: .2rem !important; font-size: .85rem; font-weight: 500; color: var(--ink) !important; }
.co-card .checks { margin: .25rem 0 0; }
.co-why { display: grid; gap: 1.5rem 3rem; align-items: start; }
@media (min-width: 900px) { .co-why { grid-template-columns: minmax(0, 1fr) minmax(0, 1.3fr); } }
.co-why .checks { margin: 0; }

/* Audit widget */
.audit { padding: clamp(1rem, 2.5vw, 1.5rem); background: rgba(30,30,30,.82); border: 1px solid var(--line); border-radius: var(--radius-lg); backdrop-filter: blur(6px); }
.audit__head { display: flex; align-items: center; justify-content: space-between; gap: 1rem; margin-bottom: 1rem; }
.audit__tabs { display: inline-flex; padding: 3px; border: 1px solid var(--line); border-radius: var(--radius-control); background: rgba(20,20,22,.7); }
.audit__tabs button { min-height: 36px; padding: .3rem 1rem; border: 0; border-radius: 6px; background: transparent; color: var(--ink-2); font: 500 .9rem/1 var(--font-body); cursor: pointer; transition: background .2s, color .2s; }
.audit__tabs button[aria-pressed="true"] { background: var(--accent); color: var(--on-brand); }
.audit__tabs button:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; }
.audit__note { font-size: .75rem; color: #7d7d84; }
.audit__body { display: grid; grid-template-columns: 96px minmax(0, 1fr); gap: .5rem 1.1rem; align-items: center; }
.audit__meter { position: relative; width: 96px; height: 96px; }
.audit__meter svg { width: 100%; height: 100%; transform: rotate(-90deg); }
.audit__track { fill: none; stroke: #2a2a30; stroke-width: 8; }
.audit__fill { fill: none; stroke: #ff8a80; stroke-width: 8; stroke-linecap: round; stroke-dasharray: 100; stroke-dashoffset: 100; transition: stroke-dashoffset .5s ease, stroke .5s; }
.audit.is-ready .audit__fill { stroke: #4fd18b; }
.audit__pct { position: absolute; inset: 0; display: grid; place-items: center; font: 500 1.35rem/1 var(--font-head); font-variant-numeric: tabular-nums; }
.audit__state { margin: 0; font-weight: 500; font-size: 1.05rem; }
.audit.is-ready .audit__state { color: #4fd18b; }
.audit__list { grid-column: 1 / -1; list-style: none; margin: .75rem 0 0; padding: 0; display: grid; gap: .3rem; min-height: 19.5rem; }
.ai { display: grid; grid-template-columns: 22px minmax(0, 1fr) auto; gap: .6rem; align-items: center; padding: .42rem .6rem; border-radius: var(--radius-sm); background: rgba(20,20,22,.55); font-size: .88rem; color: #7d7d84; transition: background .3s, color .3s; animation: co-in .35s ease both; }
.ai__icon { width: 18px; height: 18px; border-radius: 50%; border: 2px solid #3a3a40; display: grid; place-items: center; transition: border-color .3s, background .3s; }
.ai__icon svg { width: 11px; height: 11px; fill: none; stroke: #0f0f0f; stroke-width: 3; stroke-linecap: round; stroke-linejoin: round; opacity: 0; }
.ai__tag { font-size: .72rem; font-weight: 500; white-space: nowrap; }
.ai[data-s="scan"] { background: rgba(69,232,255,.08); color: var(--ink); }
.ai[data-s="scan"] .ai__icon { border-color: var(--accent); border-right-color: transparent; animation: co-spin .7s linear infinite; }
.ai[data-s="scan"] .ai__tag { color: var(--accent); }
.ai[data-s="pass"], .ai[data-s="fixed"] { color: var(--ink); }
.ai[data-s="pass"] .ai__icon, .ai[data-s="fixed"] .ai__icon { border-color: #4fd18b; background: #4fd18b; }
.ai[data-s="pass"] .ai__icon svg, .ai[data-s="fixed"] .ai__icon svg { opacity: 1; }
.ai[data-s="pass"] .ai__tag { color: #4fd18b; }
.ai[data-s="gap"] { background: rgba(255,138,128,.09); color: #ffd0cb; }
.ai[data-s="gap"] .ai__icon { border-color: #ff8a80; }
.ai[data-s="gap"] .ai__tag { color: #ff8a80; }
.ai[data-s="fix"] { background: rgba(212,132,255,.1); color: var(--ink); }
.ai[data-s="fix"] .ai__icon { border-color: var(--violet); border-right-color: transparent; animation: co-spin .7s linear infinite; }
.ai[data-s="fix"] .ai__tag { color: var(--violet); }
.ai[data-s="fixed"] { background: rgba(79,209,139,.08); }
.ai[data-s="fixed"] .ai__tag { color: #4fd18b; }
@media (max-width: 480px) { .audit__body { grid-template-columns: 76px minmax(0, 1fr); } .audit__meter { width: 76px; height: 76px; } .ai { font-size: .82rem; } }

@keyframes co-spin { to { transform: rotate(360deg); } }
@keyframes co-in { from { opacity: 0; transform: translateY(-4px); } to { opacity: 1; transform: none; } }
@media (prefers-reduced-motion: reduce) {
  .ai, .ai[data-s="scan"] .ai__icon, .ai[data-s="fix"] .ai__icon { animation: none; }
  .audit__fill, .ai, .ai__icon { transition: none; }
}
.co-card .checks a { color: var(--accent); }
