*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }

  :root {
    --black: #111111;
    --orange: #E05C2A;
    --offwhite: #F5F4F1;
    --gray: #6B6B6B;
    --white: #FFFFFF;
  }

  html { scroll-behavior: smooth; }

  body {
    font-family: 'Inter', Helvetica, Arial, sans-serif;
    background: var(--offwhite);
    color: var(--black);
    font-size: 16px;
    line-height: 1.6;
    -webkit-font-smoothing: antialiased;
  }

  /*    LOGO    */
  .logo {
    display: inline-flex;
    flex-direction: column;
    line-height: 1;
  }
  .logo-its {
    font-size: 14px;
    font-weight: 400;
    color: var(--gray);
    letter-spacing: 0;
    margin-bottom: 0px;
    line-height: 1;
  }
  .logo-outcome {
    font-size: 28px;
    font-weight: 700;
    color: var(--black);
    letter-spacing: -0.02em;
    line-height: 1;
  }
  .logo-outcome .period { color: var(--orange); }

  /*    NAV    */
  nav {
    position: fixed;
    top: 0; left: 0; right: 0;
    z-index: 100;
    background: var(--offwhite);
    border-bottom: 1px solid rgba(17,17,17,0.1);
    padding: 18px 48px;
    display: flex;
    align-items: center;
    justify-content: space-between;
  }
  .nav-links {
    display: flex;
    gap: 32px;
    list-style: none;
  }
  .nav-links a {
    font-size: 13px;
    font-weight: 500;
    color: var(--gray);
    text-decoration: none;
    letter-spacing: 0.01em;
    transition: color 0.15s;
  }
  .nav-links a:hover { color: var(--black); }
  .nav-cta {
    font-size: 13px;
    font-weight: 700;
    color: var(--white);
    background: var(--black);
    padding: 10px 22px;
    text-decoration: none;
    letter-spacing: 0.01em;
    transition: background 0.15s;
    white-space: nowrap;
  }
  .nav-cta:hover { background: var(--orange); }

  /*    HERO    */
  .hero {
    background: var(--black);
    padding: 168px 48px 104px;
    position: relative;
    overflow: hidden;
  }
  .hero::before {
    content: '';
    position: absolute;
    left: 0; top: 0; bottom: 0;
    width: 4px;
    background: var(--orange);
  }
  .hero-inner { max-width: 900px; }
  .hero-strap {
    font-size: 12px;
    font-weight: 700;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    color: rgba(255,255,255,0.5);
    margin-bottom: 28px;
  }
  .hero h1 {
    font-size: clamp(36px, 5vw, 58px);
    font-weight: 700;
    color: var(--white);
    letter-spacing: -0.02em;
    line-height: 1.1;
    margin-bottom: 32px;
  }
  .hero h1 em {
    font-style: normal;
    color: var(--orange);
  }
  .hero-sub {
    font-size: 18px;
    color: rgba(255,255,255,0.65);
    max-width: 640px;
    line-height: 1.65;
    margin-bottom: 0;
  }

  /*    SECTION WRAPPER    */
  section { padding: 64px 48px; }
  section[id] { scroll-margin-top: 84px; }
  .section-inner { max-width: 1040px; margin: 0 auto; }
  .dark { background: var(--black); color: var(--white); }
  .light { background: var(--offwhite); }
  .paper { background: var(--white); }

  h2 {
    font-size: 34px;
    font-weight: 700;
    letter-spacing: -0.02em;
    line-height: 1.2;
    margin-bottom: 14px;
  }
  .dark h2 { color: var(--white); }
  h2 .dot { color: var(--orange); }
  .section-intro {
    font-size: 16px;
    color: var(--gray);
    max-width: 660px;
    line-height: 1.7;
    margin-bottom: 52px;
  }
  .dark .section-intro { color: rgba(255,255,255,0.6); }

  /*    EYEBROW    */
  .eyebrow {
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    color: var(--orange);
    margin-bottom: 18px;
  }

  /*    BAND    */
  .band {
    margin-top: 36px;
    background: var(--black);
    color: var(--white);
    padding: 22px 28px;
    font-size: 15px;
    line-height: 1.6;
  }
  .dark .band {
    background: #1c1c1c;
    border-left: 3px solid var(--orange);
  }
  .band.band-plain { padding-left: 28px; }
  .band strong {
    color: var(--orange);
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    font-size: 11px;
    margin-right: 14px;
  }

  /*    CHAIN    */
  .chain {
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    gap: 2px;
    background: rgba(17,17,17,0.12);
    margin-bottom: 2px;
  }
  .dark .chain { background: rgba(255,255,255,0.1); }
  .chain-node {
    background: var(--offwhite);
    padding: 18px 16px;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 0.07em;
    text-transform: uppercase;
    text-align: center;
    position: relative;
  }
  .paper .chain-node { background: var(--white); }
  .dark .chain-node { background: #1a1a1a; color: var(--white); }
  .chain-node:last-child { color: var(--orange); }
  .chain-node:not(:last-child)::after {
    content: "\2192";
    position: absolute;
    right: 8px;
    top: 50%;
    transform: translateY(-50%);
    color: var(--orange);
    font-size: 22px;
    font-weight: 700;
    line-height: 1;
    letter-spacing: 0;
  }

  .chain-detail {
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    gap: 2px;
    background: rgba(17,17,17,0.12);
  }
  .dark .chain-detail { background: rgba(255,255,255,0.1); }
  .chain-cell {
    background: var(--offwhite);
    padding: 26px 20px;
  }
  .paper .chain-cell { background: var(--white); }
  .dark .chain-cell { background: #1a1a1a; }
  .chain-cell h4 {
    font-size: 14px;
    font-weight: 700;
    margin-bottom: 8px;
    letter-spacing: -0.01em;
  }
  .dark .chain-cell h4 { color: var(--white); }
  .chain-cell p {
    font-size: 13px;
    color: var(--gray);
    line-height: 1.65;
  }
  .dark .chain-cell p { color: rgba(255,255,255,0.5); }
  .chain-q {
    font-size: 13px;
    color: var(--gray);
    line-height: 1.6;
  }
  .dark .chain-q { color: rgba(255,255,255,0.5); }

  .chain-detail.centered .chain-cell {
    text-align: center;
    display: flex;
    align-items: center;
    justify-content: center;
  }
  .chain-detail.aligned .chain-cell h4 {
    min-height: 38px;
  }

  /*    GENERIC GRIDS    */
  .grid-3, .grid-4 {
    display: grid;
    gap: 2px;
    background: rgba(17,17,17,0.12);
  }
  .grid-3 { grid-template-columns: repeat(3, 1fr); }
  .grid-4 { grid-template-columns: repeat(4, 1fr); }
  .dark .grid-3, .dark .grid-4 { background: rgba(255,255,255,0.08); }
  .cell {
    background: var(--offwhite);
    padding: 38px 32px;
  }
  .paper .cell { background: var(--white); }
  .dark .cell { background: #1a1a1a; }
  .cell h3 {
    font-size: 18px;
    font-weight: 700;
    letter-spacing: -0.01em;
    margin-bottom: 12px;
    line-height: 1.3;
  }
  .dark .cell h3 { color: var(--white); }
  .cell p {
    font-size: 13px;
    color: var(--gray);
    line-height: 1.7;
  }
  .dark .cell p { color: rgba(255,255,255,0.5); }
  .cell-label {
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    color: var(--orange);
    margin-bottom: 14px;
  }

  /*    STATS    */
  .stat-number {
    font-size: 52px;
    font-weight: 700;
    color: var(--orange);
    letter-spacing: -0.03em;
    line-height: 1;
    margin-bottom: 12px;
  }
  .stat-label {
    font-size: 15px;
    font-weight: 700;
    color: var(--black);
    margin-bottom: 12px;
    line-height: 1.4;
  }

  /*    MATURITY    */
  .stage-num {
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 0.12em;
    color: var(--orange);
    margin-bottom: 14px;
  }
  .stage-quote {
    font-size: 16px;
    font-weight: 700;
    color: var(--black);
    line-height: 1.4;
    letter-spacing: -0.01em;
    margin-bottom: 20px;
  }
  .stage-list {
    list-style: none;
    display: flex;
    flex-direction: column;
    gap: 10px;
    margin-bottom: 24px;
  }
  .stage-list li {
    font-size: 12px;
    color: var(--gray);
    line-height: 1.6;
    display: flex;
    gap: 10px;
  }
  .stage-list li::before {
    content: "\25AA";
    color: var(--orange);
    font-size: 11px;
    line-height: 1.7;
    flex-shrink: 0;
  }
  .tell {
    border-top: 1px solid rgba(17,17,17,0.15);
    padding-top: 18px;
    margin-top: auto;
  }
  .tell-label {
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    color: var(--orange);
    margin-bottom: 8px;
  }
  .tell p {
    font-size: 12px;
    color: var(--gray);
    line-height: 1.6;
  }

  /*    ALTERNATIVES TABLE    */
  .alt-table {
    display: grid;
    grid-template-columns: 1fr 1.2fr 1.6fr;
    gap: 0;
    border-top: 1px solid rgba(17,17,17,0.15);
  }
  .alt-head {
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    color: var(--gray);
    padding: 16px 24px 16px 0;
    border-bottom: 1px solid rgba(17,17,17,0.15);
  }
  .alt-cell {
    padding: 24px 24px 24px 0;
    border-bottom: 1px solid rgba(17,17,17,0.15);
    font-size: 14px;
    color: var(--gray);
    line-height: 1.65;
  }
  .alt-cell.name {
    font-weight: 700;
    color: var(--black);
    font-size: 13px;
    letter-spacing: 0.06em;
    text-transform: uppercase;
  }

  /*    OFFERS    */
  .offer-quote {
    font-size: 15px;
    font-weight: 400;
    font-style: italic;
    color: var(--gray);
    line-height: 1.55;
    margin-bottom: 22px;
    min-height: 48px;
  }
  .offer-name {
    font-size: 12px;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: var(--black);
    line-height: 1.4;
    margin-bottom: 24px;
    padding-bottom: 20px;
    border-bottom: 1px solid rgba(17,17,17,0.15);
  }
  .offer-block { margin-bottom: 22px; }
  .offer-block .cell-label { margin-bottom: 8px; }
  .offer-cta {
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
    width: 100%;
    height: 48px;
    background: var(--orange);
    color: var(--white);
    font-size: 12px;
    font-weight: 700;
    text-decoration: none;
    letter-spacing: 0.02em;
    transition: opacity 0.15s;
    margin-top: auto;
  }
  .offer-cta:hover { opacity: 0.88; }
  #offers .cell { display: flex; flex-direction: column; }
  #offers .offer-block:last-of-type { margin-bottom: 28px; }

  /*    WHO WE ARE    */
  .why-inner {
    max-width: 1040px;
    margin: 0 auto;
    display: grid;
    grid-template-columns: 1fr 1.4fr;
    gap: 80px;
    align-items: start;
  }
  .why-sub {
    font-size: 14px;
    color: var(--gray);
    line-height: 1.7;
  }
  .why-proof {
    display: flex;
    flex-direction: column;
    border-top: 1px solid rgba(17,17,17,0.12);
    margin-top: 31px;
  }
  .proof-item {
    padding: 22px 0;
    border-bottom: 1px solid rgba(17,17,17,0.12);
    font-size: 14px;
    color: var(--black);
    line-height: 1.6;
  }

  /*    CTA    */
  .cta-section {
    background: var(--orange);
    padding: 80px 48px;
    text-align: center;
  }
  .cta-section h2 {
    font-size: 40px;
    font-weight: 700;
    color: var(--white);
    letter-spacing: -0.02em;
    margin-bottom: 16px;
    line-height: 1.15;
  }
  .cta-section p {
    font-size: 16px;
    color: rgba(255,255,255,0.85);
    margin-bottom: 40px;
    line-height: 1.6;
    max-width: 620px;
    margin-left: auto;
    margin-right: auto;
  }
  .cta-btn {
    display: inline-block;
    background: var(--white);
    color: var(--orange);
    font-size: 14px;
    font-weight: 700;
    padding: 16px 36px;
    text-decoration: none;
    letter-spacing: 0.02em;
    transition: opacity 0.15s;
  }
  .cta-btn:hover { opacity: 0.9; }

  /*    FOOTER    */
  footer {
    background: var(--black);
    padding: 40px 48px;
    display: flex;
    align-items: center;
    justify-content: space-between;
  }
  .footer-logo .logo-its { color: rgba(255,255,255,0.8); }
  .footer-logo .logo-outcome { color: var(--white); }
  .footer-right {
    font-size: 13px;
    color: var(--gray);
    text-align: right;
    line-height: 1.7;
  }
  .footer-right a {
    color: rgba(255,255,255,0.6);
    text-decoration: none;
  }
  .footer-right a:hover { color: var(--white); }

  .source-note {
    margin-top: 18px;
    font-size: 12px;
    color: var(--gray);
  }
  .dark .source-note { color: rgba(255,255,255,0.4); }

  /*    RESPONSIVE    */
  @media (max-width: 900px) {
    .grid-4 { grid-template-columns: repeat(2, 1fr); }

    /* Pair each chain label with its own cell when stacked */
    .chain-wrap {
      display: grid;
      grid-template-columns: 1fr;
      gap: 0;
      background: transparent;
    }
    .chain, .chain-detail { display: contents; }
    .chain-node::after { display: none; }
    .chain-node {
      border-top: 1px solid rgba(17,17,17,0.15);
      padding: 26px 4px 8px;
      background: transparent;
    }
    .dark .chain-node {
      border-top-color: rgba(255,255,255,0.15);
      background: transparent;
    }
    .chain-node:first-child { border-top: none; padding-top: 4px; }
    .chain-cell {
      padding: 0 4px 26px;
      background: transparent;
      text-align: center;
    }
    .dark .chain-cell { background: transparent; }
    .chain-detail.centered .chain-cell { display: block; }
    .chain-detail.aligned .chain-cell h4 { min-height: 0; margin-bottom: 6px; }

    .chain-node:nth-child(1) { order: 1; }
    .chain-cell:nth-child(1) { order: 2; }
    .chain-node:nth-child(2) { order: 3; }
    .chain-cell:nth-child(2) { order: 4; }
    .chain-node:nth-child(3) { order: 5; }
    .chain-cell:nth-child(3) { order: 6; }
    .chain-node:nth-child(4) { order: 7; }
    .chain-cell:nth-child(4) { order: 8; }
    .chain-node:nth-child(5) { order: 9; }
    .chain-cell:nth-child(5) { order: 10; }
  }
  @media (max-width: 768px) {
    nav { padding: 16px 24px; }
    section { padding: 64px 24px; }
    .hero { padding: 120px 24px 72px; }
    .grid-3, .grid-4 { grid-template-columns: 1fr; }
    .alt-table { grid-template-columns: 1fr; border-top: none; }
    .alt-head { display: none; }
    .alt-cell { padding: 14px 0; border-bottom: none; }
    .alt-cell.name {
      padding-top: 28px;
      border-top: 1px solid rgba(17,17,17,0.15);
    }
    .why-inner { grid-template-columns: 1fr; gap: 40px; }
    .cta-section { padding: 72px 24px; }
    footer { flex-direction: column; gap: 20px; text-align: center; }
    .footer-right { text-align: center; }
    .offer-quote { min-height: 0; }
  }

  /*    SUBPAGE HERO    */
  .hero-sm { padding: 148px 48px 76px; }
  .hero-sm h1 { font-size: clamp(32px, 4vw, 46px); margin-bottom: 24px; }
  .hero-sm .hero-sub { margin-bottom: 0; }

  /*    OFFER SUMMARY (home)    */
  .summary-card {
    background: var(--white);
    padding: 38px 32px;
    display: flex;
    flex-direction: column;
  }
  .summary-card h3 {
    font-size: 17px;
    font-weight: 700;
    letter-spacing: -0.01em;
    line-height: 1.3;
    margin-bottom: 14px;
  }
  .summary-card p {
    font-size: 14px;
    color: var(--gray);
    line-height: 1.7;
    margin-bottom: 26px;
  }
  .textlink {
    font-size: 13px;
    font-weight: 700;
    color: var(--black);
    text-decoration: none;
    border-bottom: 2px solid var(--orange);
    padding-bottom: 3px;
    transition: color 0.15s;
  }
  /* pin to the bottom of a vertical card, but leave the flex row alone */
  .summary-card .textlink {
    align-self: flex-start;
    margin-top: auto;
  }
  .textlink:hover { color: var(--orange); }

  /*    PRACTICE LINE    */
  .practice-line {
    margin-top: 34px;
    padding-top: 24px;
    border-top: 1px solid rgba(17,17,17,0.12);
    font-size: 14px;
    color: var(--gray);
    line-height: 1.7;
  }
  .practice-line a {
    color: var(--black);
    font-weight: 700;
    text-decoration: none;
    border-bottom: 2px solid var(--orange);
    padding-bottom: 2px;
  }
  .practice-line a:hover { color: var(--orange); }

  /*    NEXT-PAGE STRIP    */
  .next-strip {
    border-top: 1px solid rgba(17,17,17,0.15);
    padding-top: 34px;
    margin-top: 8px;
    display: flex;
    justify-content: space-between;
    align-items: baseline;
    gap: 24px;
    flex-wrap: wrap;
  }
  .next-strip p { font-size: 15px; color: var(--gray); }

  @media (max-width: 768px) {
    .hero-sm { padding: 108px 24px 56px; }
  }


  /*    STAGE STYLES ON DARK    */
  .dark .stage-quote { color: var(--white); }
  .dark .stage-list li { color: rgba(255,255,255,0.5); }
  .dark .tell { border-top-color: rgba(255,255,255,0.12); }
  .dark .tell p { color: rgba(255,255,255,0.6); }

  /*    TIGHTER TOP WHERE THERE IS NO EYEBROW    */
  .section-tight { padding-top: 44px; }

  /*    TWO-COLUMN OFFER BLOCK    */
  .section-narrow { max-width: 820px; margin: 0 auto; }
  .duo { grid-template-columns: repeat(2, 1fr); }
  .duo .cell { padding: 32px 28px; }
  .duo .offer-quote { min-height: 0; margin-bottom: 18px; }
  .duo .offer-name { margin-bottom: 20px; padding-bottom: 16px; }

  /*    NUMBERED STEPS    */
  .step-num {
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 0.12em;
    color: var(--orange);
    margin-bottom: 12px;
  }
  .cell h3.step-title {
    font-size: 20px;
    margin-bottom: 10px;
  }

  @media (max-width: 900px) {
    .duo { grid-template-columns: 1fr; }
  }

  /*    WRITING INDEX    */
  .post-list {
    border-top: 1px solid rgba(17,17,17,0.15);
    margin-top: 8px;
  }
  .post-item {
    display: block;
    text-decoration: none;
    padding: 30px 0;
    border-bottom: 1px solid rgba(17,17,17,0.15);
    transition: opacity 0.15s;
  }
  .post-item:hover { opacity: 0.65; }
  .post-kicker {
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    color: var(--orange);
    margin-bottom: 10px;
  }
  .post-item h3 {
    font-size: 23px;
    font-weight: 700;
    color: var(--black);
    letter-spacing: -0.02em;
    line-height: 1.25;
    margin-bottom: 10px;
  }
  .post-item p {
    font-size: 15px;
    color: var(--gray);
    line-height: 1.65;
    max-width: 640px;
  }

  /*    ARTICLE BODY    */
  .article {
    max-width: 680px;
    margin: 0 auto;
  }
  .article p {
    font-size: 17px;
    line-height: 1.75;
    color: #2A2A2A;
    margin-bottom: 22px;
  }
  .article h2 {
    font-size: 25px;
    font-weight: 700;
    letter-spacing: -0.02em;
    line-height: 1.25;
    margin: 44px 0 14px;
  }
  .article h3 {
    font-size: 19px;
    font-weight: 700;
    letter-spacing: -0.01em;
    margin: 32px 0 10px;
  }
  .article ul, .article ol {
    margin: 0 0 22px 20px;
  }
  .article li {
    font-size: 17px;
    line-height: 1.75;
    color: #2A2A2A;
    margin-bottom: 10px;
  }
  .article blockquote {
    border-left: 3px solid var(--orange);
    padding-left: 22px;
    margin: 32px 0;
    font-size: 19px;
    line-height: 1.6;
    font-weight: 700;
    letter-spacing: -0.01em;
    color: var(--black);
  }
  .article a {
    color: var(--black);
    font-weight: 700;
    text-decoration: none;
    border-bottom: 2px solid var(--orange);
  }
  .article a:hover { color: var(--orange); }
  .article hr {
    border: none;
    border-top: 1px solid rgba(17,17,17,0.15);
    margin: 40px 0;
  }
  .article .lede {
    font-size: 19px;
    line-height: 1.65;
    color: var(--gray);
    margin-bottom: 30px;
  }

  @media (max-width: 768px) {
    .article p, .article li { font-size: 16px; }
    .post-item h3 { font-size: 20px; }
  }

  /*    ARTICLE FIGURE    */
  .article figure {
    margin: 36px 0;
  }
  .article figure svg {
    width: 100%;
    height: auto;
    display: block;
  }
  .article figcaption {
    font-size: 13px;
    color: var(--gray);
    margin-top: 14px;
    line-height: 1.6;
  }
  .article .signoff {
    margin-top: 40px;
    padding-top: 24px;
    border-top: 1px solid rgba(17,17,17,0.15);
    font-size: 14px;
    font-style: italic;
    color: var(--gray);
    line-height: 1.7;
  }

  /*    MOBILE MENU    */
  .nav-toggle {
    display: none;
    background: none;
    border: none;
    cursor: pointer;
    padding: 8px;
    width: 40px;
    height: 40px;
    flex-direction: column;
    justify-content: center;
    gap: 5px;
  }
  .nav-toggle span {
    display: block;
    height: 2px;
    width: 22px;
    background: var(--black);
    transition: transform 0.2s, opacity 0.2s;
  }
  nav.open .nav-toggle span:nth-child(1) { transform: translateY(7px) rotate(45deg); }
  nav.open .nav-toggle span:nth-child(2) { opacity: 0; }
  nav.open .nav-toggle span:nth-child(3) { transform: translateY(-7px) rotate(-45deg); }
  .nav-cta-mobile { display: none; }

  @media (max-width: 900px) {
    nav { position: fixed; }
    .nav-toggle { display: flex; }
    nav > .nav-cta { display: none; }
    .nav-links {
      display: none;
      position: absolute;
      top: 100%;
      left: 0;
      right: 0;
      background: var(--offwhite);
      border-bottom: 1px solid rgba(17,17,17,0.1);
      flex-direction: column;
      gap: 0;
      padding: 8px 0 20px;
    }
    nav.open .nav-links { display: flex; }
    .nav-links li { border-top: 1px solid rgba(17,17,17,0.08); }
    .nav-links li:first-child { border-top: none; }
    .nav-links a {
      display: block;
      padding: 16px 24px;
      font-size: 15px;
      color: var(--black);
    }
    .nav-cta-mobile { display: block; border-top: none; padding: 18px 24px 0; }
    .nav-cta-mobile a {
      display: block;
      background: var(--black);
      color: var(--white);
      text-align: center;
      font-weight: 700;
      padding: 15px 20px;
      font-size: 14px;
    }
  }