/* Home's display type, charcoal surfaces and photo treatment for the main pages. */
body.ei-chapter-page {
  --main-paper: #11171c;
  --main-ink: #f4f4f0;
  --main-muted: #c5ced4;
  --main-rule: #ffffff30;
  --chapter-panel: #192229;
  --chapter-accent: #ff8da3;
  --chapter-display: "EI Display", "Arial Narrow", Arial, sans-serif;
  --chapter-inset: clamp(24px, 7vw, 116px);
  --chapter-fade: linear-gradient(90deg, #11171cf5 3%, #11171cd9 32%, #11171c51 68%, #11171c10),
    linear-gradient(0deg, #11171ce8, #11171c00 66%);
}

.ei-chapter-page main a:focus-visible,
.ei-chapter-page main button:focus-visible,
.ei-chapter-page main summary:focus-visible {
  outline: 2px solid var(--chapter-accent);
  outline-offset: 4px;
}

body.ei-chapter-page.ei-main-page .main-photo-hero[class] {
  align-items: flex-end;
  padding: 140px var(--chapter-inset) clamp(54px, 10vh, 108px);
}

body.ei-chapter-page.ei-main-page .main-photo-hero[class]::before {
  background: var(--chapter-fade), linear-gradient(180deg, #11171c82, transparent 26%);
}

body.ei-chapter-page.ei-main-page .main-photo-hero[class] .main-photo-copy {
  max-width: 1320px;
}

body.ei-chapter-page.ei-main-page .main-photo-hero[class] .main-photo-copy h1 {
  max-width: min(12ch, 100%);
  font: 600 clamp(62px, 8.1vw, 122px)/.94 var(--chapter-display);
  letter-spacing: -.008em;
  text-transform: uppercase;
  text-wrap: wrap;
}

body.ei-chapter-page.ei-main-page .supply-main .main-photo-hero[class] .main-photo-copy h1 {
  max-width: min(16ch, 100%);
  text-wrap: balance;
}

body.ei-chapter-page.ei-main-page .main-photo-hero[class] .main-photo-lead {
  max-width: 54ch;
  margin-top: 18px;
  color: var(--main-muted);
  font-size: clamp(16px, 1.35vw, 20px);
  line-height: 1.52;
}

body.ei-chapter-page.ei-main-page .main-photo-hero[class] .main-photo-kicker,
.ei-chapter-page .specialty-panel .panel-index,
.ei-chapter-page .supply-main .supply-kicker,
.ei-chapter-page .start-conversation .chapter-label {
  display: flex;
  align-items: center;
  gap: 12px;
  margin: 0 0 16px;
  color: #f4f4f0;
  font: 600 12px/1.45 "IBM Plex Mono", monospace;
  letter-spacing: .12em;
  text-transform: uppercase;
}

.ei-chapter-page :is(.main-photo-kicker, .panel-index, .supply-kicker, .chapter-label)::before {
  content: "";
  flex: 0 0 24px;
  height: 2px;
  background: #e33152;
}

body.ei-chapter-page.ei-main-page .main-photo-hero[class] .main-photo-actions {
  margin-top: 22px;
}

.ei-chapter-page :is(.crumb, .specialty-index) {
  background: #151d23;
  border-color: var(--main-rule);
}

.ei-chapter-page :is(.crumb, .supply-crumb) :is(a, span) { color: var(--main-muted); }
.ei-chapter-page :is(.crumb, .supply-crumb) a:hover { color: #fff; }
html.ei-chapter-scroll:has(.specialties-main) { scroll-padding-top: 0; }
.ei-chapter-page :is(#specialty-index, #rig-page-nav) { scroll-margin-top: 104px; }

.ei-chapter-page .body:not(.main-photo-hero) {
  padding-block: clamp(40px, 6vw, 80px);
}

.ei-chapter-page .body h2.sec,
.ei-chapter-page :is(.ctaband, .start-conversation, .supply-section-heading, .supply-contact) h2 {
  color: var(--main-ink);
  font: 600 clamp(38px, 4.4vw, 72px)/.99 var(--chapter-display);
  letter-spacing: .005em;
  text-transform: uppercase;
}

.ei-chapter-page .body :is(p, li),
.ei-chapter-page .body :is(.pair, .cutbox, .faq .a, .card .d, .main-contact-details) {
  color: var(--main-muted);
}

.ei-chapter-page .body :is(.pair, .cutbox, .card) {
  background: var(--chapter-panel);
  border-color: var(--main-rule);
  border-radius: 0;
}

.ei-chapter-page .body :is(.pair, .cutbox) { border-inline-start-color: #e33152; }
.ei-chapter-page .body a,
.ei-chapter-page .body .card :is(.pn, .go) { color: var(--chapter-accent); }
.ei-chapter-page .body :is(.card h3, .cutbox .big, .faq summary) { color: var(--main-ink); }
.ei-chapter-page .body .faq details { border-color: var(--main-rule); }
.ei-chapter-page .body :is(.btn-red, .btn-dark) { color: #fff; }
.ei-chapter-page .body .faq summary::after { color: var(--chapter-accent); }
.ei-chapter-page .main-contact-details > div { padding-block-start: 20px; border-top: 1px solid var(--main-rule); }

.ei-chapter-page :is(.ctaband, .start-conversation, .supply-contact) {
  background: var(--chapter-panel);
  border-block-start: 1px solid var(--main-rule);
}

.ei-chapter-page .ctaband h2 { max-width: 20ch; }
.ei-chapter-page .ctaband .btn-dark { flex-shrink: 0; }
.ei-chapter-page .body h2.sec:not(#capability-directory) { font-size: clamp(34px, 3.6vw, 56px); }

/* Lower-left copy sits over the photo on narrative chapters. */
.ei-chapter-page :is(.specialty-stage, .supply-systems, .capabilities-close, .rig-system-scene) {
  position: relative;
  isolation: isolate;
  display: grid;
  align-items: end;
  min-height: 100svh;
  padding: 130px 0 clamp(54px, 8vh, 88px);
  border-block-end: 1px solid var(--main-rule);
}

.ei-chapter-page :is(.specialty-stage, .supply-systems, .capabilities-close, .rig-system-scene)::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -1;
  background: var(--chapter-fade);
  pointer-events: none;
}

.ei-chapter-page :is(.main-section-photo, .systems-photo, .capabilities-close .main-photo-media) {
  position: absolute;
  inset: 0;
  z-index: -2;
  width: 100%;
  height: 100%;
}

.ei-chapter-page :is(.main-section-photo, .systems-photo) img {
  height: 100%;
  width: 100%;
  object-fit: cover;
  object-position: var(--chapter-photo-position, 55% 50%);
}

.ei-chapter-page main :is(.stage-layout, .systems-grid, .capabilities-close > .wrap) {
  display: block;
  max-width: 1552px;
  padding-inline: var(--chapter-inset);
}

.ei-chapter-page :is(.specialty-panel, .systems-copy) {
  width: 100%;
  max-width: 590px;
}

.ei-chapter-page :is(.specialty-panel, .systems-copy) h2,
.ei-chapter-page .capabilities-close h2 {
  max-width: 13ch;
  margin: 0 0 16px;
  color: #fff;
  font: 600 clamp(51px, 6.6vw, 105px)/.95 var(--chapter-display);
  letter-spacing: -.008em;
  text-transform: uppercase;
}

.ei-chapter-page .specialty-panel p:not(.panel-index),
.ei-chapter-page .specialty-points li { color: var(--main-muted); }
.ei-chapter-page .specialty-points { margin-block: 16px; border-color: var(--main-rule); }
.ei-chapter-page .specialty-points li { padding-block: 6px; border-color: var(--main-rule); }
.ei-chapter-page .panel-link { color: #fff; border-color: #ffffff94; }
.ei-chapter-page .panel-link:hover { color: var(--chapter-accent); border-color: currentColor; }
.ei-chapter-page .main-identification-note {
  color: var(--main-muted);
  background: var(--chapter-panel);
  border-color: var(--main-rule);
}
.ei-chapter-page .main-identification-note h2 { color: var(--main-ink); }
.ei-chapter-page .specialty-stage#legacy { --chapter-photo-position: 69% 46%; }
.ei-chapter-page .specialty-stage#scr-dc { --chapter-photo-position: 63% 45%; }

/* Keep the supply finder and catalogs on the same dark canvas. */
.ei-chapter-page .supply-main { --hairline: var(--main-rule); --muted: var(--main-muted); }
.ei-chapter-page .supply-main :is(.finder-input, .finder-results) {
  background: var(--chapter-panel);
  border-color: var(--main-rule);
  color: var(--main-ink);
  color-scheme: dark;
}
.ei-chapter-page .finder-input input { color: var(--main-ink); }
.ei-chapter-page .finder-input input::placeholder { color: var(--main-muted); }
.ei-chapter-page .finder-input:focus-within { border-color: var(--chapter-accent); }
.ei-chapter-page .supply-main :is(.finder-input svg, .finder-clear, .finder-status, .supply-jump a span) { color: var(--main-muted); }
.ei-chapter-page .supply-main .finder-results .finder-rfq { background: var(--main-paper); color: var(--chapter-accent); }
.ei-chapter-page .supply-main :is(.finder-results a, .supply-jump a, .supply-family, .supply-drive-card, .supply-electrical-grid > a) {
  color: var(--main-ink);
  border-color: var(--main-rule);
}
.ei-chapter-page .supply-main :is(.finder-results a:hover, .finder-results a:focus-visible, .supply-family:hover, .supply-drive-card:hover, .supply-electrical-grid > a:hover) {
  background: #ffffff0d;
}
.ei-chapter-page .supply-main :is(.finder-copy p, .supply-section-heading > p, .family-overline, .family-body > p:not(.family-overline), .family-tags, .supply-drive-card > p, .supply-brand-links > span, .supply-electrical-grid p) {
  color: var(--main-muted);
}
.ei-chapter-page .supply-main :is(.family-number, .family-arrow, .drive-label, .supply-jump a:hover, .supply-jump a:hover span, .supply-electrical-grid > a > span, .supply-brand-links a, .supply-card-link, .supply-directory-foot a, .supply-text-link:hover) {
  color: var(--chapter-accent);
}
.ei-chapter-page .supply-main :is(.supply-directory-foot, .supply-card-link) { border-color: var(--main-rule); }
.ei-chapter-page .supply-main .supply-electrical { background: var(--chapter-panel); }
.ei-chapter-page .supply-main .supply-systems { background: var(--main-paper); }
.ei-chapter-page .supply-systems .systems-photo { --chapter-photo-position: 62% 49%; }

/* The capabilities directory links the whole row, including its title. */
.ei-chapter-page .capability-list {
  display: grid;
  padding: 0;
  margin: 0 0 clamp(36px, 5vw, 64px);
  list-style: none;
  border-top: 1px solid var(--main-rule);
}
.ei-chapter-page .capability-list li { border-bottom: 1px solid var(--main-rule); }
.ei-chapter-page .capability-list a {
  display: grid;
  grid-template-columns: minmax(0, .8fr) minmax(0, 1fr) 24px;
  gap: clamp(16px, 4vw, 48px);
  align-items: center;
  padding-block: 20px;
  color: var(--main-muted);
  text-decoration: none;
}
.ei-chapter-page .capability-list :is(strong, .chapter-arrow) { color: var(--main-ink); }
.ei-chapter-page .capability-list strong { font-size: 20px; line-height: 1.3; }
.ei-chapter-page .capability-list a:hover :is(strong, .chapter-arrow) { color: var(--chapter-accent); }
.ei-chapter-page #capability-directory { scroll-margin-top: 120px; }
.ei-chapter-page .capability-related { margin-top: 28px; }
.ei-chapter-page .capability-related a { color: var(--main-ink); }
.ei-chapter-page .capabilities-close {
  min-height: min(100svh, 820px);
  --main-photo-position: 66% 43%;
}
.ei-chapter-page .capabilities-close p { color: var(--main-muted); margin: 0 0 24px; max-width: 48ch; }

/* Specialty pages share the same photo opening and quieter equipment guides. */
body.ei-specialty-detail.ei-main-page .main-photo-hero[class] .main-photo-copy h1 {
  max-width: min(18ch, 100%);
  font-size: clamp(64px, 7.6vw, 114px);
  text-wrap: balance;
}

.ei-specialty-detail :is(.desktop-nav, #menu-dialog nav) a[aria-current="location"] {
  text-decoration: underline;
  text-underline-offset: 8px;
  text-decoration-thickness: 2px;
}

.ei-specialty-detail .body .sec[id] { scroll-margin-top: 120px; }
.ei-specialty-detail .body .tablewrap { overflow: visible; }
.ei-specialty-detail .body :is(.tbl, .spec) {
  min-width: 0;
  width: 100%;
  border-collapse: collapse;
  background: transparent;
}
.ei-specialty-detail .body :is(.tbl, .spec) :is(th, td) {
  background: transparent;
  color: var(--main-muted);
  border: 0;
  border-bottom: 1px solid var(--main-rule);
  text-align: left;
  vertical-align: top;
}
.ei-specialty-detail .body :is(.tbl, .spec) tr > :first-child { width: 34%; color: var(--main-ink); }
.ei-specialty-detail .body .tbl thead th { color: var(--main-muted); }
.ei-specialty-detail .body .tbl tbody th { font: 600 16px/1.55 "IBM Plex Sans", Arial, sans-serif; }
.ei-specialty-detail .body .tbl tbody th a { display: inline-flex; align-items: center; gap: 8px; }
.ei-specialty-detail .body .tbl tbody th .ei-ui-icon { width: 14px; height: 14px; flex-shrink: 0; }

.ei-specialty-detail .specialty-related {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0 clamp(18px, 4vw, 48px);
  margin: 0;
  padding: 0;
  list-style: none;
}
.ei-specialty-detail .specialty-related li { border-top: 1px solid var(--main-rule); }
.ei-specialty-detail .specialty-related a { display: block; padding-block: 10px; color: var(--main-ink); }
.ei-specialty-detail .specialty-related a:hover { color: var(--chapter-accent); }
.ei-specialty-detail .specialty-request .main-photo-actions { margin-top: 0; }

/* The rig directory keeps systems, individual parts, and exact-number lookup distinct. */
.ei-specialty-detail .supply-detail,
.ei-specialty-detail .supply-detail :is(.sd-standard, .ei-buyer-faq) {
  background: var(--main-paper);
  color: var(--main-ink);
}
.ei-specialty-detail .supply-detail :is(.crumb, .sd-nav) {
  background: #151d23;
  border-color: var(--main-rule);
}
.ei-specialty-detail .sd-nav .wrap { gap: 0 28px; padding-block: 8px; }
.ei-specialty-detail .sd-nav a {
  display: inline-flex;
  align-items: center;
  min-height: 44px;
  color: var(--main-muted);
  font-size: 15px;
}
.ei-specialty-detail .sd-nav a:hover { color: #fff; }
.ei-specialty-detail .sd-section:not(.rig-system-scene) {
  padding-block: clamp(45px, 6vw, 90px);
  border-color: var(--main-rule);
}
.ei-specialty-detail .sd-section-grid { grid-template-columns: minmax(0, .9fr) minmax(0, 1.5fr); }
.ei-specialty-detail .supply-detail :is(.sd-section h2, .sd-rfq h2, .ei-buyer-faq h2) {
  margin-block: 12px 16px;
  color: var(--main-ink);
  font: 600 clamp(40px, 4.5vw, 68px)/.98 var(--chapter-display);
  letter-spacing: 0;
  text-transform: uppercase;
}
.ei-specialty-detail .sd-section .sd-kicker { color: var(--chapter-accent); }
.ei-specialty-detail .sd-section-intro { font-size: 16px; }
.ei-specialty-detail .supply-detail :is(.sd-section-intro, .sd-card p, .sd-note, .sd-standard, .ei-buyer-faq p) { color: var(--main-muted); }
.ei-specialty-detail .sd-grid { gap: 0 26px; }
.ei-specialty-detail .supply-detail .sd-card {
  padding: 18px 0;
  background: transparent;
  border: 0;
  border-top: 1px solid var(--main-rule);
}
.ei-specialty-detail .supply-detail a.sd-card:hover {
  border-color: var(--chapter-accent);
  box-shadow: none;
}
.ei-specialty-detail .sd-card h3 { color: var(--main-ink); }
.ei-specialty-detail .supply-detail .sd-card-link { color: var(--chapter-accent); }
.ei-specialty-detail .supply-detail :is(.sd-note, .sd-part-index, .sd-compact-links a) { background: var(--chapter-panel); }
.ei-specialty-detail .supply-detail :is(.sd-part-index, .sd-part-index[open] summary, .sd-index-links a, .sd-compact-links a, .ei-buyer-faq, .ei-buyer-faq details) {
  border-color: var(--main-rule);
}
.ei-specialty-detail .sd-note strong { color: var(--main-ink); }
.ei-specialty-detail .sd-part-index summary { min-height: 44px; }
.ei-specialty-detail .sd-index-links a { font-size: 14px; }
.ei-specialty-detail .supply-detail :is(.sd-index-links a:hover, .sd-compact-links a:hover) { color: var(--chapter-accent); }
.ei-specialty-detail .sd-compact-links a { display: inline-flex; align-items: center; min-height: 44px; }

.ei-specialty-detail .supply-detail .rig-system-scene { --main-photo-position: 61% 47%; border-color: var(--main-rule); }
.ei-specialty-detail .rig-system-scene .main-photo-media { z-index: -2; }
.ei-specialty-detail .rig-system-scene .sd-section-grid {
  display: block;
  max-width: 1552px;
  padding-inline: var(--chapter-inset);
}
.ei-specialty-detail .supply-detail .rig-system-scene h2 {
  max-width: 16ch;
  font-size: clamp(52px, 6.6vw, 96px);
}
.ei-specialty-detail .rig-system-scene .sd-section-intro { max-width: 53ch; }
.ei-specialty-detail .rig-system-scene .sd-grid { max-width: 690px; margin-top: 26px; }
.ei-specialty-detail .supply-detail .rig-system-scene .sd-card {
  padding: 16px;
  background: #11171ce6;
}
.ei-specialty-detail .supply-detail .sd-standard { padding-block: 24px; }
.ei-specialty-detail .sd-standard .wrap {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 20px;
  align-items: center;
}
.ei-specialty-detail .sd-standard p { font-size: 15px; max-width: 67ch; }
.ei-specialty-detail .sd-standard .oilfield-seal-motion { width: 116px; }
.ei-specialty-detail .sd-standard .seal-motion-control {
  right: -5px;
  bottom: -3px;
  width: 44px;
  height: 44px;
  background: #f4f6f8;
  font-size: 11px;
}
.ei-specialty-detail .sd-standard .seal-motion-control:hover { background: #fff; }
.ei-specialty-detail .supply-detail .ei-buyer-faq { padding-block: clamp(36px, 5vw, 66px); }
.ei-specialty-detail .ei-buyer-faq details {
  max-width: 920px;
  border-top: 1px solid var(--main-rule);
}
.ei-specialty-detail .ei-buyer-faq summary { padding-block: 14px; cursor: pointer; font-weight: 600; }
.ei-specialty-detail .ei-buyer-faq details > p { padding: 0 0 18px 18px; }
.ei-specialty-detail .supply-detail .sd-rfq { background: var(--chapter-panel); border-top: 1px solid var(--main-rule); }

/* Short introductions put high-intent actions and request fields within reach. */
body.ei-chapter-utility.ei-main-page .main-photo-hero[class] {
  min-height: 58svh;
  padding-block: 140px 42px;
}
body.ei-chapter-utility.ei-main-page .main-photo-hero[class] .main-photo-copy h1 {
  font-size: clamp(47px, 6.3vw, 94px);
  max-width: min(16ch, 100%);
}
body.ei-chapter-form.ei-main-page .main-photo-hero[class] { min-height: 0; padding-block: 130px 36px; }
body.ei-chapter-form.ei-main-page .main-photo-hero[class] .main-photo-copy h1 { font-size: clamp(44px, 5.4vw, 80px); }
.ei-chapter-form .body:not(.main-photo-hero) { padding-top: clamp(25px, 3.6vw, 48px); }
.ei-chapter-form .formcard {
  color: #1f272e;
  background: #f5f3ee;
  border-radius: 0;
}
.ei-chapter-form .formcard :is(p, li) { color: #40505b; }
.ei-chapter-form .formcard :is(a, input:focus-visible, textarea:focus-visible, select:focus-visible) { --chapter-accent: #a6102c; }
.ei-chapter-form .body .formcard a { color: #a6102c; }
.ei-chapter-form .body :is(#rfq-reqnote, #inventory-reqnote) { color: var(--main-muted); }
.ei-chapter-form .body :is(#rfq-reqnote, #inventory-reqnote) span { color: var(--chapter-accent); }

@media (min-width: 961px) and (min-height: 650px) and (prefers-reduced-motion: no-preference) {
  html.ei-chapter-scroll:not(.motion-off) { scroll-snap-type: y proximity; }
  .ei-chapter-scroll .ei-chapter-page :is(.main-photo-hero, .specialty-stage, .supply-systems, .capabilities-close, .rig-system-scene) {
    scroll-snap-align: start;
    scroll-margin-top: 0;
  }
  .ei-chapter-page :is(#specialty-index, #rig-page-nav) { scroll-snap-align: start; }
}

@media (max-width: 700px) {
  body.ei-chapter-page {
    --chapter-fade: linear-gradient(0deg, #11171cf5 1%, #11171cde 26%, #11171c82 63%, #11171c19),
      linear-gradient(90deg, #11171c60, transparent);
  }
  body.ei-chapter-page.ei-main-page .main-photo-hero[class] { padding-block: 115px 40px; }
  body.ei-chapter-page.ei-main-page .main-photo-hero[class] .main-photo-copy h1 { font-size: clamp(44px, 12.4vw, 74px); }
  body.ei-chapter-page.ei-main-page .main-photo-hero[class] .main-photo-kicker { margin-bottom: 12px; }
  body.ei-chapter-form.ei-main-page .main-photo-hero[class] { padding-block: 111px 29px; }
  .ei-chapter-page :is(#specialty-index, #rig-page-nav) { scroll-margin-top: 90px; }
  .ei-chapter-page :is(.specialty-stage, .supply-systems, .capabilities-close, .rig-system-scene) {
    min-height: min(100svh, 850px);
    padding-block: 110px 38px;
  }
  .ei-chapter-page :is(.specialty-panel, .systems-copy, .capabilities-close) h2 { font-size: clamp(43px, 10.7vw, 68px); }
  .ei-chapter-page .specialty-panel p:not(.panel-index) { font-size: 16px; line-height: 1.5; }
  .ei-chapter-page .specialty-points li { font-size: 15px; }
  .ei-chapter-page .capability-list a { grid-template-columns: minmax(0, 1fr) 20px; gap: 5px 14px; }
  .ei-chapter-page .capability-list .chapter-arrow { grid-column: 2; grid-row: 1 / 3; }
  .ei-chapter-page .capability-list strong { font-size: 18px; }
  body.ei-specialty-detail.ei-main-page .main-photo-hero[class] .main-photo-copy h1 { font-size: clamp(40px, 11.2vw, 68px); }
  .ei-specialty-detail .supply-detail .sd-section-grid,
  .ei-specialty-detail .specialty-related { grid-template-columns: minmax(0, 1fr); }
  .ei-specialty-detail .supply-detail .rig-system-scene h2 { font-size: clamp(42px, 10vw, 66px); }
  .ei-specialty-detail .body :is(.tbl, .spec) :is(th, td) { padding: 11px 8px; font-size: 14px; }
  .ei-specialty-detail .body .tbl tbody th { font-size: 14px; }
  .ei-specialty-detail .sd-standard .oilfield-seal-motion { width: 96px; }
}

@media (max-height: 750px) and (min-width: 701px) {
  body.ei-chapter-page.ei-main-page .main-photo-hero[class] { padding-bottom: 46px; }
  .ei-chapter-page :is(.specialty-stage, .supply-systems, .capabilities-close, .rig-system-scene) { padding-block: 122px 44px; }
}