/* WordPress isolation for the public Runcible OS review route. */
body.runcible-public-os {
  margin: 0 !important;
  font-family: var(--sans) !important;
}

body.runcible-public-os > .wp-site-blocks > header.wp-block-template-part,
body.runcible-public-os > .wp-site-blocks > footer.wp-block-template-part,
body.runcible-public-os .wp-block-post-title {
  display: none !important;
}

body.runcible-public-os .wp-site-blocks,
body.runcible-public-os .wp-block-post-content {
  margin: 0 !important;
  padding: 0 !important;
}

body.runcible-public-os #wp--skip-link--target > .wp-block-group {
  padding: 0 !important;
}

html body.runcible-public-os #wp--skip-link--target .entry-content.alignfull.wp-block-post-content {
  width: 100vw !important;
  max-width: 100vw !important;
  margin-inline: calc(50% - 50vw) !important;
}

body.runcible-public-os.admin-bar .site-head {
  top: 32px;
}

body.runcible-public-os.admin-bar .story-rail {
  top: 106px;
}

body.runcible-public-os .brand,
body.runcible-public-os .frame,
body.runcible-public-os .kicker,
body.runcible-public-os .seal,
body.runcible-public-os .saying,
body.runcible-public-os .claim,
body.runcible-public-os .record-foot strong,
body.runcible-public-os .mind strong,
body.runcible-public-os .coda,
body.runcible-public-os .deeper strong,
body.runcible-public-os .section h1,
body.runcible-public-os .section h2,
body.runcible-public-os .section h3 {
  font-family: var(--slab) !important;
}

body.runcible-public-os .main-nav,
body.runcible-public-os .review-tag,
body.runcible-public-os .story-rail,
body.runcible-public-os .coordinate,
body.runcible-public-os .eyebrow,
body.runcible-public-os .button,
body.runcible-public-os .promise-box span,
body.runcible-public-os .world-line,
body.runcible-public-os .capability > span,
body.runcible-public-os .record-head,
body.runcible-public-os .field dt,
body.runcible-public-os .record-foot small,
body.runcible-public-os .mechanism .number,
body.runcible-public-os .causal,
body.runcible-public-os .pathology > span,
body.runcible-public-os .outcome > span,
body.runcible-public-os .value-pane > span,
body.runcible-public-os .mind span,
body.runcible-public-os .site-foot {
  font-family: var(--mono) !important;
}

@media (max-width: 782px) {
  body.runcible-public-os.admin-bar .site-head {
    top: 46px;
  }

  body.runcible-public-os.admin-bar .story-rail {
    top: 120px;
  }
}

@media (max-width: 720px) {
  body.runcible-public-os.admin-bar .story-rail {
    top: 112px;
  }
}

