/*
  /preview/training/ layer (Binary Systems SI Academy). PREVIEW.
  Loaded after the five live stylesheets, the live Services layer (/Services/assets/services.css)
  and the live Solutions layer (/Solutions/assets/solutions.css). Every rule here is scoped to .so-*.
*/
.so-tr-hero h1 .l2 { color: var(--sv-sky); }

/* Track accents */
.so-cred { --so-accent: var(--sv-fiber); --so-accent2: #a8e6c7; border-top: 3px solid #2f8a5f;
  background: radial-gradient(ellipse 55% 70% at 10% 20%, rgba(111,206,159,.16), transparent 70%), linear-gradient(180deg, #121a17 0%, #000 100%); }
.so-core { --so-accent: var(--sv-sky); --so-accent2: #9dcef8; border-top: 3px solid var(--sv-aqua);
  background: radial-gradient(ellipse 60% 70% at 90% 10%, rgba(45,120,200,.45), transparent 70%), linear-gradient(180deg, #08315c 0%, #061e39 60%, #000 100%); }
.so-labs { --so-accent: var(--sv-teal); --so-accent2: #9fdcd9; border-top: 3px solid var(--sv-teal);
  background: radial-gradient(ellipse 50% 70% at 12% 20%, rgba(83,176,172,.18), transparent 70%), linear-gradient(180deg, #13191a 0%, #000 100%); }
.so-ai { --so-accent: #c9ced6; --so-accent2: #e8e8e8; border-top: 3px solid #8d96a3;
  background: linear-gradient(180deg, #2a2c30 0%, #0a0b0d 55%, #000 100%); }
.so-vt { --so-accent: #ff6b5e; --so-accent2: #ff9a90; border-top: 3px solid #8a1c18;
  background: radial-gradient(ellipse 50% 70% at 12% 30%, rgba(193,18,31,.20), transparent 70%), linear-gradient(180deg, #16181c 0%, #000 100%); }
.so-onsite { --so-accent: #ffb300; --so-accent2: #ffd27a; border-top: 3px solid #ffb300;
  background: radial-gradient(ellipse 50% 70% at 88% 20%, rgba(255,179,0,.14), transparent 70%), linear-gradient(180deg, #1c1e22 0%, #000 100%); }

/* Credentials: three proof cards */
.so-proof { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 18px; margin: 26px 0 8px; }
.so-proof > div { padding: 20px 20px 10px; border-radius: 12px; background: rgba(255,255,255,.05); border: 1px solid rgba(168,230,199,.18); border-top: 3px solid var(--so-accent); }
.so-proof h3 { font-size: 18px; margin-bottom: 8px; }
.so-proof p { font-size: 14.5px; line-height: 1.55; }
.so-proof .so-k { display: block; font-size: 11px; letter-spacing: .12em; text-transform: uppercase; font-weight: bold; color: var(--so-accent); margin-bottom: 6px; }
.so-note { font-size: 12.5px; color: #8d96a3; margin-top: 10px; }

/* Course modules */
.so-mods { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; margin: 26px 0 8px; counter-reset: mod; }
.so-mods li { padding: 18px 18px 8px; border-radius: 12px; background: rgba(0,0,0,.32); border: 1px solid rgba(157,206,248,.18); counter-increment: mod; }
.so-mods h3 { font-size: 16px; line-height: 1.35; margin-bottom: 6px; }
.so-mods h3::before { content: counter(mod, decimal-leading-zero); display: block; font-size: 12px; letter-spacing: .12em; color: var(--so-accent); margin-bottom: 4px; }
.so-mods p { font-size: 13.5px; line-height: 1.55; color: #c9ced6; }
.so-band h3.so-sub { font-size: 20px; margin: 30px 0 4px; }

/* V lockup inside the V track (re-uses the live .sv-v block from services.css) */
.so-vt .sv-v { margin-top: 26px; }
.so-vt .sv-v .status { background: #e8e8e8; color: #16181c; }


@media screen and (max-width: 999px) {
  .so-proof { grid-template-columns: 1fr; }
  .so-mods { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media screen and (max-width: 560px) {
  .so-mods { grid-template-columns: 1fr; }
}

/* Non-link list items in a .so-side box (Who should attend) */
.so-side li.so-plain { padding: 10px 2px; }
.so-side li.so-plain b { display: block; color: #fff; }
.so-side li.so-plain small { display: block; color: #8d96a3; font-size: 12.5px; }

/* Scheduling prompt under the on-site list; vendor-expertise sub-heading */
.so-band .so-q.so-after { margin: 28px 0 4px !important; }
.so-band h3.so-sub.so-vendor { margin-top: 40px; }