/* =========================================================
   LEARNING REWIRED LAB — FEATURED BUILDER DETAIL SYSTEM V2
   File: /assets/css/featured-builder-detail.css

   Page: /featured-builders/ronni-teagle-vibe-coded-compliance/
   Rebuilt to match the live Featured Builders design system
   (assets/css/featured-builders.css — teal/mint/gold, Inter,
   13px button radius, fbp-h2 type scale). Same selectors and
   structure as V1 so featured-builder-detail.js needs no changes.
   ========================================================= */

.fb-detail-page {
  --fbd-ink: #07111f;
  --fbd-ink-2: #0f172a;
  --fbd-muted: #475569;
  --fbd-muted-strong: #0f172a;
  --fbd-faint: #94a3b8;
  --fbd-line: #e6ebf1;
  --fbd-surface: #f8fafc;

  --fbd-teal: #14b8a6;
  --fbd-teal-deep: #0f766e;
  --fbd-mint: #5eead4;
  --fbd-mint-dark: #0d9488;
  --fbd-blue: #2563eb;
  --fbd-gold: #e0a93f;
  --fbd-gold-dark: #8a6406;

  overflow: hidden;
  background: #ffffff;
  color: var(--fbd-ink-2);
  font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  -webkit-font-smoothing: antialiased;
}

.fb-detail-page *,
.fb-detail-page *::before,
.fb-detail-page *::after { box-sizing: border-box; }

.fb-detail-page h1, .fb-detail-page h2, .fb-detail-page h3, .fb-detail-page h4,
.fb-detail-page p, .fb-detail-page figure, .fb-detail-page blockquote { margin-top: 0; }
.fb-detail-page h1, .fb-detail-page h2, .fb-detail-page h3, .fb-detail-page h4 {
  color: var(--fbd-ink); text-wrap: balance;
}
.fb-detail-page p { color: var(--fbd-muted); line-height: 1.65; }
.fb-detail-page a { color: inherit; }
.fb-detail-page button, .fb-detail-page input, .fb-detail-page textarea, .fb-detail-page select { font: inherit; }

.fbd-shell { max-width: 1180px; margin: 0 auto; width: calc(100% - 40px); }

.fbd-eyebrow, .fbd-kicker {
  display: inline-flex; align-items: center; gap: 9px;
  margin: 0 0 14px; color: var(--fbd-teal-deep);
  font-size: 12px; font-weight: 800; letter-spacing: .2em;
  text-transform: uppercase; line-height: 1;
}
.fbd-kicker-dot { width: 7px; height: 7px; border-radius: 50%; background: var(--fbd-teal); flex: none; }

/* ---- Reading Progress ------------------------------------- */
.fbd-progress { position: fixed; top: 0; left: 0; z-index: 7000; width: 100%; height: 3px; background: transparent; pointer-events: none; }
.fbd-progress span {
  display: block; width: 0%; height: 100%; border-radius: 0 999px 999px 0;
  background: linear-gradient(90deg, var(--fbd-teal), var(--fbd-mint));
  box-shadow: 0 0 14px rgba(20,184,166,.32);
}

