/* Family styles for orbital-intelligence — populated by its presentation template contract. */

/* ============================================================
   ORBITAL INTELLIGENCE — two-column hero + parameter cells
   Loads after equipment.css; refines the .msi-ob-* stubs.
   ============================================================ */

/* ----- 1. Hero — two-column identity / orbit composition ----- */
.msi-ob-hero__inner {
        position: relative;
        z-index: 2;
        padding-block: var(--ms-space-9);
}
.msi-ob-hero__grid {
        display: grid;
        grid-template-columns: minmax(0, 1fr) auto;
        gap: var(--ms-space-8);
        align-items: center;
}
.msi-ob-hero__title {
        font-family: var(--ms-font-display);
        font-size: var(--ms-fs-hero);
        font-weight: 700;
        line-height: var(--ms-lh-tight);
        color: var(--ms-color-text);
        margin-block: var(--ms-space-3) var(--ms-space-2);
}
.msi-ob-hero__designation {
        font-family: var(--ms-font-mono);
        font-size: var(--ms-fs-h4);
        font-weight: 500;
        color: var(--ms-family-accent, var(--ms-color-violet));
        direction: ltr;
        unicode-bidi: embed;
        margin-block: 0 var(--ms-space-3);
}
.msi-ob-hero__excerpt {
        color: var(--ms-color-text-secondary);
        font-size: calc(var(--ms-fs-body) * 1.1);
        line-height: var(--ms-lh-body);
        max-inline-size: 58ch;
        margin-block: 0;
}
.msi-ob-hero .msi-entityhero__actions { margin-block-start: var(--ms-space-5); }

/* Visual column — halo behind the animated ring. */
.msi-ob-hero__visual {
        position: relative;
        display: grid;
        place-items: center;
        padding: var(--ms-space-5);
}
.msi-ob-hero__visual::before {
        content: "";
        position: absolute;
        inset: 0;
        background: radial-gradient(closest-side, var(--ms-color-violet-soft), transparent 70%);
        border-radius: 50%;
}

/* ----- 2. Parameter cells — hover with the violet family accent ----- */
.msi-ob-params__cell {
        transition: background-color var(--ms-dur-fast) var(--ms-ease-out);
}
.msi-ob-params__cell:hover { background: var(--ms-color-surface-hi); }
.msi-ob-params__value {
        font-size: var(--ms-fs-h3);
        line-height: 1.25;
        transition: color var(--ms-dur-fast) var(--ms-ease-out);
}
.msi-ob-params__value .msi-unit {
        font-size: var(--ms-fs-micro);
        color: var(--ms-color-text-tertiary);
}
.msi-ob-params__cell:hover .msi-ob-params__value {
        color: var(--ms-family-accent, var(--ms-color-violet));
}
/* Arabic values keep their natural direction inside the mono cell. */
.msi-ob-params__value--rtl {
        direction: rtl;
        unicode-bidi: embed;
        font-family: var(--ms-font-ui);
}

/* ----- 3. Mission-data panel under the parameter grid ----- */
.msi-ob-mission { margin-block-start: var(--ms-space-4); border-radius: var(--ms-radius-lg); }

/* ----- 4. Responsive ----- */
@media (max-width: 900px) {
        .msi-ob-hero__inner { padding-block: var(--ms-space-7); }
        .msi-ob-hero__grid { gap: var(--ms-space-6); }
        .msi-ob-hero__title { font-size: var(--ms-fs-display); }
        .msi-ob-orbit { inline-size: 150px; block-size: 150px; }
        .msi-ob-orbit__core { inline-size: 62px; block-size: 62px; }
        .msi-ob-orbit__core svg { inline-size: 26px; block-size: 26px; }
}
@media (max-width: 640px) {
        .msi-ob-hero__inner { padding-block: var(--ms-space-6); }
        .msi-ob-hero__grid {
                grid-template-columns: 1fr;
                gap: var(--ms-space-5);
        }
        .msi-ob-hero__title { font-size: var(--ms-fs-h1); }
        .msi-ob-hero__designation { font-size: var(--ms-fs-small); }
        .msi-ob-hero__visual { order: 1; padding: var(--ms-space-3); }
        .msi-ob-orbit { inline-size: 120px; block-size: 120px; }
        .msi-ob-orbit__core { inline-size: 54px; block-size: 54px; }
        .msi-ob-orbit__core svg { inline-size: 22px; block-size: 22px; }
        .msi-ob-params { grid-template-columns: repeat(2, 1fr); }
        .msi-ob-params__cell { padding: var(--ms-space-3) var(--ms-space-4); }
        .msi-ob-params__value { font-size: var(--ms-fs-h4); }
}
