/* ============================================================
   CHI — Companies experience (production)
   Scoped entirely under .chi-companies-redesign so it cannot
   collide with any existing selector in styles.css (several class
   names below — e.g. hero-copy, stat-block — are already used
   elsewhere on the site for unrelated components). Reuses design
   tokens already defined globally on :root in styles.css
   (--bg, --panel, --text, --muted, --line, --acid, --danger, --cvi)
   and the real .site-header / .container / box-sizing rules —
   none of that is redeclared here. Does not modify styles.css.
   ============================================================ */

.chi-companies-redesign{--row-h:60px}

/* ============================================================
   LANDING PAGE
   ============================================================ */

.chi-companies-redesign.companies-landing{padding-bottom:44px}


/* ---- concise landing headline above the grid ---- */
.chi-companies-redesign .landing-intro{padding:44px 0 30px;text-align:center}
.chi-companies-redesign .landing-intro .eyebrow{
  font-size:11px;text-transform:uppercase;letter-spacing:.2em;color:var(--acid);
  font-weight:700;margin:0 0 16px;
}
.chi-companies-redesign .landing-intro h1{
  font-size:clamp(30px,4.4vw,58px);line-height:1.06;letter-spacing:-.035em;
  margin:0 auto;max-width:20ch;font-weight:800;
}
.chi-companies-redesign .landing-intro h1 span{display:block;color:#8f8d88}

/* ---- uniform sector grid: every sector, same card ---- */
.chi-companies-redesign .sector-grid-section{padding:0 0 8px}
.chi-companies-redesign .sector-grid{
  display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px;
}

.chi-companies-redesign .sector-card{
  position:relative;display:block;overflow:hidden;min-width:0;
  border:1px solid var(--line);background:#080808;
  min-height:250px;
  transition:border-color .18s ease,transform .18s ease;
}
.chi-companies-redesign .sector-card:hover,
.chi-companies-redesign .sector-card:focus-visible{border-color:var(--acid)}
.chi-companies-redesign .sector-card:focus-visible{outline:2px solid var(--acid);outline-offset:2px}

.chi-companies-redesign .sector-card-photo{
  position:absolute;inset:0;width:100%;height:100%;
  object-fit:cover;display:block;border:0;z-index:0;
  transform:scale(1.01);transition:transform .5s ease;
}
.chi-companies-redesign .sector-card:hover .sector-card-photo{transform:scale(1.05)}

/* Approved crops, preserved from the previous Companies imagery. */
.chi-companies-redesign .photo-luxury{object-position:center 38%}
.chi-companies-redesign .photo-streaming{object-position:center 45%}
.chi-companies-redesign .photo-dating{object-position:center 60%}
.chi-companies-redesign .photo-technology{object-position:center 55%}
.chi-companies-redesign .photo-travel{object-position:center 55%}
.chi-companies-redesign .photo-social-media,
.chi-companies-redesign .photo-transportation,
.chi-companies-redesign .photo-productivity-software,
.chi-companies-redesign .photo-ai,
.chi-companies-redesign .photo-ticketing,
.chi-companies-redesign .photo-healthcare{object-position:center center}

.chi-companies-redesign .sector-card-scrim{
  position:absolute;inset:0;z-index:1;pointer-events:none;
  background:
    linear-gradient(180deg, rgba(3,3,3,.62) 0%, rgba(3,3,3,.20) 34%, rgba(3,3,3,.55) 74%, rgba(3,3,3,.86) 100%),
    linear-gradient(90deg, rgba(3,3,3,.72) 0%, rgba(3,3,3,.22) 52%, rgba(3,3,3,0) 100%);
}

.chi-companies-redesign .sector-card-body{
  position:relative;z-index:2;
  display:flex;flex-direction:column;
  height:100%;padding:22px;gap:12px;
  min-width:0;
}
.chi-companies-redesign .sector-card-icon{display:block;color:var(--acid);line-height:0}
.chi-companies-redesign .sector-card-icon svg{width:26px;height:26px;display:block}

.chi-companies-redesign .sector-card-head{display:block;margin-top:auto;min-width:0}
.chi-companies-redesign .sector-card-title{
  display:block;color:#fff;font-weight:800;
  font-size:clamp(19px,1.7vw,25px);line-height:1.08;
  letter-spacing:.01em;text-transform:uppercase;
  margin:0 0 8px;overflow-wrap:break-word;
}
.chi-companies-redesign .sector-card-blurb{
  display:block;color:#c9c6bf;font-size:13px;line-height:1.42;
  max-width:26ch;overflow-wrap:break-word;
}

.chi-companies-redesign .sector-card-foot{
  display:flex;align-items:center;justify-content:space-between;gap:12px;
  margin-top:14px;min-width:0;
}
.chi-companies-redesign .sector-card-go{
  flex:none;display:grid;place-items:center;width:34px;height:34px;
  border:1px solid var(--acid);border-radius:50%;color:var(--acid);
  transition:background .18s ease,color .18s ease;
}
.chi-companies-redesign .sector-card-go svg{width:15px;height:15px;display:block}
.chi-companies-redesign .sector-card:hover .sector-card-go{background:var(--acid);color:#050505}
.chi-companies-redesign .sector-card-count{
  font-size:10.5px;text-transform:uppercase;letter-spacing:.12em;color:#a5a29b;
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis;min-width:0;
}

/* Desktop: all 10 sectors as one 5 x 2 block — every card identical.
   Type and controls step down a notch so the narrower column still holds
   the longest sector names on a single line where it can. */
@media (min-width:1081px){
  .chi-companies-redesign .sector-grid{grid-template-columns:repeat(5,minmax(0,1fr));gap:14px}
  .chi-companies-redesign .sector-card{min-height:252px}
  .chi-companies-redesign .sector-card-body{padding:16px;gap:10px}
  .chi-companies-redesign .sector-card-icon svg{width:22px;height:22px}
  .chi-companies-redesign .sector-card-title{font-size:clamp(15px,1.45vw,18px);margin:0 0 6px}
  .chi-companies-redesign .sector-card-blurb{font-size:12px;line-height:1.38;max-width:22ch}
  .chi-companies-redesign .sector-card-foot{margin-top:12px}
  .chi-companies-redesign .sector-card-go{width:30px;height:30px}
  .chi-companies-redesign .sector-card-go svg{width:14px;height:14px}
  .chi-companies-redesign .sector-card-count{font-size:9.5px;letter-spacing:.1em}
}

.chi-companies-redesign .landing-endcap{padding:30px 0 0}
.chi-companies-redesign .landing-stats{
  border-top:1px solid var(--line);padding-top:22px;
  display:flex;flex-wrap:wrap;gap:32px;justify-content:space-between;align-items:center;
}
.chi-companies-redesign .landing-stats-note{color:var(--muted);font-size:13px;max-width:32ch}
.chi-companies-redesign .stat-row{display:flex;gap:32px;flex-wrap:wrap}
.chi-companies-redesign .stat-block{min-width:110px}
.chi-companies-redesign .stat-block strong{display:block;font-size:22px;font-weight:900;color:var(--acid)}
.chi-companies-redesign .stat-block span{display:block;font-size:11.5px;color:var(--muted);text-transform:uppercase;letter-spacing:.06em;margin-top:2px}

/* ============================================================
   SECTOR / WORKING PAGE
   ============================================================ */

.chi-companies-redesign.sector-shell{
  display:grid;grid-template-columns:220px 1fr;gap:0;
  min-height:calc(100vh - 78px);
}
.chi-companies-redesign.sector-shell.has-compare{grid-template-columns:220px 1fr 260px}

/* --- left rail --- */
.chi-companies-redesign .sector-rail{
  border-right:1px solid var(--line);padding:26px 18px;
}
.chi-companies-redesign .rail-heading{font-size:10.5px;text-transform:uppercase;letter-spacing:.14em;color:var(--muted);margin:0 0 12px}
.chi-companies-redesign .rail-list{list-style:none;margin:0 0 18px;padding:0;display:flex;flex-direction:column;gap:2px}
.chi-companies-redesign .rail-item{
  display:flex;align-items:center;justify-content:space-between;gap:8px;
  padding:9px 10px;font-size:13.5px;color:var(--muted);border-left:2px solid transparent;
}
.chi-companies-redesign .rail-item:hover{color:var(--text)}
.chi-companies-redesign .rail-item.is-active{color:var(--acid);background:rgba(216,255,62,.06);border-left-color:var(--acid);font-weight:700}
.chi-companies-redesign .rail-item-count{font-size:11px;color:var(--muted)}
.chi-companies-redesign .rail-item.is-active .rail-item-count{color:var(--acid)}
.chi-companies-redesign .rail-viewall{
  display:block;font-size:12px;color:var(--muted);padding:9px 10px;margin-bottom:14px;
  border-top:1px solid var(--line);padding-top:14px;
}
.chi-companies-redesign .rail-viewall:hover{color:var(--text)}
.chi-companies-redesign .rail-my-companies{
  display:flex;align-items:center;justify-content:center;gap:8px;width:100%;
  background:var(--acid);color:#050505;border:0;padding:12px 10px;
  font-size:12.5px;font-weight:900;text-transform:uppercase;letter-spacing:.06em;cursor:pointer;
}
.chi-companies-redesign .rail-my-companies.is-active{background:#050505;color:var(--acid);box-shadow:inset 0 0 0 1px var(--acid)}
.chi-companies-redesign .rail-my-companies svg{flex:none}

.chi-companies-redesign .rail-select{display:none}

/* --- main column --- */
.chi-companies-redesign .sector-main{padding:26px 28px 60px;min-width:0}
.chi-companies-redesign .sector-topbar{display:flex;flex-direction:column;gap:16px;margin-bottom:18px}
.chi-companies-redesign .sector-search{
  display:flex;align-items:center;gap:10px;
  background:var(--panel);border:1px solid var(--line);padding:11px 14px;max-width:460px;
}
.chi-companies-redesign .sector-search svg{flex:none;color:var(--muted)}
.chi-companies-redesign .sector-search input{flex:1;background:none;border:0;outline:0;color:var(--text);font-size:14px;font-family:inherit}
.chi-companies-redesign .sector-search input::placeholder{color:var(--muted)}
.chi-companies-redesign .sector-heading-row{display:flex;align-items:baseline;justify-content:space-between;gap:12px;flex-wrap:wrap}
.chi-companies-redesign .sector-heading-row h1{font-size:26px;margin:0;font-weight:800;letter-spacing:-.01em}
.chi-companies-redesign .sector-count{font-size:12.5px;color:var(--muted);text-transform:uppercase;letter-spacing:.06em}

.chi-companies-redesign .company-list{display:flex;flex-direction:column;gap:7px}
.chi-companies-redesign .company-row{
  display:grid;
  grid-template-columns:32px minmax(0,1.6fr) 158px 56px 56px 64px 28px;
  align-items:center;gap:14px;
  min-height:var(--row-h);
  padding:0 14px;
  background:var(--panel);border:1px solid var(--line);
  cursor:pointer;
  transition:border-color .12s ease,background .12s ease;
}
.chi-companies-redesign .company-row:hover{border-color:#3a3a3a;background:var(--panel2)}
.chi-companies-redesign .company-row.is-selected{border-color:var(--acid);background:rgba(216,255,62,.05)}
.chi-companies-redesign .company-row.is-hidden{display:none}

.chi-companies-redesign .row-mono{
  width:30px;height:30px;display:grid;place-items:center;
  background:var(--panel2);border:1px solid var(--line);
  font-size:11px;font-weight:900;color:var(--muted);letter-spacing:0;
}
.chi-companies-redesign .company-row.is-selected .row-mono{border-color:var(--acid);color:var(--acid)}

.chi-companies-redesign .row-name-wrap{min-width:0}
.chi-companies-redesign .row-name{font-size:14px;font-weight:700;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.chi-companies-redesign .row-sector{font-size:11px;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;display:none}

.chi-companies-redesign .row-status{display:flex;align-items:center;gap:7px;min-width:0}
.chi-companies-redesign .status-dot{width:7px;height:7px;border-radius:50%;flex:none;background:var(--muted)}
.chi-companies-redesign .status-dot.tier-good{background:var(--acid)}
.chi-companies-redesign .status-dot.tier-mid{background:var(--cvi)}
.chi-companies-redesign .status-dot.tier-bad{background:var(--danger)}
.chi-companies-redesign .row-status-text{font-size:11.5px;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}

.chi-companies-redesign .row-metric{font-size:13px;font-weight:800;text-align:right;white-space:nowrap}
.chi-companies-redesign .row-metric small{font-size:9px;color:var(--muted);font-weight:700;display:block;text-align:right;letter-spacing:.05em}
.chi-companies-redesign .row-metric.is-dash{color:var(--muted);font-weight:600}
.chi-companies-redesign .row-cfs.is-positive{color:var(--acid)}
.chi-companies-redesign .row-cfs.is-negative{color:var(--danger)}

.chi-companies-redesign .row-star{
  background:none;border:0;padding:2px;cursor:pointer;color:var(--muted);
  display:grid;place-items:center;
}
.chi-companies-redesign .row-star svg{width:18px;height:18px}
.chi-companies-redesign .row-star.is-saved{color:var(--acid)}
.chi-companies-redesign .row-star:hover{color:var(--text)}
.chi-companies-redesign .row-star.is-saved:hover{color:var(--acid)}

.chi-companies-redesign .list-empty{
  padding:60px 20px;text-align:center;color:var(--muted);font-size:14px;border:1px dashed var(--line);
}

/* --- right rail: compare ---
   Hidden completely until at least one company is selected, so the empty
   tray never eats horizontal space on desktop or covers the list on
   mobile. .sector-shell.has-compare (toggled in JS) restores it. */
.chi-companies-redesign .compare-rail{display:none}
.chi-companies-redesign.sector-shell.has-compare .compare-rail{
  border-left:1px solid var(--line);padding:26px 18px;display:flex;flex-direction:column;gap:14px;
}
.chi-companies-redesign .compare-heading{display:flex;align-items:center;justify-content:space-between}
.chi-companies-redesign .compare-heading .rail-heading{margin:0}
.chi-companies-redesign .compare-clear{background:none;border:0;color:var(--muted);font-size:11px;text-transform:uppercase;letter-spacing:.06em;cursor:pointer}
.chi-companies-redesign .compare-clear:hover{color:var(--text)}

.chi-companies-redesign .tombstone{
  border:1px solid var(--line);background:var(--panel);padding:12px 12px 10px;position:relative;
}
.chi-companies-redesign .tombstone-top{display:flex;align-items:flex-start;justify-content:space-between;gap:8px;margin-bottom:8px}
.chi-companies-redesign .tombstone-name{font-size:13.5px;font-weight:800}
.chi-companies-redesign .tombstone-sector{font-size:10.5px;color:var(--muted);text-transform:uppercase;letter-spacing:.06em;margin-top:1px}
.chi-companies-redesign .tombstone-remove{background:none;border:0;color:var(--muted);cursor:pointer;font-size:15px;line-height:1;padding:2px}
.chi-companies-redesign .tombstone-remove:hover{color:var(--danger)}
.chi-companies-redesign .tombstone-metrics{display:flex;gap:10px}
.chi-companies-redesign .tombstone-metric{flex:1;text-align:center;background:var(--panel2);padding:6px 4px;border:1px solid var(--line)}
.chi-companies-redesign .tombstone-metric strong{display:block;font-size:14px;font-weight:900}
.chi-companies-redesign .tombstone-metric span{display:block;font-size:8.5px;color:var(--muted);text-transform:uppercase;letter-spacing:.08em;margin-top:1px}

.chi-companies-redesign .compare-limit-note{font-size:11px;color:var(--muted)}

.chi-companies-redesign .compare-cta{
  display:flex;align-items:center;justify-content:center;gap:8px;
  background:var(--acid);color:#050505;font-weight:900;font-size:12.5px;
  text-transform:uppercase;letter-spacing:.06em;padding:12px 10px;margin-top:2px;
}
.chi-companies-redesign .compare-cta.is-disabled{background:var(--panel2);color:var(--muted);border:1px solid var(--line);cursor:default}
.chi-companies-redesign .compare-cta[hidden]{display:none}

/* ============================================================
   RESPONSIVE
   ============================================================ */

@media (max-width:1080px){
  .chi-companies-redesign .sector-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
  .chi-companies-redesign.sector-shell{grid-template-columns:200px 1fr}
  .chi-companies-redesign.sector-shell.has-compare{grid-template-columns:200px 1fr 230px}
}

@media (max-width:780px){
  .chi-companies-redesign .sector-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
}

@media (max-width:900px){
  .chi-companies-redesign .landing-intro{padding:36px 0 24px}
  .chi-companies-redesign.sector-shell{grid-template-columns:1fr;min-height:0}
  .chi-companies-redesign.sector-shell.has-compare{grid-template-columns:1fr}
  .chi-companies-redesign .sector-rail{
    border-right:0;border-bottom:1px solid var(--line);
    display:flex;align-items:center;gap:12px;padding:14px 18px;flex-wrap:nowrap;
  }
  .chi-companies-redesign .rail-heading,.chi-companies-redesign .rail-list,.chi-companies-redesign .rail-viewall{display:none}
  .chi-companies-redesign .rail-select{
    display:block;flex:1;background:var(--panel);border:1px solid var(--line);color:var(--text);
    font-size:13px;padding:10px 12px;font-family:inherit;
  }
  .chi-companies-redesign .rail-my-companies{width:auto;flex:none;padding:10px 14px}
  .chi-companies-redesign.sector-shell.has-compare .compare-rail{
    border-left:0;border-top:1px solid var(--line);
    position:sticky;bottom:0;background:var(--bg);
    flex-direction:column;padding:10px 16px 14px;gap:8px;
    z-index:30;
  }
  .chi-companies-redesign .compare-heading{display:none}
  .chi-companies-redesign .compare-limit-note{margin:0}
  .chi-companies-redesign #compare-stack{display:flex;gap:10px;overflow-x:auto;padding-bottom:2px}
  .chi-companies-redesign .tombstone{flex:none;width:190px}
  .chi-companies-redesign .compare-cta{width:100%;margin-top:0}
  .chi-companies-redesign .row-sector{display:none !important}
}

@media (max-width:720px){
  .chi-companies-redesign.companies-landing{padding-bottom:32px}
  .chi-companies-redesign .sector-grid{gap:12px}
  .chi-companies-redesign .sector-card{min-height:220px}
  .chi-companies-redesign .sector-card-body{padding:18px;gap:10px}
  .chi-companies-redesign .sector-card-blurb{font-size:12.5px}
  .chi-companies-redesign .landing-stats{flex-direction:column;align-items:flex-start;gap:18px}
  .chi-companies-redesign .company-row{
    grid-template-columns:28px minmax(0,1fr) 74px 26px;
    gap:10px;padding:0 12px;
  }
  .chi-companies-redesign .row-status{display:none}
  .chi-companies-redesign .row-cvi,.chi-companies-redesign .row-cfs{display:none}
  .chi-companies-redesign .row-chi{grid-column:3}
  .chi-companies-redesign .row-star{grid-column:4}
}

@media (max-width:560px){
  .chi-companies-redesign .sector-grid{grid-template-columns:minmax(0,1fr)}
  .chi-companies-redesign .sector-card{aspect-ratio:16/10;min-height:0}
  .chi-companies-redesign .landing-intro{padding:28px 0 20px}
}

/* Very narrow phones: the 16:10 card gets too short for a wrapped title, so
   height comes from a floor instead and the interior tightens a notch. */
@media (max-width:370px){
  .chi-companies-redesign .sector-card{aspect-ratio:auto;min-height:208px}
  .chi-companies-redesign .sector-card-body{padding:16px;gap:8px}
  .chi-companies-redesign .sector-card-foot{margin-top:10px}
}

/* ============================================================
   COMPANIES — Volt hierarchy correction + sector instructions,
   30 Aug 2026.
   ============================================================ */

/* ---- Landing hero: the title takes Volt, the kicker steps back ---- */
.chi-companies-redesign .landing-intro .eyebrow{color:#8f8d88}
.chi-companies-redesign .landing-intro h1{color:var(--acid)}
.chi-companies-redesign .landing-intro h1 span{color:#d5d2cb}

/* ---- Sector heading row: right-aligned instructions, kept secondary ----
   Sits on the same baseline as the sector title on desktop and wraps to
   its own line below the title on narrow screens. The instruction
   describes the implemented behaviour: a single click selects (max two),
   and a click on an already-selected row opens that company's profile.
   ------------------------------------------------------------------- */
.chi-companies-redesign .sector-heading-row{align-items:baseline}
.chi-companies-redesign .sector-howto{
  flex:1 1 260px;min-width:0;margin:0;
  text-align:right;color:var(--muted);
  font-size:11.5px;line-height:1.32;
}
.chi-companies-redesign .sector-howto em{font-style:italic}

@media (max-width:900px){
  .chi-companies-redesign .sector-howto{
    order:3;flex:1 1 100%;text-align:left;margin-top:4px;
  }
}

/* ============================================================
   COMPANIES — SITE-WIDE TYPOGRAPHY + COLOUR HIERARCHY PASS
   30 Aug 2026.

   Normalization only: no layout, grid, imagery, ordering,
   company data or interaction behaviour is changed. Additive
   rules, scoped under .chi-companies-redesign exactly as the
   rest of this file is, sitting last so nothing above had to
   be rewritten.
   ============================================================ */

/* ---- Landing ------------------------------------------------
   TYPE 2  kicker "Explore customer hostility across industries"
   TYPE 1  "Find the friction."      -> Volt
   TYPE 6  "We index the hostility." -> subdued white
   TYPE 5  sector names              -> white
   TYPE 7  the browse control        -> Volt
   ------------------------------------------------------------ */
.chi-companies-redesign .landing-intro .eyebrow{
  color:#8f8d88;font-size:12px;letter-spacing:.18em;
}
.chi-companies-redesign .landing-intro h1{color:var(--acid)}
.chi-companies-redesign .landing-intro h1 span{color:#d5d2cb}

.chi-companies-redesign .sector-card-title{color:#fff}
.chi-companies-redesign .sector-card-blurb{color:#c9c6bf}
.chi-companies-redesign .sector-card-go{color:var(--acid);border-color:var(--acid)}

/* card count: sector-level taxonomy, lifted off metadata size */
.chi-companies-redesign .sector-card-count{font-size:12px;letter-spacing:.08em;color:#b0ada6}
@media (min-width:1081px){
  .chi-companies-redesign .sector-card-count{font-size:12px;letter-spacing:.06em}
}

/* endcap supporting copy */
.chi-companies-redesign .landing-stats-note{font-size:13px;color:#c3c0b9}
.chi-companies-redesign .stat-block span{font-size:12px;letter-spacing:.05em}

/* calculator bridge: kicker recedes, action stays Volt */
.chi-companies-redesign .calculator-bridge .eyebrow{color:#8f8d88;font-size:12px;letter-spacing:.14em}
.chi-companies-redesign .calculator-cta{color:var(--acid)}

/* ---- Sector page --------------------------------------------
   TYPE 1  sector title      -> Volt
   TYPE 9  UX instruction    -> Volt, italic, sized with the
                                sector navigation labels
   TYPE 5  company names     -> white
   status / metrics keep their existing semantic treatment
   ------------------------------------------------------------ */
.chi-companies-redesign .sector-heading-row h1{color:var(--acid)}

.chi-companies-redesign .sector-howto{
  color:var(--acid);
  font-size:13.5px;
  line-height:1.34;
}
.chi-companies-redesign .sector-howto em{font-style:italic}

/* TYPE 8 — rail and tray organisers stay muted, made readable */
.chi-companies-redesign .rail-heading{font-size:12px;letter-spacing:.12em}
.chi-companies-redesign .rail-item{font-size:13.5px}
.chi-companies-redesign .rail-item-count{font-size:12px}
.chi-companies-redesign .rail-viewall{font-size:12px}
.chi-companies-redesign .sector-count{font-size:12px;letter-spacing:.05em}
.chi-companies-redesign .compare-clear{font-size:12px;letter-spacing:.05em}
.chi-companies-redesign .compare-limit-note{font-size:12px}

/* TYPE 5 / TYPE 6 — the row itself */
.chi-companies-redesign .row-name{color:#fff;font-size:14px}
.chi-companies-redesign .row-status-text{font-size:12px}
.chi-companies-redesign .row-mono{font-size:12px}
.chi-companies-redesign .tombstone-name{color:#fff}
.chi-companies-redesign .tombstone-sector{font-size:12px;letter-spacing:.05em}

@media (max-width:900px){
  .chi-companies-redesign .sector-howto{font-size:13px}
}

/* Sector heading row: the instruction sits centred in the open
   span between the sector title and the count/metrics block,
   rather than pushed against the right edge. Desktop only —
   the stacked <=900px arrangement is untouched. Colour, italic
   style and size are unchanged. */
@media (min-width:901px){
  .chi-companies-redesign .sector-howto{text-align:center}
}

/* ============================================================
   COMPANIES LANDING — FINAL POLISH PASS, 30 Aug 2026.
   The search-bar half of this pass was removed on 6 Sep 2026
   (see the hero compression section at the end of this file);
   the headline rule below is what survives. The sector working
   page, the company data and the grid itself are untouched.
   ============================================================ */

/* ---- 1. Search bar: now sits between the headline and the
   sector grid, and adopts the Institutional entrance's input
   component — pill, panel ground, #3a3a3a hairline, Volt
   focus ring, 16px field and a 46px round Volt action.
   ------------------------------------------------------------ */
.chi-companies-redesign .landing-intro{padding:44px 0 22px}
/* ---- 2. Headline: Volt carries only the two key words ---- */
.chi-companies-redesign .landing-intro h1{color:var(--h-title,#f4f1ea)}
.chi-companies-redesign .landing-intro h1 span{color:var(--h-title,#f4f1ea)}
.chi-companies-redesign .landing-intro h1 em{font-style:normal;color:var(--acid)}

/* ============================================================
   COMPANIES — ROW NAME LINE.

   The company name sits in a flex line inside the row's name
   column. Scoped under .chi-companies-redesign, additive only.
   ============================================================ */
.chi-companies-redesign .row-name-line{
  display:flex;align-items:center;gap:8px;min-width:0;
}
.chi-companies-redesign .row-name-line .row-name{min-width:0}

/* ---- keyboard focus ----
   The rows are focusable (tabindex=0); this makes the ring explicit and
   legible instead of leaving it to the browser default. */
.chi-companies-redesign .company-row:focus-visible{
  outline:2px solid var(--acid);outline-offset:2px;
}

@media (max-width:560px){
  .chi-companies-redesign .row-name-line{flex-wrap:wrap;gap:3px 6px}
  .chi-companies-redesign .row-name-line .row-name{flex:1 1 100%}
}

/* ============================================================
   COMPANIES LANDING — HERO COMPRESSION, 6 Sep 2026.

   The sector grid is the discovery mechanism, so the hero above
   it gets out of the way. Three things recover the height: the
   search band is gone from the markup entirely (its rules were
   deleted from this file, not overridden), the headline runs as
   one line on desktop instead of two stacked sentences, and the
   surrounding padding tightens.

   Nothing about the grid or the cards changes — same columns,
   same 252px card, same gap, same hover. This is compression
   and hierarchy, not a new layout.
   ============================================================ */

/* Desktop: one continuous line. The size is chosen so the whole
   sentence clears the 1120px container with room to spare at
   1280 and above, rather than being pushed as large as it will
   go and then wrapping on the first narrow laptop. */
@media (min-width:901px){
  .chi-companies-redesign .landing-intro{padding:26px 0 20px}
  .chi-companies-redesign .landing-intro .eyebrow{margin:0 0 10px}
  .chi-companies-redesign .landing-intro h1{
    font-size:clamp(30px,3.5vw,50px);
    line-height:1.06;
    max-width:none;
    text-wrap:balance;
  }
  .chi-companies-redesign .landing-intro h1 span{display:inline}
}

/* Below that the sentence stacks and wraps as it always did —
   the one-line rule is a desktop affordance, not a size floor. */
@media (max-width:900px){
  .chi-companies-redesign .landing-intro{padding:28px 0 20px}
  .chi-companies-redesign .landing-intro .eyebrow{margin:0 0 12px}
  .chi-companies-redesign .landing-intro h1{max-width:22ch}
  .chi-companies-redesign .landing-intro h1 span{display:block}
}
