/* The day job. Its own block: the industries as tiles on the playfield, each linking to its row in a
   table that reads fine with no CSS at all. Tiles land one after another; the motion is decoration only. */
.ent { background: var(--paper); color: var(--ink); }
.ent * { box-sizing: border-box; }
.ent-hero { background: var(--field); color: #eef1f4; padding: clamp(20px, 5vw, 64px) 16px clamp(28px, 5vw, 56px); }
.ent-hero > *, .ent-table-wrap > *, .ent-proof > * { max-width: 1760px; margin-inline: auto; }
.ent-crumb { display: flex; gap: 8px; align-items: center; margin-bottom: 18px; color: #b9c0cb; font-size: .95rem; }
.ent-crumb a { display: inline-flex; align-items: center; min-height: 44px; color: inherit; font-weight: 700; text-decoration: underline; text-underline-offset: .2em; }
.ent-hero h1 { margin: 0; font-size: var(--h1-page); line-height: 1.05; letter-spacing: -0.025em; text-wrap: balance; font-stretch: 112%;}
.ent-lede { margin: 18px auto 0; font-size: clamp(1.05rem, 1.6vw, 1.3rem); line-height: 1.5; color: #d6dbe2; }
.ent-tiles { list-style: none; padding: 0; margin-top: 28px; display: grid; grid-template-columns: repeat(3, 1fr); gap: 6px; }
.ent-tiles a { display: grid; justify-items: center; align-content: center; gap: 8px; min-height: 104px; padding: 12px 6px;
  background: var(--field-2); border-top: 6px solid var(--tile); border-radius: 3px; color: #eef1f4; text-decoration: none;
  font-weight: 700; font-size: .9rem; text-align: center;
  box-shadow: inset 0 -4px 0 rgba(0,0,0,.35), 0 6px 14px rgba(0,0,0,.35); }
.ent-tiles .sprite { width: 52px; height: auto; }
.ent-tiles a:focus-visible { background: #242833; }
@media (hover: hover) { .ent-tiles a:hover { background: #242833; } }
.ent-tiles a:focus-visible { outline: 3px solid var(--tile); outline-offset: 2px; }
@media (min-width: 1000px) { .ent-tiles { grid-template-columns: repeat(9, 1fr); } .ent-tiles .sprite { width: 44px; } }

.ent-table-wrap, .ent-proof { padding: clamp(28px, 5vw, 56px) 16px 0; }
.ent-table-wrap h2, .ent-proof h2 { font-size: var(--h2); margin-bottom: 10px; font-weight: 800; font-stretch: 112%; }
.ent-takeaway { font-size: 1.1rem; line-height: 1.55; color: var(--ink-soft); margin-bottom: 18px; }
.ent-why { display: block; margin-top: 4px; color: var(--ink-soft); }
.ent-proof { padding-bottom: 56px; }
.ent-proof p { font-size: 1.1rem; line-height: 1.55; }
.ent-routes { padding-left: 1.2em; }
.ent-routes a { display: inline-flex; align-items: center; min-height: 44px; color: var(--work-ink); font-weight: 700; }
.ent-next { margin-top: 22px; }
.ent-lede a { color: var(--number); text-underline-offset: .18em; }

/* 2026-10-11 rebuild: current clients with the work and the why, then habits across every client.
   Industry tiles are neutral (color is reserved for the system's outcomes); sprites carry identity. */
.ent-tiles a { border-top-color: var(--step); }
@media (min-width: 1000px) { .ent-tiles { grid-template-columns: repeat(5, 1fr); } }
.ent-breadth { list-style: none; padding: 0; margin: 24px auto 0; display: grid; grid-template-columns: repeat(2, 1fr); gap: 8px; }
@media (min-width: 760px) { .ent-breadth { grid-template-columns: repeat(5, 1fr); } }
.ent-breadth li { display: grid; gap: 2px; padding: 12px 14px; background: var(--field-2); border-radius: 3px; box-shadow: inset 0 -4px 0 rgba(0,0,0,.35); }
.ent-breadth strong { font-size: clamp(1.6rem, 3vw, 2.2rem); line-height: 1; color: var(--proof); }
.ent-breadth span { color: #d6dbe2; font-weight: 600; line-height: 1.35; font-size: .95rem; }
.ent-breadth li:last-child:nth-child(odd) { grid-column: 1 / -1; }
@media (min-width: 760px) { .ent-breadth li:last-child:nth-child(odd) { grid-column: auto; } }
.ent-breadth-src { margin: 10px auto 0; font-size: .85rem; color: #b9c0cb; }

.ent-client, .ent-practices, .ent-earlier { padding: clamp(32px, 5vw, 64px) 16px; scroll-margin-top: 72px; }
.ent-client > *, .ent-practices > *, .ent-earlier > * { max-width: 1760px; margin-inline: auto; }
.ent-client--alt { background: #e7ebef; }
.ent-client-head { display: grid; grid-template-columns: auto 1fr; gap: 16px; align-items: start; }
.ent-client-head .sprite { width: 56px; height: auto; padding: 8px; background: var(--field); border-radius: 3px; box-sizing: content-box; }
.ent-client h2, .ent-practices h2, .ent-earlier h2 { margin: 0; font-size: clamp(1.4rem, 2.8vw, 2.1rem); line-height: 1.15; }
.ent-need { margin: 8px 0 0; max-width: 60em; font-size: 1.05rem; line-height: 1.55; color: var(--ink); }
.ent-need span, .ent-why span { display: block; font-size: .82rem; font-weight: 800; color: var(--ink-soft); }
.ent-work { list-style: none; padding: 0; margin-top: 24px; display: grid; gap: 14px; }
@media (min-width: 760px) { .ent-work { grid-template-columns: repeat(2, 1fr); } .ent-work > li:last-child:nth-child(odd) { grid-column: 1 / -1; } }
@media (min-width: 1300px) { .ent-work--practices { grid-template-columns: repeat(3, 1fr); } .ent-work--practices > li:last-child:nth-child(odd) { grid-column: auto; } }
.ent-item { display: grid; align-content: start; gap: 10px; padding: 20px 22px; background: var(--sheet, #fff); border-top: 6px solid var(--step); border-radius: 3px;
  box-shadow: 0 1px 0 var(--paper-line), 0 8px 20px rgba(20, 22, 28, .07); }
.ent-item h3 { margin: 0; font-size: 1.2rem; line-height: 1.25; }
.ent-status { display: inline-block; margin-left: 6px; padding: 2px 8px; background: #eef1f4; color: var(--ink-soft); font-size: .75rem; font-weight: 800; border-radius: 2px; vertical-align: middle; }
.ent-what { margin: 0; line-height: 1.55; color: var(--ink); }
.ent-why { margin: 0; line-height: 1.55; color: var(--ink-soft); }
.ent-tags { margin-top: 4px; }
.ent-earlier-list { list-style: none; padding: 0; margin-top: 18px; display: grid; gap: 10px; }
@media (min-width: 760px) { .ent-earlier-list { grid-template-columns: repeat(2, 1fr); } }
.ent-earlier-list li { display: grid; grid-template-columns: auto 1fr; gap: 12px; align-items: start; scroll-margin-top: 80px; }
.ent-earlier-list .sprite { width: 36px; height: auto; padding: 5px; background: var(--field); border-radius: 2px; box-sizing: content-box; }
.ent-earlier-list strong { display: block; }
.ent-earlier-list li:target { outline: 3px solid var(--proof); outline-offset: 6px; }
.ent-hero, .ent-client, .ent-practices, .ent-earlier, .ent-proof { padding-inline: var(--gutter); }
.ent-role { display: inline-block; margin: 0 0 6px; padding: 3px 10px; font-size: .82rem; font-weight: 800; border-radius: 2px; background: #2a2e38; color: #eef1f4; }
.ent-role--owned { background: #f4f1ea; color: var(--ink); box-shadow: inset 0 0 0 2px var(--ink); }
.ent-role-line { margin: 8px 0 0; max-width: 60em; font-size: 1.05rem; line-height: 1.55; font-weight: 600; color: var(--ink); }

/* Intent first (2026-10-12): who searches, the stages they move through, then what Hayden checks first. */
.ent-intent { margin-top: 12px; }
.ent-need > p { margin: 18px 0 6px; max-width: min(100%, 62ch); }
.ent-need > p span { margin-bottom: 4px; }
.ent-intents { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 200px), 1fr)); gap: 8px; margin: 8px 0 0; padding: 0; list-style: none; counter-reset: stage; }
.ent-intents li { position: relative; padding: 12px 14px 12px 40px; background: var(--sheet, #fff); border: 1px solid var(--paper-line, #d0d6de); border-top: 4px solid var(--step); border-radius: 4px; font-size: .95rem; line-height: 1.45; counter-increment: stage; }
.ent-intents li::before { content: counter(stage); position: absolute; left: 12px; top: 12px; display: grid; place-items: center; width: 20px; height: 20px; background: var(--ink); color: var(--sheet, #fff); font: 800 .75rem/1 var(--face); border-radius: 3px; }
.ent-intents strong { display: block; font-size: .82rem; }
.ent-essentials { display: grid; gap: 10px; margin: 8px 0 0; padding: 0; list-style: none; counter-reset: ess; max-width: min(100%, 62ch); }
.ent-essentials li { position: relative; padding: 12px 14px 12px 48px; background: var(--sheet, #fff); border: 1px solid var(--paper-line, #d0d6de); border-radius: 4px; counter-increment: ess; }
.ent-essentials li::before { content: counter(ess); position: absolute; left: 12px; top: 12px; display: grid; place-items: center; width: 26px; height: 26px; background: var(--found); color: #0d2236; font: 850 .9rem/1 var(--face); border-radius: 3px; }
.ent-essentials p { margin: 0; line-height: 1.5; }
.ent-essentials em { color: var(--ink-soft); font-style: normal; font-size: .85rem; white-space: nowrap; }