/* V4 Security pages (Verlin 2026-10-19): V3's Security content on white. V3's styles arrive scoped under .v3s
   (v3-scoped.css); this file switches its dark blue grounds to white, recolours the animated diagrams so they stand
   out on white, swaps V3's orange buttons for V4's blue ones, and follows the V4 rules: thin full borders (no
   single-side accents), nothing lifts under the cursor, Simon's fonts. */
.v3s {
  --sc-font-display: var(--wp--preset--font-family--jost, sans-serif);
  --sc-font-text: var(--wp--preset--font-family--instrument, sans-serif);
  --sc-ink: #1d1d1f; --sc-ink-soft: rgba(29, 29, 31, .72);
  --accent-text: #a65a00;
  background: #fff; color: #1d1d1f;
}
.v3s [data-sc-in], .v3s [data-sc-stagger] > * { opacity: 1 !important; transform: none !important; }
.v3s [data-sc-progress] { display: none !important; }
.inst-sec-body > section, .inst-sec-body .sc-section, .inst-sec-body .pb, .inst-sec-body .certs { background: #fff !important; color: #1d1d1f; }
.inst-sec-body > section { padding-top: clamp(6rem, 10vw, 10rem); padding-bottom: clamp(6.5rem, 11vw, 11rem); }
.inst-sec-body > section + section { border-top: 1px solid rgba(16, 24, 40, .08); }
.inst-sec-body .sc-wrap { max-width: calc(var(--wp--style--global--content-size, 1280px) + 2 * clamp(16px, 5.5vw, 80px)); padding-left: clamp(16px, 5.5vw, 80px); padding-right: clamp(16px, 5.5vw, 80px); box-sizing: border-box; margin-left: auto; margin-right: auto; }
.inst-sec-body h1, .inst-sec-body h2, .inst-sec-body h3 { color: #1d1d1f; }
.inst-sec-body p { color: rgba(29, 29, 31, .74); }
.inst-sec-body .kicker, .inst-sec-body .kicker a { color: #a65a00 !important; }

/* diagram cards */
.v3s .viz-cardbox { background: #fff; border: 1px solid rgba(16, 24, 40, .12); box-shadow: 0 18px 40px -28px rgba(16, 40, 63, .45); }
.v3s .viz-cardbox:hover { transform: none; border-color: rgba(19, 141, 205, .45); }
.v3s .viz-stage { background: radial-gradient(120% 90% at 50% 0, rgba(19, 141, 205, .12), transparent 62%), linear-gradient(rgba(16, 40, 63, .05) 1px, transparent 1px) 0 0 / 100% 20px; border-bottom: 1px solid rgba(16, 24, 40, .08); }
.v3s .viz { --vz-ink: rgba(16, 40, 63, .22); --vz-soft: rgba(16, 40, 63, .58); --vz-blue: #138dcd; --vz-gold: #f39200; --vz-green: #1f9d63; }
.v3s .viz-body h2 { color: #1d1d1f; }
.v3s .viz-body p { color: rgba(29, 29, 31, .72); }
.v3s .viz-body ul { color: rgba(29, 29, 31, .86); }
.v3s .viz-body li::marker { color: #f39200; }
.v3s .viz-node { fill: rgba(19, 141, 205, .14); }
.v3s .viz-fence { fill: rgba(19, 141, 205, .06); }
.v3s .viz-doc { fill: rgba(19, 141, 205, .06); }
.v3s .viz-rack, .v3s .viz-cloud { fill: rgba(19, 141, 205, .06); stroke: var(--vz-soft); }

/* call-to-action boxes and buttons */
.v3s .sec-note { background: var(--bg-page, #f5f5f7); border: 1px solid rgba(16, 24, 40, .10); color: #1d1d1f; }
.v3s .btn { border-radius: 999px; }
.v3s .btn--primary { background: var(--wp--preset--color--brand-blue, #138dcd) !important; border-color: var(--wp--preset--color--brand-blue, #138dcd) !important; color: #fff !important; }
.v3s .btn--primary:hover { background: #0f78ae !important; border-color: #0f78ae !important; }
.v3s .btn--ghost { background: transparent !important; border: 1.5px solid var(--wp--preset--color--brand-blue, #138dcd) !important; color: var(--wp--preset--color--brand-blue, #138dcd) !important; }

/* Trusted Ecosystem banner: V3's network diagram on the right of the V4 banner */

/* V3's dark-band rules are more specific than the ones above, so the light versions are forced here */
.inst-sec-body .viz-band { background: #fff !important; border-bottom: 0 !important; }
.inst-sec-body .viz-cardbox, .inst-sec-body .gov-side { background: #fff !important; border: 1px solid rgba(16, 24, 40, .12) !important; box-shadow: 0 18px 40px -28px rgba(16, 40, 63, .45) !important; }
.inst-sec-body .viz-cardbox:hover { transform: none !important; }
.inst-sec-body .viz-stage { background: radial-gradient(120% 90% at 50% 0, rgba(19, 141, 205, .12), transparent 62%), linear-gradient(rgba(16, 40, 63, .05) 1px, transparent 1px) 0 0 / 100% 20px !important; border-bottom: 1px solid rgba(16, 24, 40, .08) !important; }
.inst-sec-body .sec-note { background: var(--bg-page, #f5f5f7) !important; border: 1px solid rgba(16, 24, 40, .10) !important; }
.inst-sec-body .sec-note h2 { color: #1d1d1f !important; }
.inst-sec-body .sec-note p { color: rgba(29, 29, 31, .74) !important; }
/* Before You Approve AI: the quote, the category cards and the questions (thin full border, no orange left stripe) */
.inst-sec-body .gov-quote blockquote p { color: #1d1d1f !important; }
.inst-sec-body .gov-quote figcaption { color: rgba(29, 29, 31, .6) !important; }
.inst-sec-body .gov-quote figcaption .link { color: #a65a00 !important; }
.inst-sec-body .gov-side h2 { color: #1d1d1f !important; }
.inst-sec-body .gov-q { background: #fff !important; border: 1px solid rgba(16, 24, 40, .12) !important; box-shadow: 0 10px 28px -22px rgba(16, 40, 63, .4); }
.inst-sec-body .gov-q h3 { color: #1d1d1f !important; }
.inst-sec-body .gov-a { color: rgba(29, 29, 31, .74) !important; }
/* Trusted Ecosystem: the 50+ figure, its caption, and the partner cards' top stripe (removed: no single-side accents) */
.inst-sec-body .ig-num { color: #f39200 !important; text-shadow: none !important; }
.inst-sec-body .ig-lab { color: rgba(29, 29, 31, .7) !important; }
.inst-sec-body .ig-tile:hover { background: #143252 !important; border-color: rgba(255, 255, 255, .1) !important; }
.inst-sec-body .pp-card::before { display: none !important; }
.inst-sec-body .pb-body, .inst-sec-body .pb-list p { color: rgba(29, 29, 31, .74) !important; }
.inst-sec-body .pb-list li { border-left: 0 !important; padding-left: 0 !important; }
.inst-sec-body .an-status { color: #1f7a4d !important; }
.inst-sec-body .gov-a-label { color: #1f7a4d !important; }
.inst-sec-body .viz-row--now rect { fill: rgba(243, 146, 0, .55) !important; }
.inst-sec-body .viz-row--now text { fill: #1d1d1f !important; font-weight: 600; }

/* Technology Partners: Simon's cards stay as they are, but nothing lifts under the cursor */
.inst-tp .instant-panel:hover { transform: none !important; }
/* Technology Partners: live intro centred on white, then Simon's partner cards and closing band as on live */
.inst-tp-intro { box-sizing: border-box; background: #fff; padding: clamp(5rem, 8vw, 8rem) 1.5rem; text-align: center; }
.inst-tp-intro p { max-width: 860px; margin-left: auto !important; margin-right: auto !important; font-size: clamp(1.15rem, 1.6vw, 1.35rem); line-height: 1.6; color: #2a3a4c; margin: 0; }
/* closing band on white so it stands apart from the grey card grid above it */
.inst-tp .has-ink-background-color { background: #fff !important; }
