/* DMO — dataenabler.org/dmo */
.dmo-bar { height:28px; display:flex; align-items:center; background:#0B1220; color:#94A3B8; font-size:12px; border-bottom:1px solid rgba(255,255,255,.08); }
.dmo-bar-inner { width:min(calc(100% - 32px), 1240px); margin-inline:auto; display:flex; align-items:center; justify-content:space-between; gap:12px; }
.dmo-header { height:60px; display:flex; align-items:center; background:var(--surface); border-bottom:1px solid var(--border); position:sticky; top:0; z-index:10; }
.dmo-header-inner { width:min(calc(100% - 32px), 1240px); margin-inline:auto; display:flex; align-items:center; justify-content:space-between; gap:18px; height:100%; }
.dmo-brand { display:flex; align-items:center; gap:10px; font-weight:900; letter-spacing:-.02em; }
.dmo-mark { width:32px; height:32px; border-radius:9px; background:var(--dmo); color:#fff; display:grid; place-items:center; font-weight:900; font-size:13px; }
.dmo-hero { position:relative; overflow:hidden; background: radial-gradient(700px 400px at 70% 0%, rgba(15,76,129,.12), transparent 60%), linear-gradient(180deg, #F8FAFC 0%, #EEF4FA 100%); border-bottom:1px solid var(--border); padding:40px 0 28px; }
[data-theme="dark"] .dmo-hero { background: radial-gradient(700px 400px at 70% 0%, rgba(15,76,129,.18), transparent 60%), linear-gradient(180deg, #0B1220 0%, #070B14 100%); }
.dmo-hero-inner { display:grid; grid-template-columns: 1.05fr .95fr; gap:32px; align-items:center; }
.dmo-hero h1 { font-size: clamp(32px, 5vw, 52px); font-weight:900; letter-spacing:-.03em; line-height:1.05; }
.dmo-hero h1 span { color:var(--dmo); }
.cap-grid { display:grid; grid-template-columns: repeat(5,1fr); gap:10px; }
.cap-card {
  background:var(--surface); border:1px solid var(--border); border-radius:14px; padding:14px; cursor:pointer; transition: all var(--ease);
  display:flex; flex-direction:column; gap:8px;
}
.cap-card:hover { border-color:var(--dmo); transform: translateY(-2px); box-shadow: var(--shadow-md); }
.cap-card.is-active { background:var(--dmo); color:#fff; border-color:var(--dmo); }
.cap-card.is-active small, .cap-card.is-active p { color:rgba(255,255,255,.82) }
.cap-card .icon { width:32px; height:32px; border-radius:8px; background:var(--dmo-soft); color:var(--dmo); display:grid; place-items:center; font-weight:800; font-size:12px; }
.cap-card.is-active .icon { background:rgba(255,255,255,.18); color:#fff; }
.cap-card h4 { font-size:13px; font-weight:800; letter-spacing:-.01em; line-height:1.2; }
.cap-card p { font-size:12px; color:var(--text-muted); line-height:1.4; }
.cap-detail { background:var(--surface); border:1px solid var(--border); border-radius:16px; padding:18px; margin-top:14px; display:none; }
.cap-detail.open { display:block; }
.assessment { background:var(--surface); border:1px solid var(--border); border-radius:20px; padding:20px; box-shadow:var(--shadow-sm); }
.q { padding:14px; border:1px solid var(--border); border-radius:12px; margin-bottom:10px; background:var(--bg); }
.q h4 { font-size:14px; font-weight:700; }
.q-opts { display:flex; gap:10px; margin-top:8px; flex-wrap:wrap; }
.q-opts label { display:flex; align-items:center; gap:6px; padding:7px 10px; border-radius:999px; border:1px solid var(--border); background:var(--surface); font-size:13px; font-weight:600; cursor:pointer; }
.q-opts input { accent-color: var(--dmo); }
.result-bar { display:flex; gap:4px; margin-top:10px; }
.result-seg { flex:1; height:10px; border-radius:999px; background:var(--surface-muted); border:1px solid var(--border); }
.result-seg.filled { background: var(--dmo); border-color: var(--dmo); }
.result-seg.filled.optimal { background: var(--success); border-color: var(--success); }
.ndmo-note { background: var(--surface); border:1px solid #FDE68A; border-radius:12px; padding:12px; font-size:12.5px; line-height:1.6; color:#92400E; }
[data-theme="dark"] .ndmo-note { background: rgba(146,64,14,.14); color:#FDE68A; border-color:#92400E; }
@media (max-width: 1100px){ .dmo-hero-inner { grid-template-columns:1fr; } .cap-grid { grid-template-columns: repeat(3,1fr); } }
@media (max-width: 760px){ .cap-grid { grid-template-columns: repeat(2,1fr); } }