/* CreditOps product page (/ai-command-center/creditops): the same Launch dark theme as the other three
   command-center pages, kept in its own file so the shared launch-purple.css / ops-pages.css stay untouched
   (a later merge with the TaxOps / ServiceOps / LegalOps / AgencyOps work cannot conflict here).
   Load AFTER /css/ops/ops-pages.css and /css/ops/launch-purple.css. */
body.ops.ops--credit {
  --ink:#f6f0ff;--ink-2:#d0c3df;--ink-3:#ae9bbb;
  --line:rgba(196,151,255,.18);--line-2:rgba(196,151,255,.28);
  --panel:#130b22;--panel-2:#1b102e;--tint:#0e0919;
  --brand:#b86cff;--brand-text:#d9a7ff;--brand-soft:rgba(155,78,240,.18);
  --btn:#842dea;--btn-hover:#a242ff;--btn-ink:#fff;--focus:#d7a1ff;
  --shadow:0 14px 36px rgba(0,0,0,.28);
  --shadow-lg:0 28px 70px rgba(0,0,0,.42);
  --niche:#b79cff;
  --f:'Lato',system-ui,-apple-system,'Segoe UI',Arial,sans-serif;font-family:var(--f);
  background:#090613;color:var(--ink);
}
.ops--credit .op-ticks li::before{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%236D28D9' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 6 9 17l-5-5'/%3E%3C/svg%3E")}
/* Honesty strip: what is live, what is a bridge, what is not claimed. */
.ops--credit .op-truth{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,260px),1fr));gap:16px;margin-top:30px}
.ops--credit .op-truth article{background:var(--panel);border:1px solid var(--line-2);border-radius:16px;padding:22px 22px 20px}
.ops--credit .op-truth h3{font-size:1.15rem;margin:0 0 8px}
.ops--credit .op-truth p{margin:0;color:var(--ink-2);font-size:.97rem}
.ops--credit .op-disclaimer{margin-top:28px;padding:18px 22px;border:1px solid var(--line-2);border-radius:14px;background:var(--tint);color:var(--ink-2);font-size:.93rem}
.ops--credit .op-disclaimer b{color:#fff}
.ops--credit .op-phones{display:flex;flex-wrap:wrap;gap:20px;justify-content:center;margin-top:34px}
.ops--credit .op-phones figure{margin:0;width:min(100%,220px)}
.ops--credit .op-phones img{display:block;width:100%;height:auto;border-radius:22px;border:1px solid var(--line-2);box-shadow:var(--shadow-lg)}
.ops--credit .op-phones figcaption{margin-top:10px;text-align:center;font-size:.88rem;color:var(--ink-2)}
/* Hero visual: the live ATLAS screen as a framed still on the right (the other pages use a full-bleed video;
   this screen is text-heavy, so it sits beside the headline instead of behind it). */
.ops--credit .op-hero__visual{position:relative}
.ops--credit .op-hero__visual::before{content:"";position:absolute;inset:-8% -6%;background:radial-gradient(ellipse at 60% 45%,rgba(132,45,234,.38),transparent 68%);pointer-events:none;z-index:0}
.ops--credit .op-hero__visual .op-frame{position:relative;z-index:1;box-shadow:0 30px 80px rgba(0,0,0,.55),0 0 0 1px var(--line-2)}
body.ops.ops--credit .op-main .op-hero__grid{display:grid;grid-template-columns:minmax(0,.95fr) minmax(0,1.05fr);gap:clamp(28px,4vw,64px);align-items:center}
body.ops.ops--credit .op-main .op-hero{min-height:0;padding-bottom:clamp(48px,6vw,84px)}
@media (max-width:900px){body.ops.ops--credit .op-main .op-hero__grid{grid-template-columns:1fr}body.ops.ops--credit .op-hero__visual{margin-top:30px}}
body.ops.ops--credit .op-main .op-hero__grid > div:first-child{max-width:none}

/* Section backgrounds follow the shared Ops design, matching InsuranceOps. */
/* dark openers (hero + ATLAS band): refined, solid purple actions, no glows or text shadows */
body.ops.ops--credit .op-main :is(.op-hero,#atlas) .op-btn--primary{background:#7C3AED;border-color:transparent;box-shadow:0 1px 2px rgba(0,0,0,.25),0 8px 20px rgba(124,58,237,.3)}
body.ops.ops--credit .op-main :is(.op-hero,#atlas) .op-btn--primary:hover{background:#6D28D9}
body.ops.ops--credit .op-main .op-hero{background:linear-gradient(180deg,#0A0614 0%,#120A24 100%)}
body.ops.ops--credit .op-main .op-hero h1{text-shadow:none}
.ops--credit .op-hero__visual::before{background:radial-gradient(ellipse at 60% 45%,rgba(124,58,237,.16),transparent 66%)}
.ops--credit .op-hero__visual .op-frame{border:1px solid rgba(255,255,255,.14);box-shadow:0 24px 64px rgba(0,0,0,.5)}
body.ops.ops--credit .op-main #atlas.op-sec{background:linear-gradient(180deg,#0E0720 0%,#0A0614 100%);padding-block:clamp(80px,9vw,128px)}
body.ops.ops--credit .op-main #atlas.op-sec::before{display:none}
body.ops.ops--credit .op-main #atlas :is(h2){text-shadow:none}
body.ops.ops--credit .op-main #atlas .op-frame{border:1px solid rgba(255,255,255,.14);box-shadow:0 24px 64px rgba(0,0,0,.5)}
/* Standard site header parity with the generated ops pages (four-ops.css header rules, scoped to this page): tablet/phone logo + burger slots, header font. */
@font-face{font-family:'Ops Header';font-style:normal;font-weight:600;font-display:optional;src:url('/fonts/ops/oswald-600-latin.woff2') format('woff2')}
html body.ops--credit #lhd :is(.lhd-links a,.nav-ghost,.lhd-burger):not(#_):not(#__){font-family:'Ops Header',Arial,sans-serif!important}
html body.ops--credit #lhd .lhd-links:not(#_){white-space:nowrap;flex-wrap:nowrap}
@media(max-width:1250px){html body.ops--credit #lhd .lhd-links:not(#_){display:none!important}}
html body.ops--credit #lhd .hdr-contact .gi:not(#_){width:26px!important;height:26px!important;box-sizing:border-box;flex:0 0 26px!important}
html body.ops--credit #lhd .hdr-contact .gi svg{width:14px;height:14px}
@media(max-width:720px){html body.ops--credit #lhd .hdr-contact .gi:not(#_){width:22px!important;height:22px!important;flex-basis:22px!important}}
@media(max-width:1250px){html body.ops--credit #lhd .lhd-burger:not(#_):not(#__):not(#___){width:46px!important;min-width:46px!important;flex:0 0 46px!important}}
@media(min-width:1101px) and (max-width:1250px){html body.ops--credit #lhd .lhd-burger:not(#_):not(#__){display:inline-flex!important}}
@media(max-width:720px){html body.ops--credit #lhd .lhd-logo img:not(#_):not(#__):not(#___){width:172px!important;margin:0 0 calc(var(--hd-row) - 79px) -4px!important}}
@media(min-width:721px) and (max-width:1250px){html body.ops--credit #lhd .lhd-logo img:not(#_):not(#__):not(#___){width:266px!important;margin:0 0 calc(var(--hd-row) - 122px) 0!important}}