/* ---- Buttons (match .fbp-btn) ------------------------------ */
.fbd-btn {
  display: inline-flex; align-items: center; justify-content: center; gap: 9px;
  font-family: inherit; font-weight: 800; font-size: 15.5px;
  border-radius: 13px; padding: 15px 26px; text-decoration: none !important;
  cursor: pointer; border: 1px solid transparent; white-space: nowrap;
  transition: background .18s ease, border-color .18s ease, color .18s ease, transform .18s ease, box-shadow .18s ease;
}
.fbd-btn:hover { transform: translateY(-1px); }
.fbd-btn-primary { color: #fff !important; background: var(--fbd-teal); box-shadow: 0 12px 26px rgba(20,184,166,.28); }
.fbd-btn-primary:hover { background: #0f9e8e; color: #fff !important; }
.fbd-btn-secondary { color: var(--fbd-ink-2) !important; background: #fff; border-color: #d8e0ea; box-shadow: 0 6px 16px rgba(15,23,42,.05); }
.fbd-btn-secondary:hover { border-color: var(--fbd-teal); color: var(--fbd-teal-deep) !important; }

/* ---- Hero --------------------------------------------------- */
.fbd-hero {
  position: relative; overflow: hidden; padding: 44px 0 70px;
  background: linear-gradient(180deg, #ffffff 0%, #f0faf8 100%);
}
.fbd-hero::after {
  content: ""; position: absolute; inset: 0; pointer-events: none;
  background:
    radial-gradient(56% 60% at 86% 4%, rgba(20,184,166,.16), transparent 60%),
    radial-gradient(48% 60% at -4% 100%, rgba(224,169,63,.08), transparent 55%);
}
.fbd-hero .fbd-shell { position: relative; z-index: 1; }

.fbd-breadcrumb { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; margin-bottom: 30px; color: var(--fbd-faint); font-size: 13px; font-weight: 700; }
.fbd-breadcrumb a { color: var(--fbd-muted-strong); text-decoration: none; }
.fbd-breadcrumb a:hover { color: var(--fbd-teal-deep); }
.fbd-breadcrumb span[aria-hidden="true"] { color: #cbd5e1; }

.fbd-hero-layout { display: grid; grid-template-columns: 1.05fr .95fr; gap: 48px; align-items: center; }

.fbd-hero-copy h1 {
  max-width: 760px; margin: 0; color: var(--fbd-ink);
  font-size: clamp(2.15rem, 3.9vw, 3.55rem); font-weight: 900; line-height: 1.04; letter-spacing: -.04em;
}
.fbd-dek { max-width: 640px; margin: 20px 0 0; color: var(--fbd-muted); font-size: 17px; line-height: 1.62; }

.fbd-byline { display: flex; flex-wrap: wrap; gap: 9px; margin-top: 24px; }
.fbd-byline span {
  display: inline-flex; align-items: center; min-height: 34px;
  border: 1px solid var(--fbd-line); border-radius: 999px;
  background: #fff; color: var(--fbd-muted-strong); padding: 0 13px;
  font-size: 12.5px; font-weight: 700;
}
.fbd-byline strong { color: var(--fbd-ink); font-weight: 800; }
.fbd-byline span:nth-child(2) { border-color: rgba(20,184,166,.24); background: rgba(20,184,166,.08); }
.fbd-byline span:nth-child(3) { border-color: rgba(224,169,63,.32); background: rgba(224,169,63,.1); }
.fbd-byline a {
  display: inline-flex; align-items: center; min-height: 34px;
  border: 1px solid rgba(37,99,235,.24); border-radius: 999px;
  background: rgba(37,99,235,.06); color: var(--fbd-blue);
  padding: 0 13px; font-size: 12.5px; font-weight: 700; text-decoration: none;
}
.fbd-byline a::after { content: " \2197"; }
.fbd-byline a:hover { border-color: rgba(37,99,235,.42); background: rgba(37,99,235,.1); text-decoration: underline; }

.fbd-hero-actions { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 28px; }

/* ---- Feature Plate (mirrors .fbp-feature-card) -------------- */
.fbd-feature-plate {
  position: relative; overflow: hidden; border-radius: 24px;
  background: linear-gradient(150deg, #07111f 0%, #10243d 100%);
  box-shadow: 0 30px 70px rgba(7,17,31,.28); color: #fff;
}
.fbd-plate-top {
  position: relative; display: flex; align-items: center; justify-content: space-between;
  padding: 16px 20px; border-bottom: 1px solid rgba(255,255,255,.08);
}
.fbd-plate-top span {
  font-size: 10.5px; font-weight: 800; letter-spacing: .16em; text-transform: uppercase; color: #ffd98a;
}
.fbd-plate-top span:last-child {
  display: inline-flex; align-items: center; justify-content: center; width: auto; height: auto;
  border-radius: 999px; background: transparent; color: rgba(255,255,255,.5); letter-spacing: .04em; font-weight: 700;
}
.fbd-plate-body { position: relative; padding: 24px 24px 26px; }
.fbd-plate-body h2 {
  font-weight: 900; font-size: 24px; line-height: 1.16; letter-spacing: -.03em; margin: 0; color: #fff;
}
.fbd-plate-body p { font-size: 13.5px; line-height: 1.58; color: rgba(255,255,255,.76); margin: 14px 0 0; }

.fbd-signal-list { display: flex; flex-direction: column; gap: 0; margin: 0; border-top: 1px solid rgba(255,255,255,.08); }
.fbd-signal-list div { display: flex; align-items: center; gap: 12px; padding: 14px 24px; border-bottom: 1px solid rgba(255,255,255,.08); }
.fbd-signal-list div:last-child { border-bottom: 0; }
.fbd-signal-list dt { font-size: 10.5px; font-weight: 800; letter-spacing: .1em; text-transform: uppercase; color: #7fe9d8; width: 92px; flex: none; }
.fbd-signal-list dd { margin: 0; color: #fff; font-size: 13px; font-weight: 700; }

/* ---- Feature Nav (sticky pill bar) --------------------------- */
.fbd-feature-nav-wrap {
  position: sticky; top: 0; z-index: 40;
  border-top: 1px solid var(--fbd-line); border-bottom: 1px solid var(--fbd-line);
  background: rgba(255,255,255,.92); backdrop-filter: blur(14px);
}
.fbd-feature-nav { display: flex; gap: 6px; overflow-x: auto; padding: 11px 0; scrollbar-width: none; }
.fbd-feature-nav::-webkit-scrollbar { display: none; }
.fbd-feature-nav a {
  display: inline-flex; flex: 0 0 auto; align-items: center; justify-content: center;
  border: 1px solid transparent; border-radius: 999px; color: var(--fbd-muted-strong);
  padding: 8px 15px; font-size: 13px; font-weight: 800; text-decoration: none;
  transition: background .18s ease, border-color .18s ease, color .18s ease;
}
.fbd-feature-nav a:hover, .fbd-feature-nav a.is-active {
  border-color: rgba(20,184,166,.28); background: rgba(20,184,166,.1); color: var(--fbd-teal-deep);
}

/* ---- Article Sections ---------------------------------------- */
.fbd-section { padding: 76px 0; }
.fbd-section-open { background: #ffffff; }
.fbd-section-soft, .fbd-takeaways { background: var(--fbd-surface); border-top: 1px solid #eef2f6; border-bottom: 1px solid #eef2f6; }
.fbd-section-dark {
  position: relative; overflow: hidden;
  background: linear-gradient(135deg, #07111f 0%, #123532 100%);
}
.fbd-section-dark .fbd-shell { position: relative; z-index: 1; }
.fbd-section-dark .fbd-kicker, .fbd-section-dark .fbd-section-label .fbd-kicker { color: #7fe9d8; }
.fbd-section-dark .fbd-rich-text h2, .fbd-section-dark .fbd-rich-text h3 { color: #fff; }
.fbd-section-dark .fbd-rich-text p { color: rgba(255,255,255,.72); }

.fbd-article-grid { display: grid; grid-template-columns: 120px minmax(0,1fr); gap: 42px; align-items: start; }
.fbd-section-label { position: sticky; top: 76px; display: grid; gap: 14px; align-self: start; }
.fbd-section-label span {
  display: inline-flex; width: 46px; height: 46px; align-items: center; justify-content: center;
  border: 1px solid rgba(20,184,166,.3); border-radius: 13px; background: rgba(20,184,166,.1);
  color: var(--fbd-teal-deep); font-size: 13px; font-weight: 800;
}
.fbd-section-dark .fbd-section-label span { border-color: rgba(110,231,216,.35); background: rgba(110,231,216,.1); color: #7fe9d8; }

.fbd-rich-text { max-width: 760px; }
.fbd-rich-text h2 { font-weight: 900; font-size: clamp(1.75rem, 3vw, 2.5rem); line-height: 1.1; letter-spacing: -.035em; margin: 0; }
.fbd-rich-text h3 { font-weight: 800; font-size: 20px; line-height: 1.2; letter-spacing: -.02em; margin: 0; }
.fbd-rich-text p { font-size: 15.5px; line-height: 1.68; margin: 18px 0 0; color: var(--fbd-muted); max-width: 700px; }

/* ---- Quotes ---------------------------------------------------- */
.fbd-pullquote {
  position: relative; margin: 40px 0 0; padding: 26px 30px;
  border-left: 4px solid var(--fbd-teal); border-radius: 0 18px 18px 0;
  background: linear-gradient(165deg, #f0fdfa, #fff);
}
.fbd-pullquote blockquote {
  margin: 0; color: var(--fbd-ink); font-weight: 800; font-size: clamp(1.15rem, 1.6vw, 1.45rem);
  line-height: 1.35; letter-spacing: -.02em;
}
.fbd-pullquote figcaption, .fbd-megaquote figcaption {
  margin-top: 16px; color: var(--fbd-muted); font-size: 12px; font-weight: 800; letter-spacing: .08em; text-transform: uppercase;
}
.fbd-megaquote {
  margin: 40px 0; padding: 36px 0; border-top: 1px solid rgba(255,255,255,.14); border-bottom: 1px solid rgba(255,255,255,.14);
}
.fbd-megaquote blockquote { max-width: 720px; margin: 0; color: #fff; font-weight: 800; font-size: clamp(1.4rem, 2.4vw, 2.1rem); line-height: 1.18; letter-spacing: -.03em; }
.fbd-megaquote figcaption { color: #7fe9d8; }

/* ---- Build strip ------------------------------------------------ */
.fbd-build-strip { display: grid; grid-template-columns: repeat(4, minmax(0,1fr)); gap: 0; margin-top: 32px; border-top: 1px solid var(--fbd-line); border-bottom: 1px solid var(--fbd-line); }
.fbd-build-strip div { padding: 18px 18px; border-right: 1px solid var(--fbd-line); }
.fbd-build-strip div:last-child { border-right: 0; }
.fbd-build-strip span { display: block; margin-bottom: 9px; font-size: 10.5px; font-weight: 800; letter-spacing: .1em; text-transform: uppercase; color: var(--fbd-teal-deep); }
.fbd-build-strip div:nth-child(2) span { color: var(--fbd-mint-dark); }
.fbd-build-strip div:nth-child(3) span { color: var(--fbd-blue); }
.fbd-build-strip div:nth-child(4) span { color: var(--fbd-gold-dark); }
.fbd-build-strip strong { display: block; color: var(--fbd-ink); font-size: 15px; font-weight: 800; line-height: 1.3; letter-spacing: -.015em; }

/* ---- Tension module ---------------------------------------------- */
.fbd-tension { display: grid; grid-template-columns: 1fr 70px 1fr; gap: 16px; align-items: stretch; margin-top: 32px; }
.fbd-tension-side {
  padding: 22px 24px; border: 1px solid var(--fbd-line); border-radius: 18px;
  background: linear-gradient(165deg, #f0fdfa, #fff);
}
.fbd-tension-side:nth-child(3) { background: linear-gradient(165deg, #fdf8ee, #fff); }
.fbd-tension-side h3 { font-size: 17px; }
.fbd-tension-middle { display: grid; place-items: center; }
.fbd-tension-middle span {
  display: inline-grid; width: 54px; height: 54px; place-items: center; border: 1px solid var(--fbd-line);
  border-radius: 999px; background: #fff; color: var(--fbd-muted); font-size: 10.5px; font-weight: 800; letter-spacing: .08em; text-transform: uppercase;
  box-shadow: 0 6px 16px rgba(15,23,42,.06);
}

/* ---- Lab Lens (dark, mirrors .fbp-founding) ----------------------- */
.fbd-lab-lens {
  position: relative; overflow: hidden; padding: 76px 0;
  background: linear-gradient(135deg, #07111f 0%, #123532 100%);
}
.fbd-lab-lens .fbd-shell { position: relative; z-index: 1; }
.fbd-lab-lens .fbd-kicker, .fbd-lens-output .fbd-kicker { color: #7fe9d8; }
.fbd-lens-intro { max-width: 780px; }
.fbd-lens-intro h2 { font-weight: 900; font-size: clamp(1.85rem, 3.4vw, 2.6rem); line-height: 1.08; letter-spacing: -.035em; margin: 0; color: #fff; }
.fbd-lens-intro p { font-size: 15.5px; line-height: 1.65; color: rgba(255,255,255,.72); margin: 18px 0 0; max-width: 660px; }

.fbd-system-map { position: relative; display: grid; grid-template-columns: repeat(5, minmax(0,1fr)); gap: 12px; margin-top: 38px; }
.fbd-map-rail {
  position: absolute; top: 28px; left: 7%; right: 7%; height: 2px; border-radius: 999px;
  background: linear-gradient(90deg, rgba(20,184,166,.6), rgba(110,231,216,.4), rgba(224,169,63,.5)); pointer-events: none;
}
.fbd-map-node {
  position: relative; z-index: 1; display: grid; min-height: 108px; align-content: center; justify-items: center; gap: 9px;
  border: 1px solid rgba(255,255,255,.14); border-radius: 16px; background: rgba(255,255,255,.06);
  color: rgba(255,255,255,.82); padding: 14px 12px; text-align: center; font-size: 13px; font-weight: 700; line-height: 1.25;
  cursor: pointer; transition: transform .18s ease, border-color .18s ease, background .18s ease, color .18s ease;
}
.fbd-map-node span {
  display: inline-grid; width: 30px; height: 30px; place-items: center; border: 1px solid rgba(110,231,216,.4);
  border-radius: 999px; background: rgba(110,231,216,.1); color: #7fe9d8; font-size: 11px; font-weight: 800;
}
.fbd-map-node:hover, .fbd-map-node.is-active {
  transform: translateY(-2px); border-color: rgba(20,184,166,.4); background: rgba(20,184,166,.14); color: #fff;
}
.fbd-lens-output {
  display: block;
  margin-top: 20px; padding: 26px 28px; border: 1px solid rgba(255,255,255,.14); border-radius: 20px; background: rgba(255,255,255,.06);
}
.fbd-lens-output h3 { color: #fff; font-size: 22px; font-weight: 900; letter-spacing: -.025em; margin: 0; }
.fbd-lens-output p { color: rgba(255,255,255,.76); font-size: 14.5px; line-height: 1.6; margin: 12px 0 0; max-width: 640px; }
.fbd-lens-output small { display: block; margin-top: 14px; color: #7fe9d8; font-size: 12.5px; font-weight: 700; line-height: 1.5; max-width: 640px; }

/* ---- Builder profile -------------------------------------------- */
.fbd-builder-section { background: #ffffff; }
.fbd-builder-layout { display: grid; grid-template-columns: 300px minmax(0,1fr); gap: 42px; align-items: start; }
.fbd-builder-profile {
  position: sticky; top: 76px; padding: 26px; border: 1px solid var(--fbd-line); border-radius: 20px;
  background: linear-gradient(165deg, #f0fdfa, #fff); box-shadow: 0 1px 2px rgba(15,23,42,.03);
}
.fbd-builder-profile h2 { font-weight: 900; font-size: 22px; letter-spacing: -.02em; margin: 0; }
.fbd-builder-profile p { font-size: 13.5px; line-height: 1.55; margin: 12px 0 0; }
.fbd-builder-profile dl { display: grid; margin: 20px 0 0; border-top: 1px solid var(--fbd-line); }
.fbd-builder-profile dl div { display: grid; gap: 5px; padding: 14px 0; border-bottom: 1px solid var(--fbd-line); }
.fbd-builder-profile dt { color: var(--fbd-teal-deep); font-size: 10.5px; font-weight: 800; letter-spacing: .1em; text-transform: uppercase; }
.fbd-builder-profile dd { margin: 0; color: var(--fbd-ink); font-size: 13.5px; font-weight: 700; line-height: 1.4; }
.fbd-builder-profile dd a { color: var(--fbd-teal-deep); font-weight: 800; text-decoration: none; }
.fbd-builder-profile dd a:hover { text-decoration: underline; }

.fbd-builder-note {
  margin-top: 28px; padding: 18px 20px; border-left: 4px solid var(--fbd-teal); border-radius: 0 16px 16px 0;
  background: var(--fbd-surface);
}
.fbd-builder-note p { margin: 0; font-size: 13.5px; }
.fbd-builder-note strong { color: var(--fbd-ink); }

/* ---- Takeaways ---------------------------------------------------- */
.fbd-takeaways { padding: 76px 0; }
.fbd-takeaways-header { max-width: 760px; margin-bottom: 34px; }
.fbd-takeaways-header h2 { font-weight: 900; font-size: clamp(1.75rem, 3vw, 2.5rem); line-height: 1.1; letter-spacing: -.035em; margin: 0; }
.fbd-takeaway-flow { display: grid; border-top: 1px solid var(--fbd-line); border-bottom: 1px solid var(--fbd-line); }
.fbd-takeaway-flow article {
  display: grid; grid-template-columns: 56px minmax(0,.42fr) minmax(0,1fr); gap: 20px; align-items: center;
  padding: 22px 0; border-bottom: 1px solid var(--fbd-line);
}
.fbd-takeaway-flow article:last-child { border-bottom: 0; }
.fbd-takeaway-flow span {
  display: inline-flex; width: 38px; height: 38px; align-items: center; justify-content: center;
  border: 1px solid rgba(20,184,166,.3); border-radius: 999px; background: rgba(20,184,166,.1);
  color: var(--fbd-teal-deep); font-size: 12px; font-weight: 800;
}
.fbd-takeaway-flow article:nth-child(2) span { border-color: rgba(94,234,212,.4); background: rgba(94,234,212,.14); color: var(--fbd-mint-dark); }
.fbd-takeaway-flow article:nth-child(3) span { border-color: rgba(224,169,63,.4); background: rgba(224,169,63,.14); color: var(--fbd-gold-dark); }
.fbd-takeaway-flow h3 { font-weight: 800; font-size: 16.5px; line-height: 1.2; letter-spacing: -.02em; margin: 0; }
.fbd-takeaway-flow p { margin: 0; font-size: 13.5px; line-height: 1.55; }

/* ---- Final CTA ---------------------------------------------------- */
.fbd-final-cta { padding: 70px 0 88px; background: linear-gradient(135deg, #07111f 0%, #123532 100%); }
.fbd-cta-layout {
  display: grid; grid-template-columns: minmax(0,1fr) auto; gap: 28px; align-items: center;
  padding: 36px 40px; border: 1px solid rgba(255,255,255,.12); border-radius: 24px;
  background: rgba(255,255,255,.05);
}
.fbd-cta-layout .fbd-kicker { color: #7fe9d8; }
.fbd-cta-layout h2 { max-width: 620px; margin: 0; color: #fff; font-weight: 900; font-size: clamp(1.7rem, 2.8vw, 2.3rem); line-height: 1.12; letter-spacing: -.03em; }
.fbd-cta-layout p { max-width: 620px; margin: 14px 0 0; color: rgba(255,255,255,.72); font-size: 14.5px; line-height: 1.55; }
.fbd-cta-actions { display: flex; flex-wrap: wrap; gap: 12px; justify-content: flex-end; }
.fbd-final-cta .fbd-btn-secondary { border-color: rgba(255,255,255,.26); background: rgba(255,255,255,.04); color: #fff !important; }
.fbd-final-cta .fbd-btn-secondary:hover { border-color: rgba(110,231,216,.5); background: rgba(255,255,255,.09); }

/* ---- Course preview ------------------------------------------------ */
.fbd-course-preview { position: relative; padding: 76px 0; background: #fff; }
.fbd-course-preview-layout {
  display: grid; grid-template-columns: minmax(0,.82fr) minmax(320px,.5fr); gap: 44px; align-items: stretch;
  border-top: 1px solid var(--fbd-line); border-bottom: 1px solid var(--fbd-line); padding: 40px 0;
}
.fbd-course-preview-copy h2 { max-width: 700px; font-weight: 900; font-size: clamp(1.75rem, 3vw, 2.5rem); line-height: 1.1; letter-spacing: -.035em; margin: 0; }
.fbd-course-preview-copy p { max-width: 660px; font-size: 15.5px; line-height: 1.68; margin: 16px 0 0; }
.fbd-course-actions { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 26px; }
.fbd-course-look {
  display: grid; align-content: start; border-radius: 20px; padding: 26px;
  background: linear-gradient(150deg, #07111f 0%, #10243d 100%); box-shadow: 0 20px 50px rgba(7,17,31,.14);
}
.fbd-course-look .fbd-kicker { color: #7fe9d8; }
.fbd-course-look h3 { color: #fff; font-weight: 900; font-size: clamp(1.25rem, 1.7vw, 1.55rem); line-height: 1.16; letter-spacing: -.025em; margin: 0; }
.fbd-course-look ul { display: grid; margin: 20px 0 0; padding: 0; list-style: none; border-top: 1px solid rgba(255,255,255,.12); }
.fbd-course-look li {
  display: grid; grid-template-columns: 32px minmax(0,1fr); gap: 12px; align-items: start; padding: 14px 0;
  border-bottom: 1px solid rgba(255,255,255,.12); color: rgba(255,255,255,.76); font-size: 13.5px; font-weight: 600; line-height: 1.45;
}
.fbd-course-look li:last-child { border-bottom: 0; }
.fbd-course-look li span {
  display: inline-grid; width: 28px; height: 28px; place-items: center; border: 1px solid rgba(110,231,216,.4);
  border-radius: 999px; background: rgba(110,231,216,.1); color: #7fe9d8; font-size: 10.5px; font-weight: 800;
}

/* ---- Reveal states / focus ------------------------------------------ */
.fbd-reveal { opacity: 0; transform: translateY(14px); transition: opacity .45s ease, transform .45s ease; }
.fbd-reveal.is-visible { opacity: 1; transform: translateY(0); }
.fbd-map-node:focus-visible, .fbd-btn:focus-visible, .fbd-feature-nav a:focus-visible { outline: 3px solid rgba(20,184,166,.32); outline-offset: 3px; }

@media (prefers-reduced-motion: reduce) {
  .fb-detail-page *, .fb-detail-page *::before, .fb-detail-page *::after {
    scroll-behavior: auto !important; transition-duration: .001ms !important; animation-duration: .001ms !important; animation-iteration-count: 1 !important;
  }
  .fbd-reveal { opacity: 1; transform: none; }
}

/* ---- Responsive ------------------------------------------------------- */
@media (max-width: 1080px) {
  .fbd-hero-layout, .fbd-builder-layout, .fbd-cta-layout, .fbd-course-preview-layout { grid-template-columns: 1fr; }
  .fbd-feature-plate { max-width: 620px; }
  .fbd-article-grid { grid-template-columns: 1fr; gap: 20px; }
  .fbd-section-label, .fbd-builder-profile { position: static; }
  .fbd-section-label { display: flex; align-items: center; justify-content: space-between; border-bottom: 1px solid var(--fbd-line); padding-bottom: 16px; }
  .fbd-section-dark .fbd-section-label { border-bottom-color: rgba(255,255,255,.14); }
  .fbd-build-strip { grid-template-columns: repeat(2, minmax(0,1fr)); }
  .fbd-build-strip div:nth-child(1), .fbd-build-strip div:nth-child(2) { border-bottom: 1px solid var(--fbd-line); }
  .fbd-build-strip div:nth-child(2) { border-right: 0; }
  .fbd-tension { grid-template-columns: 1fr; }
  .fbd-tension-middle { min-height: 40px; }
  .fbd-tension-middle span { width: auto; height: 34px; padding: 0 16px; }
  .fbd-system-map { grid-template-columns: 1fr; }
  .fbd-map-rail { top: 6%; bottom: 6%; left: 22px; right: auto; width: 2px; height: auto; background: linear-gradient(180deg, rgba(20,184,166,.6), rgba(110,231,216,.4), rgba(224,169,63,.5)); }
  .fbd-map-node { min-height: 66px; grid-template-columns: 36px minmax(0,1fr); justify-items: start; text-align: left; padding: 12px 16px; }
  .fbd-takeaway-flow article { grid-template-columns: 56px minmax(0,1fr); align-items: start; }
  .fbd-takeaway-flow p { grid-column: 2; }
  .fbd-cta-actions { justify-content: flex-start; }
}
@media (max-width: 760px) {
  .fbd-shell { width: calc(100% - 28px); }
  .fbd-hero { padding: 32px 0 46px; }
  .fbd-hero-actions, .fbd-cta-actions, .fbd-course-actions { display: grid; grid-template-columns: 1fr; width: 100%; }
  .fbd-btn { width: 100%; }
  .fbd-build-strip { grid-template-columns: 1fr; }
  .fbd-build-strip div { border-right: 0; border-bottom: 1px solid var(--fbd-line); }
  .fbd-build-strip div:last-child { border-bottom: 0; }
  .fbd-section, .fbd-lab-lens, .fbd-takeaways, .fbd-course-preview { padding: 52px 0; }
  .fbd-cta-layout { padding: 26px; }
}