:root {
      --ink: #111312;
      --coal: #1a1d1c;
      --paper: #f1ebde;
      --paper-2: #e3d9c8;
      --white: #fffdf7;
      --red: #b23830;
      --gold: #d3a43b;
      --gold-dark: #8f691d;
      --teal: #285f67;
      --teal-dark: #173d42;
      --muted: #555b57;
      --rule: rgba(17, 19, 18, .18);
      --rule-dark: rgba(255, 253, 247, .17);
      --sans: "Source Sans 3", sans-serif;
      --slab: "Roboto Slab", Georgia, serif;
      --mono: "IBM Plex Mono", monospace;
    }

    * { box-sizing: border-box; }
    html { scroll-behavior: smooth; }
    body {
      margin: 0;
      color: var(--ink);
      background: var(--paper);
      font-family: var(--sans);
      font-size: 18px;
      line-height: 1.58;
      text-rendering: optimizeLegibility;
    }
    a { color: inherit; }
    h1, h2, h3, p { text-wrap: balance; }
    p { max-width: 72ch; }

    .site-head {
      position: sticky;
      top: 0;
      z-index: 30;
      display: flex;
      align-items: center;
      justify-content: space-between;
      min-height: 74px;
      padding: 12px clamp(20px, 4.5vw, 72px);
      border-bottom: 1px solid var(--rule-dark);
      color: var(--white);
      background: rgba(17, 19, 18, .98);
      backdrop-filter: blur(14px);
    }
    .brand {
      display: inline-flex;
      align-items: center;
      gap: 10px;
      font-family: var(--slab);
      font-size: 1.65rem;
      font-weight: 800;
      text-decoration: none;
    }
    .brand img { width: 20px; height: 38px; object-fit: contain; filter: brightness(0) invert(1); }
    .main-nav { display: flex; align-items: center; gap: clamp(13px, 1.8vw, 27px); font: 600 .64rem/1.2 var(--mono); letter-spacing: .06em; text-transform: uppercase; }
    .main-nav a { color: #d8d7d1; text-decoration: none; }
    .main-nav a:hover { color: var(--gold); }
    .review-tag { padding: 8px 11px; border: 1px solid rgba(211,164,59,.7); color: var(--gold); }

    .story-rail {
      position: sticky;
      top: 74px;
      z-index: 25;
      display: grid;
      grid-template-columns: 1.35fr repeat(6, 1fr);
      border-bottom: 1px solid #c9bda9;
      background: rgba(241,235,222,.97);
      backdrop-filter: blur(10px);
    }
    .story-rail a, .story-rail span {
      display: grid;
      place-items: center;
      min-height: 41px;
      padding: 8px 10px;
      border-right: 1px solid #d5cabb;
      color: #6a645a;
      font: 600 .55rem/1.2 var(--mono);
      letter-spacing: .075em;
      text-align: center;
      text-decoration: none;
      text-transform: uppercase;
    }
    .story-rail .rail-title { place-items: center start; padding-left: clamp(20px,4.5vw,72px); color: var(--red); }
    .story-rail .active { color: var(--white); background: var(--teal-dark); box-shadow: inset 0 -4px 0 var(--gold); }

    .section { position: relative; padding: clamp(72px,8vw,124px) clamp(20px,7vw,112px); overflow: hidden; }
    .inner { width: min(1190px, 100%); margin: 0 auto; }
    .coordinate, .eyebrow { font: 600 .66rem/1.2 var(--mono); letter-spacing: .13em; text-transform: uppercase; }
    .coordinate { color: var(--gold-dark); }
    .eyebrow { margin: 34px 0 18px; color: var(--red); }
    .section h1, .section h2, .section h3 { margin: 0; font-family: var(--slab); letter-spacing: -.04em; }
    .section h1 { max-width: 1060px; font-size: clamp(3.4rem,7vw,6.7rem); font-weight: 700; line-height: 1.02; }
    .section h2 { max-width: 1000px; font-size: clamp(2.35rem,4.5vw,4.35rem); font-weight: 700; line-height: 1.07; }
    .section h3 { font-size: clamp(1.35rem,2vw,1.9rem); font-weight: 650; line-height: 1.15; }
    .frame { max-width: 850px; margin: 25px 0 34px; padding: 5px 0 5px 22px; border-left: 5px solid var(--red); font: italic 600 clamp(1.2rem,2vw,1.8rem)/1.4 var(--slab); }
    .kicker { max-width: 1000px; margin: 27px 0 0; color: var(--teal); font: 600 clamp(1.2rem,2.15vw,1.9rem)/1.36 var(--slab); }
    .lede { max-width: 900px; margin-top: 30px; font-size: clamp(1.08rem,1.4vw,1.26rem); line-height: 1.65; }
    .seal { max-width: 1040px; margin-top: 38px; font: 700 clamp(1.25rem,2vw,1.75rem)/1.4 var(--slab); }
    .actions { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 34px; }
    .button { display: inline-flex; align-items: center; min-height: 47px; padding: 11px 17px; border: 1px solid currentColor; font: 600 .66rem/1.2 var(--mono); letter-spacing: .065em; text-decoration: none; text-transform: uppercase; }
    .button.primary { border-color: var(--teal); color: var(--white); background: var(--teal); }

    .hero {
      min-height: calc(100vh - 115px);
      background:
        linear-gradient(rgba(17,19,18,.035) 1px, transparent 1px),
        linear-gradient(90deg, rgba(17,19,18,.035) 1px, transparent 1px),
        radial-gradient(circle at 92% 10%, rgba(40,95,103,.18), transparent 28rem),
        var(--paper);
      background-size: 48px 48px,48px 48px,auto,auto;
    }
    .hero .intro-grid { display: grid; grid-template-columns: 1.35fr .65fr; gap: clamp(38px,7vw,95px); align-items: end; }
    .hero .promise-box { padding: 30px; border: 1px solid var(--ink); color: var(--white); background: var(--ink); }
    .promise-box span { color: var(--gold); font: 600 .62rem/1.3 var(--mono); letter-spacing: .08em; text-transform: uppercase; }
    .promise-box strong { display: block; margin-top: 16px; font: 650 1.45rem/1.35 var(--slab); }
    .world-line { display: grid; grid-template-columns: repeat(11,auto); align-items: center; margin-top: 70px; border-block: 1px solid var(--rule); }
    .world-line span { display: grid; place-items: center; min-height: 82px; padding: 12px; border-right: 1px solid var(--rule); font: 600 .6rem/1.3 var(--mono); letter-spacing: .05em; text-align: center; text-transform: uppercase; }
    .world-line .arrow { color: var(--red); font-size: 1rem; }

    .product { background: var(--white); }
    .capability-grid { display: grid; grid-template-columns: repeat(3,1fr); margin-top: 54px; border-top: 1px solid var(--rule); border-left: 1px solid var(--rule); }
    .capability { min-height: 330px; padding: clamp(25px,3vw,39px); border-right: 1px solid var(--rule); border-bottom: 1px solid var(--rule); }
    .capability span { color: var(--red); font: 600 .61rem/1.3 var(--mono); letter-spacing: .085em; text-transform: uppercase; }
    .capability h3 { margin-top: 29px; }
    .capability p { color: var(--muted); }
    .saying { max-width: 1080px; margin: 62px 0 0; padding: 6px 0 6px 24px; border-left: 5px solid var(--red); font: italic 650 clamp(1.25rem,2.1vw,1.95rem)/1.43 var(--slab); }

    .matter { color: var(--white); background: radial-gradient(circle at 86% 15%,rgba(211,164,59,.16),transparent 31rem),var(--coal); }
    .matter .lede { color: #d2d3ce; }
    .claim { margin-top: 36px; font: 700 clamp(1.9rem,3.6vw,3.6rem)/1.12 var(--slab); }
    .record { display: grid; grid-template-columns: repeat(2,1fr); margin-top: 52px; border: 1px solid #bdb3a4; color: var(--ink); background: #f8f2e7; box-shadow: 0 28px 70px rgba(0,0,0,.28); }
    .record-head { grid-column: 1/-1; display: flex; justify-content: space-between; gap: 20px; padding: 17px 22px; border-bottom: 1px solid #c8beaf; background: #e6dccb; font: 600 .62rem/1.3 var(--mono); letter-spacing: .07em; text-transform: uppercase; }
    .field { display: grid; grid-template-columns: 9rem 1fr; gap: 18px; padding: 20px 24px; border-right: 1px solid #d8cebf; border-bottom: 1px solid #d8cebf; }
    .field:nth-child(odd) { border-right: 0; }
    .field dt { color: var(--red); font: 600 .59rem/1.4 var(--mono); letter-spacing: .07em; text-transform: uppercase; }
    .field dd { margin: 0; font-weight: 600; }
    .record-foot { grid-column: 1/-1; display: grid; grid-template-columns: repeat(3,1fr); background: var(--white); }
    .record-foot div { padding: 22px; border-right: 1px solid #d4c9ba; }
    .record-foot div:last-child { border-right: 0; }
    .record-foot small { display: block; color: var(--teal); font: 600 .58rem/1.3 var(--mono); letter-spacing: .08em; text-transform: uppercase; }
    .record-foot strong { display: block; margin-top: 7px; font-family: var(--slab); }

    .model { background: var(--paper); }
    .mechanism-list { display: grid; grid-template-columns: repeat(2,1fr); gap: 1px; margin-top: 52px; border: 1px solid var(--ink); background: var(--ink); }
    .mechanism { min-height: 380px; padding: clamp(28px,4vw,50px); background: var(--paper); }
    .mechanism .number { color: var(--red); font: 600 .62rem/1.3 var(--mono); letter-spacing: .09em; text-transform: uppercase; }
    .mechanism h3 { margin-top: 30px; }
    .mechanism p { color: var(--muted); }
    .mechanism strong { color: var(--teal); }

    .incentives { color: var(--white); background: var(--teal-dark); }
    .incentives .coordinate, .incentives .eyebrow { color: #efc562; }
    .incentives .lede { color: #dfe6e3; }
    .causal { display: grid; grid-template-columns: repeat(7,1fr); gap: 8px; margin-top: 48px; }
    .causal div { display: grid; place-items: center; min-height: 92px; padding: 13px; border: 1px solid rgba(255,255,255,.3); font: 600 .6rem/1.35 var(--mono); letter-spacing: .05em; text-align: center; text-transform: uppercase; }
    .causal .arrow { border: 0; color: #efc562; font-size: 1.1rem; }
    .pathology-grid { display: grid; grid-template-columns: repeat(2,1fr); margin-top: 48px; border-top: 1px solid var(--rule-dark); border-left: 1px solid var(--rule-dark); }
    .pathology { min-height: 280px; padding: clamp(25px,3.4vw,43px); border-right: 1px solid var(--rule-dark); border-bottom: 1px solid var(--rule-dark); }
    .pathology span { color: #efc562; font: 600 .6rem/1.3 var(--mono); letter-spacing: .08em; text-transform: uppercase; }
    .pathology h3 { margin-top: 25px; }
    .pathology p { color: #d9dfdc; }
    .qualification { margin-top: 38px; color: #dfe6e3; font-size: .98rem; }

    .capacity { background: var(--white); }
    .outcome-grid { display: grid; grid-template-columns: repeat(2,1fr); margin-top: 54px; border: 1px solid var(--rule); }
    .outcome { min-height: 325px; padding: clamp(28px,4vw,49px); border-right: 1px solid var(--rule); border-bottom: 1px solid var(--rule); }
    .outcome:nth-child(2n) { border-right: 0; }
    .outcome:nth-child(n+3) { border-bottom: 0; }
    .outcome span { color: var(--red); font: 600 .61rem/1.3 var(--mono); letter-spacing: .08em; text-transform: uppercase; }
    .outcome h3 { margin-top: 27px; }
    .outcome p { color: var(--muted); }

    .difference { background: var(--paper-2); }
    .value-split { display: grid; grid-template-columns: repeat(2,1fr); margin-top: 52px; border: 1px solid var(--ink); }
    .value-pane { min-height: 360px; padding: clamp(29px,4vw,50px); }
    .value-pane + .value-pane { border-left: 1px solid var(--ink); color: var(--white); background: var(--ink); }
    .value-pane span { color: var(--red); font: 600 .61rem/1.3 var(--mono); letter-spacing: .08em; text-transform: uppercase; }
    .value-pane + .value-pane span { color: var(--gold); }
    .value-pane h3 { margin-top: 27px; }
    .value-pane p { color: var(--muted); }
    .value-pane + .value-pane p { color: #ced0cb; }
    .mind { display: grid; grid-template-columns: 1fr auto 1fr; gap: 0; align-items: stretch; margin-top: 48px; border: 1px solid var(--teal); background: var(--white); }
    .mind div { padding: 28px; }
    .mind span { display: block; color: var(--red); font: 600 .6rem/1.3 var(--mono); letter-spacing: .08em; text-transform: uppercase; }
    .mind strong { display: block; margin-top: 8px; font: 650 1.35rem/1.3 var(--slab); }
    .mind .plus { display: grid; place-items: center; min-width: 80px; padding: 12px; color: var(--white); background: var(--teal); font: 700 1.5rem/1 var(--slab); }

    .close { color: var(--white); background: linear-gradient(rgba(255,255,255,.025) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.025) 1px,transparent 1px),var(--ink); background-size: 48px 48px; }
    .coda { max-width: 1080px; margin: 28px 0 0; padding: 6px 0 6px 24px; border-left: 5px solid var(--red); color: #f2ece2; font: 600 clamp(1.45rem,2.7vw,2.5rem)/1.42 var(--slab); }
    .deeper { display: grid; grid-template-columns: repeat(3,1fr); margin-top: 62px; border-top: 1px solid var(--rule-dark); border-left: 1px solid var(--rule-dark); }
    .deeper a { min-height: 175px; padding: 25px; border-right: 1px solid var(--rule-dark); border-bottom: 1px solid var(--rule-dark); text-decoration: none; }
    .deeper a:hover { background: rgba(211,164,59,.08); }
    .deeper strong { display: block; color: var(--gold); font: 650 1.08rem/1.3 var(--slab); }
    .deeper span { display: block; margin-top: 11px; color: #bfc0bb; font-size: .92rem; }
    .site-foot { display: flex; justify-content: space-between; gap: 25px; margin-top: 62px; padding-top: 25px; border-top: 1px solid var(--rule-dark); color: #92948f; font: 600 .6rem/1.4 var(--mono); letter-spacing: .06em; text-transform: uppercase; }

    @media (max-width: 1050px) {
      .main-nav a:not(.active-nav) { display: none; }
      .story-rail { grid-template-columns: 1.3fr repeat(3,1fr); }
      .story-rail > :nth-child(n+5) { display: none; }
      .hero .intro-grid { grid-template-columns: 1fr; }
      .capability-grid { grid-template-columns: repeat(2,1fr); }
      .causal { grid-template-columns: 1fr; }
      .causal div { min-height: 70px; }
      .causal .arrow { min-height: 28px; }
      .deeper { grid-template-columns: repeat(2,1fr); }
    }

    @media (max-width: 720px) {
      body { font-size: 16px; }
      .site-head { min-height: 66px; }
      .brand { font-size: 1.45rem; }
      .brand img { width: 18px; height: 34px; }
      .review-tag { display: none; }
      .story-rail { top: 66px; grid-template-columns: 1fr 1fr; }
      .story-rail > * { display: none !important; }
      .story-rail .rail-title, .story-rail .active { display: grid !important; }
      .section { padding: 68px 20px; }
      .section h1 { font-size: clamp(3rem,14vw,4.5rem); }
      .world-line { grid-template-columns: 1fr; }
      .world-line span { min-height: 56px; border-right: 0; border-bottom: 1px solid var(--rule); }
      .world-line .arrow { min-height: 28px; }
      .capability-grid, .record, .mechanism-list, .pathology-grid, .outcome-grid, .value-split, .deeper { grid-template-columns: 1fr; }
      .field { grid-template-columns: 1fr; gap: 7px; border-right: 0; }
      .record-foot { grid-template-columns: 1fr; }
      .record-foot div { border-right: 0; border-bottom: 1px solid #d4c9ba; }
      .outcome { min-height: auto; border-right: 0; border-bottom: 1px solid var(--rule) !important; }
      .outcome:last-child { border-bottom: 0 !important; }
      .value-pane + .value-pane { border-left: 0; border-top: 1px solid var(--ink); }
      .mind { grid-template-columns: 1fr; }
      .mind .plus { min-height: 56px; }
      .site-foot { flex-direction: column; }
    }


/* Public navigation keeps the current route visible when space becomes constrained. */
@media (max-width: 1050px) {
  body.runcible-public-os .main-nav a { display: none !important; }
  body.runcible-public-os .main-nav a.active-nav { display: block !important; color: var(--gold) !important; }
}