/*
Theme Name: Control Foundry
Theme URI: https://controlfoundrylabs.com
Description: Custom presentation layer for Control Foundry Labs, built on Kadence.
Author: Control Foundry
Template: kadence
Version: 2.13.1
Text Domain: control-foundry
*/

:root {
  --cf-navy: #07111c;
  --cf-panel: #0e1e2e;
  --cf-line: #294258;
  --cf-text: #f4f8fb;
  --cf-muted: #a8bbc9;
  --cf-cyan: #20d3e6;
  --cf-cyan-deep: #0079bd;
  --cf-amber: #f6b94c;
  --cf-green: #42d392;
  --cf-paper: #f4f8fb;
  --cf-ink: #102233;
}

body { background: var(--cf-navy); color: var(--cf-text); font-family: Inter, Arial, sans-serif; }
a:focus-visible,
button:focus-visible,
input:focus-visible,
select:focus-visible,
textarea:focus-visible { outline: 3px solid var(--cf-cyan) !important; outline-offset: 3px !important; }
.site { overflow: hidden; }
#masthead, #colophon { display: none; }
.cf-shell { width: min(1180px, calc(100% - 48px)); margin: 0 auto; }
.cf-topline { padding: 13px 0; background: #fff; color: #536a7d; border-bottom: 1px solid #e3e9ef; font-size: .78rem; font-weight: 700; letter-spacing: .08em; text-align: center; text-transform: uppercase; }
.cf-header { position: sticky; top: 0; z-index: 10; background: rgba(7,17,28,.92); border-bottom: 1px solid rgba(168,187,201,.16); backdrop-filter: blur(12px); }
.cf-header__inner { height: 76px; display: flex; gap: 28px; align-items: center; justify-content: space-between; }
.cf-brand { display: inline-flex; align-items: center; color: var(--cf-text); font-weight: 800; letter-spacing: .08em; text-decoration: none; }
.cf-brand img { width: 42px; height: 42px; margin-right: 10px; object-fit: contain; }
.cf-nav { display: flex; gap: 22px; align-items: center; }
.cf-nav a { color: var(--cf-muted); font-size: .9rem; text-decoration: none; }
.cf-nav a:hover { color: var(--cf-text); }
.cf-nav__item { position: relative; }
.cf-nav__item > a span { display: inline-block; margin-left: 3px; color: var(--cf-cyan); font-size: .95em; transition: transform .2s ease; }
.cf-submenu { position: absolute; top: calc(100% + 18px); left: -14px; z-index: 20; width: 270px; padding: 8px; border: 1px solid var(--cf-line); background: #0b1a29; box-shadow: 0 18px 36px rgba(0,0,0,.25); opacity: 0; visibility: hidden; transform: translateY(-6px); transition: opacity .18s ease, transform .18s ease, visibility .18s ease; }
.cf-submenu::before { content: ''; position: absolute; top: -19px; left: 0; width: 100%; height: 20px; }
.cf-submenu a { display: flex; align-items: flex-start; justify-content: space-between; gap: 12px; padding: 12px; color: var(--cf-text); line-height: 1.25; }
.cf-submenu a:hover { background: #123047; color: var(--cf-cyan); }
.cf-submenu__item { position: relative; }
.cf-submenu__item > a > span { color: var(--cf-cyan); font-size: 1.2rem; line-height: .8; }
.cf-submenu--nested { top: -9px; left: calc(100% + 8px); }
.cf-submenu--nested::before { top: 0; left: -9px; width: 10px; height: 100%; }
.cf-submenu small { display: block; margin-top: 3px; color: var(--cf-muted); font-size: .72rem; }
.cf-nav__item--resources:hover > .cf-submenu, .cf-nav__item--resources:focus-within > .cf-submenu, .cf-submenu__item--has-children:hover > .cf-submenu, .cf-submenu__item--has-children:focus-within > .cf-submenu { opacity: 1; visibility: visible; transform: translateY(0); }
.cf-nav__item--resources:hover > a span, .cf-nav__item--resources:focus-within > a span { transform: rotate(180deg); }
.cf-button { display: inline-flex; justify-content: center; align-items: center; padding: 13px 19px; border: 1px solid var(--cf-cyan); background: var(--cf-cyan); color: #02131c; border-radius: 4px; font-weight: 800; text-decoration: none; transition: .2s ease; }
.cf-button:hover, .cf-button:focus-visible { background: transparent; color: var(--cf-cyan); }
.cf-button--ghost { background: transparent; color: var(--cf-text); border-color: var(--cf-line); }
.cf-button--ghost:hover, .cf-button--ghost:focus-visible { border-color: var(--cf-cyan); color: var(--cf-cyan); }
.cf-section--paper .cf-button--ghost { color: var(--cf-ink); border-color: #8094a4; }
.cf-section--paper .cf-button--ghost:hover { color: #005f89; border-color: var(--cf-cyan-deep); background: #e4f7fa; }
#about .cf-button--ghost { color: var(--cf-ink); border-color: #536f85; }
#about .cf-button--ghost:hover { color: #005f89; border-color: var(--cf-cyan-deep); background: #e4f7fa; }
.cf-eyebrow { color: var(--cf-cyan); font-size: .75rem; font-weight: 800; letter-spacing: .16em; text-transform: uppercase; }
.cf-hero { position: relative; min-height: 650px; display: grid; align-items: end; background: #06111d; isolation: isolate; }
.cf-hero::after { content: ''; position: absolute; inset: 0; z-index: -1; background: linear-gradient(90deg, rgba(5,15,25,.96) 0%, rgba(5,15,25,.8) 38%, rgba(5,15,25,.22) 75%, rgba(5,15,25,.45) 100%); }
.cf-hero__image { position: absolute; inset: 0; z-index: -2; width: 100%; height: 100%; object-fit: cover; object-position: center 15%; }
.cf-hero__content { padding: 105px 0 88px; max-width: 690px; }
.cf-hero h1, .cf-section h2, .cf-episode h1 { font-family: 'Space Grotesk', Inter, Arial, sans-serif; letter-spacing: -.045em; line-height: .98; }
.cf-hero h1 { margin: 14px 0 20px; font-size: clamp(3rem, 6vw, 5.65rem); }
.cf-hero p { max-width: 570px; color: #d7e5ed; font-size: clamp(1.05rem, 2vw, 1.25rem); line-height: 1.65; }
.cf-actions { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 30px; }
.cf-strip { background: #081827; border-block: 1px solid rgba(168,187,201,.14); }
.cf-strip__inner { display: flex; flex-wrap: wrap; gap: 14px 28px; padding: 22px 0; color: var(--cf-muted); font-size: .85rem; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; }
.cf-section { padding: 105px 0; }
.cf-section--paper { color: var(--cf-ink); background: var(--cf-paper); }
.cf-section--panel { background: var(--cf-panel); }
.cf-section h2 { max-width: 760px; margin: 12px 0 22px; font-size: clamp(2.35rem, 4vw, 4.1rem); }
.cf-lead { max-width: 735px; color: var(--cf-muted); font-size: 1.12rem; line-height: 1.7; }
.cf-section--paper .cf-lead { color: #526a7b; }
.cf-hero, .cf-header, .cf-strip, .cf-section--panel { color: var(--cf-text); }
.cf-hero h1, .cf-hero p, .cf-section--panel h2, .cf-section--panel h3, .cf-section--panel p, .cf-section--panel a { color: var(--cf-text); }
.cf-section--panel .cf-lead, .cf-section--panel .cf-card__meta, .cf-section--panel .cf-episode-card > div:last-child > span { color: var(--cf-muted); }
.cf-episodes { display: grid; grid-template-columns: repeat(2, minmax(0,1fr)); gap: 20px; margin-top: 42px; }
.cf-episode-card { display: flex; min-height: 220px; flex-direction: column; justify-content: space-between; padding: 29px; border: 1px solid var(--cf-line); background: #0a1724; color: var(--cf-text); text-decoration: none; }
.cf-episode-card:hover { border-color: var(--cf-cyan); transform: translateY(-3px); }
.cf-card__meta { display: flex; justify-content: space-between; align-items: center; gap: 10px; color: var(--cf-muted); font-family: 'JetBrains Mono', monospace; font-size: .77rem; text-transform: uppercase; }
.cf-status { color: var(--cf-green); font-weight: 800; }
.cf-status--progress { color: var(--cf-amber); }
.cf-episode-card h3 { margin: 20px 0 8px; font-size: 1.65rem; }
.cf-card__arrow { color: var(--cf-cyan); font-weight: 800; }
.cf-learning-note { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1px; margin-top: 42px; border: 1px solid var(--cf-line); background: var(--cf-line); }
.cf-learning-note > div { min-height: 230px; padding: 29px; background: #0a1724; }
.cf-learning-note h3 { margin: 16px 0 10px; font-size: 1.4rem; }
.cf-learning-note p { min-height: 74px; margin-bottom: 20px; color: var(--cf-muted); line-height: 1.65; }
.cf-learning-note .cf-button--ghost { color: var(--cf-text); }
.cf-pillars { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 42px; }
.cf-pillar { padding-top: 20px; border-top: 2px solid var(--cf-cyan); }
.cf-pillar h3 { margin: 14px 0 10px; font-size: 1.2rem; }
.cf-pillar p { color: #526a7b; line-height: 1.65; }
.cf-about { display: grid; grid-template-columns: .9fr 1.1fr; gap: clamp(38px, 7vw, 110px); align-items: center; }
.cf-about img { width: 100%; min-height: 340px; object-fit: cover; }
.cf-about p { color: var(--cf-muted); line-height: 1.75; }
#about p { color: #587086; }
.cf-making { margin-top: 84px; padding-top: 42px; border-top: 1px solid rgba(168,187,201,.22); }
.cf-making__intro { max-width: 760px; }
.cf-making h3 { margin: 12px 0 16px; color: var(--cf-text); font-family: 'Space Grotesk', Inter, Arial, sans-serif; font-size: clamp(1.9rem, 3vw, 2.75rem); letter-spacing: -.04em; line-height: 1.05; }
.cf-making__intro p { max-width: 680px; color: var(--cf-muted); line-height: 1.7; }
.cf-making__grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 28px; margin-top: 36px; }
.cf-making__grid > div { padding-top: 18px; border-top: 2px solid var(--cf-cyan); }
.cf-making h4 { margin: 0 0 9px; color: var(--cf-text); font-size: 1.05rem; }
.cf-making__grid p { margin: 0; color: var(--cf-muted); line-height: 1.65; }
.cf-contact { display: grid; grid-template-columns: 1.1fr .9fr; gap: clamp(38px, 7vw, 110px); align-items: center; }
.cf-contact h2 { max-width: 650px; }
.cf-contact__details { display: grid; gap: 12px; }
.cf-contact__details a { display: grid; gap: 5px; padding: 21px 22px; border: 1px solid #d7e0e6; background: #fff; color: var(--cf-ink); text-decoration: none; }
.cf-contact__details a:hover { border-color: var(--cf-cyan-deep); background: #eafaff; }
.cf-contact__details span { color: #587086; font-family: 'JetBrains Mono', monospace; font-size: .72rem; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; }
.cf-contact__details strong { font-size: 1rem; overflow-wrap: anywhere; }
.cf-footer { border-top: 1px solid rgba(168,187,201,.16); padding: 38px 0; color: var(--cf-muted); font-size: .85rem; }
.cf-footer__inner { display: flex; gap: 20px; justify-content: space-between; flex-wrap: wrap; }
.cf-footer__links { display: flex; gap: 18px; }
.cf-footer__links a { color: var(--cf-muted); text-decoration: none; }
.cf-footer__links a:hover, .cf-footer__links a:focus-visible { color: var(--cf-cyan); text-decoration: underline; }
.cf-episode { background: var(--cf-paper); color: var(--cf-ink); padding-bottom: 90px; }
.cf-episode__masthead { padding: 90px 0 55px; color: var(--cf-text); background: linear-gradient(125deg, #07111c, #0d2436); }
.cf-episode__masthead h1 { color: var(--cf-text) !important; }
.cf-episode__masthead .cf-eyebrow { color: var(--cf-cyan) !important; }
.cf-episode__masthead .cf-episode__intro { color: #d4e1e9 !important; }
.cf-episode h1 { max-width: 900px; margin: 12px 0 18px; font-size: clamp(2.8rem, 5vw, 5rem); }
.cf-episode__intro { max-width: 740px; color: #c7d8e3; font-size: 1.15rem; line-height: 1.7; }
.cf-episode__content { display: grid; grid-template-columns: minmax(0,1.65fr) minmax(280px,.65fr); gap: 58px; padding-top: 65px; }
.cf-video { position: relative; aspect-ratio: 16 / 9; overflow: hidden; background: #07111c; }
.cf-video iframe { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; }
.cf-article-video {
  max-width: 720px;
  margin: 2rem auto;
}
.cf-article-video video {
  display: block;
  width: 100%;
  height: auto;
  max-height: 78vh;
  background: #071b2a;
  border: 1px solid #31556b;
}
.cf-article-video figcaption {
  margin-top: .75rem;
  color: #577186;
  font-size: .92rem;
  line-height: 1.55;
}
.cf-copy h2 { margin-top: 52px; font-size: 2rem; }
.cf-copy p, .cf-copy li { color: #526a7b; line-height: 1.7; }
.cf-copy ul { padding-left: 1.3em; }
.cf-download { margin-top: 38px; padding: 28px; border: 1px solid #b8e9f1; background: #eafaff; }
.cf-download h2 { margin: 10px 0 8px; font-size: 1.55rem; }
.cf-download p { margin: 0 0 20px; }
.cf-download .cf-actions { margin-top: 0; }
.cf-download .cf-button--ghost { color: var(--cf-ink); border-color: #536f85; }
.cf-download .cf-button--ghost:hover, .cf-download .cf-button--ghost:focus-visible { color: #005f89; border-color: var(--cf-cyan-deep); background: #fff; }
.cf-aside { align-self: start; padding: 26px; border: 1px solid #d7e0e6; background: #fff; }
.cf-aside h2 { margin-top: 0; font-size: 1.1rem; }
.cf-aside ol { padding-left: 1.25em; color: #526a7b; line-height: 1.75; }
.cf-lesson-progress { margin-top: 24px; padding-top: 22px; border-top: 1px solid #d7e0e6; }
.cf-lesson-progress__heading { display: flex; align-items: center; justify-content: space-between; gap: 14px; }
.cf-lesson-progress__heading strong { color: var(--cf-ink); font-size: .9rem; }
.cf-lesson-progress__heading span { color: #087b92; font-family: 'JetBrains Mono',Consolas,monospace; font-size: .78rem; font-weight: 800; }
.cf-lesson-progress progress { display: block; width: 100%; height: 10px; margin: 12px 0 9px; accent-color: var(--cf-cyan-deep); }
.cf-lesson-progress small { display: block; color: #526a7b; font-size: .76rem; line-height: 1.5; }
.cf-note { margin-top: 44px; padding: 22px; border-left: 3px solid var(--cf-amber); background: #fff8e9; color: #5e4c27; line-height: 1.65; }
.cf-policy { padding: 100px 0; }
.cf-policy__content { max-width: 860px; }
.cf-policy h1 { margin: 0 0 14px; font-size: clamp(2.5rem, 5vw, 4.8rem); line-height: 1; }
.cf-policy h2 { margin: 48px 0 12px; font-size: 1.4rem; color: #151d2a; }
.cf-policy p, .cf-policy li { color: #53657b; line-height: 1.8; }
.cf-policy ul { padding-left: 1.3rem; }
.cf-policy a { color: #007baf; text-decoration-thickness: 1px; }
@media (max-width: 820px) { .cf-shell { width: min(100% - 32px, 1180px); } .cf-header__inner { height: 66px; } .cf-nav { display: none; } .cf-hero { min-height: 610px; } .cf-hero::after { background: linear-gradient(90deg, rgba(5,15,25,.93), rgba(5,15,25,.68)); } .cf-hero__content { padding: 95px 0 62px; } .cf-episodes, .cf-pillars, .cf-learning-note, .cf-about, .cf-contact, .cf-making__grid, .cf-episode__content { grid-template-columns: 1fr; } .cf-section { padding: 72px 0; } .cf-about img { min-height: 250px; } .cf-making { margin-top: 60px; } }

/* Learning platform v2 */
.cf-menu-toggle { display: none; border: 1px solid var(--cf-line); background: transparent; color: var(--cf-text); padding: 10px 13px; font: inherit; font-weight: 700; }
.cf-button--compact { padding: 10px 14px; white-space: nowrap; }
.cf-language { min-width: 36px; text-align: center; border-left: 1px solid var(--cf-line); padding-left: 18px; color: var(--cf-cyan) !important; font-weight: 800; }
.cf-install-trigger { appearance: none; border: 0; background: transparent; color: var(--cf-muted); padding: 0; font: inherit; cursor: pointer; }
.cf-install-trigger:hover, .cf-install-trigger:focus-visible { color: var(--cf-cyan); }
.cf-install-dialog { width: min(520px, calc(100% - 32px)); border: 1px solid var(--cf-line); background: var(--cf-panel); color: var(--cf-text); padding: 30px; box-shadow: 0 24px 80px rgba(0,0,0,.5); }
.cf-install-dialog::backdrop { background: rgba(2,9,15,.76); }
.cf-install-dialog h2 { margin: 0 42px 16px 0; color: var(--cf-text) !important; font-family: 'Space Grotesk',Inter,sans-serif; }
.cf-install-dialog p { margin: 0; color: var(--cf-muted); line-height: 1.7; }
.cf-install-dialog__close { position: absolute; top: 14px; right: 16px; border: 0; background: transparent; color: var(--cf-text); font-size: 2rem; line-height: 1; cursor: pointer; }
.cf-install-dialog__actions { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 24px; }
.cf-install-dialog .cf-button--ghost { border: 1px solid var(--cf-line); background: transparent; color: var(--cf-text); }
.cf-passkey-block { margin-top: 26px; padding-top: 24px; border-top: 1px solid var(--cf-line); }
.cf-passkey-block h2 { margin: 0 0 8px; color: var(--cf-text) !important; font-size: 1.2rem; }
.cf-passkey-block > p { margin: 0 0 18px; color: var(--cf-muted); font-size: .9rem; line-height: 1.65; }
.cf-passkey-separator { display: flex; align-items: center; gap: 12px; margin: -34px 0 22px; color: var(--cf-muted); font-size: .78rem; text-transform: uppercase; }
.cf-passkey-separator::before, .cf-passkey-separator::after { content: ''; flex: 1; height: 1px; background: var(--cf-line); }
.cf-passkey-separator span { padding: 0 6px; background: var(--cf-panel); }
.cf-passkey-block--settings { margin-top: 30px; }
.cf-passkey-block button, .cf-passkey-block input[type='submit'], .cf-passkey-block .button { min-height: 48px; border: 0; border-radius: 0; background: var(--cf-cyan); color: #041018; padding: 12px 18px; font: inherit; font-weight: 800; cursor: pointer; }
.cf-passkey-block input[type='text'] { width: 100%; border: 1px solid var(--cf-line); background: #081725; color: var(--cf-text); padding: 13px 14px; }
.cf-passkey-block table { width: 100%; margin-top: 16px; border-collapse: collapse; color: var(--cf-text); font-size: .85rem; }
.cf-passkey-block th, .cf-passkey-block td { padding: 10px 8px; border-bottom: 1px solid var(--cf-line); text-align: left; }
.cf-passkey-block #passkey_app > div > h3:first-child, .cf-passkey-block #passkey_app > div > h3:first-child + p { display: none; }
.cf-passkey-block .list-group-item { margin-top: 12px; padding: 12px 0; border-top: 1px solid var(--cf-line); color: var(--cf-muted); }
.cf-passkey-block .available-passkeys { color: var(--cf-cyan); }
.cf-masthead { padding: 92px 0 64px; background: radial-gradient(circle at 85% 10%, rgba(32,211,230,.12), transparent 30%), linear-gradient(125deg,#07111c,#0d2436); background-color: #07111c; color: var(--cf-text); }
.cf-masthead h1 { max-width: 900px; margin: 14px 0 18px; font-family: 'Space Grotesk',Inter,sans-serif; font-size: clamp(2.8rem,6vw,5.8rem); line-height: .98; letter-spacing: -.05em; overflow-wrap: anywhere; }
.cf-masthead h1,
.cf-masthead h2,
.cf-masthead h3 { color: var(--cf-text) !important; }
.cf-masthead p { max-width: 760px; color: #c7d8e3; font-size: 1.15rem; line-height: 1.7; }
.cf-breadcrumb { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 25px; color: var(--cf-muted); font-size: .82rem; }
.cf-breadcrumb a { color: var(--cf-muted); }
.cf-catalogue { min-height: 70vh; background: var(--cf-navy); color: var(--cf-text); }
.cf-grid { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 20px; }
.cf-card { min-height: 260px; display: flex; flex-direction: column; align-items: flex-start; padding: 30px; border: 1px solid var(--cf-line); background: var(--cf-panel); }
.cf-card h2,.cf-card h3 { margin: 18px 0 10px; font-family: 'Space Grotesk',Inter,sans-serif; font-size: 1.55rem; }
.cf-card h1,
.cf-card h2,
.cf-card h3,
.cf-card strong { color: var(--cf-text) !important; }
.cf-card p,
.cf-card small { flex: 1; color: var(--cf-muted) !important; line-height: 1.65; }
.cf-card a { color: var(--cf-cyan); font-weight: 800; text-decoration: none; }
.cf-empty { padding: 48px; border: 1px solid var(--cf-line); background: var(--cf-panel); }
.cf-empty h1,
.cf-empty h2,
.cf-empty h3,
.cf-empty strong { color: var(--cf-text) !important; }
.cf-empty p,
.cf-empty small { color: var(--cf-muted) !important; }
.cf-empty .cf-button { color: #02131c !important; }
.cf-empty .cf-button:hover,
.cf-empty .cf-button:focus-visible { color: var(--cf-cyan) !important; }

/* Mandatory contrast standard for every dark Control Foundry surface. */
.cf-section--panel h1,
.cf-section--panel h2,
.cf-section--panel h3,
.cf-learning-note > div h1,
.cf-learning-note > div h2,
.cf-learning-note > div h3,
.cf-progress h1,
.cf-progress h2,
.cf-progress h3,
.cf-progress strong,
.cf-card h1,
.cf-card h2,
.cf-card h3,
.cf-card strong,
.cf-empty h1,
.cf-empty h2,
.cf-empty h3,
.cf-empty strong { color: var(--cf-text) !important; }

.cf-section--panel p,
.cf-section--panel small,
.cf-learning-note > div p,
.cf-learning-note > div small,
.cf-progress p,
.cf-progress small,
.cf-card p,
.cf-card small,
.cf-empty p,
.cf-empty small { color: var(--cf-muted) !important; }
.cf-list { display: grid; margin-top: 24px; border-top: 1px solid var(--cf-line); }
.cf-training-content { background: var(--cf-paper); color: var(--cf-ink); }
.cf-training-content h2 { color: var(--cf-ink) !important; }
.cf-lesson-row { display: grid; grid-template-columns: 62px 1fr auto; gap: 20px; align-items: center; padding: 22px 12px; border-bottom: 1px solid #9bb4c5; background: #eaf8fc; color: var(--cf-ink) !important; text-decoration: none; }
.cf-lesson-row:hover { background: #d9f3f8; }
.cf-lesson-row strong { color: #154b73 !important; }
.cf-lesson-row small { display: block; margin-top: 5px; color: #58778d !important; }
.cf-lesson-state { color: #31556e; font-weight: 700; }
.cf-lesson-number { color: var(--cf-cyan); font-family: 'JetBrains Mono',monospace; font-size: 1.2rem; }
.cf-progress { max-width: 720px; margin: 0 0 58px; padding: 24px; border: 1px solid var(--cf-line); background: var(--cf-panel); color: var(--cf-text); }
.cf-progress div { display: flex; justify-content: space-between; }
.cf-progress strong, .cf-progress span { color: var(--cf-text) !important; }
.cf-progress progress { width: 100%; height: 10px; margin: 15px 0 7px; accent-color: var(--cf-cyan); }
.cf-progress small { color: #c3d3dd !important; }
.cf-training-content > .cf-shell > .cf-actions .cf-button--ghost {
  background: #fff;
  border-color: #536f85;
  color: #07111c;
}
.cf-training-content > .cf-shell > .cf-actions .cf-button--ghost:hover,
.cf-training-content > .cf-shell > .cf-actions .cf-button--ghost:focus-visible {
  background: #e4f7fa;
  border-color: var(--cf-cyan-deep);
  color: #005f89;
}
.cf-aside a { color: #31556e; }
.cf-quiz { margin-top: 38px; padding: 28px; border: 1px solid #c2dbe4; background: #fff; }
.cf-quiz h3 { margin: 12px 0 20px; }
.cf-answers { display: grid; gap: 10px; }
.cf-answers button { padding: 14px 16px; border: 1px solid #bdcdd7; background: #f4f8fb; color: var(--cf-ink); text-align: left; font: inherit; cursor: pointer; }
.cf-answers button:hover,
.cf-answers button:focus-visible { border-color: var(--cf-cyan-deep) !important; background: #dff7fb !important; color: #07111c !important; }
.cf-feedback { min-height: 28px; font-weight: 700; }
.cf-section--about { background: var(--cf-navy); color: var(--cf-text); }
.cf-section--about h1,
.cf-section--about h2,
.cf-section--about h3 { color: var(--cf-text) !important; }
.cf-section--about p { color: var(--cf-muted) !important; }
.cf-account { min-height: 72vh; padding: 82px 24px; background: radial-gradient(circle at 15% 10%, rgba(32,211,230,.1), transparent 30%), var(--cf-navy); color: var(--cf-text); }
.cf-account__shell { width: min(1060px,100%); margin: 0 auto; display: grid; grid-template-columns: .9fr 1.1fr; gap: clamp(42px,8vw,110px); align-items: start; }
.cf-account__intro { padding-top: 28px; }
.cf-account__intro h1 { margin: 15px 0 20px; color: var(--cf-text) !important; font-family: 'Space Grotesk',Inter,sans-serif; font-size: clamp(3rem,6vw,5.5rem); line-height: .95; letter-spacing: -.05em; }
.cf-account__intro p { max-width: 470px; color: var(--cf-muted) !important; font-size: 1.08rem; line-height: 1.7; }
.cf-account__panel { padding: clamp(26px,5vw,46px); border: 1px solid var(--cf-line); background: var(--cf-panel); color: var(--cf-text); }
.cf-form { display: grid; gap: 20px; }
.cf-form label { display: grid; gap: 8px; color: var(--cf-text) !important; font-size: .88rem; font-weight: 700; }
.cf-form input:not([type="checkbox"]),.cf-form select { width: 100%; min-height: 50px; padding: 11px 13px; border: 1px solid #456078; border-radius: 2px; background: #071522; color: #f4fbff !important; -webkit-text-fill-color: #f4fbff; caret-color: var(--cf-cyan); font: inherit; }
.cf-form input:-webkit-autofill,.cf-form input:-webkit-autofill:hover,.cf-form input:-webkit-autofill:focus { -webkit-text-fill-color: #f4fbff; -webkit-box-shadow: 0 0 0 1000px #071522 inset; box-shadow: 0 0 0 1000px #071522 inset; caret-color: var(--cf-cyan); }
.cf-form input:focus,.cf-form select:focus { outline: 2px solid var(--cf-cyan); outline-offset: 2px; border-color: var(--cf-cyan); }
.cf-form input:disabled { opacity: .68; }
.cf-form .cf-check { grid-template-columns: 20px 1fr; gap: 11px; align-items: start; font-weight: 500; line-height: 1.5; }
.cf-form .cf-check input { width: 18px; height: 18px; margin: 2px 0 0; accent-color: var(--cf-cyan); }
.cf-form .cf-check span { color: #c4d5df; }
.cf-form .cf-button { justify-self: start; border: 0; cursor: pointer; }
.cf-form-links { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 12px 22px; margin-top: 28px; padding-top: 22px; border-top: 1px solid var(--cf-line); }
.cf-form-links a { color: var(--cf-cyan); font-weight: 700; }
.cf-form-message { margin-bottom: 24px; padding: 14px 16px; border-left: 3px solid var(--cf-cyan); background: #10283a; color: var(--cf-text); line-height: 1.55; }
.cf-library__save { margin-top: 28px; }
.cf-workspace__summary { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 1px; margin-bottom: 70px; border: 1px solid var(--cf-line); background: var(--cf-line); }
.cf-workspace__summary > div { display: grid; gap: 5px; padding: 26px; background: var(--cf-panel); }
.cf-workspace__summary strong { color: var(--cf-cyan); font: 700 2.3rem/1 'Space Grotesk',Inter,sans-serif; }
.cf-workspace__summary span { color: var(--cf-muted); }
.cf-workspace__section + .cf-workspace__section { margin-top: 72px; padding-top: 64px; border-top: 1px solid var(--cf-line); }
.cf-workspace__heading { display: flex; justify-content: space-between; align-items: end; gap: 24px; margin-bottom: 28px; }
.cf-workspace__heading h2 { margin: 8px 0 0; color: var(--cf-text); font-size: clamp(1.9rem,4vw,3rem); }
.cf-workspace-card progress { width: 100%; height: 10px; margin: 12px 0 20px; accent-color: var(--cf-cyan); }
.cf-workspace-card__actions { display: flex; flex-wrap: wrap; gap: 12px 18px; }
.cf-workspace-card__actions button,.cf-collection-list button,.cf-workspace-item form button:not(.cf-button) { padding: 0; border: 0; background: transparent; color: var(--cf-cyan); font: inherit; font-weight: 700; cursor: pointer; }
.cf-workspace-form { display: grid; grid-template-columns: minmax(220px,1fr) auto auto; gap: 10px; margin-bottom: 12px; }
.cf-workspace-form input,.cf-workspace-item input,.cf-workspace-item select,.cf-workspace-item textarea { width: 100%; padding: 12px 13px; border: 1px solid #456078; background: #071522; color: var(--cf-text); font: inherit; }
.cf-workspace-form button { padding: 10px 16px; border: 1px solid #456078; background: #10283a; color: var(--cf-text); cursor: pointer; }
.cf-workspace-form--new { max-width: 720px; margin-bottom: 28px; }
.cf-workspace-library { display: grid; gap: 20px; }
.cf-workspace-item { display: grid; grid-template-columns: minmax(230px,.75fr) minmax(0,1.5fr); gap: 32px; padding: 26px; border: 1px solid var(--cf-line); background: var(--cf-panel); }
.cf-workspace-item h3 { margin: 10px 0 0; }
.cf-workspace-item h3 a { color: var(--cf-text); }
.cf-workspace-item form { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 15px; }
.cf-workspace-item label { display: grid; gap: 7px; color: var(--cf-muted); font-size: .82rem; font-weight: 700; }
.cf-workspace-item__note,.cf-workspace-item form > div { grid-column: 1 / -1; }
.cf-workspace-item form > div { display: flex; align-items: center; gap: 20px; }
.cf-workspace-item form.is-saved::after { content: '✓'; color: var(--cf-cyan); font-weight: 900; }
@media (max-width: 760px) {
  .cf-workspace__summary,.cf-workspace-item { grid-template-columns: 1fr; }
  .cf-workspace__heading { align-items: flex-start; flex-direction: column; }
  .cf-workspace-form,.cf-workspace-item form { grid-template-columns: 1fr; }
  .cf-workspace-item__note,.cf-workspace-item form > div { grid-column: auto; }
}
@media (max-width: 900px) {
  .cf-masthead h1 { max-width: 100%; font-size: clamp(2.45rem,8vw,4.15rem); letter-spacing: -.035em; }
}

/* Shared Control Foundry standard for migrated Knowledge and Resources. */
.cf-library { min-height: 70vh; background: var(--cf-paper); color: var(--cf-ink); }
.cf-library__masthead { padding: 82px 0 62px; background: radial-gradient(circle at 88% 8%, rgba(32,211,230,.13), transparent 28%), linear-gradient(125deg,#07111c,#0d2436); color: var(--cf-text); }
.cf-library__masthead h1 { max-width: 930px; margin: 16px 0 18px; color: var(--cf-text); font-family: 'Space Grotesk',Inter,sans-serif; font-size: clamp(2.8rem,6vw,5.4rem); line-height: .98; letter-spacing: -.05em; }
.cf-library__intro { max-width: 760px; margin: 0; color: #d4e1e9; font-size: 1.14rem; line-height: 1.7; }
.cf-library__meta { display: flex; flex-wrap: wrap; gap: 10px 22px; margin-top: 28px; color: var(--cf-muted); font-family: 'JetBrains Mono',monospace; font-size: .74rem; font-weight: 600; letter-spacing: .05em; text-transform: uppercase; }
.cf-library__meta span + span { position: relative; padding-left: 22px; }
.cf-library__meta span + span::before { content: ''; position: absolute; top: 50%; left: 0; width: 4px; height: 4px; border-radius: 50%; background: var(--cf-cyan); transform: translateY(-50%); }
.cf-library__surface { padding: 70px 0 100px; }
.cf-library__layout { display: grid; grid-template-columns: minmax(0,1.7fr) minmax(270px,.63fr); gap: clamp(42px,6vw,88px); align-items: start; }
.cf-library__article { min-width: 0; }
.cf-library__cover { margin: 0 0 42px; overflow: hidden; border: 1px solid #d7e0e6; background: #e8eef3; }
.cf-library__cover img { display: block; width: 100%; max-height: 520px; object-fit: cover; }
.cf-content-body { color: #263c4d; font-size: 1.02rem; line-height: 1.78; }
.cf-content-body .cf-lead { color: #263c4d; }
.cf-content-body > :first-child { margin-top: 0; }
.cf-content-body h2,.cf-content-body h3,.cf-content-body h4 { color: var(--cf-ink); font-family: 'Space Grotesk',Inter,sans-serif; line-height: 1.15; }
.cf-content-body h2 { margin: 60px 0 18px; padding-top: 18px; border-top: 2px solid var(--cf-cyan); font-size: clamp(1.8rem,3vw,2.45rem); }
.cf-content-body h3 { margin: 38px 0 14px; font-size: 1.42rem; }
.cf-content-body p,.cf-content-body ul,.cf-content-body ol { margin: 0 0 22px; }
.cf-content-body li + li { margin-top: 8px; }
.cf-content-body a { color: #006f9f; text-decoration-thickness: 1px; text-underline-offset: 3px; }
.cf-content-body img { max-width: 100%; height: auto; border: 1px solid #d7e0e6; }
.cf-content-body .cf-table-wrap { max-width: 100%; overflow-x: auto; }
.cf-resource-action { width: 58px; text-align: center; }
.cf-resource-toggle,.cf-remove-icon { display: inline-grid; place-items: center; width: 38px; height: 38px; padding: 0; border: 1px solid var(--cf-cyan); border-radius: 3px; background: transparent; color: #062032; font: 800 1.35rem/1 Inter,sans-serif; cursor: pointer; }
.cf-resource-toggle[data-saved="1"] { background: var(--cf-cyan); color: #061725; }
.cf-resource-toggle:hover,.cf-resource-toggle:focus-visible { background: var(--cf-cyan); color: #061725; outline: 2px solid #071522; outline-offset: 2px; }
.cf-resource-library { display: grid; gap: 1px; border: 1px solid var(--cf-line); background: var(--cf-line); }
.cf-resource-library__row { display: flex; justify-content: space-between; align-items: center; gap: 24px; padding: 22px 24px; background: var(--cf-panel); }
.cf-resource-library__row span { color: var(--cf-muted); font-size: .8rem; text-transform: uppercase; letter-spacing: .08em; }
.cf-resource-library__row h3 { margin: 5px 0 0; font-size: 1.05rem; }
.cf-resource-library__row h3 a { color: var(--cf-text); }
.cf-resource-library__row .cf-remove-icon { flex: 0 0 auto; color: var(--cf-cyan); }
.cf-resource-library__row .cf-remove-icon:hover,.cf-resource-library__row .cf-remove-icon:focus-visible { background: var(--cf-cyan); color: #061725; }
.cf-resource-library__row .cf-remove-icon.is-undo,
.cf-remove-icon.is-undo {
  width: auto;
  min-width: 86px;
  height: 30px;
  padding: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
  color: var(--cf-cyan);
  font: 700 .78rem/1 Inter,sans-serif;
  white-space: nowrap;
  letter-spacing: .01em;
}
.cf-resource-library__row .cf-remove-icon.is-undo:hover,
.cf-resource-library__row .cf-remove-icon.is-undo:focus-visible,
.cf-remove-icon.is-undo:hover,
.cf-remove-icon.is-undo:focus-visible {
  background: transparent;
  color: var(--cf-text);
  text-decoration: underline;
  text-underline-offset: 4px;
  outline: 0;
}
.cf-content-body table { width: 100%; margin: 30px 0; border-collapse: collapse; font-size: .92rem; }
.cf-content-body th,.cf-content-body td { padding: 13px 14px; border: 1px solid #ccd9e2; text-align: left; vertical-align: top; }
.cf-content-body th { background: #102233; color: var(--cf-text); }
.cf-content-body tr:nth-child(even) td { background: #edf4f7; }
.cf-content-body pre,.cf-content-body code { font-family: 'JetBrains Mono',Consolas,monospace; }
.cf-content-body pre { max-width: 100%; overflow-x: auto; padding: 20px; background: #0b1725; color: #dcecf3; border-left: 3px solid var(--cf-cyan); }
.cf-content-body blockquote,.cf-content-body .cf-tech-note,.cf-content-body .cf-warning { margin: 34px 0; padding: 22px 24px; border-left: 3px solid var(--cf-cyan); background: #eafaff; color: #244354; }
.cf-content-body .cf-warning { border-left-color: var(--cf-amber); background: #fff8e9; color: #5e4c27; }
.cf-content-body .cf-source { margin-top: 48px; padding-top: 20px; border-top: 1px solid #ccd9e2; color: #587086; font-size: .88rem; }
.cf-content-body .cf-step { margin: 34px 0; padding: 26px; border: 1px solid #cbd9e2; background: #fff; }
.cf-content-body .cf-step__number { display: inline-flex; align-items: center; justify-content: center; min-width: 42px; height: 30px; margin-bottom: 14px; padding: 0 10px; background: var(--cf-cyan); color: #07111c; font-family: 'JetBrains Mono',Consolas,monospace; font-size: .76rem; font-weight: 800; letter-spacing: .06em; }
.cf-content-body .cf-step h3 { margin-top: 0; }
.cf-content-body .cf-step figure { margin: 22px 0 0; }
.cf-content-body .cf-step figure img { display: block; width: 100%; background: #e8eef3; }
.cf-content-body .cf-step figcaption { margin-top: 8px; color: #61788a; font-size: .8rem; line-height: 1.5; }
.cf-lesson-body { color: #263c4d; line-height: 1.75; }
.cf-lesson-body h2,.cf-lesson-body h3,.cf-lesson-body h4 { color: var(--cf-ink) !important; }
.cf-lesson-body h2 { margin-top: 48px; padding-top: 16px; border-top: 2px solid var(--cf-cyan); }
.cf-lesson-body .cf-step { margin: 34px 0; padding: 26px; border: 1px solid #cbd9e2; background: #fff; color: #263c4d; }
.cf-lesson-body .cf-step h3 { margin-top: 0; color: var(--cf-ink) !important; }
.cf-lesson-body .cf-step p,.cf-lesson-body .cf-step li,.cf-lesson-body .cf-step strong { color: #355166 !important; }
.cf-lesson-body .cf-step__number { display: inline-flex; align-items: center; justify-content: center; min-width: 42px; height: 30px; margin-bottom: 14px; padding: 0 10px; background: var(--cf-cyan); color: #07111c !important; font-family: 'JetBrains Mono',Consolas,monospace; font-size: .76rem; font-weight: 800; letter-spacing: .06em; }
.cf-lesson-body table { width: 100%; margin: 26px 0; border-collapse: collapse; font-size: .86rem; }
.cf-lesson-body th,.cf-lesson-body td { padding: 11px 12px; border: 1px solid #315269; text-align: left; vertical-align: top; }
.cf-lesson-body td { color: #18364a; }
.cf-lesson-body th { background: #10283a; color: var(--cf-text); }
.cf-lesson-body .cf-tech-note,.cf-lesson-body .cf-warning { margin: 26px 0; padding: 20px 22px; border-left: 3px solid var(--cf-cyan); background: #10283a; color: #d4e1e9; }
.cf-lesson-body .cf-warning { border-left-color: var(--cf-amber); }
.cf-lesson-body figure { margin: 26px 0; }
.cf-lesson-body figure img { display: block; width: 100%; height: auto; border: 1px solid #315269; background: #07111c; }
.cf-lesson-body figcaption { margin-top: 8px; color: var(--cf-muted); font-size: .8rem; }
.cf-figure-description { margin: -14px 0 30px; padding: 18px 20px; border: 1px solid #cbd9e2; border-top: 3px solid var(--cf-cyan-deep); background: #f7fbfd; color: #263c4d; }
.cf-figure-description > strong { display: block; margin-bottom: 10px; color: #087b92 !important; font: 800 .76rem/1.35 'JetBrains Mono',Consolas,monospace; letter-spacing: .07em; text-transform: uppercase; }
.cf-figure-description ol { margin: 0; padding-left: 1.35em; }
.cf-figure-description li { color: #355166 !important; line-height: 1.65; }
.cf-figure-description li + li { margin-top: 7px; }
.cf-lesson-nav { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 14px; margin-top: 28px; padding-top: 28px; border-top: 1px solid var(--cf-line); }
.cf-lesson-nav .cf-button--ghost {
  background: #fff !important;
  border-color: #536f85 !important;
  color: #07111c !important;
}
.cf-lesson-nav .cf-button--ghost:hover,
.cf-lesson-nav .cf-button--ghost:focus-visible {
  background: #e4f7fa !important;
  border-color: var(--cf-cyan-deep) !important;
  color: #005f89 !important;
}
.cf-lesson-nav .cf-button:not(.cf-button--ghost) { color: #02131c !important; }
.cf-lesson-nav .cf-button:not(.cf-button--ghost):hover,
.cf-lesson-nav .cf-button:not(.cf-button--ghost):focus-visible {
  background: #e4f7fa;
  border-color: var(--cf-cyan-deep);
  color: #005f89 !important;
}
.cf-lesson-part + .cf-lesson-part { margin-top: 46px; }
.cf-module-divider { margin: 48px 0; border: 0; border-top: 1px solid var(--cf-line); }
.cf-lesson-body { counter-reset: cf-section; }
.cf-lesson-part h2 { display: flex; align-items: flex-start; gap: 12px; counter-increment: cf-section; }
.cf-lesson-part h2::before { content: counter(cf-section); flex: 0 0 32px; display: inline-flex; align-items: center; justify-content: center; height: 32px; margin-top: 1px; border-radius: 50%; background: var(--cf-cyan); color: #07111c; font: 800 .82rem/1 'JetBrains Mono',Consolas,monospace; }
.cf-part-purpose, .cf-concept, .cf-ui-path { margin: 20px 0 26px; padding: 20px 22px; border-left: 4px solid var(--cf-cyan); background: #e9f8fb; color: #102537; }
.cf-part-purpose strong, .cf-concept > strong, .cf-ui-path > span { display: block; margin-bottom: 7px; color: #087b92; font: 800 .76rem/1.3 'JetBrains Mono',Consolas,monospace; letter-spacing: .08em; text-transform: uppercase; }
.cf-part-purpose p, .cf-concept p, .cf-ui-path p { margin: 0; color: #29485d; }
.cf-ui-path { border: 1px solid #c2dbe4; border-left: 4px solid #17384e; background: #fff; }
.cf-ui-path > strong { display: block; margin-bottom: 7px; color: #07111c; font-size: 1rem; }
.cf-control-word table { min-width: 980px; background: #fff; }
.cf-control-word th { background: #102d40; color: #fff; }
.cf-control-word td { color: #18364a !important; vertical-align: top; line-height: 1.55; }
.cf-control-word tbody tr:nth-child(even) td { background: #e8f3f7; }
.cf-control-word tbody tr:hover td { background: #d9f4f8; color: #07111c !important; }
.cf-control-word td:first-child { color: #087b92 !important; font-weight: 900; }
.cf-learning-formats { padding-top: 74px; }
.cf-format-group + .cf-format-group { margin-top: 76px; padding-top: 70px; border-top: 1px solid var(--cf-line); }
.cf-format-group__header { display: grid; grid-template-columns: 54px minmax(0,700px); gap: 20px; align-items: start; margin-bottom: 30px; }
.cf-format-group__header h2 { margin: 0 0 8px; color: var(--cf-text); font-size: clamp(1.8rem,3vw,2.55rem); }
.cf-format-group__header p { margin: 0; color: var(--cf-muted); line-height: 1.65; }
.cf-format-icon { display: inline-flex; align-items: center; justify-content: center; width: 54px; height: 54px; border: 1px solid var(--cf-cyan); background: #10283a; color: var(--cf-cyan); font: 800 1.25rem/1 'JetBrains Mono',Consolas,monospace; }
.cf-format-group--guide .cf-format-icon { border-color: #7390a3; color: #d5e3ea; }
.cf-training-card { position: relative; min-height: 318px; }
.cf-training-card--video { border-top: 3px solid var(--cf-cyan); }
.cf-training-card--guide { border-top: 3px solid #7390a3; }
.cf-training-card__meta { display: flex; align-items: center; justify-content: space-between; gap: 15px; margin-bottom: 18px; }
.cf-training-card__meta > span:last-child { color: #9cb2c0; font-family: 'JetBrains Mono',Consolas,monospace; font-size: .72rem; font-weight: 700; }
.cf-training-card h3 { margin: 0 0 20px; font-size: 1.5rem; }
@media (max-width: 720px) {
  .cf-lesson-part h2 { gap: 9px; }
  .cf-lesson-part h2::before { flex-basis: 28px; height: 28px; }
  .cf-part-purpose, .cf-concept, .cf-ui-path { padding: 17px; }
  .cf-learning-formats { padding-top: 52px; }
  .cf-format-group + .cf-format-group { margin-top: 54px; padding-top: 48px; }
  .cf-format-group__header { grid-template-columns: 44px 1fr; gap: 14px; }
  .cf-format-icon { width: 44px; height: 44px; }
}
.cf-library__aside { position: sticky; top: 116px; padding: 28px; border: 1px solid #c9d8e1; background: #fff; }
.cf-library__aside h2 { margin: 13px 0 12px; color: var(--cf-ink); font-size: 1.35rem; line-height: 1.18; }
.cf-library__aside p { color: #526a7b; line-height: 1.65; }
.cf-library__aside dl { margin: 24px 0; border-top: 1px solid #d7e0e6; }
.cf-library__aside dl div { display: grid; grid-template-columns: 82px 1fr; gap: 12px; padding: 13px 0; border-bottom: 1px solid #d7e0e6; }
.cf-library__aside dt { color: #678092; font-size: .72rem; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; }
.cf-library__aside dd { margin: 0; color: var(--cf-ink); font-size: .88rem; font-weight: 700; }
.cf-library__aside .cf-button--ghost { width: 100%; color: var(--cf-ink); border-color: #536f85; }
.cf-library__aside .cf-button--ghost:hover,.cf-library__aside .cf-button--ghost:focus-visible { color: #005f89; border-color: var(--cf-cyan-deep); background: #e4f7fa; }

.cf-emc-figure {
  margin: 34px 0 44px;
  border: 1px solid #b8ceda;
  background: #fff;
}
.cf-emc-figure img {
  display: block;
  width: 100%;
  height: auto;
  margin: 0;
}
.cf-emc-figure figcaption {
  padding: 16px 20px 18px;
  border-top: 1px solid #c9dbe3;
  color: #38566a;
  font-size: .9rem;
  line-height: 1.6;
}
.cf-emc-figure--portrait {
  max-width: 620px;
  margin-right: auto;
  margin-left: auto;
}
.cf-emc-figure--portrait img {
  max-height: 720px;
  object-fit: contain;
  background: #eef5f8;
}
.cf-emc-figure--compact {
  display: grid;
  grid-template-columns: minmax(240px, 38%) 1fr;
  align-items: center;
}
.cf-emc-figure--compact figcaption {
  align-self: stretch;
  display: flex;
  align-items: center;
  border-top: 0;
  border-left: 1px solid #c9dbe3;
}
.cf-pro-figure,
.cf-pro-video {
  margin: 34px 0 46px;
  overflow: hidden;
  border: 1px solid #b8ceda;
  background: #fff;
}
.cf-pro-figure img,
.cf-pro-video video {
  display: block;
  width: 100%;
  height: auto;
  margin: 0;
  background: #071521;
}
.cf-pro-video video {
  aspect-ratio: 16 / 9;
  object-fit: contain;
}
.cf-pro-figure figcaption,
.cf-pro-video figcaption {
  padding: 16px 20px 18px;
  border-top: 1px solid #c9dbe3;
  color: #38566a;
  font-size: .9rem;
  line-height: 1.6;
}
.cf-media-pair {
  display: grid;
  grid-template-columns: repeat(2,minmax(0,1fr));
  gap: 22px;
  margin: 34px 0 46px;
}
.cf-media-pair .cf-pro-figure {
  display: flex;
  flex-direction: column;
  margin: 0;
}
.cf-media-pair .cf-pro-figure img {
  flex: 1;
  min-height: 260px;
  max-height: 380px;
  object-fit: contain;
  padding: 24px;
  background: #eef5f8;
}
.cf-media-pair .cf-pro-figure figcaption { min-height: 84px; }
.cf-safety-lab {
  --safety-cyan: #30cddd;
  --safety-green: #22a78d;
  --safety-red: #e45145;
  margin: 34px 0 48px;
  overflow: hidden;
  border: 1px solid #34566c;
  background: #071521;
  color: #fff;
}
.cf-safety-lab__header {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 24px;
  padding: 22px 26px;
  border-bottom: 1px solid #34566c;
}
.cf-copy .cf-safety-lab__header span { color: var(--safety-cyan) !important; font: 800 .7rem/1.3 'JetBrains Mono',Consolas,monospace; letter-spacing: .1em; text-transform: uppercase; }
.cf-copy .cf-safety-lab__header h3 { margin: 6px 0 0; color: #f4f8fb !important; font-size: clamp(1.35rem,3vw,2rem); }
.cf-copy .cf-safety-lab__status { max-width: 330px; margin: 0; color: #c4d8e3 !important; line-height: 1.5; text-align: right; }
.cf-safety-machine { position: relative; min-height: 430px; overflow: hidden; background: linear-gradient(180deg,#0b1f2d 0 78%,#102d40 78%); }
.cf-safety-conveyor { position: absolute; left: 12%; right: 12%; top: 57%; height: 72px; border: 4px solid #d7e4e9; border-radius: 36px; }
.cf-safety-conveyor::before { content: ""; position: absolute; inset: 9px 38px; border-top: 4px dashed #7b96a7; border-bottom: 4px dashed #7b96a7; animation: cf-belt 1s linear infinite; }
.cf-safety-wheel { position: absolute; top: 8px; width: 48px; height: 48px; border: 6px solid #fff; border-radius: 50%; background: var(--safety-green); }
.cf-safety-wheel::after { content: ""; position: absolute; inset: 14px; border-radius: 50%; background: #071521; }
.cf-safety-wheel--left { left: 8px; }.cf-safety-wheel--right { right: 8px; }
.cf-safety-package { position: absolute; left: 16%; top: calc(57% - 54px); width: 74px; height: 54px; border: 3px solid var(--safety-cyan); background: #17384e; }
.cf-safety-motor { position: absolute; right: 7%; top: calc(57% + 10px); width: 74px; height: 74px; border: 4px solid var(--safety-cyan); border-radius: 50%; background: #102d40; }
.cf-safety-motor::before { content: "M"; position: absolute; inset: 0; display: grid; place-items: center; font: 900 1.4rem/1 Arial,sans-serif; }
.cf-safety-drive { position: absolute; left: 6%; top: 54px; width: 105px; height: 150px; border: 2px solid #4f7185; background: #132d3d; }
.cf-safety-drive::before { content: "DRIVE"; display: block; padding: 12px; color: var(--safety-cyan); font: 800 .72rem/1 'JetBrains Mono',Consolas,monospace; }
.cf-safety-drive::after { content: ""; position: absolute; left: 18px; right: 18px; top: 50px; height: 54px; border: 1px solid #7590a1; background: repeating-linear-gradient(180deg,#27475a 0 7px,#132d3d 7px 12px); }
.cf-safety-guard { position: absolute; right: 17%; top: 70px; width: 170px; height: 210px; border: 5px solid #7992a3; border-bottom: 0; opacity: 0; transform: translateY(-18px); transition: .35s ease; }
.cf-safety-guard::after { content: ""; position: absolute; right: -13px; top: 76px; width: 20px; height: 34px; background: var(--safety-red); }
.cf-safety-person { position: absolute; right: 7%; top: 100px; width: 50px; height: 130px; opacity: 0; transform: translateX(35px); transition: .35s ease; }
.cf-safety-person::before { content: ""; position: absolute; left: 10px; width: 30px; height: 30px; border-radius: 50%; background: #e7b58e; }
.cf-safety-person::after { content: ""; position: absolute; left: 3px; top: 36px; width: 44px; height: 82px; border-radius: 18px 18px 8px 8px; background: #e9a62f; }
.cf-safety-sensor { position: absolute; left: 46%; top: calc(57% - 92px); width: 12px; height: 68px; background: var(--safety-red); opacity: 0; }
.cf-safety-curtain {
  position: absolute;
  left: 30%;
  top: 132px;
  width: 58px;
  height: 178px;
  border-right: 7px solid #7b96a7;
  border-left: 7px solid #7b96a7;
  opacity: 0;
  transition: opacity .25s ease;
}
.cf-safety-curtain i {
  position: absolute;
  left: 4px;
  right: 4px;
  height: 3px;
  background: #e45145;
  box-shadow: 0 0 9px rgba(228,81,69,.65);
}
.cf-safety-curtain i:nth-child(1) { top: 18px; }
.cf-safety-curtain i:nth-child(2) { top: 50px; }
.cf-safety-curtain i:nth-child(3) { top: 82px; }
.cf-safety-curtain i:nth-child(4) { top: 114px; }
.cf-safety-curtain i:nth-child(5) { top: 146px; }
.cf-safety-wire { position: absolute; left: 145px; right: 110px; top: 156px; border-top: 3px dashed var(--safety-cyan); opacity: 0; }
.cf-safety-events { position: absolute; left: 6%; top: 225px; display: grid; gap: 8px; z-index: 4; }
.cf-safety-events span { min-width: 152px; padding: 8px 11px; border: 1px solid #466b80; background: #102d40; color: #9eb4c1; font: 800 .68rem/1.25 'JetBrains Mono',Consolas,monospace; letter-spacing: .04em; text-transform: uppercase; opacity: .42; }
.cf-safety-events span[hidden] { display: none; }
.cf-safety-lab[data-stage="1"] .cf-safety-sensor,
.cf-safety-lab[data-stage="1"] .cf-safety-wire,
.cf-safety-lab[data-stage="2"] .cf-safety-curtain,
.cf-safety-lab[data-stage="2"] .cf-safety-person,
.cf-safety-lab[data-stage="2"] .cf-safety-wire,
.cf-safety-lab[data-stage="3"] .cf-safety-curtain,
.cf-safety-lab[data-stage="3"] .cf-safety-person,
.cf-safety-lab[data-stage="3"] .cf-safety-wire,
.cf-safety-lab[data-stage="4"] .cf-safety-curtain,
.cf-safety-lab[data-stage="4"] .cf-safety-person,
.cf-safety-lab[data-stage="4"] .cf-safety-wire { opacity: 1; transform: none; }
.cf-safety-lab.is-replaying[data-stage="0"] .cf-safety-package { animation: cf-package-fall 5.8s linear both; }
.cf-safety-lab.is-replaying[data-stage="1"] .cf-safety-package { animation: cf-package-limit 5.8s linear both; }
.cf-safety-lab.is-replaying[data-stage="1"] .cf-safety-sensor { animation: cf-sensor-flash 5.8s linear both; }
.cf-safety-lab.is-replaying[data-stage="2"] .cf-safety-package { animation: cf-package-coast 5.8s linear both; }
.cf-safety-lab.is-replaying[data-stage="3"] .cf-safety-package { animation: cf-package-stop 5.8s linear both; }
.cf-safety-lab.is-replaying[data-stage="4"] .cf-safety-package { animation: cf-package-slow 14s linear both; }
.cf-safety-lab.is-replaying[data-stage="1"] .cf-safety-conveyor::before { animation: cf-belt-limit 5.8s linear both; }
.cf-safety-lab.is-replaying[data-stage="2"] .cf-safety-conveyor::before { animation: cf-belt-coast 5.8s linear both; }
.cf-safety-lab.is-replaying[data-stage="3"] .cf-safety-conveyor::before { animation: cf-belt-controlled-stop 5.8s linear both; }
.cf-safety-lab.is-replaying[data-stage="4"] .cf-safety-conveyor::before { animation: cf-belt-sls 14s linear both; }
.cf-safety-lab.is-replaying[data-stage="2"] .cf-safety-curtain i,
.cf-safety-lab.is-replaying[data-stage="3"] .cf-safety-curtain i { animation: cf-curtain-trip 5.8s linear both; }
.cf-safety-lab.is-replaying[data-stage="4"] .cf-safety-curtain i { animation: cf-curtain-trip-sls 14s linear both; }
.cf-safety-lab.is-replaying[data-stage="1"] [data-safety-detection] { animation: cf-limit-event-on 5.8s linear both; }
.cf-safety-lab.is-replaying[data-stage="2"] [data-safety-detection],
.cf-safety-lab.is-replaying[data-stage="2"] [data-safety-function],
.cf-safety-lab.is-replaying[data-stage="3"] [data-safety-detection],
.cf-safety-lab.is-replaying[data-stage="3"] [data-safety-function],
.cf-safety-lab.is-replaying[data-stage="4"] [data-safety-detection],
.cf-safety-lab.is-replaying[data-stage="4"] [data-safety-function],
.cf-safety-lab.is-replaying[data-stage="4"] [data-safety-direction] { animation: cf-event-sls-on 14s linear both; }
.cf-safety-lab__controls { display: grid; grid-template-columns: repeat(5,minmax(0,1fr)); border-top: 1px solid #34566c; border-bottom: 1px solid #34566c; }
.cf-safety-lab__controls button { min-height: 72px; padding: 12px 8px; border: 0; border-right: 1px solid #34566c; background: #102536; color: #b7cad5; font-weight: 800; cursor: pointer; }
.cf-safety-lab__controls button:last-child { border-right: 0; }
.cf-safety-lab__controls button:hover,.cf-safety-lab__controls button:focus-visible,.cf-safety-lab__controls button.is-active { background: #17384e; color: var(--safety-cyan); }
.cf-safety-lab__footer { display: grid; grid-template-columns: 1fr auto; gap: 24px; align-items: center; padding: 22px 26px; }
.cf-copy .cf-safety-lab__footer p { margin: 0; color: #d8e5eb !important; line-height: 1.6; }
.cf-safety-lab__footer .cf-button { white-space: nowrap; }
@keyframes cf-belt { to { background-position: 24px 0; } }
@keyframes cf-package-fall { 0% { left:16%; top:calc(57% - 54px); transform:rotate(0); opacity:1; } 78% { left:84%; top:calc(57% - 54px); transform:rotate(0); opacity:1; } 100% { left:94%; top:calc(57% + 170px); transform:rotate(70deg); opacity:.1; } }
@keyframes cf-package-limit {
  0% { left:16%; } 43% { left:37%; }
  53% { left:41%; } 63% { left:44%; } 73% { left:46%; } 83% { left:47.5%; } 92%,100% { left:48%; }
}
@keyframes cf-package-coast {
  0% { left:16%; } 32% { left:28%; }
  44% { left:32.5%; } 56% { left:36.5%; } 68% { left:40%; } 80% { left:43%; } 90% { left:45%; } 100% { left:46%; }
}
@keyframes cf-package-stop {
  0% { left:16%; } 32% { left:28%; }
  42% { left:31.5%; } 52% { left:34.5%; } 62% { left:36.5%; } 70%,100% { left:37.5%; }
}
@keyframes cf-package-slow {
  0% { left:16%; } 15% { left:28%; }
  35% { left:40%; } 55% { left:51%; } 75% { left:61%; } 90% { left:69%; } 100% { left:74%; }
}
@keyframes cf-belt-limit {
  0% { background-position:0 0; } 55% { background-position:132px 0; }
  65% { background-position:154px 0; } 75% { background-position:172px 0; } 85% { background-position:184px 0; } 94%,100% { background-position:190px 0; }
}
@keyframes cf-belt-coast {
  0% { background-position:0 0; } 32% { background-position:77px 0; }
  44% { background-position:106px 0; } 56% { background-position:130px 0; } 68% { background-position:149px 0; } 80% { background-position:161px 0; } 90% { background-position:168px 0; } 100% { background-position:171px 0; }
}
@keyframes cf-belt-controlled-stop {
  0% { background-position:0 0; } 32% { background-position:77px 0; }
  42% { background-position:99px 0; } 52% { background-position:114px 0; } 62% { background-position:123px 0; } 70%,100% { background-position:126px 0; }
}
@keyframes cf-belt-sls {
  0% { background-position:0 0; } 15% { background-position:50px 0; }
  35% { background-position:82px 0; } 55% { background-position:112px 0; } 75% { background-position:140px 0; } 90% { background-position:158px 0; } 100% { background-position:168px 0; }
}
@keyframes cf-sensor-flash { 0%,41% { background:#e45145; box-shadow:none; } 44%,100% { background:#f2b632; box-shadow:0 0 24px #f2b632; } }
@keyframes cf-curtain-trip { 0%,30% { background:#e45145; box-shadow:0 0 9px rgba(228,81,69,.65); } 34%,100% { background:#f2b632; box-shadow:0 0 20px #f2b632; } }
@keyframes cf-curtain-trip-sls { 0%,13% { background:#e45145; box-shadow:0 0 9px rgba(228,81,69,.65); } 16%,100% { background:#f2b632; box-shadow:0 0 20px #f2b632; } }
@keyframes cf-event-on { 0%,31% { opacity:.42; border-color:#466b80; color:#9eb4c1; } 35%,100% { opacity:1; border-color:#30cddd; color:#fff; box-shadow:0 0 14px rgba(48,205,221,.28); } }
@keyframes cf-limit-event-on { 0%,41% { opacity:.42; border-color:#466b80; color:#9eb4c1; } 44%,100% { opacity:1; border-color:#30cddd; color:#fff; box-shadow:0 0 14px rgba(48,205,221,.28); } }
@keyframes cf-event-sls-on { 0%,13% { opacity:.42; border-color:#466b80; color:#9eb4c1; } 16%,100% { opacity:1; border-color:#30cddd; color:#fff; box-shadow:0 0 14px rgba(48,205,221,.28); } }

.cf-work-plan { min-height: 100vh; background: #07111c; color: #eef6fa; }
.cf-work-plan__hero { padding: 72px 0 46px; border-bottom: 1px solid #28465a; background: linear-gradient(115deg,#071522,#0d2b3b); }
.cf-work-plan__home { margin-bottom: 30px; }
.cf-work-plan__hero h1 { margin: 8px 0 12px; color: #f4f8fa; font-size: clamp(3rem,7vw,5.8rem); line-height: .95; }
.cf-work-plan__hero p { color: #bfd0d9; font-size: 1.1rem; }
.cf-work-plan__summary { display: grid; grid-template-columns: auto minmax(180px,560px) auto; gap: 20px; align-items: center; margin-top: 34px; }
.cf-work-plan__summary div:first-child { display: grid; }
.cf-work-plan__summary div:first-child strong { font-size: 1.35rem; }
.cf-work-plan__summary div:first-child span { color: #9eb4c1; font-size: .78rem; }
.cf-work-plan__progress { height: 9px; overflow: hidden; border: 1px solid #41657a; background: #07111c; }
.cf-work-plan__progress i { display: block; height: 100%; background: #2fc8da; }
.cf-work-plan__body { padding-top: 38px; padding-bottom: 90px; }
.cf-work-plan__filters { display: flex; gap: 8px; margin-bottom: 34px; }
.cf-work-plan__filters a { padding: 9px 15px; border: 1px solid #36576c; color: #b8cbd5; text-decoration: none; font-size: .82rem; font-weight: 700; }
.cf-work-plan__filters a:hover,.cf-work-plan__filters a.is-active { border-color: #2fc8da; background: #2fc8da; color: #06111b; }
.cf-task-group { margin: 0 0 34px; border: 1px solid #315066; background: #0c1d2d; }
.cf-task-group > header { display: flex; justify-content: space-between; align-items: center; gap: 20px; padding: 22px 24px; border-bottom: 1px solid #315066; }
.cf-task-group h2 { margin: 4px 0 0; color: #f4f8fa; font-size: 1.55rem; }
.cf-task-group > header > strong { color: #2fc8da; font-family: "JetBrains Mono",monospace; }
.cf-task { display: grid; grid-template-columns: minmax(0,1fr) auto; gap: 8px 20px; padding: 18px 24px; border-bottom: 1px solid #203b4e; }
.cf-task:last-child { border-bottom: 0; }
.cf-task__toggle label { display: flex; gap: 14px; align-items: flex-start; cursor: pointer; }
.cf-task__toggle input { position: absolute; opacity: 0; pointer-events: none; }
.cf-task__toggle label span { position: relative; flex: 0 0 24px; width: 24px; height: 24px; border: 2px solid #52758a; background: #07111c; }
.cf-task__toggle input:focus-visible + span { outline: 2px solid #fff; outline-offset: 3px; }
.cf-task__toggle input:checked + span { border-color: #2fc8da; background: #2fc8da; }
.cf-task__toggle input:checked + span::after { content: ""; position: absolute; left: 6px; top: 2px; width: 7px; height: 13px; border: solid #06111b; border-width: 0 3px 3px 0; transform: rotate(45deg); }
.cf-task__toggle b { padding-top: 1px; color: #eef6fa; font-size: 1rem; }
.cf-task.is-done .cf-task__toggle b { color: #7893a2; text-decoration: line-through; }
.cf-task__meta { grid-column: 1; padding-left: 38px; }
.cf-task__meta p { margin: 0 0 6px; color: #9eb4c1; font-size: .88rem; }
.cf-task__meta time { color: #f6b94c; font: 600 .72rem "JetBrains Mono",monospace; text-transform: uppercase; }
.cf-task__delete { border: 0; background: transparent; color: #7893a2; cursor: pointer; font-size: .75rem; }
.cf-task__delete:hover { color: #ef7066; }
.cf-task-add { margin-top: 44px; padding: 28px; border: 1px solid #315066; background: #0c1d2d; }
.cf-task-add h2 { margin: 6px 0 24px; color: #f4f8fa; }
.cf-task-add form { display: grid; grid-template-columns: 2fr 1fr 180px; gap: 18px; align-items: end; }
.cf-task-add label { display: grid; gap: 7px; color: #a9bec9; font-size: .78rem; font-weight: 700; text-transform: uppercase; letter-spacing: .06em; }
.cf-task-add input,.cf-task-add textarea { width: 100%; border: 1px solid #41657a; border-radius: 0; background: #07111c; color: #eef6fa; }
.cf-task-add__note { grid-column: 1 / -1; }
.cf-task-add .cf-button { justify-self: start; }

@media (max-width: 980px) { .cf-grid { grid-template-columns: repeat(2,minmax(0,1fr)); } .cf-header__inner { gap: 14px; } .cf-nav { gap: 13px; } }
@media (max-width: 820px) {
  .cf-topline { font-size: .67rem; } .cf-brand span { display: none; }
  .cf-menu-toggle { display: inline-flex; margin-left: auto; }
  .cf-nav { position: absolute; top: 66px; left: 0; right: 0; display: none; flex-direction: column; align-items: stretch; gap: 0; padding: 10px 16px 18px; border-bottom: 1px solid var(--cf-line); background: #07111c; }
  .cf-nav.is-open { display: flex; } .cf-nav a { min-height: 46px; display: flex; align-items: center; padding: 0 10px; }
  .cf-language { border-left: 0; padding-left: 10px; } .cf-button--compact { padding: 9px 11px; font-size: .82rem; }
  .cf-grid { grid-template-columns: 1fr; } .cf-masthead { padding: 68px 0 45px; }
  .cf-masthead h1 { font-size: clamp(2.6rem,14vw,4.2rem); } .cf-card { min-height: 220px; }
  .cf-lesson-row { grid-template-columns: 45px 1fr; } .cf-lesson-row > span:last-child { grid-column: 2; }
  .cf-empty { padding: 28px; }
  .cf-account { padding: 56px 16px; }
  .cf-account__shell { grid-template-columns: 1fr; gap: 32px; }
  .cf-account__intro { padding-top: 0; }
  .cf-account__intro h1 { font-size: clamp(2.8rem,14vw,4.2rem); }
  .cf-account__panel { padding: 24px 20px; }
  .cf-library__masthead { padding: 64px 0 48px; }
  .cf-library__layout { grid-template-columns: 1fr; }
  .cf-library__aside { position: static; }
  .cf-emc-figure--compact { display: block; }
  .cf-emc-figure--compact figcaption { border-top: 1px solid #c9dbe3; border-left: 0; }
  .cf-media-pair { grid-template-columns: 1fr; }
  .cf-media-pair .cf-pro-figure img { min-height: 220px; }
  .cf-safety-lab__header,.cf-safety-lab__footer { display: block; }
  .cf-safety-lab__status { margin-top: 12px; text-align: left; }
  .cf-safety-machine { min-height: 360px; }
  .cf-safety-drive { left: 20px; transform: scale(.8); transform-origin: top left; }
  .cf-safety-conveyor { left: 6%; right: 6%; }
  .cf-safety-curtain { left: 28%; transform: scale(.78); transform-origin: bottom left; }
  .cf-safety-person { right: 4%; transform: scale(.75); transform-origin: bottom right; }
  .cf-safety-events { left: 18px; top: 212px; }
  .cf-safety-events span { min-width: 132px; font-size: .6rem; }
  .cf-safety-lab__controls { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .cf-safety-lab__controls button { border-bottom: 1px solid #34566c; }
  .cf-safety-lab__footer .cf-button { margin-top: 18px; }
  .cf-work-plan__summary { grid-template-columns: 1fr auto; }
  .cf-work-plan__summary > div:first-child { grid-column: 1 / -1; }
  .cf-task { grid-template-columns: 1fr; }
  .cf-task__delete { padding-left: 38px; text-align: left; }
  .cf-task-add form { grid-template-columns: 1fr; }
  .cf-task-add__note { grid-column: auto; }
}